/* ==========================================================================
   CURRENT Facial Plastic Surgery: supporting pages
   Used by home, facelift-necklift, gallery, pricing, dr-novis and consultation.
   (index.html is the approved homepage and the public build's source; it
   still uses css/selected-homepage.css. home.html is its copy on this sheet.)

   CONTENTS
    1. Type: fonts, sizes, weights   <- adjust text here
    2. Colors & effects
    3. Base
    4. Typography
    5. Buttons
    6. Header & mobile menu
    7. Page layout & scroll reveal
    8. Shared components: hero, cards, splits, FAQ, footer
    9. Home page
   10. Gallery page
   11. Pricing page
   12. Dr. Novis page
   13. Consultation page
   14. The CURRENT Lift page
   15. Responsive (header 1100px, tablet 1020px, small tablet 880px, phone 720/560px)
   16. Print & reduced motion
   17. Demo theme switcher
   ========================================================================== */


/* ==========================================================================
   1. TYPE
   The fonts are loaded in each page's <head> from Google Fonts as variable
   fonts, so any weight inside the loaded range works (Jost 300–600,
   Cormorant Garamond 300–700), e.g. --weight-body:350 or 400.
   Sizes use rem (1rem = 16px). clamp(phone, scaling, desktop max).
   ========================================================================== */
:root{
  --font-display:'Cormorant Garamond',Georgia,serif;  /* headings, numbers, prices */
  --font-body:'Jost',system-ui,sans-serif;            /* paragraphs, labels, buttons */

  /* Weights */
  --weight-body:350;          /* all running text (was 300) */
  --weight-medium:500;        /* labels, buttons, bold words */
  --weight-display:500;       /* h1–h3 */
  --weight-display-bold:600;  /* small serif titles, numbers, prices */

  /* Headings */
  --fs-h1:clamp(2.9rem,6.4vw,5.3rem);       /* Lift page hero headline */
  --fs-h1-page:clamp(2.6rem,5.4vw,4.4rem);  /* Gallery, Pricing, Dr. Novis, Consultation titles */
  --fs-h2:clamp(2.2rem,4.4vw,3.5rem);       /* section headings */
  --fs-h3:clamp(1.35rem,2.2vw,1.8rem);      /* card headings */
  --fs-title:1.3rem;                        /* small serif titles: FAQ questions, checklist groups, steps */
  --fs-quote:clamp(1.6rem,3.4vw,2.6rem);    /* pull quotes */
  --fs-number:2rem;                         /* stats, totals, countdown, step numbers */

  /* Running text */
  --fs-lead:clamp(1.02rem,1.4vw,1.16rem);   /* intro paragraphs under headings */
  --fs-text:1rem;                           /* card, FAQ and panel paragraphs */
  --fs-text-sm:.92rem;                      /* lists, checklists, table cells, footer links */
  --fs-small:.82rem;                        /* notes, captions, fine print */

  /* Uppercase UI text */
  --fs-ui:.74rem;                           /* nav links and buttons */
  --fs-label:.66rem;                        /* small labels: table headers, stat captions, tags */
  --fs-label-sm:.6rem;                      /* tightest labels: badges, chart axis */

  --line-body:1.65;
}


/* ==========================================================================
   2. COLORS & EFFECTS
   Three themes share these names. "Current" is the default; the other two
   only change values. Switch with T on any page (see js/theme.js).
   ========================================================================== */
:root{
  --ink:#15181a; --ink2:#22272a; --ink3:#2e3438;   /* text, dark sections, dark panels */
  --bone:#f4f1ea; --bone2:#eae5da; --paper:#fbfaf7; /* page, alternate sections, cards */
  --brass:#9a7b4f; --brass2:#b3925f;                 /* accent; accent on dark */
  --sage:#475671; --sage2:#5a6b85;                   /* slate-blue bands */
  --line:#d9d3c6; --line-d:#3a4045;                  /* rules on light; rules on dark */
  --muted:#6d6a63; --muted-d:#a8a49b;                /* secondary text on light; on dark */
  --shadow:0 18px 44px rgba(21,24,26,.12);
  --shadow-s:0 8px 22px rgba(21,24,26,.10);
}

/* Light: the same palette, but the black sections turn light.
   Footer stays dark. */
:root[data-theme="light"] .dark{
  --ink:#eae5da; --ink2:#fbfaf7; --ink3:#f4f1ea;
  --bone:#15181a;
  --brass2:#9a7b4f;
  --line-d:#d9d3c6;
  --muted-d:#6d6a63;
}
:root[data-theme="light"] .dark .btn.brass{color:#fbfaf7}

/* Blue & white: CURRENT's own brand colors, from the live site's palette
   (navy #192a3d, royal blue #04448B, sky blue #98c1d9, slate #475671). */
:root[data-theme="blue"]{
  --ink:#192a3d; --ink2:#22374f; --ink3:#10203a;
  --bone:#fbfbfc; --bone2:#f3f4f7; --paper:#ffffff;
  --brass:#04448b; --brass2:#98c1d9;
  --line:#e2e5ec; --line-d:#30445c;
  --muted:#5b6577; --muted-d:#aebbcb;
  --shadow:0 18px 44px rgba(25,42,61,.12);
  --shadow-s:0 8px 22px rgba(25,42,61,.10);
}
:root[data-theme="blue"] .dark .btn.brass{background:var(--brass2);border-color:var(--brass2);color:var(--ink)}
:root[data-theme="blue"] .dark .btn.brass:hover{background:var(--bone);border-color:var(--bone)}


/* ==========================================================================
   3. BASE
   ========================================================================== */
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:var(--font-body);font-weight:var(--weight-body);background:var(--bone);color:var(--ink);line-height:var(--line-body);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer}
::selection{background:var(--brass);color:var(--bone)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}


/* ==========================================================================
   4. TYPOGRAPHY
   ========================================================================== */
h1,h2,h3{font-family:var(--font-display);font-weight:var(--weight-display);letter-spacing:-.012em;line-height:1.06}
h1{font-size:var(--fs-h1)}
h2{font-size:var(--fs-h2)}
h3{font-size:var(--fs-h3);line-height:1.2}
.page-title{font-size:var(--fs-h1-page);margin:18px 0 22px}
.lead{font-size:var(--fs-lead);color:var(--muted);max-width:62ch}
.lead b{font-weight:var(--weight-medium);color:var(--ink)}
.dark .lead{color:var(--muted-d)}
.ital{font-family:var(--font-display);font-style:italic;font-weight:var(--weight-display)}
.note{font-size:var(--fs-small);color:var(--muted)}

/* Eyebrow: a short label with thin brass rules. Use sparingly, only where it
   adds context (e.g. "Before & After"); add .centered for rules on both sides. */
.eyebrow{display:inline-flex;align-items:center;gap:14px;margin-bottom:22px;font-size:var(--fs-label);font-weight:var(--weight-medium);letter-spacing:.32em;text-transform:uppercase;color:var(--brass)}
.eyebrow::before,.eyebrow.centered::after{content:"";width:30px;height:1px;background:var(--brass2)}

/* Text link with an arrow, underlined in brass */
.textlink{display:inline-flex;align-items:center;gap:10px;padding-bottom:4px;border-bottom:1px solid var(--brass2);font-size:var(--fs-label);font-weight:var(--weight-medium);letter-spacing:.2em;text-transform:uppercase;color:var(--ink);transition:gap .3s,color .3s}
.textlink::after{content:"\2192"}
.textlink:hover{gap:16px;color:var(--brass)}


/* ==========================================================================
   5. BUTTONS
   ========================================================================== */
.btn{display:inline-flex;align-items:center;gap:12px;padding:16px 30px;border:1px solid var(--ink);background:var(--ink);color:var(--bone);font-size:var(--fs-ui);font-weight:var(--weight-medium);letter-spacing:.22em;text-transform:uppercase;border-radius:2px;transition:background .28s,color .28s,transform .28s,border-color .28s}
.btn:hover{background:var(--brass);border-color:var(--brass);transform:translateY(-2px)}
.btn .ar{transition:transform .28s}
.btn:hover .ar{transform:translateX(5px)}
.btn.ghost{background:transparent;color:var(--ink);border-color:var(--ink)}
.btn.ghost:hover{background:var(--ink);color:var(--bone);border-color:var(--ink)}
.btn.brass{background:var(--brass);border-color:var(--brass)}
.btn.brass:hover{background:var(--ink);border-color:var(--ink)}
.dark .btn.ghost{color:var(--bone);border-color:var(--bone)}
.dark .btn.ghost:hover{background:var(--bone);color:var(--ink)}
.btn.sm{padding:12px 22px}


/* ==========================================================================
   6. HEADER & MOBILE MENU
   ========================================================================== */
header{position:sticky;top:0;z-index:90;background:var(--bone);border-bottom:1px solid var(--line);transition:border-color .35s}
body.nav-open{overflow:hidden}
body.nav-open header{border-bottom-color:color-mix(in srgb,var(--brass2) 45%,var(--line))}
.nav{display:flex;align-items:center;justify-content:space-between;height:78px;gap:20px}
.logo{display:flex;align-items:center}
.logo-img{height:44px;width:auto;display:block}
.menu{display:flex;align-items:center;gap:28px;list-style:none}
.menu a{font-size:var(--fs-ui);font-weight:400;letter-spacing:.18em;text-transform:uppercase;color:var(--ink);position:relative;padding:6px 0}
.menu a::after{content:"";position:absolute;left:0;bottom:0;width:0;height:1px;background:var(--brass);transition:width .3s}
.menu a:hover::after,.menu a.active::after{width:100%}
.menu a.active{color:var(--brass)}
.nav-cta{display:flex;align-items:center;gap:14px}

/* Normal trigger at rest; awakens with a CURRENT wave arc & ripple when touched */
.burger{display:none;width:44px;height:44px;border:1px solid var(--line);background:transparent;border-radius:2px;position:relative;transition:background .35s cubic-bezier(.22,1,.36,1),border-color .35s,transform .35s cubic-bezier(.34,1.56,.64,1)}
.burger:active{transform:scale(.92)}
.burger::before{content:"";position:absolute;inset:5px;border-radius:50%;border:1.4px solid transparent;border-top-color:var(--brass2);border-right-color:color-mix(in srgb,var(--brass2) 45%,transparent);opacity:0;transform:scale(.6) rotate(-90deg);transition:opacity .35s,transform .65s cubic-bezier(.22,1,.36,1);pointer-events:none}
.burger::after{content:"";position:absolute;inset:-1px;border-radius:2px;border:1px solid var(--brass2);opacity:0;transform:scale(1);pointer-events:none}
.burger i,.burger i::before,.burger i::after{content:"";position:absolute;left:11px;right:11px;height:1.6px;background:var(--ink);transition:transform .42s cubic-bezier(.34,1.56,.64,1),background-color .28s,top .3s}
.burger i{top:21px}
.burger i::before{left:0;right:0;top:-7px}
.burger i::after{left:0;right:0;top:7px}
body.nav-open .burger{background:var(--ink);border-color:var(--brass2)}
body.nav-open .burger::before{opacity:1;transform:scale(1) rotate(25deg)}
body.nav-open .burger::after{animation:burgerPulse .65s cubic-bezier(.16,1,.3,1) forwards}
body.nav-open .burger i{background:transparent}
body.nav-open .burger i::before{background:var(--bone);transform:translateY(7px) rotate(45deg) scaleX(.82)}
body.nav-open .burger i::after{background:var(--bone);transform:translateY(-7px) rotate(-45deg) scaleX(.82)}
@keyframes burgerPulse{0%{opacity:.85;transform:scale(1);border-radius:4px}100%{opacity:0;transform:scale(1.65);border-radius:50%}}

/* Fallback before JS enhancement */
.mnav{display:none;position:fixed;inset:78px 0 0;background:var(--ink);z-index:89;padding:44px 26px;overflow:auto}
body.nav-open .mnav{display:block}
.mnav a{display:block;font-family:var(--font-display);font-size:2rem;color:var(--bone);padding:14px 0;border-bottom:1px solid var(--line-d)}
.mnav a.active{color:var(--brass2)}
.mnav .btn{margin-top:26px}

/* Enhanced Tidal Current & Harp-Arc Mobile Menu */
.mnav.mnav-enhanced,body.nav-open .mnav.mnav-enhanced{display:flex;flex-direction:column;background:transparent;padding:0;overflow:hidden}
.mnav.mnav-enhanced{visibility:hidden;pointer-events:none;transition:visibility 0s linear .62s}
body.nav-open .mnav.mnav-enhanced{visibility:visible;pointer-events:auto;transition-delay:0s}
@media(min-width:1101px){.mnav.mnav-enhanced,body.nav-open .mnav.mnav-enhanced{display:none!important}}

/* Three concentric tidal/anatomical planes radiating from the #burger trigger */
.mnav-waves{position:absolute;inset:0;pointer-events:none;z-index:0;overflow:hidden}
.mnav-wave{position:absolute;inset:0;clip-path:circle(0px at var(--bx,calc(100% - 48px)) var(--by,-39px));will-change:clip-path}
.mnav-wave.w1{background:var(--brass2);transition:clip-path .48s cubic-bezier(.4,0,.2,1) .1s}
.mnav-wave.w2{background:var(--sage);transition:clip-path .5s cubic-bezier(.4,0,.2,1) .05s}
.mnav-wave.w3{background:radial-gradient(circle at var(--bx,92%) 0%,color-mix(in srgb,var(--brass2) 18%,var(--ink2)) 0%,var(--ink) 70%);transition:clip-path .52s cubic-bezier(.4,0,.2,1) 0s}
body.nav-open .mnav-wave{clip-path:circle(150vmax at var(--bx,calc(100% - 48px)) var(--by,-39px))}
body.nav-open .mnav-wave.w1{transition:clip-path .56s cubic-bezier(.22,1,.36,1) 0s}
body.nav-open .mnav-wave.w2{transition:clip-path .62s cubic-bezier(.22,1,.36,1) .06s}
body.nav-open .mnav-wave.w3{transition:clip-path .68s cubic-bezier(.22,1,.36,1) .12s}
.mnav-bg-crest{position:absolute;right:-60px;bottom:-50px;width:340px;height:340px;opacity:.08;pointer-events:none;stroke:var(--brass2);fill:none;transform:rotate(-12deg) scale(.88);transition:transform 1.1s cubic-bezier(.22,1,.36,1),opacity .8s}
body.nav-open .mnav-bg-crest{transform:rotate(0deg) scale(1);opacity:.13}

/* Inner layout container */
.mnav-inner{position:relative;z-index:1;display:flex;flex-direction:column;justify-content:space-between;gap:14px;height:100%;max-width:560px;width:100%;margin:0 auto;padding:16px 22px calc(18px + env(safe-area-inset-bottom));overflow-y:auto;overflow-x:hidden}

/* Stage: Left Pluckable Harp/Current Arc + Right Fanned Destinations */
.mnav-stage{flex:1;min-height:250px;max-height:360px;margin:auto 0;display:grid;grid-template-columns:52px minmax(0,1fr);gap:6px;align-items:stretch;position:relative}
.mnav-arc-col{position:relative;user-select:none;touch-action:none;cursor:grab}
.mnav-arc-col:active{cursor:grabbing}
.mnav-arc-svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.mnav-arc-track{fill:none;stroke:var(--line-d);stroke-width:1;stroke-dasharray:3 4}
.mnav-arc-echo{fill:none;stroke:var(--brass2);stroke-width:1;opacity:.28}
.mnav-arc-string{fill:none;stroke:var(--brass2);stroke-width:1.8;stroke-linecap:round;filter:drop-shadow(0 0 6px color-mix(in srgb,var(--brass2) 45%,transparent))}
.mnav-arc-ring{fill:color-mix(in srgb,var(--brass2) 18%,transparent);stroke:var(--brass2);stroke-width:1;opacity:.75}
.mnav-arc-bead{fill:var(--bone);stroke:var(--brass2);stroke-width:2}

/* Interactive Node Buttons along the Harp Arc */
.mnav-node{position:absolute;left:var(--nx,22px);top:var(--ny,50%);transform:translate(-50%,-50%) scale(.5);width:30px;height:30px;border-radius:50%;border:1px solid color-mix(in srgb,var(--brass2) 45%,var(--line-d));background:var(--ink2);color:var(--muted-d);font-family:var(--font-display);font-size:.78rem;font-weight:var(--weight-display-bold);display:grid;place-items:center;padding:0;opacity:0;transition:opacity .35s,transform .45s cubic-bezier(.34,1.56,.64,1),background-color .25s,color .25s,border-color .25s,box-shadow .25s;z-index:2}
body.nav-open .mnav-node{opacity:1;transform:translate(-50%,-50%) scale(1);transition-delay:calc(.22s + var(--i,0) * .055s)}
.mnav-node:hover,.mnav-node.is-peek{background:var(--brass2);color:var(--ink);border-color:var(--bone);box-shadow:0 0 0 4px color-mix(in srgb,var(--brass2) 22%,transparent);transform:translate(-50%,-50%) scale(1.12)}

/* Fanned Destination Links */
.mnav-list{list-style:none;display:grid;grid-template-rows:repeat(5,1fr);margin:0;padding:0;min-width:0}
.mnav-item{min-width:0;padding-left:var(--curve-x,0px);display:flex;align-items:stretch;opacity:0;transform:translate3d(28px,-14px,0) rotate(3deg);transform-origin:left center;transition:opacity .22s,transform .25s}
body.nav-open .mnav-item{opacity:1;transform:translate3d(0,0,0) rotate(0deg);transition:opacity .48s ease calc(.16s + var(--i,0) * .055s),transform .56s cubic-bezier(.22,1,.36,1) calc(.16s + var(--i,0) * .055s)}
.mnav-enhanced a.mnav-link{width:100%;min-width:0;display:flex;align-items:center;justify-content:flex-start;gap:10px;padding:8px 6px 8px 8px;border-bottom:1px solid color-mix(in srgb,var(--line-d) 70%,transparent);font-family:var(--font-display);font-size:clamp(1.45rem,4.5vw,1.9rem);line-height:1.1;color:var(--bone);border-radius:2px;transition:color .25s,padding-left .3s cubic-bezier(.22,1,.36,1),background-color .25s,border-color .25s}
.mnav-enhanced a.mnav-link:hover,.mnav-item.is-peek a.mnav-link{color:var(--brass2);padding-left:14px;border-bottom-color:var(--brass2);background:linear-gradient(90deg,color-mix(in srgb,var(--brass2) 10%,transparent) 0%,transparent 85%)}
.mnav-enhanced a.mnav-link.active{color:var(--brass2)}
.mnav-link-title{display:inline-flex;align-items:center;gap:10px;font-weight:var(--weight-display);min-width:0;flex-wrap:wrap}
.mnav-item.is-peek .mnav-link-title em,.mnav-enhanced a.mnav-link.active .mnav-link-title em{font-style:italic;color:var(--brass2)}
.mnav-here{font-family:var(--font-body);font-size:.54rem;letter-spacing:.16em;text-transform:uppercase;padding:2px 6px;border:1px solid var(--brass2);color:var(--brass2);border-radius:2px;font-style:normal;font-weight:var(--weight-medium);flex-shrink:0}

/* Interactive Lookbook Peek Card */
.mnav-peek{display:grid;grid-template-columns:86px minmax(0,1fr);gap:14px;align-items:center;background:color-mix(in srgb,var(--ink2) 92%,var(--brass2));border:1px solid color-mix(in srgb,var(--brass2) 40%,var(--line-d));border-radius:2px;padding:12px 14px;position:relative;overflow:hidden;opacity:0;transform:translateY(18px) scale(.97);transition:opacity .22s,transform .22s;touch-action:pan-y}
body.nav-open .mnav-peek{opacity:1;transform:none;transition:opacity .48s ease .42s,transform .52s cubic-bezier(.22,1,.36,1) .42s}
.mnav-peek::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--brass2)}
.mnav-peek-vis{width:86px;height:86px;border:1px solid color-mix(in srgb,var(--brass2) 45%,var(--line-d));background:var(--ink);position:relative;overflow:hidden;border-radius:2px;flex-shrink:0}
.mnav-peek-plate{position:absolute;inset:0;opacity:0;transform:scale(1.06);transition:opacity .35s ease,transform .45s cubic-bezier(.22,1,.36,1);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;pointer-events:none}
.mnav-peek-plate.is-on{opacity:1;transform:scale(1)}
.mnav-peek-plate img{width:100%;height:100%;object-fit:cover;object-position:center top}
.mnav-peek-price{padding:6px;background:radial-gradient(circle at 50% 25%,color-mix(in srgb,var(--brass2) 22%,var(--ink2)),var(--ink))}
.mnav-peek-price small{font-size:.55rem;letter-spacing:.18em;text-transform:uppercase;color:var(--muted-d);display:block}
.mnav-peek-price b{font-family:var(--font-display);font-size:1.35rem;color:var(--brass2);line-height:1.05;margin:3px 0;display:block}
.mnav-peek-price span{font-size:.54rem;letter-spacing:.12em;text-transform:uppercase;color:var(--bone);opacity:.8}
.mnav-peek-body{min-width:0;display:flex;flex-direction:column;gap:4px}
.mnav-peek-head{display:flex;align-items:center;justify-content:space-between;gap:8px}
.mnav-peek-eyebrow{font-size:var(--fs-label-sm);letter-spacing:.14em;text-transform:uppercase;color:var(--brass2);font-weight:var(--weight-medium);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mnav-peek-nav{display:inline-flex;gap:4px;flex-shrink:0}
.mnav-peek-step{width:24px;height:24px;border-radius:50%;border:1px solid var(--line-d);background:var(--ink);color:var(--bone);font-size:.85rem;line-height:1;display:grid;place-items:center;padding:0;transition:border-color .2s,color .2s}
.mnav-peek-step:hover{border-color:var(--brass2);color:var(--brass2)}
.mnav-peek-desc{font-size:.82rem;line-height:1.42;color:var(--bone);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.mnav-enhanced a.mnav-peek-go{display:inline-flex;align-items:center;gap:6px;align-self:flex-start;margin-top:2px;padding:0;border:0;font-family:var(--font-body);font-size:var(--fs-label-sm);font-weight:var(--weight-medium);letter-spacing:.18em;text-transform:uppercase;color:var(--brass2)}
.mnav-enhanced a.mnav-peek-go:hover{color:var(--bone)}

/* Bottom Consultation & Direct Call Dock */
.mnav-dock{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:stretch;opacity:0;transform:translateY(16px);transition:opacity .22s,transform .22s}
body.nav-open .mnav-dock{opacity:1;transform:none;transition:opacity .48s ease .48s,transform .52s cubic-bezier(.22,1,.36,1) .48s}
.mnav-enhanced a.mnav-cta{margin:0;padding:14px 16px;justify-content:center;font-family:var(--font-body);font-size:.68rem;letter-spacing:.18em;border-bottom:1px solid var(--brass2);background:var(--brass);color:var(--bone)}
.mnav-enhanced a.mnav-cta:hover{background:var(--brass2);color:var(--ink)}
.mnav-enhanced a.mnav-call{display:inline-flex;align-items:center;gap:7px;padding:0 13px;border:1px solid var(--line-d);background:var(--ink2);color:var(--bone);font-family:var(--font-body);font-size:var(--fs-label);letter-spacing:.12em;text-transform:uppercase;border-radius:2px;white-space:nowrap;transition:border-color .25s,color .25s}
.mnav-enhanced a.mnav-call:hover{border-color:var(--brass2);color:var(--brass2)}
.mnav-call svg{width:13px;height:13px;stroke:var(--brass2);fill:none;stroke-width:1.8;flex-shrink:0}
@media(max-width:359px){
  .mnav-inner{padding:12px 14px calc(14px + env(safe-area-inset-bottom));gap:8px}
  .mnav-hint{display:none}
  .mnav-enhanced a.mnav-link{padding:7px 4px;font-size:1.35rem}
  .mnav-dock{grid-template-columns:1fr}
  .mnav-enhanced a.mnav-call{justify-content:center;padding:10px 12px}
}
@media(prefers-reduced-motion:reduce){
  .mnav-wave,.mnav-item,.mnav-node,.mnav-peek,.mnav-dock,.mnav-top,.burger,.burger::before,.burger i,.burger i::before,.burger i::after{transition:none!important;animation:none!important}
}


/* ==========================================================================
   7. PAGE LAYOUT & SCROLL REVEAL
   ========================================================================== */
.wrap{max-width:1220px;margin:0 auto;padding:0 26px}
.section{padding:104px 0}
.section.tight{padding:78px 0}
.dark{background:var(--ink);color:var(--bone)}
.dark h2,.dark h3{color:var(--bone)}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.split>*,.hero-grid>*,.form-grid>*{min-width:0}

main{animation:pageIn .5s ease both}
@keyframes pageIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}

[data-reveal]{opacity:0;transform:translateY(26px);transition:opacity .8s cubic-bezier(.2,.6,.2,1),transform .8s cubic-bezier(.2,.6,.2,1)}
[data-reveal].rv{opacity:1;transform:none}
[data-reveal][data-d="1"]{transition-delay:.1s}
[data-reveal][data-d="2"]{transition-delay:.2s}
[data-reveal][data-d="3"]{transition-delay:.3s}
[data-reveal][data-d="4"]{transition-delay:.4s}


/* ==========================================================================
   8. SHARED COMPONENTS
   ========================================================================== */

/* Hero */
.hero{padding:86px 0 96px;position:relative;overflow:hidden}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:64px;align-items:center}
.hero h1 em{font-style:italic;color:var(--brass)}
.hero .lead{margin:26px 0 36px}
.hero-cta{display:flex;gap:16px;flex-wrap:wrap}
.hero-stats{display:flex;gap:44px;margin-top:56px;padding-top:32px;border-top:1px solid var(--line);flex-wrap:wrap}
.stat b{font-family:var(--font-display);font-size:calc(var(--fs-number) * 1.25);font-weight:var(--weight-display-bold);display:block;line-height:1}
.stat span{font-size:var(--fs-label);letter-spacing:.24em;text-transform:uppercase;color:var(--muted)}
.hero-fig{position:relative}
.hero-fig .frame{position:relative;z-index:2;border:1px solid var(--brass);padding:14px;background:var(--paper)}
.hero-fig .frame img{aspect-ratio:4/4.6;object-fit:cover;object-position:top center;width:100%}
.hero-fig .back{position:absolute;inset:34px -26px -26px 34px;background:var(--bone2);z-index:1;border:1px solid var(--line)}

/* Cards */
.card{background:var(--paper);border:1px solid var(--line);padding:34px 30px;border-radius:2px;transition:transform .35s,box-shadow .35s,border-color .35s}
.card:hover{transform:translateY(-6px);box-shadow:var(--shadow);border-color:var(--brass)}
.card .num{font-family:var(--font-display);font-size:.95rem;color:var(--brass);letter-spacing:.2em}
.card h3{margin:14px 0 12px}
.card h3:first-child{margin-top:0}
.card p{font-size:var(--fs-text);color:var(--muted)}
.card .rule{width:36px;height:1px;background:var(--brass);margin:18px 0}
.dark .card{background:var(--ink2);border-color:var(--line-d)}
.dark .card p{color:var(--muted-d)}
.dark .card:hover{border-color:var(--brass2)}

/* Image + text split */
.split{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}
.split .fig img{width:100%;aspect-ratio:4/3;object-fit:cover;object-position:top center;border:1px solid var(--line)}
.split .fig.tall img{aspect-ratio:4/4.4;object-position:top center}
.figcap{font-size:var(--fs-label);letter-spacing:.2em;text-transform:uppercase;color:var(--muted);margin-top:14px}

/* Pull quote */
.quote-band{padding:96px 0;text-align:center}
.sage-band{background:var(--sage);color:var(--bone);padding:88px 0}
.quote-band blockquote{font-family:var(--font-display);font-style:italic;font-weight:var(--weight-display);font-size:var(--fs-quote);line-height:1.3;max-width:24ch;margin:0 auto}
.quote-band cite{display:block;margin-top:26px;font-style:normal;font-size:var(--fs-label);letter-spacing:.28em;text-transform:uppercase;color:var(--brass2)}

/* FAQ */
.faq{max-width:820px;margin:0 auto}
.faq-item{border-bottom:1px solid var(--line)}
.faq-q{width:100%;background:none;border:none;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:26px 4px;text-align:left;font-family:var(--font-display);font-size:var(--fs-title);font-weight:var(--weight-display-bold);color:var(--ink)}
.dark .faq-q{color:var(--bone)}
.faq-q .pm{flex:none;width:30px;height:30px;border:1px solid var(--brass);border-radius:50%;display:grid;place-items:center;color:var(--brass);font-size:1rem;transition:transform .3s,background .3s,color .3s;font-family:var(--font-body)}
.faq-item.open .pm{transform:rotate(45deg);background:var(--brass);color:var(--bone)}
.faq-a{max-height:0;overflow:hidden;transition:max-height .45s ease}
.faq-a p{padding:0 44px 26px 4px;color:var(--muted);font-size:var(--fs-text)}
.faq-a a{color:var(--brass);text-decoration:underline;text-underline-offset:3px}
.dark .faq-a p{color:var(--muted-d)}

/* Form fields */
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.field{display:flex;flex-direction:column;gap:8px}
.field.full{grid-column:1/-1}
.field label{font-size:var(--fs-label);letter-spacing:.24em;text-transform:uppercase;color:var(--muted)}
.field input,.field select,.field textarea{min-width:0;width:100%;font-family:var(--font-body);font-size:var(--fs-text);font-weight:var(--weight-body);padding:15px 16px;border:1px solid var(--line);background:var(--paper);color:var(--ink);border-radius:2px;outline:none;transition:border-color .25s}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--brass)}
.field textarea{min-height:130px;resize:vertical}

/* Panels (consultation form) */
.bpanel{background:var(--paper);border:1px solid var(--line);border-radius:2px}
.bpanel .bhead{padding:22px 26px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:14px}
.bpanel .bhead h3{font-size:var(--fs-title)}
.bpanel .bbody{padding:26px}

/* Footer */
footer{background:var(--ink);color:var(--bone);padding:74px 0 34px}
.f-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:44px}
.f-grid h5{font-size:var(--fs-label);letter-spacing:.26em;text-transform:uppercase;color:var(--brass2);margin-bottom:18px;font-weight:var(--weight-medium)}
.f-grid a,.f-grid p{font-size:var(--fs-text-sm);color:var(--muted-d);display:block;padding:5px 0}
.f-grid a:hover{color:var(--bone)}
.f-bot{margin-top:56px;padding-top:26px;border-top:1px solid var(--line-d);display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;font-size:var(--fs-small);color:var(--muted-d)}
.f-logo-img{height:52px;width:auto;max-width:100%;display:block;object-fit:contain;object-position:left}
.f-about{margin-top:10px;max-width:34ch}


/* ==========================================================================
   9. HOME PAGE
   ========================================================================== */

/* Hero: full-bleed photo, copy centered over its darker side */
.home-hero{--on-photo:color-mix(in srgb,var(--brass2) 55%,#fff);position:relative;display:flex;align-items:center;min-height:calc(100svh - 79px);overflow:hidden;background:var(--ink);color:var(--paper)}
.home-hero-bg{position:absolute;inset:0}
.home-hero-bg img{width:100%;height:100%;object-fit:cover}
.home-hero-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,color-mix(in srgb,var(--ink) 30%,transparent) 0%,color-mix(in srgb,var(--ink) 62%,transparent) 55%,color-mix(in srgb,var(--ink) 86%,transparent) 100%)}
.home-hero .wrap{position:relative;z-index:1;width:100%}
.home-hero-inner{max-width:504px;margin:0 auto;padding:90px 0}
.home-hero .eyebrow{color:var(--on-photo)}
.home-hero .eyebrow::before{background:var(--on-photo)}
.home-hero h1{color:var(--paper);margin-bottom:28px}
.home-hero h1 em{font-style:italic;color:var(--on-photo)}
.home-hero-sub{max-width:480px;text-wrap:pretty;margin-bottom:44px;font-size:var(--fs-text);line-height:1.9;color:color-mix(in srgb,var(--paper) 80%,transparent)}
.home-hero .btn.ghost{color:var(--paper);border-color:color-mix(in srgb,var(--paper) 50%,transparent)}
.home-hero .btn.ghost:hover{background:var(--paper);border-color:var(--paper);color:var(--ink)}

/* The CURRENT Lift: intro, numbered features, candidacy */
.home-lift-head{display:grid;grid-template-columns:1fr 1.1fr;gap:80px;align-items:end;margin-bottom:72px}
.home-lift-head h2 em{font-style:italic;color:var(--brass)}
.home-lift-head .lead{margin-bottom:22px}
.features{display:grid;grid-template-columns:repeat(4,1fr);gap:2px;margin-bottom:72px}
.feature{background:var(--paper);border:1px solid var(--line);padding:34px 30px}
.feature-num{display:block;margin-bottom:14px;font-family:var(--font-display);font-size:.9rem;color:var(--brass)}
.feature h3{margin-bottom:10px}
.feature p{font-size:var(--fs-text-sm);color:var(--muted)}
.candidate{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center;padding:56px 0;border-block:1px solid var(--line);margin-bottom:56px}
.candidate h3{font-size:calc(var(--fs-h3) * 1.3);margin-bottom:22px}
.candidate ul{list-style:none}
.candidate li{position:relative;padding:10px 0 10px 28px;font-size:var(--fs-text);border-bottom:1px solid var(--line)}
.candidate li::before{content:"";position:absolute;left:0;top:50%;width:14px;height:1px;background:var(--brass2)}
.candidate blockquote{font-family:var(--font-display);font-style:italic;font-weight:var(--weight-display);font-size:calc(var(--fs-quote) * .85);line-height:1.3;border-left:2px solid var(--brass2);padding-left:32px}
.candidate cite{display:block;margin-top:18px;font-family:var(--font-body);font-style:normal;font-size:var(--fs-label);font-weight:var(--weight-medium);letter-spacing:.24em;text-transform:uppercase;color:var(--brass)}
.home-foot{text-align:center}

/* Before & after teaser */
.home-results{background:var(--paper)}
.home-results-head{max-width:560px;margin:0 auto 56px;text-align:center}
.home-results-head h2{margin-bottom:16px}
.home-results-head .lead{margin:0 auto}
.results-grid{display:grid;grid-template-columns:1fr 1fr;gap:36px 28px;margin-bottom:56px}
.result{display:block}
.result-img{overflow:hidden;background:var(--bone)}
.result-img img{width:100%;height:auto;aspect-ratio:940/788;object-fit:cover;transition:transform .6s ease}
.result:hover .result-img img{transform:scale(1.03)}
.result-cap{display:block;margin-top:14px;font-size:var(--fs-label);font-weight:var(--weight-medium);letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}

/* Patient testimonial */
.testimonial{position:relative;overflow:hidden;text-align:center}
.testimonial::before{content:"\201C";position:absolute;top:40px;left:50%;transform:translateX(-50%);font-family:var(--font-display);font-size:17.5rem;line-height:1;color:color-mix(in srgb,var(--brass2) 14%,transparent)}
.testimonial .wrap{position:relative;max-width:900px}
.testimonial blockquote{margin-bottom:34px;font-family:var(--font-display);font-style:italic;font-weight:var(--weight-display);font-size:var(--fs-quote);line-height:1.32}
.testimonial blockquote em{color:var(--brass2)}
.testimonial cite{font-style:normal;font-size:var(--fs-label);font-weight:var(--weight-medium);letter-spacing:.24em;text-transform:uppercase;color:var(--brass2)}

/* Surgeon introduction */
.home-surgeon{background:var(--paper)}
.home-surgeon-grid{display:grid;grid-template-columns:.92fr 1fr;gap:84px;align-items:center}
.surgeon-media{position:relative;background:var(--bone2)}
.surgeon-media img{width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;object-position:top}
.surgeon-badge{position:absolute;left:-28px;bottom:48px;z-index:2;background:var(--ink);padding:22px 28px;text-align:center}
.surgeon-badge b{display:block;font-family:var(--font-display);font-size:1.9rem;font-weight:var(--weight-display);line-height:1;color:var(--brass2)}
.surgeon-badge span{display:block;margin-top:8px;font-size:var(--fs-label-sm);font-weight:var(--weight-medium);letter-spacing:.18em;text-transform:uppercase;color:color-mix(in srgb,var(--bone) 70%,transparent)}
.surgeon-text h2{margin-bottom:26px}
.surgeon-text p{margin-bottom:20px;font-size:var(--fs-text);line-height:1.9;color:var(--muted)}
.surgeon-text .textlink{margin-top:12px}

/* Closing consultation band */
.home-consult{text-align:center}
.home-consult .wrap{max-width:780px}
.home-consult h2{margin-bottom:26px}
.home-consult .lead{margin:0 auto 36px}
.home-consult .hero-cta{justify-content:center}


/* ==========================================================================
   10. GALLERY PAGE
   ========================================================================== */
.case-sliders{max-width:760px;margin:56px auto 0;display:flex;flex-direction:column;gap:72px}
.case-cap{text-align:center;font-family:var(--font-display);font-size:clamp(1.2rem,2.1vw,1.55rem);font-weight:var(--weight-display);line-height:1.35;margin:0 0 22px;color:var(--ink)}
.gslide{touch-action:pan-y}
.gslide-viewport{overflow:hidden;border:1px solid var(--line);background:var(--ink3);aspect-ratio:940/788;border-radius:2px}
.gslide-track{list-style:none;position:relative;height:100%}
.gslide-track li{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity .35s ease}
.gslide-track li.is-on{opacity:1;visibility:visible}
.gslide-track img{width:100%;height:100%;object-fit:cover;object-position:center top}
.gslide-bar{margin-top:12px;display:flex;flex-direction:column;gap:10px}
.gslide-step{display:grid;grid-template-columns:48px 1fr 48px;align-items:center;gap:10px}
.gslide-status{margin:0;text-align:center;font-size:var(--fs-label);letter-spacing:.22em;text-transform:uppercase;color:var(--muted);font-weight:var(--weight-medium)}
.gslide-prev,.gslide-next{width:48px;height:48px;border:1px solid var(--line);border-radius:50%;background:var(--paper);color:var(--ink);font-size:1.7rem;line-height:1;display:grid;place-items:center;padding:0 0 3px}
.gslide-prev:hover,.gslide-next:hover{border-color:var(--brass);color:var(--brass)}
.gslide-dots{display:grid;grid-template-columns:repeat(var(--views,5),minmax(0,1fr));gap:7px}
.gslide-dots button{height:62px;width:100%;padding:0;border:1px solid var(--line);border-radius:2px;background-color:var(--ink3);background-size:cover;background-position:center top;background-repeat:no-repeat;color:transparent;font-size:0;box-shadow:none}
.gslide-dots button.on{border-color:var(--brass);box-shadow:0 0 0 2px var(--brass)}
.gslide-dots button:hover{border-color:var(--brass2)}
.gslide-dots button:focus-visible,.gslide-prev:focus-visible,.gslide-next:focus-visible{outline:2px solid var(--brass);outline-offset:2px}
.disclaimer{margin:52px auto 0;font-size:var(--fs-small);color:var(--muted);max-width:70ch;border-left:2px solid var(--brass);padding-left:18px}


/* ==========================================================================
   11. PRICING PAGE
   ========================================================================== */
/* Hero: the CURRENT lift set as one printed price line (name, dotted leader, price) */
.price-hero{padding:96px 0 104px}
.price-line{display:flex;align-items:last baseline;gap:18px}
/* the dotted leader runs from the name's last word to the price, however the name wraps */
.price-line>:first-child{flex:1;min-width:0;overflow:hidden}
.price-line>:first-child::after{content:"";display:inline-block;width:100%;margin-right:-100%;margin-left:.35em;border-bottom:2px dotted currentColor;opacity:.35}
.ph-line h1{font-size:var(--fs-h1-page);line-height:1.04}
.ph-price{flex:none;font-family:var(--font-display);font-size:var(--fs-h1-page);font-weight:var(--weight-display);line-height:1.04;color:var(--brass2);white-space:nowrap}
.ph-price small{font-size:.34em;font-style:italic;color:var(--muted-d);margin-right:.3em}
.ph-terms{margin-top:14px;text-align:right;font-family:var(--font-display);font-style:italic;font-size:var(--fs-lead);color:var(--muted-d)}
.ph-body{display:grid;grid-template-columns:1.15fr .85fr;gap:70px;margin-top:64px;padding-top:44px;border-top:1px solid var(--line-d);align-items:start}
.ph-body .lead{margin-bottom:34px}
.ph-facts{list-style:none}
.ph-facts li{padding:14px 0;border-bottom:1px solid var(--line-d);font-size:var(--fs-text);color:var(--bone)}
.ph-facts li:first-child{padding-top:0}

/* Add-ons: the same price line, a size down */
.addons-grid{display:grid;grid-template-columns:.75fr 1.25fr;gap:80px;align-items:start}
.addons-intro{position:sticky;top:118px}
.addons-intro .lead{margin:22px 0 32px}
.addon-list{list-style:none}
.ao{padding:30px 0;border-bottom:1px solid var(--line)}
.ao:first-child{padding-top:6px}
.ao-price{flex:none;font-family:var(--font-display);font-size:var(--fs-h3);font-weight:var(--weight-display-bold);line-height:1.2;color:var(--brass);white-space:nowrap}
.ao-price.is-quote{font-style:italic;font-weight:var(--weight-display);font-size:var(--fs-title);color:var(--muted)}
.ao>p{margin-top:10px;font-size:var(--fs-text);color:var(--muted);max-width:62ch}


/* ==========================================================================
   12. DR. NOVIS PAGE
   ========================================================================== */
.about-hero{display:grid;grid-template-columns:.8fr 1.2fr;gap:64px;align-items:center}
.about-hero .por{position:relative}
.about-hero .por img{width:100%;aspect-ratio:4/4.5;object-fit:cover;object-position:top center;border:1px solid var(--line)}
.about-hero .por::after{content:"";position:absolute;inset:22px -22px -22px 22px;border:1px solid var(--brass);z-index:-1}
.about-sub{font-size:1.35rem;color:var(--brass);margin-bottom:24px}
.cred-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.cred{background:var(--paper);border:1px solid var(--line);border-top:3px solid var(--brass);padding:26px 22px;border-radius:2px}
.cred b{font-family:var(--font-display);font-size:var(--fs-number);font-weight:var(--weight-display-bold);display:block;line-height:1}
.cred span{font-size:var(--fs-label);letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
.tline{list-style:none;position:relative;margin-top:44px}
.tline::before{content:"";position:absolute;left:118px;top:6px;bottom:6px;width:1px;background:var(--line)}
.tline li{display:grid;grid-template-columns:96px 1fr;gap:46px;padding:0 0 34px;position:relative}
.tline .yr{font-family:var(--font-display);font-size:1.15rem;font-weight:var(--weight-display-bold);color:var(--brass);text-align:right}
.tline .dot{position:absolute;left:113px;top:9px;width:11px;height:11px;border-radius:50%;background:var(--bone);border:2px solid var(--brass)}
.tline h4{font-family:var(--font-display);font-size:var(--fs-title);font-weight:var(--weight-display-bold);margin-bottom:6px}
.tline p{font-size:var(--fs-text-sm);color:var(--muted);max-width:60ch}
.pola-wrap{display:grid;grid-template-columns:repeat(12,1fr);gap:26px;margin-top:56px}
.pola{background:var(--paper);padding:14px 14px 20px;border:1px solid var(--line);box-shadow:var(--shadow-s);transition:transform .4s,box-shadow .4s;position:relative}
.pola:hover{transform:rotate(0deg) translateY(-8px) scale(1.02);box-shadow:var(--shadow);z-index:3}
.pola img{width:100%;object-fit:cover;aspect-ratio:3/4;object-position:top center}
.pola-tall img{aspect-ratio:4/5}
.pola figcaption{font-family:var(--font-display);font-style:italic;font-size:1.02rem;margin-top:12px;color:var(--ink2)}
.pola .pin{position:absolute;top:-9px;left:50%;transform:translateX(-50%);width:14px;height:14px;border-radius:50%;background:var(--brass);box-shadow:0 2px 5px rgba(0,0,0,.3)}
.p1{grid-column:1/5;transform:rotate(-2.4deg)}
.p1 img{object-position:center 8%}
.p2{grid-column:5/9;transform:rotate(1.6deg);margin-top:34px}
.p3{grid-column:9/13;transform:rotate(-1.2deg)}
.p4{grid-column:1/5;transform:rotate(1.8deg);margin-top:20px}
.p4 img{object-position:center 72%}
.p5{grid-column:5/9;transform:rotate(-1.4deg);margin-top:10px}
.p6{grid-column:9/13;transform:rotate(1.2deg);margin-top:20px}


/* ==========================================================================
   13. CONSULTATION PAGE
   ========================================================================== */
.do-dont{display:grid;grid-template-columns:1fr 1fr;gap:26px;margin-top:34px}
.dd{background:var(--paper);border:1px solid var(--line);padding:28px;border-radius:2px}
.dd h4{font-family:var(--font-display);font-size:var(--fs-title);font-weight:var(--weight-display-bold);margin-bottom:14px}
.dd ul{list-style:none}
.dd li{font-size:var(--fs-text-sm);color:var(--muted);padding:8px 0 8px 28px;position:relative;border-bottom:1px dashed var(--line)}
.dd li:last-child{border-bottom:none}
.dd.do li::before{content:"✓";position:absolute;left:0;color:var(--sage2);font-weight:var(--weight-medium)}
.dd.dont li::before{content:"✕";position:absolute;left:0;color:var(--brass);font-weight:var(--weight-medium)}
.info-row{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;margin-top:56px}
.info-box{border-top:2px solid var(--brass);padding-top:20px}
.info-box b{font-family:var(--font-display);font-size:1.25rem;font-weight:var(--weight-display-bold);display:block;margin-bottom:8px}
.info-box p{font-size:var(--fs-text-sm);color:var(--muted)}
.form-ok{display:none;background:var(--sage);color:var(--bone);padding:26px;border-radius:2px;margin-top:22px}
.form-ok.on{display:block;animation:pageIn .4s ease both}
.form-ok b{font-family:var(--font-display);font-size:var(--fs-title);font-weight:var(--weight-display-bold)}
.form-ok p{margin-top:8px;font-size:var(--fs-text-sm)}


/* ==========================================================================
   14. THE CURRENT LIFT PAGE
   ========================================================================== */
.card-quote{font-family:var(--font-display);font-style:italic;font-size:var(--fs-lead);color:var(--brass);margin-top:14px;line-height:1.35}

/* Diagram: skin-only pull vs. CURRENT lift */
.lig{background:var(--bone2);border-block:1px solid var(--line)}
.lig-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:64px;align-items:center}
.lig-fig{background:var(--paper);border:1px solid var(--line);padding:22px;border-radius:2px}
.seg{display:flex;border:1px solid var(--ink);border-radius:2px}
.seg button{flex:1;padding:12px 10px;border:0;background:transparent;color:var(--ink);font-size:var(--fs-label);font-weight:var(--weight-medium);letter-spacing:.16em;text-transform:uppercase;transition:background .25s,color .25s}
.seg button+button{border-left:1px solid var(--ink)}
.seg button:hover{color:var(--brass)}
.seg button[aria-pressed="true"]{background:var(--ink);color:var(--bone)}
.seg button:focus-visible{outline:2px solid var(--brass);outline-offset:2px}
.lig-svg{display:block;width:100%;height:auto;margin-top:18px}
.l-bone{fill:var(--bone2);stroke:var(--line)}
.l-fat{fill:color-mix(in srgb,var(--brass2) 20%,transparent)}
.l-mus{fill:none;stroke:var(--sage);stroke-width:12;stroke-linecap:round;opacity:.9}
.l-skin{fill:none;stroke:var(--ink);stroke-width:3.5;stroke-linecap:round}
.l-lig{stroke:var(--brass);stroke-width:3;stroke-linecap:round;transition:opacity .5s}
.lig-svg[data-state="lift"] .l-lig-out{opacity:.3;stroke-dasharray:6 7}
.l-fold{fill:none;stroke:var(--brass);stroke-width:1.5;stroke-dasharray:4 4;transition:opacity .5s}
.lig-svg[data-state="pull"] .l-fold{opacity:.55}
.lig-svg[data-state="lift"] .l-fold{opacity:0}
.l-tension path,.l-up path{fill:none;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}
.l-tension{stroke:var(--brass);opacity:0;transition:opacity .5s}
.l-up{stroke:var(--sage);opacity:0;transition:opacity .5s}
.lig-svg[data-state="pull"] .l-tension,.lig-svg[data-state="lift"] .l-up{opacity:1}
.lig-key{list-style:none;display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:14px;font-size:var(--fs-label);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.lig-key li{display:flex;align-items:center;gap:7px}
.lig-key i{width:16px;height:10px;border-radius:2px;display:block}
.k-bone{background:var(--bone2);border:1px solid var(--line)}
.k-lig{background:var(--brass);height:3px!important}
.k-mus{background:var(--sage)}
.k-fat{background:color-mix(in srgb,var(--brass2) 30%,transparent)}
.k-skin{background:var(--ink);height:3px!important}
.lig-cap{margin-top:18px;padding-top:16px;border-top:1px solid var(--line);font-size:var(--fs-text);color:var(--muted);min-height:6.2em}
.lig-cap b{font-family:var(--font-display);font-size:1.2rem;font-weight:var(--weight-display-bold);color:var(--ink)}
.lig-note{margin-top:8px;font-size:var(--fs-small);color:var(--muted)}

/* Local vs. general anesthesia table */
.cmp-head{display:grid;grid-template-columns:.8fr 1.2fr;gap:60px;align-items:end;margin-bottom:40px}
.cmp{width:100%;border-collapse:collapse;background:var(--paper);border:1px solid var(--line)}
.cmp thead th{font-size:var(--fs-label);letter-spacing:.22em;text-transform:uppercase;text-align:left;padding:18px 22px;background:var(--ink);color:var(--bone);font-weight:var(--weight-medium)}
.cmp thead th.cur{background:var(--brass)}
.cmp tbody th{font-family:var(--font-display);font-size:1.18rem;font-weight:var(--weight-display-bold);text-align:left;padding:20px 22px;width:26%;vertical-align:top;line-height:1.25}
.cmp td{padding:20px 22px;font-size:var(--fs-text-sm);color:var(--muted);vertical-align:top}
.cmp td.cur{color:var(--ink);background:color-mix(in srgb,var(--brass) 7%,var(--paper));font-weight:var(--weight-medium)}
.cmp tbody tr{border-top:1px solid var(--line)}
.cmp-note{margin-top:16px;font-size:var(--fs-small);color:var(--muted)}
.cmp sup{font-size:.7em;line-height:0;margin-left:2px}
.cmp sup a{color:var(--brass)}
.cmp-sources{margin-top:14px;padding-left:18px;font-size:var(--fs-small);color:var(--muted)}
.cmp-sources li{margin-top:4px}
.cmp-sources a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--line);text-underline-offset:3px}
.cmp-sources a:hover{text-decoration-color:var(--brass)}

/* Prep checklist & countdown */
.prep{background:var(--bone2);border-block:1px solid var(--line)}
.prep-head{display:grid;grid-template-columns:1.1fr .9fr;gap:60px;align-items:end}
.prep-ctl{background:var(--paper);border:1px solid var(--line);padding:26px;border-radius:2px}
.prep-ctl label{display:block;font-size:var(--fs-label);letter-spacing:.24em;text-transform:uppercase;color:var(--muted);margin-bottom:8px}
.prep-ctl input{width:100%;font-family:var(--font-body);font-size:var(--fs-text);font-weight:var(--weight-body);padding:13px 14px;border:1px solid var(--line);background:var(--bone);color:var(--ink);border-radius:2px;outline:none}
.prep-ctl input:focus{border-color:var(--brass)}
.prep-count{margin-top:14px;font-family:var(--font-display);font-size:var(--fs-title);font-weight:var(--weight-display)}
.prep-count b{font-size:var(--fs-number);font-weight:var(--weight-display-bold);color:var(--brass)}
.prep-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}
.prep-groups{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin-top:50px;align-items:start}
.pgroup{background:var(--paper);border:1px solid var(--line);border-top:3px solid var(--brass);padding:24px 22px 12px;border-radius:2px}
.pgroup.is-due{border-top-color:var(--sage)}
.pgroup h3{font-size:calc(var(--fs-title) * 1.08);font-weight:var(--weight-display-bold);line-height:1.2}
.pdate{display:block;min-height:1.1em;margin-top:4px;font-size:var(--fs-label);letter-spacing:.2em;text-transform:uppercase;color:var(--brass);font-weight:var(--weight-medium)}
.pgroup.is-due .pdate{color:var(--sage)}
.pgroup ul{list-style:none;margin-top:12px}
.pgroup li+li{border-top:1px dashed var(--line)}
.pgroup label{display:flex;gap:12px;align-items:flex-start;padding:11px 0;font-size:var(--fs-text-sm);color:var(--muted);cursor:pointer;line-height:1.5}
.pgroup input{flex:none;width:18px;height:18px;margin-top:2px;accent-color:var(--brass);cursor:pointer}
.pgroup input:checked+span{text-decoration:line-through;opacity:.55}
.prep-note{margin-top:22px;font-size:var(--fs-small);color:var(--muted)}

/* Recovery slider */
.rec-tool{max-width:920px;margin:0 auto;background:var(--ink2);border:1px solid var(--line-d);padding:34px 34px 30px;border-radius:2px}
.rec-plot{position:relative;height:150px}
.rec-chart{display:block;width:100%;height:100%}
.rc-area{fill:url(#swellFill)}
.rec-chart stop{stop-color:var(--brass2)}
.rc-line{fill:none;stroke:var(--brass2);stroke-width:2}
.rec-marker{position:absolute;left:var(--x,7%);top:var(--y,50%);transform:translate(-50%,-50%);transition:left .45s cubic-bezier(.2,.6,.2,1),top .45s cubic-bezier(.2,.6,.2,1)}
.rec-marker i{display:block;width:18px;height:18px;border-radius:50%;background:var(--brass2);border:3px solid var(--ink2);box-shadow:0 0 0 1px var(--brass2)}
.rec-axis{display:flex;justify-content:space-between;gap:14px;margin:10px 0 16px;font-size:var(--fs-label-sm);letter-spacing:.2em;text-transform:uppercase;color:var(--muted-d)}
.rec-range{-webkit-appearance:none;appearance:none;display:block;width:calc(100% - 2 * (7.142857% - 11px));margin:0 calc(7.142857% - 11px);height:22px;background:transparent;cursor:pointer}
.rec-range::-webkit-slider-runnable-track{height:2px;background:var(--line-d)}
.rec-range::-webkit-slider-thumb{-webkit-appearance:none;width:22px;height:22px;margin-top:-10px;border-radius:50%;background:var(--bone);border:3px solid var(--brass2)}
.rec-range::-moz-range-track{height:2px;background:var(--line-d)}
.rec-range::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:var(--bone);border:3px solid var(--brass2)}
.rec-range:focus-visible{outline:2px solid var(--brass2);outline-offset:4px}
.rec-stops{display:grid;grid-template-columns:repeat(7,1fr);margin-top:6px}
.rec-stops button{background:none;border:0;color:var(--muted-d);font-size:var(--fs-label);letter-spacing:.12em;text-transform:uppercase;padding:8px 2px;line-height:1.3}
.rec-stops button:hover,.rec-stops button.on{color:var(--brass2)}
.rec-stops button.on{font-weight:var(--weight-medium)}
.rec-panels{margin-top:26px;padding-top:26px;border-top:1px solid var(--line-d)}
.rec-tool.js .rec-panel{display:none}
.rec-tool.js .rec-panel.on{display:block;animation:pageIn .4s ease both}
.rec-panel+.rec-panel{margin-top:22px}
.rec-tool.js .rec-panel+.rec-panel{margin-top:0}
.rec-panel h3{margin-bottom:10px}
.rec-panel p{color:var(--muted-d);font-size:var(--fs-text);max-width:70ch}
.rec-pills{display:none;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:24px}
.rec-tool.js .rec-pills{display:grid}
.rec-pills div{border:1px solid var(--line-d);padding:12px 14px;border-radius:2px}
.rec-pills dt{font-size:var(--fs-label-sm);letter-spacing:.2em;text-transform:uppercase;color:var(--muted-d)}
.rec-pills dd{font-family:var(--font-display);font-size:1.18rem;font-weight:var(--weight-display-bold);color:var(--bone);margin-top:4px;line-height:1.2}
.rec-note{margin-top:18px;font-size:var(--fs-small);color:var(--muted-d)}
.care-title{text-align:center;margin:76px 0 30px}
.care{display:grid;grid-template-columns:repeat(3,1fr);gap:30px 26px}
.care-item{border-top:2px solid var(--brass2);padding-top:18px}
.care-item b{display:block;font-family:var(--font-display);font-size:var(--fs-title);font-weight:var(--weight-display-bold);margin-bottom:8px}
.care-item p{font-size:var(--fs-text-sm);color:var(--muted-d)}
.alert{margin-top:54px;border:1px solid var(--brass2);background:color-mix(in srgb,var(--brass2) 8%,transparent);padding:24px 28px;border-radius:2px}
.alert p{font-size:var(--fs-text);color:var(--bone)}
.alert p+p{margin-top:8px}
.alert b{font-weight:var(--weight-medium)}
.alert a{color:var(--brass2);text-decoration:underline;text-underline-offset:3px}

/* Consultation band */
.consult-band{background:var(--sage);color:var(--bone)}
.consult-band h2{color:var(--bone)}
.consult-band .lead{color:color-mix(in srgb,var(--bone) 86%,transparent)}
.consult-band .btn.ghost{color:var(--bone);border-color:var(--bone)}
.consult-band .btn.ghost:hover{background:var(--bone);color:var(--ink)}
.cb-head{display:grid;grid-template-columns:.8fr 1.2fr;gap:60px;align-items:end}
.steps{list-style:none;counter-reset:step;display:grid;grid-template-columns:repeat(3,1fr);gap:26px;margin-top:50px}
.steps li{counter-increment:step;border-top:1px solid color-mix(in srgb,var(--bone) 35%,transparent);padding-top:20px}
.steps li::before{content:"0" counter(step);display:block;font-family:var(--font-display);font-size:calc(var(--fs-number) * 1.1);font-weight:var(--weight-display);line-height:1;color:color-mix(in srgb,var(--bone) 55%,transparent);margin-bottom:12px}
.steps b{display:block;font-family:var(--font-display);font-size:calc(var(--fs-title) * 1.08);font-weight:var(--weight-display-bold);margin-bottom:6px}
.steps p{font-size:var(--fs-text);color:color-mix(in srgb,var(--bone) 86%,transparent)}


/* ==========================================================================
   15. RESPONSIVE
   ========================================================================== */
@media(max-width:1100px){
  /* header: switch to the menu button before the links get squeezed */
  .menu,.nav-cta .btn{display:none}
  .burger{display:block}
}
@media(max-width:1020px){
  /* Home page */
  .home-lift-head,.candidate,.home-surgeon-grid{grid-template-columns:1fr;gap:48px}
  .features{grid-template-columns:1fr 1fr}
  .surgeon-media{max-width:460px}
  .cred-grid{grid-template-columns:repeat(2,1fr)}
  .addons-grid{grid-template-columns:1fr;gap:40px}
  .addons-intro{position:static}
  .f-grid{grid-template-columns:1fr 1fr}
  .prep-groups{grid-template-columns:1fr 1fr}
}
@media(max-width:880px){
  .section{padding:74px 0}
  .hero-grid,.split,.ph-body,.about-hero,.do-dont{grid-template-columns:1fr}
  .hero-fig{margin-top:20px}
  .hero-fig .back{inset:22px -14px -14px 22px}
  .split .fig.tall img,.split .fig img{aspect-ratio:4/3}
  .grid3,.info-row,.form-grid{grid-template-columns:1fr}
  .pola-wrap{grid-template-columns:1fr 1fr;gap:18px}
  .p1,.p2,.p3,.p4,.p5,.p6{grid-column:auto;margin-top:0;transform:rotate(0)}
  .tline::before{left:8px}
  .tline li{grid-template-columns:1fr;gap:8px;padding-left:34px}
  .tline .yr{text-align:left}
  .tline .dot{left:3px}
  /* Lift page */
  .lig-grid,.cmp-head,.prep-head,.cb-head{grid-template-columns:1fr;gap:28px}
  .care,.steps{grid-template-columns:1fr}
  .rec-pills{grid-template-columns:1fr 1fr}
  .rec-tool{padding:24px 18px}
  .rec-plot{height:110px}
}
@media(max-width:720px){
  /* Home page */
  .features,.results-grid{grid-template-columns:1fr}
  .results-grid{gap:28px}
  .candidate blockquote{padding-left:22px}
  .surgeon-badge{left:16px}
  .home-hero .hero-cta{flex-direction:column;align-items:stretch}
  .home-hero .btn{justify-content:center}
  /* Pricing hero: name, then price */
  .ph-line{flex-direction:column;align-items:flex-start;gap:10px}
  .ph-line>:first-child::after{display:none}
  .ph-terms{text-align:left}
  .price-hero{padding:70px 0 80px}
  /* Lift page: comparison table stacks into cards */
  .cmp thead{display:none}
  .cmp,.cmp tbody,.cmp tr,.cmp th,.cmp td{display:block;width:100%}
  .cmp tbody th{width:100%;padding:18px 18px 6px}
  .cmp td{padding:8px 18px}
  .cmp td.cur{background:none;padding-bottom:18px}
  .cmp td::before{content:attr(data-h);display:block;font-size:var(--fs-label-sm);letter-spacing:.2em;text-transform:uppercase;color:var(--muted);font-weight:var(--weight-medium)}
  .cmp td.cur::before{color:var(--brass)}
}
@media(max-width:560px){
  .f-grid{grid-template-columns:1fr;gap:32px}
  /* Home page: photo above the copy */
  .home-hero{display:block;min-height:0}
  .home-hero-bg{position:relative;height:320px}
  .home-hero-bg img{object-position:15% center}
  .home-hero-bg::after{background:none}
  .home-hero-inner{padding:44px 0 52px}
  .home-consult h2 br{display:none}
  .cred-grid,.pola-wrap{grid-template-columns:1fr}
  .ao .price-line{flex-wrap:wrap;gap:4px 18px}
  .ao .price-line h3::after{display:none}
  .case-sliders{gap:48px;margin-top:40px}
  .gslide-step{grid-template-columns:44px 1fr 44px;gap:8px}
  .gslide-prev,.gslide-next{width:44px;height:44px;font-size:1.45rem}
  .gslide-dots{gap:5px}
  .gslide-dots button{height:48px}
  /* Lift page */
  .hero-stats{gap:26px}
  .prep-groups{grid-template-columns:1fr}
  .seg button{font-size:var(--fs-label-sm);letter-spacing:.08em;padding:11px 4px}
  .rec-stops button{font-size:var(--fs-label-sm);letter-spacing:.02em}
  .rec-axis span+span{display:none}
}


/* ==========================================================================
   16. PRINT & REDUCED MOTION
   ========================================================================== */
@media print{
  /* Lift page: "Print checklist" prints only the prep checklist */
  body:has(#prep) header,body:has(#prep) .mnav,body:has(#prep) footer,body:has(#prep) main>:not(#prep),.prep-actions{display:none!important}
  main{animation:none}
  #prep{padding:0;background:none;border:0}
  #prep .lead{display:none}
  [data-reveal]{opacity:1!important;transform:none!important}
  .prep-groups{grid-template-columns:1fr 1fr;margin-top:24px}
  .pgroup{break-inside:avoid}
}
@media(prefers-reduced-motion:reduce){
  .rec-marker,main,[data-reveal]{transition:none;animation:none}
}


/* ==========================================================================
   17. DEMO THEME SWITCHER
   Hidden until someone presses T. Built by js/theme.js.
   ========================================================================== */
.theme-switch{position:fixed;right:20px;bottom:20px;z-index:200;background:var(--paper);color:var(--ink);border:1px solid var(--line);box-shadow:var(--shadow);padding:16px 18px 18px;border-radius:2px;min-width:250px}
.theme-switch[hidden]{display:none}
.theme-switch p{font-family:var(--font-display);font-size:var(--fs-title);font-weight:var(--weight-display-bold);margin-bottom:12px}
.theme-switch button{display:flex;align-items:center;gap:12px;width:100%;padding:9px 10px;border:1px solid transparent;background:none;color:var(--ink);font-size:var(--fs-text-sm);text-align:left;border-radius:2px}
.theme-switch button:hover{border-color:var(--line)}
.theme-switch button[aria-pressed="true"]{border-color:var(--brass);font-weight:var(--weight-medium)}
.theme-switch button:focus-visible{outline:2px solid var(--brass);outline-offset:2px}
.theme-switch i{flex:none;width:26px;height:26px;border-radius:50%;border:1px solid rgba(0,0,0,.15);background:linear-gradient(135deg,var(--a) 50%,var(--b) 50%)}
html.theme-anim,html.theme-anim *{transition:background-color .5s ease,color .5s ease,border-color .5s ease,fill .5s ease,stroke .5s ease!important}
@media print{.theme-switch{display:none!important}}
