/* ============================================================================
   KAIRO · hoja de estilo compartida
   Estética V2 (acento dorado). Fuente única de verdad de la identidad visual.
   Enlazar en todas las páginas ANTES de su <style> propio:
     <link rel="stylesheet" href="kairo.css">
   Cada página puede sobreescribir lo que necesite en su <style> local.
   ============================================================================ */

/* ---- 1 · TOKENS ---- */
:root{
  --ink:#07090D; --panel:#0D1117; --panel-2:#121824; --panel2:#121824;
  --border:#1B2330; --border-strong:#2A3648; --border2:#2A3648;
  --text:#E9EEF5; --muted:#8593A6; --dim:#4A5568;
  --gold:#C9A227; --gold-soft:rgba(201,162,39,.15); --gold-dim:rgba(201,162,39,.06);
  --ok:#3FBF8F; --exp:#E0A83E; --prob:#E4604A;
  --radius:10px;
}

/* ---- 2 · RESET + BASE ---- */
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0; background:var(--ink); color:var(--text);
  font-family:Inter,system-ui,sans-serif; font-size:15px; line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
a{color:var(--gold); text-decoration:none}
:focus-visible{outline:2px solid var(--gold); outline-offset:2px; border-radius:4px}
.mono{font-family:"JetBrains Mono",ui-monospace,monospace}
.hidden{display:none!important}

@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* ---- 3 · MARCA / NAV ---- */
.k-brand{
  display:flex; align-items:center; gap:9px;
  font-size:14px; font-weight:500; letter-spacing:.12em; text-transform:uppercase;
  color:var(--text);
}
.k-brand-mark{
  width:22px; height:22px; border-radius:6px;
  background:linear-gradient(135deg,var(--gold),rgba(201,162,39,.6));
  display:grid; place-items:center; flex-shrink:0;
}
.k-brand-mark svg{width:12px; height:12px}

/* ---- 4 · BOTONES (estética V2) ---- */
.k-btn{
  display:inline-block; background:var(--gold); color:#111;
  font-weight:600; font-size:14px; padding:12px 24px;
  border:none; border-radius:8px; cursor:pointer; font-family:inherit;
  transition:filter .15s, transform .15s;
  /* halo dorado · firma de V2 */
  box-shadow:0 0 0 1px rgba(201,162,39,.3), 0 4px 16px rgba(201,162,39,.2);
}
.k-btn:hover{filter:brightness(1.08); transform:translateY(-1px)}
.k-btn:disabled{opacity:.45; cursor:not-allowed; transform:none; box-shadow:none}
.k-btn-ghost{
  background:transparent; border:1px solid var(--border-strong); color:var(--text);
  font-weight:600; box-shadow:none;
}
.k-btn-ghost:hover{border-color:var(--gold); color:var(--gold); filter:none}

/* ---- 5 · BADGE (píldora de estado, encendida en dorado · V2) ---- */
.k-badge{
  display:inline-flex; align-items:center; gap:7px;
  background:rgba(201,162,39,.1); border:1px solid rgba(201,162,39,.4);
  border-radius:99px; padding:5px 13px 5px 9px;
  font-family:"JetBrains Mono",monospace; font-size:11px; letter-spacing:.08em;
  color:var(--gold);
}
.k-badge .dot{width:6px; height:6px; border-radius:50%; background:var(--gold);
  box-shadow:0 0 8px rgba(201,162,39,.7); flex-shrink:0}

/* ---- 6 · EYEBROW ---- */
.k-eyebrow{
  display:flex; align-items:center; gap:10px;
  font-family:"JetBrains Mono",monospace; font-size:11px;
  letter-spacing:.2em; text-transform:uppercase; color:var(--gold);
}
.k-eyebrow::before{content:""; width:20px; height:1px; background:var(--gold)}

/* ---- 7 · CARD ---- */
.k-card{
  background:var(--panel); border:1px solid var(--border);
  border-radius:14px; padding:18px;
}

/* ---- 8 · LUZ DE CURSOR (opt-in: añadir <div class="k-cursor-light"></div>) ---- */
.k-cursor-light{
  position:fixed; width:600px; height:600px; border-radius:50%;
  background:radial-gradient(circle,rgba(201,162,39,.055) 0%,transparent 70%);
  pointer-events:none; z-index:0; transform:translate(-50%,-50%);
  transition:left .9s cubic-bezier(.2,.8,.3,1), top .9s cubic-bezier(.2,.8,.3,1);
  will-change:left,top;
}