/* Manual: un documento largo que se consulta, no se recorre. Prioridad
   absoluta a la legibilidad y a encontrar cosas rápido. */
*{box-sizing:border-box;margin:0;padding:0}
:root{
  --ink:#07120F; --deep:#0F7A64; --mint:#2FBF9F; --mint-claro:#E8F6F2;
  --texto:#25322D; --tenue:#5C6C66; --linea:rgba(7,18,15,.11);
  --fondo:#FFFFFF; --suave:#F5F8F7; --ambar:#8A6100; --ambar-f:#FFF6E4;
}
body{background:var(--fondo);color:var(--texto);
  font:16.5px/1.72 "Inter",-apple-system,"Segoe UI",system-ui,sans-serif;
  -webkit-font-smoothing:antialiased}
.capa{display:grid;grid-template-columns:280px minmax(0,1fr);gap:56px;
  max-width:1180px;margin:0 auto;padding:0 24px}

/* ── índice lateral ── */
aside{position:sticky;top:0;align-self:start;height:100vh;overflow-y:auto;
  padding:30px 0 60px;font-size:14.5px}
.marca{display:flex;align-items:center;gap:10px;font-weight:800;font-size:18px;
  color:var(--ink);text-decoration:none;letter-spacing:-.02em;margin-bottom:6px}
.marca svg{width:28px;height:28px}
aside .sub{color:var(--tenue);font-size:13px;margin-bottom:20px}
aside a{display:block;color:var(--tenue);text-decoration:none;padding:5px 10px;
  border-radius:7px;line-height:1.4}
aside a:hover{background:var(--suave);color:var(--ink)}
aside a.on{background:var(--mint-claro);color:var(--deep);font-weight:600}
aside .grupo{margin-top:16px;font-size:11px;text-transform:uppercase;
  letter-spacing:.1em;color:#9AAAA4;padding:0 10px 5px;font-weight:700}

/* ── contenido ── */
main{padding:34px 0 110px;min-width:0}
h1{font-size:clamp(2rem,4.6vw,2.7rem);line-height:1.1;letter-spacing:-.033em;
  color:var(--ink);margin-bottom:12px}
.entradilla{font-size:18px;color:var(--tenue);margin-bottom:14px;max-width:62ch}
section{scroll-margin-top:24px;padding-top:44px}
h2{font-size:1.55rem;letter-spacing:-.028em;color:var(--ink);
  margin-bottom:16px;padding-bottom:9px;border-bottom:2px solid var(--mint)}
h3{font-size:1.09rem;letter-spacing:-.017em;color:var(--ink);margin:26px 0 9px}
p{margin-bottom:13px;max-width:70ch}
ul,ol{margin:0 0 15px 23px;max-width:70ch}
li{margin-bottom:7px}
b{color:var(--ink)}
code{background:var(--suave);border:1px solid var(--linea);border-radius:5px;
  padding:1px 6px;font:13.5px/1 ui-monospace,SFMono-Regular,Menlo,monospace}
kbd{background:#fff;border:1px solid #C7D3CF;border-bottom-width:2px;
  border-radius:6px;padding:2px 8px;font:12.5px/1.5 ui-monospace,Menlo,monospace;
  color:var(--ink);white-space:nowrap}
table{border-collapse:collapse;width:100%;margin:6px 0 20px;font-size:15px;
  display:block;overflow-x:auto}
th,td{text-align:left;padding:9px 14px 9px 0;border-bottom:1px solid var(--linea);
  vertical-align:top}
th{font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:var(--tenue);
  white-space:nowrap}
.nota,.ojo{padding:15px 19px;border-radius:0 10px 10px 0;margin:0 0 20px;
  font-size:15.3px;max-width:70ch}
.nota{border-left:3px solid var(--mint);background:var(--mint-claro)}
.ojo{border-left:3px solid #E0A93B;background:var(--ambar-f)}
.ojo b{color:var(--ambar)}
.pasos{counter-reset:p;list-style:none;margin-left:0}
.pasos li{counter-increment:p;position:relative;padding-left:38px;margin-bottom:12px}
.pasos li::before{content:counter(p);position:absolute;left:0;top:1px;
  width:25px;height:25px;border-radius:50%;background:var(--deep);color:#fff;
  font-size:13px;font-weight:700;display:grid;place-items:center}
footer{border-top:1px solid var(--linea);margin-top:56px;padding-top:24px;
  color:var(--tenue);font-size:14px;display:flex;gap:18px;flex-wrap:wrap}
footer a{color:var(--tenue)}
@media (max-width:920px){
  .capa{grid-template-columns:1fr;gap:0;padding:0 18px}
  aside{position:static;height:auto;border-bottom:1px solid var(--linea);
    padding-bottom:18px;margin-bottom:8px}
  aside nav{display:flex;flex-wrap:wrap;gap:3px}
  aside .grupo{width:100%;margin-top:12px}
  main{padding-top:22px}
}
@media print{
  aside{display:none} .capa{display:block;max-width:none}
  section{page-break-inside:avoid} body{font-size:11pt}
}
