/* Bloc Chiffres Clés */

.bloc-chiffres-cles {

    position: relative;
    padding: 80px 0;

    @media (min-width: 1280px) {
        padding: 260px 0;
    }

    p {
        font-size: 24px !important;
        letter-spacing: 7px !important;


        @media (max-width: 1280px) {
            font-size: 16px !important;
        }
    }

    .small {
        font-size: 19px;
        letter-spacing: 5px;
    }

    &::before,
    &::after {
        content: '';
        position: absolute;
        width: 250px;
        height: 250px;
        background-repeat: no-repeat;
        background-size: contain;
        background-image: url('../../images/elements/grey/coin.svg');
        z-index: 0;
        bottom: 0;

        @media (min-width: 768px) and (max-width: 1280px) {
            width: 150px;
            height: 150px;
        }

        @media (max-width: 767px) {
            width: 100px;
            height: 100px;
        }
    }

    &::after {
        right: 0;
        background-position: bottom left;
        transform: rotate(-90deg);
    }
}

.bloc-chiffres-cles__inner {
    width: 100%;
}

.bloc-chiffres-cles__row-top,
.bloc-chiffres-cles__row-bottom {
    margin-bottom: 0;
}

.bloc-chiffres-cles__row-top {
    margin-bottom: 0;
}

.bloc-chiffres-cles__item {
    margin-bottom: 0;
}

.bloc-chiffres-cles__item--top {
    border-bottom: 3px solid #dcdc01;
    border-right: 3px solid #dcdc01;
}

.bloc-chiffres-cles__item--top:last-child {
    border-right: 0;
}

.bloc-chiffres-cles__item--bottom {
    border-right: 3px solid #dcdc01;
    padding-top: 15px;
    padding-bottom: 20px;
}

.bloc-chiffres-cles__item--bottom:last-child {
    border-right: 0;
}

.bloc-chiffres-cles__content {
    text-align: center;
    padding: 20px 15px;
    min-height: 180px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    @media (max-width: 1280px) {
        font-size: 16px !important;

        * {
            font-size: 16px !important;
        }
    }
}

.bloc-chiffres-cles__content p {
    font-family: 'Outfit', sans-serif;
    font-weight: 700;
    color: rgba(54, 69, 0, 0.85);
    margin: 0;
    line-height: 1.2;
}

.bloc-chiffres-cles__content p span {
    display: inline;
}

/* Styles des chiffres - élément principal en jaune */
.bloc-chiffres-cles__content p strong,
.bloc-chiffres-cles__item--top .bloc-chiffres-cles__content p>span:first-child {
    color: #dcdc01;
}

.bloc-chiffres-cles__item--top .bloc-chiffres-cles__content p {
    letter-spacing: 8px;
}

.bloc-chiffres-cles__item--bottom .bloc-chiffres-cles__content p {
    letter-spacing: 8px;
}

/* Sous-titres plus petits */
.bloc-chiffres-cles__content p small {
    letter-spacing: 6px;
    display: block;
}

/* Couleur jaune pour les éléments en emphase */
.bloc-chiffres-cles__content em,
.bloc-chiffres-cles__content .highlight {
    color: #dcdc01;
    font-style: normal;
}

/* Responsive - Tablette */
@media (max-width: 991px) {
    .bloc-chiffres-cles {
        padding: 40px 0;
    }

    .bloc-chiffres-cles__item--top .bloc-chiffres-cles__content p strong,
    .bloc-chiffres-cles__item--top .bloc-chiffres-cles__content p>span:first-child {
        letter-spacing: 12px;
    }

    .bloc-chiffres-cles__item--top .bloc-chiffres-cles__content p {
        letter-spacing: 6px;
    }

    .bloc-chiffres-cles__item--bottom .bloc-chiffres-cles__content p {
        letter-spacing: 6px;
    }

    .bloc-chiffres-cles__content p small {
        letter-spacing: 4px;
    }
}

/* Responsive - Mobile */
@media (max-width: 767px) {
    .bloc-chiffres-cles {
        padding: 30px 0;
    }

    .bloc-chiffres-cles__item {
        margin-bottom: 20px;
    }

    .bloc-chiffres-cles__item--top,
    .bloc-chiffres-cles__item--bottom {
        border-right: 0;
        border-bottom: none !important;
        padding: 0;
    }

    .bloc-chiffres-cles__item:last-child {
        border-bottom: 0;
        margin-bottom: 0;
    }

    .bloc-chiffres-cles__content {
        min-height: auto;
        padding: 15px 10px;
    }

    .bloc-chiffres-cles__item--top .bloc-chiffres-cles__content p strong,
    .bloc-chiffres-cles__item--top .bloc-chiffres-cles__content p>span:first-child {
        letter-spacing: 2vw;
    }

    .bloc-chiffres-cles__item--top .bloc-chiffres-cles__content p {
        letter-spacing: 1vw;
    }

    .bloc-chiffres-cles__item--bottom .bloc-chiffres-cles__content p {
        letter-spacing: 1vw;
    }

    .bloc-chiffres-cles__content p small {
        letter-spacing: 0.8vw;
    }
}

/* Responsive - Très petits écrans */
@media (max-width: 480px) {

    .bloc-chiffres-cles__item--top .bloc-chiffres-cles__content p strong,
    .bloc-chiffres-cles__item--top .bloc-chiffres-cles__content p>span:first-child {
        letter-spacing: 2.5vw;
    }

    .bloc-chiffres-cles__item--top .bloc-chiffres-cles__content p {
        letter-spacing: 1.2vw;
    }

    .bloc-chiffres-cles__item--bottom .bloc-chiffres-cles__content p {
        letter-spacing: 1.2vw;
    }

    .bloc-chiffres-cles__content p small {
        letter-spacing: 1vw;
    }
}