/* Decorative layers never intercept links. Motion is optional and settles within five seconds. */
.hero-copy{position:relative;isolation:isolate}
.hero-copy::before{content:"";position:absolute;z-index:-1;pointer-events:none;inset:5% 0 0;background:radial-gradient(ellipse at 25% 40%,#9864dc12,transparent 65%)}
.feature-card{position:relative;isolation:isolate;overflow:hidden}
.feature-card::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 10% 0%,#ba98ff14,transparent 70%);opacity:0}
.button{position:relative;isolation:isolate;overflow:hidden}
.button::after{content:"";position:absolute;inset:-60% -30%;pointer-events:none;background:linear-gradient(110deg,transparent 35%,#ffffff45 50%,transparent 65%);transform:translateX(-120%)}
@media(prefers-reduced-motion:no-preference){
 .hero-copy>.eyebrow{animation:landing-enter .65s both}
 .hero h1{animation:landing-enter .75s .08s both}
 .hero .intro{animation:landing-enter .75s .16s both}
 .hero-actions{animation:landing-enter .75s .24s both}
 .hero-note{animation:landing-enter .75s .3s both}
 .product-preview{animation:landing-preview .95s .15s both}
 .alert-example{animation:landing-alert .85s .65s both}
 .goal-track>span{transform-origin:left;animation:landing-progress 1.4s .7s both}
 .sound-wave i{transform-origin:center;animation:landing-wave .75s ease-in-out 6}
 .sound-wave i:nth-child(2n){animation-delay:.12s}
 .sound-wave i:nth-child(3){animation-delay:.22s}
 .stage-orbit{animation:landing-orbit 4.5s ease-in-out}
 .feature-card{transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease}
 .feature-card::before{transition:opacity .25s ease}
 .feature-icon,.button>span,.text-link>span{transition:transform .25s ease}
 .questions summary{transition:color .2s ease}
 .questions details[open]>p{animation:landing-enter .25s ease both}
}
@media(hover:hover) and (pointer:fine){
 .feature-card:hover{border-color:#625171;box-shadow:0 14px 35px #0002}
 .feature-card:hover::before{opacity:1}
 .questions summary:hover{color:var(--accent)}
}
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
 .feature-card:hover{transform:translateY(-5px)}
 .feature-card:hover .feature-icon{transform:translateY(-2px)}
 .button:hover::after{animation:landing-sheen .65s ease}
 .button:hover>span{transform:translate(2px,-2px)}
 .text-link:hover>span{transform:translateY(3px)}
}
@keyframes landing-enter{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}
@keyframes landing-preview{from{opacity:0;translate:0 18px}to{opacity:1;translate:0 0}}
@keyframes landing-alert{from{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes landing-progress{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes landing-wave{0%,100%{transform:scaleY(1)}50%{transform:scaleY(.45)}}
@keyframes landing-orbit{0%,100%{transform:translate(0,0)}50%{transform:translate(-10px,8px)}}
@keyframes landing-sheen{from{transform:translateX(-120%)}to{transform:translateX(120%)}}

