/* premium.css v2: lightweight polish. Only transform/opacity animations, no full-screen filters. */
::selection{background:var(--hot);color:#1a0406}

/* PERFORMANCE: live blur on every card was the main lag source. Solid glass looks the same on this dark page. */
.glass,.hero-card,.btn-glass,.perks li{-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
.glass{background:rgba(22,22,26,.82)}
.hero-card{background:rgba(20,20,24,.9)}
.nav{-webkit-backdrop-filter:none!important;backdrop-filter:none!important;background:rgba(9,9,11,.94)}

/* PERFORMANCE: the browser skips drawing sections that are far off screen */
section:not(.hero){content-visibility:auto;contain-intrinsic-size:auto 900px}

/* the one orchestrated moment: hero headline rises word by word (runs once) */
.hero h1 .ln{display:block;overflow:hidden;padding-bottom:.08em;margin-bottom:-.08em}
.pm-js .hero h1 .pm-w{display:inline-block;transform:translateY(110%);opacity:0;animation:pmW .9s cubic-bezier(.16,1,.3,1) forwards;animation-delay:calc(.1s + var(--i)*.06s)}
@keyframes pmW{to{transform:none;opacity:1}}
.pm-js .hero .lead,.pm-js .hero .cta-row,.pm-js .hero .proof,.pm-js .hero-card{opacity:0;animation:pmF .8s cubic-bezier(.16,1,.3,1) forwards}
.pm-js .hero .lead{animation-delay:.55s}.pm-js .hero .cta-row{animation-delay:.68s}.pm-js .hero .proof{animation-delay:.8s}.pm-js .hero-card{animation-delay:.45s}
@keyframes pmF{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}

/* hover polish (cheap: border + shadow only) */
@media(hover:hover){.glass{transition:border-color .3s,box-shadow .3s}.glass:hover{border-color:rgba(255,120,100,.34);box-shadow:0 24px 60px -34px rgba(255,75,85,.5)}}
.btn-hot{position:relative;overflow:hidden}
.btn-hot::after{content:"";position:absolute;top:0;left:-70%;width:45%;height:100%;transform:skewX(-22deg);background:linear-gradient(90deg,transparent,rgba(255,255,255,.5),transparent);transition:left .7s cubic-bezier(.16,1,.3,1)}
.btn-hot:hover::after{left:130%}

/* PERFORMANCE: animations pause while their section is off screen */
.pm-off .track,.pm-off .lgrow,.pm-off .chart .ln,.pm-off .chart .dot,.pm-off .offer-box::before,.pm-off .ph-prog i,.pm-off .typing i,.pm-off .g{animation-play-state:paused!important}

@media(prefers-reduced-motion:reduce){
  .pm-js .hero h1 .pm-w,.pm-js .hero .lead,.pm-js .hero .cta-row,.pm-js .hero .proof,.pm-js .hero-card{opacity:1;transform:none;animation:none}
}