:root {
  --bg:#f4f6f8;
  --paper:#ffffff;
  --ink:#17181b;
  --ink-soft:#555b63;
  --line:#d7dce2;
  --dark:#515257;
  --dark-2:#2d2f33;
  --cyan:#11b8ef;
  --yellow:#ffe500;
  --shadow:0 20px 60px rgba(12,18,24,.08);
  --radius:22px;
  --max:1180px;
  --top-hero-height:320px
}
* {
  box-sizing:border-box
}
[hidden] {
  display:none !important
}
html {
  scroll-behavior:smooth
}
body {
  margin:0;
  color:var(--ink);
  background:linear-gradient(180deg,#eef2f5 0%,#f8fafb 240px,#f5f7f9 100%);
  font:16px/1.65 Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif
}
img {
  max-width:100%;
  display:block
}
a {
  color:inherit;
  text-decoration:none
}
.container {
  width:min(var(--max),calc(100% - 2rem));
  margin-inline:auto
}
.site-header {
  position:sticky;
  top:0;
  z-index:20;
  background:rgba(255,255,255,.86);
  backdrop-filter:blur(18px);
  border-bottom:1px solid rgba(23,24,27,.08)
}
.navbar {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1.2rem;
  min-height:76px
}
.brand {
  display:flex;
  align-items:center;
  gap:.9rem;
  font-weight:800;
  letter-spacing:.04em
}
.brand-mark {
  width:72px;
  color:var(--dark-2)
}
.brand-text span {
  display:block;
  font-size:.75rem;
  color:var(--ink-soft);
  font-weight:600;
  letter-spacing:.14em;
  text-transform:uppercase
}
.main-nav {
  display:flex;
  gap:1.2rem;
  flex-wrap:wrap;
  align-items:center
}
.main-nav a {
  font-weight:700;
  color:#21242a;
  font-size:.96rem
}
.main-nav a:hover {
  color:#000
}
.main-nav a.is-active {
  color:#000;
  text-decoration:underline;
  text-underline-offset:.25em;
}
.nav-cta {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:.8rem 1.15rem;
  border-radius:999px;
  border:0;
  background:var(--dark-2);
  color:#fff !important;
  font:inherit;
  font-weight:800;
  cursor:pointer
}
.nav-dropdown-toggle,.profile-menu-toggle {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:.8rem 1.15rem;
  border-radius:999px;
  border:1px solid rgba(17,24,39,.12);
  background:#fff;
  color:#17181b;
  font:inherit;
  font-weight:800;
  cursor:pointer
}
.nav-dropdown,.profile-menu {
  position:relative
}
.nav-dropdown-panel,.profile-menu-panel {
  position:absolute;
  top:calc(100% + .55rem);
  right:0;
  min-width:220px;
  padding:.5rem;
  border-radius:18px;
  background:#fff;
  border:1px solid rgba(17,24,39,.08);
  box-shadow:var(--shadow);
  display:grid;
  gap:.15rem
}
.nav-dropdown-panel a,.nav-dropdown-panel button,.profile-menu-panel a,.profile-menu-panel button {
  display:flex;
  align-items:center;
  justify-content:flex-start;
  width:100%;
  padding:.78rem .9rem;
  border-radius:12px;
  border:0;
  background:transparent;
  color:#17181b;
  font:inherit;
  font-weight:700;
  cursor:pointer
}
.nav-dropdown-panel a:hover,.nav-dropdown-panel button:hover,.profile-menu-panel a:hover,.profile-menu-panel button:hover {
  background:#f5f8fb
}
.auth-modal {
  position:fixed;
  inset:0;
  z-index:80;
  display:grid;
  place-items:center;
  padding:1rem
}
.auth-modal[hidden] {
  display:none !important
}
.auth-modal-backdrop {
  position:absolute;
  inset:0;
  background:rgba(9,12,16,.56)
}
.auth-modal-card {
  position:relative;
  width:min(560px,100%);
  max-height:min(92vh,880px);
  overflow:auto;
  padding:1.35rem;
  border-radius:24px;
  background:#fff;
  border:1px solid rgba(17,24,39,.08);
  box-shadow:0 28px 80px rgba(0,0,0,.25)
}
.auth-modal-close {
  position:absolute;
  top:.7rem;
  right:.7rem;
  width:38px;
  height:38px;
  border-radius:999px;
  border:1px solid rgba(17,24,39,.14);
  background:#fff;
  font-size:1.4rem;
  cursor:pointer
}
.auth-switch {
  display:inline-grid;
  grid-template-columns:repeat(2,1fr);
  gap:.35rem;
  margin:0 0 1rem;
  padding:.3rem;
  border-radius:999px;
  background:#f3f6f9
}
.auth-switch-btn {
  border:0;
  background:transparent;
  border-radius:999px;
  padding:.7rem 1rem;
  font:inherit;
  font-weight:800;
  cursor:pointer
}
.auth-switch-btn.is-active {
  background:#fff;
  box-shadow:0 8px 18px rgba(17,24,39,.08)
}
.auth-modal-note {
  margin:1rem 0 0;
  color:var(--ink-soft)
}
.auth-inline-link {
  border:0;
  background:transparent;
  padding:0;
  color:#0679a0;
  font:inherit;
  font-weight:800;
  cursor:pointer
}
.body-modal-open {
  overflow:hidden
}
.hero {
  position:relative;
  min-height:var(--top-hero-height);
  padding:2.4rem 0 2.6rem;
  display:flex;
  align-items:flex-end;
  overflow:hidden
}
.hero::before {
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(
    135deg,
    rgba(146,153,163,.92) 0%,
    rgba(126,134,144,.88) 46%,
    rgba(101,109,120,.9) 100%
  );
  z-index:-2
}
.hero::after {
  content:"";
  position:absolute;
  inset:0;
  border-top:8px solid var(--yellow);
  border-bottom:8px solid var(--cyan);
  pointer-events:none;
  z-index:-1
}
.hero-grid {
  display:grid;
  grid-template-columns:1.15fr .85fr;
  gap:2rem;
  align-items:end
}
.hero-copy {
  padding:1rem 0 1.2rem;
  color:#fff
}
.kicker,.section-kicker {
  display:inline-block;
  margin-bottom:1rem;
  color:var(--cyan);
  text-transform:uppercase;
  letter-spacing:.14em;
  font-size:.82rem;
  font-weight:800
}
.hero h1 {
  margin:.1rem 0 1rem;
  font-size:clamp(2.05rem,3.8vw,3.6rem);
  line-height:1.06;
  max-width:18ch
}
.hero-lead {
  max-width:58ch;
  color:#f5f7fb;
  font-size:1.08rem
}
.cta-row {
  display:flex;
  gap:.9rem;
  flex-wrap:wrap;
  margin-top:1.6rem
}
.btn {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.5rem;
  border-radius:999px;
  padding:.94rem 1.22rem;
  font-weight:800;
  transition:.18s ease
}
.btn-primary {
  background:var(--yellow);
  color:#111
}
.btn-secondary {
  background:#fff;
  color:#17181b
}
.btn-dark {
  background:var(--dark-2);
  color:#fff
}
.btn:hover {
  transform:translateY(-1px);
  box-shadow:0 10px 30px rgba(17,24,39,.1)
}
.hero-panel,.card,.box,.pricing-card,.schedule-card {
  background:var(--paper);
  border:1px solid rgba(17,24,39,.08);
  border-radius:var(--radius);
  box-shadow:var(--shadow)
}
.hero-panel {
  overflow:hidden
}
.hero-panel-top {
  background:var(--dark);
  color:#fff;
  padding:1.4rem 1.5rem 4.6rem;
  position:relative
}
.hero-panel-top::after {
  display:none
}
.hero-panel-body {
  padding:1.3rem 1.5rem 1.5rem
}
.hero-panel ul {
  padding-left:1.1rem;
  margin:0
}
.hero-panel li {
  margin:.55rem 0;
  color:var(--ink-soft)
}
main section {
  padding:4.2rem 0
}
.section-head {
  display:flex;
  gap:1rem;
  justify-content:space-between;
  align-items:end;
  margin-bottom:1.6rem
}
.section-head h2 {
  margin:0;
  font-size:clamp(1.8rem,3.4vw,3rem);
  line-height:1.06
}
.section-head p {
  max-width:58ch;
  margin:0;
  color:var(--ink-soft)
}
.grid-3 {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1.2rem
}
.grid-2 {
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:1.2rem
}
.card {
  padding:1.5rem
}
.card h3,.box h3,.pricing-card h3,.schedule-card h3 {
  margin:.2rem 0 .8rem;
  line-height:1.14
}
.card p,.box p,.pricing-card p,.schedule-card p,.muted {
  color:var(--ink-soft)
}
.card .mini-link {
  display:inline-block;
  margin-top:.65rem;
  font-weight:800;
  color:var(--dark-2)
}
.card-icon {
  width:52px;
  height:52px;
  border-radius:16px;
  background:linear-gradient(180deg,var(--yellow),#fff5a6);
  display:grid;
  place-items:center;
  font-weight:900;
  margin-bottom:1rem
}
.band {
  background:linear-gradient(180deg,rgba(81,82,87,.04),rgba(81,82,87,.02));
  border-top:1px solid rgba(17,24,39,.06);
  border-bottom:1px solid rgba(17,24,39,.06)
}
.photo-slab {
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:1.4rem;
  align-items:stretch
}
.photo-box {
  min-height:420px;
  border-radius:26px;
  overflow:hidden;
  box-shadow:var(--shadow);
  border:1px solid rgba(17,24,39,.08);
  background:#d9dee3
}
.photo-notes {
  padding:1.4rem 1.5rem
}
.photo-notes ul {
  padding-left:1.2rem;
  margin:.6rem 0 0
}
.list-clean {
  list-style:none;
  padding:0;
  margin:.6rem 0 0
}
.list-clean li {
  padding:.75rem 0;
  border-bottom:1px dashed rgba(17,24,39,.12)
}
.list-clean li:last-child {
  border-bottom:0
}
.highlight {
  position:relative;
  overflow:hidden;
  padding:1.6rem
}
.highlight::before {
  content:"";
  position:absolute;
  inset:0 0 auto 0;
  height:14px;
  background:var(--cyan)
}
.highlight::after {
  content:"";
  position:absolute;
  inset:14px 0 auto 0;
  height:10px;
  background:var(--yellow)
}
.stats {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:1rem
}
.stat {
  padding:1.2rem;
  border-radius:18px;
  background:#fff;
  border:1px solid rgba(17,24,39,.08);
  box-shadow:var(--shadow)
}
.stat strong {
  display:block;
  font-size:1.9rem;
  line-height:1;
  margin-bottom:.35rem
}
.schedule-wrap {
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:1.2rem
}
.schedule-card,.pricing-card {
  padding:1.5rem
}
.schedule-list {
  display:grid;
  gap:.8rem;
  margin-top:1rem
}
.schedule-item {
  display:grid;
  grid-template-columns:120px 1fr auto;
  gap:1rem;
  align-items:center;
  padding:1rem 1rem;
  border-radius:18px;
  background:#f6f8fa;
  border:1px solid rgba(17,24,39,.06)
}
.schedule-item .date {
  font-weight:800
}
.badge {
  display:inline-flex;
  padding:.35rem .7rem;
  border-radius:999px;
  font-weight:800;
  font-size:.82rem
}
.badge.cyan {
  background:rgba(17,184,239,.12);
  color:#0679a0
}
.badge.yellow {
  background:rgba(255,229,0,.22);
  color:#635900
}
.price {
  font-size:2.2rem;
  line-height:1;
  font-weight:900;
  margin:.4rem 0
}
.price small {
  font-size:.9rem;
  font-weight:700;
  color:var(--ink-soft)
}
table {
  width:100%;
  border-collapse:collapse;
  background:#fff;
  border-radius:18px;
  overflow:hidden;
  border:1px solid rgba(17,24,39,.08);
  box-shadow:var(--shadow)
}
th,td {
  padding:1rem 1rem;
  border-bottom:1px solid rgba(17,24,39,.08);
  text-align:left;
  vertical-align:top
}
thead th {
  background:#515257;
  color:#fff;
  font-size:.95rem
}
tbody tr:nth-child(even) {
  background:#fafbfc
}
tbody tr:last-child td {
  border-bottom:0
}
.terms-block {
  margin-top:1.2rem
}
.terms-head {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  margin-bottom:.7rem
}
.terms-head h2 {
  margin:0;
  font-size:1.35rem
}
.reserve-trigger {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  padding:.55rem .95rem;
  border:0;
  background:var(--dark-2);
  color:#fff;
  font-weight:800;
  cursor:pointer;
  user-select:none
}
.reserve-trigger:hover {
  background:#3b3e44
}
.reserve-modal {
  position:fixed;
  inset:0;
  z-index:60;
  display:grid;
  place-items:center;
  padding:1rem
}
.reserve-modal[hidden] {
  display:none !important
}
.reserve-modal-backdrop {
  position:absolute;
  inset:0;
  background:rgba(9,12,16,.56)
}
.reserve-modal-card {
  position:relative;
  width:min(680px,100%);
  max-height:min(92vh,880px);
  overflow:auto;
  background:#fff;
  border-radius:20px;
  border:1px solid rgba(17,24,39,.12);
  box-shadow:0 28px 80px rgba(0,0,0,.25);
  padding:1.2rem 1.2rem 1rem
}
.reserve-close {
  position:absolute;
  top:.6rem;
  right:.65rem;
  width:36px;
  height:36px;
  border-radius:999px;
  border:1px solid rgba(17,24,39,.15);
  background:#fff;
  font-size:1.4rem;
  line-height:1;
  cursor:pointer
}
.reserve-steps {
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:.35rem;
  margin:.15rem 2rem .85rem 0
}
.reserve-steps span {
  height:6px;
  border-radius:99px;
  background:#e6ebf0
}
.reserve-steps span.is-active {
  background:var(--cyan)
}
.reserve-term {
  margin:0 0 .8rem;
  color:var(--ink-soft)
}
.reserve-step h4 {
  margin:.25rem 0 .7rem
}
.reserve-step label {
  display:block;
  margin:.45rem 0
}
.reserve-step input[type=\"radio\"] {
  margin-right:.45rem
}
.reserve-substep {
  margin-top:.7rem;
  padding:.7rem .85rem;
  border-radius:12px;
  background:#f5f8fb;
  border:1px solid rgba(17,24,39,.1)
}
.reserve-substep h5 {
  margin:0 0 .35rem
}
.reserve-note {
  color:var(--ink-soft);
  margin:.7rem 0 0
}
.reserve-summary {
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:.4rem
}
.reserve-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:.75rem
}
.reserve-grid label {
  margin:0;
  font-weight:700;
  color:#2e3340
}
.reserve-grid input {
  margin-top:.25rem;
  width:100%;
  border:1px solid rgba(17,24,39,.2);
  border-radius:10px;
  padding:.58rem .65rem;
  font:inherit
}
.reserve-actions {
  margin-top:1rem;
  display:flex;
  gap:.6rem;
  justify-content:flex-end;
  flex-wrap:wrap
}
.reserve-error {
  margin:.85rem 0 0;
  color:#8a2323;
  font-weight:700
}
.reserve-toast {
  position:fixed;
  right:1rem;
  bottom:1rem;
  z-index:70;
  width:min(560px,calc(100% - 2rem));
  padding:1rem 1.1rem;
  border-radius:14px;
  border:1px solid rgba(17,24,39,.08);
  background:#e9fbef;
  color:#0f5f2e;
  font-weight:700;
  box-shadow:var(--shadow)
}
.reserve-toast.is-error {
  background:#ffecec;
  color:#7b1f1f
}
body.modal-open {
  overflow:hidden
}
.content-prose h2 {
  font-size:clamp(1.8rem,3vw,2.7rem);
  line-height:1.08;
  margin:0 0 1rem
}
.content-prose p {
  color:var(--ink-soft)
}
.footer {
  padding:2rem 0 3rem;
  background:#17181b;
  color:#fff;
  margin-top:2rem
}
.footer-grid {
  display:grid;
  grid-template-columns:1.2fr .8fr .8fr;
  gap:1.4rem
}
.footer a {
  color:#fff
}
.footer small {
  color:rgba(255,255,255,.7)
}
.page-hero {
  position:relative;
  min-height:var(--top-hero-height);
  padding:2.4rem 0 2.6rem;
  display:flex;
  align-items:flex-end;
  overflow:hidden
}
.page-hero::before {
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(
    135deg,
    rgba(146,153,163,.92) 0%,
    rgba(126,134,144,.88) 46%,
    rgba(101,109,120,.9) 100%
  );
  z-index:-2
}
.page-hero::after {
  content:"";
  position:absolute;
  inset:0;
  border-top:8px solid var(--yellow);
  border-bottom:8px solid var(--cyan);
  pointer-events:none;
  z-index:-1
}
.page-title {
  color:#fff;
  max-width:20ch;
  font-size:clamp(1.9rem,3.3vw,3.1rem);
  line-height:1.08;
  margin:0 0 .8rem
}
.page-lead {
  max-width:62ch;
  color:#f5f7fb
}
.note-strip {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1rem;
  margin-top:-1rem
}
.note {
  background:#fff;
  border:1px solid rgba(17,24,39,.08);
  border-radius:18px;
  box-shadow:var(--shadow);
  padding:1rem 1.1rem
}
.note strong {
  display:block;
  margin-bottom:.4rem
}
.contact-list a {
  font-weight:800
}
.map-grid {
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:1rem
}
.map-card {
  min-height:220px;
  border-radius:22px;
  background:linear-gradient(180deg,#f3f5f8,#e8edf2);
  border:1px solid rgba(17,24,39,.08);
  display:flex;
  align-items:end;
  padding:1.2rem
}
.portal-layout {
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:1.2rem;
  align-items:start
}
.portal-gate,.portal-summary,.portal-section {
  padding:1.5rem
}
.portal-form {
  display:grid;
  gap:.85rem;
  margin-top:1rem
}
.portal-auth-head h2 {
  margin:.1rem 0 0
}
.portal-auth-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:1rem;
  margin:1.2rem 0
}
.portal-auth-card {
  padding:1.15rem;
  border-radius:20px;
  background:#f8fafc;
  border:1px solid rgba(17,24,39,.08)
}
.portal-auth-card p {
  margin:.2rem 0 .4rem;
  color:var(--ink-soft)
}
.portal-form label {
  display:block;
  font-weight:700
}
.portal-form input {
  width:100%;
  margin-top:.3rem;
  border:1px solid rgba(17,24,39,.18);
  border-radius:12px;
  padding:.82rem .9rem;
  font:inherit
}
.portal-feedback {
  margin:0;
  padding:.8rem .95rem;
  border-radius:12px;
  background:#e9fbef;
  color:#0f5f2e;
  font-weight:700
}
.portal-feedback.is-error {
  background:#ffecec;
  color:#7b1f1f
}
.portal-dashboard {
  display:grid;
  gap:1.2rem
}
.portal-toolbar {
  display:flex;
  gap:.7rem;
  flex-wrap:wrap
}
.portal-profile-meta strong {
  margin-right:.35rem
}
.portal-section {
  background:var(--paper);
  border:1px solid rgba(17,24,39,.08);
  border-radius:var(--radius);
  box-shadow:var(--shadow)
}
.portal-section-head {
  display:flex;
  justify-content:space-between;
  gap:1rem;
  align-items:center;
  margin-bottom:1rem
}
.portal-section-head h3 {
  margin:.2rem 0 0
}
.portal-records {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:1rem
}
.portal-card {
  background:#f8fafc;
  border:1px solid rgba(17,24,39,.08);
  border-radius:18px;
  padding:1rem 1.05rem
}
.portal-card h4 {
  margin:0 0 .7rem;
  line-height:1.2
}
.portal-card p {
  margin:0 0 .45rem;
  color:var(--ink-soft)
}
.portal-card p:last-child {
  margin-bottom:0
}
.portal-gate-actions {
  display:flex;
  gap:.8rem;
  flex-wrap:wrap;
  margin-top:1.2rem
}
@media (max-width:980px) {
  .hero-grid,.grid-3,.grid-2,.photo-slab,.schedule-wrap,.footer-grid,.map-grid,.note-strip,.stats,.portal-layout,.portal-records,.portal-auth-grid {
    grid-template-columns:1fr
  }
  .hero h1,.page-title {
    max-width:none
  }
}
@media (max-width:720px) {
  .navbar {
    padding:.7rem 0;
    align-items:flex-start
  }
  .main-nav {
    display:none;
    width:100%;
    padding:1rem 0 0
  }
  .main-nav.is-open {
    display:flex;
    flex-direction:column;
    align-items:flex-start
  }
  .nav-dropdown-panel,.profile-menu-panel {
    position:static;
    min-width:0;
    width:100%
  }
  .nav-toggle {
    display:inline-flex !important
  }
  .hero {
    min-height:260px;
    padding:1.8rem 0 2rem
  }
  .page-hero {
    min-height:260px;
    padding:1.8rem 0 2rem
  }
  .hero::after,.page-hero::after {
    border-top-width:6px;
    border-bottom-width:6px
  }
  .schedule-item {
    grid-template-columns:1fr;
    gap:.45rem
  }
  th,td {
    padding:.75rem
  }
  .reserve-grid {
    grid-template-columns:1fr
  }
  .reserve-actions .btn {
    width:100%
  }
  .portal-toolbar,.portal-section-head {
    flex-direction:column;
    align-items:flex-start
  }
}
.nav-toggle {
  display:none;
  align-items:center;
  justify-content:center;
  width:46px;
  height:46px;
  border-radius:14px;
  border:1px solid rgba(17,24,39,.12);
  background:#fff;
  font-size:1.2rem
}