/* BalkansNetwork canonical mobile shell — alpha.54
 * Replaces the staging-era onlineizmir-header-mobile-fix plugin.
 */
@media (max-width: 782px) {
    body .bnee-hero {
        position: relative !important;
        display: block !important;
        width: 100% !important;
        height: clamp(360px, 92vw, 420px) !important;
        min-height: 360px !important;
        max-height: 420px !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: hidden !important;
        background-image: var(--bnee-hero-image) !important;
        background-size: cover !important;
        background-position: center bottom !important;
        background-repeat: no-repeat !important;
    }

    body .bnee-hero-overlay {
        position: absolute !important;
        inset: 0 !important;
        z-index: 1 !important;
        background:
            linear-gradient(110deg, rgba(255,255,255,.97) 0%, rgba(255,255,255,.91) 38%, rgba(255,255,255,.64) 62%, rgba(255,255,255,.18) 100%),
            linear-gradient(180deg, rgba(255,255,255,.10) 54%, rgba(3,35,58,.04) 100%) !important;
    }

    body .bnee-logo-floating {
        position: absolute !important;
        top: 18px !important;
        left: 18px !important;
        right: auto !important;
        bottom: auto !important;
        z-index: 5 !important;
        display: flex !important;
        align-items: center !important;
        width: min(64vw, 280px) !important;
        max-width: 280px !important;
        height: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        text-decoration: none !important;
        transform: none !important;
        opacity: 1 !important;
        visibility: visible !important;
    }

    body .bnee-logo-floating .bnee-brand-logo,
    body .bnee-logo-floating img {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        max-height: 58px !important;
        margin: 0 !important;
        padding: 0 !important;
        object-fit: contain !important;
        object-position: left center !important;
        transform: none !important;
        opacity: 1 !important;
        visibility: visible !important;
        filter: none !important;
    }

    body .bnee-hero-inner {
        position: absolute !important;
        inset: 0 !important;
        z-index: 3 !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        justify-content: flex-start !important;
        width: 100% !important;
        max-width: none !important;
        height: 100% !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 116px 18px 18px !important;
        gap: 0 !important;
    }

    body .bnee-logo-slot {
        display: none !important;
        width: 0 !important;
        height: 0 !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    body .bnee-hero-copy {
        display: block !important;
        width: min(100%, 410px) !important;
        max-width: 410px !important;
        margin: 0 !important;
        padding: 0 0 0 14px !important;
        border-left: 4px solid #f7941d !important;
        text-align: left !important;
    }

    body .bnee-hero-copy::before {
        display: none !important;
        content: none !important;
    }

    body .bnee-hero-kicker {
        display: block !important;
        margin: 0 0 9px !important;
        padding: 0 !important;
        font-size: clamp(27px, 7.2vw, 34px) !important;
        line-height: 1.04 !important;
        letter-spacing: -.034em !important;
        font-weight: 800 !important;
        color: #052b48 !important;
        text-wrap: balance !important;
        text-shadow: 0 1px 0 rgba(255,255,255,.55) !important;
    }

    body .bnee-hero-subtitle {
        display: block !important;
        max-width: 33ch !important;
        margin: 0 !important;
        padding: 0 !important;
        font-size: clamp(14px, 3.8vw, 17px) !important;
        line-height: 1.42 !important;
        font-weight: 400 !important;
        color: #345b76 !important;
    }

    body form.bnee-search {
        position: relative !important;
        display: flex !important;
        align-items: center !important;
        width: 100% !important;
        max-width: none !important;
        height: 54px !important;
        min-height: 54px !important;
        margin: auto 0 0 !important;
        padding: 0 14px !important;
        gap: 10px !important;
        background: rgba(255,255,255,.96) !important;
        border: 1px solid rgba(13,54,82,.10) !important;
        border-right: 3px solid #f7941d !important;
        border-radius: 16px !important;
        box-shadow: 0 8px 24px rgba(5,40,65,.15) !important;
        -webkit-backdrop-filter: blur(5px) !important;
        backdrop-filter: blur(5px) !important;
    }

    body form.bnee-search svg {
        position: static !important;
        inset: auto !important;
        display: block !important;
        flex: 0 0 22px !important;
        width: 22px !important;
        height: 22px !important;
        margin: 0 !important;
        padding: 0 !important;
        fill: none !important;
        stroke: #43677e !important;
        stroke-width: 2 !important;
    }

    body form.bnee-search input,
    body form.bnee-search input[type="search"],
    body form.bnee-search > input#bnee-search-field[type="search"],
    body form.bnee-search > input#bnee-post-search[type="search"] {
        box-sizing: border-box !important;
        direction: ltr !important;
        text-align: left !important;
        text-indent: 0 !important;
        display: block !important;
        flex: 1 1 auto !important;
        width: auto !important;
        min-width: 0 !important;
        height: 52px !important;
        min-height: 52px !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        outline: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
        font-size: clamp(14px, 3.8vw, 17px) !important;
        line-height: 52px !important;
        color: #173b55 !important;
    }

    body form.bnee-search input::placeholder {
        color: #71889a !important;
        text-indent: 0 !important;
        opacity: 1 !important;
    }

    body form.bnee-search button {
        display: none !important;
    }

    body .bnee-topbar {
        box-sizing: border-box !important;
        width: 100% !important;
        max-width: 100% !important;
        overflow: hidden !important;
    }

    body .bnee-topbar .bnee-container.bnee-topbar-inner {
        box-sizing: border-box !important;
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        margin: 0 auto !important;
        padding-left: 12px !important;
        padding-right: 12px !important;
        gap: 8px !important;
        overflow: visible !important;
    }

    body .bnee-topbar-inner > nav[aria-label="Utility navigation"] {
        box-sizing: border-box !important;
        display: flex !important;
        align-items: center !important;
        flex: 1 1 auto !important;
        min-width: 0 !important;
        max-width: calc(100% - 112px) !important;
        gap: 12px !important;
        overflow: hidden !important;
        white-space: nowrap !important;
    }

    body .bnee-topbar-inner > nav[aria-label="Utility navigation"] a {
        flex: 0 0 auto !important;
        white-space: nowrap !important;
    }

    body .bnee-topbar-meta {
        box-sizing: border-box !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
        flex: 0 0 auto !important;
        min-width: max-content !important;
        max-width: none !important;
        margin-left: auto !important;
        padding: 0 !important;
        gap: 0 !important;
        position: static !important;
        transform: none !important;
        overflow: visible !important;
        white-space: nowrap !important;
    }

    body .bnee-topbar-meta > span {
        display: none !important;
    }

    body .bnee-language-switcher {
        box-sizing: border-box !important;
        display: inline-flex !important;
        flex-flow: row nowrap !important;
        align-items: center !important;
        justify-content: flex-end !important;
        flex: 0 0 auto !important;
        width: auto !important;
        min-width: max-content !important;
        max-width: none !important;
        margin: 0 !important;
        padding: 0 !important;
        gap: 5px !important;
        position: static !important;
        transform: none !important;
        overflow: visible !important;
        white-space: nowrap !important;
        visibility: visible !important;
        opacity: 1 !important;
    }

    body .bnee-language-link {
        box-sizing: border-box !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        flex: 0 0 auto !important;
        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;
        margin: 0 !important;
        padding: 0 !important;
        gap: 3px !important;
        position: static !important;
        transform: none !important;
        overflow: visible !important;
        white-space: nowrap !important;
        visibility: visible !important;
        opacity: 1 !important;
    }

    body .bnee-language-link[lang="en"],
    body .bnee-language-link[lang="sr"] {
        display: inline-flex !important;
        visibility: visible !important;
        opacity: 1 !important;
    }

    body img.bnee-language-flag {
        box-sizing: border-box !important;
        display: block !important;
        flex: 0 0 20px !important;
        width: 20px !important;
        height: 14px !important;
        min-width: 20px !important;
        max-width: 20px !important;
        min-height: 14px !important;
        max-height: 14px !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        object-fit: cover !important;
        visibility: visible !important;
        opacity: 1 !important;
    }

    body .bnee-language-code,
    body .bnee-language-divider {
        visibility: visible !important;
        opacity: 1 !important;
        white-space: nowrap !important;
    }
}

@media (max-width: 390px) {
    body .bnee-hero {
        height: 365px !important;
        min-height: 365px !important;
    }

    body .bnee-logo-floating {
        top: 15px !important;
        left: 15px !important;
        width: min(66vw, 245px) !important;
    }

    body .bnee-logo-floating .bnee-brand-logo,
    body .bnee-logo-floating img {
        max-height: 50px !important;
    }

    body .bnee-hero-inner {
        padding: 101px 15px 15px !important;
    }

    body .bnee-hero-copy {
        padding-left: 11px !important;
        border-left-width: 3px !important;
    }

    body .bnee-hero-kicker {
        font-size: 25px !important;
        margin-bottom: 7px !important;
    }

    body .bnee-hero-subtitle {
        font-size: 14px !important;
        line-height: 1.36 !important;
    }

    body form.bnee-search {
        height: 50px !important;
        min-height: 50px !important;
        border-radius: 14px !important;
    }

    body form.bnee-search input,
    body form.bnee-search input[type="search"] {
        height: 48px !important;
        min-height: 48px !important;
        line-height: 48px !important;
        font-size: 14px !important;
    }

    body .bnee-topbar .bnee-container.bnee-topbar-inner {
        padding-left: 10px !important;
        padding-right: 10px !important;
        gap: 6px !important;
    }

    body .bnee-topbar-inner > nav[aria-label="Utility navigation"] {
        max-width: calc(100% - 104px) !important;
        gap: 10px !important;
    }

    body .bnee-language-switcher {
        gap: 4px !important;
    }

    body .bnee-language-link {
        gap: 2px !important;
    }

    body img.bnee-language-flag {
        flex-basis: 18px !important;
        width: 18px !important;
        height: 13px !important;
        min-width: 18px !important;
        max-width: 18px !important;
        min-height: 13px !important;
        max-height: 13px !important;
    }
}