/* ============================================
   SCROLL REVEAL ANIMATIONS
   Premium scroll-into-view animations
   ============================================ */

/* Base state - elements start hidden */
[data-reveal] {
  opacity: 0;
  transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}

/* Revealed state */
[data-reveal].revealed {
  opacity: 1;
  transform: none !important;
}

/* ============================================
   REVEAL ANIMATIONS - Starting States
   ============================================ */

/* Fade up (most common) */
[data-reveal="fade-up"] {
  transform: translateY(60px);
}

/* Fade down */
[data-reveal="fade-down"] {
  transform: translateY(-60px);
}

/* Fade left */
[data-reveal="fade-left"] {
  transform: translateX(60px);
}

/* Fade right */
[data-reveal="fade-right"] {
  transform: translateX(-60px);
}

/* Scale up (zoom in) */
[data-reveal="scale"] {
  transform: scale(0.9);
}

/* Scale up from small */
[data-reveal="scale-up"] {
  transform: scale(0.8);
}

/* Flip in */
[data-reveal="flip"] {
  transform: perspective(1000px) rotateX(20deg);
  transform-origin: center bottom;
}

/* Rotate in */
[data-reveal="rotate"] {
  transform: rotate(-5deg) translateY(40px);
}

/* Blur in */
[data-reveal="blur"] {
  filter: blur(10px);
  transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.8s cubic-bezier(0.16, 1, 0.3, 1),
              filter 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}

[data-reveal="blur"].revealed {
  filter: blur(0);
}

/* Clip reveal (slides in from bottom like a curtain) */
[data-reveal="clip"] {
  clip-path: inset(100% 0 0 0);
  transition: clip-path 0.8s cubic-bezier(0.16, 1, 0.3, 1),
              opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}

[data-reveal="clip"].revealed {
  clip-path: inset(0 0 0 0);
}

/* Slide up with parallax feel */
[data-reveal="parallax"] {
  transform: translateY(100px);
  transition: opacity 1.2s cubic-bezier(0.16, 1, 0.3, 1),
              transform 1.2s cubic-bezier(0.16, 1, 0.3, 1);
}

/* Bounce in */
[data-reveal="bounce"] {
  transform: translateY(80px);
  transition: opacity 0.6s cubic-bezier(0.34, 1.56, 0.64, 1),
              transform 0.6s cubic-bezier(0.34, 1.56, 0.64, 1);
}

/* Elastic scale */
[data-reveal="elastic"] {
  transform: scale(0.5);
  transition: opacity 0.8s cubic-bezier(0.68, -0.55, 0.265, 1.55),
              transform 0.8s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

/* Glide (slower, more elegant) */
[data-reveal="glide"] {
  transform: translateY(80px);
  transition: opacity 1.4s cubic-bezier(0.25, 0.46, 0.45, 0.94),
              transform 1.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

/* ============================================
   DELAY MODIFIERS
   ============================================ */

[data-reveal-delay="100"] {
  transition-delay: 100ms;
}

[data-reveal-delay="200"] {
  transition-delay: 200ms;
}

[data-reveal-delay="300"] {
  transition-delay: 300ms;
}

[data-reveal-delay="400"] {
  transition-delay: 400ms;
}

[data-reveal-delay="500"] {
  transition-delay: 500ms;
}

[data-reveal-delay="600"] {
  transition-delay: 600ms;
}

[data-reveal-delay="700"] {
  transition-delay: 700ms;
}

[data-reveal-delay="800"] {
  transition-delay: 800ms;
}

/* ============================================
   DURATION MODIFIERS
   ============================================ */

[data-reveal-duration="fast"] {
  transition-duration: 0.4s;
}

[data-reveal-duration="slow"] {
  transition-duration: 1.2s;
}

[data-reveal-duration="slower"] {
  transition-duration: 1.6s;
}

/* ============================================
   STAGGER CHILDREN
   Apply to parent to stagger child animations
   ============================================ */

[data-reveal-stagger] > * {
  opacity: 0;
  transform: translateY(40px);
  transition: opacity 0.6s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}

[data-reveal-stagger].revealed > *:nth-child(1) { transition-delay: 0ms; opacity: 1; transform: none; }
[data-reveal-stagger].revealed > *:nth-child(2) { transition-delay: 80ms; opacity: 1; transform: none; }
[data-reveal-stagger].revealed > *:nth-child(3) { transition-delay: 160ms; opacity: 1; transform: none; }
[data-reveal-stagger].revealed > *:nth-child(4) { transition-delay: 240ms; opacity: 1; transform: none; }
[data-reveal-stagger].revealed > *:nth-child(5) { transition-delay: 320ms; opacity: 1; transform: none; }
[data-reveal-stagger].revealed > *:nth-child(6) { transition-delay: 400ms; opacity: 1; transform: none; }
[data-reveal-stagger].revealed > *:nth-child(7) { transition-delay: 480ms; opacity: 1; transform: none; }
[data-reveal-stagger].revealed > *:nth-child(8) { transition-delay: 560ms; opacity: 1; transform: none; }
[data-reveal-stagger].revealed > *:nth-child(9) { transition-delay: 640ms; opacity: 1; transform: none; }
[data-reveal-stagger].revealed > *:nth-child(10) { transition-delay: 720ms; opacity: 1; transform: none; }

/* Slower stagger for dramatic effect */
[data-reveal-stagger="slow"] > * {
  transition-duration: 0.8s;
}

[data-reveal-stagger="slow"].revealed > *:nth-child(1) { transition-delay: 0ms; }
[data-reveal-stagger="slow"].revealed > *:nth-child(2) { transition-delay: 150ms; }
[data-reveal-stagger="slow"].revealed > *:nth-child(3) { transition-delay: 300ms; }
[data-reveal-stagger="slow"].revealed > *:nth-child(4) { transition-delay: 450ms; }
[data-reveal-stagger="slow"].revealed > *:nth-child(5) { transition-delay: 600ms; }
[data-reveal-stagger="slow"].revealed > *:nth-child(6) { transition-delay: 750ms; }

/* ============================================
   SPECIAL EFFECTS
   ============================================ */

/* Glow reveal - adds glow when revealed */
[data-reveal="glow"] {
  transform: translateY(40px);
  filter: drop-shadow(0 0 0 transparent);
  transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.8s cubic-bezier(0.16, 1, 0.3, 1),
              filter 1s ease-out;
}

[data-reveal="glow"].revealed {
  filter: drop-shadow(0 0 30px rgba(255, 100, 50, 0.3));
}

/* Line draw effect */
[data-reveal="line"]::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0;
  height: 2px;
  background: linear-gradient(90deg, var(--accent-primary, #ff6432), var(--accent-secondary, #ff8c00));
  transition: width 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}

[data-reveal="line"].revealed::after {
  width: 100%;
}

/* Counter animation (for numbers) */
[data-reveal="counter"] {
  transform: translateY(20px);
}

/* Split text reveal */
[data-reveal="split"] {
  overflow: hidden;
}

[data-reveal="split"] > span {
  display: inline-block;
  transform: translateY(100%);
  transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}

[data-reveal="split"].revealed > span {
  transform: translateY(0);
}

/* ============================================
   SCROLL-LINKED PARALLAX
   Elements that move slightly while scrolling
   ============================================ */

[data-parallax] {
  /* will-change applied by JS on scroll */
}

/* ============================================
   SECTION TRANSITIONS
   Full section reveals
   ============================================ */

.section-reveal {
  opacity: 0;
  transform: translateY(80px);
  transition: opacity 1s cubic-bezier(0.16, 1, 0.3, 1),
              transform 1s cubic-bezier(0.16, 1, 0.3, 1);
}

.section-reveal.revealed {
  opacity: 1;
  transform: none;
}

/* ============================================
   REDUCED MOTION SUPPORT
   ============================================ */

@media (prefers-reduced-motion: reduce) {
  [data-reveal],
  [data-reveal-stagger] > *,
  [data-parallax],
  .section-reveal {
    transition: opacity 0.3s ease !important;
    transform: none !important;
    filter: none !important;
    clip-path: none !important;
  }

  [data-reveal].revealed,
  [data-reveal-stagger].revealed > *,
  .section-reveal.revealed {
    opacity: 1;
  }
}

/* ============================================
   HERO ENHANCEMENTS
   ============================================ */

/* Hero title reveal */
.hero-title[data-reveal] {
  transform: translateY(100px);
  transition: opacity 1.2s cubic-bezier(0.16, 1, 0.3, 1),
              transform 1.2s cubic-bezier(0.16, 1, 0.3, 1);
}

/* Hero subtitle reveal */
.hero-subtitle[data-reveal] {
  transform: translateY(60px);
  transition: opacity 1s cubic-bezier(0.16, 1, 0.3, 1) 0.2s,
              transform 1s cubic-bezier(0.16, 1, 0.3, 1) 0.2s;
}

/* CTA button reveal */
.hero-cta[data-reveal] {
  transform: translateY(40px) scale(0.95);
  transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1) 0.4s,
              transform 0.8s cubic-bezier(0.16, 1, 0.3, 1) 0.4s;
}

/* ============================================
   CARD HOVER ENHANCEMENTS
   Cards lift and glow on hover after reveal
   ============================================ */

[data-reveal].revealed.card-lift {
  transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.3s cubic-bezier(0.16, 1, 0.3, 1),
              box-shadow 0.3s ease;
}

[data-reveal].revealed.card-lift:hover {
  transform: translateY(-8px) !important;
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.2);
}

/* ============================================
   CONTINUOUS ANIMATIONS AFTER REVEAL
   ============================================ */

/* Floating animation after reveal */
[data-reveal].revealed[data-float] {
  animation: float 6s ease-in-out infinite;
}

@keyframes float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-20px); }
}

/* Pulse glow after reveal */
[data-reveal].revealed[data-pulse] {
  animation: pulse-glow 2s ease-in-out infinite;
}

@keyframes pulse-glow {
  0%, 100% { filter: drop-shadow(0 0 10px rgba(255, 100, 50, 0.3)); }
  50% { filter: drop-shadow(0 0 30px rgba(255, 100, 50, 0.6)); }
}