/* The original SONO artwork is the metal. These layers are light only. */
#hero .sx-hero-eyebrow{position:relative;z-index:3;display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 var(--sx-edge) clamp(14px,1.8vw,24px)}
#hero .sx-hero-eyebrow .sx-hero-tagline{margin:0}
#hero .sx-cinema-control{display:none;align-items:center;justify-content:center;position:relative;width:44px;height:44px;flex:none;padding:0;border:0;border-radius:50%;background:transparent;color:#d1d9e1;cursor:pointer;transition:background .2s,border-color .2s}
#hero.sx-cinema-on .sx-cinema-control{display:inline-flex}
#hero .sx-cinema-control::before{content:"";position:absolute;inset:6px;border:1px solid var(--sx-line-2);border-radius:50%;background:rgba(9,12,16,.4);transition:background .2s,border-color .2s}
#hero .sx-cinema-control:hover::before{background:rgba(210,224,244,.15);border-color:var(--sx-soft)}
#hero .sx-cinema-control:focus-visible{outline:2px solid #e8f3ff;outline-offset:5px}
#hero .sx-cinema-control svg{position:relative;width:12px;height:12px;fill:currentColor}
#hero .sx-cinema-control .sx-play{display:none}
#hero.sx-cinema-paused .sx-pause{display:none}
#hero.sx-cinema-paused .sx-play{display:block}
#hero .sx-word.sx-cinema{overflow:visible;isolation:isolate;--sx-light-x:-45%;--sx-light-opacity:0;--sx-bloom:0;--sx-lamp-x:55%;--sx-lamp-y:30%;--sx-lamp:0;--sx-metal:1}
#hero .sx-word.sx-cinema img{position:relative;z-index:1;transform:none;transition:none;filter:brightness(var(--sx-metal)) contrast(1.12) drop-shadow(0 2px 3px rgba(0,0,0,.7))}
#hero .sx-cinema-layer{position:absolute;inset:0;pointer-events:none;-webkit-mask:url('/assets/sonoxr/sono-wordmark-crop.webp') center / 100% 100% no-repeat;mask:url('/assets/sonoxr/sono-wordmark-crop.webp') center / 100% 100% no-repeat}
#hero .sx-cinema-wash{z-index:2;mix-blend-mode:screen;background:linear-gradient(180deg,rgba(193,219,248,.2),transparent 34%,rgba(25,38,57,.05) 48%,rgba(205,226,255,.13) 51%,transparent 78%,rgba(194,219,248,.2))}
#hero .sx-cinema-light{z-index:3;mix-blend-mode:screen;opacity:var(--sx-light-opacity)}
#hero .sx-cinema-light::before,#hero .sx-cinema-halo .sx-cinema-layer::before{content:"";position:absolute;inset:-20% -40%;transform:translateX(var(--sx-light-x));background:linear-gradient(112deg,transparent 36%,rgba(157,196,243,.03) 40%,rgba(193,220,255,.22) 44%,rgba(223,238,255,.75) 48%,#fff 50%,rgba(224,238,255,.65) 52%,rgba(173,204,244,.12) 57%,transparent 64%)}
#hero .sx-cinema-halo{position:absolute;inset:0;z-index:0;pointer-events:none;opacity:var(--sx-bloom);filter:blur(clamp(8px,1.8vw,28px))}
#hero .sx-cinema-halo .sx-cinema-layer::before{background:linear-gradient(112deg,transparent 34%,rgba(179,213,255,.08) 40%,rgba(207,229,255,.8) 48%,#edf6ff 50%,rgba(182,211,255,.3) 57%,transparent 66%)}
#hero .sx-cinema-lamp{z-index:4;mix-blend-mode:screen;opacity:var(--sx-lamp);background:radial-gradient(ellipse 23% 100% at var(--sx-lamp-x) var(--sx-lamp-y),rgba(232,243,255,.5),rgba(193,217,248,.12) 42%,transparent 74%)}
#hero .sx-cinema-aura{position:absolute;inset:12% 3%;z-index:-1;pointer-events:none;opacity:.2;background:radial-gradient(ellipse at 50% 50%,rgba(166,206,255,.3),transparent 68%);filter:blur(24px)}
#hero.sx-cinema-on .sx-word.sx-cinema{animation:sx-cinema-reveal 3.8s cubic-bezier(.16,1,.3,1) both}
#hero.sx-cinema-paused .sx-word.sx-cinema{animation-play-state:paused}
@keyframes sx-cinema-reveal{from{opacity:.2;transform:scale(1.025);filter:blur(2px)}35%{opacity:1;filter:blur(0)}to{opacity:1;transform:none;filter:none}}
@media(max-width:600px){#hero .sx-cinema-control::before{inset:8px}#hero .sx-hero-eyebrow{gap:8px}#hero .sx-hero-eyebrow .sx-hero-tagline{font-size:10px;letter-spacing:.11em}#hero .sx-cinema-aura{filter:blur(14px)}}
@media(prefers-reduced-motion:reduce){#hero .sx-word.sx-cinema{animation:none!important;transform:none!important;opacity:1!important;filter:none!important}#hero .sx-cinema-light,#hero .sx-cinema-halo,#hero .sx-cinema-lamp,#hero.sx-cinema-on .sx-cinema-control{display:none!important}#hero .sx-word.sx-cinema img{filter:contrast(1.08)}#hero .sx-cinema-control{transition:none}}
