/* SAEM · estilos del blog (usa las variables de styles.css) */
.blog-top{background:var(--fondo);border-bottom:1px solid var(--linea);position:sticky;top:0;z-index:20}
.blog-top-in{height:68px;display:flex;align-items:center;justify-content:space-between;gap:16px}
.blog-brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--verde);font:500 15px var(--f-txt)}
.blog-brand b{font:800 17px var(--f-tit);letter-spacing:.08em}
.blog-top nav{display:flex;align-items:center;gap:20px;font-size:15px}
.blog-top nav a{color:var(--tinta);text-decoration:none}
.blog-top nav a.btn{color:#fff}
@media (max-width:560px){.blog-top nav a:not(.btn){display:none}}

.post{max-width:780px;margin:0 auto;padding:40px 24px 72px}
.crumbs{font-size:14px;color:var(--gris);margin-bottom:22px}
.crumbs a{color:var(--gris)}
.post h1{font:800 46px/1.06 var(--f-tit);color:var(--verde);margin-bottom:14px}
.post h2{font:800 29px/1.15 var(--f-tit);color:var(--verde);margin:52px 0 12px;scroll-margin-top:84px}
.post h3{font:700 20px/1.25 var(--f-tit);color:var(--tinta);margin:24px 0 6px}
.post p,.post li,.post dd{font-size:17px;line-height:1.75;color:var(--texto)}
.post .lead{font-size:20px;line-height:1.6}
.post .meta{color:var(--gris);font-size:14px;margin-bottom:22px}
.post ul{padding-left:22px}
.post li{margin-bottom:6px}
.tldr{background:var(--beige);border-radius:var(--r-md);padding:18px 22px;margin:26px 0}
.tldr p{margin:0}
.toc{background:var(--blanco);border-radius:var(--r-md);padding:18px 22px;margin:26px 0}
.toc p{margin:0 0 6px}
.toc ol{margin:0;padding-left:22px;columns:2;column-gap:28px}
.toc li{font-size:15px;margin-bottom:4px;break-inside:avoid}
@media (max-width:640px){.toc ol{columns:1}}
.plan{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:18px 0}
.plan>div{background:var(--blanco);border-radius:var(--r-md);padding:4px 20px 12px}
@media (max-width:700px){.plan{grid-template-columns:1fr}}
.post dl dt{font-weight:700;color:var(--tinta);margin-top:18px}
.post dl dd{margin:4px 0 0}
.post-cta{background:var(--verde);border-radius:var(--r-lg);padding:28px;margin:48px 0 0}
.post-cta h2{color:var(--fondo);margin:0 0 8px}
.post-cta p{color:var(--fondo);opacity:.9}
.post-cta .btn{margin-top:12px}
.faq-list h3{margin-top:22px}
.note{font-size:14px!important;color:var(--gris)!important;border-top:1px solid var(--linea);padding-top:16px;margin-top:40px}
@media (max-width:760px){.post h1{font-size:34px}.post h2{font-size:24px}}

.post-cards{display:grid;gap:22px;margin-top:30px}
.post-card{display:grid;grid-template-columns:280px 1fr;gap:22px;background:var(--blanco);border-radius:var(--r-lg);overflow:hidden;text-decoration:none;color:inherit}
.post-card img{width:100%;height:100%;object-fit:cover;min-height:220px;max-height:320px}
.post-card>div{padding:22px 22px 22px 0}
.post-card h2{font:800 24px/1.2 var(--f-tit);color:var(--verde);margin:0 0 8px}
.post-card p{font-size:16px}
.post-card .more{font-weight:700;color:var(--cafe)}
.post-card:hover h2{text-decoration:underline;text-underline-offset:4px}
@media (max-width:700px){.post-card{grid-template-columns:1fr}.post-card>div{padding:0 20px 22px}}
