:root{--ink:#1E2B24;--ink-soft:#4A574F;--paper:#F3F4EF;--sheet:#fff;--green:#2F5D46;--green-mist:#E3ECE5;--marker:#F6DC4F;--pen:#B83A26;--line:#D6D9CF;--serif:"Literata",Georgia,serif;--sans:"Figtree",system-ui,sans-serif}
*{box-sizing:border-box;margin:0;padding:0}
body{background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:1.0625rem;line-height:1.7;-webkit-font-smoothing:antialiased}
a{color:var(--green)}
:focus-visible{outline:3px solid var(--green);outline-offset:3px}
.wrap{max-width:1160px;margin:0 auto;padding:0 24px}
.narrow{max-width:720px}
mark{background:linear-gradient(transparent 14%,var(--marker) 14%,var(--marker) 88%,transparent 88%);color:inherit;padding:0 .12em}
header.top{border-bottom:1px solid var(--line);padding:18px 0;background:var(--paper);position:sticky;top:0;z-index:5}
header.top .wrap{display:flex;justify-content:space-between;align-items:center;gap:16px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink);font-family:var(--serif);font-weight:700;font-size:1.35rem}
header nav{display:flex;align-items:center;gap:20px;font-size:.95rem}
header nav a{color:var(--ink);text-decoration:none}
.btn{display:inline-block;background:var(--green);color:#fff !important;text-decoration:none;font-weight:600;padding:10px 18px;border-radius:6px}
.btn:hover{background:#1F4232}
main{padding:56px 0 72px}
.cat{font-size:.82rem;letter-spacing:.12em;text-transform:uppercase;color:var(--green);font-weight:600}
h1{font-family:var(--serif);font-weight:700;font-size:clamp(2rem,4.6vw,3rem);line-height:1.12;letter-spacing:-.02em;margin:14px 0 16px}
.lead{font-size:1.2rem;color:var(--ink-soft);line-height:1.55}
.byline{display:flex;align-items:center;gap:12px;margin-top:24px;font-size:.92rem}
.byline img{border-radius:50%;object-fit:cover}
.byline span{display:block;color:var(--ink-soft)}
.hero{max-width:1000px;margin:36px auto 8px;padding:0 24px}
.hero img{width:100%;height:auto;display:block;border-radius:4px;border:1px solid var(--line)}
.body{margin-top:32px}
.body p{margin-bottom:18px}
.body h2{font-family:var(--serif);font-weight:700;font-size:1.65rem;line-height:1.25;margin:48px 0 16px;letter-spacing:-.01em}
.body h3{font-family:var(--serif);font-weight:600;font-size:1.25rem;margin:32px 0 10px;display:flex;align-items:baseline;gap:12px}
.body h3 .n{flex:none;display:inline-grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--marker);font-family:var(--sans);font-size:.9rem;font-weight:700;transform:translateY(-2px)}
.note{border-left:3px solid var(--pen);padding:2px 0 2px 16px;color:var(--ink-soft);font-style:italic}
.callout{background:var(--green-mist);border-radius:4px;padding:20px 24px;margin:32px 0}
.callout p{margin:0}
.checklist{list-style:none;counter-reset:c;margin:8px 0 22px}
.checklist li{counter-increment:c;position:relative;padding:14px 0 14px 46px;border-top:1px solid var(--line)}
.checklist li:last-child{border-bottom:1px solid var(--line)}
.checklist li::before{content:counter(c);position:absolute;left:0;top:13px;width:30px;height:30px;border-radius:4px;background:var(--green);color:var(--marker);display:grid;place-items:center;font-weight:700;font-size:.9rem}
.cta{margin-top:44px;background:var(--sheet);border:1px solid var(--line);border-top:4px solid var(--marker);border-radius:4px;padding:28px 30px}
.cta-t{font-family:var(--serif);font-weight:700;font-size:1.3rem;margin-bottom:8px !important}
.cta .btn{margin-top:6px}
.intro{background:var(--sheet);border:1px solid var(--line);border-left:4px solid var(--green);border-radius:4px;padding:24px 28px 8px;margin:0 0 36px}
.intro-t{font-family:var(--serif);font-weight:700;font-size:1.2rem;margin-bottom:10px !important}
.intro p{margin-bottom:14px}
/* Listado */
.next{margin-top:56px;border-top:1px solid var(--line);padding-top:28px}
.next-t{font-family:var(--serif);font-weight:700;font-size:1.15rem;margin-bottom:10px}
.next ul{list-style:none}
.next li{padding:10px 0 10px 28px;position:relative;color:var(--ink-soft);border-bottom:1px dashed var(--line)}
.next li::before{content:"";position:absolute;left:4px;top:19px;width:10px;height:10px;border-radius:50%;border:2px solid var(--green)}
.list-h{margin-bottom:28px}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:24px;margin-top:32px}
.card{background:var(--sheet);border:1px solid var(--line);border-radius:4px;overflow:hidden;text-decoration:none;color:var(--ink);display:flex;flex-direction:column}
.card img{width:100%;height:auto;display:block;border-bottom:1px solid var(--line)}
.card div{padding:18px 20px 22px}
.card h2{font-family:var(--serif);font-size:1.2rem;line-height:1.3;margin:6px 0 8px}
.card p{font-size:.95rem;color:var(--ink-soft)}
.card:hover h2{color:var(--green)}
footer{border-top:1px solid var(--line);padding:28px 0 44px;font-size:.88rem;color:var(--ink-soft)}
footer .wrap{display:flex;justify-content:space-between;flex-wrap:wrap;gap:16px}
@media (max-width:620px){.intro{padding:20px 20px 6px}.wrap{padding:0 16px}.hero{padding:0 16px}header nav a:not(.btn){display:none}.cta{padding:22px 20px}.body h2{font-size:1.4rem}}
@media (hover:hover) and (pointer:fine){
  html,body{cursor:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%226%22%20fill%3D%22%232F5D46%22%20stroke%3D%22%23F6DC4F%22%20stroke-width%3D%222.5%22/%3E%3C/svg%3E") 12 12,auto}
  a,button{cursor:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%3E%3Ccircle%20cx%3D%2216%22%20cy%3D%2216%22%20r%3D%2212%22%20fill%3D%22%23F6DC4F%22%20fill-opacity%3D%22.85%22%20stroke%3D%22%232F5D46%22%20stroke-width%3D%222.5%22/%3E%3Ccircle%20cx%3D%2216%22%20cy%3D%2216%22%20r%3D%222.5%22%20fill%3D%22%232F5D46%22/%3E%3C/svg%3E") 16 16,pointer}
}