@media (max-width: 767px) {
    #oihr-header .oihr-hero {
        position: relative !important;
        min-height: 255px !important;
        overflow: hidden !important;
        background-color: #dff1f7 !important;

        /*
         * La foto riempie tutta l'altezza dell'hero.
         * L'ancoraggio a sinistra mantiene visibile la barca.
         */
        background-image:
            linear-gradient(
                180deg,
                rgba(235,247,251,.90) 0%,
                rgba(235,247,251,.68) 38%,
                rgba(235,247,251,.18) 68%,
                rgba(5,35,61,.06) 100%
            ),
            var(--oihr-hero-image) !important;
        background-size: 100% 100%, auto 100% !important;
        background-position: center center, left bottom !important;
        background-repeat: no-repeat !important;
    }

    #oihr-header .oihr-hero-inner {
        position: relative !important;
        z-index: 2 !important;
        min-height: 255px !important;
        display: grid !important;
        grid-template-columns: minmax(104px, 34%) 1px minmax(0, 1fr) !important;
        column-gap: 11px !important;
        align-items: start !important;
        padding: 20px 14px 14px !important;
    }

    #oihr-header .oihr-logo {
        grid-column: 1 !important;
        align-self: start !important;
        width: 100% !important;
        max-width: 146px !important;
        margin: 0 !important;
    }

    #oihr-header .oihr-logo img {
        display: block !important;
        width: 100% !important;
        height: auto !important;
        max-height: none !important;
        object-fit: contain !important;
    }

    #oihr-header .oihr-brand-divider {
        grid-column: 2 !important;
        display: block !important;
        width: 1px !important;
        height: 94px !important;
        margin: 0 !important;
        align-self: start !important;
        background: #f27645 !important;
    }

    #oihr-header .oihr-brand-copy {
        grid-column: 3 !important;
        align-self: start !important;
        margin: 0 !important;
        padding: 0 !important;
        max-width: none !important;
        color: #082d4f !important;
        text-shadow: 0 1px 1px rgba(255,255,255,.92) !important;
    }

    #oihr-header .oihr-tagline {
        font-size: clamp(20px, 5.7vw, 28px) !important;
        line-height: 1.04 !important;
        letter-spacing: -0.035em !important;
        font-weight: 800 !important;
        margin: 0 0 8px !important;
    }

    #oihr-header .oihr-subtitle {
        font-size: clamp(12.5px, 3.35vw, 15.5px) !important;
        line-height: 1.22 !important;
        font-weight: 500 !important;
        color: #40596c !important;
        margin: 0 !important;
    }

    #oihr-header .oihr-hero .oihr-search {
        display: none !important;
    }

    #oihr-header .oihr-navigation {
        position: relative !important;
        z-index: 3 !important;
        margin-top: 0 !important;
    }
}

@media (max-width: 480px) {
    #oihr-header .oihr-hero,
    #oihr-header .oihr-hero-inner {
        min-height: 235px !important;
    }

    #oihr-header .oihr-hero-inner {
        grid-template-columns: minmax(96px, 35%) 1px minmax(0, 1fr) !important;
        column-gap: 9px !important;
        padding: 17px 12px 12px !important;
    }

    #oihr-header .oihr-logo {
        max-width: 134px !important;
    }

    #oihr-header .oihr-brand-divider {
        height: 88px !important;
    }

    #oihr-header .oihr-tagline {
        font-size: clamp(19px, 5.6vw, 25px) !important;
        margin-bottom: 7px !important;
    }

    #oihr-header .oihr-subtitle {
        font-size: clamp(12px, 3.2vw, 14.5px) !important;
    }
}