/* Animasi interaktif beranda. Semua aturan diawali .fx (class ini ditambahkan oleh home-fx.js),
   jadi kalau script gagal jalan, halaman tetap tampil normal. */
.fx-prog{position:fixed;top:0;left:0;height:3px;width:100%;transform-origin:0 50%;transform:scaleX(0);background:linear-gradient(90deg,#a9cdff,#fff);z-index:1001;pointer-events:none}
.fx .hero{position:relative;overflow:hidden;padding-bottom:150px;background:linear-gradient(172deg,#071b4d 0%,#1243b0 52%,#4d86ee 84%,#f4f8ff 100%)}
.fx .hero .fx-cv{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.fx .hero-container{position:relative;z-index:2}
.fx .hero-text h1{font-size:clamp(2.2rem,4vw,3.5rem);line-height:1.08;letter-spacing:-.01em}
.fx .hero-text h1 .w{display:inline-block;opacity:0;transform:translateY(36px);animation:fxUp .8s cubic-bezier(.2,.8,.2,1) forwards}
@keyframes fxUp{to{opacity:1;transform:none}}
.fx .hero-badge{border:1px solid rgba(255,255,255,.3);backdrop-filter:blur(6px)}
.fx .hero-image{perspective:900px}
.fx .hero-image img{transition:opacity .7s ease,transform .25s ease;border:1px solid rgba(255,255,255,.35);box-shadow:0 40px 80px -30px rgba(2,10,40,.75)}
.fx-chip{position:absolute;left:4%;bottom:34px;display:flex;gap:10px;align-items:center;padding:11px 18px;border-radius:16px;background:rgba(255,255,255,.93);color:#0b2a6b;font-weight:600;font-size:.88rem;box-shadow:0 18px 40px -16px rgba(2,10,40,.6);animation:fxFloat 5s ease-in-out infinite}
.fx-chip i{color:#2563eb}
@keyframes fxFloat{50%{transform:translateY(-8px)}}
.fx .slider-dots{position:absolute;left:0;right:0;bottom:-26px;display:flex;justify-content:center;gap:8px;margin:0}
.fx .slider-dots .dot{width:9px;height:9px;border-radius:50%;background:rgba(10,31,68,.25);cursor:pointer;transition:all .3s}
.fx .slider-dots .dot.active{width:26px;border-radius:6px;background:#2563eb}
.fx .stat-card{transition:transform .3s,box-shadow .3s}
.fx .stat-card:hover{transform:translateY(-6px);box-shadow:0 24px 50px -24px rgba(20,60,160,.5)}
.fx .stat-card h3{color:#1d4ed8}
.fx .stats{background:linear-gradient(135deg,#071b4d,#2563eb)}
.fx .section-title h2,.fx .regulation h2,.fx .cta h2{color:#0b2a6b}
.fx .card,.fx .news-card,.fx .reg-card{position:relative;overflow:hidden;transition:transform .2s ease,box-shadow .3s ease,border-color .3s}
.fx .card::before{content:"";position:absolute;inset:0;background:radial-gradient(240px circle at var(--mx,50%) var(--my,50%),rgba(37,99,235,.16),transparent 70%);opacity:0;transition:opacity .3s;pointer-events:none}
.fx .card:hover::before{opacity:1}
.fx .card:hover{box-shadow:0 34px 60px -30px rgba(20,60,160,.55)}
.fx .card i{transition:transform .5s cubic-bezier(.3,1.5,.5,1),color .3s}
.fx .card:hover i{transform:rotate(-10deg) scale(1.2);color:#2563eb}
.fx .news-card:hover,.fx .reg-card:hover{transform:translateY(-6px);box-shadow:0 30px 56px -30px rgba(20,60,160,.5)}
.fx .news-card img{transition:transform .6s}
.fx .news-card:hover img{transform:scale(1.06)}
.fx-rv{opacity:0;transform:translateY(26px);transition:opacity .8s,transform .8s cubic-bezier(.2,.8,.2,1)}
.fx-rv.in{opacity:1;transform:none}
@media(max-width:860px){.fx .hero-container{flex-direction:column}.fx-chip{left:12px}.fx .hero{padding-bottom:120px}}
@media(prefers-reduced-motion:reduce){.fx *{animation:none!important;transition:none!important}.fx .hero-text h1 .w{opacity:1;transform:none}.fx-rv{opacity:1;transform:none}}
