/* N014 Glint Eyewear - desktop. Structure: the optician's chart wall (frames in front of a live eye chart). Palette: mist #E2EAEE / tortoise #3B2A1E / cobalt #2F58DE. */
body{background:var(--c1)}
.hero{position:relative;min-height:max(100svh,820px);display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--grid-gap);padding:calc(var(--s8) + 30px) var(--gutter) var(--s6);max-width:1680px;margin-inline:auto;align-items:center}
.hero-copy{grid-column:1 / span 4;grid-row:1;display:grid;gap:var(--s4);position:relative;z-index:2}
.lead{max-width:30ch}
.hero-stage{grid-column:5 / span 8;grid-row:1;position:relative;height:min(76svh,720px);min-height:540px}
.gesture{left:50%;bottom:var(--s3);translate:-50% 0}
.spec{grid-column:1 / span 4;grid-row:2;margin-top:var(--s5)}

.title{font:800 clamp(5rem,2rem + 8vw,11rem)/.8 var(--f-display);letter-spacing:var(--track-display);color:var(--ink)}
.gesture{position:absolute;display:flex;align-items:center;gap:8px;color:var(--ink-3);transition:opacity var(--dur) var(--ease-out);pointer-events:none}
.gesture .icon{width:16px;height:16px}
.hero-stage.has-turned .gesture{opacity:0}
.rx{display:inline-flex;align-items:center;gap:6px;padding:6px 8px 6px 16px;border:1px solid var(--line);border-radius:var(--pill);background:color-mix(in oklab,var(--c1) 70%,transparent);box-shadow:var(--spec);width:max-content}
.rx-k,.rx-u{color:var(--ink-3)}
.rx-b{width:var(--tap);height:var(--tap);border-radius:50%;display:grid;place-items:center;color:var(--ink);border:1px solid var(--line)}
.rx-b:active{transform:scale(.94)}.rx-b:focus-visible{outline:2px solid var(--c3);outline-offset:2px}
.rx-v{font:800 1.7rem/1 var(--f-display);letter-spacing:-.03em;min-width:3.6ch;text-align:center;color:var(--c3)}
.spec{display:grid;margin:0;border-top:1px solid var(--line-strong)}
.spec>div{padding:var(--s3) 0;border-bottom:1px solid var(--line);display:grid;gap:4px}
.spec dt{color:var(--ink-3)}.spec dd{margin:0;font:600 1.05rem/1.3 var(--f-body)}.spec small{display:block;font-weight:400;font-size:.84rem;color:var(--ink-2)}
.lenses{background:var(--c2);color:var(--c1)}
.lenses .tag,.lenses .body{color:var(--on-dark-2)}.lenses .h2{color:var(--c1)}.lenses .h2 .serif{font-style:italic;font-weight:400;color:color-mix(in oklab,var(--c1) 70%,var(--c3))}
.ln-list{list-style:none;margin:0;padding:0;display:grid;gap:var(--s4)}
.ln-row{display:grid;grid-template-columns:96px 1fr;gap:var(--s4);align-items:center;padding-bottom:var(--s4);border-bottom:1px solid var(--line-dark)}
.ln-row h3{font:700 1.45rem/1.1 var(--f-display);color:var(--c1)}.ln-row .mono{color:var(--c3)}
.ln-lens{width:96px;height:96px;border-radius:50%;border:2px solid var(--on-dark-2);display:grid;place-items:center;overflow:hidden;background:color-mix(in oklab,var(--c1) 8%,transparent)}
.ln-lens span{font:700 2rem/1 var(--f-display);color:var(--c1);transform:scale(var(--k))}
.ft-draw{width:100%;height:auto;max-width:640px}
.ft-draw .fr{fill:none;stroke:var(--ink);stroke-width:3}
.ft-draw .dim{fill:none;stroke:var(--c3);stroke-width:1.6}
.ft-draw .dt{font:500 13px var(--f-mono);fill:var(--ink-2);text-anchor:middle;letter-spacing:.06em;text-transform:uppercase}

.ln-in{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--grid-gap)}
.ln-head{grid-column:1 / span 5;display:grid;gap:var(--s3);align-content:start}.ln-list{grid-column:7 / span 6}
.ft-in{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--grid-gap);align-items:center}
.ft-head{grid-column:1 / span 5;display:grid;gap:var(--s3)}.ft-draw{grid-column:7 / span 6}
@media (max-width:1100px){.hero-copy,.spec{grid-column:1 / span 5}.hero-stage{grid-column:6 / span 7}.ln-head,.ln-list,.ft-head,.ft-draw{grid-column:1 / -1}}