/* Tokens de Dopaframe Studio. Salen de la guía de marca v1.0: si cambia la guía, se cambia aquí. */

@font-face { font-family: "Syne"; src: url("../fonts/syne-latin-700-normal.woff2") format("woff2"); font-weight: 700; font-display: swap; }
@font-face { font-family: "Syne"; src: url("../fonts/syne-latin-800-normal.woff2") format("woff2"); font-weight: 800; font-display: swap; }
@font-face { font-family: "Plus Jakarta Sans"; src: url("../fonts/plus-jakarta-sans-latin-400-normal.woff2") format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Plus Jakarta Sans"; src: url("../fonts/plus-jakarta-sans-latin-600-normal.woff2") format("woff2"); font-weight: 600; font-display: swap; }
@font-face { font-family: "Space Mono"; src: url("../fonts/space-mono-latin-400-normal.woff2") format("woff2"); font-weight: 400; font-display: swap; }

:root {
  /* Color: proporciones de marca noche 35 · azul polvo 25 · azul profundo 15 · naranja 15 · blanco 10 */
  --noche: #060609;
  --azul-polvo: #BEDEF3;
  --azul-profundo: #1B3FBF;
  --blanco: #FFFFFF;
  --naranja: #FE5000;       /* un solo punto por pantalla */

  /* Tipografía */
  --f-titular: "Syne", system-ui, sans-serif;
  --f-texto: "Plus Jakarta Sans", system-ui, sans-serif;
  --f-dato: "Space Mono", ui-monospace, monospace;
  --track-titular: -0.02em;
  --track-dato: 0.16em;
  --t-hero: clamp(3rem, 7.4vw, 8.5rem);
  --t-h2: clamp(2.2rem, 4.6vw, 5rem);
  --t-cuerpo: clamp(1.125rem, 1.05rem + 0.3vw, 1.25rem);  /* 18–20 px: texto grande */
  --t-dato: 0.75rem;

  /* Espacio: margen del 8 % y retícula de 40 px */
  --margen: 8vw;
  --reticula: 40px;
  --radio: 28px;

  /* Movimiento */
  --ease-suave: cubic-bezier(0.22, 1, 0.36, 1);
  --dur-texto: 0.9s;
}

@media (max-width: 760px) {
  :root { --margen: 6vw; --radio: 20px; }
}