/* PortSync V2.5 · prototipo «4 · Fusión» · tipografía del brief de Lucas (V2.5-DOCUMENTOS/11, ref. 01).
   Fraunces 500 para títulos y DM Sans 400 para texto. Los colores NO vienen de aquí: salen de
   sitio/assets/css/portsync-tokens.css (azul del logo #114373 y semáforo solo para estados).
   La escala 52 / 34 / 24 / 17 / 13 es la del contenido; los héroes pueden usar un tamaño de exhibición
   mayor (--t-exhibicion) con la misma familia. */
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,400;0,9..40,500;0,9..40,600;1,9..40,400&family=Fraunces:ital,opsz,wght@0,9..144,400;0,9..144,500;0,9..144,600;1,9..144,400;1,9..144,500&display=swap');

:root {
  --f-titulo: 'Fraunces', Georgia, 'Times New Roman', serif;
  --f-texto: 'DM Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --f-dato: var(--font-mono, 'IBM Plex Mono', ui-monospace, 'Cascadia Mono', monospace);

  --t-exhibicion: clamp(48px, 7.2vw, 108px);
  --t-h1: clamp(38px, 4.4vw, 52px);
  --t-h2: clamp(28px, 3vw, 34px);
  --t-h3: 24px;
  --t-cuerpo: 17px;
  --t-chico: 15px;
  --t-rotulo: 13px;

  --lh-titulo: 1.1;
  --lh-cuerpo: 1.65;
  --tr-titulo: -0.015em;
  --tr-rotulo: 0.06em;
  --peso-titulo: 500;
  --peso-texto: 400;
  --peso-rotulo: 500;
}

.f-titulo, h1, h2, h3 {
  font-family: var(--f-titulo);
  font-weight: var(--peso-titulo);
  letter-spacing: var(--tr-titulo);
  line-height: var(--lh-titulo);
  font-optical-sizing: auto;
}
.f-texto, body {
  font-family: var(--f-texto);
  font-weight: var(--peso-texto);
  font-size: var(--t-cuerpo);
  line-height: var(--lh-cuerpo);
}
.f-rotulo {
  font-family: var(--f-texto);
  font-size: var(--t-rotulo);
  font-weight: var(--peso-rotulo);
  letter-spacing: var(--tr-rotulo);
  text-transform: uppercase;
}
.f-dato {
  font-family: var(--f-dato);
  font-variant-numeric: tabular-nums;
}