.bkb-tag,
.bkb-badge,
.bkb-section-tag,
.elementor-element.bkb-tag,
.elementor-element.bkb-badge,
.elementor-element.bkb-section-tag,
[data-id="57e5c6c"],
[data-id="767dfd5"] {
    display: inline-flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 8px !important;
    margin-bottom: 12px !important;
    width: auto !important;
    max-width: fit-content !important;
}

/* Pastille verte carrée (Rectangle-3.png) */
.bkb-tag > .elementor-widget-icon,
.bkb-tag .bkb-tag-icon,
.bkb-badge > .elementor-widget-icon,
.bkb-badge .bkb-tag-icon,
.bkb-section-tag > .elementor-widget-icon,
.bkb-section-tag .bkb-tag-icon,
[data-id="57e5c6c"] [data-id="18ed937"],
[data-id="767dfd5"] [data-id="7941e49"],
[data-id="7941e49"],
[data-id="18ed937"] {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 8px !important;
    height: 8px !important;
    min-width: 8px !important;
    min-height: 8px !important;
    background-image: url('https://bkb.goavana.com/wp-content/uploads/2026/08/Rectangle-3.png') !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-color: transparent !important;
    border-radius: 0 !important;
    border: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.bkb-tag .elementor-icon,
.bkb-badge .elementor-icon,
.bkb-section-tag .elementor-icon,
[data-id="7941e49"] .elementor-icon,
[data-id="18ed937"] .elementor-icon {
    display: none !important;
}

/* Texte en majuscules gris */
.bkb-tag .elementor-heading-title,
.bkb-tag .bkb-tag-text,
.bkb-badge .elementor-heading-title,
.bkb-badge .bkb-tag-text,
.bkb-section-tag .elementor-heading-title,
.bkb-section-tag .bkb-tag-text,
[data-id="57e5c6c"] .elementor-heading-title,
[data-id="767dfd5"] [data-id="5469283"] .elementor-heading-title,
[data-id="5469283"] .elementor-heading-title {
    font-family: "Clash Grotesk", "Space Grotesk", Sans-serif !important;
    color: #7A8B86 !important; /* Gris sobre conforme à la maquette */
    font-size: 12px !important;
    font-weight: 500 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.08em !important;
    margin: 0 !important;
    line-height: 1 !important;
}

[data-id="cda9158"],
.bkb-section-title-wrapper {
    display: flex !important;
    flex-direction: column !important; /* Deux lignes : Nos (ligne 1) / Applications (ligne 2) */
    align-items: flex-start !important;
    gap: 0 !important;
    --gap: 0px !important;
    row-gap: 0 !important;
    --row-gap: 0px !important;
    margin-top: 0 !important;
    margin-bottom: 24px !important;
    padding: 0 !important;
}

[data-id="fd9490f"] .elementor-heading-title {
    margin: 0 !important;
    line-height: 0.95 !important;
    letter-spacing: -0.02em !important;
}

[data-id="87cace7"] .elementor-heading-title {
    font-weight: 500 !important;
    color: #142822 !important;
    margin: 0 !important;
    line-height: 0.95 !important;
    letter-spacing: -0.02em !important;
}

/* 2. Conteneur parent Flexbox (les 4 cartes côte à côte) */
.e-con.bkb-apps-accordion,
.bkb-apps-accordion {
    display: flex !important;
    flex-direction: row !important;
    align-items: stretch !important;
    gap: 16px !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

/* 3. Chaque carte (au repos : fond/cadre gris clair #F6F7F7, sans border-radius) */
.bkb-apps-accordion > .e-con,
.bkb-apps-accordion > .elementor-element.e-con,
.bkb-app-card {
    position: relative !important;
    border-radius: 0 !important; /* Aucune courbure */
    overflow: hidden !important;
    min-height: 540px !important;
    height: 540px !important;
    background-color: #F6F7F7 !important; /* Cadre gris clair au repos */
    flex: 1 1 0% !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    cursor: pointer !important;
    box-sizing: border-box !important;
    padding: 0 !important;
    transition: flex 0.8s cubic-bezier(0.22, 1, 0.36, 1),
                background-color 0.7s cubic-bezier(0.22, 1, 0.36, 1) !important;
}

/* 4. Badge Numéro (01, 02, 03, 04) - Fixe en haut à gauche */
.bkb-apps-accordion .bkb-app-badge,
.bkb-apps-accordion > .e-con > .e-con[data-settings*="absolute"],
.bkb-apps-accordion > .e-con .elementor-element[data-settings*="absolute"],
.bkb-apps-accordion > .e-con > .e-con:first-child {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    z-index: 20 !important;
    width: 44px !important;
    height: 44px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background-color: #142822 !important; /* Vert foncé/noir au repos */
    border-radius: 0 !important; /* Sans courbure */
    margin: 0 !important;
    padding: 0 !important;
    transition: background-color 0.7s cubic-bezier(0.22, 1, 0.36, 1), color 0.7s cubic-bezier(0.22, 1, 0.36, 1) !important;
}

.bkb-apps-accordion .bkb-app-badge h2,
.bkb-apps-accordion .bkb-app-badge .elementor-heading-title,
.bkb-apps-accordion > .e-con > .e-con[data-settings*="absolute"] .elementor-heading-title,
.bkb-apps-accordion > .e-con > .e-con:first-child .elementor-heading-title {
    margin: 0 !important;
    padding: 0 !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    color: #ffffff !important; /* Chiffre blanc au repos */
    line-height: 1 !important;
    transition: color 0.7s cubic-bezier(0.22, 1, 0.36, 1) !important;
}

/* 5. Image de chaque carte (au repos : insérée avec bordure/cadre gris #F6F7F7) */
.bkb-apps-accordion > .e-con .elementor-widget-image,
.bkb-apps-accordion > .e-con .bkb-app-img,
.bkb-apps-accordion > .e-con > .e-con:nth-child(2),
.bkb-apps-accordion > .e-con > .e-con:has(.elementor-widget-image) {
    position: absolute !important;
    top: 10px !important;
    bottom: 10px !important;
    left: 10px !important;
    right: 10px !important;
    width: calc(100% - 20px) !important;
    height: calc(100% - 20px) !important;
    z-index: 1 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    border-radius: 0 !important; /* Aucune courbure */
    transition: height 0.8s cubic-bezier(0.22, 1, 0.36, 1), 
                margin 0.8s cubic-bezier(0.22, 1, 0.36, 1),
                top 0.8s cubic-bezier(0.22, 1, 0.36, 1),
                bottom 0.8s cubic-bezier(0.22, 1, 0.36, 1),
                left 0.8s cubic-bezier(0.22, 1, 0.36, 1),
                right 0.8s cubic-bezier(0.22, 1, 0.36, 1),
                width 0.8s cubic-bezier(0.22, 1, 0.36, 1),
                position 0.8s cubic-bezier(0.22, 1, 0.36, 1) !important;
}

.bkb-apps-accordion > .e-con .elementor-widget-image img,
.bkb-apps-accordion > .e-con .bkb-app-img img,
.bkb-apps-accordion > .e-con > .e-con:nth-child(2) img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
    border-radius: 0 !important; /* Aucune courbure */
    filter: grayscale(100%) !important; /* Noir et blanc au repos */
    transition: transform 0.8s cubic-bezier(0.22, 1, 0.36, 1),
                filter 0.8s cubic-bezier(0.22, 1, 0.36, 1) !important;
}

/* Pas de voile sombre */
.bkb-apps-accordion > .e-con::after {
    display: none !important;
}

/* 6. Conteneur Texte (Titre, Paragraphe, Bouton) - Colonne verticale stricte */
.bkb-apps-accordion .bkb-app-content,
.bkb-apps-accordion > .e-con > .e-con:last-child:not([data-settings*="absolute"]),
.bkb-apps-accordion [data-id="b5c3efa"],
.bkb-apps-accordion [data-id="cb3b438"],
.bkb-apps-accordion [data-id="3ab0072"],
.bkb-apps-accordion [data-id="4476bd1"] {
    position: relative !important;
    z-index: 10 !important;
    margin-top: auto !important;
    padding: 12px 28px 20px 28px !important; /* Optimisé pour laisser la place au CTA sur toutes les cartes */
    box-sizing: border-box !important;
    opacity: 0 !important;
    max-height: 0 !important;
    overflow: hidden !important;
    transform: translateY(20px) !important;
    pointer-events: none !important;
    border-radius: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    width: 100% !important;
    max-width: 100% !important;
    transition: opacity 0.5s cubic-bezier(0.22, 1, 0.36, 1), transform 0.5s cubic-bezier(0.22, 1, 0.36, 1), max-height 0.75s cubic-bezier(0.22, 1, 0.36, 1) !important;
}

/* Titre, Paragraphe du contenu */
.bkb-apps-accordion .bkb-app-content .elementor-widget-heading .elementor-heading-title,
.bkb-apps-accordion > .e-con > .e-con:last-child .elementor-widget-heading .elementor-heading-title,
.bkb-apps-accordion [data-id="b5c3efa"] .elementor-heading-title,
.bkb-apps-accordion [data-id="cb3b438"] .elementor-heading-title,
.bkb-apps-accordion [data-id="3ab0072"] .elementor-heading-title,
.bkb-apps-accordion [data-id="4476bd1"] .elementor-heading-title {
    color: #ffffff !important;
    font-size: 32px !important;
    font-weight: 700 !important;
    margin: 0 0 14px 0 !important;
    line-height: 1.1 !important;
    letter-spacing: -0.02em !important;
    width: 100% !important;
}

.bkb-apps-accordion .bkb-app-content .elementor-widget-text-editor p,
.bkb-apps-accordion > .e-con > .e-con:last-child .elementor-widget-text-editor p,
.bkb-apps-accordion [data-id="b5c3efa"] p,
.bkb-apps-accordion [data-id="cb3b438"] p,
.bkb-apps-accordion [data-id="3ab0072"] p,
.bkb-apps-accordion [data-id="4476bd1"] p {
    color: rgba(255, 255, 255, 0.72) !important;
    font-size: 15px !important;
    font-weight: 400 !important; /* Pas en gras, conformément à la maquette */
    line-height: 1.5 !important;
    margin: 0 0 16px 0 !important; /* Espacement équilibré pour afficher le CTA */
    width: 100% !important;
}

/* 7. Bouton CTA dans les cartes (Style épuré "Découvrir" + cercle flèche, aucun fond) */
.bkb-apps-accordion .bkb-cta,
.bkb-apps-accordion [data-id="689fe3e"],
.bkb-apps-accordion [data-id="1627ec7"],
.bkb-apps-accordion [data-id="bc1c8a6"],
.bkb-apps-accordion [data-id="035f9d2"],
.bkb-apps-accordion .elementor-element-689fe3e,
.bkb-apps-accordion .elementor-element-1627ec7,
.bkb-apps-accordion .elementor-element-bc1c8a6,
.bkb-apps-accordion .elementor-element-035f9d2 {
    display: inline-flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 12px !important;
    width: auto !important;
    max-width: fit-content !important;
    margin: 0 !important;
    padding: 2px 0 !important;
    cursor: pointer !important;
    background: transparent !important;
    background-color: transparent !important;
    box-shadow: none !important;
    border: none !important;
    overflow: visible !important;
}

/* Suppression totale du fond (background) sur tous les conteneurs, widgets et textes Découvrir */
.bkb-apps-accordion [data-id="689fe3e"]:not(.elementor-motion-effects-element-type-background),
.bkb-apps-accordion [data-id="1627ec7"]:not(.elementor-motion-effects-element-type-background),
.bkb-apps-accordion [data-id="bc1c8a6"]:not(.elementor-motion-effects-element-type-background),
.bkb-apps-accordion [data-id="035f9d2"]:not(.elementor-motion-effects-element-type-background),
.bkb-apps-accordion .elementor-element-689fe3e:not(.elementor-motion-effects-element-type-background),
.bkb-apps-accordion .elementor-element-1627ec7:not(.elementor-motion-effects-element-type-background),
.bkb-apps-accordion .elementor-element-bc1c8a6:not(.elementor-motion-effects-element-type-background),
.bkb-apps-accordion .elementor-element-035f9d2:not(.elementor-motion-effects-element-type-background),
.bkb-apps-accordion [data-id="689fe3e"] > .elementor-motion-effects-container > .elementor-motion-effects-layer,
.bkb-apps-accordion [data-id="1627ec7"] > .elementor-motion-effects-container > .elementor-motion-effects-layer,
.bkb-apps-accordion [data-id="bc1c8a6"] > .elementor-motion-effects-container > .elementor-motion-effects-layer,
.bkb-apps-accordion [data-id="035f9d2"] > .elementor-motion-effects-container > .elementor-motion-effects-layer,
.bkb-apps-accordion [data-id="ba6d541"],
.bkb-apps-accordion [data-id="ddcf4d2"],
.bkb-apps-accordion [data-id="02b6881"],
.bkb-apps-accordion [data-id="d765a1f"],
.bkb-apps-accordion .elementor-element-ba6d541,
.bkb-apps-accordion .elementor-element-ddcf4d2,
.bkb-apps-accordion .elementor-element-02b6881,
.bkb-apps-accordion .elementor-element-d765a1f,
.bkb-apps-accordion .elementor-widget-button,
.bkb-apps-accordion .elementor-widget-button .elementor-widget-container,
.bkb-apps-accordion .elementor-button-wrapper,
.bkb-apps-accordion .elementor-button,
.bkb-apps-accordion .elementor-button-content-wrapper,
.bkb-apps-accordion .elementor-button-text {
    background: transparent !important;
    background-color: transparent !important;
    box-shadow: none !important;
    border: none !important;
}

.bkb-apps-accordion [data-id="ba6d541"],
.bkb-apps-accordion [data-id="ddcf4d2"],
.bkb-apps-accordion [data-id="02b6881"],
.bkb-apps-accordion [data-id="d765a1f"],
.bkb-apps-accordion .elementor-widget-button {
    margin: 0 !important;
    padding: 0 !important;
    width: auto !important;
    min-width: 0 !important;
}

.bkb-apps-accordion .elementor-widget-button .elementor-button {
    padding: 0 !important;
    background: transparent !important;
    background-color: transparent !important;
    color: #ffffff !important;
    text-decoration: none !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    display: inline-flex !important;
    align-items: center !important;
}

.bkb-apps-accordion .elementor-widget-button .elementor-button-text {
    background: transparent !important;
    background-color: transparent !important;
    color: #ffffff !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    white-space: nowrap !important;
}

.bkb-apps-accordion .elementor-widget-button .elementor-button:hover,
.bkb-apps-accordion .elementor-widget-button .elementor-button:focus,
.bkb-apps-accordion .elementor-widget-button .elementor-button:active {
    background: transparent !important;
    background-color: transparent !important;
    box-shadow: none !important;
}

/* Conteneur de l'icône flèche (cercle fin transparent) */
.bkb-apps-accordion .bkb-cta-icon,
.bkb-apps-accordion [data-id="5bf0def"],
.bkb-apps-accordion [data-id="86321b5"],
.bkb-apps-accordion [data-id="0f19f60"],
.bkb-apps-accordion [data-id="a013913"],
.bkb-apps-accordion .elementor-element-5bf0def,
.bkb-apps-accordion .elementor-element-86321b5,
.bkb-apps-accordion .elementor-element-0f19f60,
.bkb-apps-accordion .elementor-element-a013913,
.bkb-apps-accordion [data-id="5bf0def"]:not(.elementor-motion-effects-element-type-background),
.bkb-apps-accordion [data-id="86321b5"]:not(.elementor-motion-effects-element-type-background),
.bkb-apps-accordion [data-id="0f19f60"]:not(.elementor-motion-effects-element-type-background),
.bkb-apps-accordion [data-id="a013913"]:not(.elementor-motion-effects-element-type-background),
.bkb-apps-accordion [data-id="5bf0def"] > .elementor-motion-effects-container > .elementor-motion-effects-layer,
.bkb-apps-accordion [data-id="86321b5"] > .elementor-motion-effects-container > .elementor-motion-effects-layer,
.bkb-apps-accordion [data-id="0f19f60"] > .elementor-motion-effects-container > .elementor-motion-effects-layer,
.bkb-apps-accordion [data-id="a013913"] > .elementor-motion-effects-container > .elementor-motion-effects-layer {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: transparent !important;
    background-color: transparent !important;
    border: 1.5px solid rgba(255, 255, 255, 0.4) !important;
    border-radius: 50% !important;
    width: 24px !important;
    min-width: 24px !important;
    max-width: 24px !important;
    height: 24px !important;
    flex: 0 0 24px !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
    overflow: visible !important;
    transition: border-color 0.3s ease, background-color 0.3s ease, transform 0.3s ease !important;
}

/* Neutralisation des marges/paddings Elementor internes dans le cercle */
.bkb-apps-accordion .bkb-cta-icon .elementor-widget,
.bkb-apps-accordion .bkb-cta-icon .elementor-widget-container,
.bkb-apps-accordion .bkb-cta-icon .elementor-icon-wrapper,
.bkb-apps-accordion .bkb-cta-icon .elementor-icon,
.bkb-apps-accordion [data-id="5bf0def"] > div,
.bkb-apps-accordion [data-id="86321b5"] > div,
.bkb-apps-accordion [data-id="0f19f60"] > div,
.bkb-apps-accordion [data-id="a013913"] > div {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    background: transparent !important;
    box-shadow: none !important;
    line-height: 0 !important;
    overflow: visible !important;
}

.bkb-apps-accordion .bkb-cta-icon svg,
.bkb-apps-accordion [data-id="5bf0def"] svg,
.bkb-apps-accordion [data-id="86321b5"] svg,
.bkb-apps-accordion [data-id="0f19f60"] svg,
.bkb-apps-accordion [data-id="a013913"] svg {
    fill: #ffffff !important;
    color: #ffffff !important;
    width: 9px !important;
    height: 9px !important;
    display: block !important;
    transition: transform 0.3s cubic-bezier(0.25, 1, 0.5, 1) !important;
}

.bkb-apps-accordion .bkb-cta:hover .bkb-cta-icon,
.bkb-apps-accordion [data-id="689fe3e"]:hover [data-id="5bf0def"],
.bkb-apps-accordion [data-id="1627ec7"]:hover [data-id="86321b5"],
.bkb-apps-accordion [data-id="bc1c8a6"]:hover [data-id="0f19f60"],
.bkb-apps-accordion [data-id="035f9d2"]:hover [data-id="a013913"] {
    background-color: rgba(1, 237, 109, 0.1) !important;
    transform: translateX(2px) !important;
}

.bkb-apps-accordion .bkb-cta:hover .bkb-cta-icon svg,
.bkb-apps-accordion [data-id="689fe3e"]:hover [data-id="5bf0def"] svg,
.bkb-apps-accordion [data-id="1627ec7"]:hover [data-id="86321b5"] svg,
.bkb-apps-accordion [data-id="bc1c8a6"]:hover [data-id="0f19f60"] svg,
.bkb-apps-accordion [data-id="035f9d2"]:hover [data-id="a013913"] svg {
    transform: translateX(2px) !important;
}

/* ==========================================================================
   INTERACTIONS & ANIMATIONS DE L'ACCORDÉON (DESKTOP >= 901px)
   ========================================================================== */
@media (min-width: 901px) {

    /* --- ÉTAT OUVERT (Carte 1 au repos OU n'importe quelle carte survolée) --- */
    .bkb-apps-accordion:not(:hover) > .e-con:first-child,
    .bkb-apps-accordion > .e-con:hover {
        flex: 0 0 384px !important;
        background-color: #142822 !important; /* Fond vert sombre BKB */
        border-radius: 0 !important;
    }

    /* L'image sur la carte ouverte : se positionne en haut avec 14px de marge, agrandie et 0 radius */
    .bkb-apps-accordion:not(:hover) > .e-con:first-child .elementor-widget-image,
    .bkb-apps-accordion:not(:hover) > .e-con:first-child .bkb-app-img,
    .bkb-apps-accordion:not(:hover) > .e-con:first-child > .e-con:nth-child(2),
    .bkb-apps-accordion:not(:hover) > .e-con:first-child > .e-con:has(.elementor-widget-image),
    .bkb-apps-accordion > .e-con:hover .elementor-widget-image,
    .bkb-apps-accordion > .e-con:hover .bkb-app-img,
    .bkb-apps-accordion > .e-con:hover > .e-con:nth-child(2),
    .bkb-apps-accordion > .e-con:hover > .e-con:has(.elementor-widget-image) {
        position: relative !important;
        height: 200px !important;
        width: calc(100% - 40px) !important;
        margin: 16px 20px 10px 20px !important;
        border-radius: 0 !important;
        top: auto !important;
        bottom: auto !important;
        left: auto !important;
        right: auto !important;
        inset: auto !important;
        overflow: hidden !important;
    }

    .bkb-apps-accordion:not(:hover) > .e-con:first-child > .e-con:nth-child(2) .elementor-widget-image,
    .bkb-apps-accordion:not(:hover) > .e-con:first-child > .e-con:has(.elementor-widget-image) .elementor-widget-image,
    .bkb-apps-accordion > .e-con:hover > .e-con:nth-child(2) .elementor-widget-image,
    .bkb-apps-accordion > .e-con:hover > .e-con:has(.elementor-widget-image) .elementor-widget-image {
        position: relative !important;
        width: 100% !important;
        height: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        inset: auto !important;
    }

    .bkb-apps-accordion:not(:hover) > .e-con:first-child .elementor-widget-image img,
    .bkb-apps-accordion:not(:hover) > .e-con:first-child .bkb-app-img img,
    .bkb-apps-accordion:not(:hover) > .e-con:first-child > .e-con:nth-child(2) img,
    .bkb-apps-accordion > .e-con:hover .elementor-widget-image img,
    .bkb-apps-accordion > .e-con:hover .bkb-app-img img,
    .bkb-apps-accordion > .e-con:hover > .e-con:nth-child(2) img {
        border-radius: 0 !important;
        transform: scale(1.03) !important;
        filter: grayscale(0%) !important; /* Image en couleur sur la carte active */
    }

    /* Le contenu texte apparaît en fondu */
    .bkb-apps-accordion:not(:hover) > .e-con:first-child .bkb-app-content,
    .bkb-apps-accordion:not(:hover) > .e-con:first-child > .e-con:last-child:not([data-settings*="absolute"]),
    .bkb-apps-accordion:not(:hover) > .e-con:first-child [data-id="b5c3efa"],
    .bkb-apps-accordion > .e-con:hover .bkb-app-content,
    .bkb-apps-accordion > .e-con:hover > .e-con:last-child:not([data-settings*="absolute"]),
    .bkb-apps-accordion > .e-con:hover [data-id="b5c3efa"],
    .bkb-apps-accordion > .e-con:hover [data-id="cb3b438"],
    .bkb-apps-accordion > .e-con:hover [data-id="3ab0072"],
    .bkb-apps-accordion > .e-con:hover [data-id="4476bd1"] {
        opacity: 1 !important;
        max-height: 380px !important;
        transform: translateY(0) !important;
        pointer-events: auto !important;
        transition: opacity 0.7s cubic-bezier(0.22, 1, 0.36, 1) 0.12s, 
                    transform 0.7s cubic-bezier(0.22, 1, 0.36, 1) 0.12s, 
                    max-height 0.8s cubic-bezier(0.22, 1, 0.36, 1) !important;
    }

    /* Le badge passe en vert néon BKB (reste toujours à top: 0; left: 0) */
    .bkb-apps-accordion:not(:hover) > .e-con:first-child .bkb-app-badge,
    .bkb-apps-accordion:not(:hover) > .e-con:first-child > .e-con[data-settings*="absolute"],
    .bkb-apps-accordion:not(:hover) > .e-con:first-child > .e-con:first-child,
    .bkb-apps-accordion > .e-con:hover .bkb-app-badge,
    .bkb-apps-accordion > .e-con:hover > .e-con[data-settings*="absolute"],
    .bkb-apps-accordion > .e-con:hover > .e-con:first-child {
        background-color: #01ED6D !important;
        border-radius: 0 !important;
    }

    .bkb-apps-accordion:not(:hover) > .e-con:first-child .bkb-app-badge h2,
    .bkb-apps-accordion:not(:hover) > .e-con:first-child .bkb-app-badge .elementor-heading-title,
    .bkb-apps-accordion:not(:hover) > .e-con:first-child > .e-con[data-settings*="absolute"] .elementor-heading-title,
    .bkb-apps-accordion:not(:hover) > .e-con:first-child > .e-con:first-child .elementor-heading-title,
    .bkb-apps-accordion > .e-con:hover .bkb-app-badge h2,
    .bkb-apps-accordion > .e-con:hover .bkb-app-badge .elementor-heading-title,
    .bkb-apps-accordion > .e-con:hover > .e-con[data-settings*="absolute"] .elementor-heading-title,
    .bkb-apps-accordion > .e-con:hover > .e-con:first-child .elementor-heading-title {
        color: #0c1d18 !important;
    }

    /* --- REPLI DE LA 1ÈRE CARTE quand on survole les cartes 2, 3 ou 4 --- */
    .bkb-apps-accordion:hover > .e-con:first-child:not(:hover) {
        flex: 1 1 0% !important;
        background-color: #F6F7F7 !important; /* Devient grise comme les autres cartes au repos */
        border-radius: 0 !important;
    }

    .bkb-apps-accordion:hover > .e-con:first-child:not(:hover) .elementor-widget-image,
    .bkb-apps-accordion:hover > .e-con:first-child:not(:hover) .bkb-app-img,
    .bkb-apps-accordion:hover > .e-con:first-child:not(:hover) > .e-con:nth-child(2),
    .bkb-apps-accordion:hover > .e-con:first-child:not(:hover) > .e-con:has(.elementor-widget-image) {
        position: absolute !important;
        top: 10px !important;
        bottom: 10px !important;
        left: 10px !important;
        right: 10px !important;
        width: calc(100% - 20px) !important;
        height: calc(100% - 20px) !important;
        margin: 0 !important;
        border-radius: 0 !important;
        inset: 10px !important;
    }

    .bkb-apps-accordion:hover > .e-con:first-child:not(:hover) .elementor-widget-image img,
    .bkb-apps-accordion:hover > .e-con:first-child:not(:hover) .bkb-app-img img,
    .bkb-apps-accordion:hover > .e-con:first-child:not(:hover) > .e-con:nth-child(2) img {
        border-radius: 0 !important;
        transform: scale(1) !important;
        filter: grayscale(100%) !important; /* Retour en noir et blanc quand replié */
    }

    .bkb-apps-accordion:hover > .e-con:first-child:not(:hover) .bkb-app-content,
    .bkb-apps-accordion:hover > .e-con:first-child:not(:hover) > .e-con:last-child:not([data-settings*="absolute"]) {
        opacity: 0 !important;
        max-height: 0 !important;
        transform: translateY(20px) !important;
        pointer-events: none !important;
        transition: opacity 0.4s cubic-bezier(0.22, 1, 0.36, 1), 
                    transform 0.4s cubic-bezier(0.22, 1, 0.36, 1), 
                    max-height 0.6s cubic-bezier(0.22, 1, 0.36, 1) !important;
    }

    .bkb-apps-accordion:hover > .e-con:first-child:not(:hover) .bkb-app-badge,
    .bkb-apps-accordion:hover > .e-con:first-child:not(:hover) > .e-con[data-settings*="absolute"],
    .bkb-apps-accordion:hover > .e-con:first-child:not(:hover) > .e-con:first-child {
        background-color: #142822 !important;
        border-radius: 0 !important;
    }

    .bkb-apps-accordion:hover > .e-con:first-child:not(:hover) .bkb-app-badge h2,
    .bkb-apps-accordion:hover > .e-con:first-child:not(:hover) .bkb-app-badge .elementor-heading-title,
    .bkb-apps-accordion:hover > .e-con:first-child:not(:hover) > .e-con[data-settings*="absolute"] .elementor-heading-title,
    .bkb-apps-accordion:hover > .e-con:first-child:not(:hover) > .e-con:first-child .elementor-heading-title {
        color: #ffffff !important;
    }
}

/* ==========================================================================
   RESPONSIVE (Tablettes & Mobiles < 900px) : Option 1 - Cartes intégrées
   Toutes les cartes sont ouvertes, photos en couleur, typographie optimisée,
   aucun conflit ni repli au toucher.
   ========================================================================== */
@media (max-width: 900px) {
    .e-con.bkb-apps-accordion,
    .bkb-apps-accordion {
        flex-direction: column !important;
        gap: 24px !important;
        width: 100% !important;
    }

    /* Cartes en pleine largeur, fond BKB vert foncé permanent */
    .bkb-apps-accordion > .e-con,
    .bkb-apps-accordion > .elementor-element.e-con,
    .bkb-app-card,
    .bkb-apps-accordion:not(:hover) > .e-con:first-child,
    .bkb-apps-accordion > .e-con:hover {
        position: relative !important;
        flex: none !important;
        width: 100% !important;
        max-width: 100% !important;
        min-height: auto !important;
        height: auto !important;
        background-color: #142822 !important;
        border-radius: 0 !important;
        padding-bottom: 24px !important;
        cursor: default !important;
        transition: none !important;
    }

    /* Image de chaque carte : bannière en couleur intégrée en haut */
    .bkb-apps-accordion > .e-con .elementor-widget-image,
    .bkb-apps-accordion > .e-con .bkb-app-img,
    .bkb-apps-accordion > .e-con > .e-con:nth-child(2),
    .bkb-apps-accordion > .e-con > .e-con:has(.elementor-widget-image) {
        position: relative !important;
        height: 200px !important;
        min-height: 200px !important;
        max-height: 200px !important;
        width: calc(100% - 32px) !important;
        margin: 16px 16px 12px 16px !important;
        border-radius: 0 !important;
        inset: auto !important;
        overflow: hidden !important;
    }

    .bkb-apps-accordion > .e-con > .e-con:nth-child(2) .elementor-widget-image,
    .bkb-apps-accordion > .e-con > .e-con:has(.elementor-widget-image) .elementor-widget-image {
        position: relative !important;
        width: 100% !important;
        height: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        inset: auto !important;
    }

    .bkb-apps-accordion > .e-con .elementor-widget-image img,
    .bkb-apps-accordion > .e-con .bkb-app-img img,
    .bkb-apps-accordion > .e-con > .e-con:nth-child(2) img {
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
        border-radius: 0 !important;
        transform: none !important;
        filter: none !important;
        -webkit-filter: grayscale(0%) !important;
        filter: grayscale(0%) !important; /* Images toujours en couleur */
    }

    /* Badge Numéro vert néon fixé en haut à gauche */
    .bkb-apps-accordion .bkb-app-badge,
    .bkb-apps-accordion > .e-con > .e-con[data-settings*="absolute"],
    .bkb-apps-accordion > .e-con .elementor-element[data-settings*="absolute"],
    .bkb-apps-accordion > .e-con > .e-con:first-child {
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        z-index: 20 !important;
        width: 44px !important;
        height: 44px !important;
        background-color: #01ED6D !important;
        border-radius: 0 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    .bkb-apps-accordion .bkb-app-badge h2,
    .bkb-apps-accordion .bkb-app-badge .elementor-heading-title,
    .bkb-apps-accordion > .e-con > .e-con[data-settings*="absolute"] .elementor-heading-title,
    .bkb-apps-accordion > .e-con > .e-con:first-child .elementor-heading-title {
        color: #0c1d18 !important;
        font-size: 14px !important;
        font-weight: 700 !important;
        line-height: 1 !important;
    }

    /* Contenu texte : toujours visible et bien proportionné */
    .bkb-apps-accordion .bkb-app-content,
    .bkb-apps-accordion > .e-con > .e-con:last-child:not([data-settings*="absolute"]),
    .bkb-apps-accordion [data-id="b5c3efa"],
    .bkb-apps-accordion [data-id="cb3b438"],
    .bkb-apps-accordion [data-id="3ab0072"],
    .bkb-apps-accordion [data-id="4476bd1"] {
        position: relative !important;
        z-index: 10 !important;
        opacity: 1 !important;
        max-height: none !important;
        overflow: visible !important;
        transform: none !important;
        pointer-events: auto !important;
        border-radius: 0 !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        width: 100% !important;
        max-width: 100% !important;
        padding: 8px 16px 0 16px !important;
        box-sizing: border-box !important;
        margin-top: 0 !important;
        transition: none !important;
    }

    /* Titres adaptés aux largeurs mobiles */
    .bkb-apps-accordion .bkb-app-content .elementor-widget-heading .elementor-heading-title,
    .bkb-apps-accordion > .e-con > .e-con:last-child .elementor-widget-heading .elementor-heading-title,
    .bkb-apps-accordion [data-id="b5c3efa"] .elementor-heading-title,
    .bkb-apps-accordion [data-id="cb3b438"] .elementor-heading-title,
    .bkb-apps-accordion [data-id="3ab0072"] .elementor-heading-title,
    .bkb-apps-accordion [data-id="4476bd1"] .elementor-heading-title {
        font-size: 22px !important;
        line-height: 1.2 !important;
        margin: 0 0 10px 0 !important;
        color: #ffffff !important;
        letter-spacing: -0.01em !important;
    }

    /* Paragraphes aérés */
    .bkb-apps-accordion .bkb-app-content .elementor-widget-text-editor p,
    .bkb-apps-accordion > .e-con > .e-con:last-child .elementor-widget-text-editor p,
    .bkb-apps-accordion [data-id="b5c3efa"] p,
    .bkb-apps-accordion [data-id="cb3b438"] p,
    .bkb-apps-accordion [data-id="3ab0072"] p,
    .bkb-apps-accordion [data-id="4476bd1"] p {
        font-size: 14px !important;
        line-height: 1.5 !important;
        color: rgba(255, 255, 255, 0.75) !important;
        margin: 0 0 16px 0 !important;
    }

    /* Bouton CTA "Découvrir" */
    .bkb-apps-accordion .bkb-cta,
    .bkb-apps-accordion [data-id="689fe3e"],
    .bkb-apps-accordion [data-id="1627ec7"],
    .bkb-apps-accordion [data-id="bc1c8a6"],
    .bkb-apps-accordion [data-id="035f9d2"],
    .bkb-apps-accordion .elementor-element-689fe3e,
    .bkb-apps-accordion .elementor-element-1627ec7,
    .bkb-apps-accordion .elementor-element-bc1c8a6,
    .bkb-apps-accordion .elementor-element-035f9d2 {
        display: inline-flex !important;
        align-items: center !important;
        gap: 10px !important;
        margin: 0 !important;
        padding: 4px 0 !important;
    }
}

/* ==========================================================================
   PETITS SMARTPHONES (<= 480px)
   ========================================================================== */
@media (max-width: 480px) {
    .bkb-apps-accordion {
        gap: 20px !important;
    }

    .bkb-apps-accordion > .e-con,
    .bkb-apps-accordion > .elementor-element.e-con,
    .bkb-app-card {
        padding-bottom: 20px !important;
    }

    .bkb-apps-accordion > .e-con .elementor-widget-image,
    .bkb-apps-accordion > .e-con .bkb-app-img,
    .bkb-apps-accordion > .e-con > .e-con:nth-child(2),
    .bkb-apps-accordion > .e-con > .e-con:has(.elementor-widget-image) {
        height: 165px !important;
        min-height: 165px !important;
        max-height: 165px !important;
        width: calc(100% - 24px) !important;
        margin: 12px 12px 10px 12px !important;
    }

    .bkb-apps-accordion .bkb-app-content,
    .bkb-apps-accordion > .e-con > .e-con:last-child:not([data-settings*="absolute"]),
    .bkb-apps-accordion [data-id="b5c3efa"],
    .bkb-apps-accordion [data-id="cb3b438"],
    .bkb-apps-accordion [data-id="3ab0072"],
    .bkb-apps-accordion [data-id="4476bd1"] {
        padding: 6px 12px 0 12px !important;
    }

    .bkb-apps-accordion .bkb-app-content .elementor-widget-heading .elementor-heading-title,
    .bkb-apps-accordion > .e-con > .e-con:last-child .elementor-widget-heading .elementor-heading-title,
    .bkb-apps-accordion [data-id="b5c3efa"] .elementor-heading-title,
    .bkb-apps-accordion [data-id="cb3b438"] .elementor-heading-title,
    .bkb-apps-accordion [data-id="3ab0072"] .elementor-heading-title,
    .bkb-apps-accordion [data-id="4476bd1"] .elementor-heading-title {
        font-size: 20px !important;
    }
}