@font-face{font-family:'Archivo';font-style:normal;font-weight:100 900;font-stretch:62% 125%;font-display:swap;src:url('../fonts/archivo-var.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Figtree';font-style:normal;font-weight:300 900;font-display:swap;src:url('../fonts/figtree-var.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Figtree';font-style:italic;font-weight:300 900;font-display:swap;src:url('../fonts/figtree-var-italic.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Geist Mono';font-style:normal;font-weight:400 600;font-display:swap;src:url('../fonts/geist-mono-var.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}

:root{
  --white:#FFFFFF;
  --canvas:#F4F1EC;
  --canvas-2:#ECE7DE;
  --line:#E2DCD1;
  --field-line:#8C93A3;

  --navy-950:#0F1726;
  --navy-900:#152035;
  --navy:#1F2C44;
  --navy-700:#2B3A57;
  --navy-600:#3A4B6C;
  --navy-50:#EEF0F4;

  --ink:#1F2C44;
  --ink-2:#4E5B73;
  --on-dark:#F4F1EC;
  --on-dark-2:#C3C9D4;

  --gold:#A8926E;
  --gold-hi:#C9B48C;
  --gold-ink:#7A6648;
  --plan:#D9C194;
  --error:#A2402C;

  --f-display:'Archivo','Arial Narrow',sans-serif;
  --f-body:'Figtree','Segoe UI',system-ui,sans-serif;
  --f-mono:'Geist Mono',ui-monospace,'Cascadia Mono',Consolas,monospace;

  --fs-body:1.125rem;
  --fs-lede:clamp(1.1875rem,1.05rem + .6vw,1.5rem);
  --fs-h1:clamp(2.5rem,1.3rem + 5.6vw,5.75rem);
  --fs-h2:clamp(2.25rem,1.5rem + 3vw,4.25rem);

  --max:82rem;
  --gutter:clamp(1.25rem,4vw,3rem);
  --edge:.75rem;
  --radius:28px;
  --space:clamp(4.5rem,2.8rem + 6.5vw,9rem);
  --header-h:4.5rem;

  --ease-out:cubic-bezier(.16,1,.3,1);
}
@media (min-width:1024px){ :root{ --header-h:5rem; } }
@media (max-width:639px){ :root{ --edge:.5rem; --radius:22px; } }

*,*::before,*::after{ box-sizing:border-box; }
html{
  -webkit-text-size-adjust:100%; text-size-adjust:100%;
  scroll-padding-top:calc(var(--header-h) + 1rem);
  scrollbar-color:var(--navy-600) var(--canvas);
  accent-color:var(--navy);
}
@media (prefers-reduced-motion:no-preference){ html{ scroll-behavior:smooth; } }
body{
  margin:0; background:var(--white); color:var(--ink);
  font-family:var(--f-body); font-size:var(--fs-body); line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
img{ display:block; max-width:100%; height:auto; }
h1,h2,h3,h4{ margin:0; font-weight:600; text-wrap:balance; }
p{ margin:0; text-wrap:pretty; }
ul,ol,dl,dd,figure{ margin:0; padding:0; }
a{ color:inherit; text-underline-offset:.22em; text-decoration-thickness:1px; }
button,input,select,textarea{ font:inherit; color:inherit; }
::selection{ background:var(--plan); color:var(--navy-950); }
:focus-visible{ outline:3px solid var(--gold); outline-offset:3px; border-radius:6px; }

.sprite{ position:absolute; width:0; height:0; overflow:hidden; }
.sr-only{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0; }
.icon{ width:1.2em; height:1.2em; flex:none; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
@media (min-width:640px){ .nb{ white-space:nowrap; } }
.wrap{ width:100%; max-width:var(--max); margin-inline:auto; padding-inline:var(--gutter); }
.hours,.phones a,.footer-contact a,.header-phone,.readout-value{ font-variant-numeric:tabular-nums lining-nums; }

.skip{ position:absolute; left:1rem; top:-4rem; z-index:100; background:var(--navy); color:#fff; padding:.75rem 1.25rem; border-radius:999px; font-weight:600; text-decoration:none; transition:top .2s var(--ease-out); }
.skip:focus{ top:1rem; }

.h-display,.hero h1,.meet-copy h2,.sec-head h2,.why-head h2,.book-card h2{
  font-family:var(--f-display); font-stretch:80%; font-weight:650; letter-spacing:-.028em; line-height:.96;
}
.meet-copy h2,.sec-head h2,.why-head h2,.book-card h2{ font-size:var(--fs-h2); line-height:1; }

/* ---------- buttons & links ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.6rem;
  min-height:3.25rem; padding:.85rem 1.6rem; border:1.5px solid transparent; border-radius:999px;
  font-family:var(--f-body); font-size:1.0625rem; font-weight:650; line-height:1.15; white-space:nowrap;
  text-decoration:none; cursor:pointer;
  transition:background-color .2s ease,border-color .2s ease,color .2s ease,transform .15s ease,box-shadow .2s ease;
}
.btn:active{ transform:scale(.98); }
.btn .icon{ transition:transform .3s var(--ease-out); }
.btn:hover .icon:last-child:not(:first-child){ transform:translateX(3px); }
.btn-primary{ background:var(--navy); color:#fff; box-shadow:0 10px 24px -14px rgba(15,23,38,.8); }
.btn-primary:hover{ background:var(--navy-700); }
.btn-primary .icon{ color:var(--gold-hi); }
.btn-outline{ border-color:rgba(31,44,68,.28); color:var(--ink); background:rgba(255,255,255,.55); }
.btn-outline:hover{ border-color:var(--ink); background:#fff; }
.btn-gold{ background:var(--gold); color:var(--navy-950); }
.btn-gold:hover{ background:var(--gold-hi); }
.btn-sm{ min-height:2.75rem; padding:.55rem 1.2rem; font-size:.96875rem; }
.btn[disabled],.btn[aria-busy="true"]{ opacity:.65; cursor:progress; }

.text-link{
  display:inline-flex; align-items:center; gap:.5rem; font-weight:650; color:var(--ink);
  text-decoration:underline; text-decoration-color:color-mix(in srgb,currentColor 35%,transparent); text-underline-offset:.3em;
}
.text-link .icon{ transition:transform .3s var(--ease-out); color:var(--gold-ink); }
.text-link:hover{ text-decoration-color:currentColor; }
.text-link:hover .icon{ transform:translateX(3px); }
.text-link--light,.text-link--light .icon{ color:var(--gold-hi); }

/* ---------- header ---------- */
.site-header{ position:sticky; top:0; z-index:50; background:#fff; transition:box-shadow .3s ease; }
.site-header.is-scrolled{ box-shadow:0 1px 0 var(--line),0 12px 30px -24px rgba(15,23,38,.5); }
.header-bar{
  max-width:calc(var(--max) + 2 * var(--edge)); margin-inline:auto;
  padding-inline:calc(var(--gutter) + var(--edge));
  height:var(--header-h); display:flex; align-items:center; gap:1.5rem;
}
.brand{ display:flex; align-items:center; gap:.7rem; text-decoration:none; min-width:0; }
.brand-mark{ height:1.8rem; width:auto; }
.brand-text{ display:grid; line-height:1.1; min-width:0; }
.brand-name{ font-family:var(--f-display); font-stretch:85%; font-weight:650; font-size:1.125rem; letter-spacing:-.01em; white-space:nowrap; }
.brand-role{ font-size:.8125rem; font-weight:500; color:var(--ink-2); white-space:nowrap; }
@media (min-width:1024px){ .brand-mark{ height:2.15rem; } .brand-name{ font-size:1.25rem; } }

.primary-nav{ display:none; }
.primary-nav > ul{ display:flex; align-items:center; gap:clamp(1.25rem,2.2vw,2.25rem); list-style:none; padding:0; margin:0; }
.primary-nav a{ display:block; padding:.5rem 0; font-weight:600; font-size:1rem; text-decoration:none; }
.primary-nav > ul > li > a{ background:linear-gradient(var(--gold),var(--gold)) left bottom/0 2px no-repeat; transition:background-size .35s var(--ease-out); }
.primary-nav > ul > li > a:hover,.primary-nav a[aria-current="page"]{ background-size:100% 2px; }
.has-sub{ position:relative; display:flex; align-items:center; gap:.15rem; }
.sub-toggle{ display:grid; place-items:center; width:2rem; height:2rem; padding:0; border:0; background:none; color:var(--ink-2); cursor:pointer; border-radius:8px; }
.sub-toggle .icon{ width:1.1rem; height:1.1rem; transition:transform .25s var(--ease-out); }
.sub-toggle[aria-expanded="true"] .icon{ transform:rotate(180deg); }
.sub{
  position:absolute; top:calc(100% + .6rem); left:-1.25rem; min-width:24rem; list-style:none; margin:0;
  padding:.6rem; background:#fff; border-radius:18px; box-shadow:0 0 0 1px var(--line),0 30px 60px -30px rgba(15,23,38,.45);
  opacity:0; visibility:hidden; transform:translateY(8px);
  transition:opacity .2s ease,transform .3s var(--ease-out),visibility 0s linear .3s;
}
.sub a{ padding:.75rem 1rem; border-radius:12px; font-weight:500; }
.sub a:hover{ background:var(--canvas); }
.has-sub:hover .sub,.has-sub:focus-within .sub,.sub-toggle[aria-expanded="true"] + .sub{ opacity:1; visibility:visible; transform:none; transition:opacity .2s ease,transform .3s var(--ease-out); }
.has-sub::after{ content:''; position:absolute; left:0; right:0; top:100%; height:.8rem; }

.header-actions{ margin-left:auto; display:flex; align-items:center; gap:.75rem; }
.header-phone{ display:none; align-items:center; gap:.5rem; font-weight:650; text-decoration:none; padding:.5rem .25rem; }
.header-phone .icon{ color:var(--gold-ink); }
.header-actions .btn{ display:none; }
.menu-toggle,.menu-close{ display:grid; place-items:center; width:2.875rem; height:2.875rem; padding:0; border:1.5px solid var(--line); border-radius:999px; background:#fff; cursor:pointer; }
.menu-toggle .icon,.menu-close .icon{ width:1.35rem; height:1.35rem; }
@media (min-width:640px){ .header-actions .btn{ display:inline-flex; } }
@media (min-width:1024px){ .primary-nav{ display:block; margin-left:auto; } .header-actions{ margin-left:0; } .menu-toggle{ display:none; } }
@media (min-width:1240px){ .header-phone{ display:inline-flex; } }

.menu-sheet{ position:fixed; inset:0; z-index:60; background:#fff; display:flex; flex-direction:column; overflow-y:auto; overscroll-behavior:contain; padding:0 var(--gutter) calc(1.5rem + env(safe-area-inset-bottom)); }
.menu-sheet[hidden]{ display:none; }
.motion .menu-sheet:not([hidden]){ animation:sheet-in .35s var(--ease-out); }
.menu-sheet-top{ height:var(--header-h); display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); }
.menu-links{ list-style:none; padding:1rem 0; margin:0; }
.menu-links > li > a{ display:block; padding:.9rem 0; font-family:var(--f-display); font-stretch:85%; font-weight:650; font-size:1.875rem; letter-spacing:-.02em; text-decoration:none; border-bottom:1px solid var(--line); }
.menu-links ul{ list-style:none; margin:0; padding:.5rem 0 .75rem; border-bottom:1px solid var(--line); }
.menu-links ul a{ display:block; padding:.55rem 0; color:var(--ink-2); text-decoration:none; font-size:1.0625rem; }
.menu-sheet-actions{ display:grid; gap:.75rem; margin-top:auto; padding-top:1.5rem; }
@keyframes sheet-in{ from{ opacity:0; transform:translateY(-10px); } to{ opacity:1; transform:none; } }

/* ---------- panels ---------- */
.hero,.marquee,.care,.why,.site-footer{ margin:0 var(--edge) var(--edge); border-radius:var(--radius); }

/* ---------- hero: the planning canvas ---------- */
.hero{ position:relative; background:var(--canvas); isolation:isolate; }
.hero::before{
  content:''; position:absolute; inset:0; z-index:-1; pointer-events:none; border-radius:inherit;
  background-image:linear-gradient(to right,rgba(31,44,68,.07) 1px,transparent 1px),linear-gradient(to bottom,rgba(31,44,68,.07) 1px,transparent 1px);
  background-size:44px 44px; background-position:-1px -1px;
  -webkit-mask-image:linear-gradient(100deg,transparent 18%,#000 62%); mask-image:linear-gradient(100deg,transparent 18%,#000 62%);
}
.canvas{
  max-width:var(--max); margin-inline:auto; padding:clamp(2rem,5vw,3.25rem) var(--gutter) clamp(2.5rem,5vw,3.25rem);
  display:grid; gap:2.75rem;
}
.hero h1{ font-size:var(--fs-h1); }
.h1-line{ display:block; overflow:hidden; padding-bottom:.08em; margin-bottom:-.08em; }
.h1-line > span{ display:inline-block; max-width:100%; }
.lede{ margin-top:1.5rem; font-size:var(--fs-lede); line-height:1.5; color:var(--ink-2); max-width:34ch; }
.cta-row{ display:flex; flex-wrap:wrap; gap:.75rem; margin-top:2rem; }
.opd{ display:flex; align-items:flex-start; gap:.6rem; margin-top:1.1rem; font-size:1rem; line-height:1.45; color:var(--ink-2); }
.opd strong{ color:var(--ink); font-weight:650; }
.opd-dot{ position:relative; width:.6rem; height:.6rem; margin-top:.42em; border-radius:50%; background:#9AA3B2; flex:none; }
.opd.is-open .opd-dot{ background:var(--gold); }
.motion .opd.is-open .opd-dot::after{ content:''; position:absolute; inset:-5px; border-radius:50%; border:2px solid var(--gold); animation:ping 2.4s var(--ease-out) infinite; }
@keyframes ping{ from{ transform:scale(.6); opacity:.9; } to{ transform:scale(1.9); opacity:0; } }
.creds{ display:flex; flex-wrap:wrap; gap:.5rem; margin-top:2rem; list-style:none; }
.creds li{ display:inline-flex; align-items:center; gap:.45rem; padding:.5rem .9rem; border-radius:999px; background:#fff; box-shadow:0 0 0 1px var(--line); font-size:.9375rem; font-weight:550; line-height:1.25; }
.creds .icon{ width:1rem; height:1rem; color:var(--gold-ink); stroke-width:2.4; }

.plan{ position:relative; justify-self:center; width:min(100%,25rem); }
.plan-view{ position:relative; overflow:hidden; border-radius:22px; background:var(--navy-950); color:var(--on-dark); box-shadow:0 0 0 1px rgba(15,23,38,.12),0 40px 70px -40px rgba(15,23,38,.65); }
.plan-view--hero{ width:100%; aspect-ratio:900/1201; }
.plan-view .film{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.plan-svg{ position:absolute; inset:0; width:100%; height:100%; overflow:visible; }
.plan-bar{
  position:absolute; z-index:3; top:0; left:0; right:0; display:flex; justify-content:space-between; gap:1rem;
  padding:.9rem 1rem 1.6rem; font-family:var(--f-mono); font-size:.6875rem; font-weight:500; letter-spacing:.06em; text-transform:uppercase;
  color:var(--on-dark); background:linear-gradient(rgba(15,23,38,.92),rgba(15,23,38,0)); pointer-events:none;
}
.plan-bar .tag{ color:var(--plan); white-space:nowrap; }
.plan-label{ min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.pl{ fill:none; stroke:var(--plan); stroke-width:4; stroke-linecap:round; stroke-linejoin:round; }
.pl-guide{ stroke-width:3.5; }
.pl-soft{ stroke-dasharray:10 12; stroke-width:3; opacity:.75; }
.pl-node{ fill:var(--navy-950); stroke:var(--plan); stroke-width:4; }
.pl-dot{ fill:var(--plan); }
.readout{
  position:absolute; z-index:3; left:.9rem; top:3rem; display:grid; gap:.1rem; padding:.55rem .8rem .6rem;
  border-radius:12px; background:rgba(15,23,38,.82); box-shadow:inset 0 0 0 1px rgba(217,193,148,.35);
}
.readout-label{ font-family:var(--f-mono); font-size:.6875rem; letter-spacing:.06em; text-transform:uppercase; color:var(--on-dark-2); }
.readout-value{ font-family:var(--f-mono); font-size:1.375rem; font-weight:500; line-height:1.15; color:var(--plan); }
.callout{
  position:absolute; z-index:3; left:var(--x); top:var(--y); transform:translate(var(--tx),var(--ty));
  display:none; width:max-content; max-width:min(44%,15rem); padding:.5rem .75rem; border-radius:10px;
  background:#fff; color:var(--ink); font-size:.875rem; font-weight:650; line-height:1.3;
  box-shadow:0 14px 28px -14px rgba(0,0,0,.75);
}
.surgeon-chip{
  position:relative; z-index:4; display:flex; align-items:center; gap:.75rem;
  width:max-content; max-width:100%; margin:-1.75rem auto 0; padding:.55rem 1.1rem .55rem .55rem;
  border-radius:999px; background:#fff; box-shadow:0 0 0 1px var(--line),0 22px 44px -22px rgba(15,23,38,.55);
}
.surgeon-chip img{ width:3.25rem; height:3.25rem; border-radius:50%; }
.surgeon-chip p{ display:grid; line-height:1.25; }
.surgeon-label{ font-size:.75rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--gold-ink); }
.surgeon-chip strong{ font-family:var(--f-display); font-stretch:85%; font-weight:650; font-size:1.0625rem; }
.surgeon-chip span:last-child{ font-size:.875rem; color:var(--ink-2); }
.callout-list{ list-style:none; display:grid; gap:.6rem; margin-top:1.5rem; }
.callout-list li{ position:relative; padding-left:1.4rem; font-weight:550; }
.callout-list li::before{ content:''; position:absolute; left:0; top:.55em; width:.6rem; height:.6rem; border-radius:50%; border:2px solid var(--gold); }

@media (max-width:1023px){
  .canvas{ gap:0; grid-template-columns:minmax(0,1fr); }
  .hero-copy{ display:contents; }
  .plan{ order:1; margin-top:2.75rem; }
  .creds{ order:2; }
}
@media (max-width:639px){
  .cta-row .btn{ flex:1 1 15rem; }
  .plan-bar{ padding:.75rem .8rem 1.4rem; letter-spacing:.03em; }
}
@media (max-width:400px){ .btn{ white-space:normal; text-align:center; } }
@media (min-width:640px){
  .callout{ display:block; }
  .callout-list{ display:none; }
  .plan{ width:min(100%,27rem); }
}
@media (min-width:1024px){
  .canvas{ grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:clamp(2rem,5vw,5rem); min-height:calc(100svh - var(--header-h) - var(--edge)); }
  .plan{ width:auto; }
  .plan-view--hero{ width:auto; height:min(44rem,calc(100svh - var(--header-h) - 7rem)); }
  .surgeon-chip{ position:absolute; left:-2.75rem; bottom:2.25rem; margin:0; }
}

/* ---------- marquee ---------- */
.marquee{ background:var(--navy); color:var(--on-dark); overflow:hidden; padding:clamp(1.35rem,2.6vw,2.1rem) 0; }
.marquee-track{ display:flex; width:max-content; }
.marquee-group{ display:flex; align-items:center; gap:clamp(1.25rem,2.6vw,2.75rem); padding-right:clamp(1.25rem,2.6vw,2.75rem); list-style:none; }
.marquee li{ font-family:var(--f-display); font-stretch:85%; font-weight:600; font-size:clamp(1.5rem,1rem + 2vw,2.75rem); letter-spacing:-.02em; white-space:nowrap; line-height:1.1; }
.marquee .sep-icon{ width:1.6rem; height:1.6rem; color:var(--gold); stroke-width:1.6; }
.motion .marquee-track{ animation:marquee 46s linear infinite; }
.marquee:hover .marquee-track{ animation-play-state:paused; }
@keyframes marquee{ to{ transform:translateX(-50%); } }
html:not(.motion) .marquee-track{ width:auto; flex-wrap:wrap; justify-content:center; padding-inline:var(--gutter); }
html:not(.motion) .marquee-group[aria-hidden="true"]{ display:none; }
html:not(.motion) .marquee-group{ flex-wrap:wrap; justify-content:center; row-gap:.5rem; }

/* ---------- meet ---------- */
.meet{ padding:var(--space) 0; }
.meet-grid{ display:grid; gap:3rem; }
.portrait{ position:relative; }
.portrait-panel{
  position:relative; aspect-ratio:4/5; overflow:hidden; border-radius:var(--radius);
  background:radial-gradient(120% 75% at 50% 18%,var(--navy-600),var(--navy) 55%,var(--navy-950));
}
.portrait-panel img{ position:absolute; left:50%; bottom:0; width:100%; max-width:none; transform:translateX(-50%); }
.portrait-tag{ position:absolute; left:1.25rem; bottom:1.25rem; display:grid; gap:.1rem; padding:.75rem 1.1rem; border-radius:16px; background:#fff; box-shadow:0 20px 40px -24px rgba(15,23,38,.6); line-height:1.3; }
.portrait-tag strong{ font-family:var(--f-display); font-stretch:85%; font-weight:650; font-size:1.125rem; }
.portrait-tag span{ font-size:.9375rem; color:var(--ink-2); }
.meet-copy .lede-ink{ margin-top:1.75rem; font-size:var(--fs-lede); line-height:1.5; color:var(--ink); }
.meet-copy > p:not(.lede-ink){ margin-top:1.25rem; font-size:1.125rem; color:var(--ink-2); max-width:56ch; }
.meet-copy .btn{ margin-top:2.25rem; }
@media (min-width:1024px){
  .meet-grid{ grid-template-columns:minmax(0,6fr) minmax(0,6fr); gap:clamp(3rem,6vw,6.5rem); align-items:center; }
  .portrait-panel{ aspect-ratio:auto; height:min(44rem,calc(100svh - var(--header-h) - 4rem)); min-height:34rem; }
}

/* ---------- care: service chapters ---------- */
.care{ background:var(--canvas); padding:var(--space) 0; }
.sec-head{ display:grid; gap:1.25rem; margin-bottom:clamp(2.5rem,5vw,4.5rem); }
.sec-head p{ color:var(--ink-2); max-width:52ch; }
@media (min-width:1024px){
  .sec-head{ grid-template-columns:minmax(0,7fr) minmax(0,5fr); align-items:end; gap:4rem; }
  .sec-head p{ justify-self:end; }
}
.chapters{ display:grid; }
.viewer-col{ display:none; }
.chapter{ padding:2.75rem 0; border-top:1px solid var(--line); }
.chapter:first-child{ border-top:0; padding-top:0; }
.plan-view--inline{ width:min(100%,22rem); aspect-ratio:3/4; margin-bottom:1.75rem; }
.chapter h3{ font-family:var(--f-display); font-stretch:82%; font-weight:650; font-size:clamp(1.875rem,1.35rem + 1.7vw,2.75rem); line-height:1.04; letter-spacing:-.025em; }
.chapter-hint{ margin-top:.6rem; font-size:1.0625rem; font-weight:550; color:var(--gold-ink); }
.chapter-desc{ margin-top:1.1rem; color:var(--ink-2); max-width:58ch; }
.chapter h4{ margin-top:1.75rem; font-size:1rem; font-weight:700; }
.checks{ list-style:none; display:grid; gap:.65rem; margin-top:.9rem; }
.checks li{ display:flex; gap:.65rem; align-items:flex-start; line-height:1.45; }
.checks li::before{
  content:''; flex:none; width:1.25rem; height:1.25rem; margin-top:.05rem; border-radius:50%;
  background:var(--navy) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23D9C194' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/.75rem no-repeat;
}
.chapter .text-link{ margin-top:1.75rem; }
@media (min-width:640px){ .checks{ grid-template-columns:repeat(2,minmax(0,1fr)); column-gap:2rem; } }
@media (min-width:1024px){
  .chapters{ grid-template-columns:minmax(0,5fr) minmax(0,7fr); gap:clamp(3rem,6vw,6.5rem); }
  .viewer-col{ display:block; }
  .viewer{ position:sticky; top:calc(var(--header-h) + 1.5rem); display:flex; gap:1rem; align-items:flex-start; }
  .plan-view--sticky{ flex:1; aspect-ratio:3/4; max-height:calc(100svh - var(--header-h) - 3rem); }
  .plan-view--inline{ display:none; }
  .chapter{ min-height:min(46rem,78svh); display:flex; flex-direction:column; justify-content:center; padding:4rem 0; }
  .chapter:first-child{ padding-top:2rem; }
  .chapters.is-live .chapter{ opacity:.72; transition:opacity .5s ease; }
  .chapters.is-live .chapter.is-active{ opacity:1; }
}
.vlayer{ position:absolute; inset:0; opacity:0; transition:opacity .7s ease; }
.vlayer.is-active{ opacity:1; }
.vlayer .film{ transform:scale(1.05); transition:transform 1.4s var(--ease-out); }
.vlayer.is-active .film{ transform:none; }
.vlayer .pl:not(.pl-soft){ stroke-dasharray:1; stroke-dashoffset:1; transition:stroke-dashoffset 1.15s var(--ease-out) .25s; }
.vlayer.is-active .pl:not(.pl-soft){ stroke-dashoffset:0; }
.vlayer .pl-soft,.vlayer .pl-node{ opacity:0; transition:opacity .6s ease .7s; }
.vlayer.is-active .pl-soft{ opacity:.75; }
.vlayer.is-active .pl-node{ opacity:1; }
.vticks{ list-style:none; display:grid; gap:.35rem; padding-top:3.25rem; }
.vtick{ display:grid; place-items:center; width:1.5rem; height:2.75rem; padding:0; border:0; background:none; cursor:pointer; }
.vtick::before{ content:''; width:.35rem; height:100%; border-radius:999px; background:rgba(31,44,68,.18); transition:background-color .3s ease,transform .3s var(--ease-out); }
.vtick:hover::before{ background:rgba(31,44,68,.4); }
.vtick[aria-current="true"]::before{ background:var(--navy); }
.motion .plan-view--inline .pl:not(.pl-soft){ stroke-dasharray:1; stroke-dashoffset:1; transition:stroke-dashoffset 1.15s var(--ease-out) .2s; }
.motion .plan-view--inline.is-in .pl:not(.pl-soft){ stroke-dashoffset:0; }

/* ---------- why ---------- */
.why{ background:var(--navy); color:var(--on-dark); padding:var(--space) 0; }
.why-grid{ display:grid; gap:3rem; }
.why-head p{ margin-top:1.25rem; font-size:var(--fs-lede); line-height:1.5; color:var(--on-dark-2); max-width:38ch; }
.why-photo{ margin-top:2.5rem; aspect-ratio:4/3; overflow:hidden; border-radius:22px; }
.why-photo img{ width:100%; height:100%; object-fit:cover; }
.why-list{ list-style:none; }
.why-list li{ position:relative; display:grid; gap:.6rem; padding:2rem 0; }
.why-list li::before{ content:''; position:absolute; left:0; right:0; top:0; height:1px; background:rgba(244,241,236,.2); transform-origin:left; }
.why-list li::after{ content:''; position:absolute; left:0; top:-1px; width:3rem; height:3px; border-radius:3px; background:var(--gold); transform-origin:left; }
.why-list h3{ font-family:var(--f-display); font-stretch:85%; font-weight:600; font-size:clamp(1.375rem,1.2rem + .7vw,1.75rem); line-height:1.2; letter-spacing:-.015em; }
.why-list p{ color:var(--on-dark-2); max-width:56ch; }
@media (min-width:1024px){
  .why-grid{ grid-template-columns:minmax(0,5fr) minmax(0,7fr); gap:clamp(3rem,6vw,6.5rem); align-items:start; }
  .why-head{ position:sticky; top:calc(var(--header-h) + 2rem); }
  .why-list li{ grid-template-columns:minmax(0,17rem) minmax(0,1fr); gap:2.5rem; padding:2.5rem 0; }
}

/* ---------- steps ---------- */
.steps-sec{ padding:var(--space) 0; }
.steps{ list-style:none; display:grid; gap:2.75rem 1.5rem; position:relative; }
.step figure{ aspect-ratio:4/5; overflow:hidden; border-radius:22px; background:var(--canvas); }
.step figure img{ width:100%; height:100%; object-fit:cover; transition:transform 1s var(--ease-out); }
.step:hover figure img{ transform:scale(1.05); }
.step-no{ display:block; margin-top:1.25rem; font-family:var(--f-mono); font-size:.875rem; font-weight:500; letter-spacing:.04em; color:var(--gold-ink); }
.step h3{ margin-top:.4rem; font-family:var(--f-display); font-stretch:85%; font-weight:650; font-size:1.5rem; line-height:1.15; letter-spacing:-.015em; }
.step p{ margin-top:.45rem; color:var(--ink-2); }
@media (min-width:640px){ .steps{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (min-width:1024px){
  .steps{ grid-template-columns:repeat(4,minmax(0,1fr)); padding-top:2.75rem; }
  .steps::before,.steps::after{ content:''; position:absolute; left:0; right:0; top:.55rem; height:2px; border-radius:2px; }
  .steps::before{ background:var(--line); }
  .steps::after{ background:var(--gold); transform-origin:left; transform:scaleX(var(--fill,1)); transition:transform 1.6s var(--ease-out); }
  .step{ position:relative; }
  .step::before{ content:''; position:absolute; left:0; top:-2.65rem; width:.9rem; height:.9rem; border-radius:50%; background:#fff; box-shadow:inset 0 0 0 2px var(--gold); transition:background-color .4s ease; }
  .motion .steps:not(.is-in){ --fill:0; }
  .motion .steps:not(.is-in) .step::before{ background:#fff; }
  .steps .step::before{ background:var(--gold); }
  .motion .steps.is-in .step:nth-child(2)::before{ transition-delay:.4s; }
  .motion .steps.is-in .step:nth-child(3)::before{ transition-delay:.8s; }
  .motion .steps.is-in .step:nth-child(4)::before{ transition-delay:1.2s; }
}

/* ---------- book ---------- */
.book{ padding:var(--space) 0; }
.book-grid{ display:grid; gap:1.25rem; }
.book-card{ background:var(--canvas); border-radius:24px; padding:clamp(1.5rem,4vw,3.25rem); }
.book-sub{ margin-top:1rem; color:var(--ink-2); }
.form-grid{ display:grid; gap:1.35rem 1.25rem; margin-top:2.25rem; }
.field{ display:grid; gap:.5rem; min-width:0; margin:0; padding:0; border:0; }
.field > *,.book-grid > *,.form-grid > *{ min-width:0; }
.field-label{ padding:0; font-size:.9375rem; font-weight:650; color:var(--ink); }
.field input,.field select,.field textarea{
  width:100%; min-height:3.25rem; padding:.75rem 1rem; border:1.5px solid var(--field-line); border-radius:14px;
  background:#fff; font-size:1.0625rem; color:var(--ink); caret-color:var(--navy);
  transition:border-color .2s ease,box-shadow .2s ease;
}
.field input::placeholder{ color:#6B7488; }
.field select{
  appearance:none; padding-right:2.75rem; cursor:pointer;
  background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231F2C44' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") right 1rem center/1.1rem no-repeat;
}
.field textarea{ min-height:7rem; resize:vertical; }
.field input:hover,.field select:hover,.field textarea:hover{ border-color:var(--ink); }
.field input:focus,.field select:focus,.field textarea:focus{ outline:none; border-color:var(--navy); box-shadow:0 0 0 4px rgba(168,146,110,.4); }
.field [aria-invalid="true"]{ border-color:var(--error); box-shadow:0 0 0 3px rgba(162,64,44,.18); }
.field-error{ font-size:.9375rem; font-weight:650; color:var(--error); }
.chip-row{ display:flex; flex-wrap:wrap; gap:.5rem; }
.chip-opt{ position:relative; display:inline-flex; }
.chip-opt input{ position:absolute; inset:0; width:100%; height:100%; margin:0; opacity:0; cursor:pointer; }
.chip-opt span{ display:inline-flex; align-items:center; min-height:2.875rem; padding:.55rem 1.1rem; border-radius:999px; border:1.5px solid var(--field-line); font-weight:550; font-size:1rem; line-height:1.25; transition:background-color .2s ease,border-color .2s ease,color .2s ease; }
.chip-opt:hover span{ border-color:var(--ink); }
.chip-opt input:checked + span{ background:var(--navy); border-color:var(--navy); color:#fff; }
.chip-opt input:focus-visible + span{ outline:3px solid var(--gold); outline-offset:2px; }
.chips.is-invalid .chip-opt span{ border-color:var(--error); }
.form-foot{ display:flex; flex-wrap:wrap; align-items:center; gap:1rem 1.5rem; margin-top:2rem; }
.form-note{ color:var(--ink-2); font-size:1rem; }
.form-note a{ color:var(--ink); font-weight:700; white-space:nowrap; }
.form-status:empty{ display:none; }
.form-status{ margin-top:1.25rem; padding:1rem 1.15rem; border-radius:14px; background:var(--navy-50); font-size:1rem; line-height:1.5; }
.form-status.is-error{ background:#F6E9E5; color:#7E2F20; }
.form-status a{ font-weight:700; }
.form-status .status-actions{ display:flex; flex-wrap:wrap; gap:.5rem 1.25rem; margin-top:.5rem; }
@media (min-width:640px){ .form-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); } .field--wide{ grid-column:1 / -1; } }

.clinic-card{ display:grid; gap:1.6rem; align-content:start; background:var(--navy); color:var(--on-dark); border-radius:24px; padding:clamp(1.5rem,3.5vw,2.75rem); }
.clinic-card h3{ font-family:var(--f-display); font-stretch:85%; font-weight:650; font-size:clamp(1.75rem,1.4rem + 1vw,2.25rem); letter-spacing:-.02em; }
.clinic-row{ display:flex; gap:.75rem; align-items:flex-start; }
.clinic-row > .icon{ margin-top:.2rem; color:var(--gold-hi); }
.clinic-row .text-link{ margin-top:.4rem; }
.hours{ width:100%; border-collapse:collapse; }
.hours caption{ text-align:left; padding-bottom:.5rem; font-size:.8125rem; font-weight:700; letter-spacing:.07em; text-transform:uppercase; color:var(--gold-hi); }
.hours th,.hours td{ padding:.8rem 0; border-top:1px solid rgba(244,241,236,.16); font-weight:400; text-align:left; }
.hours td{ text-align:right; white-space:nowrap; }
.hours tr:last-child th,.hours tr:last-child td{ border-bottom:1px solid rgba(244,241,236,.16); }
.hours tr.is-today th,.hours tr.is-today td{ font-weight:700; color:#fff; }
.hours tr.is-today th::after{ content:'Today'; margin-left:.6rem; padding:.15rem .5rem; border-radius:999px; background:var(--gold); color:var(--navy-950); font-size:.75rem; font-weight:700; vertical-align:.1em; }
.phones{ list-style:none; display:grid; gap:1.1rem; }
.phones span{ display:block; font-size:.8125rem; font-weight:700; letter-spacing:.07em; text-transform:uppercase; color:var(--on-dark-2); }
.phones a{ display:inline-flex; align-items:center; gap:.55rem; margin-top:.15rem; font-size:1.1875rem; font-weight:650; text-decoration:none; overflow-wrap:anywhere; }
.phones a:hover{ text-decoration:underline; text-decoration-color:var(--gold); }
.phones .icon{ color:var(--gold-hi); }
.clinic-card .btn-gold{ justify-self:start; }
.clinic-card .btn-gold .icon{ width:1.3em; height:1.3em; }
@media (max-width:400px){
  .hours tr{ display:grid; padding:.7rem 0; border-top:1px solid rgba(244,241,236,.16); }
  .hours tr:last-child{ border-bottom:1px solid rgba(244,241,236,.16); }
  .hours th,.hours td,.hours tr:last-child th,.hours tr:last-child td{ display:block; padding:0; border:0; text-align:left; }
}
@media (min-width:1024px){ .book-grid{ grid-template-columns:minmax(0,7fr) minmax(0,5fr); } }

/* ---------- footer ---------- */
.site-footer{ background:var(--navy-950); color:var(--on-dark-2); padding:clamp(3.5rem,7vw,6rem) 0 2rem; }
.footer-top{ display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:1.75rem 3rem; padding-bottom:clamp(2.5rem,5vw,4rem); }
.footer-tag{ font-family:var(--f-display); font-stretch:78%; font-weight:650; font-size:clamp(2.75rem,1.4rem + 5vw,6rem); line-height:.94; letter-spacing:-.03em; color:var(--on-dark); max-width:15ch; }
.footer-grid{ display:grid; gap:2.5rem; padding-top:3rem; border-top:1px solid rgba(244,241,236,.12); }
.footer-brand img{ width:12.5rem; }
.footer-col h2{ font-size:.8125rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--on-dark); margin-bottom:1rem; }
.footer-col ul{ list-style:none; display:grid; gap:.7rem; }
.footer-col a{ text-decoration:none; }
.footer-col a:hover{ color:var(--on-dark); text-decoration:underline; text-decoration-color:var(--gold); }
.footer-contact li{ display:flex; gap:.6rem; align-items:flex-start; }
.footer-contact a{ display:inline-flex; gap:.6rem; align-items:center; overflow-wrap:anywhere; }
.footer-contact .icon{ color:var(--gold-hi); }
.footer-contact li > .icon{ margin-top:.2rem; }
.footer-base{ display:flex; flex-wrap:wrap; justify-content:space-between; gap:.5rem 2rem; margin-top:3rem; padding-top:1.5rem; border-top:1px solid rgba(244,241,236,.12); font-size:.9375rem; }
@media (min-width:768px){ .footer-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (min-width:1100px){ .footer-grid{ grid-template-columns:minmax(0,1fr) minmax(0,1.25fr) minmax(0,.8fr) minmax(0,1.1fr); } }

/* ---------- mobile action bar ---------- */
.action-bar{
  position:fixed; z-index:40; left:.75rem; right:.75rem; bottom:calc(.75rem + env(safe-area-inset-bottom));
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.4rem; padding:.4rem;
  background:rgba(15,23,38,.97); border-radius:999px; box-shadow:0 18px 40px -12px rgba(0,0,0,.6);
  transform:translateY(calc(100% + 1.5rem)); transition:transform .4s var(--ease-out);
}
.action-bar.is-visible{ transform:none; }
.action-bar a{ display:flex; align-items:center; justify-content:center; gap:.45rem; min-height:3rem; border-radius:999px; text-decoration:none; color:var(--on-dark); font-weight:650; font-size:1rem; }
.action-bar a.is-primary{ background:var(--gold); color:var(--navy-950); }
.action-bar .icon{ width:1.2rem; height:1.2rem; }
@media (max-width:767px){ .site-footer{ padding-bottom:calc(6.5rem + env(safe-area-inset-bottom)); } }
@media (min-width:768px){ .action-bar{ display:none; } }

/* ---------- intro loader: a knee film scanned in, then planned ---------- */
.loader{ display:none; }
.loading .loader{
  position:fixed; inset:0; z-index:200; display:grid; place-content:center; justify-items:center; gap:1.5rem;
  background:var(--navy-950); color:var(--on-dark); clip-path:inset(0 0 0 0);
}
.loader.is-done{ clip-path:inset(0 0 100% 0); transition:clip-path .9s cubic-bezier(.7,0,.2,1); }
.loader-film{
  position:relative; width:min(52vw,14rem); aspect-ratio:900/1198; overflow:hidden; border-radius:18px; background:#05080F;
  box-shadow:0 0 0 1px rgba(217,193,148,.25),0 30px 60px -30px rgba(0,0,0,.9);
}
.loader-film img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; clip-path:inset(0 0 100% 0); }
.loader.is-ready .loader-film img{ animation:scan-reveal 1.05s .05s cubic-bezier(.45,0,.2,1) forwards; }
.loader-scan{ position:absolute; z-index:2; left:-10%; right:-10%; top:0; height:2px; background:var(--plan); box-shadow:0 0 18px 4px rgba(217,193,148,.55); }
.loader.is-ready .loader-scan{ animation:scan-line 1.05s .05s cubic-bezier(.45,0,.2,1) forwards; }
.loader .pl{ stroke-width:8; stroke-dasharray:1; stroke-dashoffset:1; }
.loader .pl-node{ stroke-width:7; opacity:0; }
.loader.is-ready .pl{ animation:draw .8s var(--ease-out) forwards; }
.loader.is-ready .pl-axis{ animation-delay:1s; }
.loader.is-ready .pl-dim{ animation-delay:1.2s; }
.loader.is-ready .pl-node{ animation:fade .4s 1.35s forwards; }
.loader-meta{ display:flex; gap:.75rem; margin:0; font-family:var(--f-mono); font-size:.75rem; letter-spacing:.08em; text-transform:uppercase; color:var(--on-dark-2); }
.loader-pct{ min-width:4ch; text-align:right; color:var(--plan); font-variant-numeric:tabular-nums; }
@keyframes scan-reveal{ to{ clip-path:inset(0 0 0 0); } }
@keyframes scan-line{ from{ top:0; } 92%{ opacity:1; } to{ top:100%; opacity:0; } }
.intro-hold .hero *,.intro-hold .hero *::before,.intro-hold .hero *::after,.intro-hold .hero{ animation-play-state:paused !important; }

/* ---------- motion ---------- */
@keyframes rise{ from{ transform:translateY(108%); } to{ transform:none; } }
@keyframes fade-up{ from{ opacity:0; transform:translateY(18px); } to{ opacity:1; transform:none; } }
@keyframes wipe{ from{ clip-path:inset(100% 0 0 0 round 22px); } to{ clip-path:inset(0 0 0 0 round 22px); } }
@keyframes settle{ from{ transform:scale(1.12); } to{ transform:none; } }
@keyframes draw{ from{ stroke-dashoffset:1; } to{ stroke-dashoffset:0; } }
@keyframes fade{ from{ opacity:0; } to{ opacity:1; } }
@keyframes callout-in{ from{ opacity:0; transform:translate(var(--tx),var(--ty)) translateY(10px) scale(.96); } to{ opacity:1; transform:translate(var(--tx),var(--ty)); } }
@keyframes reveal-failsafe{ to{ opacity:1; transform:none; clip-path:none; } }

.motion .h1-line > span{ animation:rise 1.1s var(--ease-out) both; animation-delay:calc(.12s + var(--i) * .1s); }
.motion .hero .lede{ animation:fade-up .9s .38s var(--ease-out) both; }
.motion .hero .cta-row{ animation:fade-up .9s .48s var(--ease-out) both; }
.motion .hero .opd{ animation:fade-up .9s .56s var(--ease-out) both; }
.motion .hero .creds{ animation:fade-up .9s .64s var(--ease-out) both; }
.motion .plan-view--hero{ animation:wipe 1.2s .12s var(--ease-out) both; }
.motion .plan-view--hero .film{ animation:settle 2s .12s var(--ease-out) both; }
.motion .plan-view--hero .plan-bar,.motion .plan-view--hero .readout{ animation:fade .7s .9s both; }
.motion .plan-view--hero .pl:not(.pl-soft){ stroke-dasharray:1; animation:draw 1.1s var(--ease-out) both; animation-delay:var(--d,.85s); }
.motion .plan-view--hero .pl-guide{ animation-duration:.8s; }
.motion .plan-view--hero .pl-node,.motion .plan-view--hero .pl-dot{ animation:fade .5s both; animation-delay:var(--d,1.4s); }
.motion .callout{ animation:callout-in .75s var(--ease-out) both; animation-delay:var(--d); }
.motion .surgeon-chip{ animation:fade-up .9s 1.55s var(--ease-out) both; }

.motion [data-reveal]{ transition:opacity .9s var(--ease-out),transform .9s var(--ease-out),clip-path 1.3s var(--ease-out); }
.motion [data-reveal]:not(.is-in){ opacity:0; transform:translateY(28px); animation:reveal-failsafe 0s 4s forwards; }
.motion [data-reveal="draw"]:not(.is-in){ opacity:1; transform:none; }
.motion [data-reveal="mask"]:not(.is-in){ opacity:0; transform:none; clip-path:inset(18% 0 0 0 round var(--radius)); }
.motion [data-reveal="rail"]:not(.is-in){ opacity:1; transform:none; }
.motion [data-reveal="line"]::before,.motion [data-reveal="line"]::after{ transition:transform 1.1s var(--ease-out) .15s; }
.motion [data-reveal="line"]:not(.is-in)::before,.motion [data-reveal="line"]:not(.is-in)::after{ transform:scaleX(0); }
.motion .why-list li:nth-child(2){ transition-delay:.06s; }
.motion .why-list li:nth-child(3){ transition-delay:.12s; }
.motion .why-list li:nth-child(4){ transition-delay:.18s; }
.motion .meet-copy [data-reveal]:nth-child(3){ transition-delay:.06s; }
.motion .meet-copy [data-reveal]:nth-child(4){ transition-delay:.12s; }
.motion .sec-head [data-reveal]:nth-child(2){ transition-delay:.08s; }

@supports (animation-timeline:view()){
  .motion .portrait-panel img{ animation:drift linear both; animation-timeline:view(); animation-range:entry 0% exit 100%; }
  @keyframes drift{ from{ transform:translate(-50%,7%); } to{ transform:translate(-50%,-3%); } }
  .motion .why-photo img{ animation:zoom-out linear both; animation-timeline:view(); animation-range:entry 0% cover 60%; }
  @keyframes zoom-out{ from{ transform:scale(1.14); } to{ transform:scale(1); } }
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{ animation-duration:.01ms !important; animation-iteration-count:1 !important; animation-delay:0s !important; transition-duration:.01ms !important; transition-delay:0s !important; }
}