/* =========================================================
   VEDIZAKAZ PRICING V2
   ========================================================= */

.vz-pricing-v2 {
    --vz-price-purple: #5628f5;
    --vz-price-purple-dark: #3e15dc;
    --vz-price-green: #16c98d;
    --vz-price-orange: #ff9d45;
    --vz-price-ink: #101018;
    --vz-price-muted: #6f7284;
    --vz-price-line: rgba(64, 56, 111, .10);

    overflow: hidden;

    background:
        linear-gradient(
            180deg,
            #f7f7ff 0,
            #fbfbff 560px,
            #fff 900px
        );

    color: var(--vz-price-ink);
}


/* HERO */

.vz-pricing-v2__hero {
    position: relative;

    padding:
        58px 0
        0;

    isolation: isolate;
}


.vz-pricing-v2__hero::before {
    content: "";

    position: absolute;
    z-index: -3;

    top: -90px;
    left: 50%;

    width: 1150px;
    height: 720px;

    transform:
        translateX(-10%);

    border-radius: 45%;

    background:
        radial-gradient(
            circle at 40% 40%,
            rgba(91, 55, 255, .18),
            rgba(91, 55, 255, .07) 38%,
            transparent 69%
        );

    filter: blur(3px);
}


.vz-pricing-v2__hero::after {
    content: "";

    position: absolute;
    z-index: -4;

    top: 175px;
    right: -80px;

    width: 660px;
    height: 360px;

    border-radius: 44%;

    background:
        linear-gradient(
            135deg,
            rgba(96, 65, 255, .10),
            rgba(143, 130, 255, .03)
        );

    transform:
        rotate(-8deg);

    filter:
        blur(1px);
}


.vz-pricing-v2__hero-grid {
    position: relative;
    z-index: 2;

    display: grid;

    grid-template-columns:
        minmax(0, .9fr)
        minmax(560px, 1.1fr);

    align-items: center;

    width: min(94vw, 1600px);
    max-width: none;

    min-height: 500px;
}


.vz-pricing-v2__copy {
    position: relative;
    z-index: 3;

    max-width: 720px;

    padding:
        30px 0
        105px;
}


.vz-pricing-v2__kicker,
.vz-pricing-v2__section-kicker,
.vz-pricing-v2__bottom-kicker {
    display: inline-flex;

    align-items: center;

    min-height: 34px;

    padding:
        0 18px;

    border-radius: 999px;

    background:
        rgba(86, 40, 245, .08);

    color:
        #4f28e4;

    font-size:
        13px;

    font-weight:
        800;

    letter-spacing:
        .06em;
}


.vz-pricing-v2__copy h1 {
    max-width: 760px;

    margin:
        28px 0
        20px;

    font-size:
        clamp(52px, 5vw, 82px);

    line-height:
        .98;

    letter-spacing:
        -.06em;
}


.vz-pricing-v2__copy h1 span {
    display: block;

    margin-top: 8px;

    color:
        var(--vz-price-purple);

    background:
        linear-gradient(
            120deg,
            #5628f5 0%,
            #4f30fa 42%,
            #7047ff 100%
        );

    -webkit-background-clip:
        text;

    background-clip:
        text;

    -webkit-text-fill-color:
        transparent;
}


.vz-pricing-v2__copy > p {
    max-width: 650px;

    margin: 0;

    color:
        var(--vz-price-muted);

    font-size:
        20px;

    line-height:
        1.48;
}


/* DEVICES */

.vz-pricing-v2__devices {
    position: relative;

    display: flex;

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

    min-height: 500px;

    margin-right:
        -45px;
}


.vz-pricing-v2__devices-glow {
    position: absolute;

    width: 580px;
    height: 380px;

    border-radius: 50%;

    background:
        rgba(92, 54, 255, .17);

    filter:
        blur(70px);
}


.vz-pricing-v2__devices img {
    position: relative;
    z-index: 2;

    display: block;

    width: min(760px, 110%);

    height: auto;

    filter:
        drop-shadow(
            0 36px 44px
            rgba(70, 59, 143, .13)
        );
}


/* SMALL BRAND ACCENTS */

.vz-pricing-v2__accent {
    position: absolute;
    z-index: 4;

    display: block;

    width: 18px;
    height: 72px;

    border-radius: 999px;

    transform:
        rotate(-36deg);

    box-shadow:
        0 12px 30px
        rgba(0, 0, 0, .07);
}


.vz-pricing-v2__accent--green {
    top: 180px;
    left: 48%;

    background:
        linear-gradient(
            180deg,
            #09dfa0,
            #11b982
        );
}


.vz-pricing-v2__accent--orange {
    top: 465px;
    right: 11%;

    width: 12px;
    height: 48px;

    background:
        linear-gradient(
            180deg,
            #ffb45e,
            #ff9140
        );

    transform:
        rotate(39deg);
}


/* PRICE CARD */

.vz-pricing-v2__price-wrap {
    position: relative;
    z-index: 10;

    display: flex;

    justify-content: center;

    margin-top:
        -115px;
}


.vz-pricing-v2__price-card {
    width:
        min(100%, 650px);

    padding:
        23px 42px
        22px;

    border:
        1px solid
        rgba(91, 65, 183, .11);

    border-radius:
        26px;

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

    box-shadow:
        0 28px 75px
        rgba(63, 52, 125, .14);

    text-align:
        center;

    backdrop-filter:
        blur(18px);

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


.vz-pricing-v2__sale-badge {
    display:
        inline-flex;

    align-items:
        center;

    gap:
        7px;

    min-height:
        31px;

    padding:
        0 14px;

    border-radius:
        999px;

    background:
        #e6faef;

    color:
        #148658;

    font-size:
        13px;

    font-weight:
        700;
}


.vz-pricing-v2__sale-badge span {
    width:
        7px;

    height:
        7px;

    border-radius:
        50%;

    background:
        var(--vz-price-green);
}


.vz-pricing-v2__old-price {
    margin-top:
        15px;

    color:
        #85889a;

    font-size:
        20px;

    text-decoration:
        line-through;

    text-decoration-thickness:
        1.5px;
}


.vz-pricing-v2__price {
    display:
        flex;

    align-items:
        flex-end;

    justify-content:
        center;

    gap:
        12px;

    margin-top:
        -2px;
}


.vz-pricing-v2__price strong {
    color:
        var(--vz-price-purple);

    font-size:
        clamp(62px, 6vw, 92px);

    line-height:
        1;

    letter-spacing:
        -.06em;
}


.vz-pricing-v2__price span {
    padding-bottom:
        10px;

    color:
        #6f7286;

    font-size:
        21px;

    font-weight:
        600;
}


.vz-pricing-v2__price-note {
    max-width:
        460px;

    margin:
        12px auto
        18px;

    color:
        #77798a;

    font-size:
        14px;

    line-height:
        1.45;
}


.vz-pricing-v2__primary,
.vz-pricing-v2__bottom-button {
    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    gap:
        14px;

    min-height:
        58px;

    border-radius:
        12px;

    background:
        linear-gradient(
            135deg,
            #6c35ff,
            #4d1ff1
        );

    box-shadow:
        0 12px 28px
        rgba(84, 38, 240, .22);

    color:
        #fff;

    font-size:
        16px;

    font-weight:
        700;

    text-decoration:
        none;

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


.vz-pricing-v2__primary:hover,
.vz-pricing-v2__bottom-button:hover {
    transform:
        translateY(-2px);

    box-shadow:
        0 17px 35px
        rgba(84, 38, 240, .28);
}


.vz-pricing-v2__primary span,
.vz-pricing-v2__bottom-button span {
    font-size:
        22px;

    line-height:
        1;
}


.vz-pricing-v2__login {
    display:
        block;

    min-height:
        43px;

    margin-top:
        10px;

    padding:
        11px 14px;

    border:
        1px solid
        rgba(86, 40, 245, .31);

    border-radius:
        10px;

    color:
        #333544;

    font-size:
        14px;

    text-decoration:
        none;
}


.vz-pricing-v2__login strong {
    color:
        #191924;
}


/* INCLUDED */

.vz-pricing-v2__included {
    padding:
        86px 0
        36px;

    background:
        #fff;
}


.vz-pricing-v2__included > .vz-container,
.vz-pricing-v2__bottom > .vz-container {
    width:
        min(92vw, 1500px);

    max-width:
        none;
}


.vz-pricing-v2__section-head {
    display:
        flex;

    align-items:
        flex-end;

    justify-content:
        space-between;

    gap:
        40px;

    margin-bottom:
        34px;
}


.vz-pricing-v2__section-kicker {
    min-height:
        30px;

    padding:
        0 13px;

    font-size:
        11px;
}


.vz-pricing-v2__section-head h2 {
    margin:
        11px 0
        0;

    font-size:
        clamp(34px, 3.2vw, 52px);

    line-height:
        1.05;

    letter-spacing:
        -.045em;
}


.vz-pricing-v2__section-head > p {
    max-width:
        460px;

    margin:
        0 0 5px;

    color:
        var(--vz-price-muted);

    font-size:
        16px;

    line-height:
        1.5;
}


/* FEATURES */

.vz-pricing-v2__features {
    display:
        grid;

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

    gap:
        14px;
}


.vz-pricing-feature {
    display:
        grid;

    grid-template-columns:
        72px 1fr;

    gap:
        20px;

    align-items:
        start;

    min-height:
        132px;

    padding:
        23px;

    border:
        1px solid
        var(--vz-price-line);

    border-radius:
        17px;

    background:
        #fff;

    box-shadow:
        0 10px 32px
        rgba(52, 43, 100, .045);

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


.vz-pricing-feature:hover {
    transform:
        translateY(-3px);

    border-color:
        rgba(86, 40, 245, .14);

    box-shadow:
        0 18px 42px
        rgba(52, 43, 100, .08);
}


.vz-pricing-feature__icon {
    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    width:
        64px;

    height:
        64px;

    border-radius:
        17px;
}


.vz-pricing-feature__icon svg {
    width:
        30px;

    height:
        30px;

    fill:
        none;

    stroke:
        currentColor;

    stroke-width:
        1.8;

    stroke-linecap:
        round;

    stroke-linejoin:
        round;
}


.vz-pricing-feature--purple
.vz-pricing-feature__icon {
    background:
        #f0ecff;

    color:
        var(--vz-price-purple);
}


.vz-pricing-feature--green
.vz-pricing-feature__icon {
    background:
        #e6fbf2;

    color:
        #12a96f;
}


.vz-pricing-feature--orange
.vz-pricing-feature__icon {
    background:
        #fff1e4;

    color:
        #ee8731;
}


.vz-pricing-feature h3 {
    margin:
        1px 0
        5px;

    font-size:
        18px;

    line-height:
        1.15;

    letter-spacing:
        -.02em;
}


.vz-pricing-feature p {
    margin:
        0;

    color:
        #75788a;

    font-size:
        14px;

    line-height:
        1.43;
}


/* BOTTOM CTA */

.vz-pricing-v2__bottom {
    padding:
        24px 0
        80px;

    background:
        #fff;
}


.vz-pricing-v2__bottom-card {
    position:
        relative;

    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        40px;

    overflow:
        hidden;

    padding:
        30px 38px;

    border:
        1px solid
        rgba(88, 63, 197, .10);

    border-radius:
        22px;

    background:
        linear-gradient(
            105deg,
            #f6f4ff,
            #f1f0ff 55%,
            #ebeaff
        );
}


.vz-pricing-v2__bottom-card::before {
    content: "";

    position:
        absolute;

    right:
        24%;

    bottom:
        -120px;

    width:
        420px;

    height:
        250px;

    border:
        55px solid
        rgba(98, 68, 255, .07);

    border-radius:
        45%;

    transform:
        rotate(12deg);
}


.vz-pricing-v2__bottom-kicker {
    min-height:
        27px;

    padding:
        0 11px;

    font-size:
        10px;
}


.vz-pricing-v2__bottom h2 {
    position:
        relative;
    z-index:
        2;

    margin:
        8px 0
        3px;

    font-size:
        clamp(26px, 2.4vw, 38px);

    line-height:
        1.05;

    letter-spacing:
        -.04em;
}


.vz-pricing-v2__bottom p {
    position:
        relative;
    z-index:
        2;

    margin:
        0;

    color:
        #77798a;

    font-size:
        15px;
}


.vz-pricing-v2__bottom-button {
    position:
        relative;
    z-index:
        2;

    flex:
        0 0 310px;

    padding:
        0 25px;
}


/* TABLET */

@media (max-width: 1180px) {

    .vz-pricing-v2__hero-grid {
        grid-template-columns:
            minmax(0, .95fr)
            minmax(440px, 1.05fr);

        min-height:
            440px;
    }


    .vz-pricing-v2__copy h1 {
        font-size:
            clamp(48px, 6vw, 68px);
    }


    .vz-pricing-v2__devices {
        min-height:
            420px;
    }


    .vz-pricing-v2__features {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

}


/* MOBILE */

@media (max-width: 760px) {

    .vz-pricing-v2__hero {
        padding-top:
            28px;
    }


    .vz-pricing-v2__hero-grid {
        display:
            block;

        width:
            min(92vw, 680px);

        min-height:
            0;
    }


    .vz-pricing-v2__copy {
        max-width:
            none;

        padding:
            10px 0
            12px;
    }


    .vz-pricing-v2__kicker {
        min-height:
            29px;

        padding:
            0 13px;

        font-size:
            11px;
    }


    .vz-pricing-v2__copy h1 {
        margin:
            20px 0
            16px;

        font-size:
            clamp(42px, 12.4vw, 58px);

        line-height:
            .98;
    }


    .vz-pricing-v2__copy > p {
        max-width:
            560px;

        font-size:
            17px;

        line-height:
            1.48;
    }


    .vz-pricing-v2__devices {
        min-height:
            auto;

        margin:
            12px -13vw
            0;
    }


    .vz-pricing-v2__devices img {
        width:
            112%;
    }


    .vz-pricing-v2__accent--green {
        top:
            410px;

        left:
            auto;

        right:
            8%;

        width:
            11px;

        height:
            44px;
    }


    .vz-pricing-v2__accent--orange {
        display:
            none;
    }


    .vz-pricing-v2__price-wrap {
        width:
            min(92vw, 680px);

        margin-top:
            -28px;
    }


    .vz-pricing-v2__price-card {
        padding:
            20px 18px
            18px;

        border-radius:
            21px;
    }


    .vz-pricing-v2__old-price {
        font-size:
            17px;
    }


    .vz-pricing-v2__price {
        gap:
            8px;
    }


    .vz-pricing-v2__price strong {
        font-size:
            clamp(58px, 19vw, 78px);
    }


    .vz-pricing-v2__price span {
        padding-bottom:
            7px;

        font-size:
            18px;
    }


    .vz-pricing-v2__primary {
        min-height:
            54px;
    }


    .vz-pricing-v2__included {
        padding:
            62px 0
            22px;
    }


    .vz-pricing-v2__included > .vz-container,
    .vz-pricing-v2__bottom > .vz-container {
        width:
            min(92vw, 680px);
    }


    .vz-pricing-v2__section-head {
        display:
            block;

        margin-bottom:
            23px;
    }


    .vz-pricing-v2__section-head > p {
        margin-top:
            12px;
    }


    .vz-pricing-v2__features {
        grid-template-columns:
            1fr;

        gap:
            11px;
    }


    .vz-pricing-feature {
        grid-template-columns:
            58px 1fr;

        gap:
            15px;

        min-height:
            0;

        padding:
            18px;

        border-radius:
            15px;
    }


    .vz-pricing-feature__icon {
        width:
            52px;

        height:
            52px;

        border-radius:
            14px;
    }


    .vz-pricing-feature__icon svg {
        width:
            25px;

        height:
            25px;
    }


    .vz-pricing-v2__bottom {
        padding:
            18px 0
            52px;
    }


    .vz-pricing-v2__bottom-card {
        display:
            block;

        padding:
            24px 20px;

        border-radius:
            18px;
    }


    .vz-pricing-v2__bottom-button {
        width:
            100%;

        margin-top:
            20px;

        min-height:
            54px;
    }

}


/* NO HOVER MOVEMENT ON TOUCH */

@media (hover: none) {

    .vz-pricing-feature:hover,
    .vz-pricing-v2__primary:hover,
    .vz-pricing-v2__bottom-button:hover {
        transform:
            none;
    }

}