/* reveal-system.css — Esferize · Animaciones reveal + reduced-motion
   Extraído de nav-footer-override.css el 2026-05-26.
   Cargado en: 7 páginas (contacto + 6 legales).
   Las 9 páginas activas tienen el sistema reveal inline.

   ══════════════════════════════════════════════
   ANIMACIONES
   ══════════════════════════════════════════════ */
@keyframes fadeUp {
  from { opacity:0; transform:translateY(22px); }
  to   { opacity:1; transform:translateY(0); }
}
@keyframes fadeIn {
  from { opacity:0; }
  to   { opacity:1; }
}
@keyframes rotate {
  from { transform: translate(-50%,-50%) rotate(0deg); }
  to   { transform: translate(-50%,-50%) rotate(360deg); }
}

/* ══════════════════════════════════════════════
   MOTION DESIGN SYSTEM
   ══════════════════════════════════════════════ */

/* Variables globales de timing */
/* Línea vertebral vertical — continuidad de sistema */
body::before {
  content: '';
  position: fixed;
  left: 47px;
  top: 0; bottom: 0;
  width: 1px;
  background: linear-gradient(
    to bottom,
    transparent 0%,
    rgba(227,6,19,0.07) 18%,
    rgba(227,6,19,0.07) 82%,
    transparent 100%
  );
  z-index: 0;
  pointer-events: none;
}

/* Reveal system — IntersectionObserver */
[data-reveal] {
  opacity: 0;
  transform: translateY(16px);
  transition:
    opacity   650ms var(--ease-out-expo),
    transform 650ms var(--ease-out-expo);
  will-change: opacity, transform;
}
/* Titulares — aparición más lenta y reposada */
[data-reveal="heading"] {
  transform: translateY(20px);
  transition:
    opacity   800ms var(--ease-out-expo),
    transform 800ms var(--ease-out-expo);
}
/* Cards — emergen desde ligeramente más abajo */
[data-reveal="card"] {
  transform: translateY(28px);
  transition:
    opacity   700ms var(--ease-out-expo),
    transform 700ms var(--ease-out-expo);
}
[data-reveal="scale"] { transform: scale(0.97) translateY(10px); }
[data-reveal].is-visible {
  opacity: 1;
  transform: none;
}
@media (prefers-reduced-motion: reduce) {
  [data-reveal] { opacity: 1; transform: none; transition: none; }
}
