.process-page{
    --process-bg:#020b13;
    --process-panel:#061522;
    --process-panel-2:#071a29;
    --process-blue:#078bff;
    --process-blue-2:#2aa6ff;
    --process-line:rgba(31,145,241,.34);
    --process-text:#f5f8fc;
    --process-muted:#a7b8c8;
    background:var(--process-bg);
    color:var(--process-text);
    overflow:hidden;
}
.process-page *{box-sizing:border-box}
.process-page .wrap{width:min(100% - 48px,1480px);margin-inline:auto}

.process-hero{
    position:relative;
    min-height:100vh;
    padding:120px 0 52px;
    overflow:hidden;
    background:#020b13;
}
.process-bg-video{
    position:absolute;
    inset:0;
    z-index:0;
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center center;
    pointer-events:none;
}
.process-video-overlay{
    position:absolute;
    inset:0;
    z-index:1;
    pointer-events:none;
    background:
        linear-gradient(180deg,rgba(2,11,19,.74) 0%,rgba(2,11,19,.82) 34%,rgba(2,11,19,.92) 100%),
        radial-gradient(circle at 50% 18%,rgba(0,117,255,.18),transparent 32%);
}
.process-hero>.wrap{
    position:relative;
    z-index:3;
}
.process-grid-bg{
    position:absolute;
    inset:0;
    z-index:2;
    opacity:.58;
    background-image:
        linear-gradient(rgba(52,137,207,.035) 1px,transparent 1px),
        linear-gradient(90deg,rgba(52,137,207,.035) 1px,transparent 1px);
    background-size:72px 72px;
    mask-image:linear-gradient(to bottom,black 5%,rgba(0,0,0,.8) 70%,transparent 100%);
}
.process-light{
    position:absolute;
    z-index:2;
    width:380px;
    height:380px;
    border-radius:80px;
    border:2px solid rgba(31,148,255,.6);
    filter:drop-shadow(0 0 26px rgba(0,123,255,.36));
    opacity:.45;
}
.process-light-left{
    left:-220px;
    top:-110px;
    transform:rotate(40deg);
}
.process-light-right{
    right:-230px;
    top:58px;
    border-radius:50%;
    transform:rotate(20deg);
}
.process-heading{
    position:relative;
    z-index:2;
    max-width:950px;
    margin:0 auto 54px;
    text-align:center;
}
.process-kicker{
    display:flex;
    justify-content:center;
    align-items:center;
    gap:20px;
    color:#8eb4d9;
    letter-spacing:.18em;
    font-size:16px;
    font-weight:700;
}
.process-kicker i{
    width:42px;
    height:1px;
    background:#2d8fe8;
}
.process-heading h1{
    margin:13px 0 18px;
    font-size:clamp(64px,6vw,102px);
    line-height:.95;
    letter-spacing:-.055em;
}
.process-heading h1 span,
.process-heading h1 strong{
    display:inline;
}
.process-heading h1 strong{color:var(--process-blue)}
.process-heading p{
    max-width:780px;
    margin:0 auto;
    color:#bdcad8;
    font-size:20px;
    line-height:1.5;
}
.process-side-note{
    position:absolute;
    z-index:2;
    color:#96adc2;
}
.note-left{
    left:5%;
    top:95px;
    padding-left:22px;
    border-left:2px solid #0d8cff;
}
.note-left span{display:block;font-size:15px;line-height:1.6}
.note-right{
    right:4.5%;
    top:70px;
    width:170px;
    color:#fff;
    font-family:cursive;
    font-size:19px;
    line-height:1.15;
    transform:rotate(-4deg);
}
.note-right svg{
    width:86px;
    margin:8px 0 0 15px;
    fill:none;
    stroke:#fff;
    stroke-width:1.5;
}

.process-flow{
    position:relative;
    z-index:2;
    display:grid;
    grid-template-columns:repeat(5,1fr);
    gap:38px;
    align-items:stretch;
}
.process-flow::before{
    content:"";
    position:absolute;
    left:6%;
    right:6%;
    top:48%;
    height:2px;
    background:linear-gradient(90deg,transparent,#0b8fff 8%,#39a7ff 50%,#0b8fff 92%,transparent);
    box-shadow:0 0 22px rgba(13,142,255,.55);
    opacity:.72;
}
.process-card{
    position:relative;
    min-height:495px;
    padding:30px 24px 24px;
    border:1px solid rgba(26,144,242,.55);
    border-radius:16px;
    background:
        linear-gradient(180deg,rgba(7,29,47,.94),rgba(4,17,28,.96)),
        radial-gradient(circle at 50% 22%,rgba(12,120,231,.16),transparent 34%);
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.025),
        0 18px 50px rgba(0,0,0,.22);
    transition:.3s;
}
.process-card:nth-child(1){transform:rotate(-1.8deg)}
.process-card:nth-child(2){transform:rotate(1.5deg)}
.process-card:nth-child(3){transform:rotate(-.8deg)}
.process-card:nth-child(4){transform:rotate(1.2deg)}
.process-card:nth-child(5){transform:rotate(-1.4deg)}
.process-card:hover{
    transform:translateY(-10px) rotate(0deg);
    border-color:#19a0ff;
    box-shadow:0 24px 65px rgba(0,74,146,.28),0 0 28px rgba(0,139,255,.08);
}
.process-number{
    display:block;
    margin-bottom:12px;
    color:rgba(31,120,210,.55);
    font-size:56px;
    font-weight:800;
    line-height:1;
}
.process-icon{
    width:150px;
    height:120px;
    margin:0 auto 15px;
    display:grid;
    place-items:center;
    position:relative;
}
.process-icon::before{
    content:"";
    position:absolute;
    width:108px;
    height:42px;
    bottom:4px;
    border-radius:50%;
    background:radial-gradient(ellipse,rgba(20,121,255,.36),transparent 68%);
    filter:blur(4px);
}
.process-icon svg{
    position:relative;
    z-index:2;
    width:92px;
    height:92px;
    fill:none;
    stroke:#60baff;
    stroke-width:2.7;
    stroke-linecap:round;
    stroke-linejoin:round;
    filter:
        drop-shadow(0 0 4px rgba(36,148,255,.9))
        drop-shadow(0 0 15px rgba(12,111,255,.48));
}
.process-card h2{
    margin:8px 0 8px;
    color:#fff;
    font-size:24px;
    line-height:1.15;
}
.process-card>p{
    min-height:86px;
    margin:0;
    color:#b3c1cf;
    font-size:16px;
    line-height:1.5;
}
.process-mini-line{
    width:38px;
    height:2px;
    margin:18px 0 14px;
    background:#078bff;
}
.process-card ul{
    margin:0;
    padding:0;
    list-style:none;
    display:grid;
    gap:9px;
}
.process-card li{
    position:relative;
    padding-left:26px;
    color:#c5d1dc;
    font-size:14px;
    line-height:1.35;
}
.process-card li::before{
    content:"✓";
    position:absolute;
    left:0;
    top:-1px;
    width:18px;
    height:18px;
    border-radius:50%;
    display:grid;
    place-items:center;
    border:1px solid #0b91ff;
    color:#28a5ff;
    font-size:11px;
    font-weight:700;
}
.process-connector{
    position:absolute;
    z-index:5;
    top:47%;
    right:-31px;
    width:42px;
    height:42px;
    border-radius:50%;
    display:grid;
    place-items:center;
    background:#03111d;
    border:2px solid #078bff;
    color:#35a7ff;
    box-shadow:0 0 24px rgba(0,139,255,.55);
}
.process-connector svg{
    width:21px;
    fill:none;
    stroke:currentColor;
    stroke-width:2;
}

.process-cta{
    position:relative;
    z-index:2;
    min-height:180px;
    margin-top:34px;
    padding:33px 42px;
    overflow:hidden;
    border:1px solid rgba(0,139,255,.66);
    border-radius:16px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:42px;
    background:
        radial-gradient(circle at 75% 10%,rgba(15,107,224,.3),transparent 27%),
        linear-gradient(110deg,#06182e,#082346 68%,#082f62);
}
.process-kicker-small{
    color:#81a8cc;
    letter-spacing:.15em;
    font-size:13px;
    font-weight:700;
}
.process-cta-copy{
    position:relative;
    z-index:3;
    max-width:800px;
}
.process-cta-copy h2{
    margin:10px 0 8px;
    font-size:clamp(36px,3.5vw,56px);
    line-height:1.04;
}
.process-cta-copy h2 strong{color:#078bff}
.process-cta-copy p{
    margin:0;
    color:#c1cddd;
    font-size:17px;
}
.process-cta-action{
    position:relative;
    z-index:3;
    min-width:240px;
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:10px;
}
.process-btn{
    width:100%;
    min-height:58px;
    padding:0 25px;
    border-radius:999px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:14px;
    background:#fff;
    color:#07111c;
    font-size:16px;
    font-weight:800;
    box-shadow:0 8px 30px rgba(0,139,255,.18);
}
.process-btn svg{
    width:18px;
    fill:none;
    stroke:#0b8fff;
    stroke-width:2;
}
.process-cta-action small{
    color:#8b9bac;
    font-size:12px;
}
.process-wave{
    position:absolute;
    right:23%;
    bottom:-96px;
    width:430px;
    height:220px;
    border-radius:50%;
    transform:rotate(-6deg);
    background:radial-gradient(ellipse at 45% 25%,rgba(74,203,255,.95),rgba(7,116,255,.86) 17%,rgba(4,50,132,.65) 38%,transparent 66%);
    filter:drop-shadow(0 0 28px rgba(0,129,255,.45));
}
.process-wave::before{
    content:"";
    position:absolute;
    left:2%;
    top:12%;
    width:92%;
    height:70%;
    border-radius:50%;
    border-top:3px solid rgba(80,190,255,.95);
    transform:rotate(7deg);
    box-shadow:0 -4px 20px rgba(23,145,255,.75);
}

.process-trust{
    position:relative;
    z-index:2;
    margin-top:22px;
    display:grid;
    grid-template-columns:repeat(4,1fr);
}
.process-trust>div{
    min-height:60px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:13px;
    color:#c5d2df;
    font-size:14px;
    border-right:1px solid rgba(98,143,182,.25);
}
.process-trust>div:last-child{border-right:0}
.trust-icon{
    width:38px;
    height:38px;
    border-radius:50%;
    display:grid;
    place-items:center;
    border:1px solid rgba(18,143,255,.45);
    background:#05182a;
    color:#3ba9ff;
    font-size:18px;
}

html[dir="rtl"] .process-heading,
html[dir="rtl"] .process-card,
html[dir="rtl"] .process-cta-copy{
    direction:rtl;
    text-align:right;
}
html[dir="rtl"] .process-heading{text-align:center}
html[dir="rtl"] .process-card li{padding-left:0;padding-right:26px}
html[dir="rtl"] .process-card li::before{left:auto;right:0}
html[dir="rtl"] .process-connector{right:auto;left:-31px}
html[dir="rtl"] .process-connector svg{transform:scaleX(-1)}
html[dir="rtl"] .note-left{
    left:auto;
    right:5%;
    padding-left:0;
    padding-right:22px;
    border-left:0;
    border-right:2px solid #0d8cff;
}
html[dir="rtl"] .note-right{right:auto;left:4.5%}

@media(max-width:1250px){
    .process-side-note{display:none}
    .process-flow{
        grid-template-columns:repeat(3,1fr);
        gap:26px;
    }
    .process-flow::before{display:none}
    .process-connector{display:none}
    .process-card:nth-child(n){transform:none}
}
@media(max-width:900px){
    .process-hero{padding-top:96px}
    .process-heading{margin-bottom:42px}
    .process-heading h1{font-size:64px}
    .process-flow{grid-template-columns:1fr 1fr}
    .process-cta{
        flex-direction:column;
        align-items:flex-start;
    }
    .process-cta-action{width:100%;align-items:stretch}
    .process-cta-action small{text-align:center}
    .process-trust{grid-template-columns:1fr 1fr}
    .process-trust>div:nth-child(2){border-right:0}
}
@media(max-width:620px){
    .process-page .wrap{width:min(100% - 24px,1480px)}
    .process-hero{padding:78px 0 36px}
    .process-heading h1{font-size:48px}
    .process-heading p{font-size:17px}
    .process-kicker{font-size:13px;gap:10px}
    .process-kicker i{width:24px}
    .process-flow{grid-template-columns:1fr}
    .process-card{min-height:auto;padding:25px 22px}
    .process-card>p{min-height:auto}
    .process-number{font-size:46px}
    .process-icon{height:105px}
    .process-cta{padding:28px 22px}
    .process-cta-copy h2{font-size:34px}
    .process-wave{right:-30%;bottom:-110px}
    .process-trust{grid-template-columns:1fr}
    .process-trust>div{
        justify-content:flex-start;
        border-right:0;
        border-bottom:1px solid rgba(98,143,182,.2);
    }
    .process-trust>div:last-child{border-bottom:0}
}

.process-card{
    opacity:0;
    transform:translateY(24px);
}
.process-card.is-visible{
    opacity:1;
}
@media(min-width:1251px){
    .process-card:nth-child(1).is-visible{transform:rotate(-1.8deg)}
    .process-card:nth-child(2).is-visible{transform:rotate(1.5deg)}
    .process-card:nth-child(3).is-visible{transform:rotate(-.8deg)}
    .process-card:nth-child(4).is-visible{transform:rotate(1.2deg)}
    .process-card:nth-child(5).is-visible{transform:rotate(-1.4deg)}
    .process-card.is-visible:hover{transform:translateY(-10px) rotate(0deg)}
}
@media(max-width:1250px){
    .process-card.is-visible{transform:none}
}

/* FINAL QA — Process containment and RTL */
.process-page .wrap{width:min(1400px,calc(100% - 64px))}
.process-flow{grid-template-columns:repeat(5,minmax(0,1fr));gap:28px}
.process-card{min-width:0}
html[dir="rtl"] .process-card li{padding-left:0;padding-right:26px}
html[dir="rtl"] .process-card li::before{left:auto;right:0}
html[dir="rtl"] .process-mini-line{margin-left:auto}
html[dir="rtl"] .process-connector{right:auto;left:-31px;transform:scaleX(-1)}
@media(max-width:1200px){.process-page .wrap{width:min(100% - 48px,1200px)}}
@media(max-width:760px){.process-page .wrap{width:calc(100% - 28px)}}

@media (max-width: 767px){
    .process-bg-video{object-position:52% center;}
    .process-video-overlay{background:linear-gradient(180deg,rgba(2,11,19,.8) 0%,rgba(2,11,19,.88) 42%,rgba(2,11,19,.95) 100%);}
}
@media (prefers-reduced-motion: reduce){
    .process-bg-video{display:none;}
}


/* Video spans behind header — preserve original Process content position */
body.page-video-under-header .process-hero{margin-top:calc(-1 * var(--page-chrome-space));padding-top:calc(120px + var(--page-chrome-space));min-height:calc(100vh + var(--page-chrome-space))}
@media(max-width:760px){body.page-video-under-header .process-hero{padding-top:calc(78px + var(--page-chrome-space));min-height:calc(100vh + var(--page-chrome-space))}}

/* FINAL FIX — make Process video physically continue behind breadcrumb + fixed header */
.page-chrome{background:transparent!important}
.process-hero{
    margin-top:calc(-1 * var(--page-chrome-space));
    padding-top:calc(120px + var(--page-chrome-space));
    min-height:calc(100vh + var(--page-chrome-space));
}
@media(max-width:760px){
    .process-hero{
        padding-top:calc(78px + var(--page-chrome-space));
        min-height:calc(100vh + var(--page-chrome-space));
    }
}

/* VIDEO HEADER FINAL — keep original Process layout while video begins at viewport top */
body.page-video-under-header .process-hero{
    margin-top:0!important;
    padding-top:324px!important;
    min-height:calc(100vh + 204px)!important;
}
@media(max-width:760px){body.page-video-under-header .process-hero{padding-top:244px!important;min-height:calc(100vh + 166px)!important}}

/* Process Light Mode */
html[data-theme="light"] .process-page{
    --process-text:#0b1324;
    --process-muted:#5e6b7c;
}
html[data-theme="light"] body.page-video-under-header header.nav:not(.scrolled) .logo-word,
html[data-theme="light"] body.page-video-under-header header.nav:not(.scrolled) .links a{color:#fff}
html[data-theme="light"] body.page-video-under-header header.nav:not(.scrolled) .links a:hover,
html[data-theme="light"] body.page-video-under-header header.nav:not(.scrolled) .links a.active{color:#fff}
html[data-theme="light"] .process-heading h1{color:#fff}
html[data-theme="light"] .process-heading p{color:#d4dee8}
html[data-theme="light"] .process-kicker{color:#a9c9e6}
html[data-theme="light"] .note-left{color:#b9c9d8}
html[data-theme="light"] .process-card{
    background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(246,248,252,.98));
    border-color:#b8d8f5;
    box-shadow:0 18px 46px rgba(15,23,42,.14);
}
html[data-theme="light"] .process-card:hover{
    border-color:#078bff;
    box-shadow:0 24px 58px rgba(15,23,42,.18),0 0 26px rgba(0,139,255,.10);
}
html[data-theme="light"] .process-number{color:rgba(7,123,255,.42)}
html[data-theme="light"] .process-card h2{color:#0b1324}
html[data-theme="light"] .process-card>p{color:#5e6b7c}
html[data-theme="light"] .process-card li{color:#526174}
html[data-theme="light"] .process-connector{background:#fff;color:#078bff;box-shadow:0 8px 24px rgba(7,139,255,.20)}
html[data-theme="light"] .process-trust{
    margin-top:24px;
    padding:10px 0;
    border-radius:14px;
    background:rgba(255,255,255,.94);
    box-shadow:0 12px 34px rgba(15,23,42,.10);
}
html[data-theme="light"] .process-trust>div{color:#465568;border-right-color:#d7dfea}
html[data-theme="light"] .trust-icon{background:#edf6ff;border-color:#b8d8f5;color:#078bff}
html[data-theme="light"] .process-cta-copy h2{color:#fff}
html[data-theme="light"] .process-cta-copy p{color:#d4dee8}
html[data-theme="light"] .process-kicker-small{color:#9fc0df}