/**
 * Expertise – Styles communs (head)
 */
:root {
    --msf-red: #FFC107;
    --msf-yellow: #FFC107;
    --msf-blue-dark: #1D1C3E;
    --msf-dark: #1D1C3E;
    --pam-blue: #0071BC;
    --msf-dark-nav: #2d2d4e;
    --msf-font: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --msf-nav-font: "Montserrat", -apple-system, BlinkMacSystemFont, sans-serif;
}

* { font-family: var(--msf-font); }

body, html {
    font-family: var(--msf-font);
    margin: 0;
    padding: 0;
    padding-top: 108px;
    overflow-x: hidden;
}
    text-transform: uppercase;
    text-transform: uppercase;

[class^="bi-"], [class*=" bi-"] {
    font-family: "bootstrap-icons" !important;
}
.navbar-main .nav-link [class^="bi-"],
.navbar-main .nav-link [class*=" bi-"] { text-transform: none; }

/* Header */
.site-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    max-width: 100vw;
    margin: 0;
    padding: 0;
    z-index: 1030;
    background: #fff;
    box-shadow: 0 1px 3px rgba(0,0,0,0.08);
}

.site-header .navbar { width: 100%; margin: 0; padding: 0; }

/* Navbar */
.navbar-main { background: #fff !important; min-height: 108px; align-items: center; }
.navbar-main .container { max-width: 1200px; margin: 0 auto; padding-left: 1.5rem; padding-right: 1.5rem; display: flex; align-items: center; flex-wrap: wrap; }
.navbar-main .navbar-brand {
    color: var(--msf-blue-dark);
    font-weight: 700;
    letter-spacing: 0.02em;
    display: flex;
    align-items: center;
    padding: 0.5rem 0;
    margin-right: 2rem;
    text-decoration: none;
    min-height: 88px;
}
.navbar-main .navbar-brand img { height: 88px; width: auto; object-fit: contain; }
.navbar-main .navbar-collapse { flex: 1; justify-content: space-between; }
.navbar-main .nav-center { display: flex; justify-content: center; gap: 0.5rem; flex: 1; }
.navbar-main .nav-right { display: flex; align-items: center; gap: 0.5rem; }
.navbar-main .nav-right .btn-read-more {
    background: var(--msf-yellow) !important;
    color: var(--msf-blue-dark) !important;
    border: none;
    font-weight: 700;
    padding: 0.8rem 1.5rem;
    border-radius: 6px;
    text-transform: uppercase;
    font-size: 0.95rem;
    transition: background 0.2s, transform 0.1s;
}
@media (max-width: 991.98px) {
    .navbar-main .nav-right .btn-read-more {
        padding: 1rem;
        font-size: 1.1rem;
        margin-top: 1rem;
    }
}
.navbar-main .nav-right .btn-read-more:hover {
    background: #ffb300 !important;
}
.navbar-main .nav-right .nav-link { font-size: 0.85rem; text-transform: uppercase; letter-spacing: 0.03em; }
.navbar-main .nav-right .btn-read-more.nav-link-icon-only { padding: 0.5rem; min-width: 2.5rem; font-size: 1.25rem; line-height: 1; }
.navbar-main .nav-right .nav-link.dropdown-toggle::after { display: none; }

@media (max-width: 991.98px) {
    .navbar-main { min-height: auto; padding: 0.5rem 0; }
    .navbar-main .container { flex-wrap: wrap; }
    .navbar-main .navbar-brand { min-height: auto; margin-right: 0; }
    .navbar-main .navbar-brand img { height: 56px; }
    .navbar-main .navbar-toggler { margin-left: auto; border: none; padding: 0.5rem; }
    .navbar-main .navbar-toggler:focus { box-shadow: none; }
    
    /* Hide logo when menu is open */
    .mobile-menu-open .navbar-brand {
        display: none !important;
    }
    .mobile-menu-open {
        overflow: hidden; /* Prevent scrolling background */
    }
    
    /* Full-screen Overlay for Mobile Menu (WFP Style) */
    .navbar-main .navbar-collapse.collapse.show,
    .navbar-main .navbar-collapse.collapsing {
        display: block !important;
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        width: 100vw;
        height: 100vh;
        background: #fff !important;
        z-index: 2000;
        overflow-y: auto;
        padding: 0;
        margin: 0;
        transition: transform 0.3s ease-in-out;
    }
    
    .navbar-main .navbar-collapse.collapse:not(.show) { 
        display: none !important; 
    }

    .mobile-menu-header {
        display: flex;
        justify-content: flex-end;
        padding: 1.5rem;
    }

    .btn-close-mobile {
        background: none;
        border: none;
        width: 40px;
        height: 40px;
        position: relative;
        cursor: pointer;
        padding: 0;
        opacity: 0.7;
    }
    .btn-close-mobile:hover { opacity: 1; }
    .btn-close-mobile::before, .btn-close-mobile::after {
        content: '';
        position: absolute;
        top: 50%;
        left: 50%;
        width: 24px;
        height: 2px;
        background: #333;
    }
    .btn-close-mobile::before { transform: translate(-50%, -50%) rotate(45deg); }
    .btn-close-mobile::after { transform: translate(-50%, -50%) rotate(-45deg); }

    .navbar-main .nav-center {
        flex-direction: column;
        width: 100%;
        padding: 0 1.5rem;
        margin: 0 !important;
    }
    .navbar-main .nav-center .nav-item {
        width: 100%;
        border-bottom: 1px solid #eee;
    }
    .navbar-main .nav-center .nav-link {
        width: 100%;
        padding: 1.25rem 0;
        display: flex;
        align-items: center;
        justify-content: space-between;
        color: var(--pam-blue) !important;
        font-size: 1.15rem;
        font-weight: 600;
    }
    .navbar-main .nav-center .nav-link .nav-link-icon {
        color: var(--pam-blue);
        font-size: 1rem;
        opacity: 0.8;
    }

    .navbar-main .nav-right {
        flex-direction: column;
        width: 100%;
        padding: 0 1.5rem 3rem;
        margin: 0 !important;
        border: none;
    }
    .navbar-main .nav-right .nav-link {
        width: 100%;
        padding: 1.25rem 0;
        border-bottom: 1px solid #eee;
        display: flex;
        align-items: center;
        justify-content: space-between;
        color: var(--pam-blue) !important;
        font-size: 1.15rem;
        font-weight: 600;
        text-transform: none;
    }
    .navbar-main .nav-right .nav-link i:not(.nav-link-icon) {
        font-size: 1.25rem;
    }
    
}

.navbar-main .nav-link {
    display: inline-flex;
    align-items: center;
    flex-wrap: nowrap;
    gap: 0.25em;
    white-space: nowrap;
    line-height: 1.2;
    color: #1a1a1a !important;
    font-family: var(--msf-nav-font);
    font-size: 0.9rem;
    font-weight: 700;
    padding: 0.5rem 0.75rem;
    text-decoration: none;
}
.navbar-main .nav-link:hover { color: #1a1a1a !important; opacity: 0.8; }
.navbar-main .nav-link-text { display: inline; }
.navbar-main .nav-link-icon,
.navbar-main .nav-link .bi-chevron-down {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    font-size: 0.65em;
    line-height: 1;
    opacity: 0.9;
    flex-shrink: 0;
    margin-left: 0.2em;
    text-transform: none;
    vertical-align: middle;
}
.navbar-main .nav-link.active { font-weight: 600; }
.navbar-main .navbar-toggler { border: none; padding: 0.25rem; }
.navbar-main .navbar-toggler-icon { filter: none; }
.btn-donate { background: #E03C31; color: #fff !important; border: none; border-radius: 6px; padding: 0.5rem 1.25rem; text-transform: uppercase; font-size: 0.85rem; font-weight: 700; text-decoration: none; }
.btn-donate:hover { background: #c23128; color: #fff !important; }

/* Mega-menu */
.mega-menu {
    position: fixed;
    top: 108px;
    left: 0;
    right: 0;
    background: rgba(29, 28, 62, 0.98);
    z-index: 1020;
    overflow-y: auto;
    padding-top: 0;
    max-height: calc(100vh - 108px);
    opacity: 0;
    transform: translateY(-10px);
    transition: opacity 0.3s ease, transform 0.3s ease;
    visibility: hidden;
    pointer-events: none;
}
.mega-menu.show {
    visibility: visible;
    pointer-events: auto;
    opacity: 1;
    transform: translateY(0);
}
.mega-menu .mega-red-line { height: 3px; background: var(--msf-red); width: 100%; }
.mega-menu .mega-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding: 2rem 0 1.5rem;
    border-bottom: 1px solid rgba(255,255,255,0.15);
    max-width: 1200px;
    margin: 0 auto;
    padding-left: 2rem;
    padding-right: 2rem;
}
.mega-menu .mega-title { font-size: 2.5rem; font-weight: 700; color: #fff; margin: 0; text-transform: uppercase; letter-spacing: 0.02em; }
.mega-menu .btn-close-mega {
    background: none;
    border: none;
    color: #fff;
    font-size: 2rem;
    padding: 0.25rem;
    line-height: 1;
    cursor: pointer;
    opacity: 0.9;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.mega-menu .btn-close-mega:hover { opacity: 1; color: #fff; }
.mega-menu .container { max-width: 1200px; margin: 0 auto; padding-left: 2rem; padding-right: 2rem; }
.mega-menu .mega-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 2rem; padding: 2rem 0 3rem; }
.mega-menu .mega-col h3 { font-size: 0.8rem; font-weight: 700; color: var(--msf-red); text-transform: uppercase; letter-spacing: 0.08em; margin-bottom: 0.75rem; }
.mega-menu .mega-col p { color: rgba(255,255,255,0.9); font-size: 0.95rem; line-height: 1.5; margin-bottom: 0.75rem; }
.mega-menu .mega-col .mega-link { color: var(--msf-red); text-transform: uppercase; font-size: 0.85rem; font-weight: 600; text-decoration: none; border-bottom: 1px solid var(--msf-red); }
.mega-menu .mega-col .mega-link:hover { color: #fff; border-bottom-color: #fff; }

/* Hero */
.hero { position: relative; min-height: 70vh; overflow: hidden; margin-top: -108px; }
.hero::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 0;
    background: linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.35)), url('https://images.unsplash.com/photo-1579684385127-1ef15d508118?w=1600') center/cover no-repeat;
    transform: scaleY(-1);
}
.hero.hero-has-cover::before,
.hero.hero-fallback::before {
    background: linear-gradient(to top, rgba(0,0,0,0.65) 0%, rgba(0,0,0,0.25) 40%, transparent 70%);
    transform: none;
}
.hero-fallback .hero-carousel-overlay {
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(to top, rgba(29, 28, 62, 0.92) 0%, rgba(29, 28, 62, 0.5) 50%, transparent 100%);
    pointer-events: none;
}
.hero-fallback .container { position: relative; z-index: 2; }
.hero-bg {
    position: absolute;
    inset: 0;
    z-index: 0;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    transition: opacity 0.6s ease;
}
.hero-bg.hero-bg-img {
    animation: hero-bg-zoom 20s ease-out infinite alternate;
}
@keyframes hero-bg-zoom {
    0% { transform: scale(1); }
    100% { transform: scale(1.08); }
}
.hero-bg-default {
    background: linear-gradient(135deg, var(--msf-blue-dark) 0%, #2d2d4e 100%);
}
.hero-slide-overlay {
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(to top, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.3) 45%, transparent 75%);
    pointer-events: none;
}
.hero::before { z-index: 1; }
/* Avec cover : le gradient reste en arrière-plan, le texte du carousel au premier plan */
.hero.hero-has-cover::before { z-index: 0; }
.hero-carousel.hero-has-cover .carousel { z-index: 2; }
/* L'overlay ne doit pas bloquer les clics sur le carousel (bouton Lire la suite) */
.hero-carousel.hero-has-cover::before { pointer-events: none; }

/* Hero carousel (3 dernières annonces) */
.hero-carousel { position: relative; }
.hero-carousel.hero-has-cover { min-height: 70vh; }
.hero-carousel .carousel { position: absolute; inset: 0; z-index: 0; min-height: 70vh; }
.hero-carousel .carousel-inner { height: 100%; min-height: 70vh; }
.hero-carousel .carousel-item { position: relative; min-height: 70vh; height: 100%; }
.hero-carousel .carousel-item .hero-bg { position: absolute; inset: 0; z-index: 0; }
.hero-carousel .carousel-item .container { position: relative; z-index: 2; padding-bottom: 3rem; pointer-events: auto; }
/* Contrôles prev/next */
.hero-carousel .carousel-control-prev,
.hero-carousel .carousel-control-next {
    z-index: 3; width: 4rem; height: 4rem; margin: auto 0.5rem;
    opacity: 0.85; pointer-events: auto;
    background: rgba(0,0,0,0.25); border-radius: 50%;
    transition: opacity 0.2s ease, background 0.2s ease;
}
.hero-carousel .carousel-control-prev:hover,
.hero-carousel .carousel-control-next:hover { opacity: 1; background: rgba(0,0,0,0.4); }
.hero-carousel .carousel-control-prev:focus-visible,
.hero-carousel .carousel-control-next:focus-visible {
    outline: 2px solid #fff; outline-offset: 2px;
}
/* Indicateurs */
.hero-carousel .carousel-indicators { z-index: 3; margin-bottom: 1.5rem; pointer-events: auto; gap: 0.5rem; }
.hero-carousel .carousel-indicators button {
    width: 10px; height: 10px; border-radius: 50%;
    background-color: rgba(255,255,255,0.5); border: 2px solid rgba(255,255,255,0.8);
    cursor: pointer; transition: transform 0.2s ease, background 0.2s ease;
}
.hero-carousel .carousel-indicators button:hover { background-color: rgba(255,255,255,0.8); transform: scale(1.15); }
.hero-carousel .carousel-indicators button.active { background-color: #fff; transform: scale(1.2); }
.hero-carousel .carousel-indicators button:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
/* Animation légère du contenu à l’affichage du slide */
.hero-carousel .carousel-item .hero-slide-content { opacity: 0; transform: translateY(12px); transition: opacity 0.5s ease 0.2s, transform 0.5s ease 0.2s; }
.hero-carousel .carousel-item.active .hero-slide-content { opacity: 1; transform: translateY(0); }
.hero .container { position: relative; z-index: 1; min-height: 70vh; display: flex; flex-direction: column; justify-content: flex-end; padding-bottom: 3rem; }
.hero .badge-location { color: rgba(255,255,255,0.85); font-size: 0.8rem; text-transform: uppercase; letter-spacing: 0.05em; }
.hero h1 { color: #fff; font-weight: 700; font-size: clamp(1.4rem, 3.2vw, 2.1rem); text-shadow: 0 1px 3px rgba(0,0,0,0.5); }
.hero .meta { color: rgba(255,255,255,0.9); font-size: 0.85rem; }
.hero .lead { color: #fff !important; max-width: 540px; font-size: 1rem; line-height: 1.6; text-shadow: 0 1px 2px rgba(0,0,0,0.6), 0 2px 4px rgba(0,0,0,0.4); }
.hero .lead p, .hero .lead span, .hero .lead strong, .hero .lead em, .hero .lead a,
.hero .hero-description, .hero .hero-description p, .hero .hero-description span, .hero .hero-description strong, .hero .hero-description em, .hero .hero-description a { color: #fff !important; text-shadow: 0 1px 2px rgba(0,0,0,0.6), 0 2px 4px rgba(0,0,0,0.4); }
.hero .hero-description p { margin-bottom: 0.75rem; }
.hero .hero-description p:last-child { margin-bottom: 0; }
.hero .lead a:hover, .hero .hero-description a:hover { color: rgba(255,255,255,0.95) !important; text-decoration: underline; }
.btn-read-more { background: var(--msf-yellow); color: var(--msf-blue-dark); border: none; border-radius: 4px; padding: 0.5rem 1.25rem; font-size: 0.9rem; font-weight: 600; }
.btn-read-more:hover { background: #FFB300; color: var(--msf-blue-dark); }

/* Share */
.share-label { font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.08em; color: var(--msf-blue-dark); }
.share-icon { width: 40px; height: 40px; border: 1px solid var(--msf-red); border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; color: var(--msf-red); text-decoration: none; margin-right: 0.5rem; transition: background 0.2s, color 0.2s; }
.share-icon:hover { background: var(--msf-red); color: #fff; }
.share-sep { width: 1px; height: 24px; background: #dee2e6; margin: 0 0.5rem; vertical-align: middle; }
.copy-link { color: var(--msf-red); text-decoration: none; font-size: 0.9rem; display: inline-flex; align-items: center; gap: 0.25rem; }
.copy-link:hover { color: var(--msf-blue-dark); text-decoration: underline; }

/* Sections / Cards */
.section-heading { font-size: 1.5rem; font-weight: 700; color: var(--msf-blue-dark); margin-bottom: 1.5rem; text-transform: uppercase; letter-spacing: 0.03em; }
.card-mission, .card-announcement { border: none; border-radius: 8px; box-shadow: 0 2px 12px rgba(0,0,0,0.06); transition: box-shadow 0.2s, transform 0.2s; height: 100%; overflow: hidden; }
.card-mission:hover, .card-announcement:hover { box-shadow: 0 8px 24px rgba(0,0,0,0.1); }
.card-mission-img { height: 140px; background-size: cover; background-position: center; background-repeat: no-repeat; flex-shrink: 0; }
.card-mission .card-title, .card-announcement .card-title { font-weight: 600; color: var(--msf-blue-dark); font-size: 1rem; }
.card-mission .card-title a, .card-announcement .card-title a { color: inherit; text-decoration: none; }
.card-mission .card-title a:hover, .card-announcement .card-title a:hover { color: var(--msf-red); }
.card-mission .card-meta, .card-announcement .card-meta { font-size: 0.85rem; color: #6c757d; }

/* Index: personnel & bailleurs */
.staff-carousel { position: relative; padding-bottom: 3rem; }
.staff-carousel .carousel-item { padding: 0.25rem 0; }
.staff-carousel-control {
    width: 3rem;
    height: 3rem;
    top: 50%;
    transform: translateY(-50%);
    bottom: auto;
    opacity: 0.9;
    background: var(--msf-blue-dark);
    border-radius: 50%;
    border: none;
    z-index: 2;
}
.staff-carousel-control:hover { opacity: 1; background: #16152e; }
.staff-carousel-control .carousel-control-prev-icon,
.staff-carousel-control .carousel-control-next-icon { filter: none; }
.staff-carousel-indicators {
    position: relative;
    margin-top: 1.5rem;
    margin-bottom: 0;
    bottom: auto;
}
.staff-carousel-indicators button {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: rgba(29, 28, 62, 0.35);
    border: 2px solid var(--msf-blue-dark);
    opacity: 1;
}
.staff-carousel-indicators button:hover { background-color: rgba(29, 28, 62, 0.6); }
.staff-carousel-indicators button.active { background-color: var(--msf-blue-dark); }

@media (max-width: 575.98px) {
    .staff-carousel-control { width: 2.5rem; height: 2.5rem; }
    .staff-carousel-control .carousel-control-prev-icon,
    .staff-carousel-control .carousel-control-next-icon { width: 0.75rem; height: 0.75rem; }
}

.card-staff { border: none; border-radius: 8px; box-shadow: 0 2px 12px rgba(0,0,0,0.06); transition: box-shadow 0.2s; }
.card-staff:hover { box-shadow: 0 8px 24px rgba(0,0,0,0.1); }
a.card-staff { color: inherit; }
a.card-staff:hover { color: inherit; }
.card-staff-img { width: 80px; height: 80px; background-size: cover; background-position: center; background-repeat: no-repeat; flex-shrink: 0; }
.card-staff-img-placeholder { width: 80px; height: 80px; background: var(--msf-blue-dark); color: #fff; display: flex; align-items: center; justify-content: center; font-size: 2rem; }
.card-staff-list-img { height: 180px; }
.card-staff-link .card-staff-list-img.card-staff-img-placeholder { width: 100%; height: 180px; border-radius: 8px 8px 0 0; }
.card-staff .card-title { font-weight: 600; color: var(--msf-blue-dark); }
.card-staff .card-meta { font-size: 0.8rem; color: #6c757d; }
.teams-detail-photo-placeholder { width: 120px; height: 120px; background: var(--msf-blue-dark); color: #fff; border-radius: 50%; display: flex; align-items: center; justify-content: center; }
.teams-detail-photo-icon { font-size: 3rem; }
.mission-detail-hero--team .mission-detail-hero-bg { background-size: cover; background-position: center top; }
.mission-detail-hero--team { min-height: 45vh; }
.mission-detail-hero--team .mission-detail-hero-content { padding-bottom: 2.5rem; }

/* Team detail body */
.teams-detail-grid { align-items: start; }
.teams-detail-profile {
    display: flex;
    align-items: center;
    gap: 1.5rem;
    margin-bottom: 2rem;
    padding-bottom: 2rem;
    border-bottom: 1px solid #eee;
}
.teams-detail-avatar {
    width: 120px;
    height: 120px;
    min-width: 120px;
    border-radius: 50%;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    box-shadow: 0 4px 16px rgba(0,0,0,0.1);
}
.teams-detail-avatar-placeholder {
    background: var(--msf-blue-dark);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 3rem;
}
.teams-detail-profile-head { min-width: 0; }
.teams-detail-name {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--msf-blue-dark);
    margin: 0 0 0.35rem;
}
.teams-detail-role {
    font-size: 1rem;
    color: #6c757d;
    margin: 0;
}
.teams-detail-about { margin-bottom: 2rem; }
.teams-detail-section-title {
    font-size: 1rem;
    font-weight: 700;
    color: var(--msf-blue-dark);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-bottom: 1rem;
}
.teams-detail-intro {
    color: #495057;
    line-height: 1.6;
    margin: 0;
}
.teams-detail-sidebar .teams-detail-card {
    border: 1px solid #eee;
    border-radius: 10px;
    padding: 1.25rem 1.5rem;
    margin-bottom: 1.25rem;
}
.teams-detail-meta { display: flex; flex-direction: column; gap: 0.75rem; }
.teams-detail-meta-row { display: grid; grid-template-columns: 1fr 1.5fr; gap: 0.5rem 1rem; align-items: baseline; }
.teams-detail-meta-row dt {
    font-size: 0.8rem;
    font-weight: 600;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    margin: 0;
}
.teams-detail-meta-row dd { margin: 0; font-size: 0.95rem; }
.teams-detail-contact-card .teams-detail-contact-list { margin: 0; }
.teams-detail-contact-list li { margin-bottom: 0.75rem; }
.teams-detail-contact-list li:last-child { margin-bottom: 0; }
.teams-detail-contact-link,
.teams-detail-contact-item {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.95rem;
    color: var(--msf-blue-dark);
    text-decoration: none;
}
.teams-detail-contact-link:hover { color: var(--msf-red); }
.teams-detail-contact-item { color: #495057; }
.teams-detail-contact-link .bi,
.teams-detail-contact-item .bi { font-size: 1.1rem; color: var(--msf-red); flex-shrink: 0; }
.card-bailleur { border: none; border-radius: 8px; box-shadow: 0 2px 12px rgba(0,0,0,0.06); min-height: 100px; }
.card-bailleur-logo { max-height: 60px; width: auto; object-fit: contain; }
.card-bailleur-name { font-size: 0.9rem; font-weight: 600; color: var(--msf-blue-dark); }

/* Carousel bailleurs (même style que équipe) */
.bailleurs-carousel { position: relative; padding-bottom: 3rem; }
.bailleurs-carousel .carousel-item { padding: 0.25rem 0; }
.bailleurs-carousel-control {
    width: 3rem;
    height: 3rem;
    top: 50%;
    transform: translateY(-50%);
    bottom: auto;
    opacity: 0.9;
    background: var(--msf-blue-dark);
    border-radius: 50%;
    border: none;
    z-index: 2;
}
.bailleurs-carousel-control:hover { opacity: 1; background: #16152e; }
.bailleurs-carousel-control .carousel-control-prev-icon,
.bailleurs-carousel-control .carousel-control-next-icon { filter: none; }
.bailleurs-carousel-indicators {
    position: relative;
    margin-top: 1.5rem;
    margin-bottom: 0;
    bottom: auto;
}
.bailleurs-carousel-indicators button {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: rgba(29, 28, 62, 0.35);
    border: 2px solid var(--msf-blue-dark);
    opacity: 1;
}
.bailleurs-carousel-indicators button:hover { background-color: rgba(29, 28, 62, 0.6); }
.bailleurs-carousel-indicators button.active { background-color: var(--msf-blue-dark); }
@media (max-width: 575.98px) {
    .bailleurs-carousel-control { width: 2.5rem; height: 2.5rem; }
    .bailleurs-carousel-control .carousel-control-prev-icon,
    .bailleurs-carousel-control .carousel-control-next-icon { width: 0.75rem; height: 0.75rem; }
}

.btn-view-all { background: transparent; color: var(--msf-blue-dark); border: 2px solid var(--msf-blue-dark); font-weight: 600; padding: 0.5rem 1.25rem; border-radius: 6px; font-size: 0.9rem; text-decoration: none; }
.btn-view-all:hover { background: var(--msf-blue-dark); color: #fff; }

/* Index: sections supplémentaires */
.index-about { background: #f8f9fa; }
.index-about-lead { font-size: 1.05rem; color: #444; line-height: 1.6; max-width: 42rem; margin-bottom: 1.25rem; }
.index-about-icon { font-size: 4rem; color: var(--msf-blue-dark); opacity: 0.2; }

.index-stats { background: var(--msf-blue-dark); color: #fff; }
.index-stats .section-heading { color: #fff; }
.index-stat-card { text-align: center; padding: 1.5rem 1rem; background: rgba(255,255,255,0.08); border-radius: 10px; transition: background 0.2s; }
.index-stat-card:hover { background: rgba(255,255,255,0.12); }
.index-stat-number { display: block; font-size: 2.25rem; font-weight: 700; line-height: 1.2; margin-bottom: 0.35rem; }
.index-stat-label { font-size: 0.85rem; opacity: 0.9; text-transform: uppercase; letter-spacing: 0.04em; }

.index-where { border-top: 1px solid #eee; }
.index-where-list { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 0.5rem 1.5rem; }
.index-where-list li { margin: 0; }
.index-where-list a { color: var(--msf-blue-dark); font-weight: 500; text-decoration: none; }
.index-where-list a:hover { color: var(--msf-red); text-decoration: underline; }

/* Page Où nous travaillons (where-we-work.php) */
.where-we-work-hero { background: #fff; }
.where-we-work-map-section { background: #fff; }
.where-we-work-card { transition: transform 0.2s ease, box-shadow 0.2s ease; }
.where-we-work-card:hover { transform: translateY(-2px); box-shadow: 0 6px 20px rgba(0,0,0,0.1) !important; }
.where-we-work-card-icon { width: 48px; height: 48px; flex-shrink: 0; background: var(--msf-blue-dark); color: #fff; font-size: 1.25rem; }
.where-we-work-card .text-dark:hover { color: var(--msf-blue-dark) !important; }

.index-cta { background: #f0f2f5; }
.index-cta-title { font-size: 1.5rem; font-weight: 700; color: var(--msf-blue-dark); text-transform: uppercase; letter-spacing: 0.03em; margin-bottom: 0.5rem; }
.index-cta-lead { color: #555; font-size: 1.05rem; max-width: 36rem; margin-left: auto; margin-right: auto; }
.btn-cta-primary { background: var(--msf-blue-dark); color: #fff !important; border: none; padding: 0.6rem 1.75rem; font-weight: 600; border-radius: 6px; text-decoration: none; font-size: 1rem; }
.btn-cta-primary:hover { background: #16152e; color: #fff !important; }

/* Footer */
.site-footer {
    position: relative;
    background: var(--msf-blue-dark);
    color: rgba(255, 255, 255, 0.88);
    margin-top: 4rem;
    padding: 3rem 0 0;
}
.site-footer-accent {
    height: 4px;
    background: linear-gradient(90deg, var(--msf-yellow) 0%, rgba(255, 193, 7, 0.6) 100%);
    margin-bottom: 2rem;
}
.site-footer a {
    color: rgba(255, 255, 255, 0.9);
    text-decoration: none;
    transition: color 0.2s ease;
}
.site-footer a:hover {
    color: #fff;
}
.site-footer .footer-title {
    font-weight: 700;
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    margin-bottom: 1rem;
    color: #fff;
}
.site-footer-brand .footer-brand-name {
    font-size: 1.1rem;
    text-transform: none;
    letter-spacing: 0.02em;
    margin-bottom: 0.5rem;
}
.footer-tagline {
    font-size: 0.9rem;
    line-height: 1.5;
    color: rgba(255, 255, 255, 0.8);
    margin-bottom: 1rem;
    max-width: 320px;
}
.footer-social {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}
.footer-social-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, 0.35);
    color: rgba(255, 255, 255, 0.9);
    font-size: 1.1rem;
    transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}
.footer-social-icon:hover {
    background: var(--msf-yellow);
    border-color: var(--msf-yellow);
    color: var(--msf-blue-dark);
}
.site-footer .footer-links {
    list-style: none;
    padding: 0;
    margin: 0;
}
.site-footer .footer-links li {
    margin-bottom: 0.5rem;
}
.site-footer .footer-links a {
    font-size: 0.9rem;
}
.site-footer-cta .footer-cta-text {
    font-size: 0.9rem;
    color: rgba(255, 255, 255, 0.85);
    margin-bottom: 1rem;
    max-width: 260px;
}
.btn-footer-cta {
    display: inline-block;
    background: var(--msf-yellow);
    color: var(--msf-blue-dark) !important;
    font-weight: 600;
    font-size: 0.9rem;
    padding: 0.5rem 1.25rem;
    border-radius: 6px;
    border: none;
    text-decoration: none;
    transition: background 0.2s ease, transform 0.2s ease;
}
.btn-footer-cta:hover {
    background: #ffb300;
    color: var(--msf-blue-dark) !important;
    transform: translateY(-1px);
}
.site-footer .footer-bottom {
    border-top: 1px solid rgba(255, 255, 255, 0.15);
    margin-top: 2.5rem;
    padding: 1.25rem 0 2rem;
    font-size: 0.85rem;
    color: rgba(255, 255, 255, 0.7);
}
.footer-bottom-inner {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
}
.footer-legal {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 1rem;
}
.footer-legal a {
    font-size: 0.85rem;
    color: rgba(255, 255, 255, 0.8);
}
.footer-legal a:hover {
    color: #fff;
}
.footer-back-top {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.12);
    color: #fff;
    font-size: 1rem;
    transition: background 0.2s ease, transform 0.2s ease;
}
.footer-back-top:hover {
    background: var(--msf-yellow);
    color: var(--msf-blue-dark);
    transform: translateY(-2px);
}
.site-footer-grid {
    padding-bottom: 0.5rem;
}

/* ========== Responsive ========== */
@media (max-width: 991.98px) {
    body, html { padding-top: 72px; }
    .hero { margin-top: -72px; min-height: 60vh; }
    .hero .container { min-height: 60vh; padding-bottom: 2rem; padding-left: 1rem; padding-right: 1rem; }
    .hero h1 { font-size: clamp(1.2rem, 4vw, 1.65rem); }
    .hero .lead { font-size: 0.9rem; max-width: 100%; }
    .container { padding-left: 1rem; padding-right: 1rem; }
    .section-heading { font-size: 1.25rem; margin-bottom: 1rem; }
    .section-heading.mb-0 { margin-bottom: 0; }
    .site-footer { margin-top: 2.5rem; padding: 2rem 0 0; }
    .site-footer-accent { margin-bottom: 1.5rem; }
    .site-footer .footer-title { margin-top: 1rem; }
    .site-footer .footer-title:first-child { margin-top: 0; }
    .site-footer-cta .footer-cta-text { max-width: 100%; }
    .btn-view-all { padding: 0.45rem 1rem; font-size: 0.85rem; }
    .index-stat-number { font-size: 1.75rem; }
    .index-cta-title { font-size: 1.25rem; }
}

@media (max-width: 767.98px) {
    body, html { padding-top: 68px; }
    .hero { margin-top: -68px; min-height: 55vh; }
    .hero .container { min-height: 55vh; padding-bottom: 1.5rem; }
    .hero .badge-location { font-size: 0.75rem; }
    .hero .meta { font-size: 0.8rem; }
    .btn-read-more { padding: 0.45rem 1rem; font-size: 0.85rem; }
    .share-icon { width: 36px; height: 36px; margin-right: 0.35rem; font-size: 0.9rem; }
    .copy-link { font-size: 0.85rem; display: inline-block; margin-top: 0.5rem; }
    .section-heading { font-size: 1.1rem; }
    .card-mission .card-title, .card-announcement .card-title { font-size: 0.95rem; }
    .card-mission .card-meta, .card-announcement .card-meta { font-size: 0.8rem; }
    .footer-bottom-inner { flex-direction: column; text-align: center; }
    .site-footer .footer-bottom { margin-top: 2rem; padding-top: 1.25rem; padding-bottom: 1.5rem; }
}

@media (max-width: 575.98px) {
    .navbar-main .container { padding-left: 0.75rem; padding-right: 0.75rem; }
    .navbar-main .navbar-brand img { height: 48px; }
    .hero { min-height: 50vh; }
    .hero .container { padding-left: 0.75rem; padding-right: 0.75rem; }
    .hero h1 { font-size: 1.1rem; }
    .py-5 { padding-top: 2rem !important; padding-bottom: 2rem !important; }
    .d-flex.justify-content-between.mb-4 { flex-direction: column; align-items: flex-start !important; gap: 0.75rem; }
    .btn-view-all { align-self: flex-start; }
    .index-stat-card { padding: 1rem 0.75rem; }
    .index-stat-number { font-size: 1.5rem; }
    .index-stat-label { font-size: 0.75rem; }
    .index-where-list { flex-direction: column; gap: 0.25rem; }
}

/* Mega-menu responsive */
@media (max-width: 991.98px) {
    .mega-menu {
        z-index: 2100; /* Above mobile menu overlay */
        top: 0 !important; /* Fixed at top */
        height: 100vh;
        max-height: 100vh;
    }
    .mega-menu .mega-header { padding: 1.25rem 1rem 1rem; flex-direction: row; align-items: center; justify-content: space-between; gap: 1rem; border-bottom: 1px solid rgba(255,255,255,0.2); }
    .mega-menu .mega-title { font-size: 1.5rem; }
    .mega-menu .container { padding-left: 1rem; padding-right: 1rem; }
    .mega-menu .mega-grid { grid-template-columns: 1fr; gap: 1.5rem; padding: 1.5rem 0 2rem; }
    .mega-menu .mega-col h3 { font-size: 0.75rem; }
    .mega-menu .mega-col p { font-size: 0.9rem; }
}

@media (max-width: 575.98px) {
    .mega-menu .mega-title { font-size: 1.25rem; }
    .mega-menu .mega-grid { padding: 1rem 0 1.5rem; }
}

/* ========== Mission detail page ========== */
.mission-detail { padding-bottom: 3rem; }
.mission-detail-cover-wrap { width: 100%; }
.mission-detail-cover-img { width: 100%; max-height: 420px; object-fit: cover; display: block; }
.mission-detail-hero {
    position: relative;
    min-height: 42vh;
    display: flex;
    align-items: flex-end;
    overflow: hidden;
    margin-top: -108px;
    padding-top: 108px;
}
.mission-detail-hero-bg {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}
.mission-detail-hero-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(29, 28, 62, 0.92) 0%, rgba(29, 28, 62, 0.5) 50%, rgba(29, 28, 62, 0.2) 100%);
}
.mission-detail-hero-content {
    position: relative;
    z-index: 1;
    padding-bottom: 2.5rem;
    padding-top: 2rem;
}
.mission-detail-breadcrumb { margin-bottom: 1rem; display: flex; flex-wrap: wrap; align-items: center; gap: 1rem; }
.mission-detail-breadcrumb a {
    color: rgba(255, 255, 255, 0.9);
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 500;
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}
.mission-detail-breadcrumb a:hover { color: #fff; }
.mission-detail-print-btn {
    background: rgba(255, 255, 255, 0.2);
    color: #fff;
    border: 1px solid rgba(255, 255, 255, 0.5);
    padding: 0.4rem 0.75rem;
    font-size: 0.9rem;
    font-weight: 500;
    border-radius: 6px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}
.mission-detail-print-btn:hover { background: rgba(255, 255, 255, 0.3); color: #fff; }
.mission-detail-print-btn--dark {
    background: #fff;
    color: var(--msf-blue-dark);
    border-color: var(--msf-blue-dark);
}
.mission-detail-print-btn--dark:hover { background: #f0f0f0; color: var(--msf-blue-dark); }
.mission-detail-badge {
    display: inline-block;
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--msf-yellow);
    margin-bottom: 0.5rem;
}
.mission-detail-badge--dark { color: var(--msf-blue-dark); }
.mission-detail-meta-top {
    font-size: 0.9rem;
    color: rgba(255, 255, 255, 0.85);
    margin: 0 0 0.5rem 0;
}
.mission-detail-meta-top--dark { color: #5a5a5a; }
.mission-detail-title {
    font-size: clamp(1.5rem, 3.5vw, 2.25rem);
    font-weight: 700;
    color: #fff;
    line-height: 1.25;
    margin: 0 0 0.35rem 0;
    max-width: 800px;
}
.mission-detail-title--dark { color: var(--msf-blue-dark); }
.mission-detail-ref {
    font-size: 0.9rem;
    color: rgba(255, 255, 255, 0.8);
    margin: 0 0 0.5rem 0;
}
.mission-detail-ref--dark { color: #6c757d; }
.mission-detail-dates {
    font-size: 0.9rem;
    color: rgba(255, 255, 255, 0.9);
    margin: 0;
}
.mission-detail-dates--dark { color: #495057; }
.mission-detail-updated { opacity: 0.9; }

.mission-detail-no-hero {
    padding-top: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 1px solid #e9ecef;
}
.mission-detail-no-hero .mission-detail-breadcrumb a { color: var(--msf-blue-dark); }
.mission-detail-no-hero .mission-detail-breadcrumb a:hover { color: #000; }

.mission-detail-body { padding-top: 2.5rem; }
.mission-detail-grid {
    display: grid;
    grid-template-columns: 1fr 320px;
    gap: 3rem;
    align-items: start;
}
.mission-detail-main { min-width: 0; }
.mission-detail-description {
    font-size: 1.05rem;
    line-height: 1.7;
    color: #333;
}
.mission-detail-description p { margin-bottom: 1.25rem; }
.mission-detail-description p:last-child { margin-bottom: 0; }
.mission-detail-description img { max-width: 100%; height: auto; border-radius: 8px; }
.mission-detail-description h2, .mission-detail-description h3 { color: var(--msf-blue-dark); margin-top: 1.5rem; margin-bottom: 0.75rem; }
.mission-detail-description ul, .mission-detail-description ol { margin-bottom: 1.25rem; padding-left: 1.5rem; }
.mission-detail-description li { margin-bottom: 0.35rem; }

.mission-detail-sidebar { position: sticky; top: 120px; }
.project-detail-meta dt { font-size: 0.75rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; color: #6c757d; margin-top: 0.5rem; margin-bottom: 0.15rem; }
.project-detail-meta dt:first-child { margin-top: 0; }
.project-detail-meta dd { margin-left: 0; margin-bottom: 0; }
.project-detail-phase:last-child { border-bottom: none !important; margin-bottom: 0 !important; padding-bottom: 0 !important; }
.mission-detail-block {
    background: #f8f9fa;
    border-radius: 10px;
    padding: 1.5rem;
    margin-bottom: 1.5rem;
    border: 1px solid #e9ecef;
}
.mission-detail-block:last-child { margin-bottom: 0; }
.mission-detail-block-title {
    font-size: 0.8rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--msf-blue-dark);
    margin: 0 0 1rem 0;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}
.mission-detail-block-title .bi { font-size: 1rem; color: var(--msf-red); }

/* Actualité : réactions et commentaires */
.announcement-actions-label { font-weight: 600; color: var(--msf-blue-dark); font-size: 0.9rem; }
.announcement-reactions-form { display: inline-flex; flex-wrap: wrap; gap: 0.5rem; align-items: center; }
.announcement-reaction-btn {
    display: inline-flex; align-items: center; gap: 0.35rem;
    padding: 0.4rem 0.75rem; border-radius: 999px; border: 1px solid #dee2e6;
    background: #fff; color: #6c757d; font-size: 0.9rem; transition: background 0.2s, color 0.2s, border-color 0.2s;
}
.announcement-reaction-btn:hover { background: #f8f9fa; color: var(--msf-blue-dark); border-color: var(--msf-blue-dark); }
.announcement-reaction-btn.active { background: rgba(255, 193, 7, 0.2); color: var(--msf-blue-dark); border-color: var(--msf-red); }
.announcement-reaction-count { font-size: 0.8rem; font-weight: 600; }
.announcement-comments .announcement-comment-item { padding-left: 0; }
.announcement-comments .form-control { max-width: 100%; }

.mission-detail-objectives { list-style: none; padding: 0; margin: 0; }
.mission-detail-objective {
    display: flex;
    gap: 0.75rem;
    align-items: flex-start;
    padding: 0.75rem 0;
    border-bottom: 1px solid #e9ecef;
    font-size: 0.95rem;
}
.mission-detail-objective:last-child { border-bottom: none; padding-bottom: 0; }
.mission-detail-objective:first-child { padding-top: 0; }
.mission-detail-objective .bi-check-circle-fill { color: #198754; flex-shrink: 0; margin-top: 0.2rem; }
.mission-detail-objective--done .mission-detail-objective-desc { opacity: 0.9; }
.mission-detail-objective-desc {
    margin: 0.25rem 0 0 0;
    font-size: 0.9rem;
    color: #6c757d;
    line-height: 1.4;
}
.mission-detail-bailleurs { display: flex; flex-wrap: wrap; gap: 1rem; }
.mission-detail-bailleur {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.6rem 0.9rem;
    background: #fff;
    border-radius: 8px;
    border: 1px solid #e9ecef;
    min-width: 0;
}
.mission-detail-bailleur-logo {
    max-height: 32px;
    max-width: 80px;
    width: auto;
    object-fit: contain;
}
.mission-detail-bailleur-name { font-size: 0.9rem; font-weight: 500; color: var(--msf-blue-dark); }

@media print {
    .site-header,
    .site-footer,
    .mega-menu,
    .mission-detail-print-btn { display: none !important; }
    .mission-detail { padding-bottom: 0; }
}

@media (max-width: 991.98px) {
    .mission-detail-hero { margin-top: -72px; padding-top: 72px; min-height: 38vh; }
    .mission-detail-grid { grid-template-columns: 1fr; gap: 2rem; }
    .mission-detail-sidebar { position: static; }
    .teams-detail-profile { flex-wrap: wrap; }
    .teams-detail-meta-row { grid-template-columns: 1fr; }
}
@media (max-width: 767.98px) {
    .mission-detail-hero { margin-top: -68px; padding-top: 68px; min-height: 35vh; }
    .mission-detail-hero-content { padding-bottom: 1.75rem; padding-top: 1.5rem; }
    .mission-detail-title { font-size: 1.35rem; }
    .mission-detail-body { padding-top: 1.75rem; }
    .mission-detail-block { padding: 1.25rem; }
    .mission-detail-bailleurs { flex-direction: column; }
    .mission-detail-bailleur { width: 100%; }
    .teams-detail-profile { flex-direction: column; align-items: flex-start; }
    .teams-detail-avatar { width: 100px; height: 100px; min-width: 100px; }
}
@media (max-width: 575.98px) {
    .mission-detail-hero { min-height: 30vh; }
    .mission-detail-no-hero { padding-top: 1.5rem; padding-bottom: 1rem; }
}

/* Static / content pages (navbar pages) */
.page-content .content-prose {
    font-size: 1.05rem;
    line-height: 1.7;
    color: #333;
    max-width: 720px;
}
.page-content .content-prose p { margin-bottom: 1.25rem; }
.page-content .content-prose p:last-child { margin-bottom: 0; }
.page-content .content-prose h2 { color: var(--msf-blue-dark); margin-top: 1.5rem; margin-bottom: 0.75rem; }
.page-content .content-prose ul { margin-bottom: 1.25rem; padding-left: 1.5rem; }
.page-content .content-prose a { color: var(--pam-blue); text-decoration: none; }
.page-content .content-prose a:hover { text-decoration: underline; }

/* About page – organisation & structure (Organizational Management) */
.about-hero {
    position: relative;
    min-height: 38vh;
    display: flex;
    align-items: flex-end;
    overflow: hidden;
    margin-top: -108px;
    padding-top: 108px;
}
.about-hero-bg {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}
.about-hero-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(29, 28, 62, 0.88) 0%, rgba(29, 28, 62, 0.45) 50%, rgba(29, 28, 62, 0.2) 100%);
}
.about-hero-content {
    position: relative;
    z-index: 1;
    padding-bottom: 2rem;
    padding-top: 1.5rem;
}
.about-hero-breadcrumb { margin-bottom: 0.75rem; }
.about-hero-breadcrumb a:hover { opacity: 0.9; }
.about-hero-title {
    font-size: clamp(1.5rem, 3vw, 2rem);
    font-weight: 700;
    color: #fff;
    margin: 0;
}
.about-page.about-page-has-hero { padding-top: 2rem; }
.about-page .about-org-description-html {
    font-size: 1.05rem;
    line-height: 1.75;
}
.about-page .about-org-description-html img { max-width: 100%; height: auto; border-radius: 6px; }
.about-page .about-org-description-html p { margin-bottom: 1rem; }
.about-page .about-org-description-html p:last-child { margin-bottom: 0; }
.about-page .about-org-description-html ul, .about-page .about-org-description-html ol { margin-bottom: 1rem; padding-left: 1.5rem; }
.about-page .about-org-description-html h2, .about-page .about-org-description-html h3 { color: var(--msf-blue-dark); margin-top: 1.25rem; margin-bottom: 0.5rem; }
.about-page .about-org-description-html a { color: var(--pam-blue); text-decoration: none; }
.about-page .about-org-description-html a:hover { text-decoration: underline; }

.about-page .about-org-identity { border-radius: 10px; max-width: 720px; }
.about-page .about-org-logo { width: 120px; height: 120px; object-fit: contain; border-radius: 8px; }
.about-page .about-org-types { color: #555; font-size: 0.95rem; }
.about-page .about-org-description { font-size: 1.05rem; line-height: 1.75; color: #333; max-width: 720px; }
.about-page .about-contact-card { max-width: 560px; border-radius: 10px; }
.about-page .about-contact-card a { color: var(--msf-blue-dark); font-weight: 500; }
.about-page .about-contact-card a:hover { color: var(--msf-red); }
.about-page .about-org-social .about-social-link {
    display: inline-flex; align-items: center; justify-content: center;
    width: 40px; height: 40px; border-radius: 50%;
    background: var(--msf-blue-dark); color: #fff !important;
    font-size: 1.2rem; text-decoration: none; transition: opacity 0.2s, transform 0.2s;
}
.about-page .about-org-social .about-social-link:hover { opacity: 0.9; transform: scale(1.05); color: #fff !important; }
.about-structure-icon { font-size: 1.5rem; flex-shrink: 0; }
.about-structure-photo .about-dept-img { width: 80px; height: 80px; object-fit: cover; border-radius: 8px; }
.about-svc-img { width: 40px; height: 40px; object-fit: cover; border-radius: 6px; flex-shrink: 0; }
.about-unit-img { width: 28px; height: 28px; object-fit: cover; border-radius: 4px; flex-shrink: 0; }
.about-structure-block { border-radius: 10px; transition: box-shadow 0.2s ease; }
.about-structure-block:hover { box-shadow: 0 4px 20px rgba(0,0,0,0.08) !important; }
.about-services-list { border-left: 2px solid rgba(29, 28, 62, 0.15); padding-left: 1rem; }
.about-service-item { padding-left: 0.25rem; }
.about-service-name { color: var(--msf-blue-dark); }
.about-units-list { font-size: 0.9rem; color: #555; }
.about-unit-item { border-bottom: none !important; }
.about-entities-list li:last-child { border-bottom: none !important; }
.about-entities .about-entities-list { margin-bottom: 0; }
@media (max-width: 767.98px) {
    .about-page .about-contact-card .row { --bs-gutter-x: 0.75rem; }
    .about-page .about-org-logo { width: 80px; height: 80px; }
    .about-structure-block .card-body { padding: 1rem !important; }
    .about-structure-photo .about-dept-img { width: 60px; height: 60px; }
    .about-services-list { padding-left: 0.75rem; }
    .about-units-list { margin-left: 0.5rem !important; }
}

/* About detail page (layout like project detail) */
.about-detail .about-detail-logo-img { width: 100px; height: 100px; object-fit: contain; border-radius: 8px; }
.about-detail .about-dept-thumb { object-fit: cover; flex-shrink: 0; }
.about-detail .about-dept-icon { font-size: 1.5rem; flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center; width: 56px; height: 56px; }
.about-detail .mission-detail-description.about-org-description-html img { max-width: 100%; height: auto; border-radius: 6px; }
.about-detail .mission-detail-description.about-org-description-html p { margin-bottom: 1rem; }
.about-detail .mission-detail-description.about-org-description-html p:last-child { margin-bottom: 0; }
.about-detail .mission-detail-description.about-org-description-html h2,
.about-detail .mission-detail-description.about-org-description-html h3 { color: var(--msf-blue-dark); margin-top: 1.25rem; margin-bottom: 0.5rem; }
.about-detail .mission-detail-description.about-org-description-html a { color: var(--pam-blue); text-decoration: none; }
.about-detail .mission-detail-description.about-org-description-html a:hover { text-decoration: underline; }
.about-detail .about-sidebar-contact a { color: var(--msf-blue-dark); text-decoration: none; }
.about-detail .about-sidebar-contact a:hover { text-decoration: underline; }
.about-detail .about-structure-description { font-size: 0.9rem; line-height: 1.5; }
.about-detail .about-structure-description img { max-width: 100%; height: auto; border-radius: 4px; }
.about-detail .about-structure-description p { margin-bottom: 0.5rem; }
.about-detail .about-structure-description p:last-child { margin-bottom: 0; }

/* Responsibility page – documents & engagements */
.responsibility-page .responsibility-category-card { border-radius: 10px; transition: box-shadow 0.2s ease; }
.responsibility-page .responsibility-category-card:hover { box-shadow: 0 4px 20px rgba(0,0,0,0.08) !important; }
.responsibility-doc-item:last-child { border-bottom: none !important; }
.responsibility-doc-thumb { width: 80px; height: 80px; border-radius: 8px; overflow: hidden; background: var(--bs-light, #f8f9fa); display: flex; align-items: center; justify-content: center; }
.responsibility-doc-thumb-img { width: 100%; height: 100%; object-fit: cover; }
.responsibility-doc-thumb-icon { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; font-size: 2rem; color: var(--bs-primary, #0d6efd); }
.responsibility-commitment-card { border-radius: 10px; transition: transform 0.2s ease, box-shadow 0.2s ease; }
.responsibility-commitment-card:hover { transform: translateY(-2px); box-shadow: 0 6px 24px rgba(0,0,0,0.08) !important; }
.responsibility-commitment-icon { font-size: 2rem; }
@media (max-width: 767.98px) {
    .responsibility-page .responsibility-category-card .card-body { padding: 1rem !important; }
    .responsibility-commitment-card .card-body { padding: 1.25rem !important; }
    .responsibility-doc-thumb { width: 60px; height: 60px; }
    .responsibility-doc-thumb-icon { font-size: 1.5rem; }
}

/* Reports & finances page */
.reports-finances-page .reports-finances-section-card { border-radius: 10px; transition: box-shadow 0.2s ease, transform 0.2s ease; }
.reports-finances-page .reports-finances-section-card:hover { box-shadow: 0 6px 24px rgba(0,0,0,0.08) !important; transform: translateY(-2px); }
.reports-finances-section-icon { font-size: 2rem; }
.reports-finances-page .reports-finances-category-card { border-radius: 10px; transition: box-shadow 0.2s ease; }
.reports-finances-page .reports-finances-category-card:hover { box-shadow: 0 4px 20px rgba(0,0,0,0.08) !important; }
.reports-finances-doc-item:last-child { border-bottom: none !important; }
@media (max-width: 767.98px) {
    .reports-finances-page .reports-finances-category-card .card-body { padding: 1rem !important; }
    .reports-finances-section-icon { font-size: 1.5rem; }
}

/* Contact page */
.contact-page .contact-card { border-radius: 12px; transition: box-shadow 0.2s ease; }
.contact-page .contact-card:hover { box-shadow: 0 8px 28px rgba(0,0,0,0.08) !important; }
.contact-details-list { padding-left: 0; }
.contact-detail-item { display: flex; align-items: flex-start; gap: 0.75rem; }
.contact-detail-icon { flex-shrink: 0; width: 1.25rem; text-align: center; color: var(--bs-primary, #0d6efd); margin-top: 0.15rem; }
.contact-page .contact-detail-item a { color: var(--msf-blue-dark, #0d6efd); font-weight: 500; text-decoration: none; }
.contact-page .contact-detail-item a:hover { text-decoration: underline; }
.contact-social-links .contact-social-btn { width: 2.5rem; height: 2.5rem; padding: 0; display: inline-flex; align-items: center; justify-content: center; border-radius: 8px; }
.contact-social-links .contact-social-btn:hover { background: var(--bs-primary); color: #fff; border-color: var(--bs-primary); }

/* Media & resources page */
.media-resources-page .media-category-card { border-radius: 10px; transition: box-shadow 0.2s ease; }
.media-resources-page .media-category-card:hover { box-shadow: 0 4px 20px rgba(0,0,0,0.08) !important; }
.media-resources-page .media-doc-item { border-radius: 10px; transition: box-shadow 0.2s ease, transform 0.2s ease; }
.media-resources-page .media-doc-item:hover { box-shadow: 0 4px 16px rgba(0,0,0,0.08); }
.media-doc-thumb { width: 64px; height: 64px; border-radius: 8px; overflow: hidden; background: var(--bs-light, #f8f9fa); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.media-doc-thumb-img { width: 100%; height: 100%; object-fit: cover; }
.media-doc-thumb-icon { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; font-size: 1.75rem; color: var(--bs-primary, #0d6efd); }
.media-resources-page .media-attachments-table td a { color: var(--msf-blue-dark, #0d6efd); text-decoration: none; }
.media-resources-page .media-attachments-table td a:hover { text-decoration: underline; }
.media-attachment-icon { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 8px; background: rgba(13, 110, 253, 0.1); font-size: 1.1rem; }
@media (max-width: 767.98px) {
    .media-resources-page .media-category-card .card-body { padding: 1rem !important; }
    .media-resources-page .media-attachments-table { font-size: 0.9rem; }
    .media-doc-thumb { width: 52px; height: 52px; }
    .media-doc-thumb-icon { font-size: 1.35rem; }
}

/* ========== Espace Utilisateur ========== */
.client-dashboard { background: #f5f6f8; }
.client-welcome-card {
    background: linear-gradient(135deg, var(--msf-blue-dark) 0%, #2d2d4e 100%);
    color: #fff;
    border-radius: 16px;
    padding: 2rem;
    margin-bottom: 2rem;
    box-shadow: 0 8px 32px rgba(29, 28, 62, 0.15);
}
.client-welcome-label {
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--msf-yellow);
    margin-bottom: 0.35rem;
}
.client-welcome-title { font-size: 1.75rem; font-weight: 700; margin-bottom: 0.5rem; color: #fff; }
.client-welcome-text { color: rgba(255, 255, 255, 0.88); font-size: 1rem; margin-bottom: 0; }
.btn-client-logout {
    background: rgba(255, 255, 255, 0.15);
    color: #fff;
    border: 1px solid rgba(255, 255, 255, 0.35);
    padding: 0.5rem 1.25rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.9rem;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    transition: background 0.2s ease, border-color 0.2s ease;
}
.btn-client-logout:hover { background: rgba(255, 255, 255, 0.25); border-color: rgba(255, 255, 255, 0.5); color: #fff; }

.client-stat-card {
    background: #fff;
    border-radius: 12px;
    padding: 1.25rem 1.5rem;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
    text-align: center;
    transition: box-shadow 0.2s ease;
}
.client-stat-card:hover { box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08); }
.client-stat-number { display: block; font-size: 2rem; font-weight: 700; color: var(--msf-blue-dark); line-height: 1.2; }
.client-stat-label { font-size: 0.85rem; color: #6c757d; }

.client-section-title { font-size: 1.25rem; font-weight: 700; color: var(--msf-blue-dark); margin-bottom: 1.25rem; text-transform: uppercase; letter-spacing: 0.03em; }

.client-action-card {
    display: block;
    background: #fff;
    border-radius: 14px;
    padding: 1.75rem;
    box-shadow: 0 2px 14px rgba(0, 0, 0, 0.06);
    text-decoration: none;
    color: inherit;
    height: 100%;
    transition: box-shadow 0.2s ease, transform 0.2s ease;
    border: 1px solid rgba(0, 0, 0, 0.04);
}
.client-action-card:hover { box-shadow: 0 8px 28px rgba(0, 0, 0, 0.1); transform: translateY(-2px); color: inherit; }
.client-action-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    background: rgba(29, 28, 62, 0.08);
    color: var(--msf-blue-dark);
    border-radius: 12px;
    font-size: 1.5rem;
    margin-bottom: 1rem;
}
.client-action-card:hover .client-action-icon { background: var(--msf-yellow); color: var(--msf-blue-dark); }
.client-action-title { font-size: 1.1rem; font-weight: 700; color: var(--msf-blue-dark); margin-bottom: 0.35rem; }
.client-action-desc { font-size: 0.9rem; color: #6c757d; margin-bottom: 0.75rem; }
.client-action-link { font-size: 0.9rem; font-weight: 600; color: var(--msf-blue-dark); display: inline-flex; align-items: center; gap: 0.35rem; }
.client-action-card:hover .client-action-link { color: var(--pam-blue); }

.client-breadcrumb a { color: #6c757d; font-size: 0.9rem; text-decoration: none; display: inline-flex; align-items: center; }
.client-breadcrumb a:hover { color: var(--msf-blue-dark); }
.client-page-title { font-size: 1.5rem; font-weight: 700; color: var(--msf-blue-dark); margin-bottom: 0.5rem; }
.client-page-desc { color: #6c757d; margin-bottom: 1.5rem; }

.client-recent-item {
    background: #fff;
    border-radius: 12px;
    padding: 1.25rem 1.5rem;
    margin-bottom: 0.75rem;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
    border: 1px solid rgba(0, 0, 0, 0.04);
}
.client-recent-title { font-weight: 600; color: var(--msf-blue-dark); text-decoration: none; }
.client-recent-title:hover { color: var(--msf-red); }
.client-recent-ref { font-size: 0.85rem; color: #6c757d; margin-left: 0.5rem; }
.client-recent-date { font-size: 0.85rem; color: #6c757d; }

.client-application-card {
    background: #fff;
    border-radius: 14px;
    padding: 1.5rem 1.75rem;
    box-shadow: 0 2px 14px rgba(0, 0, 0, 0.06);
    border: 1px solid rgba(0, 0, 0, 0.04);
    transition: box-shadow 0.2s ease;
}
.client-application-card:hover { box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08); }
.client-application-title { font-size: 1.1rem; font-weight: 700; margin-bottom: 0.25rem; }
.client-application-title a { color: var(--msf-blue-dark); text-decoration: none; }
.client-application-title a:hover { color: var(--msf-red); }
.client-application-ref, .client-application-date, .client-application-cv { font-size: 0.9rem; color: #6c757d; }
.client-cv-link { color: var(--pam-blue); text-decoration: none; }
.client-cv-link:hover { text-decoration: underline; }

.client-status-badge { font-size: 0.8rem; font-weight: 600; padding: 0.4rem 0.75rem; border-radius: 8px; }
.client-status-success { background: rgba(25, 135, 84, 0.15); color: #198754; }
.client-status-warning { background: rgba(255, 193, 7, 0.2); color: #856404; }
.client-status-danger { background: rgba(220, 53, 69, 0.15); color: #dc3545; }
.client-status-info { background: rgba(13, 202, 240, 0.15); color: #0dcaf0; }

.btn-client-edit {
    display: inline-block;
    background: transparent;
    color: var(--msf-blue-dark);
    border: 2px solid var(--msf-blue-dark);
    padding: 0.4rem 1rem;
    border-radius: 8px;
    font-size: 0.85rem;
    font-weight: 600;
    text-decoration: none;
    transition: background 0.2s ease, color 0.2s ease;
}
.btn-client-edit:hover { background: var(--msf-blue-dark); color: #fff; }

.client-empty-state { text-align: center; background: #fff; border-radius: 16px; padding: 3rem 2rem; box-shadow: 0 2px 14px rgba(0, 0, 0, 0.06); }
.client-empty-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 80px;
    height: 80px;
    background: rgba(29, 28, 62, 0.08);
    color: var(--msf-blue-dark);
    border-radius: 50%;
    font-size: 2.5rem;
    margin-bottom: 1.25rem;
}
.client-empty-title { font-size: 1.25rem; font-weight: 700; color: var(--msf-blue-dark); margin-bottom: 0.5rem; }
.client-empty-text { color: #6c757d; margin-bottom: 1.5rem; max-width: 400px; margin-left: auto; margin-right: auto; }

@media (max-width: 767.98px) {
    .client-welcome-card { padding: 1.5rem 1.25rem; }
    .client-welcome-title { font-size: 1.4rem; }
    .client-action-card { padding: 1.25rem; }
    .client-application-card { padding: 1.25rem; }
}

/* Event Cards */
.card-event {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    background: #fff;
    border-radius: 12px;
}
.card-event:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 20px rgba(0,0,0,0.1) !important;
}
.event-date-box {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: var(--msf-blue-dark);
    color: #fff;
    padding: 0.5rem;
    border-radius: 8px;
    min-width: 60px;
    height: 60px;
}
.event-day {
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1;
}
.event-month {
    font-size: 0.75rem;
    text-transform: uppercase;
    font-weight: 600;
}
#evenements .section-heading {
    position: relative;
    padding-bottom: 0.5rem;
}
#evenements .section-heading::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 50px;
    height: 3px;
    background: var(--msf-yellow);
}
