/* ==========================================================================
   mpy-p — footer de la landing (4 columnas), reproduce el footer de metales.html.
   Usa las variables :root definidas en landing.css (cargado globalmente).
   ========================================================================== */

/* Ocultar el footer por defecto de Kadence (solo créditos); usamos el nuestro. */
.site-footer { display: none !important; }

.mpy-footer { background: var(--primary-green-dark, #0f2519); color: #fff; padding: 80px 5% 30px; font-family: 'Montserrat', sans-serif; }
.mpy-footer * { box-sizing: border-box; }
.mpy-footer .footer-grid { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: 50px; max-width: 1200px; margin: 0 auto; padding-bottom: 50px; border-bottom: 1px solid rgba(255,255,255,.1); }
.mpy-footer .footer-brand { max-width: 320px; }
.mpy-footer .footer-logo { display: flex; align-items: center; gap: 12px; margin-bottom: 20px; }
.mpy-footer .footer-logo img { height: 45px; width: auto; }
.mpy-footer .footer-logo span { font-size: 1.15rem; font-weight: 700; line-height: 1.2; }
.mpy-footer .footer-brand p { font-size: .9rem; opacity: .85; line-height: 1.7; margin: 0 0 10px; }
.mpy-footer .footer-column h4 { font-size: 1rem; font-weight: 600; margin: 0 0 20px; color: var(--gold, #c9a227); }
.mpy-footer .footer-column ul { list-style: none; margin: 0; padding: 0; }
.mpy-footer .footer-column li { margin-bottom: 12px; }
.mpy-footer .footer-column a { color: rgba(255,255,255,.8); text-decoration: none; font-size: .9rem; transition: color .3s; }
.mpy-footer .footer-column a:hover { color: var(--gold, #c9a227); }
.mpy-footer .footer-bottom { max-width: 1200px; margin: 30px auto 0; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 20px; }
.mpy-footer .footer-copyright { font-size: .85rem; opacity: .7; margin: 0; }
.mpy-footer .footer-legal { display: flex; gap: 25px; flex-wrap: wrap; }
.mpy-footer .footer-legal a { color: rgba(255,255,255,.7); text-decoration: none; font-size: .85rem; transition: color .3s; }
.mpy-footer .footer-legal a:hover { color: var(--gold, #c9a227); }

/* --- Barra superior: que el único elemento HTML ocupe toda la fila --- */
.site-top-header-wrap .site-header-row { grid-template-columns: 1fr; }
.site-top-header-wrap .site-header-section-left { width: 100%; }
.site-top-header-wrap .site-header-section-left .site-header-item { flex-grow: 1; margin-right: 0; }
.site-top-header-wrap .header-html { width: 100%; }
.site-top-header-wrap .site-header-section-right:empty { display: none; }
.mpy-topbar { display: flex; justify-content: space-between; align-items: center; gap: 6px 20px; width: 100%; flex-wrap: wrap; }

/* === Blog dinámico (Query Loop reutilizando el diseño de .blog-card) === */
.mpy-landing .blog-grid .wp-block-post { margin: 0; list-style: none; }
.mpy-landing .blog-card > * { margin-block-start: 0; }   /* imagen pegada arriba, sin hueco */

/* Imagen destacada rellena el recuadro; si la entrada no tiene, queda el degradado */
.mpy-landing .blog-image .wp-block-post-featured-image { margin: 0; width: 100%; height: 100%; }
.mpy-landing .blog-image .wp-block-post-featured-image a { display: block; width: 100%; height: 100%; }
.mpy-landing .blog-image img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* Título enlazado con el color de la tarjeta */
.mpy-landing .blog-content h3 a { color: inherit; text-decoration: none; }
.mpy-landing .blog-content h3 a:hover { color: var(--gold); }

/* "Leer más" con el estilo dorado de .blog-link */
.mpy-landing .blog-content .wp-block-post-excerpt__more-text { margin: 12px 0 0; }
.mpy-landing .blog-content .wp-block-post-excerpt__more-link {
    color: var(--gold); text-decoration: none; font-weight: 600; font-size: .85rem;
    display: inline-flex; align-items: center; gap: 5px; transition: gap .3s;
}
.mpy-landing .blog-content .wp-block-post-excerpt__more-link:hover { gap: 10px; }

.wpcf7-form-control::placeholder {
   color: var(--text-secondary);
}


@media (max-width: 1024px) { .mpy-footer .footer-grid { grid-template-columns: repeat(2, 1fr); } }
/* Móvil: la fila pasa a una sola columna → centramos en vez de estirar */
@media (max-width: 768px)  {
   .mpy-footer .footer-grid { grid-template-columns: 1fr; } .mpy-footer .footer-bottom { flex-direction: column; align-items: flex-start; }
   .mpy-topbar { justify-content: center; text-align: center; }
}