/* ═══════════════════════════════════════════════════════════════════════════
   FUNDA THEME — enhancements.css
   Animations ONLY. Loaded with media="print" onload="this.media='all'" 
   Non-blocking. No layout rules here.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── SCROLL REVEAL ──────────────────────────────────────────────────────────── */
.reveal{opacity:0;transform:translateY(40px);transition:opacity .7s cubic-bezier(.4,0,.2,1),transform .7s cubic-bezier(.4,0,.2,1)}
.reveal.in-view{opacity:1;transform:translateY(0)}
.reveal-left{opacity:0;transform:translateX(-40px);transition:opacity .7s cubic-bezier(.4,0,.2,1),transform .7s cubic-bezier(.4,0,.2,1)}
.reveal-left.in-view{opacity:1;transform:translateX(0)}
.reveal-right{opacity:0;transform:translateX(40px);transition:opacity .7s cubic-bezier(.4,0,.2,1),transform .7s cubic-bezier(.4,0,.2,1)}
.reveal-right.in-view{opacity:1;transform:translateX(0)}
.reveal-scale{opacity:0;transform:scale(.92);transition:opacity .6s ease,transform .6s ease}
.reveal-scale.in-view{opacity:1;transform:scale(1)}

/* Stagger delays */
.stagger-1{transition-delay:.05s}
.stagger-2{transition-delay:.12s}
.stagger-3{transition-delay:.2s}
.stagger-4{transition-delay:.28s}
.stagger-5{transition-delay:.36s}
.stagger-6{transition-delay:.44s}

/* ── COURSE CARD HOVER GLOW ───────────────────────────────────────────────────── */
.course-card::after{content:'';position:absolute;inset:-1px;border-radius:inherit;background:var(--funda-gradient);opacity:0;transition:opacity .4s;z-index:-1}
.course-card:hover::after{opacity:.15}

/* ── FEATURE CARD SHIMMER ─────────────────────────────────────────────────────── */
@keyframes shimmer{0%{left:-100%}100%{left:200%}}
.feature-card::after{content:'';position:absolute;top:0;left:-100%;width:50%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.04),transparent);animation:shimmer 3s ease-in-out infinite;pointer-events:none}

/* ── LOADING SPINNER ────────────────────────────────────────────────────────── */
@keyframes spin{to{transform:rotate(360deg)}}
.funda-spinner{width:24px;height:24px;border:2px solid rgba(255,255,255,.2);border-top-color:#fff;border-radius:50%;animation:spin .7s linear infinite;display:inline-block}

/* ── HERO PARTICLE DOTS ───────────────────────────────────────────────────────── */
@keyframes particleFloat{0%,100%{transform:translateY(0) rotate(0deg);opacity:.6}50%{transform:translateY(-30px) rotate(180deg);opacity:1}}
.hero-particle{position:absolute;width:4px;height:4px;background:var(--funda-primary);border-radius:50%;pointer-events:none;animation:particleFloat linear infinite;opacity:.6}

/* ── GRADIENT TEXT ANIMATE ─────────────────────────────────────────────────────── */
@keyframes gradientShift{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}
.text-gradient-animate{background:linear-gradient(270deg,var(--funda-primary),var(--funda-secondary),var(--funda-accent),var(--funda-primary));background-size:300% 300%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:gradientShift 4s ease infinite}

/* ── BUTTON RIPPLE ───────────────────────────────────────────────────────────── */
@keyframes ripple{0%{transform:scale(0);opacity:.4}100%{transform:scale(2.5);opacity:0}}
.funda-btn{overflow:hidden;position:relative}
.btn-ripple{position:absolute;border-radius:50%;background:rgba(255,255,255,.3);transform:scale(0);animation:ripple .5s linear;pointer-events:none}

/* ── TESTIMONIAL CARD ENTRANCE ────────────────────────────────────────────────── */
.testimonial-card{transition:all .4s cubic-bezier(.4,0,.2,1)}

/* ── STAT COUNTER ANIMATION ───────────────────────────────────────────────────── */
.stat-number{transition:all .5s ease}

/* ── COURSE CARD SHIMMER ON LOAD ─────────────────────────────────────────────── */
.course-card-skeleton{background:linear-gradient(90deg,rgba(255,255,255,.04) 25%,rgba(255,255,255,.08) 37%,rgba(255,255,255,.04) 63%);background-size:400px 100%;animation:skeletonShimmer 1.4s ease infinite}
@keyframes skeletonShimmer{0%{background-position:-400px 0}100%{background-position:400px 0}}

/* ── LOGO MARQUEE (Trust section) ─────────────────────────────────────────────── */
.trust-track{display:flex;gap:48px;animation:logoScroll 20s linear infinite;width:max-content}
.trust-track-wrap{overflow:hidden;mask-image:linear-gradient(90deg,transparent,black 10%,black 90%,transparent)}
@keyframes logoScroll{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}

/* ── MOBILE MENU ENTRANCE ANIMATION ──────────────────────────────────────────── */
.mobile-menu.active .mobile-menu-nav ul li{animation:menuItemSlide .4s both}
.mobile-menu.active .mobile-menu-nav ul li:nth-child(1){animation-delay:.05s}
.mobile-menu.active .mobile-menu-nav ul li:nth-child(2){animation-delay:.1s}
.mobile-menu.active .mobile-menu-nav ul li:nth-child(3){animation-delay:.15s}
.mobile-menu.active .mobile-menu-nav ul li:nth-child(4){animation-delay:.2s}
.mobile-menu.active .mobile-menu-nav ul li:nth-child(5){animation-delay:.25s}
@keyframes menuItemSlide{from{opacity:0;transform:translateX(20px)}to{opacity:1;transform:translateX(0)}}

/* ── FOCUSED STATE GLOW ────────────────────────────────────────────────────────── */
.funda-input:focus,.woocommerce-checkout .woocommerce-input-wrapper input:focus{outline:none}

/* ── BACK TO TOP HOVER ─────────────────────────────────────────────────────────── */
.back-to-top::before{content:'';position:absolute;inset:0;border-radius:50%;background:var(--funda-gradient);z-index:-1;transform:scale(0);transition:transform .3s}
.back-to-top:hover::before{transform:scale(1.2)}

/* ── PAGE TRANSITION ──────────────────────────────────────────────────────────── */
@keyframes pageFadeIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
body{animation:pageFadeIn .5s ease}

/* ── RESPONSIVE: disable expensive animations on mobile (Rule 26) ─────────────── */
@media (max-width:768px){
  .shimmer,.trust-track,.hero-particle,.float-blob,.mesh-gradient,.pulse-ring,.dot-grid{display:none !important;animation:none !important}
  .reveal,.reveal-left,.reveal-right,.reveal-scale{opacity:1 !important;transform:none !important;transition:none !important}
  .stagger-1,.stagger-2,.stagger-3,.stagger-4,.stagger-5,.stagger-6{transition-delay:0s !important}
  .feature-card::after{animation:none}
}
