/* Initial hero entrance */
@keyframes heroEnter {
  from { opacity: 0; transform: translateY(28px); }
  to { opacity: 1; transform: translateY(0); }
}
.hero-enter { opacity: 0; animation: heroEnter .8s cubic-bezier(.2,.8,.2,1) forwards; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.delay-4 { animation-delay: .32s; }

/* Safe default: content is always visible in unsupported browsers. */
.reveal-up, .reveal-left, .reveal-right, .reveal-scale { opacity: 1; transform: none; }

@keyframes revealUp {
  from { opacity: 0; transform: translateY(72px) scale(.97); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}
@keyframes revealLeft {
  from { opacity: 0; transform: translateX(-72px); }
  to { opacity: 1; transform: translateX(0); }
}
@keyframes revealRight {
  from { opacity: 0; transform: translateX(72px); }
  to { opacity: 1; transform: translateX(0); }
}
@keyframes revealScale {
  from { opacity: 0; transform: scale(.86); clip-path: inset(12% 8% 12% 8% round 34px); }
  to { opacity: 1; transform: scale(1); clip-path: inset(0 0 0 0 round 34px); }
}

/* Native CSS scroll-driven animations. */
@supports (animation-timeline: view()) {
  .reveal-up {
    animation: revealUp linear both;
    animation-timeline: view();
    animation-range: entry 0% cover 32%;
  }
  .reveal-left {
    animation: revealLeft linear both;
    animation-timeline: view();
    animation-range: entry 0% cover 34%;
  }
  .reveal-right {
    animation: revealRight linear both;
    animation-timeline: view();
    animation-range: entry 0% cover 34%;
  }
  .reveal-scale {
    animation: revealScale linear both;
    animation-timeline: view();
    animation-range: entry 0% cover 40%;
  }
  .stagger-1 { animation-range: entry 5% cover 36%; }
  .stagger-2 { animation-range: entry 10% cover 40%; }
  .stagger-3 { animation-range: entry 15% cover 44%; }
}

@keyframes floatSoft {
  0%,100% { transform: translateY(0); }
  50% { transform: translateY(-9px); }
}
.floating-chip { animation: floatSoft 4.6s ease-in-out infinite; }
.chip-two { animation-delay: -1.4s; }
.chip-three { animation-delay: -2.3s; }

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