/* ============================================================
   PTA · Design tokens v3
   Dirección: limpio/humano (ref. fuxiona) + energía + animación.
   Tipografía elegida por Fabio: T3 Bricolage Grotesque (titulares)
   + C7 Epilogue (cuerpo). Mono p/ tickets, Caveat p/ equipo.
   ============================================================ */
:root {
  /* --- Marca --- */
  --pta-naranja: #E87A04;
  --pta-naranja-claro: #FB9D2B;
  --pta-naranja-oscuro: #C9690A;
  --pta-naranja-texto: #955007;   /* naranja legible para texto pequeño sobre crema/blanco (AA ≥4.5:1) */
  --pta-estrella: #C88A04;         /* dorado de estrellas con contraste suficiente como gráfico (≥3:1) */
  --pta-azul: #1F2933;
  --pta-azul-800: #2B3A47;
  --pta-azul-900: #161E26;
  --pta-azul-950: #0F151B;

  /* --- Neutros --- */
  --pta-texto: #20272E;
  --pta-texto-suave: #5B6670;
  --pta-borde: #E4E7EB;
  --pta-borde-sutil: #EEF1F4;
  --pta-fondo-gris: #F4F6F8;
  --pta-crema: #FBF6EE;
  --pta-papel: #FFFDF8;
  --pta-blanco: #FFFFFF;

  /* --- Semánticos --- */
  --pta-ahorro: #1E9E5A;
  --pta-ahorro-bg: #E7F6EE;
  --pta-alerta: #D64545;
  --pta-aviso: #F2B705;
  --pta-wa: #25D366;
  --pta-wa-oscuro: #1DA851;

  /* --- Tipografía --- */
  --fuente-display: "Bricolage Grotesque", ui-sans-serif, system-ui, sans-serif;
  --fuente-cuerpo: "Epilogue", ui-sans-serif, system-ui, sans-serif;
  --fuente-mono: "JetBrains Mono", ui-monospace, monospace;
  --fuente-mano: "Caveat", cursive;

  --fs-cuerpo: 1.0625rem;
  --fs-pequeno: 0.92rem;
  --fs-micro: 0.82rem;   /* subido de 0.78 → 0.82 (≈13px) por legibilidad (público 50-75) */
  --fs-h3: clamp(1.3rem, 1.05rem + 1vw, 1.6rem);
  --fs-h2: clamp(2rem, 1.3rem + 2.8vw, 3.1rem);
  --fs-h1: clamp(2.6rem, 1.5rem + 5vw, 4.6rem);
  --fs-display: clamp(3rem, 1.6rem + 6.4vw, 6rem);

  --lh-apretado: 1.02;
  --lh-medio: 1.2;
  --lh-normal: 1.6;
  --tr-titular: -0.02em;

  /* --- Espaciado --- */
  --sp-1: 4px;  --sp-2: 8px;  --sp-3: 12px; --sp-4: 16px;
  --sp-5: 24px; --sp-6: 32px; --sp-7: 48px; --sp-8: 64px;
  --sp-9: 96px; --sp-10: 128px;

  /* --- Anchos --- */
  --ancho-max: 1200px;
  --ancho-texto: 680px;

  /* --- Radios --- */
  --radio: 16px;
  --radio-sm: 10px;
  --radio-lg: 28px;
  --radio-pill: 999px;

  /* --- Sombras --- */
  --sombra-sm: 0 2px 8px rgba(22, 30, 38, .06);
  --sombra: 0 12px 32px rgba(22, 30, 38, .1);
  --sombra-fuerte: 0 28px 64px rgba(22, 30, 38, .18);
  --sombra-naranja: 0 16px 38px rgba(232, 122, 4, .34);

  /* --- Motion ---
     Sistema «Papel vivo»: coreografía corta, no espectáculo. Duraciones y
     desplazamientos calibrados para público 50-75 (NN/g: micro 100-150ms,
     medias 200-300ms, máx 400ms; reveals ≤24px; ease-out entradas). */
  --ease: cubic-bezier(.22, .61, .36, 1);
  --ease-suave: cubic-bezier(.4, 0, .2, 1);
  --ease-entrada: cubic-bezier(.22, 1, .36, 1);   /* out-expo suave para entradas orquestadas */
  --ease-papel: cubic-bezier(.34, 1.2, .64, 1);   /* leve rebote: "papel que se posa" */
  --dur: 220ms;
  --dur-micro: 150ms;   /* hover, toggles */
  --dur-media: 300ms;   /* reveal, panel */
  --dur-grande: 420ms;  /* movimientos mayores (tope) */
  --rise: 20px;         /* desplazamiento vertical de los reveals (≤24px) */

  --header-h: 72px;
}