/* ==================================================
   ACCUEIL — CTA FINAL PREMIUM
================================================== */

.le-home-final-showcase{
    position:relative;
    overflow:hidden;

    padding:78px 0 92px;

    background:
        radial-gradient(
            circle at 50% 0,
            rgba(37,99,235,.05),
            transparent 35%
        ),
        linear-gradient(
            180deg,
            #ffffff 0%,
            #f7faff 100%
        );
}

.le-home-final-showcase,
.le-home-final-showcase *,
.le-home-final-showcase *::before,
.le-home-final-showcase *::after{
    box-sizing:border-box;
}

.le-home-final-showcase .le-container{
    position:relative;
    z-index:2;

    width:min(1680px,94%);
    margin:0 auto;
}


/* ==================================================
   CONTENEUR
================================================== */

.le-home-final-showcase-box{
    position:relative;
    overflow:hidden;

    min-height:530px;
    padding:58px;

    border:1px solid rgba(255,255,255,.11);
    border-radius:30px;

    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(320px,360px);
    gap:54px;
    align-items:stretch;

    background:#000d20;

    box-shadow:
        0 36px 100px rgba(0,13,32,.25),
        inset 0 1px 0 rgba(255,255,255,.10);
}

.le-home-final-showcase-box::before{
    content:"";

    position:absolute;
    inset:0;
    z-index:3;

    border:1px solid rgba(255,255,255,.05);
    border-radius:29px;

    pointer-events:none;
}


/* ==================================================
   IMAGE DE FOND
================================================== */

.le-home-final-showcase-bg{
    position:absolute;
    inset:0;
    z-index:0;

    overflow:hidden;
}

.le-home-final-showcase-bg img{
    display:block;

    width:100%;
    height:100%;

    object-fit:cover;
    object-position:center right;

    transform:scale(1.06);

    transition:
        transform 1.4s cubic-bezier(.22,.61,.36,1),
        filter .5s ease;
}

.le-home-final-showcase-box:hover .le-home-final-showcase-bg img{
    transform:scale(1.095);
    filter:brightness(1.03);
}

.le-home-final-showcase-overlay{
    position:absolute;
    inset:0;
    z-index:1;

    background:
        radial-gradient(
            circle at 12% 15%,
            rgba(37,99,235,.22),
            transparent 30%
        ),
        radial-gradient(
            circle at 88% 80%,
            rgba(37,99,235,.13),
            transparent 35%
        ),
        linear-gradient(
            90deg,
            rgba(0,13,32,.99) 0%,
            rgba(0,13,32,.96) 40%,
            rgba(0,13,32,.80) 67%,
            rgba(0,13,32,.40) 100%
        );

    pointer-events:none;
}


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

.le-home-final-showcase-content{
    position:relative;
    z-index:4;

    min-width:0;

    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:flex-start;
}

.le-home-final-showcase-label{
    display:inline-flex;
    align-items:center;
    justify-content:center;

    width:max-content;
    min-height:30px;

    margin-bottom:19px;
    padding:0 13px;

    border:1px solid rgba(96,165,250,.25);
    border-radius:999px;

    background:rgba(37,99,235,.15);
    color:#86b5ff;

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

    text-transform:uppercase;
    letter-spacing:.7px;
}

.le-home-final-showcase-content h2{
    max-width:800px;

    margin:0 0 22px;

    color:#ffffff;

    font-size:52px;
    font-weight:950;
    line-height:1.06;
    letter-spacing:-1.55px;

    text-shadow:0 4px 25px rgba(0,0,0,.25);
}

.le-home-final-showcase-content h2 span{
    display:inline;
    width:auto;
    height:auto;

    color:#397cff;
    background:none;
}

.le-home-final-showcase-intro{
    max-width:720px;

    margin:0 0 27px;
    padding-bottom:0 !important;

    color:rgba(255,255,255,.78);

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


/* ==================================================
   POINTS
================================================== */

.le-home-final-showcase-points{
    width:100%;
    max-width:760px;
    margin:0 0 31px;

    display:grid;
    grid-template-columns:1fr;
    gap:12px;
}

.le-home-final-showcase-point{
    min-width:0;
    min-height:32px;

    display:grid;
    grid-template-columns:27px minmax(0,1fr);
    align-items:center;
    gap:12px;
}

.le-home-final-showcase-point > span{
    width:27px;
    height:27px;
    flex:0 0 27px;

    border-radius:50%;

    background:rgba(37,99,235,.17);
    color:#82b2ff;

    display:flex;
    align-items:center;
    justify-content:center;
}

.le-home-final-showcase-point svg{
    display:block;

    width:14px;
    height:14px;

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

.le-home-final-showcase-point p{
    margin:0 !important;
    padding:0 !important;

    color:rgba(255,255,255,.84);

    font-size:13.5px;
    font-weight:700;
    line-height:1.45;
}


/* ==================================================
   ACTIONS
================================================== */

.le-home-final-showcase-actions{
    width:100%;

    display:grid;
    grid-template-columns:repeat(2,minmax(260px,330px));
    align-items:stretch;
    gap:14px;
}

.le-home-final-showcase-btn{
    position:relative;
    overflow:hidden;

    width:100%;
    min-height:82px;

    padding:0 17px;

    border-radius:16px;

    display:grid;
    grid-template-columns:47px minmax(0,1fr) 28px;
    gap:13px;
    align-items:center;

    text-decoration:none;

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

.le-home-final-showcase-btn::before{
    content:"";

    position:absolute;
    inset:0;

    background:
        linear-gradient(
            120deg,
            transparent 30%,
            rgba(255,255,255,.17) 48%,
            transparent 66%
        );

    transform:translateX(-115%);

    transition:transform .55s ease;
}

.le-home-final-showcase-btn:hover::before{
    transform:translateX(115%);
}

.le-home-final-showcase-btn:hover{
    transform:translateY(-4px);
}


/* BOUTON PRINCIPAL */

.le-home-final-showcase-btn-primary{
    border:1px solid rgba(255,255,255,.11);

    background:linear-gradient(
        135deg,
        #2563eb,
        #0757f9
    );

    color:#ffffff;

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

.le-home-final-showcase-btn-primary:hover{
    color:#ffffff;

    box-shadow:
        0 25px 54px rgba(37,99,235,.39),
        inset 0 1px 0 rgba(255,255,255,.20);
}


/* BOUTON SECONDAIRE */

.le-home-final-showcase-btn-secondary{
    border:1px solid rgba(255,255,255,.19);

    background:rgba(255,255,255,.065);
    color:#ffffff;

    backdrop-filter:blur(10px);
    -webkit-backdrop-filter:blur(10px);
}

.le-home-final-showcase-btn-secondary:hover{
    border-color:rgba(255,255,255,.38);

    background:rgba(255,255,255,.12);
    color:#ffffff;

    box-shadow:0 18px 38px rgba(0,0,0,.20);
}


/* ICÔNES BOUTONS */

.le-home-final-showcase-btn-icon{
    position:relative;
    z-index:2;

    width:47px;
    height:47px;

    border-radius:14px;

    background:rgba(255,255,255,.12);
    color:#ffffff;

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

    box-shadow:inset 0 0 0 1px rgba(255,255,255,.09);
}

.le-home-final-showcase-btn-icon svg{
    display:block;

    width:23px !important;
    height:23px !important;

    fill:none !important;
    stroke:currentColor !important;
    stroke-width:1.9 !important;
    stroke-linecap:round;
    stroke-linejoin:round;
}

.le-home-final-showcase-btn-content{
    position:relative;
    z-index:2;

    min-width:0;

    display:grid;
    grid-template-rows:18px minmax(38px,auto);
    align-content:center;
    gap:3px;
}

.le-home-final-showcase-btn-content small{
    min-height:18px;

    display:flex;
    align-items:center;

    color:rgba(255,255,255,.61);

    font-size:9.5px;
    font-weight:850;
    line-height:1.2;
    text-transform:uppercase;
    letter-spacing:.45px;
}

.le-home-final-showcase-btn-content strong{
    min-height:38px;

    display:flex;
    align-items:center;

    color:#ffffff;

    font-size:13.5px;
    font-weight:900;
    line-height:1.35;
}

.le-home-final-showcase-btn-arrow{
    position:relative;
    z-index:2;

    width:28px;
    height:28px;

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

    transition:transform .3s ease;
}

.le-home-final-showcase-btn-arrow svg{
    display:block;

    width:19px !important;
    height:19px !important;

    fill:none !important;
    stroke:currentColor !important;
    stroke-width:2.3 !important;
    stroke-linecap:round;
    stroke-linejoin:round;
}

.le-home-final-showcase-btn:hover .le-home-final-showcase-btn-arrow{
    transform:translateX(5px);
}


/* ==================================================
   CARTE FLOTTANTE
================================================== */

.le-home-final-showcase-card{
    position:relative;
    z-index:4;

    min-width:0;
    min-height:330px;
    padding:29px;

    border:1px solid rgba(255,255,255,.14);
    border-radius:22px;

    background:rgba(0,13,32,.76);
    color:#ffffff;

    display:grid;
    grid-template-rows:58px 24px minmax(58px,auto) minmax(92px,1fr) auto;
    align-content:start;

    backdrop-filter:blur(16px);
    -webkit-backdrop-filter:blur(16px);

    box-shadow:
        0 28px 70px rgba(0,0,0,.30),
        inset 0 1px 0 rgba(255,255,255,.09);

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

.le-home-final-showcase-card:hover{
    transform:translateY(-7px);

    border-color:rgba(96,165,250,.35);

    box-shadow:
        0 35px 85px rgba(0,0,0,.36),
        inset 0 1px 0 rgba(255,255,255,.12);
}

.le-home-final-showcase-card-icon{
    width:58px;
    height:58px;

    margin-bottom:0;

    border-radius:17px;

    background:linear-gradient(
        145deg,
        #2563eb,
        #0757f9
    );

    color:#ffffff;

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

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

.le-home-final-showcase-card-icon svg{
    display:block;

    width:29px !important;
    height:29px !important;

    fill:none !important;
    stroke:currentColor !important;
    stroke-width:1.9 !important;
    stroke-linecap:round;
    stroke-linejoin:round;
}

.le-home-final-showcase-card > span{
    min-height:24px;
    margin:0;

    display:flex;
    align-items:center;

    color:#82b2ff;

    font-size:10px;
    font-weight:900;
    line-height:1.2;
    text-transform:uppercase;
    letter-spacing:.6px;
}

.le-home-final-showcase-card h3{
    min-height:58px;
    margin:0;

    display:flex;
    align-items:center;

    color:#ffffff;

    font-size:23px;
    font-weight:950;
    line-height:1.25;
    letter-spacing:-.35px;
}

.le-home-final-showcase-card > p{
    min-height:92px;
    margin:0;
    padding:8px 0 20px !important;

    color:rgba(255,255,255,.69);

    font-size:13.5px;
    font-weight:500;
    line-height:1.65;
}

.le-home-final-showcase-card-footer{
    margin-top:0;
    padding-top:20px;

    border-top:1px solid rgba(255,255,255,.11);

    display:grid;
    grid-template-columns:43px minmax(0,1fr);
    gap:12px;
    align-items:center;
}

.le-home-final-showcase-card-avatar{
    width:43px;
    height:43px;

    border-radius:50%;

    background:rgba(37,99,235,.16);
    color:#82b2ff;

    display:flex;
    align-items:center;
    justify-content:center;
}

.le-home-final-showcase-card-avatar svg{
    display:block;

    width:22px !important;
    height:22px !important;

    fill:none !important;
    stroke:currentColor !important;
    stroke-width:1.9 !important;
    stroke-linecap:round;
    stroke-linejoin:round;
}

.le-home-final-showcase-card-footer small{
    display:block;

    margin-bottom:3px;

    color:rgba(255,255,255,.50);

    font-size:9.5px;
    font-weight:800;

    text-transform:uppercase;
    letter-spacing:.4px;
}

.le-home-final-showcase-card-footer strong{
    display:block;

    color:#ffffff;

    font-size:12.5px;
    font-weight:900;
}


/* ==================================================
   ANIMATIONS
================================================== */

.le-home-final-showcase-content,
.le-home-final-showcase-card{
    opacity:1;
    transform:none;
}

.le-home-final-showcase.is-visible .le-home-final-showcase-content{
    animation:leHomeFinalContentIn .8s cubic-bezier(.22,.61,.36,1) both;
}

.le-home-final-showcase.is-visible .le-home-final-showcase-card{
    animation:leHomeFinalCardIn .85s cubic-bezier(.22,.61,.36,1) .16s both;
}

@keyframes leHomeFinalContentIn{
    from{
        opacity:0;
        transform:translateY(30px);
    }

    to{
        opacity:1;
        transform:translateY(0);
    }
}

@keyframes leHomeFinalCardIn{
    from{
        opacity:0;
        transform:translateX(35px) scale(.97);
    }

    to{
        opacity:1;
        transform:translateX(0) scale(1);
    }
}


/* ==================================================
   RESPONSIVE
================================================== */

@media(max-width:1150px){

    .le-home-final-showcase-box{
        grid-template-columns:1fr;
    }

    .le-home-final-showcase-card{
        min-height:0;
    }
}


@media(max-width:760px){

    .le-home-final-showcase{
        padding:58px 0 70px;
    }

    .le-home-final-showcase-box{
        min-height:0;

        padding:32px 25px;

        gap:34px;

        border-radius:23px;
    }

    .le-home-final-showcase-box::before{
        border-radius:22px;
    }

    .le-home-final-showcase-overlay{
        background:
            radial-gradient(
                circle at 12% 15%,
                rgba(37,99,235,.20),
                transparent 32%
            ),
            linear-gradient(
                90deg,
                rgba(0,13,32,.97),
                rgba(0,13,32,.78)
            );
    }

    .le-home-final-showcase-content h2{
        font-size:39px;
    }

    .le-home-final-showcase-actions{
        flex-direction:column;
    }

    .le-home-final-showcase-btn{
        width:100%;
    }
}


@media(max-width:520px){

    .le-home-final-showcase{
        padding:46px 0 58px;
    }

    .le-home-final-showcase-box{
        padding:22px 18px;
    }

    .le-home-final-showcase-content h2{
        font-size:32px;
    }

    .le-home-final-showcase-intro{
        font-size:14.5px;
    }

    .le-home-final-showcase-btn{
        min-height:79px;
    }

    .le-home-final-showcase-card{
        padding:23px;
    }

    .le-home-final-showcase-card h3{
        font-size:20px;
    }
}

/* ==================================================
   CORRECTIONS RESPONSIVE FINALES
================================================== */

@media(max-width:1280px){

    .le-home-final-showcase-box{
        padding:48px;
        grid-template-columns:minmax(0,1fr) minmax(300px,340px);
        gap:40px;
    }

    .le-home-final-showcase-content h2{
        font-size:46px;
    }

    .le-home-final-showcase-actions{
        grid-template-columns:repeat(2,minmax(235px,1fr));
    }

}

@media(max-width:1150px){

    .le-home-final-showcase-box{
        grid-template-columns:1fr;
        align-items:stretch;
    }

    .le-home-final-showcase-content{
        min-height:auto;
    }

    .le-home-final-showcase-card{
        min-height:0;
        grid-template-rows:58px 24px auto auto auto;
    }

}

@media(max-width:760px){

    .le-home-final-showcase .le-container{
        width:calc(100% - 28px);
    }

    .le-home-final-showcase-content{
        align-items:center;
        text-align:center;
    }

    .le-home-final-showcase-label{
        margin-left:auto;
        margin-right:auto;
    }

    .le-home-final-showcase-intro{
        margin-left:auto;
        margin-right:auto;
    }

    .le-home-final-showcase-points{
        max-width:620px;
        text-align:left;
    }

    .le-home-final-showcase-actions{
        grid-template-columns:1fr;
    }

    .le-home-final-showcase-btn{
        width:100%;
    }

    .le-home-final-showcase-card{
        text-align:left;
    }

}

@media(max-width:520px){

    .le-home-final-showcase .le-container{
        width:calc(100% - 20px);
    }

    .le-home-final-showcase-box{
        padding:22px 18px;
        border-radius:19px;
    }

    .le-home-final-showcase-box::before{
        border-radius:18px;
    }

    .le-home-final-showcase-content h2{
        font-size:32px;
        letter-spacing:-.8px;
    }

    .le-home-final-showcase-content h2 br{
        display:none;
    }

    .le-home-final-showcase-btn{
        min-height:78px;
        padding:0 14px;
        grid-template-columns:43px minmax(0,1fr) 24px;
        gap:10px;
        border-radius:14px;
    }

    .le-home-final-showcase-btn-icon{
        width:43px;
        height:43px;
        border-radius:12px;
    }

    .le-home-final-showcase-btn-content strong{
        font-size:12.5px;
    }

    .le-home-final-showcase-card{
        padding:23px;
        border-radius:18px;
    }

    .le-home-final-showcase-card h3{
        min-height:auto;
        font-size:20px;
    }

    .le-home-final-showcase-card > p{
        min-height:auto;
    }

}

@media(max-width:380px){

    .le-home-final-showcase-content h2{
        font-size:29px;
    }

    .le-home-final-showcase-point{
        align-items:start;
    }

    .le-home-final-showcase-btn{
        grid-template-columns:40px minmax(0,1fr) 20px;
        padding:0 11px;
        gap:8px;
    }

    .le-home-final-showcase-btn-icon{
        width:40px;
        height:40px;
    }

    .le-home-final-showcase-btn-content small{
        font-size:8.5px;
    }

    .le-home-final-showcase-btn-content strong{
        font-size:11.5px;
    }

}

@media(hover:none){

    .le-home-final-showcase-box:hover
    .le-home-final-showcase-bg img{
        transform:scale(1.06);
        filter:none;
    }

    .le-home-final-showcase-btn:hover,
    .le-home-final-showcase-card:hover{
        transform:none;
    }

}

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

    .le-home-final-showcase-bg img,
    .le-home-final-showcase-btn,
    .le-home-final-showcase-btn::before,
    .le-home-final-showcase-btn-arrow,
    .le-home-final-showcase-card{
        transition:none;
        animation:none !important;
    }

}