/* ==================================================
   FINANCEMENT — LLD / SIMULATION NEW
================================================== */

.fin-simulation-new,
.fin-simulation-new *{
    box-sizing:border-box;
}

/* ==================================================
   SECTION
================================================== */

.fin-simulation-new{
    position:relative;

    overflow:hidden;

    padding:68px 0 76px;

    background:
        radial-gradient(
            circle at 50% 32%,
            rgba(37,99,235,.07),
            transparent 34%
        ),
        radial-gradient(
            circle at 8% 10%,
            rgba(37,99,235,.04),
            transparent 28%
        ),
        linear-gradient(
            180deg,
            #ffffff 0%,
            #f8faff 100%
        );
}

/* Cercle décoratif */

.fin-simulation-new::before{
    content:"";

    position:absolute;

    top:-220px;
    right:-170px;

    width:480px;
    height:480px;

    border:1px solid rgba(37,99,235,.045);
    border-radius:50%;

    box-shadow:
        0 0 0 52px rgba(37,99,235,.012),
        0 0 0 104px rgba(37,99,235,.008);

    pointer-events:none;
}

/* Halo central */

.fin-simulation-new::after{
    content:"";

    position:absolute;

    top:250px;
    left:50%;

    width:760px;
    height:320px;

    border-radius:50%;

    background:rgba(37,99,235,.055);

    filter:blur(90px);

    transform:translateX(-50%);

    pointer-events:none;
}

/* ==================================================
   CONTAINER
================================================== */

.fin-simulation-new .le-container{
    position:relative;
    z-index:2;

    width:min(1240px,92%);

    margin:0 auto;
}

.fin-simulation-new-layout{
    display:block;
}

.fin-simulation-new-content{
    width:100%;
    max-width:1180px;

    margin:0 auto;

    text-align:center;
}

/* ==================================================
   LABEL
================================================== */

.fin-simulation-new-label{
    display:inline-flex;

    align-items:center;
    justify-content:center;

    min-height:32px;

    padding:0 16px;
    margin:0 0 20px;

    border:1px solid rgba(37,99,235,.14);
    border-radius:999px;

    background:
        linear-gradient(
            180deg,
            #f4f8ff 0%,
            #eaf2ff 100%
        );

    color:#2563eb;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.9),
        0 8px 20px rgba(37,99,235,.05);

    font-size:12px;
    font-weight:900;
    line-height:1;

    letter-spacing:.65px;

    text-transform:none;
}

/* ==================================================
   TITRE
================================================== */

.fin-simulation-new-content > h2{
    max-width:780px;

    margin:0 auto 20px;

    color:#000d20;

    font-size:clamp(42px,4vw,56px);
    font-weight:950;
    line-height:1.02;

    letter-spacing:-2px;
}

.fin-simulation-new-content > h2 span{
    display:inline;

    width:auto;
    height:auto;

    color:#2563eb;

    background:none;
}

/* ==================================================
   INTRODUCTION
================================================== */

.fin-simulation-new-intro{
    max-width:760px;

    margin:0 auto 28px;

    color:#64748b;

    font-size:16px;
    font-weight:500;
    line-height:1.75;
}

/* ==================================================
   BADGE 60 MOIS
================================================== */

.fin-simulation-new-badge{
    display:inline-flex;

    align-items:center;
    justify-content:center;

    gap:18px;

    min-height:60px;

    padding:12px 34px;
    margin:0 auto 36px;

    border:1px solid rgba(37,99,235,.42);
    border-radius:22px;

    background:
        radial-gradient(
            circle at 80% 0,
            rgba(37,99,235,.25),
            transparent 42%
        ),
        linear-gradient(
            135deg,
            #001333 0%,
            #001e4c 100%
        );

    color:#ffffff;

    box-shadow:
        0 18px 38px rgba(0,36,92,.20),
        0 0 24px rgba(37,99,235,.20),
        inset 0 1px 0 rgba(255,255,255,.09);
}

.fin-simulation-new-badge > svg{
    flex:0 0 auto;

    width:27px;
    height:27px;

    fill:none;
    stroke:currentColor;
    stroke-width:1.8;
    stroke-linecap:round;
    stroke-linejoin:round;
}

.fin-simulation-new-badge span{
    display:flex;

    align-items:baseline;
    justify-content:center;

    gap:6px;

    color:#ffffff;

    font-size:17px;
    font-weight:600;
    line-height:1.2;

    white-space:nowrap;
}

.fin-simulation-new-badge strong{
    color:#ffffff;

    font-size:25px;
    font-weight:950;
    line-height:1;
}

/* ==================================================
   CARTES
================================================== */

.fin-simulation-new-benefits{
    display:grid;

    grid-template-columns:repeat(3,minmax(0,1fr));

    align-items:stretch;

    gap:22px;

    width:100%;

    margin:0 auto 34px;
}

.fin-simulation-new-benefit{
    position:relative;

    display:grid;

    grid-template-columns:82px minmax(0,1fr);

    align-items:center;

    gap:20px;

    min-width:0;
    min-height:142px;

    padding:24px;

    border:1px solid rgba(37,99,235,.12);
    border-radius:20px;

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.98),
            rgba(248,251,255,.98)
        );

    text-align:left;

    box-shadow:
        0 18px 45px rgba(0,13,32,.055),
        inset 0 1px 0 rgba(255,255,255,.9);

    transition:
        transform .35s ease,
        border-color .35s ease,
        box-shadow .35s ease;
}

.fin-simulation-new-benefit:hover{
    transform:translateY(-6px);

    border-color:rgba(37,99,235,.24);

    box-shadow:
        0 24px 55px rgba(0,13,32,.09),
        0 12px 30px rgba(37,99,235,.07);
}

/* ==================================================
   ICÔNE CARTE
================================================== */

.fin-simulation-new-benefit-icon{
    display:flex;

    align-items:center;
    justify-content:center;

    width:76px;
    height:76px;

    border:1px solid rgba(37,99,235,.11);
    border-radius:16px;

    background:
        radial-gradient(
            circle at 25% 15%,
            #ffffff,
            transparent 42%
        ),
        linear-gradient(
            145deg,
            #f4f8ff,
            #e8f1ff
        );

    color:#2563eb;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.9),
        0 14px 30px rgba(37,99,235,.07);

    transition:
        transform .35s ease,
        color .35s ease,
        background .35s ease,
        box-shadow .35s ease;
}

.fin-simulation-new-benefit:hover
.fin-simulation-new-benefit-icon{
    transform:scale(1.04);

    color:#ffffff;

    background:
        linear-gradient(
            145deg,
            #2f72ff,
            #0757f9
        );

    box-shadow:
        0 18px 36px rgba(37,99,235,.22),
        0 0 0 7px rgba(37,99,235,.05);
}

.fin-simulation-new-benefit-icon svg{
    width:37px;
    height:37px;

    fill:none;
    stroke:currentColor;
    stroke-width:1.8;
    stroke-linecap:round;
    stroke-linejoin:round;
}

.fin-simulation-new-icon-mask{

    width:37px;
    height:37px;

    display:block;
    flex:0 0 37px;

    background:currentColor;

    -webkit-mask:var(--fin-icon) center / contain no-repeat;
    mask:var(--fin-icon) center / contain no-repeat;

}

/* ==================================================
   CONTENU CARTE
================================================== */

.fin-simulation-new-benefit-content{
    min-width:0;
}

.fin-simulation-new-benefit h3{
    width:100%;

    margin:0 0 8px;
    padding:0;

    color:#000d20;

    font-size:15.5px;
    font-weight:950;
    line-height:1.35;

    letter-spacing:-.2px;
    text-align:left;
}

.fin-simulation-new-benefit p{
    width:100%;

    margin:0;
    padding:0;

    color:#64748b;

    font-size:13px;
    font-weight:500;
    line-height:1.6;

    text-align:left;
}

/* ==================================================
   BOUTON
================================================== */

.fin-simulation-new-button{
    display:flex;

    align-items:center;
    justify-content:center;

    width:100%;
}

.fin-simulation-new-button-link{
    display:inline-flex;

    align-items:center;
    justify-content:center;

    gap:17px;

    min-height:56px;

    padding:0 31px;

    border:1px solid rgba(255,255,255,.15);
    border-radius:10px;

    background:
        linear-gradient(
            135deg,
            #2563eb 0%,
            #0861ff 100%
        );

    color:#ffffff !important;

    box-shadow:
        0 16px 34px rgba(37,99,235,.22),
        inset 0 1px 0 rgba(255,255,255,.16);

    font-size:15px;
    font-weight:900;
    line-height:1;

    text-decoration:none !important;

    transition:
        transform .3s ease,
        box-shadow .3s ease,
        background .3s ease;
}

.fin-simulation-new-button-link:hover{
    transform:translateY(-3px);

    background:
        linear-gradient(
            135deg,
            #1d5be3 0%,
            #0054ed 100%
        );

    color:#ffffff !important;

    box-shadow:
        0 22px 42px rgba(37,99,235,.30),
        inset 0 1px 0 rgba(255,255,255,.18);
}

.fin-simulation-new-button-link svg{
    width:21px;
    height:21px;

    fill:none;
    stroke:currentColor;
    stroke-width:1.8;
    stroke-linecap:round;
    stroke-linejoin:round;

    transition:transform .3s ease;
}

.fin-simulation-new-button-link:hover svg{
    transform:translateX(5px);
}

/* ==================================================
   REVEAL
================================================== */

.fin-simulation-new-content{
    opacity:1;
    visibility:visible;
}

/* ==================================================
   RESPONSIVE — TABLETTE
================================================== */

@media(max-width:1050px){

    .fin-simulation-new{
        padding:72px 0 82px;
    }

    .fin-simulation-new .le-container{
        width:min(100%,92%);
    }

    .fin-simulation-new-content > h2{
        font-size:clamp(40px,6vw,50px);
    }

    .fin-simulation-new-benefits{
        grid-template-columns:1fr;
        gap:16px;

        max-width:760px;
    }

    .fin-simulation-new-benefit{
        min-height:130px;

        grid-template-columns:76px minmax(0,1fr);

        padding:22px 25px;
    }

    .fin-simulation-new-benefit-icon{
        width:68px;
        height:68px;
    }

.fin-simulation-new-benefit-icon svg,
.fin-simulation-new-icon-mask{
    width:33px;
    height:33px;
}

}

/* ==================================================
   RESPONSIVE — MOBILE
================================================== */

@media(max-width:600px){

    .fin-simulation-new{
        padding:56px 0 64px;
    }

    .fin-simulation-new::before,
    .fin-simulation-new::after{
        display:none;
    }

    .fin-simulation-new .le-container{
        width:calc(100% - 28px);
    }

    .fin-simulation-new-label{
        min-height:29px;

        padding:0 12px;
        margin-bottom:17px;

        font-size:10.5px;
    }

    .fin-simulation-new-content > h2{
        margin-bottom:18px;

        font-size:clamp(32px,9vw,39px);
        line-height:1.06;

        letter-spacing:-1.1px;
    }

    .fin-simulation-new-content > h2 br{
        display:none;
    }

    .fin-simulation-new-intro{
        margin-bottom:25px;

        font-size:14.5px;
        line-height:1.65;
    }

    .fin-simulation-new-badge{
        gap:12px;

        min-height:55px;

        padding:11px 19px;
        margin-bottom:28px;

        border-radius:17px;
    }

    .fin-simulation-new-badge > svg{
        width:23px;
        height:23px;
    }

    .fin-simulation-new-badge span{
        gap:4px;

        font-size:14px;
    }

    .fin-simulation-new-badge strong{
        font-size:20px;
    }

    .fin-simulation-new-benefits{
        gap:13px;

        margin-bottom:28px;
    }

    .fin-simulation-new-benefit{
        grid-template-columns:58px minmax(0,1fr);

        gap:15px;

        min-height:0;

        padding:18px;

        border-radius:17px;
    }

    .fin-simulation-new-benefit-icon{
        width:56px;
        height:56px;

        border-radius:14px;
    }

.fin-simulation-new-benefit-icon svg,
.fin-simulation-new-icon-mask{
    width:28px;
    height:28px;
}

    .fin-simulation-new-benefit h3{
        margin-bottom:5px;

        font-size:15px;
    }

    .fin-simulation-new-benefit p{
        font-size:12.5px;
        line-height:1.55;
    }

    .fin-simulation-new-button-link{
        width:100%;
        max-width:320px;

        min-height:54px;

        padding:0 22px;

        font-size:14px;
    }

}

/* ==================================================
   RESPONSIVE — PETIT MOBILE
================================================== */

@media(max-width:390px){

    .fin-simulation-new .le-container{
        width:calc(100% - 20px);
    }

    .fin-simulation-new-content > h2{
        font-size:31px;
    }

    .fin-simulation-new-badge{
        width:100%;

        padding:11px 13px;
    }

    .fin-simulation-new-badge span{
        flex-wrap:wrap;

        row-gap:2px;

        white-space:normal;
    }

    .fin-simulation-new-benefit{
        grid-template-columns:1fr;

        justify-items:center;

        text-align:center;
    }

    .fin-simulation-new-benefit h3,
    .fin-simulation-new-benefit p{
        text-align:center;
    }

}

/* ==================================================
   ACCESSIBILITÉ
================================================== */

@media(prefers-reduced-motion:reduce){

    .fin-simulation-new *,
    .fin-simulation-new *::before,
    .fin-simulation-new *::after{
        animation:none !important;
        transition:none !important;
        scroll-behavior:auto !important;
    }

}