/* ===== ANIMATIONS ===== */
.reveal { opacity: 0; transform: translateY(22px); transition: opacity 0.7s var(--ease-standard), transform 0.7s var(--ease-standard); }
.reveal.is-visible { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; }
  .reveal { opacity: 1; transform: none; }
}

@keyframes wheel{0%{transform:translateY(0);opacity:1}70%{transform:translateY(9px);opacity:0}100%{opacity:0}}

@keyframes fadeup{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

@keyframes phaseHeroCopy {
  from {
    opacity: 0;
    transform: translateY(24px);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

@keyframes phaseHeroVisual {
  from {
    opacity: 0;
    transform: translateY(30px) scale(0.97);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

@keyframes phasePulse {
  0%,
  100% {
    opacity: 0;
    transform: scale(0.75);
  }

  45% {
    opacity: 1;
  }

  80% {
    opacity: 0;
    transform: scale(1.45);
  }
}

@keyframes phaseDrawChart {
  to {
    stroke-dashoffset: 0;
  }
}

@keyframes phaseFloat {
  0%,
  100% {
    transform: translateY(0);
  }

  50% {
    transform: translateY(-8px);
  }
}

@keyframes productPanelEnter {
  from {
    opacity: 0;
    transform: translateY(16px);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

@keyframes productDrawLine {
  to {
    stroke-dashoffset: 0;
  }
}

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