/* SoulVoice motion layer (ported from minimal-dark / soulvoice.ai). CSP-safe: no inline styles. */
.grain{position:fixed;inset:0;z-index:9000;pointer-events:none;opacity:.035;mix-blend-mode:overlay;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");background-size:220px 220px}
.vignette{position:fixed;inset:0;z-index:8999;pointer-events:none;background:radial-gradient(ellipse 85% 75% at 50% 42%,transparent 42%,rgba(0,0,0,.45) 100%)}
/* hero background glow + wave layer */
.hero{position:relative;overflow:hidden;isolation:isolate}
.hero-glow{position:absolute;z-index:-1;width:70vw;height:70vw;max-width:900px;max-height:900px;right:-15vw;top:-20vw;border-radius:50%;background:radial-gradient(circle,rgba(245,245,245,.09),transparent 62%);animation:glowDrift 18s ease-in-out infinite alternate;pointer-events:none}
@keyframes glowDrift{0%{transform:translate(0,0) scale(1)}100%{transform:translate(-8vw,6vw) scale(1.15)}}
/* stage: photo + rings + live sound bars */
.stage{aspect-ratio:1/1}
.stage picture{position:relative;z-index:1;width:92%;display:block}
.stage picture img{width:100%;height:auto;border-radius:24px;-webkit-mask-image:radial-gradient(circle at 50% 50%,#000 55%,transparent 72%);mask-image:radial-gradient(circle at 50% 50%,#000 55%,transparent 72%)}
.hero__spec{position:absolute;left:0;right:0;bottom:2%;height:22%;z-index:2;pointer-events:none}
.voice-wave{width:100%;height:100%;display:block}
/* breathing live dot with expanding rings */
.live{display:inline-flex;align-items:center;gap:.7rem}
.core{position:relative;width:14px;height:14px;flex:none}
.core__kernel{position:absolute;inset:0;border-radius:50%;background:#F5F5F5;animation:mBreath 5s ease-in-out infinite}
.m-ring{position:absolute;left:50%;top:50%;width:100%;height:100%;border:1px solid rgba(255,255,255,.45);border-radius:50%;transform:translate(-50%,-50%) scale(1);opacity:0;animation:mRing 6s cubic-bezier(.2,.6,.3,1) infinite}
.m-ring:nth-child(2){animation-delay:2s}.m-ring:nth-child(3){animation-delay:4s}
@keyframes mBreath{0%,100%{transform:scale(.8)}50%{transform:scale(1.1)}}
@keyframes mRing{0%{transform:translate(-50%,-50%) scale(1);opacity:.6}100%{transform:translate(-50%,-50%) scale(3.6);opacity:0}}
/* headline word stagger (delays via classes d0..d11) */
.headline .w{display:inline-block;opacity:0;transform:translateY(.5em);filter:blur(4px);transition:opacity .9s var(--ease),transform .9s var(--ease),filter .9s}
.headline.words-in .w{opacity:1;transform:none;filter:none}
.w.d0{transition-delay:.15s}.w.d1{transition-delay:.24s}.w.d2{transition-delay:.33s}.w.d3{transition-delay:.42s}.w.d4{transition-delay:.51s}.w.d5{transition-delay:.6s}.w.d6{transition-delay:.69s}.w.d7{transition-delay:.78s}.w.d8{transition-delay:.87s}.w.d9{transition-delay:.96s}.w.d10{transition-delay:1.05s}.w.d11{transition-delay:1.14s}
.no-js .headline .w{opacity:1;transform:none;filter:none}
/* sections slide up */
.reveal{transform:translateY(48px);transition:opacity 1.1s var(--ease),transform 1.1s var(--ease)}
/* buttons: ghost fill sweep, primary arrow nudge */
.btn{position:relative;overflow:hidden;isolation:isolate}
.btn.ghost::after{content:"";position:absolute;inset:0;background:#F5F5F5;transform:scaleX(0);transform-origin:left;transition:transform .5s var(--ease);z-index:-1}
.btn.ghost:hover{color:#0E0E0E;border-color:#F5F5F5}.btn.ghost:hover::after{transform:scaleX(1)}
.btn:not(.ghost):not(.sm)::after{content:"→";display:inline-block;transition:transform .35s var(--ease)}
.btn:not(.ghost):not(.sm):hover::after{transform:translateX(5px)}
.btn:not(.ghost):hover{background:#fff}
/* ticker */
.marquee{background:#0E0E0E;padding:1.1rem 0}
.marquee .track{display:flex;width:max-content;font-size:.78rem;letter-spacing:.32em;text-transform:uppercase;color:#6E6E6E;gap:0}
.marquee .track span{padding:0 2.2rem}.marquee .track span::before{content:"●";font-size:.45em;margin-right:2.2rem;vertical-align:middle;color:#3A3A3A}
/* cursor dot (position set via CSS variables) */
.m-cursor{position:fixed;left:0;top:0;width:8px;height:8px;margin:-4px 0 0 -4px;border-radius:50%;background:#F5F5F5;pointer-events:none;z-index:10000;mix-blend-mode:difference;transition:width .25s,height .25s,margin .25s,opacity .3s;opacity:0;transform:translate(var(--cx,0),var(--cy,0))}
.m-cursor.on{opacity:1}.m-cursor.big{width:34px;height:34px;margin:-17px 0 0 -17px}
@media (hover:none),(pointer:coarse){.m-cursor{display:none}}
@media (prefers-reduced-motion:reduce){
 .headline .w,.reveal{opacity:1!important;transform:none!important;filter:none!important;transition:none!important}
 .m-ring,.core__kernel,.hero-glow,.marquee .track{animation:none!important}
 .m-cursor{display:none}
}