/* Legatium Pensiones — tokens del sitio
 * GENERADO desde DESIGN-TOKENS-001 por task-9-wios-design-system. No editar a mano:
 * la fuente de verdad es .wios/artifacts/design-system/DESIGN-TOKENS-001.json.
 * Contraste verificado deterministicamente: 34 pares declarados, 0 errores.
 * ALCANCE: la comprobacion solo mide los pares declarados. Una colocacion que un
 * componente hace sin par declarado no se mide. Si juntas dos colores, declara el par.
 * Escala tipografica verificada monotona en 360 / 390 / 768 / 1024 / 1440 / 1920.
 */

@font-face {
  font-family: 'Legatium Newsreader';
  src: url('/fonts/Texto-Regular.woff2?v=616c1517ad36') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Legatium Newsreader';
  src: url('/fonts/Texto-Medium.woff2?v=33b04b2e7b63') format('woff2');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Legatium Newsreader';
  src: url('/fonts/Texto-SemiBold.woff2?v=c54749f33c6e') format('woff2');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

:root {

  /* color — primitivas (los ocho del contrato de marca, mas tres derivadas) */
  --lg-blanco: #FFFFFF;
  --lg-hueso: #F7F4EF;
  --lg-navy: #16162F;
  --lg-navy-activo: #2C2C5A;
  --lg-tinta: #111119;
  --lg-grafito: #3A3A48;
  --lg-gris: #6E6E7C;
  --lg-plata: #D8D4CE;
  --lg-oro: #CA8D4A;
  --lg-oro-texto: #92612B;
  --lg-alerta: #8B2D23;
  --lg-alerta-clara: #E48B81;

  /* color — semanticas (cada una declara su superficie en el artefacto) */
  --lg-surface-page: var(--lg-blanco);
  --lg-surface-alt: var(--lg-hueso);
  --lg-surface-rail: var(--lg-navy);
  --lg-surface-rail-active: var(--lg-navy-activo);
  --lg-accent-oro: var(--lg-oro);
  --lg-text-heading: var(--lg-navy);
  --lg-text-body: var(--lg-grafito);
  --lg-text-secondary: var(--lg-gris);
  --lg-text-ink: var(--lg-tinta);
  --lg-text-on-rail: var(--lg-hueso);
  --lg-text-label-on-rail: var(--lg-plata);
  --lg-text-figure-accent: var(--lg-oro);
  --lg-text-gold-safe: var(--lg-oro-texto);
  --lg-text-disabled: var(--lg-gris);
  --lg-rule-hairline: var(--lg-plata);
  --lg-rule-strong: var(--lg-navy);
  --lg-rule-on-rail: var(--lg-plata);
  --lg-focus-ring-light: var(--lg-navy);
  --lg-focus-ring-rail: var(--lg-oro);
  --lg-state-error: var(--lg-alerta);
  --lg-cta-primary-fill: var(--lg-navy);
  --lg-on-cta-primary: var(--lg-blanco);
  --lg-cta-rail-fill: var(--lg-hueso);
  --lg-on-cta-rail: var(--lg-navy);
  --lg-cta-secondary-text: var(--lg-navy);
  --lg-state-error-on-rail: var(--lg-alerta-clara);
  --lg-cta-primary-hover: var(--lg-navy-activo);

  /* tipografia */
  --lg-font-display: 'Legatium Newsreader', Georgia, 'Times New Roman', serif;
  --lg-font-body: 'Legatium Newsreader', Georgia, 'Times New Roman', serif;
  --lg-font-data: 'Legatium Newsreader', Georgia, 'Times New Roman', serif;
  --lg-size-display: clamp(2.375rem, 1.942rem + 1.923vw, 4.25rem);
  --lg-size-titular: clamp(1.75rem, 1.548rem + 0.897vw, 2.625rem);
  --lg-size-subtitulo: clamp(1.3125rem, 1.240rem + 0.321vw, 1.625rem);
  --lg-size-cuerpo: clamp(1.125rem, 1.096rem + 0.128vw, 1.25rem);
  --lg-size-apoyo: clamp(1rem, 0.986rem + 0.064vw, 1.0625rem);
  --lg-size-etiqueta: clamp(0.9375rem, 0.923rem + 0.064vw, 1rem);
  --lg-size-cifra: clamp(1.625rem, 1.423rem + 0.897vw, 2.5rem);
  --lg-size-dato: clamp(1.1875rem, 1.144rem + 0.192vw, 1.375rem);
  --lg-leading-display: 1.08;
  --lg-leading-titular: 1.15;
  --lg-leading-subtitulo: 1.35;
  --lg-leading-cuerpo: 1.55;
  --lg-leading-apoyo: 1.45;
  --lg-leading-etiqueta: 1.3;
  --lg-leading-cifra: 1;
  --lg-leading-dato: 1.4;
  --lg-tracking-display: -0.012em;
  --lg-tracking-titular: -0.008em;
  --lg-tracking-subtitulo: 0em;
  --lg-tracking-cuerpo: 0em;
  --lg-tracking-apoyo: 0em;
  --lg-tracking-etiqueta: 0.18em;
  --lg-tracking-cifra: -0.01em;
  --lg-tracking-dato: 0em;
  --lg-weight-regular: 400;
  --lg-weight-medium: 500;
  --lg-weight-semibold: 600;
  --lg-measure-prosa: 46ch;
  --lg-measure-riel: 28ch;
  --lg-numeric-dato: tabular-nums;
  --lg-numeric-cifra: tabular-nums;

  /* espaciado */
  --lg-space-3xs: 0.25rem;
  --lg-space-2xs: 0.5rem;
  --lg-space-xs: 0.75rem;
  --lg-space-sm: 1rem;
  --lg-space-md: 1.5rem;
  --lg-space-lg: 2rem;
  --lg-space-xl: 3rem;
  --lg-space-2xl: 4rem;
  --lg-space-3xl: 6rem;
  --lg-space-4xl: 8rem;
  --lg-space-seccion: clamp(5rem, 11vh, 10rem);
  --lg-space-margen-pagina: clamp(20px, 5vw, 96px);
  --lg-space-calle: clamp(1.5rem, 3.5vw, 4rem);
  --lg-space-plancha: clamp(1.75rem, 1.318rem + 1.923vw, 3rem);
  --lg-space-renglon-riel: clamp(0.875rem, 0.8rem + 0.32vw, 1.125rem);
  --lg-space-spacingRampNote: Los diez pasos estaticos (3xs..4xl) son una rampa de proposito general, no tokens con un consumidor declarado cada uno; el principio de «ningun componente especulativo» de DESIGN-COMPONENTS-001 gobierna los componentes, no la rampa de espaciado. Los que SI tienen un trabajo nombrado son seccion, margen-pagina, calle, plancha y renglon-riel.;
  --lg-space-paso-min: 22rem;

  /* reticula y contenedores */
  --lg-grid-columns: 12;
  --lg-grid-gutter: clamp(1rem, 2vw, 2rem);
  --lg-grid-margin: clamp(20px, 5vw, 96px);
  --lg-container-lectura: min(68ch, 100%);
  --lg-container-plancha: min(100%, 26rem + 20vw, 50rem);
  --lg-container-riel: 25%;
  --lg-container-banda: 100vw;
  --lg-container-columna-valor: 9ch;

  /* radio, filetes y elevacion */
  --lg-radius-ninguno: 0px;
  --lg-radius-control: 0.5rem;
  --lg-radius-suave: 1rem;
  --lg-radius-tarjeta: 1.5rem;
  --lg-radius-panel: 2rem;
  --lg-radius-pastilla: 999px;
  --lg-border-hairline: 1px;
  --lg-border-trazo: 2px;
  --lg-filete-grueso: 2px;
  --lg-filete-fino: 1px;
  --lg-filete-separacion: 3px;
  --lg-filete-simple: 2px;
  --lg-elevation-ninguna: none;

  /* movimiento */
  --lg-duration-rapida: 600ms;
  --lg-duration-rapida-reducida: 0ms;
  --lg-duration-media: 900ms;
  --lg-duration-media-reducida: 0ms;
  --lg-duration-lenta: 1600ms;
  --lg-duration-lenta-reducida: 0ms;
  --lg-duration-trazo: 700ms;
  --lg-duration-trazo-reducida: 0ms;
  --lg-duration-pausa: 200ms;
  --lg-duration-pausa-reducida: 0ms;
  --lg-duration-escalonado: 90ms;
  --lg-duration-escalonado-reducida: 0ms;
  --lg-duration-deriva: 20000ms;
  --lg-duration-deriva-reducida: 0ms;
  --lg-ease-unica: cubic-bezier(0.19, 1, 0.22, 1);
  --lg-ease-deriva: linear;
  --lg-ease-reducida: steps(1, end);

  /* capas */
  --lg-z-riel: 0;
  --lg-z-fotografia: 1;
  --lg-z-contenido: 10;
  --lg-z-plancha: 20;
  --lg-z-encabezado: 100;
  --lg-z-cta-flotante: 200;
  --lg-z-foco: 300;

  /* foco */
  --lg-focus-width: 2px;
  --lg-focus-offset: 2px;
  --lg-focus-style: solid;
  --lg-focus-color-claro: var(--lg-focus-ring-light);
  --lg-focus-color-riel: var(--lg-focus-ring-rail);

  /* proporciones de medio y objetivos tactiles */
  --lg-ratio-hero-escritorio: 16 / 9;
  --lg-ratio-hero-movil: 4 / 5;
  --lg-touch-minimo: 44px;
  --lg-touch-recomendado: 48px;
  --lg-touch-separacion: 8px;
}

/* Contraparte de movimiento reducido: toda duracion tiene su gemela -reducida.
 * Bajo prefers-reduced-motion cada duracion activa cae a su contraparte, de modo
 * que ningun componente necesita una regla propia para obedecer la preferencia. */
@media (prefers-reduced-motion: reduce) {
  :root {
    --lg-duration-rapida: var(--lg-duration-rapida-reducida);
    --lg-duration-media: var(--lg-duration-media-reducida);
    --lg-duration-lenta: var(--lg-duration-lenta-reducida);
    --lg-duration-trazo: var(--lg-duration-trazo-reducida);
    --lg-duration-pausa: var(--lg-duration-pausa-reducida);
    --lg-duration-escalonado: var(--lg-duration-escalonado-reducida);
    --lg-duration-deriva: var(--lg-duration-deriva-reducida);
    --lg-ease-unica: var(--lg-ease-reducida);
    --lg-ease-deriva: var(--lg-ease-reducida);
  }
}

/* Puntos de corte, para referencia — CSS no admite variables en @media.
 *   movil: 360px
 *   movil-ancho: 430px
 *   tablet: 768px
 *   escritorio: 1440px
 *   amplio: 1920px
 */