/* iwp-palette.css — la paleta DE LA WEB sobre la estructura del sistema.

   Orden: iwp-tokens.css → ESTE → iwp-bundle.css → iwp-home.css

   Orden del usuario (2026-09-22): "los colores deben ser los que hay
   actualmente". El sistema de diseño aporta la maqueta, la tipografía, el
   espacio y los componentes; el color sale de la web viva, no del azul marino
   y el verde menta del artefacto. Cada valor de aquí existe ya en
   itw-shell.css: al lado de cada uno va la variable de la que sale.

   Los pares de texto están medidos, no supuestos. El más justo es
   ink-subtle sobre la banda gris: 4,73:1. Todos pasan WCAG AA. */

:root {
  /* Superficies */
  --surface: #ffffff;                    /* --c-surface */
  --surface-sunken: #f5f7fa;             /* --c-bg, la banda alterna de la web */
  --surface-raised: #ffffff;             /* --c-surface */
  --surface-mint: #d9f5e9;               /* --c-green-tint */
  --surface-ink: #1d1d1f;                /* --c-ink */
  --surface-brand: #eef0fc;              /* --c-primary-tint */
  --surface-gold: #fdf1dc;               /* --c-amber-tint */

  /* Las escenas nocturnas de la portada usan el negro que la web ya tiene en
     sus bloques oscuros, no el #0d0f0f del sistema. */
  --surface-night: #1d1d1f;              /* --c-ink */

  /* Tinta */
  --ink: #1d1d1f;                        /* --c-ink */
  --ink-muted: #515154;                  /* --c-text */
  --ink-subtle: #6e6e73;                 /* --c-text-muted */
  --on-ink: #f5f5f7;                     /* --c-on-ink */
  --on-ink-muted: #a1a1a6;               /* --c-on-ink-soft */
  --on-brand: #ffffff;

  /* Marca. El morado #667eea no se usa para texto: sobre blanco da 3,3:1.
     Para eso la web ya tiene --c-primary-ink, que su propio CSS describe como
     "variante accesible de la marca para texto pequeño sobre claro". */
  --brand: #4c56c0;                      /* --c-primary-ink */
  --brand-bright: #764ba2;               /* --c-primary-deep */

  /* Estados */
  --mint-ink: #076f4c;                   /* --c-green-ink */
  --mint-on-night: #34d399;              /* --c-green-bright */
  --gold-ink: #8a5a08;                   /* --c-amber-ink */

  /* Acción. El relleno plano es el respaldo; el degradado de la marca lo pone
     iwp-home.css sobre .iwp-btn--primary. */
  --action: #4c56c0;                     /* --c-primary-ink */
  --on-action: #ffffff;

  /* Líneas */
  --line: rgba(29, 29, 31, .10);         /* --c-border */
  --line-on-ink: rgba(255, 255, 255, .12); /* --c-border-on-ink */

  /* line-strong delimita controles y el sistema le exige 3:1. El
     --c-border-strong de la web es rgba(29,29,31,.16), que sobre blanco queda
     en 1,3:1 y no sirve para esto. Este gris sí: 3,81:1 sobre blanco y 3,55:1
     sobre la banda. */
  --line-strong: #82828a;

  --focus: #4c56c0;                      /* --c-primary-ink */
}