/* =========================================================
   VOSTOK LOGISTIKA
   CHINA START / EDITORIAL SCROLLYTELLING
   ========================================================= */

.vlx-start,
.vlx-start *{
    box-sizing:border-box;
}

.vlx-start{
    --vlx-ink:#0B1620;
    --vlx-accent:#176B87;
    --vlx-cyan:#58C3D9;
    --vlx-muted:#71828A;
    --vlx-line:rgba(34,75,91,.13);
    --mx:50%;
    --my:40%;

    position:relative;
    overflow:hidden;
    isolation:isolate;

    padding:96px 0 72px;

    background:
        radial-gradient(circle at var(--mx) var(--my), rgba(88,195,217,.11), transparent 24%),
        linear-gradient(180deg,#F7F9FA 0%,#F3F6F7 100%);

    font-family:'Montserrat',Arial,sans-serif;
}

.vlx-start-shell{
    position:relative;
    z-index:3;

    width:min(1400px,calc(100% - 64px));
    margin:0 auto;
}

.vlx-start-bg{
    position:absolute;
    inset:0;
    z-index:0;
    pointer-events:none;
    overflow:hidden;
}

.vlx-start-bg:before{
    content:"";
    position:absolute;
    inset:0;
    opacity:.42;
    background-image:
        linear-gradient(rgba(23,107,135,.035) 1px,transparent 1px),
        linear-gradient(90deg,rgba(23,107,135,.035) 1px,transparent 1px);
    background-size:72px 72px;
    mask-image:linear-gradient(to bottom,transparent 0%,#000 22%,#000 78%,transparent 100%);
}

.vlx-start-orbit{
    position:absolute;
    border:1px solid rgba(23,107,135,.08);
    border-radius:50%;
    animation:vlxStartOrbit 24s linear infinite;
}

.vlx-start-orbit:after{
    content:"";
    position:absolute;
    width:7px;
    height:7px;
    top:14%;
    left:14%;
    border-radius:50%;
    background:rgba(88,195,217,.55);
    box-shadow:0 0 0 8px rgba(88,195,217,.06),0 0 28px rgba(88,195,217,.22);
}

.vlx-start-orbit-a{
    width:620px;
    height:620px;
    right:-310px;
    top:-250px;
}

.vlx-start-orbit-b{
    width:420px;
    height:420px;
    left:-210px;
    bottom:-180px;
    animation-duration:31s;
    animation-direction:reverse;
}

.vlx-start-glow{
    position:absolute;
    width:520px;
    height:520px;
    right:12%;
    top:34%;
    border-radius:50%;
    background:radial-gradient(circle,rgba(88,195,217,.08),rgba(88,195,217,0) 68%);
    filter:blur(3px);
    animation:vlxStartFloat 9s ease-in-out infinite alternate;
}

.vlx-start-layout{
    display:grid;
    grid-template-columns:minmax(340px,.82fr) minmax(0,1.18fr);
    gap:clamp(60px,7vw,120px);
    align-items:start;
}

.vlx-start-intro{
    position:sticky;
    top:132px;
    padding-top:4px;
}

.vlx-start-kicker{
    margin-bottom:18px;
    display:flex;
    align-items:center;
    gap:10px;

    color:#74868E;

    font-size:9px;
    line-height:1;
    font-weight:700;
    letter-spacing:.18em;
}

.vlx-start-kicker i{
    width:6px;
    height:6px;
    flex:0 0 6px;
    border-radius:50%;
    background:var(--vlx-cyan);
    box-shadow:0 0 0 5px rgba(88,195,217,.08);
}

.vlx-start h2{
    margin:0 !important;

    color:var(--vlx-ink) !important;

    font-family:'Montserrat',Arial,sans-serif !important;
    font-size:clamp(42px,4.15vw,66px) !important;
    line-height:.99 !important;
    font-weight:750 !important;
    letter-spacing:-.055em !important;
    text-transform:none !important;
}

.vlx-start h2 span{
    display:block;
    color:var(--vlx-accent);
}

.vlx-start-lead{
    width:min(560px,100%);
    margin:25px 0 0 !important;

    color:var(--vlx-muted) !important;

    font-size:13px !important;
    line-height:1.72 !important;
    font-weight:450 !important;
}

.vlx-start-side-note{
    width:min(500px,100%);
    margin-top:42px;
    display:grid;
    grid-template-columns:42px 1fr;
    gap:15px;
    align-items:start;
}

.vlx-start-side-line{
    position:relative;
    display:block;
    height:1px;
    margin-top:8px;
    background:rgba(23,107,135,.28);
}

.vlx-start-side-line:after{
    content:"";
    position:absolute;
    right:0;
    top:50%;
    width:4px;
    height:4px;
    border-radius:50%;
    background:var(--vlx-cyan);
    transform:translate(50%,-50%);
}

.vlx-start-side-note p{
    margin:0 !important;
    color:#60747D !important;
    font-size:10px !important;
    line-height:1.6 !important;
    font-weight:500 !important;
}

.vlx-start-story{
    position:relative;
    padding-left:46px;
}

.vlx-start-spine{
    position:absolute;
    left:5px;
    top:13px;
    bottom:13px;
    width:1px;
    background:rgba(23,107,135,.14);
    overflow:hidden;
}

.vlx-start-spine span{
    position:absolute;
    left:0;
    top:-38%;
    width:1px;
    height:38%;
    background:linear-gradient(to bottom,transparent,var(--vlx-cyan),transparent);
    filter:drop-shadow(0 0 5px rgba(88,195,217,.45));
    animation:vlxStartSignal 5.2s ease-in-out infinite;
}

.vlx-start-step{
    position:relative;
    display:grid;
    grid-template-columns:minmax(145px,.52fr) minmax(0,1fr);
    gap:clamp(22px,3vw,48px);
    align-items:start;

    min-height:155px;
    padding:28px 0 34px;

    border-top:1px solid var(--vlx-line);

    opacity:.34;
    transform:translateY(20px);
    transition:
        opacity .7s ease,
        transform .7s cubic-bezier(.2,.75,.2,1),
        border-color .45s ease;
}

.vlx-start-step:last-child{
    border-bottom:1px solid var(--vlx-line);
}

.vlx-start-step.is-visible{
    opacity:1;
    transform:none;
}

.vlx-start-step.is-visible{
    border-color:rgba(23,107,135,.20);
}

.vlx-start-mark{
    position:absolute;
    left:-45px;
    top:35px;

    width:9px;
    height:9px;

    border:2px solid rgba(23,107,135,.30);
    border-radius:50%;
    background:#F4F7F8;

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

.vlx-start-step.is-visible .vlx-start-mark{
    transform:scale(1.06);
    border-color:var(--vlx-cyan);
    background:var(--vlx-cyan);
    box-shadow:0 0 0 8px rgba(88,195,217,.075),0 0 24px rgba(88,195,217,.18);
}

.vlx-start-word{
    padding-top:1px;

    color:rgba(11,22,32,.25);

    font-size:clamp(18px,1.55vw,24px);
    line-height:1;
    font-weight:750;
    letter-spacing:-.045em;

    transition:color .55s ease,transform .55s ease;
}

.vlx-start-step.is-visible .vlx-start-word{
    color:var(--vlx-accent);
    transform:translateX(4px);
}

.vlx-start-copy h3{
    margin:0 0 9px !important;

    color:#172A34 !important;

    font-family:'Montserrat',Arial,sans-serif !important;
    font-size:17px !important;
    line-height:1.2 !important;
    font-weight:700 !important;
    letter-spacing:-.025em !important;
    text-transform:none !important;
}

.vlx-start-copy p{
    max-width:590px;
    margin:0 !important;

    color:#74858C !important;

    font-family:'Montserrat',Arial,sans-serif !important;
    font-size:11px !important;
    line-height:1.7 !important;
    font-weight:450 !important;
}

.vlx-start-bottom{
    margin-top:48px;
    padding-top:26px;

    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:32px;

    border-top:1px solid rgba(34,75,91,.13);
}

.vlx-start-bottom-copy{
    display:flex;
    flex-direction:column;
    gap:5px;
}

.vlx-start-bottom-copy strong{
    color:#162A34;
    font-size:12px;
    line-height:1.35;
    font-weight:700;
}

.vlx-start-bottom-copy span{
    color:#7A8A91;
    font-size:10px;
    line-height:1.45;
    font-weight:450;
}

.vlx-start-cta{
    position:relative;

    width:220px;
    height:48px;
    flex:0 0 220px;

    padding:0 50px 0 20px;

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

    border-radius:999px;
    background:var(--vlx-accent);

    color:#fff !important;

    font-size:10px !important;
    line-height:1 !important;
    font-weight:700 !important;
    text-decoration:none !important;

    box-shadow:0 8px 20px rgba(23,107,135,.15);

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

.vlx-start-cta i{
    position:absolute;
    right:6px;
    top:50%;

    width:36px;
    height:36px;

    display:grid;
    place-items:center;

    border-radius:50%;
    background:rgba(255,255,255,.12);

    font-size:14px;
    line-height:1;
    font-style:normal;

    transform:translateY(-50%);
    transition:transform .25s ease,background .25s ease;
}

@media(hover:hover){
    .vlx-start-cta:hover{
        transform:translateY(-2px);
        background:#145F79;
        box-shadow:0 12px 25px rgba(23,107,135,.20);
    }

    .vlx-start-cta:hover i{
        transform:translateY(-50%) rotate(9deg);
        background:rgba(255,255,255,.17);
    }
}

@keyframes vlxStartSignal{
    0%{transform:translateY(-5%);opacity:0}
    18%{opacity:1}
    76%{opacity:1}
    100%{transform:translateY(365%);opacity:0}
}

@keyframes vlxStartOrbit{
    to{transform:rotate(360deg)}
}

@keyframes vlxStartFloat{
    from{transform:translate3d(-18px,-8px,0) scale(.96)}
    to{transform:translate3d(18px,12px,0) scale(1.04)}
}

@media(max-width:1024px){
    .vlx-start{
        padding-top:82px;
    }

    .vlx-start-layout{
        grid-template-columns:1fr;
        gap:58px;
    }

    .vlx-start-intro{
        position:relative;
        top:auto;
    }

    .vlx-start-intro,
    .vlx-start-lead{
        width:min(760px,100%);
    }

    .vlx-start-side-note{
        width:min(650px,100%);
    }

    .vlx-start-story{
        width:min(860px,100%);
        margin-left:auto;
        margin-right:auto;
    }
}

@media(max-width:767px){
    .vlx-start{
        padding:58px 0 50px;
        background:
            radial-gradient(circle at 78% 18%,rgba(88,195,217,.10),transparent 28%),
            linear-gradient(180deg,#F7F9FA 0%,#F3F6F7 100%);
    }

    .vlx-start-shell{
        width:calc(100% - 28px);
    }

    .vlx-start-bg:before{
        background-size:52px 52px;
        opacity:.30;
    }

    .vlx-start-orbit-a{
        width:360px;
        height:360px;
        right:-230px;
        top:-120px;
    }

    .vlx-start-orbit-b{
        display:none;
    }

    .vlx-start-layout{
        gap:42px;
    }

    .vlx-start-kicker{
        margin-bottom:14px;
    }

    .vlx-start h2{
        font-size:35px !important;
        line-height:1.02 !important;
        letter-spacing:-.047em !important;
    }

    .vlx-start-lead{
        margin-top:17px !important;
        font-size:11px !important;
        line-height:1.62 !important;
    }

    .vlx-start-side-note{
        margin-top:27px;
        grid-template-columns:30px 1fr;
        gap:12px;
    }

    .vlx-start-side-note p{
        font-size:9px !important;
        line-height:1.55 !important;
    }

    .vlx-start-story{
        padding-left:27px;
    }

    .vlx-start-spine{
        left:3px;
    }

    .vlx-start-step{
        grid-template-columns:1fr;
        gap:11px;
        min-height:0;
        padding:23px 0 26px;

        opacity:1;
        transform:none;
    }

    .vlx-start-mark{
        left:-28px;
        top:29px;
        width:8px;
        height:8px;
    }

    .vlx-start-word{
        color:var(--vlx-accent);
        font-size:20px;
    }

    .vlx-start-step.is-visible .vlx-start-word{
        transform:none;
    }

    .vlx-start-copy h3{
        margin-bottom:7px !important;
        font-size:15px !important;
    }

    .vlx-start-copy p{
        font-size:10px !important;
        line-height:1.62 !important;
    }

    .vlx-start-bottom{
        margin-top:33px;
        padding-top:22px;
        display:block;
    }

    .vlx-start-bottom-copy strong{
        font-size:11px;
    }

    .vlx-start-bottom-copy span{
        margin-top:3px;
        font-size:9px;
    }

    .vlx-start-cta{
        width:100%;
        height:52px;
        margin-top:16px;
        flex-basis:auto;
    }
}

@media(prefers-reduced-motion:reduce){
    .vlx-start-orbit,
    .vlx-start-glow,
    .vlx-start-spine span{
        animation:none !important;
    }

    .vlx-start-step,
    .vlx-start-word,
    .vlx-start-mark,
    .vlx-start-cta,
    .vlx-start-cta i{
        transition:none !important;
    }
}

/* REMOVE LEGACY EMPTY ELEMENTOR SECTIONS AFTER CHINA START */
body.home .elementor-element-389404a,
body.home .elementor-element-e2e3e29{
    display:none !important;
    height:0 !important;
    min-height:0 !important;
    margin:0 !important;
    padding:0 !important;
    overflow:hidden !important;
}
/* CHINA START PHOTO V1 */
body.home .vlx-start-intro{position:sticky;top:132px;z-index:4;isolation:isolate;padding:34px 55px 40px 8px;color:#fff}
body.home .vlx-start-intro::before{content:"";position:absolute;z-index:-2;left:-75px;right:-280px;top:-58px;bottom:-62px;background:url("/wp-content/uploads/china-start-bg.webp") left center/cover no-repeat;filter:brightness(.60) saturate(.90) contrast(1.05);-webkit-mask-image:linear-gradient(90deg,#000 0%,#000 52%,rgba(0,0,0,.90) 67%,rgba(0,0,0,.48) 82%,transparent 100%);mask-image:linear-gradient(90deg,#000 0%,#000 52%,rgba(0,0,0,.90) 67%,rgba(0,0,0,.48) 82%,transparent 100%)}
body.home .vlx-start-intro::after{content:"";position:absolute;z-index:-1;left:-75px;right:-280px;top:-58px;bottom:-62px;background:linear-gradient(90deg,rgba(3,15,23,.90) 0%,rgba(5,24,34,.73) 47%,rgba(13,48,61,.35) 69%,transparent 100%);-webkit-mask-image:linear-gradient(90deg,#000 0%,#000 66%,rgba(0,0,0,.62) 84%,transparent 100%);mask-image:linear-gradient(90deg,#000 0%,#000 66%,rgba(0,0,0,.62) 84%,transparent 100%)}
body.home .vlx-start-intro .vlx-start-kicker{color:rgba(221,241,246,.78)!important}
body.home .vlx-start-intro .vlx-start-kicker i{background:#58c3d9!important;box-shadow:0 0 16px rgba(88,195,217,.55)}
body.home .vlx-start-intro h2{color:#fff!important;text-shadow:0 3px 28px rgba(0,0,0,.30)}
body.home .vlx-start-intro h2 span{color:#7deaff!important}
body.home .vlx-start-intro .vlx-start-lead{color:rgba(239,247,249,.84)!important;text-shadow:0 2px 14px rgba(0,0,0,.22)}
body.home .vlx-start-intro .vlx-start-side-note p{color:rgba(235,246,248,.72)!important}
body.home .vlx-start-intro .vlx-start-side-line{background:linear-gradient(180deg,#58c3d9,rgba(88,195,217,.10))!important}
/* STORY FINAL POSITION */
@media(min-width:1025px){
body.home .vlx-start{padding-top:70px!important}
body.home .vlx-start-layout{gap:clamp(55px,5vw,85px)!important;align-items:center!important}
body.home .vlx-start-story{width:540px!important;max-width:540px!important;justify-self:end!important;align-self:center!important;margin:0 5px 0 0!important}
body.home .vlx-start-step{min-height:0!important;padding:10px 0 13px!important;opacity:1!important;transform:none!important}
body.home .vlx-start-word{color:var(--vlx-accent)!important;transform:none!important;opacity:1!important}
body.home .vlx-start-copy,body.home .vlx-start-copy h3,body.home .vlx-start-copy p{opacity:1!important}
}
/* ORBITS FOREGROUND */
body.home .vlx-start-bg{z-index:auto!important}
body.home .vlx-start-orbit{z-index:8!important;pointer-events:none!important}
body.home .vlx-start-glow{z-index:0!important}
body.home .vlx-start-orbits-front{position:absolute;inset:0;z-index:12;overflow:hidden;pointer-events:none}
body.home .vlx-start-orbits-front .vlx-start-orbit{z-index:1!important;pointer-events:none!important}
body.home .vlx-start-intro h2 span{color:#58C3D9!important;background:linear-gradient(90deg,#45B9D1 0%,#8DECF6 45%,#58C3D9 72%,#45A8C0 100%)!important;-webkit-background-clip:text!important;background-clip:text!important;-webkit-text-fill-color:transparent!important}

/* CHINA START TITLE DESCENDER FIX */
body.home .vlx-start-intro h2 span{
    padding-bottom:.12em !important;
    margin-bottom:-.12em !important;
    line-height:1.04 !important;
    overflow:visible !important;
}

/* TITLE DESCENDER FIX V2 */
body.home .vlx-start-intro h2 span{
    line-height:.99 !important;
    padding-bottom:.10em !important;
    margin-bottom:-.10em !important;
    overflow:visible !important;
}