:root{--beige-base:#f5f0e6;--beige-strong:#e8dfcf;--olive-dark:#3d4d2f;--olive-mid:#5a6b47;--text:#333}
*{box-sizing:border-box}
body{margin:0;font-family:"Times New Roman MT","Times New Roman",Times,Georgia,serif;color:var(--text);background:var(--beige-base);line-height:1.6}
a{color:inherit;text-decoration:none}
.header{background:var(--beige-strong);border-bottom:1px solid rgba(0,0,0,.06);padding:.75rem 1rem}
.header .brand{font-family:"Montserrat",system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;font-weight:700;color:var(--olive-dark)}
.header nav{margin-top:.25rem}
.header nav a{font-family:"Montserrat";font-weight:600;color:var(--olive-mid);margin-right:.75rem}
.container{max-width:1100px;margin:0 auto;padding:1.25rem}
h1{font-family:"Montserrat";color:var(--olive-dark);margin:1rem 0}
.kicker{font-family:"Montserrat";color:var(--olive-mid);font-weight:700;letter-spacing:.3px;text-transform:uppercase;font-size:.8rem}
.categories{display:flex;gap:.5rem;flex-wrap:wrap;margin:.75rem 0 1.25rem}
.cat{background:#fff;border:1px solid rgba(0,0,0,.06);border-radius:999px;padding:.45rem .75rem;font-family:"Montserrat";font-size:.85rem}
.blog-grid{display:grid;grid-template-columns:1fr;gap:1.25rem}
@media(min-width:900px){.blog-grid{grid-template-columns:repeat(3,1fr)}}
.card{background:#fff;border:1px solid rgba(0,0,0,.06);border-radius:14px;padding:0;box-shadow:0 2px 8px rgba(0,0,0,.05);overflow:hidden;display:flex;flex-direction:column;transition:transform .15s ease, box-shadow .15s ease}
.card:hover{transform:translateY(-2px);box-shadow:0 6px 18px rgba(0,0,0,.08)}
.card .thumb{width:100%;aspect-ratio:4/3;background:var(--beige-strong);overflow:hidden}
.card .thumb img{width:100%;height:100%;object-fit:cover;display:block}
.card .body{padding:1rem}
.card .meta{font-family:"Montserrat";font-size:.75rem;color:#808080;margin-bottom:.35rem}
.card h2{margin:.15rem 0 .35rem;font-size:1.1rem;font-family:"Montserrat";color:var(--olive-dark)}
.card p{margin:0;color:#555;font-size:.95rem;line-height:1.4}
.pagination{display:flex;gap:.5rem;justify-content:center;margin:1.25rem 0}
.pagination a{background:#fff;border:1px solid rgba(0,0,0,.08);padding:.5rem .75rem;border-radius:10px;font-family:"Montserrat"}
footer{text-align:center;padding:1.25rem;background:var(--beige-strong);margin-top:2rem;color:var(--olive-dark)}
/* Header del blog (coherente con la home) */
.site-header{position:sticky;top:0;z-index:50;background:var(--beige-strong);border-bottom:1px solid rgba(0,0,0,.06)}
.head-flex{display:flex;align-items:center;justify-content:space-between;padding:.75rem 1rem}
.logo{height:48px;width:auto;object-fit:contain}
.logo-wrap{display:flex;align-items:center;gap:.6rem;color:var(--olive-dark);font-size:1.05rem}
.primary{display:flex;gap:.8rem;align-items:center}
.primary a{color:var(--olive-dark);text-decoration:none;font-weight:600;font-family:"Montserrat";padding:.2rem 0;border-bottom:2px solid transparent}
.primary a:hover{color:var(--olive-mid)}
.primary a.active{color:var(--olive-mid);border-color:var(--olive-mid)}
/* Uniformar tamaño de portadas en las cards del blog */
.blog-grid .thumb {
  width: 100%;
  height: 220px;       /* puedes ajustar a 220, 240 o 260px según prefieras */
  background: var(--beige-strong);
  overflow: hidden;
  border-radius: 12px 12px 0 0; /* opcional, redondear arriba como en la home */
}

.blog-grid .thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;   /* recorta y centra la imagen */
  display: block;
}
/* Unificar tamaño del logo en todos los headers (posts, blog, programas) */
header .logo,
.site-header .logo {
  height: 60px;
  width: auto;
  object-fit: contain;
}