.block-realmain {
    background-color: var(--color-background-page);
    max-width: 100%;
}

.block-main-realmain {
    width: 100%;
}

.main {
    width: 95%;
    margin: 198px auto calc(128px + 22px);
    display: flex;
    flex-direction: column;
    gap: 48px;
}

.main-title {
    font-size: var(--font-size-5xl);
    line-height: 105%;
    color: var(--color-foreground-accent);
}

.req-list {
    display: flex;
    gap: 2.109vw;
}

.main-req {
    display: flex;
    flex-direction: column;
    gap: 48px
}

.main-req-1,
.main-req-2 {
    width: 349px;
    flex-shrink: 0;
}

.main-req-3 {
    padding-right: 8.438vw;
}

.req {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.req-title {
    font-size: var(--font-size-sm);
    line-height: 140%;
    color: var(--color-foreground-accent);
}

.req-text {
    font-size: var(--font-size-lg);
    line-height: 110%;
    color: var(--color-foreground-primary);
}

.main-req-3 .req-text {
    font-size: var(--font-size-sm);
    line-height: 140%;
}

/* Адаптация на большие экраны (> 1280) */
@media screen and (min-width: 1440px) {
    .main {
        width: 95.556%;
    }

    .req-list {
        gap: 7.431vw;
    }

    .req-title {
        font-size: 16px;
    }

    .req-text {
        font-size: var(--font-size-xl);
        line-height: 120%;
    }

    .main-req-3 {
        padding-right: 7.5vw;
    }

    .main-req-3 .req-text {
        font-size: 16px;
    }
}

@media screen and (min-width: 1920px) {
    .main {
        width: 95.261%;
        margin: 206px auto calc(128px + 22px);
    }

    .req-list {
        gap: 200px;
    }

    .main-req-3 {
        padding-right: 108px;
        width: 24.219vw;
        max-width: 857.9px;
    }
}

/* Адаптация на большие экраны (< 1280) */
@media screen and (max-width: 1200px) {
    .main {
        width: 95%;
    }

    .main-title {
        font-size: var(--font-size-4xl);
        line-height: 110%;
    }

    .main-req-1,
    .main-req-2 {
        width: 44vw;
    }

    .req-list {
        gap: 48px 31px;
        flex-wrap: wrap;
    }


    .main-req-3 {
        padding-right: 116px;
        width: calc(44vw + 116px);
    }
}

@media screen and (max-width: 600px) {
    .main {
        width: 93.334%;
        margin: 176px auto calc(128px + 22px);
    }

    .req-list {
        gap: 32px;
    }

    .main-req {
        gap: 32px;
    }

    .main-req-1,
    .main-req-2,
    .main-req-3 {
        width: 100%;
    }

    .main-req-3 {
        padding-right: 0;
    }
}