
:root{
  --fondo-0:#0D1810; --fondo-1:#1A2A20; --vidrio:#16241C;
  --linea:rgba(233,243,238,.10);
  --texto:#EAF3EE; --texto-2:#A9BFB2; --texto-3:#7C948A;
  --oro:#F2E3A0; --salvia:#8CB08D; --lavanda:#B9A8E6; --coral:#E57373;
}
*{box-sizing:border-box}
body{
  margin:0;background:var(--fondo-0);color:var(--texto);
  font-family:Lato,system-ui,-apple-system,sans-serif;font-size:17px;line-height:1.7;
  -webkit-font-smoothing:antialiased;
}
.wrap{width:min(860px,90vw);margin-inline:auto}
h1,h2,h3{font-family:Quicksand,system-ui,sans-serif;font-weight:600;line-height:1.18;margin:0 0 .6em;letter-spacing:-.01em}
h1{font-size:clamp(1.9rem,5vw,3rem);max-width:22ch}
h2{font-size:clamp(1.35rem,3vw,1.9rem);margin-top:2.2em;max-width:26ch}
h3{font-size:1.15rem;margin-top:1.8em}
p{margin:0 0 1.05em}
a{color:var(--oro)}
.migas{font-size:.85rem;color:var(--texto-3);padding:22px 0 0}
.migas a{color:var(--texto-2)}
.lead{font-size:1.1rem;color:var(--texto-2);max-width:62ch}
.cradle{
  background:radial-gradient(900px 500px at 50% -10%,rgba(44,83,61,.5),transparent 60%),
             radial-gradient(600px 400px at 100% 10%,rgba(140,176,141,.12),transparent 60%),
             var(--fondo-0);
}
.nota{
  border:1px solid var(--linea);border-left:3px solid var(--salvia);
  background:var(--vidrio);border-radius:10px;padding:16px 18px;margin:1.6em 0;
  color:var(--texto-2);font-size:.95rem;
}
.peligro{
  border:1px solid rgba(229,115,115,.35);border-left:3px solid var(--coral);
  background:rgba(229,115,115,.08);border-radius:10px;padding:16px 18px;margin:1.6em 0;
}
.peligro strong{color:var(--coral)}
.tarjeta{
  display:block;text-decoration:none;color:inherit;
  background:var(--vidrio);border:1px solid var(--linea);border-radius:14px;
  padding:20px 22px;transition:border-color .18s,transform .18s;
}
.tarjeta:hover{border-color:rgba(233,200,107,.4);transform:translateY(-2px)}
.tarjeta h3{margin:0 0 .35em;font-size:1.08rem}
.tarjeta p{margin:0;color:var(--texto-2);font-size:.95rem}
.meta{font-size:.8rem;color:var(--texto-3);text-transform:uppercase;letter-spacing:.09em;margin:0 0 .5em}
.rejilla{display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));margin:1.6em 0}
.pill{
  display:inline-block;font-size:.75rem;padding:2px 10px;border-radius:999px;
  border:1px solid var(--linea);color:var(--texto-2);margin-left:6px;vertical-align:middle;
}
.pill.ok{color:var(--salvia);border-color:rgba(140,176,141,.4)}
.cta{
  display:inline-block;margin:1.4em 0;padding:14px 26px;border-radius:999px;
  background:linear-gradient(135deg,var(--oro),var(--oro-vivo,#E9C86B));
  color:#0c1810;font-family:Quicksand,sans-serif;font-weight:700;text-decoration:none;
}
footer{border-top:1px solid var(--linea);margin-top:3.5em;padding:26px 0 60px;color:var(--texto-3);font-size:.88rem}
footer a{color:var(--texto-2)}
ul.chk{list-style:none;padding:0;margin:1em 0}
ul.chk li{padding-left:30px;position:relative;margin-bottom:.7em}
ul.chk li::before{content:"\2713";position:absolute;left:0;color:var(--salvia);font-weight:700}
ol.pasos{padding-left:22px}
ol.pasos li{margin-bottom:.8em}
.cita{
  border-left:2px solid var(--lavanda);padding:4px 0 4px 18px;margin:1.6em 0;
  color:var(--texto-2);font-style:italic;
}
.cita footer{border:0;margin:6px 0 0;padding:0;font-size:.85rem;font-style:normal}
.paso{display:flex;gap:14px;margin:1.5em 0}
.paso .emo{font-size:1.7rem;line-height:1.2;flex:0 0 auto}
.paso h3{margin:0 0 .2em}
.paso p{margin:0}
@media (max-width:560px){body{font-size:16px}}
