/* ============================================================ */
/* === DESIGN TOKENS ========================================= */
/* ============================================================ */
:root{
  --ink:#0b1220; --ink-2:#334155; --ink-3:#64748b;
  --bg:#ffffff; --bg-2:#f8fafc; --bg-3:#eef2f6;
  --line:#e2e8f0; --line-2:#cbd5e1;
  --brand:#0d9488; --brand-2:#0f766e; --brand-3:#134e4a; --brand-soft:#ccfbf1;
  --accent:#f59e0b;

  --s-1:4px; --s-2:8px; --s-3:12px; --s-4:16px; --s-5:24px;
  --s-6:32px; --s-7:40px; --s-8:48px; --s-9:64px; --s-10:80px; --s-11:96px;

  --t-xs:0.75rem; --t-sm:0.875rem; --t-base:1rem; --t-md:1.125rem;
  --t-lg:clamp(1.125rem, 1.05rem + 0.4vw, 1.25rem);
  --t-xl:clamp(1.25rem, 1.05rem + 1vw, 1.5rem);
  --t-2xl:clamp(1.5rem, 1.2rem + 1.5vw, 1.875rem);
  --t-3xl:clamp(1.625rem, 1.3rem + 2vw, 2.25rem);
  --t-4xl:clamp(1.875rem, 1.4rem + 2.6vw, 3rem);

  --lh-tight:1.05; --lh-snug:1.2; --lh-base:1.6;
  --container:1200px; --measure:65ch;
  --radius-sm:8px; --radius:12px; --radius-lg:16px;
  --shadow-sm:0 1px 2px rgba(15,23,42,.04);
  --shadow:0 1px 2px rgba(15,23,42,.04), 0 8px 24px rgba(15,23,42,.06);
  --shadow-lg:0 1px 2px rgba(15,23,42,.05), 0 14px 32px rgba(15,23,42,.10);
  --t:180ms cubic-bezier(.2,.6,.2,1);
  --header-h:64px;
}

/* ============================================================ */
/* === RESET ================================================= */
/* ============================================================ */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%; text-size-adjust:100%; font-feature-settings:'kern','liga','clig','calt','ss01'; scroll-behavior:smooth}
body{margin:0; font-family:'Inter','InterVariable',system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif; font-size:var(--t-base); line-height:var(--lh-base); color:var(--ink); background:var(--bg); -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility}
img,svg{display:block; max-width:100%}

.container{max-width:var(--container); margin-left:auto; margin-right:auto; padding-left:var(--s-4); padding-right:var(--s-4)}
@media (min-width:768px){.container{padding-left:var(--s-6); padding-right:var(--s-6)}}
.muted{color:var(--ink-3)}
.small{font-size:var(--t-sm)}
.label{font-size:var(--t-xs); text-transform:uppercase; letter-spacing:.08em; color:var(--ink-3); font-weight:600}

h1,h2,h3,h4{margin:0; font-weight:700; letter-spacing:-.02em; text-wrap:balance; color:var(--ink)}
h1{font-size:var(--t-4xl); line-height:var(--lh-tight)}
h2{font-size:var(--t-2xl); line-height:var(--lh-snug); letter-spacing:-.015em}
h3{font-size:var(--t-md); line-height:var(--lh-snug); letter-spacing:-.01em; font-weight:600}
p{margin:0; text-wrap:pretty}
::selection{background:var(--brand-soft); color:var(--brand-3)}

a{color:var(--brand-2); text-decoration:none; transition:color var(--t)}
a:hover{color:var(--brand-3); text-decoration:underline; text-underline-offset:3px}
a:focus-visible{outline:2px solid var(--brand); outline-offset:3px; border-radius:4px}

/* ============================================================ */
/* === SKIP LINK ============================================= */
/* ============================================================ */
.skip-link{position:absolute; top:-999px; left:var(--s-2); background:var(--brand); color:#fff; padding:var(--s-2) var(--s-4); border-radius:var(--radius-sm); z-index:200; font-weight:600; font-size:var(--t-sm)}
.skip-link:focus{top:var(--s-2); text-decoration:none; color:#fff}

/* ============================================================ */
/* === SITE HEADER (mobile-first) ============================ */
/* ============================================================ */
.site-header{position:sticky; top:0; z-index:50; background:rgba(255,255,255,.92); -webkit-backdrop-filter:saturate(140%) blur(12px); backdrop-filter:saturate(140%) blur(12px); border-bottom:1px solid var(--line)}
.site-header .row{display:flex; align-items:center; gap:var(--s-3); padding-top:var(--s-3); padding-bottom:var(--s-3); flex-wrap:wrap}

.brand{display:inline-flex; align-items:center; gap:var(--s-2); font-weight:700; color:var(--ink); letter-spacing:-.01em; font-size:var(--t-base); flex-shrink:0; text-decoration:none}
.brand:hover{text-decoration:none}
.brand .dot{width:24px; height:24px; border-radius:6px; background:var(--brand); position:relative; overflow:hidden; flex-shrink:0}
.brand .dot::after{content:""; position:absolute; top:6px; right:4px; bottom:6px; left:4px; background:repeating-linear-gradient(0deg,#fff 0 1px,transparent 1px 4px); border:1px solid #fff; border-radius:2px}

/* Search bar — full width on mobile */
.search-wrap{position:relative; flex:1 1 100%; order:3; margin-top:var(--s-2)}
.search-input{width:100%; padding:12px 16px 12px 40px; border:1px solid var(--line); border-radius:var(--radius); font-size:var(--t-base); font-family:inherit; color:var(--ink); background:#fff url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><circle cx='11' cy='11' r='8'/><path d='m21 21-4.3-4.3'/></svg>") 14px center/16px no-repeat; outline:none; transition:border-color var(--t), box-shadow var(--t); -webkit-appearance:none; appearance:none}
.search-input::placeholder{color:var(--ink-3)}
.search-input:focus{border-color:var(--brand); box-shadow:0 0 0 4px var(--brand-soft)}

/* ============================================================ */
/* === BURGER BUTTON (animated bars → X) ===================== */
/* ============================================================ */
.nav-burger{display:inline-flex; align-items:center; justify-content:center; width:44px; height:44px; flex-shrink:0; margin-left:auto; border:1px solid var(--line); border-radius:var(--radius); background:#fff; color:var(--ink-2); cursor:pointer; font-family:inherit; padding:0; transition:background var(--t), border-color var(--t), transform var(--t)}
.nav-burger:hover{background:var(--bg-2); border-color:var(--line-2)}
.nav-burger:active{transform:scale(.96)}
.nav-burger:focus-visible{outline:2px solid var(--brand); outline-offset:2px}
.nav-burger-bars{position:relative; display:block; width:18px; height:14px}
.nav-burger-bars span{position:absolute; left:0; width:100%; height:2px; background:currentColor; border-radius:2px; transition:transform 280ms cubic-bezier(.2,.6,.2,1), opacity 180ms ease, top 180ms ease, bottom 180ms ease}
.nav-burger-bars span:nth-child(1){top:0}
.nav-burger-bars span:nth-child(2){top:50%; transform:translateY(-50%)}
.nav-burger-bars span:nth-child(3){bottom:0}
.nav-burger[aria-expanded="true"] .nav-burger-bars span:nth-child(1){top:50%; transform:translateY(-50%) rotate(45deg)}
.nav-burger[aria-expanded="true"] .nav-burger-bars span:nth-child(2){opacity:0}
.nav-burger[aria-expanded="true"] .nav-burger-bars span:nth-child(3){bottom:50%; transform:translateY(50%) rotate(-45deg)}

/* ============================================================ */
/* === MOBILE MENU OVERLAY =================================== */
/* ============================================================ */
.nav{
  position:fixed; top:0; right:0; bottom:0; left:0;
  background:#fff;
  z-index:200;
  display:flex; flex-direction:column;
  overflow-y:auto; -webkit-overflow-scrolling:touch;
  opacity:0;
  transform:translateX(24px);
  pointer-events:none;
  transition:opacity 220ms ease, transform 280ms cubic-bezier(.2,.6,.2,1);
}
.nav.nav-open{
  opacity:1;
  transform:translateX(0);
  pointer-events:auto;
}

.nav-head{
  display:flex; align-items:center; justify-content:space-between;
  padding:var(--s-3) var(--s-5);
  background:linear-gradient(180deg, #f0fdfa 0%, #ffffff 100%);
  border-bottom:1px solid var(--line);
  padding-top:calc(var(--s-3) + env(safe-area-inset-top));
}
.brand--in-menu{font-size:var(--t-md)}
.brand--in-menu .dot{width:26px; height:26px}
.nav-close{
  width:44px; height:44px; flex-shrink:0;
  display:inline-flex; align-items:center; justify-content:center;
  background:#fff; border:1px solid var(--line); border-radius:var(--radius);
  color:var(--ink-2); cursor:pointer; padding:0;
  transition:background var(--t), border-color var(--t), transform var(--t);
}
.nav-close:hover{background:var(--bg-2); border-color:var(--line-2)}
.nav-close:active{transform:scale(.96)}
.nav-close:focus-visible{outline:2px solid var(--brand); outline-offset:2px}

.nav-eyebrow{
  padding:var(--s-5) var(--s-5) var(--s-2);
  font-size:11px; letter-spacing:.12em; text-transform:uppercase;
  color:var(--ink-3); font-weight:700;
}

.nav-links{
  display:flex; flex-direction:column; gap:2px;
  padding:0 var(--s-3) var(--s-5);
  flex:1 0 auto;
}
.nav-link{
  display:grid;
  grid-template-columns:1fr auto;
  grid-template-rows:auto auto;
  column-gap:var(--s-3); row-gap:2px;
  padding:var(--s-4); border-radius:var(--radius);
  color:var(--ink); text-decoration:none;
  border-bottom:0;
  transition:background var(--t);
  min-height:64px; align-items:center;
}
.nav-link:hover, .nav-link:active{background:var(--bg-2); text-decoration:none}
.nav-link-title{
  grid-column:1; grid-row:1;
  font-size:1.0625rem; font-weight:600;
  color:var(--ink); line-height:1.2; letter-spacing:-.01em;
}
.nav-link-sub{
  grid-column:1; grid-row:2;
  font-size:var(--t-sm); color:var(--ink-3);
  line-height:1.35;
}
.nav-link-arrow{
  grid-column:2; grid-row:1 / span 2;
  display:inline-flex; align-items:center; justify-content:center;
  width:36px; height:36px; border-radius:50%;
  background:var(--bg-3); color:var(--ink-2);
  transition:background var(--t), color var(--t), transform var(--t);
  flex-shrink:0;
}
.nav-link:hover .nav-link-arrow{background:var(--brand-soft); color:var(--brand-3); transform:translateX(2px)}

.nav-foot{padding:var(--s-3) var(--s-5) calc(var(--s-5) + env(safe-area-inset-bottom)); border-top:1px solid var(--line); background:#fff}
.nav-foot-card{
  background:linear-gradient(135deg, var(--brand-3) 0%, var(--brand) 100%);
  color:#fff; border-radius:var(--radius-lg);
  padding:var(--s-4); display:flex; flex-direction:column; gap:var(--s-3);
  box-shadow:0 8px 24px rgba(13,148,136,.20);
}
.nav-foot-card h4{margin:0; color:#fff; font-size:var(--t-md); font-weight:600; letter-spacing:-.01em}
.nav-foot-card p{margin:0; color:rgba(255,255,255,.86); font-size:var(--t-sm)}
.nav-foot-card .cta{margin-top:0; align-self:flex-start; background:#fff; color:var(--brand-3); font-weight:600}
.nav-foot-card .cta:hover{background:#fff; color:var(--brand-3); transform:translateY(-1px); box-shadow:0 6px 16px rgba(0,0,0,.15)}

body.nav-locked{overflow:hidden}

/* ============================================================ */

.nav-desktop{display:none}

/* === HERO ================================================== */
/* ============================================================ */
.hero{
  padding-top:var(--s-7); padding-bottom:var(--s-7);
  background:linear-gradient(135deg, var(--brand-3) 0%, var(--brand) 100%);
  color:#fff;
  border-bottom:none;
  position:relative; overflow:hidden;
}
.hero::after{
  /* subtle radial glow in the top-right for depth */
  content:""; position:absolute; top:-40%; right:-20%;
  width:80%; height:160%; pointer-events:none;
  background:radial-gradient(closest-side, rgba(255,255,255,.10), transparent 70%);
}
.hero > .container{position:relative; z-index:1}
.hero h1{color:#fff; margin-bottom:var(--s-3); max-width:18ch; letter-spacing:-.025em}
.hero p.lead{font-size:var(--t-md); color:rgba(255,255,255,.86); max-width:48ch; margin:0; line-height:1.5}
.hero a{color:#fff}
.hero a:hover{color:#fff; text-decoration:underline; text-underline-offset:3px}
.hero .muted{color:rgba(255,255,255,.7)}

.kpis{display:grid; grid-template-columns:repeat(2,1fr); gap:var(--s-2); margin-top:var(--s-5)}
.kpi{padding:var(--s-3) var(--s-4); background:rgba(255,255,255,.96); border:1px solid rgba(255,255,255,.20); border-radius:var(--radius); box-shadow:0 6px 20px rgba(11,18,32,.18)}
.kpi b{display:block; font-size:var(--t-xl); line-height:1; font-weight:700; letter-spacing:-.02em; font-variant-numeric:tabular-nums; color:var(--ink)}
.kpi span{display:block; font-size:11px; color:var(--ink-3); margin-top:6px; text-transform:uppercase; letter-spacing:.06em; font-weight:600}

.last-updated{display:inline-flex; align-items:center; gap:6px; margin-top:var(--s-4); padding:5px 12px; background:rgba(255,255,255,.15); color:#fff; border-radius:999px; font-weight:500; font-size:var(--t-xs); border:1px solid rgba(255,255,255,.20)}
.last-updated::before{content:""; width:6px; height:6px; border-radius:50%; background:#fff}

/* Hero search variant — bigger, used on homepage */
.search-wrap.hero-search{position:relative; flex:none; order:0; margin:var(--s-5) 0 0; max-width:none}
.hero-search .search-input{padding-top:14px; padding-bottom:14px; padding-left:46px; font-size:var(--t-md); border-radius:var(--radius-lg); background-position:16px center; background-size:18px; border:1px solid rgba(255,255,255,.20); box-shadow:0 6px 20px rgba(11,18,32,.18)}
.hero-search .search-input:focus{border-color:#fff; box-shadow:0 0 0 4px rgba(255,255,255,.25), 0 6px 20px rgba(11,18,32,.18)}

/* ============================================================ */
/* === SECTIONS ============================================== */
/* ============================================================ */
section.block{padding-top:var(--s-7); padding-bottom:var(--s-7)}
section.block > .container > h2{margin-bottom:var(--s-2)}
section.block .sub{color:var(--ink-3); margin:0 0 var(--s-5); max-width:55ch}

.grid{display:grid; gap:var(--s-3)}
.grid-3{grid-template-columns:1fr}
.grid-4{grid-template-columns:repeat(2,1fr)}

/* ============================================================ */
/* === CARDS ================================================= */
/* ============================================================ */
.card{display:block; background:#fff; border:1px solid var(--line); border-radius:var(--radius-lg); padding:var(--s-4); transition:transform var(--t), box-shadow var(--t), border-color var(--t); text-decoration:none}
.card:hover{transform:translateY(-2px); border-color:var(--line-2); box-shadow:var(--shadow-lg); text-decoration:none}
.card h3{margin-bottom:var(--s-1); color:var(--ink); font-size:var(--t-md)}
.card .meta{font-size:var(--t-sm); color:var(--ink-3); line-height:1.45}

.tag{display:inline-block; padding:3px 10px; border-radius:999px; background:var(--brand-soft); color:var(--brand-3); font-size:var(--t-xs); font-weight:600; margin-right:var(--s-1); letter-spacing:.01em}
.tag.gray{background:var(--bg-3); color:var(--ink-2)}

.list-card{display:flex; align-items:center; justify-content:space-between; gap:var(--s-3); padding:var(--s-3) var(--s-4); border:1px solid var(--line); border-radius:var(--radius); background:#fff; transition:background var(--t), border-color var(--t); text-decoration:none; min-height:64px}
.list-card:hover{background:var(--bg-2); border-color:var(--line-2); text-decoration:none}
.list-card b{font-size:var(--t-base); color:var(--ink); font-weight:600; display:block}
.list-card .count{font-size:var(--t-sm); color:var(--ink-3); flex-shrink:0; font-variant-numeric:tabular-nums; white-space:nowrap}
.list-card .muted{font-size:var(--t-sm); margin-top:2px}

/* ============================================================ */
/* === VENUE DETAIL ========================================== */
/* ============================================================ */
.venue-hero{padding-top:var(--s-5); padding-bottom:var(--s-3)}
.venue-hero h1{font-size:var(--t-3xl); line-height:var(--lh-tight); margin-bottom:var(--s-1); max-width:24ch}
.breadcrumbs{font-size:var(--t-sm); color:var(--ink-3); margin-bottom:var(--s-3); display:flex; flex-wrap:wrap; gap:6px; align-items:center}
.breadcrumbs a{color:var(--ink-3)}
.breadcrumbs a:hover{color:var(--ink-2)}

.facts{display:grid; grid-template-columns:repeat(2,1fr); gap:var(--s-2); margin:var(--s-5) 0 var(--s-4)}
.fact{padding:var(--s-3); background:var(--bg-2); border:1px solid var(--line); border-radius:var(--radius)}
.fact label{display:block; font-size:11px; color:var(--ink-3); text-transform:uppercase; letter-spacing:.06em; margin-bottom:var(--s-1); font-weight:600}
.fact b{font-size:var(--t-md); color:var(--ink); font-weight:600; letter-spacing:-.01em; line-height:1.2}

.cta{display:inline-flex; align-items:center; justify-content:center; gap:var(--s-2); background:var(--brand); color:#fff; padding:14px 22px; border-radius:var(--radius); font-weight:600; font-size:var(--t-base); margin-top:var(--s-2); transition:background var(--t), transform var(--t), box-shadow var(--t); box-shadow:var(--shadow-sm); min-height:48px; text-align:center}
.cta:hover{background:var(--brand-2); color:#fff; transform:translateY(-1px); box-shadow:var(--shadow); text-decoration:none}
.cta.ghost{background:transparent; color:var(--brand-2); border:1px solid var(--brand); box-shadow:none}
.cta.ghost:hover{background:var(--brand-soft); color:var(--brand-3)}

.notes{padding:var(--s-3) var(--s-4); background:var(--bg-2); border:1px solid var(--line); border-radius:var(--radius); margin:var(--s-4) 0; max-width:60ch; font-size:var(--t-sm); line-height:1.65}
.notes b{color:var(--ink); font-weight:600}

/* ============================================================ */
/* === FAQ ACCORDION ========================================= */
/* ============================================================ */
.faq-block{background:var(--bg-2)}
.faq-list{display:flex; flex-direction:column; gap:var(--s-2); max-width:65ch}
.faq-item{background:#fff; border:1px solid var(--line); border-radius:var(--radius); overflow:hidden}
.faq-item[open]{border-color:var(--line-2); box-shadow:var(--shadow-sm)}
.faq-item summary{cursor:pointer; padding:var(--s-3) var(--s-4); font-weight:600; color:var(--ink); list-style:none; display:flex; align-items:center; justify-content:space-between; gap:var(--s-3); font-size:var(--t-sm); transition:background var(--t); min-height:52px}
.faq-item summary:hover{background:var(--bg-2)}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:"+"; color:var(--brand); font-size:24px; font-weight:300; flex-shrink:0; transition:transform var(--t)}
.faq-item[open] summary::after{content:"−"}
.faq-q{flex:1}
.faq-a{padding:0 var(--s-4) var(--s-4); color:var(--ink-2); line-height:1.65; max-width:60ch; font-size:var(--t-sm)}

/* ============================================================ */
/* === COMPARISON TABLE ====================================== */
/* ============================================================ */
.compare-block{padding-top:var(--s-6); padding-bottom:var(--s-6)}
/* Mobile-first: render as cards. Override to table on desktop */
.compare-table-wrap{background:transparent}
.compare-table{width:100%; border-collapse:collapse; font-size:var(--t-sm)}
.compare-table thead{position:absolute; left:-9999px}
.compare-table, .compare-table tbody, .compare-table tr, .compare-table td{display:block; width:100%}
.compare-table tr{border:1px solid var(--line); border-radius:var(--radius); padding:var(--s-3); margin-bottom:var(--s-2); background:#fff}
.compare-table td{padding:6px 0; display:flex; justify-content:space-between; gap:var(--s-3); border:none}
.compare-table td::before{content:attr(data-label); color:var(--ink-3); font-size:var(--t-xs); text-transform:uppercase; letter-spacing:.06em; font-weight:600; flex-shrink:0}
.compare-table td:first-child{border-bottom:1px solid var(--line); margin-bottom:var(--s-2); padding-bottom:var(--s-2); font-size:var(--t-md); font-weight:600}
.compare-table td:first-child::before{display:none}

/* ============================================================ */
/* === CTA BAND (List your club) ============================ */
/* ============================================================ */
.cta-band{background:linear-gradient(135deg, var(--brand-3) 0%, var(--brand) 100%); color:#fff; padding-top:var(--s-7); padding-bottom:var(--s-7)}
.cta-band-inner{display:flex; flex-direction:column; align-items:flex-start; gap:var(--s-4)}
.cta-band h2{color:#fff; margin:0 0 var(--s-2)}
.cta-band p{margin:0; color:rgba(255,255,255,.86); max-width:48ch}
.cta.cta-light{background:#fff; color:var(--brand-3); box-shadow:var(--shadow-sm)}
.cta.cta-light:hover{background:#fff; color:var(--brand-3); transform:translateY(-1px); box-shadow:var(--shadow)}

/* ============================================================ */
/* === FOOTER ================================================ */
/* ============================================================ */
footer{margin-top:var(--s-8); padding-top:var(--s-2); padding-bottom:var(--s-2); border-top:1px solid var(--line); color:var(--ink-3); font-size:var(--t-sm)}
.footer-grid{display:grid; grid-template-columns:1fr; gap:var(--s-5); padding-top:var(--s-6); padding-bottom:var(--s-5)}
.footer-brand{font-weight:700; color:var(--ink); margin-bottom:var(--s-2); letter-spacing:-.01em}
.footer-h{font-size:var(--t-xs); text-transform:uppercase; letter-spacing:.08em; color:var(--ink-3); font-weight:700; margin:0 0 var(--s-2)}
.footer-list{list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:0}
.footer-list a{display:flex; align-items:center; min-height:40px; color:var(--ink-2); font-size:var(--t-sm); padding:6px 0}
.footer-list a:hover{color:var(--ink); text-decoration:none}
.footer-bottom{padding-top:var(--s-3); padding-bottom:var(--s-3); border-top:1px solid var(--line); color:var(--ink-3); font-size:var(--t-xs); text-align:center}

/* ============================================================ */
/* === SEARCH RESULTS DROPDOWN =============================== */
/* ============================================================ */
.search-results{position:absolute; top:calc(100% + var(--s-1)); left:0; right:0; background:#fff; border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow-lg); max-height:60vh; overflow-y:auto; z-index:60; display:none}
.search-results.open{display:block}
.sr-group{padding:var(--s-1) 0}
.sr-group + .sr-group{border-top:1px solid var(--line)}
.sr-label{font-size:var(--t-xs); text-transform:uppercase; letter-spacing:.08em; color:var(--ink-3); padding:var(--s-2) var(--s-4) var(--s-1); font-weight:700}
.sr-item{display:flex; flex-direction:column; justify-content:center; padding:var(--s-2) var(--s-4); color:var(--ink); transition:background var(--t); min-height:52px}
.sr-item:hover{background:var(--bg-2); text-decoration:none}
.sr-name{font-size:var(--t-sm); font-weight:500}
.sr-meta{font-size:var(--t-xs); color:var(--ink-3); margin-top:1px}
.sr-empty{padding:var(--s-5); color:var(--ink-3); font-size:var(--t-sm); text-align:center}

/* ============================================================ */
/* === STICKY MOBILE BOOKING BAR ============================ */
/* ============================================================ */
.mobile-cta-bar{display:flex; align-items:center; gap:var(--s-3); position:fixed; bottom:0; left:0; right:0; padding:var(--s-3) var(--s-4); padding-bottom:calc(var(--s-3) + env(safe-area-inset-bottom)); background:#fff; border-top:1px solid var(--line); box-shadow:0 -4px 20px rgba(15,23,42,.10); z-index:70}
.mobile-cta-info{flex:1; min-width:0}
.mobile-cta-name{font-weight:600; font-size:var(--t-sm); color:var(--ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.mobile-cta-meta{font-size:var(--t-xs); color:var(--ink-3); white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.cta.cta-mobile-bar-btn{margin-top:0; padding:10px 16px; flex-shrink:0; font-size:var(--t-sm); min-height:44px}
body:has(.mobile-cta-bar){padding-bottom:80px}

/* ============================================================ */
/* === ABOUT / PROSE ========================================= */
/* ============================================================ */
.prose-block{padding-top:var(--s-6); padding-bottom:var(--s-7)}
.prose-block h2{font-size:var(--t-xl); margin-top:var(--s-6); margin-bottom:var(--s-3)}
.prose-block h2:first-of-type{margin-top:0}
.prose-block p{margin:0 0 var(--s-4); max-width:65ch; line-height:1.7; color:var(--ink-2)}

/* ============================================================ */
/* === DESKTOP OVERRIDES (≥761px) ============================ */
/* ============================================================ */
@media (min-width:761px){
  .site-header .row{flex-wrap:nowrap; gap:var(--s-4); padding-top:var(--s-3); padding-bottom:var(--s-3)}
  .nav-burger{display:none}
  .search-wrap{position:relative; flex:1 1 auto; order:0; margin-top:0; max-width:480px}

  /* On desktop, hide the mobile menu drawer entirely; show inline desktop nav strip */
  .nav{display:none}
  .nav-desktop{display:flex; gap:var(--s-5); flex-shrink:0; margin-left:auto; align-items:center}
  .nav-desktop a{font-size:var(--t-sm); font-weight:500; color:var(--ink-2); padding:8px 4px}
  .nav-desktop a:hover{color:var(--ink); text-decoration:none}

  body.nav-locked{overflow:auto}
  body.nav-locked::before{display:none}

  /* Hero — bigger on desktop */
  .hero{padding-top:var(--s-9); padding-bottom:var(--s-8)}
  .hero p.lead{font-size:var(--t-lg); max-width:55ch}
  .kpis{display:flex; flex-wrap:wrap; gap:var(--s-3); margin-top:var(--s-7)}
  .kpi{padding:var(--s-4) var(--s-5); flex:0 1 auto; min-width:128px}
  .kpi b{font-size:var(--t-xl)}
  .kpi span{font-size:var(--t-xs)}
  .search-wrap.hero-search{flex:none; order:0; margin:var(--s-6) 0 0; max-width:560px}
  .hero-search .search-input{padding-left:48px; font-size:var(--t-md); background-position:18px center; background-size:20px}

  /* Sections */
  section.block{padding-top:var(--s-9); padding-bottom:var(--s-9)}
  .grid{gap:var(--s-4)}
  .grid-3{grid-template-columns:repeat(auto-fill, minmax(280px, 1fr))}
  .grid-4{grid-template-columns:repeat(auto-fill, minmax(220px, 1fr))}

  /* Cards */
  .card{padding:var(--s-5)}
  .list-card{padding:var(--s-4) var(--s-5)}

  /* Venue */
  .venue-hero{padding-top:var(--s-7); padding-bottom:var(--s-3)}
  .facts{grid-template-columns:repeat(auto-fit, minmax(140px,1fr)); gap:var(--s-2); margin-top:var(--s-6)}
  .fact{padding:var(--s-4)}

  /* FAQ */
  .faq-item summary{padding:var(--s-4) var(--s-5); font-size:var(--t-md)}
  .faq-a{padding:0 var(--s-5) var(--s-5)}

  /* Comparison table → real table on desktop */
  .compare-table-wrap{overflow-x:auto; border:1px solid var(--line); border-radius:var(--radius); background:#fff}
  .compare-table thead{position:static; left:auto}
  .compare-table, .compare-table tbody{display:table}
  .compare-table tr{display:table-row; border:none; border-radius:0; padding:0; margin:0; background:#fff}
  .compare-table tr + tr{border-top:1px solid var(--line)}
  .compare-table td, .compare-table th{display:table-cell; padding:var(--s-3) var(--s-4); text-align:left}
  .compare-table th{background:var(--bg-2); font-weight:600; color:var(--ink-2); text-transform:uppercase; font-size:var(--t-xs); letter-spacing:.06em}
  .compare-table td::before{display:none}
  .compare-table tbody tr:hover{background:var(--bg-2)}
  .compare-table td:first-child{border-bottom:none; margin:0; padding:var(--s-3) var(--s-4); font-weight:600; font-size:var(--t-sm)}
  .compare-table td:nth-child(2){font-variant-numeric:tabular-nums}

  /* CTA band */
  .cta-band-inner{flex-direction:row; align-items:center; justify-content:space-between; gap:var(--s-6)}
  .cta-band{padding-top:var(--s-8); padding-bottom:var(--s-8)}

  /* Footer */
  .footer-grid{grid-template-columns:repeat(auto-fit, minmax(200px, 1fr)); gap:var(--s-6); padding-top:var(--s-7); padding-bottom:var(--s-5)}
  .footer-list{gap:var(--s-1)}

  /* Hero search bar shape */
  .hero-search .search-input{border-radius:var(--radius-lg)}

  /* Hide mobile booking bar on desktop */
  .mobile-cta-bar{display:none}
  body:has(.mobile-cta-bar){padding-bottom:0}

  /* Notes wider */
  .notes{padding:var(--s-4) var(--s-5)}
}

/* ============================================================ */
/* === ACCESSIBILITY ========================================= */
/* ============================================================ */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{transition-duration:0ms !important; animation-duration:0ms !important}
  html{scroll-behavior:auto}
  .card:hover, .cta:hover{transform:none}
  body.nav-locked::before{animation:none}
}

.sr-only{position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0}
.sr-only:focus{position:fixed; top:var(--s-2); left:var(--s-2); width:auto; height:auto; clip:auto; padding:var(--s-2) var(--s-4); background:var(--brand); color:#fff; border-radius:var(--radius-sm); z-index:100; font-weight:600}

/* ============================================================ */
/* === AFFILIATE BANNER ===================================== */
/* ============================================================ */
.affiliate-band{padding-top:var(--s-5); padding-bottom:var(--s-5); background:#fff}
.affiliate-card{
  background:linear-gradient(135deg, var(--brand-3) 0%, var(--brand) 100%);
  color:#fff;
  border-radius:var(--radius-lg);
  padding:var(--s-6) var(--s-5);
  box-shadow:0 12px 32px rgba(13,148,136,.22);
  position:relative;
  overflow:hidden;
}
.affiliate-card::after{
  content:""; position:absolute; top:-50%; right:-15%;
  width:60%; height:200%;
  background:radial-gradient(closest-side, rgba(255,255,255,.10), transparent 70%);
  pointer-events:none;
}
.affiliate-card > *{position:relative; z-index:1}
.affiliate-eyebrow{
  display:inline-block; font-size:11px; letter-spacing:.12em; text-transform:uppercase;
  font-weight:700; padding:4px 10px; border-radius:999px;
  background:rgba(255,255,255,.20); color:#fff; margin-bottom:var(--s-3);
}
.affiliate-title{color:#fff !important; margin:0 0 var(--s-2); max-width:24ch}
.affiliate-sub{color:rgba(255,255,255,.88); margin:0 0 var(--s-5); max-width:52ch; font-size:var(--t-md); line-height:1.5}
.affiliate-code-row{display:flex; align-items:center; gap:var(--s-4); flex-wrap:wrap; margin-bottom:var(--s-4)}
.affiliate-code-box{
  display:inline-flex; flex-direction:column; gap:2px;
  background:rgba(255,255,255,.15); border:1px dashed rgba(255,255,255,.45);
  border-radius:var(--radius); padding:var(--s-3) var(--s-5);
}
.affiliate-code-label{font-size:11px; text-transform:uppercase; letter-spacing:.1em; color:rgba(255,255,255,.75); font-weight:600}
.affiliate-code{font-family:'SF Mono', Menlo, Consolas, monospace; font-size:1.5rem; font-weight:700; color:#fff; letter-spacing:.02em}
.affiliate-card .cta.cta-light{margin:0; background:#fff; color:var(--brand-3); font-weight:600; padding:14px 22px; font-size:var(--t-base)}
.affiliate-disclosure{margin:var(--s-4) 0 0; font-size:var(--t-xs); color:rgba(255,255,255,.75); line-height:1.5; max-width:60ch}
.affiliate-disclosure strong{color:#fff; font-weight:600}

/* === Inline affiliate mentions === */
.affiliate-inline{
  background:linear-gradient(90deg, var(--brand-soft) 0%, rgba(204,251,241,.4) 100%);
  border-left:3px solid var(--brand);
  padding:var(--s-3) var(--s-4);
  margin:var(--s-4) 0 var(--s-5);
  border-radius:0 var(--radius) var(--radius) 0;
  font-size:var(--t-sm);
  color:var(--ink-2);
  line-height:1.55;
  max-width:65ch;
}
.affiliate-inline strong{color:var(--ink); font-weight:600}
.affiliate-inline code{
  background:rgba(13,148,136,.12); color:var(--brand-3); padding:2px 8px;
  border-radius:6px; font-family:'SF Mono', Menlo, monospace; font-size:13px;
  font-weight:600; letter-spacing:.02em;
}
.affiliate-inline a{color:var(--brand-3); font-weight:600; text-decoration:underline; text-underline-offset:3px}

@media (max-width:600px){
  .affiliate-card{padding:var(--s-5) var(--s-4)}
  .affiliate-title{font-size:var(--t-xl)}
  .affiliate-code{font-size:1.25rem}
  .affiliate-code-row{flex-direction:column; align-items:stretch}
  .affiliate-code-box{align-items:center; text-align:center}
  .affiliate-card .cta.cta-light{justify-content:center; width:100%}
}

/* === Quiet/subtle affiliate variant === */
.affiliate-quiet{
  margin:var(--s-4) 0 var(--s-5);
  padding:var(--s-3) var(--s-4);
  background:var(--bg-2);
  border:1px solid var(--line);
  border-left:3px solid var(--brand);
  border-radius:0 var(--radius) var(--radius) 0;
  max-width:65ch;
}
.affiliate-quiet-text{
  margin:0;
  font-size:var(--t-sm);
  color:var(--ink-2);
  line-height:1.55;
}
.affiliate-quiet-text a{color:var(--brand-2); font-weight:500}
.affiliate-quiet-text code{
  background:rgba(13,148,136,.10); color:var(--brand-3);
  padding:1px 6px; border-radius:4px;
  font-family:'SF Mono', Menlo, monospace; font-size:12px; font-weight:600;
}
.affiliate-quiet-disclosure{
  margin:6px 0 0;
  font-size:11px;
  color:var(--ink-3);
  line-height:1.4;
}

/* ============================================================ */
/* === AFFILIATE PARTNER TICKER (scrolling marquee) ========= */
/* ============================================================ */
.partner-ticker{
  position:relative;
  background:var(--ink);
  color:#fff;
  overflow:hidden;
  border-top:1px solid rgba(255,255,255,.08);
  border-bottom:1px solid rgba(255,255,255,.08);
  z-index:1;
}
/* Fade edges so items disappear gracefully */
.partner-ticker::before, .partner-ticker::after{
  content:""; position:absolute; top:0; bottom:0; width:64px; z-index:2; pointer-events:none;
}
.partner-ticker::before{left:0; background:linear-gradient(90deg, var(--ink) 0%, transparent 100%)}
.partner-ticker::after{right:0; background:linear-gradient(-90deg, var(--ink) 0%, transparent 100%)}

.ticker-track{
  display:flex;
  align-items:center;
  flex-wrap:nowrap;
  width:max-content;
  white-space:nowrap;
  gap:56px;
  padding:14px 28px;
  animation:ticker-scroll 50s linear infinite;
  will-change:transform;
}
.partner-ticker:hover .ticker-track,
.partner-ticker:focus-within .ticker-track{animation-play-state:paused}

@keyframes ticker-scroll{
  from{transform:translateX(0)}
  to{transform:translateX(-50%)}
}

.ticker-item{
  display:inline-flex; align-items:center; gap:12px;
  flex-shrink:0;
  color:#fff; text-decoration:none;
  font-size:14px; font-weight:500;
  letter-spacing:.01em;
  padding:6px 18px 6px 14px;
  border-radius:999px;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.08);
  transition:background var(--t), border-color var(--t), transform var(--t);
}
.ticker-item:hover{
  color:#fff; text-decoration:none;
  background:rgba(255,255,255,.08);
  border-color:rgba(255,255,255,.18);
}
.ticker-text strong{color:#fff; font-weight:700}
.ticker-dot{
  width:8px; height:8px;
  border-radius:50%;
  background:var(--brand-soft);
  box-shadow:0 0 0 3px rgba(204,251,241,.16);
  flex-shrink:0;
}
.ticker-divider{
  width:1px; height:14px;
  background:rgba(255,255,255,.18);
  margin:0 2px;
  flex-shrink:0;
}
.ticker-label{
  color:rgba(255,255,255,.55);
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:.08em;
  font-weight:600;
}
.ticker-code{
  background:var(--brand-soft);
  color:var(--ink);
  border:none;
  padding:3px 10px;
  border-radius:6px;
  font-family:'SF Mono', Menlo, Consolas, monospace;
  font-size:12px; font-weight:700;
  letter-spacing:.06em;
}

@media (max-width:600px){
  .ticker-track{gap:32px; padding:10px 20px; animation-duration:35s}
  .ticker-item{font-size:13px; gap:10px; padding:5px 14px 5px 12px}
  .ticker-divider{display:none}
  .ticker-label{display:none}
  .ticker-dot{width:7px; height:7px}
  .partner-ticker::before, .partner-ticker::after{width:32px}
}

@media (prefers-reduced-motion: reduce){
  .ticker-track{animation:none; flex-wrap:wrap; justify-content:center; gap:16px}
  .partner-ticker::before, .partner-ticker::after{display:none}
}

/* ============================================================ */
/* === UX 2026 PASS - icons, eyebrows, feature cards ========= */
/* ============================================================ */

/* --- Eyebrow tag (small caps above headings) --- */
.eyebrow{
  display:inline-flex; align-items:center; gap:6px;
  font-size:11px; letter-spacing:.12em; text-transform:uppercase;
  font-weight:700; color:var(--brand-2);
  background:var(--brand-soft); border-radius:999px;
  padding:5px 11px;
  margin-bottom:var(--s-3);
}
.eyebrow svg, .eyebrow-icon{color:var(--brand-2); flex-shrink:0}

.hero .eyebrow, .cta-band .eyebrow{
  background:rgba(255,255,255,.14); color:#fff;
  border:1px solid rgba(255,255,255,.18);
}
.hero .eyebrow svg, .cta-band .eyebrow svg{color:#fff}

.section-heading{margin-bottom:var(--s-5)}
.section-heading h2{display:inline-flex; align-items:center; gap:var(--s-3); flex-wrap:wrap}
.section-h-icon{
  display:inline-flex; align-items:center; justify-content:center;
  width:42px; height:42px; border-radius:12px;
  background:var(--brand-soft); color:var(--brand-2);
  flex-shrink:0;
}

.feature-grid{
  display:grid; gap:var(--s-3);
  grid-template-columns:1fr;
  margin:var(--s-4) 0 var(--s-6);
}
@media (min-width:600px){.feature-grid{grid-template-columns:repeat(2,1fr); gap:var(--s-4)}}
@media (min-width:900px){.feature-grid.cols-3{grid-template-columns:repeat(3,1fr)}}
@media (min-width:900px){.feature-grid.cols-4{grid-template-columns:repeat(4,1fr)}}

.feature-card{
  background:#fff;
  border:1px solid var(--line);
  border-radius:var(--radius-lg);
  padding:var(--s-5);
  transition:border-color var(--t), box-shadow var(--t), transform var(--t);
}
.feature-card:hover{border-color:var(--line-2); box-shadow:var(--shadow-sm)}
.feature-card-icon{
  display:inline-flex; align-items:center; justify-content:center;
  width:44px; height:44px; border-radius:12px;
  background:linear-gradient(135deg, var(--brand-soft) 0%, #e6fffa 100%);
  color:var(--brand-2);
  margin-bottom:var(--s-3);
}
.feature-card h3{
  margin:0 0 8px; font-size:var(--t-md); font-weight:600;
  letter-spacing:-.01em; color:var(--ink);
}
.feature-card p{
  margin:0; font-size:var(--t-sm); line-height:1.55; color:var(--ink-2);
}
.feature-card p strong{color:var(--ink); font-weight:600}

.feature-card.tint-mint .feature-card-icon{background:linear-gradient(135deg,#ccfbf1,#a7f3d0); color:var(--brand-3)}
.feature-card.tint-amber .feature-card-icon{background:linear-gradient(135deg,#fef3c7,#fde68a); color:#92400e}
.feature-card.tint-sky .feature-card-icon{background:linear-gradient(135deg,#dbeafe,#bfdbfe); color:#1e40af}
.feature-card.tint-rose .feature-card-icon{background:linear-gradient(135deg,#fee2e2,#fecaca); color:#9f1239}

.fact-strip{
  display:grid; gap:var(--s-3);
  grid-template-columns:1fr;
  background:linear-gradient(135deg, var(--bg-2) 0%, #f0fdfa 100%);
  border:1px solid var(--line);
  border-radius:var(--radius-lg);
  padding:var(--s-4) var(--s-5);
  margin:var(--s-4) 0 var(--s-5);
}
@media (min-width:600px){.fact-strip{grid-template-columns:repeat(2,1fr); gap:var(--s-4)}}
@media (min-width:900px){.fact-strip{grid-template-columns:repeat(4,1fr)}}

.fact-strip-item{display:flex; align-items:center; gap:var(--s-3); min-width:0}
.fact-strip-icon{
  display:inline-flex; align-items:center; justify-content:center;
  width:36px; height:36px; border-radius:10px;
  background:#fff; color:var(--brand-2);
  border:1px solid var(--brand-soft);
  flex-shrink:0;
}
.fact-strip-text{min-width:0}
.fact-strip-label{
  font-size:11px; text-transform:uppercase; letter-spacing:.07em;
  color:var(--ink-3); font-weight:600; line-height:1.2;
}
.fact-strip-value{
  font-size:var(--t-md); font-weight:700; color:var(--ink);
  letter-spacing:-.01em; font-variant-numeric:tabular-nums;
  line-height:1.2; margin-top:2px;
}

.callout{
  display:flex; gap:var(--s-3);
  padding:var(--s-3) var(--s-4);
  margin:var(--s-4) 0;
  border-radius:var(--radius);
  border:1px solid var(--line);
  background:var(--bg-2);
  max-width:65ch;
  font-size:var(--t-sm); line-height:1.6;
}
.callout-icon{
  display:inline-flex; align-items:flex-start;
  color:var(--brand-2); flex-shrink:0; padding-top:2px;
}
.callout-body{color:var(--ink-2)}
.callout-body strong{color:var(--ink); font-weight:600; display:block; margin-bottom:2px}
.callout-tip{background:linear-gradient(90deg, var(--brand-soft) 0%, rgba(204,251,241,.3) 100%); border-color:var(--brand-soft)}
.callout-tip .callout-icon{color:var(--brand-2)}
.callout-info{background:#eff6ff; border-color:#dbeafe}
.callout-info .callout-icon{color:#1d4ed8}
.callout-warning{background:#fef3c7; border-color:#fde68a}
.callout-warning .callout-icon{color:#92400e}

.kpi{
  display:flex; align-items:center; gap:var(--s-3);
  padding:var(--s-3) var(--s-4); background:rgba(255,255,255,.96);
  border:1px solid rgba(255,255,255,.20); border-radius:var(--radius);
  box-shadow:0 6px 20px rgba(11,18,32,.18);
}
.kpi-icon{
  display:inline-flex; align-items:center; justify-content:center;
  width:36px; height:36px; border-radius:10px;
  background:var(--brand-soft); color:var(--brand-2);
  flex-shrink:0;
}
.kpi-text{display:flex; flex-direction:column; min-width:0}
.kpi b{
  display:block; font-size:var(--t-lg); line-height:1; font-weight:700;
  letter-spacing:-.02em; font-variant-numeric:tabular-nums; color:var(--ink);
}
.kpi span{
  display:block; font-size:11px; color:var(--ink-3); margin-top:6px;
  text-transform:uppercase; letter-spacing:.06em; font-weight:600;
}

.list-card{
  display:grid;
  grid-template-columns:auto 1fr auto auto;
  align-items:center; gap:var(--s-3);
  padding:var(--s-3) var(--s-4); border:1px solid var(--line);
  border-radius:var(--radius); background:#fff;
  transition:background var(--t), border-color var(--t), transform var(--t);
  text-decoration:none; min-height:68px;
}
.list-card:hover{
  background:linear-gradient(90deg, #fff 0%, var(--bg-2) 100%);
  border-color:var(--brand-soft); text-decoration:none;
  transform:translateY(-1px);
}
.list-card-icon{
  display:inline-flex; align-items:center; justify-content:center;
  width:38px; height:38px; border-radius:10px;
  background:var(--brand-soft); color:var(--brand-2);
  flex-shrink:0;
}
.list-card-body{min-width:0}
.list-card-body b{font-size:var(--t-base); color:var(--ink); font-weight:600; display:block}
.list-card-body .muted{font-size:var(--t-sm); margin-top:2px}
.list-card-count{
  display:flex; flex-direction:column; align-items:flex-end;
  font-size:var(--t-md); font-weight:700; color:var(--ink);
  font-variant-numeric:tabular-nums; line-height:1;
  flex-shrink:0;
}
.list-card-count span{
  font-size:10px; text-transform:uppercase; letter-spacing:.08em;
  color:var(--ink-3); font-weight:600; margin-top:3px;
}
.list-card-chev{
  display:inline-flex; align-items:center; justify-content:center;
  color:var(--ink-3); transition:color var(--t), transform var(--t);
  flex-shrink:0;
}
.list-card:hover .list-card-chev{color:var(--brand-2); transform:translateX(2px)}

.card .card-icon{
  display:inline-flex; align-items:center; justify-content:center;
  width:36px; height:36px; border-radius:10px;
  background:var(--brand-soft); color:var(--brand-2);
  margin-bottom:var(--s-3);
}
.card-tags{margin-top:var(--s-3); display:flex; flex-wrap:wrap; gap:6px}

.fact{
  padding:var(--s-3); background:var(--bg-2); border:1px solid var(--line);
  border-radius:var(--radius); position:relative;
}
.fact-icon{
  display:inline-flex; align-items:center; justify-content:center;
  width:28px; height:28px; border-radius:8px;
  background:#fff; color:var(--brand-2);
  border:1px solid var(--brand-soft);
  margin-bottom:8px;
}
.fact label{
  display:block; font-size:11px; color:var(--ink-3);
  text-transform:uppercase; letter-spacing:.06em;
  margin-bottom:4px; font-weight:600;
}
.fact b{
  font-size:var(--t-md); color:var(--ink); font-weight:600;
  letter-spacing:-.01em; line-height:1.2;
}

.cta{display:inline-flex; align-items:center; justify-content:center; gap:8px}
.cta .cta-icon{flex-shrink:0; transition:transform var(--t)}
.cta:hover .cta-icon:last-child{transform:translateX(2px)}
.cta.ghost{
  background:#fff; color:var(--brand-3);
  border:1px solid var(--line-2); box-shadow:none;
}
.cta.ghost:hover{
  background:var(--brand-soft); color:var(--brand-3);
  border-color:var(--brand);
}

.cta.outline{
  background:#fff; color:var(--brand-3);
  border:1.5px solid var(--brand-2); box-shadow:none;
}
.cta.outline:hover{
  background:var(--brand-soft); color:var(--brand-3);
  border-color:var(--brand-3);
}

.faq-head{margin-bottom:var(--s-5); max-width:65ch}
.faq-head .eyebrow{margin-bottom:var(--s-2)}
.faq-head h2{margin-bottom:var(--s-2)}
.faq-item summary::after{display:none !important}
.faq-chev{
  color:var(--brand-2); flex-shrink:0;
  transition:transform var(--t);
}
.faq-item[open] .faq-chev{transform:rotate(180deg)}
.faq-item summary{gap:var(--s-4)}

.cta-band-text{display:flex; flex-direction:column; gap:var(--s-2)}
.cta-band-eyebrow{
  display:inline-flex; align-items:center; gap:6px;
  font-size:11px; letter-spacing:.12em; text-transform:uppercase;
  font-weight:700; color:#fff;
  background:rgba(255,255,255,.14); border:1px solid rgba(255,255,255,.18);
  border-radius:999px; padding:5px 11px;
  align-self:flex-start;
}
.cta-band h2{color:#fff; margin:0}
.cta-band p{margin:0; color:rgba(255,255,255,.86); max-width:48ch}
.cta-band .cta-light .cta-icon{color:var(--brand-3)}

.hero .hero-eyebrow{
  display:inline-flex; align-items:center; gap:6px;
  margin-bottom:var(--s-3);
  font-size:11px; letter-spacing:.12em; text-transform:uppercase;
  font-weight:700; color:#fff;
  background:rgba(255,255,255,.14); border:1px solid rgba(255,255,255,.18);
  border-radius:999px; padding:5px 11px;
}

.prose-block .section-heading{margin-top:var(--s-7); margin-bottom:var(--s-4)}
.prose-block .section-heading:first-child{margin-top:0}
.prose-block h2{font-size:var(--t-xl)}
.prose-block .lead-card{
  background:linear-gradient(135deg, var(--bg-2) 0%, #f0fdfa 100%);
  border:1px solid var(--line);
  border-radius:var(--radius-lg);
  padding:var(--s-5);
  margin:var(--s-3) 0 var(--s-6);
  display:flex; gap:var(--s-4); align-items:flex-start;
}
.prose-block .lead-card-icon{
  display:inline-flex; align-items:center; justify-content:center;
  width:48px; height:48px; border-radius:12px;
  background:#fff; color:var(--brand-2);
  border:1px solid var(--brand-soft);
  flex-shrink:0;
}
.prose-block .lead-card h3{margin:0 0 6px; font-size:var(--t-md); font-weight:700; color:var(--ink)}
.prose-block .lead-card p{margin:0; color:var(--ink-2); font-size:var(--t-base); line-height:1.6}

.trust-strip{
  display:grid; gap:var(--s-3);
  grid-template-columns:1fr;
  margin:var(--s-5) 0;
}
@media (min-width:600px){.trust-strip{grid-template-columns:repeat(3,1fr)}}
.trust-item{display:flex; gap:var(--s-3); align-items:flex-start; padding:var(--s-3)}
.trust-icon{
  display:inline-flex; align-items:center; justify-content:center;
  width:38px; height:38px; border-radius:10px;
  background:var(--brand-soft); color:var(--brand-2);
  flex-shrink:0;
}
.trust-text strong{display:block; font-size:var(--t-sm); font-weight:700; color:var(--ink); margin-bottom:2px}
.trust-text span{font-size:var(--t-sm); color:var(--ink-2); line-height:1.5}

.step-strip{
  display:grid; gap:var(--s-3);
  grid-template-columns:1fr;
  margin:var(--s-4) 0 var(--s-6);
}
@media (min-width:700px){.step-strip{grid-template-columns:repeat(3,1fr); gap:var(--s-4)}}
.step-item{
  background:#fff; border:1px solid var(--line); border-radius:var(--radius-lg);
  padding:var(--s-4); position:relative;
}
.step-num{
  display:inline-flex; align-items:center; justify-content:center;
  width:32px; height:32px; border-radius:50%;
  background:var(--brand); color:#fff; font-weight:700; font-size:var(--t-sm);
  margin-bottom:var(--s-3);
}
.step-item h3{margin:0 0 6px; font-size:var(--t-base); font-weight:600; color:var(--ink)}
.step-item p{margin:0; font-size:var(--t-sm); color:var(--ink-2); line-height:1.55}

@media (min-width:761px){
  .kpi{padding:var(--s-3) var(--s-4); min-width:170px}
  .kpi-icon{width:38px; height:38px}
  .kpi b{font-size:var(--t-xl)}
}
@media (max-width:600px){
  .kpi{padding:10px 12px; gap:10px}
  .kpi-icon{width:32px; height:32px; border-radius:8px}
  .kpi b{font-size:var(--t-md)}
  .kpi span{font-size:10px; margin-top:4px}
}

.cta:focus-visible{outline:2px solid var(--brand-2); outline-offset:3px}
.list-card:focus-visible, .card:focus-visible, .feature-card:focus-visible{
  outline:2px solid var(--brand); outline-offset:2px;
}

.suburb-grid{
  display:grid; gap:8px;
  grid-template-columns:repeat(auto-fill, minmax(180px, 1fr));
  margin-top:var(--s-4);
}
.suburb-card{
  display:flex; align-items:center; gap:10px;
  padding:10px 12px;
  background:#fff; border:1px solid var(--line);
  border-radius:var(--radius);
  transition:border-color var(--t), background var(--t);
}
.suburb-card:hover{border-color:var(--brand-soft); background:var(--bg-2)}
.suburb-card-icon{
  display:inline-flex; align-items:center; justify-content:center;
  width:30px; height:30px; border-radius:8px;
  background:var(--brand-soft); color:var(--brand-2);
  flex-shrink:0;
}
.suburb-card-body{min-width:0; flex:1}
.suburb-card-body b{display:block; font-size:var(--t-sm); font-weight:600; color:var(--ink); line-height:1.2}
.suburb-card-body .muted{font-size:11px; margin-top:2px}

.prose-block > .container > p{
  margin:0 0 var(--s-4); max-width:65ch; line-height:1.7; color:var(--ink-2);
}
.prose-block > .container > p a{font-weight:500}
.prose-block > .container > p strong{color:var(--ink); font-weight:600}
.prose-block > .container > p code{
  background:var(--brand-soft); color:var(--brand-3);
  padding:2px 7px; border-radius:5px;
  font-family:'SF Mono', Menlo, Consolas, monospace; font-size:13px;
  font-weight:600;
}

@media (max-width:600px){
  .feature-card{padding:var(--s-4)}
  .feature-card-icon{width:38px; height:38px; border-radius:10px; margin-bottom:10px}
  .fact-strip{padding:var(--s-3) var(--s-4)}
  .fact-strip-value{font-size:var(--t-base)}
  .section-h-icon{width:36px; height:36px}
}


/* ============================================================ */
/* === UX POLISH v2 - section heading + contrast ============= */
/* ============================================================ */

.section-heading{
  display:flex; flex-direction:column; align-items:flex-start;
  gap:10px; margin-bottom:var(--s-5);
}
.section-heading .eyebrow{margin-bottom:0}
.section-heading h2{
  display:flex; align-items:center; gap:var(--s-3);
  flex-wrap:wrap; margin:0;
}
.section-heading p.sub{margin:0}
.section-h-icon{
  width:40px; height:40px; border-radius:11px;
  background:linear-gradient(135deg, #99f6e4 0%, #5eead4 100%);
  color:var(--brand-3); display:inline-flex; align-items:center; justify-content:center;
  flex-shrink:0;
}

.feature-card{
  background:linear-gradient(180deg, #ffffff 0%, #fafbfc 100%);
  border:1px solid #d6deea;
  border-radius:var(--radius-lg);
  padding:var(--s-5);
  box-shadow:0 1px 2px rgba(15,23,42,.04), 0 4px 12px rgba(15,23,42,.04);
  transition:border-color var(--t), box-shadow var(--t), transform var(--t);
}
.feature-card:hover{
  border-color:var(--brand-soft);
  box-shadow:0 1px 2px rgba(15,23,42,.04), 0 12px 28px rgba(13,148,136,.12);
  transform:translateY(-2px);
}
.feature-card-icon{
  background:linear-gradient(135deg, #99f6e4 0%, #5eead4 100%);
  color:var(--brand-3);
}

.card{
  background:linear-gradient(180deg, #ffffff 0%, #fafbfc 100%);
  border:1px solid #d6deea;
  box-shadow:0 1px 2px rgba(15,23,42,.04);
}
.card:hover{
  border-color:var(--brand-soft);
  box-shadow:0 1px 2px rgba(15,23,42,.04), 0 12px 28px rgba(13,148,136,.12);
  transform:translateY(-2px);
}
.card .card-icon{
  background:linear-gradient(135deg, #99f6e4 0%, #5eead4 100%);
  color:var(--brand-3);
}

.list-card{
  background:#fff;
  border:1px solid #d6deea;
  box-shadow:0 1px 2px rgba(15,23,42,.03);
}
.list-card:hover{
  background:linear-gradient(90deg, #fff 0%, #f0fdfa 100%);
  border-color:var(--brand);
  box-shadow:0 4px 16px rgba(13,148,136,.12);
}
.list-card-icon{
  background:linear-gradient(135deg, #99f6e4 0%, #5eead4 100%);
  color:var(--brand-3);
}

.kpi-icon{
  background:linear-gradient(135deg, #99f6e4 0%, #5eead4 100%);
  color:var(--brand-3);
}

.fact-strip{
  background:linear-gradient(135deg, #f0fdfa 0%, #e6fffa 100%);
  border:1px solid #b2f5ea;
  box-shadow:0 1px 2px rgba(15,23,42,.03);
}
.fact-strip-icon{
  background:#fff; color:var(--brand-3);
  border:1px solid #99f6e4;
  box-shadow:0 1px 2px rgba(13,148,136,.06);
}

.trust-item{
  background:#fff; border:1px solid #d6deea; border-radius:var(--radius-lg);
  padding:var(--s-4);
  box-shadow:0 1px 2px rgba(15,23,42,.04);
}
.trust-icon{
  background:linear-gradient(135deg, #99f6e4 0%, #5eead4 100%);
  color:var(--brand-3);
}

.step-item{
  background:linear-gradient(180deg, #ffffff 0%, #fafbfc 100%);
  border:1px solid #d6deea;
  box-shadow:0 1px 2px rgba(15,23,42,.04);
}
.step-num{
  background:linear-gradient(135deg, var(--brand) 0%, var(--brand-3) 100%);
  box-shadow:0 4px 10px rgba(13,148,136,.30);
}

.prose-block .lead-card{
  background:linear-gradient(135deg, #f0fdfa 0%, #e6fffa 100%);
  border:1px solid #b2f5ea;
  box-shadow:0 1px 2px rgba(15,23,42,.04);
}
.prose-block .lead-card-icon{
  background:#fff; color:var(--brand-3);
  border:1px solid #99f6e4;
  box-shadow:0 2px 6px rgba(13,148,136,.08);
}

.suburb-card{
  background:#fff; border:1px solid #d6deea;
  box-shadow:0 1px 2px rgba(15,23,42,.03);
}
.suburb-card:hover{
  border-color:var(--brand-soft);
  background:linear-gradient(90deg, #fff 0%, #f0fdfa 100%);
}

.fact{
  background:#fff; border:1px solid #d6deea;
  box-shadow:0 1px 2px rgba(15,23,42,.03);
}
.fact-icon{
  background:linear-gradient(135deg, #99f6e4 0%, #5eead4 100%);
  color:var(--brand-3);
  border:none;
}

.eyebrow{
  background:linear-gradient(135deg, #ccfbf1 0%, #99f6e4 100%);
  color:var(--brand-3);
  border:1px solid #b2f5ea;
}
.hero .eyebrow, .cta-band .eyebrow, .hero .hero-eyebrow, .cta-band-eyebrow{
  background:rgba(255,255,255,.16); color:#fff;
  border:1px solid rgba(255,255,255,.24);
}

.tag{
  background:linear-gradient(135deg, #ccfbf1 0%, #99f6e4 100%);
  color:var(--brand-3); border:1px solid #b2f5ea;
}

.section-heading h2 .section-h-icon{margin-right:2px}

@media (max-width:600px){
  .section-h-icon{width:36px; height:36px}
  .section-heading h2{font-size:var(--t-lg)}
}

.cta{
  box-shadow:0 1px 2px rgba(15,23,42,.06), 0 4px 12px rgba(13,148,136,.12);
}
.cta:hover{
  box-shadow:0 2px 4px rgba(15,23,42,.08), 0 10px 22px rgba(13,148,136,.22);
}
.cta.ghost, .cta.outline, .cta.cta-light{box-shadow:0 1px 2px rgba(15,23,42,.05)}
.cta.ghost:hover, .cta.outline:hover, .cta.cta-light:hover{box-shadow:0 4px 12px rgba(15,23,42,.10)}
