/* N014 Glint Eyewear - phone build. Same spectacles model, chart texture and HDRI as desktop; swipe slides the frames. */
body{background:var(--c1)}
.hero{position:relative;display:flex;flex-direction:column;padding-bottom:var(--s5)}
.hero-stage{position:relative;order:-1;height:min(54svh,480px);min-height:360px;margin-top:calc(env(safe-area-inset-top) + 58px)}
.hero-copy{display:grid;gap:var(--s3);padding:0 var(--gutter);position:relative;z-index:2}
.title{font-size:clamp(4rem,22vw,6rem)}
.tag{order:-1}
.gesture{left:50%;bottom:8px;translate:-50% 0;white-space:nowrap;padding:8px 12px;border-radius:var(--pill);background:color-mix(in oklab,var(--c1) 70%,transparent)}
.rx{width:100%;justify-content:space-between}
.spec{margin:var(--s4) var(--gutter) 0}

.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,.ft-in{display:grid;gap:var(--s4)}.ln-head,.ft-head{display:grid;gap:var(--s3)}
.ln-row{grid-template-columns:72px 1fr}.ln-lens{width:72px;height:72px}
