/* =====================================================
   NOS SOLUTIONS — ÉCOSYSTÈME RESOCOM
   Fichier : assets/css/nos-solutions.css
   Thème enfant Astra
====================================================== */

:root{
    --solutions-black:#010A1F;
    --solutions-blue-dark:#0F2F46;
    --solutions-blue:#16486B;
    --solutions-blue-light:#62A3C4;

    --solutions-orange:#F6903D;
    --solutions-terracotta:#BE3F23;

    --solutions-purple:#7958FF;
    --solutions-purple-dark:#4B2BC4;
    --solutions-cyan:#4092FF;

    --solutions-white:#ffffff;
    --solutions-grey:#F3F6FA;
    --solutions-grey-2:#EAF0F6;
    --solutions-border:rgba(16,24,40,.09);

    --solutions-text:#101828;
    --solutions-text-soft:#526173;

    --solutions-container:1240px;
    --solutions-container-large:1320px;

    --solutions-shadow-card:0 18px 46px rgba(16,24,40,.07);
    --solutions-shadow-soft:0 24px 70px rgba(16,24,40,.10);
    --solutions-shadow-strong:0 34px 100px rgba(1,10,31,.18);
}


/* =====================================================
   01. RESET ASTRA
====================================================== */

.page .nos-solutions-page,
.page .nos-solutions-page *{
    box-sizing:border-box;
}

.page .nos-solutions-page{
    width:100%;
    max-width:100vw;
    margin:0;
    padding:0;
    overflow-x:hidden;
    color:var(--solutions-text);
    background:var(--solutions-white);
}

.page .nos-solutions-page img,
.page .nos-solutions-page iframe,
.page .nos-solutions-page video{
    max-width:100%;
}

.page .nos-solutions-page a{
    text-decoration:none;
}

.page-template-default .site-content > .ast-container,
.page-template .site-content > .ast-container{
    max-width:100% !important;
    padding-left:0 !important;
    padding-right:0 !important;
}

@media(min-width:1200px){
    body.ast-plain-container.ast-no-sidebar main#primary.nos-solutions-page,
    body.ast-plain-container.ast-no-sidebar #primary.nos-solutions-page{
        margin-top:0 !important;
        margin-bottom:0 !important;
    }
}


/* =====================================================
   02. COMPOSANTS COMMUNS
====================================================== */

.solutions-section__container{
    position:relative;
    z-index:2;
    width:100%;
    max-width:var(--solutions-container);
    margin:0 auto;
}

.solutions-section__intro{
    max-width:880px;
    margin:0 0 62px;
}

.solutions-section__intro--center{
    margin-left:auto;
    margin-right:auto;
    text-align:center;
}

.solutions-eyebrow{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    margin-bottom:18px;
    color:var(--solutions-orange);
    font-size:14px;
    line-height:1;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:.085em;
}

.solutions-section__intro h2,
.solution-focus__content h2,
.solutions-advantage__content h2,
.solutions-final-cta h2{
    margin:0 0 24px;
    color:var(--solutions-black);
    font-size:clamp(34px, 4vw, 58px);
    line-height:1.08;
    letter-spacing:-.045em;
    font-weight:950;
}

.solutions-section__intro p,
.solution-focus__content p,
.solutions-advantage__content p,
.solutions-final-cta p{
    margin:0;
    color:var(--solutions-text-soft);
    font-size:19px;
    line-height:1.72;
}

.solutions-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:54px;
    padding:16px 30px;
    border-radius:999px;
    font-size:16px;
    line-height:1;
    font-weight:850;
    text-decoration:none;
    cursor:pointer;
    transition:
        transform .25s ease,
        box-shadow .25s ease,
        background .25s ease,
        border-color .25s ease,
        color .25s ease;
}

.solutions-btn--primary{
    background:linear-gradient(135deg, var(--solutions-purple), var(--solutions-cyan));
    color:var(--solutions-white);
    box-shadow:0 18px 38px rgba(121,88,255,.30);
}

.solutions-btn--primary:hover{
    transform:translateY(-2px);
    color:var(--solutions-white);
    box-shadow:0 24px 48px rgba(121,88,255,.40);
}

.solutions-btn--secondary{
    background:rgba(255,255,255,.13);
    color:var(--solutions-white);
    border:1px solid rgba(255,255,255,.28);
    box-shadow:none;
    backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);
}

.solutions-btn--secondary:hover{
    transform:translateY(-2px);
    background:rgba(255,255,255,.22);
    color:var(--solutions-white);
}

.solutions-btn--light{
    background:var(--solutions-white);
    color:var(--solutions-purple-dark);
    border:1px solid var(--solutions-border);
    box-shadow:0 12px 34px rgba(16,24,40,.06);
}

.solutions-btn--light:hover{
    transform:translateY(-2px);
    color:var(--solutions-purple-dark);
    border-color:rgba(121,88,255,.28);
    box-shadow:0 20px 44px rgba(16,24,40,.10);
}


/* =====================================================
   03. SCROLL PROGRESS / STICKY CTA
====================================================== */

.solutions-scroll-progress{
    position:fixed;
    top:0;
    left:0;
    z-index:999998;
    width:100%;
    height:3px;
    background:rgba(255,255,255,.06);
    pointer-events:none;
}

.solutions-scroll-progress__bar{
    width:0;
    height:100%;
    background:linear-gradient(
        90deg,
        var(--solutions-purple),
        var(--solutions-cyan),
        var(--solutions-orange)
    );
    box-shadow:0 0 18px rgba(121,88,255,.45);
}

.solutions-sticky-cta{
    position:fixed;
    left:50%;
    bottom:24px;
    z-index:999990;
    transform:translateX(-50%) translateY(24px);
    opacity:0;
    pointer-events:none;

    display:flex;
    align-items:center;
    gap:18px;

    padding:10px 12px 10px 18px;
    border-radius:999px;
    background:rgba(1,10,31,.84);
    border:1px solid rgba(255,255,255,.16);
    box-shadow:0 24px 70px rgba(1,10,31,.28);

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

    transition:
        opacity .35s ease,
        transform .35s ease;
}

.solutions-sticky-cta.is-visible{
    opacity:1;
    pointer-events:auto;
    transform:translateX(-50%) translateY(0);
}

.solutions-sticky-cta > span{
    color:rgba(255,255,255,.82);
    font-size:13px;
    line-height:1;
    font-weight:800;
    white-space:nowrap;
}

.solutions-sticky-cta__actions{
    display:flex;
    align-items:center;
    gap:8px;
}

.solutions-sticky-cta__actions a{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:38px;
    padding:11px 16px;
    border-radius:999px;
    color:#ffffff;
    font-size:13px;
    line-height:1;
    font-weight:850;
    text-decoration:none;
    transition:
        background .25s ease,
        transform .25s ease,
        box-shadow .25s ease;
}

.solutions-sticky-cta__actions a:first-child{
    background:rgba(255,255,255,.12);
    border:1px solid rgba(255,255,255,.16);
}

.solutions-sticky-cta__actions a:first-child:hover{
    background:rgba(255,255,255,.20);
    transform:translateY(-1px);
}

.solutions-sticky-cta__actions a:last-child{
    background:linear-gradient(135deg, var(--solutions-purple), var(--solutions-cyan));
    box-shadow:0 12px 28px rgba(121,88,255,.28);
}

.solutions-sticky-cta__actions a:last-child:hover{
    transform:translateY(-1px);
    box-shadow:0 16px 34px rgba(121,88,255,.38);
}


/* =====================================================
   04. HERO
====================================================== */

.solutions-hero{
    position:relative;
    min-height:calc(100svh - 90px);
    overflow:hidden;
    background:var(--solutions-black);
    color:var(--solutions-white);
}

.solutions-hero__background{
    position:absolute;
    inset:0;
    background:
        radial-gradient(circle at 16% 18%, rgba(121,88,255,.34), transparent 34%),
        radial-gradient(circle at 88% 75%, rgba(64,146,255,.24), transparent 32%),
        radial-gradient(circle at 54% 54%, rgba(246,144,61,.12), transparent 42%),
        linear-gradient(135deg, var(--solutions-black) 0%, var(--solutions-blue-dark) 52%, #07182a 100%);
    transform:scale(1.02);
}

.solutions-hero__overlay{
    position:absolute;
    inset:0;
    z-index:1;
    pointer-events:none;
    background:
        linear-gradient(90deg, rgba(1,10,31,.95), rgba(15,47,70,.78)),
        radial-gradient(circle at 50% 50%, rgba(255,255,255,.05), transparent 55%);
    overflow:hidden;
}

.solutions-hero__overlay::before{
    content:"";
    position:absolute;
    top:24%;
    left:-75%;
    width:90%;
    height:2px;
    background:linear-gradient(
        90deg,
        transparent,
        rgba(121,88,255,.78),
        rgba(64,146,255,.78),
        rgba(246,144,61,.64),
        transparent
    );
    opacity:.58;
    transform:rotate(-13deg);
    animation:solutionsHeroBeam 9s ease-in-out infinite;
}

.solutions-hero__overlay::after{
    content:"";
    position:absolute;
    top:16%;
    left:-80%;
    width:95%;
    height:120px;
    background:linear-gradient(
        90deg,
        transparent,
        rgba(121,88,255,.14),
        rgba(64,146,255,.14),
        rgba(246,144,61,.10),
        transparent
    );
    opacity:.62;
    filter:blur(38px);
    transform:rotate(-13deg);
    animation:solutionsHeroHalo 9s ease-in-out infinite;
}

@keyframes solutionsHeroBeam{
    0%{ left:-75%; opacity:0; }
    18%{ opacity:.45; }
    50%{ opacity:.62; }
    100%{ left:110%; opacity:0; }
}

@keyframes solutionsHeroHalo{
    0%{ left:-82%; opacity:0; }
    20%{ opacity:.45; }
    52%{ opacity:.62; }
    100%{ left:105%; opacity:0; }
}

.solutions-hero__container{
    position:relative;
    z-index:3;
    width:100%;
    max-width:var(--solutions-container-large);
    min-height:calc(100svh - 90px);
    margin:0 auto;
    padding:clamp(56px, 7vh, 92px) 48px clamp(76px, 8vh, 110px);
    display:grid;
    grid-template-columns:minmax(0, .98fr) minmax(420px, 1.02fr);
    gap:clamp(42px, 5vw, 76px);
    align-items:center;
}

.solutions-hero__content{
    max-width:800px;
}

.solutions-hero__badge{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    margin-bottom:22px;
    padding:9px 18px;
    border-radius:999px;
    background:rgba(121,88,255,.16);
    border:1px solid rgba(121,88,255,.28);
    color:#fff;
    font-size:13px;
    line-height:1;
    font-weight:850;
    letter-spacing:.02em;
    backdrop-filter:blur(14px);
    -webkit-backdrop-filter:blur(14px);
}

.solutions-hero h1{
    margin:0 0 24px;
    color:#fff;
    font-size:clamp(43px, 5.25vw, 76px);
    line-height:1.01;
    letter-spacing:-.06em;
    font-weight:950;
}

.solutions-hero p{
    max-width:760px;
    margin:0 0 30px;
    color:rgba(255,255,255,.88);
    font-size:clamp(17px, 1.55vw, 21px);
    line-height:1.62;
}

.solutions-hero__formula{
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:12px;
    margin:0 0 30px;
}

.solutions-hero__formula div{
    padding:16px 14px;
    border-radius:20px;
    background:rgba(255,255,255,.10);
    border:1px solid rgba(255,255,255,.15);
    backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);
}

.solutions-hero__formula strong{
    display:block;
    margin-bottom:8px;
    color:#fff;
    font-size:15px;
    line-height:1.1;
    font-weight:950;
}

.solutions-hero__formula span{
    display:block;
    color:#DCD3FF;
    font-size:13px;
    line-height:1;
    font-weight:850;
    text-transform:uppercase;
    letter-spacing:.07em;
}

.solutions-hero__actions{
    display:flex;
    flex-wrap:wrap;
    gap:14px;
}

.solutions-hero__visual{
    position:relative;
    width:100%;
    min-width:0;
}


/* =====================================================
   05. VISUEL HERO — ORBIT
====================================================== */

.solutions-orbit{
    position:relative;
    width:min(560px, 100%);
    min-height:590px;
    margin-left:auto;
    border-radius:40px;
    background:
        radial-gradient(circle at 50% 50%, rgba(121,88,255,.18), transparent 42%),
        rgba(255,255,255,.08);
    border:1px solid rgba(255,255,255,.15);
    box-shadow:0 34px 100px rgba(0,0,0,.34);
    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);
    overflow:hidden;
}

.solutions-orbit::before{
    content:"";
    position:absolute;
    inset:74px;
    border-radius:999px;
    border:1px solid rgba(255,255,255,.14);
}

.solutions-orbit::after{
    content:"";
    position:absolute;
    inset:130px;
    border-radius:999px;
    border:1px dashed rgba(255,255,255,.18);
    animation:solutionsOrbitRotate 22s linear infinite;
}

@keyframes solutionsOrbitRotate{
    from{ transform:rotate(0deg); }
    to{ transform:rotate(360deg); }
}

.solutions-orbit__center{
    position:absolute;
    z-index:3;
    top:50%;
    left:50%;
    transform:translate(-50%, -50%);
    width:180px;
    height:180px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-align:center;
    border-radius:50%;
    background:linear-gradient(135deg, var(--solutions-black), var(--solutions-blue-dark));
    border:1px solid rgba(255,255,255,.16);
    box-shadow:0 28px 80px rgba(1,10,31,.42);
}

.solutions-orbit__center span{
    display:block;
    margin-bottom:8px;
    color:#fff;
    font-size:25px;
    line-height:1;
    font-weight:950;
    letter-spacing:-.04em;
}

.solutions-orbit__center strong{
    display:block;
    color:rgba(255,255,255,.70);
    font-size:12px;
    line-height:1;
    font-weight:850;
    text-transform:uppercase;
    letter-spacing:.08em;
}

.solutions-orbit__card{
    position:absolute;
    z-index:4;
    width:235px;
    min-height:150px;
    padding:20px;
    border-radius:24px;
    background:linear-gradient(135deg, rgba(1,10,31,.92), rgba(15,47,70,.92));
    border:1px solid rgba(255,255,255,.18);
    box-shadow:0 24px 70px rgba(1,10,31,.24);
    color:#fff;
}

.solutions-orbit__card--kyo{
    top:58px;
    left:42px;
}

.solutions-orbit__card--kyovalt{
    top:246px;
    right:34px;
}

.solutions-orbit__card--aliias{
    bottom:60px;
    left:72px;
}

.solutions-orbit__card span{
    display:flex;
    align-items:center;
    justify-content:center;
    width:42px;
    height:42px;
    margin-bottom:14px;
    border-radius:15px;
    background:linear-gradient(135deg, var(--solutions-purple), var(--solutions-cyan));
    color:#fff;
    font-size:13px;
    line-height:1;
    font-weight:950;
}

.solutions-orbit__logo{
    display:block;
    width:auto;
    max-width:165px;
    height:auto;
    max-height:42px;
    margin:0 0 12px;
    object-fit:contain;
}

.solutions-orbit__logo--kyo{
    max-width:175px;
    max-height:44px;
}

.solutions-orbit__logo--kyovalt{
    max-width:165px;
    max-height:42px;
}

.solutions-orbit__logo--aliias{
    max-width:170px;
    max-height:44px;
}

.solutions-orbit__card strong{
    display:block;
    margin-bottom:8px;
    color:#fff;
    font-size:20px;
    line-height:1.12;
    letter-spacing:-.03em;
    font-weight:950;
}

.solutions-orbit__card small{
    display:block;
    color:rgba(255,255,255,.76);
    font-size:13px;
    line-height:1.35;
    font-weight:800;
}


/* =====================================================
   06. SECTIONS GÉNÉRIQUES
====================================================== */

.solutions-why,
.solutions-comparison,
.solution-focus,
.solutions-choice,
.solutions-advantage{
    position:relative;
    padding:120px 48px;
    overflow:hidden;
}

.solutions-why,
.solutions-choice{
    background:var(--solutions-grey);
}

.solutions-comparison,
.solution-focus,
.solutions-advantage{
    background:var(--solutions-white);
}

.solutions-why::before,
.solutions-comparison::before,
.solution-focus::before,
.solutions-choice::before,
.solutions-advantage::before{
    content:"";
    position:absolute;
    top:-180px;
    right:-180px;
    width:460px;
    height:460px;
    border-radius:999px;
    background:radial-gradient(circle, rgba(121,88,255,.12), transparent 68%);
    pointer-events:none;
}

.solutions-why::after,
.solutions-comparison::after,
.solution-focus::after,
.solutions-choice::after,
.solutions-advantage::after{
    content:"";
    position:absolute;
    bottom:-220px;
    left:-180px;
    width:500px;
    height:500px;
    border-radius:999px;
    background:radial-gradient(circle, rgba(64,146,255,.10), transparent 68%);
    pointer-events:none;
}


/* =====================================================
   07. POURQUOI TROIS SOLUTIONS
====================================================== */

.solutions-why__grid{
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:22px;
}

.solutions-why-card{
    position:relative;
    min-height:260px;
    padding:32px 28px;
    border-radius:30px;
    background:#fff;
    border:1px solid var(--solutions-border);
    box-shadow:var(--solutions-shadow-card);
    overflow:hidden;
    transition:
        transform .28s ease,
        box-shadow .28s ease,
        border-color .28s ease;
}

.solutions-why-card:hover{
    transform:translateY(-6px);
    box-shadow:0 30px 80px rgba(16,24,40,.12);
    border-color:rgba(121,88,255,.25);
}

.solutions-why-card::before{
    content:"";
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:5px;
    background:linear-gradient(90deg, var(--solutions-purple), var(--solutions-cyan), var(--solutions-orange));
}

.solutions-why-card > span{
    width:54px;
    height:54px;
    display:flex;
    align-items:center;
    justify-content:center;
    margin-bottom:24px;
    border-radius:18px;
    background:linear-gradient(135deg, var(--solutions-purple), var(--solutions-cyan));
    color:#fff;
    font-size:15px;
    line-height:1;
    font-weight:950;
}

.solutions-why-card h3{
    margin:0 0 14px;
    color:var(--solutions-black);
    font-size:24px;
    line-height:1.15;
    letter-spacing:-.03em;
    font-weight:950;
}

.solutions-why-card p{
    margin:0;
    color:var(--solutions-text-soft);
    font-size:15.5px;
    line-height:1.62;
}


/* =====================================================
   08. COMPARATIF DES TROIS PRODUITS
====================================================== */

.solutions-comparison__grid{
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:24px;
}

.solutions-comparison-card{
    position:relative;
    min-height:560px;
    padding:34px 28px 30px;
    border-radius:34px;
    background:#fff;
    border:1px solid var(--solutions-border);
    box-shadow:var(--solutions-shadow-card);
    overflow:hidden;
    display:flex;
    flex-direction:column;
    transition:
        transform .28s ease,
        box-shadow .28s ease,
        border-color .28s ease;
}

.solutions-comparison-card:hover{
    transform:translateY(-7px);
    box-shadow:0 34px 90px rgba(16,24,40,.14);
}

.solutions-comparison-card::before{
    content:"";
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:6px;
}

.solutions-comparison-card--kyo::before{
    background:linear-gradient(90deg, var(--solutions-purple), var(--solutions-cyan));
}

.solutions-comparison-card--kyovalt::before{
    background:linear-gradient(90deg, var(--solutions-cyan), var(--solutions-blue-light));
}

.solutions-comparison-card--aliias::before{
    background:linear-gradient(90deg, var(--solutions-orange), var(--solutions-terracotta));
}

.solutions-comparison-card__header{
    margin-bottom:22px;
}

.solutions-comparison-card__header span{
    display:inline-flex;
    margin-bottom:16px;
    padding:9px 13px;
    border-radius:999px;
    background:rgba(121,88,255,.10);
    color:var(--solutions-purple-dark);
    font-size:12px;
    line-height:1;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:.07em;
}

.solutions-comparison-card--kyovalt .solutions-comparison-card__header span{
    background:rgba(64,146,255,.10);
    color:var(--solutions-blue);
}

.solutions-comparison-card--aliias .solutions-comparison-card__header span{
    background:rgba(246,144,61,.13);
    color:var(--solutions-terracotta);
}

.solutions-comparison-card h3{
    margin:0;
    color:var(--solutions-black);
    font-size:36px;
    line-height:1.04;
    letter-spacing:-.05em;
    font-weight:950;
}

.solutions-comparison-card p{
    margin:0 0 26px;
    color:var(--solutions-text-soft);
    font-size:16.5px;
    line-height:1.65;
}

.solutions-comparison-card ul{
    display:grid;
    gap:12px;
    margin:0 0 34px;
    padding:0;
    list-style:none;
}

.solutions-comparison-card li{
    position:relative;
    padding-left:26px;
    color:var(--solutions-text);
    font-size:15px;
    line-height:1.5;
    font-weight:750;
}

.solutions-comparison-card li::before{
    content:"";
    position:absolute;
    left:0;
    top:.55em;
    width:10px;
    height:10px;
    border-radius:999px;
    background:linear-gradient(135deg, var(--solutions-purple), var(--solutions-cyan));
}

.solutions-comparison-card--kyovalt li::before{
    background:linear-gradient(135deg, var(--solutions-cyan), var(--solutions-blue-light));
}

.solutions-comparison-card--aliias li::before{
    background:linear-gradient(135deg, var(--solutions-orange), var(--solutions-terracotta));
}

.solutions-comparison-card > a{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    margin-top:auto;
    min-height:50px;
    padding:15px 20px;
    border-radius:999px;
    background:var(--solutions-black);
    color:#fff;
    font-size:15px;
    line-height:1;
    font-weight:900;
    transition:
        transform .25s ease,
        box-shadow .25s ease,
        background .25s ease;
}

.solutions-comparison-card > a:hover{
    transform:translateY(-2px);
    color:#fff;
    background:linear-gradient(135deg, var(--solutions-purple), var(--solutions-cyan));
    box-shadow:0 18px 38px rgba(121,88,255,.28);
}


/* =====================================================
   09. FOCUS PRODUIT + CAS D’USAGE
====================================================== */

.solution-focus{
    padding-top:132px;
    padding-bottom:132px;
}

.solution-focus--kyo{
    background:#fff;
}

.solution-focus--kyovalt{
    background:var(--solutions-grey);
}

.solution-focus--aliias{
    background:#fff;
}

.solution-focus__layout{
    display:grid;
    grid-template-columns:minmax(0, .95fr) minmax(420px, 1.05fr);
    gap:72px;
    align-items:center;
}

.solution-focus__layout--reverse{
    direction:rtl;
}

.solution-focus__layout--reverse > *{
    direction:ltr;
}

.solution-focus__content{
    max-width:720px;
}

.solution-focus__content h2{
    color:var(--solutions-black);
}

.solution-focus__tags{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    margin:30px 0 34px;
}

.solution-focus__tags span{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:36px;
    padding:10px 14px;
    border-radius:999px;
    background:rgba(121,88,255,.10);
    border:1px solid rgba(121,88,255,.14);
    color:var(--solutions-purple-dark);
    font-size:13px;
    line-height:1;
    font-weight:850;
}

.solution-focus--kyovalt .solution-focus__tags span{
    background:rgba(64,146,255,.10);
    border-color:rgba(64,146,255,.14);
    color:var(--solutions-blue);
}

.solution-focus--aliias .solution-focus__tags span{
    background:rgba(246,144,61,.13);
    border-color:rgba(246,144,61,.18);
    color:var(--solutions-terracotta);
}

.solution-usecase-card{
    position:relative;
    min-height:520px;
    padding:38px 34px;
    border-radius:36px;
    background:linear-gradient(135deg, var(--solutions-black), var(--solutions-blue-dark));
    color:#fff;
    box-shadow:var(--solutions-shadow-strong);
    overflow:hidden;
}

.solution-focus--kyovalt .solution-usecase-card{
    background:linear-gradient(135deg, var(--solutions-blue-dark), var(--solutions-blue));
}

.solution-focus--aliias .solution-usecase-card{
    background:linear-gradient(135deg, var(--solutions-black), #32160d);
}

.solution-usecase-card::before{
    content:"";
    position:absolute;
    top:-120px;
    right:-110px;
    width:320px;
    height:320px;
    border-radius:999px;
    background:radial-gradient(circle, rgba(121,88,255,.28), transparent 68%);
}

.solution-usecase-card::after{
    content:"";
    position:absolute;
    bottom:-150px;
    left:-110px;
    width:340px;
    height:340px;
    border-radius:999px;
    background:radial-gradient(circle, rgba(64,146,255,.24), transparent 68%);
}

.solution-usecase-card__label,
.solution-usecase-card h3,
.solution-usecase-card p,
.solution-usecase-card__advantage{
    position:relative;
    z-index:2;
}

.solution-usecase-card__label{
    display:inline-flex;
    margin-bottom:22px;
    padding:9px 13px;
    border-radius:999px;
    background:rgba(255,255,255,.12);
    border:1px solid rgba(255,255,255,.16);
    color:#DCD3FF;
    font-size:12px;
    line-height:1;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:.07em;
}

.solution-focus--aliias .solution-usecase-card__label{
    color:#FFE2CC;
}

.solution-usecase-card h3{
    margin:0 0 22px;
    color:#fff;
    font-size:clamp(30px, 3.5vw, 46px);
    line-height:1.04;
    letter-spacing:-.05em;
    font-weight:950;
}

.solution-usecase-card p{
    margin:0 0 30px;
    color:rgba(255,255,255,.84);
    font-size:17px;
    line-height:1.68;
}

.solution-usecase-card__advantage{
    padding:24px;
    border-radius:24px;
    background:rgba(255,255,255,.10);
    border:1px solid rgba(255,255,255,.14);
    backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);
}

.solution-usecase-card__advantage strong{
    display:block;
    margin-bottom:10px;
    color:#fff;
    font-size:16px;
    line-height:1;
    font-weight:950;
    text-transform:uppercase;
    letter-spacing:.065em;
}

.solution-usecase-card__advantage span{
    display:block;
    color:rgba(255,255,255,.78);
    font-size:15.5px;
    line-height:1.62;
}


/* =====================================================
   10. GUIDE DE CHOIX
====================================================== */

.solutions-choice__grid{
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:24px;
}

.solutions-choice-card{
    position:relative;
    min-height:330px;
    padding:34px 28px;
    border-radius:32px;
    background:#fff;
    border:1px solid var(--solutions-border);
    box-shadow:var(--solutions-shadow-card);
    overflow:hidden;
    display:flex;
    flex-direction:column;
    transition:
        transform .28s ease,
        box-shadow .28s ease,
        border-color .28s ease;
}

.solutions-choice-card:hover{
    transform:translateY(-6px);
    box-shadow:0 30px 80px rgba(16,24,40,.12);
    border-color:rgba(121,88,255,.25);
}

.solutions-choice-card::before{
    content:"";
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:5px;
    background:linear-gradient(90deg, var(--solutions-purple), var(--solutions-cyan), var(--solutions-orange));
}

.solutions-choice-card > span{
    display:inline-flex;
    margin-bottom:20px;
    color:var(--solutions-orange);
    font-size:13px;
    line-height:1.35;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:.075em;
}

.solutions-choice-card h3{
    margin:0 0 14px;
    color:var(--solutions-black);
    font-size:30px;
    line-height:1.08;
    letter-spacing:-.045em;
    font-weight:950;
}

.solutions-choice-card p{
    margin:0 0 28px;
    color:var(--solutions-text-soft);
    font-size:16px;
    line-height:1.62;
}

.solutions-choice-card a{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    margin-top:auto;
    min-height:46px;
    padding:14px 18px;
    border-radius:999px;
    background:rgba(121,88,255,.10);
    color:var(--solutions-purple-dark);
    font-size:14px;
    line-height:1;
    font-weight:900;
    transition:
        transform .25s ease,
        background .25s ease,
        color .25s ease;
}

.solutions-choice-card a:hover{
    transform:translateY(-2px);
    background:var(--solutions-black);
    color:#fff;
}


/* =====================================================
   11. AVANTAGE RESOCOM
====================================================== */

.solutions-advantage__layout{
    display:grid;
    grid-template-columns:minmax(0, .95fr) minmax(420px, 1.05fr);
    gap:72px;
    align-items:center;
}

.solutions-advantage__content{
    max-width:720px;
}

.solutions-advantage__grid{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:18px;
}

.solutions-advantage__grid article{
    position:relative;
    min-height:190px;
    padding:28px 24px;
    border-radius:28px;
    background:#fff;
    border:1px solid var(--solutions-border);
    box-shadow:var(--solutions-shadow-card);
    overflow:hidden;
    transition:
        transform .28s ease,
        box-shadow .28s ease,
        border-color .28s ease;
}

.solutions-advantage__grid article:hover{
    transform:translateY(-5px);
    box-shadow:0 26px 70px rgba(16,24,40,.12);
    border-color:rgba(121,88,255,.25);
}

.solutions-advantage__grid article::before{
    content:"";
    position:absolute;
    top:-80px;
    right:-80px;
    width:160px;
    height:160px;
    border-radius:999px;
    background:radial-gradient(circle, rgba(121,88,255,.14), transparent 66%);
}

.solutions-advantage__grid strong{
    position:relative;
    z-index:2;
    display:block;
    margin-bottom:12px;
    color:var(--solutions-black);
    font-size:22px;
    line-height:1.1;
    letter-spacing:-.035em;
    font-weight:950;
}

.solutions-advantage__grid span{
    position:relative;
    z-index:2;
    display:block;
    color:var(--solutions-text-soft);
    font-size:15px;
    line-height:1.58;
}


/* =====================================================
   12. CTA FINAL
====================================================== */

.solutions-final-cta{
    position:relative;
    padding:120px 48px;
    background:var(--solutions-black);
    color:#fff;
    overflow:hidden;
}

.solutions-final-cta::before,
.solutions-final-cta::after{
    content:"";
    position:absolute;
    border-radius:999px;
    pointer-events:none;
}

.solutions-final-cta::before{
    top:-180px;
    right:-160px;
    width:460px;
    height:460px;
    background:radial-gradient(circle, rgba(121,88,255,.24), transparent 68%);
}

.solutions-final-cta::after{
    bottom:-220px;
    left:-170px;
    width:500px;
    height:500px;
    background:radial-gradient(circle, rgba(64,146,255,.20), transparent 68%);
}

.solutions-final-cta__container{
    position:relative;
    z-index:2;
    max-width:980px;
    margin:0 auto;
    text-align:center;
}

.solutions-final-cta .solutions-eyebrow{
    color:#DCD3FF;
}

.solutions-final-cta h2{
    color:#fff;
}

.solutions-final-cta p{
    max-width:760px;
    margin:0 auto 34px;
    color:rgba(255,255,255,.84);
}

.solutions-final-cta__actions{
    display:flex;
    justify-content:center;
    flex-wrap:wrap;
    gap:14px;
}


/* =====================================================
   13. REVEAL / HALO SOURIS
====================================================== */

.solutions-reveal{
    opacity:0;
    transform:translateY(34px);
    transition:
        opacity .85s ease,
        transform .85s cubic-bezier(.22, 1, .36, 1);
    will-change:opacity, transform;
}

.solutions-reveal.is-visible{
    opacity:1;
    transform:translateY(0);
}

.solutions-reveal--card{
    transform:translateY(42px) scale(.985);
}

.solutions-reveal--card.is-visible{
    transform:translateY(0) scale(1);
}

.solutions-reveal[data-reveal-delay="1"]{ transition-delay:.08s; }
.solutions-reveal[data-reveal-delay="2"]{ transition-delay:.16s; }
.solutions-reveal[data-reveal-delay="3"]{ transition-delay:.24s; }
.solutions-reveal[data-reveal-delay="4"]{ transition-delay:.32s; }
.solutions-reveal[data-reveal-delay="5"]{ transition-delay:.40s; }
.solutions-reveal[data-reveal-delay="6"]{ transition-delay:.48s; }

.solutions-why-card,
.solutions-comparison-card,
.solution-usecase-card,
.solutions-choice-card,
.solutions-advantage__grid article{
    position:relative;
}

.solutions-why-card::after,
.solutions-comparison-card::after,
.solution-usecase-card::after,
.solutions-choice-card::after,
.solutions-advantage__grid article::after{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    opacity:0;
    background:radial-gradient(
        circle at var(--solutions-card-x, 50%) var(--solutions-card-y, 50%),
        rgba(121,88,255,.12),
        rgba(64,146,255,.08) 28%,
        transparent 58%
    );
    transition:opacity .28s ease;
}

.solutions-why-card:hover::after,
.solutions-comparison-card:hover::after,
.solution-usecase-card:hover::after,
.solutions-choice-card:hover::after,
.solutions-advantage__grid article:hover::after{
    opacity:1;
}

.solutions-hero__content,
.solutions-hero__visual{
    transition:transform .12s linear;
    will-change:transform;
}


/* =====================================================
   14. RESPONSIVE
====================================================== */

@media(max-width:1180px){

    .solutions-hero__container{
        grid-template-columns:1fr;
        gap:48px;
        min-height:auto;
        padding-top:76px;
        padding-bottom:92px;
    }

    .solutions-hero__content{
        max-width:980px;
    }

    .solutions-orbit{
        margin-left:0;
    }

    .solutions-why__grid,
    .solutions-comparison__grid,
    .solutions-choice__grid{
        grid-template-columns:repeat(2, minmax(0, 1fr));
    }

    .solution-focus__layout,
    .solutions-advantage__layout{
        grid-template-columns:1fr;
        gap:48px;
    }

    .solution-focus__layout--reverse{
        direction:ltr;
    }

    .solution-focus__content,
    .solutions-advantage__content{
        max-width:880px;
    }
}

@media(max-width:980px){

    .solutions-why,
    .solutions-comparison,
    .solution-focus,
    .solutions-choice,
    .solutions-advantage,
    .solutions-final-cta{
        padding:92px 34px;
    }

    .solutions-section__intro,
    .solutions-section__intro--center{
        text-align:left;
        margin-left:0;
        margin-right:0;
        margin-bottom:46px;
    }

    .solutions-comparison-card{
        min-height:auto;
    }

    .solutions-advantage__grid{
        grid-template-columns:1fr;
    }
}

@media(max-width:760px){

    .solutions-sticky-cta{
        left:14px;
        right:14px;
        bottom:14px;
        transform:translateY(24px);
        width:auto;
        justify-content:space-between;
        border-radius:22px;
        padding:12px;
    }

    .solutions-sticky-cta.is-visible{
        transform:translateY(0);
    }

    .solutions-sticky-cta > span{
        display:none;
    }

    .solutions-sticky-cta__actions{
        width:100%;
        display:grid;
        grid-template-columns:1fr 1fr;
        gap:8px;
    }

    .solutions-sticky-cta__actions a{
        width:100%;
        min-height:42px;
        padding:12px 10px;
        font-size:12.5px;
        text-align:center;
    }
}

@media(max-width:700px){

    html,
    body{
        overflow-x:hidden !important;
    }

    .nos-solutions-page{
        max-width:100vw;
        overflow-x:hidden !important;
    }

    .solutions-hero{
        min-height:auto;
    }

    .solutions-hero__container{
        min-height:auto;
        padding:54px 22px 76px;
        gap:32px;
    }

    .solutions-hero__badge{
        font-size:12px;
        padding:8px 13px;
        margin-bottom:18px;
    }

    .solutions-hero h1{
        font-size:36px;
        line-height:1.06;
        letter-spacing:-.04em;
    }

    .solutions-hero p{
        font-size:16px;
        line-height:1.6;
        margin-bottom:26px;
    }

    .solutions-hero__formula{
        grid-template-columns:1fr;
        gap:8px;
    }

    .solutions-hero__formula div{
        display:flex;
        align-items:center;
        justify-content:space-between;
        gap:14px;
        padding:14px;
        border-radius:16px;
    }

    .solutions-hero__formula strong{
        margin-bottom:0;
    }

    .solutions-hero__actions,
    .solutions-hero__actions .solutions-btn,
    .solution-focus__actions,
    .solution-focus__actions .solutions-btn,
    .solutions-final-cta__actions,
    .solutions-final-cta__actions .solutions-btn{
        width:100%;
    }

    .solutions-orbit{
        min-height:auto;
        padding:18px;
        display:grid;
        gap:14px;
        border-radius:28px;
    }

    .solutions-orbit::before,
    .solutions-orbit::after{
        display:none;
    }

    .solutions-orbit__center,
    .solutions-orbit__card,
    .solutions-orbit__card--kyo,
    .solutions-orbit__card--kyovalt,
    .solutions-orbit__card--aliias{
        position:relative;
        top:auto;
        right:auto;
        bottom:auto;
        left:auto;
        transform:none;
        width:100%;
        height:auto;
        min-height:auto;
        border-radius:22px;
    }

    .solutions-orbit__center{
        padding:26px 18px;
    }

    .solutions-orbit__card{
        padding:18px;
    }

    .solutions-why,
    .solutions-comparison,
    .solution-focus,
    .solutions-choice,
    .solutions-advantage,
    .solutions-final-cta{
        padding:82px 22px;
    }

    .solutions-section__intro h2,
    .solution-focus__content h2,
    .solutions-advantage__content h2,
    .solutions-final-cta h2{
        font-size:34px;
    }

    .solutions-section__intro p,
    .solution-focus__content p,
    .solutions-advantage__content p,
    .solutions-final-cta p{
        font-size:16.5px;
        line-height:1.65;
    }

    .solutions-why__grid,
    .solutions-comparison__grid,
    .solutions-choice__grid{
        grid-template-columns:1fr;
        gap:18px;
    }

    .solutions-why-card,
    .solutions-comparison-card,
    .solutions-choice-card,
    .solutions-advantage__grid article{
        min-height:auto;
        padding:28px 22px;
        border-radius:24px;
    }

    .solutions-comparison-card h3{
        font-size:32px;
    }

    .solution-usecase-card{
        min-height:auto;
        padding:30px 24px;
        border-radius:28px;
    }

    .solution-usecase-card h3{
        font-size:30px;
    }

    .solutions-hero__overlay::before{
        top:18%;
        width:105%;
        height:1px;
        opacity:.34;
        animation-duration:10.5s;
    }

    .solutions-hero__overlay::after{
        top:10%;
        width:110%;
        height:80px;
        opacity:.36;
        animation-duration:10.5s;
    }

    .solutions-reveal,
    .solutions-reveal--card{
        transform:translateY(20px);
        transition-duration:.65s;
    }

    .solutions-reveal[data-reveal-delay]{
        transition-delay:0s;
    }
}

@media(max-width:390px){

    .solutions-hero h1,
    .solutions-section__intro h2,
    .solution-focus__content h2,
    .solutions-advantage__content h2,
    .solutions-final-cta h2{
        font-size:30px;
    }

    .solutions-hero__container{
        padding-left:20px;
        padding-right:20px;
    }

    .solutions-sticky-cta__actions{
        grid-template-columns:1fr;
    }
}


/* =====================================================
   15. ACCESSIBILITÉ — MOTION REDUCED
====================================================== */

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

    .nos-solutions-page *,
    .nos-solutions-page *::before,
    .nos-solutions-page *::after{
        animation:none !important;
        transition:none !important;
    }

    .solutions-reveal,
    .solutions-reveal--card{
        opacity:1 !important;
        transform:none !important;
    }

    .solutions-scroll-progress__bar,
    .solutions-sticky-cta,
    .solutions-hero__content,
    .solutions-hero__visual{
        transition:none !important;
        transform:none !important;
    }
}
