/* ════════════════════════════════════════════════════
   animations.css — Scroll reveal + all @keyframes
   Edit this file to change: reveal timing, easing,
   blob morphing, pulse, spin speeds
════════════════════════════════════════════════════ */

/* ── Scroll Reveal (Apple-style spring) ─────────── */
.reveal {
  opacity: 0;
  transform: translateY(38px);
  transition:
    opacity   0.85s var(--spring),
    transform 0.85s var(--spring);
}
.reveal.vis {
  opacity:   1;
  transform: translateY(0);
}

/* Stagger delay helpers — add .d1–.d5 to siblings */
.d1 { transition-delay: 0.08s; }
.d2 { transition-delay: 0.17s; }
.d3 { transition-delay: 0.26s; }
.d4 { transition-delay: 0.35s; }
.d5 { transition-delay: 0.44s; }

/* ── Hero word-by-word reveal ────────────────────── */
.hw {
  display:   inline-block;
  opacity:   0;
  transform: translateY(24px);
  animation: fadeUp 0.72s var(--spring) forwards;
}

/* ── Eyebrow / sub / btns load-in ───────────────── */
.hero-eyebrow {
  opacity:   0;
  transform: translateY(14px);
  animation: fadeUp 0.65s var(--spring) 0.15s forwards;
}
.hero-sub {
  opacity:   0;
  transform: translateY(14px);
  animation: fadeUp 0.7s var(--spring) 1.05s forwards;
}
.hero-btns {
  opacity:   0;
  transform: translateY(14px);
  animation: fadeUp 0.7s var(--spring) 1.2s forwards;
}
.hero-scroll-hint {
  opacity: 0;
  animation: fadeUp 0.6s var(--spring) 1.5s forwards;
}

/* ── @keyframes ──────────────────────────────────── */
@keyframes fadeUp {
  to { opacity: 1; transform: translateY(0); }
}

@keyframes morph {
  0%,  100% { border-radius: 62% 38% 68% 32% / 48% 62% 38% 52%; }
  33%        { border-radius: 38% 62% 48% 52% / 70% 30% 60% 40%; }
  66%        { border-radius: 72% 28% 38% 62% / 38% 52% 68% 32%; }
}

@keyframes pulse {
  0%,  100% { box-shadow: 0 0 12px rgba(90,148,112,0.55); }
  50%        { box-shadow: 0 0 20px rgba(90,148,112,0.85); }
}

@keyframes spin {
  to { transform: rotate(360deg); }
}