/* ============================================================================
   SilverSeal — Design Tokens · "Precision Studio"
   Ice-white engineering showroom. Cerulean Apricot palette (cliente).
   Antítesis deliberada de SmartVend (dark glass): aquí todo se lee CLARO.
   ========================================================================== */
:root{
  /* — Marca (paleta Cerulean Apricot del cliente) — */
  --ink:        #0A2E52;   /* navy tinta: titulares, texto fuerte, footer      */
  --brand:      #155088;   /* azul principal: links, iconografía, hover        */
  --bright:     #2A78C0;   /* cerulean: text-accent AA-safe (links, categorías)*/
  /* Sistema de 2 acentos que rompe la monotonía azul (paleta que sumó Diego):
     TEAL = acento FRÍO vivo (decorativo/interactivo, pervasivo) ·
     CORAL = acento CÁLIDO escaso (un pop por vista). Navy sigue de ancla. */
  --teal:       #3FB3A3;   /* teal fill: dash del eyebrow, indicadores activos  */
  --teal-deep:  #2E9385;   /* teal hover                                        */
  --teal-ink:   #17786A;   /* teal TEXTO (AA sobre claro): chips, links-acento  */
  --tint-teal:  rgba(63,179,163,.12);
  --accent:     #E9886B;   /* CORAL (antes apricot): seal-line, stat líder pop  */
  --accent-deep:#D9694A;   /* coral hover                                       */

  /* — Fondos (blanco + hielo, alternados) — */
  --bg:         #FFFFFF;   /* base                                             */
  --bg-alt:     #B6CEE8;   /* hielo (secciones alternas) — MÁS OSCURO (Diego): azul-ice medio, las cards blancas saltan fuerte */
  --bg-wash:    #DCE8F6;   /* hielo intermedio (cabecera-capítulo dentro de cards) */
  --paper:      #FFFFFF;

  /* — Navy scale (banda oscura, footer) — */
  --navy-900:   #071F3A;
  --navy-800:   #0A2E52;
  --navy-700:   #123F6C;
  --navy-600:   #1A4D80;

  /* — Ink / texto — */
  --t-1:        #0A2E52;   /* principal                                        */
  --t-2:        #2E4A66;   /* secundario — oscurecido: descripciones más fuertes, menos apagadas */
  --t-3:        #45607A;   /* terciario / captions — oscurecido (más contraste, sigue AA)       */
  --on-ink:     #FFFFFF;   /* texto sobre navy                                 */
  --on-ink-soft:#B7CEE6;   /* secundario sobre navy (subido un punto)          */

  /* — Líneas y superficies — */
  --line:       rgba(10,46,82,.12);
  --line-2:     rgba(10,46,82,.20);
  --line-navy:  rgba(255,255,255,.14);
  --tint:       rgba(42,120,192,.08);   /* wash cerulean para hover suave      */

  /* — Tipografía (Kanit self-host; CJK al stack de sistema) — */
  --font: 'Kanit', 'PingFang SC', 'Microsoft YaHei', 'Noto Sans SC', system-ui, -apple-system, sans-serif;
  /* Kanit es la display Y la body: la variabilidad la da el PESO, no dos familias. */

  --t-hero:  clamp(2.5rem, 5.6vw, 4.9rem);
  --t-h1:    clamp(2.1rem, 4.2vw, 3.6rem);
  --t-h2:    clamp(1.75rem, 3.1vw, 2.7rem);
  --t-h3:    clamp(1.25rem, 1.8vw, 1.6rem);
  --t-h4:    clamp(1.05rem, 1.25vw, 1.18rem);
  --t-body:  clamp(1rem, 1.02vw, 1.075rem);
  --t-small: .875rem;
  --t-micro: .76rem;

  --lh-tight: 1.08;
  --lh-body:  1.65;
  --ls-caps:  .14em;   /* labels UI en mayúsculas */
  --ls-tight: -.015em; /* display */

  /* — Geometría (radios 10px: ni 6px industrial ni pill por inercia) — */
  --r-lg: 16px;
  --r-md: 10px;
  --r-sm: 7px;
  --r-pill: 999px;

  --wrap:        1240px;
  --wrap-narrow: 880px;
  --gut:  clamp(18px, 4vw, 40px);
  --pad-sec: clamp(3.4rem, 6.4vw, 6.5rem);
  --gap:  clamp(1rem, 1.7vw, 1.6rem);

  /* — Sombras (suaves, azuladas; nunca negro puro) — */
  --sh-sm: 0 1px 2px rgba(10,46,82,.05), 0 2px 8px rgba(10,46,82,.05);
  --sh-md: 0 8px 22px rgba(10,46,82,.08), 0 2px 6px rgba(10,46,82,.05);
  --sh-lg: 0 18px 44px rgba(10,46,82,.12), 0 6px 14px rgba(10,46,82,.06);
  --sh-hover: 0 22px 52px rgba(10,46,82,.16);

  /* — Motion (Ley del 07: sin ease-in en UI; se especifican propiedades, nunca la abreviatura global) — */
  --ease:      cubic-bezier(.23,1,.32,1);
  --ease-expo: cubic-bezier(.16,1,.3,1);
  --dur-1: 130ms;
  --dur-2: 280ms;
  --dur-3: 480ms;

  --header-h: 76px;
}
