/* ============================================================================
   flo · design tokens — fuente canónica del design system
   ----------------------------------------------------------------------------
   Extraído de las páginas reales (index.html + landings), NO del handoff v1.
   El handoff §5.2 asumía Poppins/Inter y algunos hex inventados; la realidad
   del sitio es DM Sans + DM Serif Display sobre la escala teal --t900..--t50.

   Uso: las páginas NUEVAS (Sprint 1+) enlazan este archivo:
       <link rel="stylesheet" href="/_shared/tokens.css">
   Las páginas existentes siguen con sus tokens inline (idénticos); este archivo
   los consolida para no repetir a mano en cada landing nueva.

   Reglas:
   - Este archivo SOLO define variables (tokens). Cero reglas de layout.
   - Constantes de negocio (UVT, topes DIAN) NO van aquí → _shared/calc-utils.js.
   - Al cambiar un color de marca, cámbialo aquí una vez.
   ========================================================================== */

:root {
  /* ── Escala teal (marca) ─────────────────────────────────────────────── */
  --t900: #04342C;   /* fondo oscuro principal / teal-deep */
  --t800: #085041;
  --t600: #0F6E56;
  --t400: #1D9E75;   /* verde de relleno real (barras, fills, acentos) */
  --t200: #5DCAA5;
  --t50:  #E1F5EE;   /* crema / texto sobre fondo oscuro */

  /* ── Acentos ─────────────────────────────────────────────────────────── */
  --amber: #EF9F27;  /* punto del logo + CTAs cálidos */
  --white: #FFFFFF;

  /* ── Verdes/azules auxiliares (presentes en index.html) ──────────────── */
  --fill:  #3FA882;  /* relleno alterno usado por el home (NO es --flo-fill) */
  --water: #2F95C9;  /* azul agua — solo gamificación de caudal */
  --soft:  #9FE0C4;  /* verde suave sobre fondos oscuros */

  /* ── Tema claro (secciones bg-white / páginas de contenido) ──────────── */
  --bg:        #F7FAF8;
  --surface:   #FFFFFF;
  --surface2:  #EEF4F1;
  --ink:       #0C2A22;  /* texto principal sobre fondo claro */
  --muted:     #4A6258;  /* texto secundario */
  --hint:      #7C938A;  /* texto terciario / pistas */
  --border:    #E2EBE6;

  /* ── Tiers de gamificación (caudal) ──────────────────────────────────── */
  --tier-gota:      #94A3B8;
  --tier-corriente: #7BC4A4;
  --tier-rio:       #2E8B6E;
  --tier-cascada:   #0F766E;

  /* ── Tipografía ──────────────────────────────────────────────────────── */
  --serif: 'DM Serif Display', Georgia, serif;
  --sans:  'DM Sans', -apple-system, system-ui, sans-serif;

  /* ── Radios ──────────────────────────────────────────────────────────── */
  --r-sm:   8px;
  --r-md:   12px;
  --r-lg:   16px;
  --r-xl:   22px;
  --r-pill: 999px;

  /* ── Espaciado ───────────────────────────────────────────────────────── */
  --space-xl: 4rem;
  --space-lg: 2.5rem;
  --space-md: 2rem;
  --space-sm: 1rem;

  /* ── Anchos de contenido ─────────────────────────────────────────────── */
  --max-w-prose: 62ch;
  --max-w-page:  1120px;   /* alineado con el .wrap del home (1120px) */

  /* ── Alias semánticos del handoff ────────────────────────────────────────
     El copy y los templates del programa GEO/SEO usan estos nombres.
     Se mapean sobre los tokens reales para que el handoff funcione sin
     refactorizar las páginas existentes.
     --flo-fill → --t400 (#1D9E75), el verde de relleno real (decisión Sergio
     2026-07-03: NO al #3FA882, que era el --fill inventado en la v1).       */
  --teal-deep: var(--t900);
  --gold-dot:  var(--amber);
  --cream:     var(--t50);
  --flo-fill:  var(--t400);
  --green-700: var(--t600);
  --water-blue: var(--water);
  --radius-lg: var(--r-lg);
  --radius-md: var(--r-md);
  --radius-sm: var(--r-sm);
}
