.cm-columns {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 99px;

    align-items: start;
}

@media (max-width: 870px) {
    .cm-columns {
        gap: 56px;
    }
}

.cm-title {
    font-size: 60px;
    font-family: 'PerepelMain';
    font-weight: 300;
}

.cm-columns-item {
    display: grid;
    grid-template-rows: auto auto 1fr;
    justify-items: center;

    width: 100%;
    max-width: 296px;
}

.eda-columns {
    gap: 69px;
}

@media (max-width: 870px) {
    .eda-columns {
        gap: 30px;
    }
}

.cm-columns-item img {
    width: 100%;
    height: auto;
    object-fit: cover;

    aspect-ratio: 293 / 390;
    border-radius: 3px;
}

.osnova {
    max-width: 381px;
}

.osnova p {
    white-space: nowrap;
}

.bytery {
    max-width: 259px;
}

.cm-columns-item h3 {
    font-size: 40px;
    font-family: 'PerepelMain';
    font-weight: 300;
}

.cm-img-wrap {
    height: clamp(170px, 22vw, 248px);
    display: flex;
}

.cm-img-wrap img {
    width: 100%;
    height: auto;
    object-fit: scale-down;
}

.eda:nth-child(1) img {
    aspect-ratio: 259 / 248;
}

.eda:nth-child(2) img {
    aspect-ratio: 306 / 252;
}

.eda:nth-child(3) img {
    aspect-ratio: 259 / 248;
}
.cm-text {
    display: grid;
    grid-template-columns: 1fr auto;
    column-gap: 24px;
    font-size: clamp(11px, 1.2vw, 16px);
}

.cm-text p {
    margin: 0;
    margin-bottom: 40px;
    font-weight: 400;
}

.cm-text p:nth-child(1) {
    line-height: clamp(15.5px, 1.55vw, 22.3px);
}

@media (max-width: 800px) {
    .cm-text {
        column-gap: 13px;
    }
}

@media (max-width: 762px) {
    .cm-text {
        column-gap: 10px;
    }
}

.cm-price {
    font-family: 'PerepelMain';
    font-size: clamp(14px, 1.4vw, 20px);
}

.cm-button {
    display: flex;
    justify-content: center;
}

.cm-button:last-child {
    margin-bottom: 49px;
}

.cm-button button {
    width: clamp(450px, 5vw, 546px);
    height: min(46px, 8.2vw);

    font-size: 19px;
    margin-top: 30px;

    border: 1px #190C04 solid;
    border-radius: 7px;
    background: #190C04;
    color: #FDF6EB;
}

.cm-button button:hover {
    cursor: pointer;
}

@media (max-width: 708px) {
    /* ── ЗАГОЛОВОК ── */
    .cm-title {
        font-size: clamp(32px, 9vw, 60px);
        margin: 45px 0;
    }

    /* ── КОКТЕЙЛИ ── */
    .cm-columns {
        gap: 24px;
    }

    .cm-columns-item h3 {
        font-size: clamp(18px, 7vw, 40px);
        margin: 10px 0 10px 0;
    }

    /* ── ЕДА: один в ряд ── */
    .eda-columns {
        grid-template-columns: 1fr;
        gap: 48px;
    }

    .cm-columns-item.eda {
        max-width: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: left;
    }

    .cm-img-wrap {
        height: clamp(180px, 50vw, 280px);
        width: 100%;
        justify-content: center;
    }

    .cm-columns-item.eda h3 {
        width: 100%;
        font-size: clamp(24px, 7vw, 40px);
    }

    .cm-text {
        width: 100%;
        font-size: clamp(13px, 3.5vw, 16px);
        column-gap: 16px;
    }

    .cm-text p:nth-child(1) {
        line-height: clamp(28px, 4.5vw, 34px);
    }

    .cm-price {
        font-size: clamp(15px, 4vw, 20px);
        line-height: clamp(28px, 4.5vw, 34px);
    }

    /* белый пробел убираем у osnova */
    .osnova p {
        white-space: normal;
    }

    .osnova,
    .bytery {
        max-width: 100%;
    }

    /* ── КНОПКИ ── */
    .cm-button button {
        width: 100%;
        font-size: clamp(10px, 3.2vw, 19px);
        margin-top: 40px;
    }


}
