/* ============================================================
   Plazi · Estilos compartidos del Portal de Documentación
   Alineado al Manual de Marca v1.0 · /equipo/manual-marca.html
   ============================================================ */
*{box-sizing:border-box;margin:0;padding:0}

@import url('https://fonts.googleapis.com/css2?family=Sora:wght@600;700;800&family=Inter:wght@400;500;600;700&family=Instrument+Serif:ital@0;1&family=JetBrains+Mono:wght@400;500;700&display=swap');

:root{
  /* ---- PRIMARY · Naranja Plazi ---- */
  --p50:#FFF7ED; --p100:#FFEDD5; --p200:#FED7AA; --p300:#FDBA74; --p400:#FB923C;
  --p500:#EA580C; --p600:#C2410C; --p700:#9A3412; --p800:#7C2D12; --p900:#431407;
  --p950:#1A0F0A;
  /* ---- SECONDARY · Oro Precolombino ---- */
  --s50:#FEFCE8; --s100:#FEF9C3; --s200:#FEF08A; --s300:#FDE047; --s400:#FACC15;
  --s500:#C39520; --s600:#A07000; --s700:#854D0E; --s800:#713F12; --s900:#422006;
  /* ---- NEUTROS · Warm gray ---- */
  --n0:#FFFFFF; --n50:#FAF8F2; --n100:#F5F2E8; --n200:#E6E0CC; --n300:#D6D3D1;
  --n400:#A8A29E; --n500:#78716C; --n600:#57534E; --n700:#44403C; --n800:#292524;
  --n900:#1C1917; --n950:#0F0907;
  /* ---- SEMÁNTICOS ---- */
  --success:#16A34A; --success-light:#DCFCE7;
  --warning:#D97706; --warning-light:#FED7AA;
  --danger:#DC2626;  --danger-light:#FEE2E2;
  --info:#2563EB;    --info-light:#DBEAFE;
  /* ---- ALIASES (retro-compat con HTMLs ya escritos) ---- */
  --p:var(--p500); --s:var(--p600); --l:var(--p100);
  --g9:var(--n900); --g7:var(--n700); --g5:var(--n500); --g4:var(--n400);
  --g3:var(--n300); --g2:var(--n200); --g1:var(--n50); --g0:var(--n0);
  --gr:var(--success); --gl:var(--success-light);
  --am:var(--warning); --al:var(--warning-light);
  --rd:var(--danger); --rl:var(--danger-light);
  --bl:var(--info); --bll:var(--info-light);
  /* ---- RADIOS ---- */
  --r-xs:4px; --r-sm:6px; --r-md:10px; --r-lg:14px; --r-xl:20px; --r-2xl:28px;
  /* ---- SHADOWS ---- */
  --sh-1:0 1px 2px rgba(15,9,7,.06);
  --sh-2:0 2px 8px rgba(15,9,7,.08);
  --sh-3:0 8px 24px rgba(15,9,7,.12);
  --sh-4:0 16px 48px rgba(15,9,7,.16);
}

body{
  font-family:'Inter',-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,sans-serif;
  color:var(--n900); background:var(--n50);
  line-height:1.65; font-size:14px;
  -webkit-font-smoothing:antialiased;
}

/* ============ DISPLAY TYPE (Sora) ============ */
h1,h2,h3,h4,h5{font-family:'Sora','Inter',system-ui,sans-serif;letter-spacing:-.02em;color:var(--n950);font-weight:700}

/* ============ ACTIONS BAR ============ */
.actions{position:fixed;top:16px;right:16px;z-index:100;display:flex;gap:8px}
.btn{
  padding:10px 18px;background:var(--p500);color:#fff;border:none;
  border-radius:var(--r-md);cursor:pointer;font-size:13px;font-weight:600;
  box-shadow:var(--sh-2);text-decoration:none;display:inline-block;
  font-family:inherit;transition:all .15s;
}
.btn:hover{background:var(--p600);box-shadow:var(--sh-3)}
.btn-o{background:#fff;color:var(--p700);border:1px solid var(--n200)}
.btn-o:hover{border-color:var(--p500);background:var(--p50)}

/* ============ PAGE ============ */
.page{
  width:100%;max-width:920px;margin:24px auto;background:#fff;
  border-radius:var(--r-xl);padding:48px 56px;
  box-shadow:var(--sh-3);page-break-after:always;
}
.page:last-child{page-break-after:avoid}

/* ============ COVER ============ */
.cover{
  background:linear-gradient(135deg,var(--p500),var(--p700));
  color:#fff;min-height:700px;display:flex;flex-direction:column;
  justify-content:center;padding:80px 64px;
}
.cb{font-size:13px;letter-spacing:.12em;text-transform:uppercase;opacity:.75;margin-bottom:48px;font-family:'JetBrains Mono',monospace}
.cover h1{font-size:52px;font-weight:800;line-height:1.1;color:#fff;margin-bottom:16px;letter-spacing:-.03em}
.cover h2{font-size:22px;font-weight:500;color:rgba(255,255,255,.92);margin-bottom:48px}
.cm{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:36px;padding-top:32px;border-top:1px solid rgba(255,255,255,.2)}
.ci{background:rgba(255,255,255,.1);border-radius:var(--r-md);padding:16px;backdrop-filter:blur(10px)}
.cl{font-size:11px;text-transform:uppercase;letter-spacing:.1em;opacity:.7;margin-bottom:4px}
.cv{font-size:18px;font-weight:700}

/* ============ HEADINGS DENTRO DE PAGE ============ */
h1.ch{font-size:13px;text-transform:uppercase;letter-spacing:.15em;color:var(--p500);font-weight:700;margin-bottom:6px;font-family:'JetBrains Mono',monospace}
h2.ct{
  font-size:26px;font-weight:700;line-height:1.2;color:var(--n900);
  margin-bottom:24px;padding-bottom:14px;border-bottom:2px solid var(--p100);
  letter-spacing:-.02em;
}
h3{font-size:17px;font-weight:700;color:var(--n900);margin:24px 0 10px;letter-spacing:-.01em}
h4{font-size:13px;font-weight:700;color:var(--n700);margin:14px 0 6px;text-transform:uppercase;letter-spacing:.04em}

/* ============ TEXTO ============ */
p{margin-bottom:10px;color:var(--n700)}
strong{color:var(--n900)}
ul,ol{margin-left:22px;margin-bottom:10px;color:var(--n700);line-height:1.85}

/* ============ CODE ============ */
code{
  background:var(--n100);padding:1px 6px;border-radius:var(--r-xs);
  font-family:'JetBrains Mono',ui-monospace,monospace;font-size:12px;color:var(--p700);
}
pre{
  background:var(--p950);color:#FDF4E6;padding:14px 18px;
  border-radius:var(--r-md);font-family:'JetBrains Mono',ui-monospace,monospace;
  font-size:12px;overflow-x:auto;margin:10px 0;line-height:1.6;
}
pre code{background:transparent;color:#FDF4E6;padding:0;font-size:12px}

/* ============ TABLES ============ */
table{width:100%;border-collapse:collapse;margin:12px 0 20px;font-size:12.5px}
table th{
  text-align:left;padding:10px 12px;background:var(--p500);color:#fff;
  font-weight:600;font-size:11px;text-transform:uppercase;letter-spacing:.05em;
  font-family:'Sora','Inter',sans-serif;
}
table td{padding:10px 12px;border-bottom:1px solid var(--n200);color:var(--n700);vertical-align:top}
table tr:nth-child(even) td{background:var(--n50)}

/* ============ CALLOUTS ============ */
.callout{padding:14px 18px;background:var(--p50);border-left:4px solid var(--p500);border-radius:var(--r-md);margin:14px 0;font-size:13.5px}
.callout strong{color:var(--p700)}
.warn{padding:14px 18px;background:var(--warning-light);border-left:4px solid var(--warning);border-radius:var(--r-md);margin:14px 0;font-size:13.5px}
.warn strong{color:var(--warning)}
.success{padding:14px 18px;background:var(--success-light);border-left:4px solid var(--success);border-radius:var(--r-md);margin:14px 0;font-size:13.5px}
.success strong{color:var(--success)}

/* ============ STEPS ============ */
.step{background:var(--n50);border-left:4px solid var(--p500);border-radius:var(--r-md);padding:16px 22px;margin:14px 0}
.step-h{display:flex;align-items:center;gap:12px;margin-bottom:10px}
.step-n{
  width:32px;height:32px;background:var(--p500);color:#fff;
  border-radius:50%;display:flex;align-items:center;justify-content:center;
  font-weight:700;font-size:14px;flex-shrink:0;font-family:'JetBrains Mono',monospace;
}
.step-t{font-size:16px;font-weight:700;color:var(--n900);font-family:'Sora','Inter',sans-serif;letter-spacing:-.01em}

/* ============ FOOTER ============ */
.pf{margin-top:36px;padding-top:14px;border-top:1px solid var(--n200);font-size:11px;color:var(--n500);text-align:center;font-family:'JetBrains Mono',monospace;letter-spacing:.05em}

/* ============ KPI GRID ============ */
.kpi-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:14px;margin:18px 0}
.kpi{background:#fff;border:1px solid var(--n200);border-radius:var(--r-md);padding:16px}
.kpi-l{font-size:11px;color:var(--n500);text-transform:uppercase;letter-spacing:.06em;font-weight:600;margin-bottom:4px}
.kpi-v{font-size:24px;font-weight:800;color:var(--n900);line-height:1;font-family:'JetBrains Mono',monospace}
.kpi-s{font-size:11px;color:var(--n500);margin-top:4px}

/* ============ SIGNATURES ============ */
.sig{display:grid;grid-template-columns:1fr 1fr;gap:32px;margin-top:48px;padding-top:24px;border-top:1px solid var(--n200)}
.sig-box{text-align:center}
.sig-line{border-top:1px solid var(--n900);margin-bottom:8px;padding-top:40px}
.sig-l{font-size:11px;color:var(--n500);text-transform:uppercase;letter-spacing:.06em}

/* ============ PRINT ============ */
@media print{
  body{background:#fff}
  .actions{display:none!important}
  .page{margin:0;box-shadow:none;border-radius:0;max-width:100%;padding:18mm 16mm}
  .cover{padding:50mm 18mm;min-height:0}
  .step,.callout,.warn,.success,pre,table th{print-color-adjust:exact;-webkit-print-color-adjust:exact}
}
@page{size:A4;margin:0}
