/* Experiences page styles (lean, leveraging base.css) */

/* Hero */
.hero-exp {
  background: radial-gradient(1200px 600px at 10% 0%, color-mix(in oklab, var(--color-primary) 18%, transparent), transparent),
              radial-gradient(1200px 600px at 90% 10%, color-mix(in oklab, var(--color-warning) 14%, transparent), transparent);
  padding-block: var(--space-16);
}
.hero-inner { display: grid; grid-template-columns: 1.15fr 1fr; gap: var(--space-8); align-items: center; }
.hero-copy p { color: var(--color-muted); max-width: 60ch; }
.hero-actions { display: flex; gap: var(--space-3); margin-top: var(--space-4); flex-wrap: wrap; }
.hero-media { aspect-ratio: 16 / 9; border-radius: var(--radius-xl); overflow: hidden; box-shadow: var(--shadow-xl); }

/* Features */
.features-grid .card figure { margin-bottom: var(--space-4); border-radius: var(--radius-lg); overflow: hidden; box-shadow: var(--shadow-md); }
.feature-list { display: grid; gap: var(--space-2); color: var(--color-muted); list-style: none; padding: 0; }
.feature-list i { color: var(--color-primary); margin-right: var(--space-2); }

/* Themes showcase */
.section-themes { background: color-mix(in oklab, var(--color-primary) 3%, transparent); }
.themes-grid { display: flex; flex-wrap: wrap; gap: var(--space-3); margin-top: var(--space-3); }
.theme-chip {
  display: inline-flex; align-items: center; gap: var(--space-2);
  padding: 8px 12px; border-radius: var(--radius-full);
  background: var(--color-surface); border: 1px solid var(--gray-200);
  box-shadow: var(--shadow-sm);
}

/* Visual stories */
.section-visual .visual-fig { margin-top: var(--space-4); border-radius: var(--radius-xl); overflow: hidden; box-shadow: var(--shadow-lg); }
.visual-wrap p { color: var(--color-muted); }

/* Booking section */
.section-booking { background: color-mix(in oklab, var(--color-success) 6%, transparent); }
.booking-inner { display: grid; grid-template-columns: 1fr; gap: var(--space-6); }
.booking-copy p { color: var(--color-muted); }

/* Availability */
.section-availability { background: var(--color-surface); }
.availability-form { margin-top: var(--space-4); }
.form-row { display: grid; gap: var(--space-4); grid-template-columns: repeat(5, minmax(0, 1fr)); align-items: end; }
.form-field { display: grid; gap: 8px; }
.form-actions { display: flex; gap: var(--space-3); }
.form-hint { color: var(--gray-600); margin-top: var(--space-3); }
.availability-result { margin-top: var(--space-4); padding: var(--space-4); border-radius: var(--radius-lg); border: 1px solid var(--gray-200); background: var(--gray-50); box-shadow: var(--shadow-sm); }
.after-availability { margin-top: var(--space-4); }

/* Two-column promo */
.responsive-cols { grid-template-columns: repeat(2, minmax(0, 1fr)); }

/* Responsive */
@media (max-width: 960px) {
  .hero-inner { grid-template-columns: 1fr; }
  .responsive-cols { grid-template-columns: 1fr; }
  .form-row { grid-template-columns: 1fr; }
  .hero-media { aspect-ratio: 16 / 10; }
}