/* Effects */
.hdr{transition:transform .38s cubic-bezier(.22,1,.36,1),background .3s,box-shadow .3s}
.hdr.hide{transform:translateY(-115%)}
.hdr.scrolled{background:rgba(5,8,20,.92);box-shadow:0 18px 44px -22px rgba(2,6,20,.95)}
.hdr.scrolled::after{opacity:1;filter:drop-shadow(0 0 8px rgba(46,123,255,.6))}
.reveal{opacity:0;transform:translateY(28px);transition:opacity .7s ease,transform .7s cubic-bezier(.22,1,.36,1)}
.reveal.in{opacity:1;transform:none}
.card{--mx:50%;--my:50%;will-change:transform}
.card::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;opacity:0;transition:opacity .3s;background:radial-gradient(240px circle at var(--mx) var(--my),rgba(53,229,255,.16),transparent 60%)}
.card:hover::before{opacity:1}
.thumb::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.12) 50%,transparent 70%);transform:translateX(-120%);transition:transform .7s}
.card:hover .thumb::after{transform:translateX(120%)}
.card.pop{animation:pop .5s cubic-bezier(.22,1,.36,1) both}
@keyframes pop{from{opacity:0;transform:translateY(18px) scale(.97)}to{opacity:1;transform:none}}
.hero::after{content:"";position:absolute;width:520px;height:520px;right:-120px;top:-80px;border-radius:50%;background:radial-gradient(circle,rgba(46,123,255,.35),transparent 65%);filter:blur(20px);z-index:-1;animation:float 9s ease-in-out infinite}
@keyframes float{50%{transform:translate(-40px,40px) scale(1.1)}}
.tag{animation:glow 3s ease-in-out infinite}
@keyframes glow{50%{box-shadow:0 0 22px rgba(255,46,77,.45)}}
.pager a{cursor:pointer;user-select:none}
.pager a.dis{opacity:.35;pointer-events:none}
.pager .dots{background:none;border:0;pointer-events:none}
.totop{position:fixed;right:18px;bottom:calc(18px + env(safe-area-inset-bottom,0px));width:46px;height:46px;border-radius:14px;background:var(--grad);color:#04112e;font-size:20px;box-shadow:0 10px 30px -8px rgba(46,123,255,.8);opacity:0;transform:translateY(20px);pointer-events:none;transition:.3s;z-index:40}
.totop.show{opacity:1;transform:none;pointer-events:auto}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.reveal{opacity:1;transform:none}}


