

/* =========================================================
   SERVICES FINAL LEAD
   ========================================================= */

body.page-id-737 .vls-service-lead{
    --vlsl-cyan:#58C3D9;
    --vlsl-cyan-soft:#8DECF6;
    --vlsl-blue:#176B87;
    --vlsl-dark:#071923;
    --vlsl-dark-2:#0A2632;

    position:relative;

    overflow:hidden;

    padding:
        72px
        0
        76px;

    color:#fff;

    background:
        radial-gradient(
            circle at 82% 8%,
            rgba(88,195,217,.13),
            transparent 28%
        ),
        radial-gradient(
            circle at 10% 88%,
            rgba(23,107,135,.16),
            transparent 26%
        ),
        linear-gradient(
            135deg,
            #06151E 0%,
            #081D27 52%,
            #0A2834 100%
        );
}


body.page-id-737 .vls-service-lead-shell{
    position:relative;
    z-index:3;

    display:grid;

    grid-template-columns:
        minmax(0,.78fr)
        minmax(600px,1.22fr);

    gap:
        clamp(50px,6vw,90px);

    align-items:start;

    width:
        min(1180px,calc(100% - 48px));

    margin:
        0 auto;
}


/* =========================================================
   LEFT
   ========================================================= */

body.page-id-737 .vls-service-lead-copy{
    position:sticky;
    top:110px;

    padding-top:
        8px;
}


body.page-id-737 .vls-service-lead-kicker{
    display:flex;

    align-items:center;

    gap:
        11px;

    margin-bottom:
        15px;

    color:
        rgba(179,219,227,.66);

    font-size:
        9px;

    line-height:
        1;

    font-weight:
        800;

    letter-spacing:
        .16em;
}


body.page-id-737 .vls-service-lead-kicker i{
    display:block;

    width:
        34px;

    height:
        1px;

    background:
        linear-gradient(
            90deg,
            var(--vlsl-cyan),
            transparent
        );
}


body.page-id-737 .vls-service-lead-copy h2{
    margin:
        0
        0
        20px;

    color:#F5FAFB;

    font-size:
        clamp(39px,4vw,59px);

    line-height:
        .99;

    font-weight:
        840;

    letter-spacing:
        -.052em;
}


body.page-id-737 .vls-service-lead-copy h2 span{
    display:block;

    color:
        var(--vlsl-cyan);
}


body.page-id-737 .vls-service-lead-intro{
    max-width:
        500px;

    margin:
        0;

    color:
        rgba(214,231,235,.67);

    font-size:
        14px;

    line-height:
        1.66;

    font-weight:
        500;
}


body.page-id-737 .vls-service-lead-summary{
    display:grid;

    gap:
        0;

    margin-top:
        35px;

    border-top:
        1px solid
        rgba(141,236,246,.09);
}


body.page-id-737 .vls-service-lead-summary > div{
    display:grid;

    grid-template-columns:
        86px
        1fr;

    gap:
        18px;

    padding:
        17px
        0;

    border-bottom:
        1px solid
        rgba(141,236,246,.08);
}


body.page-id-737 .vls-service-lead-summary span{
    color:
        rgba(141,236,246,.52);

    font-size:
        8px;

    font-weight:
        800;

    letter-spacing:
        .14em;
}


body.page-id-737 .vls-service-lead-summary strong{
    color:
        rgba(237,246,248,.82);

    font-size:
        12.5px;

    line-height:
        1.48;

    font-weight:
        600;
}


/* =========================================================
   FORM
   ========================================================= */

body.page-id-737 .vls-service-lead-form{
    position:relative;

    padding:
        27px;

    border:
        1px solid
        rgba(141,236,246,.13);

    border-radius:
        30px;

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.075),
            rgba(255,255,255,.025)
        );

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

    backdrop-filter:
        blur(18px);

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


body.page-id-737 .vls-service-lead-form::before{
    content:"";

    position:absolute;

    left:
        30px;

    right:
        30px;

    top:
        0;

    height:
        1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(141,236,246,.42),
            transparent
        );
}


body.page-id-737 .vls-service-lead-form-top{
    margin-bottom:
        24px;
}


body.page-id-737 .vls-service-lead-form-top small{
    display:block;

    margin-bottom:
        8px;

    color:
        rgba(141,236,246,.55);

    font-size:
        8px;

    font-weight:
        800;

    letter-spacing:
        .15em;
}


body.page-id-737 .vls-service-lead-form-top strong{
    display:block;

    color:#fff;

    font-size:
        26px;

    line-height:
        1.08;

    font-weight:
        780;

    letter-spacing:
        -.03em;
}


body.page-id-737 .vls-service-lead-form-top p{
    margin:
        7px
        0
        0;

    color:
        rgba(212,229,233,.56);

    font-size:
        11.5px;

    line-height:
        1.55;
}


/* =========================================================
   GROUPS
   ========================================================= */

body.page-id-737 .vls-service-lead-group{
    min-width:0;

    margin:
        0
        0
        22px;

    padding:0;

    border:0;
}


body.page-id-737 .vls-service-lead-group legend{
    display:block;

    width:100%;

    margin-bottom:
        10px;

    color:
        rgba(230,241,244,.72);

    font-size:
        10px;

    line-height:
        1.3;

    font-weight:
        700;
}


body.page-id-737 .vls-service-lead-format{
    display:grid;

    grid-template-columns:
        repeat(3,1fr);

    gap:
        8px;
}


body.page-id-737 .vls-service-lead-services{
    display:grid;

    grid-template-columns:
        repeat(3,minmax(0,1fr));

    gap:
        8px;
}


body.page-id-737
.vls-service-lead-format label,

body.page-id-737
.vls-service-lead-services label{
    position:relative;

    cursor:pointer;
}


body.page-id-737
.vls-service-lead-format input,

body.page-id-737
.vls-service-lead-services input{
    position:absolute;

    opacity:0;

    pointer-events:none;
}


body.page-id-737
.vls-service-lead-format span,

body.page-id-737
.vls-service-lead-services span{
    display:flex;

    align-items:center;

    min-height:
        42px;

    padding:
        9px
        12px;

    border:
        1px solid
        rgba(255,255,255,.09);

    border-radius:
        13px;

    color:
        rgba(224,237,240,.67);

    background:
        rgba(255,255,255,.035);

    font-size:
        10px;

    line-height:
        1.25;

    font-weight:
        600;

    transition:
        border-color .22s ease,
        background .22s ease,
        color .22s ease,
        transform .22s ease;
}


body.page-id-737
.vls-service-lead-format label:hover span,

body.page-id-737
.vls-service-lead-services label:hover span{
    border-color:
        rgba(88,195,217,.25);

    color:#fff;

    transform:
        translateY(-1px);
}


body.page-id-737
.vls-service-lead-format input:checked + span,

body.page-id-737
.vls-service-lead-services input:checked + span{
    color:#fff;

    border-color:
        rgba(88,195,217,.38);

    background:
        linear-gradient(
            135deg,
            rgba(23,107,135,.38),
            rgba(88,195,217,.11)
        );

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


/* =========================================================
   FIELDS
   ========================================================= */

body.page-id-737 .vls-service-lead-fields{
    display:grid;

    grid-template-columns:
        repeat(2,minmax(0,1fr));

    gap:
        10px;
}


body.page-id-737 .vls-service-lead-field{
    display:flex;

    flex-direction:column;

    gap:
        7px;

    min-width:0;

    padding:
        11px
        14px
        12px;

    border:
        1px solid
        rgba(255,255,255,.085);

    border-radius:
        14px;

    background:
        rgba(255,255,255,.035);

    transition:
        border-color .22s ease,
        background .22s ease;
}


body.page-id-737
.vls-service-lead-field:focus-within{
    border-color:
        rgba(88,195,217,.38);

    background:
        rgba(255,255,255,.055);
}


body.page-id-737 .vls-service-lead-field > span{
    color:
        rgba(177,207,214,.53);

    font-size:
        8px;

    line-height:
        1;

    font-weight:
        750;

    letter-spacing:
        .075em;

    text-transform:
        uppercase;
}


body.page-id-737
.vls-service-lead-field input,

body.page-id-737
.vls-service-lead-field textarea{
    width:100%;

    min-width:0;

    margin:0;

    padding:0;

    border:0;

    outline:0;

    color:#F4F9FA;

    background:transparent;

    box-shadow:none;

    font:
        inherit;

    font-size:
        13px;

    line-height:
        1.45;

    resize:none;
}


body.page-id-737
.vls-service-lead-field-wide{
    grid-column:
        1 / -1;
}


body.page-id-737
.vls-service-lead-field textarea{
    min-height:
        62px;
}


body.page-id-737
.vls-service-lead-field.is-invalid{
    border-color:
        rgba(218,102,102,.56);
}


/* =========================================================
   BOTTOM
   ========================================================= */

body.page-id-737 .vls-service-lead-bottom{
    display:flex;

    align-items:center;

    gap:
        18px;

    margin-top:
        16px;
}


body.page-id-737 .vls-service-lead-submit{
    position:relative;

    display:inline-flex;

    flex:
        0 0 auto;

    align-items:center;

    justify-content:
        space-between;

    gap:
        16px;

    width:
        224px;

    height:
        54px;

    padding:
        0
        7px
        0
        20px;

    border:0;

    border-radius:
        17px;

    color:#fff;

    background:
        linear-gradient(
            135deg,
            #176B87,
            #1B7895
        );

    box-shadow:
        0 14px 30px
        rgba(23,107,135,.23),
        inset 0 1px 0
        rgba(255,255,255,.12);

    cursor:pointer;

    font:
        inherit;

    font-size:
        11px;

    font-weight:
        750;

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


body.page-id-737
.vls-service-lead-submit:hover{
    transform:
        translateY(-2px);

    box-shadow:
        0 18px 34px
        rgba(23,107,135,.28),
        inset 0 1px 0
        rgba(255,255,255,.14);
}


body.page-id-737
.vls-service-lead-submit i{
    display:flex;

    align-items:center;

    justify-content:center;

    width:
        39px;

    height:
        39px;

    flex:
        0 0 39px;

    border:
        1px solid
        rgba(255,255,255,.13);

    border-radius:
        13px;

    background:
        rgba(255,255,255,.10);
}


body.page-id-737
.vls-service-lead-submit svg{
    display:block;

    width:
        17px;

    height:
        17px;
}


body.page-id-737
.vls-service-lead-submit path{
    fill:none;

    stroke:
        currentColor;

    stroke-width:
        1.8;

    stroke-linecap:
        round;

    stroke-linejoin:
        round;
}


body.page-id-737
.vls-service-lead-bottom > p{
    max-width:
        250px;

    margin:0;

    color:
        rgba(181,208,214,.42);

    font-size:
        8px;

    line-height:
        1.45;
}


body.page-id-737
.vls-service-lead-status{
    min-height:
        16px;

    margin-top:
        10px;

    color:
        rgba(222,239,242,.70);

    font-size:
        10px;

    line-height:
        1.4;
}


body.page-id-737
.vls-service-lead-status.is-success{
    color:
        #8DECF6;
}


body.page-id-737
.vls-service-lead-status.is-error{
    color:
        #E49A9A;
}


body.page-id-737 .vls-service-lead-hp{
    position:absolute !important;

    left:-99999px !important;

    width:1px !important;
    height:1px !important;

    opacity:0 !important;
}


/* =========================================================
   BACKGROUND
   ========================================================= */

body.page-id-737 .vls-service-lead-bg{
    position:absolute;

    inset:0;

    z-index:0;

    pointer-events:none;
}


body.page-id-737 .vls-service-lead-orbit{
    position:absolute;

    border:
        1px solid
        rgba(88,195,217,.07);

    border-radius:
        50%;

    animation:
        vlslOrbit
        30s
        linear
        infinite;
}


body.page-id-737
.vls-service-lead-orbit::after{
    content:"";

    position:absolute;

    width:
        7px;

    height:
        7px;

    top:
        14%;

    left:
        14%;

    border-radius:
        50%;

    background:
        #58C3D9;

    box-shadow:
        0 0 0 8px
        rgba(88,195,217,.05),
        0 0 26px
        rgba(88,195,217,.27);
}


body.page-id-737
.vls-service-lead-orbit-a{
    width:
        520px;

    height:
        520px;

    left:
        -350px;

    top:
        -120px;
}


body.page-id-737
.vls-service-lead-orbit-b{
    width:
        390px;

    height:
        390px;

    right:
        -270px;

    bottom:
        -120px;

    animation-direction:
        reverse;

    animation-duration:
        36s;
}


@keyframes vlslOrbit{

    from{
        transform:rotate(0deg);
    }

    to{
        transform:rotate(360deg);
    }

}


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

@media(max-width:1050px){

    body.page-id-737
    .vls-service-lead-shell{
        grid-template-columns:
            1fr;

        gap:
            38px;
    }


    body.page-id-737
    .vls-service-lead-copy{
        position:relative;

        top:auto;

        max-width:
            760px;
    }

}


@media(max-width:767px){

    body.page-id-737
    .vls-service-lead{
        padding:
            48px
            0
            54px;
    }


    body.page-id-737
    .vls-service-lead-shell{
        width:
            calc(100% - 28px);

        gap:
            27px;
    }


    body.page-id-737
    .vls-service-lead-copy h2{
        font-size:
            clamp(35px,10vw,45px);

        line-height:
            1;
    }


    body.page-id-737
    .vls-service-lead-intro{
        font-size:
            12.5px;

        line-height:
            1.62;
    }


    body.page-id-737
    .vls-service-lead-summary{
        margin-top:
            25px;
    }


    body.page-id-737
    .vls-service-lead-summary > div{
        grid-template-columns:
            72px
            1fr;

        gap:
            12px;

        padding:
            14px
            0;
    }


    body.page-id-737
    .vls-service-lead-form{
        padding:
            18px;

        border-radius:
            23px;
    }


    body.page-id-737
    .vls-service-lead-form-top strong{
        font-size:
            23px;
    }


    body.page-id-737
    .vls-service-lead-format{
        grid-template-columns:
            1fr;
    }


    body.page-id-737
    .vls-service-lead-services{
        grid-template-columns:
            repeat(2,minmax(0,1fr));

        gap:
            7px;
    }


    body.page-id-737
    .vls-service-lead-services span{
        min-height:
            46px;

        padding:
            9px
            10px;

        font-size:
            9.5px;
    }


    body.page-id-737
    .vls-service-lead-fields{
        grid-template-columns:
            1fr;
    }


    body.page-id-737
    .vls-service-lead-field-wide{
        grid-column:auto;
    }


    body.page-id-737
    .vls-service-lead-bottom{
        align-items:flex-start;

        flex-direction:column;

        gap:
            10px;
    }


    body.page-id-737
    .vls-service-lead-submit{
        width:
            225px;

        max-width:
            100%;
    }


    body.page-id-737
    .vls-service-lead-bottom > p{
        max-width:
            250px;
    }

}


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

    body.page-id-737
    .vls-service-lead-orbit{
        animation:none !important;
    }

}


/* =========================================================
   SERVICES LEAD FINAL CLEANUP
   ========================================================= */


/* блок FORMAT / SERVICES / RESULT больше не используется */

body.page-id-737 .vls-service-lead-summary{
    display:none !important;
}


/* текст после заголовка теперь самостоятельный */

body.page-id-737 .vls-service-lead-intro{
    max-width:520px !important;

    margin:0 !important;

    color:
        rgba(220,234,238,.72) !important;

    font-size:
        14.5px !important;

    line-height:
        1.68 !important;

    font-weight:
        500 !important;
}


/* =========================================================
   SITE STANDARD BUTTON
   ========================================================= */

/*
 * Кнопка использует основной класс .vls-btn
 * из страницы услуг.
 * Здесь только убираем возможные свойства старой формы.
 */

body.page-id-737
.vls-service-lead
.vls-service-lead-site-submit{
    flex:
        0 0 auto !important;

    margin:
        0 !important;

    cursor:
        pointer !important;

    font-family:
        inherit !important;
}


body.page-id-737
.vls-service-lead
.vls-service-lead-site-submit svg{
    display:block;

    width:
        20px;

    height:
        20px;
}


/* старый кастомный submit больше нигде не нужен */

body.page-id-737
.vls-service-lead
.vls-service-lead-submit{
    display:none !important;
}


@media(max-width:767px){

    body.page-id-737
    .vls-service-lead-intro{
        max-width:none !important;

        font-size:
            13px !important;

        line-height:
            1.62 !important;
    }

}

/* === END SERVICES LEAD FINAL CLEANUP === */


/* =========================================================
   SERVICES FORM BUTTON COLOR FIX
   ========================================================= */

body.page-id-737
.vls-service-lead
.vls-service-lead-site-submit{
    color:#FFFFFF !important;

    background:
        linear-gradient(
            135deg,
            #176B87 0%,
            #1B7895 100%
        ) !important;

    border:
        1px solid
        rgba(88,195,217,.28) !important;

    box-shadow:
        0 14px 30px
        rgba(23,107,135,.26),
        inset 0 1px 0
        rgba(255,255,255,.12) !important;
}


body.page-id-737
.vls-service-lead
.vls-service-lead-site-submit span{
    color:#FFFFFF !important;
}


body.page-id-737
.vls-service-lead
.vls-service-lead-site-submit i{
    color:#FFFFFF !important;

    background:
        rgba(255,255,255,.10) !important;

    border-color:
        rgba(255,255,255,.16) !important;
}


body.page-id-737
.vls-service-lead
.vls-service-lead-site-submit:hover{
    color:#FFFFFF !important;

    background:
        linear-gradient(
            135deg,
            #1A7693 0%,
            #2185A2 100%
        ) !important;

    box-shadow:
        0 18px 36px
        rgba(23,107,135,.30),
        inset 0 1px 0
        rgba(255,255,255,.14) !important;
}


/* === END SERVICES FORM BUTTON COLOR FIX === */
