/* =========================================================
   Midway Motion & Fitness — Design System
   Rehoboth Beach, DE
   ========================================================= */

/* ---------- Tokens ---------- */
:root{
  /* Brand accent — baby blue */
  --red:#7EC8E3;
  --red-hi:#9FDCF2;
  --red-dim:#4A9FC7;
  --blue:#0088CB;
  --blue-hi:#2BA8E6;
  --yellow:#FFCB05;

  /* Neutrals */
  --ink:#0A0A0B;
  --ink-2:#121214;
  --ink-3:#1A1A1D;
  --ink-4:#232327;
  --paper:#FFFFFF;
  --paper-2:#F5F5F3;
  --paper-3:#EAEAE6;

  --fg:#FFFFFF;
  --fg-2:#C9C9CF;
  --fg-3:#8B8B93;
  --line:rgba(255,255,255,.11);
  --line-2:rgba(255,255,255,.06);

  /* Type */
  --display:"Barlow Condensed",'Arial Narrow',Impact,system-ui,sans-serif;
  --body:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;

  /* Scale — fluid */
  --t-hero:clamp(2.9rem,8.6vw,8.6rem);
  --t-h1:clamp(2.6rem,6.4vw,6rem);
  --t-h2:clamp(2rem,4.6vw,4rem);
  --t-h3:clamp(1.35rem,2.2vw,2rem);
  --t-lead:clamp(1.05rem,1.45vw,1.35rem);
  --t-body:clamp(1rem,1.05vw,1.075rem);
  --t-sm:.875rem;
  --t-xs:.75rem;

  /* Space */
  --gut:clamp(1.25rem,4vw,3.5rem);
  --sec:clamp(4.5rem,10vw,9.5rem);
  --max:1320px;
  --max-read:68ch;

  --r-sm:6px; --r:14px; --r-lg:24px;
  --ease:cubic-bezier(.22,1,.36,1);
  --ease-io:cubic-bezier(.65,0,.35,1);
}

/* ---------- Reset ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{
  margin:0;background:var(--ink);color:var(--fg);
  font-family:var(--body);font-size:var(--t-body);line-height:1.65;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
  /* overflow-x:clip contains horizontal overflow WITHOUT making body a scroll
     container. overflow-x:hidden here computes overflow-y:auto, which makes
     ScrollTrigger read body.scrollTop (always 0) and silently breaks every
     scroll-triggered reveal on the site. Do not change this back to hidden. */
  overflow-x:clip;
}
@supports not (overflow: clip){
  html{overflow-x:hidden}
  body{overflow-x:visible}
}
img,svg,video{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
button,input,textarea,select{font:inherit;color:inherit}
h1,h2,h3,h4,h5{margin:0;font-family:var(--display);font-weight:800;line-height:.95;letter-spacing:-.02em;text-transform:uppercase}
p{margin:0 0 1.15em}
ul,ol{margin:0 0 1.15em;padding-left:1.25em}
hr{border:0;border-top:1px solid var(--line);margin:2.5rem 0}
::selection{background:var(--red);color:#fff}

/* ---------- Layout ---------- */
.wrap{width:min(100% - (var(--gut)*2),var(--max));margin-inline:auto}
.wrap--wide{width:min(100% - (var(--gut)*2),1560px);margin-inline:auto}
.wrap--read{width:min(100% - (var(--gut)*2),var(--max-read));margin-inline:auto}
.section{padding-block:var(--sec);position:relative}
.section--tight{padding-block:clamp(3rem,6vw,5.5rem)}
.section--light{background:var(--paper);color:var(--ink)}
.section--paper{background:var(--paper-2);color:var(--ink)}
.section--ink2{background:var(--ink-2)}
.section--light h1,.section--light h2,.section--light h3,
.section--paper h1,.section--paper h2,.section--paper h3{color:var(--ink)}

.stack>*+*{margin-top:var(--s,1.5rem)}
.grid{display:grid;gap:clamp(1rem,2vw,1.75rem)}
.g-2{grid-template-columns:repeat(2,1fr)}
.g-3{grid-template-columns:repeat(3,1fr)}
.g-4{grid-template-columns:repeat(4,1fr)}
@media (max-width:960px){.g-3,.g-4{grid-template-columns:repeat(2,1fr)}}
@media (max-width:620px){.g-2,.g-3,.g-4{grid-template-columns:1fr}}

/* ---------- Type helpers ---------- */
.eyebrow{
  font-family:var(--body);font-size:var(--t-xs);font-weight:700;
  letter-spacing:.22em;text-transform:uppercase;color:var(--red);
  display:inline-flex;align-items:center;gap:.7em;margin:0 0 1.1rem;
}
.eyebrow::before{content:"";width:2.2rem;height:2px;background:var(--red);display:block}
.eyebrow--blue{color:var(--blue-hi)}.eyebrow--blue::before{background:var(--blue-hi)}
.eyebrow--ink{color:var(--red)}
.h-hero{font-size:var(--t-hero);font-weight:900;letter-spacing:-.035em;line-height:.86}
.h1{font-size:var(--t-h1)}
.h2{font-size:var(--t-h2)}
.h3{font-size:var(--t-h3);letter-spacing:-.01em}
.lead{font-size:var(--t-lead);line-height:1.55;color:var(--fg-2);max-width:60ch}
.section--light .lead,.section--paper .lead{color:#44444C}
.muted{color:var(--fg-3)}
.section--light .muted,.section--paper .muted{color:#6B6B75}
.accent{color:var(--red)}
.outline-txt{-webkit-text-stroke:1.5px var(--red);color:transparent}

/* ---------- Buttons ---------- */
.btn{
  --bg:var(--red);--bd:var(--red);--fg-b:#fff;
  display:inline-flex;align-items:center;justify-content:center;gap:.65em;
  padding:1.05em 2.1em;border:1.5px solid var(--bd);background:var(--bg);color:var(--fg-b);
  font-family:var(--body);font-weight:700;font-size:.82rem;letter-spacing:.14em;text-transform:uppercase;
  border-radius:999px;cursor:pointer;position:relative;overflow:hidden;isolation:isolate;
  transition:transform .35s var(--ease),box-shadow .35s var(--ease),color .3s var(--ease);
  will-change:transform;
}
.btn::after{
  content:"";position:absolute;inset:0;background:#fff;z-index:-1;
  transform:translateY(101%);transition:transform .45s var(--ease);
}
.btn:hover{transform:translateY(-3px);box-shadow:0 14px 34px -12px rgba(126,200,227,.65)}
.btn:hover::after{transform:translateY(0)}
.btn:hover{color:var(--red)}
.btn:focus-visible{outline:3px solid var(--yellow);outline-offset:3px}
.btn .ar{transition:transform .4s var(--ease)}
.btn:hover .ar{transform:translateX(4px)}

.btn--ghost{--bg:transparent;--bd:rgba(255,255,255,.32);--fg-b:#fff}
.btn--ghost:hover{color:var(--ink);box-shadow:0 14px 34px -14px rgba(255,255,255,.4)}
.btn--ghost::after{background:#fff}
.btn--dark{--bg:var(--ink);--bd:var(--ink);--fg-b:#fff}
.btn--dark:hover{color:var(--ink)}
.btn--dark::after{background:var(--yellow)}
.btn--blue{--bg:var(--blue);--bd:var(--blue)}
.btn--blue:hover{color:var(--blue);box-shadow:0 14px 34px -12px rgba(0,136,203,.6)}
.btn--sm{padding:.8em 1.5em;font-size:.72rem}
.btn-row{display:flex;flex-wrap:wrap;gap:.85rem;align-items:center}

/* ---------- Header / Nav ---------- */
.hdr{
  position:fixed;inset:0 0 auto 0;z-index:200;
  padding:1.15rem 0;transition:padding .4s var(--ease),background .4s var(--ease),backdrop-filter .4s var(--ease),border-color .4s var(--ease);
  border-bottom:1px solid transparent;
}
.hdr.is-stuck{
  padding:.6rem 0;background:rgba(10,10,11,.86);
  -webkit-backdrop-filter:saturate(160%) blur(18px);backdrop-filter:saturate(160%) blur(18px);
  border-bottom-color:var(--line);
}
.hdr__in{display:flex;align-items:center;justify-content:space-between;gap:1.5rem}
.brand{display:flex;align-items:center;gap:.8rem;flex:0 0 auto}
.brand img{height:clamp(72px,9vw,132px);width:auto;transition:height .4s var(--ease)}
.hdr.is-stuck .brand img{height:clamp(56px,6.4vw,88px)}
.brand__txt{font-family:var(--display);font-weight:800;font-size:1.05rem;line-height:1;letter-spacing:.01em;text-transform:uppercase}
.brand__txt span{display:block;font-size:.58rem;font-family:var(--body);font-weight:600;letter-spacing:.24em;color:var(--fg-3);margin-top:.28em}

.nav{display:flex;align-items:center;gap:clamp(.6rem,1.6vw,1.9rem)}
.nav a{
  position:relative;font-size:.79rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;
  padding:.45em 0;color:var(--fg-2);transition:color .3s var(--ease);white-space:nowrap;
}
.nav a::after{
  content:"";position:absolute;left:0;bottom:0;height:2px;width:100%;background:var(--red);
  transform:scaleX(0);transform-origin:right;transition:transform .42s var(--ease);
}
.nav a:hover,.nav a[aria-current="page"]{color:#fff}
.nav a:hover::after,.nav a[aria-current="page"]::after{transform:scaleX(1);transform-origin:left}
.nav__cta{margin-left:.6rem}

/* --- Header CTA -------------------------------------------------------
   `.nav a` (specificity 0,0,1,1) outranks `.btn` (0,0,1,0), so the nav's
   link styles were quietly winning over the button's: padding collapsed to
   `.45em 0` (no horizontal padding at all — the text sat on the pill edge),
   the white fill sweep was replaced by the nav underline, and the hover
   colour stayed white so the label vanished against the white fill.
   Everything below re-asserts the button at matching-or-higher specificity.
   Keep the `.nav a.btn` prefix on these — plain `.btn` will not win here. */
.nav a.btn{
  padding:1.15em 2.3em;
  font-size:.84rem;
  color:#fff;
}
.nav a.btn::after{
  content:"";position:absolute;inset:0;width:auto;height:auto;
  background:#fff;z-index:-1;
  transform:translateY(101%);transform-origin:center;
  transition:transform .45s var(--ease);
}
.nav a.btn:hover{color:var(--red)}
.nav a.btn:hover::after{transform:translateY(0)}
.hdr.is-stuck .nav a.btn{padding:.95em 1.95em;font-size:.78rem}
/* Nav gets tight between the big logo and the CTA before the burger kicks
   in at 1080px — ease the CTA back rather than let the row wrap. */
@media (max-width:1240px){
  .nav a.btn{padding:.95em 1.75em;font-size:.78rem}
  .hdr.is-stuck .nav a.btn{padding:.85em 1.6em;font-size:.74rem}
}
@media (max-width:1080px){.nav--main{display:none}}

.burger{
  display:none;width:46px;height:46px;border:1px solid var(--line);background:transparent;
  border-radius:999px;cursor:pointer;place-items:center;flex:0 0 auto;transition:background .3s
}
.burger:hover{background:rgba(255,255,255,.07)}
.burger span{display:block;width:18px;height:1.6px;background:#fff;margin:3.2px auto;transition:transform .4s var(--ease),opacity .3s}
@media (max-width:1080px){.burger{display:grid}}
body.menu-open .burger span:nth-child(1){transform:translateY(4.8px) rotate(45deg)}
body.menu-open .burger span:nth-child(2){opacity:0}
body.menu-open .burger span:nth-child(3){transform:translateY(-4.8px) rotate(-45deg)}

.drawer{
  position:fixed;inset:0;z-index:190;background:var(--ink);
  display:flex;flex-direction:column;justify-content:center;padding:6rem var(--gut) 3rem;
  clip-path:inset(0 0 100% 0);pointer-events:none;
}
.drawer.is-open{pointer-events:auto}
.drawer a{
  font-family:var(--display);font-weight:800;text-transform:uppercase;letter-spacing:-.01em;
  font-size:clamp(2rem,7vw,3.6rem);line-height:1.08;color:var(--fg);padding:.12em 0;
  display:block;transition:color .3s var(--ease),transform .4s var(--ease);
}
.drawer a:hover{color:var(--red);transform:translateX(12px)}
.drawer__meta{margin-top:2.5rem;border-top:1px solid var(--line);padding-top:1.5rem;color:var(--fg-3);font-size:.88rem}
.drawer__meta a{font-family:var(--body);font-size:.88rem;text-transform:none;letter-spacing:0;display:inline;font-weight:600;color:var(--fg-2)}

/* ---------- Hero ---------- */
.hero{position:relative;min-height:100svh;display:grid;align-items:end;overflow:hidden;isolation:isolate}
.hero__media{position:absolute;inset:-8% 0 -8% 0;z-index:-2;will-change:transform}
.hero__media img{width:100%;height:100%;object-fit:cover;object-position:center 42%}
.hero::before{
  content:"";position:absolute;inset:0;z-index:-1;
  background:
    linear-gradient(180deg,rgba(10,10,11,.82) 0%,rgba(10,10,11,.30) 34%,rgba(10,10,11,.62) 68%,var(--ink) 100%),
    radial-gradient(90% 70% at 12% 88%,rgba(126,200,227,.30),transparent 62%);
}
.hero__in{padding-block:clamp(10rem,22vh,13.5rem) clamp(3.5rem,9vh,6rem);position:relative}
.hero__kicker{
  display:inline-flex;align-items:center;gap:.7rem;padding:.5rem 1.1rem;border:1px solid rgba(255,255,255,.26);
  border-radius:999px;font-size:.7rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:rgba(255,255,255,.06);margin-bottom:1.6rem;
}
.hero__kicker .dot{width:7px;height:7px;border-radius:50%;background:var(--red);animation:pulse 2.4s infinite}
@keyframes pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.45;transform:scale(.75)}}
.hero h1{margin-bottom:1.5rem}
.hero h1 .ln{display:block;overflow:hidden}
.hero h1 .ln i{display:block;font-style:normal;will-change:transform}
.hero__lead{max-width:52ch;font-size:var(--t-lead);color:#E4E4EA;margin-bottom:2.2rem}
/* Oversized brand mark on the open right-hand side of the hero. Decorative and
   click-through; centred by flex so GSAP can animate the img's own transform. */
.hero__mark{
  /* Height is pinned to the viewport, not the hero: the hero runs taller than
     one screen (bottom-aligned copy + header clearance), so centring on it
     would drop the mark below the fold. */
  position:absolute;top:0;left:0;right:0;height:100svh;
  display:flex;align-items:center;justify-content:flex-end;
  padding-right:clamp(2rem,7vw,8rem);pointer-events:none;z-index:0;
}
.hero__mark img{
  width:clamp(240px,28vw,540px);height:auto;display:block;margin-top:5vh;
  filter:drop-shadow(0 22px 52px rgba(0,0,0,.55));
}
/* Below this the headline claims the full width — there is no empty side left */
@media (max-width:1100px){.hero__mark{display:none}}
.hero__scroll{
  position:absolute;right:var(--gut);bottom:clamp(2rem,5vh,3.4rem);
  writing-mode:vertical-rl;font-size:.66rem;letter-spacing:.28em;text-transform:uppercase;color:var(--fg-3);
  display:flex;align-items:center;gap:.9rem;
}
.hero__scroll::after{content:"";width:1px;height:64px;background:linear-gradient(var(--red),transparent)}
@media (max-width:760px){.hero__scroll{display:none}}

/* Hero stat strip */
.hero__stats{
  display:flex;flex-wrap:wrap;gap:clamp(1.5rem,4vw,3.6rem);
  margin-top:2.8rem;padding-top:1.9rem;border-top:1px solid var(--line);
}
.hstat b{display:block;font-family:var(--display);font-size:clamp(2rem,3.4vw,3rem);font-weight:800;line-height:1;color:#fff}
.hstat b span{font:inherit;letter-spacing:inherit;text-transform:none;color:inherit}
.hstat > span{font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--fg-3);font-weight:600}

/* Live "how busy are we" meter — fills based on time of day, see main.js.
   Sits to the right of the "Right Now" caption, same fonts/colors as the
   other hero stats — just this tile lays its two spans out inline. */
.hstat--busy > span{vertical-align:middle}
.hstat--busy .busy-meter{
  display:inline-block;vertical-align:middle;margin-left:.75rem;
  width:132px;max-width:38vw;height:1.05rem;
  border-radius:999px;background:rgba(255,255,255,.16);
  overflow:hidden;box-shadow:inset 0 0 0 1px rgba(255,255,255,.08);
}
.hstat--busy .busy-meter__fill{
  display:block;height:100%;width:6%;border-radius:inherit;
  background:linear-gradient(90deg,var(--yellow),var(--red));
  transition:width 1.1s ease;
}

/* ---------- Marquee ---------- */
.marquee{
  background:var(--red);color:#fff;padding:.95rem 0;overflow:hidden;
  border-block:1px solid rgba(0,0,0,.15);
}
.marquee--blue{background:var(--blue)}
.marquee--yellow{background:var(--yellow);color:var(--ink)}
.marquee__track{display:flex;gap:0;width:max-content;will-change:transform}
.marquee__track span{
  font-family:var(--display);font-weight:800;text-transform:uppercase;
  font-size:clamp(1.1rem,2vw,1.6rem);letter-spacing:.02em;padding-inline:1.5rem;
  display:inline-flex;align-items:center;gap:1.5rem;white-space:nowrap;
}
.marquee__track span::after{content:"";width:8px;height:8px;border-radius:50%;background:currentColor;opacity:.55}

/* ---------- Cards ---------- */
.card{
  background:var(--ink-2);border:1px solid var(--line);border-radius:var(--r);
  padding:clamp(1.5rem,2.4vw,2.2rem);position:relative;overflow:hidden;
  transition:transform .5s var(--ease),border-color .4s var(--ease),background .4s var(--ease);
}
.card::before{
  content:"";position:absolute;left:0;top:0;height:3px;width:100%;background:var(--red);
  transform:scaleX(0);transform-origin:left;transition:transform .5s var(--ease);
}
.card:hover{transform:translateY(-6px);border-color:rgba(255,255,255,.2);background:var(--ink-3)}
.card:hover::before{transform:scaleX(1)}
.card h3{margin-bottom:.6rem}
.card p:last-child{margin-bottom:0}
.section--light .card,.section--paper .card{background:#fff;border-color:rgba(0,0,0,.09);color:var(--ink)}
.section--light .card:hover,.section--paper .card:hover{background:#fff;box-shadow:0 24px 50px -28px rgba(0,0,0,.35)}
.section--light .card p,.section--paper .card p{color:#4A4A52}

.card__num{
  font-family:var(--display);font-size:3.4rem;font-weight:800;line-height:1;
  color:transparent;-webkit-text-stroke:1.2px rgba(255,255,255,.22);margin-bottom:.9rem;display:block;
}
.section--light .card__num,.section--paper .card__num{-webkit-text-stroke-color:rgba(0,0,0,.18)}

/* ---------- Split feature ---------- */
.split{display:grid;grid-template-columns:1.05fr 1fr;gap:clamp(2rem,5vw,5rem);align-items:center}
.split--rev .split__media{order:2}
@media (max-width:920px){.split{grid-template-columns:1fr}.split--rev .split__media{order:0}}
.split__media{position:relative;border-radius:var(--r-lg);overflow:hidden;aspect-ratio:4/3;background:var(--ink-3)}
.split__media img{width:100%;height:100%;object-fit:cover;will-change:transform}
.split__media img.app-shot{object-fit:contain;background:#eef1f3;padding:2.2rem}
.split__media--phone{aspect-ratio:3/4}
.split__media::after{content:"";position:absolute;inset:0;background:linear-gradient(160deg,transparent 55%,rgba(126,200,227,.16))}

/* ---------- Amenities / gallery ---------- */
.gal{display:grid;grid-template-columns:repeat(12,1fr);grid-auto-flow:dense;gap:clamp(.6rem,1.1vw,1rem)}
.gal figure{margin:0;position:relative;overflow:hidden;border-radius:var(--r);background:var(--ink-3)}
.gal img{width:100%;height:100%;object-fit:cover;transition:transform 1.1s var(--ease)}
.gal figure:hover img{transform:scale(1.06)}
.gal figcaption{
  position:absolute;left:0;right:0;bottom:0;padding:1.4rem 1.2rem .95rem;
  background:linear-gradient(transparent,rgba(10,10,11,.9));
  font-family:var(--display);text-transform:uppercase;font-weight:700;font-size:1rem;letter-spacing:.02em;color:#fff;
}
.gal .s4{grid-column:span 4;aspect-ratio:4/3}
.gal .s6{grid-column:span 6;aspect-ratio:16/10}
.gal .s8{grid-column:span 8;aspect-ratio:16/9}
.gal .s3{grid-column:span 3;aspect-ratio:1}
@media (max-width:900px){.gal .s4,.gal .s6,.gal .s8{grid-column:span 6}.gal .s3{grid-column:span 6}}
@media (max-width:560px){.gal figure{grid-column:span 12 !important}}

/* ---------- Accordion (classes) ---------- */
.acc{border-top:1px solid var(--line)}
.section--light .acc,.section--paper .acc{border-color:rgba(0,0,0,.12)}
.acc__item{border-bottom:1px solid var(--line)}
.section--light .acc__item,.section--paper .acc__item{border-color:rgba(0,0,0,.12)}
.acc__btn{
  width:100%;background:none;border:0;text-align:left;cursor:pointer;
  display:flex;align-items:center;gap:1.2rem;padding:clamp(1.1rem,2.1vw,1.7rem) 0;
  font-family:var(--display);text-transform:uppercase;font-weight:800;letter-spacing:-.005em;
  font-size:clamp(1.35rem,2.7vw,2.1rem);line-height:1.05;color:inherit;
  transition:color .3s var(--ease),padding-left .4s var(--ease);
}
.acc__btn:hover{color:var(--red);padding-left:.55rem}
.acc__btn:focus-visible{outline:3px solid var(--yellow);outline-offset:2px}
.acc__idx{font-family:var(--body);font-size:.7rem;font-weight:700;letter-spacing:.12em;color:var(--fg-3);flex:0 0 auto;width:2.4rem;padding-top:.35em}
.section--light .acc__idx,.section--paper .acc__idx{color:#8A8A94}
.acc__ic{margin-left:auto;flex:0 0 auto;width:34px;height:34px;border:1px solid var(--line);border-radius:50%;display:grid;place-items:center;position:relative;transition:background .35s,border-color .35s,transform .45s var(--ease)}
.section--light .acc__ic,.section--paper .acc__ic{border-color:rgba(0,0,0,.16)}
.acc__ic::before,.acc__ic::after{content:"";position:absolute;background:currentColor;transition:transform .4s var(--ease),opacity .3s}
.acc__ic::before{width:12px;height:1.6px}
.acc__ic::after{width:1.6px;height:12px}
.acc__btn[aria-expanded="true"] .acc__ic{background:var(--red);border-color:var(--red);color:#fff;transform:rotate(180deg)}
.acc__btn[aria-expanded="true"] .acc__ic::after{transform:scaleY(0);opacity:0}
.acc__panel{overflow:hidden;height:0}
.acc__inner{padding:0 0 1.9rem 3.6rem;max-width:72ch;color:var(--fg-2)}
.section--light .acc__inner,.section--paper .acc__inner{color:#4A4A52}
@media (max-width:600px){.acc__inner{padding-left:0}.acc__idx{display:none}}

/* ---------- Trainers ---------- */
.trainer{
  background:var(--ink-2);border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;
  display:flex;flex-direction:column;transition:transform .5s var(--ease),border-color .4s;
}
.trainer:hover{transform:translateY(-8px);border-color:rgba(255,255,255,.22)}
.trainer__ph{aspect-ratio:4/5;overflow:hidden;background:var(--ink-3);position:relative}
.trainer__ph img{width:100%;height:100%;object-fit:cover;object-position:center 22%;transition:transform 1s var(--ease),filter .6s}
.trainer:hover .trainer__ph img{transform:scale(1.05)}
.trainer__ph::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 52%,rgba(10,10,11,.88))}
.trainer__name{position:absolute;left:1.35rem;right:1.35rem;bottom:1.1rem;z-index:2}
.trainer__name h3{font-size:clamp(1.3rem,2vw,1.7rem);color:#fff}
.trainer__name .role{font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;color:var(--red-hi);font-weight:700;margin-top:.3rem;display:block}
.trainer__bd{padding:1.5rem;flex:1;display:flex;flex-direction:column;gap:1rem}
.trainer__bd p{color:var(--fg-2);font-size:.95rem;margin:0}
.trainer__cred{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.5rem}
.trainer__cred li{position:relative;padding-left:1.15rem;font-size:.88rem;color:var(--fg-2);line-height:1.5}
.trainer__cred li::before{content:"";position:absolute;left:0;top:.62em;width:5px;height:5px;background:var(--red);border-radius:50%}
.trainer__ct{margin-top:auto;padding-top:1.1rem;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:.35rem}
.trainer__ct a{font-size:.85rem;color:var(--fg-2);display:inline-flex;align-items:center;gap:.55rem;transition:color .3s;word-break:break-word}
.trainer__ct a:hover{color:var(--red-hi)}

/* ---------- Events ---------- */
.evt{
  display:grid;grid-template-columns:clamp(96px,11vw,140px) 1fr;gap:clamp(1.2rem,3vw,2.6rem);
  padding:clamp(1.6rem,3vw,2.4rem) 0;border-bottom:1px solid var(--line);align-items:start;
}
.evt__date{text-align:center;border:1px solid var(--line);border-radius:var(--r);padding:1rem .5rem;background:var(--ink-2)}
.evt__date .mo{display:block;font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;color:var(--red-hi);font-weight:700}
.evt__date .dy{display:block;font-family:var(--display);font-size:clamp(2.1rem,4vw,3rem);font-weight:800;line-height:1;margin-top:.2rem}
.evt__date .wd{display:block;font-size:.64rem;letter-spacing:.16em;text-transform:uppercase;color:var(--fg-3);margin-top:.35rem;font-weight:600}
.evt h3{margin-bottom:.7rem}
.evt__meta{display:flex;flex-wrap:wrap;gap:.5rem .9rem;margin-bottom:.9rem}
.evt__meta span{
  font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;font-weight:600;color:var(--fg-2);
  border:1px solid var(--line);border-radius:999px;padding:.35em .95em;
}
.evt p{color:var(--fg-2);margin-bottom:0}
@media (max-width:560px){.evt{grid-template-columns:1fr}.evt__date{display:inline-block;min-width:110px}}

/* ---------- Blog ---------- */
.post-card{
  display:flex;flex-direction:column;background:var(--ink-2);border:1px solid var(--line);
  border-radius:var(--r-lg);overflow:hidden;transition:transform .5s var(--ease),border-color .4s;height:100%;
}
.post-card:hover{transform:translateY(-8px);border-color:rgba(255,255,255,.22)}
.post-card__ph{aspect-ratio:16/10;overflow:hidden;background:var(--ink-3)}
.post-card__ph img{width:100%;height:100%;object-fit:cover;transition:transform 1s var(--ease)}
.post-card:hover .post-card__ph img{transform:scale(1.06)}
.post-card__bd{padding:1.6rem;display:flex;flex-direction:column;gap:.85rem;flex:1}
.post-card__meta{font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--fg-3);font-weight:600}
.post-card h3{font-size:clamp(1.15rem,1.7vw,1.45rem);line-height:1.12}
.post-card p{color:var(--fg-2);font-size:.93rem;margin:0}
.post-card__more{margin-top:auto;font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;font-weight:700;color:var(--red-hi);display:inline-flex;gap:.5rem;align-items:center}

.book-card__ph{aspect-ratio:3/4;background:#fff}
.book-card__ph img{object-fit:contain;padding:.9rem;box-sizing:border-box}

/* ---------- Meet the Staff ---------- */
/* Staff page */
.crew-intro{display:grid;grid-template-columns:1fr;gap:1.2rem 4rem;align-items:end}
@media (min-width:960px){.crew-intro{grid-template-columns:1.1fr 1fr}.crew-intro .h2{margin-bottom:0}}
.crew-intro .lead{margin:0}
.crew-owners{
  display:flex;align-items:center;gap:clamp(1.2rem,3vw,2.2rem);flex-wrap:wrap;
  padding:clamp(1.5rem,3.5vw,2.4rem);border-radius:var(--r-lg);border:1px solid rgba(126,200,227,.3);
  background:radial-gradient(120% 140% at 0% 0%,rgba(126,200,227,.16),transparent 60%),var(--ink-2)
}
.crew-owners__avs{display:flex}
.crew-owners__avs span{
  width:clamp(64px,8vw,84px);aspect-ratio:1;border-radius:50%;display:grid;place-items:center;
  font-family:var(--display);font-weight:800;font-size:clamp(1.4rem,2.4vw,1.9rem);color:var(--ink);
  background:var(--red);border:3px solid var(--ink-2)
}
.crew-owners__avs span+span{margin-left:-.9rem;background:var(--red-hi)}
.crew-owners__role{display:block;font-size:var(--t-xs);font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--red);margin-bottom:.35rem}
.crew-owners h3{font-size:clamp(1.6rem,3.4vw,2.6rem);color:#fff;margin:0;line-height:1.05}
.crew-owners h3 em{font-style:normal;color:var(--red)}

.crew{display:grid;gap:clamp(2.6rem,5vw,4rem);margin-top:clamp(2.6rem,5vw,4rem)}
.crew-group{--acc:var(--red)}
.crew-group--warriors{--acc:var(--red)}
.crew-group--staff{--acc:var(--blue-hi)}
.crew-group--instructors{--acc:var(--yellow)}

.crew-group__hd{display:flex;align-items:baseline;justify-content:space-between;gap:1rem;padding-bottom:.9rem;margin-bottom:1.3rem;border-bottom:1px solid var(--line);position:relative}
.crew-group__hd::after{content:"";position:absolute;left:0;bottom:-1px;width:4.5rem;height:2px;background:var(--acc)}
.crew-group__hd h3{font-size:clamp(1.4rem,2.6vw,2rem);color:#fff;margin:0}
.crew-group__count{font-size:var(--t-xs);font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--fg-3);white-space:nowrap}
.crew-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:.9rem}
.crew-card{
  display:flex;align-items:center;gap:1rem;padding:1rem 1.1rem;border-radius:var(--r);
  background:var(--ink-2);border:1px solid var(--line-2);
  transition:border-color .3s var(--ease),transform .3s var(--ease),background .3s var(--ease)
}
.crew-card:hover{border-color:var(--acc);transform:translateY(-3px);background:var(--ink-3)}
.crew-card__av{
  flex:none;width:52px;height:52px;border-radius:50%;display:grid;place-items:center;
  font-family:var(--display);font-weight:800;font-size:1.15rem;letter-spacing:.02em;
  color:var(--acc);border:1.5px solid var(--acc);background:color-mix(in srgb,var(--acc) 12%,transparent)
}
.crew-card__txt{min-width:0}
.crew-card__txt b{display:block;color:#fff;font-size:1rem;font-weight:700;line-height:1.25}
.crew-card__txt span{display:block;margin-top:.25rem;font-size:.72rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--fg-3);line-height:1.4}

/* Article */
.article{background:var(--paper);color:var(--ink)}
.article__hd{padding-block:clamp(11rem,22vh,14rem) clamp(2rem,4vw,3rem);background:var(--ink)}
.article__hd h1{color:#fff;max-width:22ch}
.article__meta{display:flex;flex-wrap:wrap;gap:.5rem 1.4rem;margin-top:1.5rem;font-size:.76rem;letter-spacing:.14em;text-transform:uppercase;color:var(--fg-3);font-weight:600}
.article__body{padding-block:clamp(3rem,7vw,5.5rem)}
.article__body p,.article__body li{font-size:1.075rem;line-height:1.78;color:#2A2A31}
.article__body h2{font-size:clamp(1.6rem,3vw,2.3rem);margin:2.6em 0 .7em;color:var(--ink)}
.article__body h3{font-size:clamp(1.2rem,2vw,1.55rem);margin:2em 0 .6em;color:var(--ink)}
.article__body h2:first-child,.article__body h3:first-child{margin-top:0}
.article__body strong{color:var(--ink);font-weight:700}
.article__body em{color:#3A3A42}
.article__body ul,.article__body ol{padding-left:1.35em}
.article__body li{margin-bottom:.7em}
.article__body li::marker{color:var(--red)}
.article__body blockquote{
  margin:2.2em 0;padding:1.4em 1.6em;border-left:4px solid var(--red);background:var(--paper-2);
  border-radius:0 var(--r) var(--r) 0;font-size:1.15rem;line-height:1.6;
}
.article__body blockquote p:last-child{margin-bottom:0}
.article__sig{margin-top:3rem;padding-top:1.6rem;border-top:2px solid var(--ink);font-weight:700;font-family:var(--display);text-transform:uppercase;font-size:1.2rem}

/* ---------- Video grid ---------- */
.vid{background:var(--ink-2);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;transition:transform .45s var(--ease),border-color .4s}
.vid:hover{transform:translateY(-6px);border-color:rgba(255,255,255,.22)}
.vid__ph{aspect-ratio:16/9;background:var(--ink-3);position:relative;overflow:hidden}
.vid__ph img{width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease)}
.vid:hover .vid__ph img{transform:scale(1.06)}
.vid__play{position:absolute;inset:0;display:grid;place-items:center}
.vid__play i{
  width:58px;height:58px;border-radius:50%;background:rgba(126,200,227,.94);display:grid;place-items:center;
  transition:transform .4s var(--ease);box-shadow:0 10px 30px -8px rgba(0,0,0,.6)
}
.vid:hover .vid__play i{transform:scale(1.12)}
.vid__play svg{width:18px;height:18px;fill:#fff;margin-left:3px}
.vid__bd{padding:1.1rem 1.2rem;display:flex;justify-content:space-between;align-items:center;gap:1rem}
.vid__bd h3{font-size:1rem}
.vid__len{font-size:.72rem;letter-spacing:.1em;color:var(--fg-3);font-weight:600;flex:0 0 auto}

/* ---------- Forms ---------- */
.form{display:grid;gap:1.1rem}
.form__ok{margin-top:1.4rem;padding:1.1rem 1.3rem;border-radius:var(--r);background:rgba(126,200,120,.14);border:1px solid rgba(126,200,120,.4);color:#fff;font-weight:600}
.form .row2{display:grid;grid-template-columns:1fr 1fr;gap:1.1rem}
@media (max-width:560px){.form .row2{grid-template-columns:1fr}}
.field label{display:block;font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;font-weight:700;color:var(--fg-3);margin-bottom:.5rem}
.field input,.field textarea{
  width:100%;background:var(--ink-2);border:1px solid var(--line);border-radius:var(--r-sm);
  padding:.95rem 1.1rem;color:#fff;transition:border-color .3s,background .3s;
}
.field textarea{min-height:150px;resize:vertical}
.field input:focus,.field textarea:focus{outline:none;border-color:var(--red);background:var(--ink-3)}
.field input::placeholder,.field textarea::placeholder{color:#5C5C66}

/* Tally embed (contact page). The form's own theme is set in Tally to these same
   tokens — ground #0A0A0B, inputs #121214, accent #ED1C24, Inter — so the iframe
   reads as part of the page. Min-height holds the layout before embed.js sizes it. */
.tally-wrap{position:relative}
.tally-wrap iframe{display:block;width:100%;min-height:520px;border:0;background:transparent}

/* ---------- Info tiles ---------- */
.info{display:grid;gap:1.5rem;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.info__i{padding:1.7rem;border:1px solid var(--line);border-radius:var(--r);background:var(--ink-2)}
.info__i h3{font-size:1.05rem;margin-bottom:.85rem;color:var(--red-hi)}
.info__i p,.info__i a{color:var(--fg-2);font-size:.95rem;margin:0}
.info__i a:hover{color:#fff}

/* ---------- Gym Store ---------- */
.shop-hero{
  position:relative;overflow:hidden;isolation:isolate;background:var(--ink);
  padding-block:clamp(8rem,17vh,11rem) clamp(3.5rem,8vh,6rem);
}
.shop-hero__in{position:relative}
.shop-hero .btn-row{margin-top:2.2rem}

/* Decorative scrolling wall of product shots */
.wall{position:absolute;inset:0;z-index:-1;display:grid;align-content:center;gap:clamp(.5rem,1.4vw,1.1rem);opacity:.17;filter:grayscale(1) contrast(1.15)}
.shop-hero::after{
  content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(100deg,var(--ink) 8%,rgba(10,10,11,.94) 42%,rgba(10,10,11,.6) 100%);
}
.wall__row{overflow:hidden}
.wall__t{display:flex;gap:clamp(.5rem,1.4vw,1.1rem);width:max-content;animation:wall 78s linear infinite}
.wall__row--rev .wall__t{animation-direction:reverse;animation-duration:96s}
.wall__i{flex:0 0 auto;width:clamp(108px,12vw,182px);aspect-ratio:1;border-radius:var(--r);overflow:hidden;background:#fff}
.wall__i img{width:100%;height:100%;object-fit:contain}
@keyframes wall{to{transform:translate3d(-50%,0,0)}}
@media (prefers-reduced-motion:reduce){.wall__t{animation:none}}

/* Section head with a note alongside */
.shop-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:1.5rem 3rem;margin-bottom:2.5rem}
.shop-head__note{max-width:44ch;font-size:.88rem;line-height:1.6;margin:0}

/* Category filter chips */
.chips{display:flex;flex-wrap:wrap;gap:.6rem;margin-bottom:clamp(1.75rem,3vw,2.5rem)}
.chip{
  font:inherit;font-size:.74rem;font-weight:700;letter-spacing:.13em;text-transform:uppercase;
  padding:.78em 1.35em;border-radius:999px;cursor:pointer;
  background:transparent;color:#4A4A52;border:1px solid rgba(0,0,0,.16);
  display:inline-flex;align-items:center;gap:.55em;
  transition:background .3s var(--ease),color .3s var(--ease),border-color .3s var(--ease),transform .3s var(--ease);
}
.chip span{font-size:.68em;opacity:.62;letter-spacing:.06em}
.chip:hover{border-color:var(--red);color:var(--red);transform:translateY(-2px)}
.chip.is-on{background:var(--ink);border-color:var(--ink);color:#fff}
.chip.is-on span{opacity:.72}
.chip:focus-visible{outline:3px solid var(--yellow);outline-offset:3px}

/* Product grid + card */
.prod-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(1rem,1.9vw,1.75rem)}
@media (max-width:1180px){.prod-grid{grid-template-columns:repeat(3,1fr)}}
@media (max-width:860px){.prod-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:380px){.prod-grid{grid-template-columns:1fr}}

.prod{
  display:flex;flex-direction:column;background:#fff;border:1px solid rgba(0,0,0,.09);
  border-radius:var(--r);overflow:hidden;color:var(--ink);text-decoration:none;
  transition:transform .45s var(--ease),box-shadow .45s var(--ease),border-color .35s;
}
.prod:hover{transform:translateY(-6px);border-color:rgba(0,0,0,.16);box-shadow:0 26px 54px -30px rgba(0,0,0,.42)}
.prod:focus-visible{outline:3px solid var(--red);outline-offset:3px}
.prod__ph{position:relative;display:block;aspect-ratio:1;background:#fff;overflow:hidden;border-bottom:1px solid rgba(0,0,0,.06)}
.prod__ph img{width:100%;height:100%;object-fit:contain;transition:transform 1s var(--ease)}
.prod:hover .prod__ph img{transform:scale(1.05)}
.prod__flag{
  position:absolute;top:.75rem;left:.75rem;background:var(--red);color:#fff;
  font-size:.62rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase;padding:.45em .85em;border-radius:999px;
}
.prod__bd{display:flex;flex-direction:column;gap:.5rem;padding:1.1rem 1.15rem 1.25rem;flex:1}
.prod__cat{font-size:.62rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--red)}
.prod__name{font-family:var(--display);font-weight:700;font-size:1.12rem;line-height:1.16;letter-spacing:.005em}
.prod__foot{display:flex;align-items:baseline;flex-wrap:wrap;gap:.6rem;margin-top:auto;padding-top:.35rem}
.prod__price{font-family:var(--display);font-weight:800;font-size:1.3rem;line-height:1;color:var(--ink)}
.prod__price s{font-size:.7em;font-weight:600;color:#8A8A94;margin-left:.4em}
.prod__colors{font-size:.72rem;font-weight:600;color:#6B6B75}
.prod__go{
  display:flex;align-items:center;gap:.45em;font-size:.7rem;font-weight:700;letter-spacing:.14em;
  text-transform:uppercase;color:var(--red);padding-top:.65rem;border-top:1px solid rgba(0,0,0,.08);
}
.prod:hover .prod__go .ar{transform:translateX(4px)}
.prod__go .ar{transition:transform .4s var(--ease)}
.prod[hidden]{display:none}
.shop-empty{margin-top:2rem;color:#6B6B75}
#gear,#how{scroll-margin-top:clamp(96px,13vh,140px)}
/* two columns on a phone means long garment names; tighten so they do not stack five deep */
@media (max-width:560px){.prod__name{font-size:1rem}.prod__bd{padding:.9rem .9rem 1.05rem;gap:.42rem}.prod__price{font-size:1.15rem}}

/* ---------- Footer ---------- */
.ftr{background:var(--ink-2);border-top:1px solid var(--line);padding-block:clamp(3.5rem,7vw,5.5rem) 2rem}
.ftr__top{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:clamp(1.8rem,4vw,3.5rem)}
@media (max-width:1000px){.ftr__top{grid-template-columns:1fr 1fr}}
@media (max-width:600px){.ftr__top{grid-template-columns:1fr}}
.ftr h4{font-size:.76rem;letter-spacing:.2em;text-transform:uppercase;color:#fff;margin-bottom:1.2rem;font-family:var(--body);font-weight:700}
.ftr ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.65rem}
.ftr a,.ftr p{color:var(--fg-3);font-size:.92rem;transition:color .3s}
.ftr a:hover{color:var(--red-hi)}
.ftr__brand img{height:110px;margin-bottom:1.4rem}
.ftr__hours{display:flex;flex-direction:column;gap:.5rem}
.ftr__hours div{display:flex;justify-content:space-between;gap:1rem;font-size:.92rem;color:var(--fg-3);border-bottom:1px dashed var(--line-2);padding-bottom:.5rem}
.ftr__hours b{color:#fff;font-weight:600}
.ftr__24{margin-top:.6rem;display:inline-flex;align-items:center;gap:.55rem;font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;font-weight:700;color:var(--yellow)}
.ftr__bot{margin-top:3.5rem;padding-top:1.6rem;border-top:1px solid var(--line);display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between;align-items:center}
.ftr__bot p{margin:0;font-size:.8rem;color:var(--fg-3)}
.social{display:flex;gap:.6rem}
.social a{width:40px;height:40px;border:1px solid var(--line);border-radius:50%;display:grid;place-items:center;transition:background .3s,border-color .3s,transform .3s var(--ease)}
.social a:hover{background:var(--red);border-color:var(--red);transform:translateY(-3px)}
.social svg{width:16px;height:16px;fill:currentColor}

/* ---------- Page transition curtain ---------- */
.curtain{position:fixed;inset:0;z-index:9999;background:var(--red);transform:scaleY(0);transform-origin:bottom;pointer-events:none}
.curtain__logo{position:absolute;inset:0;display:grid;place-items:center;opacity:0}
.curtain__logo img{height:70px;filter:brightness(0) invert(1)}

/* ---------- Live schedule embed (Club Automation) ----------
   The Club Automation calendar is served from midway.clubautomation.com in
   frame mode (isFrame=1), which strips their site chrome but still ships
   their own light grey / blue styling. It is cross-origin, so none of it can
   be restyled from here — the panel below is the frame we put AROUND it, in
   brand, so the light widget reads as a deliberate inset rather than a leak.
   The widget never posts its height to the parent, so the iframe is a fixed
   height with its own internal scroll. */
.sched{
  background:var(--ink-2);border:1px solid var(--line);border-radius:var(--r-lg);
  overflow:hidden;box-shadow:0 40px 80px -50px rgba(0,0,0,.9);
}
.sched__bar{
  display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;
  padding:.9rem 1rem;border-bottom:1px solid var(--line);background:var(--ink-3);
}
.sched__tab{
  appearance:none;border:1.5px solid transparent;background:transparent;color:var(--fg-2);
  font-family:var(--body);font-weight:700;font-size:.72rem;letter-spacing:.16em;
  text-transform:uppercase;padding:.72em 1.5em;border-radius:999px;cursor:pointer;
  transition:color .3s var(--ease),background-color .3s var(--ease),border-color .3s var(--ease);
}
.sched__tab:hover{color:#fff;border-color:var(--line)}
.sched__tab[aria-selected="true"]{background:var(--red);border-color:var(--red);color:#fff}
.sched__tab:focus-visible{outline:3px solid var(--yellow);outline-offset:2px}
.sched__live{
  margin-left:auto;display:inline-flex;align-items:center;gap:.55rem;
  color:var(--fg-3);font-size:.68rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;
}
.sched__dot{width:7px;height:7px;border-radius:50%;background:var(--red);flex:none}
.sched__frame{
  display:block;width:100%;height:clamp(560px,78vh,880px);border:0;background:#fff;
}
.sched__foot{
  display:flex;align-items:center;justify-content:space-between;gap:1.25rem;flex-wrap:wrap;
  padding:1.1rem 1.35rem;border-top:1px solid var(--line);background:var(--ink-3);
}
.sched__note{margin:0;color:var(--fg-3);font-size:.85rem;max-width:52ch}
.sched__out{
  display:inline-flex;align-items:center;gap:.6em;color:#fff;font-weight:700;
  font-size:.76rem;letter-spacing:.14em;text-transform:uppercase;white-space:nowrap;
  border-bottom:1.5px solid var(--red);padding-bottom:.25rem;
  transition:color .3s var(--ease)
}
.sched__out:hover{color:var(--red)}
@media (max-width:640px){
  .sched__bar{padding:.75rem}
  .sched__tab{padding:.7em 1.1em;font-size:.66rem;letter-spacing:.12em}
  .sched__live{display:none}
  .sched__frame{height:clamp(520px,82vh,720px)}
}

/* ---------- Reveal defaults ----------
   Content is visible by default, always. The pre-animation hidden state is
   applied by main.js only once GSAP + ScrollTrigger are confirmed working,
   so nothing can be permanently hidden by a script or network failure. */
[data-rv]{opacity:1}

/* ---------- Utilities ---------- */
.center{text-align:center}
.mx-auto{margin-inline:auto}
.mb0{margin-bottom:0}
.mt2{margin-top:2rem}
.mt3{margin-top:3rem}
.maxw-60{max-width:60ch}
.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}
.skip{position:absolute;left:-9999px;top:0;z-index:9999;background:var(--red);color:#fff;padding:1rem 1.5rem;font-weight:700}
.skip:focus{left:0}
.hdr-space{height:clamp(128px,18vh,190px)}

/* ---------- Gallery lightbox ---------- */
.gal figure{cursor:zoom-in}
.gal figure:focus-visible{outline:2px solid var(--red);outline-offset:3px}
.lightbox{
  position:fixed;inset:0;z-index:500;display:flex;align-items:center;justify-content:center;
  padding:clamp(1.2rem,5vw,3rem);background:rgba(8,8,9,.94);
  opacity:0;visibility:hidden;pointer-events:none;transition:opacity .25s ease;
}
.lightbox.is-open{opacity:1;visibility:visible;pointer-events:auto}
.lightbox__img{
  max-width:min(94vw,1500px);max-height:90vh;width:auto;height:auto;
  border-radius:var(--r);box-shadow:0 40px 100px rgba(0,0,0,.55);object-fit:contain;
}
.lightbox__close{
  position:absolute;top:clamp(.9rem,3vw,1.6rem);right:clamp(.9rem,3vw,1.8rem);
  width:46px;height:46px;border-radius:50%;border:1px solid rgba(255,255,255,.3);
  background:rgba(255,255,255,.08);color:#fff;font-size:1.7rem;line-height:1;cursor:pointer;
  display:flex;align-items:center;justify-content:center;transition:background .2s ease;
}
.lightbox__close:hover,.lightbox__close:focus-visible{background:rgba(255,255,255,.2)}

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important}
  [data-rv]{opacity:1 !important;transform:none !important}
  .hero__media{transform:none !important}
}

/* Home — personal training CTA (centered panel) */
.pt-cta__panel{
  position:relative;overflow:hidden;isolation:isolate;text-align:center;
  max-width:980px;margin-inline:auto;padding:clamp(2.8rem,6vw,5rem) clamp(1.4rem,5vw,4.5rem);
  border:1px solid var(--line);border-radius:var(--r-lg);
  background:linear-gradient(180deg,var(--ink-2),var(--ink))
}
.pt-cta__panel::before{
  content:"";position:absolute;z-index:-1;left:50%;top:-40%;width:120%;aspect-ratio:2/1;transform:translateX(-50%);
  background:radial-gradient(closest-side,rgba(126,200,227,.18),transparent 70%);pointer-events:none
}
.pt-cta__panel::after{
  content:"";position:absolute;left:50%;top:0;width:min(220px,40%);height:3px;transform:translateX(-50%);
  background:linear-gradient(90deg,transparent,var(--red),transparent)
}
.pt-cta__eyebrow{justify-content:center}
.pt-cta__eyebrow::after{content:"";width:2.2rem;height:2px;background:var(--red);display:block}
.pt-cta__lead{margin:1.25rem auto 0}
.pt-cta__offer{
  display:flex;align-items:center;gap:1rem;text-align:left;
  max-width:640px;margin:2.2rem auto 0;padding:1.1rem 1.4rem;
  border:1px solid rgba(126,200,227,.35);border-radius:var(--r);background:rgba(126,200,227,.07)
}
.pt-cta__offer p{margin:0;color:var(--fg-2);line-height:1.5}
.pt-cta__offer strong{color:#fff}
.pt-cta__tag{
  flex:none;font-family:var(--display);font-weight:800;text-transform:uppercase;letter-spacing:.06em;
  font-size:1.05rem;color:var(--ink);background:var(--yellow);padding:.35em .85em;border-radius:999px
}
.pt-cta__btns{justify-content:center;margin-top:2.2rem}
@media (max-width:560px){
  .pt-cta__offer{flex-direction:column;text-align:center;gap:.7rem}
  .pt-cta__btns .btn{width:100%}
}
@media (min-width:1000px){.crew-group--instructors .crew-grid,.crew-group--staff .crew-grid{grid-template-columns:repeat(3,1fr)}}
.crew-card__av{position:relative;overflow:hidden}
.crew-card__av--ph{width:64px;height:64px;border-width:2px}
.crew-card__av--ph span{visibility:hidden}
.crew-card__av img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 30%}
.crew-owners__avs span{position:relative;overflow:hidden}
.crew-owners__avs span i{font-style:normal}
.crew-owners__avs span.has-ph{width:clamp(84px,10vw,112px)}
.crew-owners__avs span.has-ph i{visibility:hidden}
.crew-owners__avs img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.evt p+p{margin-top:.8rem}
.evt p a{color:var(--red-hi);text-decoration:underline}
.evt__date .dy--range{font-size:clamp(1.5rem,2.6vw,2rem)}

/* ---------- Events: fun calendar ---------- */
.evx-hd{max-width:760px}
.evx-hd__badge{display:inline-block;background:var(--yellow);color:var(--ink);font-weight:800;font-size:.8rem;letter-spacing:.12em;text-transform:uppercase;padding:.5em 1.1em;border-radius:999px;margin-bottom:1.2rem;transform:rotate(-2deg)}
.evx-jump{display:flex;gap:.7rem;overflow-x:auto;padding:.4rem .2rem 1rem;margin:2.2rem 0 1.4rem;scrollbar-width:thin;scroll-snap-type:x proximity}
.evx-jump a{flex:none;scroll-snap-align:start;display:flex;flex-direction:column;align-items:center;gap:.2rem;min-width:108px;padding:.9rem .8rem;border-radius:18px;background:var(--ink-3);border:1px solid var(--line);text-decoration:none;color:var(--fg);transition:transform .3s var(--ease),border-color .3s,background .3s}
.evx-jump a:hover,.evx-jump a:focus-visible{transform:translateY(-4px) rotate(-1deg);border-color:var(--c);background:color-mix(in srgb,var(--c) 14%,var(--ink-3))}
.evx-jump__ic{font-size:1.7rem;line-height:1}
.evx-jump__d{font-family:var(--display);font-weight:800;font-size:1.05rem;text-transform:uppercase;color:var(--c);white-space:nowrap}
.evx-jump__t{font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;color:var(--fg-3);font-weight:700;white-space:nowrap}
.evx-list{display:grid;gap:1.2rem}
.evx{position:relative;display:grid;grid-template-columns:clamp(110px,12vw,150px) 1fr;border-radius:24px;overflow:hidden;background:var(--ink-3);border:1px solid var(--line);scroll-margin-top:110px;transition:transform .35s var(--ease),box-shadow .35s var(--ease),border-color .35s}
.evx:hover{transform:translateY(-4px);border-color:color-mix(in srgb,var(--c) 55%,transparent);box-shadow:0 22px 50px -28px color-mix(in srgb,var(--c) 70%,transparent)}
.evx__date{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:1.4rem .6rem;background:var(--c);color:var(--ink)}
.evx__ic{font-size:2rem;line-height:1;margin-bottom:.5rem;transition:transform .4s var(--ease)}
.evx:hover .evx__ic{transform:scale(1.2) rotate(-8deg)}
.evx__date .mo{font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;font-weight:800}
.evx__date .dy{font-family:var(--display);font-size:clamp(2.4rem,4.4vw,3.4rem);font-weight:800;line-height:1;margin-top:.1rem}
.evx__date .dy--range{font-size:clamp(1.6rem,2.8vw,2.2rem)}
.evx__date .wd{font-size:.64rem;letter-spacing:.14em;text-transform:uppercase;font-weight:800;margin-top:.35rem;opacity:.75}
.evx__bd{padding:clamp(1.3rem,3vw,2rem) clamp(1.2rem,3vw,2.2rem)}
.evx__tag{display:inline-block;font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;font-weight:800;color:var(--c);background:color-mix(in srgb,var(--c) 14%,transparent);border-radius:999px;padding:.35em .9em;margin-bottom:.7rem}
.evx h3{margin-bottom:.8rem}
.evx__meta{display:flex;flex-wrap:wrap;gap:.5rem .6rem;margin-bottom:1rem}
.evx__meta span{font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;font-weight:600;color:var(--fg-2);background:rgba(255,255,255,.05);border:1px solid var(--line);border-radius:999px;padding:.4em .95em}
.evx p{color:var(--fg-2);margin-bottom:0;line-height:1.65}
.evx p+p{margin-top:.8rem}
.evx p a{color:var(--c);text-decoration:underline}
.evx-cta{display:flex;gap:1.4rem;align-items:flex-start;margin-top:2.4rem;padding:clamp(1.5rem,3.5vw,2.4rem);border-radius:24px;background:linear-gradient(135deg,rgba(126,200,227,.14),rgba(255,203,5,.1));border:1px solid rgba(126,200,227,.3)}
.evx-cta__ic{font-size:2.4rem;line-height:1}
.evx-cta .lead{margin:0;max-width:none}
@media (max-width:640px){
  .evx{grid-template-columns:1fr}
  .evx__date{flex-direction:row;gap:.6rem;justify-content:flex-start;padding:.8rem 1.2rem}
  .evx__ic{margin:0 .3rem 0 0;font-size:1.5rem}
  .evx__date .dy,.evx__date .dy--range{font-size:1.6rem;margin:0}
  .evx__date .wd{margin:0}
  .evx-cta{flex-direction:column;gap:.8rem}
}
@media (prefers-reduced-motion:reduce){.evx,.evx-jump a,.evx__ic{transition:none}.evx:hover,.evx-jump a:hover{transform:none}.evx:hover .evx__ic{transform:none}}

/* ---------- Policies: cancel membership (locked member login) ---------- */
.cxl{background:var(--ink)}
.cxl__agree{max-width:760px;margin:0 auto 1.6rem}
.cxl__check{display:flex;gap:1rem;align-items:flex-start;cursor:pointer;padding:1.2rem 1.4rem;border-radius:var(--r);background:var(--ink-2);border:1px solid var(--line);color:var(--fg-2);line-height:1.5;transition:border-color .3s}
.cxl__check:hover{border-color:rgba(126,200,227,.5)}
.cxl__check input{position:absolute;opacity:0;width:1px;height:1px}
.cxl__box{flex:none;width:26px;height:26px;border-radius:7px;border:2px solid var(--red);display:grid;place-items:center;margin-top:.05rem;transition:background .2s}
.cxl__box::after{content:"";width:7px;height:13px;border:solid var(--ink);border-width:0 3px 3px 0;transform:rotate(45deg) translate(-1px,-1px);opacity:0}
.cxl__check input:checked+.cxl__box{background:var(--red)}
.cxl__check input:checked+.cxl__box::after{opacity:1}
.cxl__check input:focus-visible+.cxl__box{outline:3px solid var(--yellow);outline-offset:3px}
.cxl__check:has(input:checked){border-color:var(--red);color:#fff}
.cxl__panel{max-width:760px;margin-inline:auto}
.cxl__card{display:flex;flex-direction:column;align-items:center;text-align:center;gap:.5rem;padding:clamp(2rem,5vw,3.2rem) clamp(1.4rem,4vw,3rem);border-radius:var(--r-lg);border:1px dashed var(--line);background:repeating-linear-gradient(135deg,rgba(255,255,255,.02) 0 14px,transparent 14px 28px),var(--ink-2);transition:border-color .3s,background .3s}
.cxl__panel.is-open .cxl__card{border-style:solid;border-color:var(--red);background:var(--ink-2)}
.cxl__card-ic{font-size:2.6rem;line-height:1;margin-bottom:.3rem}
.cxl__card-t{margin:0;color:#fff;font-weight:700;font-size:1.05rem}
.cxl__card-sub{margin:0 0 1rem;color:var(--fg-3);font-size:.92rem;max-width:46ch}
.cxl__card-help{margin:.8rem 0 0;color:var(--fg-3);font-size:.82rem}
.cxl__btn[aria-disabled="true"]{opacity:.35;pointer-events:none;filter:grayscale(1)}

/* ---------- Memberships page ---------- */
.mem-steps{list-style:none;margin:0 0 clamp(3rem,6vw,4.5rem);padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.mem-steps li{display:flex;align-items:center;gap:.9rem;padding:1.1rem 1.3rem;border-radius:var(--r);background:var(--ink-2);border:1px solid var(--line);color:var(--fg-2);line-height:1.4}
.mem-steps li span{flex:none;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:var(--red);color:var(--ink);font-family:var(--display);font-weight:800;font-size:1.2rem}
.mem-steps strong{color:#fff}
.mem-grid{display:grid;gap:1.2rem}
.mem-grid--2{grid-template-columns:repeat(2,1fr)}
.mem-grid--3{grid-template-columns:repeat(3,1fr)}
.mem{display:flex;flex-direction:column;padding:clamp(1.5rem,3vw,2.2rem);border-radius:var(--r-lg);background:var(--ink-2);border:1px solid var(--line);transition:transform .35s var(--ease),border-color .35s,box-shadow .35s}
.mem:hover{transform:translateY(-4px);border-color:rgba(126,200,227,.55);box-shadow:0 22px 50px -30px rgba(126,200,227,.6)}
.mem__ic{font-size:2rem;line-height:1;margin-bottom:.9rem}
.mem__name{font-size:clamp(1.3rem,2.2vw,1.7rem);color:#fff;margin:0 0 1rem}
.mem__price{display:flex;align-items:baseline;flex-wrap:wrap;gap:.2rem .5rem;margin:0 0 1rem;padding-bottom:1rem;border-bottom:1px solid var(--line)}
.mem__from{width:100%;font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;font-weight:700;color:var(--fg-3)}
.mem__amt{font-family:var(--display);font-weight:800;font-size:clamp(2.6rem,5vw,3.4rem);line-height:1;color:var(--red)}
.mem__amt sup{font-size:.45em;vertical-align:.9em;margin-right:.05em}
.mem__per{color:var(--fg-2);font-weight:600}
.mem__desc{color:var(--fg-2);line-height:1.6;margin:0 0 1.4rem;flex:1}
.mem__btn{align-self:stretch}
.mem__hint{margin:.8rem 0 0;font-size:.8rem;color:var(--fg-3);text-align:center}
.mem__hint strong{color:var(--fg-2)}
.mem-note{color:var(--fg-3);text-align:center}
.mem-note a{color:var(--red-hi);text-decoration:underline}
@media (max-width:900px){.mem-grid--3{grid-template-columns:1fr 1fr}.mem-steps{grid-template-columns:1fr}}
@media (max-width:640px){.mem-grid--2,.mem-grid--3{grid-template-columns:1fr}}
@media (max-width:640px){.mem__btn{white-space:nowrap;letter-spacing:.1em;font-size:.74rem;padding:1em 1.2em}}

/* ---------- Memberships: insurance ---------- */
.ins{margin-top:clamp(3.5rem,7vw,6rem);padding-top:clamp(3rem,6vw,4.5rem);border-top:1px solid var(--line)}
.ins-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1.2rem}
.ins-card{padding:clamp(1.5rem,3vw,2.2rem);border-radius:var(--r-lg);background:var(--ink-2);border:1px solid var(--line)}
.ins-card--hl{border-color:rgba(255,203,5,.45);background:radial-gradient(120% 140% at 100% 0%,rgba(255,203,5,.1),transparent 60%),var(--ink-2)}
.ins-card__tag{display:inline-block;font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;font-weight:800;color:var(--red);background:rgba(126,200,227,.12);border-radius:999px;padding:.35em .9em;margin-bottom:.8rem}
.ins-card--hl .ins-card__tag{color:var(--yellow);background:rgba(255,203,5,.12)}
.ins-card h3{color:#fff;font-size:clamp(1.4rem,2.4vw,1.8rem);margin:0}
.ins-card__sub{color:var(--fg-2);margin:.35rem 0 1rem;font-weight:600}
.ins-card ul{margin:0;padding:0;list-style:none;display:grid;gap:.55rem}
.ins-card li{position:relative;padding-left:1.6rem;color:var(--fg-2);line-height:1.5}
.ins-card li::before{content:"\2713";position:absolute;left:0;top:0;color:var(--red);font-weight:800}
.ins-card__list{margin-top:1rem!important}
.ins-card__price{margin:.4rem 0 0;color:var(--fg-2)}
.ins-card__price span{display:block;font-family:var(--display);font-weight:800;font-size:clamp(2.6rem,5vw,3.4rem);line-height:1;color:var(--yellow);margin-bottom:.3rem}
.ins-how{margin-top:1.6rem;padding:clamp(1.6rem,3.5vw,2.6rem);border-radius:var(--r-lg);background:linear-gradient(135deg,rgba(126,200,227,.16),rgba(0,136,203,.08));border:1px solid rgba(126,200,227,.4)}
.ins-how h3{color:#fff;font-size:clamp(1.5rem,2.8vw,2.1rem);margin:0 0 1.2rem}
.ins-how ol{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.ins-how li{display:flex;gap:.9rem;align-items:flex-start;color:var(--fg-2);line-height:1.5}
.ins-how li span{flex:none;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:var(--red);color:var(--ink);font-family:var(--display);font-weight:800;font-size:1.15rem}
.ins-how strong{color:#fff}
@media (max-width:900px){.ins-how ol{grid-template-columns:1fr}}
@media (max-width:640px){.ins-grid{grid-template-columns:1fr}}
.ins-card li.is-no::before{content:"\2013";color:var(--fg-3)}
.mem-ins-link{margin:0 0 clamp(3rem,6vw,4.5rem);color:var(--fg-2)}
.mem-ins-link a{color:var(--red-hi);text-decoration:underline;font-weight:600}
#insurance{scroll-margin-top:110px}
.ins{margin-top:0;padding-top:0;border-top:0;margin-bottom:clamp(3.5rem,7vw,6rem);padding-bottom:clamp(3rem,6vw,4.5rem);border-bottom:1px solid var(--line)}
.ins-card__tag--ltd{color:var(--fg-2);background:rgba(255,255,255,.07)}
.ins-card__tag--full{color:#3DDC97;background:rgba(61,220,151,.13)}
.welcome-tag strong{color:#fff;font-family:var(--display);text-transform:uppercase;letter-spacing:.01em;font-size:clamp(1.25rem,2vw,1.6rem);line-height:1.2;display:block;margin-top:.4rem}
.welcome-sign{color:var(--red);font-weight:700;letter-spacing:.06em;text-transform:uppercase;font-size:.8rem;margin-top:.2rem}
.split__media--square{aspect-ratio:1/1;align-self:center}
.split__media--square img{object-position:center 40%}

/* ---------- 404 ---------- */
.nf{min-height:100svh;display:flex;align-items:center;background:radial-gradient(70% 60% at 50% 0%,rgba(126,200,227,.14),transparent 70%),var(--ink)}
.nf__in{text-align:center;padding-block:clamp(9rem,18vh,12rem) clamp(3.5rem,8vh,6rem)}
.nf__code{display:flex;align-items:center;justify-content:center;gap:clamp(.6rem,2vw,1.4rem);margin:0 0 1.4rem;font-family:var(--display);font-weight:900;line-height:.85;font-size:clamp(6rem,20vw,13rem);color:#fff}
.nf__plate{width:.72em;height:.72em;border-radius:50%;border:.1em solid var(--red);position:relative;box-shadow:0 0 60px -10px rgba(126,200,227,.6);animation:nf-spin 9s linear infinite}
.nf__plate::before{content:"";position:absolute;inset:32%;border-radius:50%;background:var(--red)}
.nf__plate::after{content:"";position:absolute;left:50%;top:-.12em;width:.08em;height:.18em;background:var(--ink);transform:translateX(-50%)}
@keyframes nf-spin{to{transform:rotate(360deg)}}
.nf__title{max-width:16ch;margin:0 auto}
.nf__lead{max-width:52ch;margin:1.4rem auto 0}
.nf__btns{justify-content:center;margin-top:2rem}
.nf__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.9rem;max-width:920px;margin:clamp(2.6rem,6vw,4rem) auto 0;text-align:left}
.nf__card{display:flex;gap:.9rem;align-items:center;padding:1rem 1.2rem;border-radius:var(--r);background:var(--ink-2);border:1px solid var(--line);color:var(--fg);text-decoration:none;transition:transform .3s var(--ease),border-color .3s}
.nf__card:hover,.nf__card:focus-visible{transform:translateY(-3px);border-color:var(--red)}
.nf__ic{font-size:1.6rem;line-height:1}
.nf__card b{display:block;color:#fff}
.nf__card small{display:block;color:var(--fg-3);font-size:.82rem;margin-top:.15rem}
.nf__help{margin-top:2.4rem;color:var(--fg-3)}
.nf__help a{color:var(--red-hi);text-decoration:underline}
@media (max-width:820px){.nf__grid{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.nf__grid{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.nf__plate{animation:none}}