/* ==========================================================================
   Pulso Comunal — tokens vigentes (09-10-2026)
   Para páginas nuevas FUERA del motor (landings, reportes, herramientas).
   Dentro del motor no se usa este archivo: se cargan motor/sitio/estilos.css y apple.css.
   Guía completa: 02. Pulso Comunal/IDENTIDAD-VISUAL.md. Si cambia una decisión de estilo,
   se actualizan la guía y este archivo en la misma tarea.
   ========================================================================== */
@import url('https://fonts.googleapis.com/css2?family=Inter+Tight:wght@500;600&family=Inter:wght@400;500;600&display=swap');

:root{
  color-scheme:light;
  /* marca (paleta Lago) */
  --brand:#1E40AF; --brand-hover:#1E3A8A; --brand-soft:#EFF6FF; --brand-on-dark:#38BDF8;
  --accent:var(--brand); --accent-ink:#FFFFFF; --accent-soft:var(--brand-soft);
  /* texto y superficies */
  --ink:#0B1220; --ink-2:#374151; --muted:#6B7280;
  --bg:#FFFFFF; --surface:#FFFFFF; --sunk:#F3F4F6; --pildora:#F1F3F6;
  --line:#E5E7EB; --line-2:#F0F1F3; --map-bg:#ECEEEE;
  /* estados */
  --ok:#15803D; --warn:#B45309; --error:#B91C1C;
  /* confianza (píldoras sin borde) */
  --hecho-bg:#EFF6FF; --hecho:#1E40AF; --est-bg:#FEF3E2; --est:#9A4A07;
  --hip-bg:#EEF0F4; --hip:#374151; --preg-bg:#FEF2F2; --preg:#B91C1C;
  /* datos: Okabe-Ito (categorías y rubros) */
  --s1:#0072B2; --s2:#D55E00; --s3:#009E73; --s4:#E69F00; --s5:#CC79A7; --s6:#56B4E9; --s7:#3F3F46; --s8:#F0E442;
  /* rampas: magnitud (azul), campo/temporada (verde-azulada), acento y resto */
  --q1:#EFF6FF; --q2:#C5D2EF; --q3:#9BADDF; --q4:#7289CF; --q5:#4864BF; --q6:#1E40AF; --q7:#1E3A8A;
  --gv-t1:#A9DFD1; --gv-t2:#6CC5AE; --gv-t3:#2FA88E; --gv-t4:#0E7C6B; --gv-t5:#095246;
  --gv-acento:#D55E00; --gv-gris:#B4BAC5;
  /* degradados sobrios (regla 2b): nunca en texto, logo ni datos */
  --grad:linear-gradient(135deg,#1E40AF 0%,#1E3A8A 100%);
  --grad-hover:linear-gradient(135deg,#1E3A8A 0%,#0B1220 160%);
  --grad-soft:linear-gradient(180deg,#EFF6FF 0%,#FFFFFF 100%);
  --grad-pie:linear-gradient(180deg,#0B1220 0%,#1E3A8A 160%);
  --velo-foto:linear-gradient(90deg,rgba(11,18,32,.90) 0%,rgba(30,58,138,.62) 45%,rgba(30,64,175,.16) 100%);
  /* tipografía */
  --display:"Inter Tight","Inter",system-ui,sans-serif;
  --sans:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,Consolas,monospace;
  /* forma: sin bordes, profundidad con sombra */
  --r-xl:20px; --r-card:18px; --r-sm:14px; --r-box:12px; --r-pill:999px;
  --sombra:0 1px 2px rgba(15,23,42,.06),0 6px 20px rgba(15,23,42,.10);
  --sombra-hover:0 2px 4px rgba(15,23,42,.07),0 14px 32px rgba(15,23,42,.16);
  --sombra-p:0 1px 2px rgba(15,23,42,.06),0 2px 8px rgba(15,23,42,.06);
  --sombra-ph:0 2px 4px rgba(15,23,42,.08),0 8px 20px rgba(15,23,42,.12);
  --sombra-flota:0 4px 20px rgba(10,10,10,.08);
  --sombra-dialogo:0 24px 64px rgba(15,23,42,.28),0 2px 6px rgba(15,23,42,.08);
  --vidrio:rgba(255,255,255,.8); --blur:saturate(180%) blur(20px);
  /* movimiento */
  --ease:cubic-bezier(.25,.1,.25,1); --ease-out:cubic-bezier(.2,.8,.2,1); --t:.2s;
  --wrap:1180px;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  color-scheme:dark;
  --bg:#0A0F1A; --surface:#111827; --sunk:#0E1522; --pildora:#1A2230;
  --ink:#F3F4F6; --ink-2:#D1D5DB; --muted:#9CA3AF; --line:#1F2937; --line-2:#1A2230; --map-bg:#1A1F27;
  --accent:var(--brand-on-dark); --accent-ink:#0A0A0A; --accent-soft:rgba(56,189,248,.12);
  --ok:#4ADE80; --warn:#FBBF24; --error:#F87171;
  --hecho-bg:rgba(56,189,248,.14); --hecho:#93C5FD; --est-bg:rgba(245,158,11,.14); --est:#FCD34D;
  --hip-bg:rgba(255,255,255,.08); --hip:#E5E7EB; --preg-bg:#3B1218; --preg:#FCA5A5;
  --s7:#A1A1AA;
  --grad:linear-gradient(#38BDF8,#38BDF8); --grad-soft:linear-gradient(180deg,rgba(56,189,248,.10) 0%,var(--surface) 100%);
  --sombra:inset 0 0 0 1px rgba(255,255,255,.07),0 1px 2px rgba(0,0,0,.5),0 8px 24px rgba(0,0,0,.45);
  --sombra-hover:inset 0 0 0 1px rgba(255,255,255,.12),0 2px 4px rgba(0,0,0,.55),0 16px 36px rgba(0,0,0,.6);
  --sombra-p:0 1px 3px rgba(0,0,0,.35); --sombra-ph:0 6px 18px rgba(0,0,0,.45);
  --sombra-flota:0 4px 20px rgba(0,0,0,.45); --vidrio:rgba(10,15,26,.72);
}}

/* base */
body{margin:0;font:400 16px/1.55 var(--sans);color:var(--ink);background:var(--bg);-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{font-family:var(--display);font-weight:600;letter-spacing:-.02em;color:var(--ink)}
h1{letter-spacing:-.03em;line-height:1.04}
.num{font-family:var(--display);font-weight:600;letter-spacing:-.03em;font-variant-numeric:tabular-nums;color:var(--accent)}
a{color:var(--accent)}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
@media (max-width:640px){body{font-size:17px}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* piezas mínimas */
.tarjeta{background:var(--surface);border-radius:var(--r-card);box-shadow:var(--sombra);padding:24px;transition:box-shadow var(--t) var(--ease)}
a.tarjeta:hover,button.tarjeta:hover{box-shadow:var(--sombra-hover)}
.boton{display:inline-flex;align-items:center;height:44px;padding:0 22px;border:0;border-radius:var(--r-pill);background:var(--grad);color:var(--accent-ink);
  font:500 17px/1 var(--sans);text-decoration:none;cursor:pointer;transition:background var(--t) var(--ease)}
.boton:hover{background:var(--grad-hover)}
.boton:active{transform:scale(.98)}
.boton.sec{background:var(--pildora);color:var(--accent)}
.boton.sec:hover{background:var(--surface);box-shadow:var(--sombra-ph)}
.pildora{height:34px;padding:0 14px;border:0;border-radius:var(--r-pill);background:var(--pildora);color:var(--ink);font:500 14px/1 var(--sans);cursor:pointer}
.pildora[aria-pressed="true"]{background:var(--accent);color:var(--accent-ink);box-shadow:0 2px 10px color-mix(in srgb,var(--accent) 30%,transparent)}
.et{display:inline-flex;align-items:center;padding:2px 9px;border-radius:var(--r-pill);font:600 12px/1.4 var(--sans)}
.et.HECHO{background:var(--hecho-bg);color:var(--hecho)} .et.ESTIMACION{background:var(--est-bg);color:var(--est)}
.et.HIPOTESIS{background:var(--hip-bg);color:var(--hip)} .et.PREGUNTA{background:var(--preg-bg);color:var(--preg)}
