body {
    background: #fff;
}

.text-primary-dark {
    color: #007AC2 !important;
}

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

.text-primary-light {
    color: #B0DFFB !important;
}

.bg-primary {
    background: #0098F3 !important;
}

.bg-primary-dark {
    background: var(--primaire-dark-active, #00446D);
}

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

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

a {
    text-decoration: none !important;
}

.btn-primary {
    border-radius: 8px;
    background: var(--Primaire-Normal, #0098F3);
    color: var(--Background-Normal, #FFF);
    /* Button/Button Large */
    font-family: Inter;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 150% */
    letter-spacing: -0.5px;
    padding: 12px 16px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.btn-primary:hover {
    background: var(--primaire-light-active, #B0DFFB);
    color: var(--Background-Normal, #FFF);
}

.btn-primary:focus {
    color: var(--Background-Normal, #FFF);
    background: var(--Primaire-Dark, #0072B6);
}

.btn-primary:disabled {
    color: #B7B8BE;
    background-color: transparent;
}

.btn-outline-primary {
    border-radius: 8px;
    border: 2px solid var(--Primaire-Normal, #0098F3);
    background: transparent;
    color: var(--Background-Normal, #0098F3);
    /* Button/Button Large */
    font-family: Inter;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 150% */
    letter-spacing: -0.5px;
    padding: 12px 16px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.btn-outline-primary:hover {
    border-color: #B0DFFB;
    color: #B0DFFB;
    background: transparent;
}

.btn-outline-primary:focus {
    border-color: #0072B6;
    color: #0072B6;
    background: transparent;
}

.btn-outline-primary:disabled {
    border-color: #E8E8EA;
    color: #E8E8EA;
    background: transparent;
}

.btn-outline-white {
    border-radius: 8px;
    border: 2px solid var(--Primaire-Normal, #fff);
    background: transparent;
    color: var(--Background-Normal, #fff);
    /* Button/Button Large */
    font-family: Inter;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 150% */
    letter-spacing: -0.5px;
    padding: 12px 16px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.btn-outline-white:hover {
    border-color: #B0DFFB;
    color: #B0DFFB;
    background: transparent;
}

.btn-outline-white:focus {
    border-color: #0072B6;
    color: #0072B6;
    background: transparent;
}

.btn-outline-white:disabled {
    border-color: #E8E8EA;
    color: #E8E8EA;
    background: transparent;
}

.btn.fs-sm {
    font-size: 12px;
    padding: 12px 16px;
}

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

@media(max-width:992px) {

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

    .btn-primary svg,
    .btn-outline-primary svg {
        width: 20px !important;
        height: 20px !important;
    }
}

@media(max-width:768px) {

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

    .btn-primary svg,
    .btn-outline-primary svg {
        width: 15px !important;
        height: 15px !important;
    }
}

@media(max-width:570px) {

    .btn-primary,
    .btn-outline-primary {
        font-size: 12px;
    }
}

/*-------------------------------
hero landing
--------------------------------*/
.hero {
    position: relative;
    padding-bottom: 100px;
    background-color: #D9F0FD1A;
}

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

.hero .image {
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 2;
    width: 100%;
}

.hero .image img {
    width: 33%;
    margin-bottom: 3px;
}

.hero .middle {
    margin-top: 250px;
    margin-bottom: 100px;
}

.hero .bg-agents {
    position: absolute;
    top: 100px;
    left: 0px;
    width: 100%;
}

.hero .img-agentsia {
    width: 80%;
    max-width: 1323px;
    z-index: 1;

}

.hero .cardLeft {
    border-radius: 0 50px 0 0;
    background: var(--Background-Light, #FFF);
    padding: 25px;
    margin-top: -150px;
    position: relative;
    z-index: 3;
}

.hero .cardLeft h1 {
    color: var(--Primaire-Normal, #0098F3);

    /* Heading/H4 */
    font-family: Satoshi;
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 128%;
    /* 30.72px */
    letter-spacing: -0.5px;
}

.hero .cardLeft p {
    color: var(--Primaire-Normal, #0098F3);
    /* Paragraph/Medium */
    font-family: Inter;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    /* 21px */
}

.hero .cardLeft .card-footer {
    display: flex;
    align-items: center;
    justify-content: start;
}

.hero .media {
    border-radius: 50px;
    background: #FFF;
    padding: 12px 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: fit-content;
    list-style: none;
    position: relative;
    z-index: 3;
}

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

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

.hero .media li:last-child {
    margin-left: 13px;
}

.hero .media li img {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid var(--Grey-Light, #F9F9F9);
    background: url(<path-to-image>) lightgray 50% / cover no-repeat;
}

.hero .media li p {
    color: #000;

    /* Paragraph/Small */
    font-family: Inter;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
}

.hero .media li p strong {
    font-size: 16px;
}

.hero .numbersWrapper {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    --bs-gutter-x: unset;
}

.hero .cardNumber {
    position: relative;
}

.hero .cardNumber img {
    position: absolute;
    bottom: 0;
    left: 0;
    min-height: 130px;
    width: 100%;
}

.hero .cardNumber .card-body {
    position: relative;
}

.hero .cardNumber h2 {
    color: var(--primaire-normal-hover, #0089DB);

    /* Heading/H1 */
    font-family: Satoshi;
    font-size: 56px;
    font-style: normal;
    font-weight: 700;
    line-height: 108%;
    /* 60.48px */
    letter-spacing: -1px;
}

.hero .cardNumber p {
    color: var(--primaire-normal-active, #007AC2);

    /* Paragraph/Paragraph Medium */
    font-family: Inter;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    /* 21px */
}

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

    .hero .cardLeft p,
    .hero .cardNumber p {
        font-size: 13px;
    }

    .hero .cardNumber h2 {
        font-size: 50px;
    }

    .hero .media li img {
        width: 35px;
        height: 35px;
    }

    .hero .media li p {
        font-size: 10px;
    }

    .hero .media li p strong {
        font-size: 15px;
    }

    .hero .image {
        z-index: 1;
    }

    .hero .image img {
        width: 40%;
    }

    .hero .numbersWrapper {
        z-index: 2;
    }
}

@media(max-width:768px) {
    .hero .cardLeft {
        border-radius: 50px 50px 50px 50px;
        margin-bottom: 1.5rem;
    }

    .hero .cardLeft .card-footer {
        justify-content: center;
    }

    .hero .cardLeft h1 {
        font-size: 18px;
        text-align: center;
    }

    .hero .cardLeft p,
    .hero .cardNumber p {
        font-size: 13px;
        text-align: center;
    }

    .hero .cardNumber h2 {
        font-size: 45px;
        text-align: center;
    }

    .hero .cardNumber img {
        display: none;
    }

    .hero .cardNumber {
        background-color: #fff;
        border-radius: 50px;
        height: 100%;
        min-height: 150px;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 90%;
    }

    .hero .cardNumber .card-body {
        padding-left: 1rem !important;
        padding-right: 1rem !important;
    }

    .hero .media {
        margin-bottom: 0rem !important;
    }

    .hero .media li img {
        width: 30px;
        height: 30px;
    }

    .hero .media li p strong {
        font-size: 14px;
    }

    .hero .image {
        z-index: 1;
    }

    .hero .image img {
        width: 40%;
    }

    .hero .numbersWrapper {
        position: relative;
        --bs-gutter-x: 1.5rem !important;
        align-items: start !important;
        padding-right: calc(var(--bs-gutter-x) * .5);
        padding-left: calc(var(--bs-gutter-x) * .5);
        margin-right: auto;
        margin-left: auto;
    }

    .hero .numbersWrapper .col-12 {
        display: flex;
        align-items: center;
        justify-content: center;
        padding-left: 0px !important;
        padding-right: 0px !important;
    }

    .hero .middle {
        margin-bottom: 1.5rem;
    }

    .hero .middle .right {
        margin-bottom: 0rem !important;
        display: flex;
        align-items: center;
        justify-content: center;
    }
}

@media(max-width:570px) {
    .hero .cardLeft {
        border-radius: 30px 30px 30px 30px;
    }

    .hero .cardLeft h1 {
        font-size: 16px;
    }

    .hero .cardNumber h2 {
        font-size: 40px;
    }

    .hero .cardNumber {
        border-radius: 30px;
        width: 100%;
        margin-bottom: 1rem;
    }

    .hero .media li img {
        width: 25px;
        height: 25px;
    }

    .hero .media li p strong {
        font-size: 13px;
    }

    .hero .image {
        display: none;
    }
}

/*-----------------------------------
section-title
------------------------------------*/
.section-title h2 {
    color: var(--Primaire-Dark, #0072B6);
    text-align: center;
    /* Heading/H2 */
    font-family: Satoshi;
    font-size: 40px;
    font-style: normal;
    font-weight: 700;
    line-height: 112%;
    /* 44.8px */
    letter-spacing: -1px;
}

.section-title p {
    color: var(--Primaire-Dark, #0072B6);
    /* Heading/H5 */
    font-family: Satoshi;
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 22.5px;
    /* 112.5% */
    letter-spacing: -0.5px;
    text-align: center;
}

.section-title .desc {
    color: var(--Primaire-Normal, #0098F3);
    text-align: center;
    /* Heading/H3 */
    font-family: Satoshi;
    font-size: 32px;
    font-style: normal;
    font-weight: 700;
    line-height: 128%;
    /* 40.96px */
    letter-spacing: -1px;
}

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

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

    .section-title .desc {
        font-size: 28px;
    }
}

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

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

    .section-title .desc {
        font-size: 25px;
    }
}

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

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

    .section-title .desc {
        font-size: 20px;
    }
}

/*-------------------------------
about
---------------------------------*/
.about ul {
    list-style: none;
}

.about ul li {
    display: flex;
    align-items: center;
    justify-content: start;
    column-gap: 10px;
    color: var(--primaire-dark-active, #00446D);
    /* Paragraph/Large */
    font-family: Inter;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    /* 24px */
    letter-spacing: -0.5px;
    margin-bottom: 1.5rem;
}

.about .image {
    display: flex;
    align-items: center;
    justify-content: center;
}

.about .image img {
    width: 100%;
    max-width: 666px;
    max-height: 472px;
    object-fit: contain;
}

@media(max-width:992px) {
    .about ul li {
        font-size: 15px;
    }

    .about ul li svg {
        width: 20px !important;
        height: 20px !important;
    }
}

@media(max-width:768px) {
    .about ul {
        padding-left: 0px;
    }

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

    .about ul li svg {
        width: 15px !important;
        height: 15px !important;
    }
}

@media(max-width:570px) {
    .about ul li {
        font-size: 13px;
    }
}

/*--------------------------------
cardHorizental
---------------------------------*/
.cardHorizental {
    border-radius: 50px;
    background: #00446D;
    width: 100%;
    padding-top: 40px;
    padding-bottom: 40px;
}

.cardHorizental h3 {
    color: var(--Background-Light, #FFF);
    text-align: center;
    /* Heading/H3 */
    font-family: Satoshi;
    font-size: 32px;
    font-style: normal;
    font-weight: 700;
    line-height: 128%;
    /* 40.96px */
    letter-spacing: -1px;
}

.cardHorizental p {
    color: var(--Background-Light, #FFF);
    text-align: center;
    /* Paragraph/Large */
    font-family: Inter;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    /* 24px */
    letter-spacing: -0.5px;
}

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

@media(max-width:992px) {

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

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

@media(max-width:768px) {

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

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

@media(max-width:570px) {

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

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

    .cardHorizental .card-footer {
        display: block;
    }

    .cardHorizental .card-footer .btn {
        width: 100%;
        margin-bottom: 10px;
    }
}

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

.marche h3 {
    color: var(--primaire-dark-active, #00446D);

    /* Heading/H3 */
    font-family: Satoshi;
    font-size: 32px;
    font-style: normal;
    font-weight: 700;
    line-height: 128%;
    /* 40.96px */
    letter-spacing: -1px;
    margin-bottom: 1rem;
}

.marche h4 {
    color: var(--primaire-dark-active, #00446D);

    /* Heading/H4 */
    font-family: Satoshi;
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 128%;
    /* 30.72px */
    letter-spacing: -0.5px;
    margin-bottom: 1rem;
}

.marche p {
    color: var(--primaire-dark-active, #00446D);

    /* Paragraph/Large */
    font-family: Inter;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    /* 24px */
    letter-spacing: -0.5px;
}

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

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

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

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

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

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

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

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

    .step .image {
        order: 1;
        margin-bottom: 1rem;
    }

    .step .text {
        order: 2;
    }
}

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

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

    .marche p {
        font-size: 13px;
    }
}

/*-----------------------
bg-light
--------------------------*/
.bg-light {
    background-image: url("../../img/agentsia/bg-light.svg");
    background-repeat: no-repeat;
    background-size: cover;
}

/*------------------------------
cardEco
---------------------------------*/
.cardEco {
    border-radius: 50px;
    background: var(--Background-Light, #FFF);
    width: 100%;
    max-width: 343px;
    height: 100%;
    min-height: 281px;
    padding: 20px;
    transition: background 0.2s ease-in-out;
    cursor: pointer;
}

.cardEco .card-header .box {
    width: 65px;
    height: 65px;
    border-radius: 50%;
    background: var(--primaire-light-active, #B0DFFB);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 1rem;
}

.cardEco:hover {
    background: var(--Primaire-Normal, #0098F3);
}

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

.cardEco .card-header h3 {
    color: var(--Primaire-Dark, #0072B6);
    /* Heading/H4 */
    font-family: Satoshi;
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 128%;
    /* 30.72px */
    letter-spacing: -0.5px;
}

.cardEco .card-body p {
    color: var(--Primaire-Dark, #0072B6);

    /* Paragraph/Large */
    font-family: Inter;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    /* 24px */
    letter-spacing: -0.5px;
}

.cardEco .card-footer a {
    color: var(--Primaire-Dark, #0072B6);

    /* Paragraph/Large */
    font-family: Inter;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    /* 24px */
    letter-spacing: -0.5px;
    display: flex;
    align-items: center;
}

.cardEco:hover h3,
.cardEco:hover p,
.cardEco:hover a {
    color: #fff;
}

.cardEco:hover path {
    fill: #fff !important;
}

@media(max-width:992px) {
    .cardEco .card-header .box {
        width: 60px;
        height: 60px;
    }

    .cardEco .card-header h3 {
        font-size: 20px;
    }

    .cardEco .card-body p,
    .cardEco .card-footer a {
        font-size: 15px;
    }
}

@media(max-width:768px) {
    .cardEco .card-header .box {
        width: 55px;
        height: 55px;
    }

    .cardEco .card-header h3 {
        font-size: 18px;
    }

    .cardEco .card-body p,
    .cardEco .card-footer a {
        font-size: 14px;
    }
}

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

    .cardEco .card-header .box {
        width: 50px;
        height: 50px;
    }

    .cardEco .card-header h3 {
        font-size: 16px;
    }

    .cardEco .card-body p,
    .cardEco .card-footer a {
        font-size: 13px;
    }
}

/*-----------------------
cardEquipe
-------------------------*/
.cardEquipe {
    position: relative;
    width: 356px;
    height: 361px;
    display: flex;
    flex-direction: row;
    align-items: flex-end;
    justify-content: center;
    transition: background 0.2s ease-in-out;
    cursor: pointer;
}

.cardEquipe .overlay {
    z-index: 2;
    display: none;
}

.cardEquipe img {
    position: absolute;
    top: 0;
    left: 0;
    width: 356px;
    height: 361px;
    z-index: 1;
    object-fit: contain;
}

.cardEquipe .co-img {
    display: none;
    z-index: 1;
}

.cardEquipe:hover .co-img,
.cardEquipe:hover .overlay,
.cardEquipe:hover .card-body {
    display: block;
}

.cardEquipe:hover .nb-img {
    display: none;
}

.cardEquipe .card-body {
    position: relative;
    z-index: 3;
    display: none;
    padding-bottom: 50px;
    width: 100%;
}

.cardEquipe h3 {
    color: var(--Background-Light, #FFF);
    text-align: center;
    /* Heading/H4 */
    font-family: Satoshi;
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 128%;
    /* 30.72px */
    letter-spacing: -0.5px;
}

.cardEquipe p {
    color: var(--Background-Light, #FFF);
    text-align: center;
    /* Heading/H5 */
    font-family: Satoshi;
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 22.5px;
    /* 112.5% */
    letter-spacing: -0.5px;
}

@media(max-width:1200px) {

    .cardEquipe,
    .cardEquipe img {
        width: 326px;
        height: 331px;
    }

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

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

@media(max-width:992px) {

    .cardEquipe,
    .cardEquipe img {
        width: 280px;
        height: 290px;
    }
}

@media(max-width:768px) {

    .cardEquipe,
    .cardEquipe img {
        width: 260px;
        height: 270px;
    }

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

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

@media(max-width:570px) {

    .cardEquipe,
    .cardEquipe img {
        width: 150px;
        height: 150px;
    }

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

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

/*--------------------------
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 .box {
    display: flex;
    align-items: center;
    justify-content: center;
    column-gap: 50px;
}

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

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

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

/*-------------------------------
hero-2
---------------------------------*/
.bloc-gradient {
    background-image: url("../../img/agentsia/bg-gradient.svg");
    background-repeat: no-repeat;
    background-size: cover;
}

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



.hero-2,
.hero-2 .container {
    position: relative;
}

.hero-2 .bg-img {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    z-index: 0;
    height: 100%;
    object-fit: cover;
    border-radius: 0 0 50px 50px;
}

.hero-2 h1 {
    color: var(--Primaire-Dark, #0072B6);
    text-align: center;
    /* Display/Display 1 */
    font-family: Satoshi;
    font-size: 56px;
    font-style: normal;
    font-weight: 500;
    line-height: 108%;
    /* 60.48px */
    letter-spacing: -1px;
}

.hero-2 p {
    color: var(--Primaire-Dark, #0072B6);
    text-align: center;
    /* Heading/H4 */
    font-family: Satoshi;
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 128%;
    /* 30.72px */
    letter-spacing: -0.5px;
}

.btnsBox {
    position: absolute;
    bottom: 85px;
    left: 0;
}

@media(min-width:1441px) {
    .btnsBox {
        position: relative;
        margin-top: 1.5rem;
    }

    .hero-2 {
        background-color: #fff;
        border-radius: 0 0 50px 50px;
    }

    .hero-2 .bg-img {
        display: none;
    }
}

@media(min-width:1200px) {
    .hero-2 {
        min-height: 601px;
    }
}

@media(max-width:1200px) {
    .hero-2 {
        min-height: 501px;
    }

    .btnsBox {
        bottom: 65px;
    }
}

@media(max-width:992px) {
    .hero-2 {
        min-height: 401px;
    }

    .btnsBox {
        bottom: 45px;
    }

    .hero-2 h1 {
        font-size: 50px;
    }

    .hero-2 p {
        font-size: 20px;
    }
}

@media(max-width:768px) {
    .hero-2 {
        min-height: 351px;
    }

    .btnsBox {
        bottom: 35px;
    }

    .hero-2 h1 {
        font-size: 45px;
    }

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

@media(max-width:570px) {
  .hero-2 {
        min-height: 401px;
    }

    .btnsBox {
        bottom: 45px;
    }
    .hero-2 .bg-img {
        border-radius: 0 0 0 0;
    }

    .hero-2 h1 {
        font-size: 40px;
    }

    .hero-2 p {
        font-size: 16px;
    }
}
@media(max-width:350px){
        .hero-2 {
        min-height: auto;
    }

    .btnsBox {
       position: relative;
       margin-top: 1.5rem;
    }
}
/*-------------------------
cardSolution
----------------------------------*/
.cardSolution {
    border-radius: 25px;
    background: var(--Background-Light, #FFF);
    width: 100%;
    max-width: 454px;
    height: 100%;
    min-height: 212px;
    padding: 20px;
    transition: background 0.2s ease-in-out;
    cursor: pointer;
}

.cardSolution:hover {
    background: var(--Primaire-Normal, #0098F3);
}

.cardSolution h3 {
    color: var(--Primaire-Normal, #0098F3);
    /* Heading/H4 */
    font-family: Satoshi;
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 128%;
    /* 30.72px */
    letter-spacing: -0.5px;
}

.cardSolution p {
    color: var(--Primaire-Normal, #0098F3);
    /* Paragraph/Large */
    font-family: Inter;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    /* 24px */
    letter-spacing: -0.5px;
}

.cardSolution a {
    color: var(--Primaire-Normal, #0098F3);

    /* Paragraph/Large */
    font-family: Inter;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    /* 24px */
    letter-spacing: -0.5px;
    display: flex;
    align-items: center;
}

.cardSolution:hover h3,
.cardSolution:hover p,
.cardSolution:hover a {
    color: #fff;
}

.cardSolution:hover a svg path {
    fill: #fff;
}

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

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

    .cardSolution a svg {
        width: 20px !important;
        height: 20px !important;
    }
}

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

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

    .cardSolution a svg {
        width: 15px !important;
        height: 15px !important;
    }
}

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

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

    .cardSolution p,
    .cardSolution a {
        font-size: 13px;
    }

}

/*------------------------------
cardOutil
---------------------------------*/
.cardOutil {
    border-radius: 50px;
    border: 3px solid var(--Primaire-Normal, #0098F3);
    background: var(--Background-Light, #FFF);
    width: 100%;
    max-width: 319px;
    height: 100%;
    min-height: 281px;
    padding: 20px;
    transition: background 0.2s ease-in-out;
    cursor: pointer;
}

.cardOutil:hover {
    background: var(--Primaire-Normal, #0098F3);
}

.cardOutil .card-header .box {
    width: 65px;
    height: 65px;
    border-radius: 50%;
    background: var(--primaire-light-active, #0098F3);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 1rem;
}

.cardOutil:hover .box {
    background: #B0DFFB;
}

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

.cardOutil .card-header h3 {
    color: var(--Primaire-Dark, #0072B6);
    /* Heading/H4 */
    font-family: Satoshi;
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 128%;
    /* 30.72px */
    letter-spacing: -0.5px;
}

.cardOutil .card-body p {
    color: var(--Primaire-Dark, #0072B6);

    /* Paragraph/Large */
    font-family: Inter;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    /* 24px */
    letter-spacing: -0.5px;
}

.cardOutil .card-footer a {
    color: var(--Primaire-Dark, #0072B6);

    /* Paragraph/Large */
    font-family: Inter;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    /* 24px */
    letter-spacing: -0.5px;
    display: flex;
    align-items: center;
}

.cardOutil:hover h3,
.cardOutil:hover p,
.cardOutil:hover a {
    color: #fff;
}

.cardOutil:hover path {
    fill: #fff !important;
}

@media(max-width:992px) {
    .cardOutil .card-header .box {
        width: 60px;
        height: 60px;
    }

    .cardOutil .card-header h3 {
        font-size: 20px;
    }

    .cardOutil .card-body p,
    .cardOutil .card-footer a {
        font-size: 15px;
    }
}

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

    .cardOutil .card-header .box {
        width: 55px;
        height: 55px;
    }

    .cardOutil .card-header h3 {
        font-size: 18px;
    }

    .cardOutil .card-body p,
    .cardOutil .card-footer a {
        font-size: 14px;
    }
}

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

    .cardOutil .card-header .box {
        width: 50px;
        height: 50px;
    }

    .cardOutil .card-header h3 {
        font-size: 16px;
    }

    .cardOutil .card-body p,
    .cardOutil .card-footer a {
        font-size: 13px;
    }
}

/*---------------------------
heroAgent
------------------------------*/
.heroAgent {
    position: relative;
    height: fit-content;
}

.heroAgent .bg-hero {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    z-index: 1;
    object-fit: cover;
}

.heroAgent .container-xl {
    position: relative;
    z-index: 2;
}

.heroAgent .images img {
    width: 90% !important;
    object-fit: contain;
}

.cardConv {
    border-radius: 50px;
    background: var(--Background-Light, #FFF);
    box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
    width: 100%;
    position: relative;
    z-index: 3;
}

@media(max-width:768px) {

    .heroAgent .images,
    .heroAgent .bg-agents {
        display: none !important;
    }
}