/* =====================================================
   Ortiz y Cía. — animations.css
   Reveal on scroll · Ticker · Micro-interactions
   ===================================================== */

/* ─── Ticker scroll ────────────────────────────────── */
@keyframes ticker-scroll {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

.ticker__track:hover { animation-play-state: paused; }

/* ─── Reveal on scroll ─────────────────────────────── */
.reveal {
  opacity: 0;
  transform: translateY(28px);
  transition:
    opacity 700ms cubic-bezier(.25,.46,.45,.94),
    transform 700ms cubic-bezier(.25,.46,.45,.94);
  will-change: opacity, transform;
}

.reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.reveal--delay-1 { transition-delay: 120ms; }
.reveal--delay-2 { transition-delay: 240ms; }
.reveal--delay-3 { transition-delay: 360ms; }

/* ─── Nav scroll state ─────────────────────────────── */
#site-header {
  transition:
    background 300ms cubic-bezier(.25,.46,.45,.94),
    box-shadow 300ms cubic-bezier(.25,.46,.45,.94);
}

/* ─── Burger animation ─────────────────────────────── */
.nav__burger.is-active span:nth-child(1) {
  transform: translateY(6.5px) rotate(45deg);
}
.nav__burger.is-active span:nth-child(2) {
  opacity: 0;
  transform: scaleX(0);
}
.nav__burger.is-active span:nth-child(3) {
  transform: translateY(-6.5px) rotate(-45deg);
}

/* ─── Stat count-up ────────────────────────────────── */
.stat__value {
  transition: color 400ms ease;
}

/* ─── Form field focus ─────────────────────────────── */
.form__input {
  transition:
    border-color 250ms ease,
    box-shadow 250ms ease,
    background 250ms ease;
}

.form__input:focus {
  background: #fff;
}

/* ─── Button press ─────────────────────────────────── */
.btn:active {
  transform: scale(0.98) translateY(0) !important;
}

/* ─── Practice hover ───────────────────────────────── */
.practice {
  transition:
    background 250ms ease,
    padding-inline 250ms ease,
    border-radius 250ms ease;
}

/* ─── Result card ──────────────────────────────────── */
.result {
  transition:
    box-shadow 300ms ease,
    transform 300ms ease;
}

/* ─── Team card ────────────────────────────────────── */
.team__card {
  transition:
    box-shadow 300ms ease,
    transform 300ms ease,
    border-color 300ms ease;
}

/* ─── Publication link ─────────────────────────────── */
.publication__link::after {
  content: '';
  display: block;
  width: 0;
  height: 1px;
  background: currentColor;
  transition: width 250ms ease;
  margin-top: 2px;
}
.publication__link:hover::after { width: 100%; }

/* ─── Scroll-to-top fade ───────────────────────────── */
@keyframes fade-in-up {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ─── Page load ────────────────────────────────────── */
@keyframes fade-in {
  from { opacity: 0; }
  to   { opacity: 1; }
}

body {
  animation: fade-in 400ms ease forwards;
}

/* ─── Reduced motion ───────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  .reveal {
    opacity: 1;
    transform: none;
    transition: none;
  }

  .ticker__track {
    animation: none;
  }

  body { animation: none; }

  .btn,
  .practice,
  .team__card,
  .result,
  .form__input { transition: none; }
}