/* ==========================================================================
   SECCIÓN MODULAR: MAPA GOOGLE MAPS (ALIMAR)
   ========================================================================== */

.alimar-map-section {
    width: 100% !important;
    height: 450px; /* Alto óptimo para escritorio */
    background-color: var(--azul-oscuro);
    position: relative;
    overflow: hidden;
    padding: 0 !important;
    margin: 0 !important;
}

.map-iframe-container {
    width: 100% !important;
    height: 100% !important;
    position: relative;
}

/* Forzar al iframe a ocupar todo el ancho y alto del contenedor */
.map-iframe-container iframe {
    width: 100% !important;
    height: 100% !important;
    border: 0 !important;
    display: block !important;
    /* Filtro sutil opcional para suavizar el contraste con el tema oscuro */
    filter: grayscale(15%) contrast(102%);
    transition: filter 0.3s ease;
}

.map-iframe-container iframe:hover {
    filter: grayscale(0%) contrast(100%);
}

/* ==========================================================================
   ADAPTACIÓN MÓVIL
   ========================================================================== */
@media (max-width: 991px) {
    .alimar-map-section {
        height: 360px; /* Alto más compacto en tablets/móviles para no ocupar toda la pantalla al scroll */
    }
}

@media (max-width: 575px) {
    .alimar-map-section {
        height: 300px; /* Alto ideal en pantallas pequeñas */
    }
}