:root {
  --display: "Cormorant Garamond", "Playfair Display", Georgia, serif;
  --body: Montserrat, Inter, sans-serif;
  --radius: 0px;
  --container: min(1360px, calc(100vw - 64px));
}
.site-header {
  background: linear-gradient(180deg, color-mix(in srgb, var(--bg) 96%, transparent), transparent);
  backdrop-filter: none;
}
.site-header.scrolled {
  background: color-mix(in srgb, var(--bg) 92%, transparent);
  backdrop-filter: blur(18px);
}
.brand {
  letter-spacing: 0.17em;
  text-transform: uppercase;
}
.hero {
  min-height: 100vh;
  align-items: center;
  text-align: center;
  padding-block: 150px 100px;
}
.hero::before {
  background:
    radial-gradient(
      circle at 50% 43%,
      transparent 0 20%,
      color-mix(in srgb, var(--bg) 30%, transparent) 55%,
      color-mix(in srgb, var(--bg) 90%, transparent)
    ),
    linear-gradient(180deg, color-mix(in srgb, var(--bg) 18%, transparent), color-mix(in srgb, var(--bg) 86%, transparent));
}
.hero-copy {
  margin: auto;
  max-width: 1120px;
}
.hero h1 {
  margin: auto;
  max-width: 1100px;
  text-transform: uppercase;
  font-size: clamp(4rem, 7.8vw, 8rem);
  line-height: 0.84;
  letter-spacing: 0.015em;
}
.hero .lead {
  margin: 34px auto;
  max-width: 650px;
}
.hero-actions {
  justify-content: center;
}
.booking-strip {
  margin-top: -54px;
  background: color-mix(in srgb, var(--surface) 92%, transparent);
  border-color: color-mix(in srgb, var(--accent) 35%, var(--line));
}
.section {
  padding: 130px 0;
  border-color: color-mix(in srgb, var(--line) 72%, transparent);
}
.section-head {
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}
.section-head h2,
.page-section h2 {
  font-size: clamp(2.2rem, 5.4vw, 5.8rem);
  letter-spacing: -0.02em;
}
.section-head p {
  margin-inline: auto;
}
.pathway-grid {
  border: 0;
  gap: 1px;
  background: var(--line);
}
.pathway {
  min-height: 330px;
  text-align: center;
  border: 0;
  background: var(--bg);
}
.pathway h3 {
  margin-top: 75px;
  font-size: 2.4rem;
}
.layout-image-route .pathway:nth-child(even) {
  background: var(--surface);
}
.layout-compact-band .pathway {
  min-height: 220px;
}
.layout-compact-band .pathway h3 {
  margin-top: 38px;
}
.split {
  min-height: 760px;
}
.split-media {
  min-height: 760px;
}
.split-copy {
  text-align: center;
  align-items: center;
  padding: clamp(70px, 8vw, 140px);
}
.split-copy h2 {
  font-size: clamp(2.5rem, 5.6vw, 6.3rem);
}
.preview-grid {
  grid-template-columns: 1fr;
  gap: 0;
}
.preview-media {
  min-height: 680px;
}
.preview-copy {
  position: relative;
  z-index: 2;
  width: min(760px, calc(100% - 48px));
  margin: -130px auto 0;
  padding: 60px;
  text-align: center;
  background: var(--surface);
  border: 1px solid var(--line);
}
.preview-copy .section-head {
  text-align: center;
}
.layout-poster {
  min-height: 880px;
  text-align: center;
}
.layout-poster::before {
  background: linear-gradient(180deg, color-mix(in srgb, var(--bg) 18%, transparent), color-mix(in srgb, var(--bg) 90%, transparent));
}
.layout-poster .container {
  margin-inline: auto;
}
.layout-poster p {
  margin-inline: auto;
}
.cards {
  gap: 1px;
  background: var(--line);
}
.card {
  border: 0;
  background: var(--bg);
  text-align: center;
}
.image-cards .card {
  background: var(--surface);
}
.module-section {
  background: color-mix(in srgb, var(--surface) 42%, var(--bg));
}
.module-band {
  align-items: center;
}
.layout-feature-band .section-head {
  text-align: left;
  margin-left: 0;
}
.gallery-grid {
  gap: 4px;
  grid-template-rows: 340px 340px;
}
.gallery-grid figure {
  position: relative;
}
.feature-list > div,
.feature-list > a {
  text-align: center;
}
.final-cta {
  padding-block: 140px;
}
.page-hero {
  min-height: 74vh;
  text-align: center;
}
.page-hero::before {
  background: linear-gradient(180deg, color-mix(in srgb, var(--bg) 25%, transparent), color-mix(in srgb, var(--bg) 92%, transparent));
}
.page-hero .container {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.page-hero .lead {
  margin-left: auto;
  margin-right: auto;
}
.page-section {
  padding: 110px 0;
}
.footer-grid {
  text-align: center;
}
.footer-brand p {
  margin-inline: auto;
}
@media (max-width: 980px) {
  :root {
    --container: min(calc(100% - 40px), 1360px);
  }
  .hero h1 {
    font-size: clamp(3.4rem, 10vw, 6rem);
  }
  .split,
  .split-media {
    min-height: 560px;
  }
  .preview-media {
    min-height: 520px;
  }
  .gallery-grid {
    grid-template-rows: 280px 240px;
  }
  .module-band {
    grid-template-columns: 1fr;
  }
  .layout-feature-band .section-head {
    text-align: center;
    margin-inline: auto;
  }
}
@media (max-width: 640px) {
  :root {
    --container: calc(100vw - 32px);
  }
  .hero {
    min-height: 78vh;
    padding-block: 120px 70px;
  }
  .hero h1 {
    max-width: 100%;
    font-size: clamp(2.45rem, 11.5vw, 3.7rem);
    overflow-wrap: anywhere;
  }
  .hero .lead {
    max-width: 100%;
  }
  .section {
    padding: 82px 0;
  }
  .pathway-grid {
    grid-template-columns: 1fr;
  }
  .pathway {
    min-height: auto;
    text-align: left;
  }
  .pathway h3 {
    margin-top: 28px;
  }
  .split,
  .split-media {
    min-height: 360px;
  }
  .split-copy {
    text-align: left;
    align-items: flex-start;
    padding: 54px 24px;
  }
  .preview-media {
    min-height: 360px;
  }
  .preview-copy {
    width: calc(100% - 24px);
    margin: -54px auto 0;
    padding: 38px 22px;
    text-align: left;
  }
  .preview-copy .section-head {
    text-align: left;
  }
  .layout-poster {
    min-height: 620px;
    text-align: left;
  }
  .layout-poster p {
    margin-left: 0;
  }
  .card {
    text-align: left;
  }
  .gallery-grid {
    grid-template-rows: 250px 190px 190px;
  }
  .footer-grid {
    text-align: left;
  }
  .footer-brand p {
    margin-inline: 0;
  }
}

/* Availability form — gallery-style glass reservation panel. */
.booking-strip {
  width: min(1260px, calc(100vw - 64px));
  margin-top: -64px;
  border: 1px solid color-mix(in srgb, var(--accent) 46%, var(--line));
  background: color-mix(in srgb, var(--surface) 88%, transparent);
  box-shadow: 0 32px 90px rgba(0, 0, 0, 0.28);
  backdrop-filter: blur(22px);
}
.booking-field {
  padding: 23px 26px;
  text-align: left;
}
.booking-field label {
  color: var(--accent);
  letter-spacing: 0.16em;
}
.booking-field input,
.booking-field select {
  font-family: var(--display);
  font-size: 1.08rem;
  font-weight: 500;
}
.booking-submit {
  min-width: 220px;
}
@media (max-width: 980px) {
  .booking-strip {
    width: calc(100vw - 40px);
    margin-top: 0;
  }
  .booking-field {
    padding: 20px 24px;
  }
}
@media (max-width: 640px) {
  .booking-strip {
    width: 100%;
    border-inline: 0;
  }
  .booking-field {
    padding: 15px 20px;
  }
  .booking-field input,
  .booking-field select {
    font-size: 1rem;
  }
}