:root{--mar:#0B3C5D;--mar2:#145374;--area:#F6F1E9;--tinta:#1D2731;--suave:#5B6670;--acento:#D9663F;--linea:#E3DCD0}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:Georgia,'Times New Roman',serif;background:var(--area);color:var(--tinta);line-height:1.7;font-size:18px}
a{color:var(--mar2)}
.wrap{max-width:760px;margin:0 auto;padding:0 20px}
.ancho{max-width:1080px}
header{background:var(--mar);color:#fff}
header .wrap{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:16px 20px;flex-wrap:wrap}
.logo{color:#fff;text-decoration:none;font-weight:700;font-size:1.25rem;letter-spacing:.01em}
.logo span{color:#F2C14E}
nav a{color:#DCE8F0;text-decoration:none;font-family:system-ui,sans-serif;font-size:.85rem;margin-left:16px}
nav a:hover{color:#fff}
.hero{background:linear-gradient(160deg,var(--mar),var(--mar2));color:#fff;padding:60px 0 70px}
.hero h1{font-size:clamp(2rem,5vw,3.2rem);line-height:1.1;margin-bottom:14px}
.hero p{font-family:system-ui,sans-serif;color:#DCE8F0;max-width:52ch}
main{padding:40px 0 60px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:22px}
.card{background:#fff;border:1px solid var(--linea);border-radius:10px;padding:22px;text-decoration:none;color:inherit;display:block;transition:transform .15s,box-shadow .15s}
.card:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(11,60,93,.1)}
.cat{font-family:system-ui,sans-serif;font-size:.72rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--acento)}
.card h2{font-size:1.25rem;line-height:1.25;margin:8px 0}
.card p{font-family:system-ui,sans-serif;font-size:.92rem;color:var(--suave)}
article h1{font-size:clamp(1.9rem,4.5vw,2.7rem);line-height:1.15;margin:8px 0 12px}
.meta{font-family:system-ui,sans-serif;font-size:.85rem;color:var(--suave);margin-bottom:26px}
article h2{font-size:1.45rem;margin:34px 0 10px;color:var(--mar)}
article p,article ul{margin-bottom:16px}
article ul{padding-left:22px}
article li{margin-bottom:6px}
.nota{background:#fff;border-left:4px solid var(--acento);padding:14px 18px;font-family:system-ui,sans-serif;font-size:.92rem;color:var(--suave)}
.anuncio{margin:28px 0}
.relacionados{margin-top:44px;padding-top:24px;border-top:1px solid var(--linea)}
.relacionados h3{font-size:1.1rem;margin-bottom:12px}
.relacionados a{display:block;margin-bottom:8px;font-family:system-ui,sans-serif}
footer{background:var(--tinta);color:#B8C2CA;font-family:system-ui,sans-serif;font-size:.85rem;padding:30px 0}
footer a{color:#DCE8F0;margin-right:14px}
.legal h2{font-size:1.2rem;margin:24px 0 8px}