/*
 * Bandeau commun des pages internes AJCM.
 * L'accueil conserve volontairement son image et sa mise en page actuelles.
 */
html body.ajcm-internal-hero .header-wrapper > .header {
    background-color: #075777 !important;
    background-image: url("ajcm-entete-pages-combat-judo-1920x720.webp") !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    background-size: cover !important;
}

/* Les articles conservent exactement le visuel commun precedemment valide. */
html body.ajcm-internal-hero.ajcm-articles-hero .header-wrapper > .header {
    background-image: url("ajcm-entete-judo-club-1920x720.webp") !important;
    background-position: center 42% !important;
}

html body.ajcm-internal-hero .header-wrapper > .header.color-overlay::before {
    background: linear-gradient(
        105deg,
        rgba(18, 62, 80, 0.56) 0%,
        rgba(34, 112, 143, 0.44) 52%,
        rgba(17, 61, 79, 0.56) 100%
    ) !important;
    opacity: 1 !important;
    pointer-events: none !important;
}

html body.ajcm-internal-hero .header-wrapper > .header.color-overlay::after {
    background: linear-gradient(
        180deg,
        rgba(248, 252, 253, 0.10) 0%,
        rgba(216, 238, 247, 0.16) 100%
    ) !important;
    filter: none !important;
    opacity: 1 !important;
    pointer-events: none !important;
}

html body.ajcm-internal-hero .header-wrapper > .header .inner-header-description {
    box-sizing: border-box !important;
    width: min(92%, 1240px) !important;
    max-width: 1240px !important;
    margin-right: auto !important;
    margin-left: auto !important;
    padding-top: clamp(54px, 5vw, 90px) !important;
    padding-bottom: clamp(82px, 7vw, 120px) !important;
}

/* Logo en surimpression : il reste independant de la photo et donc net. */
html body.ajcm-internal-hero .header-wrapper > .header .inner-header-description::before {
    content: "" !important;
    box-sizing: border-box !important;
    display: block !important;
    width: 216px !important;
    height: 88px !important;
    margin: 0 auto 18px !important;
    background-color: rgba(255, 255, 255, 0.94) !important;
    background-image: url("ajcm-logo-360.webp") !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    background-size: 174px auto !important;
    border: 1px solid rgba(255, 255, 255, 0.82) !important;
    border-radius: 16px !important;
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.28) !important;
}

html body.ajcm-internal-hero .header-wrapper > .header .inner-header-description h1.hero-title {
    box-sizing: border-box !important;
    display: table !important;
    width: auto !important;
    max-width: min(100%, 1120px) !important;
    margin: 0 auto 14px !important;
    padding: 13px 24px 15px !important;
    color: #ffffff !important;
    font-size: clamp(2.25rem, 4.2vw, 3.7rem) !important;
    font-weight: 800 !important;
    line-height: 1.08 !important;
    letter-spacing: -0.035em !important;
    text-align: center !important;
    text-wrap: balance !important;
    background: rgba(3, 25, 36, 0.38) !important;
    border: 1px solid rgba(255, 255, 255, 0.22) !important;
    border-radius: 16px !important;
    text-shadow: 0 2px 12px rgba(0, 0, 0, 0.72) !important;
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.14) !important;
}

html body.ajcm-internal-hero .header-wrapper > .header .inner-header-description .header-subtitle {
    max-width: 820px !important;
    margin: 0 auto !important;
    color: #ffffff !important;
    font-size: clamp(1rem, 1.7vw, 1.25rem) !important;
    font-weight: 700 !important;
    line-height: 1.45 !important;
    letter-spacing: 0.015em !important;
    text-align: center !important;
    text-shadow: 0 2px 9px rgba(0, 0, 0, 0.88) !important;
}

@media (max-width: 767px) {
    html body.ajcm-internal-hero .header-wrapper > .header {
        background-position: 68% center !important;
    }

    html body.ajcm-internal-hero.ajcm-articles-hero .header-wrapper > .header {
        background-position: center center !important;
    }

    html body.ajcm-internal-hero .header-wrapper > .header .inner-header-description {
        width: min(100% - 24px, 620px) !important;
        padding-top: 42px !important;
        padding-bottom: 82px !important;
    }

    html body.ajcm-internal-hero .header-wrapper > .header .inner-header-description::before {
        width: 170px !important;
        height: 70px !important;
        margin-bottom: 13px !important;
        background-size: 140px auto !important;
        border-radius: 13px !important;
    }

    html body.ajcm-internal-hero .header-wrapper > .header .inner-header-description h1.hero-title {
        max-width: 100% !important;
        margin-bottom: 10px !important;
        padding: 10px 13px 12px !important;
        font-size: clamp(1.65rem, 7.2vw, 2.25rem) !important;
        line-height: 1.1 !important;
        letter-spacing: -0.025em !important;
        border-radius: 13px !important;
    }

    html body.ajcm-internal-hero .header-wrapper > .header .inner-header-description .header-subtitle {
        max-width: 94% !important;
        font-size: 0.98rem !important;
        line-height: 1.4 !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    html body.ajcm-internal-hero .header-wrapper > .header,
    html body.ajcm-internal-hero .header-wrapper > .header .inner-header-description::before {
        animation: none !important;
        transition: none !important;
    }
}
