﻿.whyus-section {
    display: flex;
    align-items: center;
    position: relative;
    overflow: hidden;
    width: 100%;
    margin: auto; /* centrer horizontalement */
    background-color: var(--black);
    color: var(--white);
    margin-top: -1px;
}

/* === Mobile par défaut (<768px) === */
.whyus-section {
    justify-content: center; /* centre horizontalement */
    padding: 1rem; /* un peu de marge intérieure */
}

    .whyus-section .highlight {
        position: relative;
        display: inline-block;
    }

        .whyus-section .highlight::after {
            content: "";
            position: absolute;
            top: 80%;
            left: 0;
            width: 100%;
            height: var(--base-space-5);
            background-repeat: no-repeat;
            background-size: contain;
            transform: rotate(-2deg);
            background-image: url(data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMjM0IDE0IiBmaWxsPSJub25lIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgo8cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTAuNDcyMTY4IDIuMDU2ODNDMC40NzIxNjggMC45MjA4NzIgMS4zOTMwNCAwIDIuNTI4OTkgMEMzNy40OTU5IDAgNzIuNDU4NSAwLjI3MDAyOCAxMDcuNDEyIDAuNTM5OTg1TDEwNy40MTYgMC41NDAwMTlDMTQyLjM3NCAwLjgxMDAwOCAxNzcuMzIyIDEuMDc5OTIgMjEyLjI3MyAxLjA3OTkySDIyMS45ODlDMjIxLjk4OSAxLjA3OTkyIDIyMS45ODkgMS4wODEyIDIyMS45ODkgMS4wODM3NEMyMjEuOTg5IDEuMTQ3NTIgMjIxLjk4OSAyLjAwMTQxIDIyMS45ODkgMy4xMzY3NEMyMjEuOTg5IDMuNzYzNzkgMjIxLjk4OSA0LjQ3NjY5IDIyMS45ODkgNS4xODk3NEMyMjEuOTg5IDUuMTkxMDIgMjIxLjk4OSA1LjE5MjI5IDIyMS45ODkgNS4xOTM1N0g0OC4zMzM4QzEwOS4yOTkgOC40NTcyNyAxNzAuMzk2IDkuNzE5MjQgMjMxLjQ3MSA5LjcxOTI0QzIzMi42MDcgOS43MTkyNCAyMzMuNTI4IDEwLjY0MDEgMjMzLjUyOCAxMS43NzYxQzIzMy41MjggMTIuOTEyIDIzMi42MDcgMTMuODMyOSAyMzEuNDcxIDEzLjgzMjlDMTY1LjE3NyAxMy44MzI5IDk4LjgzMzcgMTIuMzQ3NCAzMi42NDUxIDguNDI5NzJDMzEuNjAxOSA4LjM2Nzk3IDMwLjIzNjEgOC4yOTgyMyAyOC42OTE1IDguMjE5MzZDMjUuMDMwNyA4LjAzMjQzIDIwLjM2NSA3Ljc5NDE4IDE2LjYwNTMgNy40ODkzNEMxMy45ODU4IDcuMjc2OTYgMTEuNTgwMSA3LjAxNzQ0IDEwLjI1OTMgNi42NzE4OUM5Ljk0MzQ0IDYuNTg5MjYgOS40OTY4MiA2LjQ1NTM0IDkuMTAzNTEgNi4yMTk0MkM4LjkxNzc3IDYuMTA4IDguNTM5MjQgNS44NTU3MiA4LjI2MjEyIDUuMzkyNzhDOC4wMzcyOCA1LjAxNzE5IDcuOTIyOTkgNC41NzExOCA3Ljk1NDQ4IDQuMTE1NzhDNi4xNDU5OSA0LjExNDM4IDQuMzM3NDkgNC4xMTM2NSAyLjUyODk5IDQuMTEzNjVDMS4zOTMwNCA0LjExMzY1IDAuNDcyMTY4IDMuMTkyNzggMC40NzIxNjggMi4wNTY4M1oiIGZpbGw9IiNGRkQ5MUMiLz4KPC9zdmc+Cg==);
        }

.whyus-section__content {
}

.whyuscard {
    border: 2px solid #B3B3B3;
    color: #fff;
    padding: 1.5em !important;
    display: flex;
    gap: 1.5em;
    height: 100%;
    border-radius: 0;
    background-color: transparent;
}

    .whyuscard .feature-icon {
        width: 6em;
        height: 6em;
        display: grid;
        place-items: center;
        color: var(--primary);
    }
/* === Responsive mobile (<768px) === */
@media (max-width: 767.98px) {
    .whyus-section {
        justify-content: center; /* on centre le contenu */
        text-align: left; /* paragraphes centrés */
        padding: 2em 2em;
    }
}

@media (min-width: 1400px) {
    .whyus-section__content {
        max-width: 1120px; /* optionnel : pour ne pas dépasser une taille raisonnable */
    }
}

@media (max-width: 992px) {
    .whyus-section {
    }
}
