/* =====================================================
   KYOVALT — PAGE PRODUIT
   Fichier : assets/css/kyovalt.css
   Thème enfant Astra
====================================================== */


/* =====================================================
   01. VARIABLES
====================================================== */

:root{
    --kyo-orange:#F6903D;
    --kyo-terracotta:#BE3F23;
    --kyo-blue-light:#62A3C4;
    --kyo-blue:#16486B;
    --kyo-blue-dark:#0F2F46;
    --kyo-black:#010A1F;
    --kyo-grey:#F3F3F3;
    --kyo-grey-medium:#C9C9C9;
    --kyo-white:#ffffff;

    --kyo-text:#010A1F;
    --kyo-text-soft:#475467;
    --kyo-border:rgba(1,10,31,.08);

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

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


/* =====================================================
   02. RESET ASTRA — PAGE KYOVALT
====================================================== */

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

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

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

.page .kyovalt-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;
}


/* =====================================================
   03. COMPOSANTS COMMUNS
====================================================== */

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

.kyovalt-section__intro{
    max-width:860px;
    margin:0 0 62px;
}

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

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

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

.kyovalt-section__intro p,
.kyovalt-usecases__content p,
.kyovalt-final-cta p{
    margin:0;
    color:var(--kyo-text-soft);
    font-size:19px;
    line-height:1.72;
}

.kyovalt-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;
}

.kyovalt-btn--primary{
    background:var(--kyo-orange);
    color:var(--kyo-white);
    box-shadow:0 18px 38px rgba(246,144,61,.30);
}

.kyovalt-btn--primary:hover{
    transform:translateY(-2px);
    background:var(--kyo-terracotta);
    color:var(--kyo-white);
    box-shadow:0 24px 46px rgba(190,63,35,.32);
}

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

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


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

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

.kyovalt-hero__background{
    position:absolute;
    inset:0;
    background:
        radial-gradient(circle at 14% 22%, rgba(98,163,196,.26), transparent 34%),
        radial-gradient(circle at 88% 80%, rgba(246,144,61,.22), transparent 32%),
        linear-gradient(135deg, var(--kyo-black) 0%, var(--kyo-blue-dark) 52%, #07182a 100%);
    transform:scale(1.02);
}

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

/* Faisceau lumineux premium */
.kyovalt-hero__overlay::before{
    content:"";
    position:absolute;
    top:24%;
    left:-75%;
    width:90%;
    height:2px;
    background:linear-gradient(
        90deg,
        transparent 0%,
        rgba(98,163,196,0) 12%,
        rgba(98,163,196,.65) 42%,
        rgba(246,144,61,.72) 58%,
        rgba(246,144,61,0) 88%,
        transparent 100%
    );
    opacity:.56;
    filter:blur(.2px);
    transform:rotate(-13deg);
    animation:kyovaltHeroBeam 9s ease-in-out infinite;
}

.kyovalt-hero__overlay::after{
    content:"";
    position:absolute;
    top:16%;
    left:-80%;
    width:95%;
    height:120px;
    background:linear-gradient(
        90deg,
        transparent 0%,
        rgba(98,163,196,.12) 38%,
        rgba(246,144,61,.14) 58%,
        transparent 100%
    );
    opacity:.60;
    filter:blur(38px);
    transform:rotate(-13deg);
    animation:kyovaltHeroHalo 9s ease-in-out infinite;
}

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

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

.kyovalt-hero__container{
    position:relative;
    z-index:3;
    width:100%;
    max-width:var(--kyo-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, .95fr) minmax(420px, 1.05fr);
    gap:clamp(42px, 5vw, 76px);
    align-items:center;
}

.kyovalt-hero__content{
    max-width:720px;
}

.kyovalt-hero__badge{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    margin-bottom:22px;
    padding:9px 18px;
    border-radius:999px;
    background:rgba(255,255,255,.12);
    border:1px solid rgba(255,255,255,.18);
    color:var(--kyo-white);
    font-size:13px;
    font-weight:850;
    letter-spacing:.02em;
    backdrop-filter:blur(14px);
    -webkit-backdrop-filter:blur(14px);
}

.kyovalt-hero h1{
    margin:0 0 24px;
    color:var(--kyo-white);
    font-size:clamp(42px, 5vw, 66px);
    line-height:1.02;
    letter-spacing:-.055em;
    font-weight:950;
}

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

.kyovalt-hero__actions{
    display:flex;
    flex-wrap:wrap;
    gap:14px;
    margin-bottom:28px;
}

.kyovalt-hero__proofs{
    display:flex;
    flex-wrap:wrap;
    gap:12px;
}

.kyovalt-hero__proof{
    display:flex;
    align-items:center;
    gap:9px;
    min-height:42px;
    padding:9px 14px;
    border-radius:999px;
    background:rgba(255,255,255,.10);
    border:1px solid rgba(255,255,255,.15);
    color:rgba(255,255,255,.84);
    backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);
}

.kyovalt-hero__proof strong{
    color:var(--kyo-orange);
    font-size:17px;
    line-height:1;
    font-weight:950;
    white-space:nowrap;
}

.kyovalt-hero__proof span{
    color:rgba(255,255,255,.82);
    font-size:13.5px;
    line-height:1.2;
    font-weight:750;
}

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


/* =====================================================
   05. VISUEL PRODUIT HERO
====================================================== */

.kyovalt-product-card{
    position:relative;
    width:100%;
    padding:22px;
    border-radius:34px;
    background:rgba(255,255,255,.88);
    border:1px solid rgba(255,255,255,.22);
    box-shadow:0 34px 100px rgba(0,0,0,.32);
    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);
    overflow:hidden;
}

.kyovalt-product-card::before{
    content:"";
    position:absolute;
    top:-90px;
    right:-80px;
    width:240px;
    height:240px;
    border-radius:999px;
    background:radial-gradient(circle, rgba(246,144,61,.22), transparent 66%);
    pointer-events:none;
}

.kyovalt-product-card::after{
    content:"";
    position:absolute;
    bottom:-110px;
    left:-90px;
    width:270px;
    height:270px;
    border-radius:999px;
    background:radial-gradient(circle, rgba(98,163,196,.24), transparent 68%);
    pointer-events:none;
}

.kyovalt-product-card__top{
    position:relative;
    z-index:2;
    display:flex;
    align-items:center;
    gap:8px;
    margin-bottom:20px;
}

.kyovalt-product-card__top span{
    width:10px;
    height:10px;
    border-radius:999px;
    background:rgba(1,10,31,.22);
}

.kyovalt-product-card__header{
    position:relative;
    z-index:2;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
    margin-bottom:26px;
    padding:22px;
    border-radius:24px;
    background:linear-gradient(135deg, var(--kyo-blue-dark), var(--kyo-blue));
    color:var(--kyo-white);
}

.kyovalt-product-card__header small,
.kyovalt-product-card__footer small,
.kyovalt-product-step small{
    display:block;
    font-size:12px;
    line-height:1.2;
    font-weight:750;
    color:rgba(255,255,255,.66);
}

.kyovalt-product-card__header strong{
    display:block;
    margin-top:6px;
    font-size:22px;
    line-height:1.1;
    font-weight:950;
    letter-spacing:-.03em;
}

.kyovalt-product-card__status{
    flex:0 0 auto;
    padding:8px 12px;
    border-radius:999px;
    background:rgba(246,144,61,.16);
    border:1px solid rgba(246,144,61,.28);
    color:#fff;
    font-size:12px;
    font-weight:900;
}

.kyovalt-product-card__steps{
    position:relative;
    z-index:2;
    display:grid;
    gap:14px;
    margin-bottom:22px;
}

.kyovalt-product-step{
    display:flex;
    align-items:center;
    gap:15px;
    padding:16px;
    border-radius:20px;
    background:rgba(255,255,255,.72);
    border:1px solid rgba(1,10,31,.08);
    box-shadow:0 12px 30px rgba(1,10,31,.05);
}

.kyovalt-product-step.is-active{
    background:rgba(246,144,61,.12);
    border-color:rgba(246,144,61,.28);
}

.kyovalt-product-step > span{
    width:42px;
    height:42px;
    flex:0 0 42px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:14px;
    background:var(--kyo-blue-dark);
    color:var(--kyo-white);
    font-size:13px;
    font-weight:950;
}

.kyovalt-product-step.is-active > span{
    background:var(--kyo-orange);
}

.kyovalt-product-step strong{
    display:block;
    color:var(--kyo-black);
    font-size:17px;
    line-height:1.15;
    font-weight:900;
}

.kyovalt-product-step small{
    margin-top:5px;
    color:var(--kyo-text-soft);
}

.kyovalt-product-card__footer{
    position:relative;
    z-index:2;
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:12px;
}

.kyovalt-product-card__footer > div{
    padding:16px;
    border-radius:18px;
    background:var(--kyo-grey);
    border:1px solid rgba(1,10,31,.06);
}

.kyovalt-product-card__footer small{
    color:#667085;
}

.kyovalt-product-card__footer strong{
    display:block;
    margin-top:6px;
    color:var(--kyo-black);
    font-size:15px;
    line-height:1.2;
    font-weight:900;
}


/* =====================================================
   06. PROBLÈME
====================================================== */

.kyovalt-problem{
    position:relative;
    padding:120px 48px;
    background:var(--kyo-white);
    overflow:hidden;
}

.kyovalt-problem::before{
    content:"";
    position:absolute;
    top:-180px;
    right:-180px;
    width:440px;
    height:440px;
    border-radius:999px;
    background:radial-gradient(circle, rgba(98,163,196,.13), transparent 68%);
    pointer-events:none;
}

.kyovalt-problem__grid{
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:28px;
}

.kyovalt-problem-card{
    position:relative;
    min-height:260px;
    padding:34px 30px;
    border-radius:28px;
    background:var(--kyo-grey);
    border:1px solid var(--kyo-border);
    box-shadow:var(--kyo-shadow-card);
    overflow:hidden;
    transition:transform .28s ease, box-shadow .28s ease, border-color .28s ease;
}

.kyovalt-problem-card::before{
    content:"";
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:5px;
    background:linear-gradient(90deg, var(--kyo-orange), var(--kyo-terracotta), var(--kyo-blue-light));
}

.kyovalt-problem-card:hover{
    transform:translateY(-6px);
    box-shadow:0 30px 80px rgba(1,10,31,.12);
    border-color:rgba(22,72,107,.22);
}

.kyovalt-problem-card h3{
    margin:0 0 16px;
    color:var(--kyo-black);
    font-size:25px;
    line-height:1.12;
    letter-spacing:-.03em;
    font-weight:950;
}

.kyovalt-problem-card p{
    margin:0;
    color:var(--kyo-text-soft);
    font-size:16px;
    line-height:1.65;
}


/* =====================================================
   07. FONCTIONNALITÉS
====================================================== */

.kyovalt-features{
    position:relative;
    padding:120px 48px;
    background:var(--kyo-grey);
    overflow:hidden;
}

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

.kyovalt-features::before{
    top:-190px;
    left:-160px;
    width:460px;
    height:460px;
    background:radial-gradient(circle, rgba(246,144,61,.13), transparent 68%);
}

.kyovalt-features::after{
    right:-160px;
    bottom:-200px;
    width:460px;
    height:460px;
    background:radial-gradient(circle, rgba(98,163,196,.15), transparent 68%);
}

.kyovalt-features__grid{
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:28px;
    align-items:stretch;
}

.kyovalt-feature-card{
    position:relative;
    display:flex;
    flex-direction:column;
    min-height:100%;
    padding:36px 30px 32px;
    border-radius:30px;
    background:rgba(255,255,255,.88);
    border:1px solid var(--kyo-border);
    box-shadow:var(--kyo-shadow-card);
    overflow:hidden;
    transition:transform .28s ease, box-shadow .28s ease, border-color .28s ease;
}

.kyovalt-feature-card:hover{
    transform:translateY(-6px);
    box-shadow:0 30px 80px rgba(1,10,31,.12);
    border-color:rgba(246,144,61,.26);
}

.kyovalt-feature-card h3::before,
.kyovalt-benefit-card h3::before{
    content:"";
    display:block;
    width:42px;
    height:3px;
    margin-bottom:18px;
    border-radius:999px;
    background:linear-gradient(90deg, var(--kyo-orange), var(--kyo-blue-light));
}

.kyovalt-feature-card h3{
    margin:0 0 16px;
    color:var(--kyo-black);
    font-size:26px;
    line-height:1.1;
    letter-spacing:-.03em;
    font-weight:950;
}

.kyovalt-feature-card p{
    margin:0 0 24px;
    color:var(--kyo-text-soft);
    font-size:16px;
    line-height:1.65;
}

.kyovalt-feature-card ul{
    list-style:none;
    padding:0;
    margin:auto 0 0;
    display:grid;
    gap:12px;
}

.kyovalt-feature-card li{
    position:relative;
    padding-left:30px;
    color:#344054;
    font-size:15px;
    line-height:1.45;
    font-weight:700;
}

.kyovalt-feature-card li::before{
    content:"";
    position:absolute;
    left:0;
    top:.25em;
    width:20px;
    height:20px;
    border-radius:999px;
    background:#FEF3C7;
    border:1px solid var(--kyo-orange);
}

.kyovalt-feature-card li::after{
    content:"";
    position:absolute;
    left:7px;
    top:calc(.25em + 5px);
    width:6px;
    height:9px;
    border-right:2px solid #CA8A04;
    border-bottom:2px solid #CA8A04;
    transform:rotate(45deg);
}


/* =====================================================
   08. CAS D’USAGE
====================================================== */

.kyovalt-usecases{
    position:relative;
    padding:120px 48px;
    background:var(--kyo-white);
    overflow:hidden;
}

.kyovalt-usecases::before{
    content:"";
    position:absolute;
    right:-170px;
    top:90px;
    width:440px;
    height:440px;
    border-radius:999px;
    background:radial-gradient(circle, rgba(22,72,107,.10), transparent 68%);
    pointer-events:none;
}

.kyovalt-usecases__layout{
    display:grid;
    grid-template-columns:minmax(0, .92fr) minmax(0, 1.08fr);
    gap:70px;
    align-items:center;
}

.kyovalt-usecases__content{
    max-width:590px;
}

.kyovalt-usecases__list{
    display:grid;
    gap:16px;
}

.kyovalt-usecase-item{
    position:relative;
    padding:24px 26px 24px 28px;
    border-radius:24px;
    background:var(--kyo-grey);
    border:1px solid var(--kyo-border);
    box-shadow:0 14px 36px rgba(1,10,31,.05);
    overflow:hidden;
}

.kyovalt-usecase-item::before{
    content:"";
    position:absolute;
    left:0;
    top:0;
    width:5px;
    height:100%;
    background:linear-gradient(180deg, var(--kyo-orange), var(--kyo-blue-light));
}

.kyovalt-usecase-item strong{
    display:block;
    margin-bottom:8px;
    color:var(--kyo-black);
    font-size:18px;
    line-height:1.2;
    font-weight:950;
}

.kyovalt-usecase-item span{
    display:block;
    color:var(--kyo-text-soft);
    font-size:15.5px;
    line-height:1.58;
}


/* =====================================================
   09. SÉCURITÉ
====================================================== */

.kyovalt-security{
    position:relative;
    padding:120px 48px;
    background:var(--kyo-grey);
    overflow:hidden;
}

.kyovalt-security::before{
    content:"";
    position:absolute;
    left:50%;
    top:-240px;
    width:620px;
    height:620px;
    transform:translateX(-50%);
    border-radius:999px;
    background:radial-gradient(circle, rgba(98,163,196,.13), transparent 68%);
    pointer-events:none;
}

.kyovalt-security__grid{
    display:grid;
    grid-template-columns:repeat(4, minmax(0, 1fr));
    gap:22px;
}

.kyovalt-security-card{
    position:relative;
    min-height:240px;
    padding:30px 24px;
    border-radius:26px;
    background:rgba(255,255,255,.90);
    border:1px solid var(--kyo-border);
    box-shadow:var(--kyo-shadow-card);
    overflow:hidden;
    transition:transform .28s ease, box-shadow .28s ease;
}

.kyovalt-security-card:hover{
    transform:translateY(-5px);
    box-shadow:0 28px 70px rgba(1,10,31,.11);
}

.kyovalt-security-card::before{
    content:"";
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:4px;
    background:linear-gradient(90deg, var(--kyo-blue-light), var(--kyo-orange));
    opacity:.9;
}

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

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


/* =====================================================
   10. CTA FINAL
====================================================== */

.kyovalt-final-cta{
    position:relative;
    padding:120px 48px;
    background:var(--kyo-black);
    color:var(--kyo-white);
    overflow:hidden;
}

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

.kyovalt-final-cta::before{
    top:-180px;
    right:-160px;
    width:460px;
    height:460px;
    background:radial-gradient(circle, rgba(246,144,61,.18), transparent 68%);
}

.kyovalt-final-cta::after{
    bottom:-220px;
    left:-170px;
    width:500px;
    height:500px;
    background:radial-gradient(circle, rgba(98,163,196,.18), transparent 68%);
}

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

.kyovalt-final-cta .kyovalt-eyebrow{
    color:var(--kyo-orange);
}

.kyovalt-final-cta h2{
    color:var(--kyo-white);
}

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

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


/* =====================================================
   11. REVEAL ON SCROLL — KYOVALT
====================================================== */

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

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

.kyovalt-reveal--card{
    transform:translateY(38px) scale(.985);
    transition:
        opacity .85s ease,
        transform .85s cubic-bezier(.22, 1, .36, 1),
        box-shadow .3s ease,
        border-color .3s ease;
}

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

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


/* =====================================================
   12. RESPONSIVE
====================================================== */

@media(max-width:1180px){

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

    .kyovalt-hero__content{
        max-width:900px;
    }

    .kyovalt-hero__visual{
        max-width:760px;
    }

    .kyovalt-problem__grid,
    .kyovalt-features__grid{
        grid-template-columns:1fr;
        max-width:720px;
    }

    .kyovalt-security__grid{
        grid-template-columns:repeat(2, minmax(0, 1fr));
    }

    .kyovalt-usecases__layout{
        grid-template-columns:1fr;
        gap:48px;
    }

    .kyovalt-usecases__content{
        max-width:860px;
    }
}

@media(max-width:980px){

    .kyovalt-problem,
    .kyovalt-features,
    .kyovalt-usecases,
    .kyovalt-security,
    .kyovalt-final-cta{
        padding:92px 34px;
    }

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

@media(max-width:700px){

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

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

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

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

    .kyovalt-hero h1{
        font-size:34px;
        line-height:1.08;
        letter-spacing:-.04em;
    }

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

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

    .kyovalt-hero__actions{
        width:100%;
        gap:12px;
    }

    .kyovalt-btn{
        width:100%;
        min-height:50px;
        padding:14px 18px;
        font-size:15px;
    }

    .kyovalt-hero__proofs{
        flex-direction:column;
        gap:8px;
    }

    .kyovalt-hero__proof{
        width:100%;
        justify-content:space-between;
        border-radius:16px;
        padding:11px 13px;
    }

    .kyovalt-hero__proof span{
        text-align:right;
    }

    .kyovalt-product-card{
        padding:14px;
        border-radius:24px;
    }

    .kyovalt-product-card__header{
        flex-direction:column;
        align-items:flex-start;
        padding:18px;
        border-radius:20px;
    }

    .kyovalt-product-card__header strong{
        font-size:19px;
    }

    .kyovalt-product-step{
        padding:13px;
        border-radius:16px;
    }

    .kyovalt-product-step > span{
        width:36px;
        height:36px;
        flex-basis:36px;
        border-radius:12px;
    }

    .kyovalt-product-step strong{
        font-size:15.5px;
    }

    .kyovalt-product-card__footer{
        grid-template-columns:1fr;
    }

    .kyovalt-problem,
    .kyovalt-features,
    .kyovalt-usecases,
    .kyovalt-security,
    .kyovalt-final-cta{
        padding:82px 22px;
    }

    .kyovalt-section__intro h2,
    .kyovalt-usecases__content h2,
    .kyovalt-final-cta h2{
        font-size:34px;
    }

    .kyovalt-section__intro p,
    .kyovalt-usecases__content p,
    .kyovalt-final-cta p{
        font-size:16.5px;
        line-height:1.65;
    }

    .kyovalt-problem__grid,
    .kyovalt-features__grid,
    .kyovalt-security__grid{
        grid-template-columns:1fr;
        gap:18px;
    }

    .kyovalt-problem-card,
    .kyovalt-feature-card,
    .kyovalt-security-card{
        min-height:auto;
        padding:28px 22px;
        border-radius:24px;
    }

    .kyovalt-problem-card h3,
    .kyovalt-feature-card h3{
        font-size:23px;
    }

    .kyovalt-security-card h3{
        font-size:21px;
    }

    .kyovalt-usecase-item{
        padding:22px 20px 22px 24px;
        border-radius:22px;
    }

    .kyovalt-final-cta__actions{
        width:100%;
    }

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

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

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

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

@media(max-width:390px){

    .kyovalt-hero h1,
    .kyovalt-section__intro h2,
    .kyovalt-usecases__content h2,
    .kyovalt-final-cta h2{
        font-size:30px;
    }

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

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

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

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

/* =====================================================
   13. RITA — ANALYSE INTELLIGENTE
====================================================== */

.kyovalt-rita{
    position:relative;
    padding:120px 48px;
    background:var(--kyo-white);
    overflow:hidden;
}

.kyovalt-rita::before{
    content:"";
    position:absolute;
    top:-180px;
    right:-180px;
    width:460px;
    height:460px;
    border-radius:999px;
    background:radial-gradient(circle, rgba(246,144,61,.13), transparent 68%);
    pointer-events:none;
}

.kyovalt-rita::after{
    content:"";
    position:absolute;
    bottom:-220px;
    left:-180px;
    width:500px;
    height:500px;
    border-radius:999px;
    background:radial-gradient(circle, rgba(98,163,196,.14), transparent 68%);
    pointer-events:none;
}

.kyovalt-rita__layout{
    position:relative;
    z-index:2;
    display:grid;
    grid-template-columns:minmax(0, .95fr) minmax(420px, 1.05fr);
    gap:72px;
    align-items:center;
}

.kyovalt-rita__content{
    max-width:640px;
}

.kyovalt-rita__content h2{
    margin:0 0 24px;
    color:var(--kyo-black);
    font-size:clamp(36px, 4vw, 58px);
    line-height:1.08;
    letter-spacing:-.045em;
    font-weight:950;
}

.kyovalt-rita__content > p{
    margin:0 0 34px;
    color:var(--kyo-text-soft);
    font-size:18px;
    line-height:1.72;
}

.kyovalt-rita__features{
    display:grid;
    gap:18px;
    margin-bottom:34px;
}

.kyovalt-rita-feature{
    display:flex;
    align-items:flex-start;
    gap:18px;
    padding:22px;
    border-radius:24px;
    background:var(--kyo-grey);
    border:1px solid var(--kyo-border);
    box-shadow:0 14px 34px rgba(1,10,31,.045);
}

.kyovalt-rita-feature__icon{
    width:44px;
    height:44px;
    flex:0 0 44px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:15px;
    background:linear-gradient(135deg, var(--kyo-blue-dark), var(--kyo-blue));
    color:var(--kyo-white);
    font-size:13px;
    line-height:1;
    font-weight:950;
}

.kyovalt-rita-feature h3{
    margin:0 0 8px;
    color:var(--kyo-black);
    font-size:19px;
    line-height:1.2;
    font-weight:950;
    letter-spacing:-.025em;
}

.kyovalt-rita-feature p{
    margin:0;
    color:var(--kyo-text-soft);
    font-size:15.5px;
    line-height:1.62;
}

.kyovalt-rita__actions{
    display:flex;
    flex-wrap:wrap;
    gap:14px;
}

/* Bouton clair utilisable sur fond blanc */
.kyovalt-btn--light{
    background:var(--kyo-grey);
    color:var(--kyo-blue-dark);
    border:1px solid var(--kyo-border);
    box-shadow:none;
}

.kyovalt-btn--light:hover{
    transform:translateY(-2px);
    background:var(--kyo-white);
    color:var(--kyo-blue-dark);
    border-color:rgba(22,72,107,.24);
    box-shadow:0 18px 42px rgba(1,10,31,.08);
}


/* =====================================================
   RITA — CARTE RAPPORT
====================================================== */

.kyovalt-rita__visual{
    position:relative;
    min-width:0;
}

.kyovalt-rita-report{
    position:relative;
    padding:28px;
    border-radius:34px;
    background:rgba(255,255,255,.92);
    border:1px solid rgba(1,10,31,.08);
    box-shadow:0 34px 100px rgba(1,10,31,.14);
    overflow:hidden;
}

.kyovalt-rita-report::before{
    content:"";
    position:absolute;
    top:-100px;
    right:-90px;
    width:260px;
    height:260px;
    border-radius:999px;
    background:radial-gradient(circle, rgba(246,144,61,.20), transparent 66%);
    pointer-events:none;
}

.kyovalt-rita-report::after{
    content:"";
    position:absolute;
    bottom:-130px;
    left:-100px;
    width:290px;
    height:290px;
    border-radius:999px;
    background:radial-gradient(circle, rgba(98,163,196,.20), transparent 68%);
    pointer-events:none;
}

.kyovalt-rita-report__top,
.kyovalt-rita-report__score,
.kyovalt-rita-report__rows,
.kyovalt-rita-report__conclusion{
    position:relative;
    z-index:2;
}

.kyovalt-rita-report__top{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
    margin-bottom:22px;
    padding:22px;
    border-radius:24px;
    background:linear-gradient(135deg, var(--kyo-blue-dark), var(--kyo-blue));
    color:var(--kyo-white);
}

.kyovalt-rita-report__top small{
    display:block;
    margin-bottom:6px;
    color:rgba(255,255,255,.65);
    font-size:12px;
    line-height:1;
    font-weight:800;
    letter-spacing:.06em;
}

.kyovalt-rita-report__top strong{
    display:block;
    color:var(--kyo-white);
    font-size:23px;
    line-height:1.1;
    font-weight:950;
    letter-spacing:-.035em;
}

.kyovalt-rita-report__top > span{
    flex:0 0 auto;
    padding:8px 12px;
    border-radius:999px;
    background:rgba(246,144,61,.16);
    border:1px solid rgba(246,144,61,.28);
    color:var(--kyo-white);
    font-size:12px;
    line-height:1;
    font-weight:900;
}

.kyovalt-rita-report__score{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:22px;
    margin-bottom:22px;
    padding:24px;
    border-radius:24px;
    background:var(--kyo-grey);
    border:1px solid rgba(1,10,31,.06);
}

.kyovalt-rita-report__score small{
    display:block;
    margin-bottom:8px;
    color:#667085;
    font-size:13px;
    font-weight:800;
}

.kyovalt-rita-report__score strong{
    display:block;
    color:var(--kyo-black);
    font-size:46px;
    line-height:1;
    font-weight:950;
    letter-spacing:-.05em;
}

.kyovalt-rita-report__score-ring{
    width:86px;
    height:86px;
    flex:0 0 86px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:999px;
    background:
        radial-gradient(circle at center, var(--kyo-white) 57%, transparent 59%),
        conic-gradient(var(--kyo-orange) 0 82%, rgba(1,10,31,.10) 82% 100%);
    box-shadow:0 14px 30px rgba(246,144,61,.18);
}

.kyovalt-rita-report__score-ring span{
    color:var(--kyo-blue-dark);
    font-size:22px;
    line-height:1;
    font-weight:950;
}

.kyovalt-rita-report__rows{
    display:grid;
    gap:10px;
    margin-bottom:22px;
}

.kyovalt-rita-report__row{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
    padding:15px 16px;
    border-radius:16px;
    background:rgba(255,255,255,.72);
    border:1px solid rgba(1,10,31,.06);
}

.kyovalt-rita-report__row span{
    color:#667085;
    font-size:14.5px;
    line-height:1.3;
    font-weight:700;
}

.kyovalt-rita-report__row strong{
    color:var(--kyo-black);
    font-size:14.5px;
    line-height:1.3;
    font-weight:900;
    text-align:right;
}

.kyovalt-rita-report__row strong.is-success{
    color:#12B76A;
}

.kyovalt-rita-report__row strong.is-warning{
    color:var(--kyo-orange);
}

.kyovalt-rita-report__conclusion{
    padding:20px;
    border-radius:22px;
    background:linear-gradient(135deg, rgba(98,163,196,.10), rgba(246,144,61,.10));
    border:1px solid rgba(1,10,31,.06);
}

.kyovalt-rita-report__conclusion strong{
    display:block;
    margin-bottom:8px;
    color:var(--kyo-black);
    font-size:16px;
    font-weight:950;
}

.kyovalt-rita-report__conclusion p{
    margin:0;
    color:var(--kyo-text-soft);
    font-size:15px;
    line-height:1.58;
}


/* =====================================================
   RITA — RESPONSIVE
====================================================== */

@media(max-width:1180px){

    .kyovalt-rita__layout{
        grid-template-columns:1fr;
        gap:48px;
    }

    .kyovalt-rita__content{
        max-width:860px;
    }

    .kyovalt-rita__visual{
        max-width:760px;
    }
}

@media(max-width:980px){

    .kyovalt-rita{
        padding:92px 34px;
    }
}

@media(max-width:700px){

    .kyovalt-rita{
        padding:82px 22px;
    }

    .kyovalt-rita__content h2{
        font-size:34px;
    }

    .kyovalt-rita__content > p{
        font-size:16.5px;
        line-height:1.65;
    }

    .kyovalt-rita-feature{
        flex-direction:column;
        padding:22px 20px;
        border-radius:22px;
    }

    .kyovalt-rita__actions{
        width:100%;
    }

    .kyovalt-rita__actions .kyovalt-btn{
        width:100%;
    }

    .kyovalt-rita-report{
        padding:16px;
        border-radius:26px;
    }

    .kyovalt-rita-report__top{
        flex-direction:column;
        align-items:flex-start;
        padding:18px;
        border-radius:20px;
    }

    .kyovalt-rita-report__top strong{
        font-size:20px;
    }

    .kyovalt-rita-report__score{
        padding:18px;
        border-radius:20px;
    }

    .kyovalt-rita-report__score strong{
        font-size:38px;
    }

    .kyovalt-rita-report__score-ring{
        width:72px;
        height:72px;
        flex-basis:72px;
    }

    .kyovalt-rita-report__score-ring span{
        font-size:19px;
    }

    .kyovalt-rita-report__row{
        align-items:flex-start;
        padding:14px;
    }

    .kyovalt-rita-report__row span,
    .kyovalt-rita-report__row strong{
        font-size:13.5px;
    }
}

/* =====================================================
   14. COMMENT ÇA MARCHE — PROCESS KYOVALT
====================================================== */

.kyovalt-process{
    position:relative;
    padding:120px 48px;
    background:var(--kyo-grey);
    overflow:hidden;
}

.kyovalt-process::before{
    content:"";
    position:absolute;
    top:-190px;
    left:-160px;
    width:460px;
    height:460px;
    border-radius:999px;
    background:radial-gradient(circle, rgba(246,144,61,.13), transparent 68%);
    pointer-events:none;
}

.kyovalt-process::after{
    content:"";
    position:absolute;
    right:-180px;
    bottom:-220px;
    width:500px;
    height:500px;
    border-radius:999px;
    background:radial-gradient(circle, rgba(98,163,196,.15), transparent 68%);
    pointer-events:none;
}

.kyovalt-process__grid{
    position:relative;
    z-index:2;
    display:grid;
    grid-template-columns:repeat(4, minmax(0, 1fr));
    gap:22px;
}

.kyovalt-process-card{
    position:relative;
    min-height:300px;
    padding:30px 24px;
    border-radius:28px;
    background:rgba(255,255,255,.90);
    border:1px solid var(--kyo-border);
    box-shadow:var(--kyo-shadow-card);
    overflow:hidden;
    transition:
        transform .28s ease,
        box-shadow .28s ease,
        border-color .28s ease;
}

.kyovalt-process-card:hover{
    transform:translateY(-6px);
    box-shadow:0 30px 80px rgba(1,10,31,.12);
    border-color:rgba(246,144,61,.26);
}

.kyovalt-process-card::before{
    content:"";
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:5px;
    background:linear-gradient(
        90deg,
        var(--kyo-orange),
        var(--kyo-terracotta),
        var(--kyo-blue-light)
    );
}

.kyovalt-process-card__number{
    width:54px;
    height:54px;
    display:flex;
    align-items:center;
    justify-content:center;
    margin-bottom:24px;
    border-radius:18px;
    background:linear-gradient(135deg, var(--kyo-blue-dark), var(--kyo-blue));
    color:var(--kyo-white);
    font-size:15px;
    line-height:1;
    font-weight:950;
}

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

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

.kyovalt-process__note{
    position:relative;
    z-index:2;
    max-width:920px;
    margin:42px auto 0;
    padding:22px 28px;
    border-radius:24px;
    background:var(--kyo-white);
    border:1px solid var(--kyo-border);
    box-shadow:0 16px 42px rgba(1,10,31,.06);
    color:var(--kyo-text-soft);
    font-size:17px;
    line-height:1.6;
    text-align:center;
}

.kyovalt-process__note strong{
    color:var(--kyo-blue-dark);
    font-weight:950;
}

/* Responsive */
@media(max-width:1180px){

    .kyovalt-process__grid{
        grid-template-columns:repeat(2, minmax(0, 1fr));
    }

    .kyovalt-process-card{
        min-height:auto;
    }
}

@media(max-width:980px){

    .kyovalt-process{
        padding:92px 34px;
    }
}

@media(max-width:700px){

    .kyovalt-process{
        padding:82px 22px;
    }

    .kyovalt-process__grid{
        grid-template-columns:1fr;
        gap:18px;
    }

    .kyovalt-process-card{
        padding:28px 22px;
        border-radius:24px;
    }

    .kyovalt-process-card h3{
        font-size:21px;
    }

    .kyovalt-process__note{
        margin-top:32px;
        padding:20px 18px;
        border-radius:22px;
        font-size:15.5px;
        text-align:left;
    }
}


/* =====================================================
   15. BÉNÉFICES CONCRETS / ROI
====================================================== */

.kyovalt-benefits{
    position:relative;
    padding:120px 48px;
    background:var(--kyo-white);
    overflow:hidden;
}

.kyovalt-benefits::before{
    content:"";
    position:absolute;
    top:-180px;
    right:-180px;
    width:460px;
    height:460px;
    border-radius:999px;
    background:radial-gradient(circle, rgba(98,163,196,.13), transparent 68%);
    pointer-events:none;
}

.kyovalt-benefits::after{
    content:"";
    position:absolute;
    bottom:-220px;
    left:-180px;
    width:500px;
    height:500px;
    border-radius:999px;
    background:radial-gradient(circle, rgba(246,144,61,.12), transparent 68%);
    pointer-events:none;
}

.kyovalt-benefits__layout{
    position:relative;
    z-index:2;
    display:grid;
    grid-template-columns:minmax(0, .88fr) minmax(0, 1.12fr);
    gap:72px;
    align-items:center;
}

.kyovalt-benefits__content{
    max-width:600px;
}

.kyovalt-benefits__content h2{
    margin:0 0 24px;
    color:var(--kyo-black);
    font-size:clamp(36px, 4vw, 58px);
    line-height:1.08;
    letter-spacing:-.045em;
    font-weight:950;
}

.kyovalt-benefits__content p{
    margin:0 0 32px;
    color:var(--kyo-text-soft);
    font-size:18px;
    line-height:1.72;
}

.kyovalt-benefits__actions{
    display:flex;
    flex-wrap:wrap;
    gap:14px;
}

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

.kyovalt-benefit-card{
    position:relative;
    min-height:250px;
    padding:28px 24px;
    border-radius:28px;
    background:var(--kyo-grey);
    border:1px solid var(--kyo-border);
    box-shadow:var(--kyo-shadow-card);
    overflow:hidden;
    transition:
        transform .28s ease,
        box-shadow .28s ease,
        border-color .28s ease;
}

.kyovalt-benefit-card:hover{
    transform:translateY(-6px);
    box-shadow:0 30px 80px rgba(1,10,31,.12);
    border-color:rgba(22,72,107,.22);
}

.kyovalt-benefit-card::before{
    content:"";
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:5px;
    background:linear-gradient(
        90deg,
        var(--kyo-orange),
        var(--kyo-terracotta),
        var(--kyo-blue-light)
    );
}

.kyovalt-benefit-card__icon{
    width:50px;
    height:50px;
    display:flex;
    align-items:center;
    justify-content:center;
    margin-bottom:22px;
    border-radius:17px;
    background:linear-gradient(135deg, var(--kyo-blue-dark), var(--kyo-blue));
    color:var(--kyo-white);
    font-size:14px;
    line-height:1;
    font-weight:950;
}

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

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

/* Responsive */
@media(max-width:1180px){

    .kyovalt-benefits__layout{
        grid-template-columns:1fr;
        gap:48px;
    }

    .kyovalt-benefits__content{
        max-width:860px;
    }
}

@media(max-width:980px){

    .kyovalt-benefits{
        padding:92px 34px;
    }
}

@media(max-width:700px){

    .kyovalt-benefits{
        padding:82px 22px;
    }

    .kyovalt-benefits__content h2{
        font-size:34px;
    }

    .kyovalt-benefits__content p{
        font-size:16.5px;
        line-height:1.65;
    }

    .kyovalt-benefits__actions,
    .kyovalt-benefits__actions .kyovalt-btn{
        width:100%;
    }

    .kyovalt-benefits__grid{
        grid-template-columns:1fr;
        gap:18px;
    }

    .kyovalt-benefit-card{
        min-height:auto;
        padding:28px 22px;
        border-radius:24px;
    }

    .kyovalt-benefit-card h3{
        font-size:21px;
    }
}

/* =====================================================
   16. OPTIMISATION CONVERSION — MAILLAGE & CTA
====================================================== */

/* Liens texte vers kyovalt.com dans les paragraphes */
.kyovalt-text-link,
.kyovalt-inline-link{
    color:var(--kyo-blue);
    font-weight:850;
    text-decoration:none;
    border-bottom:1px solid rgba(22,72,107,.25);
    transition:color .25s ease, border-color .25s ease;
}

.kyovalt-text-link:hover,
.kyovalt-inline-link:hover{
    color:var(--kyo-orange);
    border-color:rgba(246,144,61,.45);
}

.kyovalt-inline-link{
    display:inline-flex;
    margin-left:8px;
    white-space:nowrap;
}

/* Bouton clair utilisable sur les sections blanches/grises */
.kyovalt-btn--light{
    background:var(--kyo-white);
    color:var(--kyo-blue-dark);
    border:1px solid rgba(1,10,31,.10);
    box-shadow:0 14px 34px rgba(1,10,31,.06);
}

.kyovalt-btn--light:hover{
    transform:translateY(-2px);
    color:var(--kyo-blue-dark);
    background:var(--kyo-grey);
    border-color:rgba(22,72,107,.24);
    box-shadow:0 18px 42px rgba(1,10,31,.10);
}

.kyovalt-btn--ghost{
    background:transparent;
    color:var(--kyo-white);
    border:1px solid rgba(255,255,255,.26);
    box-shadow:none;
}

.kyovalt-btn--ghost:hover{
    transform:translateY(-2px);
    background:rgba(255,255,255,.12);
    color:var(--kyo-white);
}

/* Logo KYOVALT dans le hero */
.kyovalt-hero__brand{
    display:inline-flex;
    align-items:center;
    gap:12px;
    margin-bottom:22px;
    padding:11px 15px;
    border-radius:22px;
    background:rgba(255,255,255,.10);
    border:1px solid rgba(255,255,255,.16);
    color:rgba(255,255,255,.78);
    font-size:12px;
    line-height:1;
    font-weight:800;
    backdrop-filter:blur(14px);
    -webkit-backdrop-filter:blur(14px);
}

.kyovalt-hero__brand img{
    display:block;
    width:auto;
    height:34px;
    max-width:180px;
    object-fit:contain;
}

.kyovalt-hero__brand span{
    display:inline-flex;
    padding-left:12px;
    border-left:1px solid rgba(255,255,255,.18);
    white-space:nowrap;
}

/* Logo K dans la carte produit */
.kyovalt-product-card__brand{
    display:flex;
    align-items:center;
    gap:14px;
    min-width:0;
}

.kyovalt-product-card__logo{
    width:54px;
    height:54px;
    flex:0 0 54px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:18px;
    background:#ffffff;
    box-shadow:0 12px 30px rgba(1,10,31,.16);
    overflow:hidden;
}

.kyovalt-product-card__logo img{
    display:block;
    width:34px;
    height:34px;
    object-fit:contain;
}

.kyovalt-product-card__brand > div:last-child{
    min-width:0;
}

/* Icône K dans les étapes du mockup hero */
.kyovalt-product-step > span.kyovalt-product-step__icon{
    width:42px;
    height:42px;
    flex:0 0 42px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:14px;
    background:#ffffff !important;
    color:inherit !important;
    font-size:initial !important;
    font-weight:initial !important;
    box-shadow:0 10px 24px rgba(1,10,31,.10);
    overflow:hidden;
}

.kyovalt-product-step__icon img{
    display:block;
    width:26px;
    height:26px;
    object-fit:contain;
}

.kyovalt-product-step.is-active .kyovalt-product-step__icon{
    box-shadow:
        0 12px 28px rgba(246,144,61,.20),
        0 0 0 1px rgba(246,144,61,.16);
}

/* Bandeaux de conversion entre les sections */
.kyovalt-conversion-strip{
    position:relative;
    z-index:2;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:28px;
    margin-top:56px;
    padding:28px 30px;
    border-radius:28px;
    background:var(--kyo-grey);
    border:1px solid var(--kyo-border);
    box-shadow:0 18px 46px rgba(1,10,31,.07);
}

.kyovalt-conversion-strip--dark{
    background:linear-gradient(135deg, var(--kyo-blue-dark), var(--kyo-blue));
    border-color:rgba(255,255,255,.12);
    box-shadow:0 28px 70px rgba(15,47,70,.18);
}

.kyovalt-conversion-strip strong{
    display:block;
    margin-bottom:8px;
    color:var(--kyo-black);
    font-size:22px;
    line-height:1.2;
    letter-spacing:-.03em;
    font-weight:950;
}

.kyovalt-conversion-strip span{
    display:block;
    color:var(--kyo-text-soft);
    font-size:16px;
    line-height:1.55;
}

.kyovalt-conversion-strip--dark strong{
    color:var(--kyo-white);
}

.kyovalt-conversion-strip--dark span{
    color:rgba(255,255,255,.78);
}

.kyovalt-conversion-strip__actions{
    display:flex;
    flex-wrap:wrap;
    gap:12px;
    flex:0 0 auto;
}

/* Liens de conversion dans les cartes */
.kyovalt-card-link{
    display:inline-flex;
    align-items:center;
    margin-top:auto;
    padding-top:22px;
    color:var(--kyo-blue);
    font-size:15px;
    line-height:1;
    font-weight:900;
    transition:transform .25s ease, color .25s ease;
}

.kyovalt-card-link:hover{
    transform:translateX(5px);
    color:var(--kyo-orange);
}

.kyovalt-usecases__actions,
.kyovalt-section-cta{
    display:flex;
    flex-wrap:wrap;
    gap:14px;
}

.kyovalt-usecases__actions{
    margin-top:32px;
}

.kyovalt-section-cta{
    position:relative;
    z-index:2;
    justify-content:center;
    margin-top:46px;
}

/* Final CTA : support de 3 boutons */
.kyovalt-final-cta__actions{
    gap:14px;
}

/* Amélioration spacing des features avec lien bas */
.kyovalt-feature-card{
    display:flex;
    flex-direction:column;
}

.kyovalt-feature-card ul{
    margin-bottom:0;
}

@media(max-width:980px){

    .kyovalt-conversion-strip{
        align-items:flex-start;
        flex-direction:column;
    }

    .kyovalt-conversion-strip__actions{
        width:100%;
    }
}

@media(max-width:700px){

    .kyovalt-hero__brand{
        margin-bottom:18px;
        padding:10px 12px;
        border-radius:18px;
        gap:10px;
    }

    .kyovalt-hero__brand img{
        height:30px;
        max-width:150px;
    }

    .kyovalt-hero__brand span{
        padding-left:10px;
        font-size:11px;
    }

    .kyovalt-product-card__brand{
        gap:12px;
    }

    .kyovalt-product-card__logo{
        width:48px;
        height:48px;
        flex-basis:48px;
        border-radius:16px;
    }

    .kyovalt-product-card__logo img{
        width:30px;
        height:30px;
    }

    .kyovalt-product-step > span.kyovalt-product-step__icon{
        width:38px;
        height:38px;
        flex-basis:38px;
        border-radius:13px;
    }

    .kyovalt-product-step__icon img{
        width:24px;
        height:24px;
    }

    .kyovalt-inline-link{
        display:flex;
        margin-left:0;
        margin-top:8px;
        white-space:normal;
    }

    .kyovalt-conversion-strip{
        margin-top:38px;
        padding:24px 20px;
        border-radius:24px;
    }

    .kyovalt-conversion-strip strong{
        font-size:20px;
    }

    .kyovalt-conversion-strip__actions,
    .kyovalt-conversion-strip__actions .kyovalt-btn,
    .kyovalt-usecases__actions,
    .kyovalt-usecases__actions .kyovalt-btn,
    .kyovalt-section-cta,
    .kyovalt-section-cta .kyovalt-btn{
        width:100%;
    }

    .kyovalt-final-cta__actions .kyovalt-btn{
        width:100%;
    }
}
/* =====================================================
   16. PREMIUM UX — SCROLL PROGRESS
====================================================== */

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

.kyovalt-scroll-progress__bar{
    width:0;
    height:100%;
    background:linear-gradient(
        90deg,
        var(--kyo-orange),
        var(--kyo-terracotta),
        var(--kyo-blue-light)
    );
    box-shadow:0 0 18px rgba(246,144,61,.45);
}


/* =====================================================
   17. PREMIUM UX — CTA STICKY
====================================================== */

.kyovalt-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,.82);
    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;
}

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

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

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

.kyovalt-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;
}

.kyovalt-sticky-cta__actions a:first-child{
    background:var(--kyo-orange);
    box-shadow:0 12px 28px rgba(246,144,61,.28);
}

.kyovalt-sticky-cta__actions a:first-child:hover{
    background:var(--kyo-terracotta);
    transform:translateY(-1px);
}

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

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


/* =====================================================
   18. PREMIUM UX — LIGHT FOLLOW SUR CARDS
====================================================== */

.kyovalt-problem-card,
.kyovalt-process-card,
.kyovalt-feature-card,
.kyovalt-usecase-item,
.kyovalt-security-card,
.kyovalt-benefit-card{
    position:relative;
}

.kyovalt-problem-card::after,
.kyovalt-process-card::after,
.kyovalt-feature-card::after,
.kyovalt-usecase-item::after,
.kyovalt-security-card::after,
.kyovalt-benefit-card::after{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    opacity:0;
    background:radial-gradient(
        circle at var(--kyo-card-x, 50%) var(--kyo-card-y, 50%),
        rgba(246,144,61,.13),
        rgba(98,163,196,.08) 28%,
        transparent 58%
    );
    transition:opacity .28s ease;
}

.kyovalt-problem-card:hover::after,
.kyovalt-process-card:hover::after,
.kyovalt-feature-card:hover::after,
.kyovalt-usecase-item:hover::after,
.kyovalt-security-card:hover::after,
.kyovalt-benefit-card:hover::after{
    opacity:1;
}


/* =====================================================
   19. PREMIUM UX — HERO MICRO PARALLAX
====================================================== */

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


/* =====================================================
   20. PREMIUM UX — AMÉLIORATION REVEAL
====================================================== */

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

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

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

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


/* =====================================================
   21. RESPONSIVE PREMIUM UX
====================================================== */

@media(max-width:760px){

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

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

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

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

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

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

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

    .kyovalt-reveal,
    .kyovalt-reveal--card{
        opacity:1 !important;
    }
}

/* =====================================================
   KYOVALT — Maillage interne SEO
   Section solutions complémentaires
====================================================== */

.kyovalt-related-seo {
    position: relative;
    overflow: hidden;
    padding: 96px 0;
    background:
        radial-gradient(circle at 12% 18%, rgba(121, 88, 255, 0.14), transparent 34%),
        radial-gradient(circle at 88% 75%, rgba(64, 146, 255, 0.16), transparent 34%),
        linear-gradient(135deg, #ffffff 0%, #f7f9fc 48%, #eef4ff 100%);
}

.kyovalt-related-seo::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(15, 47, 70, 0.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(15, 47, 70, 0.045) 1px, transparent 1px);
    background-size: 42px 42px;
    mask-image: linear-gradient(180deg, transparent 0%, #000 20%, #000 80%, transparent 100%);
    pointer-events: none;
}

.kyovalt-related-seo__canvas {
    position: absolute;
    inset: 0;
    z-index: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    opacity: 0.72;
}

.kyovalt-related-seo__container {
    position: relative;
    z-index: 2;
    width: min(1120px, calc(100% - 40px));
    margin: 0 auto;
}

.kyovalt-related-seo .kyovalt-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 16px;
    color: #7958FF;
    font-size: 0.78rem;
    font-weight: 900;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.kyovalt-related-seo .kyovalt-eyebrow::before {
    content: "";
    width: 34px;
    height: 2px;
    border-radius: 999px;
    background: linear-gradient(90deg, #7958FF, #4092FF);
}

.kyovalt-related-seo h2 {
    max-width: 820px;
    margin: 0;
    color: #0F2F46;
    font-size: clamp(2rem, 4vw, 3.45rem);
    line-height: 0.98;
    letter-spacing: -0.055em;
}

.kyovalt-related-seo__container > p {
    max-width: 800px;
    margin: 22px 0 0;
    color: rgba(1, 10, 31, 0.68);
    font-size: 1.05rem;
    line-height: 1.72;
}

.kyovalt-related-seo__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px;
    margin-top: 38px;
}

.kyovalt-related-seo__card {
    position: relative;
    overflow: hidden;
    min-height: 220px;
    padding: 32px;
    border: 1px solid rgba(15, 47, 70, 0.12);
    border-radius: 30px;
    background: linear-gradient(180deg, rgba(255,255,255,0.96), rgba(255,255,255,0.88));
    color: #010A1F;
    text-decoration: none;
    box-shadow: 0 22px 70px rgba(1, 10, 31, 0.10);
    transition:
        transform 0.25s ease,
        box-shadow 0.25s ease,
        border-color 0.25s ease,
        background 0.25s ease;
}

.kyovalt-related-seo__card::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at top right, rgba(121, 88, 255, 0.17), transparent 38%),
        radial-gradient(circle at bottom left, rgba(64, 146, 255, 0.16), transparent 38%);
    opacity: 0;
    transition: opacity 0.25s ease;
}

.kyovalt-related-seo__card::after {
    content: "→";
    position: absolute;
    right: 28px;
    bottom: 24px;
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    border-radius: 999px;
    background: rgba(121, 88, 255, 0.13);
    color: #7958FF;
    font-size: 1.25rem;
    font-weight: 900;
    transition:
        transform 0.25s ease,
        background 0.25s ease,
        color 0.25s ease;
}

.kyovalt-related-seo__card:hover {
    transform: translateY(-7px);
    border-color: rgba(121, 88, 255, 0.38);
    background: #ffffff;
    box-shadow: 0 32px 90px rgba(1, 10, 31, 0.15);
}

.kyovalt-related-seo__card:hover::before {
    opacity: 1;
}

.kyovalt-related-seo__card:hover::after {
    transform: translateX(4px);
    background: linear-gradient(135deg, #7958FF, #4092FF);
    color: #ffffff;
}

.kyovalt-related-seo__card strong,
.kyovalt-related-seo__card span {
    position: relative;
    z-index: 1;
}

.kyovalt-related-seo__card strong {
    display: block;
    max-width: 88%;
    color: #0F2F46;
    font-size: 1.55rem;
    line-height: 1.12;
    letter-spacing: -0.04em;
}

.kyovalt-related-seo__card span {
    display: block;
    max-width: 86%;
    margin-top: 18px;
    color: rgba(1, 10, 31, 0.66);
    font-size: 1rem;
    line-height: 1.65;
}

.kyovalt-related-seo__card:focus-visible {
    outline: 3px solid rgba(121, 88, 255, 0.55);
    outline-offset: 5px;
}

@media (prefers-reduced-motion: reduce) {
    .kyovalt-related-seo__canvas {
        display: none;
    }
}

@media (max-width: 860px) {
    .kyovalt-related-seo {
        padding: 72px 0;
    }

    .kyovalt-related-seo__grid {
        grid-template-columns: 1fr;
    }

    .kyovalt-related-seo__card {
        min-height: auto;
    }
}

@media (max-width: 620px) {
    .kyovalt-related-seo {
        padding: 60px 0;
    }

    .kyovalt-related-seo__container {
        width: min(100% - 28px, 1120px);
    }

    .kyovalt-related-seo h2 {
        font-size: clamp(1.85rem, 10vw, 2.65rem);
    }

    .kyovalt-related-seo__container > p {
        font-size: 1rem;
    }

    .kyovalt-related-seo__card {
        padding: 26px;
        border-radius: 24px;
    }

    .kyovalt-related-seo__card strong {
        max-width: 100%;
        font-size: 1.35rem;
    }

    .kyovalt-related-seo__card span {
        max-width: 100%;
        padding-right: 44px;
    }

    .kyovalt-related-seo__card::after {
        right: 22px;
        bottom: 22px;
        width: 38px;
        height: 38px;
    }
}