/* Дополнения сайта к теме макета (style.css не правим, чтобы обновления макета
   ложились поверх без слияния) */

/* Тема делает body флекс-колонкой с gap 70px: в макете в body один <main>, а на
   сайте после него идут баннер cookie, виджет Jivo и прочее - и каждый добавлял
   под подвалом по 70px пустоты */
body.landing {
    gap: 0;
}

/* Баннер cookie из Views/Shared/_Cookie.cshtml - общий для всего сайта, здесь
   только его вид в палитре новой главной */
.popup--medium {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 15px;
    padding: 12px 12px 12px 20px;
    border-radius: 19px;
    background-color: var(--color-white);
    color: var(--color-dark-blue-400);
    box-shadow: 0 4px 40px rgba(33, 51, 104, 0.15);
    font-family: var(--font-heading);
    font-size: 16px;
    z-index: 60;
}

.popup--medium a {
    color: var(--color-blue-400);
    text-decoration: underline;
}

.popup--bottom-left {
    position: fixed;
    bottom: 16px;
    left: 16px;
    max-width: calc(100% - 32px);
    box-sizing: border-box;
}

.button-2--medium.button-2--blue-400 {
    padding: 8px 20px;
    border-radius: 19px;
    background-color: var(--color-blue-400);
    color: var(--color-white);
    font-family: var(--font-buttons);
    cursor: pointer;
    user-select: none;
}

.button-2--medium.button-2--blue-400:hover {
    background-color: #55a3fc;
}

/* Переводы длиннее русского текста макета */

/* Цена - в одну строку, пока рядом хватает места: иначе английское «from 158 ₽»
   уносит знак рубля на новую строку. В узкой карточке перенос остается, но
   строки выравниваются («от / 158 р», а не «от 158 / р»), а слово не рвется
   посередине (узбекское «rubldan») - место уступают ограничения справа */
.pricing-card-cost {
    container-type: inline-size;
}

.unit-price .value {
    text-wrap: balance;
    overflow-wrap: normal;
}

@container (min-width: 290px) {
    .unit-price .value {
        white-space: nowrap;
    }
}

/* Число в карточке базы не переносится: длинное (узбекское «700+ ming») чуть
   раздвигает свою карточку */
.db-card-header .value-key .value {
    white-space: nowrap;
}

/* Заголовок карточки учебных заведений переносится до картинки, как русский
   «Образовательным / учреждениям»: английский и узбекский помещались в строку
   и заходили на людей */
@media (min-width: 1251px) {
    .for-whom-card.institute .h3 {
        max-width: calc(100% - 150px);
        overflow-wrap: normal;
    }
}