/* ═══════════════════════════════════════════════════
   ROYAL POS — Animations v2
   ═══════════════════════════════════════════════════ */

/* ── AOS custom offsets ── */
[data-aos]{will-change:transform,opacity}

/* ── Slide-up entry ── */
@keyframes slideUp{from{opacity:0;transform:translateY(36px)}to{opacity:1;transform:translateY(0)}}
@keyframes slideLeft{from{opacity:0;transform:translateX(-36px)}to{opacity:1;transform:translateX(0)}}
@keyframes slideRight{from{opacity:0;transform:translateX(36px)}to{opacity:1;transform:translateX(0)}}
@keyframes zoomIn{from{opacity:0;transform:scale(0.88)}to{opacity:1;transform:scale(1)}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}

/* ── Hero text entrance ── */
.hero-slide.active .hero-h1{animation:slideUp .7s cubic-bezier(.4,0,.2,1) .1s both}
.hero-slide.active .hero-eyebrow{animation:slideUp .6s cubic-bezier(.4,0,.2,1) 0s both}
.hero-slide.active .hero-p{animation:slideUp .7s cubic-bezier(.4,0,.2,1) .2s both}
.hero-slide.active .hero-actions{animation:slideUp .7s cubic-bezier(.4,0,.2,1) .3s both}
.hero-slide.active .hero-stats{animation:slideUp .7s cubic-bezier(.4,0,.2,1) .4s both}
.hero-slide.active .hero-badge{animation:slideUp .7s cubic-bezier(.4,0,.2,1) .45s both}
.hero-slide.active .hero-card{animation:slideRight .8s cubic-bezier(.4,0,.2,1) .25s both}

/* ── Hover lift ── */
.hover-lift{transition:transform .28s cubic-bezier(.4,0,.2,1),box-shadow .28s ease}
.hover-lift:hover{transform:translateY(-6px);box-shadow:0 16px 48px rgba(15,37,87,0.15)}

/* ── Button pulse ── */
@keyframes btnPulse{0%{box-shadow:0 0 0 0 rgba(244,96,26,0.5)}70%{box-shadow:0 0 0 14px rgba(244,96,26,0)}100%{box-shadow:0 0 0 0 rgba(244,96,26,0)}}
.btn-pulse{animation:btnPulse 2.2s ease-out infinite}

/* ── Shimmer (loading skeleton) ── */
@keyframes shimmer{from{background-position:-200% 0}to{background-position:200% 0}}
.shimmer{background:linear-gradient(90deg,var(--rp-gray-100) 25%,var(--rp-gray-50) 50%,var(--rp-gray-100) 75%);background-size:200% 100%;animation:shimmer 1.5s infinite}

/* ── Spin ── */
@keyframes spin{to{transform:rotate(360deg)}}
.spin{animation:spin .7s linear infinite}

/* ── Progress bar ── */
@keyframes barFill{from{width:0%}}
.bar-anim{animation:barFill 1.4s ease forwards}

/* ── Stagger helpers (for JS iteration) ── */
.d-100{animation-delay:.1s}
.d-200{animation-delay:.2s}
.d-300{animation-delay:.3s}
.d-400{animation-delay:.4s}
.d-500{animation-delay:.5s}
.d-600{animation-delay:.6s}

/* ── Floating decorative elements ── */
@keyframes floatUp{0%,100%{transform:translateY(0) rotate(0deg)}50%{transform:translateY(-16px) rotate(3deg)}}
.float-el{animation:floatUp 5s ease-in-out infinite}
.float-el.delay2{animation-delay:1.5s}
.float-el.delay3{animation-delay:2.8s}

/* ── Number counter pop ── */
@keyframes countPop{0%{transform:scale(1)}50%{transform:scale(1.12)}100%{transform:scale(1)}}
.count-pop{animation:countPop .3s ease}

/* ── Card entrance on scroll ── */
.card-reveal{opacity:0;transform:translateY(28px);transition:opacity .6s ease,transform .6s ease}
.card-reveal.in-view{opacity:1;transform:translateY(0)}

/* ── Typewriter cursor ── */
@keyframes blink{0%,100%{opacity:1}50%{opacity:0}}
.typewriter-cursor::after{content:'|';color:var(--rp-orange);animation:blink .9s step-end infinite}

/* ── Line draw (SVG stroke) ── */
@keyframes drawLine{from{stroke-dashoffset:1000}to{stroke-dashoffset:0}}
.draw-line{stroke-dasharray:1000;animation:drawLine 1.5s ease forwards}

/* ── Reduced motion ── */
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}