/* ============================================================
   Boss Chiropractic — site.css
   Light palette (approved) + Olivrae layout pattern.
   Every class name from the dark build is preserved.
   ============================================================ */

:root{
  /* approved palette */
  --bg:#FAF7F5;            /* page background, warm off-white */
  --bg-2:#F4EDEA;          /* deeper warm ground: footer, inputs, menu */
  --surface:#EFE7E4;       /* surface, blush taupe */
  --line:#E3D8D3;          /* hairline on warm ground */
  --line-2:#D6C8C2;        /* stronger hairline */
  --text:#1E2A2B;          /* primary text, teal-black */
  --muted:#4F5D5C;         /* secondary text, muted slate */
  --faint:#5C6968;         /* tertiary text (AA on bg and surface) */
  --accent:#0F5C5F;        /* primary accent, deep teal */
  --accent-2:#14757A;      /* teal, lighter step for gradients */
  --panel:#123B3D;         /* deep teal panel background */
  --panel-2:#0D2C2E;       /* panel, deeper step */
  --cyan:#18D5D7;          /* brand cyan — dark panels only */
  --rose:#8A4A52;          /* supporting accent, under 3% of a page */
  --alert:#A6392E;         /* errors only, never decoration */
  --ink:#FAF7F5;           /* text sitting on --accent or --panel */

  /* type scale — Olivrae */
  --s0:clamp(1rem, 0.96rem + 0.2vw, 1.125rem);
  --s-1:clamp(0.875rem, 0.85rem + 0.12vw, 0.94rem);
  --s1:clamp(1.15rem, 1.05rem + 0.45vw, 1.5rem);
  --s2:clamp(2rem, 1.3rem + 2.6vw, 3.75rem);      /* h2 → 60px */
  --disp:clamp(2.6rem, 1.15rem + 5.6vw, 5.25rem); /* h1 → 84px */
  --disp-s:clamp(2.1rem, 1.3rem + 3.1vw, 3.75rem);
  --maxw:1200px;

  /* radii — Olivrae */
  --r-s:8px; --r-m:12px; --r-l:16px; --r-xl:24px; --r-pill:999px;

  --shadow-s:0 2px 10px rgba(30,42,43,.05);
  --shadow-m:0 10px 30px rgba(30,42,43,.07);
  --shadow-l:0 24px 60px rgba(30,42,43,.10);
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{margin:0;background:var(--bg);color:var(--text);
  font-family:"DM Sans",system-ui,-apple-system,sans-serif;font-size:var(--s0);line-height:1.65;
  -webkit-font-smoothing:antialiased;}
body::before{content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;
  background:
    radial-gradient(58% 46% at 84% -6%, rgba(15,92,95,.07), transparent 62%),
    radial-gradient(46% 40% at 2% 18%, rgba(138,74,82,.045), transparent 64%),
    linear-gradient(180deg,var(--bg),var(--bg));}
body::after{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.035;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");}

h1,h2,h3,.display{font-family:"Instrument Sans","DM Sans",sans-serif;font-weight:500;
  letter-spacing:-0.025em;line-height:1.2;margin:0;text-wrap:balance;color:var(--text);}
h4,h5,h6{font-family:"Instrument Sans","DM Sans",sans-serif;font-weight:500;margin:0;}
p{margin:0;text-wrap:pretty;} a{color:inherit;text-decoration:none;} img,iframe{display:block;max-width:100%;}

.wrap{max-width:var(--maxw);margin-inline:auto;padding-inline:clamp(20px,4vw,44px);}
.mono{font-family:"DM Sans",system-ui,sans-serif;font-size:var(--s-1);letter-spacing:.12em;
  text-transform:uppercase;color:var(--faint);}

/* eyebrow — Olivrae leading dash rule */
.eyebrow{display:inline-flex;align-items:center;gap:12px;width:max-content;max-width:100%;justify-self:start;font-family:"DM Sans",system-ui,sans-serif;
  font-size:var(--s-1);font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);}
.eyebrow::before{content:"";width:26px;height:1px;background:currentColor;flex:none;opacity:.7;}

.muted{color:var(--muted);}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:var(--r-s);}
.skip{position:absolute;left:-999px;background:var(--accent);color:var(--ink);padding:.6em 1em;z-index:200;
  font-weight:600;border-radius:0 0 var(--r-s) 0;}
.skip:focus{left:0;top:0;}

/* scroll progress */
#prog{position:fixed;top:0;left:0;height:3px;width:0;z-index:60;
  background:linear-gradient(90deg,var(--accent),var(--accent-2));}

/* logo */
.logo{flex:none;min-width:0;display:inline-flex;align-items:center;gap:.65rem;font-family:"Instrument Sans",sans-serif;
  font-weight:600;font-size:1.1rem;letter-spacing:-0.02em;color:var(--text);}
.logo .mk{width:34px;height:34px;flex:none;}
.logo .mk rect{fill:none;stroke:var(--accent);stroke-width:1.4;}
.logo .mk .v{fill:var(--accent);}
.logo b{font-weight:600;} .logo span{color:var(--faint);font-weight:400;}
.logo img{flex:none;filter:none;}

header{position:sticky;top:0;z-index:50;backdrop-filter:blur(12px);background:rgba(250,247,245,.72);
  border-bottom:1px solid transparent;transition:border-color .3s,background .3s,box-shadow .3s,transform .35s ease;
  will-change:transform;}
header.hide{transform:translateY(-100%);}
header.on{border-color:var(--line);background:rgba(250,247,245,.94);box-shadow:var(--shadow-s);}
.nav{display:flex;align-items:center;justify-content:space-between;height:76px;gap:1rem;}
.nav-links{display:flex;gap:2rem;font-size:var(--s-1);font-weight:500;}
.nav-links a{padding-block:4px;color:var(--muted);position:relative;}
.nav-links a::after{content:"";position:absolute;left:0;bottom:-5px;height:1px;width:0;background:var(--accent);transition:width .25s;}
.nav-links a:hover{color:var(--text);} .nav-links a:hover::after{width:100%;}
.nav-r{display:flex;align-items:center;gap:1.2rem;}
.nav-phone{font-family:"Instrument Sans",sans-serif;font-weight:600;font-size:var(--s-1);white-space:nowrap;color:var(--text);}
/* phone-only call button: the number has to stay one tap away on every page */
.nav-call{display:none;align-items:center;gap:.45em;font-family:"Instrument Sans",sans-serif;
  font-weight:600;font-size:var(--s-1);color:var(--accent);text-decoration:none;
  border:1px solid var(--line-2);border-radius:999px;padding:.66em .95em;white-space:nowrap;}
.nav-call svg{width:15px;height:15px;flex:none;}
.nav-call:hover,.nav-call:active{border-color:var(--accent);background:rgba(15,92,95,.06);}
@media(max-width:460px){.nav-call span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}
  .nav-call{padding:0;min-width:44px;min-height:44px;justify-content:center;}
  .nav-call svg{width:18px;height:18px;}}

/* buttons — Olivrae pills */
.btn{font-size:var(--s0);font-family:inherit;display:inline-flex;align-items:center;gap:.5em;font-family:"Instrument Sans",sans-serif;font-weight:500;
  padding:.85em 1.6em;border-radius:var(--r-pill);cursor:pointer;border:1px solid transparent;line-height:1.2;
  transition:transform .16s,background .18s,border-color .18s,color .18s,box-shadow .18s;}
.btn-primary{background:var(--accent);color:var(--ink);box-shadow:var(--shadow-s);}
.btn-primary:hover{background:var(--accent-2);box-shadow:var(--shadow-m);transform:translateY(-1px);}
.btn-ghost{border-color:var(--line-2);color:var(--text);background:transparent;}
.btn-ghost:hover{border-color:var(--accent);color:var(--accent);background:rgba(15,92,95,.05);}

@media(max-width:880px){.nav-links,.nav-phone{display:none;}.nav-call{display:inline-flex;}
  }

/* ---------- HERO ---------- */
.hero{position:relative;padding:clamp(40px,6vw,84px) 0 clamp(56px,8vw,120px);}
.hero .idx{position:absolute;top:clamp(20px,4vw,60px);right:clamp(20px,4vw,44px);color:var(--faint);}
.hero-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:0;}
.hero h1{font-size:var(--disp);text-transform:none;position:relative;z-index:3;line-height:1.2;}
.line-mask{overflow:hidden;display:block;padding-bottom:.09em;margin-bottom:-.09em;}
.line{display:block;transform:translateY(110%);}
.in .line{transform:translateY(0);transition:transform .9s cubic-bezier(.16,1,.3,1);}
.in .line.l2{transition-delay:.09s;} .in .line.l3{transition-delay:.18s;} .in .line.l4{transition-delay:.27s;}

/* Olivrae signature: one serif italic accent word inside a sans headline */
.hl{font-family:"Instrument Serif","Instrument Sans",Georgia,serif;font-style:italic;font-weight:400;
  color:var(--accent);letter-spacing:-0.005em;}
.out{-webkit-text-stroke:1.5px var(--accent);color:transparent;}

.hero-media{position:absolute;right:clamp(-20px,-2vw,0px);top:50%;transform:translateY(-46%);
  width:min(46%,540px);aspect-ratio:4/5;border-radius:var(--r-xl);overflow:hidden;z-index:1;
  -webkit-mask-image:linear-gradient(180deg,#000 80%,transparent);mask-image:linear-gradient(180deg,#000 80%,transparent);
  opacity:0;transition:opacity 1s .3s;}
.in .hero-media{opacity:1;}
.hero-media img,.hero-media iframe{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border:0;}
.hero-media iframe{display:none;background:transparent;pointer-events:none;}
.hero-foot{display:flex;flex-wrap:wrap;align-items:center;gap:16px 26px;margin-top:clamp(28px,4vw,48px);
  position:relative;z-index:3;opacity:0;transform:translateY(14px);}
.in .hero-foot{opacity:1;transform:none;transition:opacity .8s .5s,transform .8s .5s;}
.hero-foot .lede{color:var(--muted);font-size:var(--s1);max-width:32ch;}
@media(max-width:820px){
  .hero-media{position:relative;right:auto;top:auto;transform:none;width:100%;max-width:380px;margin-top:26px;opacity:1;
    -webkit-mask-image:none;mask-image:none;}
  .in .hero-media{opacity:1;}
  .hero h1{font-size:var(--disp-s);}
}

/* marquee */
.marq{border-block:1px solid var(--line);overflow:hidden;background:var(--surface);}
.marq-track{display:flex;gap:0;width:max-content;animation:scrollx 34s linear infinite;}
.marq-track span{font-family:"Instrument Sans",sans-serif;font-weight:500;font-size:var(--s1);padding:16px 0;
  color:var(--muted);white-space:nowrap;}
.marq-track .dot{color:var(--accent);padding-inline:26px;}
@keyframes scrollx{to{transform:translateX(-50%);}}
@media(prefers-reduced-motion:reduce){.marq-track{animation:none;}}

section{padding:clamp(64px,9vw,130px) 0;position:relative;}
.shead{display:flex;align-items:flex-end;gap:clamp(16px,3vw,40px);margin-bottom:clamp(32px,4vw,60px);flex-wrap:wrap;}
.shead .num{font-family:"DM Sans",sans-serif;font-size:var(--s-1);font-weight:500;letter-spacing:.1em;color:var(--accent);
  border:1px solid var(--line-2);border-radius:var(--r-pill);padding:.35em .85em;}
.shead h2{font-size:var(--s2);flex:1;min-width:min(100%,20ch);}
.shead p{color:var(--muted);max-width:40ch;}

.js .obs{opacity:0;transform:translateY(26px);}
.obs.seen{opacity:1;transform:none;transition:opacity .8s cubic-bezier(.16,1,.3,1),transform .8s cubic-bezier(.16,1,.3,1);}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto;}
  .line{transform:none;}.hero-media,.hero-foot{opacity:1;transform:none;}.obs{opacity:1;transform:none;}}

/* ---------- 3D SPINE — deep teal band ---------- */
.spine-shell{position:relative;width:100vw;margin-left:calc(50% - 50vw);border-radius:0;padding:0;overflow:hidden;
  background:var(--panel);}
.spine-frame{position:relative;overflow:hidden;background:var(--panel);padding:50px;}
.spine-frame iframe{width:100%;height:calc(100vh - 100px);border:0;display:block;background:var(--panel);
  border-radius:var(--r-l);}
.spine-markers{position:absolute;inset:50px;z-index:4;pointer-events:none;}
.smk{position:absolute;transform:translate(-50%,-50%);width:34px;height:34px;border-radius:50%;display:grid;place-items:center;
  font-family:"Instrument Sans",sans-serif;font-weight:600;font-size:1rem;color:var(--panel-2);background:var(--cyan);
  box-shadow:0 0 0 4px rgba(24,213,215,.2),0 4px 16px rgba(0,0,0,.4);}
.smk.m1{left:130px;top:50%;}
.smk.m2{left:50%;top:20%;}
.smk.m3{left:92px;top:96px;}
.smk.m4{left:calc(100% - 129px);top:96px;}
@media(max-width:900px){.spine-markers{display:none;}}
.smk::before{content:"";position:absolute;inset:-5px;border-radius:50%;border:2px solid var(--cyan);
  animation:smkpulse 1.9s ease-out infinite;}
@keyframes smkpulse{0%{transform:scale(1);opacity:.65;}100%{transform:scale(2);opacity:0;}}
@media(prefers-reduced-motion:reduce){.smk::before{animation:none;opacity:.4;}}
.spine-guard{position:absolute;inset:0;z-index:3;cursor:pointer;display:flex;align-items:center;justify-content:flex-end;
  padding:24px clamp(24px,5vw,90px) 24px 24px;
  background:radial-gradient(58% 58% at 50% 50%, rgba(18,59,61,.72), rgba(18,59,61,.35) 68%, rgba(18,59,61,.1));
  animation:guardIn .5s ease both;}
@keyframes guardIn{from{opacity:0;}to{opacity:1;}}
.guard-card{max-width:440px;width:100%;text-align:left;background:rgba(13,44,46,.88);border:1px solid rgba(24,213,215,.22);
  border-radius:var(--r-xl);padding:clamp(22px,3vw,32px);backdrop-filter:blur(12px);box-shadow:0 24px 70px rgba(0,0,0,.45);
  transition:transform .2s,border-color .2s;}
.spine-guard:hover .guard-card,.spine-guard:focus-visible .guard-card{transform:translateY(-3px);border-color:var(--cyan);}
.guard-eyebrow{display:inline-flex;align-items:center;gap:10px;font-family:"DM Sans",sans-serif;font-size:.72rem;
  letter-spacing:.16em;text-transform:uppercase;color:var(--cyan);}
.guard-eyebrow::before{content:"";width:22px;height:1px;background:currentColor;flex:none;opacity:.7;}
.guard-title{font-family:"Instrument Sans",sans-serif;font-weight:500;font-size:clamp(1.5rem,1rem + 1.4vw,2.1rem);
  margin:10px 0 18px;color:#F2FBFB;letter-spacing:-0.02em;}
.guard-steps{list-style:none;margin:0 0 22px;padding:0;display:grid;gap:13px;counter-reset:g;}
.guard-steps li{display:flex;gap:12px;align-items:flex-start;}
.guard-steps li::before{counter-increment:g;content:counter(g);flex:none;width:24px;height:24px;border-radius:50%;
  background:var(--cyan);color:var(--panel-2);font-family:"Instrument Sans",sans-serif;font-weight:600;font-size:.78rem;
  display:grid;place-items:center;margin-top:1px;}
.guard-steps li p{margin:0;color:rgba(242,251,251,.72);font-size:var(--s-1);line-height:1.55;}
.guard-steps li b{color:#F2FBFB;font-weight:600;}
.guard-cta{display:inline-flex;align-items:center;gap:.5em;font-family:"Instrument Sans",sans-serif;font-weight:500;
  color:var(--panel-2);background:var(--cyan);border-radius:var(--r-pill);padding:.72em 1.4em;font-size:var(--s-1);}
.guard-cta::after{content:"\2192";}
.spine-release{position:absolute;top:18px;right:18px;z-index:4;font-family:"Instrument Sans",sans-serif;font-weight:500;
  font-size:var(--s-1);color:var(--panel-2);background:var(--cyan);border:0;border-radius:var(--r-pill);
  padding:.6em 1.15em;cursor:pointer;box-shadow:0 6px 26px rgba(0,0,0,.35);}
.spine-release[hidden]{display:none;}
.snote{margin-top:16px;color:var(--faint);text-align:center;font-size:var(--s-1);}
.snote a{color:var(--accent);}

/* ---------- treatments list ---------- */
.treat-list{border-top:1px solid var(--line);}
.trow{display:grid;grid-template-columns:auto 1fr auto;gap:clamp(16px,3vw,44px);align-items:center;
  padding:clamp(22px,3vw,34px) clamp(0px,1vw,14px);border-bottom:1px solid var(--line);
  border-radius:var(--r-l);transition:padding-left .3s,background .3s;}
.trow:hover{padding-left:20px;background:var(--surface);}
.trow .n{font-family:"DM Sans",sans-serif;color:var(--faint);font-size:var(--s-1);letter-spacing:.08em;}
.trow h3{font-size:clamp(1.35rem, 1rem + 1.5vw, 2rem);font-weight:500;}
.trow p{color:var(--muted);font-size:var(--s-1);margin-top:8px;max-width:56ch;}
.trow .go{color:var(--accent);opacity:0;transform:translateX(-8px);transition:opacity .25s,transform .25s;}
.trow:hover .go{opacity:1;transform:none;}
@media(max-width:620px){.trow{grid-template-columns:auto 1fr;}.trow .go{display:none;}}

/* ---------- doctor ---------- */
.doc{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,4vw,60px);align-items:center;}
@media(max-width:820px){.doc{grid-template-columns:1fr;}}
.doc-photo{border-radius:var(--r-xl);overflow:hidden;aspect-ratio:4/5;background:var(--surface);position:relative;
  box-shadow:var(--shadow-m);}
.doc-photo .ph{position:absolute;inset:0;display:grid;place-items:center;color:var(--faint);text-align:center;
  font-size:var(--s-1);padding:20px;}
.doc h2{font-size:var(--disp-s);}
.creds{list-style:none;padding:0;margin:24px 0 0;display:grid;gap:12px;}
.creds li{display:flex;gap:12px;font-size:var(--s0);color:var(--muted);}
.creds li svg{width:20px;height:20px;color:var(--accent);flex:none;margin-top:4px;}

/* ---------- reviews / awards ---------- */
.reviews{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
@media(max-width:820px){.reviews{grid-template-columns:1fr;}}
.review{background:var(--surface);border-radius:var(--r-l);padding:30px;display:flex;flex-direction:column;gap:16px;}
.stars{display:flex;gap:3px;color:var(--accent);} .stars svg{width:15px;height:15px;}
.review p{font-size:var(--s0);color:var(--text);}
.who{display:flex;align-items:center;gap:12px;margin-top:auto;}
.av{width:38px;height:38px;border-radius:50%;background:linear-gradient(150deg,var(--accent),var(--accent-2));
  color:var(--ink);display:grid;place-items:center;font-family:"Instrument Sans",sans-serif;font-weight:600;font-size:.85rem;}
.who b{font-family:"Instrument Sans",sans-serif;font-weight:500;font-size:var(--s-1);}
.who span{color:var(--faint);font-size:.75rem;display:block;}
.awards{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
@media(max-width:720px){.awards{grid-template-columns:1fr;max-width:320px;margin-inline:auto;}}
.award{background:var(--surface);border-radius:var(--r-l);padding:28px;display:grid;place-items:center;aspect-ratio:4/3;
  transition:box-shadow .25s,transform .25s;}
.award:hover{box-shadow:var(--shadow-m);transform:translateY(-2px);}
.award img{max-width:100%;max-height:190px;object-fit:contain;}

/* ---------- visit ---------- */
.visit{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,4vw,48px);}
@media(max-width:820px){.visit{grid-template-columns:1fr;}}
.addr{display:flex;gap:12px;color:var(--muted);margin-bottom:6px;}
.addr svg{width:20px;height:20px;color:var(--accent);flex:none;margin-top:3px;}
.hours{list-style:none;padding:0;margin:22px 0;border-top:1px solid var(--line);}
.hours li{display:flex;justify-content:space-between;gap:16px;padding:13px 0;border-bottom:1px solid var(--line);
  font-size:var(--s0);}
.hours li span:first-child{color:var(--faint);font-weight:500;}
.hours li span:last-child{color:var(--text);text-align:right;}
.map{border-radius:var(--r-l);overflow:hidden;min-height:360px;box-shadow:var(--shadow-s);}
.map iframe{width:100%;height:100%;min-height:360px;border:0;filter:none;}

/* ---------- CTA band — deep teal ground ---------- */
.ctaband{position:relative;border-radius:var(--r-xl);overflow:hidden;text-align:center;
  padding:clamp(44px,7vw,88px);background:linear-gradient(150deg,var(--panel),var(--panel-2));color:var(--ink);}
.ctaband::before{content:"";position:absolute;inset:0;
  background:radial-gradient(60% 100% at 50% 0%,rgba(24,213,215,.16),transparent 70%);}
.ctaband h2{font-size:var(--disp-s);position:relative;color:var(--ink);}
.ctaband .hl{color:var(--cyan);}
.ctaband p{color:rgba(250,247,245,.76);font-size:var(--s1);margin:16px auto 30px;max-width:42ch;position:relative;}
.ctaband .btn{position:relative;}
.ctaband .btn-primary{background:var(--cyan);color:var(--panel-2);}
.ctaband .btn-primary:hover{background:#3FE2E4;}
.ctaband .btn-ghost{border-color:rgba(250,247,245,.35);color:var(--ink);}
.ctaband .btn-ghost:hover{border-color:var(--cyan);color:var(--cyan);background:rgba(24,213,215,.08);}

/* ---------- footer ---------- */
footer{border-top:1px solid var(--line);background:var(--bg-2);padding:60px 0 28px;}
.fgrid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:32px;}
@media(max-width:720px){.fgrid{grid-template-columns:1fr;}}
footer h3{font-family:"DM Sans",sans-serif;font-size:var(--s-1);font-weight:500;letter-spacing:.14em;
  text-transform:uppercase;color:var(--faint);margin:0 0 14px;}
footer a{color:var(--muted);} footer a:hover{color:var(--accent);}
.flinks{display:grid;gap:10px;font-size:var(--s-1);}
.flinks a{display:inline-block;padding-block:3px;}
.fbot{margin-top:40px;padding-top:20px;border-top:1px solid var(--line);display:flex;justify-content:space-between;
  flex-wrap:wrap;gap:10px;color:var(--faint);font-size:var(--s-1);}
.mag{will-change:transform;}

/* ============================================================
   shared sub-page helpers
   ============================================================ */
.phero{padding:clamp(100px,15vh,168px) 0 clamp(36px,6vw,64px);position:relative;}
.phero .eyebrow{display:inline-flex;margin-bottom:18px;}
.phero h1{font-size:var(--disp-s);text-transform:none;}
.phero .lede{color:var(--muted);font-size:var(--s1);max-width:56ch;margin-top:20px;}
.phero .cta{display:flex;gap:14px;flex-wrap:wrap;margin-top:32px;}
.crumb{font-family:"DM Sans",sans-serif;font-size:var(--s-1);letter-spacing:.1em;text-transform:uppercase;
  color:var(--faint);margin-bottom:22px;}
.crumb a{color:var(--faint);} .crumb a:hover{color:var(--accent);}
.prose{max-width:70ch;color:var(--muted);font-size:var(--s0);}
.prose p{margin-bottom:1.1em;} .prose strong{color:var(--text);font-weight:600;}
.split{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(28px,5vw,64px);align-items:center;}
@media(max-width:820px){.split{grid-template-columns:1fr;}}
.ph-img{position:relative;border-radius:var(--r-xl);overflow:hidden;aspect-ratio:4/3;background:var(--surface);
  display:grid;place-items:center;text-align:center;box-shadow:var(--shadow-s);}
.ph-img span{color:var(--faint);font-family:"DM Sans",sans-serif;font-size:var(--s-1);letter-spacing:.03em;
  padding:22px;line-height:1.6;}
.ph-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.cards3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
@media(max-width:820px){.cards3{grid-template-columns:1fr;}}
.ecard{border-radius:var(--r-l);padding:28px;background:var(--surface);
  transition:box-shadow .25s,transform .25s;}
.ecard:hover{box-shadow:var(--shadow-m);transform:translateY(-3px);}
.ecard h3{font-size:var(--s1);margin-bottom:10px;} .ecard p{color:var(--muted);font-size:var(--s-1);}
.ecard .k{display:inline-flex;align-items:center;gap:10px;font-family:"DM Sans",sans-serif;color:var(--accent);
  font-size:var(--s-1);letter-spacing:.12em;text-transform:uppercase;margin-bottom:14px;}
.ecard .k::before{content:"";width:20px;height:1px;background:currentColor;flex:none;opacity:.7;}
.faq{border-top:1px solid var(--line);}
.faq details{border-bottom:1px solid var(--line);padding:22px 0;}
.faq summary{cursor:pointer;list-style:none;font-family:"Instrument Sans",sans-serif;font-weight:500;
  font-size:var(--s1);display:flex;justify-content:space-between;gap:16px;color:var(--text);}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::after{content:"+";color:var(--accent);font-weight:400;}
.faq details[open] summary::after{content:"\2013";}
.faq details p{color:var(--muted);margin-top:12px;max-width:70ch;}

/* ---- full-screen menu ---- */
.menu-btn{display:inline-flex;align-items:center;gap:.55em;background:none;border:1px solid var(--line-2);
  color:var(--text);cursor:pointer;padding:.7em 1.15em;border-radius:var(--r-pill);
  font-family:"Instrument Sans",sans-serif;font-weight:500;font-size:var(--s-1);
  transition:border-color .2s,color .2s,background .2s;}
.menu-btn:hover{border-color:var(--accent);color:var(--accent);background:rgba(15,92,95,.05);}
.menu-btn svg{width:16px;height:16px;}
#mm{position:fixed;inset:0;z-index:120;background:rgba(250,247,245,.98);backdrop-filter:blur(18px);
  overflow-y:auto;opacity:0;visibility:hidden;transition:opacity .3s,visibility .3s;}
#mm.on{opacity:1;visibility:visible;}
.mm-top{display:flex;align-items:center;justify-content:space-between;height:76px;gap:1rem;}
.mm-close{background:none;border:1px solid var(--line-2);color:var(--text);width:44px;height:44px;cursor:pointer;
  display:grid;place-items:center;border-radius:var(--r-pill);transition:border-color .2s,color .2s;}
.mm-close:hover{border-color:var(--accent);color:var(--accent);}
.mm-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(24px,3vw,48px);
  padding:clamp(28px,5vw,60px) 0 clamp(40px,6vw,80px);}
@media(max-width:1000px){.mm-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:600px){.mm-grid{grid-template-columns:1fr;}}
.mm-col h4{font-family:"DM Sans",sans-serif;font-size:var(--s-1);font-weight:500;letter-spacing:.16em;
  text-transform:uppercase;color:var(--accent);margin:0 0 18px;padding-bottom:12px;border-bottom:1px solid var(--line);}
.mm-col nav{display:grid;gap:11px;}
.mm-col a{color:var(--muted);font-size:var(--s-1);line-height:1.45;transition:color .18s,transform .18s;}
.mm-col a:hover{color:var(--text);transform:translateX(4px);}
.mm-col a[aria-current="page"]{color:var(--accent);font-weight:500;}
.mm-foot{border-top:1px solid var(--line);padding:26px 0 40px;display:flex;flex-wrap:wrap;
  align-items:center;justify-content:space-between;gap:18px;}
.mm-foot .ph{font-family:"Instrument Sans",sans-serif;font-weight:600;font-size:var(--s1);}
body.mm-open{overflow:hidden;}

/* ---- anchor nav ---- */
.anchors{display:flex;flex-wrap:wrap;gap:8px;margin-top:28px;}
.anchors a{font-family:"DM Sans",sans-serif;font-size:var(--s-1);color:var(--muted);
  border:1px solid var(--line-2);border-radius:var(--r-pill);padding:.45em 1.1em;
  transition:border-color .2s,color .2s,background .2s;}
.anchors a:hover{border-color:var(--accent);color:var(--accent);background:rgba(15,92,95,.05);}

/* ---- hub grids ---- */
.hubgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px;}
.hubcard{background:var(--surface);border-radius:var(--r-l);padding:28px 26px;display:flex;flex-direction:column;gap:9px;
  transition:box-shadow .25s,transform .25s;min-height:160px;}
.hubcard:hover{box-shadow:var(--shadow-m);transform:translateY(-3px);}
.hubcard .k{display:inline-flex;align-items:center;gap:10px;font-family:"DM Sans",sans-serif;font-size:.72rem;
  letter-spacing:.14em;text-transform:uppercase;color:var(--accent);}
.hubcard .k::before{content:"";width:18px;height:1px;background:currentColor;flex:none;opacity:.7;}
.hubcard h3{font-size:var(--s1);font-weight:500;}
.hubcard p{color:var(--muted);font-size:var(--s-1);}
.hubcard .go{color:var(--accent);font-size:var(--s-1);margin-top:auto;padding-top:8px;
  font-family:"Instrument Sans",sans-serif;font-weight:500;opacity:1;transition:color .25s;}
.hubcard:hover .go{opacity:1;}

/* ---- service / condition page body ---- */
.svc{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:clamp(32px,5vw,72px);align-items:start;}
@media(max-width:900px){.svc{grid-template-columns:1fr;}}
.svc-body{max-width:70ch;}
.svc-body h2{font-size:clamp(1.5rem, 1.15rem + 1.4vw, 2rem);margin:clamp(38px,5vw,58px) 0 16px;}
.svc-body h2:first-child{margin-top:0;}
.svc-body h3{font-size:var(--s1);font-weight:500;margin:32px 0 10px;}
.svc-body p{color:var(--muted);margin-bottom:1.1em;}
.svc-body strong{color:var(--text);font-weight:600;}
.svc-body a{color:var(--accent);text-decoration:underline;text-underline-offset:3px;
  text-decoration-color:rgba(15,92,95,.35);text-decoration-thickness:1px;}
.svc-body a:hover{text-decoration-color:var(--accent);}
.svc-body ul,.svc-body ol{color:var(--muted);margin:0 0 1.2em;padding-left:1.3em;}
.svc-body li{margin-bottom:.55em;}
.svc-body li::marker{color:var(--accent);}
.svc-body figure{margin:32px 0;}
.svc-body figure img{width:100%;height:auto;border-radius:var(--r-xl);}
.svc-body figcaption{color:var(--faint);font-size:var(--s-1);margin-top:12px;}
.svc-aside{position:sticky;top:100px;display:grid;gap:18px;}
@media(max-width:900px){.svc-aside{position:static;}}
.aside-card{border-radius:var(--r-l);padding:26px;background:var(--surface);}
.aside-card h3{font-size:var(--s1);margin-bottom:10px;}
.aside-card p{color:var(--muted);font-size:var(--s-1);margin-bottom:18px;}
.aside-card .btn{width:100%;justify-content:center;}
.aside-card .btn+.btn{margin-top:10px;}
.aside-list{list-style:none;padding:0;margin:0;display:grid;gap:11px;}
.aside-list a{color:var(--muted);font-size:var(--s-1);display:flex;gap:9px;transition:color .18s;}
.aside-list a::before{content:"\2192";color:var(--accent);flex:none;}
.aside-list a:hover{color:var(--text);}

/* ---- key points card — Olivrae muted-green card with check marks ---- */
.keypoints{background:rgba(15,92,95,.07);border-radius:var(--r-xl);padding:clamp(24px,3vw,32px);margin:32px 0;}
.keypoints h3,.keypoints .kp-title{font-family:"Instrument Sans","DM Sans",sans-serif;font-size:var(--s1);
  font-weight:500;letter-spacing:-0.02em;line-height:1.25;margin:0 0 18px;color:var(--text);}
.keypoints ul{list-style:none;padding:0;margin:0;display:grid;gap:13px;}
.keypoints li{display:flex;gap:12px;align-items:flex-start;color:var(--muted);font-size:var(--s-1);line-height:1.6;}
.keypoints li::before{content:"";flex:none;width:20px;height:20px;margin-top:2px;border-radius:50%;
  background:var(--accent) center/12px 12px no-repeat;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FAF7F5' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6L9 17l-5-5'/%3E%3C/svg%3E");}
.keypoints li b{color:var(--text);font-weight:600;}

/* ---- stat cards — large rounded cards on a tonal surface ---- */
.statgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;margin:32px 0;}
.stat{background:var(--surface);border-radius:var(--r-xl);padding:clamp(24px,3vw,34px);display:flex;
  flex-direction:column;gap:8px;}
.stat b{font-family:"Instrument Sans",sans-serif;font-weight:500;font-size:clamp(2rem, 1.4rem + 2vw, 3rem);
  line-height:1.05;letter-spacing:-0.03em;color:var(--accent);}
.stat b .hl{font-size:1em;}
.stat span{color:var(--muted);font-size:var(--s-1);line-height:1.5;}

/* ---- Learn more pill ---- */
.pill{display:inline-flex;align-items:center;gap:.5em;font-family:"Instrument Sans",sans-serif;font-weight:500;
  font-size:var(--s-1);color:var(--accent);border:1px solid var(--line-2);border-radius:var(--r-pill);
  padding:.6em 1.25em;transition:border-color .2s,background .2s;}
.pill::after{content:"\2192";}
.pill:hover{border-color:var(--accent);background:rgba(15,92,95,.05);}

/* ---- callouts ---- */
.callout{border-left:2px solid var(--rose);background:rgba(138,74,82,.06);
  padding:22px 26px;margin:30px 0;border-radius:0 var(--r-m) var(--r-m) 0;}
.callout p{color:var(--text);margin:0;font-size:var(--s0);}
.callout p+p{margin-top:.8em;}
.callout .k{display:inline-flex;align-items:center;gap:10px;font-family:"DM Sans",sans-serif;font-size:.72rem;
  letter-spacing:.16em;text-transform:uppercase;color:var(--rose);margin-bottom:10px;}
.callout .k::before{content:"";width:18px;height:1px;background:currentColor;flex:none;opacity:.7;}

/* ---- medical disclaimer ---- */
.disc{border-radius:var(--r-m);padding:18px 22px;margin-top:44px;color:var(--faint);font-size:var(--s-1);
  line-height:1.6;background:var(--surface);}

/* ---- inline spine widget — deep teal band ---- */
.cond-spine{border-radius:var(--r-xl);overflow:hidden;background:var(--panel);margin:36px 0;padding:14px 14px 0;
  box-shadow:var(--shadow-m);}
.cond-spine iframe{width:100%;height:min(66vh,560px);border:0;display:block;background:var(--panel);
  border-radius:var(--r-m);}
.cond-spine .cap{padding:14px 6px;margin-top:2px;color:rgba(250,247,245,.68);
  font-size:var(--s-1);background:var(--panel-2);display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;}
.cond-spine .cap a{color:var(--cyan);}

/* ---- review quotes ---- */
.quotes{columns:3;column-gap:20px;}
@media(max-width:1000px){.quotes{columns:2;}}
@media(max-width:640px){.quotes{columns:1;}}
.quote{break-inside:avoid;border-radius:var(--r-l);padding:28px;background:var(--surface);margin-bottom:20px;
  transition:box-shadow .25s;}
.quote:hover{box-shadow:var(--shadow-m);}
.quote p{color:var(--text);font-size:var(--s0);line-height:1.65;}
.quote .who{margin-top:18px;}
.quote .src{font-family:"DM Sans",sans-serif;font-size:.68rem;letter-spacing:.12em;
  text-transform:uppercase;color:var(--faint);}

/* ---- blog ---- */
.post-list{border-top:1px solid var(--line);}
.post-row{display:grid;grid-template-columns:130px 1fr auto;gap:clamp(14px,3vw,36px);align-items:baseline;
  padding:clamp(20px,3vw,30px) clamp(0px,1vw,14px);border-bottom:1px solid var(--line);border-radius:var(--r-l);
  transition:padding-left .3s,background .3s;}
.post-row:hover{padding-left:20px;background:var(--surface);}
.post-row time{font-family:"DM Sans",sans-serif;font-size:var(--s-1);color:var(--faint);white-space:nowrap;
  letter-spacing:.06em;}
.post-row h3{font-size:clamp(1.15rem, 0.95rem + 0.7vw, 1.6rem);font-weight:500;}
.post-row p{color:var(--muted);font-size:var(--s-1);margin-top:8px;max-width:60ch;}
.post-row .go{color:var(--accent);opacity:0;transform:translateX(-8px);transition:opacity .25s,transform .25s;}
.post-row:hover .go{opacity:1;transform:none;}
@media(max-width:700px){.post-row{grid-template-columns:1fr;gap:6px;}.post-row .go{display:none;}}
.post-meta{display:flex;flex-wrap:wrap;gap:8px 22px;margin-top:24px;font-family:"DM Sans",sans-serif;
  font-size:var(--s-1);color:var(--faint);}
.post-meta b{color:var(--muted);font-weight:500;}
.post-hero{border-radius:var(--r-xl);overflow:hidden;margin:0 0 clamp(30px,4vw,48px);aspect-ratio:16/7;}
.post-hero img{width:100%;height:100%;object-fit:cover;}
.related{border-top:1px solid var(--line);margin-top:clamp(44px,6vw,72px);padding-top:32px;}
.related h3{font-family:"DM Sans",sans-serif;font-size:var(--s-1);letter-spacing:.14em;text-transform:uppercase;
  color:var(--faint);font-weight:500;margin-bottom:18px;}
.related-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px;}
.related-grid a{border-radius:var(--r-m);padding:20px 22px;background:var(--surface);
  font-family:"Instrument Sans",sans-serif;font-weight:500;font-size:var(--s-1);color:var(--text);
  transition:box-shadow .22s,transform .22s;display:block;}
.related-grid a:hover{box-shadow:var(--shadow-m);transform:translateY(-2px);}
.related-grid a span{display:block;color:var(--faint);font-family:"DM Sans",sans-serif;
  font-weight:400;font-size:.78rem;margin-top:6px;}

/* ---- forms ---- */
.frm{border-radius:var(--r-xl);padding:clamp(24px,3.5vw,36px);background:var(--surface);max-width:720px;}
.frm-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
@media(max-width:600px){.frm-grid{grid-template-columns:1fr;}}
.fld{display:flex;flex-direction:column;gap:7px;}
.fld.full{grid-column:1/-1;}
.fld label{font-size:var(--s-1);color:var(--muted);font-weight:500;}
.fld input,.fld select,.fld textarea{background:var(--bg);border:1px solid var(--line-2);border-radius:var(--r-s);
  padding:.8em .9em;color:var(--text);font-family:"DM Sans",sans-serif;font-size:var(--s0);width:100%;}
.fld input:focus,.fld select:focus,.fld textarea:focus{outline:none;border-color:var(--accent);
  box-shadow:0 0 0 3px rgba(15,92,95,.12);}
.fld input::placeholder,.fld textarea::placeholder{color:var(--faint);}
.fld input[aria-invalid="true"],.fld textarea[aria-invalid="true"]{border-color:var(--alert);}
.frm-note{color:var(--faint);font-size:var(--s-1);margin-top:16px;}
.frm .btn{margin-top:22px;}
.hp{position:absolute;left:-9999px;opacity:0;height:0;overflow:hidden;}

/* ---- data table ---- */
.tblwrap{overflow-x:auto;border-radius:var(--r-l);margin:28px 0;background:var(--surface);}
.tbl{border-collapse:collapse;width:100%;min-width:460px;font-size:var(--s-1);}
.tbl th{text-align:left;font-family:"DM Sans",sans-serif;font-size:.72rem;letter-spacing:.12em;
  text-transform:uppercase;color:var(--faint);font-weight:500;padding:15px 18px;
  border-bottom:1px solid var(--line-2);}
.tbl td{padding:14px 18px;border-bottom:1px solid var(--line);color:var(--muted);vertical-align:top;}
.tbl tr:last-child td{border-bottom:0;}
.tbl td:first-child{color:var(--text);font-weight:500;}

/* ---- steps ---- */
.steps{list-style:none;padding:0;margin:28px 0;display:grid;gap:12px;}
.steps li{background:var(--surface);border-radius:var(--r-l);padding:24px 26px;display:grid;
  grid-template-columns:38px 1fr;gap:16px;align-items:start;}
.steps li .n{font-family:"Instrument Sans",sans-serif;font-weight:500;font-size:1.5rem;color:var(--accent);line-height:1;}
.steps li h3{font-size:var(--s1);font-weight:500;margin-bottom:6px;}
.steps li p{color:var(--muted);font-size:var(--s-1);margin:0;}

/* ---- award strip ---- */
.awardstrip{display:flex;flex-wrap:wrap;gap:14px;align-items:center;margin-top:26px;}
.awardstrip img{height:74px;width:auto;}
.awardstrip .yrs{font-family:"DM Sans",sans-serif;font-size:var(--s-1);color:var(--muted);letter-spacing:.06em;
  border:1px solid var(--line-2);border-radius:var(--r-pill);padding:.55em 1.1em;}

/* ---- misc ---- */
.lead-tight{color:var(--muted);font-size:var(--s1);max-width:56ch;margin-top:18px;}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,4vw,48px);}
@media(max-width:820px){.grid2{grid-template-columns:1fr;}}
.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;}
@media(max-width:960px) and (min-width:721px){.fgrid{grid-template-columns:1fr 1fr;}}

/* ===== V3 HOME DESIGN SYSTEM =========================================
   Scoped to html.v3 so the other 61 pages are untouched.
   Frame, spacing and radii from Dermato. Content structures from Olivrae.
   ==================================================================== */

.v3{
  --inset:clamp(16px,3.2vw,50px);
  --rhythm:clamp(88px,12vw,200px);
  --r-panel:30px; --r-card:20px; --r-chip:12px;
  --shadow-float:0 18px 50px rgba(30,42,43,.10);
  --shadow-lift:0 28px 70px rgba(30,42,43,.14);
  --hair:rgba(30,42,43,.12);
}
.v3 body{background:var(--bg);}
.v3 body::before{background:
  radial-gradient(62% 48% at 88% -8%, rgba(15,92,95,.06), transparent 64%),
  radial-gradient(44% 38% at -4% 14%, rgba(138,74,82,.04), transparent 66%);}

/* ---------- floating pill nav ---------- */
.v3 header#hdr{position:fixed;top:14px;left:0;right:0;background:none;border:0;box-shadow:none;
  backdrop-filter:none;padding-inline:var(--inset);}
.v3 header#hdr.on{background:none;box-shadow:none;border:0;}
.v3 #hdr .wrap.nav{max-width:none;margin:0;padding:10px 12px 10px 22px;height:auto;
  background:rgba(250,247,245,.78);backdrop-filter:blur(16px) saturate(1.3);
  border:1px solid rgba(255,255,255,.6);border-radius:var(--r-pill);
  box-shadow:0 10px 34px rgba(30,42,43,.10);transition:box-shadow .3s,background .3s;}
.v3 header#hdr.on .wrap.nav{background:rgba(250,247,245,.94);box-shadow:0 14px 40px rgba(30,42,43,.14);}
.v3 .nav-links{gap:1.7rem;}
.v3 .nav-links a{color:var(--muted);font-weight:500;}
.v3 .nav-r{gap:.9rem;}
.v3 .menu-btn{padding:.72em 1.1em;}
.v3 .btn{padding:.8em 1.45em;}

/* ---------- page frame ---------- */
.v3 main{padding-top:calc(70px + var(--inset));}
.v3 main > section{padding:0 0 var(--rhythm);position:relative;}
.v3 main > section:last-child{padding-bottom:clamp(56px,7vw,110px);}
.v3 .frame{padding-inline:var(--inset);}
.v3 .hold{max-width:1340px;margin-inline:auto;}

/* panels: big rounded blocks floating inside the warm ground */
.v3 .panel{border-radius:var(--r-panel);overflow:hidden;position:relative;}
.v3 .panel-teal{background:linear-gradient(157deg,var(--panel) 0%,var(--panel-2) 100%);color:var(--ink);}
.v3 .panel-surface{background:var(--surface);}

/* ---------- eyebrows ---------- */
.v3 .eyebrow{display:inline-flex;align-items:center;gap:12px;width:max-content;max-width:100%;
  font-family:"DM Sans",system-ui,sans-serif;font-size:.78rem;font-weight:500;letter-spacing:.16em;
  text-transform:uppercase;color:var(--accent);}
.v3 .eyebrow::before{content:"";width:30px;height:1px;background:currentColor;flex:none;opacity:.75;}
.v3 .eyebrow-chip{display:inline-flex;align-items:center;gap:9px;background:var(--surface);
  border-radius:var(--r-pill);padding:.6em 1.15em;font-family:"DM Sans",sans-serif;font-size:.72rem;
  font-weight:500;letter-spacing:.17em;text-transform:uppercase;color:var(--accent);}
.v3 .eyebrow-chip::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;flex:none;}
.v3 .on-teal .eyebrow{color:var(--cyan);}

/* ---------- type ---------- */
.v3 h1{font-size:clamp(2.6rem,1.1rem + 6.6vw,5.625rem);line-height:1.06;letter-spacing:-0.032em;}
.v3 h2{font-size:clamp(2rem,1.05rem + 4.4vw,4.375rem);line-height:1.14;letter-spacing:-0.03em;}
.v3 h3{font-size:clamp(1.35rem,1.1rem + 1.1vw,1.875rem);line-height:1.2;letter-spacing:-0.022em;}
.v3 .hl{font-family:"Instrument Serif","Instrument Sans",Georgia,serif;font-style:italic;
  font-weight:400;letter-spacing:-0.004em;}
.v3 .lede{font-size:clamp(1.02rem,.95rem + .38vw,1.22rem);line-height:1.6;color:var(--muted);}
.v3 .on-teal .lede{color:rgba(250,247,245,.78);}

/* section head: big left headline, short right paragraph, top aligned */
.v3 .shead2{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,.65fr);
  gap:clamp(24px,4vw,72px);align-items:start;margin-bottom:clamp(40px,5vw,84px);}
.v3 .shead2 .eyebrow{grid-column:1/-1;margin-bottom:clamp(18px,2vw,30px);}
.v3 .shead2 p{color:var(--muted);font-size:clamp(1rem,.95rem + .25vw,1.1rem);line-height:1.62;
  padding-top:.7em;max-width:44ch;}
@media(max-width:900px){.v3 .shead2{grid-template-columns:1fr;gap:20px;}
  .v3 .shead2 p{padding-top:0;}}

/* centered statement, Dermato style */
.v3 .statement{text-align:center;max-width:22ch;margin-inline:auto;}
.v3 .statement-wide{max-width:min(1040px,92vw);}
.v3 .say{text-align:center;}
.v3 .say .eyebrow-chip{margin-bottom:clamp(22px,3vw,40px);}
.v3 .say h2{max-width:min(1080px,94vw);margin-inline:auto;}
.v3 .say .lede{max-width:52ch;margin:clamp(20px,2.6vw,34px) auto 0;}

/* ---------- HERO ---------- */
.v3 .hero2{padding-bottom:var(--rhythm);}
.v3 .hero2 .panel{min-height:min(84vh,760px);display:flex;flex-direction:column;justify-content:flex-end;
  box-shadow:var(--shadow-lift);}
.v3 .hero-bg{position:absolute;inset:0;z-index:0;}
.v3 .hero-bg img,.v3 .hero-bg iframe{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border:0;}
.v3 .hero-bg iframe{display:none;background:transparent;pointer-events:none;}
.v3 .hero-bg::after{content:"";position:absolute;inset:0;
  background:linear-gradient(96deg,rgba(13,44,46,.94) 0%,rgba(13,44,46,.80) 38%,rgba(18,59,61,.34) 72%,rgba(18,59,61,.18) 100%);}
.v3 .hero-body{position:relative;z-index:2;padding:clamp(34px,5vw,76px);max-width:900px;}
.v3 .hero-body h1{color:var(--ink);margin-top:clamp(18px,2.4vw,30px);}
.v3 .hero-body .hl{color:var(--cyan);}
.v3 .hero-body .lede{max-width:46ch;margin-top:clamp(18px,2.2vw,28px);}
.v3 .hero-cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:clamp(26px,3.2vw,40px);}
.v3 .hero-cta .btn-primary{background:var(--cyan);color:var(--panel-2);}
.v3 .hero-cta .btn-primary:hover{background:#42E4E6;}
.v3 .hero-cta .btn-ghost{border-color:rgba(250,247,245,.42);color:var(--ink);}
.v3 .hero-cta .btn-ghost:hover{border-color:var(--cyan);color:var(--cyan);background:rgba(24,213,215,.1);}

/* three tiles along the foot of the hero panel */
.v3 .hero-tiles{position:relative;z-index:2;display:grid;grid-template-columns:repeat(3,1fr);
  gap:1px;background:rgba(250,247,245,.14);border-top:1px solid rgba(250,247,245,.14);}
.v3 .hero-tiles div{background:rgba(13,44,46,.34);backdrop-filter:blur(3px);
  padding:clamp(16px,1.8vw,24px) clamp(18px,2vw,28px);display:flex;align-items:center;
  justify-content:space-between;gap:14px;color:var(--ink);font-family:"Instrument Sans",sans-serif;
  font-weight:500;font-size:clamp(.88rem,.83rem + .2vw,1.02rem);}
.v3 .hero-tiles svg{width:20px;height:20px;color:var(--cyan);flex:none;}
@media(max-width:760px){.v3 .hero-tiles{grid-template-columns:1fr;}
  .v3 .hero-tiles div:nth-child(3){display:none;}}

/* small cards that float against the hero panel edge */
.v3 .floatcard{position:absolute;z-index:3;background:rgba(250,247,245,.94);backdrop-filter:blur(12px);
  border-radius:var(--r-card);padding:16px 20px;box-shadow:var(--shadow-float);max-width:250px;}
.v3 .floatcard b{display:block;font-family:"Instrument Sans",sans-serif;font-weight:500;
  font-size:1rem;color:var(--text);line-height:1.25;}
.v3 .floatcard span{display:block;color:var(--faint);margin-top:5px;line-height:1.45;}
.v3 .fc-a{top:clamp(84px,11vw,132px);right:clamp(20px,3vw,44px);}
.v3 .fc-b{bottom:clamp(118px,13vw,170px);right:clamp(20px,3vw,44px);}
@media(max-width:1080px){.v3 .floatcard{display:none;}}

/* ---------- Olivrae service rows ---------- */
.v3 .rows{display:grid;gap:0;}
.v3 .srow{display:grid;grid-template-columns:clamp(220px,24vw,340px) minmax(0,1fr) clamp(220px,20vw,290px);
  gap:clamp(24px,3.4vw,64px);align-items:start;padding:clamp(34px,4vw,64px) 0;}
.v3 .srow + .srow{border-top:1px solid var(--hair);}
.v3 .srow-img{border-radius:var(--r-card);overflow:hidden;aspect-ratio:4/3;background:var(--surface);
  transition:transform .5s cubic-bezier(.16,1,.3,1);}
.v3 .srow:hover .srow-img{transform:translateY(-6px);}
.v3 .srow-img img{width:100%;height:100%;object-fit:cover;display:block;}
.v3 .srow-body h3{margin-bottom:14px;}
.v3 .srow-body p{color:var(--muted);max-width:52ch;}
.v3 .srow-body .pill{margin-top:clamp(22px,2.6vw,34px);background:var(--accent);color:var(--ink);
  border-color:transparent;font-size:.95rem;padding:.78em 1.5em;}
.v3 .srow-body .pill:hover{background:var(--accent-2);border-color:transparent;}
.v3 .kp{background:var(--surface);border-radius:var(--r-card);padding:clamp(20px,2.2vw,26px);}
.v3 .kp b{display:block;font-family:"Instrument Sans",sans-serif;font-weight:500;font-size:.98rem;
  color:var(--text);margin-bottom:14px;}
.v3 .kp ul{list-style:none;padding:0;margin:0;display:grid;gap:11px;}
.v3 .kp li{display:flex;gap:10px;align-items:flex-start;color:var(--muted);font-size:.92rem;line-height:1.5;}
.v3 .kp li::before{content:"";flex:none;width:18px;height:18px;margin-top:2px;border-radius:50%;
  background:var(--accent) center/11px 11px no-repeat;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FAF7F5' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6L9 17l-5-5'/%3E%3C/svg%3E");}
@media(max-width:1080px){.v3 .srow{grid-template-columns:clamp(200px,30vw,300px) minmax(0,1fr);}
  .v3 .srow .kp{grid-column:2/-1;}}
@media(max-width:720px){.v3 .srow{grid-template-columns:1fr;gap:22px;}
  .v3 .srow .kp{grid-column:1/-1;}
  .v3 .srow-img{aspect-ratio:16/10;}}

/* ---------- fanned step cards ---------- */
.v3 .fan{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(12px,1.4vw,20px);}
.v3 .fan .step{background:var(--surface);border-radius:var(--r-card);padding:clamp(24px,2.6vw,34px);
  display:flex;flex-direction:column;min-height:clamp(230px,26vw,300px);
  transition:transform .45s cubic-bezier(.16,1,.3,1),box-shadow .45s;}
.v3 .fan .step:nth-child(1){transform:rotate(-2.4deg) translateY(10px);}
.v3 .fan .step:nth-child(2){transform:rotate(-.8deg);}
.v3 .fan .step:nth-child(3){transform:rotate(.9deg) translateY(6px);}
.v3 .fan .step:nth-child(4){transform:rotate(2.5deg) translateY(16px);}
.v3 .fan .step:hover{transform:rotate(0deg) translateY(-6px);box-shadow:var(--shadow-lift);z-index:2;}
.v3 .fan .k{font-family:"DM Sans",sans-serif;font-size:.72rem;letter-spacing:.17em;text-transform:uppercase;
  color:var(--faint);}
.v3 .fan h3{margin:auto 0 10px;font-size:clamp(1.15rem,1rem + .55vw,1.45rem);}
.v3 .fan p{color:var(--muted);font-size:.92rem;line-height:1.55;}
@media(max-width:1000px){.v3 .fan{grid-template-columns:repeat(2,1fr);}
  .v3 .fan .step{transform:none!important;}}
@media(max-width:560px){.v3 .fan{grid-template-columns:1fr;}}

/* ---------- doctor ---------- */
.v3 .doc2{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);
  gap:clamp(28px,4.5vw,80px);align-items:center;}
.v3 .doc2 .portrait{border-radius:var(--r-panel);overflow:hidden;aspect-ratio:4/5;background:var(--surface);
  box-shadow:var(--shadow-float);}
.v3 .doc2 .portrait img{width:100%;height:100%;object-fit:cover;display:block;}
.v3 .doc2 .creds{margin-top:clamp(22px,2.6vw,32px);}
@media(max-width:900px){.v3 .doc2{grid-template-columns:1fr;}}

/* ---------- bento ---------- */
.v3 .bento{display:grid;grid-template-columns:repeat(6,1fr);gap:clamp(12px,1.3vw,18px);}
.v3 .bento > *{background:var(--surface);border-radius:var(--r-card);padding:clamp(22px,2.4vw,34px);
  min-height:180px;display:flex;flex-direction:column;}
.v3 .bento .b-wide{grid-column:span 4;}
.v3 .bento .b-half{grid-column:span 3;}
.v3 .bento .b-third{grid-column:span 2;}
.v3 .bento .b-map{padding:0;overflow:hidden;min-height:320px;}
.v3 .bento .b-map iframe{width:100%;height:100%;min-height:320px;border:0;flex:1;}
.v3 .bento .b-teal{background:linear-gradient(157deg,var(--panel),var(--panel-2));color:var(--ink);}
.v3 .bento .b-teal .k,.v3 .bento .b-teal p{color:rgba(250,247,245,.76);}
.v3 .bento .k{font-family:"DM Sans",sans-serif;font-size:.72rem;letter-spacing:.17em;text-transform:uppercase;
  color:var(--faint);margin-bottom:14px;}
.v3 .bento h3{margin-bottom:10px;}
.v3 .bento p{color:var(--muted);font-size:.94rem;line-height:1.55;}
.v3 .bento .big{font-family:"Instrument Sans",sans-serif;font-weight:500;
  font-size:clamp(2.4rem,1.6rem + 2.6vw,3.6rem);line-height:1;letter-spacing:-0.035em;color:var(--accent);
  margin-bottom:8px;}
.v3 .bento .b-teal .big{color:var(--cyan);}
.v3 .bento .awardrow{display:flex;gap:14px;align-items:center;flex-wrap:wrap;margin-top:auto;padding-top:18px;}
.v3 .bento .awardrow img{height:62px;width:auto;}
.v3 .bento .hours{margin:0;border-top:0;}
.v3 .bento .hours li{padding:9px 0;font-size:.92rem;border-color:rgba(30,42,43,.10);}
@media(max-width:1000px){.v3 .bento{grid-template-columns:repeat(2,1fr);}
  .v3 .bento .b-wide,.v3 .bento .b-half,.v3 .bento .b-third{grid-column:span 2;}}
@media(max-width:600px){.v3 .bento{grid-template-columns:1fr;}
  .v3 .bento .b-wide,.v3 .bento .b-half,.v3 .bento .b-third{grid-column:span 1;}}

/* ---------- interactive spine section ---------- */
.v3 .spine2 .panel{box-shadow:var(--shadow-lift);}
.v3 .spine2 .spine-frame{padding:clamp(16px,2vw,32px);background:transparent;}
.v3 .spine2 .spine-frame iframe{height:clamp(460px,72vh,760px);border-radius:var(--r-card);}
.v3 .spine2 .spine-shell{width:auto;margin-left:0;background:transparent;border-radius:0;}
.v3 .spine2 .spine-markers{inset:clamp(16px,2vw,32px);}
.v3 .spine2 .snote{margin-top:20px;}

/* ---------- closing band ---------- */
.v3 .close2 .panel{text-align:center;padding:clamp(52px,7.5vw,110px) clamp(24px,4vw,60px);}
.v3 .close2 h2{color:var(--ink);max-width:18ch;margin-inline:auto;}
.v3 .close2 .hl{color:var(--cyan);}
.v3 .close2 .lede{max-width:46ch;margin:22px auto 34px;}
.v3 .close2 .btn-primary{background:var(--cyan);color:var(--panel-2);}
.v3 .close2 .btn-primary:hover{background:#42E4E6;}
.v3 .close2 .cta{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;}
.v3 .close2 .btn-ghost{border-color:rgba(250,247,245,.42);color:var(--ink);}
.v3 .close2 .btn-ghost:hover{border-color:var(--cyan);color:var(--cyan);background:rgba(24,213,215,.1);}

/* ---------- footer ---------- */
.v3 footer{background:transparent;border-top:0;padding-top:0;}
.v3 footer > .wrap{max-width:none;padding-inline:var(--inset);}
.v3 footer .fgrid{background:var(--surface);border-radius:var(--r-panel);
  padding:clamp(34px,4vw,60px) clamp(26px,3.4vw,52px);}
.v3 footer .fbot{padding-inline:clamp(26px,3.4vw,52px);border-top:0;margin-top:22px;}

/* ---------- reveal ---------- */
.js.v3 .obs{opacity:0;transform:translateY(30px);}
.v3 .obs.seen{opacity:1;transform:none;
  transition:opacity .9s cubic-bezier(.16,1,.3,1),transform .9s cubic-bezier(.16,1,.3,1);}
@media(prefers-reduced-motion:reduce){
  .v3 .obs,.v3 .obs.seen{opacity:1;transform:none;transition:none;}
  .v3 .fan .step{transform:none!important;}}

/* button row on the light ground: deep teal, never brand cyan */
.v3 .btnrow{display:flex;flex-wrap:wrap;gap:12px;margin-top:clamp(24px,3vw,38px);}
/* the real portrait of Dr. Boss is a small original, so do not upscale it */
.v3 .doc2 .portrait{max-width:460px;}
.v3 .doc2 .portrait img{image-rendering:auto;}

/* ===== V3 INNER PAGES ================================================
   54 of the 61 share one shape: phero + svc + aside + optional extras.
   So this is a restyle of the existing classes, not a rewrite of the
   markup. Nothing here changes a word of copy.
   ==================================================================== */

/* the wrap becomes the framed container the home page uses */
.v3 .wrap{max-width:1340px;padding-inline:clamp(20px,3.6vw,50px);}

/* ---- page hero ---- */
.v3 .phero{padding:0 0 clamp(46px,6vw,86px);}
.v3 .phero > .wrap{position:relative;}
.v3 .phero .crumb{display:inline-flex;align-items:center;gap:8px;background:var(--surface);
  border-radius:var(--r-pill);padding:.55em 1.15em;margin-bottom:clamp(20px,2.6vw,32px);
  font-size:.72rem;letter-spacing:.13em;color:var(--muted);text-transform:uppercase;}
.v3 .phero .crumb a{color:var(--muted);}
.v3 .phero .crumb a:hover{color:var(--accent);}
.v3 .phero .eyebrow{display:inline-flex;margin-bottom:clamp(16px,2vw,24px);}
.v3 .phero h1{font-size:clamp(2.3rem,1.15rem + 4.6vw,4.5rem);line-height:1.08;max-width:19ch;}
.v3 .phero .lede{max-width:56ch;margin-top:clamp(20px,2.4vw,30px);
  font-size:clamp(1.02rem,.95rem + .38vw,1.22rem);}
.v3 .phero .cta{margin-top:clamp(26px,3vw,40px);gap:12px;}
.v3 .phero .anchors{margin-top:clamp(26px,3vw,38px);}

/* ---- article + aside ---- */
.v3 main > section{padding:0 0 var(--rhythm);}
.v3 main > section:last-child{padding-bottom:clamp(56px,7vw,110px);}
.v3 .svc{grid-template-columns:minmax(0,1fr) clamp(260px,24vw,340px);
  gap:clamp(32px,5vw,88px);}
.v3 .svc-body{max-width:68ch;}
.v3 .svc-body h2{font-size:clamp(1.6rem,1.15rem + 1.8vw,2.5rem);line-height:1.16;
  letter-spacing:-0.025em;margin:clamp(44px,5.5vw,72px) 0 18px;}
.v3 .svc-body h3{font-size:clamp(1.15rem,1.02rem + .55vw,1.45rem);margin:36px 0 10px;}
.v3 .svc-body p{font-size:clamp(1rem,.96rem + .2vw,1.08rem);line-height:1.68;margin-bottom:1.15em;}
.v3 .svc-body figure{margin:clamp(34px,4vw,52px) 0;}
.v3 .svc-body figure img{border-radius:var(--r-panel);}
.v3 .svc-body figcaption{margin-top:14px;font-size:.88rem;}
.v3 .svc-aside{top:clamp(96px,11vw,124px);gap:16px;}
.v3 .aside-card{border-radius:var(--r-card);padding:clamp(22px,2.4vw,30px);background:var(--surface);}
.v3 .aside-card:first-child{background:linear-gradient(157deg,var(--panel),var(--panel-2));color:var(--ink);}
.v3 .aside-card:first-child h3{color:var(--ink);}
.v3 .aside-card:first-child p{color:rgba(250,247,245,.76);}
.v3 .aside-card:first-child .btn-primary{background:var(--cyan);color:var(--panel-2);}
.v3 .aside-card:first-child .btn-primary:hover{background:#42E4E6;}
.v3 .aside-card:first-child .btn-ghost{border-color:rgba(250,247,245,.4);color:var(--ink);}
.v3 .aside-card:first-child .btn-ghost:hover{border-color:var(--cyan);color:var(--cyan);background:rgba(24,213,215,.1);}
.v3 .aside-list a{font-size:.94rem;}

/* ---- callout, disclaimer, key points ---- */
.v3 .callout{border-left:0;border-radius:var(--r-card);background:rgba(138,74,82,.07);
  padding:clamp(22px,2.4vw,30px);margin:clamp(30px,3.4vw,42px) 0;}
.v3 .disc{border-radius:var(--r-card);padding:22px 26px;margin-top:clamp(44px,5vw,64px);}
.v3 .keypoints{margin:clamp(30px,3.4vw,44px) 0;}

/* ---- steps ---- */
.v3 .steps{gap:12px;margin:clamp(30px,3.4vw,44px) 0;}
.v3 .steps li{background:var(--surface);border-radius:var(--r-card);padding:clamp(22px,2.4vw,30px);
  grid-template-columns:42px 1fr;gap:18px;transition:transform .35s cubic-bezier(.16,1,.3,1),box-shadow .35s;}
.v3 .steps li:hover{transform:translateY(-3px);box-shadow:var(--shadow-float);}
.v3 .steps li .n{font-size:1.6rem;}

/* ---- hub grids become the bento ---- */
.v3 .hubgrid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px;
  background:none;border:0;}
.v3 .hubcard{background:var(--surface);border-radius:var(--r-card);padding:clamp(24px,2.6vw,32px);
  min-height:190px;transition:transform .35s cubic-bezier(.16,1,.3,1),box-shadow .35s;}
.v3 .hubcard:hover{background:var(--surface);transform:translateY(-4px);box-shadow:var(--shadow-float);}

/* ---- cards, quotes, blog, related ---- */
.v3 .cards3{gap:16px;}
.v3 .ecard{border-radius:var(--r-card);padding:clamp(24px,2.6vw,32px);}
.v3 .quote{border-radius:var(--r-card);padding:clamp(24px,2.6vw,30px);}
.v3 .related-grid a{border-radius:var(--r-card);padding:22px 24px;}
.v3 .post-row{border-radius:var(--r-card);}
.v3 .post-hero{border-radius:var(--r-panel);}
.v3 .ph-img{border-radius:var(--r-panel);}
.v3 .tblwrap{border-radius:var(--r-card);}
.v3 .frm{border-radius:var(--r-panel);padding:clamp(26px,3.4vw,42px);}
.v3 .awardstrip .yrs{padding:.6em 1.2em;}

/* ---- FAQ ---- */
.v3 .faq{border-top:0;}
.v3 .faq details{border-bottom:0;background:var(--surface);border-radius:var(--r-card);
  padding:clamp(18px,2vw,24px) clamp(20px,2.2vw,28px);margin-bottom:12px;}
.v3 .faq summary{font-size:clamp(1.02rem,.95rem + .35vw,1.2rem);}
.v3 .faq details p{margin-top:14px;}

/* ---- section heads on inner pages ---- */
.v3 .shead{align-items:flex-end;margin-bottom:clamp(34px,4vw,60px);}
.v3 .shead h2{font-size:clamp(1.9rem,1.15rem + 3vw,3.2rem);line-height:1.16;letter-spacing:-0.028em;}
.v3 .shead .num{border-radius:var(--r-pill);padding:.4em .95em;}

/* ---- closing band on inner pages, matched to the home page ---- */
.v3 .ctaband{border-radius:var(--r-panel);padding:clamp(46px,6.5vw,96px) clamp(24px,4vw,60px);
  background:linear-gradient(157deg,var(--panel),var(--panel-2));}
.v3 .ctaband h2{font-size:clamp(1.9rem,1.2rem + 2.8vw,3.4rem);line-height:1.14;max-width:19ch;margin-inline:auto;}
.v3 .ctaband p{margin:20px auto 32px;}
.v3 .ctaband .btn-primary{background:var(--cyan);color:var(--panel-2);}
.v3 .ctaband .btn-primary:hover{background:#42E4E6;}
.v3 .ctaband .btn-ghost{border-color:rgba(250,247,245,.4);color:var(--ink);}
.v3 .ctaband .btn-ghost:hover{border-color:var(--cyan);color:var(--cyan);background:rgba(24,213,215,.1);}

/* ---- inline spine on condition pages ---- */
.v3 .cond-spine{border-radius:var(--r-panel);margin:clamp(34px,4vw,52px) 0;}

/* ---- the doctor split and image blocks ---- */
.v3 .split{gap:clamp(30px,5vw,72px);}
.v3 .doc-photo{border-radius:var(--r-panel);}
.v3 .grid2{gap:clamp(26px,4vw,56px);}

/* ---- reviews and awards ---- */
.v3 .review{border-radius:var(--r-card);padding:clamp(24px,2.6vw,32px);}
.v3 .award{border-radius:var(--r-card);}

@media(max-width:900px){
  .v3 .svc{grid-template-columns:1fr;}
  .v3 .svc-aside{position:static;}
}


/* ===== MOBILE LEGIBILITY AND TAP TARGETS ===== */
/* Sep 21: social links are icons. 44px round targets, one colour, label lives in aria-label. */
.fsocial{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px;}
.fsocial a,.v3 .fsocial a{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;
  border-radius:50%;border:1px solid var(--line-2);color:var(--muted);text-decoration:none;padding:0;
  transition:color .2s,border-color .2s,background-color .2s;}
.fsocial a:hover,.fsocial a:focus-visible{color:var(--accent);border-color:var(--accent);background:rgba(15,92,95,.05);}
.fsocial svg{display:block;}
/* the address is the directions link: it opens Apple Maps on iPhone and iPad, Google Maps elsewhere */
a.maplink{color:inherit;text-decoration:none;display:inline-block;padding:4px 0;
  background-image:linear-gradient(currentColor,currentColor);background-size:0 1px;background-repeat:no-repeat;
  background-position:0 100%;transition:background-size .25s,color .2s;}
a.maplink:hover,a.maplink:focus-visible{color:var(--accent);background-size:100% 1px;}
@media (max-width:1200px){
  /* nothing on a page should render below 13px on a phone or tablet,
     in either orientation - landscape tablets clear 900px wide */
  .crumb,.v3 .phero .crumb{font-size:.8125rem;letter-spacing:.06em;}
  .v3 .ecard .k,.v3 .hubcard .k,.v3 .callout .k,.v3 .fan .k,.v3 .bento .k,
  .ecard .k,.hubcard .k,.callout .k,
  .v3 .eyebrow,.v3 .eyebrow-chip,.v3 .guard-eyebrow,
  .eyebrow,.eyebrow-chip,.guard-eyebrow,
  .v3 .k,.k{font-size:.8125rem;letter-spacing:.12em;}
  /* footer and social links get a real touch area */
  .flinks{gap:2px;}
  .flinks a,.fareas a{display:block;padding:11px 0;line-height:1.25;}
  .fsocial{gap:10px;}
  .fbot a{display:inline-block;padding:8px 0;}
}

/* ===== STICKY SIDE CARDS =====
   body had overflow-x:hidden, which computes overflow-y to auto and turns the
   body into a scroll container. That silently killed position:sticky on the
   aside. overflow-x:clip does the same horizontal job without creating one. */
body{overflow-x:clip;}
/* The rail never gets its own scrollbar and never traps the page scroll.
   site.js measures it against the window and adds one of two classes:
   sk-pin  = the whole rail fits, pin all of it
   sk-top  = the rail is taller than the window, pin only the first card so
             nothing is ever cut off and nothing scrolls inside a box. */
.svc-aside,.v3 .svc-aside{position:static;max-height:none;overflow:visible;
  overscroll-behavior:auto;}
.svc-aside.sk-pin,.v3 .svc-aside.sk-pin{position:sticky;align-self:start;
  top:clamp(96px,11vw,124px);}
.svc-aside.sk-top,.v3 .svc-aside.sk-top{align-self:stretch;display:block;}
.svc-aside.sk-top .aside-card,.v3 .svc-aside.sk-top .aside-card{margin-bottom:16px;}
.svc-aside.sk-top .aside-card:first-child,
.v3 .svc-aside.sk-top .aside-card:first-child{position:sticky;
  top:clamp(96px,11vw,124px);}
@media (max-width:900px){
  .svc-aside,.v3 .svc-aside,
  .svc-aside.sk-pin,.v3 .svc-aside.sk-pin,
  .svc-aside.sk-top,.v3 .svc-aside.sk-top{position:static;align-self:start;
    display:grid;}
  .svc-aside.sk-top .aside-card:first-child,
  .v3 .svc-aside.sk-top .aside-card:first-child{position:static;}
  .svc-aside.sk-top .aside-card,.v3 .svc-aside.sk-top .aside-card{margin-bottom:0;}
}

/* ===== FULL WIDTH FEATURE + ALTERNATING IMAGE ROWS =====
   Used on your-spine-in-3d and first-visit-expectations. The feature runs the
   full width of the page margins, then the reading sits in image and text
   pairs that swap sides row to row. No sidebar on these two pages. */
.v3 .spine-wide{border-radius:var(--r-panel);overflow:hidden;background:var(--panel);
  padding:14px 14px 0;margin:clamp(28px,3.6vw,48px) 0 0;}
.v3 .spine-wide iframe{width:100%;height:min(76vh,700px);border:0;display:block;
  background:var(--panel);border-radius:calc(var(--r-panel) - 8px);}
.v3 .spine-wide .cap{display:flex;flex-wrap:wrap;gap:8px 24px;justify-content:space-between;
  padding:15px 8px;color:rgba(250,247,245,.7);font-size:var(--s-1);margin:0;}
.v3 .spine-wide .cap a{color:var(--cyan);text-decoration:none;display:inline-block;padding-block:4px;}
.v3 .spine-wide .cap a:hover{text-decoration:underline;}
@media(max-width:720px){.v3 .spine-wide iframe{height:min(70vh,520px);}}

.v3 .altrow{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:clamp(28px,4.4vw,74px);align-items:center;margin:clamp(48px,6.5vw,104px) 0;}
.v3 .altrow-img{border-radius:var(--r-panel);overflow:hidden;aspect-ratio:4/3;
  background:var(--surface);}
.v3 .altrow-img img{width:100%;height:100%;object-fit:cover;display:block;}
.v3 .altrow.flip .altrow-img{order:2;}
.v3 .altrow-body{max-width:56ch;}
.v3 .altrow-body h2{font-size:clamp(1.5rem,1.1rem + 1.5vw,2.2rem);line-height:1.16;
  letter-spacing:-0.025em;margin:0 0 16px;}
.v3 .altrow-body p{font-size:clamp(1rem,.96rem + .2vw,1.08rem);line-height:1.68;
  color:var(--muted);margin-bottom:1.1em;}
.v3 .altrow-body p:last-child{margin-bottom:0;}
.v3 .altrow-body a{color:var(--accent);text-decoration:underline;text-underline-offset:3px;}
@media(max-width:860px){
  .v3 .altrow{grid-template-columns:1fr;gap:22px;margin:clamp(38px,7vw,58px) 0;}
  .v3 .altrow.flip .altrow-img{order:0;}
  .v3 .altrow-img{aspect-ratio:16/10;}
  .v3 .altrow-body{max-width:none;}
}

/* prose that stays full width between the rows, kept to a readable measure */
.v3 .wideband{max-width:80ch;margin-inline:auto;}
.v3 .wideband h2{font-size:clamp(1.5rem,1.1rem + 1.5vw,2.2rem);line-height:1.16;
  letter-spacing:-0.025em;margin:0 0 18px;}
.v3 .wideband p{font-size:clamp(1rem,.96rem + .2vw,1.08rem);line-height:1.68;
  color:var(--muted);margin-bottom:1.15em;}
.v3 .wideband a{color:var(--accent);text-decoration:underline;text-underline-offset:3px;}

/* the four steps run full width as a row of cards */
.v3 .steps-wide{grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(12px,1.4vw,20px);
  margin:clamp(28px,3.4vw,44px) 0 0;}
.v3 .steps-wide li{grid-template-columns:1fr;gap:14px;align-content:start;
  padding:clamp(24px,2.4vw,34px);}
@media(max-width:1000px){.v3 .steps-wide{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media(max-width:600px){.v3 .steps-wide{grid-template-columns:1fr;}}

/* related links replace the sidebar on the two full width pages */
.v3 .relrow{border-top:1px solid var(--line);padding-top:clamp(22px,2.6vw,32px);}
.v3 .relrow .kp-title{font-family:"Instrument Sans","DM Sans",sans-serif;font-size:.8125rem;
  letter-spacing:.14em;text-transform:uppercase;color:var(--faint);margin:0 0 16px;}
.v3 .relrow ul{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:12px 14px;}
.v3 .relrow a{display:inline-flex;align-items:center;gap:9px;padding:11px 18px;
  border:1px solid var(--line);border-radius:999px;color:var(--text);text-decoration:none;
  font-size:var(--s-1);transition:border-color .18s,color .18s,background .18s;}
.v3 .relrow a::after{content:"\2192";color:var(--accent);}
.v3 .relrow a:hover{border-color:var(--accent);color:var(--accent);background:rgba(15,92,95,.05);}

/* footer service-area row, so the town pages and reviews are reachable by a
   person and not only by a crawler */
.fareas-t{margin-top:22px;}
.fareas{display:flex;flex-wrap:wrap;gap:4px 18px;margin-top:10px;}
.fareas a{display:inline-block;}

/* WCAG 2.2 AA target size: every standalone link gets a 24px box */
.mm-col a{display:block;padding-block:5px;}
.crumb a{display:inline-block;padding-block:3px;}
.aside-list a{padding-block:3px;}

/* Reading measure. The ch unit is calibrated to the "0" glyph, which is much
   wider than this font's average character, so 68ch was rendering 91 characters
   per line. Cap the prose itself and leave figures and callouts full column. */
.v3 .svc-body p,.v3 .svc-body ul,.v3 .svc-body ol,
.v3 .wideband p,.v3 .altrow-body p{max-width:58ch;}
@media (max-width:900px){
  .v3 .svc-body p,.v3 .svc-body ul,.v3 .svc-body ol,
  .v3 .wideband p,.v3 .altrow-body p{max-width:none;}
}

/* who wrote this and when it was checked, on every condition and treatment page */
.reviewed-by{font-size:var(--s-1);color:var(--faint);margin-top:clamp(30px,3.4vw,44px);
  padding-top:16px;border-top:1px solid var(--line);}

/* a link that is the whole paragraph is a call to action, not prose, so it needs
   a real tap box rather than the bare glyph height */
.svc-body p > a:only-child,
.wideband p > a:only-child,
.altrow-body p > a:only-child{display:inline-block;padding-block:3px;}


/* review wall. Cards, not newspaper columns, so a long quote never becomes a
   sliver. Lives full width in its own section, never inside the article column. */
.v3 .quotes{columns:auto;display:grid;gap:clamp(14px,1.6vw,22px);
  grid-template-columns:repeat(auto-fit,minmax(480px,1fr));align-items:start;}
.v3 .quote{margin:0;background:var(--surface);border-radius:var(--r-card);
  padding:clamp(24px,2.4vw,32px);}
.v3 .quote blockquote{margin:0;}
.v3 .quote p{max-width:560px;font-size:clamp(.98rem,.95rem + .15vw,1.04rem);line-height:1.62;
  color:var(--text);margin:0;}
.v3 .quote .who{margin-top:18px;}
.v3 .quote .who b{font-weight:600;}
@media(max-width:640px){.v3 .quotes{grid-template-columns:1fr;}}

/* ---- Sep 11 audit round: legibility, print, focus, safety ---- */

/* nothing on the site renders below 13px outside the approved desktop micro-labels */
.v3 .quote .src,.quote .src{font-size:.8125rem;letter-spacing:.1em;}
.related-grid a span{font-size:var(--s-1);}
.v3 .floatcard span{font-size:var(--s-1);}
.v3 .quote-note{max-width:70ch;margin:clamp(18px,2vw,26px) auto 0;text-align:center;
  font-size:var(--s-1);color:var(--faint);line-height:1.6;}

/* the sticky header must never swallow a focused element on scroll */
html{scroll-padding-top:clamp(96px,11vw,124px);}

/* an iframe holding focus matches :focus-within, never :focus. The ring is drawn
   inside the element so an overflow:hidden parent cannot clip it away, and it is
   light so it reads against the dark teal spine panel as well as the map. */
iframe:focus-within,iframe:focus{outline:3px solid #FFD36B;outline-offset:-3px;}
.map iframe:focus-within,.b-map iframe:focus-within,
.map iframe:focus,.b-map iframe:focus{outline-color:#0B3F41;}
.map:focus-within,.v3 .bento .b-map:focus-within{outline:3px solid var(--accent);outline-offset:2px;}

/* booking form: a focus ring you can actually see, and visible required marks */
.fld input:focus-visible,.fld select:focus-visible,.fld textarea:focus-visible{
  outline:3px solid var(--accent);outline-offset:2px;}
.fld .req{color:var(--faint);font-weight:400;}
.fld input[aria-invalid="true"],.fld select[aria-invalid="true"],.fld textarea[aria-invalid="true"]{
  border-color:var(--alert);box-shadow:0 0 0 3px rgba(178,58,42,.14);}
.fld .err{display:none;margin-top:6px;font-size:var(--s-1);color:var(--alert);}
.fld .err.on{display:block;}
.formerr{display:none;margin-bottom:18px;padding:14px 16px;border-radius:12px;
  background:rgba(178,58,42,.08);border:1px solid var(--alert);color:var(--alert);
  font-size:var(--s0);line-height:1.5;}
.formerr.on{display:block;}

/* static stand-in when the 3D model is deliberately skipped on a weak device */
.spine-fallback{display:none;}
.spine-skipped .spine-fallback{display:flex;flex-direction:column;align-items:center;
  justify-content:center;gap:14px;text-align:center;padding:clamp(28px,4vw,52px);}
.spine-skipped #spineGuard,.spine-skipped #spineRelease,
.spine-skipped #spineFrame,.spine-skipped .spine-markers{display:none!important;}
.spine-skipped .spine-frame{min-height:0;height:auto;}
.spine-fallback .sf-img{height:auto;width:100%;max-width:360px;border-radius:var(--r-card);}
.spine-fallback p{max-width:52ch;color:rgba(255,255,255,.82);}
.spine-fallback .btn-ghost{color:#fff;border-color:rgba(255,255,255,.45);}
.spine-fallback .btn-ghost:hover{background:rgba(255,255,255,.12);}

/* honour reduced motion everywhere, including hover transforms */
@media (prefers-reduced-motion:reduce){
  .srow-img,.step,.srow:hover .srow-img,.smk::before{transition:none!important;animation:none!important;transform:none!important;}
}

/* PRINT: the reveal animation and the fixed header must not eat the page */
@media print{
  /* details render closed on paper, which silently dropped every FAQ answer */
  details{display:block!important;}
  details > summary{list-style:none;font-weight:600;}
  details > summary::-webkit-details-marker{display:none;}
  details > summary span{display:none!important;}
  .faq summary::after,.faq details[open] summary::after{content:""!important;}
  details > *:not(summary){display:block!important;}
  /* Chromium hides closed details content through ::details-content, not through
     the children's display, so overriding display alone prints nothing. */
  details::details-content{content-visibility:visible!important;block-size:auto!important;}
  #prog{display:none!important;}

  .obs,.v3 .obs,.line,.hero-media,.hero-foot,.quotes,.quote{
    opacity:1!important;transform:none!important;filter:none!important;}
  header#hdr,.v3 header#hdr,#mm,.skip,#tour,.menu-btn,.nav-call{display:none!important;}
  iframe,.b-map,.map{display:none!important;}
  .spine-wide{min-height:0!important;height:auto!important;}
  body{background:#fff!important;}
  a[href^="/"]::after{content:"";}
  .svc-aside,.v3 .svc-aside{position:static!important;}
  section{break-inside:auto;}
  h1,h2,h3{break-after:avoid;}
}
.fld .frm-hint{margin-top:6px;font-size:var(--s-1);color:var(--faint);line-height:1.5;}
.v3 .hero-avail{margin:0 0 14px;font-size:var(--s0);line-height:1.5;}
.v3 .hero-avail b{font-weight:600;}
.spine-fallback .sf-btns{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;}
.spine-fallback .btn-primary{background:var(--cyan);color:#08312F;border-color:var(--cyan);}

/* ---- Sep 18 pre-launch round ---- */

/* The mega menu did not lock the page behind it. body{overflow:hidden} does not
   reach the viewport once the root computes overflow-y:auto, so the wheel chained
   straight through to the document and dragged it thousands of pixels. */
html.mm-lock,html.mm-lock body{overflow:hidden!important;height:100%;}
#mm{overscroll-behavior:contain;}

/* Header controls were clipped off screen below about 372px because the nav pill
   could not compress. The logo now shrinks instead of the buttons disappearing. */
@media (max-width:420px){
  .v3 .nav,.nav{gap:8px;}
  .logo{flex:0 1 auto;min-width:0;}
  .logo img{height:32px!important;width:auto;}
  .nav-r{flex:0 0 auto;gap:6px;}
  .menu-btn{padding-inline:10px;}
}
@media (max-width:360px){
  .logo img{height:28px!important;}
  .menu-btn span,.menu-btn{font-size:0;padding:10px;}
  .menu-btn svg{width:22px;height:22px;}
  .menu-btn{min-width:44px;min-height:44px;display:inline-flex;align-items:center;justify-content:center;}
  .crumb{word-break:break-word;}
}

/* booking form: a visible busy state so nobody taps send twice */
.frm button[aria-busy="true"]{opacity:.7;pointer-events:none;}
/* Sep 18: 44px minimum touch target on every touch device, not just the
   narrowest phones. The button measured 92x38 at 375px and 390px. */
@media (pointer:coarse){
  .menu-btn,.v3 .menu-btn{min-height:44px;}
  .nav-call,.v3 .nav-call{min-height:44px;display:inline-flex;align-items:center;}
}