/* Layout: patient journey top to bottom.
   Hero > proof > what are you noticing > cataract guide (4 steps: self-test, before/after simulator, lens finder, surgery day)
   > reviews > surgeons > offices > request > patient tools + FAQ. Dark, single-theme by choice. */
:root{
  --void:#05080f; --surface:#0a1019; --raise:rgba(255,255,255,.035); --raise-2:rgba(255,255,255,.07);
  --hair:rgba(255,255,255,.13); --pearl:#eef3f7; --mist:#b6c3d0;
  --teal:#19a7a8; --aqua:#7fe8dc; --gold:var(--sky); --goldtext:var(--sky); --rose:#ff8a7a; --okc:#4ade80;
  --navbg:rgba(5,8,15,.88); --btntext:#05080f;
  --serif:"Instrument Serif", "Iowan Old Style", Georgia, serif;
  --sans:"Geist", "Helvetica Neue", system-ui, sans-serif;
  --max:1200px; color-scheme:dark;
}
/* Light look, chosen by the visitor in Display settings */
html[data-look="light"]{
  --void:#f4f6f7; --surface:#ffffff; --raise:#ffffff; --raise-2:#eef2f4;
  --hair:rgba(10,20,30,.14); --pearl:#0c1520; --mist:#45525f;
  --teal:#0f7c7d; --aqua:#0f6f73; --goldtext:#8a5300; --rose:#b3261e; --okc:#15803d;
  --navbg:rgba(244,246,247,.92); color-scheme:light;
}
html[data-look="light"] .card{box-shadow:0 1px 2px rgba(10,20,30,.05)}
/* Text size, chosen by the visitor */
html[data-size="l"]{font-size:112.5%}
html[data-size="xl"]{font-size:125%}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:130px}
body{background:var(--void);color:var(--pearl);font:400 1.0625rem/1.65 var(--sans);overflow-x:hidden;-webkit-font-smoothing:antialiased}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:50;background:var(--void)}
.gut{padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.wrap{max-width:var(--max);margin:0 auto}
h1,h2,h3{margin:0;font-weight:600;letter-spacing:-.03em;text-wrap:balance;line-height:1.05}
h2{font-size:clamp(2rem,4.8vw,3.6rem)}
h3{font-size:1.3rem;letter-spacing:-.02em}
p{margin:0}
a{color:inherit}
:focus-visible{outline:3px solid var(--gold);outline-offset:3px;border-radius:8px}
.label{font:600 .9rem/1.3 var(--sans);color:var(--goldtext);display:block}
.lede{color:var(--mist);font-size:1.12rem;max-width:58ch}
.muted{color:var(--mist)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:15px 26px;border-radius:12px;font:600 1rem var(--sans);text-decoration:none;border:1px solid transparent;cursor:pointer;color:var(--btntext);background:var(--gold);transition:background .2s,border-color .2s}
.btn:hover{background:var(--goldhover)}
.btn.ghost{background:var(--raise);color:var(--pearl);border-color:var(--hair)}
.btn.ghost:hover{background:var(--raise-2);border-color:var(--mist)}
.card{background:var(--raise);border:1px solid var(--hair);border-radius:18px}
section{position:relative;padding-block:clamp(56px,8vw,104px)}
.head{display:grid;gap:16px;margin-bottom:44px;max-width:780px}
.row{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
button{font:inherit;color:inherit}

/* nav */
.nav{position:fixed;top:env(safe-area-inset-top,0px);left:0;right:0;z-index:40;transition:background .3s,border-color .3s;border-bottom:1px solid transparent}
.nav.solid{background:var(--navbg);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-color:var(--hair)}
.nav-in{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-block:14px;max-width:var(--max);margin:0 auto}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;font-weight:600;font-size:1.05rem;letter-spacing:-.02em}
.links{display:flex;gap:26px;color:var(--mist);font-size:.95rem}
.links a{text-decoration:none}.links a:hover{color:var(--pearl)}
.navr{display:flex;align-items:center;gap:18px}
.navtel{font-weight:600;text-decoration:none;font-variant-numeric:tabular-nums}
.nav .btn{padding:11px 18px}
@media (max-width:1000px){.links{display:none}}
@media (max-width:560px){.navtel{display:none}.nav .btn{padding:10px 14px;font-size:.92rem}}

/* hero */
.hero{min-height:min(92svh,880px);display:grid;align-items:center;padding-block:130px 60px;overflow:hidden}
.photo-hero{position:absolute;inset:0;overflow:hidden}
.photo-hero img{position:absolute;inset:-3%;width:106%;height:106%;max-width:none;object-fit:cover;object-position:72% 42%;animation:eyein 2.2s cubic-bezier(.2,.7,.2,1) both;transform:translate3d(var(--px,0),var(--py,0),0) scale(var(--s,1));transition:transform .6s cubic-bezier(.2,.7,.2,1);filter:saturate(1.05) contrast(1.08)}
@keyframes eyein{from{filter:blur(18px) saturate(.6) brightness(.7);opacity:.3}to{filter:saturate(1.05) contrast(1.08);opacity:1}}
@media (max-width:860px){.photo-hero img{object-position:80% 35%}}
.hero::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(5,8,15,.96) 0%,rgba(5,8,15,.82) 32%,rgba(5,8,15,.25) 58%,rgba(5,8,15,.05) 75%),linear-gradient(0deg,var(--void) 0%,transparent 22%)}
@media (max-width:860px){.hero::after{background:linear-gradient(180deg,rgba(5,8,15,.35) 0%,rgba(5,8,15,.1) 22%,rgba(5,8,15,.82) 52%,var(--void) 78%)}.hero{align-items:end;padding-top:46vh}}
.hero-c{position:relative;z-index:2;max-width:var(--max);margin:0 auto;width:100%}
.hero h1{font-size:clamp(2.8rem,8vw,6.6rem);max-width:12ch;margin-top:18px}
.hero h1 em{font-family:var(--serif);font-style:italic;font-weight:400;color:var(--goldtext);letter-spacing:-.01em}
.hero h1 .w{display:inline-block;animation:focus 1.5s cubic-bezier(.2,.7,.2,1) both}
.hero h1 .w:nth-child(2){animation-delay:.12s}.hero h1 .w:nth-child(3){animation-delay:.24s}.hero h1 .w:nth-child(4){animation-delay:.36s}
@keyframes focus{from{filter:blur(12px);opacity:.4}to{filter:none;opacity:1}}
.hero .lede{margin-top:22px}
.hero .row{margin-top:30px}

/* proof strip */
.proof{border-block:1px solid var(--hair);padding-block:26px}
.proof .wrap{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.proof b{display:block;font:600 clamp(1.6rem,3vw,2.2rem)/1.1 var(--sans);letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.proof span{color:var(--mist);font-size:.95rem}
@media (max-width:760px){.proof .wrap{grid-template-columns:1fr 1fr}}

/* services triage */
.svcs{border-top:1px solid var(--hair)}
.svc{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr) 28px;gap:20px;align-items:center;padding-block:20px;border-bottom:1px solid var(--hair);text-decoration:none;transition:padding .25s,background .25s}
.svc:hover{padding-inline:14px;background:var(--raise)}
.svc .sn{font:600 clamp(1.15rem,2.2vw,1.5rem) var(--sans);letter-spacing:-.02em}
.svc .sd{color:var(--mist)}
.svc .sa{color:var(--goldtext);font-size:1.3rem;transition:transform .25s}.svc:hover .sa{transform:translateX(4px)}
.svc.hot .sn::after{content:"Start the cataract guide";margin-left:12px;font:600 .78rem var(--sans);color:var(--btntext);background:var(--gold);padding:3px 9px;border-radius:999px;vertical-align:middle;letter-spacing:0}
@media (max-width:640px){.svc{grid-template-columns:1fr 24px}.svc .sd{grid-row:2}.svc .sa{grid-row:1/3;grid-column:2}.svc.hot .sn::after{display:none}}

/* insurance */
.ins{padding:clamp(22px,4vw,40px);display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(20px,4vw,48px);align-items:start}
.ins > *{min-width:0}
@media (max-width:860px){.ins{grid-template-columns:1fr}}
.logos{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}
.logos button{cursor:pointer;padding:8px 14px;border-radius:10px;border:1px solid var(--hair);font-weight:600;background:rgba(255,255,255,.04)}
.logos button:hover{border-color:var(--goldtext)}
.chk{display:grid;gap:12px}
.chk input{font:400 1.1rem var(--sans);color:var(--pearl);background:rgba(255,255,255,.05);border:1px solid var(--hair);border-radius:12px;padding:16px;width:100%}
.chk input:focus{border-color:var(--goldtext);outline:none}
.insr{min-height:84px;padding:16px 18px;border-radius:14px;border:1px solid var(--hair);display:flex;gap:14px;align-items:flex-start}
.insr i{flex:none;width:12px;height:12px;border-radius:50%;margin-top:7px;background:var(--mist)}
.insr.ok i{background:#4ade80}.insr.call i{background:var(--gold)}
.insr b{display:block}
/* cataract guide */
.guide-top{display:grid;gap:16px;max-width:820px}
.chapters{position:sticky;top:calc(env(safe-area-inset-top,0px) + 66px);z-index:30;margin-top:36px;margin-bottom:8px;background:var(--navbg);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--hair);border-radius:14px;display:grid;grid-template-columns:repeat(4,1fr);overflow:hidden}
.chapters a{display:flex;gap:10px;align-items:center;padding:12px 14px;text-decoration:none;color:var(--mist);font-weight:600;font-size:.95rem;border-right:1px solid var(--hair);transition:background .2s,color .2s}
.chapters a:last-child{border-right:0}
.chapters a b{flex:none;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;border:1px solid var(--hair);font-size:.85rem}
.chapters a.on{color:var(--pearl);background:var(--raise-2)}.chapters a.on b{background:var(--gold);color:var(--btntext);border-color:var(--goldtext)}
@media (max-width:760px){.chapters a span{display:none}.chapters a{justify-content:center}}
.step{padding-block:clamp(48px,7vw,80px);border-bottom:1px solid var(--hair)}
.step:last-child{border-bottom:0}
.step-h{display:grid;grid-template-columns:auto 1fr;gap:18px;align-items:start;margin-bottom:28px}
.num{font:400 3.4rem/.8 var(--serif);font-style:italic;color:var(--goldtext)}
.step-h h3{font-size:clamp(1.6rem,3.4vw,2.4rem);letter-spacing:-.03em}
.step-h p{margin-top:10px}

/* 1 self-test */
.quiz{padding:clamp(22px,4vw,40px);display:grid;gap:24px;max-width:860px}
.qprog{display:flex;gap:6px}
.qprog i{flex:1;height:5px;border-radius:999px;background:rgba(255,255,255,.1);transition:background .3s}
.qprog i.on{background:var(--gold)}
.qtext{font:500 clamp(1.4rem,3.2vw,2.1rem)/1.2 var(--sans);letter-spacing:-.025em;min-height:2.4em}
.qbtns{display:flex;flex-wrap:wrap;gap:12px}
.qbtns button{cursor:pointer;padding:16px 30px;border-radius:12px;border:1px solid var(--hair);background:var(--raise);font-weight:600;font-size:1.05rem;transition:.2s}
.qbtns button:hover{border-color:var(--goldtext);background:var(--raise-2)}
.score{display:flex;align-items:center;gap:22px;flex-wrap:wrap}
.ring{width:110px;height:110px;flex:none}

/* 2 simulator: before/after wipe */
.sim{display:grid;gap:18px}
.howto{display:flex;flex-wrap:wrap;gap:10px 24px;color:var(--mist);font-size:.98rem}
.howto b{color:var(--pearl)}
.stage{position:relative;border-radius:18px;overflow:hidden;border:1px solid var(--hair);aspect-ratio:16/10;max-width:100%;background:#0b1220;touch-action:pan-y;cursor:ew-resize;user-select:none;-webkit-user-select:none}
.stage svg{position:absolute;inset:0;width:100%;height:100%;display:block}
#before,#after{position:absolute;inset:0}
#after{clip-path:inset(0 0 0 var(--x,50%));-webkit-clip-path:inset(0 0 0 var(--x,50%))}
.views{display:flex;flex-wrap:wrap;gap:8px}
.views button{cursor:pointer;padding:10px 16px;border-radius:10px;border:1px solid var(--hair);background:var(--raise);font-weight:600}
.views button[aria-pressed="true"]{background:var(--pearl);color:var(--void);border-color:var(--pearl)}
.handle{position:absolute;top:0;bottom:0;left:var(--x,50%);width:0;z-index:4;pointer-events:none}
.handle::before{content:"";position:absolute;top:0;bottom:0;left:-1.5px;width:3px;background:var(--pearl);box-shadow:0 0 18px rgba(0,0,0,.6)}
.knob{position:absolute;top:50%;left:0;transform:translate(-50%,-50%);width:58px;height:58px;border-radius:50%;background:var(--pearl);color:var(--void);display:grid;place-items:center;font:700 1.1rem var(--sans);box-shadow:0 6px 24px rgba(0,0,0,.5)}
.knob.hint{animation:nudge 1.6s ease-in-out 3}
@keyframes nudge{0%,100%{transform:translate(-50%,-50%)}30%{transform:translate(-80%,-50%)}60%{transform:translate(-20%,-50%)}}
.side{position:absolute;top:14px;z-index:5;font:600 .9rem var(--sans);padding:7px 12px;border-radius:10px;background:rgba(5,8,15,.78);border:1px solid var(--hair);pointer-events:none}
.side.l{left:14px}.side.r{right:14px;color:var(--aqua)}
.tagz{position:absolute;z-index:3;pointer-events:none;font:600 .82rem var(--sans);padding:4px 10px;border-radius:999px;background:var(--gold);color:var(--btntext);white-space:nowrap;transform:translate(-50%,-50%)}
@media (max-width:560px){.stage{aspect-ratio:4/3}.tagz{font-size:.7rem;padding:3px 7px}.side{font-size:.75rem;padding:5px 8px}.knob{width:46px;height:46px}}
.stage:has(#wipe:focus-visible){outline:3px solid var(--gold);outline-offset:3px}
#wipe{position:absolute;inset:0;width:100%;height:100%;opacity:0;z-index:6;margin:0;pointer-events:none}
.lenses{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
@media (max-width:760px){.lenses{grid-template-columns:1fr 1fr}}
.lenses button{cursor:pointer;text-align:left;padding:14px 16px;border-radius:14px;border:1px solid var(--hair);background:var(--raise);font-weight:600;font-size:1rem;line-height:1.3;transition:.2s}
.lenses button small{display:block;color:var(--mist);font-weight:400;font-size:.88rem;margin-top:4px}
.lenses button[aria-pressed="true"]{border-color:var(--goldtext);background:rgba(243,181,88,.1)}
.verdict{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
@media (max-width:640px){.verdict{grid-template-columns:1fr}}
.v{padding:14px 16px;border-radius:14px;border:1px solid var(--hair);display:flex;gap:12px;align-items:center}
.v i{flex:none;width:12px;height:12px;border-radius:50%}
.v.ok i{background:#4ade80}.v.part i{background:var(--gold)}.v.no i{background:var(--rose)}
.v div{font-size:.95rem;line-height:1.35}.v div b{display:block;font-size:1rem}
.note{font-size:.88rem;color:var(--mist)}

/* 3 lens finder */
.finder{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.finder > *{min-width:0}
@media (max-width:900px){.finder{grid-template-columns:1fr}}
.prefs{padding:26px;display:grid;gap:24px}
.range{display:grid;gap:10px}
.range .lbl{display:flex;justify-content:space-between;gap:12px;font-size:1rem}
.range .lbl span:last-child{color:var(--goldtext);font-weight:600;text-align:right}
input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:6px;border-radius:999px;background:linear-gradient(90deg,var(--gold) var(--p,0%),rgba(255,255,255,.14) var(--p,0%))}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:26px;height:26px;border-radius:50%;background:var(--pearl);border:0;box-shadow:0 0 0 6px rgba(243,181,88,.22);cursor:pointer}
input[type=range]::-moz-range-thumb{width:26px;height:26px;border:0;border-radius:50%;background:var(--pearl);box-shadow:0 0 0 6px rgba(243,181,88,.22);cursor:pointer}
.out{padding:26px;display:flex;flex-direction:column;gap:16px}
.match{font:600 clamp(1.9rem,4vw,2.7rem)/1.05 var(--sans);letter-spacing:-.035em}
.alts{display:grid;gap:12px}
.alt{display:grid;grid-template-columns:1fr auto;gap:6px;font-size:.98rem}
.alt .t{grid-column:1/-1;height:6px;border-radius:999px;background:rgba(255,255,255,.1);overflow:hidden}
.alt .t i{display:block;height:100%;background:var(--mist);transition:width .45s}
.alt.top .t i{background:var(--gold)}

/* 4 surgery day */
.day{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--hair);border-radius:18px;overflow:hidden}
.day > div{padding:24px;border-right:1px solid var(--hair);display:grid;gap:10px;align-content:start}
.day > div:last-child{border-right:0}
.day .t{font:600 .9rem var(--sans);color:var(--goldtext)}
.day p{color:var(--mist);font-size:.98rem}
@media (max-width:860px){.day{grid-template-columns:1fr 1fr}.day > div:nth-child(2){border-right:0}.day > div:nth-child(-n+2){border-bottom:1px solid var(--hair)}}
@media (max-width:520px){.day{grid-template-columns:1fr}.day > div{border-right:0;border-bottom:1px solid var(--hair)}.day > div:last-child{border-bottom:0}}
.cost{margin-top:18px;padding:22px 24px;display:grid;grid-template-columns:auto 1fr;gap:16px;align-items:center}

@media (max-width:520px){.cost{grid-template-columns:1fr}}

/* reviews */
.reviews{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:18px}
@media (max-width:900px){.reviews{grid-template-columns:1fr}}
.rev{padding:28px;display:flex;flex-direction:column;gap:16px;margin:0}
.rev .fig{font:600 clamp(2.2rem,5vw,3.4rem)/1 var(--sans);letter-spacing:-.04em;font-variant-numeric:tabular-nums}
.rev .fig s{color:var(--mist);text-decoration-thickness:2px;font-weight:500}
.rev .fig span{color:var(--goldtext)}
.rev q{font:400 1.45rem/1.3 var(--serif)}
.rev cite{font-style:normal;color:var(--mist);font-size:.95rem;margin-top:auto}

/* surgeons */
.family{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
@media (max-width:900px){.family{grid-template-columns:1fr}}
.doc{padding:26px;display:flex;flex-direction:column;gap:12px}
.photo{width:84px;height:84px;border-radius:50%;display:grid;place-items:center;font:400 2rem var(--serif);font-style:italic;color:var(--goldtext);border:1px solid rgba(243,181,88,.45);background:radial-gradient(circle at 30% 30%,rgba(243,181,88,.18),transparent 70%)}
.doc .role{font:600 .9rem var(--sans);color:var(--goldtext)}
.doc ul{margin:0;padding-left:18px;color:var(--mist);font-size:.95rem;display:grid;gap:4px}
.team{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:14px;margin-top:16px}
.mini{padding:20px}
.mini p{color:var(--mist);font-size:.95rem;margin-top:4px}

/* offices */
.mapgrid{display:grid;grid-template-columns:1.3fr 1fr;gap:18px}
.mapgrid > *{min-width:0}
@media (max-width:900px){.mapgrid{grid-template-columns:1fr}}
.map{padding:10px}.map svg{width:100%;height:auto;display:block}
.pin{cursor:pointer}
.pin circle.core{fill:var(--pearl)}
.pin.on circle.core{fill:var(--gold)}
.pin .pulse{fill:none;stroke:var(--aqua);animation:pulse 2.4s ease-out infinite;transform-box:fill-box;transform-origin:center}
.pin.on .pulse{stroke:var(--gold)}
@keyframes pulse{from{transform:scale(.6);opacity:.9}to{transform:scale(2.6);opacity:0}}
.pin text{font:600 12px var(--sans);fill:var(--mist)}
.pin.on text{fill:var(--pearl)}
.pin:focus-visible{outline:none}.pin:focus-visible circle.core{stroke:var(--gold);stroke-width:3}
.office{padding:26px;display:flex;flex-direction:column;gap:14px}
.tabs{display:flex;flex-wrap:wrap;gap:8px}
.tabs button{cursor:pointer;font-weight:600;font-size:.92rem;padding:9px 14px;border-radius:10px;border:1px solid var(--hair);background:transparent}
.tabs button[aria-selected="true"]{background:var(--pearl);color:var(--void);border-color:var(--pearl)}
.office .phone{font:600 clamp(1.8rem,4vw,2.3rem) var(--sans);letter-spacing:-.03em;font-variant-numeric:tabular-nums;text-decoration:none}
.badge{font:600 .85rem var(--sans);color:var(--goldtext);border:1px solid rgba(243,181,88,.45);padding:4px 10px;border-radius:999px;align-self:flex-start}
.open{display:flex;align-items:center;gap:8px;color:var(--mist);font-size:.95rem}
.open i{width:9px;height:9px;border-radius:50%;background:var(--mist)}
.open.yes i{background:#4ade80;box-shadow:0 0 10px #4ade80}

/* request */
.console{display:grid;grid-template-columns:260px 1fr;overflow:hidden}
@media (max-width:820px){.console{grid-template-columns:1fr}}
.steps{padding:26px;border-right:1px solid var(--hair);display:grid;gap:2px;align-content:start}
@media (max-width:820px){.steps{border-right:0;border-bottom:1px solid var(--hair);grid-template-columns:repeat(4,1fr);padding:14px}}
.steps div{display:flex;gap:12px;align-items:center;padding:10px 0;color:var(--mist)}
.steps div b{flex:none;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;border:1px solid var(--hair);font-size:.85rem}
.steps div.on{color:var(--pearl)}.steps div.on b{background:var(--pearl);color:var(--void);border-color:var(--pearl)}
.steps div.done b{background:var(--teal);border-color:var(--teal);color:var(--void)}
@media (max-width:820px){.steps div span{display:none}.steps div{justify-content:center}}
.pane{padding:clamp(22px,4vw,38px);display:grid;gap:20px;min-height:360px;align-content:start;min-width:0}
.opts{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px}
.opts button{cursor:pointer;text-align:left;padding:16px;border-radius:14px;border:1px solid var(--hair);background:var(--raise);font-weight:600;line-height:1.3}
.opts button small{display:block;color:var(--mist);font-weight:400;font-size:.88rem;margin-top:4px}
.opts button:hover{border-color:var(--goldtext)}
.opts button[aria-pressed="true"]{border-color:var(--goldtext);background:rgba(243,181,88,.1)}
.days{display:flex;gap:8px;overflow-x:auto;padding-bottom:6px}
.days button{cursor:pointer;flex:none;width:66px;padding:12px 0;text-align:center;border-radius:14px;border:1px solid var(--hair);background:transparent;color:var(--mist);font-size:.82rem}
.days button b{display:block;font:600 1.4rem var(--sans);color:var(--pearl)}
.days button[aria-pressed="true"]{background:var(--pearl);color:var(--void)}.days button[aria-pressed="true"] b{color:var(--void)}
.fields{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media (max-width:560px){.fields{grid-template-columns:1fr}}
.fields label{display:grid;gap:6px;font-weight:600;font-size:.92rem;color:var(--mist)}
.fields input{font:400 1.05rem var(--sans);color:var(--pearl);background:rgba(255,255,255,.05);border:1px solid var(--hair);border-radius:12px;padding:14px;width:100%}
.fields input:focus{border-color:var(--goldtext);outline:none}
.summary{color:var(--mist)}.summary b{color:var(--pearl)}
.err{color:var(--rose);font-weight:600}

/* patient tools + faq */
.pt{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,5vw,64px)}
.pt > *{min-width:0}
@media (max-width:860px){.pt{grid-template-columns:1fr}}
.tiles{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media (max-width:460px){.tiles{grid-template-columns:1fr}}
.tile{padding:20px;text-decoration:none;display:flex;flex-direction:column;gap:20px;transition:border-color .2s}
.tile:hover{border-color:var(--goldtext)}
.tile span{color:var(--mist);font-size:.92rem}
.tile .go{font-weight:600;color:var(--goldtext)}
details{border-bottom:1px solid var(--hair);padding-block:18px}
details:first-of-type{border-top:1px solid var(--hair)}
summary{cursor:pointer;font-weight:600;font-size:1.08rem;list-style:none;display:flex;justify-content:space-between;gap:16px}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";color:var(--goldtext);font-size:1.4rem;line-height:1}
details[open] summary::after{content:"\2212"}
details p{margin-top:10px;color:var(--mist);max-width:62ch}

footer{border-top:1px solid var(--hair);padding-block:48px}
.foot{display:grid;grid-template-columns:2fr 1fr 1fr;gap:28px;color:var(--mist)}
@media (max-width:760px){.foot{grid-template-columns:1fr}}
.foot h4{margin:0 0 8px;font:600 1rem var(--sans);color:var(--pearl)}

.mbar{display:none}
@media (max-width:700px){
  .mbar{display:grid;grid-template-columns:1.3fr 1fr;gap:10px;position:fixed;left:0;right:0;bottom:0;z-index:45;background:var(--navbg);backdrop-filter:blur(12px);border-top:1px solid var(--hair);padding:10px max(16px,env(safe-area-inset-right,0px)) calc(10px + env(safe-area-inset-bottom,0px)) max(16px,env(safe-area-inset-left,0px))}
  .mbar .btn{padding:14px 10px}
  footer{padding-bottom:120px}
}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}html{scroll-behavior:auto}}

/* hero is always dark: it sits on the photo */
.hero,.phero{--pearl:#eef3f7;--mist:#c3ced9;--goldtext:var(--sky);--raise:rgba(255,255,255,.06);--hair:rgba(255,255,255,.18);color:#eef3f7}
.hero .btn.ghost,.phero .btn.ghost{color:#eef3f7}
.nav.top{--pearl:#eef3f7;--mist:#c3ced9}
.nav.top .brand,.nav.top .navtel,.nav.top .iconbtn{color:#eef3f7}
.skip{position:absolute;left:-9999px;top:8px;z-index:100;background:var(--gold);color:var(--btntext);padding:10px 16px;border-radius:10px;font-weight:600}
.skip:focus{left:12px}

/* header */
.nav{color:var(--pearl)}
.navr{gap:10px}
.iconbtn{cursor:pointer;display:inline-flex;align-items:center;gap:8px;height:44px;padding:0 12px;border-radius:12px;border:1px solid var(--hair);background:transparent;color:var(--pearl);font-weight:600;font-size:.92rem}
.iconbtn:hover{border-color:var(--mist)}
.iconbtn svg{width:18px;height:18px}
.menu-btn{display:none}
@media (max-width:1000px){.menu-btn{display:inline-flex}.navr .hide-m{display:none}}
.drop{position:relative}
.drop > button{all:unset;cursor:pointer;color:var(--mist)}
.drop > button:hover,.drop:focus-within > button{color:var(--pearl)}
.drop > button:focus-visible{outline:3px solid var(--gold);outline-offset:4px;border-radius:6px}
.dmenu{position:absolute;top:calc(100% + 14px);left:-16px;min-width:300px;padding:10px;border-radius:16px;background:var(--surface);border:1px solid var(--hair);box-shadow:0 20px 50px rgba(0,0,0,.35);display:grid;gap:2px;opacity:0;visibility:hidden;transform:translateY(-6px);transition:.18s}
.drop:hover .dmenu,.drop:focus-within .dmenu,.drop.open .dmenu{opacity:1;visibility:visible;transform:none}
.dmenu a{display:block;padding:10px 12px;border-radius:10px;text-decoration:none;color:var(--pearl)}
.dmenu a small{display:block;color:var(--mist);font-size:.85rem}
.dmenu a:hover{background:var(--raise-2)}
.links a[aria-current="page"],.drop > button[aria-current="page"]{color:var(--pearl);text-decoration:underline;text-decoration-color:var(--gold);text-underline-offset:6px}

/* overlays: menu, search, display */
.sheet{position:fixed;inset:0;z-index:80;background:rgba(2,4,8,.6);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);display:grid;justify-items:center;align-items:start;padding:calc(env(safe-area-inset-top,0px) + 70px) max(16px,env(safe-area-inset-right,0px)) 16px max(16px,env(safe-area-inset-left,0px))}
.sheet .panel{width:min(640px,100%);max-height:calc(100svh - 100px);overflow:auto;background:var(--surface);color:var(--pearl);border:1px solid var(--hair);border-radius:20px;padding:20px;box-shadow:0 30px 80px rgba(0,0,0,.45)}
.panel h2{font-size:1.4rem;margin-bottom:14px}
.panel .x{float:right}
.sinput{width:100%;font:500 1.15rem var(--sans);color:var(--pearl);background:var(--raise-2);border:1px solid var(--hair);border-radius:14px;padding:16px}
.sinput:focus{outline:none;border-color:var(--gold)}
.sres{list-style:none;margin:12px 0 0;padding:0;display:grid;gap:4px}
.sres a{display:block;padding:12px 14px;border-radius:12px;text-decoration:none}
.sres a small{display:block;color:var(--mist);font-size:.88rem}
.sres a:hover,.sres a.on{background:var(--raise-2)}
.sres .empty{padding:14px;color:var(--mist)}
.mlinks{display:grid;gap:2px}
.mlinks a{display:block;padding:12px 10px;border-radius:10px;text-decoration:none;font-weight:600;font-size:1.05rem}
.mlinks a:hover{background:var(--raise-2)}
.mlinks .grp{font:600 .85rem var(--sans);color:var(--goldtext);padding:14px 10px 4px}
.seg2{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:8px 0 18px}
.seg2 button{cursor:pointer;padding:14px 10px;border-radius:12px;border:1px solid var(--hair);background:var(--raise);color:var(--pearl);font-weight:600}
.seg2 button[aria-pressed="true"]{border-color:var(--gold);background:rgba(243,181,88,.14)}
.seg2.two{grid-template-columns:1fr 1fr}

/* sub-page hero */
.phero{position:relative;overflow:hidden;padding-block:150px 64px;background:#05080f}
.phero::before{content:"";position:absolute;inset:0;background:url(iris.jpg) 75% 40%/cover no-repeat;opacity:.38;filter:saturate(1.05)}
.phero::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#05080f 0%,rgba(5,8,15,.86) 45%,rgba(5,8,15,.55) 100%),linear-gradient(0deg,#05080f 0%,transparent 40%)}
.phero .wrap{position:relative;z-index:2}
.phero h1{font-size:clamp(2.3rem,6vw,4.4rem);max-width:16ch;margin-top:14px}
.phero .lede{margin-top:18px}
.phero .row{margin-top:26px}
.crumbs{font-size:.92rem;color:var(--mist);display:flex;flex-wrap:wrap;gap:8px}
.crumbs a{text-decoration:none}.crumbs a:hover{text-decoration:underline}

/* content */
.two{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:clamp(24px,5vw,64px);align-items:start}
@media (max-width:960px){.two{grid-template-columns:1fr}}
.aside{position:sticky;top:96px;display:grid;gap:14px}
@media (max-width:960px){.aside{position:static}}
.aside .card{padding:22px;display:grid;gap:12px}
.tldr{padding:22px 24px;border-left:4px solid var(--gold);border-radius:14px;background:var(--raise);border-top:1px solid var(--hair);border-right:1px solid var(--hair);border-bottom:1px solid var(--hair)}
.tldr p{font-size:1.08rem}
.prose{display:grid;gap:18px;max-width:72ch}
.prose h2{font-size:clamp(1.5rem,3vw,2.1rem);margin-top:22px}
.prose h3{font-size:1.2rem;margin-top:6px}
.prose p,.prose li{color:var(--mist)}
.prose strong{color:var(--pearl)}
.prose ul{margin:0;padding-left:20px;display:grid;gap:8px}
.tx{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px}
.tx .card{padding:20px;display:grid;gap:8px;align-content:start}
.tx .card p{color:var(--mist);font-size:.98rem}
.tx .tag{font:600 .82rem var(--sans);color:var(--goldtext)}
.alert{padding:18px 20px;border-radius:14px;border:1px solid rgba(255,138,122,.45);background:rgba(255,138,122,.08)}
.alert b{color:var(--rose)}
.band{padding:clamp(28px,5vw,48px);display:grid;grid-template-columns:1fr auto;gap:20px;align-items:center}
@media (max-width:760px){.band{grid-template-columns:1fr}}
.band h2{font-size:clamp(1.6rem,3.4vw,2.4rem)}
.offices-mini{display:flex;flex-wrap:wrap;gap:8px}
.offices-mini a{padding:8px 12px;border-radius:10px;border:1px solid var(--hair);text-decoration:none;font-weight:600;font-size:.92rem}
.offices-mini a:hover{border-color:var(--gold)}
.docgrid{display:grid;gap:18px}
.docrow{padding:clamp(22px,3vw,32px);display:grid;grid-template-columns:120px 1fr;gap:24px;align-items:start}
@media (max-width:640px){.docrow{grid-template-columns:1fr}}
.docrow .photo{width:110px;height:110px;font-size:2.6rem}
.docrow .meta{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 14px}
.docrow .meta span{padding:4px 10px;border-radius:999px;border:1px solid var(--hair);font-size:.85rem;color:var(--mist)}
.loc-hero-phone{font:600 clamp(2rem,5vw,3rem) var(--sans);letter-spacing:-.03em;text-decoration:none;font-variant-numeric:tabular-nums}
.facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px}
.facts .card{padding:20px}
.facts dt{font:600 .85rem var(--sans);color:var(--goldtext)}
.facts dd{margin:6px 0 0}

/* booking page */
.bk{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:22px;align-items:start}
@media (max-width:960px){.bk{grid-template-columns:1fr}}
.bk .pane{min-height:420px}
.slots{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:8px}
.slots button{cursor:pointer;padding:12px 6px;border-radius:12px;border:1px solid var(--hair);background:var(--raise);font-weight:600;font-variant-numeric:tabular-nums}
.slots button:hover{border-color:var(--gold)}
.slots button[aria-pressed="true"]{background:var(--gold);color:var(--btntext);border-color:var(--gold)}
.slots button:disabled{opacity:.35;cursor:not-allowed;text-decoration:line-through}
.summarycard{padding:22px;display:grid;gap:12px;position:sticky;top:96px}
.summarycard dl{margin:0;display:grid;gap:10px}
.summarycard dt{font:600 .82rem var(--sans);color:var(--goldtext)}
.summarycard dd{margin:2px 0 0}
.preview-note{padding:12px 16px;border-radius:12px;border:1px dashed var(--hair);color:var(--mist);font-size:.92rem}
.radio-row{display:flex;flex-wrap:wrap;gap:8px}
.radio-row label{display:flex;gap:8px;align-items:center;padding:12px 14px;border:1px solid var(--hair);border-radius:12px;cursor:pointer;font-weight:600}
.radio-row input{accent-color:var(--gold);width:18px;height:18px}
.check{display:flex;gap:10px;align-items:flex-start;color:var(--mist);font-size:.95rem}
.check input{accent-color:var(--gold);width:20px;height:20px;margin-top:2px;flex:none}
h2.h3{font-size:1.45rem;letter-spacing:-.02em}
.amsler{display:grid;grid-template-columns:minmax(0,320px) 1fr;gap:24px;align-items:center}
@media (max-width:700px){.amsler{grid-template-columns:1fr}}
.amsler svg{width:100%;height:auto;background:#fff;border-radius:12px}
.lenstable{width:100%;border-collapse:collapse;min-width:620px}
.lenstable th,.lenstable td{text-align:left;padding:14px 12px;border-bottom:1px solid var(--hair);vertical-align:top}
.lenstable th{font:600 .88rem var(--sans);color:var(--goldtext)}
.lenstable td{color:var(--mist)}
.lenstable td:first-child{color:var(--pearl);font-weight:600}
.scrollx{overflow-x:auto}
.dot{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:6px;vertical-align:middle}
.dot.ok{background:var(--okc)}.dot.part{background:var(--gold)}.dot.no{background:var(--rose)}

.foot4{grid-template-columns:1.4fr 1fr 1fr 1fr}
@media (max-width:900px){.foot4{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.foot4{grid-template-columns:1fr}}
.foot a{text-decoration:none}.foot a:hover{text-decoration:underline}

/* the hero photo and the simulator scene are always dark, whatever the page background */
.hero{background:#05080f}
.hero::after{background:linear-gradient(90deg,rgba(5,8,15,.96) 0%,rgba(5,8,15,.82) 32%,rgba(5,8,15,.25) 58%,rgba(5,8,15,.05) 75%),linear-gradient(0deg,#05080f 0%,transparent 22%)}
@media (max-width:860px){.hero::after{background:linear-gradient(180deg,rgba(5,8,15,.35) 0%,rgba(5,8,15,.1) 22%,rgba(5,8,15,.82) 52%,#05080f 78%)}}
.side{color:#eef3f7;background:rgba(5,8,15,.8);border-color:rgba(255,255,255,.18)}
.side.r{color:#7fe8dc}
.knob{background:#eef3f7;color:#05080f}
.handle::before{background:#eef3f7}
.phero .crumbs{color:#c3ced9}

/* eye anatomy */
.eyesvg{width:100%;height:auto;color:var(--pearl);overflow:visible}
.eyesvg .sclera{fill:none;stroke:currentColor;stroke-opacity:.35;stroke-width:2}
.eyesvg .shape{fill:none;stroke:currentColor;stroke-opacity:.55;stroke-width:3;transition:stroke .2s,fill .2s}
.eyesvg .thick{stroke-width:6;stroke-linecap:round}
.eyesvg .fillsoft{fill:currentColor;fill-opacity:.04;stroke:none}
.eyesvg .fillsoft2{fill:currentColor;fill-opacity:.12}
.eyesvg .dotfill{fill:currentColor;fill-opacity:.45;stroke:none}
.eyesvg .nerve{fill:currentColor;fill-opacity:.12}
.eyesvg .lid{stroke-opacity:.4}
.eyesvg .lead{stroke:currentColor;stroke-opacity:.3;stroke-width:1}
.eyesvg text{font:600 16px var(--sans);fill:currentColor;fill-opacity:.7}
.eyesvg .part.on .shape{stroke:var(--sky);stroke-opacity:1}
.eyesvg .part.on .fillsoft2,.eyesvg .part.on .dotfill,.eyesvg .part.on .nerve{fill:var(--sky);fill-opacity:.55}
.eyesvg .part.on .fillsoft{fill:var(--sky);fill-opacity:.1}
.eyesvg .part.on text{fill:var(--goldtext);fill-opacity:1}
.eyesvg .part.on .lead{stroke:var(--goldtext);stroke-opacity:.8}
.eyesvg .part[role=button]{cursor:pointer}
.eyesvg .part[role=button]:hover text{fill-opacity:1}
.eyesvg .part:focus-visible{outline:none}.eyesvg .part:focus-visible text{text-decoration:underline}
.eyecard{padding:clamp(20px,3vw,32px);display:grid;grid-template-columns:minmax(0,340px) 1fr;gap:clamp(18px,3vw,36px);align-items:center}
.eyecard > *{min-width:0}
.eyecard > a{grid-column:2}
@media (max-width:760px){.eyecard{grid-template-columns:1fr}.eyecard > a{grid-column:1}}
.prose .eyecard p{color:var(--mist)}
.anat{padding:clamp(20px,3vw,36px);display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:clamp(20px,4vw,48px);align-items:center}
@media (max-width:860px){.anat{grid-template-columns:1fr}}
.anat-btns{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.anat-btns button{cursor:pointer;padding:9px 13px;border-radius:10px;border:1px solid var(--hair);background:var(--raise);font-weight:600;font-size:.92rem}
.anat-btns button[aria-pressed="true"]{border-color:var(--gold);background:rgba(243,181,88,.14)}
.anat-info{display:grid;gap:14px;align-content:start}
.anat-info h3{font-size:clamp(1.8rem,4vw,2.6rem)}
.anat-info #ajob{font-size:1.12rem}
.anat-info .btn{justify-self:start}
.flow{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,1fr);gap:0;counter-reset:f;border:1px solid var(--hair);border-radius:18px;overflow:hidden}
.flow li{counter-increment:f;padding:22px;border-right:1px solid var(--hair);display:grid;gap:8px;align-content:start;position:relative}
.flow li:last-child{border-right:0}
.flow li::before{content:counter(f);font:400 2.6rem/1 var(--serif);font-style:italic;color:var(--goldtext)}
.flow b{font-size:1.15rem}.flow span{color:var(--mist);font-size:.98rem}
@media (max-width:900px){.flow{grid-template-columns:1fr}.flow li{border-right:0;border-bottom:1px solid var(--hair);grid-template-columns:44px 1fr;column-gap:12px}.flow li::before{grid-row:1/3}.flow li:last-child{border-bottom:0}}
.chartlines{display:grid;gap:10px;text-align:center}
.chartlines div{display:grid;grid-template-columns:64px 1fr;align-items:center;gap:12px}
.chartlines span{font:600 .85rem var(--sans);color:var(--goldtext);text-align:left;font-variant-numeric:tabular-nums}
.chartlines b{font-family:var(--sans);font-weight:700;letter-spacing:.18em;line-height:1}
.gloss{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:12px;margin:20px 0 0}
.gterm{padding:18px;border:1px solid var(--hair);border-radius:14px;background:var(--raise)}
.gterm dt{font-weight:600;font-size:1.05rem}
.gterm dd{margin:6px 0 0;color:var(--mist)}

/* spacing system: one rhythm for every page */
section{padding-block:clamp(48px,7vw,96px)}
.head{margin-bottom:clamp(24px,3.2vw,40px);gap:12px}
.ctasec{padding-block:clamp(24px,4vw,56px) clamp(48px,6vw,80px)}
footer{padding-block:clamp(36px,5vw,56px)}
.phero{padding-block:clamp(120px,14vw,150px) clamp(40px,6vw,64px)}
.prose{gap:16px}
.prose h2{margin-top:clamp(16px,2.4vw,28px)}
.prose > :first-child{margin-top:0}
.step{padding-block:clamp(40px,6vw,72px)}
.step-h{margin-bottom:clamp(20px,3vw,28px)}
.proof{padding-block:clamp(20px,3vw,28px)}
.hero{padding-block:130px clamp(40px,6vw,64px)}
@media (max-width:860px){.hero{padding-bottom:40px}}
.svc{padding-block:18px}
.tx,.tiles,.docgrid,.family,.reviews{gap:clamp(12px,1.6vw,18px)}
.eyecard > a{margin-top:-6px}
@media (max-width:700px){
  section{padding-block:44px}
  .ctasec{padding-block:16px 44px}
  .card.doc,.rev,.out,.prefs,.office,.quiz,.ins,.band,.anat,.eyecard{padding:20px}
  .head{margin-bottom:22px}
  .proof .wrap{row-gap:16px}
}

/* white mode: pure white pages and light page headers */
html[data-look="light"]{--void:#ffffff;--surface:#ffffff;--raise:#f6f8f9;--raise-2:#eef2f4;--navbg:rgba(255,255,255,.94)}
html[data-look="light"] .card{background:#ffffff;box-shadow:0 1px 2px rgba(10,20,30,.04),0 8px 24px -16px rgba(10,20,30,.18)}
html[data-look="light"] .phero{background:#ffffff;color:var(--pearl);--pearl:#0c1520;--mist:#45525f;--goldtext:#8a5300;--raise:#f6f8f9;--hair:rgba(10,20,30,.14)}
html[data-look="light"] .phero::before{opacity:.9;background-position:right 30% center;background-size:auto 150%;-webkit-mask-image:linear-gradient(90deg,transparent 35%,#000 80%);mask-image:linear-gradient(90deg,transparent 35%,#000 80%)}
html[data-look="light"] .phero::after{background:linear-gradient(90deg,#fff 0%,rgba(255,255,255,.92) 45%,rgba(255,255,255,.25) 100%),linear-gradient(0deg,#fff 0%,transparent 35%)}
html[data-look="light"] .phero .btn.ghost{color:var(--pearl);background:#fff}
html[data-look="light"] .phero .crumbs{color:var(--mist)}
html[data-look="light"] .nav.top:not(.onphoto){--pearl:#0c1520;--mist:#45525f}
html[data-look="light"] .nav.top:not(.onphoto) .brand,html[data-look="light"] .nav.top:not(.onphoto) .navtel,html[data-look="light"] .nav.top:not(.onphoto) .iconbtn{color:#0c1520}
html[data-look="light"] .proof{background:#fff}
@media (max-width:760px){html[data-look="light"] .phero::before{opacity:.35;-webkit-mask-image:none;mask-image:none}}

/* why lumen */
.why{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--hair);border-radius:18px;overflow:hidden;background:var(--raise)}
.why-i{padding:clamp(20px,2.6vw,30px);border-right:1px solid var(--hair);border-bottom:1px solid var(--hair);display:grid;gap:8px;align-content:start}
.why-i:nth-child(3n){border-right:0}.why-i:nth-last-child(-n+3){border-bottom:0}
.why-n{font:400 1.9rem/1 var(--serif);font-style:italic;color:var(--goldtext)}
.why-i h3{font-size:1.2rem}.why-i p{color:var(--mist);font-size:.98rem}
@media (max-width:900px){.why{grid-template-columns:1fr 1fr}.why-i:nth-child(3n){border-right:1px solid var(--hair)}.why-i:nth-child(2n){border-right:0}.why-i:nth-last-child(-n+3){border-bottom:1px solid var(--hair)}.why-i:nth-last-child(-n+2){border-bottom:0}}
@media (max-width:560px){.why{grid-template-columns:1fr}.why-i{border-right:0!important;border-bottom:1px solid var(--hair)!important}.why-i:last-child{border-bottom:0!important}}
html[data-look="light"] .why{background:#fff}
/* checklists */
.checks{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.checks label{display:flex;gap:12px;align-items:flex-start;padding:14px 16px;border:1px solid var(--hair);border-radius:12px;background:var(--raise);cursor:pointer;color:var(--pearl)}
.checks input{accent-color:var(--gold);width:22px;height:22px;flex:none;margin-top:1px}
.checks input:checked + span{text-decoration:line-through;color:var(--mist)}
.qs{margin:0;padding-left:22px;display:grid;gap:8px}
.qs li{color:var(--mist)}
.ok{padding:14px 16px;border-radius:12px;background:rgba(74,222,128,.12);border:1px solid rgba(74,222,128,.4);font-weight:600}

.navtel{white-space:nowrap}
.nav .lptel{display:inline}
@media (max-width:440px){.nav .lptel{display:none}}

/* the Lumen difference */
.diff{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:clamp(28px,6vw,96px);align-items:start;padding-block:clamp(8px,2vw,24px)}
.diff-h{position:sticky;top:110px;display:grid;gap:18px;align-content:start}
.diff-h h2{font-size:clamp(2rem,4.2vw,3.3rem);line-height:1.04}
.diff-h .btn{justify-self:start}
.diff-l{display:grid;border-top:1px solid var(--hair)}
.diff-i{display:grid;grid-template-columns:150px 1fr;column-gap:24px;row-gap:6px;padding-block:clamp(22px,3vw,32px);border-bottom:1px solid var(--hair)}
.diff-k{grid-row:1/3;font:400 1.35rem/1.2 var(--serif);font-style:italic;color:var(--goldtext);padding-top:2px}
.diff-i h3{font-size:clamp(1.25rem,2.2vw,1.55rem)}
.diff-i p{color:var(--mist);max-width:56ch}
@media (max-width:900px){.diff{grid-template-columns:1fr}.diff-h{position:static}}
@media (max-width:560px){.diff-i{grid-template-columns:1fr}.diff-k{grid-row:auto}}
.stage .ly{position:absolute;inset:0;width:100%;height:100%;display:block}
.stage .lyG{mix-blend-mode:screen;transition:opacity .3s}

/* before/after split without clip-path, so iPhone Safari redraws it every time */
#after{inset:0 0 0 auto;left:auto;width:50%;overflow:hidden;clip-path:none;-webkit-clip-path:none;border-left:0}
#after .afterIn{position:absolute;top:0;bottom:0;right:0;height:100%}
.views button,.lenses button,.qbtns button,.opts button{touch-action:manipulation;-webkit-tap-highlight-color:transparent}

.stage .ly{position:absolute;inset:0;width:100%;height:100%;transform:translateZ(0);will-change:filter}
.stage .ly svg{position:absolute;inset:0;width:100%;height:100%;display:block}
#readers[aria-pressed="true"]{border-color:var(--gold);background:rgba(243,181,88,.14)}

/* ================= cinematic layer ================= */
/* hero film: scenes cross-fade, slowly push in, and come into focus like vision clearing */
.film{background:#05080f}
.film-scenes{position:absolute;inset:0;overflow:hidden}
.film .scene{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;opacity:0;transition:opacity 1.6s ease}
.film .scene.on{opacity:1;animation:kb 9s linear both,clear 2.4s cubic-bezier(.2,.7,.2,1) both}
@keyframes kb{from{transform:scale(1.14)}to{transform:scale(1.0)}}
@keyframes clear{from{filter:blur(18px) sepia(.55) saturate(.7) brightness(.85)}to{filter:none}}
.film.paused .scene.on{animation-play-state:paused}
.rotator{margin-top:14px;font-size:clamp(1.15rem,2.2vw,1.5rem);font-weight:500}
.rot{display:inline-block;color:var(--sky);font-family:var(--serif);font-style:italic;font-size:1.25em;transition:opacity .35s,transform .35s,filter .35s}
.rot.out{opacity:0;transform:translateY(8px);filter:blur(6px)}
.inspill{display:inline-flex;align-items:center;gap:10px;margin-top:22px;padding:10px 16px;border-radius:999px;background:rgba(5,8,15,.55);border:1px solid rgba(255,255,255,.2);color:#eef3f7;text-decoration:none;font-weight:600;font-size:.95rem;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.inspill:hover{border-color:var(--sky)}
.dotok{width:9px;height:9px;border-radius:50%;background:#4ade80;box-shadow:0 0 10px #4ade80}
.film-ui{position:absolute;z-index:3;right:max(16px,env(safe-area-inset-right,0px));bottom:22px;display:flex;align-items:center;gap:14px;color:#c3ced9;font-size:.85rem}
.film-bars{display:flex;gap:5px}
.film-bars i{width:34px;height:3px;border-radius:3px;background:rgba(255,255,255,.25);overflow:hidden}
.film-bars i b{display:block;height:100%;width:0;background:var(--sky)}
.film-bars i.done b{width:100%}
.film-bars i.now b{animation:fbar 7s linear forwards}
.film.paused .film-bars i.now b{animation-play-state:paused}
@keyframes fbar{to{width:100%}}
.film-pause{cursor:pointer;background:rgba(5,8,15,.55);border:1px solid rgba(255,255,255,.22);color:#eef3f7;border-radius:999px;padding:6px 12px;font:600 .8rem var(--sans)}
@media (max-width:700px){.film-ui{left:max(16px,env(safe-area-inset-left,0px));right:auto;bottom:auto;top:calc(env(safe-area-inset-top,0px) + 84px)}.film-cap{display:none}}

/* reveal on scroll (visible at rest, rises into place) */
.rv{transform:translateY(26px);opacity:.35;transition:transform .9s cubic-bezier(.2,.7,.2,1),opacity .9s}
.rv.in{transform:none;opacity:1}

/* zoom story: a portrait that pushes into the eye as you scroll */
.zoomstory{position:relative;height:420vh;background:#05080f;color:#eef3f7}
@media (max-width:700px){.zoomstory{height:340vh}}
.zs-pin{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden}
.zs-frame{position:absolute;inset:0;overflow:hidden}
.zs-img{position:absolute;max-width:none;transform-origin:0 0;will-change:transform}
.zs-iris{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;object-position:72% 42%;opacity:0}
.zs-shade{position:absolute;inset:0;background:linear-gradient(0deg,rgba(5,8,15,.85) 0%,rgba(5,8,15,.15) 45%,rgba(5,8,15,.35) 100%);pointer-events:none}
.zs-lines{position:absolute;left:0;right:0;bottom:12vh;padding-inline:max(16px,env(safe-area-inset-left,0px));text-align:center}
.zs-l{position:absolute;left:0;right:0;bottom:0;margin:0 auto;max-width:18ch;font:500 clamp(2rem,5.6vw,4.4rem)/1.05 var(--sans);letter-spacing:-.03em;opacity:0;transform:translateY(20px);text-wrap:balance}
.zs-end{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;text-align:center;gap:16px;padding-inline:max(20px,env(safe-area-inset-left,0px));opacity:0;pointer-events:none}
.zs-end h2{font-size:clamp(2rem,5vw,4rem);max-width:16ch}
.zs-end.live{pointer-events:auto}
.zs-progress{position:absolute;left:0;right:0;bottom:0;height:3px;background:rgba(255,255,255,.12)}
.zs-progress i{display:block;height:100%;width:0;background:var(--sky)}
html.rm .zoomstory{height:auto}html.rm .zs-pin{position:relative;height:auto;min-height:100vh}
html.rm .zs-l{position:static;opacity:1;transform:none;margin-bottom:12px}html.rm .zs-lines{position:relative;padding-top:60vh}
html.rm .zs-end{position:relative;opacity:1;pointer-events:auto;padding-block:40px}

/* watch: video-style story cards */
.watch{background:#05080f;color:#eef3f7;--pearl:#eef3f7;--mist:#c3ced9;--goldtext:var(--sky);--hair:rgba(255,255,255,.14)}
.wgrid{display:grid;grid-template-columns:1.6fr 1fr 1fr;grid-template-rows:auto auto;gap:14px}
.wcard{position:relative;display:block;width:100%;padding:0;border:0;border-radius:18px;overflow:hidden;cursor:pointer;background:#0b1220;color:#eef3f7;text-align:left;aspect-ratio:4/3;max-width:100%}
.wcard.big{grid-row:span 2;aspect-ratio:auto;min-height:360px}
.wcard img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
.wcard:hover img{transform:scale(1.06)}
.wcard::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(5,8,15,.9) 0%,rgba(5,8,15,.1) 60%)}
.wplay{position:absolute;z-index:2;top:50%;left:50%;width:64px;height:64px;margin:-32px 0 0 -32px;border-radius:50%;background:rgba(255,255,255,.92);color:#05080f;display:grid;place-items:center;box-shadow:0 10px 30px rgba(0,0,0,.4);transition:transform .3s}
.wplay::before{content:"";position:absolute;inset:-8px;border-radius:50%;border:2px solid rgba(255,255,255,.5);animation:ping 2.2s ease-out infinite}
@keyframes ping{from{transform:scale(.9);opacity:1}to{transform:scale(1.5);opacity:0}}
.wplay svg{width:26px;height:26px;margin-left:3px}
.wcard:hover .wplay{transform:scale(1.08)}
.wmeta{position:absolute;z-index:2;left:18px;right:18px;bottom:16px;display:grid;gap:4px}
.wmeta b{font-size:1.2rem;letter-spacing:-.02em}.wcard.big .wmeta b{font-size:clamp(1.4rem,2.6vw,2rem)}
.wmeta span{color:#c3ced9;font-size:.92rem}.wlen{font-weight:600;color:var(--sky)!important;font-size:.8rem!important}
@media (max-width:860px){.wgrid{grid-template-columns:1fr 1fr}.wcard.big{grid-column:1/-1;grid-row:auto;min-height:0;aspect-ratio:16/10}}
@media (max-width:520px){.wgrid{grid-template-columns:1fr}}

/* story player */
.storyv{padding:0;background:rgba(2,4,8,.92);align-items:center}
.sv-box{position:relative;width:min(960px,100%);height:min(86svh,640px);border-radius:20px;overflow:hidden;background:#000;color:#eef3f7}
@media (max-width:700px){.sv-box{height:100svh;border-radius:0}}
.sv-frames figure{position:absolute;inset:0;margin:0;opacity:0;transition:opacity .9s}
.sv-frames figure.on{opacity:1}
.sv-frames img{width:100%;height:100%;max-width:none;object-fit:cover}
.sv-frames figure.on img{animation:kb2 5.2s linear both}
@keyframes kb2{from{transform:scale(1.02)}to{transform:scale(1.14)}}
.sv-box::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.8) 0%,transparent 45%,rgba(0,0,0,.45) 100%);pointer-events:none}
.sv-bars{position:absolute;z-index:3;top:calc(env(safe-area-inset-top,0px) + 12px);left:14px;right:14px;display:flex;gap:6px}
.sv-bars i{flex:1;height:3px;border-radius:3px;background:rgba(255,255,255,.3);overflow:hidden}.sv-bars i b{display:block;height:100%;width:0;background:#fff}
.sv-bars i.done b{width:100%}.sv-bars i.now b{animation:fbar 5s linear forwards}
.sv-top{position:absolute;z-index:3;top:calc(env(safe-area-inset-top,0px) + 26px);left:14px;right:14px;display:flex;justify-content:space-between;align-items:center;gap:12px}
.sv-top .iconbtn{color:#eef3f7;border-color:rgba(255,255,255,.3);background:rgba(0,0,0,.35)}
.sv-cap{position:absolute;z-index:3;left:24px;right:24px;bottom:28px;margin:0;font:500 clamp(1.25rem,3vw,2rem)/1.25 var(--sans);letter-spacing:-.02em;max-width:30ch;text-wrap:balance}
.sv-nav{position:absolute;z-index:2;top:0;bottom:0;width:35%;background:transparent;border:0;cursor:pointer}
.sv-nav.prev{left:0}.sv-nav.next{right:0;width:65%}
.sv-end{position:absolute;z-index:4;inset:0;display:grid;place-content:center;justify-items:center;gap:16px;background:rgba(5,8,15,.82);text-align:center;font-size:1.4rem}

/* decade cards */
.ages{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
@media (max-width:860px){.ages{grid-template-columns:1fr}}
.age{position:relative;display:block;min-height:380px;border-radius:18px;overflow:hidden;text-decoration:none;color:#eef3f7;background:#0b1220}
@media (max-width:860px){.age{min-height:300px}}
.age img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
.age:hover img{transform:scale(1.06)}
.age::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(5,8,15,.92) 0%,rgba(5,8,15,.3) 55%,rgba(5,8,15,.05) 100%)}
.age-in{position:absolute;z-index:2;left:20px;right:20px;bottom:18px;display:grid;gap:6px}
.age-k{font:400 1.5rem/1 var(--serif);font-style:italic;color:var(--sky)}
.age-in b{font-size:1.2rem;line-height:1.25}.age-in span{color:#d3dbe3;font-size:.95rem}.age-in .go{color:var(--sky);font-weight:600}

/* meet the surgeons */
.meet-split{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(20px,4vw,48px);align-items:center}
.meet-split > *{min-width:0}
.meetv{aspect-ratio:4/3;min-height:0}
.meet-copy{display:grid;gap:16px}.meet-copy h2{font-size:clamp(2rem,4.2vw,3.2rem)}
.chips{display:flex;flex-wrap:wrap;gap:8px}.chips span{padding:7px 12px;border-radius:999px;border:1px solid var(--hair);font-size:.88rem;font-weight:600}
@media (max-width:860px){.meet-split{grid-template-columns:1fr}}
@media (max-width:700px){.film-ui{top:calc(env(safe-area-inset-top,0px) + 76px);right:max(16px,env(safe-area-inset-right,0px));left:auto}.film-bars{display:none}}
.zs-end > *{max-width:100%}.zs-end .label{text-align:center}

.zs-focus{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;object-position:72% 42%;will-change:filter,transform;transform:scale(1.36);filter:blur(22px) sepia(.75)}
html.rm .zs-focus{filter:none;transform:none}
.zoomstory{height:360vh}@media (max-width:700px){.zoomstory{height:300vh}}

/* audit fixes */
.rot{transition:opacity .35s,transform .35s;filter:none!important}
.rot.out{opacity:0;transform:translateY(10px)}
.wplay{top:42%}
@media (max-width:860px){.wcard,.wcard.big{aspect-ratio:4/3!important;min-height:0}.wplay{top:38%;width:56px;height:56px;margin:-28px 0 0 -28px}}
.age::after{background:linear-gradient(0deg,rgba(5,8,15,.96) 0%,rgba(5,8,15,.6) 50%,rgba(5,8,15,.1) 100%)}
.wcard::after{background:linear-gradient(0deg,rgba(5,8,15,.95) 0%,rgba(5,8,15,.35) 55%,rgba(5,8,15,.05) 100%)}

.wvid{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
.wcard:hover .wvid{transform:scale(1.06)}
.zs-focus{object-position:72% 42%}
.film video.scene{background:#05080f}
/* watch grid: one feature card on the left, three stacked on the right, no gaps */
.wgrid{grid-template-columns:1.5fr 1fr;grid-template-rows:none}
.wgrid .wcard:not(.big){aspect-ratio:16/8.4}
.wgrid .wcard.big{grid-row:span 3;min-height:0;aspect-ratio:auto}
@media (max-width:860px){.wgrid{grid-template-columns:1fr 1fr}.wgrid .wcard.big{grid-column:1/-1;grid-row:auto;aspect-ratio:16/10!important}.wgrid .wcard:not(.big){aspect-ratio:4/3!important}}
@media (max-width:520px){.wgrid{grid-template-columns:1fr}}

/* cataract surgery walkthrough */
.proc{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:clamp(18px,3vw,40px);padding:clamp(14px,2.4vw,28px);align-items:center}
@media (max-width:900px){.proc{grid-template-columns:1fr}}
.proc-fig{position:relative;border-radius:16px;overflow:hidden;background:#f7f2eb;touch-action:pan-y}
.procsvg{display:block;width:100%;height:auto}
.procsvg text{font-family:var(--sans),system-ui,sans-serif;font-size:22px;font-weight:600;fill:#1f2a35}
.procsvg text.small{font-size:18px;font-weight:500;fill:#5b6773}
@media (max-width:600px){.procsvg text{font-size:28px}.procsvg text.small{font-size:24px}}
.proc-tag{position:absolute;left:12px;bottom:10px;font:500 .78rem var(--sans);color:#5b6773}
.proc-side{display:grid;gap:18px;align-content:center}
.pcap h3{font-size:clamp(1.5rem,3vw,2.1rem);margin:6px 0 8px}.pcap p{color:var(--mist);font-size:1.08rem;min-height:5.6em}
.proc-prog{display:grid;grid-template-columns:repeat(6,1fr);gap:6px}
.proc-prog i{height:4px;border-radius:4px;background:var(--hair);transition:background .4s}
.proc-prog i.on{background:var(--gold)}
.proc-nav{display:flex;align-items:center;gap:14px}
.proc-arrow{cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;height:52px;min-width:52px;padding:0 14px;border-radius:999px;border:1px solid var(--hair);background:var(--raise);color:inherit;font:600 1rem var(--sans)}
.proc-arrow.next{background:var(--gold);border-color:var(--gold);color:var(--btntext);padding:0 18px 0 22px}
.proc-arrow:disabled{opacity:.35;cursor:default}
.proc-count{font-variant-numeric:tabular-nums;color:var(--mist);font-weight:600;min-width:3.2em;text-align:center}
.procsvg .lab,.procsvg .pd-drop,.procsvg .pd-ripple,.procsvg .pd-cut,.procsvg .pd-blade,.procsvg .pd-needle,.procsvg .pd-probe,.procsvg .pd-frag,.procsvg .pd-iol,.procsvg .pd-inj,.procsvg .pd-rays,.procsvg .pd-inset{opacity:0}
.procsvg .lab{transition:opacity .5s ease .5s}
.s0 .l0,.s1 .l1,.s2 .l2,.s3 .l3,.s4 .l4,.s5 .l5{opacity:1}
.procsvg .pd-iu{transform-origin:264px 118px}.procsvg .pd-il{transform-origin:264px 282px}
.s0 .pd-iu,.s0 .pd-il{animation:pdil 1.6s ease 1.8s both}
.s1 .pd-iu,.s1 .pd-il,.s2 .pd-iu,.s2 .pd-il,.s3 .pd-iu,.s3 .pd-il,.s4 .pd-iu,.s4 .pd-il,.s5 .pd-iu,.s5 .pd-il{transform:scaleY(.62)}
@keyframes pdil{to{transform:scaleY(.62)}}
.s0 .pd-drop{animation:pdrop 1.5s ease-in .3s 2 both}.s0 .pd-ripple{animation:pripple 1.5s ease-out .3s 2 both}
@keyframes pdrop{0%{opacity:0;transform:translateY(-10px)}15%{opacity:1}70%{opacity:1;transform:translate(-6px,118px)}80%,100%{opacity:0;transform:translate(-6px,122px)}}
.procsvg .pd-ripple{transform-origin:214px 168px}
@keyframes pripple{0%,66%{opacity:0;transform:scale(.4)}74%{opacity:.9}100%{opacity:0;transform:scale(2.6)}}
.s1 .pd-blade{animation:pblade 2.4s ease-in-out .2s both}
@keyframes pblade{0%{opacity:0;transform:translate(-60px,-44px)}30%{opacity:1}60%,100%{opacity:1;transform:none}}
.procsvg .pd-cut{transition:opacity .4s ease 1.1s}
.s1 .pd-cut,.s2 .pd-cut,.s3 .pd-cut,.s4 .pd-cut{opacity:1}
.s5 .pd-cut{opacity:.25;transition-delay:.2s}
.s2 .pd-needle{animation:ptool 3.4s ease-in-out .1s both}
@keyframes ptool{0%{opacity:0;transform:translate(-50px,-40px)}30%,100%{opacity:1;transform:none}}
.procsvg .pd-front{transition:stroke-dashoffset 1.6s ease 1s,opacity .6s ease 2.4s}
.s2 .pd-front{stroke-dashoffset:64;opacity:0}
.s3 .pd-front,.s4 .pd-front,.s5 .pd-front{opacity:0;transition:none}
.s2 .pd-inset{opacity:1;transition:opacity .5s ease .4s}
.procsvg .pd-rhexis{transition:stroke-dashoffset 1.8s ease 1s}
.s2 .pd-rhexis{stroke-dashoffset:0}
.s3 .pd-probe{animation:pprobe 4.6s ease-in-out .1s both}
@keyframes pprobe{0%{opacity:0;transform:translate(-50px,-40px)}20%,100%{opacity:1;transform:none}}
.s3 .pd-waves{animation:pwave .6s ease-in-out 6 alternate both}@keyframes pwave{from{opacity:.2}to{opacity:1}}
.procsvg .pd-cloud{transform-origin:300px 200px;transition:transform 2.8s ease .8s,opacity 2.8s ease .8s}
.s3 .pd-cloud,.s4 .pd-cloud,.s5 .pd-cloud{transform:scale(.05);opacity:0}
.s4 .pd-cloud,.s5 .pd-cloud{transition:none}
.s3 .pd-frag{animation:pfrag 3.2s ease .8s both}@keyframes pfrag{0%{opacity:0}25%{opacity:1}100%{opacity:0;transform:translate(-30px,-20px)}}
.s4 .pd-inj{animation:ptool 2.6s ease-in-out .1s both}
.procsvg .pd-iol{transform-origin:300px 200px}
.s4 .pd-iol{animation:piol 2.4s cubic-bezier(.2,.7,.2,1) .7s both}
@keyframes piol{0%{opacity:0;transform:translate(-46px,-74px) scale(.25,.35)}30%{opacity:1}100%{opacity:1;transform:none}}
.s5 .pd-iol{opacity:1}
.s5 .pd-rays{opacity:1}.s5 .pd-rays path{stroke-dasharray:620;stroke-dashoffset:620;animation:pray 1.8s ease .4s forwards}
@keyframes pray{to{stroke-dashoffset:0}}
html.rm .procsvg *{animation:none!important;transition:none!important}
html.rm .s0 .pd-iu,html.rm .s0 .pd-il{transform:scaleY(.62)}html.rm .s2 .pd-needle,html.rm .s3 .pd-probe,html.rm .s4 .pd-iol{opacity:1}html.rm .s5 .pd-rays path{stroke-dashoffset:0}
.meetimg{position:relative;border-radius:18px;overflow:hidden;aspect-ratio:4/3;max-width:100%}
.meetimg img{width:100%;height:100%;max-width:none;object-fit:cover}

/* insurance: gold instead of green */
.dotok{background:var(--sky);box-shadow:none}
.insr.ok i{background:var(--gold)}
.insr.ok{border-color:rgba(243,181,88,.55)}

/* ---------- photo-led lower homepage ---------- */
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.ondark{--pearl:#eef3f7;--mist:#c3ced9;--goldtext:var(--sky);--raise:rgba(255,255,255,.08);--raise-2:rgba(255,255,255,.14);--hair:rgba(255,255,255,.24);color:#eef3f7;background:#05080f}
.ondark .btn.ghost{color:#eef3f7;background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.3);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.ondark .label{color:var(--sky)}
.rvband,.ofband,.ctaphoto{position:relative;overflow:hidden;isolation:isolate}
.rvbg,.ofbg,.ctbg{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;z-index:-2;transform:scale(1.08);transition:transform 6s cubic-bezier(.2,.7,.2,1)}
.rvband.in .rvbg,.ofband.in .ofbg,.ctaphoto.in .ctbg{transform:scale(1)}
.rvband::before,.ofband::before,.ctaphoto::before{content:"";position:absolute;inset:0;z-index:-1}
/* reviews */
.rvband{min-height:min(88vh,820px);display:flex;align-items:center;padding-top:clamp(80px,12vh,140px);padding-bottom:clamp(80px,12vh,140px)}
.rvband::before{background:linear-gradient(90deg,rgba(5,8,15,.94) 0%,rgba(5,8,15,.8) 40%,rgba(5,8,15,.35) 75%,rgba(5,8,15,.2) 100%)}
.rvwrap{width:100%}
.rq-stage{display:grid;max-width:780px;margin-top:18px}
.rq{grid-area:1/1;margin:0;opacity:0;transform:translateY(18px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.7,.2,1);pointer-events:none}
.rq.on{opacity:1;transform:none;pointer-events:auto}
.rq-fig{font:400 clamp(2.4rem,6vw,4.6rem)/1 var(--serif);color:var(--sky);margin-bottom:18px}
.rq-fig s{color:rgba(238,243,247,.55);text-decoration-thickness:2px}
.rq blockquote{margin:0;font:400 clamp(1.9rem,4.4vw,3.4rem)/1.12 var(--serif);letter-spacing:-.01em;color:#fff}
.rq figcaption{margin-top:22px;color:#c3ced9;font-weight:600}
.rq-nav{display:flex;align-items:center;gap:14px;margin-top:38px;flex-wrap:wrap}
.rq-btn{cursor:pointer;width:50px;height:50px;border-radius:50%;display:grid;place-items:center;border:1px solid rgba(255,255,255,.3);background:rgba(255,255,255,.08);color:#fff}
.rq-btn:hover{background:rgba(255,255,255,.16)}
.rq-dots{display:flex;gap:8px}.rq-dots i{width:26px;height:3px;border-radius:3px;background:rgba(255,255,255,.3);transition:background .4s,width .4s}.rq-dots i.on{background:var(--sky);width:44px}
.rq-nav .btn{margin-left:auto}
@media (max-width:700px){.rvband{min-height:0;align-items:flex-end;padding-top:46vh;padding-bottom:56px}.rvband::before{background:linear-gradient(180deg,rgba(5,8,15,.1) 0%,rgba(5,8,15,.55) 34%,rgba(5,8,15,.95) 62%,#05080f 100%)}.rq-nav .btn{margin-left:0;width:100%}}
/* meet video */
.meetimg video{width:100%;height:100%;object-fit:cover;display:block}
/* difference tiles */
.dtiles{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.dtile{position:relative;min-height:520px;border-radius:20px;overflow:hidden;background:#0b1220;color:#eef3f7;isolation:isolate}
.dtile img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;z-index:-2;transition:transform 1.4s cubic-bezier(.2,.7,.2,1)}
.dtile:hover img{transform:scale(1.05)}
.dtile::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,rgba(5,8,15,.97) 0%,rgba(5,8,15,.82) 40%,rgba(5,8,15,.2) 72%,rgba(5,8,15,.05) 100%)}
.dtile-in{position:absolute;left:24px;right:24px;bottom:24px;display:grid;gap:8px}
.dtile h3{font:400 clamp(1.7rem,2.4vw,2.2rem)/1.1 var(--serif);margin:0;color:#fff}
.dtile p{margin:0;color:#d3dbe3;font-size:.98rem;line-height:1.55}
@media (max-width:900px){.dtiles{grid-template-columns:1fr}.dtile{min-height:440px}}
/* offices */
.ofband{min-height:min(70vh,640px);display:flex;align-items:flex-end;padding-top:120px;padding-bottom:170px}
.ofband::before{background:linear-gradient(0deg,rgba(5,8,15,.92) 0%,rgba(5,8,15,.45) 50%,rgba(5,8,15,.15) 100%)}
.ofhead h2{font-size:clamp(2.4rem,6vw,4.8rem);line-height:1.02;max-width:900px;margin:10px 0 14px;color:#fff}
.ofhead .lede{max-width:620px;color:#d3dbe3}
.ofmap{margin-top:-130px;position:relative;z-index:2;padding-top:0}
@media (max-width:700px){.ofband{padding-top:200px;padding-bottom:180px}}
/* closing call to action */
.ctaphoto{min-height:min(86vh,780px);display:flex;align-items:center;padding-top:120px;padding-bottom:120px}
.ctaphoto::before{background:linear-gradient(90deg,rgba(5,8,15,.9) 0%,rgba(5,8,15,.66) 45%,rgba(5,8,15,.15) 85%)}
.ctin h2{font-size:clamp(2.8rem,7.4vw,6rem);line-height:1;margin:12px 0 18px;color:#fff;max-width:900px}
.ctin h2 em{color:var(--sky)}
.ctin .lede{max-width:560px;color:#d3dbe3;margin-bottom:26px}
@media (max-width:700px){.ctaphoto{align-items:flex-end;padding-top:40vh;padding-bottom:64px}.ctaphoto::before{background:linear-gradient(180deg,rgba(5,8,15,.05) 0%,rgba(5,8,15,.6) 40%,rgba(5,8,15,.95) 70%)}.ctin .row .btn{width:100%}}
@media (max-width:760px){.meet .family{display:flex;grid-template-columns:none;overflow-x:auto;scroll-snap-type:x mandatory;gap:12px;margin-left:-16px;margin-right:-16px;padding:0 16px 6px;scrollbar-width:none}.meet .family::-webkit-scrollbar{display:none}.meet .family .doc{flex:0 0 84%;scroll-snap-align:center}}

/* ================================================================
   ONE SYSTEM: navy and white, serif headlines with italic accents,
   pill buttons, floating white header. Laid out like Chu Vision.
   ================================================================ */
:root{
  --void:#05080f; --surface:#0a1019; --raise:rgba(255,255,255,.05); --raise-2:rgba(255,255,255,.1);
  --hair:rgba(255,255,255,.15); --pearl:#eef3f7; --mist:#b6c3d0;
  --gold:#f3b558; --goldhover:#f8c97c; --goldtext:#f3b558; --btntext:#05080f; --sky:#f3b558; --navy:#05080f;
  --teal:#19a7a8; --aqua:#7fe8dc; --okc:#4ade80; --navbg:#ffffff;
  --serif:"Newsreader", "Iowan Old Style", Georgia, serif; --sans:"Figtree", "Helvetica Neue", system-ui, sans-serif;
}
html[data-look="light"]{
  --void:#f6f5f2; --surface:#ffffff; --raise:#ffffff; --raise-2:#efeee9; --hair:rgba(12,21,32,.14);
  --pearl:#0c1520; --mist:#45525f; --gold:#f3b558; --goldhover:#f8c97c; --goldtext:#8a5300; --btntext:#05080f; --sky:#8a5300;
  --teal:#0f7c7d; --aqua:#0f6f73; --okc:#15803d;
}
/* anything sitting on navy or a photo uses the dark set, in both looks */
.hero,.phero,.navysec,.photosec,.ondark,.contact,footer,.mbar-dark{
  --pearl:#ffffff; --mist:#c3ced9; --hair:rgba(255,255,255,.2); --raise:rgba(255,255,255,.07); --raise-2:rgba(255,255,255,.13);
  --gold:#f3b558; --goldhover:#f8c97c; --goldtext:#f3b558; --btntext:#05080f; --sky:#f3b558; --teal:#19a7a8; --aqua:#7fe8dc; --okc:#4ade80;
  --void:#05080f; --surface:#0a1019; color:#eef3f7;
}
/* white cards stay white, like Chu's, whatever is around them */
.paper{--pearl:#0c1520; --mist:#45525f; --hair:rgba(12,21,32,.14); --raise:#ffffff; --raise-2:#efeee9; --gold:#f3b558; --goldhover:#f8c97c;
  --goldtext:#8a5300; --btntext:#05080f; --sky:#8a5300; --void:#ffffff; --surface:#f6f5f2; background:#fff; color:#0c1520}
body{font-family:var(--sans)}
h1,h2,h3{font-family:var(--serif);font-weight:400;letter-spacing:-.015em;line-height:1.08}
h3{font-weight:500}
h1 em,h2 em,h3 em{font-family:var(--serif);font-style:italic;font-weight:400;color:var(--goldtext);letter-spacing:-.01em}
.paper h1 em,.paper h2 em,.paper h3 em{color:#8a5300}
.label{font:600 .95rem/1.3 var(--sans);letter-spacing:0;text-transform:none;color:var(--goldtext)}
.kick{display:block;font:600 1rem/1.3 var(--sans);margin-bottom:14px;color:inherit}
.kick.dark{color:#05080f}
.sub{color:var(--mist);font-size:1.1rem;margin-top:14px;line-height:1.6}
.btn{border-radius:999px;font-weight:600;padding:14px 26px}
.btn:hover{background:var(--goldhover)}
.card{border-radius:20px}
html[data-look="light"] .card{box-shadow:0 1px 2px rgba(12,21,32,.05)}
.pill{display:inline-flex;align-items:center;justify-content:center;gap:10px;border-radius:999px;padding:15px 28px;font:600 1rem var(--sans);text-decoration:none;cursor:pointer;border:1px solid transparent;transition:background .25s,transform .25s;white-space:nowrap}
.pill:hover{transform:translateY(-1px)}
.pill.white{background:#f3b558;color:#05080f}.pill.white:hover{background:#f8c97c}
.pill.navy{background:#0c1520;color:#fff}.pill.navy:hover{background:#1b2633}
.pill.glass{background:rgba(255,255,255,.12);color:#fff;border-color:rgba(255,255,255,.35);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.circ{width:52px;height:52px;border-radius:50%;display:inline-grid;place-items:center;border:1px solid rgba(255,255,255,.4);background:transparent;color:inherit;cursor:pointer;flex:none;transition:background .25s}
.circ:hover{background:rgba(255,255,255,.12)}
.circ.navy{background:#f3b558;color:#05080f;border-color:#f3b558}
.row.center{justify-content:center}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* floating white header */
.nav{padding:12px 12px 0;border:0!important;background:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
  --pearl:#0c1520;--mist:#45525f;--hair:rgba(12,21,32,.14);--gold:#f3b558;--goldhover:#f8c97c;--btntext:#05080f;--raise:#fff;--raise-2:#efeee9;--void:#fff;--surface:#fff;--goldtext:#8a5300;color:#0c1520}
.nav-in{background:#fff;border-radius:16px;box-shadow:0 10px 34px rgba(5,8,15,.18);padding:10px 12px 10px 22px;max-width:1290px}
.nav.top .brand,.nav.top .navtel,.nav.top .iconbtn,.nav .brand,.nav .navtel,.nav .iconbtn{color:#05080f}
.nav .iconbtn{border-color:rgba(12,21,32,.16)}
.nav .btn{border-radius:999px;padding:12px 22px}
.nav .brand span{font-family:var(--serif);font-size:1.35rem;font-weight:500;letter-spacing:-.01em}
.dmenu{background:#fff!important;color:#05080f}
@media (max-width:560px){.nav{padding:8px 8px 0}.nav-in{padding:8px 8px 8px 14px;border-radius:14px}.nav .brand span{font-size:1.1rem}}

/* sections */
.navysec{background:radial-gradient(1100px 620px at 12% 0%,rgba(243,181,88,.10),transparent 62%),radial-gradient(900px 640px at 92% 100%,rgba(90,120,160,.12),transparent 62%),#070b13;padding-top:clamp(70px,10vw,120px);padding-bottom:clamp(70px,10vw,120px);position:relative;overflow:hidden}
.whitesec{background:var(--void);padding-top:clamp(64px,9vw,110px);padding-bottom:clamp(64px,9vw,110px)}
.sechead{margin-bottom:clamp(30px,4vw,48px)}
.sechead h2,.lleft h2,.svleft h2,.ofgrid h2{font-size:clamp(2.4rem,5.4vw,4.2rem);line-height:1.04}
.sechead.split{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap}
.sechead.center{text-align:center;max-width:840px;margin-left:auto;margin-right:auto}

/* hero, centered, with the treatment wheel */
.hero.chero{min-height:100vh;min-height:100svh;display:flex;align-items:center;justify-content:center;text-align:center;padding-top:120px;padding-bottom:96px;background:#05080f}
.hero.chero::after{background:radial-gradient(ellipse at 50% 45%,rgba(5,8,15,.35) 0%,rgba(5,8,15,.62) 60%,rgba(5,8,15,.8) 100%),linear-gradient(180deg,rgba(12,21,32,0) 60%,#05080f 100%)!important}
.chero-in{position:relative;z-index:3;max-width:1000px;margin:0 auto;width:100%}
.chero h1{font-size:clamp(2.7rem,7.2vw,5.8rem);line-height:1.02;color:#fff;margin:0}
.chero .by{font:italic 400 clamp(1.15rem,2.4vw,1.6rem) var(--serif);margin-top:20px;color:#fff}
.chero .by span{opacity:.55;margin:0 10px;font-style:normal}
.wheel{position:relative;height:300px;max-width:660px;margin:30px auto 30px;-webkit-mask-image:linear-gradient(transparent,#000 28%,#000 72%,transparent);mask-image:linear-gradient(transparent,#000 28%,#000 72%,transparent)}
.wheel::before{content:"";position:absolute;left:50%;width:min(560px,92%);transform:translateX(-50%);top:50%;height:64px;margin-top:-32px;border-radius:999px;background:linear-gradient(90deg,rgba(243,181,88,.06),rgba(243,181,88,.38) 30%,rgba(243,181,88,.38) 70%,rgba(243,181,88,.06));box-shadow:inset 0 0 0 1px rgba(243,181,88,.35);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.wh-i{position:absolute;left:0;right:0;top:50%;height:64px;margin-top:-32px;font:italic 400 clamp(1.5rem,3.4vw,2.4rem)/64px var(--serif);color:#fff;text-decoration:none;transition:transform .7s cubic-bezier(.2,.7,.2,1),opacity .7s;white-space:nowrap}
.wh-i.on{font-weight:500}
.chero .row{gap:12px}
.chero .film-ui{z-index:4}
@media (max-width:700px){.hero.chero{padding-top:110px;padding-bottom:80px}.wheel{height:250px}.chero .row .pill{width:100%;white-space:normal}}

/* meet your surgeons bento */
.bento{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.bc{border-radius:20px;padding:clamp(26px,3vw,38px);min-height:230px}
.bc h3{font-size:clamp(1.55rem,2.3vw,2rem);line-height:1.12;margin:0 0 14px}
.bc p{color:#45525f;margin:0;font-size:1.02rem}
.bphoto{grid-column:span 2;border-radius:20px;overflow:hidden;min-height:360px;background:#0b0f17}
.bphoto video{width:100%;height:100%;object-fit:cover;display:block}
.docs a{display:grid;gap:2px;padding:12px 0;border-top:1px solid rgba(12,21,32,.12);text-decoration:none;color:#05080f}
.docs a b{font-weight:600}.docs a span{color:#45525f;font-size:.95rem}
.docs a:hover b{text-decoration:underline}
@media (max-width:900px){.bento{grid-template-columns:1fr}.bphoto{grid-column:auto;min-height:240px}.bc{min-height:0}}
.marquee{overflow:hidden;margin-top:clamp(56px,8vw,90px);padding:24px 0;border-top:1px solid rgba(255,255,255,.14);border-bottom:1px solid rgba(255,255,255,.14);-webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}
.mq-track{display:flex;align-items:center;gap:30px;width:max-content;animation:mq 46s linear infinite;font:italic 400 clamp(1.15rem,2vw,1.45rem) var(--serif);white-space:nowrap}
.mq-track i{opacity:.4;font-style:normal}
@keyframes mq{to{transform:translateX(-50%)}}
html.rm .mq-track{animation:none}

/* review track */
.quotes{text-align:center}
.qmark{font:400 8rem/.7 var(--serif);margin:10px 0 20px;color:#fff}
.qtrack-wrap{overflow:hidden;margin:0 -16px}
.qtrack{display:flex;align-items:center;transition:transform .8s cubic-bezier(.2,.7,.2,1);padding-left:calc(50% - min(780px,86vw)/2)}
.qt{flex:0 0 min(780px,86vw);margin:0;padding:clamp(26px,3.6vw,42px) clamp(24px,4vw,56px);border-radius:60px;opacity:.28;filter:blur(1.2px);transition:opacity .7s,filter .7s,background .7s}
.qt.on{opacity:1;filter:none;background:linear-gradient(90deg,rgba(243,181,88,.28),rgba(243,181,88,.08) 60%,rgba(255,255,255,.04))}
.qt blockquote{margin:0;font:italic 400 clamp(1.45rem,3.2vw,2.4rem)/1.22 var(--serif);color:#fff}
.qt figcaption{margin-top:14px;font:500 .98rem var(--sans);color:#c3ced9}
.qnav{display:flex;justify-content:center;align-items:center;gap:14px;margin-top:40px}

/* full-bleed photo sections */
.photosec{position:relative;overflow:hidden;isolation:isolate;min-height:min(92vh,860px);display:flex;align-items:center;padding-top:110px;padding-bottom:110px;background:#05080f}
.psbg{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;z-index:-2}
.photosec::before{content:"";position:absolute;inset:0;z-index:-1}
.photosec.left::before{background:linear-gradient(90deg,rgba(5,8,15,.25),rgba(5,8,15,0) 60%)}
.photosec.center::before{background:rgba(5,8,15,.45)}
.photosec.right::before{background:linear-gradient(270deg,rgba(5,8,15,.9) 0%,rgba(5,8,15,.55) 45%,rgba(5,8,15,.05) 80%)}
.lenssec::before{background:linear-gradient(90deg,rgba(5,8,15,.88) 0%,rgba(5,8,15,.6) 55%,rgba(5,8,15,.35) 100%)}
.photosec>.wrap{width:100%}
.feat{max-width:540px;border-radius:22px;padding:clamp(28px,4vw,48px);box-shadow:0 30px 70px rgba(5,8,15,.3)}
.feat h2{font-size:clamp(2.2rem,4.2vw,3.3rem);margin:0 0 18px;line-height:1.05}
.feat p{color:#45525f;margin:0 0 26px}
.watch{display:flex;align-items:center;gap:14px;margin-top:22px;background:none;border:0;padding:0;cursor:pointer;font:500 1.02rem var(--sans);color:#05080f;text-align:left}
.watch b{font-weight:700}
@media (max-width:760px){.photosec.left{align-items:flex-end;padding-top:46vh;padding-bottom:28px}.photosec.left::before{background:linear-gradient(180deg,transparent 40%,rgba(5,8,15,.5))}.feat{max-width:none}}

/* lens options */
.lgrid{display:grid;grid-template-columns:1.25fr .85fr;gap:clamp(24px,5vw,60px);align-items:center}
.lleft .pill{margin-top:26px}
.ltabs{display:grid;grid-template-columns:repeat(4,1fr);margin-top:clamp(36px,6vw,64px);border-top:1px solid rgba(255,255,255,.3)}
.ltab{background:none;border:0;border-top:3px solid transparent;margin-top:-2px;color:#fff;text-align:left;padding:18px 14px 0 0;cursor:pointer;display:grid;gap:6px;opacity:.7;transition:opacity .3s,border-color .3s;font-family:var(--sans)}
.ltab.on{border-top-color:#fff;opacity:1}
.ltab b{font:600 1.15rem var(--sans)}.ltab small{font-size:.88rem;color:#d3dde9;line-height:1.35}
.lright{background:rgba(255,255,255,.14);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid rgba(255,255,255,.2);border-radius:24px;padding:14px}
.lpanel{display:grid;gap:12px;animation:fadeup .5s ease both}
.lcell{background:#fff;color:#05080f;border-radius:16px;padding:18px 22px}
.lcell b{display:block;font:600 1.05rem var(--sans);margin-bottom:4px}.lcell span{color:#45525f}
@keyframes fadeup{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@media (max-width:900px){.lgrid{grid-template-columns:1fr}.ltabs{grid-template-columns:1fr 1fr;row-gap:18px}}

/* self-check */
.candsec{min-height:min(78vh,700px);text-align:center;justify-content:center}
.candsec h2{font-size:clamp(2.4rem,6vw,4.8rem);margin:0 0 30px;color:#fff}
.qbox{border:1px solid rgba(255,255,255,.3);border-radius:34px;padding:clamp(26px,5vw,60px) clamp(18px,5vw,70px);max-width:1000px;margin:0 auto}
.qbox-h{text-align:center;max-width:680px;margin:0 auto 26px}
.qbox-h h3{font-size:clamp(1.9rem,4vw,3rem);margin-bottom:12px}
.qbox-h p{color:#c3ced9}
.qbox .quiz{background:none;border:0;box-shadow:none;padding:0;text-align:center}
.qbox .qbtns{justify-content:center}
.qbox .qbtns button,.qbox .quiz .btn{border-radius:999px}

/* ages */
.agerow{display:flex;gap:14px;height:min(580px,72vh)}
.agec{position:relative;flex:1;min-width:0;border-radius:22px;overflow:hidden;cursor:pointer;transition:flex .8s cubic-bezier(.2,.7,.2,1);background:#0b0f17;color:#fff;outline-offset:3px}
.agec.on{flex:3.4;cursor:default}
.agec img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover}
.agec::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(5,8,15,.92) 0%,rgba(5,8,15,.35) 45%,rgba(5,8,15,.05) 100%)}
.agec.on::after{background:linear-gradient(90deg,rgba(5,8,15,.88) 0%,rgba(5,8,15,.55) 50%,rgba(5,8,15,.1) 100%)}
.agec-k{position:absolute;left:8px;right:8px;bottom:26px;text-align:center;font:400 clamp(1.3rem,2vw,1.7rem)/1.1 var(--serif);z-index:2;transition:opacity .4s}
.agec.on .agec-k{opacity:0}
.agec-body{position:absolute;left:clamp(22px,3vw,40px);bottom:clamp(22px,3vw,40px);width:min(440px,calc(100% - 44px));z-index:2;opacity:0;transform:translateY(12px);transition:opacity .5s,transform .5s;display:grid;gap:16px;justify-items:start;pointer-events:none}
.agec.on .agec-body{opacity:1;transform:none;transition-delay:.35s;pointer-events:auto}
.agec-t{font:400 clamp(2.4rem,5vw,4rem)/1 var(--serif)}
.agec-p{font-size:1.02rem;line-height:1.55;color:#e3eaf2}
@media (max-width:760px){.agerow{flex-direction:column;height:auto}.agec{flex:none;height:96px;transition:height .7s cubic-bezier(.2,.7,.2,1)}.agec.on{height:470px}.agec-k{bottom:auto;top:50%;transform:translateY(-50%)}.agec.on::after{background:linear-gradient(0deg,rgba(5,8,15,.94) 0%,rgba(5,8,15,.4) 60%,rgba(5,8,15,.1) 100%)}}

/* services carousel */
.svgrid{display:grid;grid-template-columns:300px minmax(0,1fr);gap:clamp(24px,4vw,48px);align-items:center}
.svleft hr{border:0;border-top:1px solid rgba(255,255,255,.3);margin:26px 0}
.svleft p{color:#c3ced9}
.svnav{display:flex;gap:12px;margin-top:28px}
.svtrack{display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding-bottom:4px;scroll-behavior:smooth}
.svtrack::-webkit-scrollbar{display:none}
.svcard{flex:0 0 min(420px,76vw);height:min(500px,62vh);border-radius:22px;overflow:hidden;position:relative;scroll-snap-align:start;color:#fff;text-decoration:none;background:#0b0f17}
.svcard img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
.svcard:hover img{transform:scale(1.05)}
.svcard::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(5,8,15,.85) 0%,rgba(5,8,15,.1) 50%)}
.svcard span{position:absolute;left:16px;right:16px;bottom:30px;text-align:center;font:400 clamp(1.6rem,2.6vw,2.1rem)/1.1 var(--serif);z-index:2}
@media (max-width:900px){.svgrid{grid-template-columns:1fr}.svtrack{margin-right:-16px}}

/* statement */
.stm{max-width:560px;margin-left:auto}
.stm h2{font-size:clamp(2.2rem,4.8vw,3.8rem);line-height:1.06;margin-bottom:20px}
.stm p{color:#dbe4ee;font-size:1.08rem}
.sig{display:block;margin-top:20px;font:600 1rem var(--sans)}
@media (max-width:760px){.statement{align-items:flex-end;padding-top:40vh;padding-bottom:56px}.photosec.right::before{background:linear-gradient(180deg,rgba(5,8,15,.1) 0%,rgba(5,8,15,.75) 45%,rgba(5,8,15,.95) 100%)}.stm{margin-left:0}}

/* patient tiles */
.tiles4{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:270px 270px 240px;gap:16px;max-width:1100px}
.ptile{position:relative;border-radius:22px;overflow:hidden;color:#fff;text-decoration:none;background:#0b0f17}
.ptile.tall{grid-row:span 2}.ptile.wide{grid-column:span 2}
.ptile img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;filter:grayscale(1) contrast(1.05);transition:filter .6s,transform 1.2s cubic-bezier(.2,.7,.2,1)}
.ptile:hover img{filter:grayscale(.15);transform:scale(1.04)}
.ptile::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(5,8,15,.8) 0%,rgba(5,8,15,0) 55%)}
.ptile span{position:absolute;left:28px;bottom:24px;z-index:2;font:400 clamp(1.6rem,2.6vw,2.1rem)/1.1 var(--serif)}
@media (max-width:700px){.tiles4{grid-template-columns:1fr;grid-template-rows:none;grid-auto-rows:220px}.ptile.tall,.ptile.wide{grid-row:auto;grid-column:auto}}

/* offices */
.ofgrid{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(28px,5vw,60px);align-items:center}
.offsec .mapgrid{display:block;margin-top:28px}
.offsec .card.map{display:none}
.offsec .card.office{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.18)}
.ofcircle{aspect-ratio:1;border-radius:50%;overflow:hidden;box-shadow:0 30px 80px rgba(0,0,0,.35)}
.ofcircle img{width:100%;height:100%;max-width:none;object-fit:cover}
@media (max-width:900px){.ofgrid{grid-template-columns:1fr}.ofcircle{width:min(320px,80%);margin:0 auto;order:-1}}

/* contact */
.contact{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(26px,5vw,60px);border-radius:30px;padding:clamp(26px,5vw,70px);background:radial-gradient(900px 500px at 0% 0%,rgba(243,181,88,.10),transparent 60%),#05080f}
.cleft h2{font-size:clamp(2.4rem,5vw,3.8rem);line-height:1.04;margin-bottom:20px}
.cleft p{color:#c3ced9}.cleft a{color:#fff}
.cform{display:grid;grid-template-columns:1fr 1fr;gap:14px;align-content:start}
.cform label span{display:block;font-size:.88rem;color:#c3ced9;margin-bottom:6px}
.cform input:not([type=checkbox]),.cform select{width:100%;height:54px;border-radius:12px;border:1px solid rgba(255,255,255,.35);background:rgba(255,255,255,.04);color:#fff;padding:0 16px;font:inherit;font-size:16px}
.cform select option{color:#05080f}
.cform .full{grid-column:1/-1}
.cform .check{display:flex;gap:12px;align-items:flex-start}
.cform .check span{margin:0;font-size:.92rem}
.cform .check input{width:20px;height:20px;margin-top:2px;flex:none}
.sendrow{display:flex;gap:16px;align-items:center;flex-wrap:wrap;margin-top:6px}
.sendrow .note{color:#c3ced9}
.cdone{background:rgba(255,255,255,.1);padding:14px 18px;border-radius:14px}
@media (max-width:860px){.contact{grid-template-columns:1fr}.cform{grid-template-columns:1fr}.sendrow .pill{width:100%}}

/* walkthrough in a window */
.modal{position:fixed;inset:0;z-index:90;background:rgba(5,8,15,.75);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);display:grid;place-items:center;padding:14px;overflow:auto}
.modal[hidden]{display:none}
.modal-in{position:relative;width:100%;max-width:1140px;border-radius:26px;padding:clamp(18px,3vw,34px);max-height:calc(100vh - 28px);overflow:auto;background:#fff;color:#05080f;
  --pearl:#05080f;--mist:#45525f;--hair:rgba(12,21,32,.14);--raise:#fff;--raise-2:#eef3f8;--gold:#05080f;--goldhover:#1b2633;--btntext:#fff;--goldtext:#2f5f93;--sky:#2f5f93}
.modal-in h2{font-size:clamp(1.8rem,3.6vw,2.6rem);margin:0 60px 18px 4px}
.modal-x{position:absolute;top:16px;right:16px;color:#05080f;border-color:rgba(12,21,32,.25);font-size:1.6rem;line-height:1}
.modal .proc{border:0;padding:0;box-shadow:none}

/* footer, Chu style */
footer{background:#0b111b;border-radius:30px 30px 0 0;border-top:0;margin-top:0;padding-top:clamp(48px,7vw,80px)}
.footlogo{text-align:center;font:400 clamp(2.2rem,5vw,3.4rem)/1 var(--serif);margin-bottom:clamp(30px,5vw,50px)}
.footlogo em{font-style:italic}
.footlogo small{display:block;font:600 .8rem var(--sans);letter-spacing:.42em;text-transform:uppercase;margin-top:14px;color:#c3ced9}
footer h4{font-family:var(--serif);font-style:italic;font-weight:400;font-size:1.35rem;margin-bottom:10px}
footer p,footer a{color:#c3ced9}
footer .note{color:#9aa7b4}
.floatpill{position:fixed;right:20px;bottom:20px;z-index:45;background:#f3b558;color:#05080f;border:1px solid rgba(255,255,255,.25);box-shadow:0 12px 30px rgba(5,8,15,.35)}
@media (max-width:860px){.floatpill{display:none}}
.mbar{background:#fff!important;border-top:1px solid rgba(12,21,32,.12)}
.mbar .btn{border-radius:999px}
.mbar .btn.ghost{color:#05080f;background:#fff;border-color:rgba(12,21,32,.2)}
.mbar .btn:not(.ghost){background:#f3b558;color:#05080f}
/* inner page heroes in navy */
.phero{background:radial-gradient(900px 500px at 10% 0%,rgba(243,181,88,.10),transparent 60%),#05080f}
.phero h1{font-family:var(--serif);font-weight:400}
/* before any script runs (or in a preview that blocks scripts) the cataract side is still drawn blurred */
#before.pre .lyF,#before.pre .lyM,#before.pre .lyN{filter:blur(6px) sepia(.75) saturate(.75) contrast(.8) brightness(1.04)}
.qbox .quiz{background:transparent!important;border:0!important;box-shadow:none!important;max-width:none}
.chero h1{max-width:none}
@media (max-width:860px){footer .foot4{grid-template-columns:1fr 1fr;gap:22px}footer .foot4>div:first-child{grid-column:1/-1}footer .foot4>div:nth-child(3){display:none}}
.nav.top,.nav{--pearl:#05080f;--mist:#45525f}.nav .links a,.nav .links button{color:#05080f}