/* ===== Шрифты (кириллица + латиница; Inter и Wix Madefor — variable) ===== */
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 400 700;
    font-display: swap;
    src: url(../fonts/Inter-cyrillic.woff2) format('woff2');
    unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 400 700;
    font-display: swap;
    src: url(../fonts/Inter-latin.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+20BD, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
    font-family: 'Wix Madefor Display';
    font-style: normal;
    font-weight: 400 800;
    font-display: swap;
    src: url(../fonts/WixMadeforDisplay-cyrillic.woff2) format('woff2');
    unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
    font-family: 'Wix Madefor Display';
    font-style: normal;
    font-weight: 400 800;
    font-display: swap;
    src: url(../fonts/WixMadeforDisplay-latin.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
    font-family: 'Manrope';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url(../fonts/Manrope-cyrillic.woff2) format('woff2');
    unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
    font-family: 'Manrope';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url(../fonts/Manrope-latin.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ===== Переменные ===== */
:root {
    --c-blue: #2E88BD;
    --c-dark-blue: #202D3F;
    --c-red: #F40034;
    --c-black: #232628;
    --c-text: #4F758F;
    --c-muted: #7199B1;
    --c-bg-blue: #C3E2F4;
    --c-gray-20: #EEEEEE;
    --c-gray-30: #AEB2B5;
    --c-gray-50: #57646E;
    --c-green: #89A76B;
    --g-orange: linear-gradient(180deg, #F3B04F 0%, #FF9F11 61.591%, #FF8912 100%);
    --g-green: linear-gradient(90deg, #0CAA0C 0%, #4BD14B 60%, #60E260 100%);

    --f-text: 'Inter', Arial, sans-serif;
    --f-head: 'Wix Madefor Display', 'Inter', Arial, sans-serif;
    --f-accent: 'Manrope', 'Inter', Arial, sans-serif;
}

/* ===== База ===== */
*,
*::before,
*::after {
    box-sizing: border-box;
}

body {
    margin: 0;
    font-family: var(--f-text);
    color: var(--c-black);
    background: #fff;
    -webkit-font-smoothing: antialiased;
    /* Макет 1920px: 1 px макета = var(--u). Ниже 1280px — адаптив */
    container-type: inline-size;
    --u: max(calc(100cqw / 1920), 0.6667px);
}

img {
    display: block;
    max-width: 100%;
}

a {
    color: inherit;
    text-decoration: none;
}

p,
h1,
h2,
ul,
dl,
dd {
    margin: 0;
}

ul {
    padding: 0;
    list-style: none;
}

button {
    font: inherit;
    padding: 0;
    border: 0;
    background: none;
    cursor: pointer;
}

/* ===== Шапка ===== */
.header {
    position: absolute;
    z-index: 10;
    top: 0;
    left: 0;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: calc(var(--u) * 30) calc(var(--u) * 220);
}

.header__brand {
    display: flex;
    align-items: center;
    gap: calc(var(--u) * 30);
}

.header__logo {
    display: block;
    width: calc(var(--u) * 100);
    height: calc(var(--u) * 100);
    padding: calc(var(--u) * 0.57) calc(var(--u) * 0.84) calc(var(--u) * 0.84) calc(var(--u) * 0.57);
}

.header__logo img {
    width: calc(var(--u) * 98.5886);
    height: calc(var(--u) * 98.5885);
}

.header__divider {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 0;
    height: calc(var(--u) * 47);
}

.header__divider img {
    flex-shrink: 0;
    width: calc(var(--u) * 47);
    height: 1px;
    max-width: none;
    transform: rotate(90deg);
}

.header__tagline {
    font-family: var(--f-accent);
    font-weight: 700;
    font-size: calc(var(--u) * 11);
    line-height: calc(var(--u) * 16);
    text-transform: uppercase;
    color: var(--c-muted);
}

.header__nav {
    display: flex;
    align-items: center;
    gap: calc(var(--u) * 50);
    padding: 0 calc(var(--u) * 40);
    background: #fff;
    border-radius: 900px;
}

.header__nav-link {
    display: flex;
    align-items: center;
    gap: calc(var(--u) * 10);
    padding: calc(var(--u) * 20) 0;
    border-bottom: 2px solid transparent;
    font-weight: 600;
    font-size: calc(var(--u) * 14);
    line-height: calc(var(--u) * 18);
    letter-spacing: -0.04em;
    color: var(--c-black);
    white-space: nowrap;
    transition: color .2s;
}

.header__nav-link img {
    width: calc(var(--u) * 20);
    height: calc(var(--u) * 20);
}

.header__nav-link:hover {
    color: var(--c-red);
}

.header__nav-link.is-active {
    color: var(--c-red);
    border-bottom-color: var(--c-red);
}

.header__actions {
    display: flex;
    align-items: center;
    gap: calc(var(--u) * 40);
}

.header__icon img {
    width: calc(var(--u) * 24);
    height: calc(var(--u) * 24);
}

.header__cart {
    display: flex;
    align-items: center;
    gap: calc(var(--u) * 7);
}

.header__cart-icon {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: calc(var(--u) * 50);
    height: calc(var(--u) * 50);
    border-radius: 900px;
    background: rgba(146, 206, 233, 0.44);
}

.header__cart-icon img {
    width: calc(var(--u) * 24);
    height: calc(var(--u) * 24);
}

.header__cart-count {
    position: absolute;
    top: calc(var(--u) * -1);
    left: calc(var(--u) * 34);
    display: flex;
    align-items: center;
    justify-content: center;
    width: calc(var(--u) * 16);
    height: calc(var(--u) * 16);
    border-radius: 900px;
    background: var(--c-red);
    font-weight: 600;
    font-size: calc(var(--u) * 10);
    line-height: calc(var(--u) * 16);
    letter-spacing: -0.03em;
    color: #fff;
}

.header__cart-text {
    display: flex;
    align-items: center;
    gap: calc(var(--u) * 4);
    font-size: calc(var(--u) * 13);
    color: var(--c-dark-blue);
    white-space: nowrap;
}

.header__cart-title {
    font-weight: 700;
    line-height: 1.49;
    letter-spacing: -0.02em;
}

.header__cart-sum {
    font-weight: 600;
    line-height: calc(var(--u) * 23);
    letter-spacing: -0.04em;
    opacity: .6;
}

.header__cart-arrow {
    display: flex;
    align-items: center;
    justify-content: center;
    width: calc(var(--u) * 24);
    height: calc(var(--u) * 24);
    border-radius: 900px;
    background: #fff;
}

.header__cart-arrow img {
    width: calc(var(--u) * 8);
    height: calc(var(--u) * 8);
}

/* ===== Hero ===== */
.hero {
    position: relative;
    height: calc(var(--u) * 1082);
    background: var(--c-bg-blue) var(--hero-bg) center bottom / cover no-repeat;
}

.hero__content {
    position: absolute;
    z-index: 1;
    left: calc(var(--u) * 220);
    top: calc(var(--u) * 264);
    width: calc(var(--u) * 857);
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: calc(var(--u) * 40);
}

.hero__head {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: calc(var(--u) * 19);
}

.badge {
    display: flex;
    align-items: center;
    gap: calc(var(--u) * 5);
    padding: calc(var(--u) * 4) calc(var(--u) * 10);
    border: 1px solid #A1D5F3;
    border-radius: 900px;
    font-weight: 600;
    font-size: calc(var(--u) * 13);
    line-height: calc(var(--u) * 23);
    letter-spacing: -0.04em;
    color: var(--c-blue);
}

.badge img {
    width: calc(var(--u) * 9.51056);
    height: calc(var(--u) * 9.04508);
    margin: 0 calc(var(--u) * 0.245) calc(var(--u) * 0.955);
}

.hero__title-wrap {
    position: relative;
    width: 100%;
    height: calc(var(--u) * 169);
    font-family: var(--f-head);
    font-weight: 700;
    color: var(--c-dark-blue);
    white-space: nowrap;
}

.hero__title {
    font: inherit;
    font-size: calc(var(--u) * 86);
    line-height: calc(var(--u) * 75);
    letter-spacing: -0.04em;
}

.hero__title span,
.hero__subtitle span {
    position: absolute;
}

.hero__title span:nth-child(1) { left: 0; top: 0; }
.hero__title span:nth-child(2) { left: calc(var(--u) * 496); top: calc(var(--u) * 88); }

.hero__subtitle {
    font-size: calc(var(--u) * 30);
    line-height: calc(var(--u) * 35);
    letter-spacing: -0.04em;
}

.hero__subtitle span:nth-child(1) { left: calc(var(--u) * 7); top: calc(var(--u) * 104); white-space: pre; }
.hero__subtitle span:nth-child(2) { left: calc(var(--u) * 183); top: calc(var(--u) * 134); }

.hero__text {
    display: flex;
    align-items: flex-start;
    gap: calc(var(--u) * 15);
}

.hero__text img {
    flex-shrink: 0;
    width: calc(var(--u) * 23);
    height: calc(var(--u) * 23);
}

.hero__text p {
    width: calc(var(--u) * 357);
    font-size: calc(var(--u) * 18);
    line-height: calc(var(--u) * 28);
    letter-spacing: -0.04em;
    color: var(--c-text);
}

.hero__text b {
    font-weight: 700;
    color: var(--c-blue);
}

/* ===== Кнопки ===== */
.btn-big {
    display: inline-flex;
    align-items: center;
    gap: calc(var(--u) * 19);
    padding: calc(var(--u) * 10) calc(var(--u) * 34) calc(var(--u) * 10) calc(var(--u) * 10);
    border-radius: 900px;
    background: var(--g-orange);
    box-shadow: 0 calc(var(--u) * 23) calc(var(--u) * 59) 0 #E5E6E6;
    font-weight: 600;
    font-size: calc(var(--u) * 17);
    line-height: calc(var(--u) * 18);
    letter-spacing: -0.04em;
    color: #fff;
    white-space: nowrap;
    transition: transform .2s;
}

.btn-big:hover {
    transform: translateY(-2px);
}

.btn-big__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: calc(var(--u) * 62);
    height: calc(var(--u) * 62);
    border-radius: 900px;
    background: #fff;
}

.btn-big__icon img {
    width: calc(var(--u) * 18);
    height: calc(var(--u) * 18);
}

.arrow-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: calc(var(--u) * 55);
    height: calc(var(--u) * 55);
    border: 1px solid var(--c-gray-20);
    border-radius: 900px;
    background: #fff;
    cursor: pointer;
    transition: background-color .2s, border-color .2s;
}

.arrow-btn img {
    width: calc(var(--u) * 18);
    height: calc(var(--u) * 18);
    transition: filter .2s;
}

.arrow-btn--prev img {
    transform: rotate(180deg);
}

/* Ховер: синий кружок, иконка становится белой */
.arrow-btn:hover {
    border-color: var(--c-blue);
    background: var(--c-blue);
}

.arrow-btn:hover img {
    filter: brightness(0) invert(1);
}

/* Swiper помечает стрелку на краю списка (слайдер без loop) */
.arrow-btn.swiper-button-disabled {
    opacity: .5;
    cursor: default;
    pointer-events: none;
}

/* ===== Теги категорий ===== */
.tag {
    display: inline-flex;
    align-items: center;
    padding: calc(var(--u) * 2) calc(var(--u) * 6);
    border-radius: 900px;
    font-weight: 700;
    font-size: calc(var(--u) * 10);
    line-height: calc(var(--u) * 19);
    letter-spacing: -0.03em;
    text-transform: uppercase;
    white-space: nowrap;
}

.tag--gf { background: #FFF6E8; color: #DA7815; }
.tag--easter { background: #F0FFED; color: #3B932A; }
.tag--allseason { background: #FFF2F6; color: #FF4B81; }
.tag--newyear { background: var(--c-gray-20); color: #006FD8; }

/* ===== Популярные наборы ===== */
.products {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: calc(var(--u) * 40);
    padding: calc(var(--u) * 110) calc(var(--u) * 220);
}

.products__top {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    width: 100%;
}

.products__head {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: calc(var(--u) * 10);
}

.products__title {
    font-family: var(--f-head);
    font-weight: 700;
    font-size: calc(var(--u) * 63);
    line-height: calc(var(--u) * 68);
    letter-spacing: -0.04em;
    color: var(--c-dark-blue);
}

.products__title span {
    color: var(--c-blue);
}

.products__arrows {
    display: flex;
    gap: calc(var(--u) * 10);
}

.products__slider {
    width: 100%;
    /* место под тень карточек */
    margin: calc(var(--u) * -24) 0;
    padding: calc(var(--u) * 24) 0;
}

/* ===== Карточка товара ===== */
.product-card {
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    width: calc(var(--u) * 283);
    overflow: hidden;
    border: 1px solid var(--c-gray-20);
    border-radius: calc(var(--u) * 20);
    background: #fff;
    box-shadow: 0 0 calc(var(--u) * 24) 0 rgba(73, 80, 85, 0.05);
}

/* Ширина и отступ слайда задаются в CSS (slidesPerView: 'auto') */
.product-card.swiper-slide {
    width: calc(var(--u) * 283);
    height: auto;
    margin-right: calc(var(--u) * 16);
}

.product-card__media {
    position: relative;
    display: block;
    height: calc(var(--u) * 266);
    overflow: hidden;
    border-radius: calc(var(--u) * 28);
    background: #fff;
}

.product-card__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.product-card__tags {
    position: absolute;
    top: calc(var(--u) * 12);
    left: calc(var(--u) * 12);
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: calc(var(--u) * 4);
}

.product-card__body {
    display: flex;
    flex-direction: column;
    gap: calc(var(--u) * 11);
    padding: 0 calc(var(--u) * 16) calc(var(--u) * 16);
}

.product-card__title {
    display: block;
    height: calc(var(--u) * 47);
    overflow: hidden;
    font-family: var(--f-head);
    font-weight: 700;
    font-size: calc(var(--u) * 18);
    line-height: calc(var(--u) * 24);
    letter-spacing: -0.03em;
    color: var(--c-dark-blue);
}

.product-card__prices {
    display: flex;
    align-items: center;
    gap: calc(var(--u) * 5);
    height: calc(var(--u) * 23);
    white-space: nowrap;
}

.product-card__price {
    font-weight: 600;
    font-size: calc(var(--u) * 20);
    line-height: calc(var(--u) * 21);
    letter-spacing: -0.04em;
    color: var(--c-red);
}

.product-card__old-price {
    font-weight: 500;
    font-size: calc(var(--u) * 15);
    line-height: calc(var(--u) * 21);
    letter-spacing: -0.04em;
    color: var(--c-gray-30);
    text-decoration: line-through;
}

.product-card__discount {
    display: flex;
    align-items: center;
    gap: calc(var(--u) * 2);
    padding: calc(var(--u) * 3) calc(var(--u) * 4) calc(var(--u) * 3) calc(var(--u) * 3);
    border-radius: 900px;
    background: var(--g-orange);
    font-weight: 700;
    font-size: calc(var(--u) * 12);
    line-height: 1.49;
    color: #fff;
}

.product-card__discount img {
    width: calc(var(--u) * 17.0208);
    height: calc(var(--u) * 17.0208);
    margin: calc(var(--u) * 0.99);
}

.product-card__specs {
    font-size: calc(var(--u) * 14);
    line-height: calc(var(--u) * 20);
    letter-spacing: -0.04em;
    color: var(--c-gray-50);
}

.product-card__specs b {
    font-weight: 600;
    color: var(--c-black);
}

.product-card__cart {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: calc(var(--u) * 6);
    width: 100%;
    margin-top: calc(var(--u) * 4);
    padding: calc(var(--u) * 10) calc(var(--u) * 16);
    border-radius: 900px;
    background: var(--c-red);
    font-weight: 700;
    font-size: calc(var(--u) * 13);
    line-height: 1.49;
    letter-spacing: -0.02em;
    color: #fff;
    transition: background-color .2s;
}

.product-card__cart img {
    width: calc(var(--u) * 22);
    height: calc(var(--u) * 22);
}

.product-card__cart:hover {
    background: #D1002C;
}

.product-card__cart.is-added {
    background: var(--c-green);
}

.product-card__cart.is-added:hover {
    background: #75925A;
}

/* ===== Что входит в набор ===== */
.kit {
    position: relative;
    height: calc(var(--u) * 1122);
    padding: calc(var(--u) * 110) calc(var(--u) * 220) 0;
    overflow: hidden;
}

/* Фон в макете отражён по горизонтали */
/* Фон всей секции одной картинкой из поля в админке: голубая подложка,
   фото набора и белые «подтёки» внизу (2x, 3840 по ширине) */
.kit__bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: var(--kit-bg) center bottom / cover no-repeat;
}

.kit__note {
    position: absolute;
    left: calc(var(--u) * 1457);
    top: calc(var(--u) * 830);
    font-size: calc(var(--u) * 13);
    line-height: calc(var(--u) * 24);
    letter-spacing: -0.03em;
    color: #6EA5C5;
    white-space: nowrap;
}

.kit__content {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: calc(var(--u) * 64);
}

.kit__head {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: calc(var(--u) * 10);
}

.kit__title {
    position: relative;
    width: calc(var(--u) * 636);
    height: calc(var(--u) * 143);
    font-family: var(--f-head);
    font-weight: 700;
    font-size: calc(var(--u) * 63);
    line-height: calc(var(--u) * 68);
    letter-spacing: -0.04em;
    color: var(--c-dark-blue);
    white-space: nowrap;
}

.kit__title span {
    position: absolute;
    top: 0;
    left: 0;
}

.kit__list {
    display: flex;
    flex-wrap: wrap;
    gap: calc(var(--u) * 40) calc(var(--u) * 93);
    width: calc(var(--u) * 627);
}

.kit-item {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: calc(var(--u) * 9);
    width: calc(var(--u) * 140);
}

.kit-item__pic {
    position: relative;
    width: 100%;
    height: calc(var(--u) * 170);
    overflow: hidden;
    border-radius: 900px;
}

.kit-item__pic img {
    position: absolute;
    max-width: none;
    object-fit: cover;
}

.kit-item--glaze .kit-item__pic { background: #FACED2; }
.kit-item--glaze .kit-item__pic img { left: calc(var(--u) * 1); top: calc(var(--u) * 23); width: calc(var(--u) * 143); height: calc(var(--u) * 143); }
.kit-item--cutters .kit-item__pic { background: #EFE1FB; }
.kit-item--cutters .kit-item__pic img { left: calc(var(--u) * 4.19); top: calc(var(--u) * 23.31); width: calc(var(--u) * 131.61); height: calc(var(--u) * 131.61); }
.kit-item--sprinkles .kit-item__pic { background: #D3FCD8; }
.kit-item--sprinkles .kit-item__pic img { left: calc(var(--u) * 8.06); top: calc(var(--u) * 21.94); width: calc(var(--u) * 128.87); height: calc(var(--u) * 128.87); }
.kit-item--mixes .kit-item__pic { background: #B5DCF9; }
.kit-item--mixes .kit-item__pic img { left: calc(var(--u) * -0.87); top: calc(var(--u) * 25.87); width: calc(var(--u) * 136.74); height: calc(var(--u) * 136.74); }
.kit-item--giftbox .kit-item__pic { background: #FDDFBE; }
.kit-item--giftbox .kit-item__pic img { left: calc(var(--u) * 16); top: calc(var(--u) * 2); width: calc(var(--u) * 109); height: calc(var(--u) * 194); }
.kit-item--manual .kit-item__pic { background: #EFE1FB; }
.kit-item--manual .kit-item__pic img { left: calc(var(--u) * 17); top: calc(var(--u) * -21); width: calc(var(--u) * 123); height: calc(var(--u) * 219); }

.kit-item__check {
    position: absolute;
    top: calc(var(--u) * -3);
    right: calc(var(--u) * 11);
    display: flex;
    padding: calc(var(--u) * 6);
    border-radius: 900px;
    background: var(--g-green), #fff;
}

.kit-item--glaze .kit-item__check {
    right: calc(var(--u) * 14);
}

.kit-item__check img {
    width: calc(var(--u) * 14);
    height: calc(var(--u) * 22);
}

.kit-item__name {
    font-family: var(--f-head);
    font-weight: 700;
    font-size: calc(var(--u) * 18);
    line-height: calc(var(--u) * 24);
    letter-spacing: -0.03em;
    text-align: center;
    color: var(--c-dark-blue);
}

/* ===== О компании ===== */
.about {
    position: relative;
    height: calc(var(--u) * 924);
    padding: calc(var(--u) * 177) calc(var(--u) * 220) 0;
    overflow: hidden;
}

.about__stars {
    position: absolute;
    top: 0;
    right: 0;
    width: calc(var(--u) * 1038);
    height: calc(var(--u) * 852);
    max-width: none;
    pointer-events: none;
}

.about__photo {
    position: absolute;
    left: calc(var(--u) * 990);
    top: calc(var(--u) * 113);
    width: calc(var(--u) * 703);
    height: calc(var(--u) * 700);
    max-width: none;
}

.about__content {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: calc(var(--u) * 740);
}

.about__head {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: calc(var(--u) * 12);
}

.about__title {
    position: relative;
    width: calc(var(--u) * 640);
    height: calc(var(--u) * 140);
    font-family: var(--f-head);
    font-weight: 700;
    font-size: calc(var(--u) * 63);
    line-height: calc(var(--u) * 68);
    letter-spacing: -0.04em;
    color: var(--c-dark-blue);
    white-space: nowrap;
}

.about__title span {
    position: absolute;
    top: 0;
    left: 0;
}

.about__title .about__title-accent {
    left: calc(var(--u) * 78);
    top: calc(var(--u) * 74);
    color: var(--c-red);
}

.about__text {
    display: flex;
    flex-direction: column;
    gap: calc(var(--u) * 14);
    margin-top: calc(var(--u) * 42);
    font-size: calc(var(--u) * 21);
    line-height: calc(var(--u) * 32);
    letter-spacing: -0.04em;
    color: var(--c-black);
}

.about__text b {
    font-weight: 700;
}

.about__text .about__lead {
    margin-bottom: calc(var(--u) * 5);
    font-family: var(--f-head);
    font-weight: 700;
    font-size: calc(var(--u) * 30);
    line-height: calc(var(--u) * 40);
    letter-spacing: -0.04em;
    color: var(--c-dark-blue);
}

.about .btn-big {
    margin-top: calc(var(--u) * 20);
}

/* ===== Категории ===== */
.categories {
    padding: calc(var(--u) * 80) calc(var(--u) * 220);
    border-bottom: 1px solid #EDEEF0;
}

.categories__list {
    display: flex;
    gap: calc(var(--u) * 16);
}

.category-card {
    position: relative;
    flex: 1 1 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    height: calc(var(--u) * 396);
    overflow: hidden;
    border-radius: 900px;
}

.category-card__img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .4s;
}

.category-card:hover .category-card__img {
    transform: scale(1.04);
}

.category-card__title {
    position: relative;
    margin-top: calc(var(--u) * 66);
    font-family: var(--f-head);
    font-weight: 700;
    font-size: calc(var(--u) * 26);
    line-height: calc(var(--u) * 35);
    letter-spacing: -0.04em;
    color: var(--c-dark-blue);
    white-space: nowrap;
}

.category-card__btn {
    position: absolute;
    left: 50%;
    bottom: calc(var(--u) * 24);
    display: flex;
    align-items: center;
    gap: calc(var(--u) * 10);
    padding: calc(var(--u) * 6) calc(var(--u) * 19) calc(var(--u) * 6) calc(var(--u) * 6);
    border-radius: 900px;
    background: #fff;
    transform: translateX(-50%);
    font-weight: 600;
    font-size: calc(var(--u) * 15);
    line-height: calc(var(--u) * 18);
    letter-spacing: -0.04em;
    color: #DA7815;
    white-space: nowrap;
}

.category-card__btn-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: calc(var(--u) * 32);
    height: calc(var(--u) * 32);
    border-radius: 900px;
    background: #DA7815;
}

.category-card__btn-icon img {
    width: calc(var(--u) * 14);
    height: calc(var(--u) * 14);
}

/* ===== Новинка года ===== */
.novelty {
    position: relative;
    height: calc(var(--u) * 1058);
    background: var(--novelty-bg) center top / 100% auto no-repeat;
}

.novelty__photo {
    position: absolute;
    left: calc(var(--u) * 253);
    top: calc(var(--u) * 143);
    width: calc(var(--u) * 530);
    height: calc(var(--u) * 769);
    border-radius: 900px;
    box-shadow: 0 0 calc(var(--u) * 33) rgba(73, 80, 85, 0.06);
}

/* Тонкий овал вокруг фото */
.novelty__photo::before {
    content: '';
    position: absolute;
    inset: calc(var(--u) * -33);
    border: 1px solid #F1F3F5;
    border-radius: 900px;
}

.novelty__photo img {
    position: relative;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 900px;
}

.novelty__content {
    position: absolute;
    left: calc(var(--u) * 856);
    top: calc(var(--u) * 300);
}

.novelty__title {
    font-family: var(--f-head);
    font-weight: 700;
    font-size: calc(var(--u) * 63);
    line-height: calc(var(--u) * 68);
    letter-spacing: -0.04em;
    color: var(--c-dark-blue);
}

.novelty__subtitle {
    margin-top: calc(var(--u) * 19);
    font-family: var(--f-head);
    font-weight: 700;
    font-size: calc(var(--u) * 26);
    line-height: calc(var(--u) * 35);
    letter-spacing: -0.04em;
    color: var(--c-blue);
}

.novelty__features {
    display: flex;
    flex-direction: column;
    gap: calc(var(--u) * 25);
    margin-top: calc(var(--u) * 23);
}

.novelty__feature {
    display: flex;
    align-items: flex-start;
    gap: calc(var(--u) * 16);
}

.novelty__feature div {
    margin-top: calc(var(--u) * -4);
}

.novelty__feature img {
    flex-shrink: 0;
    width: calc(var(--u) * 42);
    height: calc(var(--u) * 42);
}

.novelty__feature-title {
    font-family: var(--f-head);
    font-weight: 700;
    font-size: calc(var(--u) * 18);
    line-height: calc(var(--u) * 24);
    letter-spacing: -0.03em;
    color: var(--c-dark-blue);
}

.novelty__feature-text {
    margin-top: calc(var(--u) * 6);
    font-size: calc(var(--u) * 18);
    line-height: calc(var(--u) * 23);
    letter-spacing: -0.04em;
    color: var(--c-text);
}

/* Карточка новинки */
.novelty-card {
    position: absolute;
    left: calc(var(--u) * 1342);
    top: calc(var(--u) * 247);
    display: flex;
    flex-direction: column;
    width: calc(var(--u) * 358);
    padding: calc(var(--u) * 30);
    border-radius: calc(var(--u) * 28);
    background: #fff;
    box-shadow: 0 calc(var(--u) * 40) calc(var(--u) * 80) rgba(32, 45, 62, 0.12);
}

.novelty-card__img img {
    width: calc(var(--u) * 298);
    height: calc(var(--u) * 259);
}

.novelty-card__buy {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    margin-top: calc(var(--u) * 22);
}

.novelty-card__label {
    font-size: calc(var(--u) * 15);
    line-height: calc(var(--u) * 20);
    letter-spacing: -0.04em;
    color: var(--c-gray-50);
}

.novelty-card__prices {
    display: flex;
    align-items: center;
    gap: calc(var(--u) * 8);
    margin-top: calc(var(--u) * 6);
    white-space: nowrap;
}

.novelty-card__price {
    font-weight: 600;
    font-size: calc(var(--u) * 28);
    line-height: calc(var(--u) * 32);
    letter-spacing: -0.04em;
    color: var(--c-red);
}

.novelty-card__old-price {
    font-weight: 500;
    font-size: calc(var(--u) * 20);
    line-height: calc(var(--u) * 24);
    letter-spacing: -0.04em;
    color: var(--c-gray-30);
    text-decoration: line-through;
}

.novelty-card__cart {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    margin-top: calc(var(--u) * -2);
    width: calc(var(--u) * 56);
    height: calc(var(--u) * 56);
    border-radius: 900px;
    background: var(--c-red);
    transition: background-color .2s;
}

.novelty-card__cart:hover {
    background: #D1002C;
}

.novelty-card__cart img {
    width: calc(var(--u) * 22);
    height: calc(var(--u) * 22);
}

.novelty-card__specs {
    margin-top: calc(var(--u) * 16);
    font-size: calc(var(--u) * 14);
    line-height: calc(var(--u) * 20.5);
}

/* Кнопка поменьше: кружок 42, текст по центру */
.btn-big--small {
    gap: 0;
    margin-top: calc(var(--u) * 17);
    padding: calc(var(--u) * 10) calc(var(--u) * 18) calc(var(--u) * 10) calc(var(--u) * 10);
}

.btn-big--small .btn-big__icon {
    width: calc(var(--u) * 42);
    height: calc(var(--u) * 42);
}

.btn-big--small .btn-big__text {
    flex: 1;
    font-size: calc(var(--u) * 16);
    text-align: center;
}

/* ===== Почему мы ===== */
.why {
    position: relative;
    height: calc(var(--u) * 848);
    padding: 0 calc(var(--u) * 220);
}

.why__head {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: calc(var(--u) * 10);
}

.why__title {
    position: relative;
    width: calc(var(--u) * 760);
    height: calc(var(--u) * 144);
    font-family: var(--f-head);
    font-weight: 700;
    font-size: calc(var(--u) * 63);
    line-height: calc(var(--u) * 68);
    letter-spacing: -0.04em;
    color: var(--c-dark-blue);
    white-space: nowrap;
}

.why__title-line {
    position: absolute;
    top: 0;
    left: 0;
}

.why__title .why__title-line--2 {
    left: calc(var(--u) * 240);
    top: calc(var(--u) * 76);
}

.why__panel {
    position: absolute;
    top: calc(var(--u) * 226);
    height: calc(var(--u) * 542);
    border-radius: calc(var(--u) * 45);
}

.why__panel--blue {
    left: calc(var(--u) * 220);
    display: flex;
    gap: calc(var(--u) * 17);
    width: calc(var(--u) * 842);
    padding: calc(var(--u) * 40) calc(var(--u) * 39);
    background: #D7EFF9;
}

.why__panel--purple {
    left: calc(var(--u) * 1089);
    width: calc(var(--u) * 611);
    padding: calc(var(--u) * 42) 0 0 calc(var(--u) * 302);
    background: #E8E4FF;
}

.why__girl {
    position: absolute;
    left: calc(var(--u) * 978);
    top: calc(var(--u) * 120);
    width: calc(var(--u) * 722);
    height: calc(var(--u) * 648);
    max-width: none;
    pointer-events: none;
}

.why__gingerbread {
    position: absolute;
    left: calc(var(--u) * 987);
    top: calc(var(--u) * 268);
    width: calc(var(--u) * 150);
    height: calc(var(--u) * 164);
    max-width: none;
    pointer-events: none;
}

/* Текст и кнопка лежат поверх девочки */
.why__features,
.why__panel--purple .btn-big {
    position: relative;
    z-index: 2;
}

.why-card {
    width: calc(var(--u) * 244);
}

.why-card__img {
    width: 100%;
    height: calc(var(--u) * 283);
    object-fit: cover;
    border-radius: calc(var(--u) * 32);
}

.why-card__title {
    margin-top: calc(var(--u) * 17);
    padding-left: calc(var(--u) * 13);
    font-family: var(--f-head);
    font-weight: 700;
    font-size: calc(var(--u) * 18);
    line-height: calc(var(--u) * 24);
    letter-spacing: -0.03em;
    color: var(--c-dark-blue);
}

.why-card__btns {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: calc(var(--u) * 10);
    margin-top: calc(var(--u) * 12);
    padding-left: calc(var(--u) * 12);
}

/* Цветная кнопка-«пилюля» с белым кружком */
.pill-btn {
    display: inline-flex;
    align-items: center;
    gap: calc(var(--u) * 8);
    padding: calc(var(--u) * 4) calc(var(--u) * 14) calc(var(--u) * 4) calc(var(--u) * 4);
    border-radius: 900px;
    font-weight: 600;
    font-size: calc(var(--u) * 13);
    line-height: calc(var(--u) * 18);
    letter-spacing: -0.04em;
    color: #fff;
    white-space: nowrap;
    box-shadow: 0 calc(var(--u) * 10) calc(var(--u) * 20) rgba(46, 136, 189, 0.15);
    transition: filter .2s;
}

.pill-btn:hover {
    filter: brightness(1.08);
}

.pill-btn--red { background: var(--c-red); }
.pill-btn--blue { background: var(--c-blue); }
.pill-btn--orange { background: #EDAF56; }

.pill-btn__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: calc(var(--u) * 28);
    height: calc(var(--u) * 28);
    border-radius: 900px;
    background: #fff;
}

.pill-btn__icon img {
    width: calc(var(--u) * 14);
    height: calc(var(--u) * 14);
}

.pill-btn__percent {
    font-weight: 700;
    font-size: calc(var(--u) * 14);
    color: var(--c-dark-blue);
}

.why__features {
    display: flex;
    flex-direction: column;
    gap: calc(var(--u) * 22);
}

.why__feature {
    display: flex;
    align-items: flex-start;
    gap: calc(var(--u) * 11);
}

.why__feature img {
    flex-shrink: 0;
    width: calc(var(--u) * 18);
    height: calc(var(--u) * 18);
    margin-top: calc(var(--u) * 1);
}

.why__feature-title {
    margin-top: calc(var(--u) * -2);
    font-family: var(--f-head);
    font-weight: 700;
    font-size: calc(var(--u) * 18);
    line-height: calc(var(--u) * 24);
    letter-spacing: -0.03em;
    color: #433575;
}

.why__feature-text {
    margin-top: calc(var(--u) * 6);
    font-size: calc(var(--u) * 16);
    line-height: calc(var(--u) * 22);
    letter-spacing: -0.04em;
    color: var(--c-gray-50);
}

.why__feature-text b {
    font-weight: 600;
}

.why__panel--purple .btn-big {
    margin-top: calc(var(--u) * 22);
}

/* ===== Отзывы ===== */
.reviews {
    position: relative;
    height: calc(var(--u) * 1179);
    padding: calc(var(--u) * 167) calc(var(--u) * 220) 0;
    background: var(--reviews-bg) left bottom / 100% auto no-repeat;
}

.reviews__cane,
.reviews__candy {
    position: absolute;
    z-index: 2;
    max-width: none;
    pointer-events: none;
}

.reviews__cane {
    left: calc(var(--u) * 1657);
    top: 0;
    width: calc(var(--u) * 263);
    height: calc(var(--u) * 346);
}

.reviews__candy {
    left: calc(var(--u) * 124);
    top: calc(var(--u) * 440);
    width: calc(var(--u) * 129);
    height: calc(var(--u) * 131);
}

.reviews__head {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: calc(var(--u) * 9);
}

.reviews__title {
    position: relative;
    margin-left: calc(var(--u) * -5);
    width: calc(var(--u) * 640);
    height: calc(var(--u) * 150);
    font-family: var(--f-head);
    font-weight: 700;
    font-size: calc(var(--u) * 63);
    line-height: calc(var(--u) * 68);
    letter-spacing: -0.04em;
    color: var(--c-dark-blue);
    white-space: nowrap;
}

.reviews__title-line {
    position: absolute;
    left: 0;
    top: 0;
}

.reviews__title-line span {
    color: var(--c-blue);
}

.reviews__title .reviews__title-line--2 {
    left: calc(var(--u) * 208);
    top: calc(var(--u) * 77);
}

.reviews__summary {
    position: absolute;
    left: calc(var(--u) * 220);
    top: calc(var(--u) * 399);
    width: calc(var(--u) * 606);
    height: calc(var(--u) * 472);
    padding: calc(var(--u) * 40);
    border-radius: calc(var(--u) * 40);
    background: #E8F6FF;
}

.reviews__score {
    display: flex;
    align-items: flex-start;
    gap: calc(var(--u) * 39);
}

.reviews__score > div {
    position: relative;
    flex-shrink: 0;
    width: calc(var(--u) * 174);
}

/* Короткий вертикальный разделитель */
.reviews__score > div::after {
    content: '';
    position: absolute;
    top: calc(var(--u) * 18);
    right: 0;
    width: 1px;
    height: calc(var(--u) * 46);
    background: #CAE0EC;
}

.reviews__label {
    font-family: var(--f-head);
    font-weight: 700;
    font-size: calc(var(--u) * 18);
    line-height: calc(var(--u) * 24);
    letter-spacing: -0.03em;
    color: var(--c-dark-blue);
}

.reviews__rating {
    display: flex;
    align-items: center;
    gap: calc(var(--u) * 15);
    margin-top: calc(var(--u) * 12);
    font-weight: 600;
    font-size: calc(var(--u) * 42);
    line-height: calc(var(--u) * 42);
    letter-spacing: -0.04em;
    color: var(--c-dark-blue);
}

.reviews__rating img {
    width: calc(var(--u) * 42);
    height: calc(var(--u) * 40);
}

.reviews__note {
    margin-top: calc(var(--u) * 5);
    font-size: calc(var(--u) * 16);
    line-height: calc(var(--u) * 24.5);
    letter-spacing: -0.03em;
    color: var(--c-gray-50);
}

.reviews__label--photos {
    margin-top: calc(var(--u) * 53);
}

.reviews__photos {
    display: flex;
    gap: calc(var(--u) * 7);
    margin-top: calc(var(--u) * 12);
}

.reviews__photos img,
.reviews__more {
    width: calc(var(--u) * 68);
    height: calc(var(--u) * 91);
    border-radius: calc(var(--u) * 10);
    object-fit: cover;
}

/* Фото — кнопки, открывающие галерею */
.reviews__photo,
.review__photo {
    flex: none;
    padding: 0;
    border: 0;
    background: none;
    cursor: pointer;
}

.reviews__photo img,
.review__photo img {
    display: block;
}

.reviews__more {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: calc(var(--u) * 4);
    padding: 0;
    border: 1px dashed var(--c-blue);
    background: none;
    font-family: inherit;
    font-weight: 700;
    font-size: calc(var(--u) * 16);
    line-height: calc(var(--u) * 20);
    letter-spacing: -0.03em;
    color: var(--c-blue);
    cursor: pointer;
    transition: background-color .2s;
}

.reviews__more:hover {
    background: rgba(46, 136, 189, .08);
}

.reviews__more img {
    width: calc(var(--u) * 19);
    height: calc(var(--u) * 19);
}

/* ===== Уведомление о cookie: карточка слева внизу, на телефоне — над нижней панелью ===== */
.cookie-notice {
    position: fixed;
    left: 24px;
    bottom: 24px;
    z-index: 950;
    display: flex;
    align-items: center;
    gap: 20px;
    width: 520px;
    max-width: calc(100% - 48px);
    padding: 18px 20px 18px 24px;
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 16px 48px rgba(32, 45, 63, .22);
    transition: opacity .3s, transform .3s;
}

.cookie-notice[hidden] {
    display: none;
}

.cookie-notice.is-leaving {
    opacity: 0;
    transform: translateY(12px);
    pointer-events: none;
}

.cookie-notice__text {
    flex: 1;
    font-size: 14px;
    line-height: 21px;
    letter-spacing: -0.01em;
    color: var(--c-gray-50);
}

.cookie-notice__text a {
    color: var(--c-blue);
    text-decoration: underline;
    text-underline-offset: 3px;
    transition: color .2s;
}

.cookie-notice__text a:hover {
    color: var(--c-dark-blue);
}

.cookie-notice__btn {
    flex: none;
    height: 44px;
    padding: 0 24px;
    border-radius: 900px;
    background: var(--g-orange);
    font-family: var(--f-text);
    font-size: 15px;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: #fff;
    cursor: pointer;
    transition: transform .2s;
}

.cookie-notice__btn:hover {
    transform: translateY(-2px);
}

@media (max-width: 767px) {
    .cookie-notice {
        right: 12px;
        bottom: calc(86px + env(safe-area-inset-bottom, 0px));
        left: 12px;
        flex-direction: column;
        align-items: stretch;
        gap: 14px;
        width: auto;
        max-width: none;
        padding: 16px;
        border-radius: 16px;
    }

    .cookie-notice__text {
        font-size: 14px;
        line-height: 20px;
    }

    .cookie-notice__btn {
        height: 46px;
    }
}

/* ===== Галерея фото из отзывов (lightbox) ===== */
.lightbox {
    position: fixed;
    inset: 0;
    z-index: 1200;
    display: flex;
    flex-direction: column;
    background: rgba(18, 22, 30, .92);
}

.lightbox[hidden] {
    display: none;
}

body.is-lightbox-open {
    overflow: hidden;
}

.lightbox__top {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex: none;
    padding: 20px 24px;
}

.lightbox__counter {
    font-size: 16px;
    font-weight: 600;
    letter-spacing: -0.02em;
    color: #fff;
}

.lightbox__close {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: #fff;
    cursor: pointer;
    transition: background-color .2s;
}

.lightbox__close:hover {
    background: var(--c-gray-20);
}

.lightbox__close img {
    width: 16px;
    height: 16px;
}

.lightbox__slider {
    flex: 1;
    min-height: 0;
    width: 100%;
}

.lightbox__slide {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 80px 24px;
}

.lightbox__slide img {
    width: auto;
    height: 100%;
    max-width: 100%;
    object-fit: contain;
    border-radius: 16px;
}

.lightbox__arrow {
    position: absolute;
    top: 50%;
    z-index: 2;
    width: 54px;
    height: 54px;
    transform: translateY(-50%);
}

.lightbox__arrow--prev { left: 24px; }
.lightbox__arrow--next { right: 24px; }

.lightbox__arrow img {
    width: 30px;
    height: 30px;
}

.lightbox__arrow.swiper-button-disabled {
    opacity: .35;
    pointer-events: none;
}

@media (max-width: 767px) {
    /* Нижняя панель на время галереи прячется */
    body.is-lightbox-open .tabbar {
        display: none;
    }

    .lightbox__top {
        padding: 12px 16px;
    }

    .lightbox__slide {
        padding: 0 16px 16px;
    }

    /* Стрелки — под фото по центру, чтобы не закрывать снимок */
    .lightbox__arrow {
        top: auto;
        bottom: 16px;
        transform: none;
    }

    .lightbox__arrow--prev { left: calc(50% - 64px); }
    .lightbox__arrow--next { right: calc(50% - 64px); }

    .lightbox__slide {
        padding-bottom: 90px;
    }
}

/* Вертикальный слайдер: активный отзыв по центру, соседние затухают */
.reviews__slider {
    position: absolute;
    left: calc(var(--u) * 840);
    top: calc(var(--u) * 270);
    width: calc(var(--u) * 890);
    height: calc(var(--u) * 536);
    padding: 0 calc(var(--u) * 30);
    -webkit-mask-image: linear-gradient(to bottom, transparent 0, #000 24%, #000 76%, transparent 100%);
    mask-image: linear-gradient(to bottom, transparent 0, #000 24%, #000 76%, transparent 100%);
}

.review.swiper-slide {
    height: auto;
    padding: calc(var(--u) * 33) calc(var(--u) * 46) calc(var(--u) * 35);
    border-radius: calc(var(--u) * 50);
    background: #fff;
    box-shadow: 0 0 calc(var(--u) * 30) rgba(70, 140, 185, 0.25);
}

.review__head {
    display: flex;
    align-items: center;
    gap: calc(var(--u) * 13);
}

.review__avatar {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: calc(var(--u) * 64);
    height: calc(var(--u) * 64);
    border-radius: 900px;
    background: #F1FAFF;
}

.review__avatar img {
    width: calc(var(--u) * 26);
    height: calc(var(--u) * 25);
}

.review__name {
    font-family: var(--f-head);
    font-weight: 700;
    font-size: calc(var(--u) * 18);
    line-height: calc(var(--u) * 24);
    letter-spacing: -0.03em;
    color: var(--c-dark-blue);
}

.review__date {
    margin-top: calc(var(--u) * 6);
    font-size: calc(var(--u) * 14);
    line-height: calc(var(--u) * 18);
    letter-spacing: -0.03em;
    color: #8D989F;
}

.review__rating {
    display: flex;
    align-items: center;
    gap: calc(var(--u) * 4);
    margin-left: auto;
    font-weight: 600;
    font-size: calc(var(--u) * 13);
    line-height: calc(var(--u) * 18);
    color: var(--c-black);
}

.review__rating img {
    width: calc(var(--u) * 14);
    height: calc(var(--u) * 13);
}

.review__text {
    margin-top: calc(var(--u) * 14);
    font-size: calc(var(--u) * 16);
    line-height: calc(var(--u) * 22);
    letter-spacing: -0.03em;
    color: var(--c-black);
}

.review__photos {
    display: flex;
    gap: calc(var(--u) * 8);
    margin-top: calc(var(--u) * 8);
}

.review__photos img {
    width: calc(var(--u) * 60);
    height: calc(var(--u) * 80);
    border-radius: calc(var(--u) * 10);
    object-fit: cover;
}

.reviews__arrows {
    position: absolute;
    left: calc(var(--u) * 1730);
    top: calc(var(--u) * 531);
    display: flex;
    flex-direction: column;
    gap: calc(var(--u) * 10);
}

.reviews__arrows .arrow-btn {
    border: 0;
}

.reviews__arrows .arrow-btn img {
    width: calc(var(--u) * 33);
    height: calc(var(--u) * 33);
}

/* ===== Чем заняться пока ждёте бокс ===== */
.leisure {
    position: relative;
    height: calc(var(--u) * 973);
    padding: calc(var(--u) * 274) calc(var(--u) * 220) 0;
}

/* Фото справа одним файлом: большое фото и два овала уже внутри */
.leisure__photo {
    position: absolute;
    left: calc(var(--u) * 696);
    top: calc(var(--u) * 110);
    width: calc(var(--u) * 1004);
    height: calc(var(--u) * 863);
}

.leisure__photo img {
    position: absolute;
    top: 0;
    width: calc(var(--u) * 1004);
    height: calc(var(--u) * 863);
    max-width: none;
}

/* Большое фото: та же картинка в рамке со скруглением */
.leisure__photo-main {
    position: absolute;
    left: calc(var(--u) * 139);
    top: 0;
    width: calc(var(--u) * 865);
    height: calc(var(--u) * 744);
    overflow: hidden;
    border-radius: calc(var(--u) * 45);
}

.leisure__photo-main img {
    left: calc(var(--u) * -139);
}

/* Два овала слева снизу: вырезаем их область из той же картинки */
.leisure__photo .leisure__photo-ovals {
    left: 0;
    clip-path: inset(calc(var(--u) * 470) calc(var(--u) * 584) 0 0);
}

.leisure__content {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.leisure__title {
    position: relative;
    width: calc(var(--u) * 600);
    height: calc(var(--u) * 144);
    margin-top: calc(var(--u) * 11);
    font-family: var(--f-head);
    font-weight: 700;
    font-size: calc(var(--u) * 63);
    line-height: calc(var(--u) * 68);
    letter-spacing: -0.04em;
    color: var(--c-dark-blue);
    white-space: nowrap;
}

.leisure__title-line {
    position: absolute;
    left: 0;
    top: 0;
}

.leisure__title .leisure__title-line--2 {
    left: calc(var(--u) * 80);
    top: calc(var(--u) * 75);
}

.leisure__text {
    margin: calc(var(--u) * 19) 0 0 calc(var(--u) * 80);
    font-size: calc(var(--u) * 21);
    line-height: calc(var(--u) * 33);
    letter-spacing: -0.04em;
    color: var(--c-black);
}

.leisure__text b {
    font-weight: 700;
}

.leisure .btn-big {
    margin-top: calc(var(--u) * 40);
}

/* ===== О нашей компании ===== */
.company {
    position: relative;
    height: calc(var(--u) * 1242);
    padding: calc(var(--u) * 255) calc(var(--u) * 220) 0;
    background: var(--company-bg) center top / 100% auto no-repeat;
}

.badge--red {
    border-color: #FBB9CF;
    color: var(--c-red);
}

.badge--red img {
    width: calc(var(--u) * 10);
    height: calc(var(--u) * 10);
    margin: 0;
}

.company__head {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: calc(var(--u) * 8);
}

.company__title {
    position: relative;
    margin-left: calc(var(--u) * -5);
    width: calc(var(--u) * 400);
    height: calc(var(--u) * 145);
    font-family: var(--f-head);
    font-weight: 700;
    font-size: calc(var(--u) * 63);
    line-height: calc(var(--u) * 68);
    letter-spacing: -0.04em;
    color: var(--c-dark-blue);
    white-space: nowrap;
}

.company__title-line {
    position: absolute;
    left: 0;
    top: 0;
}

.company__title .company__title-line--2 {
    left: calc(var(--u) * 72);
    top: calc(var(--u) * 75);
    color: var(--c-red);
}

/* Бренды «облаком»: каждая плитка — на своём месте из макета */
.company__brands {
    position: absolute;
    left: calc(var(--u) * 794);
    top: calc(var(--u) * 252);
    width: calc(var(--u) * 620);
    height: calc(var(--u) * 238);
    margin: 0;
    padding: 0;
    list-style: none;
}

.company__brand {
    position: absolute;
}

.company__brand:nth-child(1) { left: 0; top: calc(var(--u) * 96); --w: 96; --h: 64; }
.company__brand:nth-child(2) { left: calc(var(--u) * 119); top: calc(var(--u) * 67); --w: 124; --h: 140; }
.company__brand:nth-child(3) { left: calc(var(--u) * 262); top: 0; --w: 104; --h: 116; }
.company__brand:nth-child(4) { left: calc(var(--u) * 262); top: calc(var(--u) * 130); --w: 104; --h: 108; }
.company__brand:nth-child(5) { left: calc(var(--u) * 384); top: calc(var(--u) * 42); --w: 114; --h: 75; }
.company__brand:nth-child(6) { left: calc(var(--u) * 384); top: calc(var(--u) * 132); --w: 114; --h: 88; }
.company__brand:nth-child(7) { left: calc(var(--u) * 516); top: calc(var(--u) * 75); --w: 104; --h: 100; }

.company__brand-tile {
    display: flex;
    align-items: center;
    justify-content: center;
    width: calc(var(--u) * var(--w));
    height: calc(var(--u) * var(--h));
    border-radius: calc(var(--u) * 20);
    background: #fff;
    box-shadow: 0 calc(var(--u) * 10) calc(var(--u) * 30) rgba(244, 0, 52, 0.06);
}

.company__brand-logo {
    width: calc(var(--u) * var(--logo-w));
    max-width: 88%;
    height: auto;
    max-height: 88%;
    object-fit: contain;
}

.company__features {
    position: absolute;
    left: calc(var(--u) * 220);
    top: calc(var(--u) * 495);
    display: flex;
    flex-direction: column;
    gap: calc(var(--u) * 20);
    width: calc(var(--u) * 418);
    height: calc(var(--u) * 482);
    padding: calc(var(--u) * 40);
    border-radius: calc(var(--u) * 28);
    background: #fff;
}

.company__feature {
    display: flex;
    align-items: flex-start;
    gap: calc(var(--u) * 18);
}

.company__feature-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: calc(var(--u) * 64);
    height: calc(var(--u) * 64);
    border-radius: 900px;
    background: #fff;
    box-shadow: 0 0 calc(var(--u) * 14) rgba(32, 45, 63, 0.06);
}

.company__feature-icon img {
    width: calc(var(--u) * 24);
    height: calc(var(--u) * 24);
}

.company__feature-title {
    font-family: var(--f-head);
    font-weight: 700;
    font-size: calc(var(--u) * 18);
    line-height: calc(var(--u) * 24);
    letter-spacing: -0.03em;
    color: var(--c-dark-blue);
}

.company__feature-text {
    margin-top: calc(var(--u) * 6);
    font-size: calc(var(--u) * 16);
    line-height: calc(var(--u) * 22);
    letter-spacing: -0.04em;
    color: var(--c-gray-50);
}

.company__text {
    position: absolute;
    left: calc(var(--u) * 679);
    top: calc(var(--u) * 567);
    display: flex;
    flex-direction: column;
    gap: calc(var(--u) * 12);
    width: calc(var(--u) * 432);
    font-size: calc(var(--u) * 18);
    line-height: calc(var(--u) * 28.8);
    letter-spacing: -0.04em;
    color: var(--c-black);
}

.company__text b {
    font-weight: 700;
}

.company__text .company__lead {
    margin-bottom: calc(var(--u) * 6);
    letter-spacing: -0.047em;
    font-family: var(--f-head);
    font-weight: 700;
    font-size: calc(var(--u) * 31);
    line-height: calc(var(--u) * 42);
    color: var(--c-dark-blue);
}

/* При 31px строки с ручными переносами шире колонки и уезжали под фото —
   переносим по ширине колонки */
.company__text .company__lead br {
    display: none;
}

.company__gallery {
    position: absolute;
    left: calc(var(--u) * 1148);
    top: calc(var(--u) * 528);
    width: calc(var(--u) * 552);
    height: calc(var(--u) * 406);
}

.company__slider {
    height: 100%;
    border-radius: calc(var(--u) * 25);
}

.company__slider .swiper-slide {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.company__arrow {
    position: absolute;
    z-index: 2;
    top: 50%;
    border: 0;
    box-shadow: 0 calc(var(--u) * 4) calc(var(--u) * 20) rgba(32, 45, 63, 0.12);
    transform: translateY(-50%);
}

.company__arrow--prev {
    left: calc(var(--u) * -27.5);
}

.company__arrow--next {
    right: calc(var(--u) * -27.5);
}

.company__arrow img {
    width: calc(var(--u) * 33);
    height: calc(var(--u) * 33);
}

.company__corp {
    position: absolute;
    left: calc(var(--u) * 220);
    top: calc(var(--u) * 1019);
    display: flex;
    align-items: center;
    width: calc(var(--u) * 1480);
    height: calc(var(--u) * 146);
    padding: 0 calc(var(--u) * 30);
    border: calc(var(--u) * 3) solid var(--c-red);
    border-radius: calc(var(--u) * 25);
}

.company__corp-title {
    font-family: var(--f-head);
    font-weight: 700;
    font-size: calc(var(--u) * 26);
    line-height: calc(var(--u) * 35);
    letter-spacing: -0.04em;
    color: var(--c-dark-blue);
}

.company__corp-text {
    margin-left: calc(var(--u) * 43);
    padding-left: calc(var(--u) * 40);
    border-left: 1px solid #FAD3DF;
    font-size: calc(var(--u) * 16);
    line-height: calc(var(--u) * 25);
    letter-spacing: -0.03em;
    color: var(--c-black);
}

.company__corp-text b {
    font-weight: 700;
}

.company__corp .btn-big {
    margin-top: 0;
    margin-left: auto;
    width: calc(var(--u) * 310);
    padding: calc(var(--u) * 9) calc(var(--u) * 10) calc(var(--u) * 9) calc(var(--u) * 9);
}

.btn-big--red {
    border: 1px solid #C5342F;
    background: linear-gradient(180deg, #E4534C 0%, #C02D27 61.591%, #DC342D 100%);
    box-shadow: none;
    filter: drop-shadow(0 calc(var(--u) * 12) calc(var(--u) * 20) rgba(244, 0, 52, 0.25));
}

.btn-big--red .btn-big__text {
    letter-spacing: -0.05em;
}

.btn-big--red .btn-big__icon {
    width: calc(var(--u) * 50);
    height: calc(var(--u) * 50);
}

.company__cane,
.company__house,
.company__gingerbread {
    position: absolute;
    max-width: none;
    pointer-events: none;
}

.company__cane {
    left: calc(var(--u) * 806);
    top: calc(var(--u) * 941);
    width: calc(var(--u) * 267);
    height: calc(var(--u) * 301);
}

.company__house {
    left: calc(var(--u) * 892);
    top: calc(var(--u) * 963);
    width: calc(var(--u) * 403);
    height: calc(var(--u) * 199);
}

.company__gingerbread {
    left: calc(var(--u) * 652);
    top: calc(var(--u) * 1094);
    width: calc(var(--u) * 122);
    height: calc(var(--u) * 126);
}

/* ===== Вы недавно смотрели ===== */
.recent {
    padding: calc(var(--u) * 80) calc(var(--u) * 220) calc(var(--u) * 80);
}

.recent__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: calc(var(--u) * 20);
}

.recent__title {
    font-family: var(--f-head);
    font-weight: 700;
    font-size: calc(var(--u) * 26);
    line-height: calc(var(--u) * 35);
    letter-spacing: -0.04em;
    color: var(--c-dark-blue);
}

.recent__slider {
    /* место под тень карточек */
    margin: calc(var(--u) * -24) 0;
    padding: calc(var(--u) * 24) 0;
}

/* Горизонтальная карточка товара */
.mini-card.swiper-slide {
    display: flex;
    width: calc(var(--u) * 358);
    height: auto;
    margin-right: calc(var(--u) * 16);
    overflow: hidden;
    border: 1px solid var(--c-gray-20);
    border-radius: calc(var(--u) * 20);
    background: #fff;
    box-shadow: 0 0 calc(var(--u) * 24) 0 rgba(73, 80, 85, 0.05);
}

.mini-card__media {
    position: relative;
    flex-shrink: 0;
    width: calc(var(--u) * 161);
    height: calc(var(--u) * 151);
}

.mini-card__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.mini-card__tags {
    position: absolute;
    left: calc(var(--u) * 10);
    bottom: calc(var(--u) * 7);
    display: flex;
    gap: calc(var(--u) * 4);
}

.mini-card__body {
    display: flex;
    flex-direction: column;
    min-width: 0;
    padding: calc(var(--u) * 16) calc(var(--u) * 16) calc(var(--u) * 16) 0;
}

.mini-card__title {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    font-family: var(--f-head);
    font-weight: 700;
    font-size: calc(var(--u) * 14);
    line-height: calc(var(--u) * 17);
    letter-spacing: -0.03em;
    color: var(--c-dark-blue);
}

.mini-card__prices {
    display: flex;
    align-items: center;
    gap: calc(var(--u) * 5);
    height: calc(var(--u) * 24);
    margin-top: calc(var(--u) * 9);
    white-space: nowrap;
}

.mini-card__price {
    font-weight: 600;
    font-size: calc(var(--u) * 18);
    line-height: calc(var(--u) * 21);
    letter-spacing: -0.04em;
    color: var(--c-red);
}

.mini-card__old-price {
    font-weight: 500;
    font-size: calc(var(--u) * 13);
    line-height: calc(var(--u) * 21);
    letter-spacing: -0.04em;
    color: var(--c-gray-30);
    text-decoration: line-through;
}

.mini-card__tags .tag {
    font-size: calc(var(--u) * 9);
    line-height: calc(var(--u) * 17);
}

.mini-card .product-card__cart {
    margin-top: auto;
    padding-top: calc(var(--u) * 9);
    padding-bottom: calc(var(--u) * 9);
}

/* ===== Подвал ===== */
.footer {
    position: relative;
    height: calc(var(--u) * 507);
    padding: calc(var(--u) * 80) calc(var(--u) * 220) 0;
    background: var(--c-dark-blue);
    color: #fff;
}

.footer a {
    transition: color .2s;
}

.footer__gingerbread {
    position: absolute;
    left: calc(var(--u) * 1378);
    top: calc(var(--u) * 221);
    z-index: 1;
    width: calc(var(--u) * 292);
    height: calc(var(--u) * 222);
    max-width: none;
    pointer-events: none;
}

.footer__top {
    display: flex;
    align-items: flex-start;
    height: calc(var(--u) * 327);
}

.footer__about {
    width: calc(var(--u) * 367);
}

.footer__logo img {
    width: calc(var(--u) * 84);
    height: calc(var(--u) * 85);
}

.footer__text {
    margin-top: calc(var(--u) * 10);
    font-size: calc(var(--u) * 15);
    line-height: calc(var(--u) * 21.5);
    letter-spacing: -0.03em;
    color: #D2D6D9;
}

.footer__text b {
    font-weight: 700;
    color: #fff;
}

.footer__socials {
    display: flex;
    gap: calc(var(--u) * 6);
    margin-top: calc(var(--u) * 27);
}

.footer__socials a {
    transition: transform .2s;
}

.footer__socials a:hover {
    transform: translateY(-2px);
}

.footer__socials img {
    width: calc(var(--u) * 31);
    height: calc(var(--u) * 31);
}

.footer__note {
    margin-top: calc(var(--u) * 10);
    font-size: calc(var(--u) * 13);
    line-height: calc(var(--u) * 18);
    letter-spacing: -0.03em;
    color: #BCC0C4;
}

.footer__col {
    flex-shrink: 0;
    margin-top: calc(var(--u) * 14);
}

.footer__col:nth-child(2) { width: calc(var(--u) * 223); }
.footer__col:nth-child(3) { width: calc(var(--u) * 216); }
.footer__col:nth-child(4) { width: calc(var(--u) * 223); }
.footer__col:nth-child(5) { width: calc(var(--u) * 236); }

.footer__heading {
    font-family: var(--f-head);
    font-weight: 700;
    font-size: calc(var(--u) * 18);
    line-height: calc(var(--u) * 26);
    letter-spacing: -0.03em;
    color: #fff;
}

.footer__links {
    display: flex;
    flex-direction: column;
    gap: calc(var(--u) * 9);
    margin-top: calc(var(--u) * 13);
    font-size: calc(var(--u) * 15);
    line-height: calc(var(--u) * 22);
    letter-spacing: -0.04em;
}

.footer__links a {
    color: #BDC0C5;
}

.footer__links a:hover {
    color: var(--c-red);
}

.footer__phone,
.footer__mail {
    display: flex;
    align-items: center;
    gap: calc(var(--u) * 11);
    letter-spacing: -0.03em;
}

.footer__phone {
    margin-top: calc(var(--u) * 10);
    white-space: nowrap;
    font-size: calc(var(--u) * 18);
    line-height: calc(var(--u) * 26);
    color: #BDC0C5;
}

.footer__phone:hover {
    color: #fff;
}

.footer__mail {
    margin-top: calc(var(--u) * 12);
    font-size: calc(var(--u) * 17);
    line-height: calc(var(--u) * 24);
    color: var(--c-blue);
}

.footer__mail:hover {
    color: #fff;
}

.footer__phone img,
.footer__mail img {
    width: calc(var(--u) * 20);
    height: calc(var(--u) * 20);
}

.footer__bottom {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding-top: calc(var(--u) * 26);
    border-top: 1px solid rgba(255, 255, 255, 0.07);
}

.footer__legal {
    font-size: calc(var(--u) * 14);
    line-height: calc(var(--u) * 22);
    letter-spacing: -0.045em;
    color: #fff;
}

.footer__copy {
    margin-top: calc(var(--u) * 6);
    font-size: calc(var(--u) * 12);
    line-height: calc(var(--u) * 18);
    letter-spacing: -0.03em;
    color: #D2D6D9;
}

.footer__docs {
    display: flex;
    flex-direction: column;
    gap: calc(var(--u) * 6);
    width: calc(var(--u) * 432);
    font-size: calc(var(--u) * 13);
    line-height: calc(var(--u) * 21);
    letter-spacing: -0.04em;
}

.footer__docs li {
    display: flex;
    gap: calc(var(--u) * 28);
}

.footer__docs a {
    flex-shrink: 0;
    white-space: nowrap;
    color: #fff;
    border-bottom: 1px solid rgba(255, 255, 255, 0.15);
}

.footer__docs a:hover {
    color: var(--c-red);
}

/* ===== Адаптив (макета под мобильные нет — упрощённая раскладка) ===== */
@media (max-width: 1279px) {
    body {
        --u: 0.75px;
    }

    .header {
        padding: 20px 16px;
    }

    .header__tagline,
    .header__divider,
    .header__nav {
        display: none;
    }

    .header__actions {
        gap: 20px;
    }

    .hero {
        height: auto;
        padding: 150px 16px 70vw;
        background-size: 140% auto;
        background-position: 80% bottom;
    }

    .hero__content {
        position: static;
        width: 100%;
        max-width: 643px;
    }

    .products {
        align-items: flex-start;
        padding: 80px 16px;
    }

    .kit {
        display: flex;
        flex-direction: column;
        height: auto;
        padding: 80px 16px 0;
        /* Сверху голубой фон, снизу картинка из поля целиком — с «подтёками» */
        background: var(--c-bg-blue);
    }

    .kit__note {
        order: 1;
    }

    .kit__bg {
        order: 2;
    }

    .kit__bg {
        position: relative;
        width: calc(100% + 32px);
        height: auto;
        aspect-ratio: 1920 / 1062;
        margin: 24px -16px 0;
    }

    .kit__note {
        position: relative;
        left: auto;
        top: auto;
        z-index: 1;
        white-space: normal;
        text-align: right;
    }

    .about {
        display: flex;
        flex-direction: column;
        height: auto;
        padding: 80px 16px 40px;
    }

    .about__content {
        width: 100%;
        max-width: 560px;
    }

    .about__photo {
        position: relative;
        left: auto;
        top: auto;
        order: 1;
        width: 100%;
        max-width: 560px;
        height: auto;
        margin: 40px auto 0;
    }

    .about__stars {
        top: auto;
        bottom: 0;
        width: 100%;
        height: auto;
    }

    .categories {
        padding: 60px 0;
    }

    .categories__list {
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        scroll-padding: 0 16px;
        padding: 0 16px;
        scrollbar-width: none;
    }

    .categories__list::-webkit-scrollbar {
        display: none;
    }

    .category-card {
        flex: 0 0 calc(var(--u) * 283);
        scroll-snap-align: start;
    }

    .novelty {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 48px;
        height: auto;
        padding: 80px 16px;
        background: none;
    }

    .novelty__photo,
    .novelty__content,
    .novelty-card {
        position: relative;
        left: auto;
        top: auto;
    }

    .novelty__photo {
        width: min(100% - 66px, 400px);
        height: auto;
        aspect-ratio: 530 / 769;
        margin: 33px 0;
    }

    .novelty__content {
        width: 100%;
        max-width: 560px;
    }

    .why {
        display: flex;
        flex-direction: column;
        height: auto;
        padding: 60px 16px;
    }

    .why__panel,
    .why__girl {
        position: relative;
        left: auto;
        top: auto;
        width: 100%;
        height: auto;
    }

    .why__panel--blue {
        order: 1;
        margin-top: 32px;
        padding: 24px;
        overflow-x: auto;
        scrollbar-width: none;
    }

    .why__panel--blue::-webkit-scrollbar {
        display: none;
    }

    .why-card {
        flex-shrink: 0;
    }

    .why__girl {
        order: 2;
        max-width: 520px;
        margin: 32px auto -1px;
    }

    .why__gingerbread {
        display: none;
    }

    .why__panel--purple {
        order: 3;
        padding: 32px 24px;
        border-top-left-radius: 0;
        border-top-right-radius: 0;
    }

    .reviews {
        display: flex;
        flex-direction: column;
        gap: 32px;
        height: auto;
        padding: 80px 16px 200px;
        /* картинка фона прижата к низу, сверху — её голубой цвет */
        background:
            var(--reviews-bg) left bottom / 100% auto no-repeat,
            linear-gradient(#D3EAF7, #D3EAF7) top / 100% calc(100% - 100cqw * 1122 / 1920 + 2px) no-repeat;
    }

    .reviews__summary,
    .reviews__slider,
    .reviews__arrows {
        position: relative;
        left: auto;
        top: auto;
    }

    .reviews__summary {
        width: 100%;
        max-width: 606px;
        height: auto;
        padding: 24px;
    }

    .reviews__score {
        flex-wrap: wrap;
        gap: 16px;
    }

    .reviews__score > div::after {
        display: none;
    }

    .reviews__photos {
        flex-wrap: wrap;
    }

    .reviews__slider {
        width: calc(100% + 32px);
        height: 480px;
        margin: 0 -16px;
        padding: 0 16px;
    }

    .reviews__arrows {
        flex-direction: row;
        align-self: center;
    }

    .reviews__candy {
        display: none;
    }

    .reviews__cane {
        left: auto;
        right: 0;
        width: 130px;
        height: auto;
    }

    .leisure {
        display: flex;
        flex-direction: column;
        height: auto;
        padding: 60px 16px;
    }

    .leisure__photo {
        position: relative;
        left: auto;
        top: auto;
        order: 1;
        width: 100%;
        height: auto;
        aspect-ratio: 1004 / 863;
        margin-top: 32px;
        --u: calc((100cqw - 32px) / 1004);
    }

    .company {
        display: flex;
        flex-direction: column;
        gap: 32px;
        height: auto;
        padding: 120px 16px 60px;
        background-color: #FFEEF4;
    }

    .company__partners,
    .company__features,
    .company__text,
    .company__gallery,
    .company__corp {
        position: relative;
        left: auto;
        top: auto;
    }

    .company__partners {
        order: 1;
        width: 100%;
        max-width: 560px;
        height: auto;
    }

    .company__features {
        width: 100%;
        max-width: 560px;
        height: auto;
        padding: 24px;
    }

    .company__text {
        width: 100%;
        max-width: 560px;
    }

    /* Стрелки висят на краях фото, поэтому фото уже на ширину половины стрелки */
    .company__gallery {
        width: calc(100% - 44px);
        height: auto;
        aspect-ratio: 552 / 406;
        margin: 0 22px;
    }

    .company__corp {
        flex-wrap: wrap;
        gap: 16px;
        width: 100%;
        height: auto;
        padding: 24px;
    }

    .company__corp-text {
        margin-left: 0;
        padding-left: 0;
        border-left: 0;
    }

    .company__corp .btn-big {
        margin-left: 0;
    }

    .company__cane,
    .company__house,
    .company__gingerbread {
        display: none;
    }

    .recent {
        padding: 60px 16px;
    }

    .recent__slider {
        margin: -24px -16px;
        padding: 24px 16px;
    }

    .footer {
        height: auto;
        padding: 48px 16px 32px;
    }

    .footer__top {
        flex-wrap: wrap;
        gap: 32px 24px;
        height: auto;
        padding-bottom: 32px;
    }

    .footer__about {
        width: 100%;
    }

    .footer__col,
    .footer__col:nth-child(n) {
        width: calc(50% - 12px);
        margin-top: 0;
    }

    .footer__gingerbread {
        display: none;
    }

    .footer__bottom {
        flex-direction: column;
        gap: 20px;
    }

    .footer__docs {
        width: 100%;
    }

    .footer__docs li {
        flex-wrap: wrap;
        gap: 6px 20px;
    }

    .footer__docs a {
        white-space: normal;
    }

    .products__slider {
        margin: -24px -16px;
        padding: 24px 16px;
        width: calc(100% + 32px);
    }
}

@media (max-width: 767px) {
    /* Левая половина фона «Состава» — пустая подложка, поэтому на телефоне
       показываем правую часть с набором: картинка по высоте блока, прижата вправо */
    .kit__bg {
        aspect-ratio: 390 / 372;
        background-position: right bottom;
        background-size: auto 100%;
    }

    .header__cart-text {
        display: none;
    }

    .hero__title-wrap {
        height: auto;
        white-space: normal;
    }

    .hero__title span,
    .hero__subtitle span {
        position: static;
    }

    .hero__title {
        font-size: 40px;
        line-height: 1;
    }

    .hero__subtitle {
        display: block;
        margin-top: 12px;
        font-size: 20px;
        line-height: 1.3;
    }

    .hero__subtitle span:nth-child(1) {
        white-space: normal;
    }

    .products__title {
        font-size: 34px;
        line-height: 38px;
    }

    .products__arrows {
        display: none;
    }

    .recent__title {
        font-size: 22px;
        line-height: 28px;
    }

    .about__title {
        width: auto;
        height: auto;
        font-size: 34px;
        line-height: 38px;
        white-space: normal;
    }

    .about__title span,
    .about__title .about__title-accent {
        position: static;
        display: block;
    }

    .about__text {
        font-size: 16px;
        line-height: 24px;
    }

    .about__text .about__lead {
        font-size: 20px;
        line-height: 26px;
    }

    .about__text .about__lead br {
        display: none;
    }

    .novelty__title {
        font-size: 34px;
        line-height: 38px;
    }

    .novelty__subtitle {
        font-size: 20px;
        line-height: 26px;
    }

    .novelty-card {
        width: 100%;
        max-width: 358px;
    }

    .why__title {
        width: auto;
        height: auto;
        font-size: 34px;
        line-height: 38px;
        white-space: normal;
    }

    .why__title-line,
    .why__title .why__title-line--2 {
        position: static;
        display: block;
    }

    .reviews__title {
        width: auto;
        height: auto;
        margin-left: 0;
        font-size: 34px;
        line-height: 38px;
        white-space: normal;
    }

    .reviews__title-line,
    .reviews__title .reviews__title-line--2 {
        position: static;
        display: block;
    }

    .review.swiper-slide {
        padding: 20px;
        border-radius: 28px;
    }

    .review__text br {
        display: none;
    }

    .leisure__title {
        width: auto;
        height: auto;
        font-size: 34px;
        line-height: 38px;
        white-space: normal;
    }

    .leisure__title-line,
    .leisure__title .leisure__title-line--2 {
        position: static;
        display: block;
    }

    .leisure__text {
        margin-left: 0;
        font-size: 16px;
        line-height: 24px;
    }

    .leisure__text br {
        display: none;
    }

    .leisure .btn-big {
        white-space: normal;
    }

    .company__title {
        width: auto;
        height: auto;
        margin-left: 0;
        font-size: 34px;
        line-height: 38px;
    }

    .company__title-line,
    .company__title .company__title-line--2 {
        position: static;
        display: block;
    }

    .company__text {
        font-size: 16px;
        line-height: 24px;
    }

    .company__text .company__lead {
        font-size: 20px;
        line-height: 26px;
    }

    .company__corp-text br {
        display: none;
    }

    .kit__title {
        width: auto;
        height: auto;
        font-size: 34px;
        line-height: 38px;
        white-space: normal;
    }

    .kit__title span {
        position: static;
        font-size: inherit;
        line-height: inherit;
    }

    .kit__title-line {
        display: block;
    }

    .kit__list {
        width: 100%;
        justify-content: space-between;
        gap: 32px 8px;
    }

    .products .btn-big {
        align-self: center;
    }

    .hero__text p {
        width: auto;
        font-size: 16px;
        line-height: 24px;
    }
}

/* ===== Телефон: главная по мобильному макету (360px) =====
   Мобильный макет нарисован почти в масштабе десктопа, поэтому 1px макета = 1px. */
.header__menu-btn,
.header__nav-head,
.header__nav-contacts,
.menu-overlay {
    display: none;
}

@media (max-width: 767px) {
    body {
        --u: 1px;
    }

    /* --- Шапка: логотип, подпись, кнопка «Меню» --- */
    .header {
        padding: 16px 13px;
    }

    .header__brand {
        gap: 12px;
    }

    .header__logo {
        width: 59px;
        height: 59px;
        padding: 0;
    }

    .header__logo img {
        width: 59px;
        height: 59px;
    }

    .header__divider {
        display: flex;
        height: 47px;
    }

    .header__divider img {
        width: 47px;
    }

    .header__tagline {
        display: block;
        font-size: 10.5px;
        line-height: 16px;
    }

    .header__actions {
        display: none;
    }

    .header__menu-btn {
        display: inline-flex;
        align-items: center;
        gap: 10px;
        height: 32px;
        padding: 0 12px 0 10px;
        border-radius: 8px;
        background: rgba(46, 136, 189, .14);
        font-family: var(--f-accent);
        font-size: 11px;
        font-weight: 700;
        letter-spacing: .02em;
        text-transform: uppercase;
        color: var(--c-muted);
        cursor: pointer;
    }

    .header__menu-btn img {
        width: 20px;
        height: 20px;
    }

}

@media (max-width: 767px) {
    /* --- Большие кнопки: 60px, кружок 48px (все кнопки мобильного макета) --- */
    .btn-big {
        gap: 16px;
        padding: 6px 26px 6px 6px;
        font-size: 17px;
        line-height: 20px;
    }

    .btn-big__icon {
        flex: none;
        width: 48px;
        height: 48px;
    }

    .btn-big__icon img {
        width: 16px;
        height: 16px;
    }

    /* --- Первый экран --- */
    .hero {
        height: 800px;
        padding: 125px 13px 0;
        background-size: 190% auto;
        background-position: 96% bottom;
    }

    .hero__content {
        gap: 18px;
    }

    .hero__head {
        gap: 16px;
    }

    .hero__title {
        font-size: 35px;
        line-height: 38px;
    }

    /* Строки заголовка — поля под раскладку десктопа («Наборы для выпечки и» +
       «декора»): на телефоне текст идёт одним потоком, ширина задаёт перенос
       после «для», как в макете */
    .hero__title {
        max-width: 316px;
    }

    .hero__title span {
        display: inline;
    }

    .hero__subtitle {
        margin-top: 8px;
        font-size: 22px;
        line-height: 28px;
        font-weight: 700;
    }

    /* «— незабываемый / подарок» лесенкой, как в макете */
    .hero__subtitle span {
        display: block;
    }

    .hero__subtitle span:nth-child(1) {
        padding-left: 4px;
    }

    .hero__subtitle span:nth-child(2) {
        padding-left: 160px;
    }

    .hero__text {
        gap: 14px;
        margin-top: 4px;
    }

    .hero__text img {
        width: 22px;
        height: 22px;
        margin-top: 2px;
    }

    .hero__text p {
        font-size: 14px;
        line-height: 21px;
        letter-spacing: -0.02em;
    }
}

@media (max-width: 767px) {
    /* --- Популярные наборы --- */
    .products {
        gap: 22px;
        padding: 40px 13px 40px;
    }

    /* Карточка ~81% ширины: справа виден следующий слайд, как в макете */
    .products .product-card.swiper-slide {
        width: calc((100cqw - 26px) * .81);
        margin-right: 12px;
    }

    .products .product-card__media {
        height: calc((100cqw - 26px) * .72);
    }

    .products .product-card__title {
        font-size: 17px;
        line-height: 22px;
    }

    .products__title {
        font-size: 31px;
        line-height: 38px;
    }

    .products__slider {
        margin: -24px -13px;
        padding: 24px 13px;
        width: calc(100% + 26px);
    }

    /* --- Что входит в набор --- */
    .kit {
        padding: 40px 13px 0;
    }

    .kit__content {
        gap: 26px;
    }

    .kit__title {
        font-size: 30px;
        line-height: 38px;
    }

    /* Сетка 2×3, плашки мельче десктопных: размеры картинок заданы в --u */
    .kit__list {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        justify-items: center;
        gap: 22px 8px;
        width: 100%;
    }

    /* Макет 360: кружок 89×109, галочка 24×32 на его правом верхнем крае.
       Элемент занимает всю ячейку сетки, поэтому галочку ставим от центра ячейки */
    .kit-item {
        --u: .636px;
        gap: 11px;
        width: 100%;
    }

    .kit-item__pic {
        width: 89px;
    }

    .kit-item__check {
        --u: .95px;
        top: 2px;
        right: calc(50% - 46px);
    }

    .kit-item--glaze .kit-item__check {
        right: calc(50% - 46px);
    }

    .kit-item__name {
        max-width: 150px;
        font-size: 15px;
        line-height: 18px;
    }

    /* Большая коробка — во всю ширину, сноска под ней */
    .kit__bg {
        width: calc(100% + 26px);
        margin-right: -13px;
        margin-left: -13px;
        aspect-ratio: 360 / 400;
        margin-top: -20px;
        background-size: 215% auto;
        background-position: 80% bottom;
    }

    .kit__note {
        display: none;
    }
}

@media (max-width: 767px) {
    /* --- Что такое «Сделай Бокс» --- */
    .about {
        padding: 50px 13px 0;
    }

    .about__title {
        font-size: 30px;
        line-height: 38px;
    }

    /* Вторая строка заголовка смещена вправо, как в макете */
    .about__title .about__title-accent {
        padding-left: 62px;
    }

    .about__text .about__lead {
        max-width: 330px;
        font-size: 21px;
        line-height: 30px;
    }

    .about__text {
        gap: 10px;
        margin-top: 24px;
        font-size: 16px;
        line-height: 22px;
        letter-spacing: -0.03em;
    }

    .about__photo {
        margin-top: 24px;
    }
}

.categories__arrows {
    display: none;
}

@media (max-width: 767px) {
    /* --- Категории: лента узких карточек, стрелки под ней --- */
    .categories {
        padding: 40px 0 26px;
    }

    .categories__list {
        gap: 9px;
        padding: 0 13px;
        scroll-padding: 0 13px;
    }

    .category-card {
        flex: 0 0 160px;
        height: 250px;
    }

    .category-card__title {
        display: block;
        margin-top: 28px;
        max-width: 110px;
        white-space: normal;
        font-size: 21px;
        line-height: 24px;
        text-align: center;
    }

    .category-card__btn {
        bottom: 18px;
        gap: 8px;
        padding: 4px 14px 4px 4px;
        font-size: 14px;
    }

    .category-card__btn-icon {
        width: 26px;
        height: 26px;
    }

    .category-card__btn-icon img {
        width: 12px;
        height: 12px;
    }

    .categories__arrows {
        display: flex;
        justify-content: center;
        gap: 22px;
        margin-top: 8px;
    }

    .categories__arrow {
        display: flex;
        padding: 4px;
        cursor: pointer;
    }

    .categories__arrow img {
        width: 30px;
        height: 30px;
    }

    .categories__arrow--prev img {
        transform: rotate(180deg);
        opacity: .4;
    }

    /* --- Новинка года --- */
    .novelty {
        gap: 26px;
        padding: 19px 13px 40px;
    }

    .novelty__photo {
        width: calc(100% - 48px);
        max-width: 310px;
        margin: 24px 0 0;
    }

    .novelty__photo::before {
        inset: -12px;
    }

    .novelty__content {
        text-align: center;
    }

    .novelty__title {
        font-size: 29px;
        line-height: 36px;
        white-space: nowrap;
    }

    .novelty__title br {
        display: none;
    }

    .novelty__subtitle {
        margin-top: 8px;
        font-size: 20px;
        line-height: 30px;
    }

    .novelty__features {
        gap: 14px;
        margin-top: 18px;
        text-align: left;
    }

    .novelty__feature {
        gap: 18px;
    }

    .novelty__feature img {
        width: 38px;
        height: 38px;
    }

    .novelty__feature-title {
        font-size: 15px;
        line-height: 20px;
    }

    .novelty__feature-text {
        margin-top: 2px;
        font-size: 14px;
        line-height: 20px;
    }

    .novelty-card {
        width: 100%;
        max-width: none;
        padding: 20px 14px 14px;
    }

    .novelty-card__img {
        display: flex;
        justify-content: center;
    }

    .novelty-card__img img {
        width: 270px;
        height: auto;
    }

    .novelty-card__specs {
        font-size: 15px;
        line-height: 22px;
    }

    .novelty-card .btn-big {
        width: 100%;
    }
}

@media (max-width: 767px) {
    /* --- Почему «Сделай Бокс» --- */
    .why {
        padding: 40px 13px 40px;
    }

    .why__title {
        font-size: 31px;
        line-height: 40px;
    }

    .why__title-line,
    .why__title .why__title-line--2 {
        display: block;
    }

    /* «Почему / “Сделай Бокс” / лучший подарок» — в три строки */
    .why__title-line:first-child {
        max-width: 260px;
    }

    /* Строки: фото слева, заголовок и кнопки справа */
    .why__panel--blue {
        flex-direction: column;
        gap: 10px;
        margin-top: 22px;
        padding: 16px;
        overflow: visible;
        border-radius: 24px;
    }

    .why-card {
        display: grid;
        grid-template-columns: 113px minmax(0, 1fr);
        grid-template-rows: 1fr auto auto 1fr;
        column-gap: 16px;
        width: 100%;
    }

    .why-card__img {
        grid-row: 1 / -1;
        height: 130px;
        border-radius: 16px;
    }

    .why-card__title {
        grid-row: 2;
        margin: 0;
        padding: 0;
        font-size: 15px;
        line-height: 18px;
    }

    .why-card__title br {
        display: inline;
    }

    .why-card__btns {
        grid-row: 3;
        gap: 6px;
        margin-top: 10px;
        padding: 0;
    }

    .why__girl {
        display: none;
    }

    .why__panel--purple {
        margin-top: 12px;
        padding: 26px 22px 22px;
        border-radius: 24px;
    }

    .why__features {
        gap: 18px;
    }

    .why__feature-title {
        font-size: 16px;
        line-height: 20px;
    }

    .why__feature-text {
        margin-top: 6px;
        font-size: 14px;
        line-height: 21px;
    }

    .why__panel--purple .btn-big {
        width: 100%;
        margin-top: 22px;
    }

    .why__panel--purple .btn-big .btn-big__text,
    .why__panel--purple .btn-big {
        justify-content: flex-start;
    }
}

@media (max-width: 767px) {
    /* --- Отзывы: один отзыв в ряд, стрелки ‹ › под ним --- */
    .reviews {
        gap: 20px;
        padding: 50px 13px 150px;
    }

    .reviews__title {
        font-size: 31px;
        line-height: 40px;
    }

    .reviews__title .reviews__title-line--2 {
        padding-left: 108px;
    }

    .reviews__candy {
        display: block;
        top: 170px;
        left: 230px;
        width: 30px;
        height: auto;
    }

    .reviews__cane {
        width: 96px;
        right: 34px;
    }

    .reviews__summary {
        padding: 18px 14px;
        border-radius: 24px;
    }

    .reviews__label {
        font-size: 15px;
        line-height: 20px;
    }

    .reviews__rating {
        gap: 14px;
        margin-top: 4px;
        font-size: 40px;
    }

    .reviews__note {
        font-size: 13px;
        line-height: 21px;
    }

    .reviews__label--photos {
        margin-top: 16px;
    }

    /* Фото покупателей — лентой с прокруткой */
    .reviews__photos {
        flex-wrap: nowrap;
        gap: 7px;
        margin: 8px -14px 0 0;
        padding-right: 14px;
        overflow-x: auto;
        scrollbar-width: none;
    }

    .reviews__photos::-webkit-scrollbar {
        display: none;
    }

    .reviews__photos img,
    .reviews__more {
        flex: none;
        width: 68px;
        height: 91px;
    }


    .reviews__slider {
        width: 100%;
        height: auto;
        margin: 0;
        padding: 0;
        overflow: hidden;
        border-radius: 24px;
    }

    /* Карточка отзыва — как в мобильном макете */
    .review.swiper-slide {
        padding: 14px 14px 18px;
        border-radius: 24px;
        box-shadow: none;
    }

    .review__head {
        gap: 12px;
    }

    .review__text {
        margin-top: 12px;
        font-size: 16px;
        line-height: 21px;
    }

    .review__photos {
        gap: 8px;
        margin: 10px -14px 0 0;
        padding-right: 14px;
    }

    .review__photos img {
        flex: none;
    }

    .reviews__arrows .arrow-btn.swiper-button-disabled {
        opacity: 1;
    }

    .review__photos {
        overflow-x: auto;
        scrollbar-width: none;
    }

    .reviews__arrows {
        gap: 10px;
    }

    .reviews__arrows .arrow-btn {
        border: 0;
    }

    .reviews__arrows .arrow-btn img {
        transform: rotate(-90deg);
    }
}

@media (max-width: 767px) {
    /* Отзывы на телефоне листаются вбок — затухание сверху и снизу не нужно */
    .reviews__slider {
        -webkit-mask-image: none;
        mask-image: none;
    }

    /* --- Чем заняться, пока ждёте бокс --- */
    .leisure {
        padding: 50px 13px 40px;
        overflow-x: clip;
    }

    .leisure__title {
        font-size: 31px;
        line-height: 40px;
    }

    .leisure__title .leisure__title-line--2 {
        padding-left: 65px;
    }

    .leisure__text {
        margin-top: 14px;
        font-size: 16px;
        line-height: 22px;
    }

    .leisure .btn-big {
        margin-top: 18px;
        white-space: nowrap;
        font-size: 15px;
    }

    /* Фото одним файлом (большое фото и овалы) — целиком по ширине */
    .leisure__photo {
        margin-top: 22px;
    }
}

@media (max-width: 767px) {
    /* --- О нашей компании: порядок как в макете --- */
    .company {
        gap: 20px;
        padding: 90px 13px 50px;
    }

    .company__head { order: 1; }
    .company__text { order: 2; }
    .company__features { order: 3; }
    .company__brands { order: 4; }
    .company__gallery { order: 5; }
    .company__cane { order: 6; }
    .company__corp { order: 7; }
    .company__house { order: 8; }

    .company__title {
        font-size: 31px;
        line-height: 40px;
    }

    .company__title .company__title-line--2 {
        padding-left: 36px;
    }

    .company__text {
        font-size: 16px;
        line-height: 22px;
        letter-spacing: -0.03em;
    }

    .company__text .company__lead {
        max-width: 330px;
        font-size: 21px;
        line-height: 30px;
    }

    .company__features {
        gap: 14px;
        padding: 20px 14px;
        border-radius: 24px;
    }

    .company__feature-title {
        font-size: 16px;
        line-height: 20px;
    }

    .company__feature-text {
        font-size: 14px;
        line-height: 21px;
    }

    .company__feature-text br {
        display: none;
    }

    /* Бренды — лентой квадратных плиток с прокруткой вбок */
    .company__brands {
        position: relative;
        left: auto;
        top: auto;
        display: flex;
        gap: 12px;
        width: calc(100% + 26px);
        height: auto;
        margin: 0 -13px;
        padding: 0 13px;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        scroll-padding: 0 13px;
        scrollbar-width: none;
    }

    .company__brands::-webkit-scrollbar {
        display: none;
    }

    .company__brand,
    .company__brand:nth-child(n) {
        position: static;
        flex: none;
        scroll-snap-align: start;
        --w: 140;
        --h: 140;
    }

    .company__brand-tile {
        border-radius: 24px;
        box-shadow: none;
    }

    /* Фото производства во всю ширину, стрелки под ним */
    .company__gallery {
        width: 100%;
        margin: 0 0 40px;
        aspect-ratio: 334 / 245;
    }

    .company__arrow {
        top: auto;
        bottom: -40px;
        width: 30px;
        height: 30px;
        background: none;
        box-shadow: none;
        transform: none;
    }

    .company__arrow--prev {
        left: calc(50% - 35px);
    }

    .company__arrow--next {
        right: calc(50% - 35px);
    }

    .company__arrow img {
        width: 30px;
        height: 30px;
    }

    /* Корпоративным клиентам: карамельная трость на углу, пряничный домик внутри карточки */
    .company__cane {
        display: block;
        position: relative;
        left: auto;
        top: auto;
        z-index: 2;
        align-self: flex-end;
        width: 100px;
        height: auto;
        margin: -16px 6px -86px 0;
    }

    .company__corp {
        flex-direction: column;
        align-items: flex-start;
        gap: 14px;
        padding: 26px 22px calc((100cqw - 30px) * 398 / 549);
        border-width: 2px;
        border-radius: 24px;
    }

    .company__corp-title {
        font-size: 26px;
        line-height: 32px;
    }

    .company__corp-text {
        font-size: 15px;
        line-height: 22px;
    }

    .company__corp .btn-big {
        width: 100%;
    }

    .company__house {
        display: block;
        position: relative;
        left: auto;
        top: auto;
        z-index: 1;
        align-self: center;
        /* Во всю ширину карточки (внутри рамки 2px), прижат к её низу.
           Слева в картинке пустое поле (под десктоп) — его обрезаем */
        width: calc(100% - 4px);
        height: auto;
        aspect-ratio: 549 / 398;
        object-fit: cover;
        object-position: right center;
        margin-top: calc((100cqw - 30px) * -398 / 549 - 22px);
        margin-bottom: 2px;
        border-radius: 0 0 22px 22px;
    }
}

@media (max-width: 767px) {
    /* --- Подвал: логотип по центру, ссылки — раскрывающимися списками --- */
    .footer {
        padding: 30px 13px 26px;
    }

    .footer__top {
        flex-direction: column;
        gap: 8px;
        padding-bottom: 24px;
    }

    .footer__about {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 14px;
        margin-bottom: 12px;
        text-align: center;
    }

    .footer__text {
        font-size: 15px;
        line-height: 21px;
    }

    .footer__text br {
        display: none;
    }

    .footer__socials {
        justify-content: center;
    }

    .footer__col,
    .footer__col:nth-child(n) {
        width: 100%;
    }

    .footer__heading {
        font-size: 18px;
        line-height: 26px;
    }

    .footer__col--links .footer__heading {
        display: flex;
        align-items: center;
        justify-content: space-between;
        cursor: pointer;
    }

    .footer__col--links .footer__heading::after {
        content: '';
        width: 7px;
        height: 7px;
        margin-right: 6px;
        border-right: 1.5px solid currentColor;
        border-bottom: 1.5px solid currentColor;
        transform: rotate(45deg) translateY(-3px);
        transition: transform .2s;
    }

    .footer__col--links.is-open .footer__heading::after {
        transform: rotate(-135deg);
    }

    .footer__col--links .footer__links {
        display: none;
        margin: 8px 0 6px;
    }

    .footer__col--links.is-open .footer__links {
        display: flex;
    }

    .footer__col--contacts {
        display: flex;
        flex-direction: column;
        gap: 10px;
    }

    .footer__phone {
        font-size: 18px;
    }

    .footer__mail {
        font-size: 18px;
    }

    /* Документы — по одному в строке, юр. информация под ними */
    .footer__bottom {
        flex-direction: column-reverse;
        align-items: flex-start;
        gap: 14px;
    }

    .footer__docs li {
        flex-direction: column;
        gap: 10px;
        margin-bottom: 10px;
    }

    .footer__legal,
    .footer__docs a {
        font-size: 14px;
    }
}

@media (max-width: 767px) {
    /* --- Вы недавно смотрели: карточка во всю ширину, стрелки под лентой --- */
    .recent {
        display: flex;
        flex-direction: column;
        padding: 40px 13px;
    }

    .recent__top {
        display: contents;
    }

    .recent__title {
        order: 1;
        margin-bottom: 18px;
        font-size: 22px;
        line-height: 28px;
    }

    .recent__slider {
        order: 2;
        margin: -24px -13px;
        padding: 24px 13px;
    }

    .recent .products__arrows {
        display: flex;
        order: 3;
        justify-content: center;
        margin-top: 22px;
    }

    /* Слайд во всю ширину: соседний не выглядывает */
    .mini-card.swiper-slide {
        width: calc(100cqw - 26px);
        margin-right: 26px;
    }

    /* Подвал: подчёркивание документов — по ширине текста */
    .footer__logo img {
        width: 64px;
        height: 64px;
    }

    .footer__docs a {
        align-self: flex-start;
        white-space: normal;
    }

    .footer__top {
        gap: 4px;
    }
}

@media (max-width: 767px) {
    /* --- О компании: иконки преимуществ меньше --- */
    .company__feature {
        gap: 14px;
    }

    .company__feature-icon {
        width: 40px;
        height: 40px;
    }

    .company__feature-icon img {
        width: 20px;
        height: 20px;
    }

    /* --- Мобильное меню: выезжает справа почти на весь экран --- */
    .header__nav {
        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        z-index: 1001;
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 0;
        width: min(340px, calc(100% - 36px));
        padding: calc(18px + env(safe-area-inset-top, 0px)) 20px calc(24px + env(safe-area-inset-bottom, 0px));
        overflow-y: auto;
        border-radius: 28px 0 0 28px;
        background: #fff;
        box-shadow: -20px 0 50px rgba(32, 45, 63, .18);
        visibility: hidden;
        transform: translateX(100%);
        transition: transform .3s ease, visibility 0s linear .3s;
    }

    .header__nav.is-open {
        visibility: visible;
        transform: none;
        transition: transform .3s ease;
    }

    .header__nav-head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 18px;
    }

    .header__nav-title {
        font-family: var(--f-head);
        font-size: 26px;
        font-weight: 700;
        letter-spacing: -0.03em;
        color: var(--c-dark-blue);
    }

    .header__nav-close {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 44px;
        height: 44px;
        border-radius: 50%;
        background: #F2F4F5;
        cursor: pointer;
    }

    .header__nav-close img {
        width: 16px;
        height: 16px;
    }

    .header__nav .header__nav-link {
        justify-content: space-between;
        padding: 16px 4px;
        border-bottom: 1px solid var(--c-gray-20);
        font-family: var(--f-head);
        font-size: 19px;
        font-weight: 700;
        line-height: 24px;
        letter-spacing: -0.02em;
        color: var(--c-dark-blue);
        white-space: normal;
    }

    /* Шапка — свой слой: меню внутри неё должно быть над оверлеем */
    body.menu-open .header {
        z-index: 1001;
    }

    .header__nav .header__nav-link img {
        display: none;
    }

    .header__nav .header__nav-link::after {
        content: '';
        flex: none;
        width: 8px;
        height: 8px;
        margin-right: 4px;
        border-top: 2px solid #B9C3CA;
        border-right: 2px solid #B9C3CA;
        transform: rotate(45deg);
    }

    .header__nav .header__nav-link.is-active {
        color: var(--c-red);
        border-bottom-color: var(--c-gray-20);
    }

    .header__nav-contacts {
        display: flex;
        flex-direction: column;
        gap: 10px;
        margin-top: auto;
        padding-top: 28px;
    }

    .header__nav-contact {
        font-family: var(--f-head);
        font-size: 20px;
        font-weight: 700;
        color: var(--c-dark-blue);
    }

    .header__nav-contact--mail {
        font-family: var(--f-text);
        font-size: 16px;
        font-weight: 500;
        color: var(--c-blue);
    }

    .menu-overlay {
        position: fixed;
        inset: 0;
        z-index: 1000;
        display: block;
        background: rgba(20, 30, 42, .45);
        animation: sb-fade .3s ease;
    }

    .menu-overlay[hidden] {
        display: none;
    }

    html:has(body.menu-open),
    body.menu-open {
        overflow: hidden;
    }
}

@keyframes sb-fade {
    from { opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
    .header__nav,
    .menu-overlay {
        transition: none;
        animation: none;
    }
}