/* ═══════════════════════════════════════════════════════
   RHEIN83 LATAM — Design Tokens
   PHP inyecta: <style>:root{--cfg-p:...;--cfg-a:...;--cfg-dark:...}</style>
   ═══════════════════════════════════════════════════════ */
:root {
  /* Brand — sobreescritos desde DB via PHP (site_config: color_primary/
     color_accent/color_dark). Refresh 2026-09-08: azul marino Rhein83 en vez
     de cyan — pedido explícito del cliente con paleta propia (#004B87), no
     un color-mix calculado. El dorado (--a) se mantiene: sigue siendo el
     único acento para "Destacado", precio de oferta y el botón B2B. */
  --p:      var(--cfg-p, #004B87);
  --p-l:    color-mix(in srgb, var(--p) 75%, #fff);
  --p-d:    var(--cfg-dark, #003366);
  --a:      var(--cfg-a, #D4922A);
  --a-l:    color-mix(in srgb, var(--a) 75%, #fff);
  --a-d:    color-mix(in srgb, var(--a) 75%, #000);
  --dark:   var(--cfg-dark, #003366);
  --dark-m: color-mix(in srgb, var(--dark) 55%, #163558);
  --dark-l: color-mix(in srgb, var(--dark) 30%, #163558);

  /* Bandera italiana — micro-marca junto al logo, decorativa (no funcional). */
  --flag-green: #009246;
  --flag-red:   #CE2B37;

  /* Neutros */
  --white:  #FFFFFF;
  --g50:    #F8FAFC;
  --g100:   #EFF3F7;
  --g200:   #E2E8F0;   /* solo bordes/fondos, nunca texto */
  --g300:   #B0BEC5;   /* solo bordes/fondos, nunca texto */
  /* g400/g500 retocados (2026-09-07): los tonos originales daban 2.59:1 y 4.37:1
     de contraste sobre blanco — bajo el mínimo WCAG AA de 4.5:1 para texto, y
     se usaban como color de texto en ~200 lugares (precios, cantidades, metadatos).
     Mismo matiz/saturación, solo más oscuros: 4.92:1 y 5.63:1. */
  --g400:   #5D747F;
  --g500:   #526B77;
  --g700:   #334155;
  --text:   #0A1628;

  /* Semánticos */
  --ok:     #22C55E;
  --warn:   #F59E0B;
  --err:    #EF4444;
  --info:   var(--p);

  /* UI — refresh 2026-09-07: radios más suaves y sombras en capas (offset +
     blur + tinte de tinta en vez de negro puro) para una sensación más actual.
     --radius/--radius-l ya alimentaban botones, cards, kpi-cards, alerts,
     toasts, tabs — subirlos aquí se propaga a todo el sitio sin tocar cada
     componente. */
  --radius:    10px;
  --radius-l:  16px;
  --radius-xl: 28px;
  --shadow:    0 1px 2px rgba(0,42,77,.05), 0 2px 10px rgba(0,42,77,.07);
  --shadow-m:  0 2px 6px rgba(0,42,77,.06), 0 12px 28px rgba(0,42,77,.11);
  --shadow-l:  0 4px 10px rgba(0,42,77,.07), 0 24px 56px rgba(0,42,77,.18);
  --trans:     0.22s cubic-bezier(.16,1,.3,1);
  --ease:      cubic-bezier(.16,1,.3,1);

  /* Tipografía — refresh 2026-09-08: Montserrat (headings/botones/precios) +
     Open Sans (cuerpo), reemplaza Barlow/Barlow Condensed/Rajdhani. --font-r
     ahora apunta a Montserrat también: el sitio queda en solo 2 familias. */
  --font:   'Open Sans', 'Segoe UI', sans-serif;
  --font-c: 'Montserrat', 'Segoe UI', sans-serif;
  --font-r: 'Montserrat', 'Segoe UI', sans-serif;
}