/* ==========================================================================
   Healthify Homoeopathy, shared stylesheet. DESIGN SYSTEM v3, August 2026.

   "Root Editorial". The experiential redesign. Same sections, same flow,
   same copy, same brand palette and the same three fonts as v2. What is new
   is the feeling of moving through the site: a scroll driven walk down to
   the root before the home hero (assets/exp.css), a plant that grows as the
   method scrolls past, a story line that draws itself, a root line that
   grows across the top of every page as you read, cards that swipe on a
   phone, and type that is larger and more editorial everywhere.

   Built mobile first in spirit: every effect degrades to a plain, fast page
   when JavaScript is off, when the visitor asks for reduced motion, or when
   the device cannot keep up. Nothing here is needed to read the words.

   Feel: calm, warm, editorial, unhurried. The opposite of a clinical
   hard sell.
   ========================================================================== */

:root{
  /* ---- brand palette, verbatim from the clinic ---- */
  --cream:#faf7f2; --cream-2:#f3ede3; --cream-3:#e8dece;
  --ink:#1c1410; --ink-2:#3d2f24; --ink-3:#7a6355; --ink-4:#b09b8c;
  --sage:#4a7c59; --sage-d:#3a6347; --sage-light:#7aab88; --sage-pale:#ddeee3;
  --gold:#9a6f3a; --gold-pale:#f5ead8;
  --terracotta:#c45c3a;
  --border:rgba(60,40,20,.10); --border-2:rgba(60,40,20,.16);

  /* --card is a raised surface on the page background. --panel is the
     DELIBERATELY dark block on a light page (footer, marquee, in-blog
     booking box). Those stay dark in dark mode too. */
  --card:#ffffff;
  --panel:#3d2f24; --panel-2:#1c1410; --panel-tx:#ffffff;

  /* deep green: the checker band, the treatments band, the closing CTA,
     the walk-in. One green, every dark place, so they always match. */
  --deep:#0f2318; --deep-2:#16301f; --deep-3:#1a3d28;

  /* soil browns for the walk-in and the method scene */
  --soil:#2a1d14; --soil-2:#3b2a1c; --soil-3:#55402c;

  /* ---- type ---- */
  --fd:'Cormorant Garamond',Georgia,serif;
  --fb:'DM Sans',ui-sans-serif,system-ui,-apple-system,sans-serif;
  --fh:'Caveat',cursive;

  /* ---- radii ---- */
  --r-s:14px; --r-m:24px; --r-l:36px;
  --r-arch:240px 240px 28px 28px;

  /* ---- layered warm shadows. Brown-tinted, never grey. ---- */
  --sh-s:0 1px 2px rgba(45,30,15,.05),0 3px 9px rgba(45,30,15,.05);
  --sh-m:0 2px 4px rgba(45,30,15,.05),0 12px 30px rgba(45,30,15,.10);
  --sh-l:0 4px 8px rgba(45,30,15,.05),0 30px 70px rgba(45,30,15,.16);

  /* ---- motion ---- */
  --ease:cubic-bezier(.34,1.56,.64,1);
  --ease-out:cubic-bezier(.16,1,.3,1);
  --ease-io:cubic-bezier(.65,0,.35,1);

  --wrap:1240px;
  --pad:40px;
  --nav-h:70px;
}

/* ==========================================================================
   DARK THEME. Warm, not cold: the dark surfaces keep the brown in them.
   Media query is the default, [data-theme] the remembered manual override.
   ========================================================================== */
:root{color-scheme:light}
:root[data-theme="dark"]{color-scheme:dark}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){color-scheme:dark}
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --cream:#14100d; --cream-2:#1d1712; --cream-3:#2a221b;
    --ink:#f6f0e7; --ink-2:#ded3c5; --ink-3:#b1a294; --ink-4:#8a7a6b;
    --sage:#8cbb99; --sage-d:#a8d0b3; --sage-light:#7aab88; --sage-pale:#1f3226;
    --gold:#cda668; --gold-pale:#2c2214;
    --terracotta:#e59173;
    --border:rgba(255,240,225,.13); --border-2:rgba(255,240,225,.2);
    --card:#211a15;
    --panel:#241d17; --panel-2:#100c09; --panel-tx:#f6f0e7;
    --sh-s:0 1px 2px rgba(0,0,0,.3),0 3px 9px rgba(0,0,0,.25);
    --sh-m:0 2px 4px rgba(0,0,0,.3),0 12px 30px rgba(0,0,0,.34);
    --sh-l:0 4px 8px rgba(0,0,0,.3),0 30px 70px rgba(0,0,0,.45);
  }
}
:root[data-theme="dark"]{
  --cream:#14100d; --cream-2:#1d1712; --cream-3:#2a221b;
  --ink:#f6f0e7; --ink-2:#ded3c5; --ink-3:#b1a294; --ink-4:#8a7a6b;
  --sage:#8cbb99; --sage-d:#a8d0b3; --sage-light:#7aab88; --sage-pale:#1f3226;
  --gold:#cda668; --gold-pale:#2c2214;
  --terracotta:#e59173;
  --border:rgba(255,240,225,.13); --border-2:rgba(255,240,225,.2);
  --card:#211a15;
  --panel:#241d17; --panel-2:#100c09; --panel-tx:#f6f0e7;
  --sh-s:0 1px 2px rgba(0,0,0,.3),0 3px 9px rgba(0,0,0,.25);
  --sh-m:0 2px 4px rgba(0,0,0,.3),0 12px 30px rgba(0,0,0,.34);
  --sh-l:0 4px 8px rgba(0,0,0,.3),0 30px 70px rgba(0,0,0,.45);
}

/* ==========================================================================
   BASE
   ========================================================================== */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
/* overflow-x:clip rather than hidden, on purpose. hidden turns html and body
   into scroll containers, which silently un-sticks position:sticky in some
   Safari builds. clip cuts the paint without creating a scroll container,
   so the sticky scenes on the home page keep working. */
html{scroll-behavior:smooth;overflow-x:clip;-webkit-text-size-adjust:100%;scroll-padding-top:96px}
html.exp-on{scroll-behavior:auto}
body{
  font-family:var(--fb);
  background:var(--cream);
  color:var(--ink);
  font-size:19.5px;
  line-height:1.8;
  overflow-x:clip;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
a{text-decoration:none;color:inherit}
img{max-width:100%;display:block}
button{font-family:inherit;cursor:pointer;border:0;background:transparent;color:inherit}
::selection{background:var(--sage-pale);color:var(--sage)}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--pad)}
.hand{font-family:var(--fh)}

/* paper grain over the whole page. A 160px tile of SVG noise at 3.5
   percent. position:fixed and pointer-events:none, so it costs one
   composited layer and touches nothing. Off on small screens. */
.grain{position:fixed;inset:0;z-index:9000;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='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size:160px 160px}
:root[data-theme="dark"] .grain{mix-blend-mode:screen;opacity:.05}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .grain{mix-blend-mode:screen;opacity:.05}}
@media(max-width:700px){.grain{display:none}}

/* the root line: a thin sage line that grows across the top of the page as
   you read. Width is driven by assets/site.js from the scroll position. */
.rootbar{position:fixed;top:0;left:0;height:3px;width:0;z-index:8000;pointer-events:none;
  background:linear-gradient(90deg,var(--sage-d),var(--sage-light));
  border-radius:0 3px 3px 0;transition:opacity .4s}
.rootbar::after{content:'';position:absolute;right:-3px;top:-3px;width:9px;height:9px;border-radius:50% 50% 50% 0;
  background:var(--sage-light);transform:rotate(-45deg);box-shadow:0 0 0 3px color-mix(in srgb, var(--sage-light) 25%, transparent)}
html.exp-live .rootbar{opacity:0}

/* skip link, for keyboard and screen reader users */
.skip{position:absolute;left:-9999px;top:0;z-index:9999;background:var(--sage);color:#fff;padding:12px 20px;border-radius:0 0 8px 0}
.skip:focus{left:0}
:focus-visible{outline:2px solid var(--sage);outline-offset:3px;border-radius:2px}

/* ==========================================================================
   NAVIGATION v3. A floating glass pill that steps out of the way as you
   read down and returns the moment you scroll up. Real HTML links.
   ========================================================================== */
.nav{
  position:fixed;top:16px;left:50%;transform:translate(-50%,0);z-index:600;
  width:min(var(--wrap),calc(100% - 28px));
  display:flex;align-items:center;justify-content:space-between;gap:14px;
  padding:10px 12px 10px 24px;
  background:color-mix(in srgb, var(--cream) 78%, transparent);
  backdrop-filter:blur(22px) saturate(1.5);-webkit-backdrop-filter:blur(22px) saturate(1.5);
  border:1px solid var(--border);
  border-radius:999px;
  box-shadow:var(--sh-s);
  transition:transform .55s var(--ease-out),box-shadow .4s ease,background .4s ease,top .4s var(--ease-out),opacity .3s;
}
.nav.scrolled{top:10px;background:color-mix(in srgb, var(--cream) 92%, transparent);box-shadow:var(--sh-m)}
.nav.hide{transform:translate(-50%,-140%)}
html.exp-live .nav{opacity:0;pointer-events:none}
.nav-links{display:flex;gap:2px;align-items:center;flex:1;justify-content:center}
.nav-link{
  position:relative;font-size:13.4px;font-weight:600;color:var(--ink-3);letter-spacing:.08em;text-transform:uppercase;
  padding:10px 15px;border-radius:999px;transition:color .3s,background .3s;white-space:nowrap;
}
.nav-link::after{content:'';position:absolute;left:15px;right:15px;bottom:6px;height:1.5px;background:var(--sage);
  transform:scaleX(0);transform-origin:left;transition:transform .35s var(--ease-out)}
.nav-link:hover{color:var(--sage-d)}
.nav-link:hover::after{transform:scaleX(1)}
.nav-link[aria-current="page"]{color:var(--sage-d);background:var(--sage-pale)}
.nav-link[aria-current="page"]::after{display:none}
.nav-cta{
  font-size:13.5px;font-weight:700;color:#fff;background:var(--sage-d);
  padding:13px 24px;border-radius:999px;letter-spacing:.06em;text-transform:uppercase;
  white-space:nowrap;flex-shrink:0;position:relative;overflow:hidden;
  transition:background .3s,transform .3s var(--ease-out),box-shadow .3s;
}
.nav-cta::before{content:'';position:absolute;inset:0;background:linear-gradient(100deg,transparent 30%,rgba(255,255,255,.22) 50%,transparent 70%);
  transform:translateX(-120%);transition:transform .7s var(--ease-out)}
.nav-cta:hover{background:var(--sage);transform:translateY(-1px);box-shadow:0 10px 24px rgba(58,99,71,.3)}
.nav-cta:hover::before{transform:translateX(120%)}
:root[data-theme="dark"] .nav-cta{color:#14100d;background:var(--sage)}
:root[data-theme="dark"] .nav-cta:hover{background:var(--sage-d)}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]) .nav-cta{color:#14100d;background:var(--sage)}
  :root:not([data-theme="light"]) .nav-cta:hover{background:var(--sage-d)}
}
.nav-ham{display:none;flex-direction:column;gap:5px;cursor:pointer;padding:12px;background:none;border:0;z-index:2}
.nav-ham span{display:block;width:22px;height:2px;background:var(--ink-2);transition:all .35s var(--ease-out);border-radius:2px}
.nav-ham.open span:nth-child(1){transform:rotate(45deg) translate(5px,5px)}
.nav-ham.open span:nth-child(2){opacity:0;transform:scaleX(0)}
.nav-ham.open span:nth-child(3){transform:rotate(-45deg) translate(5px,-5px)}

/* the full screen menu on small screens */
.nav-mobile{position:fixed;inset:0;background:var(--cream);z-index:590;display:flex;flex-direction:column;
  justify-content:center;padding:110px 34px 40px;gap:0;
  opacity:0;visibility:hidden;transform:translateY(-12px);
  transition:opacity .4s var(--ease-out),transform .5s var(--ease-out),visibility 0s .5s;overflow:auto}
.nav-mobile::before{content:'';position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse 70% 40% at 90% 0%,color-mix(in srgb, var(--sage-pale) 70%, transparent),transparent 70%)}
.nav-mobile.open{opacity:1;visibility:visible;transform:none;transition:opacity .4s var(--ease-out),transform .5s var(--ease-out),visibility 0s}
.nav-mobile-link{position:relative;font-family:var(--fd);font-size:clamp(40px,10vw,58px);font-weight:500;color:var(--ink);letter-spacing:-1px;line-height:1.15;
  padding:8px 0;border-bottom:1px solid var(--border);display:flex;align-items:baseline;justify-content:space-between;
  opacity:0;transform:translateY(18px);transition:opacity .5s var(--ease-out),transform .6s var(--ease-out),color .3s}
.nav-mobile-link::after{content:'\2192';font-family:var(--fb);font-size:22px;color:var(--sage);opacity:.7}
.nav-mobile.open .nav-mobile-link{opacity:1;transform:none}
.nav-mobile.open .nav-mobile-link:nth-child(1){transition-delay:.06s}
.nav-mobile.open .nav-mobile-link:nth-child(2){transition-delay:.11s}
.nav-mobile.open .nav-mobile-link:nth-child(3){transition-delay:.16s}
.nav-mobile.open .nav-mobile-link:nth-child(4){transition-delay:.21s}
.nav-mobile.open .nav-mobile-link:nth-child(5){transition-delay:.26s}
.nav-mobile-link:hover{color:var(--sage)}
.nav-mobile-cta{font-size:15px;font-weight:700;color:#fff;background:var(--sage-d);padding:18px 34px;border-radius:999px;
  letter-spacing:.07em;text-transform:uppercase;margin-top:28px;text-align:center;
  opacity:0;transform:translateY(18px);transition:opacity .5s var(--ease-out) .32s,transform .6s var(--ease-out) .32s}
.nav-mobile.open .nav-mobile-cta{opacity:1;transform:none}
:root[data-theme="dark"] .nav-mobile-cta{color:#14100d;background:var(--sage)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .nav-mobile-cta{color:#14100d;background:var(--sage)}}
.nav-mobile-foot{margin-top:26px;display:flex;flex-direction:column;gap:6px;font-size:15px;color:var(--ink-3);
  opacity:0;transition:opacity .5s .4s}
.nav-mobile.open .nav-mobile-foot{opacity:1}
.nav-mobile-foot a{color:var(--sage-d);font-weight:600}
.nav-mobile-foot .hand{font-size:24px;color:var(--gold)}
@media(max-width:1100px){
  .nav-links{display:none}
  .nav-ham{display:flex}
  .nav-cta{display:none}
  .nav{padding:8px 8px 8px 18px}
}

/* dual brand lock-up: her name leads, the clinic sits underneath */
.nav-logo{display:flex;flex-direction:column;line-height:1.12;gap:1px;white-space:nowrap;flex-shrink:0;position:relative;z-index:2}
.nl-name{font-family:var(--fd);font-size:23px;font-weight:600;color:var(--ink);letter-spacing:-.2px}
.nl-sub{font-size:10.4px;font-weight:700;color:var(--sage);letter-spacing:.14em;text-transform:uppercase}
@media(max-width:600px){
  .nl-name{font-size:19.5px}
  .nl-sub{font-size:9.3px}
}

/* the phone dock: a booking bar that slides up on small screens once the
   visitor is past the first screen. Hidden again near the booking form
   itself, because a button that points at the thing beside it is noise. */
.dock{position:fixed;left:12px;right:12px;bottom:max(12px,env(safe-area-inset-bottom));z-index:560;display:none;
  gap:8px;padding:8px;background:color-mix(in srgb, var(--ink) 92%, transparent);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
  border-radius:999px;box-shadow:0 16px 40px rgba(0,0,0,.28);
  transform:translateY(140%);transition:transform .5s var(--ease-out)}
.dock.on{transform:none}
.dock-book{flex:1;text-align:center;font-size:14.5px;font-weight:700;color:#fff;background:var(--sage);padding:15px 18px;border-radius:999px;letter-spacing:.05em;text-transform:uppercase}
.dock-call{width:50px;height:50px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--cream);background:rgba(255,255,255,.1);flex-shrink:0}
.dock-call svg{width:20px;height:20px}
:root[data-theme="dark"] .dock{background:color-mix(in srgb, var(--cream-3) 94%, transparent)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .dock{background:color-mix(in srgb, var(--cream-3) 94%, transparent)}}
@media(max-width:760px){.dock{display:flex}}

/* ==========================================================================
   SECTIONS AND HEADINGS
   ========================================================================== */
.sec{position:relative;z-index:2;padding:140px 0}
.sec.cream-2{background:var(--cream-2)}
.sec.ink{background:var(--deep);color:var(--panel-tx)}
.sl{font-family:var(--fh);font-size:28px;color:var(--sage);display:block;margin-bottom:12px;transform:rotate(-1.2deg);transform-origin:left bottom;width:fit-content}
.sh{font-family:var(--fd);font-size:clamp(42px,5vw,78px);font-weight:400;line-height:1.04;letter-spacing:-1.5px;color:var(--ink);margin-bottom:24px;text-wrap:balance}
.sh em{font-style:italic;color:var(--sage);font-weight:400}
.sec.ink .sl{color:var(--sage-light)}
.sec.ink .sh{color:#fff}
.sec.ink .sh em{color:var(--sage-light)}
.lede{font-size:20px;color:var(--ink-3);max-width:680px;line-height:1.85}

/* a small uppercase label, used where the handwriting would be too loud */
.lbl{display:inline-flex;align-items:center;gap:10px;font-size:12.6px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--sage-d)}
.lbl::before{content:'';width:22px;height:1px;background:var(--sage)}
:root[data-theme="dark"] .lbl{color:var(--sage)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .lbl{color:var(--sage)}}

/* section divider whisper, the clinic's own device */
.sec-whisper{display:flex;align-items:center;justify-content:center;gap:20px;padding:30px 0;pointer-events:none;overflow:hidden}
.sw-line{flex:1;height:1px;background:linear-gradient(to right,transparent,var(--border-2),transparent);max-width:240px}
.sw-text{font-family:var(--fh);font-size:22px;color:var(--ink-4);opacity:.7;white-space:nowrap;letter-spacing:.3px}
.sw-dot{width:5px;height:5px;border-radius:50%;background:var(--sage-light);opacity:.5;flex-shrink:0}
@media(max-width:600px){.sec-whisper{padding:14px 0}.sw-text{font-size:17px}}

/* ==========================================================================
   BUTTONS v3. Pill shaped, with a soft sheen on hover. The lettering uses
   var(--card) where the fill lightens in dark mode, so contrast holds.
   ========================================================================== */
.btn-p{
  display:inline-flex;align-items:center;gap:10px;position:relative;overflow:hidden;
  font-size:15px;font-weight:700;color:#fff;background:var(--sage-d);
  padding:18px 34px;border-radius:999px;letter-spacing:.07em;text-transform:uppercase;
  transition:background .3s,transform .3s var(--ease-out),box-shadow .3s;
  box-shadow:0 2px 8px rgba(58,99,71,.22);
}
.btn-p::before{content:'';position:absolute;inset:0;background:linear-gradient(100deg,transparent 30%,rgba(255,255,255,.2) 50%,transparent 70%);
  transform:translateX(-120%);transition:transform .7s var(--ease-out)}
.btn-p:hover{background:var(--sage);transform:translateY(-2px);box-shadow:0 14px 30px rgba(58,99,71,.32)}
.btn-p:hover::before{transform:translateX(120%)}
:root[data-theme="dark"] .btn-p{color:#14100d;background:var(--sage)}
:root[data-theme="dark"] .btn-p:hover{background:var(--sage-d)}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]) .btn-p{color:#14100d;background:var(--sage)}
  :root:not([data-theme="light"]) .btn-p:hover{background:var(--sage-d)}
}
.btn-g{
  display:inline-flex;align-items:center;gap:8px;
  font-size:15px;font-weight:600;color:var(--sage-d);
  border-bottom:1.5px solid var(--sage);padding-bottom:3px;
  letter-spacing:.05em;text-transform:uppercase;transition:all .3s;
}
.btn-g:hover{color:var(--ink);border-bottom-color:var(--ink-2);gap:12px}
:root[data-theme="dark"] .btn-g{color:var(--sage)}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]) .btn-g{color:var(--sage)}
}

/* ==========================================================================
   REVEAL ON SCROLL. One class, four flavours, staggered among siblings.
   assets/site.js adds .vis when the element enters the viewport.
   ========================================================================== */
.rv{opacity:0;transform:translateY(28px);transition:opacity .9s var(--ease-out),transform .9s var(--ease-out),filter .9s var(--ease-out)}
.rv.rv-l{transform:translateX(-34px)}
.rv.rv-r{transform:translateX(34px)}
.rv.rv-s{transform:scale(.94)}
.rv.rv-b{filter:blur(8px);transform:translateY(12px)}
.rv.vis{opacity:1;transform:none;filter:none}
.rv.vis:nth-child(2){transition-delay:.08s}
.rv.vis:nth-child(3){transition-delay:.16s}
.rv.vis:nth-child(4){transition-delay:.24s}
.rv.vis:nth-child(5){transition-delay:.32s}
.rv.vis:nth-child(6){transition-delay:.40s}
.rv.vis:nth-child(7){transition-delay:.48s}

/* an image that unmasks from the bottom as it arrives */
.rv-clip{clip-path:inset(12% 0 12% 0 round 24px);transform:scale(1.04);transition:clip-path 1.2s var(--ease-out),transform 1.4s var(--ease-out)}
.rv-clip.vis{clip-path:inset(0 0 0 0 round 0);transform:none}

/* headline word reveal: site.js wraps each word of .split in a span */
.split .w{display:inline-block;overflow:hidden;vertical-align:bottom;padding-bottom:.08em;margin-bottom:-.08em}
.split .w i{display:inline-block;font-style:inherit;transform:translateY(110%);transition:transform 1s var(--ease-out)}
.split.vis .w i{transform:none}

/* ==========================================================================
   MEDICAL SAFETY BLOCKS
   ========================================================================== */
.med-note{
  border-left:3px solid var(--sage);background:var(--sage-pale);
  padding:24px 28px;border-radius:0 var(--r-s) var(--r-s) 0;margin:30px 0;
  font-size:17.8px;line-height:1.7;color:var(--ink-2);
}
.med-note strong{color:var(--ink)}
.med-red{
  border-left:3px solid var(--terracotta);background:rgba(196,92,58,.07);
  padding:24px 28px;border-radius:0 var(--r-s) var(--r-s) 0;margin:30px 0;
  font-size:17.8px;line-height:1.7;color:var(--ink-2);
}
.med-red strong{color:var(--terracotta)}
.med-red ul{margin:10px 0 0 20px}
.med-red li{margin-bottom:5px}


/* ===== kept from v2: booking frame and form (proven at 375px) ===== */
/* ==========================================================================
   BOOKING FRAME v2. A botanical band on top, then the form.
   ========================================================================== */
.book-frame{background:var(--card);border:1px solid var(--border-2);border-radius:var(--r-l);overflow:hidden;box-shadow:var(--sh-l)}
.book-img{aspect-ratio:16/5;overflow:hidden;background:var(--cream-2)}
.book-img img{width:100%;height:100%;object-fit:cover}
.book-bar{display:flex;align-items:center;gap:10px;padding:15px 22px;background:var(--sage-pale);border-bottom:1px solid var(--border)}
.book-dot{width:8px;height:8px;background:var(--sage);border-radius:50%;animation:ckpulse 2.4s infinite}
.book-bar-lbl{font-size:14.8px;font-weight:700;color:var(--sage-d);letter-spacing:.05em}
:root[data-theme="dark"] .book-bar-lbl{color:var(--sage)}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]) .book-bar-lbl{color:var(--sage)}
}
.book-ph{padding:44px 28px;text-align:center;color:var(--ink-4)}
.book-ph-ico{font-size:38px;margin-bottom:10px}
.book-ph-t{font-family:var(--fd);font-size:25px;font-weight:600;color:var(--ink-3);margin-bottom:6px}
.book-ph-s{font-size:16.4px;line-height:1.7;max-width:420px;margin:0 auto}
.book-frame iframe{width:100%;min-height:620px;border:0;display:block}

/* ---- the booking form ---- */
.bkf{padding:38px 34px}
.bkf-q{margin-bottom:28px}
.bkf-q:last-of-type{margin-bottom:22px}
.bkf-lbl{display:block;font-size:17.8px;font-weight:600;color:var(--ink);margin-bottom:11px;line-height:1.5}
.bkf-req{color:var(--terracotta);font-style:normal;font-weight:600}
.bkf-opt{font-weight:400;font-size:14.8px;color:var(--ink-4)}
.bkf-in{
  width:100%;padding:15px 18px;font-family:var(--fb);font-size:17.8px;color:var(--ink);
  background:var(--cream);border:1px solid var(--border-2);border-radius:var(--r-s);
  transition:border-color .25s,box-shadow .25s,background .25s;
}
.bkf-in::placeholder{color:var(--ink-4)}
.bkf-in:focus{outline:0;border-color:var(--sage);background:var(--card);box-shadow:0 0 0 4px var(--sage-pale)}
.bkf-help{margin:9px 0 0;font-size:14.8px;line-height:1.65;color:var(--ink-3)}

.bkf-chips{display:flex;flex-wrap:wrap;gap:9px}
.bkf-chip{
  font-family:var(--fb);font-size:15.8px;line-height:1.3;padding:12px 19px;cursor:pointer;
  color:var(--ink-2);background:var(--cream);border:1px solid var(--border-2);border-radius:999px;
  transition:background .25s,border-color .25s,color .25s,transform .2s var(--ease-out),box-shadow .25s;
}
.bkf-chip:hover{border-color:var(--sage-light);color:var(--ink);transform:translateY(-1px);box-shadow:var(--sh-s)}
.bkf-chip:focus-visible{outline:2px solid var(--sage);outline-offset:2px}
/* selected chip lettering is var(--card): correct contrast in both themes */
.bkf-chip.on{background:var(--sage);border-color:var(--sage);color:var(--card);transform:translateY(-1px)}
.bkf-days .bkf-chip,.bkf-slots .bkf-chip{font-variant-numeric:tabular-nums}
.bkf-empty{display:inline-block;padding:6px 2px;font-size:15.8px;color:var(--ink-4)}

.bkf-alert{
  margin:0 0 18px;padding:14px 18px;font-size:16.4px;line-height:1.6;
  color:var(--terracotta);background:rgba(196,92,58,.08);
  border-left:3px solid var(--terracotta);border-radius:0 var(--r-s) var(--r-s) 0;
}
.bkf-go{width:100%;justify-content:center;font-size:17px;color:var(--card);background:var(--sage-d)}
.bkf-go:hover{color:var(--card);background:var(--sage)}
:root[data-theme="dark"] .bkf-go{background:var(--sage)}
:root[data-theme="dark"] .bkf-go:hover{background:var(--sage-d)}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]) .bkf-go{background:var(--sage)}
  :root:not([data-theme="light"]) .bkf-go:hover{background:var(--sage-d)}
}
.bkf-go[disabled]{opacity:.6;cursor:progress}
.bkf-fine{margin:15px 0 0;font-size:14.8px;line-height:1.65;color:var(--ink-3);text-align:center}

.bkf-done{padding:56px 30px;text-align:center}
.bkf-done-ico{
  width:56px;height:56px;margin:0 auto 18px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-size:26px;color:var(--card);background:var(--sage);
  box-shadow:0 0 0 8px var(--sage-pale);
}
.bkf-done-t{font-family:var(--fd);font-size:31px;font-weight:600;color:var(--ink);margin-bottom:12px}
.bkf-done-s{font-size:16.6px;line-height:1.75;color:var(--ink-3);max-width:470px;margin:0 auto 12px}
.bkf-done-s:last-child{margin-bottom:0}
.bkf-done-s a{color:var(--sage);border-bottom:1px solid var(--sage-light)}

@media(max-width:640px){
  .bkf{padding:28px 20px}
  .bkf-chip{font-size:15.2px;padding:11px 15px}
  .bkf-done{padding:40px 20px}
}

/* booking section around the frame */
.book-in{max-width:720px;margin:0 auto;padding:0 36px}
.book-hdr{text-align:center;margin-bottom:44px}
.book-fee{margin:16px auto 0;text-align:center;font-size:16.4px;color:var(--ink-2)}
.book-fee strong{font-weight:700;color:var(--ink)}
.book-trust{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin-top:26px}
.bt{font-size:14.8px;color:var(--ink-3);background:var(--card);border:1px solid var(--border);padding:9px 18px;border-radius:999px;box-shadow:var(--sh-s)}
.bt::before{content:'\2713  ';color:var(--sage);font-weight:700}


/* ===== kept from v2: inner pages, FAQ, checker, authority, guides, legal, theme toggle, 404 ===== */
/* ==========================================================================
   INNER PAGE HERO (treatments, blog, legal, about). Optionally carries an
   arch image on the right when the page has one.
   ========================================================================== */
.tp-hero{padding:168px 0 72px;background:var(--cream-2);position:relative;overflow:hidden}
.tp-hero::before{content:'';position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse 40% 60% at 92% 10%,color-mix(in srgb, var(--sage-pale) 45%, transparent) 0%,transparent 70%)}
.tp-hero .wrap{position:relative}
.tp-crumb{font-size:14.8px;color:var(--ink-4);margin-bottom:18px}
.tp-crumb a{color:var(--sage-d)}
:root[data-theme="dark"] .tp-crumb a{color:var(--sage)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .tp-crumb a{color:var(--sage)}}
.tp-crumb a:hover{text-decoration:underline}
.tp-ico{font-size:46px;display:block;margin-bottom:14px}
.tp-title{font-family:var(--fd);font-size:clamp(42px,5vw,76px);font-weight:400;line-height:1.04;letter-spacing:-1.5px;margin-bottom:18px;text-wrap:balance}
.tp-title em{font-style:italic;color:var(--sage)}
.tp-lede{font-size:20.5px;color:var(--ink-3);max-width:700px;line-height:1.8}

/* two-column variant when the page carries an image */
.tp-hero.has-media .wrap{display:grid;grid-template-columns:1.15fr .85fr;gap:64px;align-items:center}
.tp-media{border-radius:var(--r-arch);overflow:hidden;border:6px solid var(--card);box-shadow:var(--sh-l);background:var(--cream);max-width:400px;justify-self:end}
.tp-media img{width:100%;aspect-ratio:4/4.6;object-fit:cover;display:block}
@media(max-width:900px){
  .tp-hero.has-media .wrap{grid-template-columns:1fr;gap:40px}
  .tp-media{justify-self:start;max-width:340px}
}

.tp-body{max-width:780px;margin:0 auto}
.tp-body h2{font-family:var(--fd);font-size:clamp(30px,3.4vw,44px);font-weight:500;line-height:1.2;letter-spacing:-.5px;margin:52px 0 18px;color:var(--ink)}
.tp-body h2:first-child{margin-top:0}
.tp-body h3{font-family:var(--fd);font-size:27px;font-weight:600;margin:34px 0 10px;color:var(--ink)}
.tp-body p{font-size:18.4px;color:var(--ink-2);line-height:1.85;margin-bottom:18px}
.tp-body ul{margin:0 0 20px 22px}
.tp-body li{font-size:18.4px;color:var(--ink-2);line-height:1.8;margin-bottom:9px}
.tp-body li strong{color:var(--ink)}
.tp-body a{color:var(--sage-d);border-bottom:1px solid color-mix(in srgb, var(--sage) 35%, transparent)}
.tp-body a:hover{border-bottom-color:var(--sage)}
:root[data-theme="dark"] .tp-body a{color:var(--sage)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .tp-body a{color:var(--sage)}}
.tp-steps{counter-reset:s;margin:26px 0 30px;padding:0;list-style:none}
.tp-steps li{counter-increment:s;position:relative;padding:20px 22px 20px 74px;margin-bottom:14px;font-size:18.4px;color:var(--ink-2);line-height:1.8;background:var(--card);border:1px solid var(--border);border-radius:var(--r-m);box-shadow:var(--sh-s)}
.tp-steps li::before{content:counter(s);position:absolute;left:20px;top:20px;width:38px;height:38px;border-radius:50%;background:var(--sage-pale);color:var(--sage-d);font-family:var(--fd);font-size:21px;font-weight:700;display:flex;align-items:center;justify-content:center}
:root[data-theme="dark"] .tp-steps li::before{color:var(--sage)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .tp-steps li::before{color:var(--sage)}}

/* ==========================================================================
   FAQ ACCORDION. Plain <details>/<summary>, works with JavaScript off.
   ========================================================================== */
.faqx{margin:60px 0 0;padding:42px 34px 38px;background:var(--cream-2);border:1px solid var(--border);border-radius:var(--r-l)}
.faqx-hd{text-align:center;margin-bottom:30px}
.faqx-kick{display:inline-block;font-size:12.6px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--sage-d);margin-bottom:6px}
:root[data-theme="dark"] .faqx-kick{color:var(--sage)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .faqx-kick{color:var(--sage)}}
.faqx .faqx-h{font-family:var(--fd);font-size:clamp(32px,3.6vw,46px);font-weight:500;line-height:1.15;letter-spacing:-.5px;color:var(--ink);margin:0}
.faqx .faqx-h em{font-style:italic;color:var(--sage)}
.faqx-list{display:flex;flex-direction:column;gap:12px;max-width:680px;margin:0 auto}

.faqx-i{background:var(--card);border:1px solid var(--border-2);border-radius:var(--r-m);transition:border-color .3s var(--ease-out),box-shadow .3s var(--ease-out)}
.faqx-i:hover{border-color:var(--sage-light);box-shadow:var(--sh-s)}
.faqx-i[open]{border-color:var(--sage);box-shadow:var(--sh-m)}
.faqx-i>summary{display:flex;align-items:flex-start;gap:16px;padding:21px 23px;cursor:pointer;list-style:none;border-radius:var(--r-m)}
.faqx-i>summary::-webkit-details-marker{display:none}
.faqx-i>summary::marker{content:''}
.faqx-i>summary:focus-visible{outline:2px solid var(--sage);outline-offset:2px}
.faqx-q{flex:1;font-family:var(--fd);font-size:23px;font-weight:600;line-height:1.35;color:var(--ink);transition:color .25s}
.faqx-i:hover .faqx-q,.faqx-i[open] .faqx-q{color:var(--sage-d)}
:root[data-theme="dark"] .faqx-i:hover .faqx-q,:root[data-theme="dark"] .faqx-i[open] .faqx-q{color:var(--sage)}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]) .faqx-i:hover .faqx-q,
  :root:not([data-theme="light"]) .faqx-i[open] .faqx-q{color:var(--sage)}
}
.faqx-ico{flex:none;width:36px;height:36px;margin-top:1px;border-radius:50%;border:1px solid var(--border-2);background:var(--cream-2);position:relative;transition:transform .35s var(--ease-out),background .3s,border-color .3s}
.faqx-ico::before,.faqx-ico::after{content:'';position:absolute;top:50%;left:50%;width:13px;height:1.7px;border-radius:2px;background:var(--sage);transform:translate(-50%,-50%);transition:background .3s}
.faqx-ico::after{transform:translate(-50%,-50%) rotate(90deg)}
.faqx-i[open] .faqx-ico{transform:rotate(45deg);background:var(--sage);border-color:var(--sage)}
.faqx-i[open] .faqx-ico::before,.faqx-i[open] .faqx-ico::after{background:var(--card)}
.faqx .faqx-a{padding:0 23px 22px}
.faqx .faqx-a::before{content:'';display:block;height:1px;background:var(--border);margin-bottom:16px}
.faqx .faqx-a p{font-size:18.2px;color:var(--ink-2);line-height:1.8;margin:0}
.faqx .faqx-a p+p{margin-top:12px}
@supports (interpolate-size:allow-keywords){
  .faqx-i{interpolate-size:allow-keywords}
  .faqx-i::details-content{block-size:0;overflow:hidden;content-visibility:hidden;transition:block-size .4s var(--ease-out),content-visibility .4s allow-discrete}
  .faqx-i[open]::details-content{block-size:auto;content-visibility:visible}
}
@media(prefers-reduced-motion:reduce){
  .faqx-i,.faqx-ico,.faqx-q,.faqx-i::details-content{transition:none}
}
@media(max-width:600px){
  .faqx{margin-top:44px;padding:28px 14px 24px;border-radius:var(--r-m)}
  .faqx-hd{margin-bottom:22px}
  .faqx-list{gap:10px}
  .faqx-i>summary{padding:17px 16px;gap:12px}
  .faqx-q{font-size:20.6px}
  .faqx-ico{width:31px;height:31px}
  .faqx-ico::before,.faqx-ico::after{width:11px}
  .faqx .faqx-a{padding:0 16px 18px}
  .faqx .faqx-a p{font-size:17.6px}
}

.tp-next{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:38px}
.tn{border:1px solid var(--border);border-radius:var(--r-m);padding:24px 22px;transition:transform .3s var(--ease-out),border-color .3s,box-shadow .3s;background:var(--card);box-shadow:var(--sh-s);display:block}
.tn:hover{border-color:var(--sage-light);transform:translateY(-4px);box-shadow:var(--sh-m)}
.tn-ico{font-size:26px;display:block;margin-bottom:10px}
.tn-n{font-family:var(--fd);font-size:22px;font-weight:600;color:var(--ink);line-height:1.25}
.tn-d{font-size:15px;color:var(--ink-3);line-height:1.6;margin-top:5px;display:block}
@media(max-width:900px){.tp-next{grid-template-columns:1fr}}
@media(max-width:600px){
  .tp-hero{padding:140px 0 52px}
  .tp-body p,.tp-body li,.tp-steps li{font-size:17.6px}
}

/* ==========================================================================
   SYMPTOM CHECKER, on the deep green band.
   No score ring, no percentage, no urgency colour, on purpose.
   ========================================================================== */
.checker{background:linear-gradient(160deg,var(--deep) 0%,var(--deep-3) 40%,var(--deep) 100%);position:relative;overflow:hidden;padding:110px 0}
.checker::before{content:'';position:absolute;top:-200px;right:-200px;width:600px;height:600px;background:radial-gradient(circle,rgba(74,124,89,.22),transparent 70%);pointer-events:none}
.checker::after{content:'';position:absolute;bottom:-240px;left:-180px;width:520px;height:520px;background:radial-gradient(circle,rgba(154,111,58,.1),transparent 70%);pointer-events:none}
.ck-wrap{max-width:880px;margin:0 auto;padding:0 36px;position:relative;z-index:2}
.ck-badge{display:inline-flex;align-items:center;gap:8px;background:rgba(74,124,89,.22);border:1px solid rgba(122,171,136,.4);padding:8px 18px;border-radius:99px;margin-bottom:22px}
.ck-badge-dot{width:7px;height:7px;background:var(--sage-light);border-radius:50%;animation:ckpulse 2s infinite}
@keyframes ckpulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(.8)}}
.ck-badge-text{font-size:13.2px;font-weight:700;color:var(--sage-light);letter-spacing:.1em;text-transform:uppercase}
.ck-title{font-family:var(--fd);font-size:clamp(42px,5vw,70px);font-weight:400;line-height:1.08;letter-spacing:-1px;color:#fff;margin-bottom:16px;text-wrap:balance}
.ck-title em{font-style:italic;color:var(--sage-light)}
.ck-sub{font-size:19.4px;color:rgba(255,255,255,.66);line-height:1.75;margin-bottom:30px;max-width:640px}
.ck-pick{font-size:17px;font-weight:500;color:rgba(255,255,255,.6);margin-bottom:22px}
.ck-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.cg-card{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);border-radius:var(--r-m);padding:26px 16px;cursor:pointer;transition:all .3s var(--ease-out);text-align:center;width:100%;color:inherit}
.cg-card:hover,.cg-card.active{border-color:rgba(122,171,136,.65);background:rgba(74,124,89,.2);transform:translateY(-4px);box-shadow:0 14px 34px rgba(0,0,0,.28)}
.cg-ico{font-size:40px;margin-bottom:10px;display:block;line-height:1}
.cg-name{font-family:var(--fd);font-size:22.5px;font-weight:600;color:#fff;margin-bottom:4px;line-height:1.2}
.cg-hint{font-size:13.6px;color:rgba(255,255,255,.48);line-height:1.4}
@media(max-width:800px){.ck-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:460px){.ck-grid{grid-template-columns:1fr}}

/* the panel that slides open */
.ck-panel{max-height:0;overflow:hidden;opacity:0;transition:max-height .6s var(--ease-out),opacity .4s ease;margin-top:0}
.ck-panel.open{max-height:3000px;opacity:1;margin-top:30px}
.ck-inner{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.13);border-radius:var(--r-l);padding:36px 40px;position:relative;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.ck-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:20px}
.ck-head-t{font-family:var(--fd);font-size:25px;font-weight:600;color:#fff;line-height:1.25}
.ck-close{width:34px;height:34px;border-radius:50%;background:rgba(255,255,255,.1);color:rgba(255,255,255,.7);font-size:17px;flex-shrink:0;display:flex;align-items:center;justify-content:center;line-height:1;transition:background .3s}
.ck-close:hover{background:rgba(255,255,255,.2);color:#fff}
.ck-prog{height:4px;background:rgba(255,255,255,.08);border-radius:2px;margin-bottom:24px;overflow:hidden}
.ck-prog i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--sage),var(--sage-light));border-radius:2px;transition:width .5s var(--ease-out)}
.ck-steplbl{font-size:13.2px;color:rgba(255,255,255,.45);letter-spacing:.1em;text-transform:uppercase;margin-bottom:12px}
.ck-q{font-family:var(--fd);font-size:clamp(25px,2.6vw,32px);font-weight:400;color:#fff;margin-bottom:22px;line-height:1.35}
.ck-opts{display:grid;grid-template-columns:1fr 1fr;gap:11px;margin-bottom:24px}
.ck-opt{display:flex;align-items:center;gap:12px;text-align:left;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);border-radius:14px;padding:17px;transition:all .25s;width:100%}
.ck-opt:hover{background:rgba(74,124,89,.16);border-color:rgba(74,124,89,.45)}
.ck-opt.sel{background:rgba(74,124,89,.26);border-color:var(--sage-light)}
.ck-opt-mark{width:18px;height:18px;flex-shrink:0;border-radius:50%;border:2px solid rgba(255,255,255,.3);transition:all .25s}
.ck-opt.sel .ck-opt-mark{border-color:var(--sage-light);background:var(--sage-light);box-shadow:inset 0 0 0 3px rgba(15,35,24,.9)}
.ck-opt-text{font-size:16.2px;color:rgba(255,255,255,.88);line-height:1.45;font-weight:500}
@media(max-width:700px){.ck-opts{grid-template-columns:1fr}.ck-inner{padding:26px 20px}}
.ck-nav{display:flex;justify-content:flex-end;gap:10px}
.ck-btn{font-size:14.4px;font-weight:700;padding:13px 28px;border-radius:999px;letter-spacing:.05em;text-transform:uppercase;transition:all .3s;display:inline-flex;align-items:center}
.ck-btn.back{background:rgba(255,255,255,.07);color:rgba(255,255,255,.65)}
.ck-btn.back:hover{background:rgba(255,255,255,.13)}
.ck-btn.next{background:var(--sage-light);color:var(--deep)}
.ck-btn.next:hover{background:#8fc19c}
.ck-btn.next:disabled{opacity:.35;cursor:not-allowed}

/* result */
.ck-res{color:rgba(255,255,255,.82)}
.ck-res-kicker{font-family:var(--fh);font-size:22.5px;color:var(--sage-light);display:block;margin-bottom:6px}
.ck-res-t{font-family:var(--fd);font-size:clamp(27px,3vw,37px);font-weight:400;color:#fff;line-height:1.2;margin-bottom:20px}
.ck-res-h{font-family:var(--fd);font-size:25px;font-weight:600;color:#fff;margin:26px 0 8px}
.ck-res p{font-size:17.8px;line-height:1.8;color:rgba(255,255,255,.72)}
.ck-sum{list-style:none;display:flex;flex-direction:column;gap:1px;background:rgba(255,255,255,.08);border-radius:14px;overflow:hidden}
.ck-sum li{background:rgba(15,35,24,.6);padding:14px 17px;display:flex;flex-direction:column;gap:2px}
.ck-sum-q{font-size:13.4px;color:rgba(255,255,255,.42)}
.ck-sum-a{font-size:17px;color:#fff;font-weight:600}
.ck-res .med-note{background:rgba(74,124,89,.15);border-left-color:var(--sage-light);color:rgba(255,255,255,.8);margin:24px 0}
.ck-res .med-note strong{color:#fff}
.ck-res-cta{display:flex;gap:16px;align-items:center;flex-wrap:wrap;margin-top:26px}
.ck-res-cta .btn-g{color:var(--sage-light);border-bottom-color:var(--sage-light)}
.ck-reset{display:block;margin:20px auto 0;background:none;color:rgba(255,255,255,.45);font-size:14.6px;text-decoration:underline}
.ck-reset:hover{color:#fff}

/* the safety stop. Deliberately loud and with no booking button on it. */
.ck-stop{text-align:center}
.ck-stop-ico{font-size:46px;margin-bottom:12px;line-height:1}
.ck-stop-t{font-family:var(--fd);font-size:clamp(29px,3.4vw,43px);font-weight:600;color:#ffb4a0;line-height:1.2;margin-bottom:12px}
.ck-stop-lede{font-size:18.4px;color:rgba(255,255,255,.85);line-height:1.75;max-width:580px;margin:0 auto 24px}
.ck-stop .med-red{background:rgba(196,92,58,.16);border-left-color:#ff8a66;color:rgba(255,255,255,.85)}
.ck-stop .med-red strong{color:#ffb4a0}
.ck-stop-note{font-size:17.8px;font-weight:600;color:#ffb4a0;margin-top:18px;line-height:1.7}
.ck-trust{display:flex;justify-content:center;gap:24px;flex-wrap:wrap;margin-top:32px}
.ck-trust span{font-size:14.8px;color:rgba(255,255,255,.45);display:flex;align-items:center;gap:7px}
.ck-trust span::before{content:'\2713';color:var(--sage-light);font-weight:700}

/* ==========================================================================
   AUTHORITY PAGE
   ========================================================================== */
.au-answer{background:var(--sage-pale);border-radius:var(--r-m);padding:28px 32px;margin:0 0 36px;font-size:19.4px;line-height:1.8;color:var(--ink-2)}
.cred-list{display:flex;flex-direction:column;gap:14px;margin:26px 0 10px}
.cred-item{background:var(--card);border:1px solid var(--border);border-radius:var(--r-m);padding:24px 26px;transition:transform .3s var(--ease-out),box-shadow .3s,border-color .3s;box-shadow:var(--sh-s)}
.cred-item:hover{transform:translateX(4px);border-color:var(--sage-light);box-shadow:var(--sh-m)}
.cred-t{font-family:var(--fd);font-size:25px;font-weight:600;color:var(--ink);line-height:1.25}
.cred-i{font-size:13.4px;font-weight:700;color:var(--sage-d);letter-spacing:.08em;text-transform:uppercase;margin:4px 0 8px}
:root[data-theme="dark"] .cred-i{color:var(--sage)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .cred-i{color:var(--sage)}}
.cred-d{font-size:17px;color:var(--ink-3);line-height:1.7}
.prac-list{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:26px 0}
.prac-item{background:var(--card);border:1px solid var(--border);border-radius:var(--r-m);padding:22px 24px;box-shadow:var(--sh-s);transition:transform .3s var(--ease-out),border-color .3s}
.prac-item:hover{transform:translateY(-3px);border-color:var(--sage-light)}
.prac-h{font-family:var(--fd);font-size:22px;font-weight:600;color:var(--ink);margin-bottom:5px}
.prac-d{font-size:16px;color:var(--ink-3);line-height:1.65}
@media(max-width:800px){.prac-list{grid-template-columns:1fr}}
.au-portrait{width:200px;height:200px;border-radius:50%;overflow:hidden;border:5px solid var(--card);margin-bottom:24px;box-shadow:var(--sh-l)}
.au-portrait img{width:100%;height:100%;object-fit:cover}

/* ==========================================================================
   THE GUIDES (blog index, category pages, guide pages)
   ========================================================================== */
.g-answer{background:var(--sage-pale);border-left:3px solid var(--sage);border-radius:0 var(--r-m) var(--r-m) 0;padding:24px 26px;margin:0 0 30px}
.ga-k{display:block;font-size:12.6px;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--sage-d);margin-bottom:8px}
:root[data-theme="dark"] .ga-k{color:var(--sage)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .ga-k{color:var(--sage)}}
.g-answer p{font-size:19.8px;line-height:1.7;color:var(--ink-2);margin:0}

.g-by{margin-top:28px;padding-top:24px;border-top:1px solid var(--border)}
.gb-who{display:inline-flex;align-items:center;gap:14px}
.gb-who img{width:56px;height:56px;border-radius:50%;object-fit:cover;border:2px solid var(--cream-3)}
.gb-n{display:block;font-family:var(--fd);font-size:21.5px;font-weight:600;color:var(--ink);line-height:1.2}
.gb-r{display:block;font-size:14.4px;color:var(--ink-3);margin-top:1px}
.gb-who:hover .gb-n{color:var(--sage-d)}
.gb-meta{display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:14px;font-size:14.4px;color:var(--ink-4)}
.gb-rev{display:inline-block;margin-top:12px;font-size:14.4px;font-weight:600;color:var(--sage-d);background:var(--sage-pale);border-radius:99px;padding:7px 16px}
:root[data-theme="dark"] .gb-rev{color:var(--sage)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .gb-rev{color:var(--sage)}}
.gb-pending{display:inline-block;margin-top:12px;font-size:14.2px;color:var(--gold);background:var(--gold-pale);border:1px dashed rgba(154,111,58,.45);border-radius:10px;padding:9px 15px;max-width:560px;line-height:1.5}

.g-toc{background:var(--cream-2);border:1px solid var(--border);border-radius:var(--r-m);padding:22px 26px;margin:0 0 36px}
.gtoc-k{display:block;font-size:12.6px;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--sage-d);margin-bottom:10px}
:root[data-theme="dark"] .gtoc-k{color:var(--sage)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .gtoc-k{color:var(--sage)}}
.g-toc ol{margin:0;padding-left:20px}
.g-toc li{font-size:17px;line-height:1.6;margin-bottom:8px;color:var(--ink-3)}
.g-toc a{color:var(--ink-2);border-bottom:1px solid transparent}
.g-toc a:hover{color:var(--sage-d);border-bottom-color:var(--sage)}

.gl-list{margin:0 0 22px 22px}
.gl-list li{font-size:18.4px;color:var(--ink-2);line-height:1.8;margin-bottom:10px}
.gl-list li strong{color:var(--ink)}

.g-take{background:var(--cream-2);border:1px solid var(--border-2);border-radius:var(--r-m);padding:24px 26px;margin:28px 0}
.g-take .gt-t{display:block;font-size:12.6px;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--sage-d);margin-bottom:12px}
:root[data-theme="dark"] .g-take .gt-t{color:var(--sage)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .g-take .gt-t{color:var(--sage)}}
.g-take ul{margin:0 0 0 20px}
.g-take li{font-size:17.8px;color:var(--ink-2);line-height:1.7;margin-bottom:9px}
.g-take li:last-child{margin-bottom:0}

.g-note{display:block;border-radius:var(--r-m);padding:21px 24px;margin:28px 0;border:1px solid var(--border-2)}
.g-note.note{background:var(--cream-2)}
.g-note.tip{background:var(--sage-pale);border-color:rgba(74,124,89,.3)}
.g-note .gn-t{display:block;font-family:var(--fd);font-size:21.5px;font-weight:600;color:var(--ink);margin-bottom:5px}
.g-note p{font-size:17.8px;color:var(--ink-2);line-height:1.75;margin:0}

.g-quote{border-left:3px solid var(--gold);padding:6px 0 6px 24px;margin:30px 0;font-family:var(--fd);font-size:26px;font-style:italic;line-height:1.5;color:var(--ink-2)}

.gt-wrap{margin:30px 0}
.gt-cap{font-size:14.4px;font-weight:600;color:var(--ink-3);margin-bottom:9px}
.gt-scroll{overflow-x:auto;border:1px solid var(--border-2);border-radius:var(--r-m);-webkit-overflow-scrolling:touch}
table.gt{width:100%;border-collapse:collapse;font-size:17px;min-width:460px}
table.gt th{background:var(--cream-2);text-align:left;font-weight:700;color:var(--ink);padding:14px 17px;border-bottom:1px solid var(--border-2);white-space:nowrap}
table.gt td{padding:14px 17px;border-bottom:1px solid var(--border);color:var(--ink-2);line-height:1.6;vertical-align:top}
table.gt tr:last-child td{border-bottom:0}
table.gt td:first-child{font-weight:600;color:var(--ink)}

.g-cta{background:var(--deep);border-radius:var(--r-m);padding:30px 32px;margin:36px 0;display:flex;align-items:center;justify-content:space-between;gap:22px;flex-wrap:wrap;position:relative;overflow:hidden}
.g-cta::before{content:'';position:absolute;top:-120px;right:-120px;width:320px;height:320px;background:radial-gradient(circle,rgba(122,171,136,.16),transparent 70%);pointer-events:none}
.g-cta .gc-k{display:block;font-family:var(--fh);font-size:23px;color:var(--sage-light);margin-bottom:5px}
.g-cta strong{display:block;font-family:var(--fd);font-size:27.5px;font-weight:500;color:#fff;line-height:1.25}
.g-cta p{font-size:16.8px;color:rgba(255,255,255,.66);line-height:1.65;margin:7px 0 0;max-width:460px}
.g-cta .btn-g{flex-shrink:0;color:#fff;border-bottom-color:rgba(255,255,255,.45);position:relative}
.g-cta .btn-g:hover{color:var(--sage-light);border-bottom-color:var(--sage-light)}

.g-src{margin-top:42px;padding-top:24px;border-top:1px solid var(--border)}
.gs-k{display:block;font-size:12.6px;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--ink-4);margin-bottom:8px}
.g-src p{font-size:16px;color:var(--ink-3);line-height:1.75;margin:0}

.g-pills{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:38px}
.g-pill{display:inline-flex;align-items:center;gap:7px;font-size:15.2px;font-weight:600;color:var(--ink-2);background:var(--card);border:1px solid var(--border-2);border-radius:99px;padding:10px 19px;transition:all .25s var(--ease-out);box-shadow:var(--sh-s)}
.g-pill:hover{border-color:var(--sage-light);color:var(--sage-d);transform:translateY(-1px)}
.g-pill.on{background:var(--sage-d);border-color:var(--sage-d);color:#fff}
:root[data-theme="dark"] .g-pill.on{background:var(--sage);border-color:var(--sage);color:#14100d}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]) .g-pill.on{background:var(--sage);border-color:var(--sage);color:#14100d}
}
.g-pill i{font-style:normal;font-size:13px;opacity:.7}

.g-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.gc{display:flex;flex-direction:column;background:var(--card);border:1px solid var(--border-2);border-radius:var(--r-m);overflow:hidden;transition:transform .35s var(--ease-out),border-color .35s,box-shadow .35s;box-shadow:var(--sh-s)}
.gc:hover{transform:translateY(-6px);border-color:var(--sage-light);box-shadow:var(--sh-m)}
.gc-thumb{display:block;aspect-ratio:16/9;background:var(--cream-2);overflow:hidden}
.gc-thumb img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease-out)}
.gc:hover .gc-thumb img{transform:scale(1.04)}
.gc-fallback{display:flex;align-items:center;justify-content:center;width:100%;height:100%;font-size:44px}
.gc-body{display:flex;flex-direction:column;gap:7px;padding:22px 23px 24px;flex:1}
.gc-cat{font-size:12.8px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--sage-d)}
:root[data-theme="dark"] .gc-cat{color:var(--sage)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .gc-cat{color:var(--sage)}}
.gc-t{font-family:var(--fd);font-size:24px;font-weight:600;color:var(--ink);line-height:1.25}
.gc:hover .gc-t{color:var(--sage-d)}
.gc-x{font-size:16.2px;color:var(--ink-3);line-height:1.6;flex:1}
.gc-m{font-size:14px;color:var(--ink-4);margin-top:4px}

.g-rel{background:var(--cream-2);padding:80px 0}
.g-rel-h{font-family:var(--fd);font-size:clamp(31px,3.6vw,43px);font-weight:500;text-align:center;margin-bottom:36px;color:var(--ink)}
.g-empty{font-size:18.4px;color:var(--ink-3)}

@media(max-width:980px){
  .g-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:640px){
  .g-grid{grid-template-columns:1fr;gap:18px}
  .g-answer{padding:19px 19px;border-radius:0 var(--r-s) var(--r-s) 0}
  .g-answer p{font-size:18.4px}
  .g-by{margin-top:22px}
  .gb-who img{width:48px;height:48px}
  .g-cta{padding:24px 22px;border-radius:var(--r-m)}
  .g-cta strong{font-size:24px}
  .g-toc{padding:18px 19px}
  .g-take,.g-note{padding:18px 19px}
  .g-quote{font-size:22.5px;padding-left:18px}
  .gl-list li,.g-take li{font-size:17.6px}
  .g-rel{padding:60px 0}
}

/* ---- privacy policy and terms ---- */
.lg-body h2.lg-soon{color:var(--ink-3)}
.lg-flag{background:var(--gold-pale);border:1px dashed rgba(154,111,58,.45);border-radius:var(--r-s);padding:13px 17px;margin:0 0 16px;font-size:16.2px;color:var(--gold);line-height:1.6}
.lg-flag strong{color:var(--gold)}

/* ==========================================================================
   THEME TOGGLE
   ========================================================================== */
.theme-btn{
  width:42px;height:42px;flex-shrink:0;border-radius:50%;
  border:1px solid var(--border-2);background:var(--cream-2);
  display:flex;align-items:center;justify-content:center;
  color:var(--ink-3);transition:all .3s var(--ease-out);
}
.theme-btn:hover{border-color:var(--sage);color:var(--sage);transform:rotate(-18deg)}
.theme-btn svg{width:18px;height:18px;display:block}
.theme-btn .t-moon{display:block}
.theme-btn .t-sun{display:none}
:root[data-theme="dark"] .theme-btn .t-moon{display:none}
:root[data-theme="dark"] .theme-btn .t-sun{display:block}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]) .theme-btn .t-moon{display:none}
  :root:not([data-theme="light"]) .theme-btn .t-sun{display:block}
}
@media(max-width:1100px){
  .theme-btn{margin-left:auto}
}

/* In dark mode the sage pale tint is a dark green, so text on it must flip. */
:root[data-theme="dark"] .g-answer p,
:root[data-theme="dark"] .med-note{color:var(--ink-2)}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]) .g-answer p,
  :root:not([data-theme="light"]) .med-note{color:var(--ink-2)}
}
:root[data-theme="dark"] .gb-pending{background:var(--gold-pale);color:var(--gold)}
:root[data-theme="dark"] .lg-flag{background:var(--gold-pale);color:var(--gold)}

/* ==========================================================================
   404 PAGE. The plant that took a wrong turn. Migrated design, v2 polish.
   ========================================================================== */
.nf{padding:150px 0 96px;position:relative;overflow:hidden}
.nf::before{content:'';position:absolute;inset:0;pointer-events:none;z-index:0;
  background:radial-gradient(ellipse 55% 50% at 10% 85%,rgba(74,124,89,.07) 0%,transparent 70%),
             radial-gradient(ellipse 40% 40% at 88% 15%,rgba(154,111,58,.05) 0%,transparent 70%)}
.nf-grid{position:relative;z-index:1;display:grid;grid-template-columns:1fr 380px;gap:0 40px;align-items:center}

.nf-badge{display:inline-flex;align-items:center;gap:8px;background:rgba(74,124,89,.08);
  border:1px solid rgba(74,124,89,.22);padding:7px 15px;border-radius:99px;font-size:11.4px;
  font-weight:700;color:var(--sage-d);letter-spacing:.1em;text-transform:uppercase;
  width:fit-content;margin-bottom:26px}
:root[data-theme="dark"] .nf-badge{color:var(--sage)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .nf-badge{color:var(--sage)}}
.nf-badge-dot{width:6px;height:6px;background:var(--sage-light);border-radius:50%;animation:nfBlink 2s infinite}
@keyframes nfBlink{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.3;transform:scale(.6)}}

.nf-num{font-family:var(--fd);font-size:clamp(92px,12vw,152px);font-weight:300;line-height:.88;
  letter-spacing:-5px;color:var(--ink);width:fit-content;margin-bottom:4px}
.nf-num em{font-style:italic;color:var(--sage)}
.nf-ann-t{font-family:var(--fh);font-size:16px;color:var(--gold);font-weight:500;
  transform:rotate(-3deg);transform-origin:left center;display:inline-block;margin-bottom:24px}

.nf-head{font-family:var(--fd);font-size:clamp(29px,3.8vw,52px);font-weight:300;line-height:1.1;
  letter-spacing:-.8px;color:var(--ink);margin-bottom:16px}
.nf-head strong{font-weight:700}
.nf-head em{font-style:italic;color:var(--sage)}

.nf-body{font-size:16.2px;color:var(--ink-3);line-height:1.82;max-width:430px;margin-bottom:26px}
.nf-quote{background:var(--sage-pale);border-left:3px solid var(--sage);padding:15px 19px;
  border-radius:0 var(--r-s) var(--r-s) 0;margin:0 0 30px;font-family:var(--fh);font-size:19px;
  color:var(--sage-d);line-height:1.45;max-width:430px}
:root[data-theme="dark"] .nf-quote{color:var(--sage)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .nf-quote{color:var(--sage)}}
.nf-btns{display:flex;gap:16px;flex-wrap:wrap;align-items:center;margin-bottom:26px}
.nf-help{font-size:14.8px;color:var(--ink-4);line-height:1.75;max-width:450px}
.nf-help a{color:var(--sage-d);text-decoration:underline;text-underline-offset:2px}
:root[data-theme="dark"] .nf-help a{color:var(--sage)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .nf-help a{color:var(--sage)}}

.nf-plant{display:flex;align-items:center;justify-content:center;padding:24px 0 24px 16px}
.nf-plant svg{display:block;width:100%;height:auto;max-width:340px}

.nf-stem{stroke-dasharray:280;stroke-dashoffset:280;animation:nfDraw 1.7s var(--ease-out) .65s forwards}
.nf-branch-h{stroke-dasharray:108;stroke-dashoffset:108;animation:nfDraw .9s var(--ease-out) 2.1s forwards}
.nf-branch-d{stroke-dasharray:110;stroke-dashoffset:110;animation:nfDraw 1s var(--ease-out) 2.95s forwards}
.nf-leaf{opacity:0;animation:nfPopL .5s var(--ease) forwards}
.nf-leaf-r{animation-name:nfPopR}
.nf-wilt{animation-duration:.55s;animation-timing-function:ease}
.nf-bud{opacity:0;animation:nfPopBud .7s var(--ease) 3.24s forwards}
.nf-sway{animation:nfSway 4s ease-in-out 4.3s infinite}
.nf-roots{opacity:0;animation:nfFadeIn .7s ease 4.4s forwards}
.nf-ann{opacity:0;animation:nfFadeIn .6s ease forwards}
@keyframes nfDraw{to{stroke-dashoffset:0}}
@keyframes nfFadeIn{to{opacity:1}}
@keyframes nfPopL{0%{opacity:0;transform:scale(0) rotate(20deg)}65%{transform:scale(1.12) rotate(-4deg)}100%{opacity:1;transform:scale(1) rotate(0)}}
@keyframes nfPopR{0%{opacity:0;transform:scale(0) rotate(-20deg)}65%{transform:scale(1.12) rotate(4deg)}100%{opacity:1;transform:scale(1) rotate(0)}}
@keyframes nfPopBud{0%{opacity:0;transform:scale(0) rotate(-12deg)}65%{transform:scale(1.18) rotate(6deg)}100%{opacity:1;transform:scale(1) rotate(0)}}
@keyframes nfSway{0%,100%{transform:rotate(0)}33%{transform:rotate(2.8deg)}67%{transform:rotate(-2.2deg)}}

@media(max-width:820px){
  .nf{padding:130px 0 60px}
  .nf-grid{grid-template-columns:1fr;gap:0}
  .nf-plant{order:2;padding:16px 0 8px;justify-content:flex-start}
  .nf-plant svg{max-width:min(300px,80vw)}
  .nf-num{font-size:clamp(80px,22vw,120px);letter-spacing:-4px}
  .nf-body,.nf-quote,.nf-help{max-width:100%}
  .nf-btns{flex-direction:column;align-items:flex-start;gap:12px}
}
@media(prefers-reduced-motion:reduce){
  .nf-stem,.nf-branch-h,.nf-branch-d{stroke-dashoffset:0;animation:none}
  .nf-leaf,.nf-bud,.nf-roots,.nf-ann{opacity:1;animation:none;transform:none}
  .nf-sway,.nf-badge-dot{animation:none}
}

/* the spelling note on the home page reviews section */
.sp-note{font-size:15px;color:var(--ink-4);line-height:1.75;max-width:660px;margin:14px auto 0;text-align:center}
.sp-note strong{color:var(--ink-3);font-weight:600}


/* ==========================================================================
   v3 HOME. Everything below overrides the kept v2 blocks above it where
   they share a selector, which is why this sits at the end of the file.
   ========================================================================== */

/* ---- hero v3. Words left, a layered arch figure right, and a slow drift of
   colour behind the whole thing. The figure parallaxes against the words. */
.hero{position:relative;overflow:clip;padding:178px 0 110px;background:var(--cream);min-height:100svh;display:flex;align-items:center}
.hero-wash{position:absolute;inset:-20%;pointer-events:none;z-index:0;
  background:
    radial-gradient(ellipse 30% 36% at 78% 30%,color-mix(in srgb, var(--sage-pale) 70%, transparent) 0%,transparent 70%),
    radial-gradient(ellipse 26% 30% at 12% 80%,color-mix(in srgb, var(--gold-pale) 80%, transparent) 0%,transparent 70%);
  animation:washdrift 22s ease-in-out infinite alternate}
@keyframes washdrift{from{transform:translate(0,0) rotate(0)}to{transform:translate(-3%,2%) rotate(3deg)}}
.hero-ghost{position:absolute;left:-2%;bottom:-2%;font-family:var(--fd);font-style:italic;font-size:clamp(120px,22vw,340px);line-height:1;
  color:transparent;-webkit-text-stroke:1px color-mix(in srgb, var(--ink) 9%, transparent);pointer-events:none;user-select:none;white-space:nowrap;z-index:0;letter-spacing:-.02em}
.hero-in{position:relative;z-index:2;max-width:var(--wrap);margin:0 auto;padding:0 var(--pad);display:grid;grid-template-columns:1.08fr .92fr;gap:72px;align-items:center;width:100%}
.hero-left{position:relative}
.hero-kick{display:inline-flex;align-items:center;gap:9px;background:color-mix(in srgb, var(--sage-pale) 75%, transparent);border:1px solid color-mix(in srgb, var(--sage) 30%, transparent);
  padding:9px 18px;border-radius:999px;font-size:13px;font-weight:700;color:var(--sage-d);letter-spacing:.1em;text-transform:uppercase;margin-bottom:30px}
.hero-kick i{width:7px;height:7px;border-radius:50%;background:var(--sage);font-style:normal;animation:ckpulse 2.4s infinite}
:root[data-theme="dark"] .hero-kick{color:var(--sage)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .hero-kick{color:var(--sage)}}
.hero-title{font-family:var(--fd);font-size:clamp(66px,7.4vw,118px);font-weight:400;line-height:.96;letter-spacing:-3px;margin-bottom:22px}
.hero-title em{font-style:italic;color:var(--sage);font-weight:400}
.hero-sub{font-family:var(--fd);font-size:clamp(24px,2.6vw,34px);font-weight:400;font-style:italic;color:var(--ink-3);margin-bottom:26px;line-height:1.35}
.hero-desc{font-size:19px;color:var(--ink-3);max-width:500px;line-height:1.85;margin-bottom:40px}
.hero-desc strong{color:var(--ink-2)}
.hero-btns{display:flex;align-items:center;gap:24px;flex-wrap:wrap}
.hero-creds{display:flex;gap:0;margin-top:52px;padding-top:32px;border-top:1px solid var(--border);flex-wrap:wrap}
.cred{display:flex;flex-direction:column;gap:4px;padding:6px 24px;border-left:1px solid var(--border)}
.cred:first-child{padding-left:0;border-left:0}
.cred-v{font-family:var(--fd);font-size:36px;font-weight:600;color:var(--ink);line-height:1;font-variant-numeric:tabular-nums}
.cred-l{font-size:12.8px;color:var(--ink-4);letter-spacing:.1em;text-transform:uppercase}

.hero-right{position:relative;z-index:2}
.hero-fig{position:relative;max-width:460px;margin:0 auto}
.hero-fig-img{border-radius:var(--r-arch);overflow:hidden;box-shadow:var(--sh-l);border:6px solid var(--card);background:var(--cream-2);position:relative;isolation:isolate}
.hero-fig-img img{width:100%;aspect-ratio:4/5.2;object-fit:cover;display:block;transform:scale(1.08);will-change:transform}
.hero-fig-img::after{content:'';position:absolute;inset:0;background:linear-gradient(to top,rgba(28,20,16,.22),transparent 45%);pointer-events:none}
.hero-portrait{position:absolute;left:-38px;bottom:118px;width:138px;height:138px;border-radius:50%;overflow:hidden;border:5px solid var(--card);
  box-shadow:var(--sh-m);background:var(--cream-2);animation:floaty 6s ease-in-out infinite}
@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
.hero-portrait img{width:100%;height:100%;object-fit:cover}
.hero-nameplate{position:absolute;left:50%;bottom:-36px;transform:translateX(-50%);width:max-content;max-width:104%;
  background:color-mix(in srgb, var(--card) 86%, transparent);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
  border:1px solid var(--border);border-radius:var(--r-m);padding:18px 32px;text-align:center;box-shadow:var(--sh-m)}
.dr-name{font-family:var(--fd);font-size:30px;font-weight:600;color:var(--ink);line-height:1.1;letter-spacing:-.3px}
.dr-role{font-size:13px;color:var(--ink-3);letter-spacing:.1em;text-transform:uppercase;margin-top:5px}
.hero-note{position:absolute;top:-16px;right:-10px;font-family:var(--fh);font-size:24px;color:var(--gold);transform:rotate(4deg);white-space:nowrap;z-index:3}
/* the slowly turning seal on the figure's shoulder */
.hero-seal{position:absolute;left:-48px;top:26px;width:124px;height:124px;z-index:3;pointer-events:none}
.hero-seal svg{width:100%;height:100%;animation:spin 26s linear infinite}
.hero-seal text{font-family:var(--fb);font-size:10.6px;font-weight:700;letter-spacing:.26em;text-transform:uppercase;fill:var(--sage-d)}
:root[data-theme="dark"] .hero-seal text{fill:var(--sage)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .hero-seal text{fill:var(--sage)}}
.hero-seal .seal-leaf{fill:var(--sage)}
@keyframes spin{to{transform:rotate(360deg)}}
.hero-tags{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-top:70px}
.htag{font-size:12.6px;font-weight:600;color:var(--ink-2);background:var(--card);border:1px solid var(--border);padding:9px 16px;border-radius:999px;letter-spacing:.05em;text-transform:uppercase;box-shadow:var(--sh-s)}
.hero-scroll{position:absolute;left:50%;bottom:22px;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:6px;
  font-size:11.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-4);z-index:2}
.hero-scroll i{display:block;width:1px;height:44px;background:linear-gradient(var(--sage),transparent);animation:drop 2.2s var(--ease-io) infinite;transform-origin:top}
@keyframes drop{0%{transform:scaleY(0);opacity:0}40%{transform:scaleY(1);opacity:1}100%{transform:scaleY(1) translateY(20px);opacity:0}}

@media(max-width:1100px){
  .hero{padding:150px 0 90px;min-height:0}
  .hero-in{grid-template-columns:1fr;gap:64px}
  .hero-fig{max-width:420px}
  .hero-ghost{display:none}
  .hero-scroll{display:none}
}
@media(max-width:600px){
  .hero{padding:118px 0 70px}
  .hero-in{padding:0 22px;gap:54px}
  .hero-title{font-size:clamp(58px,17.5vw,76px);letter-spacing:-2px}
  .hero-desc{font-size:17.6px}
  .hero-fig{max-width:320px}
  .hero-portrait{left:-10px;width:104px;height:104px;bottom:98px}
  .hero-nameplate{padding:15px 22px}
  .dr-name{font-size:24px}
  .hero-seal{left:-10px;top:-24px;width:92px;height:92px}
  .hero-kick{font-size:11.4px;padding:8px 14px;letter-spacing:.08em}
  .cred{padding:0 16px}
  .cred:first-child{padding-left:0}
  .cred-v{font-size:30px}
  .hero-tags{margin-top:60px}
  .hero-btns{gap:18px}
}

/* ---- scrolling marquee, tilted a touch on the deep green ---- */
.marquee{background:var(--deep);padding:20px 0;overflow:hidden;position:relative;z-index:3;
  transform:rotate(-1.4deg) scale(1.04);margin:-14px 0 10px;box-shadow:0 20px 50px rgba(15,35,24,.25)}
.m-track{display:flex;animation:mscroll 40s linear infinite;white-space:nowrap;will-change:transform}
.marquee:hover .m-track{animation-play-state:paused}
@keyframes mscroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.m-item{font-family:var(--fd);font-size:23.5px;font-style:italic;color:rgba(255,255,255,.82);padding:0 34px;flex-shrink:0}
.m-item.ac{color:var(--sage-light)}
@media(prefers-reduced-motion:reduce){.m-track{animation:none;white-space:normal;flex-wrap:wrap;justify-content:center}}

/* ---- philosophy v3: the method as a plant that grows while you read ----
   Left column is sticky on desktop and holds the quote plus the plant.
   Right column holds the three step cards. As each card crosses the middle
   of the screen, site.js moves the plant to that stage: roots, stem,
   leaves. Under 900px the plant sits above the cards and simply plays
   through as the cards scroll by. */
.phil-grid{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:start;margin-top:64px}
.phil-l{position:sticky;top:110px}
.phil-qblock{background:linear-gradient(150deg,var(--sage-d),var(--sage) 90%);padding:44px 42px;border-radius:var(--r-m);position:relative;overflow:hidden;box-shadow:var(--sh-m)}
.phil-qblock::after{content:'\201C';position:absolute;top:-30px;right:8px;font-family:var(--fd);font-size:220px;line-height:1;color:rgba(255,255,255,.1);pointer-events:none}
.phil-q{font-family:var(--fd);font-size:clamp(24px,2.3vw,34px);font-weight:400;font-style:italic;color:#fff;line-height:1.45;margin-bottom:14px;position:relative}
.phil-attr{font-size:14.2px;color:rgba(255,255,255,.7);letter-spacing:.08em;text-transform:uppercase;position:relative}

/* the growing plant */
.grow{position:relative;margin-top:22px;background:var(--card);border:1px solid var(--border);border-radius:var(--r-m);padding:22px 22px 0;box-shadow:var(--sh-s);overflow:hidden}
.grow-cap{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:4px}
.grow-cap .lbl{font-size:11.8px}
.grow-stage{font-family:var(--fh);font-size:23px;color:var(--gold);transition:opacity .4s}
.grow svg{display:block;width:100%;height:auto;max-height:330px;margin:0 auto}
.grow .soil{fill:var(--cream-2)}
.grow .soil-line{stroke:var(--border-2)}
.grow .root{stroke:var(--gold);stroke-width:3;fill:none;stroke-linecap:round;stroke-dasharray:1000;stroke-dashoffset:1000;transition:stroke-dashoffset 1.6s var(--ease-io)}
.grow .root.fine{stroke-width:2;opacity:.8}
.grow .stem{stroke:var(--sage);stroke-width:6;fill:none;stroke-linecap:round;stroke-dasharray:400;stroke-dashoffset:400;transition:stroke-dashoffset 1.4s var(--ease-io) .1s}
.grow .leaf{fill:var(--sage);transform-origin:var(--ox) var(--oy);transform:scale(0) rotate(-12deg);transition:transform .9s var(--ease)}
.grow .leaf.r{transform:scale(0) rotate(12deg)}
.grow .seed{fill:var(--gold);transition:transform .8s var(--ease-out),opacity .6s}
.grow.s1 .root,.grow.s2 .root,.grow.s3 .root{stroke-dashoffset:0}
.grow.s2 .stem,.grow.s3 .stem{stroke-dashoffset:0}
.grow.s3 .leaf{transform:scale(1) rotate(0)}
.grow.s3 .leaf:nth-of-type(1){transition-delay:.1s}
.grow.s3 .leaf:nth-of-type(2){transition-delay:.25s}
.grow.s3 .leaf:nth-of-type(3){transition-delay:.4s}
.grow.s3 .leaf:nth-of-type(4){transition-delay:.55s}
.grow.s2 .seed,.grow.s3 .seed{opacity:.45}

.phil-cards{display:flex;flex-direction:column;gap:16px}
.phil-card{background:var(--card);border:1px solid var(--border);border-radius:var(--r-m);padding:30px 30px 30px 28px;display:flex;align-items:flex-start;gap:20px;
  box-shadow:var(--sh-s);transition:background .4s,border-color .4s,transform .5s var(--ease-out),box-shadow .4s;position:relative;min-height:190px}
.phil-card::before{content:attr(data-n);position:absolute;right:22px;top:14px;font-family:var(--fd);font-size:64px;font-weight:300;line-height:1;color:var(--border-2);transition:color .4s}
.phil-card.on,.phil-card:hover{border-color:var(--sage-light);box-shadow:var(--sh-m);transform:translateX(6px)}
.phil-card.on::before{color:var(--sage-light)}
.pci{width:50px;height:50px;background:var(--sage-pale);border-radius:16px;display:flex;align-items:center;justify-content:center;font-size:24px;flex-shrink:0;transition:transform .5s var(--ease)}
.phil-card.on .pci{transform:scale(1.1) rotate(-6deg)}
.pct{font-family:var(--fd);font-size:27px;font-weight:600;color:var(--ink);margin-bottom:6px;line-height:1.15}
.pcd{font-size:16.6px;color:var(--ink-3);line-height:1.7}
.phil-cards .med-note{margin:4px 0 0}

.phil-row2{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:64px}
.enemy{background:var(--gold-pale);border:1px solid color-mix(in srgb, var(--gold) 25%, transparent);padding:36px 34px;border-radius:var(--r-m);position:relative;overflow:hidden}
.enemy::after{content:'';position:absolute;right:-60px;bottom:-60px;width:200px;height:200px;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb, var(--gold) 18%, transparent),transparent 70%)}
.enemy-lbl{font-family:var(--fh);font-size:24px;color:var(--gold);margin-bottom:6px}
.enemy-ttl{font-family:var(--fd);font-size:30px;font-weight:600;color:var(--ink);margin-bottom:18px;line-height:1.15}
.enemy-li{font-size:16.4px;color:var(--ink-3);display:flex;align-items:flex-start;gap:12px;line-height:1.55;margin-bottom:11px;position:relative}
.enemy-li::before{content:'\2715';color:var(--terracotta);font-weight:700;font-size:12.6px;flex-shrink:0;margin-top:6px}
.formula{background:var(--deep);padding:36px 34px;border-radius:var(--r-m);box-shadow:var(--sh-m);position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:center}
.formula::before{content:'';position:absolute;top:-120px;right:-120px;width:320px;height:320px;background:radial-gradient(circle,rgba(122,171,136,.2),transparent 70%)}
.formula-lbl{font-family:var(--fh);font-size:24px;color:var(--sage-light);margin-bottom:18px;position:relative}
.formula-row{display:flex;flex-direction:column;gap:10px;margin-bottom:16px;position:relative}
.fstep{font-family:var(--fd);font-size:27px;font-style:italic;color:rgba(255,255,255,.94);display:flex;align-items:center;gap:14px;line-height:1.2}
.fstep::before{content:counter(f);counter-increment:f;font-family:var(--fb);font-style:normal;font-size:12px;font-weight:700;letter-spacing:.1em;
  width:30px;height:30px;border-radius:50%;border:1px solid rgba(122,171,136,.5);color:var(--sage-light);display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}
.formula-row{counter-reset:f}
.farr{display:none}
.fwout{font-size:16px;color:rgba(255,255,255,.5);font-style:italic;position:relative}
@media(max-width:900px){
  .phil-grid{grid-template-columns:1fr;gap:28px}
  .phil-l{position:static}
  .phil-row2{grid-template-columns:1fr;margin-top:28px}
  .phil-card{min-height:0}
  .grow svg{max-height:260px}
}

/* ---- story timeline v3: the line draws itself as you come down it ---- */
.story-list{position:relative;padding-left:34px;margin-top:56px;--prog:0}
.story-list::before{content:'';position:absolute;left:0;top:8px;bottom:8px;width:2px;background:var(--border-2);border-radius:2px}
.story-list::after{content:'';position:absolute;left:0;top:8px;height:calc((100% - 16px) * var(--prog));width:2px;background:linear-gradient(to bottom,var(--sage-light),var(--sage));border-radius:2px;transition:height .2s linear}
.se{position:relative;padding:0 0 58px 42px}
.se:last-child{padding-bottom:8px}
.se::before{content:'';position:absolute;left:-42px;top:10px;width:18px;height:18px;border-radius:50%;background:var(--card);border:2px solid var(--border-2);z-index:1;transition:background .5s,box-shadow .5s,border-color .5s}
.se.vis::before{background:var(--sage);border-color:var(--sage);box-shadow:0 0 0 6px color-mix(in srgb, var(--sage) 15%, transparent)}
.se-meta{display:flex;align-items:center;gap:10px;margin-bottom:10px;flex-wrap:wrap}
.se-phase{font-size:12.6px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--sage-d);background:var(--sage-pale);padding:5px 13px;border-radius:999px}
:root[data-theme="dark"] .se-phase{color:var(--sage)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .se-phase{color:var(--sage)}}
.se-era{font-size:12.6px;font-weight:600;color:var(--ink-4);letter-spacing:.07em;text-transform:uppercase}
.se-title{font-family:var(--fd);font-size:clamp(25px,3.4vw,36px);font-weight:600;color:var(--ink);line-height:1.18;margin-bottom:10px}
.se-desc{font-size:18.4px;color:var(--ink-3);line-height:1.8;max-width:680px}
.se-aside{font-family:var(--fh);font-size:23px;color:var(--gold);margin-top:10px;opacity:.9;transform:rotate(-1deg);width:fit-content}
.story .wrap{display:grid;grid-template-columns:.8fr 1.2fr;gap:64px;align-items:start}
.story-head{position:sticky;top:120px}
.story-head .lede{margin-top:6px}
@media(max-width:900px){.story .wrap{grid-template-columns:1fr;gap:8px}.story-head{position:static}}

/* ---- competency cards v3 ---- */
.comp-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:64px}
.cc{background:var(--card);border:1px solid var(--border);border-radius:var(--r-m);padding:36px 30px;position:relative;display:block;overflow:hidden;
  transition:transform .5s var(--ease-out),box-shadow .5s,border-color .4s;box-shadow:var(--sh-s);--mx:50%;--my:50%}
.cc::before{content:'';position:absolute;inset:0;background:radial-gradient(260px circle at var(--mx) var(--my),color-mix(in srgb, var(--sage-pale) 70%, transparent),transparent 60%);opacity:0;transition:opacity .4s;pointer-events:none}
.cc:hover{transform:translateY(-6px);box-shadow:var(--sh-m);border-color:var(--sage-light)}
.cc:hover::before{opacity:1}
.cc>*{position:relative}
.cc-ico{width:58px;height:58px;background:var(--sage-pale);border-radius:18px;display:flex;align-items:center;justify-content:center;font-size:27px;margin-bottom:20px;transition:transform .5s var(--ease)}
.cc:hover .cc-ico{transform:scale(1.08) rotate(-5deg)}
.cc-t{font-family:var(--fd);font-size:27px;font-weight:600;color:var(--ink);margin-bottom:8px;line-height:1.2}
.cc-d{font-size:16.2px;color:var(--ink-3);line-height:1.7}
.cc-tag{display:inline-block;margin-top:16px;font-size:12.4px;font-weight:700;color:var(--sage-d);background:var(--sage-pale);padding:5px 13px;border-radius:999px;letter-spacing:.08em;text-transform:uppercase}
:root[data-theme="dark"] .cc-tag{color:var(--sage)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .cc-tag{color:var(--sage)}}
.cc.has-img{padding-top:0;padding-left:0;padding-right:0}
.cc.has-img .cc-t,.cc.has-img .cc-d{padding:0 28px}
.cc.has-img .cc-t{margin-top:20px}
.cc.has-img .cc-tag{margin-left:28px;margin-bottom:6px}
.cc-img{display:block;aspect-ratio:16/9;overflow:hidden;background:var(--cream-2)}
.cc-img img{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease-out)}
.cc.has-img:hover .cc-img img{transform:scale(1.06)}

/* ---- treatment areas v3: an image bento on the deep band. On a phone it
   becomes a swipe row with scroll snapping, the native smooth kind. ---- */
.treat{overflow:clip}
.treat-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:18px;margin-top:64px}
.tc{position:relative;display:block;border-radius:var(--r-m);overflow:hidden;background:var(--deep-2);min-height:300px;grid-column:span 4;
  transition:transform .5s var(--ease-out),box-shadow .5s;box-shadow:0 10px 30px rgba(0,0,0,.25);isolation:isolate}
.tc:nth-child(1),.tc:nth-child(6){grid-column:span 8;min-height:360px}
.tc:hover{transform:translateY(-6px);box-shadow:0 26px 60px rgba(0,0,0,.4)}
.tc-img{position:absolute;inset:0;z-index:0}
.tc-img img{width:100%;height:100%;object-fit:cover;transition:transform 1.1s var(--ease-out),filter .6s;filter:saturate(.9)}
.tc:hover .tc-img img{transform:scale(1.07);filter:saturate(1)}
.tc-img::after{content:'';position:absolute;inset:0;background:linear-gradient(to top,rgba(10,24,16,.92) 0%,rgba(10,24,16,.45) 45%,rgba(10,24,16,.05) 100%);transition:opacity .5s}
.tc-pad{position:absolute;left:0;right:0;bottom:0;padding:28px 28px 26px;z-index:1;display:block}
.tc-ico{font-size:29px;margin-bottom:12px;display:block}
.tc-n{font-family:var(--fd);font-size:30px;font-weight:600;color:#fff;margin-bottom:6px;line-height:1.15}
.tc-d{font-size:15.4px;color:rgba(255,255,255,.72);line-height:1.6;max-width:420px}
.tc-more{display:inline-flex;align-items:center;gap:8px;margin-top:14px;font-size:13.2px;font-weight:700;color:var(--sage-light);letter-spacing:.07em;text-transform:uppercase;
  transform:translateY(6px);opacity:.7;transition:transform .4s var(--ease-out),opacity .4s}
.tc:hover .tc-more{transform:none;opacity:1}
.tc-num{position:absolute;top:18px;left:22px;z-index:1;font-family:var(--fd);font-size:15px;font-weight:600;letter-spacing:.1em;color:rgba(255,255,255,.7);
  background:rgba(10,24,16,.45);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);padding:6px 12px;border-radius:999px;border:1px solid rgba(255,255,255,.14)}
.treat-more{margin-top:40px}
.treat-more .btn-g{color:var(--sage-light);border-bottom-color:var(--sage-light)}
.treat-hint{display:none;font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.45);margin-top:6px}
@media(max-width:900px){
  .treat-grid{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding:0 var(--pad) 18px;margin:52px calc(-1 * var(--pad)) 0;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .treat-grid::-webkit-scrollbar{display:none}
  .tc,.tc:nth-child(1),.tc:nth-child(6){flex:0 0 min(78vw,340px);min-height:400px;scroll-snap-align:start}
  .tc-more{transform:none;opacity:1}
  .treat-hint{display:block}
  .comp-grid{grid-template-columns:1fr}
}
@media(max-width:600px){
  .treat-grid{padding:0 22px 18px;margin:44px -22px 0}
  .tc-pad{padding:22px 22px 22px}
}

/* ---- checker teaser cards get a little lift on the home page ---- */
.checker{padding:130px 0}
.ck-title{font-size:clamp(44px,5.4vw,76px)}
.cg-card{padding:30px 16px}

/* ---- proof / credentials v3 ---- */
.proof-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:64px;margin-top:64px;align-items:start}
.proof-l{position:sticky;top:120px}
.proof-quote{font-family:var(--fd);font-size:clamp(30px,3.6vw,52px);font-weight:400;font-style:italic;color:var(--ink);line-height:1.3;padding-bottom:28px;border-bottom:1px solid var(--border);margin-bottom:18px}
.proof-quote em{color:var(--sage)}
.proof-src{font-size:16px;color:var(--ink-4);letter-spacing:.3px}
.proof-r{display:flex;flex-direction:column;gap:14px}
.pi{background:var(--card);border:1px solid var(--border);border-radius:var(--r-m);padding:24px 26px;display:flex;align-items:flex-start;gap:18px;transition:transform .4s var(--ease-out),box-shadow .4s,border-color .4s;box-shadow:var(--sh-s)}
.pi:hover{transform:translateX(6px);box-shadow:var(--sh-m);border-color:var(--sage-light)}
.pi-ico{width:46px;height:46px;background:var(--sage-pale);border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:21px;flex-shrink:0}
.pi-t{font-family:var(--fd);font-size:23px;font-weight:600;color:var(--ink);margin-bottom:3px}
.pi-d{font-size:15.4px;color:var(--ink-3);line-height:1.65}
@media(max-width:900px){.proof-grid{grid-template-columns:1fr;gap:34px}.proof-l{position:static}}

/* ---- the verified Google rating panel v3 ---- */
.rev-hold{background:var(--card);border:1px solid var(--border);border-radius:var(--r-l);padding:52px 40px;text-align:center;margin-top:44px;box-shadow:var(--sh-m);position:relative;overflow:hidden}
.rev-hold::before{content:'';position:absolute;top:-160px;left:50%;transform:translateX(-50%);width:700px;height:320px;background:radial-gradient(ellipse,color-mix(in srgb, var(--sage-pale) 80%, transparent),transparent 70%);pointer-events:none}
.rev-hold>*{position:relative}
.g-rate{display:flex;align-items:baseline;justify-content:center;gap:14px;flex-wrap:wrap;margin-bottom:18px}
.g-rate-n{font-family:var(--fd);font-size:clamp(64px,8vw,104px);font-weight:500;color:var(--ink);line-height:1;letter-spacing:-2px}
.g-rate-stars{font-size:26px;color:var(--gold);letter-spacing:3px}
.g-rate-c{font-size:17px;color:var(--ink-3)}
.rev-hold-d{font-size:17.4px;color:var(--ink-3);line-height:1.75;max-width:600px;margin:0 auto 28px}
.rev-hold-note{font-size:13.8px;color:var(--ink-4);margin-top:16px}
.gmap-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:24px;margin-top:24px;align-items:stretch}
.gmap-embed{background:var(--card);border:1px solid var(--border-2);border-radius:var(--r-l);overflow:hidden;min-height:320px;box-shadow:var(--sh-m)}
.gmap-embed iframe{width:100%;height:100%;border:0;display:block;min-height:360px;filter:saturate(.85)}
.gmap-info{display:grid;grid-template-rows:repeat(3,1fr);gap:14px}
.gmap-info-card{background:linear-gradient(145deg,var(--sage-d),var(--sage));border-radius:var(--r-m);padding:22px;text-align:center;box-shadow:var(--sh-s);transition:transform .4s var(--ease-out);display:flex;flex-direction:column;justify-content:center}
.gmap-info-card:hover{transform:translateY(-4px)}
.gmap-info-ico{font-size:24px;margin-bottom:6px}
.gmap-info-val{font-family:var(--fd);font-size:28px;font-weight:600;color:#fff;line-height:1}
.gmap-info-lbl{font-size:13px;color:rgba(255,255,255,.78);letter-spacing:.06em;text-transform:uppercase;margin-top:4px}
.sp-note{font-size:15.4px;color:var(--ink-4);line-height:1.75;max-width:680px;margin:14px 0 0;text-align:left}
.sp-note strong{color:var(--ink-3);font-weight:600}
@media(max-width:900px){.gmap-grid{grid-template-columns:1fr}.gmap-info{grid-template-rows:none;grid-template-columns:repeat(3,1fr)}}
@media(max-width:600px){
  .rev-hold{padding:38px 22px}
  .g-rate{gap:6px 12px}
  .g-rate-stars{font-size:20px;letter-spacing:2px}
  .g-rate-c{flex-basis:100%}
  .gmap-info{grid-template-columns:1fr}
}

/* ---- who and where: the plain facts, with the clinic doorway beside them ---- */
.about-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:64px;align-items:center}
.about-fig{position:relative}
.about-fig img{width:100%;aspect-ratio:4/4.8;object-fit:cover;border-radius:var(--r-arch);border:6px solid var(--card);box-shadow:var(--sh-l)}
.about-fig .hand{position:absolute;right:4px;top:-22px;font-size:25px;color:var(--gold);transform:rotate(4deg)}
.about-card{position:absolute;left:-26px;bottom:34px;background:var(--card);border:1px solid var(--border);border-radius:var(--r-m);padding:16px 20px;box-shadow:var(--sh-m);max-width:260px}
.about-card b{display:block;font-family:var(--fd);font-size:22px;color:var(--ink);line-height:1.15}
.about-card span{font-size:13.5px;color:var(--ink-3);line-height:1.5;display:block;margin-top:4px}
@media(max-width:900px){
  .about-grid{grid-template-columns:1fr;gap:40px}
  .about-fig{max-width:400px}
  .about-card{left:0;bottom:-10px}
}

/* ---- big closing CTA v3, the roots photograph under deep green ---- */
.cta{padding:170px 0;background:var(--deep);text-align:center;color:#fff;position:relative;overflow:clip;isolation:isolate}
.cta-bg{position:absolute;inset:-12% 0;z-index:0;pointer-events:none}
.cta-bg img{width:100%;height:100%;object-fit:cover;opacity:.34;filter:saturate(.7);will-change:transform}
.cta-bg::after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 70% 70% at 50% 50%,rgba(15,35,24,.25),rgba(15,35,24,.92))}
.cta-in{max-width:760px;margin:0 auto;padding:0 var(--pad);position:relative;z-index:2}
.cta-lbl{font-family:var(--fh);font-size:27px;color:var(--sage-light);margin-bottom:16px}
.cta-title{font-family:var(--fd);font-size:clamp(48px,6.2vw,96px);font-weight:300;font-style:italic;color:#fff;line-height:1.04;letter-spacing:-1.5px;margin-bottom:26px}
.cta-title strong{font-weight:700;font-style:normal}
.cta-sub{font-size:18.6px;color:rgba(255,255,255,.74);line-height:1.8;margin-bottom:42px}
.cta-btn{display:inline-flex;align-items:center;gap:10px;font-size:15.4px;font-weight:700;color:var(--deep);background:#fff;padding:20px 46px;border-radius:999px;letter-spacing:.07em;text-transform:uppercase;margin-bottom:22px;transition:transform .3s var(--ease-out),box-shadow .3s}
.cta-btn:hover{transform:translateY(-3px);box-shadow:0 18px 44px rgba(0,0,0,.35)}
.cta-trust{font-size:13.4px;color:rgba(255,255,255,.48);letter-spacing:.16em;text-transform:uppercase}
@media(max-width:600px){.cta{padding:110px 0}}

/* ==========================================================================
   INNER PAGE HERO v3. Bigger, with the arch image and a soft wash.
   ========================================================================== */
.tp-hero{padding:176px 0 80px;background:var(--cream-2);position:relative;overflow:clip}
.tp-hero::before{content:'';position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse 40% 60% at 92% 10%,color-mix(in srgb, var(--sage-pale) 55%, transparent) 0%,transparent 70%),
             radial-gradient(ellipse 30% 40% at 4% 100%,color-mix(in srgb, var(--gold-pale) 70%, transparent) 0%,transparent 70%)}
.tp-hero .wrap{position:relative}
.tp-crumb{font-size:14.4px;color:var(--ink-4);margin-bottom:20px;display:flex;flex-wrap:wrap;gap:4px 8px;align-items:center}
.tp-crumb a{color:var(--sage-d)}
.tp-ico{font-size:48px;display:block;margin-bottom:16px}
.tp-title{font-family:var(--fd);font-size:clamp(44px,5.6vw,86px);font-weight:400;line-height:1.02;letter-spacing:-2px;margin-bottom:20px;text-wrap:balance}
.tp-title em{font-style:italic;color:var(--sage)}
.tp-lede{font-size:20.5px;color:var(--ink-3);max-width:700px;line-height:1.8}
.tp-hero.has-media .wrap{display:grid;grid-template-columns:1.15fr .85fr;gap:64px;align-items:center}
.tp-media{border-radius:var(--r-arch);overflow:hidden;border:6px solid var(--card);box-shadow:var(--sh-l);background:var(--cream);max-width:420px;justify-self:end;position:relative}
.tp-media img{width:100%;aspect-ratio:4/4.6;object-fit:cover;display:block;transform:scale(1.06);will-change:transform}
@media(max-width:900px){
  .tp-hero.has-media .wrap{grid-template-columns:1fr;gap:40px}
  .tp-media{justify-self:start;max-width:340px}
}
@media(max-width:600px){.tp-hero{padding:128px 0 54px}}
.tp-body h2{font-size:clamp(32px,3.6vw,48px)}

/* the article hero keeps the image smaller, it is a companion not a cover */
.g-art .tp-hero.has-media .wrap{grid-template-columns:1.3fr .7fr}
.g-art .tp-media{max-width:360px}
.g-art .tp-title{font-size:clamp(36px,4.2vw,64px);letter-spacing:-1.2px}
.g-art .tp-media img{aspect-ratio:4/4.2}
@media(max-width:900px){.g-art .tp-hero.has-media .wrap{grid-template-columns:1fr}}

/* ==========================================================================
   FOOTER v3, with the builder credit and a giant whispered tagline.
   ========================================================================== */
.footer{background:var(--panel-2);padding:90px 40px 40px;color:rgba(255,255,255,.7);position:relative;overflow:clip}
.footer::before{content:'';position:absolute;top:-160px;left:50%;transform:translateX(-50%);width:900px;height:320px;background:radial-gradient(ellipse,rgba(74,124,89,.16),transparent 70%);pointer-events:none}
.f-ghost{position:absolute;left:50%;bottom:-6%;transform:translateX(-50%);white-space:nowrap;font-family:var(--fd);font-style:italic;font-size:clamp(80px,13vw,220px);line-height:1;
  color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.06);pointer-events:none;user-select:none;letter-spacing:-.02em}
.footer-in{max-width:var(--wrap);margin:0 auto;display:grid;grid-template-columns:1.6fr 1fr 1fr;gap:48px;align-items:start;position:relative}
.footer-in>*{min-width:0}
.f-logo{font-family:var(--fd);font-size:40px;font-weight:600;color:#fff;letter-spacing:-.5px}
.f-tag{font-family:var(--fh);font-size:24px;color:var(--sage-light);margin-top:4px}
.f-links{display:flex;flex-direction:column;gap:12px;align-items:flex-start}
.f-link{font-size:16px;color:rgba(255,255,255,.55);transition:color .3s,transform .3s}
.f-link:hover{color:var(--sage-light);transform:translateX(4px)}
.f-copy{font-size:13.8px;color:rgba(255,255,255,.34);line-height:1.7}
.f-contact{font-style:normal;margin-top:24px;display:flex;flex-direction:column;gap:13px}
.f-addr,.f-tel{display:flex;align-items:flex-start;gap:11px;font-size:15.6px;line-height:1.65;color:rgba(255,255,255,.58);transition:color .3s}
.f-addr:hover,.f-tel:hover{color:var(--sage-light)}
.f-ico{flex:none;opacity:.75;font-size:14px;line-height:1.7}
.f-addr-go{display:block;font-size:13.8px;color:var(--sage-light);margin-top:4px}
.f-tel{font-weight:600;letter-spacing:.2px}
.f-hours{font-size:15.6px}
.f-hd{font-size:12.6px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--sage-light);margin-bottom:14px}
.f-hr{display:flex;flex-direction:column;margin-bottom:11px;line-height:1.5}
.f-hr-d{font-size:15px;color:rgba(255,255,255,.78);font-weight:600}
.f-hr-t{font-size:14.6px;color:rgba(255,255,255,.45)}
.f-legal{margin-top:48px;padding-top:24px;border-top:1px solid rgba(255,255,255,.09);max-width:var(--wrap);margin-inline:auto;font-size:14.2px;line-height:1.75;color:rgba(255,255,255,.36);position:relative}
.f-legal strong{color:rgba(255,255,255,.55)}
.f-bar{max-width:var(--wrap);margin:26px auto 0;padding-top:20px;border-top:1px solid rgba(255,255,255,.09);display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;position:relative}
.f-built{font-size:14.2px;color:rgba(255,255,255,.42)}
.f-built a{color:rgba(255,255,255,.7);font-weight:600;border-bottom:1px solid rgba(255,255,255,.25);transition:color .3s,border-color .3s}
.f-built a:hover{color:var(--sage-light);border-bottom-color:var(--sage-light)}
@media(max-width:940px){
  .footer{padding:60px 26px 34px}
  .footer-in{grid-template-columns:1fr 1fr;gap:34px;text-align:left}
}
@media(max-width:600px){
  .footer{padding:52px 24px 100px}
  .footer-in{grid-template-columns:1fr;gap:30px}
  .f-logo{font-size:32px}
  .f-links{flex-direction:row;flex-wrap:wrap;gap:10px 20px}
  .f-bar{flex-direction:column;align-items:flex-start;gap:8px}
  .f-ghost{display:none}
}

/* ==========================================================================
   BOOKING v3 polish
   ========================================================================== */
.book{background:var(--cream-2)}
.book-in{max-width:760px;margin:0 auto;padding:0 var(--pad)}
.book-hdr{text-align:center;margin-bottom:44px}
.book-hdr .sl{margin-inline:auto;transform:rotate(-1.2deg)}
.book-fee{margin:16px auto 0;text-align:center;font-size:16.6px;color:var(--ink-2)}
.book-fee strong{font-weight:700;color:var(--ink)}
.book-trust{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin-top:28px}
.bt{font-size:14.8px;color:var(--ink-3);background:var(--card);border:1px solid var(--border);padding:9px 18px;border-radius:999px;box-shadow:var(--sh-s)}
.bt::before{content:'\2713  ';color:var(--sage);font-weight:700}
.book-img{aspect-ratio:16/5;overflow:hidden;background:var(--cream-2);position:relative}
.book-img img{width:100%;height:100%;object-fit:cover;transform:scale(1.05);will-change:transform}
@media(max-width:600px){.book-in{padding:0 14px}.book-img{aspect-ratio:16/7}}

/* ==========================================================================
   RESPONSIVE BASE AND MOTION PREFERENCES. Checked at a true 375px.
   ========================================================================== */
@media(max-width:900px){
  .sec{padding:90px 0}
  :root{--pad:30px}
}
@media(max-width:600px){
  body{font-size:18.2px}
  :root{--pad:22px}
  .sec{padding:72px 0}
  .sh{font-size:clamp(38px,10.5vw,52px);letter-spacing:-1px}
  .sl{font-size:25px}
}
@media(prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .rv,.rv-clip,.split .w i{opacity:1;transform:none;filter:none;clip-path:none}
  .grow .root,.grow .stem{stroke-dashoffset:0}
  .grow .leaf{transform:none}
  .nav.hide{transform:translate(-50%,0)}
}
