/* ============================================================
   JurisOne — SISTEMA A · roles tipográficos
   Tres familias, tres trabajos: Archivo expandida estampa, Source Serif 4
   redacta, DM Mono señaliza (el trabajo que en otras landings hacen los
   iconos). Consume EXCLUSIVAMENTE tokens semánticos.
   ============================================================ */

.titular-mayor,
.titular,
.subtitulo,
.titulo-placa {
  font-family: var(--fuente-display);
  font-weight: var(--peso-display);
  text-wrap: balance;
  margin: 0;
}

.titular-mayor {
  font-size: var(--tamano-titular-mayor);
  font-variation-settings: "wdth" var(--ancho-titular);
  line-height: var(--interlinea-titular);
  letter-spacing: var(--tracking-titular);
}

.titular {
  font-size: var(--tamano-titular);
  font-variation-settings: "wdth" var(--ancho-titular);
  line-height: var(--interlinea-subtitulo);
  letter-spacing: var(--tracking-subtitulo);
}

.subtitulo {
  font-size: var(--tamano-subtitulo);
  font-variation-settings: "wdth" var(--ancho-subtitulo);
  line-height: var(--interlinea-subtitulo);
  letter-spacing: var(--tracking-subtitulo);
}

.titulo-placa {
  font-size: var(--tamano-placa);
  font-variation-settings: "wdth" var(--ancho-placa);
  line-height: var(--interlinea-placa);
  letter-spacing: var(--tracking-placa);
}

.lead {
  font-family: var(--fuente-texto);
  font-size: var(--tamano-lead);
  line-height: var(--interlinea-lead);
  color: var(--color-texto-secundario);
  text-wrap: pretty;
  max-width: var(--ancho-lectura);
}

.cuerpo {
  font-size: var(--tamano-cuerpo);
  line-height: var(--interlinea-cuerpo);
  text-wrap: pretty;
  max-width: var(--ancho-lectura);
}

.cuerpo-menor {
  font-size: var(--tamano-cuerpo-menor);
  line-height: var(--interlinea-cuerpo);
  color: var(--color-texto-secundario);
  text-wrap: pretty;
}

/* Utilidad mono: el dispositivo de señalización del sistema. */
.utilidad,
.rotulo {
  font-family: var(--fuente-utilidad);
  font-weight: var(--peso-utilidad);
  font-size: var(--tamano-utilidad);
  line-height: var(--interlinea-utilidad);
  letter-spacing: var(--tracking-utilidad);
  text-transform: uppercase;
  font-variant-numeric: tabular-nums;
}

.utilidad-menor {
  font-family: var(--fuente-utilidad);
  font-weight: var(--peso-cuerpo);
  font-size: var(--tamano-utilidad-menor);
  line-height: var(--interlinea-utilidad);
  letter-spacing: var(--tracking-utilidad);
  text-transform: uppercase;
  font-variant-numeric: tabular-nums;
  color: var(--color-texto-secundario);
}

.rotulo { color: var(--color-texto-secundario); display: block; }

/* Respeta la grafía original del término (BaaS, Bre-B, PQRS…): la caja alta
   automática destruiría la grafía de marca. */
.utilidad--literal { text-transform: none; }

.texto-tenue { color: var(--color-texto-secundario); }
