/* Hero v2. The source glasses retain their original alpha and geometry. */
@font-face{font-family:Booton;src:url('fonts/booton.ttf') format('truetype');font-display:swap}
header{height:80px;padding:0 max(32px,4vw);gap:36px;background:rgba(251,246,239,.96);border-bottom-color:#c9b9a65e}
header .logo{font-family:Booton,Arial,sans-serif;font-size:36px;font-weight:700;letter-spacing:-2px}
header nav{margin-left:auto;font-family:Booton,Arial,sans-serif;font-size:15px;gap:36px}
header .social{margin-left:8px;font-family:Booton,Arial,sans-serif;font-size:15px}
header .motion{margin-left:12px;width:36px;height:36px;flex:0 0 auto;border-color:#917b68}
.hero-product{display:grid;grid-template-columns:44% 56%;grid-template-rows:1fr auto;min-height:calc(100svh - 80px);height:auto;max-width:1800px;margin:auto;padding:40px max(32px,4vw) 0;gap:28px 0;overflow:hidden;align-items:center}
.hero-product .hero-copy{padding:0 0 20px;align-self:center}
.hero-product h1{font-family:Booton,Arial,sans-serif;font-size:clamp(66px,7.2vw,116px);font-weight:700;letter-spacing:-.065em;line-height:1.01;margin:0 0 31px;color:#33261b}
.hero-product h1 span{display:block;white-space:nowrap}.hero-product .hero-accent{color:#c95f27}
.hero-product .hero-copy p{font-family:Booton,Arial,sans-serif;max-width:435px;margin:0;font-size:18px;line-height:1.5;letter-spacing:-.01em}
.hero-actions{display:flex;align-items:center;gap:30px;margin-top:34px;flex-wrap:wrap}
.hero-product .button{font-family:Booton,Arial,sans-serif;font-size:18px;line-height:1.2;font-weight:400;background:#c95f27;border-color:#c95f27;padding:17px 25px;min-height:56px;gap:18px;white-space:nowrap}
.hero-product .button:hover{background:#ac4919;border-color:#ac4919}
.hero-secondary{display:inline-flex;align-items:center;gap:9px;border-bottom:1px solid #75614d;padding:7px 0;font-family:Booton,Arial,sans-serif;font-size:16px;white-space:nowrap;line-height:1.3}
.hero-secondary svg{width:18px;height:18px}.hero-secondary:hover{color:#a24a1b;border-color:#a24a1b}
.hero-product .hero-art{position:relative;margin:0;height:clamp(420px,36vw,600px);max-height:none;align-self:center;isolation:isolate}
.hero-product-object{position:absolute;inset:0;will-change:transform;transform:translate3d(var(--product-x,0px),var(--product-y,0px),0) rotate(var(--product-r,0deg));transform-origin:50% 65%}
.hero-product .hero-glasses{position:absolute;left:-5%;top:15%;bottom:auto;width:110%;height:auto;mix-blend-mode:normal;mask-image:none;filter:drop-shadow(0 24px 17px #56412921);user-select:none;pointer-events:none}
.hero-product #hero-elda{position:absolute;left:73%;top:-3%;width:190px;height:220px;max-height:none;transform:translateX(-50%);filter:none;pointer-events:none}
.hero-annotation{position:absolute;left:39%;top:1%;font-family:Booton,Arial,sans-serif;font-size:14px;line-height:1.3;white-space:nowrap;z-index:4}
.hero-annotation svg{position:absolute;left:calc(100% + 8px);top:9px;width:56px;height:47px;stroke-width:1.1}.hero-annotation circle{fill:currentColor;stroke:0}
.hero-product figcaption{position:absolute;bottom:-6px;right:0;color:#806b5a;font-family:Booton,Arial,sans-serif;font-size:11px}
.hero-bottom{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:20px;border-top:1px solid #c9b9a6;width:100%;min-height:66px;font-family:Booton,Arial,sans-serif;font-size:14px}
.hero-bottom .scroll-cue{position:static;color:var(--ink);font-size:13px;gap:11px}.hero-bottom .scroll-cue svg{width:18px;height:18px}
@media(min-width:1400px){.hero-product{padding-top:55px;gap:45px 0}.hero-product .hero-copy p{font-size:20px;max-width:470px}.hero-product .hero-art{height:570px}.hero-product .hero-glasses{top:15%}.hero-product #hero-elda{width:215px;height:250px;top:-1%}.hero-actions{margin-top:42px;gap:38px}.hero-product .button{font-size:20px;padding:18px 30px}.hero-secondary{font-size:18px}.hero-annotation{font-size:16px}.hero-bottom{min-height:76px;font-size:16px}.hero-bottom .scroll-cue{font-size:15px}}
@media(min-width:681px) and (max-height:720px){.hero-product{padding-top:25px;gap:18px 0}.hero-product h1{font-size:clamp(58px,6.7vw,96px);margin-bottom:22px}.hero-product .hero-copy p{font-size:17px;max-width:400px}.hero-actions{margin-top:26px;gap:25px}.hero-product .hero-art{height:430px}.hero-product #hero-elda{height:210px;width:185px;top:-5%}.hero-bottom{min-height:58px}}
@media(min-width:681px) and (max-width:1000px){header{gap:25px}header nav{gap:24px}.hero-product{grid-template-columns:45% 55%;padding-left:32px;padding-right:32px}.hero-product h1{font-size:7.1vw}.hero-product .hero-copy p{font-size:16px;max-width:310px}.hero-actions{gap:15px;margin-top:25px}.hero-product .button{font-size:16px;min-height:50px;padding:14px 20px;gap:14px}.hero-secondary{font-size:14px}.hero-product .hero-art{height:370px}.hero-product #hero-elda{width:140px;height:170px;top:0}.hero-product .hero-glasses{top:22%}.hero-annotation{font-size:12px;left:24%;top:3%}.hero-product figcaption{font-size:10px;bottom:5px}}
@media(max-width:680px){header{height:70px;padding:0 22px;gap:22px}header .logo{font-size:29px;letter-spacing:-1.5px}header nav{margin-left:auto;gap:20px;font-size:13px}header .motion{width:32px;height:32px;margin-left:2px}header .social{display:none}.hero-product{display:grid;grid-template-columns:1fr;grid-template-rows:auto auto auto;padding:28px 24px 0;gap:0;min-height:calc(100svh - 70px)}.hero-product .hero-copy{padding:0}.hero-product h1{font-size:clamp(48px,13vw,74px);line-height:1.02;letter-spacing:-.06em;margin-bottom:21px}.hero-product .hero-copy p{max-width:440px;font-size:16px;line-height:1.43}.hero-actions{flex-wrap:nowrap;gap:20px;margin-top:24px}.hero-product .button{font-size:15px;min-height:49px;padding:13px 19px;gap:12px}.hero-product .button svg{width:19px;height:19px}.hero-secondary{font-size:13px;gap:7px}.hero-secondary svg{width:15px;height:15px}.hero-product .hero-art{width:100%;height:260px;margin-top:18px}.hero-product .hero-glasses{width:114%;left:-7%;top:16%}.hero-product #hero-elda{left:74%;top:-10%;height:150px;width:132px}.hero-annotation{font-size:11px;left:23%;top:0}.hero-annotation svg{width:32px;height:32px;left:calc(100% + 3px);top:8px}.hero-product figcaption{bottom:7px;right:0;font-size:9px}.hero-bottom{min-height:63px;margin-top:8px;gap:10px;align-items:center;font-size:11px}.hero-bottom .scroll-cue{font-size:10px;gap:5px}.hero-bottom .scroll-cue svg{height:15px;width:15px}}
@media(max-width:360px){header{padding:0 18px;gap:16px}header nav{gap:15px}.hero-product{padding-left:20px;padding-right:20px}.hero-actions{gap:13px}.hero-product .button{padding:12px 16px;font-size:14px}.hero-secondary{font-size:12px}.hero-product .hero-art{height:245px}.hero-bottom{font-size:10px}.hero-bottom .scroll-cue{font-size:9px}}
@media(prefers-reduced-motion:reduce){.hero-product-object{transform:none!important}}
/* Keep the companion seated just above the right temple at each art scale. */
.hero-product #hero-elda{top:13%}
@media(min-width:1400px){.hero-product #hero-elda{top:17%}}
@media(min-width:681px) and (max-width:1000px){.hero-product #hero-elda{top:12%}}
@media(max-width:680px){.hero-product .hero-art{height:clamp(260px,calc(66vw - 31px),420px)}.hero-product #hero-elda{top:8%}.hero-annotation{left:calc(74% - 155px)}}
@media(min-width:500px) and (max-width:680px){.hero-product #hero-elda{height:200px;width:180px;top:20%}.hero-annotation{top:13%;left:calc(74% - 180px)}}
@media(min-width:681px){.hero-product-object{inset:-15% 0 15%}}
@media(min-width:1400px){header .logo{font-size:42px}header nav,header .social{font-size:17px}.hero-product .hero-copy p{max-width:520px}.hero-product .button{padding-left:30px;padding-right:30px}}
@media(max-width:680px){.hero-product .hero-art{height:clamp(260px,calc(74vw - 36px),470px)}.hero-product figcaption{bottom:-12px}}
/* A compact split layout keeps the product visible in a narrow desktop pane. */
@media(min-width:600px) and (max-width:680px){.hero-product{grid-template-columns:46% 54%;grid-template-rows:1fr auto;gap:24px 0;padding-top:25px}.hero-product .hero-copy{align-self:center}.hero-product h1{font-size:52px}.hero-product .hero-copy p{font-size:15px;line-height:1.5;max-width:270px}.hero-actions{flex-wrap:wrap;gap:13px;margin-top:25px}.hero-product .hero-art{height:320px;margin-top:0}.hero-product #hero-elda{height:150px;width:132px;top:8%}.hero-annotation{left:calc(74% - 155px);top:0;font-size:10px}.hero-bottom{font-size:12px}.hero-bottom .scroll-cue{font-size:11px}.hero-product figcaption{font-size:9px}}

#scene-glasses{mix-blend-mode:normal;mask-image:none;filter:drop-shadow(0 18px 16px #5641291c)}
