/* ===== ASICS-2027 animations ===== */

/* Scroll progress bar */
.scroll-progress{position:fixed;top:0;left:0;height:3px;width:100%;z-index:100;background:linear-gradient(90deg,var(--gold),#f7dc8a);transform:scaleX(0);transform-origin:0 50%;pointer-events:none}

/* Page load */
@keyframes fadeUp{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes slideDown{from{opacity:0;transform:translateY(-100%)}to{opacity:1;transform:none}}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-16px)}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes spinRev{to{transform:rotate(-360deg)}}
@keyframes pulseGlow{0%,100%{box-shadow:inset -25px -28px 55px #07182c88,0 35px 90px #06182b88,0 0 0 0 #e5b43c00}50%{box-shadow:inset -25px -28px 55px #07182c88,0 35px 90px #06182b88,0 0 60px 8px #e5b43c33}}
@keyframes drift{0%,100%{transform:translate(0,0)}50%{transform:translate(-18px,14px)}}
@keyframes shine{from{transform:translateX(-120%) skewX(-20deg)}to{transform:translateX(220%) skewX(-20deg)}}
@keyframes underline{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes tick{0%{transform:translateY(-6px);opacity:.3}100%{transform:none;opacity:1}}

.nav-wrap{animation:slideDown .6s cubic-bezier(.2,.7,.2,1) both}
.topbar{animation:fadeIn .6s ease both}

/* Hero entrance */
.hero .eyebrow,.page-hero .eyebrow,.page-hero .breadcrumbs{animation:fadeUp .7s .1s cubic-bezier(.2,.7,.2,1) both}
.hero h1,.page-hero h1{animation:fadeUp .8s .2s cubic-bezier(.2,.7,.2,1) both}
.hero p,.page-hero p{animation:fadeUp .8s .35s cubic-bezier(.2,.7,.2,1) both}
.hero-actions{animation:fadeUp .8s .5s cubic-bezier(.2,.7,.2,1) both}
.hero-meta{animation:fadeUp .8s .65s cubic-bezier(.2,.7,.2,1) both}
.hero-art{animation:fadeIn 1.2s .4s ease both}

/* Hero decoration */
.hero:before{animation:spin 80s linear infinite}
.hero:after{animation:spinRev 60s linear infinite}
.page-hero{position:relative;overflow:hidden}
.page-hero:before{content:"";position:absolute;width:380px;height:380px;border:1px solid #ffffff1f;border-radius:50%;right:-80px;top:-140px;animation:drift 9s ease-in-out infinite}
.page-hero .container{position:relative;z-index:1}
.orb{animation:float 6s ease-in-out infinite,pulseGlow 5s ease-in-out infinite}
.orb:before{animation:spin 30s linear infinite}
.orb:after{animation:spinRev 22s linear infinite}
.countdown{animation:float 6s 1s ease-in-out infinite}
.countdown b.tick{animation:tick .35s ease}

/* Scroll reveal (only when JS is active, so content never stays hidden) */
.js .reveal{opacity:0;transform:translateY(34px);transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1);transition-delay:var(--d,0s)}
.js .reveal.left{transform:translateX(-40px)}
.js .reveal.right{transform:translateX(40px)}
.js .reveal.zoom{transform:scale(.92)}
.js .reveal.in{opacity:1;transform:none}

/* Section kicker underline */
.section-head h2,.section h2{position:relative}
.kicker{display:inline-block;position:relative}

/* Hover micro-interactions */
.card,.track,.date,.speaker,.stat{transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease}
.card:hover,.track:hover,.date:hover,.speaker:hover{transform:translateY(-6px);box-shadow:0 20px 45px rgba(23,54,93,.14);border-color:#d6c28a}
.stat:hover{transform:translateY(-4px);box-shadow:0 14px 30px rgba(23,54,93,.1)}
.icon{transition:transform .4s ease,background .3s}
.card:hover .icon{transform:rotate(-8deg) scale(1.12);background:#f2e2b0}
.speaker img{transition:transform .5s ease}
.speaker:hover img{transform:scale(1.06)}
.speaker{overflow:hidden}
.qr{transition:transform .3s ease}.qr:hover{transform:scale(1.06)}

/* Buttons: shine sweep */
.btn{position:relative;overflow:hidden}
.btn:after{content:"";position:absolute;top:0;left:0;width:40%;height:100%;background:linear-gradient(90deg,transparent,#ffffff55,transparent);transform:translateX(-120%) skewX(-20deg)}
.btn:hover:after{animation:shine .8s ease}
.nav-cta{animation:fadeIn 1s .8s ease both}

/* Nav link underline slide */
.links a{position:relative}
.links a:not(.active):after{content:"";position:absolute;left:0;right:0;bottom:-10px;height:3px;background:var(--gold);border-radius:3px;transform:scaleX(0);transform-origin:left;transition:transform .3s ease}
.links a:not(.active):hover:after{transform:scaleX(1)}
.links a.active:after{animation:underline .5s .5s ease both;transform-origin:left}

/* Sticky nav shrink on scroll */
.nav{transition:height .3s ease}
.nav-wrap.scrolled .nav{height:68px}
.nav-wrap.scrolled{box-shadow:0 8px 28px rgba(23,54,93,.12)}
.brand img{transition:transform .5s ease}
.brand:hover img{transform:rotate(360deg)}

/* Mobile menu animation */
@media(max-width:700px){
  .links{animation:none}
  .links.open{animation:fadeUp .3s ease both}
}

/* Stat numbers */
.stat b,.hero-meta b,.countdown b{font-variant-numeric:tabular-nums}

/* Back to top */
.to-top{position:fixed;right:22px;bottom:22px;width:46px;height:46px;border-radius:50%;border:0;background:var(--navy);color:#fff;font-size:20px;cursor:pointer;box-shadow:var(--shadow);border-bottom:3px solid var(--gold);opacity:0;visibility:hidden;transform:translateY(14px);transition:.3s;z-index:60}
.to-top.show{opacity:1;visibility:visible;transform:none}
.to-top:hover{background:var(--blue);transform:translateY(-3px)}

/* FAQ */
.faq details[open] summary{color:var(--blue)}
.faq details p{animation:fadeUp .35s ease both}

/* Respect reduced-motion preferences */
@media (prefers-reduced-motion:reduce){
  *,*:before,*:after{animation:none!important;transition:none!important}
  .js .reveal{opacity:1!important;transform:none!important}
  html{scroll-behavior:auto}
}