/* Blog: formulario y paginación nativos, sin JavaScript adicional. */
.blog-portada { position:relative; min-height:355px; display:grid; align-items:center; padding:42px 0; color:white; }
.blog-portada .section-shell { position:relative; }
.blog-portada-texto { max-width:470px; }
.blog-portada h1 { margin:0; font-size:calc(clamp(1.7rem,2.7vw,2rem) * var(--escala-h1, 1)); line-height:1.15; }
.blog-portada h1 { font-family: var(--fuente-texto); }
.blog-portada h1 span { display:block; }
.blog-portada-texto > p:last-child { max-width:380px; font-size:1rem; line-height:1.4; margin:15px 0 0; }
.blog-pretitulo { display:flex; gap:12px; align-items:center; margin:0 0 5px; }
.blog-pretitulo::before { content:''; width:40px; height:2px; background:var(--color-amarillo-naranja); }
.blog-encabezado { text-align:center; }
.blog-encabezado p { margin:15px 0 25px; }
.busqueda-blog { position:relative; display:flex; max-width:680px; margin:0 auto 55px; }
.etiqueta-busqueda { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.busqueda-blog input { flex:1; min-width:0; background:var(--color-crema); border:1px solid transparent; padding:13px 20px; color:var(--color-azul); text-align:center; border-radius:3px 0 0 3px; }
.busqueda-blog input::placeholder { color:var(--color-azul); opacity:1; }
.busqueda-blog button { flex-shrink:0; width:72px; padding:10px; border-radius:0 3px 3px 0; }
.busqueda-blog svg { width:30px; height:30px; fill:none; stroke:currentColor; stroke-width:1.4; }
.resultado-busqueda { margin:-25px 0 30px; }
.resultado-busqueda a,.volver-blog { text-decoration:underline; text-underline-offset:3px; }
.lista-articulos { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:25px; }
.tarjeta-articulo { display:flex; flex-direction:column; background:var(--color-crema); border:1px solid var(--color-gris-claro); }
.imagen-articulo { width:100%; height:195px; object-fit:cover; }
.cuerpo-tarjeta { display:flex; flex:1; flex-direction:column; align-items:start; padding:12px 28px 24px; }
.categoria-articulo { display:inline-block; max-width:100%; border:1px solid var(--color-rojo-ocre); color:var(--color-rojo-ocre); border-radius:8px; text-transform:uppercase; padding:3px 15px; margin:0 0 24px; font-size:.85rem; overflow-wrap:anywhere; }
.cuerpo-tarjeta time { font-size:.85rem; }
.cuerpo-tarjeta h3 { font-size:calc(1.1rem * var(--escala-h3, 1)); line-height:1.25; margin:5px 0 8px; }
.resumen-articulo { font-size:.9rem; line-height:1.45; margin:0 0 24px; }
.tiempo-lectura { display:flex; align-items:center; gap:6px; font-size:.85rem; margin:auto 0 18px; padding-top:8px; }
.tiempo-lectura svg { width:19px; height:19px; fill:none; stroke:currentColor; stroke-width:1.3; }
.paginacion-blog { display:flex; justify-content:center; gap:1px; margin-top:25px; }
.paginacion-blog a { display:grid; place-items:center; width:44px; height:44px; }
.paginacion-blog a span { width:12px; height:12px; background:var(--color-gris-claro); border-radius:50%; }
.paginacion-blog a[aria-current] span { background:var(--color-azul); }
.blog-vacio { padding:35px 20px; text-align:center; border:1px solid var(--color-gris-claro); }
.detalle-articulo > article { max-width:950px; }
.detalle-articulo header { margin:35px 0; }
.detalle-articulo .categoria-articulo { margin-bottom:16px; }
.detalle-articulo h1 { font-family:var(--fuente-texto); font-weight:900; font-size:calc(clamp(1.65rem,3.3vw,2.7rem) * var(--escala-h1, 1)); line-height:1.2; margin:0 0 20px; }
.metadatos-articulo { display:flex; flex-wrap:wrap; gap:20px; font-size:.9rem; }
.entradilla-articulo { font-size:1.15rem; line-height:1.5; margin-bottom:0; }
.imagen-detalle-articulo { width:100%; max-height:510px; object-fit:contain; margin:0 auto 35px; }
.texto-articulo { max-width:100%; margin-inline:auto; font-size:1.05rem; line-height:1.7; text-align: justify; }
.texto-articulo p { margin:0 0 24px; }
@media(max-width:65rem) { .lista-articulos { gap:18px; } .cuerpo-tarjeta { padding-inline:20px; } }
@media(max-width:55rem) { .lista-articulos { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:40rem) { .lista-articulos { grid-template-columns:1fr; gap:28px; } .imagen-articulo { height:220px; } .blog-portada { min-height:355px; } .blog-portada-texto { max-width:340px; text-shadow:0 1px 4px #000; } .blog-portada .fondo-zona { object-position:center; } .busqueda-blog { margin-bottom:35px; } .busqueda-blog input { padding-inline:12px; text-align:start; } .busqueda-blog button { width:56px; } .cuerpo-tarjeta { padding:16px 24px 24px; } .detalle-articulo header { margin-top:30px; } }