.power-intro-screen{display:none}
html.power-intro,html.power-intro body{overflow:hidden}
html.power-intro .power-intro-screen{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;overflow:hidden;background:#020811;color:#fff;isolation:isolate}
.power-intro-grid{position:absolute;inset:-20%;z-index:-3;background-image:linear-gradient(rgba(42,168,255,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(42,168,255,.07) 1px,transparent 1px);background-size:70px 70px;transform:perspective(700px) rotateX(62deg) translateY(26%);transform-origin:center bottom;opacity:0;animation:intro-grid 1.6s .2s ease forwards}
.power-intro-flare{position:absolute;inset:0;z-index:-2;background:radial-gradient(circle at 50% 50%,rgba(42,168,255,.3),transparent 8%),radial-gradient(circle at 50% 50%,rgba(19,115,220,.16),transparent 35%);opacity:0;animation:intro-flare .9s .65s ease-out forwards}
.power-trace{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.power-trace path{fill:none;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1}
.power-trace-glow{stroke:#168cff;stroke-width:18;filter:blur(14px);animation:power-line 1.05s .2s cubic-bezier(.55,0,.28,1) forwards}
.power-trace-core{stroke:#dff6ff;stroke-width:3;filter:drop-shadow(0 0 7px #2aa8ff);animation:power-line 1.05s .2s cubic-bezier(.55,0,.28,1) forwards}
.power-intro-brand{position:relative;text-align:center;opacity:0;transform:scale(.92);animation:brand-live .65s .88s cubic-bezier(.15,.8,.25,1) forwards}
.power-intro-brand>span{display:block;margin-bottom:15px;color:#7fcaff;font:600 11px/1 'DM Sans',sans-serif;letter-spacing:.34em}
.power-logo-frame{width:min(390px,76vw);height:260px;padding:0;display:grid;place-items:center;background:transparent;border:0;filter:drop-shadow(0 0 22px rgba(42,168,255,.42))}
.power-logo-frame img{display:block;width:100%;height:100%;object-fit:contain;filter:brightness(.7);animation:logo-charge .5s 1.05s ease-out forwards}
.power-intro-brand p{margin:24px 0 0;font:600 clamp(16px,2vw,25px)/1 'Oswald',sans-serif;letter-spacing:.15em;opacity:0;animation:words-live .45s 1.28s ease forwards}
.power-intro-meter{position:absolute;left:8vw;right:8vw;bottom:8vh;height:2px;background:rgba(255,255,255,.12);overflow:hidden}
.power-intro-meter i{display:block;width:100%;height:100%;background:linear-gradient(90deg,#1373dc,#dff6ff);transform:translateX(-100%);box-shadow:0 0 14px #2aa8ff;animation:meter-live 1.8s .15s cubic-bezier(.4,0,.2,1) forwards}
.power-intro-skip{position:absolute;right:28px;top:25px;border:0;background:transparent;color:#8ba0b8;font:600 11px 'DM Sans',sans-serif;letter-spacing:.12em;text-transform:uppercase;cursor:pointer}
.power-intro-skip:hover,.power-intro-skip:focus-visible{color:#fff}
html.power-intro-complete .power-intro-screen{animation:intro-exit .62s cubic-bezier(.7,0,.3,1) forwards}
@keyframes power-line{0%{stroke-dashoffset:1}70%{opacity:1}100%{stroke-dashoffset:0;opacity:.5}}
@keyframes intro-grid{to{opacity:1;transform:perspective(700px) rotateX(62deg) translateY(18%)}}
@keyframes intro-flare{0%{opacity:0;transform:scale(.3)}35%{opacity:1}100%{opacity:.28;transform:scale(3)}}
@keyframes brand-live{0%{opacity:0;transform:scale(.92)}55%{opacity:1;transform:scale(1.035)}100%{opacity:1;transform:scale(1)}}
@keyframes logo-charge{0%{filter:brightness(.7)}40%{filter:brightness(2.2) drop-shadow(0 0 18px #2aa8ff)}100%{filter:brightness(1)}}
@keyframes words-live{to{opacity:1;letter-spacing:.1em}}
@keyframes meter-live{to{transform:translateX(0)}}
@keyframes intro-exit{0%{opacity:1;clip-path:inset(0)}100%{opacity:0;clip-path:inset(0 0 100% 0)}}
@media(max-width:600px){.power-trace{transform:scaleX(1.8);transform-origin:center}.power-logo-frame{height:190px;padding:0}.power-intro-brand p{max-width:290px;line-height:1.3}.power-intro-meter{bottom:6vh}}
@media(prefers-reduced-motion:reduce){.power-intro-screen{display:none!important}}
