:root{--bg:#050b07;--panel:rgba(16,34,23,.55);--line:rgba(143,209,158,.12);--line2:rgba(143,209,158,.22);--tx:#e9f2ec;--tx2:#a7b8ad;--tx3:#6d8275;--acc:#8fd19e;--acc2:#c8f5d2;
  --sans:"Geist",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;--mono:"Geist Mono",ui-monospace,Menlo,monospace;--serif:"Instrument Serif",Georgia,serif}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{background:var(--bg);color:var(--tx);font-family:var(--sans);line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden;
  background-image:radial-gradient(800px 500px at 50% -10%,rgba(38,98,58,.35),transparent 70%)}
::selection{background:var(--acc);color:#04120a}
a{color:inherit;text-decoration:none}
.wrap{max-width:1100px;margin:0 auto;padding:0 24px}
.mono{font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--acc)}
.btn{display:inline-flex;align-items:center;gap:8px;border-radius:999px;padding:11px 20px;font-size:14px;font-weight:500;border:1px solid var(--line2);transition:.25s;white-space:nowrap}
.btn-pri{background:var(--acc);color:#04120a;border-color:var(--acc)}.btn-pri:hover{background:var(--acc2)}
.nav{position:sticky;top:0;z-index:20;background:rgba(5,11,7,.75);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.nav .wrap{display:flex;justify-content:space-between;align-items:center;height:68px}
.logo{display:flex;align-items:center;gap:11px;font-weight:600;font-size:16px}.logo img{border-radius:9px}
.nav-der{display:flex;align-items:center;gap:26px;font-size:14px;color:var(--tx2)}.nav-der a:not(.btn):hover{color:var(--tx)}
h1{font-size:clamp(36px,5.4vw,62px);line-height:1.04;letter-spacing:-.04em;font-weight:500;margin:18px 0 20px}
h1 em{font-family:var(--serif);font-weight:400;color:var(--acc2)}
.entradilla{font-size:19px;color:var(--tx2);font-weight:300;max-width:720px}
/* índice */
.indice header{padding:80px 0 50px}
.rejilla{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.tarjeta{display:flex;flex-direction:column;gap:10px;padding:28px;border-radius:18px;background:var(--panel);border:1px solid var(--line);transition:.35s}
.tarjeta:hover{border-color:var(--line2);transform:translateY(-4px)}
.tarjeta h2,.tarjeta h4{font-size:21px;font-weight:500;letter-spacing:-.02em;line-height:1.25}
.tarjeta p{font-size:14.5px;color:var(--tx2);font-weight:300}
.tarjeta .leer{margin-top:auto;padding-top:8px;font-size:13px;color:var(--acc)}
.tarjeta.grande{grid-column:span 3;padding:44px;background:linear-gradient(135deg,rgba(38,98,58,.35),rgba(12,26,17,.6))}
.tarjeta.grande h2{font-size:clamp(26px,3.4vw,40px)}
.vacio{color:var(--tx3);padding:40px 0}
/* artículo */
.articulo{max-width:780px}
.volver{display:inline-block;margin-top:44px;font-size:14px;color:var(--tx3)}.volver:hover{color:var(--acc)}
.articulo header{padding:30px 0 40px;border-bottom:1px solid var(--line);margin-bottom:40px}
.autor{display:flex;align-items:center;gap:12px;margin-top:28px;font-size:14px}.autor img{border-radius:10px}
.autor b{display:block;font-weight:500}.autor span{color:var(--tx3);font-size:13px}
.toc{border:1px solid var(--line);border-radius:14px;padding:22px 26px;margin-bottom:40px;background:var(--panel)}
.toc ol{margin:12px 0 0 18px;display:grid;gap:6px;font-size:15px;color:var(--tx2)}.toc a:hover{color:var(--acc)}
.prosa{font-size:18px;line-height:1.75;color:#d5e2d9;font-weight:300}
.prosa>*+*{margin-top:1.15em}
.prosa h2{font-size:30px;line-height:1.2;letter-spacing:-.03em;font-weight:500;color:var(--tx);margin-top:2em;scroll-margin-top:90px}
.prosa h3{font-size:22px;letter-spacing:-.02em;font-weight:500;color:var(--tx);margin-top:1.6em}
.prosa h4{font-size:18px;font-weight:500;color:var(--tx)}
.prosa strong{color:var(--tx);font-weight:500}
.prosa a{color:var(--acc);text-decoration:underline;text-underline-offset:3px;text-decoration-color:rgba(143,209,158,.4)}
.prosa ul,.prosa ol{padding-left:1.3em;display:grid;gap:.45em}.prosa li::marker{color:var(--acc)}
.prosa blockquote{border-left:2px solid var(--acc);padding:4px 0 4px 22px;font-family:var(--serif);font-style:italic;font-size:24px;line-height:1.4;color:var(--acc2)}
.prosa code{font-family:var(--mono);font-size:.85em;background:rgba(143,209,158,.08);border:1px solid var(--line);padding:2px 6px;border-radius:6px}
.prosa pre{background:#030805;border:1px solid var(--line);border-radius:12px;padding:18px;overflow-x:auto}.prosa pre code{background:none;border:0;padding:0}
.tabla{overflow-x:auto;border:1px solid var(--line);border-radius:12px}
.prosa table{width:100%;border-collapse:collapse;font-size:15px}.prosa th,.prosa td{padding:11px 14px;text-align:left;border-bottom:1px solid var(--line)}
.prosa th{font-weight:500;color:var(--tx);background:rgba(143,209,158,.06)}
.fuentes{margin-top:50px;padding-top:24px;border-top:1px solid var(--line)}.fuentes h2{font-size:14px;font-family:var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--tx3);font-weight:400;margin-bottom:12px}
.fuentes ul{list-style:none;display:grid;gap:6px;font-size:13.5px;color:var(--tx3)}.fuentes a:hover{color:var(--acc)}
.cta{margin:60px 0;padding:40px;border-radius:22px;border:1px solid var(--line2);background:linear-gradient(135deg,rgba(38,98,58,.45),rgba(8,19,12,.8));box-shadow:0 30px 90px -40px rgba(143,209,158,.35)}
.cta h3{font-size:30px;font-weight:500;letter-spacing:-.03em;margin:10px 0}.cta p{color:var(--tx2);font-weight:300;max-width:560px}
.cta ul{list-style:none;display:flex;flex-wrap:wrap;gap:8px 20px;margin:18px 0 26px;font-size:14px;color:var(--tx2)}
.cta li::before{content:"✓ ";color:var(--acc)}
.cta-in{margin:2.4em 0}
.rel{margin:20px 0 80px}.rel h2{font-size:24px;font-weight:500;margin-bottom:20px}.rel .rejilla{grid-template-columns:repeat(3,1fr)}
footer{border-top:1px solid var(--line);padding:34px 0 90px;margin-top:40px}
.pie{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:13px;color:var(--tx3)}.pie a:hover{color:var(--acc)}
.cta-movil{display:none}
@media (max-width:860px){.rejilla,.rel .rejilla{grid-template-columns:1fr}.tarjeta.grande{grid-column:auto;padding:30px}}
@media (max-width:640px){
  .wrap{padding:0 16px}.nav-der a:not(.btn){display:none}.nav .btn{padding:9px 14px;font-size:13px}
  .prosa{font-size:17px}.prosa h2{font-size:25px}.cta{padding:28px 22px}.cta h3{font-size:24px}
  .cta-movil{display:block;position:fixed;left:16px;right:16px;bottom:16px;z-index:30}.cta-movil .btn{width:100%;justify-content:center;padding:15px;box-shadow:0 10px 40px rgba(0,0,0,.6)}
}
