.invis {
    display: none;
}

/* Каталог */

.catalog-page {
    overflow: hidden;
    color: var(--color-text);
    background: var(--color-background);
}

.catalog-section {
    padding: 60px 0;
    background:
        linear-gradient(180deg, rgba(255, 244, 207, .92), rgba(255, 244, 207, .98)),
        url("../images/home/texture.jpg") center top / 720px auto repeat;
}

.catalog-breadcrumbs {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 42px;
    color: var(--color-text-muted);
    font-size: 18px;
    line-height: 1.35;
}

.catalog-breadcrumbs a {
    color: inherit;
    text-decoration: none;
}

.catalog-breadcrumbs a:hover {
    color: var(--color-primary);
}

.catalog-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 30px;
    margin-bottom: 70px;
}

.catalog-heading h1 {
    margin: 0;
    color: var(--color-secondary);
    font-size: clamp(64px, 6.7vw, 96px);
    font-weight: 700;
    line-height: .88;
    text-transform: uppercase;
    font-family: "Roboto Flex", Arial, sans-serif;
}

.catalog-filter-toggle {
    display: none;
    min-height: 50px;
    padding: 0 22px;
    color: var(--color-secondary);
    background: transparent;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-pill);
    font-size: 15px;
    font-weight: 700;
}

.catalog-layout {
    display: grid;
    grid-template-columns: 360px minmax(0, 1fr);
    gap: 50px;
    align-items: start;
}

.catalog-filter {
    position: sticky;
    top: 110px;
    padding: 38px;
    background: rgba(255, 255, 255, .32);
    border: 1px solid rgba(64, 24, 6, .08);
    border-radius: 34px;
}

.catalog-filter__block + .catalog-filter__block {
    margin-top: 42px;
}

.catalog-filter h2 {
    margin: 0 0 24px;
    color: var(--color-secondary);
    font-size: 28px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: -.03em;
}

.catalog-filter__list {
    display: grid;
    gap: 18px;
}

.catalog-filter__list a {
    display: flex;
    align-items: center;
    gap: 12px;
    color: var(--color-text-muted);
    font-size: 18px;
    line-height: 1.25;
    text-decoration: none;
}

.catalog-filter__list a span {
    position: relative;
    width: 18px;
    height: 18px;
    flex: 0 0 18px;
    border: 1px solid rgba(64, 24, 6, .28);
    border-radius: 50%;
}

.catalog-filter__list a.active,
.catalog-filter__list a:hover {
    color: var(--color-secondary);
}

.catalog-filter__list a.active span::before {
    content: "";
    position: absolute;
    inset: 4px;
    background: var(--color-primary);
    border-radius: 50%;
}

.catalog-range {
    position: relative;
    height: 28px;
    margin-top: 6px;
}

.catalog-range__line {
    position: absolute;
    top: 13px;
    left: 0;
    right: 0;
    height: 2px;
    background: rgba(64, 24, 6, .18);
}

.catalog-range__line--active {
    left: 14%;
    right: 16%;
    background: var(--color-primary);
}

.catalog-range__dot {
    position: absolute;
    top: 5px;
    width: 18px;
    height: 18px;
    background: var(--color-primary);
    border: 4px solid #fff8df;
    border-radius: 50%;
    box-shadow: 0 5px 14px rgba(64, 24, 6, .18);
}

.catalog-range__dot--left {
    left: 12%;
}

.catalog-range__dot--right {
    right: 13%;
}

.catalog-range__values {
    display: flex;
    justify-content: space-between;
    margin-top: 10px;
    color: var(--color-text-muted);
    font-size: 16px;
}

.catalog-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
}

.catalog-card {
    min-height: 624px;
}

.catalog-card__link {
    position: relative;
    display: flex;
    height: 100%;
    min-height: 624px;
    padding: 36px 40px 40px;
    flex-direction: column;
    color: var(--color-secondary);
    background: #f3dfae;
    border-radius: 38px;
    text-decoration: none;
    transition: transform .2s ease, box-shadow .2s ease;
}

.catalog-card__link:hover {
    transform: translateY(-4px);
    box-shadow: 0 24px 60px rgba(64, 24, 6, .12);
}

.catalog-card__image {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    height: 270px;
    margin: -8px -18px 34px;
}

.catalog-card__image img {
    display: block;
    width: 100%;
    max-width: 360px;
    height: 100%;
    object-fit: contain;
}

.catalog-card__type {
    display: block;
    margin-bottom: 10px;
    font-size: 24px;
    font-weight: 800;
    line-height: 1;
    text-transform: uppercase;
}

.catalog-card__name {
    display: block;
    margin-bottom: 24px;
    font-size: 42px;
    font-weight: 800;
    line-height: .98;
    letter-spacing: -.04em;
}

.catalog-card__info {
    display: block;
    margin-bottom: 10px;
    font-size: 21px;
    line-height: 1.2;
}

.catalog-card__bottom {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 20px;
    margin-top: auto;
}

.catalog-card__price {
    display: flex;
    align-items: baseline;
    gap: 9px;
    font-size: 40px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: -.04em;
}

.catalog-card__price small {
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 0;
}

.catalog-card__arrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 54px;
    height: 54px;
    flex: 0 0 54px;
    color: rgba(64, 24, 6, .62);
    background: #fff6d6;
    border-radius: 50%;
    font-size: 34px;
    line-height: 1;
}

.catalog-more {
    display: inline-flex;
    margin: 44px auto 0;
}

.catalog-text-section {
    padding: 0 0 150px;
    background: var(--color-background);
}

.catalog-text {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(520px, 820px);
    gap: 80px;
    padding: 72px 50px;
    background: rgba(255, 255, 255, .34);
    border: 1px solid rgba(64, 24, 6, .08);
    border-radius: 36px;
}

.catalog-text h2 {
    margin: 0;
    color: var(--color-secondary);
    font-size: clamp(42px, 4.5vw, 76px);
    font-weight: 700;
    line-height: .95;
    letter-spacing: -.05em;
}

.catalog-text p {
    margin: 0 0 24px;
    color: var(--color-secondary);
    font-size: 21px;
    line-height: 1.45;
}

.catalog-text h3 {
    margin: 36px 0 20px;
    color: var(--color-secondary);
    font-size: 26px;
    font-weight: 800;
    line-height: 1.15;
}

.catalog-text ul {
    display: grid;
    gap: 12px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.catalog-text li {
    position: relative;
    padding-left: 28px;
    color: var(--color-secondary);
    font-size: 20px;
    line-height: 1.35;
}

.catalog-text li::before {
    content: "";
    position: absolute;
    top: .52em;
    left: 0;
    width: 9px;
    height: 9px;
    background: var(--color-primary);
    border-radius: 50%;
}

.catalog-text__button {
    margin-top: 40px;
}

.catalog-mobile-filter {
    position: fixed;
    inset: 0;
    z-index: 1050;
    display: none;
    pointer-events: none;
}

.catalog-mobile-filter.is-open {
    display: block;
    pointer-events: auto;
}

.catalog-mobile-filter__overlay {
    position: absolute;
    inset: 0;
    padding: 0;
    background: rgba(64, 24, 6, .42);
    border: 0;
    opacity: 0;
    transition: opacity .22s ease;
}

.catalog-mobile-filter.is-open .catalog-mobile-filter__overlay {
    opacity: 1;
}

.catalog-mobile-filter__panel {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    max-height: calc(100vh - 24px);
    padding: 22px 20px 20px;
    overflow: auto;
    color: var(--color-secondary);
    background: var(--color-background);
    border-radius: 28px 28px 0 0;
    box-shadow: 0 -24px 70px rgba(64, 24, 6, .22);
    transform: translateY(100%);
    transition: transform .26s ease;
}

.catalog-mobile-filter.is-open .catalog-mobile-filter__panel {
    transform: translateY(0);
}

.catalog-mobile-filter__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 24px;
}

.catalog-mobile-filter__head h2 {
    margin: 0;
    color: var(--color-secondary);
    font-size: 32px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: -.04em;
}

.catalog-mobile-filter__close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    padding: 0;
    color: var(--color-secondary);
    background: #fff6d6;
    border: 0;
    border-radius: 50%;
    font-size: 34px;
    line-height: 1;
}

.catalog-mobile-filter__body {
    display: grid;
    gap: 30px;
}

.catalog-mobile-filter__body .catalog-filter__block + .catalog-filter__block {
    margin-top: 0;
}

.catalog-mobile-filter__body .catalog-filter__list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px 12px;
}

.catalog-mobile-filter__bottom {
    position: sticky;
    bottom: -20px;
    margin: 30px -20px -20px;
    padding: 16px 20px 20px;
    background: linear-gradient(180deg, rgba(255, 244, 207, 0), var(--color-background) 18px);
}

.catalog-mobile-filter__bottom .button {
    width: 100%;
}

body.catalog-filter-open {
    overflow: hidden;
}

/* Детальная товара */

.product-page {
    overflow: hidden;
    color: var(--color-text);
    background: var(--color-background);
}

.product-hero {
    padding: 170px 0 110px;
    background:
        linear-gradient(180deg, rgba(255, 244, 207, .94), rgba(255, 244, 207, .99)),
        url("../images/home/texture.jpg") center top / 720px auto repeat;
}

.product-breadcrumbs {
    margin-bottom: 46px;
}

.product-layout {
    display: grid;
    grid-template-columns: minmax(0, 760px) minmax(420px, 1fr);
    gap: 70px;
    align-items: start;
}

.product-gallery__main {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 640px;
    padding: 70px;
    background: #f3dfae;
    border-radius: 48px;
}

.product-gallery__main img {
    display: block;
    width: 100%;
    max-width: 560px;
    height: auto;
}

.product-gallery__thumbs {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    margin-top: 14px;
}

.product-gallery__thumbs button {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 150px;
    padding: 18px;
    background: rgba(255, 255, 255, .28);
    border: 1px solid rgba(64, 24, 6, .08);
    border-radius: 26px;
    cursor: pointer;
}

.product-gallery__thumbs button.active {
    border-color: var(--color-primary);
}

.product-gallery__thumbs img {
    display: block;
    width: 100%;
    max-width: 150px;
    height: auto;
}

.product-info {
    padding-top: 8px;
}

.product-info__category {
    display: inline-flex;
    margin-bottom: 24px;
    padding: 9px 18px;
    color: var(--color-primary);
    background: rgba(171, 1, 0, .08);
    border-radius: var(--radius-pill);
    font-size: 18px;
    font-weight: 800;
    line-height: 1;
    text-transform: uppercase;
}

.product-info h1 {
    margin: 0;
    color: var(--color-secondary);
    font-size: clamp(64px, 6.2vw, 118px);
    font-weight: 800;
    line-height: .9;
    letter-spacing: -.06em;
}

.product-info__lead {
    max-width: 680px;
    margin: 32px 0 0;
    color: var(--color-secondary);
    font-size: 24px;
    line-height: 1.38;
}

.product-facts {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin-top: 44px;
}

.product-facts div {
    min-height: 132px;
    padding: 24px;
    background: rgba(255, 255, 255, .34);
    border: 1px solid rgba(64, 24, 6, .08);
    border-radius: 28px;
}

.product-facts span,
.product-price span {
    display: block;
    margin-bottom: 12px;
    color: var(--color-text-muted);
    font-size: 15px;
    font-weight: 700;
    line-height: 1;
}

.product-facts strong {
    display: block;
    color: var(--color-secondary);
    font-size: 27px;
    font-weight: 800;
    line-height: 1.05;
    letter-spacing: -.04em;
}

.product-buy {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 26px;
    margin-top: 26px;
    padding: 30px;
    background: var(--color-secondary);
    border-radius: 34px;
}

.product-price span {
    color: rgba(255, 255, 255, .62);
}

.product-price strong {
    display: block;
    color: var(--color-white);
    font-size: 42px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: -.04em;
}

.product-details {
    padding: 0 0 120px;
    background: var(--color-background);
}

.product-details__grid {
    display: grid;
    grid-template-columns: 1.2fr .8fr;
    gap: 20px;
}

.product-details__card {
    padding: 42px;
    background: rgba(255, 255, 255, .34);
    border: 1px solid rgba(64, 24, 6, .08);
    border-radius: 34px;
}

.product-details__card--wide {
    grid-row: span 2;
}

.product-details__card h2 {
    margin: 0 0 22px;
    color: var(--color-secondary);
    font-size: 36px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: -.04em;
}

.product-details__card p {
    margin: 0;
    color: var(--color-secondary);
    font-size: 21px;
    line-height: 1.45;
}

.product-nutrition {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
}

.product-nutrition div {
    min-height: 96px;
    padding: 18px 14px;
    background: #f3dfae;
    border-radius: 20px;
}

.product-nutrition span {
    display: block;
    margin-bottom: 12px;
    color: var(--color-text-muted);
    font-size: 13px;
    font-weight: 700;
}

.product-nutrition strong {
    display: block;
    color: var(--color-secondary);
    font-size: 27px;
    font-weight: 800;
    line-height: 1;
}

.product-related {
    padding: 0 0 150px;
    background: var(--color-background);
}

.product-related__grid {
    margin-top: 50px;
}

.product-related__mobile-link {
    margin-top: 20px;
}

/* Внутренние страницы */

.inner-page,
.not-found-page {
    overflow: hidden;
    color: var(--color-text);
    background: var(--color-background);
}

.inner-hero {
    padding: 170px 0 95px;
    background:
        linear-gradient(180deg, rgba(255, 244, 207, .94), rgba(255, 244, 207, .99)),
        url("../images/home/texture.jpg") center top / 720px auto repeat;
}

.inner-hero__grid {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(420px, .85fr);
    gap: 70px;
    align-items: end;
}

.inner-eyebrow {
    display: inline-flex;
    margin-bottom: 26px;
    padding: 9px 18px;
    color: var(--color-primary);
    background: rgba(171, 1, 0, .08);
    border-radius: var(--radius-pill);
    font-size: 16px;
    font-weight: 800;
    line-height: 1;
    text-transform: uppercase;
}

.inner-hero h1 {
    margin: 0;
    color: var(--color-secondary);
    font-size: clamp(64px, 6.3vw, 118px);
    font-weight: 800;
    line-height: .9;
    letter-spacing: -.06em;
}

.inner-hero p {
    margin: 0 0 10px;
    color: var(--color-secondary);
    font-size: 25px;
    line-height: 1.36;
}

.inner-section {
    padding: 0 0 120px;
    background: var(--color-background);
}

.inner-section--accent {
    padding-top: 0;
}

.inner-stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    margin-bottom: 80px;
}

.inner-stats article,
.inner-card,
.production-steps article,
.contact-card,
.contacts-panel,
.where-buy-map,
.partner-form {
    background: rgba(255, 255, 255, .34);
    border: 1px solid rgba(64, 24, 6, .08);
    border-radius: 34px;
}

.inner-stats article {
    min-height: 160px;
    padding: 30px;
}

.inner-stats strong {
    display: block;
    margin-bottom: 14px;
    color: var(--color-secondary);
    font-size: 50px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: -.05em;
}

.inner-stats span {
    color: var(--color-text-muted);
    font-size: 17px;
    line-height: 1.3;
}

.inner-split {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(520px, 820px);
    gap: 80px;
    margin-bottom: 70px;
}

.inner-split h2,
.partners-layout h2 {
    margin: 0;
    color: var(--color-secondary);
    font-size: clamp(42px, 4.4vw, 76px);
    font-weight: 800;
    line-height: .96;
    letter-spacing: -.05em;
}

.inner-split p {
    margin: 0 0 24px;
    color: var(--color-secondary);
    font-size: 22px;
    line-height: 1.45;
}

.inner-card-grid {
    display: grid;
    gap: 20px;
}

.inner-card-grid--three {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.inner-card {
    min-height: 250px;
    padding: 36px;
}

.inner-card h3,
.inner-steps h3,
.production-steps h2,
.contact-card a,
.contact-card strong {
    margin: 0;
    color: var(--color-secondary);
    font-size: 31px;
    font-weight: 800;
    line-height: 1.08;
    letter-spacing: -.04em;
}

.inner-card p,
.inner-steps p,
.production-steps p {
    margin: 20px 0 0;
    color: var(--color-secondary);
    font-size: 19px;
    line-height: 1.42;
}

.inner-steps {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    margin-top: 46px;
}

.inner-steps article {
    padding: 34px;
    background: #f3dfae;
    border-radius: 30px;
}

.production-steps {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

.production-steps article {
    min-height: 430px;
    padding: 34px;
}

.production-steps span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 62px;
    height: 62px;
    margin-bottom: 54px;
    color: var(--color-white);
    background: var(--color-primary);
    border-radius: 50%;
    font-weight: 800;
}

.inner-check-list {
    display: grid;
    gap: 16px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.inner-check-list li {
    position: relative;
    padding: 24px 28px 24px 62px;
    color: var(--color-secondary);
    background: rgba(255, 255, 255, .34);
    border: 1px solid rgba(64, 24, 6, .08);
    border-radius: 24px;
    font-size: 21px;
    line-height: 1.3;
}

.inner-check-list li::before {
    content: "";
    position: absolute;
    top: 28px;
    left: 28px;
    width: 14px;
    height: 14px;
    background: var(--color-primary);
    border-radius: 50%;
}

.where-buy-tools {
    display: flex;
    gap: 10px;
    margin-bottom: 34px;
    overflow: auto;
}

.where-buy-tools button {
    min-height: 54px;
    padding: 0 24px;
    color: var(--color-secondary);
    background: rgba(255, 255, 255, .32);
    border: 1px solid rgba(64, 24, 6, .1);
    border-radius: var(--radius-pill);
    font-size: 16px;
    font-weight: 800;
    white-space: nowrap;
}

.where-buy-tools button.active {
    color: var(--color-white);
    background: var(--color-primary);
}

.where-buy-layout {
    display: grid;
    grid-template-columns: minmax(0, 620px) minmax(0, 1fr);
    gap: 20px;
}

.where-buy-list {
    display: grid;
    gap: 10px;
}

.where-buy-item {
    min-height: 112px;
    padding: 24px;
    background: rgba(255, 255, 255, .34);
    border: 1px solid rgba(64, 24, 6, .08);
    border-radius: 24px;
}

.where-buy-map,
.contacts-map-placeholder {
    display: flex;
    min-height: 620px;
    padding: 44px;
    flex-direction: column;
    justify-content: flex-end;
    background:
        linear-gradient(135deg, rgba(243, 223, 174, .9), rgba(255, 246, 214, .7)),
        url("../images/home/texture.jpg") center / 620px auto repeat;
}

.where-buy-map span,
.contacts-map-placeholder span {
    color: var(--color-secondary);
    font-size: 42px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: -.05em;
}

.where-buy-map p,
.contacts-map-placeholder p {
    max-width: 420px;
    margin: 18px 0 0;
    color: var(--color-secondary);
    font-size: 20px;
    line-height: 1.35;
}

.where-buy-logos {
    margin-top: 20px;
}

.partners-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(420px, 560px);
    gap: 60px;
    align-items: start;
}

.partner-form {
    display: grid;
    gap: 18px;
    padding: 34px;
}

.partner-form label {
    display: grid;
    gap: 8px;
    margin: 0;
}

.partner-form span {
    color: var(--color-text-muted);
    font-size: 14px;
    font-weight: 800;
}

.partner-form input,
.partner-form textarea {
    width: 100%;
    padding: 18px 20px;
    color: var(--color-secondary);
    background: #fff8df;
    border: 1px solid rgba(64, 24, 6, .1);
    border-radius: 18px;
    font: inherit;
}

.partner-form textarea {
    min-height: 140px;
    resize: vertical;
}

.contact-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    margin-bottom: 20px;
}

.contact-card {
    min-height: 210px;
    padding: 30px;
}

.contact-card span {
    display: block;
    margin-bottom: 28px;
    color: var(--color-text-muted);
    font-size: 15px;
    font-weight: 800;
}

.contact-card a {
    display: inline-block;
    text-decoration: none;
}

.contacts-panel {
    display: grid;
    grid-template-columns: minmax(0, 520px) minmax(0, 1fr);
    gap: 20px;
    padding: 30px;
}

.contacts-panel h2 {
    margin: 0 0 28px;
    color: var(--color-secondary);
    font-size: 46px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: -.05em;
}

.contacts-schedule {
    display: grid;
    gap: 10px;
}

.contacts-schedule div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 20px 24px;
    background: #f3dfae;
    border-radius: 20px;
}

.contacts-schedule span {
    color: var(--color-text-muted);
    font-weight: 800;
}

.contacts-schedule strong {
    color: var(--color-secondary);
    font-size: 20px;
}

.not-found {
    min-height: 100vh;
    padding: 170px 0 110px;
    display: flex;
    align-items: center;
    background:
        linear-gradient(180deg, rgba(255, 244, 207, .94), rgba(255, 244, 207, .99)),
        url("../images/home/texture.jpg") center top / 720px auto repeat;
}

.not-found__inner {
    text-align: center;
}

.not-found span {
    display: block;
    color: var(--color-primary);
    font-size: clamp(110px, 16vw, 240px);
    font-weight: 900;
    line-height: .8;
    letter-spacing: -.08em;
}

.not-found h1 {
    margin: 30px 0 0;
    color: var(--color-secondary);
    font-size: clamp(42px, 5.2vw, 86px);
    font-weight: 800;
    line-height: .95;
    letter-spacing: -.05em;
}

.not-found p {
    max-width: 720px;
    margin: 28px auto 0;
    color: var(--color-secondary);
    font-size: 22px;
    line-height: 1.42;
}

.not-found__actions {
    display: flex;
    justify-content: center;
    gap: 12px;
    margin-top: 42px;
}

.body-no-bg{
    background-image: none;
}

@media (max-width: 1399px) {
    .catalog-layout {
        grid-template-columns: 310px minmax(0, 1fr);
        gap: 30px;
    }

    .catalog-grid {
        gap: 12px;
    }

    .catalog-card__link {
        padding: 28px;
    }

    .catalog-card__type {
        font-size: 21px;
    }

    .catalog-card__name {
        font-size: 36px;
    }

    .catalog-card__info {
        font-size: 18px;
    }

    .catalog-card__price {
        font-size: 34px;
    }
}

@media (max-width: 1199px) {
    .catalog-layout {
        grid-template-columns: 1fr;
    }

    .catalog-filter {
        position: static;
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 28px;
    }

    .catalog-filter__block + .catalog-filter__block {
        margin-top: 0;
    }

    .catalog-text {
        grid-template-columns: 1fr;
        gap: 34px;
    }

    .product-layout {
        grid-template-columns: 1fr;
        gap: 42px;
    }

    .product-gallery__main {
        min-height: 520px;
    }

    .product-details__grid {
        grid-template-columns: 1fr;
    }

    .product-details__card--wide {
        grid-row: auto;
    }

    .inner-hero__grid,
    .inner-split,
    .where-buy-layout,
    .partners-layout,
    .contacts-panel {
        grid-template-columns: 1fr;
        gap: 34px;
    }

    .inner-stats,
    .production-steps,
    .contact-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .inner-card-grid--three,
    .inner-steps {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 767px) {
    .catalog-section {
        padding: 112px 0 80px;
    }

    .catalog-breadcrumbs {
        margin-bottom: 28px;
        font-size: 14px;
    }

    .catalog-heading {
        align-items: center;
        margin-bottom: 34px;
    }

    .catalog-heading h1 {
        font-size: 50px;
        line-height: .9;
    }

    .catalog-filter-toggle {
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }

    .catalog-filter {
        display: none;
    }

    .catalog-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 5px;
    }

    .catalog-card,
    .catalog-card__link {
        min-height: 0;
    }

    .catalog-card__link {
        padding: 15px;
        border-radius: 20px;
    }

    .catalog-card__image {
        height: 118px;
        margin: -4px -8px 20px;
    }

    .catalog-card__type {
        margin-bottom: 5px;
        font-size: 12px;
    }

    .catalog-card__name {
        margin-bottom: 12px;
        font-size: 22px;
    }

    .catalog-card__info {
        margin-bottom: 6px;
        font-size: 12px;
    }

    .catalog-card__kbju {
        display: none;
    }

    .catalog-card__bottom {
        margin-top: 22px;
    }

    .catalog-card__price {
        gap: 4px;
        font-size: 22px;
    }

    .catalog-card__price small {
        font-size: 11px;
    }

    .catalog-card__arrow {
        width: 34px;
        height: 34px;
        flex-basis: 34px;
        font-size: 22px;
    }

    .catalog-more {
        width: 100%;
        margin-top: 25px;
    }

    .catalog-text-section {
        padding-bottom: 90px;
    }

    .catalog-text {
        padding: 34px 24px;
        gap: 24px;
        border-radius: 24px;
    }

    .catalog-text h2 {
        font-size: 34px;
    }

    .catalog-text p,
    .catalog-text li {
        font-size: 16px;
    }

    .catalog-text h3 {
        margin-top: 26px;
        font-size: 20px;
    }

    .catalog-text__button {
        width: 100%;
        margin-top: 28px;
    }

    .product-hero {
        padding: 112px 0 70px;
    }

    .product-breadcrumbs {
        margin-bottom: 26px;
    }

    .product-layout {
        gap: 28px;
    }

    .product-gallery__main {
        min-height: 312px;
        padding: 32px 24px;
        border-radius: 24px;
    }

    .product-gallery__thumbs {
        gap: 5px;
        margin-top: 5px;
    }

    .product-gallery__thumbs button {
        min-height: 88px;
        padding: 10px;
        border-radius: 16px;
    }

    .product-info__category {
        margin-bottom: 16px;
        padding: 7px 13px;
        font-size: 12px;
    }

    .product-info h1 {
        font-size: 50px;
    }

    .product-info__lead {
        margin-top: 18px;
        font-size: 17px;
    }

    .product-facts {
        grid-template-columns: 1fr;
        margin-top: 28px;
    }

    .product-facts div {
        display: flex;
        align-items: center;
        justify-content: space-between;
        min-height: 72px;
        padding: 18px 20px;
        border-radius: 20px;
    }

    .product-facts span {
        margin-bottom: 0;
        font-size: 13px;
    }

    .product-facts strong {
        font-size: 22px;
        text-align: right;
    }

    .product-buy {
        align-items: stretch;
        flex-direction: column;
        margin-top: 10px;
        padding: 22px;
        border-radius: 22px;
    }

    .product-price strong {
        font-size: 34px;
    }

    .product-buy .button {
        width: 100%;
    }

    .product-details {
        padding-bottom: 80px;
    }

    .product-details__grid {
        gap: 5px;
    }

    .product-details__card {
        padding: 26px 22px;
        border-radius: 22px;
    }

    .product-details__card h2 {
        font-size: 25px;
    }

    .product-details__card p {
        font-size: 16px;
    }

    .product-nutrition {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .product-related {
        padding-bottom: 90px;
    }

    .product-related__grid {
        margin-top: 28px;
    }

    .inner-hero {
        padding: 112px 0 60px;
    }

    .inner-eyebrow {
        margin-bottom: 16px;
        padding: 7px 13px;
        font-size: 12px;
    }

    .inner-hero h1 {
        font-size: 50px;
    }

    .inner-hero p {
        font-size: 17px;
    }

    .inner-section {
        padding-bottom: 80px;
    }

    .inner-stats,
    .production-steps,
    .contact-grid {
        grid-template-columns: 1fr;
        gap: 5px;
        margin-bottom: 50px;
    }

    .inner-stats article,
    .inner-card,
    .production-steps article,
    .contact-card,
    .contacts-panel,
    .where-buy-map,
    .partner-form {
        border-radius: 22px;
    }

    .inner-stats article {
        min-height: 105px;
        padding: 24px;
    }

    .inner-stats strong {
        font-size: 38px;
    }

    .inner-split {
        margin-bottom: 44px;
    }

    .inner-split h2,
    .partners-layout h2 {
        font-size: 34px;
    }

    .inner-split p,
    .inner-card p,
    .inner-steps p,
    .production-steps p,
    .inner-check-list li {
        font-size: 16px;
    }

    .inner-card {
        min-height: 0;
        padding: 26px 22px;
    }

    .inner-card h3,
    .inner-steps h3,
    .production-steps h2,
    .contact-card a,
    .contact-card strong {
        font-size: 25px;
    }

    .inner-steps {
        gap: 5px;
        margin-top: 28px;
    }

    .inner-steps article {
        padding: 26px 22px;
        border-radius: 22px;
    }

    .production-steps {
        gap: 5px;
    }

    .production-steps article {
        min-height: 0;
        padding: 26px 22px;
    }

    .production-steps span {
        width: 46px;
        height: 46px;
        margin-bottom: 28px;
        font-size: 13px;
    }

    .inner-check-list {
        gap: 5px;
    }

    .inner-check-list li {
        padding: 20px 20px 20px 48px;
        border-radius: 18px;
    }

    .inner-check-list li::before {
        top: 24px;
        left: 22px;
        width: 10px;
        height: 10px;
    }

    .where-buy-tools {
        margin-bottom: 20px;
    }

    .where-buy-tools button {
        min-height: 46px;
        padding: 0 18px;
        font-size: 14px;
    }

    .where-buy-layout {
        gap: 5px;
    }

    .where-buy-item {
        min-height: 0;
        padding: 20px;
        border-radius: 18px;
    }

    .where-buy-map,
    .contacts-map-placeholder {
        min-height: 360px;
        padding: 26px 22px;
    }

    .where-buy-map span,
    .contacts-map-placeholder span,
    .contacts-panel h2 {
        font-size: 32px;
    }

    .where-buy-map p,
    .contacts-map-placeholder p {
        font-size: 16px;
    }

    .partner-form {
        padding: 22px;
    }

    .partner-form input,
    .partner-form textarea {
        padding: 15px 16px;
        border-radius: 14px;
    }

    .contact-grid {
        margin-bottom: 5px;
    }

    .contact-card {
        min-height: 0;
        padding: 24px;
    }

    .contact-card span {
        margin-bottom: 18px;
    }

    .contacts-panel {
        padding: 22px;
    }

    .contacts-schedule div {
        padding: 16px 18px;
        border-radius: 16px;
    }

    .not-found {
        padding: 112px 0 80px;
    }

    .not-found p {
        font-size: 16px;
    }

    .not-found__actions {
        flex-direction: column;
    }

    .not-found__actions .button {
        width: 100%;
    }
}

/* Быстрые отступы. Базовые классы работают на всех размерах экрана. */

.p-0 { padding: 0 !important; }
.p-5 { padding: 5px !important; }
.p-10 { padding: 10px !important; }
.p-15 { padding: 15px !important; }
.p-20 { padding: 20px !important; }
.p-25 { padding: 25px !important; }
.p-30 { padding: 30px !important; }
.p-35 { padding: 35px !important; }
.p-40 { padding: 40px !important; }
.p-50 { padding: 50px !important; }
.p-60 { padding: 60px !important; }
.p-70 { padding: 70px !important; }
.p-80 { padding: 80px !important; }
.p-90 { padding: 90px !important; }
.p-100 { padding: 100px !important; }
.p-110 { padding: 110px !important; }
.p-120 { padding: 120px !important; }
.p-130 { padding: 130px !important; }
.p-140 { padding: 140px !important; }
.p-150 { padding: 150px !important; }
.p-200 { padding: 200px !important; }

.p-t-0 { padding-top: 0 !important; }
.p-t-5 { padding-top: 5px !important; }
.p-t-10 { padding-top: 10px !important; }
.p-t-15 { padding-top: 15px !important; }
.p-t-20 { padding-top: 20px !important; }
.p-t-25 { padding-top: 25px !important; }
.p-t-30 { padding-top: 30px !important; }
.p-t-35 { padding-top: 35px !important; }
.p-t-40 { padding-top: 40px !important; }
.p-t-50 { padding-top: 50px !important; }
.p-t-60 { padding-top: 60px !important; }
.p-t-70 { padding-top: 70px !important; }
.p-t-80 { padding-top: 80px !important; }
.p-t-90 { padding-top: 90px !important; }
.p-t-100 { padding-top: 100px !important; }
.p-t-110 { padding-top: 110px !important; }
.p-t-120 { padding-top: 120px !important; }
.p-t-130 { padding-top: 130px !important; }
.p-t-140 { padding-top: 140px !important; }
.p-t-150 { padding-top: 150px !important; }
.p-t-200 { padding-top: 200px !important; }

.p-r-0 { padding-right: 0 !important; }
.p-r-5 { padding-right: 5px !important; }
.p-r-10 { padding-right: 10px !important; }
.p-r-15 { padding-right: 15px !important; }
.p-r-20 { padding-right: 20px !important; }
.p-r-25 { padding-right: 25px !important; }
.p-r-30 { padding-right: 30px !important; }
.p-r-35 { padding-right: 35px !important; }
.p-r-40 { padding-right: 40px !important; }
.p-r-50 { padding-right: 50px !important; }
.p-r-60 { padding-right: 60px !important; }
.p-r-70 { padding-right: 70px !important; }
.p-r-80 { padding-right: 80px !important; }
.p-r-90 { padding-right: 90px !important; }
.p-r-100 { padding-right: 100px !important; }
.p-r-110 { padding-right: 110px !important; }
.p-r-120 { padding-right: 120px !important; }
.p-r-130 { padding-right: 130px !important; }
.p-r-140 { padding-right: 140px !important; }
.p-r-150 { padding-right: 150px !important; }
.p-r-200 { padding-right: 200px !important; }

.p-b-0 { padding-bottom: 0 !important; }
.p-b-5 { padding-bottom: 5px !important; }
.p-b-10 { padding-bottom: 10px !important; }
.p-b-15 { padding-bottom: 15px !important; }
.p-b-20 { padding-bottom: 20px !important; }
.p-b-25 { padding-bottom: 25px !important; }
.p-b-30 { padding-bottom: 30px !important; }
.p-b-35 { padding-bottom: 35px !important; }
.p-b-40 { padding-bottom: 40px !important; }
.p-b-50 { padding-bottom: 50px !important; }
.p-b-60 { padding-bottom: 60px !important; }
.p-b-70 { padding-bottom: 70px !important; }
.p-b-80 { padding-bottom: 80px !important; }
.p-b-90 { padding-bottom: 90px !important; }
.p-b-100 { padding-bottom: 100px !important; }
.p-b-110 { padding-bottom: 110px !important; }
.p-b-120 { padding-bottom: 120px !important; }
.p-b-130 { padding-bottom: 130px !important; }
.p-b-140 { padding-bottom: 140px !important; }
.p-b-150 { padding-bottom: 150px !important; }
.p-b-200 { padding-bottom: 200px !important; }

.p-l-0 { padding-left: 0 !important; }
.p-l-5 { padding-left: 5px !important; }
.p-l-10 { padding-left: 10px !important; }
.p-l-15 { padding-left: 15px !important; }
.p-l-20 { padding-left: 20px !important; }
.p-l-25 { padding-left: 25px !important; }
.p-l-30 { padding-left: 30px !important; }
.p-l-35 { padding-left: 35px !important; }
.p-l-40 { padding-left: 40px !important; }
.p-l-50 { padding-left: 50px !important; }
.p-l-60 { padding-left: 60px !important; }
.p-l-70 { padding-left: 70px !important; }
.p-l-80 { padding-left: 80px !important; }
.p-l-90 { padding-left: 90px !important; }
.p-l-100 { padding-left: 100px !important; }
.p-l-110 { padding-left: 110px !important; }
.p-l-120 { padding-left: 120px !important; }
.p-l-130 { padding-left: 130px !important; }
.p-l-140 { padding-left: 140px !important; }
.p-l-150 { padding-left: 150px !important; }
.p-l-200 { padding-left: 200px !important; }

.p-x-0 { padding-left: 0 !important; padding-right: 0 !important; }
.p-x-5 { padding-left: 5px !important; padding-right: 5px !important; }
.p-x-10 { padding-left: 10px !important; padding-right: 10px !important; }
.p-x-15 { padding-left: 15px !important; padding-right: 15px !important; }
.p-x-20 { padding-left: 20px !important; padding-right: 20px !important; }
.p-x-25 { padding-left: 25px !important; padding-right: 25px !important; }
.p-x-30 { padding-left: 30px !important; padding-right: 30px !important; }
.p-x-35 { padding-left: 35px !important; padding-right: 35px !important; }
.p-x-40 { padding-left: 40px !important; padding-right: 40px !important; }
.p-x-50 { padding-left: 50px !important; padding-right: 50px !important; }
.p-x-60 { padding-left: 60px !important; padding-right: 60px !important; }
.p-x-70 { padding-left: 70px !important; padding-right: 70px !important; }
.p-x-80 { padding-left: 80px !important; padding-right: 80px !important; }
.p-x-90 { padding-left: 90px !important; padding-right: 90px !important; }
.p-x-100 { padding-left: 100px !important; padding-right: 100px !important; }
.p-x-110 { padding-left: 110px !important; padding-right: 110px !important; }
.p-x-120 { padding-left: 120px !important; padding-right: 120px !important; }
.p-x-130 { padding-left: 130px !important; padding-right: 130px !important; }
.p-x-140 { padding-left: 140px !important; padding-right: 140px !important; }
.p-x-150 { padding-left: 150px !important; padding-right: 150px !important; }
.p-x-200 { padding-left: 200px !important; padding-right: 200px !important; }

.p-y-0 { padding-top: 0 !important; padding-bottom: 0 !important; }
.p-y-5 { padding-top: 5px !important; padding-bottom: 5px !important; }
.p-y-10 { padding-top: 10px !important; padding-bottom: 10px !important; }
.p-y-15 { padding-top: 15px !important; padding-bottom: 15px !important; }
.p-y-20 { padding-top: 20px !important; padding-bottom: 20px !important; }
.p-y-25 { padding-top: 25px !important; padding-bottom: 25px !important; }
.p-y-30 { padding-top: 30px !important; padding-bottom: 30px !important; }
.p-y-35 { padding-top: 35px !important; padding-bottom: 35px !important; }
.p-y-40 { padding-top: 40px !important; padding-bottom: 40px !important; }
.p-y-50 { padding-top: 50px !important; padding-bottom: 50px !important; }
.p-y-60 { padding-top: 60px !important; padding-bottom: 60px !important; }
.p-y-70 { padding-top: 70px !important; padding-bottom: 70px !important; }
.p-y-80 { padding-top: 80px !important; padding-bottom: 80px !important; }
.p-y-90 { padding-top: 90px !important; padding-bottom: 90px !important; }
.p-y-100 { padding-top: 100px !important; padding-bottom: 100px !important; }
.p-y-110 { padding-top: 110px !important; padding-bottom: 110px !important; }
.p-y-120 { padding-top: 120px !important; padding-bottom: 120px !important; }
.p-y-130 { padding-top: 130px !important; padding-bottom: 130px !important; }
.p-y-140 { padding-top: 140px !important; padding-bottom: 140px !important; }
.p-y-150 { padding-top: 150px !important; padding-bottom: 150px !important; }
.p-y-200 { padding-top: 200px !important; padding-bottom: 200px !important; }

.m-0 { margin: 0 !important; }
.m-5 { margin: 5px !important; }
.m-10 { margin: 10px !important; }
.m-15 { margin: 15px !important; }
.m-20 { margin: 20px !important; }
.m-25 { margin: 25px !important; }
.m-30 { margin: 30px !important; }
.m-35 { margin: 35px !important; }
.m-40 { margin: 40px !important; }
.m-50 { margin: 50px !important; }
.m-60 { margin: 60px !important; }
.m-70 { margin: 70px !important; }
.m-80 { margin: 80px !important; }
.m-90 { margin: 90px !important; }
.m-100 { margin: 100px !important; }
.m-110 { margin: 110px !important; }
.m-120 { margin: 120px !important; }
.m-130 { margin: 130px !important; }
.m-140 { margin: 140px !important; }
.m-150 { margin: 150px !important; }
.m-200 { margin: 200px !important; }

.m-t-0 { margin-top: 0 !important; }
.m-t-5 { margin-top: 5px !important; }
.m-t-10 { margin-top: 10px !important; }
.m-t-15 { margin-top: 15px !important; }
.m-t-20 { margin-top: 20px !important; }
.m-t-25 { margin-top: 25px !important; }
.m-t-30 { margin-top: 30px !important; }
.m-t-35 { margin-top: 35px !important; }
.m-t-40 { margin-top: 40px !important; }
.m-t-50 { margin-top: 50px !important; }
.m-t-60 { margin-top: 60px !important; }
.m-t-70 { margin-top: 70px !important; }
.m-t-80 { margin-top: 80px !important; }
.m-t-90 { margin-top: 90px !important; }
.m-t-100 { margin-top: 100px !important; }
.m-t-110 { margin-top: 110px !important; }
.m-t-120 { margin-top: 120px !important; }
.m-t-130 { margin-top: 130px !important; }
.m-t-140 { margin-top: 140px !important; }
.m-t-150 { margin-top: 150px !important; }
.m-t-200 { margin-top: 200px !important; }

.m-r-0 { margin-right: 0 !important; }
.m-r-5 { margin-right: 5px !important; }
.m-r-10 { margin-right: 10px !important; }
.m-r-15 { margin-right: 15px !important; }
.m-r-20 { margin-right: 20px !important; }
.m-r-25 { margin-right: 25px !important; }
.m-r-30 { margin-right: 30px !important; }
.m-r-35 { margin-right: 35px !important; }
.m-r-40 { margin-right: 40px !important; }
.m-r-50 { margin-right: 50px !important; }
.m-r-60 { margin-right: 60px !important; }
.m-r-70 { margin-right: 70px !important; }
.m-r-80 { margin-right: 80px !important; }
.m-r-90 { margin-right: 90px !important; }
.m-r-100 { margin-right: 100px !important; }
.m-r-110 { margin-right: 110px !important; }
.m-r-120 { margin-right: 120px !important; }
.m-r-130 { margin-right: 130px !important; }
.m-r-140 { margin-right: 140px !important; }
.m-r-150 { margin-right: 150px !important; }
.m-r-200 { margin-right: 200px !important; }

.m-b-0 { margin-bottom: 0 !important; }
.m-b-5 { margin-bottom: 5px !important; }
.m-b-10 { margin-bottom: 10px !important; }
.m-b-15 { margin-bottom: 15px !important; }
.m-b-20 { margin-bottom: 20px !important; }
.m-b-25 { margin-bottom: 25px !important; }
.m-b-30 { margin-bottom: 30px !important; }
.m-b-35 { margin-bottom: 35px !important; }
.m-b-40 { margin-bottom: 40px !important; }
.m-b-50 { margin-bottom: 50px !important; }
.m-b-60 { margin-bottom: 60px !important; }
.m-b-70 { margin-bottom: 70px !important; }
.m-b-80 { margin-bottom: 80px !important; }
.m-b-90 { margin-bottom: 90px !important; }
.m-b-100 { margin-bottom: 100px !important; }
.m-b-110 { margin-bottom: 110px !important; }
.m-b-120 { margin-bottom: 120px !important; }
.m-b-130 { margin-bottom: 130px !important; }
.m-b-140 { margin-bottom: 140px !important; }
.m-b-150 { margin-bottom: 150px !important; }
.m-b-200 { margin-bottom: 200px !important; }

.m-l-0 { margin-left: 0 !important; }
.m-l-5 { margin-left: 5px !important; }
.m-l-10 { margin-left: 10px !important; }
.m-l-15 { margin-left: 15px !important; }
.m-l-20 { margin-left: 20px !important; }
.m-l-25 { margin-left: 25px !important; }
.m-l-30 { margin-left: 30px !important; }
.m-l-35 { margin-left: 35px !important; }
.m-l-40 { margin-left: 40px !important; }
.m-l-50 { margin-left: 50px !important; }
.m-l-60 { margin-left: 60px !important; }
.m-l-70 { margin-left: 70px !important; }
.m-l-80 { margin-left: 80px !important; }
.m-l-90 { margin-left: 90px !important; }
.m-l-100 { margin-left: 100px !important; }
.m-l-110 { margin-left: 110px !important; }
.m-l-120 { margin-left: 120px !important; }
.m-l-130 { margin-left: 130px !important; }
.m-l-140 { margin-left: 140px !important; }
.m-l-150 { margin-left: 150px !important; }
.m-l-200 { margin-left: 200px !important; }

.m-x-0 { margin-left: 0 !important; margin-right: 0 !important; }
.m-x-5 { margin-left: 5px !important; margin-right: 5px !important; }
.m-x-10 { margin-left: 10px !important; margin-right: 10px !important; }
.m-x-15 { margin-left: 15px !important; margin-right: 15px !important; }
.m-x-20 { margin-left: 20px !important; margin-right: 20px !important; }
.m-x-25 { margin-left: 25px !important; margin-right: 25px !important; }
.m-x-30 { margin-left: 30px !important; margin-right: 30px !important; }
.m-x-35 { margin-left: 35px !important; margin-right: 35px !important; }
.m-x-40 { margin-left: 40px !important; margin-right: 40px !important; }
.m-x-50 { margin-left: 50px !important; margin-right: 50px !important; }
.m-x-60 { margin-left: 60px !important; margin-right: 60px !important; }
.m-x-70 { margin-left: 70px !important; margin-right: 70px !important; }
.m-x-80 { margin-left: 80px !important; margin-right: 80px !important; }
.m-x-90 { margin-left: 90px !important; margin-right: 90px !important; }
.m-x-100 { margin-left: 100px !important; margin-right: 100px !important; }
.m-x-110 { margin-left: 110px !important; margin-right: 110px !important; }
.m-x-120 { margin-left: 120px !important; margin-right: 120px !important; }
.m-x-130 { margin-left: 130px !important; margin-right: 130px !important; }
.m-x-140 { margin-left: 140px !important; margin-right: 140px !important; }
.m-x-150 { margin-left: 150px !important; margin-right: 150px !important; }
.m-x-200 { margin-left: 200px !important; margin-right: 200px !important; }

.m-y-0 { margin-top: 0 !important; margin-bottom: 0 !important; }
.m-y-5 { margin-top: 5px !important; margin-bottom: 5px !important; }
.m-y-10 { margin-top: 10px !important; margin-bottom: 10px !important; }
.m-y-15 { margin-top: 15px !important; margin-bottom: 15px !important; }
.m-y-20 { margin-top: 20px !important; margin-bottom: 20px !important; }
.m-y-25 { margin-top: 25px !important; margin-bottom: 25px !important; }
.m-y-30 { margin-top: 30px !important; margin-bottom: 30px !important; }
.m-y-35 { margin-top: 35px !important; margin-bottom: 35px !important; }
.m-y-40 { margin-top: 40px !important; margin-bottom: 40px !important; }
.m-y-50 { margin-top: 50px !important; margin-bottom: 50px !important; }
.m-y-60 { margin-top: 60px !important; margin-bottom: 60px !important; }
.m-y-70 { margin-top: 70px !important; margin-bottom: 70px !important; }
.m-y-80 { margin-top: 80px !important; margin-bottom: 80px !important; }
.m-y-90 { margin-top: 90px !important; margin-bottom: 90px !important; }
.m-y-100 { margin-top: 100px !important; margin-bottom: 100px !important; }
.m-y-110 { margin-top: 110px !important; margin-bottom: 110px !important; }
.m-y-120 { margin-top: 120px !important; margin-bottom: 120px !important; }
.m-y-130 { margin-top: 130px !important; margin-bottom: 130px !important; }
.m-y-140 { margin-top: 140px !important; margin-bottom: 140px !important; }
.m-y-150 { margin-top: 150px !important; margin-bottom: 150px !important; }
.m-y-200 { margin-top: 200px !important; margin-bottom: 200px !important; }

:root {
    /* Основные цвета */
    --color-primary: #ab0100;
    --color-primary-hover: #8f0100;
    --color-secondary: #401806;
    --color-accent: #f1dfb9;

    /* Фон и текст */
    --color-background: #fff4cf;
    --color-surface: #ffffff;
    --color-text: #401806;
    --color-text-muted: #85755e;
    --color-border: #e8d9b7;
    --color-white: #ffffff;
    --color-black: #000000;

    /* Скругления */
    --radius-sm: 4px;
    --radius-md: 8px;
    --radius-lg: 16px;
    --radius-pill: 999px;

    /* Тени */
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.08);
    --shadow-md: 0 8px 24px rgba(0, 0, 0, 0.12);
    --shadow-lg: 0 16px 48px rgba(0, 0, 0, 0.16);

    /* Контейнер */
    --container-max-width: 1320px;
    --container-padding: 20px;

    /* Короткое старое имя оставлено как алиас. */
    --bg: var(--color-background);
}

@media (max-width: 1600px) and (min-width: 1401px) {

}

@media (max-width: 1400px) and (min-width: 1201px) {

}

/* Мобильные устройства */
@media (max-width: 767px) {
    /* Классы с xs переопределяют базовые отступы только на мобильных. */

    .p-xs-0 { padding: 0 !important; }
    .p-xs-5 { padding: 5px !important; }
    .p-xs-10 { padding: 10px !important; }
    .p-xs-15 { padding: 15px !important; }
    .p-xs-20 { padding: 20px !important; }
    .p-xs-25 { padding: 25px !important; }
    .p-xs-30 { padding: 30px !important; }
    .p-xs-35 { padding: 35px !important; }
    .p-xs-40 { padding: 40px !important; }
    .p-xs-50 { padding: 50px !important; }
    .p-xs-60 { padding: 60px !important; }
    .p-xs-70 { padding: 70px !important; }
    .p-xs-80 { padding: 80px !important; }
    .p-xs-90 { padding: 90px !important; }
    .p-xs-100 { padding: 100px !important; }
    .p-xs-110 { padding: 110px !important; }
    .p-xs-120 { padding: 120px !important; }
    .p-xs-130 { padding: 130px !important; }
    .p-xs-140 { padding: 140px !important; }
    .p-xs-150 { padding: 150px !important; }
    .p-xs-200 { padding: 200px !important; }

    .p-t-xs-0 { padding-top: 0 !important; }
    .p-t-xs-5 { padding-top: 5px !important; }
    .p-t-xs-10 { padding-top: 10px !important; }
    .p-t-xs-15 { padding-top: 15px !important; }
    .p-t-xs-20 { padding-top: 20px !important; }
    .p-t-xs-25 { padding-top: 25px !important; }
    .p-t-xs-30 { padding-top: 30px !important; }
    .p-t-xs-35 { padding-top: 35px !important; }
    .p-t-xs-40 { padding-top: 40px !important; }
    .p-t-xs-50 { padding-top: 50px !important; }
    .p-t-xs-60 { padding-top: 60px !important; }
    .p-t-xs-70 { padding-top: 70px !important; }
    .p-t-xs-80 { padding-top: 80px !important; }
    .p-t-xs-90 { padding-top: 90px !important; }
    .p-t-xs-100 { padding-top: 100px !important; }
    .p-t-xs-110 { padding-top: 110px !important; }
    .p-t-xs-120 { padding-top: 120px !important; }
    .p-t-xs-130 { padding-top: 130px !important; }
    .p-t-xs-140 { padding-top: 140px !important; }
    .p-t-xs-150 { padding-top: 150px !important; }
    .p-t-xs-200 { padding-top: 200px !important; }

    .p-r-xs-0 { padding-right: 0 !important; }
    .p-r-xs-5 { padding-right: 5px !important; }
    .p-r-xs-10 { padding-right: 10px !important; }
    .p-r-xs-15 { padding-right: 15px !important; }
    .p-r-xs-20 { padding-right: 20px !important; }
    .p-r-xs-25 { padding-right: 25px !important; }
    .p-r-xs-30 { padding-right: 30px !important; }
    .p-r-xs-35 { padding-right: 35px !important; }
    .p-r-xs-40 { padding-right: 40px !important; }
    .p-r-xs-50 { padding-right: 50px !important; }
    .p-r-xs-60 { padding-right: 60px !important; }
    .p-r-xs-70 { padding-right: 70px !important; }
    .p-r-xs-80 { padding-right: 80px !important; }
    .p-r-xs-90 { padding-right: 90px !important; }
    .p-r-xs-100 { padding-right: 100px !important; }
    .p-r-xs-110 { padding-right: 110px !important; }
    .p-r-xs-120 { padding-right: 120px !important; }
    .p-r-xs-130 { padding-right: 130px !important; }
    .p-r-xs-140 { padding-right: 140px !important; }
    .p-r-xs-150 { padding-right: 150px !important; }
    .p-r-xs-200 { padding-right: 200px !important; }

    .p-b-xs-0 { padding-bottom: 0 !important; }
    .p-b-xs-5 { padding-bottom: 5px !important; }
    .p-b-xs-10 { padding-bottom: 10px !important; }
    .p-b-xs-15 { padding-bottom: 15px !important; }
    .p-b-xs-20 { padding-bottom: 20px !important; }
    .p-b-xs-25 { padding-bottom: 25px !important; }
    .p-b-xs-30 { padding-bottom: 30px !important; }
    .p-b-xs-35 { padding-bottom: 35px !important; }
    .p-b-xs-40 { padding-bottom: 40px !important; }
    .p-b-xs-50 { padding-bottom: 50px !important; }
    .p-b-xs-60 { padding-bottom: 60px !important; }
    .p-b-xs-70 { padding-bottom: 70px !important; }
    .p-b-xs-80 { padding-bottom: 80px !important; }
    .p-b-xs-90 { padding-bottom: 90px !important; }
    .p-b-xs-100 { padding-bottom: 100px !important; }
    .p-b-xs-110 { padding-bottom: 110px !important; }
    .p-b-xs-120 { padding-bottom: 120px !important; }
    .p-b-xs-130 { padding-bottom: 130px !important; }
    .p-b-xs-140 { padding-bottom: 140px !important; }
    .p-b-xs-150 { padding-bottom: 150px !important; }
    .p-b-xs-200 { padding-bottom: 200px !important; }

    .p-l-xs-0 { padding-left: 0 !important; }
    .p-l-xs-5 { padding-left: 5px !important; }
    .p-l-xs-10 { padding-left: 10px !important; }
    .p-l-xs-15 { padding-left: 15px !important; }
    .p-l-xs-20 { padding-left: 20px !important; }
    .p-l-xs-25 { padding-left: 25px !important; }
    .p-l-xs-30 { padding-left: 30px !important; }
    .p-l-xs-35 { padding-left: 35px !important; }
    .p-l-xs-40 { padding-left: 40px !important; }
    .p-l-xs-50 { padding-left: 50px !important; }
    .p-l-xs-60 { padding-left: 60px !important; }
    .p-l-xs-70 { padding-left: 70px !important; }
    .p-l-xs-80 { padding-left: 80px !important; }
    .p-l-xs-90 { padding-left: 90px !important; }
    .p-l-xs-100 { padding-left: 100px !important; }
    .p-l-xs-110 { padding-left: 110px !important; }
    .p-l-xs-120 { padding-left: 120px !important; }
    .p-l-xs-130 { padding-left: 130px !important; }
    .p-l-xs-140 { padding-left: 140px !important; }
    .p-l-xs-150 { padding-left: 150px !important; }
    .p-l-xs-200 { padding-left: 200px !important; }

    .p-x-xs-0 { padding-left: 0 !important; padding-right: 0 !important; }
    .p-x-xs-5 { padding-left: 5px !important; padding-right: 5px !important; }
    .p-x-xs-10 { padding-left: 10px !important; padding-right: 10px !important; }
    .p-x-xs-15 { padding-left: 15px !important; padding-right: 15px !important; }
    .p-x-xs-20 { padding-left: 20px !important; padding-right: 20px !important; }
    .p-x-xs-25 { padding-left: 25px !important; padding-right: 25px !important; }
    .p-x-xs-30 { padding-left: 30px !important; padding-right: 30px !important; }
    .p-x-xs-35 { padding-left: 35px !important; padding-right: 35px !important; }
    .p-x-xs-40 { padding-left: 40px !important; padding-right: 40px !important; }
    .p-x-xs-50 { padding-left: 50px !important; padding-right: 50px !important; }
    .p-x-xs-60 { padding-left: 60px !important; padding-right: 60px !important; }
    .p-x-xs-70 { padding-left: 70px !important; padding-right: 70px !important; }
    .p-x-xs-80 { padding-left: 80px !important; padding-right: 80px !important; }
    .p-x-xs-90 { padding-left: 90px !important; padding-right: 90px !important; }
    .p-x-xs-100 { padding-left: 100px !important; padding-right: 100px !important; }
    .p-x-xs-110 { padding-left: 110px !important; padding-right: 110px !important; }
    .p-x-xs-120 { padding-left: 120px !important; padding-right: 120px !important; }
    .p-x-xs-130 { padding-left: 130px !important; padding-right: 130px !important; }
    .p-x-xs-140 { padding-left: 140px !important; padding-right: 140px !important; }
    .p-x-xs-150 { padding-left: 150px !important; padding-right: 150px !important; }
    .p-x-xs-200 { padding-left: 200px !important; padding-right: 200px !important; }

    .p-y-xs-0 { padding-top: 0 !important; padding-bottom: 0 !important; }
    .p-y-xs-5 { padding-top: 5px !important; padding-bottom: 5px !important; }
    .p-y-xs-10 { padding-top: 10px !important; padding-bottom: 10px !important; }
    .p-y-xs-15 { padding-top: 15px !important; padding-bottom: 15px !important; }
    .p-y-xs-20 { padding-top: 20px !important; padding-bottom: 20px !important; }
    .p-y-xs-25 { padding-top: 25px !important; padding-bottom: 25px !important; }
    .p-y-xs-30 { padding-top: 30px !important; padding-bottom: 30px !important; }
    .p-y-xs-35 { padding-top: 35px !important; padding-bottom: 35px !important; }
    .p-y-xs-40 { padding-top: 40px !important; padding-bottom: 40px !important; }
    .p-y-xs-50 { padding-top: 50px !important; padding-bottom: 50px !important; }
    .p-y-xs-60 { padding-top: 60px !important; padding-bottom: 60px !important; }
    .p-y-xs-70 { padding-top: 70px !important; padding-bottom: 70px !important; }
    .p-y-xs-80 { padding-top: 80px !important; padding-bottom: 80px !important; }
    .p-y-xs-90 { padding-top: 90px !important; padding-bottom: 90px !important; }
    .p-y-xs-100 { padding-top: 100px !important; padding-bottom: 100px !important; }
    .p-y-xs-110 { padding-top: 110px !important; padding-bottom: 110px !important; }
    .p-y-xs-120 { padding-top: 120px !important; padding-bottom: 120px !important; }
    .p-y-xs-130 { padding-top: 130px !important; padding-bottom: 130px !important; }
    .p-y-xs-140 { padding-top: 140px !important; padding-bottom: 140px !important; }
    .p-y-xs-150 { padding-top: 150px !important; padding-bottom: 150px !important; }
    .p-y-xs-200 { padding-top: 200px !important; padding-bottom: 200px !important; }

    .m-xs-0 { margin: 0 !important; }
    .m-xs-5 { margin: 5px !important; }
    .m-xs-10 { margin: 10px !important; }
    .m-xs-15 { margin: 15px !important; }
    .m-xs-20 { margin: 20px !important; }
    .m-xs-25 { margin: 25px !important; }
    .m-xs-30 { margin: 30px !important; }
    .m-xs-35 { margin: 35px !important; }
    .m-xs-40 { margin: 40px !important; }
    .m-xs-50 { margin: 50px !important; }
    .m-xs-60 { margin: 60px !important; }
    .m-xs-70 { margin: 70px !important; }
    .m-xs-80 { margin: 80px !important; }
    .m-xs-90 { margin: 90px !important; }
    .m-xs-100 { margin: 100px !important; }
    .m-xs-110 { margin: 110px !important; }
    .m-xs-120 { margin: 120px !important; }
    .m-xs-130 { margin: 130px !important; }
    .m-xs-140 { margin: 140px !important; }
    .m-xs-150 { margin: 150px !important; }
    .m-xs-200 { margin: 200px !important; }

    .m-t-xs-0 { margin-top: 0 !important; }
    .m-t-xs-5 { margin-top: 5px !important; }
    .m-t-xs-10 { margin-top: 10px !important; }
    .m-t-xs-15 { margin-top: 15px !important; }
    .m-t-xs-20 { margin-top: 20px !important; }
    .m-t-xs-25 { margin-top: 25px !important; }
    .m-t-xs-30 { margin-top: 30px !important; }
    .m-t-xs-35 { margin-top: 35px !important; }
    .m-t-xs-40 { margin-top: 40px !important; }
    .m-t-xs-50 { margin-top: 50px !important; }
    .m-t-xs-60 { margin-top: 60px !important; }
    .m-t-xs-70 { margin-top: 70px !important; }
    .m-t-xs-80 { margin-top: 80px !important; }
    .m-t-xs-90 { margin-top: 90px !important; }
    .m-t-xs-100 { margin-top: 100px !important; }
    .m-t-xs-110 { margin-top: 110px !important; }
    .m-t-xs-120 { margin-top: 120px !important; }
    .m-t-xs-130 { margin-top: 130px !important; }
    .m-t-xs-140 { margin-top: 140px !important; }
    .m-t-xs-150 { margin-top: 150px !important; }
    .m-t-xs-200 { margin-top: 200px !important; }

    .m-r-xs-0 { margin-right: 0 !important; }
    .m-r-xs-5 { margin-right: 5px !important; }
    .m-r-xs-10 { margin-right: 10px !important; }
    .m-r-xs-15 { margin-right: 15px !important; }
    .m-r-xs-20 { margin-right: 20px !important; }
    .m-r-xs-25 { margin-right: 25px !important; }
    .m-r-xs-30 { margin-right: 30px !important; }
    .m-r-xs-35 { margin-right: 35px !important; }
    .m-r-xs-40 { margin-right: 40px !important; }
    .m-r-xs-50 { margin-right: 50px !important; }
    .m-r-xs-60 { margin-right: 60px !important; }
    .m-r-xs-70 { margin-right: 70px !important; }
    .m-r-xs-80 { margin-right: 80px !important; }
    .m-r-xs-90 { margin-right: 90px !important; }
    .m-r-xs-100 { margin-right: 100px !important; }
    .m-r-xs-110 { margin-right: 110px !important; }
    .m-r-xs-120 { margin-right: 120px !important; }
    .m-r-xs-130 { margin-right: 130px !important; }
    .m-r-xs-140 { margin-right: 140px !important; }
    .m-r-xs-150 { margin-right: 150px !important; }
    .m-r-xs-200 { margin-right: 200px !important; }

    .m-b-xs-0 { margin-bottom: 0 !important; }
    .m-b-xs-5 { margin-bottom: 5px !important; }
    .m-b-xs-10 { margin-bottom: 10px !important; }
    .m-b-xs-15 { margin-bottom: 15px !important; }
    .m-b-xs-20 { margin-bottom: 20px !important; }
    .m-b-xs-25 { margin-bottom: 25px !important; }
    .m-b-xs-30 { margin-bottom: 30px !important; }
    .m-b-xs-35 { margin-bottom: 35px !important; }
    .m-b-xs-40 { margin-bottom: 40px !important; }
    .m-b-xs-50 { margin-bottom: 50px !important; }
    .m-b-xs-60 { margin-bottom: 60px !important; }
    .m-b-xs-70 { margin-bottom: 70px !important; }
    .m-b-xs-80 { margin-bottom: 80px !important; }
    .m-b-xs-90 { margin-bottom: 90px !important; }
    .m-b-xs-100 { margin-bottom: 100px !important; }
    .m-b-xs-110 { margin-bottom: 110px !important; }
    .m-b-xs-120 { margin-bottom: 120px !important; }
    .m-b-xs-130 { margin-bottom: 130px !important; }
    .m-b-xs-140 { margin-bottom: 140px !important; }
    .m-b-xs-150 { margin-bottom: 150px !important; }
    .m-b-xs-200 { margin-bottom: 200px !important; }

    .m-l-xs-0 { margin-left: 0 !important; }
    .m-l-xs-5 { margin-left: 5px !important; }
    .m-l-xs-10 { margin-left: 10px !important; }
    .m-l-xs-15 { margin-left: 15px !important; }
    .m-l-xs-20 { margin-left: 20px !important; }
    .m-l-xs-25 { margin-left: 25px !important; }
    .m-l-xs-30 { margin-left: 30px !important; }
    .m-l-xs-35 { margin-left: 35px !important; }
    .m-l-xs-40 { margin-left: 40px !important; }
    .m-l-xs-50 { margin-left: 50px !important; }
    .m-l-xs-60 { margin-left: 60px !important; }
    .m-l-xs-70 { margin-left: 70px !important; }
    .m-l-xs-80 { margin-left: 80px !important; }
    .m-l-xs-90 { margin-left: 90px !important; }
    .m-l-xs-100 { margin-left: 100px !important; }
    .m-l-xs-110 { margin-left: 110px !important; }
    .m-l-xs-120 { margin-left: 120px !important; }
    .m-l-xs-130 { margin-left: 130px !important; }
    .m-l-xs-140 { margin-left: 140px !important; }
    .m-l-xs-150 { margin-left: 150px !important; }
    .m-l-xs-200 { margin-left: 200px !important; }

    .m-x-xs-0 { margin-left: 0 !important; margin-right: 0 !important; }
    .m-x-xs-5 { margin-left: 5px !important; margin-right: 5px !important; }
    .m-x-xs-10 { margin-left: 10px !important; margin-right: 10px !important; }
    .m-x-xs-15 { margin-left: 15px !important; margin-right: 15px !important; }
    .m-x-xs-20 { margin-left: 20px !important; margin-right: 20px !important; }
    .m-x-xs-25 { margin-left: 25px !important; margin-right: 25px !important; }
    .m-x-xs-30 { margin-left: 30px !important; margin-right: 30px !important; }
    .m-x-xs-35 { margin-left: 35px !important; margin-right: 35px !important; }
    .m-x-xs-40 { margin-left: 40px !important; margin-right: 40px !important; }
    .m-x-xs-50 { margin-left: 50px !important; margin-right: 50px !important; }
    .m-x-xs-60 { margin-left: 60px !important; margin-right: 60px !important; }
    .m-x-xs-70 { margin-left: 70px !important; margin-right: 70px !important; }
    .m-x-xs-80 { margin-left: 80px !important; margin-right: 80px !important; }
    .m-x-xs-90 { margin-left: 90px !important; margin-right: 90px !important; }
    .m-x-xs-100 { margin-left: 100px !important; margin-right: 100px !important; }
    .m-x-xs-110 { margin-left: 110px !important; margin-right: 110px !important; }
    .m-x-xs-120 { margin-left: 120px !important; margin-right: 120px !important; }
    .m-x-xs-130 { margin-left: 130px !important; margin-right: 130px !important; }
    .m-x-xs-140 { margin-left: 140px !important; margin-right: 140px !important; }
    .m-x-xs-150 { margin-left: 150px !important; margin-right: 150px !important; }
    .m-x-xs-200 { margin-left: 200px !important; margin-right: 200px !important; }

    .m-y-xs-0 { margin-top: 0 !important; margin-bottom: 0 !important; }
    .m-y-xs-5 { margin-top: 5px !important; margin-bottom: 5px !important; }
    .m-y-xs-10 { margin-top: 10px !important; margin-bottom: 10px !important; }
    .m-y-xs-15 { margin-top: 15px !important; margin-bottom: 15px !important; }
    .m-y-xs-20 { margin-top: 20px !important; margin-bottom: 20px !important; }
    .m-y-xs-25 { margin-top: 25px !important; margin-bottom: 25px !important; }
    .m-y-xs-30 { margin-top: 30px !important; margin-bottom: 30px !important; }
    .m-y-xs-35 { margin-top: 35px !important; margin-bottom: 35px !important; }
    .m-y-xs-40 { margin-top: 40px !important; margin-bottom: 40px !important; }
    .m-y-xs-50 { margin-top: 50px !important; margin-bottom: 50px !important; }
    .m-y-xs-60 { margin-top: 60px !important; margin-bottom: 60px !important; }
    .m-y-xs-70 { margin-top: 70px !important; margin-bottom: 70px !important; }
    .m-y-xs-80 { margin-top: 80px !important; margin-bottom: 80px !important; }
    .m-y-xs-90 { margin-top: 90px !important; margin-bottom: 90px !important; }
    .m-y-xs-100 { margin-top: 100px !important; margin-bottom: 100px !important; }
    .m-y-xs-110 { margin-top: 110px !important; margin-bottom: 110px !important; }
    .m-y-xs-120 { margin-top: 120px !important; margin-bottom: 120px !important; }
    .m-y-xs-130 { margin-top: 130px !important; margin-bottom: 130px !important; }
    .m-y-xs-140 { margin-top: 140px !important; margin-bottom: 140px !important; }
    .m-y-xs-150 { margin-top: 150px !important; margin-bottom: 150px !important; }
    .m-y-xs-200 { margin-top: 200px !important; margin-bottom: 200px !important; }
}

/* Умельцево */
html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    overflow-x: hidden;
    color: var(--color-text);
    background-color: var(--color-background);
    background-image: linear-gradient(rgba(255, 244, 207, .83), rgba(255, 244, 207, .83)), url("../images/home/texture.jpg");
    font-family: "Inter", Arial, sans-serif;
    font-size: 18px;
    line-height: 1.4;
}

body,
button,
input,
textarea,
select {
    font-family: "Inter", Arial, sans-serif;
}

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

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

.site-container {
    width: calc(100% - 100px);
    max-width: var(--container-max-width);
    margin-right: auto;
    margin-left: auto;
}

@media (min-width: 1400px) {
    .site-container {
        max-width: 1700px;
    }
}

.section {
    position: relative;
    padding: 90px 0;
}

.section-title {
    margin: 0;
    color: var(--color-secondary);
    font-family: "Roboto Flex", Arial, sans-serif;
    font-size: clamp(48px, 4vw, 80px);
    font-weight: 700;
    line-height: 1;
    text-transform: uppercase;
}

.section-title span {
    color: var(--color-text-muted);
}

.section-title--light {
    color: #fff;
}

.section-subtitle {
    margin: 30px 0 0;
    color: var(--color-secondary);
    font-size: 26px;
    line-height: 1.25;
    opacity: .65;
}

.button {
    display: inline-flex;
    min-height: 70px;
    padding: 18px 30px;
    align-items: center;
    justify-content: center;
    border: 1px solid transparent;
    border-radius: 999px;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.4;
    text-align: center;
    text-transform: uppercase;
    transition: background-color .2s ease, border-color .2s ease, color .2s ease, transform .2s ease;
}

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

.button--primary {
    color: #fff;
    background: var(--color-primary);
}

.button--primary:hover {
    color: #fff;
    background: var(--color-primary-hover);
}

.button--outline {
    color: var(--color-secondary);
    border-color: var(--color-border);
    background: transparent;
}

.button--outline:hover {
    color: var(--color-primary);
    border-color: var(--color-primary);
}

.button--small {
    min-height: 50px;
    padding: 12px 24px;
    font-size: 13px;
}

/* Header */
.site-header {
    position: relative;
    z-index: 20;
    background: transparent;
}

.site-nav {
    min-height: 105px;
    padding: 0;
}

.site-nav__inner {
    display: flex;
    min-height: 105px;
    align-items: center;
    justify-content: space-between;
}

.site-logo {
    position: relative;
    z-index: 2;
    width: 118px;
    flex: 0 0 auto;
}

.site-logo img {
    width: 100%;
    height: 86px;
    object-fit: contain;
}

.site-nav__desktop {
    margin-left: 70px;
}

.site-nav__desktop .navbar-nav {
    gap: clamp(12px, 1.7vw, 34px);
    align-items: center;
}

.site-nav .nav-link {
    padding: 5px 0 !important;
    color: var(--color-secondary);
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
}

.site-nav .nav-link:hover,
.site-nav .nav-link.active {
    color: var(--color-primary);
}

.site-nav__actions {
    display: flex;
    position: relative;
    z-index: 2;
    gap: 5px;
    align-items: center;
}

.site-nav__toggle {
    display: none;
    width: 50px;
    height: 50px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 6px;
    background: var(--color-primary);
}

.site-nav__toggle span {
    width: 18px;
    height: 2px;
    background: #fff;
}

/* Hero */
.home-hero {
    position: relative;
    min-height: clamp(650px, 53.6vw, 965px);
    overflow: hidden;
    background: transparent;
}

.home-hero__inner {
    position: relative;
    min-height: clamp(650px, 53.6vw, 965px);
}

.home-hero__content {
    position: relative;
    z-index: 3;
    width: 58%;
    padding-top: 50px;
}

.home-hero__title {
    margin: 60px 0 120px;
    color: #960601;
    font-family: "Roboto Flex", Arial, sans-serif;
    font-size: clamp(70px, 7vw, 120px);
    font-weight: 700;
    line-height: .93;
    text-transform: uppercase;
}

.home-hero__note {
    margin: 18px 0 0;
    font-size: 14px;
    opacity: .65;
}

.home-hero__content .button--primary {
    color: #fff;
    background: var(--color-secondary);
}

.home-hero__content .button--primary:hover {
    color: #fff;
    background: #2f1104;
}

.home-hero__image {
    position: absolute;
    z-index: 2;
    width: min(78vw, 1340px);
    max-width: none;
    top: 0;
    right: -170px;
    bottom: auto;
    pointer-events: none;
}

.home-hero__product {
    display: grid;
    position: absolute;
    z-index: 4;
    width: 585px;
    min-height: 146px;
    left: 0;
    bottom: 60px;
    padding: 32px 120px 28px 30px;
    border: 1px solid var(--color-border);
    border-radius: 24px;
    background: rgba(255, 244, 207, .88);
}

.home-hero__counter {
    font-size: 16px;
    opacity: .65;
}

.home-hero__product strong {
    font-family: "Roboto Flex", Arial, sans-serif;
    font-size: 27px;
    text-transform: uppercase;
}

.home-hero__arrows {
    position: absolute;
    right: 28px;
    top: 50%;
    font-size: 22px;
    transform: translateY(-50%);
}

/* Categories */
.home-categories {
    background: transparent;
    padding-top: 0;
}

.category-grid {
    display: grid;
    margin-top: 55px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.category-card {
    position: relative;
    height: 433px;
    padding: 40px;
    overflow: hidden;
    border-radius: 30px;
    background: var(--color-accent);
}

.category-card--pelmeni {
    color: #fff;
    background: var(--color-secondary);
}

.category-card__content {
    position: relative;
    z-index: 2;
    max-width: 70%;
    height: 400px;
}

.category-card h3,
.process-card h3 {
    margin: 0 0 12px;
    font-family: "Roboto Flex", Arial, sans-serif;
    font-size: 36px;
    font-weight: 700;
    line-height: 1.05;
    text-transform: uppercase;
}

.category-card p {
    display: grid;
    margin: 0;
    gap: 8px;
    font-size: 19px;
    line-height: 1.4;
}

.category-card p span {
    position: relative;
    padding-left: 16px;
}

.category-card p span::before {
    position: absolute;
    width: 4px;
    height: 4px;
    top: .65em;
    left: 0;
    border-radius: 50%;
    background: var(--color-primary);
    content: "";
}

.category-card--pelmeni p span::before {
    background: rgba(255, 255, 255, .45);
}

.category-card strong {
    display: block;
    position: absolute;
    bottom: 50px;
    font-family: "Roboto Flex", Arial, sans-serif;
    font-size: 32px;
}

.category-card strong span{
    font-weight: 400;
    font-size: 26px;
}

.category-card img:not(.category-card-arrow) {
    position: absolute;
    width: 410px;
    max-width: none;
    right: 0px;
    bottom: 0px;
    object-fit: contain;
}

.category-card--pelmeni img {
    right: 0px;
    bottom: 0px;
}

.category-card--vareniki img {
    right: 0px;
    bottom: 0px;
}

.round-link {
    display: flex;
    position: absolute;
    z-index: 3;
    width: 54px;
    height: 54px;
    top: 30px;
    right: 30px;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    color: #fff;
    background: var(--color-primary);
    font-size: 24px;
}

.category-card:not(.category-card--pelmeni) .round-link {
    color: var(--color-secondary);
    background: var(--color-background);
}

.category-card--soon {
    border: 1px solid var(--color-border);
    color: #85755E;
    background: none;
}

.category-card--soon .category-card__content {
    max-width: 100%;
}

/* Story */
.home-story {
    position: relative;
    min-height: 950px;
    overflow: hidden;
    color: #fff;
    background: url(/view/images/home/quality-image.png) var(--color-primary);
    background-position: 100% 100%;
    background-repeat: no-repeat;
}

.home-story-bg{
    background: url(/view/images/home/square-opacity.png);
    background-position: 100% 100%;
    background-repeat: no-repeat;
}

.home-story__inner {
    min-height: 950px;
    padding-top: 100px;
}

.home-story__content {
    position: relative;
    z-index: 3;
    width: 60%;
}

.home-story__content p {
    width: 90%;
    margin: 30px 0 0;
    font-size: 26px;
    line-height: 1.3;
}

.home-story__image {
    position: absolute;
    z-index: 2;
    width: min(62vw, 1130px);
    max-width: none;
    right: -210px;
    bottom: 0;
}

.benefit-grid {
    margin-top: 220px;
}

.benefit-card {
    display: flex;
    min-height: 260px;
    padding: 25px;
    flex-direction: column;
    justify-content: space-between;
    border-radius: 26px;
    color: var(--color-secondary);
    background: var(--color-accent);
}

.benefit-card h3 {
    max-width: 290px;
    margin: 0;
    font-family: "Roboto Flex", Arial, sans-serif;
    font-size: 24px;
    font-weight: 700;
    line-height: 1.12;
    text-transform: uppercase;
}

.benefit-card__icon {
    display: block;
    position: relative;
    width: 64px;
    height: 64px;
}

/* Process */
.home-process {
    background-color: #c6e0de;
    background-image: linear-gradient(rgba(198, 224, 222, .85), rgba(198, 224, 222, .85)), url("../images/home/texture.jpg");
    background-size: cover;
}

.process-grid {
    --bs-gutter-x: 10px;
    --bs-gutter-y: 10px;
    margin-top: 90px;
}

.process-card {
    position: relative;
    height: 400px;
    padding: 40px;
    overflow: hidden;
    border-radius: 30px;
    background: url(/view/images/home/process-card-bg.png) #fff;
    background-position: 100% 100%;
    background-repeat: no-repeat;
}

.process-card__step {
    position: relative;
    z-index: 2;
    align-self: flex-start;
    padding: 8px 20px;
    box-shadow: 0px 3px 0 4px #c6e0de;
    border-radius: 30px;
    color: #577270;
    background: #fff;
    font-weight: 700;
}

.process-card img {
    position: absolute;
    z-index: 1;
    width: 332px;
    height: 332px;
    top: 50%;
    right: 30px;
    object-fit: contain;
    transform: translateY(-50%);
}

.process-card__content {
    position: relative;
    z-index: 2;
    width: calc(100% - 315px);
}

.process-card__content p {
    margin: 0;
    font-size: 21px;
}

/* Retail */
.home-retail {
    background-color: var(--color-background);
    background-image: linear-gradient(rgba(255, 244, 207, .88), rgba(255, 244, 207, .88)), url("../images/home/texture.jpg");
    background-size: cover;
}

.section-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
}

.section-subtitle--retail {
    margin-top: 20px;
}

.retail-grid {
    --bs-gutter-x: 10px;
    --bs-gutter-y: 10px;
    margin-top: 55px;
}

.stores-panel {
    height: 600px;
    padding: 48px 40px;
    overflow: hidden;
    border: 1px solid var(--color-border);
    border-radius: 30px;
}

.stores-panel h3 {
    margin: 0 0 28px;
    font-family: "Roboto Flex", Arial, sans-serif;
    font-size: 36px;
    font-weight: 700;
    text-transform: uppercase;
}

.stores-panel__controls {
    margin-bottom: 38px;
}

.stores-panel__city,
.stores-panel__switch {
    min-height: 70px;
    border: 1px solid var(--color-border);
    border-radius: 999px;
    background: transparent;
}

.stores-panel__city {
    width: 295px;
    padding: 0 28px;
    color: var(--color-secondary);
    font-weight: 700;
    text-transform: uppercase;
}

.stores-panel__switch {
    padding: 3px;
    border: 0;
    background: var(--color-accent);
}

.stores-panel__switch button {
    padding: 0 30px;
    border: 0;
    border-radius: 999px;
    color: var(--color-secondary);
    background: transparent;
    font-size: 16px;
    font-weight: 700;
    text-transform: uppercase;
}

.stores-panel__switch .active {
    color: var(--color-primary);
    background: var(--color-background);
}

.store-list {
    max-height: 340px;
    overflow: hidden;
}

.store-item {
    display: flex;
    padding: 0 0 25px;
    margin-bottom: 25px;
    align-items: flex-end;
    justify-content: space-between;
    border-bottom: 1px solid var(--color-border);
}

.store-item div {
    display: grid;
    gap: 8px;
}

.store-item strong {
    font-size: 21px;
}

.store-item span,
.store-item time {
    font-size: 18px;
}

.retail-logos {
    --bs-gutter-x: 10px;
    --bs-gutter-y: 10px;
}

.retail-logo {
    display: flex;
    min-height: 295px;
    padding: 35px;
    align-items: center;
    justify-content: center;
    border-radius: 30px;
    background: var(--color-accent);
}

.retail-logo img {
    max-width: 230px;
    max-height: 100px;
}

/* Partner */
.home-partner {
    position: relative;
    min-height: 1409px;
    overflow: hidden;
    background-color: var(--color-background);
    background-image: url("../images/home/partner-scene.png"), linear-gradient(rgba(255, 244, 207, .82), rgba(255, 244, 207, .82)), url("../images/home/texture.jpg");
    background-repeat: no-repeat, no-repeat, no-repeat;
    background-position: center bottom, center, center;
    background-size: 100% auto, cover, cover;
}

.home-partner__inner {
    min-height: 1409px;
}

.home-partner__content {
    width: 1030px;
    max-width: 100%;
    padding-top: 0;
    margin: 0 auto;
    text-align: center;
}

.home-partner__content .section-title span {
    color: var(--color-primary);
}

.home-partner__content p {
    margin: 28px 0 45px;
    font-size: 25px;
    opacity: .65;
}

.home-partner__tags {
    margin-top: 100px;
    gap: 15px;
}

.home-partner__tags span {
    padding: 9px 20px;
    border-radius: 30px;
    color: #577270;
    background: #fff;
    font-size: 17px;
    font-weight: 500;
    box-shadow: 0px 3px 0 4px #c6e0de;
}

/* Footer */
.site-footer {
    position: relative;
    padding: 80px 0 0;
    overflow: hidden;
    color: #fff;
    background: var(--color-secondary);
}

.site-footer__main {
    display: grid;
    padding-bottom: 150px;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 60px;
}

.site-footer__nav {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
}

.site-footer__nav a {
    color: rgba(255, 255, 255, .35);
    font-family: "Roboto Flex", Arial, sans-serif;
    font-size: 58px;
    font-weight: 700;
    line-height: 1.05;
    text-transform: uppercase;
}

.site-footer__nav a.active,
.site-footer__nav a:hover {
    color: #fff;
}

.site-footer__contacts {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
}

.site-footer__contacts > span,
.site-footer__cta > span {
    color: rgba(255, 255, 255, .5);
    font-size: 18px;
}

.site-footer__contacts > div {
    display: flex;
    gap: 24px;
}

.site-footer__contacts > div a,
.site-footer__phone {
    font-family: "Roboto Flex", Arial, sans-serif;
    font-weight: 700;
    text-transform: uppercase;
}

.site-footer__contacts > div a {
    font-size: 26px;
}

.site-footer__phone {
    margin-top: auto;
    font-size: 34px;
}

.site-footer__contacts p {
    max-width: 520px;
    margin: 0;
    color: rgba(255, 255, 255, .4);
    font-size: 24px;
}

.site-footer__cta {
    display: flex;
    padding: 40px;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;
    border-radius: 30px;
    background: #2c1308;
}

.site-footer__cta p {
    margin: 20px 0 40px;
    font-family: "Roboto Flex", Arial, sans-serif;
    font-size: 34px;
    line-height: 1.15;
}

.site-footer__bottom {
    display: grid;
    min-height: 190px;
    padding: 40px 0;
    align-items: center;
    border-top: 1px solid rgba(255, 255, 255, .12);
    grid-template-columns: auto 1fr auto auto;
    gap: 55px;
    font-size: 14px;
    font-weight: 700;
    text-transform: uppercase;
}

.site-footer__bottom > img {
    width: 110px;
    height: 80px;
}

.site-footer__legal,
.site-footer__requisites {
    display: flex;
    gap: 28px;
}

.site-footer__legal {
    color: rgba(255, 255, 255, .5);
}

@media (max-width: 1199px) {
    .site-container {
        width: calc(100% - 48px);
    }

    .site-nav__desktop .navbar-nav {
        gap: 14px;
    }

    .site-nav .nav-link {
        font-size: 11px;
    }

    .home-hero__image {
        right: -30px;
    }

    .benefit-card h3 {
        font-size: 20px;
    }

    .process-card img {
        width: 260px;
        height: 260px;
    }

    .process-card__content {
        width: calc(100% - 220px);
    }

    .stores-panel__controls {
        gap: 10px;
    }

    .stores-panel__city,
    .stores-panel__switch {
        width: 100%;
    }

    .stores-panel__switch button {
        flex: 1;
    }

    .site-footer__nav a {
        font-size: 42px;
    }
}

@media (max-width: 991px) {
    .site-nav__toggle {
        display: flex;
    }

    .site-nav__desktop {
        position: absolute;
        z-index: 1;
        top: 100%;
        right: 0;
        left: 0;
        margin-left: 0;
        padding: 30px 24px;
        background: var(--color-background);
        box-shadow: var(--shadow-md);
    }

    .site-nav__desktop .navbar-nav {
        align-items: flex-start;
    }

    .site-nav .nav-link {
        font-size: 24px;
    }

    .category-grid,
    .site-footer__main {
        grid-template-columns: 1fr 1fr;
    }

    .category-card--soon {
        grid-column: span 2;
    }

    .benefit-grid {
        position: relative;
        margin-top: 60px;
    }

    .home-story {
        padding-bottom: 60px;
    }

    .home-story__image {
        opacity: .5;
    }

    .process-card {
        height: 480px;
    }

    .process-card img {
        top: 100px;
        right: 10px;
        transform: none;
    }

    .process-card__content {
        width: 100%;
    }

    .site-footer__main {
        grid-template-columns: 1fr;
    }

    .site-footer__bottom {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 767px) {
    body {
        font-size: 16px;
    }

    .site-container {
        width: calc(100% - 24px);
    }

    .section {
        padding: 80px 0;
    }

    .section-title {
        font-size: 40px;
    }

    .section-subtitle {
        font-size: 19px;
    }

    .section-subtitle--retail {
        display: none;
    }

    .button {
        width: 100%;
        min-height: 50px;
        padding: 12px 20px;
        font-size: 13px;
    }

    .button--small {
        width: auto;
    }

    .site-nav,
    .site-nav__inner {
        min-height: 83px;
    }

    .site-logo {
        width: 80px;
    }

    .site-logo img {
        height: 59px;
    }

    .site-nav__desktop {
        padding-right: 12px;
        padding-left: 12px;
    }

    .home-hero,
    .home-hero__inner {
        min-height: 478px;
    }

    .home-hero__content {
        display: flex;
        width: 100%;
        padding-top: 25px;
        flex-direction: column;
    }

    .home-hero__title {
        margin-top: 0;
        margin-bottom: 22px;
        font-size: 50px;
        line-height: .94;
    }

    .home-hero__content .button {
        width: auto;
        margin-top: 200px;
        align-self: center;
    }

    .home-hero__note {
        max-width: 260px;
        margin: 12px auto 0;
        align-self: center;
        font-size: 10px;
        text-align: center;
    }

    .home-hero__image {
        width: 420px;
        right: -20px;
        top: 90px;
        bottom: auto;
    }
    
    .category-card img:not(.category-card-arrow) {
        width: 240px;
        right: 0;
        bottom: 0;
    }

    .home-hero__product {
        width: calc(100% - 24px);
        min-height: 92px;
        left: 12px;
        bottom: 12px;
        padding: 17px 90px 15px 20px;
        border-radius: 18px;
    }

    .home-hero__counter {
        font-size: 11px;
    }

    .home-hero__product strong {
        font-size: 19px;
    }

    .category-grid,
    .site-footer__main,
    .site-footer__bottom {
        grid-template-columns: 1fr;
    }

    .category-grid {
        margin-top: 40px;
        gap: 5px;
    }

    .category-card,
    .category-card--soon {
        height: 260px;
        padding: 25px;
        border-radius: 20px;
        grid-column: auto;
    }
    
    .category-card--soon {
        height: 110px;
    }
    
    .category-card--soon .category-card__content {
        height: 60px;
    }

    .category-card h3,
    .process-card h3 {
        font-size: 24px;
    }

    .category-card p {
        font-size: 14px;
    }

    .category-card strong {
        margin-top: 0px;
        font-size: 18px;
        position: absolute;
        bottom: 0px;
    }

    .category-card img:not(.category-card-arrow) {
        width: 210px;
        right: 0px;
        bottom: 0px;
    }

    .category-card--pelmeni img {
        right: -85px;
        bottom: -35px;
    }

    .round-link {
        width: 40px;
        height: 40px;
        top: 20px;
        right: 20px;
        font-size: 18px;
    }

    .home-story{
        background: var(--color-primary);
    }
    
    .home-story-bg {
        background: url(/view/images/home/square-opacity.png);
        background-position: 50% 50%;
        background-repeat: no-repeat;
    }
    
    .home-story,
    .home-story__inner {
        min-height: auto;
    }

    .home-story__inner {
        padding-top: 80px;
    }

    .home-story__content {
        width: 100%;
    }

    .home-story__content p {
        width: 100%;
        margin-top: 20px;
        font-size: 16px;
    }

    .home-story__image {
        width: 510px;
        right: -180px;
        bottom: 345px;
        opacity: 1;
    }

    .benefit-grid {
        margin-top: 30px;
    }

    .benefit-card {
        min-height: 94px;
        padding: 20px 25px;
        flex-direction: row;
        align-items: center;
        justify-content: flex-start;
        gap: 20px;
        border-radius: 20px;
    }

    .benefit-card__icon {
        width: 40px;
        height: 40px;
        flex: 0 0 40px;
    }

    .benefit-card__icon::before {
        width: 17px;
        height: 17px;
        top: 9px;
        left: 9px;
    }

    .benefit-card__icon::after {
        width: 16px;
        top: 19px;
        left: 11px;
    }

    .benefit-card h3 {
        font-size: 19px;
    }

    .process-grid {
        --bs-gutter-x: 5px;
        --bs-gutter-y: 5px;
        margin-top: 40px;
    }

    .process-card {
        height: 265px;
        padding: 25px;
        border-radius: 20px;
    }

    .process-card__step {
        padding: 6px 15px;
        border-width: 4px;
        font-size: 14px;
    }

    .process-card img {
        width: 115px;
        height: 115px;
        top: 15px;
        right: 12px;
    }

    .process-card__content p {
        font-size: 16px;
    }

    .section-heading {
        align-items: flex-start;
    }

    .retail-grid {
        margin-top: 40px;
    }

    .stores-panel {
        height: 640px;
        padding: 25px 15px 25px 25px;
        border-radius: 20px;
    }

    .stores-panel h3 {
        font-size: 19px;
    }

    .stores-panel__controls {
        margin-bottom: 28px;
    }

    .stores-panel__city,
    .stores-panel__switch {
        min-height: 50px;
    }

    .stores-panel__city,
    .stores-panel__switch button {
        font-size: 13px;
    }

    .store-item {
        align-items: flex-start;
        flex-direction: column;
        gap: 10px;
    }

    .store-item strong {
        font-size: 16px;
    }

    .store-item span,
    .store-item time {
        font-size: 14px;
    }

    .retail-logos {
        --bs-gutter-x: 5px;
        --bs-gutter-y: 5px;
    }

    .retail-logo {
        min-height: 166px;
        padding: 20px;
        border-radius: 20px;
    }

    .home-retail .d-md-none.button {
        margin-top: 5px;
    }

    .home-partner,
    .home-partner__inner {
        min-height: 690px;
    }
    
    .retail-logo img {
        max-width: 100%;
    }

    .home-partner {
        background-position: center bottom, center, center;
        background-size: auto 600px, cover, cover;
    }

    .home-partner__content {
        padding-top: 0;
        text-align: left;
    }

    .home-partner__content p {
        margin: 20px 0 30px;
        font-size: 19px;
    }

    .home-partner__tags {
        margin-top: 80px;
    }

    .home-partner__tags span {
        padding: 6px 15px;
        font-size: 12px;
    }

    .site-footer {
        padding-top: 80px;
    }

    .site-footer__main {
        padding-bottom: 50px;
        gap: 40px;
    }

    .site-footer__nav a {
        font-size: 35px;
    }

    .site-footer__contacts > span,
    .site-footer__cta > span {
        font-size: 14px;
    }

    .site-footer__contacts > div a {
        font-size: 19px;
    }

    .site-footer__phone {
        margin-top: 20px;
        font-size: 24px;
    }

    .site-footer__contacts p {
        font-size: 18px;
    }

    .site-footer__cta {
        padding: 25px;
        border-radius: 20px;
    }

    .site-footer__cta p {
        font-size: 24px;
    }

    .site-footer__bottom {
        padding: 40px 0 80px;
        gap: 28px;
        font-size: 12px;
    }

    .site-footer__legal,
    .site-footer__requisites {
        align-items: flex-start;
        flex-direction: column;
        gap: 12px;
    }
}

/* Страница Производство — версия по макету */

.production-exact {
    color: var(--color-secondary);
    background:
        linear-gradient(180deg, rgba(255, 244, 207, .94), rgba(255, 244, 207, .98)),
        url("../images/home/texture.jpg") center top / 720px auto repeat;
}

.production-exact__top {
    padding: 155px 0 0;
}

.production-exact__breadcrumbs {
    margin-bottom: 50px;
    font-size: 15px;
}

.production-hero-card {
    position: relative;
    display: block;
    overflow: hidden;
    min-height: 750px;
    padding: 80px;
    background:
        linear-gradient(90deg, rgba(184, 0, 0, .96), rgba(184, 0, 0, .88)),
        repeating-linear-gradient(90deg, rgba(255,255,255,.06) 0 125px, rgba(255,255,255,0) 125px 250px),
        repeating-linear-gradient(0deg, rgba(0,0,0,.06) 0 120px, rgba(0,0,0,0) 120px 240px),
        #bd0000;
    border-radius: 24px;
}

.production-hero-card::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(90deg, rgba(255,255,255,.055) 1px, transparent 1px),
        linear-gradient(0deg, rgba(255,255,255,.04) 1px, transparent 1px);
    background-size: 250px 240px;
    opacity: .55;
}

.production-hero-card__content {
    position: relative;
    z-index: 2;
    max-width: 1190px;
}

.production-hero-card h1 {
    margin: 0;
    color: #fff;
    font-family: "Roboto Flex", Arial, sans-serif;
    font-size: 90px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: -.04em;
    text-transform: uppercase;
}

.production-hero-card p {
    max-width: 940px;
    margin: 40px 0 0;
    color: rgba(255, 255, 255, .78);
    font-size: 28px;
    line-height: 1.2;
}

.production-hero-card__bottom {
    display: flex;
    align-items: center;
    gap: 85px;
    margin-top: 250px;
}

.production-video-button {
    display: inline-flex;
    min-height: 70px;
    padding: 0 34px;
    align-items: center;
    gap: 18px;
    color: var(--color-secondary);
    background: #fff;
    border-radius: var(--radius-pill);
    font-size: 16px;
    font-weight: 900;
    line-height: 1;
    text-decoration: none;
    text-transform: uppercase;
}

.production-video-button span {
    color: var(--color-primary);
    font-size: 17px;
}

.production-hero-card__bottom strong {
    color: #fff;
    font-size: 17px;
    font-weight: 900;
    line-height: 1.2;
    text-transform: uppercase;
}

.production-hero-card__plate {
    position: absolute;
    z-index: 1;
    max-width: none;
    pointer-events: none;
}

.production-hero-card__plate--top {
    top: 0;
    right: -4px;
    width: 350px;
}

.production-hero-card__plate--bottom {
    right: 130px;
    bottom: 0;
    width: 760px;
}

.production-equipment {
    padding: 150px 0 0;
}

.production-equipment h1,
.production-process h2 {
    margin: 0;
    color: var(--color-secondary);
    font-family: "Roboto Flex", Arial, sans-serif;
    font-size: 90px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: -.04em;
    text-transform: uppercase;
}

.production-step-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin-top: 105px;
}

.production-step-card {
    position: relative;
    overflow: hidden;
    min-height: 400px;
    padding: 40px;
    background: #f3dfae;
    border-radius: 24px;
}

.production-step-card::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 44% 27%, rgba(255,255,255,.16) 0 8px, transparent 9px),
        radial-gradient(circle at 24% 63%, rgba(255,255,255,.11) 0 5px, transparent 6px);
    opacity: .65;
}

.production-step-card > span {
    position: relative;
    z-index: 2;
    display: inline-flex;
    min-height: 52px;
    padding: 0 24px;
    align-items: center;
    color: #7b716a;
    background: #fff;
    border: 5px solid rgba(64, 24, 6, .45);
    border-radius: var(--radius-pill);
    font-size: 20px;
    font-weight: 900;
    line-height: 1;
}

.production-step-card > div {
    position: absolute;
    z-index: 2;
    left: 40px;
    bottom: 40px;
    max-width: 510px;
}

.production-step-card h2 {
    margin: 0;
    color: #1f2029;
    font-family: "Roboto Flex", Arial, sans-serif;
    font-size: 36px;
    font-weight: 700;
    line-height: 1.1;
    text-transform: uppercase;
}

.production-step-card p {
    margin: 18px 0 0;
    color: #1f2029;
    font-size: 22px;
    line-height: 1.35;
}

.production-step-card img {
    position: absolute;
    z-index: 1;
    top: 34px;
    right: 40px;
    width: 332px;
    max-width: none;
}

.production-process {
    padding: 150px 0 160px;
}

.production-process-gallery {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin-top: 105px;
}

.production-process-gallery img {
    width: 100%;
    border-radius: 24px;
}

.production-slider-arrows {
    display: flex;
    justify-content: center;
    gap: 10px;
    margin-top: 45px;
}

.production-slider-arrows span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    font-size: 22px;
    line-height: 1;
}

.production-slider-arrows span:first-child {
    color: rgba(64, 24, 6, .22);
    background: rgba(255, 255, 255, .35);
}

.production-slider-arrows span:last-child {
    color: #fff;
    background: var(--color-primary);
}

@media (max-width: 1199px) {
    .production-equipment h1,
    .production-process h2,
    .production-hero-card h1 {
        font-size: 62px;
    }

    .production-step-grid,
    .production-process-gallery {
        margin-top: 60px;
    }
}

@media (max-width: 767px) {
    .production-exact .site-container {
        width: calc(100% - 24px);
    }

    .production-exact__top {
        padding-top: 132px;
    }

    .production-exact__breadcrumbs {
        margin-bottom: 18px;
        font-size: 9px;
    }

    .production-hero-card {
        min-height: 500px;
        padding: 20px;
        border-radius: 8px;
    }

    .production-hero-card__content {
        max-width: 100%;
    }

    .production-hero-card h1 {
        font-size: 35px;
        line-height: .95;
    }

    .production-hero-card p {
        max-width: 285px;
        margin-top: 18px;
        font-size: 14px;
        line-height: 1.25;
    }

    .production-hero-card__bottom {
        align-items: flex-start;
        flex-direction: column;
        gap: 14px;
        margin-top: 20px;
    }

    .production-video-button {
        min-height: 45px;
        padding: 0 18px;
        gap: 10px;
        font-size: 10px;
    }

    .production-hero-card__bottom strong {
        display: none;
    }

    .production-hero-card__plate--top {
        right: -95px;
        bottom: 135px;
        top: auto;
        width: 245px;
    }

    .production-hero-card__plate--bottom {
        right: -115px;
        bottom: -12px;
        width: 430px;
    }

    .production-equipment {
        padding-top: 80px;
    }

    .production-equipment h1,
    .production-process h2 {
        font-size: 35px;
        line-height: .95;
        letter-spacing: -.05em;
    }

    .production-step-grid {
        display: grid;
        grid-template-columns: 1fr;
        gap: 5px;
        margin-top: 40px;
    }

    .production-step-card {
        min-height: 235px;
        padding: 18px;
        border-radius: 12px;
    }

    .production-step-card > span {
        min-height: 31px;
        padding: 0 13px;
        border-width: 3px;
        font-size: 10px;
    }

    .production-step-card > div {
        left: 18px;
        right: 18px;
        bottom: 22px;
        max-width: 205px;
    }

    .production-step-card h2 {
        font-size: 18px;
    }

    .production-step-card p {
        margin-top: 8px;
        font-size: 11px;
    }

    .production-step-card img {
        top: 18px;
        right: 15px;
        width: 125px;
    }

    .production-process {
        padding: 80px 0 85px;
    }

    .production-process-gallery {
        display: flex;
        gap: 5px;
        margin-top: 40px;
        overflow: hidden;
    }

    .production-process-gallery img {
        width: 166px;
        min-width: 166px;
        border-radius: 8px;
    }

    .production-slider-arrows {
        display: none;
    }
}

/* Страница О компании — версия по макету */

.company-exact {
    color: var(--color-secondary);
    background:
        linear-gradient(180deg, rgba(255, 244, 207, .94), rgba(255, 244, 207, .98)),
        url("../images/home/texture.jpg") center top / 720px auto repeat;
}

.company-hero {
    padding: 155px 0 0;
}

.company-breadcrumbs {
    margin-bottom: 55px;
    font-size: 15px;
}

.company-hero h1 {
    margin: 0 0 110px;
    color: var(--color-secondary);
    font-family: "Roboto Flex", Arial, sans-serif;
    font-size: 128px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: -.05em;
    text-transform: uppercase;
}

.company-mission {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}

.company-mission__image,
.company-mission__card {
    overflow: hidden;
    min-height: 700px;
    border-radius: 24px;
}

.company-mission__image img {
    width: 100%;
    height: 100%;
    max-width: none;
    object-fit: cover;
}

.company-mission__card {
    display: flex;
    padding: 67px 60px 70px;
    flex-direction: column;
    justify-content: space-between;
    background: #f3dfae;
}

.company-mission__card h2 {
    max-width: 660px;
    margin: 0;
    color: var(--color-secondary);
    font-family: "Roboto Flex", Arial, sans-serif;
    font-size: 64px;
    font-weight: 700;
    line-height: 1.16;
    letter-spacing: -.04em;
    text-transform: uppercase;
}

.company-mission__card h3 {
    margin: 0 0 24px;
    color: var(--color-secondary);
    font-family: "Roboto Flex", Arial, sans-serif;
    font-size: 36px;
    font-weight: 700;
    line-height: 1.1;
    text-transform: uppercase;
}

.company-mission__card p {
    max-width: 766px;
    margin: 0;
    color: var(--color-secondary);
    font-size: 22px;
    line-height: 1.4;
}

.company-history {
    padding: 150px 0 150px;
}

.company-timeline {
    position: relative;
    min-height: 648px;
}

.company-timeline::before {
    content: "";
    position: absolute;
    top: 324px;
    left: 0;
    right: 70px;
    height: 2px;
    background: rgba(64, 24, 6, .13);
}

.company-timeline__item {
    position: absolute;
    width: 600px;
}

.company-timeline__item::before {
    content: "";
    position: absolute;
    left: 0;
    width: 2px;
    height: 324px;
    background: rgba(64, 24, 6, .13);
}

.company-timeline__item > span {
    position: absolute;
    z-index: 2;
    left: -8px;
    width: 18px;
    height: 18px;
    background: var(--color-secondary);
    border-radius: 50%;
}

.company-timeline__item--2026 {
    top: 0;
    left: 0;
    padding: 0 0 0 58px;
}

.company-timeline__item--2026::before {
    top: 0;
}

.company-timeline__item--2026 > span {
    top: 314px;
}

.company-timeline__item--2025 {
    top: 324px;
    left: 610px;
    padding: 95px 0 0 58px;
}

.company-timeline__item--2025::before {
    top: 0;
}

.company-timeline__item--2025 > span {
    top: -10px;
}

.company-timeline__item--2024 {
    top: 0;
    left: 1220px;
    padding: 0 0 0 58px;
}

.company-timeline__item--2024::before {
    top: 0;
}

.company-timeline__item--2024 > span {
    top: 314px;
}

.company-timeline h2 {
    margin: 0 0 38px;
    color: rgba(64, 24, 6, .48);
    font-family: "Roboto Flex", Arial, sans-serif;
    font-size: 80px;
    font-weight: 700;
    line-height: 1;
}

.company-timeline p {
    max-width: 410px;
    margin: 0;
    color: rgba(64, 24, 6, .72);
    font-size: 20px;
    line-height: 1.35;
}

.company-timeline__arrow {
    position: absolute;
    top: 297px;
    right: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 54px;
    height: 54px;
    color: #fff;
    background: var(--color-primary);
    border-radius: 50%;
    font-size: 28px;
    text-decoration: none;
}

.company-numbers {
    padding: 150px 0;
    background:
        linear-gradient(rgba(203, 229, 226, .92), rgba(203, 229, 226, .92)),
        repeating-linear-gradient(90deg, rgba(255,255,255,.16) 0 118px, transparent 118px 236px),
        repeating-linear-gradient(0deg, rgba(255,255,255,.12) 0 118px, transparent 118px 236px),
        #c9e5e1;
}

.company-numbers h2,
.company-certificates h2 {
    margin: 0;
    color: var(--color-secondary);
    font-family: "Roboto Flex", Arial, sans-serif;
    font-size: 90px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: -.04em;
    text-transform: uppercase;
}

.company-numbers > .site-container > p {
    max-width: 900px;
    margin: 45px 0 0;
    color: rgba(64, 24, 6, .62);
    font-size: 20px;
    line-height: 1.4;
}

.company-numbers__grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    margin-top: 115px;
}

.company-numbers__grid article {
    min-height: 260px;
    padding: 48px 42px;
    background: #fff;
    border-radius: 20px;
}

.company-numbers__grid strong {
    display: block;
    margin-bottom: 52px;
    color: var(--color-secondary);
    font-family: "Roboto Flex", Arial, sans-serif;
    font-size: 52px;
    font-weight: 700;
    line-height: 1;
}

.company-numbers__grid span {
    display: block;
    max-width: 180px;
    color: var(--color-secondary);
    font-size: 18px;
    font-weight: 800;
    line-height: 1.25;
}

.company-certificates {
    padding: 150px 0;
}

.company-certificates__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin-top: 95px;
}

.company-certificate {
    position: relative;
    min-height: 292px;
    padding: 42px;
    background: #f3dfae;
    border-radius: 18px;
}

.company-certificate h3 {
    max-width: 460px;
    margin: 0 0 30px;
    color: var(--color-secondary);
    font-family: "Roboto Flex", Arial, sans-serif;
    font-size: 34px;
    font-weight: 700;
    line-height: 1.05;
    text-transform: uppercase;
}

.company-certificate a {
    color: var(--color-secondary);
    font-size: 13px;
    font-weight: 900;
    line-height: 1;
    text-transform: uppercase;
}

.company-certificate span {
    position: absolute;
    right: 42px;
    bottom: 42px;
    width: 44px;
    height: 44px;
    color: var(--color-primary);
}

.company-certificate span::before {
    content: "✹";
    position: absolute;
    left: 0;
    top: -6px;
    color: var(--color-primary);
    font-size: 40px;
    line-height: 1;
}

.company-certificate span::after {
    content: "";
    position: absolute;
    left: 11px;
    top: 25px;
    width: 24px;
    height: 22px;
    background: var(--color-primary);
    clip-path: polygon(0 0, 45% 28%, 100% 0, 78% 100%, 50% 70%, 22% 100%);
}

@media (max-width: 1199px) {
    .company-hero h1,
    .company-numbers h2,
    .company-certificates h2 {
        font-size: 68px;
    }

    .company-mission__card h2 {
        font-size: 48px;
    }

    .company-timeline__item {
        width: 31%;
    }

    .company-timeline__item--2025 {
        left: 34%;
    }

    .company-timeline__item--2024 {
        left: 68%;
    }
}

@media (max-width: 767px) {
    .company-exact .site-container {
        width: calc(100% - 24px);
    }

    .company-hero {
        padding-top: 132px;
    }

    .company-breadcrumbs {
        margin-bottom: 20px;
        font-size: 9px;
    }

    .company-hero h1 {
        display: none;
    }

    .company-mission {
        grid-template-columns: 1fr;
        gap: 5px;
    }

    .company-mission__image,
    .company-mission__card {
        min-height: 0;
        border-radius: 8px;
    }

    .company-mission__image {
        height: 232px;
    }

    .company-mission__card {
        padding: 20px;
    }

    .company-mission__card h2 {
        margin-bottom: 58px;
        font-size: 30px;
        line-height: .98;
    }

    .company-mission__card h3 {
        margin-bottom: 15px;
        font-size: 17px;
    }

    .company-mission__card p {
        font-size: 11px;
        line-height: 1.35;
    }

    .company-history {
        padding: 80px 0;
    }

    .company-timeline {
        display: grid;
        gap: 45px;
        min-height: 0;
        padding-left: 28px;
    }

    .company-timeline::before {
        top: 10px;
        bottom: 10px;
        left: 0;
        right: auto;
        width: 1px;
        height: auto;
    }

    .company-timeline__item {
        position: relative;
        top: auto;
        left: auto;
        width: auto;
        padding: 0;
    }

    .company-timeline__item::before {
        display: none;
    }

    .company-timeline__item > span {
        top: 11px;
        left: -36px;
        width: 10px;
        height: 10px;
    }

    .company-timeline h2 {
        margin-bottom: 16px;
        font-size: 40px;
    }

    .company-timeline p {
        max-width: 270px;
        font-size: 11px;
    }

    .company-timeline__arrow {
        position: static;
        width: auto;
        height: auto;
        justify-content: flex-start;
        color: var(--color-secondary);
        background: transparent;
        border-radius: 0;
        font-size: 10px;
        font-weight: 900;
        text-transform: uppercase;
    }

    .company-timeline__arrow::before {
        content: "Показать ещё";
        margin-right: 8px;
    }

    .company-numbers {
        padding: 80px 0;
    }

    .company-numbers h2,
    .company-certificates h2 {
        font-size: 35px;
    }

    .company-numbers > .site-container > p {
        margin-top: 20px;
        font-size: 11px;
    }

    .company-numbers__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 5px;
        margin-top: 40px;
    }

    .company-numbers__grid article {
        min-height: 125px;
        padding: 18px;
        border-radius: 10px;
    }

    .company-numbers__grid strong {
        margin-bottom: 28px;
        font-size: 26px;
    }

    .company-numbers__grid span {
        font-size: 10px;
    }

    .company-certificates {
        padding: 80px 0;
    }

    .company-certificates__grid {
        grid-template-columns: 1fr;
        gap: 5px;
        margin-top: 40px;
    }

    .company-certificate {
        min-height: 130px;
        padding: 18px;
        border-radius: 8px;
    }

    .company-certificate h3 {
        max-width: 250px;
        margin-bottom: 18px;
        font-size: 18px;
    }

    .company-certificate a {
        font-size: 9px;
    }

    .company-certificate span {
        right: 18px;
        bottom: 18px;
        transform: scale(.62);
        transform-origin: right bottom;
    }
}

/* Страница Где купить — версия по макету */

.where-buy-exact {
    color: var(--color-secondary);
    background:
        linear-gradient(180deg, rgba(255, 244, 207, .94), rgba(255, 244, 207, .98)),
        url("../images/home/texture.jpg") center top / 720px auto repeat;
}

.where-buy-hero {
    padding: 155px 0 0;
}

.where-buy-breadcrumbs {
    margin-bottom: 60px;
    font-size: 15px;
}

.where-buy-hero h1 {
    margin: 0;
    color: var(--color-secondary);
    font-family: "Roboto Flex", Arial, sans-serif;
    font-size: 128px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: -.05em;
    text-transform: uppercase;
}

.where-buy-content {
    padding: 115px 0 150px;
}

.where-buy-panel {
    min-height: 702px;
    padding: 49px 40px 50px;
    border: 1px solid rgba(64, 24, 6, .12);
    border-radius: 24px;
}

.where-buy-panel__top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 30px;
    margin-bottom: 32px;
}

.where-buy-panel h2 {
    margin: 0 0 32px;
    color: var(--color-secondary);
    font-family: "Roboto Flex", Arial, sans-serif;
    font-size: 36px;
    font-weight: 700;
    line-height: 1.05;
    letter-spacing: -.04em;
    text-transform: uppercase;
}

.where-buy-city {
    display: inline-flex;
    min-width: 295px;
    min-height: 70px;
    padding: 0 28px;
    align-items: center;
    gap: 13px;
    color: var(--color-secondary);
    background: transparent;
    border: 1px solid rgba(64, 24, 6, .12);
    border-radius: 999px;
    font-size: 16px;
    font-weight: 900;
    line-height: 1;
    text-transform: uppercase;
}

.where-buy-city span {
    position: relative;
    width: 18px;
    height: 18px;
    flex: 0 0 18px;
    border: 3px solid rgba(64, 24, 6, .55);
    border-radius: 50% 50% 50% 0;
    transform: rotate(-45deg);
}

.where-buy-city span::after {
    content: "";
    position: absolute;
    top: 4px;
    left: 4px;
    width: 4px;
    height: 4px;
    background: rgba(64, 24, 6, .55);
    border-radius: 50%;
}

.where-buy-city i {
    margin-left: auto;
    color: rgba(64, 24, 6, .55);
    font-style: normal;
}

.where-buy-view-switch {
    display: inline-flex;
    min-height: 66px;
    padding: 3px;
    align-self: flex-end;
    background: #f3dfae;
    border-radius: 999px;
}

.where-buy-view-switch button {
    min-width: 128px;
    padding: 0 30px;
    color: var(--color-secondary);
    background: transparent;
    border: 0;
    border-radius: 999px;
    font-size: 16px;
    font-weight: 900;
    text-transform: uppercase;
}

.where-buy-view-switch button.active {
    color: var(--color-primary);
    background: var(--color-background);
}

.where-buy-exact .where-buy-list {
    display: block;
    position: relative;
    max-height: 420px;
    padding-right: 40px;
    overflow: hidden;
}

.where-buy-exact .where-buy-list::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 3px;
    height: 100%;
    background:
        linear-gradient(var(--color-secondary), var(--color-secondary)) top right / 3px 180px no-repeat,
        rgba(64, 24, 6, .12);
}

.where-buy-exact .where-buy-item {
    display: flex;
    min-height: 108px;
    margin: 0;
    padding: 0;
    align-items: center;
    justify-content: space-between;
    background: transparent;
    border: 0;
    border-bottom: 1px solid rgba(64, 24, 6, .12);
    border-radius: 0;
}

.where-buy-exact .where-buy-item:last-child {
    border-bottom: 0;
    opacity: .22;
}

.where-buy-exact .where-buy-item div {
    display: grid;
    gap: 10px;
}

.where-buy-exact .where-buy-item strong {
    color: var(--color-secondary);
    font-size: 21px;
    font-weight: 900;
    line-height: 1;
}

.where-buy-exact .where-buy-item span,
.where-buy-exact .where-buy-item time {
    color: rgba(64, 24, 6, .72);
    font-size: 18px;
    line-height: 1.25;
}

.where-buy-exact .where-buy-item time {
    position: relative;
    padding-left: 30px;
    white-space: nowrap;
}

.where-buy-exact .where-buy-item time::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    width: 18px;
    height: 18px;
    margin-top: -9px;
    background: rgba(64, 24, 6, .52);
    border-radius: 50%;
}

.where-buy-exact .where-buy-item time::after {
    content: "";
    position: absolute;
    left: 8px;
    top: 50%;
    width: 6px;
    height: 7px;
    margin-top: -7px;
    border-left: 2px solid var(--color-background);
    border-bottom: 2px solid var(--color-background);
}

.where-buy-exact .where-buy-logos {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 10px;
    margin-top: 150px;
}

.where-buy-exact .retail-logo {
    min-height: 295px;
    padding: 45px;
    border-radius: 18px;
    background: #f3dfae;
}

.where-buy-exact .retail-logo img {
    width: 100%;
    height: auto;
    max-width: 210px;
    max-height: 110px;
    object-fit: contain;
}

.where-buy-more {
    display: flex;
    width: 100%;
    min-height: 70px;
    margin-top: 20px;
    align-items: center;
    justify-content: center;
    color: var(--color-secondary);
    background: transparent;
    border: 1px solid rgba(64, 24, 6, .12);
    border-radius: 999px;
    font-size: 13px;
    font-weight: 900;
    line-height: 1;
    text-transform: uppercase;
}

@media (max-width: 1199px) {
    .where-buy-hero h1 {
        font-size: 86px;
    }

    .where-buy-exact .where-buy-logos {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        margin-top: 90px;
    }
}

@media (max-width: 767px) {
    .where-buy-exact .site-container {
        width: calc(100% - 24px);
    }

    .where-buy-hero {
        padding-top: 132px;
    }

    .where-buy-breadcrumbs {
        margin-bottom: 30px;
        font-size: 9px;
    }

    .where-buy-hero h1 {
        font-size: 48px;
        line-height: .95;
    }

    .where-buy-content {
        padding: 45px 0 80px;
    }

    .where-buy-panel {
        min-height: 0;
        padding: 20px;
        border-radius: 12px;
    }

    .where-buy-panel__top {
        display: grid;
        gap: 20px;
        margin-bottom: 24px;
    }

    .where-buy-panel h2 {
        margin-bottom: 18px;
        font-size: 22px;
    }

    .where-buy-city {
        min-width: 0;
        width: 100%;
        min-height: 48px;
        padding: 0 18px;
        font-size: 11px;
    }

    .where-buy-city span {
        width: 13px;
        height: 13px;
        flex-basis: 13px;
        border-width: 2px;
    }

    .where-buy-city span::after {
        top: 3px;
        left: 3px;
        width: 3px;
        height: 3px;
    }

    .where-buy-view-switch {
        width: 100%;
        min-height: 48px;
        align-self: stretch;
    }

    .where-buy-view-switch button {
        flex: 1;
        min-width: 0;
        padding: 0 15px;
        font-size: 11px;
    }

    .where-buy-exact .where-buy-list {
        max-height: none;
        padding-right: 0;
    }

    .where-buy-exact .where-buy-list::after {
        display: none;
    }

    .where-buy-exact .where-buy-item {
        min-height: 82px;
        align-items: flex-start;
        padding: 18px 0;
        gap: 15px;
    }

    .where-buy-exact .where-buy-item strong {
        font-size: 15px;
    }

    .where-buy-exact .where-buy-item span,
    .where-buy-exact .where-buy-item time {
        font-size: 12px;
    }

    .where-buy-exact .where-buy-item time {
        padding-left: 20px;
    }

    .where-buy-exact .where-buy-item time::before {
        width: 13px;
        height: 13px;
        margin-top: -7px;
    }

    .where-buy-exact .where-buy-item time::after {
        left: 6px;
        width: 4px;
        height: 5px;
        margin-top: -5px;
        border-width: 1px;
    }

    .where-buy-exact .where-buy-logos {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 5px;
        margin-top: 55px;
    }

    .where-buy-exact .retail-logo {
        min-height: 120px;
        padding: 25px;
        border-radius: 10px;
    }

    .where-buy-exact .retail-logo img {
        max-width: 120px;
        max-height: 58px;
    }

    .where-buy-more {
        min-height: 46px;
        margin-top: 10px;
        font-size: 10px;
    }
}

/* Страница Партнерам — версия по макету */

.partners-exact {
    color: var(--color-secondary);
    background:
        linear-gradient(180deg, rgba(255, 244, 207, .94), rgba(255, 244, 207, .98)),
        url("../images/home/texture.jpg") center top / 720px auto repeat;
}

.partners-hero {
    padding: 155px 0 0;
    overflow: hidden;
}

.partners-breadcrumbs {
    margin-bottom: 55px;
    font-size: 15px;
}

.partners-hero h1 {
    max-width: 1040px;
    margin: 0 0 100px;
    color: var(--color-secondary);
    font-family: "Roboto Flex", Arial, sans-serif;
    font-size: 116px;
    font-weight: 700;
    line-height: .94;
    letter-spacing: -.055em;
    text-transform: uppercase;
}

.partners-hero__scene {
    min-height: 820px;
    padding-top: 0;
    background: url("../images/home/partner-scene.png") center bottom / 100% auto no-repeat;
}

.partners-request {
    position: relative;
    z-index: 2;
    width: 885px;
    max-width: 100%;
    min-height: 690px;
    padding: 63px 58px 58px;
    color: #fff;
    background: var(--color-primary);
    border-radius: 24px;
}

.partners-request h2 {
    max-width: 740px;
    margin: 0 0 30px;
    color: #fff;
    font-family: "Roboto Flex", Arial, sans-serif;
    font-size: 46px;
    font-weight: 700;
    line-height: 1.08;
    letter-spacing: -.045em;
    text-transform: uppercase;
}

.partners-request > p {
    max-width: 700px;
    margin: 0 0 50px;
    color: rgba(255, 255, 255, .72);
    font-size: 20px;
    line-height: 1.35;
}

.partners-request__fields {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.partners-request input[type="text"],
.partners-request input[type="tel"],
.partners-request textarea {
    width: 100%;
    min-height: 66px;
    padding: 0 28px;
    color: #fff;
    background: rgba(255, 255, 255, .08);
    border: 2px solid rgba(255, 255, 255, .45);
    border-radius: 999px;
    font-size: 15px;
    font-weight: 700;
    outline: 0;
}

.partners-request textarea {
    grid-column: 1 / -1;
    min-height: 138px;
    padding-top: 24px;
    border-radius: 30px;
    resize: vertical;
}

.partners-request input::placeholder,
.partners-request textarea::placeholder {
    color: rgba(255, 255, 255, .78);
}

.partners-request__bottom {
    display: flex;
    align-items: center;
    gap: 30px;
    margin-top: 30px;
}

.partners-request__bottom button {
    display: inline-flex;
    min-width: 222px;
    min-height: 66px;
    align-items: center;
    justify-content: center;
    color: var(--color-secondary);
    background: #fff;
    border: 0;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 900;
    text-transform: uppercase;
}

.partners-request__bottom label {
    display: flex;
    align-items: center;
    gap: 14px;
    margin: 0;
    color: rgba(255, 255, 255, .72);
    font-size: 15px;
    line-height: 1.3;
}

.partners-request__bottom input[type="checkbox"] {
    width: 22px;
    height: 22px;
    flex: 0 0 22px;
    accent-color: #fff;
}

.partners-request__bottom a {
    color: #fff;
    text-decoration: underline;
}

.partners-info {
    padding: 150px 0;
}

.partners-info h2 {
    max-width: 1080px;
    margin: 0;
    color: var(--color-secondary);
    font-family: "Roboto Flex", Arial, sans-serif;
    font-size: 82px;
    font-weight: 700;
    line-height: .96;
    letter-spacing: -.05em;
    text-transform: uppercase;
}

.partners-info > .site-container > p {
    max-width: 930px;
    margin: 42px 0 85px;
    color: rgba(64, 24, 6, .62);
    font-size: 20px;
    line-height: 1.35;
}

.partners-benefits {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.partners-benefits article {
    display: flex;
    min-height: 390px;
    padding: 42px 40px 24px;
    overflow: hidden;
    flex-direction: column;
    justify-content: space-between;
    background:
        linear-gradient(180deg, rgba(243, 223, 174, .86), rgba(243, 223, 174, .94)),
        url("../images/home/texture.jpg") center / 520px auto repeat;
    border-radius: 18px;
}

.partners-benefits h3 {
    max-width: 430px;
    margin: 0 0 24px;
    color: var(--color-secondary);
    font-family: "Roboto Flex", Arial, sans-serif;
    font-size: 35px;
    font-weight: 700;
    line-height: 1.02;
    letter-spacing: -.04em;
    text-transform: uppercase;
}

.partners-benefits p {
    max-width: 400px;
    margin: 0;
    color: rgba(64, 24, 6, .56);
    font-size: 18px;
    line-height: 1.35;
}

.partners-benefits img {
    align-self: flex-end;
    width: auto;
    max-width: 270px;
    max-height: 165px;
    object-fit: contain;
}

@media (max-width: 1199px) {
    .partners-hero h1 {
        font-size: 78px;
    }

    .partners-info h2 {
        font-size: 64px;
    }

    .partners-request {
        width: 760px;
    }

    .partners-benefits h3 {
        font-size: 28px;
    }
}

@media (max-width: 767px) {
    .partners-exact .site-container {
        width: calc(100% - 24px);
    }

    .partners-hero {
        padding-top: 132px;
    }

    .partners-breadcrumbs {
        margin-bottom: 28px;
        font-size: 9px;
    }

    .partners-hero h1 {
        max-width: 330px;
        margin-bottom: 46px;
        font-size: 46px;
        line-height: .96;
    }

    .partners-hero__scene {
        min-height: 650px;
        padding-bottom: 170px;
        background-size: auto 430px;
        background-position: center bottom;
    }

    .partners-request {
        min-height: 0;
        padding: 24px 20px 22px;
        border-radius: 14px;
    }

    .partners-request h2 {
        margin-bottom: 18px;
        font-size: 25px;
    }

    .partners-request > p {
        margin-bottom: 26px;
        font-size: 12px;
    }

    .partners-request__fields {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .partners-request input[type="text"],
    .partners-request input[type="tel"],
    .partners-request textarea {
        min-height: 46px;
        padding: 0 18px;
        border-width: 1px;
        font-size: 11px;
    }

    .partners-request textarea {
        min-height: 90px;
        padding-top: 16px;
        border-radius: 18px;
    }

    .partners-request__bottom {
        display: grid;
        gap: 16px;
        margin-top: 18px;
    }

    .partners-request__bottom button {
        min-width: 0;
        min-height: 48px;
        font-size: 10px;
    }

    .partners-request__bottom label {
        align-items: flex-start;
        font-size: 10px;
    }

    .partners-request__bottom input[type="checkbox"] {
        width: 16px;
        height: 16px;
        flex-basis: 16px;
    }

    .partners-info {
        padding: 80px 0;
    }

    .partners-info h2 {
        font-size: 36px;
    }

    .partners-info > .site-container > p {
        margin: 24px 0 40px;
        font-size: 12px;
    }

    .partners-benefits {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .partners-benefits article {
        min-height: 235px;
        padding: 22px 20px 14px;
        border-radius: 12px;
    }

    .partners-benefits h3 {
        max-width: 260px;
        margin-bottom: 14px;
        font-size: 22px;
    }

    .partners-benefits p {
        max-width: 260px;
        font-size: 12px;
    }

    .partners-benefits img {
        max-width: 185px;
        max-height: 105px;
    }
}

/* Страница Контакты — версия по макету */

.contacts-exact {
    color: var(--color-secondary);
    background:
        linear-gradient(180deg, rgba(255, 244, 207, .94), rgba(255, 244, 207, .98)),
        url("../images/home/texture.jpg") center top / 720px auto repeat;
}

.contacts-hero {
    padding: 155px 0 150px;
}

.contacts-breadcrumbs {
    margin-bottom: 55px;
    font-size: 15px;
}

.contacts-hero__grid {
    display: grid;
    grid-template-columns: minmax(0, 760px) minmax(0, 900px);
    gap: 100px;
    align-items: start;
}

.contacts-hero h1 {
    margin: 0 0 120px;
    color: var(--color-secondary);
    font-family: "Roboto Flex", Arial, sans-serif;
    font-size: 112px;
    font-weight: 700;
    line-height: .94;
    letter-spacing: -.055em;
    text-transform: uppercase;
}

.contacts-phone {
    display: inline-block;
    margin-bottom: 32px;
    color: var(--color-secondary);
    font-family: "Roboto Flex", Arial, sans-serif;
    font-size: 52px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: -.045em;
    text-decoration: none;
}

.contacts-hero__content p {
    max-width: 540px;
    margin: 0 0 70px;
    color: var(--color-secondary);
    font-size: 30px;
    font-weight: 700;
    line-height: 1.12;
}

.contacts-button {
    display: inline-flex;
    min-width: 230px;
    min-height: 70px;
    align-items: center;
    justify-content: center;
    color: #fff;
    background: var(--color-primary);
    border-radius: 999px;
    font-size: 14px;
    font-weight: 900;
    text-decoration: none;
    text-transform: uppercase;
}

.contacts-map {
    overflow: hidden;
    border-radius: 18px;
}

.contacts-map img {
    display: block;
    width: 100%;
    height: auto;
}

.contacts-question {
    overflow: hidden;
    color: #fff;
    background:
        linear-gradient(rgba(196, 0, 0, .96), rgba(196, 0, 0, .96)),
        repeating-linear-gradient(90deg, rgba(255,255,255,.07) 0 120px, transparent 120px 240px),
        repeating-linear-gradient(0deg, rgba(255,255,255,.06) 0 120px, transparent 120px 240px),
        var(--color-primary);
}

.contacts-question__grid {
    display: grid;
    position: relative;
    min-height: 660px;
    grid-template-columns: minmax(0, 560px) minmax(0, 420px) minmax(0, 620px);
    gap: 55px;
    align-items: center;
}

.contacts-question__text h2 {
    margin: 0 0 42px;
    color: #fff;
    font-family: "Roboto Flex", Arial, sans-serif;
    font-size: 74px;
    font-weight: 700;
    line-height: .98;
    letter-spacing: -.05em;
    text-transform: uppercase;
}

.contacts-question__text p {
    max-width: 500px;
    margin: 0;
    color: rgba(255, 255, 255, .72);
    font-size: 20px;
    line-height: 1.35;
}

.contacts-question__operator {
    align-self: end;
    width: 100%;
    max-width: 480px;
}

.contacts-form {
    position: relative;
    z-index: 2;
}

.contacts-form__fields {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.contacts-form input[type="text"],
.contacts-form input[type="tel"],
.contacts-form textarea {
    width: 100%;
    min-height: 66px;
    padding: 0 28px;
    color: #fff;
    background: rgba(255, 255, 255, .08);
    border: 2px solid rgba(255, 255, 255, .45);
    border-radius: 999px;
    font-size: 15px;
    font-weight: 700;
    outline: 0;
}

.contacts-form textarea {
    grid-column: 1 / -1;
    min-height: 138px;
    padding-top: 24px;
    border-radius: 28px;
    resize: vertical;
}

.contacts-form input::placeholder,
.contacts-form textarea::placeholder {
    color: rgba(255, 255, 255, .78);
}

.contacts-form__bottom {
    display: flex;
    align-items: center;
    gap: 30px;
    margin-top: 30px;
}

.contacts-form__bottom button {
    display: inline-flex;
    min-width: 235px;
    min-height: 66px;
    align-items: center;
    justify-content: center;
    color: var(--color-secondary);
    background: #fff;
    border: 0;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 900;
    text-transform: uppercase;
}

.contacts-form__bottom label {
    display: flex;
    align-items: center;
    gap: 14px;
    margin: 0;
    color: rgba(255, 255, 255, .72);
    font-size: 15px;
    line-height: 1.3;
}

.contacts-form__bottom input[type="checkbox"] {
    width: 22px;
    height: 22px;
    flex: 0 0 22px;
    accent-color: #fff;
}

.contacts-form__bottom a {
    color: #fff;
    text-decoration: underline;
}

.contacts-requisites {
    padding: 150px 0;
}

.contacts-requisites h2 {
    margin: 0 0 100px;
    color: var(--color-secondary);
    font-family: "Roboto Flex", Arial, sans-serif;
    font-size: 82px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: -.05em;
    text-transform: uppercase;
}

.contacts-requisites__grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    column-gap: 95px;
    row-gap: 68px;
}

.contacts-requisites__grid article {
    display: grid;
    gap: 14px;
}

.contacts-requisites__grid span {
    color: rgba(64, 24, 6, .45);
    font-size: 16px;
    font-weight: 800;
    line-height: 1.2;
}

.contacts-requisites__grid strong {
    color: var(--color-secondary);
    font-size: 22px;
    font-weight: 900;
    line-height: 1.25;
}

@media (max-width: 1199px) {
    .contacts-hero__grid {
        grid-template-columns: 1fr;
        gap: 60px;
    }

    .contacts-hero h1 {
        font-size: 82px;
        margin-bottom: 70px;
    }

    .contacts-question__grid {
        grid-template-columns: minmax(0, 1fr) minmax(0, 360px);
        gap: 40px;
        padding: 70px 0;
    }

    .contacts-question__operator {
        display: none;
    }

    .contacts-requisites__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767px) {
    .contacts-exact .site-container {
        width: calc(100% - 24px);
    }

    .contacts-hero {
        padding: 132px 0 80px;
    }

    .contacts-breadcrumbs {
        margin-bottom: 28px;
        font-size: 9px;
    }

    .contacts-hero__grid {
        gap: 40px;
    }

    .contacts-hero h1 {
        margin-bottom: 42px;
        font-size: 48px;
    }

    .contacts-phone {
        margin-bottom: 20px;
        font-size: 28px;
    }

    .contacts-hero__content p {
        margin-bottom: 32px;
        font-size: 18px;
    }

    .contacts-button {
        min-width: 190px;
        min-height: 50px;
        font-size: 11px;
    }

    .contacts-map {
        border-radius: 10px;
    }

    .contacts-question__grid {
        display: grid;
        min-height: 0;
        grid-template-columns: 1fr;
        gap: 28px;
        padding: 55px 0;
    }

    .contacts-question__text h2 {
        margin-bottom: 22px;
        font-size: 40px;
    }

    .contacts-question__text p {
        font-size: 12px;
    }

    .contacts-question__operator {
        display: block;
        width: 240px;
        margin: -10px auto -20px;
    }

    .contacts-form__fields {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .contacts-form input[type="text"],
    .contacts-form input[type="tel"],
    .contacts-form textarea {
        min-height: 46px;
        padding: 0 18px;
        border-width: 1px;
        font-size: 11px;
    }

    .contacts-form textarea {
        min-height: 90px;
        padding-top: 16px;
        border-radius: 18px;
    }

    .contacts-form__bottom {
        display: grid;
        gap: 16px;
        margin-top: 18px;
    }

    .contacts-form__bottom button {
        min-width: 0;
        min-height: 48px;
        font-size: 10px;
    }

    .contacts-form__bottom label {
        align-items: flex-start;
        font-size: 10px;
    }

    .contacts-form__bottom input[type="checkbox"] {
        width: 16px;
        height: 16px;
        flex-basis: 16px;
    }

    .contacts-requisites {
        padding: 80px 0;
    }

    .contacts-requisites h2 {
        margin-bottom: 42px;
        font-size: 40px;
    }

    .contacts-requisites__grid {
        grid-template-columns: 1fr;
        gap: 28px;
    }

    .contacts-requisites__grid span {
        font-size: 12px;
    }

    .contacts-requisites__grid strong {
        font-size: 17px;
    }
}

/* Страница 404 — версия по макету */

.not-found-exact {
    color: var(--color-secondary);
    background:
        linear-gradient(180deg, rgba(255, 244, 207, .94), rgba(255, 244, 207, .98)),
        url("../images/home/texture.jpg") center top / 720px auto repeat;
}

.not-found-section {
    min-height: 1040px;
    padding: 155px 0 150px;
}

.not-found-breadcrumbs {
    margin-bottom: 60px;
    font-size: 15px;
}

.not-found-grid {
    display: grid;
    grid-template-columns: minmax(0, 850px) minmax(0, 780px);
    gap: 140px;
    align-items: center;
}

.not-found-content h1 {
    margin: 0 0 48px;
    color: var(--color-secondary);
    font-family: "Roboto Flex", Arial, sans-serif;
    font-size: 112px;
    font-weight: 700;
    line-height: .94;
    letter-spacing: -.055em;
    text-transform: uppercase;
}

.not-found-content h1 span {
    color: rgba(64, 24, 6, .55);
}

.not-found-content p {
    max-width: 710px;
    margin: 0 0 100px;
    color: rgba(64, 24, 6, .62);
    font-size: 24px;
    line-height: 1.35;
}

.not-found-content > a {
    display: inline-flex;
    min-width: 355px;
    min-height: 70px;
    align-items: center;
    justify-content: center;
    color: #fff;
    background: var(--color-primary);
    border-radius: 999px;
    font-size: 15px;
    font-weight: 900;
    line-height: 1;
    text-decoration: none;
    text-transform: uppercase;
}

.not-found-visual {
    position: relative;
    min-height: 560px;
    text-align: center;
}

.not-found-visual strong {
    display: block;
    color: #e33a11;
    font-family: "Roboto Flex", Arial, sans-serif;
    font-size: 300px;
    font-weight: 900;
    line-height: .85;
    letter-spacing: -.06em;
    text-shadow:
        0 1px 0 rgba(255, 255, 255, .22),
        0 0 1px rgba(64, 24, 6, .2);
    transform: rotate(-2deg);
}

.not-found-visual span {
    display: inline-block;
    margin-top: 15px;
    color: rgba(93, 122, 122, .72);
    font-family: "Roboto Flex", Arial, sans-serif;
    font-size: 86px;
    font-style: italic;
    font-weight: 700;
    line-height: .9;
    letter-spacing: -.04em;
    transform: rotate(-7deg);
}

.not-found-visual i {
    display: block;
    width: 450px;
    height: 24px;
    margin: 28px auto 0;
    background: rgba(226, 91, 42, .28);
    border-radius: 50%;
    transform: rotate(-8deg);
}

@media (max-width: 1199px) {
    .not-found-grid {
        grid-template-columns: 1fr;
        gap: 60px;
    }

    .not-found-content h1 {
        font-size: 82px;
    }

    .not-found-content p {
        margin-bottom: 60px;
    }

    .not-found-visual {
        min-height: 390px;
    }

    .not-found-visual strong {
        font-size: 220px;
    }
}

@media (max-width: 767px) {
    .not-found-exact .site-container {
        width: calc(100% - 24px);
    }

    .not-found-section {
        min-height: 0;
        padding: 132px 0 80px;
    }

    .not-found-breadcrumbs {
        margin-bottom: 30px;
        font-size: 9px;
    }

    .not-found-grid {
        gap: 44px;
    }

    .not-found-content h1 {
        margin-bottom: 28px;
        font-size: 46px;
    }

    .not-found-content p {
        margin-bottom: 36px;
        font-size: 13px;
    }

    .not-found-content > a {
        min-width: 0;
        width: 100%;
        min-height: 52px;
        font-size: 11px;
    }

    .not-found-visual {
        min-height: 245px;
    }

    .not-found-visual strong {
        font-size: 135px;
    }

    .not-found-visual span {
        margin-top: 10px;
        font-size: 42px;
    }

    .not-found-visual i {
        width: 220px;
        height: 14px;
        margin-top: 16px;
    }
}