/* CAS, tokens del Manual de Marca 2021. Unica fuente de verdad de la identidad. */

@font-face { font-family: 'D-DIN'; src: url('../fonts/ddin-400.woff2') format('woff2'); font-weight: 400; font-display: swap; }
@font-face { font-family: 'D-DIN'; src: url('../fonts/ddin-500.woff2') format('woff2'); font-weight: 500; font-display: swap; }
@font-face { font-family: 'D-DIN'; src: url('../fonts/ddin-700.woff2') format('woff2'); font-weight: 700; font-display: swap; }
@font-face { font-family: 'D-DIN'; src: url('../fonts/ddin-900.woff2') format('woff2'); font-weight: 900; font-display: swap; }

:root {
  /* Manual: Pantone 368 C / Neutral Black C */
  --verde: #76BC21;
  --verde-oscuro: #5C9419;
  --verde-tenue: #F1F8E8;
  --negro: #222222;
  --blanco: #FFFFFF;

  --texto: #222222;
  --texto-suave: #5F6560;
  --linea: #E3E6E1;
  --superficie: #FAFAF8;

  --fuente: 'D-DIN', 'DIN Alternate', 'Helvetica Neue', Arial, sans-serif;

  --medida: 68ch;
  --radio: 4px;
  --transicion: 0.6s cubic-bezier(0.22, 1, 0.36, 1);
}

*, *::before, *::after { box-sizing: border-box; }
/* La familia va en html y no solo en body: si no, el propio html cae en la fuente del navegador */
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; font-family: var(--fuente); }
body {
  margin: 0;
  font-family: var(--fuente);
  font-size: 17px;
  line-height: 1.6;
  color: var(--texto);
  background: var(--blanco);
  -webkit-font-smoothing: antialiased;
}
img, svg, video { max-width: 100%; height: auto; display: block; }
a { color: inherit; }

/* Nunca dejar una palabra sola en el ultimo renglon */
h1, h2, h3, h4, blockquote { text-wrap: balance; }
p, li { text-wrap: pretty; }

h1, h2, h3, h4 { font-weight: 700; line-height: 1.05; letter-spacing: -0.02em; margin: 0; }
p { max-width: var(--medida); }

/* El manual trae D-DIN Italic pero no se usa en pantalla: baja la legibilidad */
em, i { font-style: normal; }

.contenedor { width: min(100% - clamp(2.5rem, 5vw, 6rem), 1240px); margin-inline: auto; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; }
}
