/* Mobile/tablet masthead — supplements app.css responsive rules */
@media (max-width: 980px) {
    .masthead { flex-wrap: wrap; padding: 12px 0 !important; gap: 8px 10px; }

    .masthead__left {
        flex: 1 1 100%;
        display: flex;
        align-items: center;
        gap: 10px;
    }

    .masthead .brand { min-width: 0 !important; flex-shrink: 1; }
    .masthead .brand--logo { display: flex; align-items: center; width: auto; max-width: 50%; }
    .masthead .brand--logo img {
        display: block; width: auto; max-width: 100%;
        height: auto; max-height: clamp(48px, 12vw, 72px);
        object-fit: contain; object-position: left center;
    }

    .masthead__edition {
        border-left: none !important;
        padding: 0 !important;
        text-align: right;
        flex: 1;
    }
    .masthead__edition span   { font-size: 10px; letter-spacing: .05em; }
    .masthead__edition strong { font-size: 12px; line-height: 1.35; font-weight: 700; }

    .masthead .search-box { flex: 1 1 100%; width: 100%; margin-left: 0; }
}

/* ─── MOBILE: compact header ─── */
@media (max-width: 640px) {
    .top-strip { display: none; }

    .masthead { padding: 8px 10px !important; gap: 0 8px; }

    .masthead__left {
        flex: 1 1 100%;
        display: flex;
        align-items: center;
        gap: 8px;
    }

    .masthead .brand--logo img { max-height: 72px; width: auto; }
    .masthead .brand strong { font-size: 18px; }
    .masthead .brand__mark { width: 30px; height: 30px; font-size: 16px; }
    .masthead .brand small { display: none; }

    .masthead__edition {
        display: flex !important;
        flex-direction: column;
        text-align: right;
        border: none !important;
        padding: 0 !important;
        gap: 1px;
    }
    .masthead__edition span  { font-size: 8px; letter-spacing: .06em; opacity: .7; }
    .masthead__edition strong { font-size: 10px; line-height: 1.3; font-weight: 700; }

    .masthead .search-box { display: none !important; }
}