/*
Theme Name: FPTC 2026
Description: Hand-coded classic theme for Folsom Personal Training Center. No page
  builder — layout lives in PHP templates, content lives in WordPress. Emits the
  same markup as the static build, so the design is identical by construction.
Author: Dependent Media
Version: 1.0
*/
/* ============================================================
   FOLSOM PERSONAL TRAINING CENTER — test build
   Art direction: Dave Greene's mockups (tickets 940284/465873)
   Dark cinematic · Bebas display · electric blue on charcoal
   ============================================================ */
:root{
  --ink:#ffffff;          /* page ground */
  --ink-2:#f2f5f9;        /* raised panels / alt sections */
  --ink-3:#e9eef4;        /* cards */
  --navy:#042855;         /* brand navy */
  --blue:#2f7df6;         /* accent — display type / on-dark only */
  --accent:#1a5ec9;       /* accent text on light (AA) */
  --blue-soft:#7fb0ff;    /* accent text on dark */
  --btn:#1e63d6;          /* AA on white text (5.51:1) */
  --btn-hover:#175bbf;    /* 6.39:1 */
  --head:#0e1420;         /* headings on light */
  --txt:#454e5c;          /* body on light */
  --txt-dim:#6d7683;      /* muted on light */
  --line:rgba(14,20,32,.14);
  --dark:#0e1218;         /* footer / deliberate dark bands */
  --white:#ffffff;
  --display:"Bebas Neue","Arial Narrow",sans-serif;
  --body:"Inter",system-ui,-apple-system,sans-serif;
  --max:1240px;
  --pad:clamp(20px,4vw,48px);
  --ease:cubic-bezier(.22,.8,.24,1);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:124px}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{background:var(--ink);color:var(--txt);font-family:var(--body);
  font-size:17px;line-height:1.75;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;display:block;height:auto}
picture{display:contents}
a{color:inherit;text-decoration:none}
::selection{background:var(--btn);color:#fff}
:focus-visible{outline:2px solid var(--blue-soft);outline-offset:3px}
.btn:focus-visible{outline-offset:4px}
.skip{position:absolute;left:-9999px;top:0;z-index:1100;background:var(--btn);color:#fff;
  padding:14px 22px;font-size:13px;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.skip:focus{left:0}

h1,h2,h3{font-family:var(--display);font-weight:400;letter-spacing:.02em;
  color:var(--head);line-height:.95;text-transform:uppercase}
.h-xl{font-size:clamp(56px,9.5vw,150px)}
.h-lg{font-size:clamp(40px,6vw,88px)}
.h-md{font-size:clamp(30px,3.6vw,52px)}
.h-sm{font-size:clamp(24px,2.4vw,34px)}
.blue{color:var(--blue)}
.kicker{font-family:var(--body);font-size:12px;font-weight:700;letter-spacing:.42em;
  text-transform:uppercase;color:var(--accent);display:flex;align-items:center;gap:16px}
.kicker::before{content:"";width:42px;height:2px;background:var(--blue);flex:none}
.lead{font-size:clamp(17px,1.4vw,20px);color:var(--txt);max-width:62ch}
.wrap{max-width:var(--max);margin:0 auto;padding-inline:var(--pad)}
.section{padding-block:clamp(84px,11vw,160px);position:relative}

/* ---------- progress + nav ---------- */
#progress{position:fixed;top:0;left:0;height:2px;background:var(--blue);width:100%;z-index:1001;
  transform:scaleX(0);transform-origin:0 50%;will-change:transform}
.nav{position:fixed;inset:0 0 auto 0;z-index:1000;transition:box-shadow .4s,padding .4s;
  padding-block:18px;background:rgba(255,255,255,.92);backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.nav.scrolled{background:rgba(255,255,255,.9);backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);box-shadow:0 1px 0 var(--line);padding-block:12px}
.nav-inner{display:flex;align-items:center;justify-content:space-between;gap:24px}
.nav-logo{flex:none}
.nav-logo img{height:40px;width:149px}
.nav-links{display:flex;gap:clamp(14px,2vw,30px);list-style:none;align-items:center}
.nav-links a:not(.btn){font-size:13px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  color:var(--head);padding:6px 2px;position:relative;white-space:nowrap}
.nav-links a::after{content:"";position:absolute;left:0;bottom:0;width:100%;height:2px;
  background:var(--blue);transform:scaleX(0);transform-origin:left;transition:transform .3s var(--ease)}
.nav-links a:hover,.nav-links a[aria-current]{color:var(--accent)}
.nav-links a:hover::after,.nav-links a[aria-current]::after{transform:scaleX(1)}
.btn{display:inline-flex;align-items:center;gap:12px;background:var(--btn);color:#fff;
  font-weight:700;font-size:13px;letter-spacing:.14em;text-transform:uppercase;
  white-space:nowrap;padding:16px 30px;transition:background .25s,transform .25s;border:0;cursor:pointer}
.btn:hover{background:var(--btn-hover);transform:translateY(-2px)}
.btn.ghost{background:transparent;box-shadow:inset 0 0 0 1px rgba(255,255,255,.35)}
.btn.ghost:hover{background:rgba(255,255,255,.08)}
.btn .arr{transition:transform .25s}
.btn:hover .arr{transform:translateX(5px)}
#navToggle{display:none;background:none;border:0;color:var(--head);cursor:pointer;padding:9px}
#navToggle svg{display:block}

/* ---------- hero ---------- */
.hero{min-height:100svh;display:grid;align-items:end;position:relative;isolation:isolate;
  padding-bottom:clamp(48px,6vw,90px)}
.hero-bg{position:absolute;inset:0;z-index:-2;overflow:hidden}
.hero-bg img{width:100%;height:100%!important;object-fit:cover;animation:heroZoom 14s var(--ease) both}
@keyframes heroZoom{from{transform:scale(1.12)}to{transform:scale(1)}}
.hero::before{content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(100deg,rgba(6,12,22,.88) 0%,rgba(6,12,22,.58) 45%,rgba(6,12,22,.22) 100%),
             linear-gradient(0deg,rgba(6,12,22,.55) 0%,rgba(6,12,22,0) 30%)}
.hero-content{padding-top:clamp(96px,18vh,140px)}
.hero .kicker{margin-bottom:26px}
.hero h1{margin-bottom:28px}
.hero h1 .line{display:block;overflow:hidden}
.hero h1 .line>span{display:block;transform:translateY(110%);animation:riseUp 1s var(--ease) forwards}
.hero h1 .line:nth-child(2)>span{animation-delay:.14s}
@keyframes riseUp{to{transform:translateY(0)}}
.hero .lead{margin-bottom:38px}
.hero-cta{display:flex;gap:18px;flex-wrap:wrap;margin-bottom:clamp(48px,6vw,80px)}
.hero-props{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;background:rgba(255,255,255,.08)}
.prop{background:rgba(11,13,16,.72);backdrop-filter:blur(6px);padding:26px 28px;display:flex;gap:18px;align-items:flex-start}
.prop svg{flex:none;width:34px;height:34px;stroke:var(--blue);fill:none;stroke-width:1.6;
  stroke-linecap:round;stroke-linejoin:round;margin-top:3px}
.prop b{display:block;color:#fff;font-size:13px;letter-spacing:.16em;text-transform:uppercase;margin-bottom:4px}
.prop span{font-size:14.5px;color:var(--txt-dim);line-height:1.55}
.scroll-cue{position:absolute;right:var(--pad);bottom:clamp(48px,6vw,90px);writing-mode:vertical-rl;
  font-size:11px;letter-spacing:.4em;text-transform:uppercase;color:var(--txt-dim);
  display:flex;align-items:center;gap:14px}
.scroll-cue::after{content:"";width:1px;height:56px;background:linear-gradient(var(--blue),transparent);
  animation:cueDrop 2s infinite}
@keyframes cueDrop{0%{transform:scaleY(0);transform-origin:top}45%{transform:scaleY(1);transform-origin:top}55%{transform:scaleY(1);transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}

/* ---------- page hero (interior) ---------- */
.page-hero{min-height:62svh;display:grid;align-items:end;position:relative;isolation:isolate;
  padding-bottom:clamp(40px,5vw,70px)}
.page-hero .hero-bg img{animation-duration:10s}
.page-hero::before{content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(100deg,rgba(6,12,22,.78),rgba(6,12,22,.38) 60%,rgba(6,12,22,.18)),
             linear-gradient(0deg,rgba(6,12,22,.5),rgba(6,12,22,0) 36%)}
.page-hero .kicker{margin-bottom:20px}
.crumbs{font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--txt-dim);margin-top:22px}
.crumbs a{text-decoration:underline;text-underline-offset:3px}
.crumbs a:hover{color:#fff}
.bio-copy p a{color:var(--accent);text-decoration:underline;text-underline-offset:3px}

/* ---------- marquee ---------- */
.marquee{border-block:1px solid var(--line);padding-block:22px;overflow:hidden;
  background:var(--ink-2)}
.marquee:hover .marquee-track,.marquee:focus-within .marquee-track{animation-play-state:paused}
.marquee-track{display:flex;gap:0;width:max-content;animation:marq 36s linear infinite}
.marquee span{font-family:var(--display);font-size:22px;letter-spacing:.12em;color:var(--txt-dim);
  text-transform:uppercase;white-space:nowrap;display:flex;align-items:center;gap:64px;padding-right:64px}
.marquee span::after{content:"·";color:var(--blue)}
@keyframes marq{to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){.marquee-track{animation:none}.hero-bg img{animation:none}}

/* ---------- stats ---------- */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:2px;background:var(--line)}
.stat{background:var(--ink);padding:clamp(28px,4vw,54px) 20px;text-align:center}
.stat b{font-family:var(--display);font-size:clamp(44px,5.4vw,84px);color:var(--head);display:block;line-height:1}
.stat b i{font-style:normal;color:var(--blue)}
.stat > span{font-size:12px;letter-spacing:.24em;text-transform:uppercase;color:var(--txt-dim)}
.stat b span{font:inherit;color:inherit;letter-spacing:inherit}

/* ---------- ghost numeral sections ---------- */
.ghost-num{position:absolute;top:clamp(8px,2vw,20px);right:var(--pad);z-index:0;
  font-family:var(--display);font-size:clamp(120px,20vw,300px);line-height:1;color:transparent;
  -webkit-text-stroke:1px rgba(14,20,32,.10);pointer-events:none;user-select:none}
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,6vw,96px);align-items:center;position:relative;z-index:1}
.split .kicker{margin-bottom:22px}
.split h2{margin-bottom:26px}
.split p+p{margin-top:1em}
.split p b{color:var(--head)}
.split .btn{margin-top:34px}
.frame{position:relative;max-width:420px}
.frame-sm{max-width:320px}
.frame img{width:100%;height:auto;object-fit:cover;aspect-ratio:4/5}
.frame::after{content:"";position:absolute;inset:0;border:1px solid var(--line);
  transform:translate(18px,18px);pointer-events:none;transition:transform .5s var(--ease)}
.frame:hover::after{transform:translate(10px,10px)}
.frame .tag{position:absolute;left:0;bottom:0;background:var(--btn);color:#fff;
  font-family:var(--display);font-size:20px;letter-spacing:.08em;padding:12px 22px;text-transform:uppercase}

/* ---------- trainers grid ---------- */
.sect-head{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;
  margin-bottom:clamp(40px,5vw,64px);flex-wrap:wrap}
.sect-head .kicker{margin-bottom:18px}
.trainer-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(14px,1.6vw,24px)}
.tcard{position:relative;display:block;background:var(--ink-3);overflow:hidden;border:1px solid var(--line)}
.tcard img{aspect-ratio:3/4;width:100%;object-fit:cover;
  transition:transform .6s var(--ease)}
.tcard:hover img{transform:scale(1.045)}
.tcard .num{position:absolute;top:14px;left:16px;font-family:var(--display);font-size:15px;
  letter-spacing:.2em;color:#fff;opacity:.85;z-index:2}
.tcard .tcard-cap{position:absolute;inset:auto 0 0 0;padding:56px 20px 18px;z-index:2;
  background:linear-gradient(transparent,rgba(4,8,14,.92) 62%)}
.tcard b{font-family:var(--display);font-size:clamp(22px,1.8vw,28px);letter-spacing:.05em;
  color:#fff;display:block;text-transform:uppercase}
.tcard span{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--blue-soft)}
.tcard .go{position:absolute;top:14px;right:14px;width:36px;height:36px;border:1px solid rgba(255,255,255,.35);
  display:grid;place-items:center;color:#fff;z-index:2;opacity:0;transform:translateY(-6px);
  transition:opacity .35s,transform .35s;border-radius:50%}
.tcard:hover .go{opacity:1;transform:none}

/* ---------- service cards ---------- */
.svc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,1.6vw,24px)}
.svc{position:relative;display:block;overflow:hidden;min-height:440px;background:var(--ink-3);border:1px solid var(--line)}
.svc img{position:absolute;inset:0;width:100%;height:100%!important;object-fit:cover;opacity:1;
  transition:transform .7s var(--ease),opacity .5s}
.svc:hover img{transform:scale(1.06)}
.svc::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 10%,rgba(4,8,14,.95))}
.svc-body{position:absolute;inset:auto 0 0 0;padding:28px;z-index:2}
.svc-body .n{font-family:var(--display);font-size:15px;letter-spacing:.25em;color:var(--blue-soft)}
.svc-body h3{font-size:clamp(26px,2.2vw,36px);margin:.35em 0 .4em}
.svc-body p{font-size:14.5px;color:var(--txt);max-width:34ch}
.svc-body .more{display:inline-flex;align-items:center;gap:10px;margin-top:16px;font-size:12px;
  font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:#fff}
.svc-body .more::after{content:"→";color:var(--blue);transition:transform .3s}
.svc:hover .more::after{transform:translateX(6px)}

/* ---------- testimonials ---------- */
.quote-band{background:var(--navy);position:relative;overflow:hidden}
.quote-band::before{content:"“";position:absolute;font-family:var(--display);
  font-size:clamp(300px,40vw,560px);line-height:.8;color:rgba(255,255,255,.05);top:-10px;left:4vw}
.t-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,2.5vw,36px)}
.t-card{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.09);padding:34px 30px;
  display:flex;flex-direction:column;gap:20px}
.t-card blockquote{font-size:16.5px;line-height:1.7;color:#e7ecf3;font-style:italic;flex:1}
.t-card cite{font-style:normal}
.t-card cite b{color:#fff;font-size:14px;letter-spacing:.06em;display:block}
.t-card cite span{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--blue-soft)}
.stars{color:var(--blue-soft);letter-spacing:4px;font-size:14px}

/* ---------- pull quote ---------- */
.pull{max-width:900px;margin:0 auto;text-align:center}
.pull p{font-family:var(--display);font-size:clamp(28px,4vw,52px);line-height:1.15;color:var(--head);
  text-transform:uppercase;letter-spacing:.02em}
.pull p em{font-style:normal;color:var(--blue)}
.pull cite{display:block;margin-top:26px;font-style:normal;font-size:13px;letter-spacing:.28em;
  text-transform:uppercase;color:var(--txt-dim)}

/* ---------- CTA band ---------- */
.cta-band{position:relative;isolation:isolate;overflow:hidden;text-align:center;
  padding-block:clamp(90px,12vw,170px)}
.cta-band .hero-bg img{opacity:1}
.cta-band::before{content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(180deg,rgba(6,12,22,.66),rgba(6,12,22,.48) 50%,rgba(6,12,22,.66))}
.cta-band .kicker{justify-content:center}
.cta-band .kicker::before{display:none}
.cta-band h2{margin:18px 0 16px}
.cta-band p{max-width:52ch;margin:0 auto 36px}

/* ---------- bio blocks (trainers page) ---------- */
.bio{display:grid;grid-template-columns:minmax(200px,300px) 1fr;gap:clamp(36px,5vw,80px);
  align-items:start;position:relative;z-index:1}
.bio.flip{grid-template-columns:1fr minmax(200px,300px)}
.bio-photo{position:sticky;top:124px;max-width:300px}
.bio-photo img{aspect-ratio:3/4;object-fit:cover;width:100%}
.bio-meta{margin-top:0;border:1px solid var(--line);border-top:0;padding:20px 22px;
  font-size:14px;display:grid;gap:8px;background:var(--ink-2)}
.bio-meta b{color:var(--head)}
.bio-meta a{color:var(--accent)}
.bio-meta a:hover{color:var(--head)}
.bio-copy .kicker{margin-bottom:14px}
.bio-copy h2{margin-bottom:8px}
.role{font-size:13px;letter-spacing:.22em;text-transform:uppercase;color:var(--accent);
  margin-bottom:28px;display:block}
.bio-copy p+p{margin-top:1.05em}
.bio-copy .certs{margin-top:30px;display:flex;flex-wrap:wrap;gap:10px}
.chip{font-size:11.5px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;
  color:var(--head);border:1px solid var(--line);padding:8px 14px;border-radius:999px}
.rule{height:1px;background:linear-gradient(90deg,transparent,var(--line),transparent);
  margin-block:clamp(64px,8vw,110px)}

/* ---------- feature list ---------- */
.feat-list{display:grid;border-top:1px solid var(--line)}
.feat{display:grid;grid-template-columns:64px 1fr;gap:22px;align-items:center;
  padding:24px 6px;border-bottom:1px solid var(--line)}
.feat svg{width:36px;height:36px;stroke:var(--blue);fill:none;stroke-width:1.5;
  stroke-linecap:round;stroke-linejoin:round;justify-self:center}
.feat b{color:var(--head);font-size:15px;display:block;margin-bottom:2px}
.feat span{font-size:14px;color:var(--txt-dim)}

/* ---------- contact ---------- */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(36px,5vw,80px)}
.c-line{display:grid;grid-template-columns:52px 1fr;gap:18px;align-items:start;
  padding:22px 0;border-bottom:1px solid var(--line)}
.c-line svg{width:30px;height:30px;stroke:var(--blue);fill:none;stroke-width:1.6;
  stroke-linecap:round;stroke-linejoin:round;margin-top:4px}
.c-line b{color:var(--head);font-size:12px;letter-spacing:.2em;text-transform:uppercase;display:block;margin-bottom:4px}
.c-line a{font-size:19px;color:var(--txt)}
.c-line a:hover{color:var(--accent)}
.map-frame{position:relative}
.map-frame img{width:100%;height:auto;object-fit:contain}
.map-frame iframe{width:100%;aspect-ratio:4/3;border:0;display:block;filter:grayscale(.4) contrast(1.05)}
form.contact{display:grid;gap:16px;margin-top:34px}
form.contact label{font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--head);display:block;margin-bottom:7px}
form.contact .field{display:block}
.form-status{font-size:14px;color:var(--accent);min-height:1.4em}
form.contact input,form.contact textarea{background:#fff;border:1px solid rgba(14,20,32,.3);
  color:var(--head);padding:15px 16px;font:inherit;font-size:15px;width:100%}
form.contact input:focus,form.contact textarea:focus{outline:2px solid var(--blue);outline-offset:-1px}
form.contact textarea{min-height:130px;resize:vertical}
form.contact .row2{display:grid;grid-template-columns:1fr 1fr;gap:16px}

/* ---------- footer ---------- */
footer{background:var(--dark);border-top:1px solid var(--line);
  padding:clamp(56px,7vw,90px) 0 36px}
.f-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:clamp(32px,5vw,72px);margin-bottom:56px}
.f-grid img{height:64px;width:auto;margin-bottom:22px}
.f-grid p{font-size:14.5px;color:var(--txt-dim);max-width:38ch}
.f-grid h3{font-size:12px;letter-spacing:.26em;text-transform:uppercase;color:#fff;margin-bottom:20px}
.f-grid ul{list-style:none;display:grid;gap:10px}
.f-grid ul a{font-size:14.5px;color:var(--txt-dim);display:inline-block;padding:6px 0}
.f-grid ul a:hover{color:var(--blue-soft)}
.f-bottom{border-top:1px solid rgba(255,255,255,.07);padding-top:28px;display:flex;
  justify-content:space-between;gap:20px;flex-wrap:wrap;font-size:12.5px;color:var(--txt-dim);
  letter-spacing:.06em}
.f-loc{font-family:var(--display);letter-spacing:.14em;font-size:15px;color:var(--txt)}
.f-loc i{font-style:normal;color:var(--blue)}

/* ---------- reveals ---------- */
.js .rv{opacity:0;transform:translateY(34px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.js .rv.in{opacity:1;transform:none}
.rv-d1{transition-delay:.1s}.rv-d2{transition-delay:.2s}.rv-d3{transition-delay:.3s}
@media(prefers-reduced-motion:reduce){
  .js .rv{opacity:1;transform:none;transition:none}
  .hero h1 .line>span{animation:none;transform:none}
  .scroll-cue::after{animation:none}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;
    transition-duration:.01ms!important;scroll-behavior:auto!important}
}

/* ---------- responsive ---------- */
@media(max-width:1020px){
  .trainer-grid{grid-template-columns:repeat(2,1fr)}
  .svc-grid{grid-template-columns:1fr 1fr}
  .svc:last-child{grid-column:1/-1;min-height:340px}
  .stats{grid-template-columns:repeat(2,1fr)}
  .hero-props{grid-template-columns:1fr}
  .split,.contact-grid{grid-template-columns:1fr}
  .bio,.bio.flip{grid-template-columns:1fr}
  .bio.flip .bio-photo{order:-1}
  .bio-photo{position:static;max-width:420px}
  .t-grid{grid-template-columns:1fr}
  .f-grid{grid-template-columns:1fr 1fr}
  .scroll-cue{display:none}
}
/* nav drawer takes over at 1020px: above this the 6 links + logo + CTA overflow */
@media(max-width:1020px){
  .nav-links{position:fixed;inset:0;background:rgba(7,9,12,.97);flex-direction:column;
    justify-content:flex-start;gap:22px;padding:96px 24px 48px;
    max-height:100dvh;overflow-y:auto;overscroll-behavior:contain;
    visibility:hidden;transform:translateY(-100%);
    transition:transform .45s var(--ease),visibility .45s}
  .nav-links.open{transform:none;visibility:visible}
  .nav-links a:not(.btn){font-size:20px;min-height:44px;display:flex;align-items:center}
  .nav-links .btn{font-size:14px;font-weight:700;color:#fff;align-self:flex-start}
  #navToggle{display:block;z-index:1002;position:relative}
  .nav > .btn{display:none}
  .nav-links .btn{display:inline-flex}
}
@media(max-width:760px){
  .trainer-grid{grid-template-columns:1fr 1fr;gap:10px}
  .svc-grid{grid-template-columns:1fr}
  .svc:last-child{grid-column:auto;min-height:440px}
  .f-grid{grid-template-columns:1fr}
  form.contact .row2{grid-template-columns:1fr}
}
@media(max-width:400px){
  .c-line a{overflow-wrap:anywhere}
  .contact-grid > *{min-width:0}
}
@media(max-width:430px){.trainer-grid{grid-template-columns:1fr}}
@media(min-width:1021px){.nav-links .btn{display:none}}
.nav-links .btn{padding:14px 26px}
/* stats band: photography behind the numbers */
.stats-band{isolation:isolate;overflow:hidden}
.stats-band .hero-bg img{opacity:.28;object-position:center 28%}
.stats-band::before{content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(0deg,var(--ink) 0%,rgba(255,255,255,.82) 30%,rgba(255,255,255,.82) 70%,var(--ink) 100%)}
.stats-band .stats{background:var(--line)}
.stats-band .stat{background:rgba(255,255,255,.86);backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px)}
/* short landscape phones: fit more of the drawer without scrolling */
@media(max-width:1020px) and (max-height:520px){
  .nav-links{padding:68px 24px 32px;gap:10px}
  .nav-links a:not(.btn){min-height:36px;font-size:17px}
}

/* ---------- deliberate dark bands: hero, CTA, quote, footer ---------- */
.hero,.page-hero,.cta-band{color:#e9eef5}
.hero h1,.page-hero h1,.hero h2,.cta-band h2{color:#fff}
.hero .kicker,.page-hero .kicker,.cta-band .kicker{color:var(--blue-soft)}
.hero .kicker::before,.page-hero .kicker::before{background:var(--blue-soft)}
.hero .lead,.page-hero .lead,.cta-band .lead,.cta-band p{color:#dfe6ef}
.hero .btn.ghost,.cta-band .btn.ghost{color:#fff;box-shadow:inset 0 0 0 1px rgba(255,255,255,.5)}
.hero .btn.ghost:hover,.cta-band .btn.ghost:hover{background:rgba(255,255,255,.14)}
.crumbs{color:#c8d2de}
.crumbs a{color:#fff}
.scroll-cue{color:#c8d2de}
.prop{background:rgba(8,14,24,.62)}
.prop b{color:#fff}
.prop span{color:#c8d2de}
.hero-props{background:rgba(255,255,255,.14)}

.quote-band{color:#e9eef5}
.quote-band h2,.quote-band .h-lg{color:#fff}
.quote-band .kicker{color:var(--blue-soft)}
.quote-band .kicker::before{background:var(--blue-soft)}
.hero .blue,.page-hero .blue,.cta-band .blue{color:var(--blue-soft)}

.tcard .tcard-cap b{color:#fff}
.tcard .tcard-cap span{color:var(--blue-soft)}
.svc-body h3{color:#fff}
.svc-body p{color:#e2e8f1}
.svc-body .n{color:var(--blue-soft)}
.svc-body .more{color:#fff}

footer,footer p{color:#c3cad4}
footer h3{color:#fff}
.f-grid p{color:#aab3c0}
.f-grid ul a{color:#aab3c0}
.f-grid ul a:hover{color:#fff}
.f-bottom{border-top-color:rgba(255,255,255,.1);color:#98a2b0}
.f-loc{color:#dfe6ef}

.fptc-map{width:100%;aspect-ratio:4/3;border:0;display:block;filter:grayscale(.35)}

/* ============================================================
   WordPress admin bar
   #wpadminbar is position:fixed at top:0 — exactly where our own
   fixed header sits. Offset everything that is pinned to the top.
   WP uses 32px above 782px and 46px below (and it is NOT fixed
   below 600px, it scrolls away, so no offset is needed there).
   ============================================================ */
body.admin-bar .nav{top:32px}
body.admin-bar .skip:focus{top:32px}
body.admin-bar{--wpbar:32px}
body.admin-bar .hero{min-height:calc(100svh - 32px)}
html.js body.admin-bar{scroll-padding-top:calc(124px + 32px)}

@media screen and (max-width:782px){
  body.admin-bar .nav{top:46px}
  body.admin-bar .skip:focus{top:46px}
  body.admin-bar{--wpbar:46px}
  body.admin-bar .hero{min-height:calc(100svh - 46px)}
  html.js body.admin-bar{scroll-padding-top:calc(124px + 46px)}
}
@media screen and (max-width:600px){
  /* the bar stops being fixed here, so the header goes back to the top */
  body.admin-bar .nav{top:0}
  body.admin-bar .hero{min-height:100svh}
}