/**
 * SGH AOS v2 — Animate On Scroll Styles
 * Transition-based animations with creative effects.
 * !important ensures Tailwind doesn't override.
 */

/* ── Base: hidden state ── */
[data-aos] {
    transition-property: transform, opacity, filter !important;
    transition-duration: 0.7s !important;
    transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
    will-change: transform, opacity;
    pointer-events: none;
}

/* ── Animated: revealed state ── */
[data-aos].aos-animate {
    opacity: 1 !important;
    transform: none !important;
    filter: none !important;
    pointer-events: auto;
}

/* ═══════════════════════════
   FADES
   ═══════════════════════════ */
[data-aos="fade-up"]    { opacity: 0; transform: translateY(30px); }
[data-aos="fade-down"]  { opacity: 0; transform: translateY(-30px); }
[data-aos="fade-left"]  { opacity: 0; transform: translateX(30px); }
[data-aos="fade-right"] { opacity: 0; transform: translateX(-30px); }
[data-aos="fade-in"]    { opacity: 0; }

/* ═══════════════════════════
   ZOOMS
   ═══════════════════════════ */
[data-aos="zoom-in"]    { opacity: 0; transform: scale(0.92); }
[data-aos="zoom-out"]   { opacity: 0; transform: scale(1.08); }
[data-aos="zoom-in-up"] { opacity: 0; transform: scale(0.92) translateY(30px); }

/* ═══════════════════════════
   FLIPS (3D)
   ═══════════════════════════ */
[data-aos="flip-up"]    { opacity: 0; transform: perspective(2000px) rotateX(-80deg); transform-origin: bottom; }
[data-aos="flip-down"]  { opacity: 0; transform: perspective(2000px) rotateX(80deg); transform-origin: top; }
[data-aos="flip-left"]  { opacity: 0; transform: perspective(2000px) rotateY(-80deg); transform-origin: right; }
[data-aos="flip-right"] { opacity: 0; transform: perspective(2000px) rotateY(80deg); transform-origin: left; }

/* ═══════════════════════════
   CREATIVE SGH ANIMATIONS
   ═══════════════════════════ */

/* Blur entrance — content fades from blurry to sharp */
[data-aos="blur-in"] {
    opacity: 0;
    filter: blur(12px);
    transform: scale(0.97);
}

/* Big slide from bottom — dramatic entrance for heroes */
[data-aos="slide-up"] {
    opacity: 0;
    transform: translateY(80px);
    transition-duration: 0.9s !important;
}

/* Rotate entrance — spins in slightly */
[data-aos="rotate-in"] {
    opacity: 0;
    transform: rotate(-10deg) scale(0.85);
    transition-duration: 0.8s !important;
}

/* Swing in from top — like a door opening */
[data-aos="swing-in"] {
    opacity: 0;
    transform: perspective(800px) rotateX(25deg) translateY(30px);
    transform-origin: top center;
    transition-duration: 0.85s !important;
}

/* Bounce up — playful entrance with overshoot */
[data-aos="bounce-up"] {
    opacity: 0;
    transform: translateY(50px);
    transition-timing-function: cubic-bezier(0.34, 1.56, 0.64, 1) !important;
}

/* Skate in from right — slides in with skew */
[data-aos="skate-in-right"] {
    opacity: 0;
    transform: translateX(80px) skewX(-10deg);
    transition-duration: 0.8s !important;
}

/* Skate in from left */
[data-aos="skate-in-left"] {
    opacity: 0;
    transform: translateX(-80px) skewX(10deg);
    transition-duration: 0.8s !important;
}

/* Elastic zoom — bouncy scale entrance */
[data-aos="elastic-zoom"] {
    opacity: 0;
    transform: scale(0.6);
    transition-timing-function: cubic-bezier(0.68, -0.55, 0.265, 1.55) !important;
    transition-duration: 0.9s !important;
}

/* Rise and shine — gentle lift with slight grow */
[data-aos="rise"] {
    opacity: 0;
    transform: translateY(20px) scale(0.98);
    transition-duration: 0.6s !important;
}

/* Curtain reveal — clips from bottom */
[data-aos="reveal-up"] {
    opacity: 0;
    clip-path: inset(100% 0 0 0);
    transition-property: clip-path, opacity !important;
    transition-duration: 0.8s !important;
}
[data-aos="reveal-up"].aos-animate {
    clip-path: inset(0 0 0 0) !important;
}

/* Pop — quick scale pop */
[data-aos="pop"] {
    opacity: 0;
    transform: scale(0.5);
    transition-duration: 0.5s !important;
    transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.275) !important;
}

/* Fade up big — larger distance for section headers */
[data-aos="fade-up-big"] {
    opacity: 0;
    transform: translateY(60px);
    transition-duration: 0.9s !important;
}

/* Tilt in — subtle 3D tilt */
[data-aos="tilt-in"] {
    opacity: 0;
    transform: perspective(1000px) rotateY(-8deg) rotateX(5deg) translateX(-20px);
    transition-duration: 0.9s !important;
}

/* ═══════════════════════════
   DELAY FALLBACKS (CSS)
   ═══════════════════════════ */
[data-aos-delay="50"]   { transition-delay: 50ms; }
[data-aos-delay="100"]  { transition-delay: 100ms; }
[data-aos-delay="150"]  { transition-delay: 150ms; }
[data-aos-delay="200"]  { transition-delay: 200ms; }
[data-aos-delay="250"]  { transition-delay: 250ms; }
[data-aos-delay="300"]  { transition-delay: 300ms; }
[data-aos-delay="400"]  { transition-delay: 400ms; }
[data-aos-delay="500"]  { transition-delay: 500ms; }
[data-aos-delay="600"]  { transition-delay: 600ms; }
[data-aos-delay="700"]  { transition-delay: 700ms; }
[data-aos-delay="800"]  { transition-delay: 800ms; }

/* ═══════════════════════════
   MOBILE: reduce distances
   ═══════════════════════════ */
@media (max-width: 640px) {
    [data-aos] { transition-duration: 0.5s !important; }
    [data-aos="fade-up"],
    [data-aos="fade-down"]  { transform: translateY(20px); }
    [data-aos="fade-left"],
    [data-aos="fade-right"] { transform: translateX(20px); }
    [data-aos="slide-up"]   { transform: translateY(40px); }
    [data-aos="zoom-in"]    { transform: scale(0.95); }
    [data-aos="fade-up-big"]{ transform: translateY(30px); }
}
