/**
 * SEAFORMEC — Plantilla institucional
 * V2
 * Neutraliza el blockGap automático de Gutenberg entre
 * las secciones principales de las páginas institucionales.
 */


/* ==========================================================
   MAIN
   ========================================================== */

body.page-template-p-gina-institucional-seaformec main {
    margin-block: 0 !important;
}


/* ==========================================================
   CONTENIDO DE LA PÁGINA
   ========================================================== */

body.page-template-p-gina-institucional-seaformec
.entry-content.wp-block-post-content {
    margin-block: 0 !important;
}


/*
 * Cada sección gestiona su propia separación mediante padding.
 * Eliminamos los 24px automáticos que Gutenberg coloca
 * entre bloques hermanos del Post Content.
 */
body.page-template-p-gina-institucional-seaformec
.entry-content.wp-block-post-content > * {
    margin-block-start: 0 !important;
}


/* Evita espacio residual después de la última sección */
body.page-template-p-gina-institucional-seaformec
.entry-content.wp-block-post-content > :last-child {
    margin-block-end: 0 !important;
}


/* ==========================================================
   MAIN → FOOTER
   ========================================================== */

body.page-template-p-gina-institucional-seaformec
main + footer.wp-block-template-part {
    margin-block-start: 0 !important;
}

/* ==========================================================
   CONTENEDOR ANCHO ESTÁNDAR
   ========================================================== */

/**
 * Clase utilitaria para los contenedores interiores de las
 * páginas institucionales.
 *
 * Uso:
 * - Aplicar a un Grupo/Contenedor interior, no a la sección
 *   exterior cuando esta necesite fondo a ancho completo.
 * - Mantiene el ancho máximo de diseño del proyecto (1320px).
 * - Proporciona márgenes laterales consistentes en escritorio,
 *   tablet y móvil.
 *
 * Ejemplo de estructura:
 *
 * Sección exterior (100% / fondo completo)
 * └── Grupo interior .sf-wide-container
 *     └── Contenido de la sección
 *
 * Esta clase NO modifica componentes existentes mientras no
 * se añada explícitamente a sus bloques.
 */
.sf-wide-container {
    width: min(1320px, calc(100% - 64px)) !important;
    max-width: 1320px !important;
    margin-inline: auto !important;
    box-sizing: border-box;
}


/* Tablet */
@media (max-width: 1100px) {

    .sf-wide-container {
        width: calc(100% - 48px) !important;
        max-width: none !important;
    }
}


/* Móvil */
@media (max-width: 600px) {

    .sf-wide-container {
        width: calc(100% - 32px) !important;
    }
}