/* One shared masthead geometry for home, inner pages and member profiles.
   All rules are confined to the existing header and its utility line. */
html body .inner-tagline {
    display: block !important;
    box-sizing: border-box !important;
    width: 100% !important;
    height: 32px !important;
    min-height: 32px !important;
    margin: 0 !important;
    padding: 0 max(24px, calc((100% - 1180px) / 2)) !important;
    border: 0 !important;
    background: #fbfaf6 !important;
    color: #6e7d7d !important;
    font-family: 'Noto Sans Arabic', sans-serif !important;
    font-size: 11px !important;
    line-height: 32px !important;
    text-align: right !important;
    position: sticky;
    top: 0;
    z-index: 201;
}
html body header.mast {
    box-sizing: border-box !important;
    margin: 0 !important;
    padding: 0 !important;
    background: #fbfaf6 !important;
    color: #092b36 !important;
    border: 0 !important;
    border-bottom: 1px solid #d9e0dd !important;
    box-shadow: none !important;
    position: sticky !important;
    top: 32px !important;
    z-index: 200 !important;
}
html body header.mast .mast-inner {
    box-sizing: border-box !important;
    display: flex !important;
    direction: rtl !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: min(1180px, calc(100% - 48px)) !important;
    max-width: 1180px !important;
    height: 96px !important;
    min-height: 96px !important;
    margin: 0 auto !important;
    padding: 0 !important;
    gap: 32px !important;
}
html body header.mast .brand {
    display: flex !important;
    direction: rtl !important;
    align-items: center !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    margin: 0 0 0 auto !important;
    padding: 0 !important;
    gap: 1px !important;
    flex: 0 0 auto !important;
}
html body header.mast .header-logos {
    display: block !important;
    position: relative !important;
    width: 170px !important;
    height: 92px !important;
    flex: 0 0 170px !important;
    margin: 0 !important;
    padding: 0 !important;
}
html body header.mast .header-logos img {
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    left: auto !important;
    width: 92px !important;
    height: 92px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
    object-fit: contain !important;
    opacity: 0;
    animation: asjfPashtoHeaderLogo 10s infinite;
}
html body header.mast .header-logos img:first-child { animation-delay: 0s; }
html body header.mast .header-logos img:last-child { animation-delay: 5s; }
@keyframes asjfPashtoHeaderLogo {
    0%, 42% { opacity: 1; }
    50%, 92% { opacity: 0; }
    100% { opacity: 1; }
}
html body header.mast .brand-name {
    width: 245px !important;
    min-width: 0 !important;
    flex: 0 1 245px !important;
    direction: rtl !important;
    text-align: right !important;
}
html body header.mast .brand strong {
    display: block !important;
    margin: 0 !important;
    font-family: 'Noto Sans Arabic', sans-serif !important;
    font-size: 18px !important;
    font-weight: 750 !important;
    line-height: 1.35 !important;
    color: #092b36 !important;
}
html body header.mast .nav-shell {
    position: static !important;
    min-width: 0 !important;
    width: auto !important;
    max-width: none !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    flex: 0 1 auto !important;
}
html body header.mast .nav-inner {
    display: flex !important;
    direction: rtl !important;
    align-items: center !important;
    justify-content: flex-start !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 9px !important;
}
html body header.mast .desktop-nav {
    display: flex !important;
    direction: rtl !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    margin: 0 0 0 23px !important;
    padding: 0 !important;
    gap: 24px !important;
    font-family: 'Noto Sans Arabic', sans-serif !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    line-height: 1.4 !important;
}
html body header.mast .desktop-nav > a,
html body header.mast .desktop-nav > details > summary {
    display: flex !important;
    align-items: center !important;
    min-height: 40px !important;
    padding: 0 !important;
    white-space: nowrap !important;
}
html body header.mast .nav-cta {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 94px !important;
    width: 94px !important;
    height: 40px !important;
    min-height: 40px !important;
    margin: 0 !important;
    padding: 0 !important;
    border-radius: 1px !important;
    background: #e86c43 !important;
    color: #fff !important;
    font-family: 'Noto Sans Arabic', sans-serif !important;
    font-size: 12px !important;
    line-height: 1 !important;
    font-weight: 750 !important;
}
html body header.mast .media-language-selector { margin: 0 !important; flex: 0 0 auto !important; }
html body header.mast .media-language-selector > summary {
    box-sizing: border-box !important;
    justify-content: center !important;
    width: 54px !important;
    height: 38px !important;
    min-height: 38px !important;
    padding: 0 5px !important;
    gap: 4px !important;
    background: #072641 !important;
    border-radius: 3px !important;
    font-size: 11px !important;
}
html body header.mast .media-language-options { left: 0 !important; right: auto !important; }
html body header.mast .mobile-nav { display: none !important; }
html body.admin-bar .inner-tagline { top: 32px; }
html body.admin-bar header.mast { top: 64px !important; }

@media (min-width: 1001px) and (max-width: 1200px) {
    html body header.mast .mast-inner { gap: 16px !important; }
    html body header.mast .header-logos { width: 110px !important; flex-basis: 110px !important; height: 62px !important; }
    html body header.mast .header-logos img { width: 62px !important; height: 62px !important; }
    html body header.mast .brand-name { width: 190px !important; flex-basis: 190px !important; }
    html body header.mast .brand strong { font-size: 16px !important; }
    html body header.mast .desktop-nav { gap: 13px !important; margin-left: 16px !important; font-size: 13px !important; }
}

@media (max-width: 1000px) {
    html body .inner-tagline { position: relative !important; top: auto !important; height: 26px !important; min-height: 26px !important; line-height: 26px !important; padding: 0 16px !important; font-size: 10px !important; }
    html body header.mast { position: relative !important; top: auto !important; }
    html body header.mast .mast-inner { position: relative !important; display: block !important; width: 100% !important; height: auto !important; min-height: 0 !important; padding: 12px 16px 10px !important; }
    html body header.mast .brand { min-height: 66px !important; margin: 0 !important; padding-left: 174px !important; gap: 9px !important; }
    html body header.mast .header-logos { width: 62px !important; height: 62px !important; flex-basis: 62px !important; }
    html body header.mast .header-logos img { width: 62px !important; height: 62px !important; }
    html body header.mast .brand-name { width: auto !important; flex: 1 1 auto !important; }
    html body header.mast .brand strong { font-size: 16px !important; line-height: 1.3 !important; }
    html body header.mast .nav-inner { display: block !important; }
    html body header.mast .desktop-nav { width: calc(100% + 32px) !important; margin: 8px -16px 0 !important; padding: 0 16px 4px !important; gap: 4px !important; overflow-x: auto !important; scrollbar-width: thin; overscroll-behavior-inline: contain; }
    html body header.mast .desktop-nav > a,
    html body header.mast .desktop-nav > details > summary { min-height: 44px !important; padding: 8px 10px !important; font-size: 13px !important; }
    html body header.mast .nav-cta { position: absolute !important; top: 15px !important; left: 16px !important; width: 86px !important; height: 44px !important; min-height: 44px !important; }
    html body header.mast .media-language-selector { position: absolute !important; top: 15px !important; left: 109px !important; }
    html body header.mast .media-language-selector > summary { width: 48px !important; height: 44px !important; min-height: 44px !important; }
    /* Keep submenus outside the horizontally scrolling row so they cannot be clipped. */
    html body header.mast .nav-sub { position: static !important; }
    html body header.mast .sub-links { position: absolute !important; top: 100% !important; right: 16px !important; left: 16px !important; min-width: 0 !important; width: auto !important; z-index: 205; }
}
@media (max-width: 600px) {
    html body header.mast .brand { padding-left: 150px !important; }
    html body header.mast .header-logos { width: 48px !important; height: 48px !important; flex-basis: 48px !important; }
    html body header.mast .header-logos img { width: 48px !important; height: 48px !important; }
    html body header.mast .brand strong { font-size: 13px !important; }
    html body header.mast .nav-cta { width: 76px !important; }
    html body header.mast .media-language-selector { left: 99px !important; }
}
@media (prefers-reduced-motion: reduce) {
    html body header.mast .header-logos img { animation: none !important; }
    html body header.mast .header-logos img:first-child { opacity: 1 !important; }
    html body header.mast .header-logos img:last-child { opacity: 0 !important; }
}

/* 1.1: two single-line federation names and matching bilingual hero headings. */
html body header.mast .header-logos { width: 100px !important; flex-basis: 100px !important; }
html body header.mast .brand-name { width: 340px !important; flex: 0 1 340px !important; }
html body header.mast .brand-name strong { white-space: nowrap !important; }
html body header.mast .brand-name .asjf-dari-name { margin-top: 5px !important; }
html body header.mast .desktop-nav,
html body header.mast .desktop-nav a,
html body header.mast .desktop-nav summary { font-weight: 750 !important; font-size: 14px !important; }
html body .source-hero .source-hero-copy,
html body .source-hero .source-hero-panel,
html body .source-hero .source-panel-copy,
html body .source-hero .source-hero-kicker { direction: rtl !important; text-align: right !important; }
html body .source-hero .source-hero-copy h1,
html body .source-hero .source-panel-copy strong {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    font-family: 'Noto Sans Arabic', sans-serif !important;
    font-size: 32px !important;
    font-weight: 800 !important;
    line-height: 1.5 !important;
    color: #fff !important;
    white-space: nowrap !important;
    direction: rtl !important;
    text-align: right !important;
}
html body .source-hero .source-hero-copy h1 span,
html body .source-hero .source-panel-copy em {
    display: block !important;
    font-size: inherit !important;
    font-weight: inherit !important;
    line-height: inherit !important;
    font-style: normal !important;
    white-space: nowrap !important;
}
@media (min-width: 1001px) and (max-width: 1200px) {
    html body header.mast .header-logos { width: 70px !important; flex-basis: 70px !important; }
    html body header.mast .brand-name { width: 250px !important; flex-basis: 250px !important; }
    html body header.mast .desktop-nav { gap: 10px !important; margin-left: 10px !important; }
}

@media (max-width: 1000px) {
    html body header.mast .brand { padding-left: 0 !important; padding-bottom: 52px !important; }
    html body header.mast .header-logos { width: 62px !important; flex-basis: 62px !important; }
    html body header.mast .brand-name { width: auto !important; flex: 1 1 auto !important; }
    html body header.mast .nav-cta, html body header.mast .media-language-selector { top: 86px !important; }
}
@media (max-width: 600px) {
    html body header.mast .header-logos { width: 48px !important; flex-basis: 48px !important; }
    html body header.mast .nav-cta, html body header.mast .media-language-selector { top: 73px !important; }
}

/* 1.1.1: English-reference header text colors and quieter Dari subtitle. */
html body .inner-tagline { color: #65716c !important; }
html body header.mast .brand strong { color: #14242b !important; }
html body header.mast .brand-name .asjf-dari-name {
    font-size: 13.12px !important;
    font-weight: 400 !important;
    color: #65716c !important;
    line-height: 1.25 !important;
}
html body header.mast .desktop-nav > a,
html body header.mast .desktop-nav > details > summary { color: #42504b !important; }
html body header.mast .desktop-nav > a:hover,
html body header.mast .desktop-nav > a:focus-visible,
html body header.mast .desktop-nav > details > summary:hover,
html body header.mast .desktop-nav > details > summary:focus-visible { color: #e56e43 !important; }

/* 1.2: lower both hero text groups, keeping the original photo and effects. */
html body .source-hero .source-hero-grid {
    box-sizing: border-box !important;
    align-items: end !important;
    padding-top: 160px !important;
    padding-bottom: 28px !important;
}
html body .source-hero .source-hero-copy,
html body .source-hero .source-hero-panel {
    align-self: end !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}
@media (max-width: 760px) {
    html body .source-hero .source-hero-grid { padding-top: 160px !important; gap: 24px !important; }
}
