.ai-landing {
    font-size:18px;
    --xxl-padding:80px;
    --block-padding:112px;
}

.ai-landing .header {
    height:63vw;
    min-height:430px;
    max-height:600px;
    background:url(/templates/rsflat/resource/img/ai/back.svg) no-repeat center center;
    background-size: cover;
    overflow: hidden;
    position: relative;
    display:flex;
    align-items: center;
    justify-content: center;
    color:white;
}

.ai-landing .header .back1 {
    background:url(/templates/rsflat/resource/img/ai/ai-graph.svg) no-repeat center center;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
}

.ai-landing .header .back2 {
    position: absolute;
    width: 100%;
    height: 60%;
    bottom: -32px;
    left: 0;
    backdrop-filter: blur(42px);
    z-index: 2;
    -webkit-mask: radial-gradient(closest-side at center, black 50%, transparent 100%);
    mask: radial-gradient(closest-side at center, black 50%, transparent 100%);
    transform: rotate(350deg);
}

.ai-landing .inner-header {
    padding:0 20px;
    max-width:690px;
    text-align: center;
    position: relative;
    z-index:2;
}

.ai-landing .inner-header h1 {
    font-weight:bold;
    font-size:3.33em;
    color:white;
}

.ai-landing .inner-header .subtext {
    font-size:1em;
}

.ai-landing h2 {
    font-size:2.8em;
    margin-bottom:32px;
    font-weight: bold;
    line-height: 102%;
}

.ai-landing .field-fill {
    background:url(/templates/rsflat/resource/img/ai/lines.svg) no-repeat 50% 0;

    text-align:center;
    padding:120px 0;
}

.ai-landing .block-header {
    max-width:710px;
    margin-left:auto;
    margin-right:auto;
    margin-bottom:var(--xxl-padding);
    text-align: center;
}

.integration .block-header a {
    color:white;
    text-decoration: underline;
}

.integration .block-header a:hover {
    color:#FF4081;
}


.ai-landing .red {
    color:#FF4081;
    font-weight:500;
}

.ai-landing .violet {
    color: #6414FF;
}

.ai-landing .icon-list {
    display:flex;
    gap:24px;
    justify-content: space-between;
}

.ai-landing .icon-list li {
    display:flex;
    flex-direction: column;
    align-items: center;
}

.ai-landing .icon-list .icon {
    width:64px;
    height:64px;
    background: #EDEEEF;
    display:flex;
    align-items: center;
    justify-content: center;
    border-radius:13px;
    margin-bottom:16px;
}

.ai-landing .icon-list .text {
    max-width:285px;
    font-size:1.1em;
    font-weight:bold;
}

.ai-landing .multi-fill {
    text-align:center;
    padding:120px 0;
    background:url(/templates/rsflat/resource/img/ai/hand.svg) no-repeat 50% 0;
}

.ai-landing .multi-fill .examples {
    display:flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.ai-landing .multi-fill .examples .step {
    width:calc(50% - 16px);
    position:relative;
}

.ai-landing .multi-fill .examples .step .in {
    position:absolute;
    top:0;
    left:0;
    right:0;
    padding:36px 52px;
    text-align: left;
    font-size:26px;
    font-weight:bold;
    color:white;
}

.ai-landing h3 {
    font-size:1.16em;
    text-transform: uppercase;
    color:#898C93;
    margin-top:var(--xxl-padding);
    text-align: center;
}

.ai-landing .prompts {
    padding:120px 0;
    background:url(/templates/rsflat/resource/img/ai/pen.svg) no-repeat 50% 0;
}

.ai-landing .prompts .features {
    display:flex;
    justify-content: space-around;
    gap:24px;
}

.ai-landing .prompts .features .item {
    background: #F8F8F8;
    padding:32px;
    max-width:488px;
    box-sizing: border-box;
    border-radius: 36px;
}

.ai-landing .prompts .features .item .image {
    display:flex;
    gap:16px;
    align-items: center;
    font-size:1.16em;
    font-weight:bold;
    margin-bottom:20px;
    line-height: 1.2;
}

.ai-landing .examples {
    display:flex;
    flex-wrap: wrap;
    gap:32px;
    justify-content: center;
}

.ai-landing .examples .item {
    background: #F6F6F7;
    padding:32px;
    box-sizing: border-box;
    border-radius:36px;
    font-size:0.9em;
}

.ai-landing .examples .item .red {
    font-weight:normal;
}

.ai-landing .examples .item1 { max-width:45% }
.ai-landing .examples .item2 { max-width:38% }
.ai-landing .examples .item3 { max-width:45% }
.ai-landing .examples .item4 { max-width:49% }
.ai-landing .examples .item5 { max-width:39% }
.ai-landing .examples .item6 { max-width:49% }
.ai-landing .examples .item7 { max-width:45% }

.ai-landing .chat {
    padding:120px 0;
    background:url(/templates/rsflat/resource/img/ai/chat.svg) no-repeat 50% 0;
}

.ai-landing .useful {
    display:flex;
    gap:32px;
}

.ai-landing .useful .help {
    background: #F6F6F7;
    padding:52px;
    flex:1;
    border-radius:36px;
}

.ai-landing .useful .help h3 {
    text-align: left;
    margin-top:0;
    font-size:1.7em;
    font-weight:bold;
    color:black;
    margin-bottom:40px;
}

.ai-landing .useful .help dl dt {
    font-size:1em;
    margin-bottom:16px;
}

.ai-landing .useful .help dl dd {
    font-size:0.9em;
    margin-bottom:32px;
}

.ai-landing .useful .help dl dd:last-child {
    margin-bottom:0;
}

.ai-landing .useful .image {
    border-radius:36px;
    background:#F8397D;
    text-align: center;
}

.ai-landing .ready {
    background: #1D2331;
    padding:var(--block-padding) 0;
    position:relative;
}

.ai-landing .ready i {
    position:absolute;
    left:50%;
}

.ai-landing .ready .star1 {
    width:252px;
    height:252px;
    background:url(/templates/rsflat/resource/img/ai/star.svg) no-repeat center center;
    top: 42%;
    margin-left: -44%;
    filter:blur(5px);
}
.ai-landing .ready .star2 {
    width:44px;
    height:44px;
    background:url(/templates/rsflat/resource/img/ai/star2.svg) no-repeat center center;
    background-size:cover;
    top: 43.5%;
    margin-left: -30.9%;
    filter:blur(2px);
}
.ai-landing .ready .star3 {
    width:95px;
    height:95px;
    background:url(/templates/rsflat/resource/img/ai/star3.svg) no-repeat center center;
    background-size:cover;
    top: 47%;
    margin-left: 16.8%;
    filter:blur(3px);
}
.ai-landing .ready .star4 {
    width:50px;
    height:50px;
    background:url(/templates/rsflat/resource/img/ai/star4.svg) no-repeat center center;
    background-size:cover;
    top: 71.5%;
    margin-left: 25%;
    filter:blur(1px);
}

.ai-landing .ready .circle1 {
    width: 173px;
    height: 173px;
    position: absolute;
    top: 140px;
    left: 50%;
    margin-left: -300px;
    background: #D9D9D9;
    border-radius: 50%;
    filter: blur(170px);
}

.ai-landing .center-place {
    max-width:740px;
    margin:0 auto;
    text-align:center;
    color:white;
}

.ai-landing .center-place h2 {
    color:white;
}

.ai-landing .free-bonus {
    color:white;
    margin:var(--xxl-padding) auto 0;
    padding-top:152px;

    background:url(/templates/rsflat/resource/img/ai/100.svg) no-repeat top center;
    font-size:1.7em;
    font-weight:bold;
    max-width:578px;
    text-align: center;
}

.ai-landing .ai-products {
    margin-top:43px;
    padding:var(--block-padding) 0;
    background:url(/templates/rsflat/resource/img/ai/567.svg) no-repeat 50% 0;
}

.ai-landing .integration {
    background:#1D2331;
    padding:var(--block-padding) 0;
    color:white;
}

.ai-landing .integration h2 {
    color:white;
}

.ai-landing .integration h3 {
    margin-top:0;
}

.ai-landing .need {
    display:flex;
    flex-wrap: wrap;
    gap:24px;
    margin-bottom:var(--xxl-padding);
}

.ai-landing .need .item {
    background:#2b303d;
    padding:24px;
    text-align: center;
    font-weight: bold;
    box-sizing: border-box;
    border-radius:36px;
    width:calc(25% - 18px);
}

.ai-landing .need .item .image {
    margin-bottom:24px;
}

.ai-landing .programming {
    text-align: center;
}

.ai-landing .programming h3 {
    color:#F26A99;
}

.ai-landing .image-texts {
    display:grid;
    grid-template-columns: calc(50% - 12px) calc(50% - 12px);
    gap:24px;
    margin-top:var(--xxl-padding);
    grid-template-areas:
            "image block1"
            "image block2";
    font-size:0.9em;
    text-align: left;
}

.ai-landing .image-texts .image {
    background:#FF4081;
    border-radius:36px;
    flex:1;
    grid-area:image;
    text-align: center;
}

.ai-landing .image-texts .h3 {
    font-size:1.7em;
    font-weight:bold;
    margin-bottom:24px;
}

.ai-landing .image-texts .block {
    border-radius:36px;
    flex:1;
    padding:6%;
    overflow:hidden;
}

.ai-landing .image-texts .block1 {
    background:#f6f6f7 url(/templates/rsflat/resource/img/ai/diamond.svg) no-repeat -144px -122px;
    grid-area:block1;
}

.ai-landing .image-texts .block2 {
    background:#ffe8ef url(/templates/rsflat/resource/img/ai/sun.svg) no-repeat -194px -260px;
    color:#FF4081;
    grid-area:block2;
}

.ai-landing .tags {
    display:flex;
    flex-direction: column;
    align-items: start;
    gap:16px;
}

.ai-landing .tag {
    padding:16px;
    border:1px solid #1D2331;
    border-radius:100px;
    font-size:16px;
    display:inline-flex;
}

.ai-landing .block {
    background-size:192px;
    background-position: 50% 39px;
}

@media(max-width:1199px) {
    .ai-landing .tags {
        display:none;
    }
}

@media(max-width:1023px) {
    .ai-landing {
        font-size:16px;
    }

    .ai-landing .need .item {
        width:calc(50% - 12px);
    }
}

@media(max-width:892px) {
    .ai-landing .image-texts {
        grid-template-areas:
            "image block1"
            "block2 block2";
    }

    .ai-landing .block {
        padding-bottom:64px;
    }

    .ai-landing .useful {
        flex-direction:column;
    }

    .ai-landing .useful .image {
        order:-1;
    }

    .ai-landing .header .back1 {
        opacity:0.4;
    }
}

@media(max-width:767px) {
    .ai-landing {
        font-size:15px;
        --xxl-padding:60px;
        --block-padding:64px;
    }

    .ai-landing .inner-header h1 {
        font-size:2.33em;
    }

    .ai-landing h2 {
        font-size:2.1em;
    }

    .ai-landing .icon-list .text {
        font-size:0.9em;
    }

    .ai-landing .prompts .features {
        flex-direction: column;
    }

    .ai-landing .prompts .features .item {
        max-width:none;
    }

    .ai-landing .examples .item {
        max-width:calc(50% - 16px);
    }
}

@media (max-width:639px) {
    .ai-landing .image-texts {
        display:flex;
        flex-direction: column;
    }

    .ai-landing .multi-fill .examples .step {
        width:100%;
    }

    .ai-landing .free-bonus {
        background-size: 280px;
    }


    .ai-landing .examples .item {
        max-width:none;
        width:100%;
    }
}

@media(max-width:479px) {
    .ai-landing {
        font-size:14px;
    }
    .ai-landing .header .back1 {
        opacity:0.3;
    }

    .ai-landing .block {
        padding-bottom:36px;
    }
}
.ai-packets {
    display:flex;
    flex-wrap:wrap;
    gap:32px;
}

.ai-packets .item {
    border-radius:36px;
    background:#f6f6f7;
    padding:2.5%;
    display:flex;
    flex-direction: column;
    align-items: center;
    gap:24px;
    width:calc(25% - 24px);
    box-sizing: border-box;
}

.ai-packets .item .liter {
    width:56px;
    height:56px;
    background:#e0e0e3;
    color:black;
    font-size:24px;
    font-weight:bold;
    display:flex;
    align-items: center;
    justify-content: center;
    border-radius:14px;
}

.ai-packets .item .size {
    font-size:1em;
}

.ai-packets .item .single-price {
    color:#71757e;
    font-size: 0.9em;
}

.ai-packets .item .single-price span {
    font-size:1.6em;
    font-weight:bold;
    color:black;
}

.ai-packets .item .buy-button {
    background: #FF4081;
    padding:8px 16px;
    width:100%;
    color:white;
    border-radius:5px;
    font-size:0.8em;
    font-weight:bold;
    text-align: center;
    transition:all ease 0.3s;
    box-sizing:border-box;
}

.ai-packets .item .buy-button:hover {
    background-color:#c9285f;
}

.ai-packets .item .buy-button span {
    font-size:20px;
}

@media(max-width:1023px) {

    .ai-packets .item {
        width:calc(50% - 16px);
    }

    .ai-packets .item .buy-button {
        width:86%;
    }
}

@media(max-width:479px) {
    .ai-packets {
        gap:16px;
    }

    .ai-packets .item {
        gap:16px;
        width: calc(50% - 8px);
        padding:16px;
    }
}

@media(max-width:389px) {
    .ai-packets .item {
        width:100%;
    }
}