body {
    background: #FFF;
}

a {
    text-decoration: none !important;
    transition: all 0.2s ease-in-out;
}

h1,
h2,
h3,
h4,
h5,
h6,
p {
    margin-top: 0px;
    margin-bottom: 0px;
}

input[type="date"]::-webkit-calendar-picker-indicator,
input[type="datetime-local"]::-webkit-calendar-picker-indicator {
    background-image: url('../img/home/date.svg') !important;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    color: transparent;
    /* Cache l'icône par défaut */

}

section {
    padding-top: 60px;
    padding-bottom: 60px;
}

.btn-primary {
    border-radius: 8px;
    background: var(--blue-normal-hover, #0089DB);
    padding: 10px 20px;
    color: #FFF;
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 24px;
    /* 150% */
    border: none;
}

.btn-primary:hover {
    background: var(--Blue-Dark, #0072B6);
}

.btn-primary:focus {
    background: var(--Blue-Normal, #0098F3);
}

.btn-primary:disabled {
    background: var(--blue-light-active, #B0DFFB);
}

.btn-secondary {
    border-radius: 8px;
    background: var(--blue-normal-hover, #E65C00);
    padding: 10px 20px;
    color: #FFF;
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 24px;
    border: none;
    /* 150% */
}

.btn-secondary:hover {
    background: var(--Blue-Dark, #BF4D00);
}

.btn-secondary:focus {
    background: var(--Blue-Normal, #FF6600);
}

.btn-secondary:disabled {
    background: var(--blue-light-active, #FFD0B0);
}

@media(max-width:992px) {
    section {
        padding-top: 50px;
        padding-bottom: 50px;
    }

    .btn-primary,
    .btn-secondary {
        font-size: 15px;
    }
}

@media(max-width:768px) {
    section {
        padding-top: 40px;
        padding-bottom: 40px;
    }

    .btn-primary,
    .btn-secondary {
        font-size: 14px;
    }
}

@media(max-width:570px) {
    section {
        padding-top: 30px;
        padding-bottom: 30px;
    }

    .btn-primary,
    .btn-secondary {
        font-size: 13px;
    }

    .btns {
        display: block !important;
    }

    .btns .btn {
        width: 100%;
        margin-bottom: 1rem;
    }
}

.btn-sm {
    font-size: 12px !important;
    padding: 8px 16px;
}

.card,
.card-body,
.card-footer,
.card-header {
    border: none;
    background-color: transparent;
    box-shadow: none;
}

.text-secondary {
    color: #FF6600 !important;
}

.text-primary {
    color: #0098F3 !important;
}

.text-dark {
    color: #444 !important;
}

.text-blue-dark {
    color: #005B92 !important;
}

.text-gray {
    color: var(--Grey-Dark, #919191) !important;
}

.bg-light-blue {
    background: var(--Blue-Light, #E6F5FE) !important;
}

.bg-blue {
    background: #0098F3 !important;
    /* Shadow blue */
    box-shadow: 10px 8px 20px 0 rgba(0, 81, 131, 0.25);
}

.bg-success {
    background-color: #22C55E !important;
}

.bg-danger {
    background: #E65C00 !important;
}

.bg-secondary {
    background-color: #E65C00 !important;
}

.bg-light-secondary {
    background: var(--Orange-Light, #FFF0E6);
}

.fw-400 {
    font-weight: 400 !important;
}

.position-relative {
    position: relative;
}

.badge-secondary {
    padding: 10px;
    border-radius: 25px;
    background: var(--orange-light-active, #FFD0B0);
    color: var(--Orange-Normal, #F60);
    text-align: center;
    /* Subtitle / Regular */
    font-family: Poppins;
    font-style: normal;
    font-weight: 400;
    line-height: 15.6px;
    /* 120% */
}

.badge-secondary-light {
    background: var(--Orange-Light, #FFF0E6);
    color: #FF6600;
}

.badge-primary {
    background: var(--Blue-Light, #E6F5FE);
    color: #0098F3;
}

@keyframes zoomInOut {
    0% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.05);
    }

    /* zoom in */
    100% {
        transform: scale(1);
    }
}

/*--------------------------
hero
---------------------------*/
.hero {
    position: relative;
}

.bg-image {
    position: absolute;
    top: 0;
    right: 0px;
    height: 100%;
    z-index: 0;
    object-fit: contain;
}

.hero .container {
    position: relative;
}

.hero h1 {
    color: var(--Grey-Darker, #444);
    font-family: Poppins;
    font-size: 39px;
    font-style: normal;
    font-weight: 700;
    line-height: 58.8px;
    /* 120% */
}

.hero p {
    color: var(--Grey-Darker, #444);

    /* H3/Regular */
    font-family: Poppins;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 37.2px;
    /* 120% */
}

.hero .images {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.hero .images img {
    width: 100%;
    max-width: 726px;
    max-height: 584px;
    flex-shrink: 0;
    object-fit: contain;
    animation: zoomInOut 3s infinite ease-in-out;

}

.hero .media {
    display: flex;
    align-items: center;
    justify-content: start;
}

.hero .media li {
    margin-left: -5px;
}

.hero .media li:first-child {
    margin-left: 0px;
}

.hero .media img {
    width: 20px;
    height: 20px;
    aspect-ratio: 1/1;
    object-fit: cover;
    border-radius: 50%;
    background: url(<path-to-image>) lightgray 50% / cover no-repeat;
}

.hero .media span {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: #FFF;
    /* Shadow blue */
    box-shadow: 10px 8px 20px 0 rgba(0, 81, 131, 0.25);
    color: var(--grey-dark-active, #575757);
    font-family: Poppins;
    font-size: 8px;
    font-style: normal;
    font-weight: 400;
    line-height: 15px;
    /* 187.5% */
    text-transform: uppercase;
    display: flex;
    align-items: center;
    justify-content: center;
}

.hero small {
    display: flex;
    align-items: center;
    justify-content: start;
    column-gap: 5px;
    color: var(--grey-dark-active, #575757);
    text-align: center;

    /* Body / Bold */
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 24px;
    /* 150% */
}

@media(max-width:992px) {
    .hero h1 {
        font-size: 35px;
    }

    .hero p {
        font-size: 18px;
    }

    .hero small {
        font-size: 15px;
    }

    .hero .images img {
        width: 100%;
        max-width: 626px;
        max-height: 584px;
    }
}

@media(max-width:768px) {
    .hero h1 {
        font-size: 30px;
        text-align: center;
    }

    .hero br {
        display: none;
    }

    .hero p {
        font-size: 16px;
        text-align: center;
    }

    .hero small {
        font-size: 14px;
    }

    .hero .images {
        display: none !important;
    }
}

@media(max-width:570px) {
    .hero h1 {
        font-size: 28px;
        text-align: center;
    }

    .hero small {
        font-size: 12px;
    }

    .hero p {
        font-size: 14px;
        text-align: center;
    }
}

/*------------------------------
section-title - section-subtitle
------------------------------*/
.section-title h2 {
    color: var(--Blue-blue-700, #0068A9);
    text-align: center;

    /* H3/Bold */
    font-family: Poppins;
    font-size: 31px;
    font-style: normal;
    font-weight: 800;
    line-height: 37.2px;
    /* 120% */
}

.section-title p {
    color: var(--Grey-Darker, #444);
    text-align: center;
    /* Headline / Regular */
    font-family: Poppins;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 30px;
    /* 150% */
}

.section-subtitle .subtitle {
    color: var(--Orange-Normal, #F60);

    /* H4 / Bold */
    font-family: Poppins;
    font-size: 25px;
    font-style: normal;
    font-weight: 700;
    line-height: 30px;
    /* 120% */
}

@media(max-width:992px) {
    .section-title h2 {
        font-size: 28px;
    }

    .section-title p {
        font-size: 18px;
    }

    .section-subtitle .subtitle {
        font-size: 20px;
    }
}

@media(max-width:768px) {
    .section-title h2 {
        font-size: 25px;
    }

    .section-title p {
        font-size: 16px;
    }

    .section-title h2 br,
    .section-title p br {
        display: none;
    }

    .section-subtitle .subtitle {
        font-size: 18px;
    }
}

@media(max-width:570px) {
    .section-title h2 {
        font-size: 20px;
    }

    .section-title p {
        font-size: 14px;
    }

    .section-subtitle .subtitle {
        font-size: 16px;
    }
}

/*---------------------
cardProjet
-------------------------*/
.cardProjet {
    border-radius: 10px;
    box-shadow: 10px 8px 20px 0 rgba(149, 61, 3, 0.25);
    width: 100%;
    max-width: 300px;
    height: 100%;
    min-height: 120px;
}

.cardProjet:nth-child(odd) {
    border-left: 5px solid var(--Blue-Normal, #0098F3) !important;
    background: var(--Blue-Light, #E6F5FE);

    /* Shadow blue */
    box-shadow: 10px 8px 20px 0 rgba(0, 81, 131, 0.25);
}

.cardProjet:nth-child(even) {
    border-left: 5px solid var(--Orange-Normal, #F60) !important;
    background: var(--Orange-Light, #FFF0E6);
    box-shadow: 10px 8px 20px 0 rgba(149, 61, 3, 0.25);
}

.cardProjet .card-body {
    display: flex;
    align-items: center;
    justify-content: start;
}

.cardProjet .card-body img {
    width: 70px;
    max-height: 60px;
    object-fit: contain;
    margin-right: 10px;
}

.cardProjet .card-body h3 {
    color: var(--Grey-Darker, #444);

    /* Headline / Bold */
    font-family: Poppins;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 30px;
    /* 150% */
}

.cardProjet .card-body p {
    color: var(--Grey-Darker, #444) !important;

    /* Body / Regular */
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
}


@media(max-width:992px) {
    .cardProjet .card-body img {
        width: 60px;
        max-height: 50px;
    }

    .cardProjet .card-body h3 {
        font-size: 18px;
    }

    .cardProjet .card-body p {
        font-size: 15px;
    }
}

@media(max-width:768px) {
    .cardProjet .card-body img {
        width: 50px;
        max-height: 40px;
    }

    .cardProjet .card-body h3 {
        font-size: 16px;
    }

    .cardProjet .card-body p {
        font-size: 14px;
    }
}

@media(max-width:570px) {
    .cardProjet {
        max-width: none;
        width: 90%;
    }

    .cardProjet .card-body img {
        width: 40px;
        max-height: 30px;
    }

    .cardProjet .card-body h3 {
        font-size: 14px;
    }

    .cardProjet .card-body p {
        font-size: 12px;
    }
}

/*-------------------------
cardAbout
---------------------------*/
.cardAbout .image {
    display: flex;
    justify-content: center;
}

.cardAbout .image img {
    width: 100%;
    max-width: 606.288px;
    max-height: 400px;
    object-fit: contain;
    animation: zoomInOut 3s infinite ease-in-out;
}

.cardAbout h2 {
    color: var(--Grey-Darker, #444);

    /* H2 / Bold */
    font-family: Poppins;
    font-size: 39px;
    font-style: normal;
    font-weight: 800;
    line-height: 46.8px;
    /* 120% */
}

.cardAbout p {
    color: var(--Grey-Darker, #444);

    /* H3/Regular */
    font-family: Poppins;
    font-size: 31px;
    font-style: normal;
    font-weight: 400;
    line-height: 37.2px;
    /* 120% */
}

@media(max-width:992px) {
    .cardAbout .image img {
        max-width: 506.288px;
        max-height: 300px;
    }

    .cardAbout h2 {
        font-size: 35px;
    }

    .cardAbout p {
        font-size: 28px;
    }
}

@media(max-width:768px) {
    .cardAbout .image {
        order: 2;
        text-align: center;
        margin-top: 1rem;
    }

    .cardAbout .text {
        order: 1;
    }

    .cardAbout .image img {
        max-width: 406.288px;
        max-height: 200px;
    }

    .cardAbout h2 {
        font-size: 30px;
        text-align: center;
    }

    .cardAbout p {
        font-size: 25px;
        text-align: center;
    }
}

@media(max-width:768px) {
    .cardAbout .image img {
        max-width: 306.288px;
        max-height: 200px;
    }

    .cardAbout h2 {
        font-size: 25px;
    }

    .cardAbout p {
        font-size: 20px;
    }
}

/*--------------------
cardSecteur
----------------------*/
.cardSecteur {
    width: 100%;
    max-width: 392px;
    height: 100%;
    min-height: 330px;
    padding: 30px;
    border-radius: 20px;
    border: 2px solid rgba(230, 245, 254, 0.50) !important;
    background: linear-gradient(136deg, #FFF 17.69%, #F1F9FF 52.32%, #FFF 86.95%);
    transition: transform 0.2s ease-in-out;
    cursor: pointer;
}

.cardSecteur:hover {
    transform: translateY(-5px);
}

.cardSecteur.shadow-secondary {
    border-radius: 20px;
    border: 2px solid rgba(255, 240, 230, 0.50);
    background: linear-gradient(136deg, #FFF 17.69%, #FFF0E6 52.32%, #FFF 86.95%);
}

.cardSecteur img {
    width: 70px;
    height: 70px;
    flex-shrink: 0;
    aspect-ratio: 1/1;
    margin-bottom: 1rem;
    object-fit: contain;
}

.cardSecteur h3 {
    color: var(--Orange-Normal, #F60);

    /* Headline / Bold */
    font-family: Poppins;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 30px;
    /* 150% */
    margin-bottom: 1rem;
}

.cardSecteur p {
    color: var(--grey-dark-active, #575757);
    /* Body / Regular */
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 150% */
}

.cardSecteur ul {
    list-style: none;
}

.cardSecteur ul li {
    color: var(--grey-dark-active, #575757);

    /* Body / Regular */
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 150% */
    margin-top: 1rem;
    margin-bottom: 1rem;
}

.cardSecteur ul li:first-child {
    margin-top: 0px;
}

.cardSecteur ul li:last-child {
    margin-bottom: 0px;
}

@media(max-width:992px) {
    .cardSecteur {
        max-width: 326px;
        min-height: 300px;
    }

    .cardSecteur img {
        width: 60px;
        height: 60px;
    }

    .cardSecteur h3 {
        font-size: 18px;
    }

    .cardSecteur p,
    .cardSecteur ul li {
        font-size: 15px;
    }
}

@media(max-width:768px) {
    .cardSecteur {
        max-width: 326px;
        min-height: 300px;
    }

    .cardSecteur img {
        width: 50px;
        height: 50px;
    }

    .cardSecteur h3 {
        font-size: 16px;
    }

    .cardSecteur p,
    .cardSecteur ul li {
        font-size: 14px;
    }
}

@media(max-width:570px) {
    .cardSecteur {
        max-width: 326px;
        min-height: auto;
    }

    .cardSecteur img {
        width: 40px;
        height: 40px;
    }

    .cardSecteur h3 {
        font-size: 14px;
    }

    .cardSecteur p,
    .cardSecteur ul li {
        font-size: 12px;
    }
}

/*-----------------
cardApp
-------------------*/
.cardApp {
    border-radius: 30px;
    width: 100%;
    max-width: 392px;
    height: 100%;
    min-height: 181px;
    padding: 10px;
    transition: transform 0.2s ease-in-out;
    cursor: pointer;
}

.cardApp:hover {
    transform: scale(1.05);
}

.cardApp:nth-child(odd) {
    background: var(--Orange-Light, #FFF0E6);
}

.cardApp:nth-child(even) {
    background: var(--Blue-Light, #E6F5FE);
}

.cardApp img {
    width: 50px;
    height: 61px;
    object-fit: contain;
    margin-right: 10px;
}

.cardApp h3 {
    color: var(--Grey-Darker, #444);
    font-family: Poppins;
    font-size: 20px;
    font-style: normal;
    font-weight: 600;
    line-height: 30px;
    /* 150% */
}

.cardApp .btn {
    width: 48px;
    height: 48px;
    padding: 0px 0px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
}

.cardApp .btn svg {
    width: 50% !important;
    height: 50% !important;
}

.cardApp:nth-child(odd) .btn {
    background: var(--Orange-Normal, #F60);
}

.cardApp:nth-child(even) .btn {
    background: var(--Blue-Normal, #0098F3);
}

.cardApp p {
    color: var(--grey-dark-active, #575757);
    /* Body / Regular */
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 150% */
}

.cardApp .box {
    display: flex;
    width: 50px;
    height: 50px;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
}

.cardApp .box img {
    width: 50%;
    height: 50%;
    object-fit: contain;
}

.cardApp:nth-child(odd) .box {
    background: var(--Orange-Normal, #F60);
}

.cardApp:nth-child(even) .box {
    background: var(--Orange-Normal, #0098F3);
}

@media(max-width:992px) {
    .cardApp img {
        width: 45px;
        height: 55px;
    }

    .cardApp .btn,
    .cardApp .box {
        width: 45px;
        height: 45px;
    }

    .cardApp h3 {
        font-size: 18px;
    }

    .cardApp p {
        font-size: 15px;
    }
}

@media(max-width:768px) {
    .cardApp img {
        width: 40px;
        height: 50px;
    }

    .cardApp .btn,
    .cardApp .box {
        width: 40px;
        height: 40px;
    }

    .cardApp h3 {
        font-size: 16px;
    }

    .cardApp p {
        font-size: 14px;
    }
}

@media(max-width:570px) {
    .cardApp {
        max-width: none;
        width: 90%;
        min-height: 130px;
    }

    .cardApp .btn,
    .cardApp .box {
        width: 35px;
        height: 35px;
    }

    .cardApp .box img {
        max-width: 25px;
        max-height: 25px;
    }

    .cardApp img {
        width: 40px;
        max-height: 30px;
    }

    .cardApp h3 {
        font-size: 14px;
    }

    .cardApp p {
        font-size: 12px;
    }
}

/*---------------------------
cardHorizental
-----------------------------*/
.bg-section {
    position: absolute;
    top: 10%;
    width: 100%;
    height: 80%;
    z-index: 0;
}

.cardHorizental h4 {
    color: var(--Orange-Normal, #F60);
    /* H4 / Bold */
    font-family: Poppins;
    font-size: 25px;
    font-style: normal;
    font-weight: 700;
    line-height: 30px;
    /* 120% */
}

.cardHorizental p {
    color: var(--grey-dark-hover, #747474);

    /* Body / Regular */
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 150% */
}

.cardHorizental img {
    width: 100%;
    max-width: 439px;
    max-height: 439px;
    object-fit: contain;
    animation: zoomInOut 3s infinite ease-in-out;
}

@media(max-width:992px) {
    .bg-section {
        position: absolute;
        top: 5%;
        width: 100%;
        height: 90%;
        z-index: 0;
        object-fit: cover;
    }

    .cardHorizental h4 {
        font-size: 20px;
    }

    .cardHorizental p {
        font-size: 15px;
    }

    .cardHorizental img {
        max-width: 400px;
        max-height: 400px;
    }
}

@media(max-width:768px) {
    .bg-section {
        display: none;
    }

    .section-horizental {
        background: var(--blue-light-hover, #D9F0FD);
        /* Shadow blue */
        box-shadow: 10px 8px 20px 0 rgba(0, 81, 131, 0.25);
    }

    .cardHorizental .image {
        order: 1;
        display: flex;
        justify-content: center;
        align-items: center;
        margin-bottom: 1rem;
    }

    .cardHorizental .text {
        order: 2;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
    }

    .cardHorizental h4 {
        font-size: 18px;
        text-align: center;
    }

    .cardHorizental p {
        font-size: 14px;
        text-align: center;
    }

    .cardHorizental img {
        max-width: 350px;
        max-height: 350px;
    }
}

@media(max-width:570px) {

    .cardHorizental h4 {
        font-size: 16px;
    }

    .cardHorizental p {
        font-size: 12px;
    }

    .cardHorizental img {
        max-width: 300px;
        max-height: 300px;
    }
}

/*-------------------------
cardSitation
----------------------------*/
.cardSitation {
    position: relative;
    border-radius: 10px;
    background: var(--Orange-Light, #FFF0E6);
    min-height: 83px;
}

.cardSitation .card-body {
    display: flex;
    align-items: center;
    justify-content: center;
}

.cardSitation h3 {
    color: var(--Orange-Normal, #F60);
    text-align: center;
    /* H4 / Bold */
    font-family: Poppins;
    font-size: 25px;
    font-style: normal;
    font-weight: 700;
    line-height: 30px;
    /* 120% */
}

.cardSitation .cote-left {
    position: absolute;
    bottom: -20px;
    left: -20px;
    width: 46.987px;
    height: 45.992px;
    object-fit: contain;
}

.cardSitation .cote-right {
    position: absolute;
    top: -20px;
    right: -20px;
    width: 46.987px;
    height: 45.992px;
    object-fit: contain;
}

@media(max-width:992px) {
    .cardSitation h3 {
        font-size: 20px;
    }

    .cardSitation .cote-left {
        bottom: -20px;
        left: -20px;
        width: 40.987px;
        height: 40.992px;
    }

    .cardSitation .cote-right {
        top: -20px;
        right: -20px;
        width: 40.987px;
        height: 40.992px;
    }
}

@media(max-width:768px) {
    .cardSitation {
        min-height: 70px;
    }

    .cardSitation h3 {
        font-size: 18px;
    }

    .cardSitation .cote-left {
        bottom: -15px;
        left: -15px;
        width: 35.987px;
        height: 35.992px;
    }

    .cardSitation .cote-right {
        top: -15px;
        right: -15px;
        width: 35.987px;
        height: 35.992px;
    }
}

@media(max-width:570px) {
    .cardSitation h3 {
        font-size: 16px;
    }
}

/*--------------------
cardMember
----------------------*/
.cardMember {
    width: 100%;
    max-width: 338px;
    height: 100%;
    min-height: 446px;
    border-radius: 24px;
    background: #FFF;
    padding: 30px 14px;
    /* Shadow blue */
    box-shadow: 10px 8px 20px 0 rgba(0, 81, 131, 0.25);
    transition: transform 0.2s ease-in-out;
    cursor: pointer;
}

.cardMember:hover {
    transform: scale(1.05);
}

.cardMember .card-header {
    display: flex;
    align-items: center;
    justify-content: start;
    flex-direction: column;
}

.cardMember img {
    width: 100%;
    max-width: 208px;
    height: 171px;
    object-fit: contain;
    flex-shrink: 0;
    border-radius: 30px;
    background: url(<path-to-image>) lightgray 50% / cover no-repeat;
}

.cardMember h5 {
    color: var(--Blue-950, #001019);

    /* H4 / Bold */
    font-family: Poppins;
    font-size: 25px;
    font-style: normal;
    font-weight: 700;
    line-height: 30px;
    /* 120% */
}

.cardMember h6 {
    color: var(--Blue-blue-500, #0093EE);

    /* Body / Regular */
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 19.2px;
    /* 120% */
}

.cardMember p {
    color: var(--Black-black-100, #BEBEBE);
    text-align: center;

    /* Body / Regular */
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 19.2px;
    /* 120% */
}

@media(max-width:992px) {
    .cardMember {
        max-width: 300px;
        min-height: 400px;
    }

    .cardMember h5 {
        font-size: 20px;
    }

    .cardMember h6,
    .cardMember p {
        font-size: 15px;
    }

    .cardMember img {
        width: 100%;
        max-width: 190px;
        height: 161px;
    }
}

@media(max-width:768px) {
    .cardMember h5 {
        font-size: 18px;
    }

    .cardMember h6,
    .cardMember p {
        font-size: 14px;
    }
}

@media(max-width:570px) {
    .cardMember h5 {
        font-size: 16px;
    }

    .cardMember h6,
    .cardMember p {
        font-size: 12px;
    }
}

/*--------------------------------------
cardAvis
----------------------------------------*/
.cardAvis {
    border-radius: 9px;
    background: var(--Final-background, #F1F9FF);
    padding: 12px 17px;
    width: 100%;
    max-width: 358px;
    height: 100%;
    min-height: 200px;
}

.cardAvis .card-header {
    border-radius: 9px 9px 0px 0px;
    background: var(--Color, #FFF);
}

.cardAvis .card-body {
    border-radius: 0px;
    background: var(--Color, #FFF);
}

.cardAvis .card-footer {
    border-radius: 0px 0px 9px 9px;
    background: var(--Color, #FFF);
}

.cardAvis .card-header img {
    border-radius: 3px;
    background: url(<path-to-image>) lightgray 50% / cover no-repeat;
    width: 73px;
    height: 73px;
    object-fit: cover;
}

.cardAvis .card-header h5 {
    color: #000;
    /* Body / Bold */
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 19.2px;
    /* 120% */
}

.cardAvis .card-body p {
    color: #000;
    /* Footnote / Regular */
    font-family: Poppins;
    font-size: 10px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 120% */
    letter-spacing: 0.4px;
}

.cardAvis .card-footer i {
    color: #EAEAEA;
}

@media(max-width:992px) {
    .cardAvis .card-header img {
        width: 63px;
        height: 63px;
    }

    .cardAvis .card-header h5 {
        font-size: 15px;
    }
}

@media(max-width:768px) {
    .cardAvis {
        min-height: auto;
    }

    .cardAvis .card-header img {
        width: 53px;
        height: 53px;
    }

    .cardAvis .card-header h5 {
        font-size: 14px;
    }
}

@media(max-width:768px) {
    .cardAvis {
        min-height: auto;
    }

    .cardAvis .card-header img {
        width: 43px;
        height: 43px;
    }

    .cardAvis .card-header h5 {
        font-size: 13px;
    }
}

/*-------------------------
cardStat
--------------------------*/
.cardStat {
    width: 100%;
    max-width: 390px;
    border-radius: 20px;
    background: #FFF;

    /* Shadow blue */
    box-shadow: 10px 8px 20px 0 rgba(0, 81, 131, 0.25);
    transition: transform 0.2s ease-in-out;
    cursor: pointer;
}

.cardStat:hover {
    transform: scale(1.05);
}

.cardStat h3 {
    color: var(--grey-dark-active, #575757);
    font-family: Poppins;
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 30px;
    /* 150% */
}

.cardStat .card-body {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.cardStat p {
    color: var(--Blue-Normal, #0098F3);
    font-family: Poppins;
    font-size: 49px;
    font-style: normal;
    font-weight: 600;
    line-height: 58.8px;
    /* 120% */
}

@media(max-width:992px) {
    .cardStat h3 {
        font-size: 18px;
    }

    .cardStat p {
        font-size: 45px;
    }

    .cardStat svg {
        width: 15px !important;
        height: 30px !important;
        object-fit: contain !important;
    }
}

@media(max-width:768px) {
    .cardStat {
        max-width: none;
        width: 90%;
    }

    .cardStat h3 {
        font-size: 16px;
    }

    .cardStat p {
        font-size: 40px;
    }
}

@media(max-width:768px) {
    .cardStat h3 {
        font-size: 14px;
    }

    .cardStat p {
        font-size: 35px;
    }
}

/*----------------------
cardFormateur
-------------------------*/
.cardFormateur {
    width: 100%;
    max-width: 330px;
    height: 100%;
    padding: 20px;
    border-radius: 20px;
    background: #FFF;
    /* Shadow blue */
    box-shadow: 10px 8px 20px 0 rgba(0, 81, 131, 0.25);
}

.cardFormateur img {
    width: 100%;
    max-width: 250px;
    height: 190px;
    object-fit: cover;
    border-radius: 15px;
    background: url(<path-to-image>) lightgray 50% / cover no-repeat, #D9D9D9;
}

.cardFormateur h3 {
    color: var(--grey-dark-active, #575757);
    text-align: center;
    font-family: Poppins;
    font-size: 25px;
    font-style: normal;
    font-weight: 600;
    line-height: 30px;
    /* 120% */
}

.cardFormateur p {
    color: var(--Blue-Normal, #0098F3);
    text-align: center;

    /* Body / Regular */
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 150% */
}

.cardFormateur span {
    font-size: 13px;
}

@media(max-width:992px) {
    .cardFormateur {
        max-width: none;
        width: auto;
    }

    .cardFormateur img {
        max-width: 230px;
        height: 180px;
    }

    .cardFormateur h3 {
        font-size: 20px;
    }

    .cardFormateur p {
        font-size: 15px;
    }

    .cardFormateur span {
        font-size: 12px;
    }
}

@media(max-width:768px) {
    .cardFormateur {
        max-width: none;
    }

    .cardFormateur h3 {
        font-size: 18px;
    }

    .cardFormateur p {
        font-size: 14px;
    }

    .cardFormateur span {
        font-size: 11px;
    }
}

@media(max-width:570px) {
    .cardFormateur {
        width: 90%;
    }

    .cardFormateur h3 {
        font-size: 16px;
    }

    .cardFormateur p {
        font-size: 12px;
    }
}

/*----------------------------
section-rejoins
------------------------------*/
.section-rejoins {
    background: var(--Blue-Light, #E6F5FE);
}

.section-rejoins .bg-rejoins {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    object-fit: contain;
}

.cardRejoin h2 {
    color: var(--grey-dark-hover, #747474);
    text-align: center;
    font-family: Poppins;
    font-size: 49px;
    font-style: normal;
    font-weight: 700;
    line-height: 58.8px;
    /* 120% */
}

.cardRejoin p {
    color: var(--grey-dark-hover, #747474);
    text-align: center;

    /* Headline / Regular */
    font-family: Poppins;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 30px;
    /* 150% */
}

.cardRejoin small {
    color: var(--Green-Normal, #22C55E);
    text-align: center;

    /* Caption / Bold */
    font-family: Poppins;
    font-size: 11px;
    font-style: normal;
    font-weight: 600;
    line-height: 16.5px;
    /* 150% */
}

.cardRejoin .badge {
    width: 120px;
    height: 100px;
    border-radius: 50px;
    background: var(--orange-light-active, #FFD0B0);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.cardRejoin .badge p {
    color: var(--Orange-Normal, #F60);
    text-align: center;
    /* H4 / Bold */
    font-family: Poppins;
    font-size: 25px;
    font-style: normal;
    font-weight: 700;
    line-height: 30px;
    /* 120% */
}

.cardRejoin .badge h3 {
    color: var(--Orange-Normal, #F60);
    /* Subtitle / Regular */
    font-family: Poppins;
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 15.6px;
}

@media(max-width:992px) {
    .section-rejoins .bg-rejoins {
        object-fit: cover;
    }

    .cardRejoin h2 {
        font-size: 45px;
    }

    .cardRejoin {
        font-size: 18px;
    }

    .cardRejoin .badge {
        min-width: 100px;
        max-width: fit-content;
        width: auto;
        height: auto;
        min-height: 90px;
        padding: 5px 15px;
    }

    .cardRejoin .badge p {
        font-size: 20px;
    }

    .cardRejoin .badge h3 {
        font-size: 12px;
    }
}

@media(max-width:768px) {
    .cardRejoin h2 {
        font-size: 40px;
    }

    .cardRejoin h2 br {
        display: none;
    }

    .cardRejoin {
        font-size: 16px;
    }

    .cardRejoin .badge p {
        font-size: 18px;
    }

    .cardRejoin .badge {
        min-height: auto;
    }
}

@media(max-width:570px) {
    .cardRejoin h2 {
        font-size: 30px;
    }

    .cardRejoin {
        font-size: 14px;
    }

    .cardRejoin .badges {
        gap: 10px !important;
    }

    .cardRejoin .badge {
        width: 45%;
        max-width: none;
    }

    .cardRejoin .badge p {
        font-size: 16px;
    }
}

/*-----------------------
cardContact
-----------------------*/
/*
.heroContact {
    position: relative;
    background-image: url("../img/home/bg-contact.png");
    background-repeat: no-repeat;
    background-position: top;
    margin-top: -20px;
}*/
.cardContact {
    border-radius: 20px;
    border: 2px solid rgba(230, 245, 254, 0.50);
    background: linear-gradient(136deg, #FFF 17.69%, #F1F9FF 52.32%, #FFF 86.95%);
    padding: 20px 10px;
}

.cardContact h1 {
    color: var(--blue-dark-hover, #005B92);

    /* H4 / Bold */
    font-family: Poppins;
    font-size: 25px;
    font-style: normal;
    font-weight: 700;
    line-height: 30px;
    /* 120% */
}

.cardContact p {
    color: var(--grey-dark-active, #575757);

    /* Body / Regular */
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 150% */
}

.formulaire .form-label {
    color: var(--Blue-blue-800, #005183);

    /* Body / Bold */
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 19.2px;
    /* 120% */
}

.formulaire .form-control,
.formulaire .form-select {
    border-radius: 7px;
    background: #FFF;
    box-shadow: 10px 8px 20px 0 rgba(0, 81, 131, 0.14);
    color: var(--Blue-blue-800, #005183);

    /* Body / Bold */
    font-family: Poppins;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 19.2px;
    /* 120% */
    min-height: 44px;
    border: none;
}

.formulaire .form-control::placeholder {
    color: #c4c4c4;
}

.formulaire .form-check input {
    border: none;
    box-shadow: 13px 12px 20px -18px rgba(0, 81, 131, 0.25) inset;
}

.formulaire .form-check input:checked {
    background-color: #0089DB;
}

.formulaire .form-check label {
    color: var(--Blue-blue-800, #005183);

    /* Body / Regular */
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 150% */
}

.formulaire .switch-form .form-switch-label {
    border-radius: 15px;
    background: var(--Color, #FFF);
    /* shdow final */
    box-shadow: 10px 8px 20px 0 rgba(0, 81, 131, 0.25);
    color: var(--Blue-500, #0093EE);
    /* Headline / Bold */
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 24px;
    /* 120% */
    min-height: 52px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.formulaire .switch-form input:checked+label {
    border: 2px solid #0093EE;
}

.input-group {
    border-radius: 8px;
    background: #FFF;
    box-shadow: 5px 4px 15px 0 rgba(0, 81, 131, 0.25);
    min-height: 44px;
    flex-wrap: nowrap;
}

.input-group .input-group-text {
    background: transparent;
    border: none;
}

.input-group .form-control {
    background-color: transparent;
    border: none;
    min-height: auto;
    box-shadow: none !important;
}

.jointe {
    border-radius: 20px;
    border: 1px dashed var(--Blue-500, #0093EE);
    background: var(--Color, #FFF);
    /* Shadow blue */
    box-shadow: 10px 8px 20px 0 rgba(0, 81, 131, 0.25);
    padding: 17px 17px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 10px;
}

.jointe p {
    color: var(--Blue-Normal, #0098F3);
    text-align: center;

    /* Body / Bold */
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 24px;
    /* 150% */
}

.jointe small {
    color: #969696;
    text-align: center;
    /* Subtitle / Regular */
    font-family: Poppins;
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 15.6px;
    /* 120% */
}

@media(max-width:992px) {
    .cardContact h1 {
        font-size: 20px;
    }

    .cardContact p,
    .formulaire .form-label,
    .formulaire .form-check label,
    .formulaire .switch-form .form-switch-label,
    .jointe p {
        font-size: 14px;
    }

    .formulaire .form-control,
    .formulaire .form-select,
    .jointe small {
        font-size: 12px;
    }
}

@media(max-width:768px) {
    .cardContact h1 {
        font-size: 18px;
    }

    .cardContact p,
    .formulaire .form-label,
    .formulaire .form-check label,
    .formulaire .switch-form .form-switch-label,
    .jointe p {
        font-size: 13px;
    }

    .formulaire .form-control,
    .formulaire .form-select {
        font-size: 12px;
    }
}

@media(max-width:570px) {
    .cardContact h1 {
        font-size: 16px;
    }

    .cardContact p,
    .formulaire .form-label,
    .formulaire .form-check label,
    .formulaire .switch-form .form-switch-label {
        font-size: 12px;
    }

    .formulaire .form-control,
    .formulaire .form-select {
        font-size: 11px;
    }
}

/*-----------------------------
.boxIcon
--------------------------------*/
.section-icons {
    margin-top: -35px;
    position: relative;
}

.boxIcon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.boxIcon span {
    display: flex;
    width: 70px;
    height: 70px;
    padding: 15px;
    justify-content: center;
    align-items: center;
    aspect-ratio: 1/1;
    border-radius: 50%;
    background: var(--blue-light-active, #B0DFFB);
    margin-bottom: 10px;
}

.boxIcon img {
    width: 70%;
    height: 70%;
    object-fit: contain;
}

.boxIcon p {
    color: var(--grey-dark-active, #575757);
    text-align: center;
    /* Body / Bold */
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 24px;
    /* 150% */
}

@media(max-width:992px) {
    .section-icons {
        margin-top: -30px;
    }

    .boxIcon span {
        width: 65px;
        height: 65px;
        padding: 10px;
    }

    .boxIcon p {
        font-size: 15px;
    }
}

@media(max-width:768px) {
    .section-icons {
        margin-top: -25px;
    }

    .boxIcon span {
        width: 60px;
        height: 60px;
        padding: 5px;
    }

    .boxIcon p {
        font-size: 14px;
    }
}

@media(max-width:570px) {
    .section-icons {
        margin-top: -20px;
    }

    .boxIcon span {
        width: 50px;
        height: 50px;
        padding: 5px;
    }

    .boxIcon p {
        font-size: 12px;
    }
}

/*--------------------------
cardCta
----------------------------*/
.cardCta {
    border-radius: 20px;
    border: 2px solid rgba(230, 245, 254, 0.50);
    background: linear-gradient(115deg, #FFF 17.96%, rgba(176, 223, 251, 0.20) 52.34%, #FFF 86.73%);
    width: 100%;
}

.cardCta .card-body {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.cardCta h2 {
    color: var(--Blue-Dark, #0072B6);

    /* Headline / Bold */
    font-family: Poppins;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 30px;
    /* 150% */
}

.cardCta p {
    color: var(--grey-dark-active, #575757);

    /* Body / Bold */
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 24px;
    /* 150% */
}

@media(max-width:992px) {
    .cardCta h2 {
        font-size: 18px;
    }

    .cardCta p {
        font-size: 15px;
    }
}

@media(max-width:768px) {
    .cardCta h2 {
        font-size: 16px;
    }

    .cardCta p {
        font-size: 14px;
    }
}

@media(max-width:570px) {
    .cardCta .card-body {
        justify-content: center;
        flex-direction: column;
        text-align: center;
    }

    .cardCta h2 {
        font-size: 14px;
    }

    .cardCta p {
        font-size: 12px;
    }
}

/*------------------------
cardImage
--------------------------*/
.cardImage {
    width: 100%;
    max-width: 278px;
    max-height: 217px;
    border-radius: 30px;
    background: var(--Blue-Light, #E6F5FE);

    /* Shadow blue */
    box-shadow: 10px 8px 20px 0 rgba(0, 81, 131, 0.25);
}

.cardImage .card-body {
    display: flex;
    align-items: center;
    justify-content: center;
}

.cardImage img {
    width: 80%;
    height: 80%;
    object-fit: contain;
}

.cardHistory .card-header {
    padding-bottom: 0px;
}

.cardHistory h3 {
    color: var(--Orange-Normal, #F60);
    text-align: center;

    /* H4 / Bold */
    font-family: Poppins;
    font-size: 25px;
    font-style: normal;
    font-weight: 700;
    line-height: 30px;
    /* 120% */
}

.cardHistory p {
    color: var(--grey-dark-active, #575757);
    text-align: center;

    /* Body / Regular */
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 150% */
}

.timeLine {
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
}

.timeLine .line {
    position: absolute;
    left: 0;
    top: 20px;
    width: 100% !important;
    z-index: 0;
}

.timeLine img {
    width: 50px;
    height: 50px;
    object-fit: contain;
    position: relative;
}

@media(max-width:992px) {
    .cardImage {
        max-width: 258px;
        max-height: 207px;
    }

    .cardImage img {
        width: 70%;
        height: 70%;
    }

    .cardHistory h3 {
        font-size: 20px;
    }

    .cardHistory p {
        font-size: 15px;
    }
}

@media(max-width:768px) {
    .cardImage {
        max-width: 258px;
        max-height: 207px;
    }

    .cardHistory h3 {
        font-size: 18px;
    }

    .cardHistory p {
        font-size: 14px;
    }

    .timeLine {
        display: none;
    }
}

@media(max-width:570px) {
    .cardImage {
        width: 90%;
        max-width: none;
        max-height: none;
    }

    .cardHistory h3 {
        font-size: 16px;
    }

    .cardHistory p {
        font-size: 12px;
    }
}

/*----------------------------
video container
------------------------------*/
.cardVideo-2 {
    width: 100%;
    max-width: 434px;
}

.cardVideo-2 .video-container {
    position: relative;
    width: 100%;
    max-width: 100%;
    overflow: hidden;
}

.cardVideo-2 .video-container video {
    width: 100%;
    border-radius: 20px;
    background: rgba(54, 54, 54, 0.40);
    height: 270px;
    object-fit: cover;
    display: block;
}

.cardVideo-2 .video-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    border-radius: 20px;
    /* assombrir */
    display: flex;
    align-items: center;
    justify-content: center;
    transition: opacity 0.3s ease;
    opacity: 1;
    /* ne bloque pas les clics */
    z-index: 2;
    pointer-events: auto;
}

.cardVideo-2 .video-overlay.hide {
    opacity: 0;
    pointer-events: none;
    /* quand caché → clics passent à la vidéo */
}

.cardVideo-2 .play-btn {
    background: transparent;
    border: none;
    cursor: pointer;
    z-index: 3;
    pointer-events: auto;
    /* bouton reste cliquable */
}

.cardVideo-2 .video-container .play-btn img {
    width: 70px;
    height: 70px;
    border-radius: 50%;
}

@media(max-width:992px) {
    .cardVideo-2 .video-container .play-btn img {
        width: 50px;
        height: 50px;
    }

    .cardVideo-2 .video-container video {
        height: 250px;
    }
}

@media(max-width:786px) {
    .cardVideo-2 .video-container .play-btn img {
        width: 40px;
        height: 40px;
    }

}

/*-----------------------
cardPresonne
-------------------------*/
.cardPresonne {
    width: 100%;
    border-radius: 20px;
    background: #FFF;

    /* Shadow blue */
    box-shadow: 10px 8px 20px 0 rgba(0, 81, 131, 0.25);
}

.cardPresonne .left {
    position: relative;
    border-radius: 40px 40px 40px 0;
    background: var(--orange-light-hover, #FFE8D9);
    padding: 1rem 1rem;
    display: flex;
    align-items: center;
    justify-content: start;
    padding-bottom: 0px;
}

.cardPresonne .left .img-cote {
    position: absolute;
    top: -10px;
    left: -10px;
    width: 41.409px;
    height: 33.993px;
    flex-shrink: 0;
    aspect-ratio: 41.41/33.99;
    object-fit: contain;
}

.cardPresonne .left .img-user {
    max-width: 250px;
    max-height: 250px;
    object-fit: contain;
    margin-left: -50px;
}

.cardPresonne .left h3 {
    color: var(--Orange-Normal, #F60);

    /* H4 / Bold */
    font-family: Poppins;
    font-size: 25px;
    font-style: normal;
    font-weight: 700;
    line-height: 30px;
    /* 120% */
}

.cardPresonne .left h4 {
    color: var(--grey-dark-hover, #747474);

    /* Subtitle / Regular */
    font-family: Poppins;
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 15.6px;
    /* 120% */
}

.cardPresonne .left .line {
    background: var(--Orange-Dark, #BF4D00);
    width: 30%;
    height: 1px;
    margin-top: 5px;
}

.cardPresonne .left p {
    color: var(--grey-dark-active, #575757);

    /* Body / Regular */
    font-family: Poppins;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 150% */
}

.cardPresonne .right h5 {
    color: var(--blue-normal-hover, #0089DB);

    /* H2 / Bold */
    font-family: Poppins;
    font-size: 30px;
    font-style: normal;
    font-weight: 700;
    line-height: 46.8px;
    /* 120% */
}

.cardPresonne .right p {
    color: var(--grey-dark-active, #575757);

    /* Headline / Regular */
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 30px;
    /* 150% */
}

@media(max-width:992px) {
    .cardPresonne .left .img-cote {
        top: -5px;
        left: -5px;
        width: 35.409px;
        height: 30.993px;
    }

    .cardPresonne .left .img-user {
        max-width: 200px;
        max-height: 200px;
    }

    .cardPresonne .left h3 {
        font-size: 20px;
    }

    .cardPresonne .left h4 {
        font-size: 12px;
    }

    .cardPresonne .left p {
        font-size: 13px;
    }

    .cardPresonne .right h5 {
        font-size: 28px;
    }

    .cardPresonne .right p {
        font-size: 15px;
    }
}

@media(max-width:768px) {
    .cardPresonne .left .img-cote {
        top: -5px;
        left: -5px;
        width: 30.409px;
        height: 25.993px;
    }

    .cardPresonne .left .img-user {
        max-width: 200px;
        max-height: 200px;
    }

    .cardPresonne .left h3 {
        font-size: 18px;
    }

    .cardPresonne .left p {
        font-size: 12px;
    }

    .cardPresonne .right {
        margin-top: 1rem;
    }

    .cardPresonne .right h5 {
        font-size: 25px;
    }

    .cardPresonne .right p {
        font-size: 14px;
    }
}

@media(max-width:570px) {
    .cardPresonne .left .img-user {
        max-width: 180px;
        max-height: 180px;
    }

    .cardPresonne .left h3 {
        font-size: 16px;
    }

    .cardPresonne .right h5 {
        font-size: 20px;
    }

    .cardPresonne .right p {
        font-size: 12px;
    }
}

/*--------------------------
scroll
---------------------------*/

@keyframes scrollLoop {
    0% {
        transform: translateX(0%);
    }

    100% {
        transform: translateX(-50%);
    }
}

.scroll-wrapper {
    overflow: hidden;
    width: 100%;
    position: relative;
}

.scroll-content {
    display: flex;
    align-items: center;
    gap: 3rem;
    animation: scrollLoop 30s linear infinite;
    width: max-content;
}

.scroll-content img {
    max-width: 180px;
    max-height: 70px;
    object-fit: contain;
}

@media(max-width:992px) {
    .scroll-content img {
        max-width: 160px;
        max-height: 50px;
    }
}

@media(max-width:768px) {
    .scroll-content img {
        max-width: 150px;
        max-height: 40px;
    }
}


/*--------------------------
cardValeur
----------------------------*/
.cardValeur {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    width: 100%;
    max-width: 201px;
}

.cardValeur .card-header {
    display: flex;
    width: 90px;
    height: 90px;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    background: #4BBBFF;
    margin-bottom: -45px;
    position: relative;
}

.cardValeur.secondary .card-header {
    background: var(--Orange-Normal, #F60);
    border: 5px solid #fff;
}

.cardValeur .card-header img {
    width: 70%;
    height: 70%;
    object-fit: contain;
}

.cardValeur .card-body {
    width: 100%;
    padding-top: 70px;
    border-radius: 10px;
    background: #FFF;
    box-shadow: -5px 0 15px 0 rgba(0, 108, 174, 0.25), 5px 5px 15px 0 rgba(0, 108, 174, 0.25);
}

.cardValeur.secondary .card-body {
    border-radius: 10px;
    background: #FFF;
    /* Shadow blue */
    box-shadow: 10px 8px 20px 0 rgba(0, 81, 131, 0.25);
}

.cardValeur h3 {
    color: #4BBBFF;
    text-align: center;
    font-family: Poppins;
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: 21px;
    /* 105% */
}

.cardValeur p {
    color: var(--Grey-Darker, #444);
    text-align: center;

    /* Subtitle / Regular */
    font-family: Poppins;
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 15.6px;
    /* 120% */
}

@media(max-width:992px) {
    .cardValeur .card-header {
        width: 90px;
        height: 90px;
        margin-bottom: -45px;
    }

    .cardValeur .card-body {
        padding-top: 60px;
    }

    .cardValeur h3 {
        font-size: 16px;
    }

    .cardValeur p {
        font-size: 12px;
    }
}

@media(max-width:768px) {
    .cardValeur .card-header {
        width: 80px;
        height: 80px;
        margin-bottom: -40px;
    }

    .cardValeur .card-body {
        padding-top: 50px;
    }

    .cardValeur h3 {
        font-size: 15px;
    }
}

@media(max-width:570px) {
    .cardValeur .card-header {
        width: 60px;
        height: 60px;
        margin-bottom: -35px;
    }

    .cardValeur .card-body {
        padding-top: 55px;
    }

    .cardValeur h3 {
        font-size: 14px;
    }
}

/*-----------------------------
cardTimeline
-------------------------------*/
.cardTimeline {
    width: 100%;
    max-width: 568px;
}

.cardTimeline .timeline-items {
    display: flex;
    flex-direction: column;
    position: relative;
}

.cardTimeline .timeline-item {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
}

.cardTimeline .timeline-year {
    color: var(--grey-dark-active, #575757);
    text-align: right;

    /* Headline / Bold */
    font-family: Poppins;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 30px;
    /* 150% */
    width: 80px;
}

.cardTimeline .timeline-marker {
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
}

.cardTimeline .circle {
    width: 35px;
    height: 35px;
    border: 2px solid #F60;
    border-radius: 50%;
    background: white;
    color: var(--Orange-Normal, #F60);
    text-align: center;

    /* Headline / Bold */
    font-family: Poppins;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 30px;
    /* 150% */
    display: flex;
    align-items: center;
    justify-content: center;

}

.cardTimeline .line {
    flex-grow: 1;
    width: 2px;
    height: 100px;
    background: #0098F3;
    margin-top: 0px;
}

.cardTimeline .timeline-content {
    flex: 1;
    color: var(--Orange-Normal, #F60);
    /* Headline / Bold */
    font-family: Poppins;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 30px;
    /* 150% */
}

@media(max-width:992px) {

    .cardTimeline .timeline-year,
    .cardTimeline .timeline-content,
    .cardTimeline .circle {
        font-size: 18px;
    }

    .cardTimeline .circle {
        width: 30px;
        height: 30px;
    }

    .cardTimeline .line {
        height: 90px;
    }
}

@media(max-width:768px) {

    .cardTimeline .timeline-year,
    .cardTimeline .timeline-content,
    .cardTimeline .circle {
        font-size: 16px;
    }


    .cardTimeline .line {
        height: 80px;
    }
}

@media(max-width:570px) {

    .cardTimeline .timeline-year,
    .cardTimeline .timeline-content,
    .cardTimeline .circle {
        font-size: 14px;
    }


    .cardTimeline .line {
        height: 50px;
    }

    .cardTimeline .timeline-year {
        width: 60px;
    }
}

/*-----------------------
cardEquipe
---------------------------*/
.cardEquipe {
    border-radius: var(--Number-Scale-2s-L, 16px);
    background: #FFF;
    /* Shadow blue */
    box-shadow: 10px 8px 20px 0 rgba(0, 81, 131, 0.25);
    width: 100%;
    max-width: 300px;
    height: 100%;
    min-height: 332px;
    padding: 35px 10px;
    transition: transform 0.2s ease-in-out;
    cursor: pointer;
}

.cardEquipe:hover {
    transform: scale(1.05);
}

.cardEquipe .card-header {
    display: flex;
    align-items: center;
    justify-content: center;
}

.cardEquipe img {
    width: 150px;
    height: 150px;
    flex-shrink: 0;
    object-fit: cover;
    background: #FFF;
    border-radius: 50%;
    box-shadow: -10px -10px 30px 0px rgba(255, 255, 255, 0.90), 4px 4px 15px 0px rgba(114, 114, 114, 0.25);
}


.cardEquipe h4 {
    color: var(--Blue-Normal, #0098F3);
    text-align: center;

    /* Headline / Bold */
    font-family: Lato;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 24px;
    /* 120% */
    text-align: center;
}

.cardEquipe p {
    color: var(--grey-dark-active, #575757);
    text-align: center;
    /* Body / Regular */
    font-family: Lato;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 150% */
}

.cardEquipe .card-footer {
    display: flex;
    align-items: center;
    justify-content: center;
}

.cardEquipe .card-footer a {
    border-radius: 8px;
    background: #FFF;
    /* Elevation/S */
    box-shadow: -5px -5px 20px -4px #FFF, 1px 1px 7px 0 #A2A2A2;
    padding: 8px;
}

@media(max-width:992px) {
    .cardEquipe {
        max-width: 280px;
        min-height: 312px;
    }

    .cardEquipe h4 {
        font-size: 18px;
    }

    .cardEquipe p {
        font-size: 15px;
    }

    .cardEquipe img {
        width: 130px;
        height: 130px;
    }
}

@media(max-width:768px) {
    .equipe-section .row {
        justify-content: center !important;
    }

    .cardEquipe {
        max-width: 260px;
        min-height: 292px;
    }

    .cardEquipe h4 {
        font-size: 16px;
    }

    .cardEquipe p {
        font-size: 14px;
    }

    .cardEquipe img {
        width: 120px;
        height: 120px;
    }
}

@media(max-width:570px) {
    .cardEquipe {
        max-width: 240px;
        min-height: 272px;
    }

    .cardEquipe h4 {
        font-size: 15px;
    }

    .cardEquipe p {
        font-size: 12px;
    }

    .cardEquipe img {
        width: 100px;
        height: 100px;
    }
}

/*---------------------------
cardRealisation
----------------------------*/
.cardRealisation {
    width: 100%;
    max-width: 432px;
    height: 100%;
    min-height: 410px;
    border-radius: 20px;
    background: #FFF;
    padding: 10px 20px;
    /* Shadow blue */
    box-shadow: 10px 8px 20px 0 rgba(0, 81, 131, 0.25);
    transition: transform 0.2s ease-in-out;
    cursor: pointer;
}

.cardRealisation:hover {
    transform: translateY(-5px);
}

.cardRealisation .image {
    width: 100%;
    max-width: 392px;
    height: 182px;
    object-fit: cover;
    border-radius: 20px;
    background: var(--Blue-Light, #E6F5FE);
    margin-bottom: 1rem;
}

.cardRealisation .logo {
    height: 50px;
    max-width: 100px;
    object-fit: contain;
    margin-right: 5px;
}

.cardRealisation h3 {
    color: var(--Grey-Darker, #444);
    font-family: Poppins;
    font-size: 20px;
    font-style: normal;
    font-weight: 600;
    line-height: 30px;
    /* 150% */
}

.cardRealisation p {
    color: var(--Grey-Darker, #444);

    /* Subtitle / Regular */
    font-family: Poppins;
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 15.6px;
    /* 120% */
}

@media(max-width:992px) {
    .cardRealisation .logo {
        height: 40px;
        max-width: 90px;
    }

    .cardRealisation h3 {
        font-size: 18px;
    }

    .cardRealisation p {
        font-size: 15px;
    }
}

@media(max-width:768px) {
    .cardRealisation .logo {
        height: 35px;
        max-width: 80px;
    }

    .cardRealisation h3 {
        font-size: 16px;
    }

    .cardRealisation p {
        font-size: 14px;
    }
}

@media(max-width:570px) {
    .cardRealisation .logo {
        height: 35px;
        max-width: 80px;
    }

    .cardRealisation h3 {
        font-size: 15px;
    }

    .cardRealisation p {
        font-size: 12px;
    }
}

/*--------------------------------
section-text
---------------------------------*/
.section-text .title {
    color: var(--Orange-Normal, #F60);

    /* H2 / Bold */
    font-family: Poppins;
    font-size: 39px;
    font-style: normal;
    font-weight: 700;
    line-height: 46.8px;
    /* 120% */
}

.section-text p {
    color: var(--Grey-Darker, #444);
    font-family: Poppins;
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 37px;
    /* 185% */
}

.section-text img {
    width: 100%;
    border-radius: 10px;
    background: url(<path-to-image>) lightgray 50% / cover no-repeat, #FFF;

    /* Shadow blue */
    box-shadow: 10px 8px 20px 0 rgba(0, 81, 131, 0.25);
    object-fit: cover;
}

@media(max-width:992px) {
    .section-text .title {
        font-size: 35px;
    }

    .section-text p {
        font-size: 16px;
    }
}

@media(max-width:768px) {
    .section-text .title {
        font-size: 30px;
    }

    .section-text p {
        font-size: 15px;
    }

    .section-text .text {
        margin-bottom: 1rem;
    }
}

@media(max-width:570px) {
    .section-text .title {
        font-size: 25px;
    }

    .section-text p {
        font-size: 14px;
    }
}

/*------------------------
filters
-------------------------*/
.filters {
    position: relative;
}

.filters .input-group,
.filters .form-control,
.filters .form-select {
    width: fit-content;
}

.filters .form-control,
.filters .form-select {
    border-radius: 8px;
    background: #FFF;
    box-shadow: 5px 4px 15px 0 rgba(0, 81, 131, 0.25);
    border: none;
}

.hero .filters .form-control,
.hero .filters .form-select {
    width: 100%;
    max-width: 180px;
}

@media(max-width:570px) {
    .filters {
        display: block !important;
    }

    .filters .input-group,
    .filters .form-control,
    .filters .form-select,
    .filters .btn {
        width: 100% !important;
        max-width: none;
    }

    .hero .filters .form-control,
    .hero .filters .form-select {
        max-width: none;
    }
}

/*---------------------------
pagination
-----------------------------*/
.pagination {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

.pagination .page-link {
    border: none;
    color: var(--Grays-Gray-2, var(--Grays-Gray-2, #AEAEB2));

    /* Headline / Light */
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 300;
    line-height: 24px;
    /* 120% */
    background-color: transparent !important;
}

.pagination .page-link.step {
    border-radius: 11px;
    border: 2px solid var(--Blue-300, #5CC0FF);
    box-shadow: 10px 8px 20px 0px rgba(0, 81, 131, 0.06);
    width: 40px;
    height: 40px;
    padding: 0px 0px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.pagination .page-link.active {
    background-color: transparent;
    color: var(--Blue-500, #0093EE);
    font-weight: 700;
}

@media(max-width:992px) {
    .pagination .page-link {
        font-size: 13px;
    }

    .pagination .page-link.step {
        width: 35px;
        height: 35px;
    }
}

@media(max-width:768px) {
    .pagination .page-link {
        font-size: 12px;
    }

    .pagination .page-link.step {
        width: 30px;
        height: 30px;
    }
}

@media(max-width:570px) {
    .pagination .page-link {
        font-size: 12px;
    }

    .pagination .page-link.step {
        width: 25px;
        height: 25px;
    }
}

/*---------------------------
section-experiences
-----------------------------*/
.section-experiences {
    position: relative;
}

.section-experiences .bg-img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
}

/*--------------------------
cardFormation
----------------------------*/
.cardFormation {
    width: 100%;
    max-width: 410px;
    border-radius: 30px;
    background: var(--Color, #FFF);

    /* shdow final */
    box-shadow: 10px 8px 20px 0 rgba(0, 81, 131, 0.25);
    height: 100%;
}

.cardFormation .card-header img {
    width: 100%;
    height: 196px;
    border-radius: 15px;
    background: url(<path-to-image>) lightgray 50% / cover no-repeat, #D9D9D9;
    object-fit: cover;
}

.cardFormation .card-body h3 {
    color: var(--Blue-blue-700, #0068A9);
    text-align: center;
    /* Headline / Bold */
    font-family: Poppins;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 30px;
    /* 150% */
}

.cardFormation .card-body p {
    color: var(--grey-dark-active, #575757);
    text-align: center;

    /* Subtitle / Regular */
    font-family: Poppins;
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 15.6px;
    /* 120% */
}

.cardFormation .card-body img {
    width: 23.999px;
    height: 23.458px;
    object-fit: contain;
}

.cardFormation .card-body span {
    /* Body / Regular */
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 150% */
}

.cardFormation .infos {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: 10px;
}

.cardFormation .card-footer .box {
    display: flex;
    align-items: center;
    justify-content: start;
    flex-direction: column;
}

.cardFormation .card-footer svg {
    width: 25px !important;
    height: 21px !important;
    aspect-ratio: 25/21;
    object-fit: contain;
    margin-bottom: 5px;
}

.cardFormation .card-footer p {
    color: var(--grey-dark-hover, #747474);

    /* Body / Regular */
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 150% */
}

@media(max-width:992px) {
    .cardFormation .card-header img {
        height: 190px;
    }

    .cardFormation .card-body h3 {
        font-size: 18px;
    }

    .cardFormation .card-body p {
        font-size: 12px;
    }

    .cardFormation .card-body span,
    .cardFormation .card-footer p {
        font-size: 14px;
    }

    .cardFormation .card-body img {
        width: 20.999px;
        height: 20.458px;
    }

    .cardFormation .card-footer svg {
        width: 20px !important;
        height: 21px !important;
    }
}

@media(max-width:768px) {
    .cardFormation .card-header img {
        height: 190px;
    }

    .cardFormation .card-body h3 {
        font-size: 16px;
    }

    .cardFormation .card-body span,
    .cardFormation .card-footer p {
        font-size: 13px;
    }

    .cardFormation .card-footer svg {
        width: 20px !important;
        height: 21px !important;
    }
}

@media(max-width:570px) {
    .cardFormation .card-header img {
        height: 190px;
    }

    .cardFormation .card-body h3 {
        font-size: 14px;
    }

    .cardFormation .card-body span,
    .cardFormation .card-footer p {
        font-size: 12px;
    }

    .cardFormation .card-footer svg {
        width: 20px !important;
        height: 21px !important;
    }
}

/*---------------------------------
details agent 
*----------------------------------*/
.cardDetails {
    border-radius: 15px;
    background: var(--Color, #FFF);

    /* shdow final */
    box-shadow: 10px 8px 20px 0 rgba(0, 81, 131, 0.25);
}

.cardDetails .card-body .left {
    display: flex;
    align-items: center;
    justify-content: start;
    gap: 10px;
}

.cardDetails .card-body .left img {
    width: 200px;
    height: 104px;
    flex-shrink: 0;
    aspect-ratio: 25/13;
    object-fit: cover;
    border-radius: 15px;
    background: url(<path-to-image>) lightgray 50% / cover no-repeat, #D9D9D9;
}

.cardDetails .card-body h3 {
    color: var(--Blue-blue-700, #0068A9);

    /* Headline / Bold */
    font-family: Poppins;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 30px;
    /* 150% */
}

.cardDetails .card-body h4 {
    color: var(--Orange-orange-300, #FD7856);

    /* Body / Bold */
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 19.2px;
    /* 120% */
}

.cardDetails .card-body p {
    color: var(--grey-dark-hover, #747474);

    /* Body / Regular */
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 150% */
}

.cardDetails .card-body .right {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.cardDetails .card-body h5 {
    color: var(--Green-Normal, #22C55E);
    text-align: center;

    /* Body / Bold */
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 24px;
    /* 150% */
}

@media(max-width:992px) {
    .cardDetails .card-body .left img {
        width: 180px;
        height: 104px;
    }

    .cardDetails .card-body h3 {
        font-size: 18px;
    }

    .cardDetails .card-body h4,
    .cardDetails .card-body p,
    .cardDetails .card-body h5 {
        font-size: 15px;
    }
}

@media(max-width:768px) {
    .cardDetails .card-body .row {
        display: block !important;
    }

    .cardDetails .card-body .left {
        display: block;
        margin-bottom: 1rem;
    }

    .cardDetails .card-body .right {
        flex-direction: column;
        justify-content: center;
    }

    .cardDetails .card-body .left img {
        width: 100%;
        height: 100%;
        max-height: 200px;
    }

    .cardDetails .card-body h3 {
        font-size: 16px;
        text-align: center;
    }

    .cardDetails .card-body h4,
    .cardDetails .card-body p,
    .cardDetails .card-body h5 {
        font-size: 14px;
        text-align: center;
    }
}

@media(max-width:570px) {
    .cardDetails .card-body h3 {
        font-size: 15px;
    }

    .cardDetails .card-body h4,
    .cardDetails .card-body p,
    .cardDetails .card-body h5 {
        font-size: 12px;
    }
}

/*---------------------------------------
accordion modules
-----------------------------------------*/
.accordion {
    width: 100%;
    background: transparent !important;
    --bs-accordion-bg: transparent;
    border: none !important;
    --bs-accordion-border-color: transparent;
}

.accordion-item {
    width: 100%;
    border-radius: 10px;
    background: #FFF;
    /* Shadow */
    box-shadow: 150px 534px 155px 0 rgba(171, 171, 171, 0.00), 96px 342px 142px 0 rgba(171, 171, 171, 0.01), 54px 192px 120px 0 rgba(171, 171, 171, 0.05), 24px 85px 89px 0 rgba(171, 171, 171, 0.09), 6px 21px 49px 0 rgba(171, 171, 171, 0.10);
    margin-bottom: 30px;
}


.accordion-item .accordion-header .accordion-button {
    color: var(--Blue-blue-700, #919191);
    font-weight: 400;
    /* H4 / Regular */
    font-family: Poppins;
    font-size: 25px;
    font-style: normal;
    line-height: 30px;
    /* 120% */
    min-height: 123px;
    box-shadow: none !important;
    background: transparent;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}

.faq .accordion-item .accordion-header .accordion-button {
    color: var(--Blue-blue-700, #0068A9);

    /* Headline / Bold */
    font-family: Poppins;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 30px;
    /* 150% */
    min-height: 70px;
}

.accordion-item .accordion-body p {
    color: var(--Black-black-300, #737373);
    /* Caption / Regular */
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 25.2px;
    /* 120% */
    text-align: left !important;
    /* 120% */
}

.accordion-button::after {
    background-image: url('../img/chevron.svg') !important;
    background-size: 15px;
    background-position: center;
}

@media(max-width:992px) {

    .accordion-item .accordion-header .accordion-button {
        font-size: 20px;
        min-height: 100px;
    }

    .faq .accordion-item .accordion-header .accordion-button {
        font-size: 18px;
    }

    .accordion-item .accordion-body p {
        font-size: 15px;
    }
}

@media(max-width:768px) {

    .accordion-item .accordion-header .accordion-button {
        font-size: 18px;
        min-height: 70px;
    }

    .faq .accordion-item .accordion-header .accordion-button {
        font-size: 16px;
    }

    .accordion-item .accordion-body p {
        font-size: 14px;
    }
}

@media(max-width:570px) {

    .accordion-item .accordion-header .accordion-button {
        font-size: 16px;
    }

    .faq .accordion-item .accordion-header .accordion-button {
        font-size: 14px;
    }

    .accordion-item .accordion-body p {
        font-size: 12px;
    }
}

/*-------------------------------------------
cardRaison
-----------------------------------------*/
.section-raisons {
    position: relative;
}

.section-raisons .bg-img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
}

.cardRaison img {
    width: 19.5px;
    height: 19.5px;
    object-fit: contain;
}

.cardRaison h3 {
    color: var(--orange-normal-hover, #E65C00);

    /* Headline / Regular */
    font-family: Poppins;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 30px;
    /* 150% */
}

.cardRaison p {
    color: var(--Grey-Darker, #444);

    /* Body / Regular */
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 150% */
}

@media(max-width:992px) {
    .cardRaison h3 {
        font-size: 18px;
    }

    .cardRaison p {
        font-size: 15px;
    }
}

@media(max-width:768px) {
    .cardRaison h3 {
        font-size: 16px;
    }

    .cardRaison p {
        font-size: 14px;
    }
}

@media(max-width:570px) {
    .cardRaison h3 {
        font-size: 15px;
    }

    .cardRaison p {
        font-size: 12px;
    }
}

/*-----------------------------
cardGroup
--------------------------------*/
.section-groups {
    position: relative;
}

.section-groups .bg-img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
}

.cardGroup {
    width: 100%;
    max-width: 380px;
    height: 100%;
    border-radius: 10px;
    background: #FFF;

    /* Shadow blue */
    box-shadow: 10px 8px 20px 0 rgba(0, 81, 131, 0.25);
}

.cardGroup .card-header img {
    width: 100%;
    height: 140px;
    border-radius: 10px 10px 0 0;
    background: url(<path-to-image>) lightgray 50% / cover no-repeat, #FFF;
    object-fit: cover;
}

.cardGroup .card-header h3 {
    color: var(--Blue-Normal, #0098F3);
    text-align: center;

    /* Headline / Bold */
    font-family: Poppins;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 30px;
    /* 150% */
}

.cardGroup .card-header .badge {
    color: #FFF;
    text-align: center;

    /* Caption / Bold */
    font-family: Poppins;
    font-size: 11px;
    font-style: normal;
    font-weight: 600;
    line-height: 16.5px;
    /* 150% */
    border-radius: 20px;
    text-transform: capitalize;
}

.cardGroup .card-body small {
    color: var(--Grey-Darker, #444);
    text-align: center;

    /* Subtitle / Regular */
    font-family: Poppins;
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 15.6px;
    /* 120% */
}

.cardGroup .card-body p {
    color: var(--grey-dark-hover, #747474);
    /* Caption / Regular */
    font-family: Poppins;
    font-size: 11px;
    font-style: normal;
    font-weight: 400;
    line-height: 16.5px;
    /* 150% */
}

.cardGroup .card-footer p {
    color: var(--Blue-Normal, #0098F3);
    text-align: center;
    /* Subtitle / Regular */
    font-family: Poppins;
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 15.6px;
    /* 120% */
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2px;
}

@media(max-width:992px) {
    .cardGroup .card-header h3 {
        font-size: 18px;
    }

    .cardGroup .card-body small,
    .cardGroup .card-footer p {
        font-size: 12px;
    }
}

@media(max-width:768px) {
    .cardGroup .card-header h3 {
        font-size: 16px;
    }
}

@media(max-width:570px) {
    .cardGroup .card-header h3 {
        font-size: 15px;
    }
}

/*----------------------
cardDemo
----------------------*/
.cardDemo {
    width: 100%;
    max-width: 400px;
    height: 100%;
}

.cardDemo img {
    width: 100%;
    height: 265px;
    border-radius: 10px;
    filter: brightness(50%);
    background: var(--Grey-Darker, #444);
    object-fit: cover;
}

.cardDemo .card-header {
    position: relative;
}


.cardDemo .card-header .btn-play {
    display: flex;
    width: 60px;
    height: 60px;
    padding: 0px;
    justify-content: center;
    align-items: center;
    position: absolute;
    right: 40%;
    top: 40%;
    border-radius: 50%;
}

.cardDemo .card-header .btn-play svg {
    width: 100% !important;
    height: 100% !important;
}

.cardDemo h3 {
    color: var(--Orange-Normal, #F60);
    text-align: start;
    /* Headline / Bold */
    font-family: Poppins;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 30px;
    /* 150% */
}

@media(max-width:992px) {
    .cardDemo h3 {
        font-size: 18px;
    }

    .cardDemo img {
        height: 250px;
    }

    .cardDemo .card-header .btn-play {
        right: 43%;
    }
}

@media(max-width:768px) {
    .cardDemo h3 {
        font-size: 16px;
    }

    .cardDemo img {
        height: 250px;
    }
}

@media(max-width:570px) {
    .cardDemo h3 {
        font-size: 14px;
    }

    .cardDemo img {
        height: 200px;
    }
}

/*-------------------------
cardTuto
----------------------------*/
.cardTuto {
    width: 100%;
    max-width: 320px;
    border-radius: 20px;
    background: #FFF;
    /* Shadow blue */
    box-shadow: 10px 8px 20px 0 rgba(0, 81, 131, 0.25);
    transition: transform 0.2s ease-in-out;
    cursor: pointer;
}

.cardTuto:hover {
    transform: translateY(-5px);
}

.cardTuto .card-header {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    padding-bottom: 0px;
}

.cardTuto img {
    height: 179.486px;
    object-fit: contain;
}

.cardTuto h3 {
    color: var(--Blue-Normal, #0098F3);
    text-align: center;
    /* H3/Bold */
    font-family: Poppins;
    font-size: 31px;
    font-style: normal;
    font-weight: 800;
    line-height: 37.2px;
    /* 120% */
}

.cardTuto p {
    color: var(--grey-normal-active, #9A9A9A);
    text-align: center;
    /* Body / Regular */
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 150% */
}

@media(max-width:992px) {

    .cardTuto img {
        height: 159.486px;
    }

    .cardTuto h3 {
        font-size: 28px;
    }

    .cardTuto p {
        font-size: 15px;
    }
}

@media(max-width:768px) {
    .cardTuto img {
        height: 139.486px;
    }

    .cardTuto h3 {
        font-size: 25px;
    }

    .cardTuto p {
        font-size: 14px;
    }
}

@media(max-width:570px) {
    .cardTuto img {
        height: 109.486px;
    }

    .cardTuto h3 {
        font-size: 20px;
    }

    .cardTuto p {
        font-size: 12px;
    }
}

/*--------------------------
tutoriels
----------------------------*/
.tutoriels p {
    color: var(--Black-black-300, #737373);
    /* Headline / Regular */
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 120% */
    margin-top: 0px;
}

.tutoriels img {
    width: 100%;
    object-fit: contain;
}

.tutoriels .titles ul li a {
    color: var(--Primary-surface-darker, #005183);
    /* Headline / Regular */
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 120% */
}

.tutoriels .titles ul li a.active {
    font-weight: 700;
    color: var(--Primary-Border-lighter, #54B7F4);
}

@media(max-width:992px) {

    .tutoriels p,
    .tutoriels .titles ul li a {
        font-size: 15px;
    }
}

@media(max-width:768px) {

    .tutoriels p,
    .tutoriels .titles ul li a {
        font-size: 14px;
    }
}

@media(max-width:570px) {

    .tutoriels p,
    .tutoriels .titles ul li a {
        font-size: 12px;
    }
}

/*--------------------------
cardParteneriat
------------------------------*/
.cardParteneriat .image img {
    width: 100%;
    max-width: 548px;
    height: 533px;
    object-fit: cover;
    border-radius: 40px;
    background: url(<path-to-image>) lightgray 50% / cover no-repeat;
}

.cardParteneriat ul li {
    display: flex;
    align-items: center;
    justify-content: start;
    gap: 1rem;
}

.cardParteneriat ul li:last-child {
    margin-bottom: 0px !important;
}

.cardParteneriat ul li .box {
    display: flex;
    width: 70px;
    height: 70px;
    justify-content: center;
    align-items: center;
    aspect-ratio: 1/1;
    border-radius: 50%;
    background: #FFF;
    /* Shadow blue */
    box-shadow: 10px 8px 20px 0 rgba(0, 81, 131, 0.25);
}

.cardParteneriat ul li .box img {
    width: 60%;
    height: 60%;
    object-fit: contain;
}

.cardParteneriat ul li h3 {
    color: var(--Grey-Darker, #444);
    /* Headline / Bold */
    font-family: Poppins;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 30px;
    /* 150% */
    margin-bottom: 0.5rem;
}

.cardParteneriat ul li p {
    color: var(--Grey-Darker, #444);

    /* Body / Regular */
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 150% */
}

@media(max-width:992px) {
    .cardParteneriat .image img {
        max-width: 518px;
        height: 500px;
    }

    .cardParteneriat ul li .box {
        width: 60px;
        height: 60px;
    }

    .cardParteneriat ul li h3 {
        font-size: 18px;
    }

    .cardParteneriat ul li p {
        font-size: 15px;
    }
}

@media(max-width:768px) {
    .cardParteneriat .image img {
        max-width: none;
        height: auto;
        margin-bottom: 1rem;
    }

    .cardParteneriat ul li .box {
        width: 50px;
        height: 50px;
    }

    .cardParteneriat ul li h3 {
        font-size: 16px;
    }

    .cardParteneriat ul li p {
        font-size: 14px;
    }
}

@media(max-width:570px) {
    .cardParteneriat .image img {
        max-width: 488px;
        height: 470px;
    }

    .cardParteneriat ul li .box {
        width: 40px;
        height: 40px;
    }

    .cardParteneriat ul li h3 {
        font-size: 15px;
    }

    .cardParteneriat ul li p {
        font-size: 12px;
    }
}

/*-----------------------
cardProgramme
-------------------------*/
.cardProgramme {
    width: 100%;
    max-width: 594px;
}

.cardProgramme.mt-50 {
    margin-top: 200px;
}

.cardProgramme img {
    width: 100%;
    height: 355px;
    border-radius: 25px;
    background: url(<path-to-image>) lightgray 50% / cover no-repeat, #FFF;

    /* Shadow blue */
    box-shadow: 10px 8px 20px 0 rgba(0, 81, 131, 0.25);
    object-fit: cover;
}

.cardProgramme h3 {
    color: var(--orange-normal-hover, #E65C00);
    text-align: center;

    /* H4 / Bold */
    font-family: Poppins;
    font-size: 25px;
    font-style: normal;
    font-weight: 700;
    line-height: 30px;
    /* 120% */
    margin-bottom: 1rem;
}

.cardProgramme p {
    color: var(--grey-dark-active, #575757);
    text-align: center;

    /* Body / Regular */
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 150% */
}

@media(max-width:992px) {
    .cardProgramme.mt-50 {
        margin-top: 170px;
    }

    .cardProgramme img {
        height: 325px;
    }

    .cardProgramme h3 {
        font-size: 20px;
    }

    .cardProgramme p {
        font-size: 15px;
    }
}

@media(max-width:768px) {
    .cardProgramme.mt-50 {
        margin-top: 150px;
    }

    .cardProgramme img {
        height: 300px;
    }

    .cardProgramme h3 {
        font-size: 18px;
    }

    .cardProgramme p {
        font-size: 14px;
    }
}

@media(max-width:570px) {
    .cardProgramme.mt-50 {
        margin-top: 0px;
    }

    .cardProgramme img {
        height: 200px;
    }

    .cardProgramme h3 {
        font-size: 16px;
    }

    .cardProgramme p {
        font-size: 12px;
    }
}

/*-------------------------
cardSolution
---------------------------*/
.cardSolution {
    width: 100%;
    max-width: 434px;
    min-height: 344px;
    position: relative;
    padding-right: 2rem;
}

.cardSolution.mt-50 {
    margin-top: 150px;
}

.cardSolution .bg-img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
}

.cardSolution .card-header {
    position: relative;
    width: 100%;
}

.cardSolution.one .card-header,
.cardSolution.two .card-header {
    display: flex;
    align-items: center;
    justify-content: flex-end;

}

.cardSolution .card-header .btn {
    position: absolute;
    top: 0;
    left: 0;
    width: 100px;
    height: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0px 0px;
    border-radius: 50%;
    background: var(--orange-light-hover, #FFE8D9);
}

.cardSolution.three .card-header .btn,
.cardSolution.four .card-header .btn {
    right: 0rem;
    left: unset;
}

.cardSolution .card-header .btn svg {
    width: 50% !important;
    height: 50% !important;
    object-fit: contain;
}

.cardSolution.primary .card-header .btn {
    background: var(--blue-light-hover, #D9F0FD);
}

.cardSolution .card-header img {
    max-width: 256px;
    max-height: 207px;
    object-fit: contain;
    margin-top: 1rem;
}

.cardSolution .card-body {
    position: relative;
}

.cardSolution h3 {
    color: #FFF;

    /* H4 / Bold */
    font-family: Poppins;
    font-size: 25px;
    font-style: normal;
    font-weight: 700;
    line-height: 30px;
    /* 120% */
}

.cardSolution p {
    color: #FFF;

    /* Body / Regular */
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 150% */
}

@media(max-width:992px) {
    .cardSolution.mt-50 {
        margin-top: 130px;
    }

    .cardSolution {
        max-width: 414px;
        min-height: 324px;
    }

    .cardSolution .card-header img {
        max-width: 236px;
        max-height: 187px;
    }

    .cardSolution h3 {
        font-size: 20px;
    }

    .cardSolution p {
        font-size: 15px;
    }
}

@media(max-width:887px) {
    .cardSolution.mt-50 {
        margin-top: 100px;
    }

    .cardSolution {
        max-width: 394px;
        min-height: 304px;
    }

    .cardSolution .card-header img {
        max-width: 216px;
        max-height: 167px;
    }

    .cardSolution .card-header .btn {
        width: 90px;
        height: 90px;
    }
}

@media(max-width:768px) {
    .cardSolution.mt-50 {
        margin-top: 0px;
    }

    .cardSolution h3 {
        font-size: 18px;
    }

    .cardSolution p {
        font-size: 14px;
    }
}

@media(max-width:570px) {
    .cardSolution h3 {
        font-size: 16px;
    }

    .cardSolution p {
        font-size: 12px;
    }
}

@media(max-width:400px) {
    .cardSolution .bg-img {
        display: none;

    }

    .cardSolution {
        padding-right: 0px;
        /* Shadow blue */
        box-shadow: 10px 8px 20px 0 rgba(0, 81, 131, 0.25);
        border-radius: 25px;
    }

    .cardSolution .card-header .btn {
        width: 50px;
        height: 50px;
        margin: 5px 5px;
    }

    .cardSolution .card-header {
        display: flex;
        align-items: center;
        justify-content: center !important;
    }

    .cardSolution.three,
    .cardSolution.two {
        background: #FFF;
    }

    .cardSolution.one,
    .cardSolution.four {
        background: #0098F3;
    }

    .cardSolution h3,
    .cardSolution p {
        text-align: center !important;
    }
}

/*----------------------------------
cardModel
-----------------------------------*/
.cardModel {
    width: 100%;
    max-width: 373px;
    height: 100%;
    border-radius: 15px;
    background: #FFF;
    padding: 6px 20px;
    /* Shadow */
    box-shadow: 150px 534px 155px 0 rgba(171, 171, 171, 0.00), 96px 342px 142px 0 rgba(171, 171, 171, 0.01), 54px 192px 120px 0 rgba(171, 171, 171, 0.05), 24px 85px 89px 0 rgba(171, 171, 171, 0.09), 6px 21px 49px 0 rgba(171, 171, 171, 0.10);
}

.cardModel.premium {
    border: 1px solid var(--Orange-Normal, #F60);
}

.cardModel .badge {
    color: #FFF;
    font-family: Poppins;
    font-size: 13px;
    font-style: normal;
    font-weight: 600;
    line-height: 15.6px;
    /* 120% */
    border-radius: 8px;
    width: fit-content;
}

.cardModel .card-header {
    border-radius: 20px;
    border: 2px solid rgba(230, 245, 254, 0.50);
    background: linear-gradient(136deg, #FFF 17.69%, #F1F9FF 52.32%, #FFF 86.95%);
    min-height: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.cardModel .card-header h3 {
    color: var(--blue-dark-hover, #005B92);
    text-align: center;

    /* Headline / Bold */
    font-family: Poppins;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 30px;
    /* 150% */
}

.cardModel ul li {
    display: flex;
    align-items: start;
    justify-content: start;
    gap: 5px;
    color: var(--Primary-600, #007AD4);

    /* Body / Regular */
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    margin-top: 1rem;
    margin-bottom: 1rem;
}

.cardModel ul li:first-child {
    margin-top: 0px;
}

.cardModel ul li:last-child {
    margin-bottom: 0px;
}

@media(max-width:992px) {
    .cardModel .badge {
        font-size: 12px;
    }

    .cardModel h3 {
        font-size: 18px;
    }

    .cardModel ul li {
        font-size: 15px;
    }
}

@media(max-width:768px) {
    .cardModel .badge {
        font-size: 11px;
    }

    .cardModel h3 {
        font-size: 16px;
    }

    .cardModel ul li {
        font-size: 14px;
    }
}

@media(max-width:570px) {
    .cardModel h3 {
        font-size: 15px;
    }

    .cardModel ul li {
        font-size: 13px;
    }
}

/*--------------------------
bg-image-blue
----------------------------*/
.bg-image-blue {
    background: var(--Final-background, #F1F9FF);
    position: relative;
}

.bg-image-blue .bg-img {
    position: absolute;
    top: 0;
    left: 0px;
    width: 100%;
}

.bg-image-blue .section-title {
    position: relative;
}

/*------------------------------
cardEssentiels
--------------------------------*/
.cardEssentiels {
    width: 100%;
    border-radius: 40px;
    background: #FFF;
    /* Shadow blue */
    box-shadow: 10px 8px 20px 0 rgba(0, 81, 131, 0.25);
}

.cardLivre {
    width: 100%;
    max-width: 299px;
}

.cardLivre .card-header {
    background-image: url("../img/incubation/bg-livre.png");
    background-repeat: no-repeat;
    background-size: cover;
    height: 283px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 20px;
}

.cardLivre img {
    width: 100%;
    max-height: 182px;
    object-fit: contain;
}

.cardLivre h3 {
    color: var(--Blue-Normal, #0098F3);
    text-align: center;

    /* H4 / Bold */
    font-family: Poppins;
    font-size: 25px;
    font-style: normal;
    font-weight: 700;
    line-height: 30px;
    /* 120% */
}

.cardLivre p {
    color: var(--Grey-Darker, #444);
    text-align: center;

    /* Headline / Regular */
    font-family: Poppins;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 30px;
    /* 150% */
}

@media(max-width:992px) {
    .cardLivre .card-header {
        height: 253px;
    }

    .cardLivre img {
        max-height: 162px;
    }

    .cardLivre h3 {
        font-size: 20px;
    }

    .cardLivre p {
        font-size: 18px;
    }
}

@media(max-width:768px) {
    .cardLivre .card-header {
        height: 203px;
    }

    .cardLivre img {
        max-height: 142px;
    }

    .cardLivre h3 {
        font-size: 18px;
    }

    .cardLivre p {
        font-size: 16px;
    }
}

@media(max-width:570px) {

    .cardLivre h3 {
        font-size: 16px;
    }

    .cardLivre p {
        font-size: 14px;
    }
}

/*--------------------------------
cardNumber
---------------------------------*/
.cardNumber .card-header {
    padding-bottom: 0px;
}

.cardNumber .card-body {
    padding-top: 10px;
}

.cardNumber h4 {
    color: #FFF;
    text-align: center;
    font-family: Poppins;
    font-size: 49px;
    font-style: normal;
    font-weight: 600;
    line-height: 58.8px;
    /* 120% */
}

.cardNumber p {
    color: #FFF;
    text-align: center;

    /* Headline / Regular */
    font-family: Poppins;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 30px;
    /* 150% */
    display: flex;
    align-items: center;
    justify-content: center;
    column-gap: 5px;
}

.statFinance .cardNumber p {
    font-size: 16px;
}

@media(max-width:992px) {
    .numbersWrap {
        display: grid !important;
        grid-template-columns: 1fr 1fr;
        gap: 16px;
        align-items: start;
    }

    .cardNumber h4 {
        font-size: 40px;
    }

    .cardNumber p {
        font-size: 18px;
    }

    .statFinance .cardNumber p {
        font-size: 15px;
    }

    .cardNumber p svg {
        width: 25px !important;
        height: 25px !important;
        object-fit: contain;
    }
}

@media(max-width:768px) {
    .cardNumber h4 {
        font-size: 35px;
    }

    .cardNumber p {
        font-size: 16px;
    }

    .statFinance .cardNumber p {
        font-size: 14px;
    }

    .cardNumber p svg {
        width: 20px !important;
        height: 20px !important;
        object-fit: contain;
    }
}

@media(max-width:570px) {
    .cardNumber h4 {
        font-size: 30px;
    }

    .cardNumber p {
        font-size: 14px;
    }

    .statFinance .cardNumber p {
        font-size: 12px;
    }

    .cardNumber p svg {
        width: 15px !important;
        height: 15px !important;
        object-fit: contain;
    }
}

/*----------------------------
video container
------------------------------*/
.video-container {
    position: relative;
    width: 100%;
    max-width: 1100px;
    overflow: hidden;
}

.video-container video {
    width: 100%;
    border-radius: 20px;
    background: rgba(54, 54, 54, 0.40);
    max-height: 494px;
    object-fit: cover;
    display: block;
}

.video-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    border-radius: 20px;
    /* assombrir */
    display: flex;
    align-items: center;
    justify-content: center;
    transition: opacity 0.3s ease;
    opacity: 1;
    /* ne bloque pas les clics */
    z-index: 2;
    pointer-events: auto;
}

.video-overlay.hide {
    opacity: 0;
    pointer-events: none;
    /* quand caché → clics passent à la vidéo */
}

.play-btn {
    background: transparent;
    border: none;
    cursor: pointer;
    z-index: 3;
    pointer-events: auto;
    /* bouton reste cliquable */
}

.video-container .play-btn img {
    width: 70px;
    height: 70px;
    border-radius: 50%;
}

@media(max-width:992px) {
    .video-container .play-btn img {
        width: 50px;
        height: 50px;
    }
}

@media(max-width:786px) {
    .video-container .play-btn img {
        width: 40px;
        height: 40px;
    }
}

/*------------------------
.modalVideo 
--------------------------*/

.modalVideo .modal-content {
    border-radius: 30px;
    background: var(--Color, #FFF);
    /* shdow final */
    box-shadow: 10px 8px 20px 0 rgba(0, 81, 131, 0.25);
}

.modalVideo .modal-header {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.modalVideo .title {
    color: var(--Blue-Normal, #0098F3);
    text-align: center;
    /* H4 / Bold */
    font-family: Poppins;
    font-size: 25px;
    font-style: normal;
    font-weight: 700;
    line-height: 30px;
    /* 120% */
}

.modalVideo .btnclose {
    width: 25px;
    height: 25px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0px 0px;
    background: #0098F3;
    position: absolute;
    top: 20px;
    right: 25px;
    cursor: pointer;
    z-index: 1;
}

.btnclose i {
    color: #fff;
    font-size: 1rem;
}

.modalVideo .modal-content video {
    border-radius: 10px;
    width: 100%;
    max-width: 686px;
}

.modalVideo .modal-body {
    padding: 10px 10px;
    position: relative;
}

/*-------------------------
cardSujet
--------------------------*/
.cardSujet {
    width: 100%;
    border-radius: 20px;
    background: #FFF;
    /* Shadow blue */
    box-shadow: 10px 8px 20px 0 rgba(0, 81, 131, 0.25);
}

.cardSujet .card-body {
    display: flex;
    align-items: center;
    justify-content: start;
    column-gap: 15px;
}

.cardSujet .image {
    border-radius: 20px;
    background: url(<path-to-image>) lightgray 50% / cover no-repeat, #FFF;
    width: 201px;
    height: 159px;
    object-fit: cover;
}

.cardSujet h3 {
    color: var(--Blue-Normal, #0098F3);

    /* Headline / Bold */
    font-family: Poppins;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 30px;
    /* 150% */
}

.cardSujet small {
    color: var(--Grey-Darker, #444);
    text-align: center;
    /* Subtitle / Regular */
    font-family: Poppins;
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 15.6px;
    /* 120% */
    display: flex;
    align-items: center;
    justify-content: start;
    column-gap: 5px;
}

.cardSujet p {
    display: flex;
    align-items: center;
    justify-content: start;
    column-gap: 5px;
    color: var(--Blue-Normal, #0098F3);
    text-align: center;
    /* Caption / Bold */
    font-family: Poppins;
    font-size: 11px;
    font-style: normal;
    font-weight: 600;
    line-height: 16.5px;
    /* 150% */
}

.media {
    display: flex;
    align-items: center;
    justify-content: start;
}

.media li {
    margin-left: -5px;
}

.media li:first-child {
    margin-left: 0px;
}

.media img {
    width: 20px;
    height: 20px;
    aspect-ratio: 1/1;
    object-fit: cover;
    border-radius: 50%;
    background: url(<path-to-image>) lightgray 50% / cover no-repeat;
}

.media span {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: #FFF;
    /* Shadow blue */
    box-shadow: 10px 8px 20px 0 rgba(0, 81, 131, 0.25);
    color: var(--grey-dark-active, #575757);
    font-family: Poppins;
    font-size: 8px;
    font-style: normal;
    font-weight: 400;
    line-height: 15px;
    /* 187.5% */
    text-transform: uppercase;
    display: flex;
    align-items: center;
    justify-content: center;
}

@media(max-width:992px) {
    .cardSujet .image {
        width: 190px;
        height: 150px;
    }

    .cardSujet h3 {
        font-size: 18px;
    }

    .cardSujet small {
        font-size: 12px;
    }
}

@media(max-width:768px) {
    .cardSujet h3 {
        font-size: 16px;
    }

    .cardSujet small {
        font-size: 12px;
    }
}

@media(max-width:570px) {
    .cardSujet .card-body {
        display: block;
    }

    .cardSujet .card-body .image {
        width: 100%;
        max-width: none;
        height: 200px;
        border-radius: 20px 20px 0 0;
    }

    .cardSujet .bottom {
        display: block !important;
    }

    .cardSujet .bottom .btn {
        width: 100%;
        margin-top: 10px;
    }
}

/*-------------------------
cardStartup
-------------------------*/
.cardStartup {
    width: 100%;
    max-width: 310px;
    height: 100%;
    min-height: 327px;
    border-radius: 13px;
    background: var(--Color, #FFF);
    box-shadow: 10px 8px 20px 0 rgba(0, 81, 131, 0.09);
    transition: transform 0.2s ease-in-out;
    cursor: pointer;
}

.cardStartup:hover {
    transform: translateY(-5px);
}

.cardStartup .card-header img {
    width: 100%;
    height: 137px;
    object-fit: contain;
}

.cardStartup h3 {
    color: var(--Orange-Normal, #F60);
    text-align: center;

    /* Headline / Bold */
    font-family: Poppins;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 30px;
    /* 150% */
}

.cardStartup p {
    color: var(--Greyscale-Text-negative, #2E2E2E);
    text-align: center;

    /* Body / Regular */
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 150% */
}

@media(max-width:992px) {
    .cardStartup {
        min-height: 300px;
    }

    .cardStartup .card-header img {
        width: 100%;
        height: 100px;
    }

    .cardStartup h3 {
        font-size: 18px;
    }

    .cardStartup p {
        font-size: 15px;
    }
}

@media(max-width:768px) {
    .cardStartup .card-header img {
        width: 100%;
        height: 100px;
    }

    .cardStartup h3 {
        font-size: 16px;
    }

    .cardStartup p {
        font-size: 12px;
    }
}

@media(max-width:570px) {
    .cardStartup .card-header img {
        width: 100%;
        height: 70px;
    }

    .cardStartup h3 {
        font-size: 14px;
    }

    .cardStartup p {
        font-size: 12px;
    }
}

/*------------------------
cardDetailsStartup
---------------------------*/
.cardDetailsStartup .card-body {
    display: flex;
    align-items: center;
    justify-content: start;
    width: 100%;
    position: relative;
    height: 100%;
}

.cardDetailsStartup .box {
    width: 200px;
    height: 200px;
    border-radius: 50%;
    background: #FFF;
    padding: 34px;
    /* Shadow blue */
    box-shadow: 10px 8px 20px 0 rgba(0, 81, 131, 0.25);
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    z-index: 1;
}

.cardDetailsStartup .box img {
    width: 70%;
    height: 50%;
    object-fit: contain;
}

.cardDetailsStartup.coach .box img {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    object-fit: cover;
}

.cardDetailsStartup .text {
    border-radius: 20px;
    background: #FFF;
    /* Shadow blue */
    box-shadow: 10px 8px 20px 0 rgba(0, 81, 131, 0.25);
    min-height: 200px;
    padding: 34px;
    width: calc(100% - 100px);
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: absolute;
    left: 100px;
    z-index: 0;
    padding-left: 150px;
}


.cardDetailsStartup h1 {
    color: var(--grey-dark-active, #575757);
    text-align: left;
    /* H4 / Bold */
    font-family: Poppins;
    font-size: 25px;
    font-style: normal;
    font-weight: 700;
    line-height: 30px;
    /* 120% */
}

.cardDetailsStartup p {
    color: var(--grey-dark-active, #575757);
    text-align: left;
    /* Body / Regular */
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 150% */
}

.cardDetailsStartup small {
    display: flex;
    align-items: center;
    justify-content: start;
    column-gap: 5px;
    color: var(--grey-dark-active, #575757);
    /* Body / Regular */
    font-family: Poppins;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
}

.cardDetailsStartup small strong {
    color: #0098F3;
}

@media(max-width:1045px) {
    .cardDetailsStartup .card-body {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }

    .cardDetailsStartup .box {
        width: 180px;
        height: 180px;
        top: 90px;
    }

    .cardDetailsStartup .text {
        display: block;
        padding-left: 34px;
        position: relative;
        left: 0px;
        width: 100%;
        padding-top: 90px;
    }

    .cardDetailsStartup .text .btn {
        margin-top: 10px;
    }

    .cardDetailsStartup h1 {
        font-size: 18px;
    }

    .cardDetailsStartup p {
        font-size: 15px;
    }

    .cardDetailsStartup small {
        font-size: 13px;
    }
}

@media(max-width:768px) {
    .cardDetailsStartup .box {
        width: 150px;
        height: 150px;
        top: 75px;
    }

    .cardDetailsStartup .text {
        padding-top: 75px;
    }

    .cardDetailsStartup h1 {
        font-size: 16px;
    }

    .cardDetailsStartup p {
        font-size: 14px;
    }

    .cardDetailsStartup small {
        font-size: 12px;
    }
}

@media(max-width:570px) {


    .cardDetailsStartup .box {
        width: 100px;
        height: 100px;
        position: relative;
        top: 50px;
        padding: 10px 10px;
    }

    .cardDetailsStartup .box img {
        height: 80%;
        width: 80%;

    }

    .cardDetailsStartup .text {
        padding-left: 34px;
        padding-top: 70px;
        margin-left: 0px;
        position: relative;
        width: 100%;
        left: 0px;
    }

    .cardDetailsStartup h1 {
        text-align: center;
    }

    .cardDetailsStartup p {
        text-align: center;
    }

    .cardDetailsStartup .infos {
        justify-content: center !important;
    }

    .cardDetailsStartup .btn {
        width: 100%;
    }
}

/*-----------------------
cardDetails-2
-----------------------*/
.cardDetails-2 {
    width: 100%;
    border-radius: 20px;
    background: #FFF;
    /* Shadow blue */
    box-shadow: 10px 8px 20px 0 rgba(0, 81, 131, 0.25);
}

.cardDetails-2 h2 {
    color: var(--Orange-Normal, #F60);
    /* H3/Bold */
    font-family: Poppins;
    font-size: 31px;
    font-style: normal;
    font-weight: 800;
    line-height: 37.2px;
    /* 120% */
}

.cardDetails-2 p {
    color: #000;
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 30px;
}

.cardDetails-2 strong {
    color: #0098F3;
}

.cardDetails-2 .right {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    align-items: start;
}

.cardDetails-2 .right .box {
    padding: 20px 20px;
    width: 100%;
    max-width: 304px;
    height: 100%;
    min-height: 160px;
    border-radius: 20px;
    border: 4px solid rgba(230, 245, 254, 0.50);
    background: linear-gradient(136deg, #FFF 17.69%, #F1F9FF 52.32%, #FFF 86.95%);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.cardDetails-2 .right .box img {
    width: 70px;
    height: 70px;
    flex-shrink: 0;
    aspect-ratio: 1/1;
    object-fit: contain;
    margin-bottom: 10px;
}

.cardDetails-2 .right .box h3 {
    color: var(--Orange-Normal, #F60);
    text-align: center;
    /* Body / Bold */
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 24px;
    /* 150% */
}

@media(max-width:992px) {
    .cardDetails-2 h2 {
        font-size: 28px;
    }

    .cardDetails-2 p,
    .cardDetails-2 .right .box h3 {
        font-size: 15px;
    }

    .cardDetails-2 .right .box img {
        width: 60px;
        height: 60px;
    }
}

@media(max-width:768px) {
    .cardDetails-2 h2 {
        font-size: 25px;
    }

    .cardDetails-2 p,
    .cardDetails-2 .right .box h3 {
        font-size: 14px;
    }

    .cardDetails-2 .right .box img {
        width: 50px;
        height: 50px;
    }

    .cardDetails-2 .right {
        margin-top: 1rem;
    }
}

@media(max-width:570px) {
    .cardDetails-2 h2 {
        font-size: 20px;
    }

    .cardDetails-2 p,
    .cardDetails-2 .right .box h3 {
        font-size: 13px;
    }

    .cardDetails-2 .right {
        display: block;
    }

    .cardDetails-2 .right .box {
        max-width: none;
        margin-bottom: 1rem;
    }

    .cardDetails-2 .right .box img {
        width: 40px;
        height: 40px;
    }
}

/*--------------------
cardNumber
-------------------------*/
.cardNumber .card-header {
    display: flex;
    align-items: center;
    justify-content: center;
}

.cardNumber .card-header .box {
    width: 70px;
    height: 70px;
    padding: 10px;
    border-radius: 50%;
    background: var(--orange-light-hover, #FFE8D9);
    display: flex;
    align-items: center;
    justify-content: center;
}

.cardNumber .card-header .box img {
    width: 80%;
    height: 80%;
    object-fit: contain;
}

.cardNumber h3 {
    color: var(--Orange-Dark, #BF4D00);
    text-align: center;
    /* Headline / Regular */
    font-family: Poppins;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 30px;
    /* 150% */
}

@media(max-width:992px) {
    .cardNumber .card-header .box {
        width: 60px;
        height: 60px;
    }

    .cardNumber h3 {
        font-size: 18px;
    }
}

@media(max-width:768px) {
    .cardNumber .card-header .box {
        width: 50px;
        height: 50px;
    }

    .cardNumber h3 {
        font-size: 16px;
    }
}

@media(max-width:570px) {
    .cardNumber .card-header .box {
        width: 40px;
        height: 40px;
    }

    .cardNumber h3 {
        font-size: 14px;
    }
}

/*-----------------------
cardDoc
-------------------------*/
.cardDoc {
    border-radius: 10px;
    background: #FFF;

    /* Shadow blue */
    box-shadow: 10px 8px 20px 0 rgba(0, 81, 131, 0.25);
    width: 100%;
    height: 100%;
}

.cardDoc .card-body {
    display: flex;
    align-items: center;
    justify-content: start;
}

.cardDoc .card-body svg {
    width: 45px !important;
    height: 38.7px !important;
    object-fit: contain;
    margin-right: 5px;
}

.cardDoc .card-body h4 {
    color: var(--Blue-Normal, #0098F3);

    /* Headline / Bold */
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 30px;
    /* 150% */
}

@media(max-width:992px) {
    .cardDoc .card-body svg {
        width: 40px !important;
        height: 30.7px !important;
    }

    .cardDoc .card-body h4 {
        font-size: 16px;
    }
}

@media(max-width:768px) {
    .cardDoc .card-body svg {
        width: 35px !important;
        height: 30.7px !important;
    }

    .cardDoc .card-body h4 {
        font-size: 15px;
    }
}

@media(max-width:570px) {
    .cardDoc .card-body h4 {
        font-size: 14px;
    }
}

/*--------------------------
cardStep
----------------------------*/
.cardStep {
    width: 100%;
    border-radius: 20px;
    background: #FFF;
    /* Shadow blue */
    box-shadow: 10px 8px 20px 0 rgba(0, 81, 131, 0.25);
    cursor: pointer;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.cardStep:hover {
    transform: translateY(-3px);
    box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.15);
}

.cardStep.active {
    border: 2px solid #0072B6;
}

/* Animation fade */
.fade-enter-active,
.fade-leave-active {
    transition: all 0.4s ease;
}

.fade-enter {
    opacity: 0;
    transform: translateY(20px);
}

.fade-leave-to {
    opacity: 0;
    transform: translateY(-20px);
}

.cardStep .card-body {
    display: flex;
    align-items: center;
    justify-content: start;
}

.cardStep .box {
    border-radius: 50%;
    display: flex;
    width: 66px;
    height: 66px;
    justify-content: center;
    align-items: center;
    margin-right: 10px;
}

.cardStep .box-finish {
    background: var(--green-light-active, #BAEDCD);
}

.cardStep .box-pending {
    background: #B0DFFB;
}

.cardStep .box img {
    width: 50%;
    height: 50%;
    object-fit: contain;
}

.cardStep h3 {
    color: var(--Green-Normal, #22C55E);
    /* Headline / Bold */
    font-family: Poppins;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 30px;
    /* 150% */
}

.cardStep p {
    color: var(--grey-dark-hover, #747474);
    /* Body / Regular */
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 150% */
}

@media(max-width:992px) {
    .cardStep .box {
        width: 60px;
        height: 60px;
    }

    .cardStep h3 {
        font-size: 18px;
    }

    .cardStep p {
        font-size: 15px;
    }
}

@media(max-width:768px) {
    .cardStep .box {
        width: 55px;
        height: 55px;
    }

    .cardStep h3 {
        font-size: 16px;
    }

    .cardStep p {
        font-size: 14px;
    }
}

@media(max-width:570px) {
    .cardStep .box {
        width: 50px;
        height: 50px;
    }

    .cardStep h3 {
        font-size: 14px;
    }

    .cardStep p {
        font-size: 12px;
    }
}

/*-------------------------
cardDetailsStep
---------------------------*/
.cardDetailsStep {
    border-radius: 20px;
    background: #FFF;
    /* Shadow blue */
    box-shadow: 10px 8px 20px 0 rgba(0, 81, 131, 0.25);
    width: 100%;
    height: 100%;
}

.cardDetailsStep p {
    color: var(--Grey-Darker, #444);

    /* Body / Regular */
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 150% */
}

.cardDetailsStep .card-footer {
    border-radius: 0 0 20px 20px;
    background: #F2FAFF;
    display: flex;
    align-items: center;
    justify-content: start;
}

.cardDetailsStep .card-footer img {
    width: 100px;
    height: 100px;
    border-radius: 50%;
    object-fit: cover;
    margin-right: 10px;
}

.cardDetailsStep .card-footer h4 {
    color: var(--Blue-950, #001019);

    /* H4 / Bold */
    font-family: Poppins;
    font-size: 25px;
    font-style: normal;
    font-weight: 700;
    line-height: 30px;
    /* 120% */
}

.cardDetailsStep .card-footer p {
    color: var(--Blue-blue-500, #0093EE);
    /* Body / Regular */
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 19.2px;
    /* 120% */
}

@media(max-width:992px) {
    .cardDetailsStep svg {
        width: 60px !important;
        height: 60px !important;
        object-fit: contain;
    }

    .cardDetailsStep p,
    .cardDetailsStep .card-footer p {
        font-size: 15px;
    }

    .cardDetailsStep .card-footer img {
        width: 80px;
        height: 80px;
    }

    .cardDetailsStep .card-footer h4 {
        font-size: 20px;
    }
}

@media(max-width:768px) {
    .cardDetailsStep svg {
        width: 40px !important;
        height: 40px !important;
        object-fit: contain;
    }

    .cardDetailsStep p,
    .cardDetailsStep .card-footer p {
        font-size: 14px;
    }

    .cardDetailsStep .card-footer img {
        width: 60px;
        height: 60px;
    }

    .cardDetailsStep .card-footer h4 {
        font-size: 18px;
    }
}

@media(max-width:570px) {
    .cardDetailsStep svg {
        width: 30px !important;
        height: 30px !important;
        object-fit: contain;
    }

    .cardDetailsStep p,
    .cardDetailsStep .card-footer p {
        font-size: 12px;
    }

    .cardDetailsStep .card-footer img {
        width: 40px;
        height: 40px;
    }

    .cardDetailsStep .card-footer h4 {
        font-size: 16px;
    }
}

/*------------------------------
cardActualite
-------------------------------*/
.cardActualite {
    border-radius: 20px;
    background: #FFF;

    /* Shadow blue */
    box-shadow: 10px 8px 20px 0 rgba(0, 81, 131, 0.25);
    width: 100%;
    height: 100%;
}

.cardActualite .card-header h4 {
    color: var(--Blue-Normal, #0098F3);

    /* Headline / Bold */
    font-family: Poppins;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 30px;
    /* 150% */
}

.cardActualite .card-header p {
    color: var(--Grey-Dark, #919191);
    /* Subtitle / Regular */
    font-family: Poppins;
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 15.6px;
    /* 120% */
}

.cardActualite .box:nth-child(odd) {
    background: var(--Blue-Light, #E6F5FE);
}

.cardActualite .box:nth-child(even) {
    background: var(--blue-light-active, #B0DFFB);
}

.cardActualite .box:last-child {
    border-radius: 0 0 20px 20px;
}

.cardActualite .box h5 {
    color: var(--blue-normal-hover, #0089DB);
    /* Body / Bold */
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 24px;
    /* 150% */
}

.cardActualite .box p {
    color: var(--Blue-Normal, #0098F3);
    text-align: center;

    /* Caption / Regular */
    font-family: Poppins;
    font-size: 11px;
    font-style: normal;
    font-weight: 400;
    line-height: 16.5px;
    /* 150% */
}

.cardActualite .box .bottom p {
    color: #73CBFF;
}

.cardActualite .box:nth-child(even) .bottom p {
    color: #fff;
}

@media(max-width:992px) {
    .cardActualite .card-header h4 {
        font-size: 18px;
    }

    .cardActualite .card-header p {
        font-size: 12px;
    }

    .cardActualite .box h5 {
        font-size: 15px;
    }
}

@media(max-width:768px) {
    .cardActualite .card-header h4 {
        font-size: 16px;
    }

    .cardActualite .card-header p {
        font-size: 11px;
    }

    .cardActualite .box h5 {
        font-size: 14px;
    }
}

/*--------------------
modal-1
----------------------*/
.modal-1 .modal-content {
    border-radius: 30px;
    background: var(--Color, #FFF);
    /* shdow final */
    box-shadow: 10px 8px 20px 0 rgba(0, 81, 131, 0.25);
}

.modal-1 .modal-content .modal-header,
.modal-1 .modal-content .modal-footer {
    border: none;
}

.modal-1 .modal-content .btn-close {
    background-image: none !important;
}

.modal-1 .titleModal {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.modal-1 .titleModal img {
    width: 150px;
    height: 150px;
    aspect-ratio: 1/1;
    margin-bottom: 0.5rem;
}

.modal-1 .titleModal h5 {
    color: var(--Blue-Normal, #0098F3);
    text-align: center;
    /* H4 / Bold */
    font-family: Poppins;
    font-size: 25px;
    font-style: normal;
    font-weight: 700;
    line-height: 30px;
    /* 120% */
}

@media(max-width:992px) {
    .modal-1 .titleModal img {
        width: 100px;
        height: 100px;
    }

    .modal-1 .titleModal h5 {
        font-size: 18px;
    }
}

@media(max-width:768px) {
    .modal-1 .titleModal img {
        width: 80px;
        height: 80px;
    }

    .modal-1 .titleModal h5 {
        font-size: 16px;
    }
}

@media(max-width:570px) {
    .modal-1 .titleModal img {
        width: 50px;
        height: 50px;
    }

    .modal-1 .titleModal h5 {
        font-size: 14px;
    }
}

/*--------------------------
addComment
---------------------------*/
.addComment {
    border-radius: 10px;
    background: #FFF;
    /* Shadow blue */
    box-shadow: 10px 8px 20px 0 rgba(0, 81, 131, 0.25);
    width: 100%;
    display: flex;
    align-items: start;
    justify-content: start;
    column-gap: 10px;
}

.addComment .image {
    width: 50px;
    height: 50px;
    aspect-ratio: 1/1;
    border-radius: 50%;
    object-fit: cover;
}

.addComment .box {
    border-radius: 10px;
    background: var(--Grey-Light, #F9F9F9);
}

.addComment .box .form-control {
    box-shadow: none;
    border: none;
    background-color: transparent;
    color: var(--Grey-Normal, #000);

    /* Subtitle / Regular */
    font-family: Poppins;
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 15.6px;
    /* 120% */
}

.addComment .box .form-control::placeholder {
    color: var(--Grey-Normal, #C1C1C1);
}

.addComment .box .btn:hover {
    background-color: #E6F5FE;
}

@media(max-width:992px) {
    .addComment .image {
        width: 45px;
        height: 45px;
    }

    .addComment .box .form-control {
        font-size: 12px;
    }
}

@media(max-width:768px) {
    .addComment .image {
        width: 40px;
        height: 40px;
    }
}

@media(max-width:570px) {
    .addComment .image {
        width: 35px;
        height: 35px;
    }
}

/*-----------------------
cardComment
------------------------*/
.cardComment {
    border-radius: 10px;
    background: #FFF;

    /* Shadow blue */
    box-shadow: 10px 8px 20px 0 rgba(0, 81, 131, 0.25);
    width: 100%;
}

.cardComment .card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.cardComment .card-header img {
    width: 50px;
    height: 50px;
    aspect-ratio: 1/1;
    border-radius: 50%;
    object-fit: cover;
}

.cardComment .card-header h3 {
    color: var(--Blue-Dark, #0072B6);

    /* Body / Bold */
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 24px;
    /* 150% */
    display: flex;
    align-items: center;
    justify-content: start;
    column-gap: 5px;
}

.cardComment .card-header h3 span {
    color: var(--Grey-Dark, #919191);

    /* Caption / Regular */
    font-family: Poppins;
    font-size: 11px;
    font-style: normal;
    font-weight: 400;
    line-height: 16.5px;
    /* 150% */
    margin-left: 5px;
}

.cardComment .card-body p {
    color: var(--grey-dark-active, #575757);

    /* Subtitle / Regular */
    font-family: Poppins;
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 15.6px;
    /* 120% */
}

.cardComment .card-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.cardComment .card-footer .btn {
    color: #919191;
    font-family: Poppins;
    font-size: 13px;
    font-style: normal;
    font-weight: 600;
    line-height: 15.6px;
    /* 120% */
    display: flex;
    align-items: center;
    justify-content: center;
    column-gap: 5px;
}

.cardComment .card-footer .btn:hover {
    color: #0098F3;
}

.cardComment .card-footer .btn:hover svg path {
    stroke: #0098F3;
}

.cardComment .card-footer span {
    color: var(--Blue-Normal, #0098F3);
    text-align: center;

    /* Caption / Bold */
    font-family: Poppins;
    font-size: 11px;
    font-style: normal;
    font-weight: 600;
    line-height: 16.5px;
    /* 150% */
    display: flex;
    align-items: center;
    column-gap: 5px;
}

@media(max-width:992px) {
    .cardComment .card-header img {
        width: 45px;
        height: 45px;
    }

    .cardComment .card-header h3 {
        font-style: 15px;
    }

    .cardComment .card-body p,
    .cardComment .card-footer .btn {
        font-size: 12px;
    }

    .cardComment .card-footer span {
        font-size: 10px;
    }

    .cardComment .card-footer span svg,
    .cardComment .card-footer .btn svg {
        width: 15px !important;
        height: 15px !important;
    }
}

@media(max-width:768px) {
    .cardComment .card-header img {
        width: 40px;
        height: 40px;
    }

    .cardComment .card-header h3 {
        font-style: 14px;
    }

    .cardComment .card-body p,
    .cardComment .card-footer .btn {
        font-size: 12px;
    }

    .cardComment .card-footer span {
        font-size: 10px;
    }

    .cardComment .card-footer span svg,
    .cardComment .card-footer .btn svg {
        width: 10px !important;
        height: 10px !important;
    }
}

@media(max-width:570px) {
    .cardComment .card-header img {
        width: 35px;
        height: 35px;
    }
}

/*-------------------------
subComment
--------------------------*/
.subComment .card-body {
    display: flex;
    align-items: start;
    justify-content: start;
    column-gap: 10px;
}

.subComment .card-body .right {
    border-radius: 10px;
    background: var(--Grey-Light, #F9F9F9);
}

.subComment .card-body img {
    width: 30px;
    height: 30px;
    margin-top: 10px;
}

.subComment .card-body h3 {
    color: var(--Blue-Dark, #0072B6);
    /* Subtitle / Bold */
    font-family: Poppins;
    font-size: 13px;
    font-style: normal;
    font-weight: 600;
    line-height: 15.6px;
    /* 120% */
    display: flex;
    align-items: center;
    justify-content: start;
    column-gap: 5px;
}

.subComment .card-body h3 span {
    color: var(--Grey-Dark, #919191);

    /* Caption / Regular */
    font-family: Poppins;
    font-size: 11px;
    font-style: normal;
    font-weight: 400;
    line-height: 16.5px;
    /* 150% */
}

.subComment .card-body p {
    color: var(--grey-dark-active, #575757);
    /* Subtitle / Regular */
    font-family: Poppins;
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 15.6px;
    /* 120% */
}

.subComment .card-body .bottom .btn {
    color: var(--Grey-Dark, #919191);
    /* Caption / Regular */
    font-family: Poppins;
    font-size: 11px;
    font-style: normal;
    font-weight: 400;
    line-height: 16.5px;
    /* 150% */
}

.subComment .card-body .bottom span {
    color: var(--Blue-Normal, #0098F3);
    text-align: center;
    /* Caption / Bold */
    font-family: Poppins;
    font-size: 11px;
    font-style: normal;
    font-weight: 600;
    line-height: 16.5px;
    /* 150% */
    display: flex;
    align-items: center;
    justify-content: center;
    column-gap: 5px;
}

@media(max-width:992px) {
    .subComment .card-body img {
        width: 25px;
        height: 25px;
    }

    .subComment .card-body h3,
    .subComment .card-body p {
        font-size: 12px;
    }

    .subComment .card-body .bottom span {
        font-size: 10px;
    }

    .subComment .card-body .bottom span svg {
        width: 15px !important;
        height: 15px !important;
    }
}

@media(max-width:768px) {
    .subComment .card-body img {
        width: 20px;
        height: 20px;
    }

    .subComment .card-body h3,
    .subComment .card-body p {
        font-size: 12px;
    }

    .subComment .card-body .bottom span {
        font-size: 10px;
    }

    .subComment .card-body .bottom span svg {
        width: 10px !important;
        height: 10px !important;
    }
}

/*----------------------------
cardWarning
---------------------------*/
.cardWarning .card-body {
    display: flex;
    align-items: center;
    justify-content: start;
}

.cardWarning .card-body img {
    width: 100px;
    height: 100px;
    flex-shrink: 0;
    aspect-ratio: 1/1;
    object-fit: contain;
    margin-right: 1rem;
}

.cardWarning .card-body h4 {
    color: var(--orange-normal-hover, #E65C00);

    /* Headline / Bold */
    font-family: Poppins;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 30px;
    /* 150% */
}

.cardWarning .card-body p {
    color: #2E2E2E;
    /* Headline / Regular */
    font-family: Poppins;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 30px;
}

@media(max-width:992px) {
    .cardWarning .card-body img {
        width: 80px;
        height: 80px;
    }

    .cardWarning .card-body h4,
    .cardWarning .card-body p {
        font-size: 18px;
    }
}

@media(max-width:768px) {
    .cardWarning .card-body img {
        width: 60px;
        height: 60px;
    }

    .cardWarning .card-body h4,
    .cardWarning .card-body p {
        font-size: 16px;
    }
}

@media(max-width:570px) {
    .cardWarning .card-body .right {
        display: block !important;
    }

    .cardWarning .card-body img {
        width: 40px;
        height: 40px;
    }

    .cardWarning .card-body h4,
    .cardWarning .card-body p {
        font-size: 14px;
    }

    .cardWarning .card-body .btn {
        width: 100%;
        margin-top: 10px;
    }
}

/*--------------------------
nav-tabs
---------------------------*/
.nav-tabs {
    border-color: #9F9F9F;
}

.nav-tabs .nav-link {
    box-shadow: none;
    border-radius: 0px;
    color: #9F9F9F;
    /* Headline / Regular */
    font-family: Poppins;
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 30px;
    /* 150% */
    border: none;
}

.nav-tabs .nav-link.active {
    color: #00588F;
    font-weight: 700;
    border-bottom: 2px solid #00588F;
}

@media(max-width:992px) {
    .nav-tabs .nav-link {
        font-size: 15px;
    }
}

@media(max-width:768px) {
    .nav-tabs .nav-link {
        font-size: 14px;
    }
}

@media(max-width:570px) {
    .nav-tabs .nav-link {
        font-size: 13px;
    }
}

/*-------------------------
cardAgent
--------------------------*/
.cardAgent {
    border-radius: 13px;
    background: var(--Color, #FFF);
    box-shadow: 10px 8px 20px 0 rgba(0, 81, 131, 0.25);
    width: 100%;
    max-width: 264px;
    height: 100%;
    min-height: 327px;
}

.cardAgent .card-header {
    display: flex;
    align-items: center;
    justify-content: center;
}

.cardAgent .card-header img {
    width: 150px;
    height: 133px;
    flex-shrink: 0;
    object-fit: contain;
}

.cardAgent .card-header h3 {
    color: var(--Orange-Normal, #F60);
    text-align: center;

    /* Headline / Bold */
    font-family: Poppins;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 30px;
    /* 150% */
}

.cardAgent p {
    color: var(--Grey-Darker, #444);
    text-align: center;
    /* Subtitle / Regular */
    font-family: Poppins;
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 15.6px;
    /* 120% */
}

@media(max-width:992px) {
    .cardAgent {
        min-height: 300px;
    }

    .cardAgent .card-header img {
        width: 130px;
        height: 113px;
    }

    .cardAgent .card-header h3 {
        font-size: 18px;
    }

    .cardAgent p {
        font-size: 12px;
    }
}

@media(max-width:768px) {
    .cardAgent {
        min-height: 280px;
    }

    .cardAgent .card-header img {
        width: 110px;
        height: 93px;
    }

    .cardAgent .card-header h3 {
        font-size: 16px;
    }
}

@media(max-width:570px) {
    .cardAgent {
        min-height: 260px;
    }

    .cardAgent .card-header img {
        width: 90px;
        height: 73px;
    }

    .cardAgent .card-header h3 {
        font-size: 14px;
    }
}

/*---------------------------
cardDetailsAgent
----------------------------*/
.cardDetailsAgent {
    border-radius: 30px;
    background: var(--Color, #FFF);
    box-shadow: 10px 8px 20px 0 rgba(0, 81, 131, 0.25);
}

.cardDetailsAgent .card-body {
    display: flex;
    justify-content: start;
    align-items: end;
}

.cardDetailsAgent img {
    width: 255px;
    height: 255px;
    object-fit: contain;
}

.cardDetailsAgent h2 {
    color: var(--Blue-500, #0093EE);
    /* Headline / Bold */
    font-family: Poppins;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 30px;
    /* 150% */
}

.cardDetailsAgent h3 {
    color: var(--Blue-blue-800, #005183);
    /* Headline / Bold */
    font-family: Poppins;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 30px;
    /* 150% */
}

.cardDetailsAgent p {
    color: #000;

    /* Body / Regular */
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 150% */
}

.cardDetailsAgent span {
    color: var(--Blue-blue-800, #005183);
    /* Body / Bold */
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 19.2px;
    /* 120% */
}

@media(max-width:992px) {
    .cardDetailsAgent img {
        width: 235px;
        height: 235px;
    }

    .cardDetailsAgent h2,
    .cardDetailsAgent h3 {
        font-size: 18px;
    }

    .cardDetailsAgent p,
    .cardDetailsAgent span {
        font-size: 15px;
    }
}

@media(max-width:768px) {
    .cardDetailsAgent img {
        width: 205px;
        height: 205px;
    }

    .cardDetailsAgent h2,
    .cardDetailsAgent h3 {
        font-size: 16px;
    }

    .cardDetailsAgent p,
    .cardDetailsAgent span {
        font-size: 14px;
    }
}

@media(max-width:570px) {
    .cardDetailsAgent .card-body {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
    }

    .cardDetailsAgent img {
        width: 100%;
        height: 150px;
    }

    .cardDetailsAgent h2,
    .cardDetailsAgent h3 {
        font-size: 15px;
        text-align: center;
    }

    .cardDetailsAgent p,
    .cardDetailsAgent span {
        font-size: 12px;
        text-align: center;
    }

    .cardDetailsAgent .btn {
        width: 100%;
    }

    .cardDetailsAgent .tags {
        justify-content: center !important;
    }
}

/*------------------------------------------------
cardTimeline
*--------------------------------------------------*/
.cardTimeline-2 .card-body .timeline-item .timeline-event {
    border-radius: 30px;
    background: var(--Blue-100, #F1F9FF);
    margin-bottom: 2rem;
}

.cardTimeline-2 .timeline-item::before {
    content: "";
    position: absolute;
    left: -1.5px;
    top: 0px;
    bottom: 0;
    width: 3px;
    background-color: #0086D9;
    z-index: 0;
}

.cardTimeline-2 .timeline-item:first-child::before {
    top: 100px;
}

.cardTimeline-2 .timeline-item:last-child::before {
    top: 0px;
    bottom: 0;
    height: 100px;
}

.cardTimeline-2 .timeline .timeline-item .timeline-point {
    margin-left: -0.7rem;

}

.cardTimeline-2 .timeline .timeline-item .timeline-point:first-child {
    margin-top: 100px;
}

.cardTimeline-2 .timeline .timeline-item .timeline-event {
    margin-top: -10px;
}

.cardTimeline-2 .card-header h4 {
    color: var(--Blue-500, #0093EE);
    font-family: Poppins;
    font-size: 25px;
    font-style: normal;
    font-weight: 700;
    line-height: 30px;
    /* 177.419% */
}

.cardTimeline-2 .card-body .timeline-item h5 {
    color: var(--Blue-700, #00588F);
    /* Headline / Bold */
    font-family: Poppins;
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: 24px;
    /* 120% */
    margin-top: 0px;
    margin-bottom: 0px;
}

.cardTimeline-2 .card-body .timeline-item .content {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.cardTimeline-2 .card-body .timeline-item .content ul {
    list-style: none;
    padding-left: 0px;
}

.cardTimeline-2 .card-body .timeline-item .content ul li {
    display: flex;
    align-items: start;
    justify-content: start;
    color: #000;
    font-family: Poppins;
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 26px;
    /* 200% */
    margin-top: 10px;
    margin-bottom: 10px;
}

.cardTimeline-2 .card-body .timeline-item .content ul li img {
    width: 20px;
    height: 20px;
    margin-right: 5px;
    border-radius: 7px;
    box-shadow: 10px 8px 20px 0px rgba(0, 81, 131, 0.06);
    margin-top: 5px;
}

@media(max-width:992px) {
    .cardTimeline-2 .card-body .timeline-item .timeline-event {
        border-radius: 25px;
    }

    .cardTimeline-2 .card-header h4 {
        font-size: 20px;
    }

    .cardTimeline-2 .card-body .timeline-item h5 {
        font-size: 16px;
    }


}

@media(max-width:768px) {
    .cardTimeline-2 .timeline .timeline-item {
        padding-left: 2rem;
    }

    .cardTimeline-2 .card-body .timeline-item .content {
        display: block;
    }

    .cardTimeline-2 .card-body .timeline-item .timeline-event {
        border-radius: 20px;
    }

    .cardTimeline-2 .card-header h4 {
        font-size: 18px;
    }

    .cardTimeline-2 .card-body .timeline-item h5 {
        font-size: 15px;
    }

    .cardTimeline-2 .card-body .timeline-item .content ul li {
        font-size: 12px;
    }

    .cardTimeline-2 .card-body .timeline-item .content ul li img {
        width: 20px;
        height: 20px;
    }
}

@media(max-width:570px) {
    .cardTimeline-2 .timeline .timeline-item {
        padding-left: 1rem;
    }

    .cardTimeline-2 .card-body .timeline-item .content {
        display: block;
    }

    .cardTimeline-2 .card-body .timeline-item .timeline-event {
        border-radius: 15px;
    }

    .cardTimeline-2 .card-header h4 {
        font-size: 16px;
    }

    .cardTimeline-2 .card-body .timeline-item h5 {
        font-size: 14px;
    }

    .cardTimeline-2 .card-body .timeline-item .content ul li {
        font-size: 12px;
    }

    .cardTimeline-2 .card-body .timeline-item .content ul li img {
        width: 15px;
        height: 15px;
        margin-top: 5px;
    }
}

/*--------------------------
input-group search
---------------------------*/
.input-group.search {
    border-radius: 100px;
    background: var(--Color, #FFF);
    box-shadow: 5px 4px 15px 0 rgba(0, 81, 131, 0.25);
    width: 100%;
    max-width: 907px;
    min-height: 87px;
    padding: 12px 24px;
}

.input-group.search .form-control {
    color: #000;
    /* Body / Regular */
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 150% */
}

.input-group.search .form-control::placeholder {
    color: rgba(0, 0, 0, 0.49);
}

.input-group.search .btn {
    border-radius: 100px 100px 100px 100px !important;
    background: var(--blue-normal-hover, #0089DB);
    font-size: 1.3rem;
}

@media(max-width:992px) {
    .input-group.search {
        min-height: 80px;
    }

    .input-group.search .form-control {
        font-size: 15px;
    }
}

@media(max-width:768px) {
    .input-group.search {
        min-height: 75px;
    }

    .input-group.search .form-control {
        font-size: 14px;
    }
}

@media(max-width:570px) {
    .input-group.search {
        min-height: 50px;
    }

    .input-group.search .form-control {
        font-size: 12px;
    }
}

/*-------------------------
cardDoc
---------------------------*/
.cardDoc-2 {
    width: 100%;
    max-width: 430px;
    height: 100%;
    min-height: 362px;
    border-radius: 13px;
    background: var(--Color, #FFF);
    box-shadow: 10px 8px 20px 0 rgba(0, 81, 131, 0.10);
    padding: 28px 0;
}

.cardDoc-2 .card-header {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.cardDoc-2 .card-header img {
    width: 100px;
    height: 100px;
    aspect-ratio: 1/1;
    object-fit: contain;
}

.cardDoc-2 .card-header h3 {
    color: var(--Blue-blue-500, #0093EE);
    text-align: center;
    font-family: Poppins;
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 24px;
    /* 100% */
}

.cardDoc-2 .card-body p {
    color: var(--Black-black-300, #737373);
    text-align: center;
    font-family: Poppins;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 26px;
    /* 130% */
}

@media(max-width:992px) {
    .cardDoc-2 {
        min-height: 350px;
    }

    .cardDoc-2 .card-header img {
        width: 80px;
        height: 80px;
    }

    .cardDoc-2 .card-header h3 {
        font-size: 20px;
    }

    .cardDoc-2 .card-body p {
        font-size: 18px;
    }
}

@media(max-width:768px) {
    .cardDoc-2 {
        min-height: 300px;
    }

    .cardDoc-2 .card-header img {
        width: 60px;
        height: 60px;
    }

    .cardDoc-2 .card-header h3 {
        font-size: 18px;
    }

    .cardDoc-2 .card-body p {
        font-size: 16px;
    }
}

@media(max-width:570px) {
    .cardDoc-2 {
        min-height: 250px;
    }

    .cardDoc-2 .card-header img {
        width: 40px;
        height: 40px;
    }

    .cardDoc-2 .card-header h3 {
        font-size: 16px;
    }

    .cardDoc-2 .card-body p {
        font-size: 14px;
    }
}

/*----------------------------
cardVideo
----------------------------*/
.cardVideo {
    border-radius: 13px;
    background: var(--Color, #FFF);
    box-shadow: 10px 8px 20px 0 rgba(0, 81, 131, 0.10);
    width: 100%;
    max-width: 362px;
    height: 100%;
    min-height: 462px;
}

.cardVideo img {
    width: 100%;
    height: 188px;
    object-fit: cover;
    border-radius: 13px 13px 0 0;
    background: url(<path-to-image>) lightgray 50% / cover no-repeat;
    box-shadow: 10px 8px 10px 0 rgba(144, 144, 144, 0.25);
}

.cardVideo h3 {
    color: var(--Blue-blue-500, #0093EE);
    text-align: center;
    font-family: Poppins;
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 29px;
    /* 120.833% */
}

.cardVideo p {
    color: var(--Black-black-300, #737373);
    text-align: center;
    font-family: Poppins;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 120% */
}

@media(max-width:992px) {
    .cardVideo {
        max-width: 340px;
        min-height: 400px;
    }

    .cardVideo img {
        width: 100%;
        height: 168px;
    }

    .cardVideo h3 {
        font-size: 20px;
    }

    .cardVideo p {
        font-size: 18px;
    }
}

@media(max-width:768px) {
    .cardVideo {
        max-width: 340px;
        min-height: 350px;
    }

    .cardVideo img {
        width: 100%;
        height: 158px;
    }

    .cardVideo h3 {
        font-size: 18px;
    }

    .cardVideo p {
        font-size: 16px;
    }
}

@media(max-width:570px) {
    .cardVideo {
        max-width: 340px;
        min-height: 300px;
    }

    .cardVideo img {
        width: 100%;
        height: 158px;
    }

    .cardVideo h3 {
        font-size: 16px;
    }

    .cardVideo p {
        font-size: 14px;
    }
}

/*-------------------------
cardText
--------------------------*/
.section-article {
    margin-top: -100px;
}

.cardText {
    border-radius: 25px;
    background: #FFF;

    /* shdow final */
    box-shadow: 10px 8px 20px 0 rgba(0, 81, 131, 0.25);
    width: 100%;
}

.cardText h2 {
    color: var(--Blue-blue-800, #005183);

    /* H3/Bold */
    font-family: Poppins;
    font-size: 25px;
    font-style: normal;
    font-weight: 700;
    line-height: 37.2px;
    /* 120% */
}

.cardText p {
    color: var(--Black-black-300, #737373);
    /* H4 / Regular */
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 30px;
    /* 120% */
}

@media(max-width:992px) {
    .section-article {
        margin-top: 0px;
    }

    .cardText h2 {
        font-size: 20px;
    }

    .cardText p {
        font-size: 15px;
    }
}

@media(max-width:768px) {
    .cardText h2 {
        font-size: 18px;
    }

    .cardText p {
        font-size: 14px;
    }
}

@media(max-width:570px) {
    .cardText h2 {
        font-size: 16px;
    }

    .cardText p {
        font-size: 13px;
    }
}

/*-----------------------------
cardBlog
------------------------------*/
.cardBlog {
    border-radius: 20px;
    background: #FFF;
    /* Shadow blue */
    box-shadow: 10px 8px 20px 0 rgba(0, 81, 131, 0.25);
    width: 100%;
}

.cardBlog .card-body {
    display: flex;
    align-items: center;
    justify-content: space-between;
    column-gap: 10px;
}

.cardBlog .card-body .text {
    display: flex;
    align-items: center;
    justify-content: space-between;
    column-gap: 10px;
}

.cardBlog .card-body .text .left {
    max-width: 467px;
}

.cardBlog h3 {
    color: var(--Blue-Normal, #0098F3);
    /* H4 / Bold */
    font-family: Poppins;
    font-size: 25px;
    font-style: normal;
    font-weight: 700;
    line-height: 30px;
    /* 120% */
    display: flex;
    align-items: end;
}

.cardBlog h3 img {
    width: 25px;
    height: 25px;
    aspect-ratio: 1/1;
    object-fit: contain;
}

.cardBlog h3 br {
    display: none;
}

.cardBlog h3 span {
    color: var(--Grey-Dark, #919191);
    /* Body / Regular */
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 150% */
}

.cardBlog small {
    display: flex;
    align-items: center;
    justify-content: start;
    column-gap: 2px;
    color: var(--Grey-Dark, #919191);
    /* Subtitle / Regular */
    font-family: Poppins;
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 15.6px;
    /* 120% */
}

.cardBlog small img {
    width: 21.62px;
    height: 20.794px;
    flex-shrink: 0;
    object-fit: contain;
}

.cardBlog .card-body p {
    color: var(--grey-dark-active, #575757);
    /* Body / Regular */
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 150% */
}

.cardBlog .card-body .tags span {
    /* Subtitle / Bold */
    font-family: Poppins;
    font-size: 13px;
    font-style: normal;
    font-weight: 600;
    line-height: 15.6px;
    /* 120% */
    padding: 12px 10px;
}

.cardBlog .card-body .image {
    width: 131px;
    height: 131px;
    aspect-ratio: 1/1;
    object-fit: cover;
    border-radius: 10px;
    background: url(<path-to-image>) lightgray 50% / cover no-repeat, #FFF;
}

.cardBlog .card-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.cardBlog .card-footer p {
    color: var(--Orange-Normal, #F60);
    text-align: center;
    /* Body / Bold */
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 24px;
    /* 150% */
    display: flex;
    align-items: center;
    justify-content: center;
    column-gap: 5px;
}

@media(max-width:992px) {
    .cardBlog h3 {
        font-size: 20px;
    }

    .cardBlog h3 img {
        width: 20px;
        height: 20px;
    }

    .cardBlog h3 span,
    .cardBlog .card-body p,
    .cardBlog .card-footer p {
        font-size: 15px;
    }

    .cardBlog small,
    .cardBlog .card-body .tags span {
        font-size: 12px;
    }

    .cardBlog small img {
        width: 15.62px;
        height: 15.794px;
    }

    .cardBlog .card-body .image {
        width: 100px;
        height: 100px;
    }

    .cardBlog .card-footer p svg {
        width: 15px !important;
        height: 15px !important;
    }
}

@media(max-width:768px) {
    .cardBlog h3 {
        font-size: 18px;
    }

    .cardBlog h3 img {
        width: 15px;
        height: 15px;
    }

    .cardBlog h3 span,
    .cardBlog .card-body p,
    .cardBlog .card-footer p {
        font-size: 14px;
    }

    .cardBlog .card-body .image {
        width: 90px;
        height: 90px;
    }

    .cardBlog .card-body .text {
        display: block;
    }

    .cardBlog .card-body .text .left {
        max-width: none;
        margin-bottom: 10px;
    }
}

@media(max-width:570px) {

    .cardBlog .card-body {
        display: flex;
        align-items: start;
        justify-content: center;
        flex-direction: column-reverse;
        column-gap: 0px;
    }

    .cardBlog h3 {
        font-size: 16px;
    }

    .cardBlog h3 br {
        display: block;
    }

    .cardBlog h3 span,
    .cardBlog .card-body p,
    .cardBlog .card-footer p {
        font-size: 12px;
    }

    .cardBlog .card-body .image {
        width: 100% !important;
        max-width: none;
        height: 150px !important;
        margin-bottom: 10px;
    }

}

/*------------------------------
cardFunction
-------------------------------*/
.cardFunction {
    border-radius: 20px;
    background: var(--Blue-Light, #E6F5FE);
    width: 100%;
    max-width: 583px;
    height: 100%;
    min-height: 170px;
}

.cardFunction.secondary {
    background: var(--Orange-Light, #FFF0E6);
}

.cardFunction .card-body {
    display: flex;
    align-items: center;
    justify-content: start;
}

.cardFunction .card-body .box {
    display: flex;
    width: 130px;
    height: 130px;
    padding: 5px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    aspect-ratio: 1/1;
    margin-right: 10px;
    background-color: #B0DFFB;
    border-radius: 10px;
}

.cardFunction.secondary .card-body .box {
    background: var(--orange-light-active, #FFD0B0);
}

.cardFunction .card-body .box img {
    width: 70%;
    height: 70%;
    object-fit: contain;
}

.cardFunction .card-body h3 {
    color: var(--Blue-Normal, #0098F3);
    /* Headline / Bold */
    font-family: Poppins;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 30px;
    /* 150% */
}

.cardFunction.secondary h3 {
    color: #FF6600;
}

.cardFunction .card-body p {
    color: var(--Grey-Dark, #919191);

    /* Body / Regular */
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 150% */
}

@media(max-width:992px) {
    .cardFunction {
        min-height: 150px;
    }

    .cardFunction .card-body .box {
        width: 110px;
        height: 110px;
    }

    .cardFunction .card-body h3 {
        font-size: 18px;
    }

    .cardFunction .card-body p {
        font-size: 15px;
    }
}

@media(max-width:768px) {
    .cardFunction {
        min-height: 100px;
    }

    .cardFunction .card-body .box {
        width: 90px;
        height: 90px;
    }

    .cardFunction .card-body h3 {
        font-size: 16px;
    }

    .cardFunction .card-body p {
        font-size: 14px;
    }
}

@media(max-width:570px) {
    .cardFunction .card-body .box {
        width: 60px;
        height: 60px;
    }

    .cardFunction .card-body h3 {
        font-size: 15px;
    }

    .cardFunction .card-body p {
        font-size: 12px;
    }
}

/*-----------------------------
cardOffre
-------------------------------*/
.cardOffre {
    border-radius: 20px;
    background: #FFF;

    /* Shadow blue */
    box-shadow: 10px 8px 20px 0 rgba(0, 81, 131, 0.25);
    width: 100%;
}

.cardOffre img {
    max-width: 100px;
    max-height: 100px;
    aspect-ratio: 1/1;
    object-fit: contain;
}

.cardOffre h3 {
    color: var(--Blue-Normal, #0098F3);

    /* H3/Bold */
    font-family: Poppins;
    font-size: 31px;
    font-style: normal;
    font-weight: 800;
    line-height: 37.2px;
    /* 120% */
}

.cardOffre p {
    color: var(--Grey-Darker, #444);

    /* H4 / Regular */
    font-family: Poppins;
    font-size: 25px;
    font-style: normal;
    font-weight: 400;
    line-height: 30px;
}

@media(max-width:992px) {
    .cardOffre img {
        max-width: 80px;
        max-height: 80px;
    }

    .cardOffre h3 {
        font-size: 25px;
    }

    .cardOffre p {
        font-size: 20px;
    }
}

@media(max-width:768px) {
    .cardOffre img {
        max-width: 60px;
        max-height: 60px;
    }

    .cardOffre h3 {
        font-size: 20px;
    }

    .cardOffre p {
        font-size: 16px;
    }

    .cardOffre .btn {
        width: 100%;
        margin-top: 1rem;
    }
}

@media(max-width:570px) {
    .cardOffre img {
        max-width: 40px;
        max-height: 40px;
    }

    .cardOffre h3 {
        font-size: 18px;
    }

    .cardOffre p {
        font-size: 12px;
    }
}

/*----------------------
cardTarif
-------------------------*/
.cardTarif {
    position: relative;
    padding: 1.5rem 1.5rem;
    width: 100%;
    max-width: 373px;
    height: 100%;
    min-height: 434px;
    border-radius: 15px;
    border: 1px solid var(--blue-light-hover, #D9F0FD);
    background: #FFF;
    /* Shadow */
    box-shadow: 150px 534px 155px 0px rgba(171, 171, 171, 0.00), 96px 342px 142px 0px rgba(171, 171, 171, 0.01), 54px 192px 120px 0px rgba(171, 171, 171, 0.05), 24px 85px 89px 0px rgba(171, 171, 171, 0.09), 6px 21px 49px 0px rgba(171, 171, 171, 0.10);
}

.cardTarif.premium {
    border: 1px solid var(--Orange-Normal, #F60);

}

.cardTarif .badgePremium {
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: -15px;
    left: 0;
    width: 100%;
}

.cardTarif .badgePremium .badge {
    border-radius: 8px;
    background: var(--orange-normal-hover, #E65C00);
    padding: 8px 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: #FFF;
    font-family: Poppins;
    font-size: 13px;
    font-style: normal;
    font-weight: 600;
    line-height: 15.6px;
    /* 120% */
}

.cardTarif .card-header {
    min-height: 146px;
    padding: 10px 20px;
    text-align: center;
    border-radius: 20px;
    border: 2px solid rgba(230, 245, 254, 0.50);
    background: linear-gradient(136deg, #FFF 17.69%, #F1F9FF 52.32%, #FFF 86.95%);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}


.cardTarif h3 {
    color: var(--blue-dark-hover, #005B92);
    text-align: center;
    /* H4 / Bold */
    font-family: Poppins;
    font-size: 25px;
    font-style: normal;
    font-weight: 700;
    line-height: 30px;
    /* 120% */
    margin-top: 0px;
    margin-bottom: 0px;
}

.cardTarif h4 {
    color: var(--Blue-Normal, #0098F3);
    text-align: center;
    /* Headline / Bold */
    font-family: Poppins;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 30px;
    /* 150% */
}

.cardTarif .card-header p {
    color: var(--grey-dark-active, #575757);
    text-align: center;
    /* Body / Regular */
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 150% */
}

.cardTarif .card-body {
    padding-top: 2rem;
}

.cardTarif .card-body ul li {
    color: var(--Blue-Dark, #0072B6);
    /* Body / Regular */
    font-family: Poppins;
    font-size: 15px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 150% */
    display: flex;
    align-items: start;
    justify-content: start;
}

@media(max-width:992px) {
    .cardTarif .badgePremium .badge {
        font-size: 12px;
    }

    .cardTarif h3 {
        font-size: 20px;
    }

    .cardTarif h4 {
        font-size: 18px;
    }

    .cardTarif .card-header p {
        font-size: 15px;
    }

    .cardTarif ul li {
        font-size: 14px;
    }
}

@media(max-width:768px) {
    .cardTarif .badgePremium .badge {
        font-size: 12px;
    }

    .cardTarif h3 {
        font-size: 18px;
    }

    .cardTarif h4 {
        font-size: 16px;
    }

    .cardTarif .card-header p {
        font-size: 14px;
    }

    .cardTarif ul li {
        font-size: 13px;
    }
}

@media(max-width:570px) {
    .cardTarif h3 {
        font-size: 16px;
    }

    .cardTarif h4 {
        font-size: 15px;
    }

    .cardTarif .card-header p {
        font-size: 12px;
    }

    .cardTarif ul li {
        font-size: 12px;
    }
}

/*----------------------------------
cardInvestisseur
--------------------------------*/
.cardInvestisseur {
    width: 100%;
    max-width: 370px;
    height: 100%;
    min-height: 289px;
    border-radius: 20px;
    background: #FFF;
    /* Shadow blue */
    box-shadow: 10px 8px 20px 0 rgba(0, 81, 131, 0.25);
    padding: 10px 20px;
}

.cardInvestisseur .card-header {
    display: flex;
    align-items: center;
    justify-content: start;
}

.cardInvestisseur .card-header img {
    width: 70px;
    height: 70px;
    aspect-ratio: 1/1;
    border-radius: 50%;
    object-fit: cover;
    background: url(<path-to-image>) lightgray 50% / cover no-repeat;
    box-shadow: 5px 4px 10px 0 rgba(0, 81, 131, 0.25);
    margin-right: 10px;
}

.cardInvestisseur .card-header h3 {
    color: var(--Blue-Normal, #0098F3);
    /* Body / Bold */
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 24px;
    /* 150% */
}

.cardInvestisseur .card-header p {
    color: var(--Grey-Darker, #444);
    /* Caption / Regular */
    font-family: Poppins;
    font-size: 11px;
    font-style: normal;
    font-weight: 400;
    line-height: 16.5px;
    /* 150% */
}

.cardInvestisseur .card-body p {
    color: var(--Grey-Darker, #444);
    /* Body / Regular */
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 150% */
}

@media(max-width:992px) {
    .cardInvestisseur .card-header img {
        width: 60px;
        height: 60px;
    }

    .cardInvestisseur .card-header h3,
    .cardInvestisseur .card-body p {
        font-size: 15px;
    }
}

@media(max-width:768px) {
    .cardInvestisseur .card-header img {
        width: 50px;
        height: 50px;
    }

    .cardInvestisseur .card-header h3,
    .cardInvestisseur .card-body p {
        font-size: 14px;
    }
}

@media(max-width:570px) {
    .cardInvestisseur {
        max-width: none;
        min-height: 250px;
    }

    .cardInvestisseur .card-header img {
        width: 40px;
        height: 40px;
    }

    .cardInvestisseur .card-header h3,
    .cardInvestisseur .card-body p {
        font-size: 12px;
    }
}

/*------------------------------
proposSubvention
--------------------------------*/
.proposSubvention p {
    color: var(--grey-dark-active, #575757);
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    /* 150% */
}

.proposSubvention h3 {
    color: var(--Orange-Normal, #F60);
    font-family: Poppins;
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 30px;
    /* 150% */
}

.proposSubvention .box {
    width: 160px;
    min-height: 70px;
    border-radius: 20px;
    border: 3px solid rgba(230, 245, 254, 0.50);
    background: linear-gradient(136deg, #FFF 17.69%, #F1F9FF 52.32%, #FFF 86.95%);
    padding: 10px 10px;
    display: flex;
    align-items: center;
    justify-content: start;
}

.proposSubvention .box img {
    width: 30px;
    height: 30px;
    flex-shrink: 0;
    aspect-ratio: 1/1;
    object-fit: contain;
    margin-right: 10px;
}

.proposSubvention .box p {
    color: var(--Orange-Normal, #F60);
    /* Caption / Bold */
    font-family: Poppins;
    font-size: 11px;
    font-style: normal;
    font-weight: 600;
    line-height: 16.5px;
    /* 150% */
}

.video-container {
    position: relative;
    width: 100%;
    max-height: 600px;
    border-radius: 12px;
    overflow: hidden;
    cursor: pointer;
}

.video-container .thumbnail {
    position: relative;
}

.video-container .thumbnail img {
    width: 100%;
    height: auto;
    display: block;
    filter: brightness(0.55);
    transition: filter 0.3s ease;
}

.video-container .play-button {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 68.182px;
    height: 68.182px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.video-container .play-button:hover {
    transform: translate(-50%, -50%) scale(1.1);
}

.video-container .video-player {
    width: 100%;
    height: auto;
    border-radius: 12px;
}

@media(max-width:992px) {
    .proposSubvention p {
        font-size: 15px;
    }

    .proposSubvention h3 {
        font-size: 18px;
    }

    .proposSubvention .box img {
        width: 25px;
        height: 25px;
    }

    .proposSubvention .box p {
        font-size: 10px;
    }
}


@media(max-width:768px) {
    .proposSubvention p {
        font-size: 14px;
    }

    .proposSubvention h3 {
        font-size: 16px;
    }

    .proposSubvention .box img {
        width: 20px;
        height: 20px;
    }
}

@media(max-width:570px) {
    .proposSubvention p {
        font-size: 12px;
    }

    .proposSubvention h3 {
        font-size: 14px;
    }

    .proposSubvention .box {
        width: 100%;
        min-height: 50px;
    }

    .proposSubvention .box img {
        width: 15px;
        height: 15px;
    }
}

/*------------------------------
cardSimilaire
--------------------------------*/
.cardSimilaire {
    border-radius: 10px;
    background: #FFF;
    /* Shadow blue */
    box-shadow: 10px 8px 20px 0 rgba(0, 81, 131, 0.25);
    width: 100%;
    max-width: 380px;
    height: 100%;
    min-height: 223px;
}

.cardSimilaire .card-header,
.cardSimilaire .card-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    column-gap: 5px;
}

.cardSimilaire .card-header h3 {
    color: var(--Blue-Normal, #0098F3);
    text-align: start;

    /* Headline / Bold */
    font-family: Poppins;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 30px;
    /* 150% */
}

.cardSimilaire .card-header .badge {
    border-radius: 20px;
    background: var(--Green-Normal, #22C55E);
    color: #FFF;
    text-align: center;
    /* Caption / Bold */
    font-family: Poppins;
    font-size: 11px;
    font-style: normal;
    font-weight: 600;
    line-height: 16.5px;
    /* 150% */
}

.cardSimilaire p {
    color: var(--grey-dark-hover, #747474);
    /* Body / Regular */
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 150% */
}

.cardSimilaire h4 {
    color: var(--Orange-Normal, #F60);
    text-align: start;
    /* Headline / Bold */
    font-family: Poppins;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 30px;
    /* 150% */
}

@media(max-width:992px) {

    .cardSimilaire .card-header h3,
    .cardSimilaire h4 {
        font-size: 18px;
    }

    .cardSimilaire p {
        font-size: 15px;
    }
}

@media(max-width:768px) {

    .cardSimilaire .card-header h3,
    .cardSimilaire h4 {
        font-size: 16px;
    }

    .cardSimilaire p {
        font-size: 14px;
    }
}

@media(max-width:570px) {
    .cardSimilaire {
        max-width: none;
        min-height: 150px;
    }

    .cardSimilaire .card-header h3,
    .cardSimilaire h4 {
        font-size: 14px;
    }

    .cardSimilaire p {
        font-size: 12px;
    }
}

/*------------------------------
cardAide
---------------------------------*/
.cardAide {
    border-radius: 20px;
    background: #FFF;

    /* Shadow blue */
    box-shadow: 10px 8px 20px 0 rgba(0, 81, 131, 0.25);
    width: 100%;
    max-width: 400px;
    height: 100%;
    min-height: 190px;
}

.cardAide .card-header {
    display: flex;
    align-items: center;
    justify-content: start;
}

.cardAide .card-header .box {
    width: 70px;
    height: 70px;
    border-radius: 50%;
    background: var(--Orange-Normal, #F60);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 10px;
    padding: 20px 20px;
}

.cardAide .card-header .box img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.cardAide h3 {
    color: var(--orange-normal-hover, #E65C00);
    text-align: start;
    /* Headline / Bold */
    font-family: Poppins;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 30px;
    /* 150% */
}

.cardAide p {
    color: var(--Grey-Darker, #444);
    /* Body / Regular */
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 150% */
}

@media(max-width:992px) {
     .cardAide {
        max-width: none;
     }
    .cardAide .card-header .box {
        width: 60px;
        height: 60px;
        padding: 15px 15px;
    }

    .cardAide h3 {
        font-size: 18px;
    }

    .cardAide p {
        font-size: 15px;
    }
}

@media(max-width:768px) {
    .cardAide .card-header .box {
        width: 50px;
        height: 50px;
          padding: 10px 10px;
    }

    .cardAide h3 {
        font-size: 16px;
    }

    .cardAide p {
        font-size: 14px;
    }
}

@media(max-width:570px) {
    .cardAide {
        max-width: none;
        min-height: 100px;
    }

    .cardAide .card-header .box {
        width: 40px;
        height: 40px;
        padding: 10px 10px;
    }

    .cardAide h3 {
        font-size: 14px;
    }

    .cardAide p {
        font-size: 12px;
    }
}