/* EmpleaYa Submenu HD v1.4.0
 * Replaces only the mega-menu feature photograph.
 * The theme uses a FIVE-COLUMN CSS GRID on desktop; never assign a fixed width
 * to the feature because that extends over the adjacent navigation column.
 */
.eya-site-header--mega .eya-mega-panel > .eya-mega-feature {
    box-sizing: border-box !important;
    min-width: 0 !important;
    max-width: 100% !important;
    overflow: hidden !important;
    position: relative;
    border-radius: 13px;
}

.eya-site-header--mega .eya-mega-panel > .eya-mega-feature > img {
    position: absolute !important;
    inset: 0 !important;
    display: block;
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    object-fit: cover !important;
    object-position: 54% center !important;
    transform: none !important;
    filter: none !important;
    image-rendering: auto;
}

/* Desktop: fit INSIDE original first grid column and stretch to the grid row.
 * This also works with the theme's narrower 1200px desktop grid breakpoint. */
@media (min-width: 1051px) {
    .eya-site-header--mega .eya-mega-panel > .eya-mega-feature {
        grid-column: 1 / 2 !important;
        grid-row: 1 !important;
        width: 100% !important;
        height: auto !important;
        min-height: 157px !important;
        max-height: none !important;
        aspect-ratio: auto !important;
        align-self: stretch !important;
        justify-self: stretch !important;
        /* Remove the v1.3's fixed/flex sizing if an optimizer cached it. */
        flex: initial !important;
    }
    .eya-site-header--mega .eya-mega-panel > .eya-mega-column {
        min-width: 0;
    }
}

/* Tablet: retain the theme's two-column flow; image spans both columns. */
@media (min-width: 641px) and (max-width: 1050px) {
    .eya-site-header--mega .eya-mega-panel > .eya-mega-feature {
        grid-column: span 2 !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        aspect-ratio: 1672 / 941 !important;
    }
}

/* Mobile: one column; original image proportions, no stretching. */
@media (max-width: 640px) {
    .eya-site-header--mega .eya-mega-panel > .eya-mega-feature {
        grid-column: auto !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        aspect-ratio: 1672 / 941 !important;
    }
}
