/**
 * Do not edit directly, this file was auto-generated.
 *
 * Fuente:    design/tokens/awl-tokens.json
 * Regenerar: node design/tokens/build.mjs
 * Verificar: node design/tokens/validate-contrast.mjs
 * Versión:   3.1.0
 */

/* Modo claro. Paleta cruda completa más la capa semántica clara. */
:root {
  --awl-negro-1000: #000000; /** wordmark, impresión */
  --awl-carbon-950: #0a0a0a; /** superficie oscura canónica */
  --awl-grafito-900: #1a1a1a; /** superficie elevada en oscuro */
  --awl-gris-100: #f4f4f4; /** superficie clara */
  --awl-gris-200: #e4e4e4; /** hairline sutil sobre blanco */
  --awl-gris-300: #d4d4d4; /** hairline visible sobre blanco */
  --awl-gris-400: #a3a3a3; /** solo disabled — NO usar en placeholder (2.52:1 sobre blanco) */
  --awl-gris-600: #6e6e6e; /** texto secundario claro AA 5.10 */
  --awl-gris-800: #2a2a2a; /** bordes en oscuro */
  --awl-gris-d-300: #b0b0b0; /** texto secundario oscuro AAA 9.13 */
  --awl-blanco: #ffffff;
  --awl-naranja-300: #ff7a40; /** texto naranja en oscuro AAA 7.65 */
  --awl-naranja-500: #ff4d00; /** marca/señal; nunca texto normal sobre claro */
  --awl-naranja-600: #e64500; /** hover acción */
  --awl-naranja-700: #c43a00; /** texto naranja sobre claro AA 5.31 */
  --awl-naranja-800: #9e2f00; /** impresión */
  --awl-exito-300: #4ade80; /** estado sobre oscuro */
  --awl-exito-700: #15803d; /** estado sobre claro */
  --awl-error-300: #f87171; /** estado sobre oscuro */
  --awl-error-700: #b91c1c; /** estado sobre claro */
  --awl-advertencia-300: #fbbf24; /** estado sobre oscuro */
  --awl-advertencia-700: #b45309; /** distinto del naranja de marca */
  --awl-info-300: #60a5fa; /** estado sobre oscuro */
  --awl-info-700: #1d4ed8; /** estado sobre claro */
  --awl-dv-1: #ff4d00; /** serie 1 — marca. 3.33:1 sobre blanco: relleno sí, etiqueta no · RESERVADO — Primera visualización de datos; la rampa inversa ya está validada a >=3:1. */
  --awl-dv-2: #2563eb; /** serie 2 · RESERVADO — Primera visualización de datos; la rampa inversa ya está validada a >=3:1. */
  --awl-dv-3: #0f766e; /** serie 3 · RESERVADO — Primera visualización de datos; la rampa inversa ya está validada a >=3:1. */
  --awl-dv-4: #7c3aed; /** serie 4 · RESERVADO — Primera visualización de datos; la rampa inversa ya está validada a >=3:1. */
  --awl-dv-5: #9d174d; /** serie 5 — solo claro; en oscuro usar la variante inversa (el original daba 2.51:1) · RESERVADO — Primera visualización de datos; la rampa inversa ya está validada a >=3:1. */
  --awl-dv-6: #6e6e6e; /** serie 6 — neutra · RESERVADO — Primera visualización de datos; la rampa inversa ya está validada a >=3:1. */
  --awl-font-display: 'Inter Tight', Inter, 'Segoe UI', Arial, sans-serif;
  --awl-font-body: Inter, 'Segoe UI', Arial, system-ui, sans-serif;
  --awl-font-mono: 'JetBrains Mono', Consolas, 'Courier New', monospace;
  --awl-font-size-50: 10px; /** micro mono: rótulos de footer, PILAR nn */
  --awl-font-size-100: 11px; /** eyebrow, numeración de paso */
  --awl-font-size-200: 12px; /** migas, metadatos mono */
  --awl-font-size-300: 13px; /** texto de footer */
  --awl-font-size-400: 14px; /** texto de apoyo: tarjetas, tablas, nav (absorbe 13.5px) */
  --awl-font-size-500: 15px; /** controles: botón, campo, checks (absorbe 14.5px) */
  --awl-font-size-600: 16px; /** cuerpo base */
  --awl-font-size-700: 17px; /** entradilla y h3 (absorbe 16.5px) */
  --awl-font-size-800: 18px; /** h3 de tarjeta de pilar */
  --awl-font-size-900: 24px; /** h2 secundario en páginas de servicio */
  --awl-font-size-display-1: clamp(26px, 3.4vw, 34px); /** h2 de sección */
  --awl-font-size-display-2: clamp(26px, 4vw, 40px); /** h2 de CTA final */
  --awl-font-size-display-3: clamp(30px, 4.5vw, 46px); /** h1 de página de servicio */
  --awl-font-size-display-4: clamp(40px, 6.5vw, 68px); /** h1 de portada */
  --awl-font-size-display-5: clamp(64px, 12vw, 120px); /** cifra de 404 */
  --awl-font-weight-regular: 400;
  --awl-font-weight-medium: 500;
  --awl-font-weight-semibold: 600;
  --awl-font-weight-bold: 700;
  --awl-font-weight-extrabold: 800;
  --awl-line-height-flat: 1; /** cifra de 404 */
  --awl-line-height-tight: 1.05; /** h1 de portada */
  --awl-line-height-snug: 1.1; /** h1 de servicio */
  --awl-line-height-heading: 1.2; /** h2 */
  --awl-line-height-body: 1.6; /** cuerpo */
  --awl-tracking-tighter: -0.035em; /** h1 de portada */
  --awl-tracking-tight: -0.03em;
  --awl-tracking-snug: -0.02em;
  --awl-tracking-subtle: -0.01em;
  --awl-tracking-wide: 0.08em; /** cabecera de tabla */
  --awl-tracking-wider: 0.1em;
  --awl-tracking-widest: 0.12em; /** eyebrow */
  --awl-space-1: 4px;
  --awl-space-2: 8px;
  --awl-space-3: 12px;
  --awl-space-4: 16px;
  --awl-space-5: 24px;
  --awl-space-6: 32px;
  --awl-space-7: 48px;
  --awl-space-8: 64px;
  --awl-space-9: 96px;
  --awl-radius-none: 0; /** regla de identidad: radio cero. Sin excepciones. */
  --awl-border-hair: 1px; /** rejillas y separadores */
  --awl-border-strong: 2px; /** anillo de foco, subrayado activo, cabecera de tabla */
  --awl-border-heavy: 3px; /** acento superior de tarjeta */
  --awl-shadow-overlay: 0 8px 28px rgba(0,0,0,0.18); /** única sombra permitida · RESERVADO — Primer componente flotante real (diálogo/toast). El dropdown del nav es plano por identidad. */
  --awl-motion-fast: 120ms; /** hover de enlaces, botones y tarjetas */
  --awl-motion-base: 200ms; /** RESERVADO — Entrada/salida de paneles y diálogos. */
  --awl-motion-slow: 320ms; /** RESERVADO — Transiciones de página completas. */
  --awl-motion-ease-standard: cubic-bezier(0.2,0,0,1);
  --awl-layout-container-max: 1160px;
  --awl-layout-container-prose: 66ch; /** RESERVADO — Columna para páginas de texto largo (aviso legal, artículos). Ninguna página actual es long-form. */
  --awl-layout-measure-narrow: 34ch; /** descriptor de footer */
  --awl-layout-measure-base: 56ch; /** párrafo de hero y de CTA (absorbe 52ch) */
  --awl-layout-measure-wide: 60ch; /** entradilla de sección */
  --awl-layout-measure-headline: 24ch; /** h2 de sección */
  --awl-layout-measure-headline-tight: 20ch; /** h2 de CTA final */
  --awl-layout-measure-headline-hero: 14ch; /** h1 de portada */
  --awl-layout-measure-form: 560px; /** ancho máximo de formulario */
  --awl-layout-measure-table: 640px; /** ancho máximo de tabla de datos */
  --awl-layout-brand-nav: 18px; /** alto de mayúscula del wordmark en el nav → 161px de ancho (ratio del trazo 8.924). OJO: bajó de 20px y el logo se ve 2.6× más grande, porque el viewBox se recortó al trazo y el token pasó de medir la caja vacía a medir la tinta. No 'corregirlo' de vuelta. */
  --awl-layout-brand-footer: 16px; /** alto de mayúscula del wordmark en el footer → 143px de ancho. Un paso por debajo del nav, a propósito. */
  --awl-layout-brand-clearance: 1; /** zona de exclusión mínima alrededor del wordmark, en múltiplos de su alto de mayúscula. Los assets .svg YA NO la incluyen (antes venía horneada en el viewBox y hacía que el logo se pintara al 34% del alto de su caja): ahora la garantiza el layout. */
  --awl-layout-target-min: 44px; /** objetivo táctil mínimo (WCAG 2.5.8) */
  --awl-layout-scroll-offset: 88px; /** alto del nav sticky (64) + holgura (24); usado por scroll-margin-top y por .side-card */
  --awl-z-sticky: 10; /** nav */
  --awl-z-dropdown: 20; /** panel de servicios */
  --awl-z-overlay: 30; /** RESERVADO — Velo de fondo del primer diálogo. */
  --awl-z-dialog: 40; /** RESERVADO — Diálogo modal. */
  --awl-z-toast: 50; /** RESERVADO — Notificación transitoria. */
  --awl-color-bg-canvas: var(--awl-blanco);
  --awl-color-bg-surface: var(--awl-gris-100);
  --awl-color-bg-elevated: var(--awl-blanco); /** RESERVADO — Superficie del primer componente flotante, junto a shadow.overlay. */
  --awl-color-bg-deep: var(--awl-negro-1000); /** la superficie más profunda: solo el footer. Negro puro, un paso por debajo de carbon-950 */
  --awl-color-text-primary: var(--awl-carbon-950);
  --awl-color-text-secondary: var(--awl-gris-600); /** AA 5.10 sobre canvas */
  --awl-color-text-tertiary: var(--awl-gris-600); /** rótulos mono de 10-11px; en oscuro NO puede caer a gris-600 (4.12:1) */
  --awl-color-text-placeholder: var(--awl-gris-600); /** AA 5.10. Los placeholders del sitio llevan formato real: son texto informativo, no decoración */
  --awl-color-text-disabled: var(--awl-gris-400); /** exento de contraste (WCAG 1.4.3); no reutilizar para texto activo */
  --awl-color-text-accent: var(--awl-naranja-700); /** AA 5.31 sobre canvas */
  --awl-color-brand-primary: var(--awl-negro-1000); /** RESERVADO — Color de marca para marcas dibujadas en CSS o SVG inline; los assets .svg lo llevan horneado. */
  --awl-color-brand-accent: var(--awl-naranja-500);
  --awl-color-border-subtle: var(--awl-gris-300); /** hairline de rejilla: 1.46:1 sobre blanco, decorativo pero perceptible */
  --awl-color-border-default: var(--awl-gris-200); /** 1.27:1 sobre blanco — decorativo (exento de 1.4.11), pero al límite de lo perceptible */
  --awl-color-border-strong: var(--awl-carbon-950);
  --awl-color-action-primary-bg: var(--awl-naranja-500);
  --awl-color-action-primary-text: var(--awl-carbon-950); /** negro, nunca blanco: 5.95:1 vs 3.33:1 (WCAG) */
  --awl-color-action-primary-hover: var(--awl-naranja-600); /** el texto sigue siendo negro: 4.92:1 */
  --awl-color-action-primary-active-bg: var(--awl-naranja-700); /** pulsado */
  --awl-color-action-primary-active-text: var(--awl-blanco); /** el par se invierte a propósito: sobre naranja-700 el negro da 3.73:1 (incumple) y el blanco 5.31:1. La regla 'negro, nunca blanco' rige para naranja-500/600, no para el pulsado. */
  --awl-color-action-secondary-hover: var(--awl-gris-100);
  --awl-color-action-secondary-active: var(--awl-gris-200);
  --awl-color-action-disabled-bg: var(--awl-gris-200);
  --awl-color-action-disabled-text: var(--awl-color-text-disabled);
  --awl-color-focus-ring: var(--awl-naranja-500); /** 3.33:1 sobre canvas y 3.02:1 sobre surface — cumple 1.4.11 con poco margen; el outline-offset de 2px es parte del cumplimiento */
  --awl-color-status-success: var(--awl-exito-700);
  --awl-color-status-error: var(--awl-error-700);
  --awl-color-status-warning: var(--awl-advertencia-700);
  --awl-color-status-info: var(--awl-info-700);
  --awl-color-field-border: var(--awl-carbon-950);
  --awl-color-field-border-invalid: var(--awl-error-700);
}

/* Superficies oscuras (nav, .sec--dark, .cta-final, footer). Solo redefine tokens semánticos: la paleta cruda no se duplica. */
[data-theme="dark"], .awl-inverse {
  --awl-color-bg-canvas: var(--awl-carbon-950);
  --awl-color-bg-surface: var(--awl-grafito-900);
  --awl-color-bg-elevated: var(--awl-grafito-900);
  --awl-color-text-primary: var(--awl-blanco); /** 19.30:1 */
  --awl-color-text-secondary: var(--awl-gris-d-300); /** AAA 9.13 */
  --awl-color-text-tertiary: var(--awl-gris-d-300); /** sustituye a gris-600, que daba 4.12:1 en el footer */
  --awl-color-text-placeholder: var(--awl-gris-d-300);
  --awl-color-text-disabled: var(--awl-gris-600); /** exento de contraste */
  --awl-color-text-accent: var(--awl-naranja-300); /** AAA 7.65 — sustituye a naranja-700, que daba 3.73:1 */
  --awl-color-brand-primary: var(--awl-blanco);
  --awl-color-border-subtle: var(--awl-gris-800);
  --awl-color-border-default: var(--awl-gris-800);
  --awl-color-border-strong: var(--awl-gris-d-300);
  --awl-color-action-secondary-hover: var(--awl-grafito-900);
  --awl-color-action-secondary-active: var(--awl-gris-800);
  --awl-color-action-disabled-bg: var(--awl-gris-800);
  --awl-color-action-disabled-text: var(--awl-gris-600);
  --awl-color-focus-ring: var(--awl-naranja-300); /** 7.65:1 sobre carbon-950 */
  --awl-color-status-success: var(--awl-exito-300);
  --awl-color-status-error: var(--awl-error-300);
  --awl-color-status-warning: var(--awl-advertencia-300);
  --awl-color-status-info: var(--awl-info-300);
  --awl-color-field-border: var(--awl-gris-d-300);
  --awl-color-field-border-invalid: var(--awl-error-300);
  --awl-dv-1: #ff7a40; /** serie 1 — marca aclarada, 7.65:1 */
  --awl-dv-2: #60a5fa; /** serie 2 */
  --awl-dv-3: #2dd4bf; /** serie 3 */
  --awl-dv-4: #a78bfa; /** serie 4 */
  --awl-dv-5: #fb7185; /** serie 5 — reemplaza #9d174d, que daba 2.51:1 sobre oscuro */
  --awl-dv-6: var(--awl-gris-d-300); /** serie 6 — neutra */
}

/* Impresión: tinta sobre papel. Devuelve las superficies inversas a fondo blanco (si no, el footer sale como una plancha negra) y cambia el acento a naranja-800, que es el que aguanta en CMYK. */
@media print {
  :root, .awl-inverse {
    --awl-color-bg-canvas: var(--awl-blanco);
    --awl-color-bg-surface: var(--awl-blanco);
    --awl-color-bg-elevated: var(--awl-blanco); /** RESERVADO — Superficie del primer componente flotante, junto a shadow.overlay. */
    --awl-color-bg-deep: var(--awl-blanco); /** el footer no se imprime en negro */
    --awl-color-text-primary: var(--awl-negro-1000);
    --awl-color-text-secondary: var(--awl-gris-600);
    --awl-color-text-tertiary: var(--awl-gris-600);
    --awl-color-text-accent: var(--awl-naranja-800); /** naranja-800 es el tono documentado para impresión */
    --awl-color-brand-primary: var(--awl-negro-1000);
    --awl-color-brand-accent: var(--awl-naranja-800);
    --awl-color-border-subtle: var(--awl-gris-300);
    --awl-color-border-default: var(--awl-gris-300); /** gris-200 no imprime; 300 sí */
    --awl-color-border-strong: var(--awl-negro-1000);
  }
}