/* ==========================================================================
   TURMEON MOTION TOKENS
   Sistema de animación "Collage que cobra vida"

   Referencia: Packaging caja Grifo — halftone B/N + fondo arena + color plano
   Filosofía: Recortes que caen, sellos que golpean, cortes limpios
   ========================================================================== */

:root {
  /* --- Duraciones --- */
  --tm-dur-instant: 150ms;   /* Micro-interactions: focus, active states */
  --tm-dur-fast: 250ms;      /* Hover transitions, toggles */
  --tm-dur-base: 400ms;      /* Scroll reveals, collage-drop */
  --tm-dur-slow: 600ms;      /* Hero entrances, stamp */
  --tm-dur-collage: 800ms;   /* Secuencia completa collage-scatter */

  /* --- Ticker speeds (marquee infinito) --- */
  --tm-dur-ticker-fast: 15s;    /* Footer ticker */
  --tm-dur-ticker-base: 20s;    /* Ticker estándar */
  --tm-dur-ticker-medium: 25s;  /* Top ticker */
  --tm-dur-ticker-slow: 60s;    /* Instagram ticker (muchos items) */

  /* --- Easings --- */
  /* Drop: Caída con gravedad — rápido al inicio, desaceleración natural.
     Como un recorte de papel que cae sobre la mesa. */
  --tm-ease-drop: cubic-bezier(0.22, 0.61, 0.36, 1);

  /* Snap: Frenazo seco — para stamps/impactos.
     Como el sello de caucho contra el papel. */
  --tm-ease-snap: cubic-bezier(0.5, 0, 0, 1);

  /* Out: Desaceleración firme — reveals genéricos, hovers. */
  --tm-ease-out: cubic-bezier(0.25, 0, 0.15, 1);

  /* --- Distancias --- */
  --tm-dist-drop: 30px;       /* Caída collage-drop */
  --tm-dist-reveal: 40px;     /* Scroll reveal genérico */
  --tm-dist-hover: -2px;      /* Elevación hover botones */
  --tm-dist-lift: -4px;       /* Elevación hover halftone */
  --tm-dist-active: 2px;      /* Hundimiento active */
  --tm-dist-rotate: 3deg;     /* Rotación máxima collage-drop */

  /* --- Sombras neobrutalistas --- */
  --tm-shadow: 4px 4px 0 var(--zeus, #252323);
  --tm-shadow-lg: 6px 6px 0 var(--zeus, #252323);
  --tm-shadow-sm: 2px 2px 0 var(--zeus, #252323);

  /* --- Stagger --- */
  --tm-stagger: 100ms;        /* Delay entre elementos en stagger */
  --tm-stagger-collage: 120ms; /* Delay entre halftones en collage scatter */
}

/* === Accesibilidad: Reducir movimiento === */
@media (prefers-reduced-motion: reduce) {
  :root {
    --tm-dur-instant: 0ms;
    --tm-dur-fast: 0ms;
    --tm-dur-base: 0ms;
    --tm-dur-slow: 0ms;
    --tm-dur-collage: 0ms;
    --tm-dist-drop: 0px;
    --tm-dist-reveal: 0px;
    --tm-dist-hover: 0px;
    --tm-dist-lift: 0px;
    --tm-dist-active: 0px;
    --tm-dist-rotate: 0deg;
  }

  /* Los tickers se mantienen pero más lentos */
  :root {
    --tm-dur-ticker-fast: 30s;
    --tm-dur-ticker-base: 40s;
    --tm-dur-ticker-medium: 50s;
    --tm-dur-ticker-slow: 120s;
  }
}
