/* ════════════════════════════════════════════════════════════════════
   ACCOUNTRIX · DESIGN TOKENS · SSOT
   ════════════════════════════════════════════════════════════════════
   Fuente única de verdad para color, tipografía, pesos, line-heights
   y layout máximo. Cualquier cambio aquí se propaga a:
     · index.html
     · glow-up-tributario/index.html
     · cualquier landing/iframe futura del rider

   Reglas inamovibles (ver memoria feedback_accountrix_visual_rules):
     · Cero border-radius en superficies de marca
     · Cero hover transforms (no scale, translate, rotate)
     · Cero offset shadows brutalist (Npx Npx 0 color)
     · Hero h1: fw-regular para texto principal, fw-bold solo en accent
     · Mono-familia tipográfica: Rethink Sans
     · --fw-bold reasignado a 600 (no 700) por posicionamiento anti-firma
   ════════════════════════════════════════════════════════════════════ */

:root {
  /* ── PALETA · primitivos (HEX) ─────────────────────────────────── */
  --color-deep-nexus:     #120c28;
  --color-platinum:       #f1f0f5; /* HSL(253°,20%,95%) — ADN del hero, antes #f1f1f1 sin temperatura */
  --color-white:          #ffffff;
  --color-vivid-purple:   #8266ff;
  --color-periwinkle:     #cbb9f7;
  --color-neon-sky:       #8df4ff; /* neon — solo digital */
  --color-byte-green:     #45f09e; /* neon — solo digital */
  --color-quantum-lemo:   #dcf045; /* neon — solo digital */
  --color-synthwave-bush: #ff7a7c; /* neon — solo digital */

  /* ── PALETA · print-safe (Pantone Solid Coated — NO usar en digital) */
  /* Derivadas del hue de cada accent. Usan el mismo H, sin neon.       */
  /* Verificar contra muestra física antes de producción.               */
  --color-neon-sky-print:       #1c93a0; /* H=186° · Pantone 3115 C · C:82 M:8  Y:0  K:37 */
  --color-quantum-lemo-print:   #c2d723; /* H=67°  · Pantone 382 C  · C:10 M:0  Y:84 K:16 */
  --color-byte-green-print:     #0f9554; /* H=151° · Pantone 3268 C · C:90 M:0  Y:44 K:42 */
  --color-synthwave-bush-print: #ff575a; /* H=359° · Pantone 177 C  · C:0  M:66 Y:65 K:0  */

  /* ── PALETA · canales RGB (para alphas) ────────────────────────── */
  --color-deep-nexus-rgb:     18, 12, 40;
  --color-platinum-rgb:       241, 240, 245; /* actualizado con #f1f0f5 */
  --color-white-rgb:          255, 255, 255;
  --color-vivid-purple-rgb:   130, 102, 255;
  --color-periwinkle-rgb:     203, 185, 247;
  --color-neon-sky-rgb:       141, 244, 255;

  /* ── COLOR · tokens semánticos ─────────────────────────────────── */
  --bg-dark:       var(--color-deep-nexus);
  --bg-light:      var(--color-platinum);
  --text-main:     var(--color-deep-nexus);
  --text-on-dark:  var(--color-platinum);
  --brand:         var(--color-vivid-purple);
  --brand-soft:    var(--color-periwinkle);
  --accent:        var(--color-neon-sky);
  --success:       var(--color-byte-green);
  --warning:       var(--color-quantum-lemo);
  --error:         var(--color-synthwave-bush);

  /* ── COLOR · alphas ────────────────────────────────────────────── */
  --brand-10:  rgba(var(--color-vivid-purple-rgb), 0.1);
  --brand-20:  rgba(var(--color-vivid-purple-rgb), 0.2);
  --dark-10:   rgba(var(--color-deep-nexus-rgb), 0.1);
  --dark-20:   rgba(var(--color-deep-nexus-rgb), 0.2);
  --light-10:  rgba(var(--color-platinum-rgb), 0.1);
  --light-20:  rgba(var(--color-platinum-rgb), 0.2);

  /* ── COLOR · aliases legacy (para evitar romper CSS antiguo) ───── */
  --dark:         var(--bg-dark);
  --light:        var(--bg-light);
  --purple:       var(--brand);
  --purple-light: var(--brand-soft);
  --cyan:         var(--accent);
  --yellow:       var(--warning);
  --green:        var(--success);

  /* ── TIPOGRAFÍA · familia ──────────────────────────────────────── */
  --font: 'Rethink Sans', sans-serif;

  /* ── TIPOGRAFÍA · escala con roles documentados ────────────────── */
  /* La jerarquía la da TAMAÑO + PESO + COLOR, nunca familia.
     El nombre del token describe SU ROL, no su tamaño. */

  /* Display     → hero principal, CTA grande            28–40px */
  --fs-display: clamp(1.75rem, 4.5vw, 2.5rem);
  /* Page title  → h1 de páginas interiores              28–40px */
  --fs-h1:      clamp(1.75rem, 4.5vw, 2.5rem);
  /* Section     → h2 de sección de página               24–36px */
  --fs-section: clamp(1.5rem, 4vw, 2.25rem);
  /* Subsection  → h2 dentro de panels, casas, conoce    18–26px */
  --fs-h2:      clamp(1.15rem, 3vw, 1.6rem);
  /* Card title  → h3 dentro de cards                    16–18px */
  --fs-h3:      clamp(1rem, 1.6vw, 1.125rem);
  /* Label       → subtítulos pequeños, intros           14–16px */
  --fs-h4:      clamp(0.9rem, 1.5vw, 1rem);
  /* Body large  → párrafos hero, intros de sección      16px    */
  --fs-body-lg: 1rem;
  /* Body        → párrafo estándar, listas, FAQ         14px    */
  --fs-body:    0.875rem;
  /* Caption     → nav, footer, bullets de cards         12px    */
  --fs-caption: 0.75rem;
  /* Micro       → tabs muy pequeños, badges, eyebrows   11px    */
  --fs-micro:   0.6875rem;

  /* ── TIPOGRAFÍA · line-heights ─────────────────────────────────── */
  --lh-display: 1.05;
  --lh-h1:      1.1;
  --lh-h2:      1.2;
  --lh-body:    1.6;

  /* ── TIPOGRAFÍA · pesos ────────────────────────────────────────── */
  /* fw-bold reasignado a 600 (semibold) por decisión de marca:
     Accountrix se posiciona como "firma anti-firma" sobria; el peso
     700 carga densidad visual hostil de firma tradicional. Mantener
     600 como techo lo aleja de Epa/Yina/firmas-azules y lo acerca a
     Truora/Mr. Taxes. Si necesitás 700 real, redefinir aquí. */
  --fw-regular:  400;
  --fw-medium:   500;
  --fw-semibold: 600;
  --fw-bold:     600;

  /* ── LAYOUT ────────────────────────────────────────────────────── */
  --max: 1280px;
}

/* Reset que respeta el peso de marca: <strong>/<b> hereda --fw-bold
   en vez de quedarse en 700 del UA stylesheet. */
strong, b { font-weight: var(--fw-bold); }