/* ============================================================
   1. HEADER : LOGO, MENU ET RECHERCHE (STABLE)
   ============================================================ */
#header .header-top {
    background: #ffffff !important;
    border-bottom: 4px solid #ff0000 !important;
    padding: 10px 0 !important;
}

#header .header-top .container > .row {
    display: flex !important;
    align-items: center !important; 
    justify-content: space-between !important;
    flex-wrap: wrap !important;
}

#_desktop_logo img {
    height: 130px !important;
    width: auto !important;
    object-fit: contain !important;
    max-width: none !important;
}

#header .top-menu a {
    background: #f4f4f4 !important;
    color: #333333 !important;
    font-weight: 700 !important;
    text-transform: uppercase;
    font-size: 13px !important;
    padding: 15px 20px !important;
    border-radius: 6px !important;
    border-bottom: 4px solid #ddd !important;
    margin-left: 8px !important;
}

#search_widget {
    flex: 0 0 100% !important;
    margin: 20px auto 10px auto !important;
    max-width: 850px !important;
}

/* ============================================================
   2. ACCUEIL : FOND BLANC ET BENTO STYLISÉ
   ============================================================ */
/* On passe tout le fond du site en blanc pour supprimer le gris fade */
#wrapper, #content, .container {
    background-color: #ffffff !important;
}

.bento-grille-1001 {
    display: grid !important;
    grid-template-columns: 2fr 1fr !important;
    grid-gap: 15px !important;
    max-width: 1100px !important;
    margin: 40px auto !important;
    position: relative !important;
    /* Ombre légère pour décoller le bento du fond blanc */
    filter: drop-shadow(0 10px 20px rgba(0,0,0,0.05)) !important;
}

.bento-main-blue {
    background: #0062ff !important;
    border-radius: 15px !important;
    padding: 40px !important;
    position: relative !important;
    min-height: 420px !important;
    color: #ffffff !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
}

.ant-bento-img {
    height: 320px !important;
    width: auto !important;
    position: absolute !important;
    right: -220px !important;
    bottom: 10px !important;
    z-index: 99 !important;
}

.bento-right-stack {
    display: flex !important;
    flex-direction: column !important;
    gap: 15px !important;
}

.box-small {
    flex: 1 !important;
    border-radius: 12px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-transform: uppercase !important;
    font-weight: 900 !important;
    text-decoration: none !important;
}

/* COULEURS MARQUÉES */
.red-box { 
    background: #ff0000 !important; 
    color: #ffffff !important; 
}

.grey-box { 
    background: #4a4a4a !important; /* Gris anthracite plus marqué pour le contraste */
    color: #ffffff !important; 
    border: none !important;
}

/* ============================================================
   3. RESPONSIVE MOBILE
   ============================================================ */
@media (max-width: 767px) {
    #header .top-menu { flex-wrap: wrap !important; justify-content: center !important; }
    #_desktop_logo img { height: 100px !important; }
    .bento-grille-1001 { display: flex !important; flex-direction: column !important; width: 95% !important; }
    .ant-bento-img { position: relative !important; right: 0 !important; height: 150px !important; margin: 10px auto !important; display: block !important; }
}