/* ==========================================================================
   ТАЙГА — Главная_01. Reset
   ========================================================================== */
*,
*::before,
*::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

/* Заголовки — для поисковиков и экранных дикторов, вид задаёт класс блока.
   Без этого h1 из браузера пришёл бы жирным и в 2em там, где класс не
   задаёт размер или насыщенность сам. */
h1 {
  font-size: inherit;
  font-weight: inherit;
}

/* Пункты-заглушки (раздела ещё нет: «Личный кабинет», «СМИ и события»,
   «Все новости») — <a> без href, чтобы поисковик не видел ссылок на «#».
   Курсор как у обычной ссылки, чтобы вид не отличался от макета. */
a:not([href]) {
  cursor: pointer;
}

/* Утилита переключения вариантов блоков (напр. ?catalog=2) — !important
   намеренно: класс должен побеждать независимо от специфичности/порядка
   правил конкретного варианта (ср. грабли с [hidden] в CLAUDE.md). */
.is-hidden {
  display: none !important;
}

/* Статус отправки для ЛЮБОЙ формы с data-lead-form (см. static/js/forms.js) —
   без привязки к конкретному блоку, чтобы новую форму не пришлось заводить
   с копией этих трёх правил под свой BEM-префикс. Разметка/отступы вокруг
   [data-lead-status] — забота конкретного блока, здесь только цвет. */
.lead-status {
  font-family: 'DINPro Regular', 'Inter', Arial, sans-serif;
  font-size: 14px;
}

.lead-status--ok {
  color: #516B43;
}

.lead-status--error {
  color: #E2480A;
}

html {
  height: 100%;
}

body {
  min-height: 100%;
  font-family: 'DINPro Regular', 'Inter', Arial, sans-serif;
  background: #fff;
  color: #000;
}

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

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

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

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

.container {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
}

/* Заголовок секции 70px — повторяется у Каталога, "Тайга — продукция
   чемпионов", "География наших проектов" и т.д. Общий класс, а не
   копипаста в каждый блок. */
.section-title {
  font-family: 'DINPro Cond Regular', 'Inter', Arial, sans-serif;
  font-weight: 400;
  font-size: 70px;
  line-height: 1.1;
  text-transform: uppercase;
  color: #000;
  text-box-trim: trim-both;
  text-box-edge: cap alphabetic;
}

/* Без этого браузер перехватывает mousedown на <img> внутри
   [data-drag-scroll] в нативный drag-and-drop картинки вместо нашего
   JS-скролла — курсор превращается в "запрещено" и лента не тянется. */
[data-drag-scroll] img {
  -webkit-user-drag: none;
  user-select: none;
}

/* ==========================================================================
   Header — Frame 42529782 (Figma node 3634:1608)
   ========================================================================== */
.header {
  position: sticky;
  top: 0;
  z-index: 100;
  background: #fff;
  padding-bottom: 20px; /* Figma: pb-[20px] на общей обёртке */
}

/* --- Top bar (Figma: 3508:3067, bg #516B43, h=43) --- */
.header__topbar {
  background: #516B43;
  height: 43px;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: 10px 20px 12px; /* Figma: pt-10 pb-12, px адаптирован под container */
}

.header__topbar-inner {
  width: 100%;
  max-width: 1200px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.header__topbar-link {
  display: flex;
  align-items: center;
  gap: 8px;
}

.header__persona-menu {
  position: relative;
}

.header__persona-menu > summary {
  cursor: pointer;
  list-style: none;
}

.header__persona-menu > summary::-webkit-details-marker {
  display: none;
}

.header__persona-options {
  position: absolute;
  z-index: 1;
  top: calc(100% + 12px);
  left: -19px;
  display: flex;
  flex-direction: column;
  gap: 11px;
  width: auto;
  padding: 15px 20px;
  background: #516B43;
}

.header__persona-options a {
  color: #fff;
  font-family: 'DINPro Regular', 'Inter', Arial, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 14px;
  white-space: nowrap;
}

.header__topbar-contacts {
  display: flex;
  align-items: center;
  gap: 59px;
}

.header__topbar-actions {
  display: flex;
  align-items: center;
  gap: 32px;
}

.header__topbar-text,
.header__topbar-link {
  font-family: 'DINPro Regular', 'Inter', Arial, sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: normal;
  color: #fff;
  white-space: nowrap;
}

.header__topbar-chevron {
  width: 8px;
  height: 4px;
}

.header__socials {
  display: flex;
  align-items: center;
  gap: 8px;
  line-height: 0;
}

.header__social-icon {
  width: 17px;
  height: 17px;
}

.header__action-link {
  display: flex;
  align-items: center;
  gap: 8px;
}

.header__account-link {
  display: none;
}

.header__action-link span {
  font-family: 'DINPro Regular', 'Inter', Arial, sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: normal;
  color: #fff;
  white-space: nowrap;
  text-decoration: underline;
  text-underline-position: from-font;
}

.header__action-icon--user {
  width: 20px;
  height: 20px;
}

.header__action-icon--cart {
  width: 23.336px;
  height: 20px;
}

/* Сердечко «Избранное» — та же иконка, что на карточках, белая, в высоту корзины */
.header__action-icon--favorite {
  width: 21.25px;
  height: 20px;
}

/* --- Navbar (Figma: 3508:3094, w=1200) --- */
.header__navbar {
  padding-top: 24px; /* Figma: gap-[24px] между topbar и navbar */
  display: flex;
  justify-content: center;
}

.header__navbar-inner {
  width: 100%;
  max-width: 1200px;
  display: flex;
  align-items: flex-start; /* Figma: items-start — логотип не центрируется по высоте меню */
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 24px;
}

.header__logo {
  display: block;
  width: 107px;
  height: 35px;
}

.header__logo img {
  width: 100%;
  height: 100%;
}

.header__menu {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 56px;
  height: 50px;
}

.header__menu-item,
.header__catalog-btn,
.header__cta-btn {
  font-family: 'DINPro Cond Medium', 'Inter', Arial, sans-serif;
  font-weight: 500;
  font-size: 18px;
  line-height: 50px;
  letter-spacing: 0.9px;
  text-transform: uppercase;
  white-space: nowrap;
  color: #000;
}

.header__menu-item {
  display: flex;
  align-items: center;
  gap: 8px;
}

.header__menu-chevron {
  width: 12px;
  height: 20px;
}

.header__catalog-btn {
  display: flex;
  align-items: center;
  gap: 8px;
  height: 50px;
  padding: 0 24px;
  border: 1px solid #E2480A;
  color: #E2480A;
}

.header__catalog-arrow {
  width: 11px;
  height: 11px;
}

/* Подменю пунктов из MenuItem (apps/core/templates/core/_menu_item.html) —
   произвольная глубина, но реально сегодня 1 уровень. header__menu-item-wrap
   даёт якорь для position:absolute — без него .header__submenu был бы просто
   ещё одним flex-элементом в .header__menu и распирал бы навбар вбок. */
.header__menu-item-wrap {
  position: relative;
}

.header__submenu {
  display: none;
  position: absolute;
  top: 100%; /* впритык к ссылке, без зазора — иначе курсор по пути вниз */
  left: 0;   /* оказывается вне обоих элементов, и :hover успевает погаснуть */
  z-index: 20;
  padding: 8px 0;
  min-width: 220px;
  background: #fff;
  box-shadow: 0 0 25px rgba(0, 0, 0, 0.1); /* как .map-widget/.awards__card — свой стиль сайта, не бордер */
  list-style: none;
}

.header__menu-item-wrap:hover > .header__submenu,
.header__menu-item-wrap:focus-within > .header__submenu {
  display: block;
}

.header__submenu li {
  display: block;
}

/* Внутри подменю пункт — тот же .header__menu-item (шрифт/цвет наследуются),
   но не строкой высотой 50px в общем ряду, а обычным блоком со своим отступом. */
.header__submenu .header__menu-item {
  height: auto;
  line-height: 1.4;
  padding: 8px 16px;
  white-space: normal;
}

.header__cta-btn {
  display: flex;
  align-items: center;
  height: 50px;
  padding: 0 46px;
  background: #E2480A;
  color: #fff;
}

/* ==========================================================================
   Hero — Frame 42529786 (Figma node 3432:1591)
   ========================================================================== */
.hero {
  position: relative;
  overflow: hidden;
  height: 623.47px;
  margin-top: 4.23px; /* Figma: зазор между шапкой (h=137) и hero (y=141.23) */
  display: flex;
  align-items: center;
  justify-content: center;
}

.hero__bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
}

.hero__scrim {
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 47.596%, rgba(0, 0, 0, 0.5) 100%);
}

.hero__container {
  position: relative;
  z-index: 2;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 30px 10px;
}

.hero__row {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  gap: 10px;
  flex-wrap: wrap;
  max-width: 100%;
}

.hero__intro {
  width: 867px;
  max-width: 100%;
  display: flex;
  flex-direction: column;
  gap: 32px;
  color: #fff;
  text-transform: uppercase;
}

.hero__h1 {
  display: contents;
}

.hero__title {
  display: block;
  font-family: 'DINPro Cond Medium', 'Inter', Arial, sans-serif;
  font-weight: 500;
  font-size: 70px;
  text-box-trim: trim-both;
  text-box-edge: cap alphabetic;
}

.hero__title-line {
  display: block;
  line-height: 1.1;
}

.hero__subtitle {
  display: block;
  font-family: 'DINPro Cond Regular', 'Inter', Arial, sans-serif;
  font-weight: 400;
  font-size: 30px;
  line-height: 0.7;
}

.hero__portal {
  width: 322.7px;
  max-width: 100%;
  display: flex;
  flex-direction: column;
}

.hero__portal-card {
  background: #FBF8F4;
  padding: 40px;
  display: flex;
  flex-direction: column;
  gap: 40px;
}

.hero__portal-title {
  font-family: 'DINPro Cond Regular', 'Inter', Arial, sans-serif;
  font-weight: 400;
  font-size: 30px;
  line-height: 1.04; /* Figma: absoluteBoundingBox h=62.47px на 2 строки (31.24px/строка) */
  color: #516B43;
  text-transform: uppercase;
}

.hero__portal-links {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.hero__portal-link {
  display: flex;
  align-items: center;
  gap: 8px;
  font-family: 'DINPro Regular', 'Inter', Arial, sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: normal;
  color: #000;
  white-space: nowrap;
}

.hero__portal-arrow {
  width: 11px;
  height: 11px;
}

.hero__cta-card {
  position: relative;
  overflow: hidden;
  height: 185px;
  padding: 40px 35px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;
  background: #516B43;
}

.hero__cta-pattern {
  position: absolute;
  z-index: 0;
  opacity: 0.5;
  width: 465.53%;
  height: 287.57%;
  left: -352.34%;
  top: -187.41%;
  max-width: none;
}

.hero__cta-link {
  position: relative;
  z-index: 1;
  font-family: 'DINPro Cond Regular', 'Inter', Arial, sans-serif;
  font-weight: 400;
  font-size: 30px;
  line-height: normal;
  color: #fff;
  text-transform: uppercase;
  text-decoration: underline;
  text-underline-position: from-font;
  text-align: center;
}

.hero__manager {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  gap: 16px;
}

.hero__manager-avatar {
  width: 50px;
  height: 50px;
  border-radius: 50%;
}

.hero__manager-info {
  display: flex;
  flex-direction: column;
  gap: 24px; /* Figma: gap-[24px] c leading-[0] на строках */
  font-family: 'DINPro Regular', 'Inter', Arial, sans-serif;
  font-weight: 400;
  font-size: 16px;
  color: #fff;
}

.hero__manager-info p {
  line-height: 0;
}

/* ==========================================================================
   Stats — Frame 42530103 (Figma node 3474:2136)
   ========================================================================== */
.stats {
  padding-top: 30px;
}

.stats__row {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.stats__col {
  flex: 1 0 294px;
}

.stats__col--split {
  display: flex;
  flex-direction: column;
  gap: 8px;
  height: 420px;
}

.stats__card {
  flex: 1;
  background: #FBF8F4;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px;
}

.stats__card--big {
  height: 420px;
  background: #FBF8F4;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px;
}

.stats__card--team,
.stats__card--projects {
  align-items: flex-start;
  padding-top: 50px;
}

.stats__card-inner {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
}

.stats__card-inner--w150 { width: 150px; }
.stats__card-inner--w153 { width: 153px; }
.stats__card-inner--w219 { width: 219px; }
.stats__card-inner--w201 { width: 201px; }

.stats__number-row {
  display: flex;
  align-items: flex-end;
  gap: 8px;
  width: 100%;
}

.stats__number,
.stats__suffix,
.stats__label {
  font-family: 'DINPro Cond Regular', 'Inter', Arial, sans-serif;
  font-weight: 400;
  color: #516B43;
  text-transform: uppercase;
  text-box-trim: trim-both;
  text-box-edge: cap alphabetic;
  line-height: normal;
  white-space: nowrap;
}

.stats__number {
  font-size: 80px;
}

.stats__number--big {
  font-size: 120px;
  width: 100%;
}

.stats__suffix {
  font-size: 30px;
}

.stats__label {
  font-size: 30px;
  white-space: normal;
}

.stats__label--pl5 { padding-left: 5px; }
.stats__label--pl10 { padding-left: 10px; }
.stats__label--pl15 { padding-left: 15px; }

.stats__label--tworows {
  line-height: 0;
}

.stats__label--tworows p {
  line-height: normal;
}

/* ==========================================================================
   Portfolio slider — Frame 42530102 (Figma node 3474:2135)
   ========================================================================== */
.container--wide {
  width: 100%;
  max-width: 1210px;
  margin: 0 auto;
}

.portfolio {
  margin-top: 160px; /* Figma: зазор между stats (низ y=1214) и этим блоком (верх y=1374) */
}

.portfolio-inner {
  display: flex;
  flex-direction: column;
  gap: 56px;
}

/* Заголовок блока — Figma taiga_brand-components node 5010:33993,
   тот же вид, что .arch-cases__head-row на персона-страницах */
.portfolio__head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
}

.portfolio__title-accent {
  color: #E2480A;
}

.portfolio__all {
  display: flex;
  align-items: center;
  gap: 8px;
  font-family: 'DINPro Medium', 'Inter', Arial, sans-serif;
  font-size: 18px;
  color: #E2480A;
  text-transform: uppercase;
  flex-shrink: 0;
}

.portfolio__all-arrow {
  width: 11px;
  height: 11px;
}

.portfolio-slider {
  position: relative;
}

.portfolio-slider__viewport {
  overflow-x: hidden;
  overflow-y: visible; /* line-height:0.7 у заголовка выступает на пару px за свой line-box — hidden тут срезал верх букв */
  width: 100%;
}

.portfolio-slider__track {
  display: flex;
  transition: transform 0.5s ease;
}

.portfolio-slider__track.no-transition {
  transition: none;
}

.portfolio-slide {
  display: flex;
  flex: 0 0 100%;
  width: 100%;
  gap: 32px;
  align-items: center;
}

.portfolio-slide__photo {
  position: relative;
  display: block;
  flex-shrink: 0;
  width: 697.78px;
  height: 499px;
  overflow: hidden;
}

.portfolio-slide__photo-img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Точки — общий (не per-slide) элемент, оверлеем поверх трека: фото
   всегда рендерится от (0,0) вьюпорта независимо от активного слайда,
   поэтому те же left/top подходят без пересчёта. */
.portfolio-slide__dots {
  position: absolute;
  left: 316px;
  top: 450px;
  z-index: 2;
  display: flex;
  align-items: center;
  gap: 10px;
}

.portfolio-slide__dots .dot {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.8);
}

.portfolio-slide__dots .dot.is-active {
  width: 11px;
  height: 11px;
  background: #fff;
}

.portfolio-slide__info {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  width: 477px;
  height: 499px;
}

.portfolio-slide__content {
  display: flex;
  flex-direction: column;
  gap: 32px;
}

.portfolio-slide__title {
  font-family: 'DINPro Cond Regular', 'Inter', Arial, sans-serif;
  font-weight: 400;
  font-size: 70px;
  line-height: 1;
  text-transform: uppercase;
  color: #000;
  text-box-trim: trim-both;
  text-box-edge: cap alphabetic;
}

.portfolio-slide__desc {
  font-family: 'DINPro Regular', 'Inter', Arial, sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 22px;
  color: #000;
  text-box-trim: trim-both;
  text-box-edge: cap alphabetic;
}

.portfolio-slide__meta {
  display: grid;
  grid-template-columns: max-content minmax(0, 1fr);
  grid-auto-rows: minmax(32px, auto);
  align-items: center;
  column-gap: 56px;
}

.portfolio-slide__meta-row {
  display: contents;
}

.portfolio-slide__meta-label,
.portfolio-slide__meta-value {
  text-box-trim: trim-both;
  text-box-edge: cap alphabetic;
}

.portfolio-slide__meta-label {
  font-family: 'DINPro Regular', 'Inter', Arial, sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 32px;
  color: rgba(0, 0, 0, 0.5);
  white-space: nowrap;
}

.portfolio-slide__meta-value {
  font-family: 'DINPro Medium', 'Inter', Arial, sans-serif;
  font-weight: 500;
  font-size: 18px;
  line-height: 32px;
  color: #000;
  overflow-wrap: anywhere;
}

.portfolio-slide__footer {
  display: flex;
  align-items: center;
  height: 50px;
}

.slide-more {
  display: flex;
  align-items: flex-end;
  gap: 8px;
}

.slide-more__text {
  font-family: 'DINPro Medium', 'Inter', Arial, sans-serif;
  font-weight: 500;
  font-size: 18px;
  line-height: 12px;
  color: #8E9B70;
  text-transform: uppercase;
  text-box-trim: trim-both;
  text-box-edge: cap alphabetic;
}

.slide-more__icon {
  width: 11px;
  height: 11px;
}

/* Стрелки — тоже общий оверлей-элемент (не едет вместе со слайдом).
   Позиция = x информационной колонки (фото+gap) + отступ блока стрелок
   внутри футера в Figma, у = низ info-колонки (высота-50). Каждый слайдер
   задаёт свои --slide-arrows-* (разные пропорции фото/gap), поэтому сам
   класс переиспользуется без хардкода под конкретный блок. */
.slide-arrows {
  position: absolute;
  left: var(--slide-arrows-left);
  top: var(--slide-arrows-top);
  width: 208px;
  height: 50px;
  z-index: 2;
  display: flex;
  align-items: center;
  gap: 8px;
}

.portfolio-slider .slide-arrows {
  --slide-arrows-left: 998.78px;
  --slide-arrows-top: 449px;
}

.champions-slider .slide-arrows {
  --slide-arrows-left: 996px;
  --slide-arrows-top: 450px;
}

.slide-arrow {
  position: relative;
  width: 100px;
  height: 50px;
  padding: 0;
  border: none;
  background: none;
  cursor: pointer;
}

/* По умолчанию — белая/контурная стрелка (как в Figma prev), при наведении
   меняется на зелёную закрашенную (как в Figma next). Для data-arrow="next"
   весь блок зеркалится по горизонтали — это разворачивает ОБЕ подложенные
   картинки разом, сохраняя цветовую пару default/hover. */
.slide-arrow__icon {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  transition: opacity 0.2s ease;
}

.slide-arrow__icon--hover {
  opacity: 0;
}

.slide-arrow:hover .slide-arrow__icon--default {
  opacity: 0;
}

.slide-arrow:hover .slide-arrow__icon--hover {
  opacity: 1;
}

.slide-arrow[data-arrow="next"] {
  transform: scaleX(-1); /* Figma: rotate(180)+scaleY(-1) на том же ассете = горизонтальное зеркало */
}

/* --- Logos strip — Frame 42530101 (Figma node 3474:2134) --- */
.logos__viewport {
  overflow-x: auto;
  overflow-y: hidden;
  cursor: grab;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

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

.logos__viewport.is-dragging {
  cursor: grabbing;
  user-select: none;
}

.logos__track {
  display: flex;
  align-items: center;
  gap: 64px;
  height: 65px;
}

.logos__item {
  display: block;
  width: auto;
  max-width: 170px;
  flex-shrink: 0;
  object-fit: contain;
}

.logos__scrollbar {
  position: relative;
  width: 100%;
  height: 3px;
  margin-top: 36px;
  overflow: hidden; /* зацикленный ползунок уходит за правый край и выходит слева (main.js) */
}

.logos__scrollbar-track {
  position: absolute;
  left: 0;
  top: 1px;
  width: 100%;
  height: 1px;
  background: #8E9B70;
  opacity: 0.5;
}

.logos__scrollbar-thumb {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 3px;
  background: #8E9B70;
  cursor: pointer;
}

/* ==========================================================================
   Каталог — Frame 42530096 (Figma node 3474:2030)
   ========================================================================== */
.catalog {
  margin-top: 160px; /* Figma: тот же интервал между секциями, что и hero→stats, stats→portfolio */
}

.catalog-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 56px;
}

.catalog__title {
  align-self: flex-start; /* .catalog-inner центрирует детей, а заголовок должен идти по левому краю грида */
}

.catalog__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-template-rows: repeat(2, 1fr);
  gap: 8px; /* Figma node 3474:2030 / 4985:9709 — карточки 294×212/432, отступ 8px */
  width: 1200px;
  height: 432px;
}

.catalog__card {
  position: relative;
  display: flex;
  align-items: flex-start;
  padding: 20px;
  overflow: hidden;
}

.catalog__card--tall {
  grid-column: 1;
  grid-row: 1 / span 2;
}

.catalog__card-img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  pointer-events: none;
  transition: transform 350ms ease;
}

@media (hover: hover) and (pointer: fine) {
  .catalog__card:hover .catalog__card-img,
  .catalog2__card:hover .catalog2__img {
    transform: scale(1.08);
  }
}

@media (prefers-reduced-motion: reduce) {
  .catalog__card-img,
  .catalog2__img {
    transition: none;
  }
}

.catalog__badge {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  height: 50px;
  padding: 10px 24px;
  background: #516B43;
}

.catalog__badge--orange {
  background: #E2480A;
}

.catalog__badge-text {
  font-family: 'DINPro Cond Medium', 'Inter', Arial, sans-serif;
  font-weight: 500;
  font-size: 18px;
  line-height: 12px;
  color: #fff;
  text-transform: uppercase;
  white-space: nowrap;
}

.catalog__badge-arrow {
  width: 11px;
  height: 11px;
}

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

.catalog__action {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  height: 50px;
  border: 1px solid rgba(81, 107, 67, 0.7);
  font-family: 'DINPro Cond Medium', 'Inter', Arial, sans-serif;
  font-weight: 500;
  font-size: 18px;
  color: #516B43;
  text-transform: uppercase;
  white-space: nowrap;
  background: none;
  cursor: pointer;
}

.catalog__action--pdf {
  padding: 0 67px;
}

.catalog__action--quote {
  width: 374px;
}

.catalog__action--custom {
  width: 372px;
  border: none;
  background: #E2480A;
  color: #fff;
}

.catalog__action-icon {
  display: block;
}

.catalog__action--pdf .catalog__action-icon { width: 24px; height: 24px; }
.catalog__action--quote .catalog__action-icon { width: 22px; height: 22px; }
.catalog__action--custom .catalog__action-icon { width: 22px; height: 22px; }

/* ==========================================================================
   Тайга — продукция чемпионов — Frame 42530095 (Figma node 3474:2017)
   ========================================================================== */
.champions {
  margin-top: 160px; /* тот же интервал между секциями, что и везде выше */
}

.champions-inner {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 56px;
}

/* .champions__title — шрифтовые свойства теперь в .section-title */

.champions__title span {
  color: #E2480A;
}

.champions-slider {
  position: relative;
  width: 100%;
}

.champions-slider__viewport {
  overflow-x: hidden;
  overflow-y: visible; /* line-height:0.7 у subtitle выступает на пару px за свой line-box — hidden тут срезал верх букв */
  width: 100%;
}

.champions-slider__track {
  display: flex;
  transition: transform 0.5s ease;
}

.champions-slider__track.no-transition {
  transition: none;
}

.champions-slide {
  display: flex;
  flex: 0 0 100%;
  width: 100%;
  align-items: flex-end;
  gap: 44px;
}

.champions-slide__photo {
  position: relative;
  flex-shrink: 0;
  width: 684px;
  height: 500px;
  overflow: hidden;
}

.champions-slide__photo-img {
  position: absolute;
  top: 0;
  left: -5.34%;
  width: 109.51%;
  height: 100%;
  max-width: none;
  object-fit: cover;
}

.champions-slide__info {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  width: 476px;
  height: 500px;
}

.champions-slide__content {
  display: flex;
  flex-direction: column;
  gap: 48px;
}

.champions-slide__heading {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
}

.champions-slide__subtitle {
  font-family: 'DINPro Cond Regular', 'Inter', Arial, sans-serif;
  font-weight: 400;
  font-size: 22px;
  line-height: 1;
  text-transform: uppercase;
  color: rgba(0, 0, 0, 0.6);
}

.champions-slide__name {
  font-family: 'DINPro Cond Regular', 'Inter', Arial, sans-serif;
  font-weight: 400;
  font-size: 56px;
  line-height: 1;
  text-transform: uppercase;
  color: #000;
}

.champions-slide__award {
  display: flex;
  align-items: flex-end;
  gap: 16px;
}

.champions-slide__badge {
  display: flex;
  align-items: center;
  height: 50px;
  padding: 0 20px;
  border-radius: 99px;
  background: #E2480A;
  font-family: 'DINPro Cond Regular', 'Inter', Arial, sans-serif;
  font-weight: 400;
  font-size: 22px;
  line-height: 46.5px;
  text-transform: uppercase;
  color: #fff;
  white-space: nowrap;
}

.champions-slide__award-text {
  font-family: 'DINPro Regular', 'Inter', Arial, sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 22px;
  color: rgba(0, 0, 0, 0.6);
  width: 100%;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
}

.champions-slide__achievements {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.champions-slide__achievement {
  display: flex;
  align-items: flex-start;
  font-family: 'DINPro Regular', 'Inter', Arial, sans-serif;
  font-weight: 400;
  font-size: 16px;
  color: rgba(0, 0, 0, 0.6);
}

.champions-slide__dash {
  flex-shrink: 0;
  width: 30px;
  line-height: 25px;
}

.champions-slide__achievement-text {
  width: 100%;
  line-height: 22px;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
}

.champions-slide__footer {
  display: flex;
  align-items: center;
  height: 50px;
}

/* ==========================================================================
   Награды — Figma node 3880:10667
   ========================================================================== */
.awards {
  margin-top: 160px;
}

.awards__viewport {
  overflow-x: auto;
  overflow-y: hidden;
  cursor: grab;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

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

.awards__viewport.is-dragging {
  cursor: grabbing;
  user-select: none;
}

/* Бегущая строка (main.js → initAutoScroll): края ленты растворяются, чтобы
   логотипы и награды выплывали и уходили плавно, а не резались по контейнеру. */
.logos__viewport.is-autoplay,
.awards__viewport.is-autoplay {
  --strip-fade: 72px;
  -webkit-mask-image: linear-gradient(to right, transparent, #000 var(--strip-fade), #000 calc(100% - var(--strip-fade)), transparent);
  mask-image: linear-gradient(to right, transparent, #000 var(--strip-fade), #000 calc(100% - var(--strip-fade)), transparent);
}

.logos__viewport.is-autoplay > .logos__track,
.awards__viewport.is-autoplay > .awards__track {
  will-change: transform;
}

.awards__track {
  display: flex;
  align-items: center;
  gap: 70px;
  width: max-content;
  padding: 26px 2px; /* запас под box-shadow карточек (0 2px 25px) — 4px было мало, тень всё равно обрезалась сверху/снизу */
}

.awards__card {
  position: relative;
  flex-shrink: 0;
  width: 233px;
  height: 116px;
  overflow: hidden;
  box-shadow: 0 2px 25px rgba(0, 0, 0, 0.1);
}

.awards__card--white {
  background: #fff;
  border: 1px solid rgba(0, 0, 0, 0.05);
}

.awards__card--navy   { background: #1F2846; }
.awards__card--pink   { background: #DC0B5C; }
.awards__card--gold   { background: #CA9A4A; }
.awards__card--narrow { width: 89px; }

.awards__img {
  position: absolute;
  display: block;
  object-fit: cover;
}

.awards__uploaded-image {
  display: block;
  width: 100%;
  height: 100%;
}

.awards__uploaded-image--contain { object-fit: contain; }
.awards__uploaded-image--cover { object-fit: cover; }

.awards__img--1 { left: 16px; top: 17px; width: 202px; height: 82px; }
.awards__img--2 { left: 0; top: 0; width: 194px; height: 116px; }
.awards__corner { position: absolute; right: 0; top: 0; width: 17px; height: 17px; }
.awards__img--3 { inset: 0; width: 100%; height: 100%; }
.awards__img--4 { left: 36px; top: 7px; width: 161.615px; height: 102.321px; }
.awards__img--5 { left: 29px; top: 22px; width: 175px; height: 72px; }
.awards__img--9 { inset: 0; width: 100%; height: 100%; }

/* Карточки 6/7 — Figma задаёт кроп через процентный zoom/pan картинки внутри
   рамки меньшего размера (не простой object-fit:cover). */
.awards__crop {
  position: absolute;
  overflow: hidden;
}

.awards__crop--6 { left: 44px; top: 28px; width: 145px; height: 60px; }
.awards__crop--7 { left: 17px; top: 12px; width: 168px; height: 90.632px; }

.awards__crop-img {
  position: absolute;
  max-width: none;
}

.awards__crop--6 .awards__crop-img { left: 0; top: -71.05%; width: 100%; height: 242.11%; }
.awards__crop--7 .awards__crop-img { left: -15.79%; top: -53.66%; width: 115.79%; height: 214.63%; }

/* Карточка 8 — золотой кружок-медаль с декоративной графикой поверх */
.awards__img--8-circle { left: 58px; top: 0; width: 116px; height: 116px; }
.awards__img--8-group  { left: 66.15px; top: 10.19px; width: 95.078px; height: 98.021px; }
.awards__img--8-group2 { left: 154.53px; top: 51.4px; width: 9.794px; height: 22.802px; }

/* ==========================================================================
   География наших проектов — Figma node 3474:2058
   Реальная Yandex-карта вместо статичного скрина из Figma: ч/б через
   filter:grayscale, кастомные метки + виджет проекта по клику.
   ========================================================================== */
.map-section {
  margin-top: 160px;
}

.map-section__title {
  margin-bottom: 56px;
}

.map-section__inner {
  position: relative;
  width: 1204px;
  max-width: 100%;
  margin: 0 auto;
}

.map-section__map {
  width: 100%;
  height: 763px; /* сверено попиксельно с рендером Figma (869-106) */
  background: #E4E4E4;
}

/* Ч/б только тайловый слой карты (Yandex Maps 2.1: "...ground-pane") —
   если обесцветить весь контейнер, метки/контролы тоже теряют цвет и
   активная/обычная метка становятся неразличимы. Substring-селектор
   переживает смену версии API (класс вида ymaps-2-1-NNN-ground-pane). */
.map-section__map [class*="ground-pane"] {
  filter: grayscale(1);
}

.map-city-filter {
  position: absolute;
  z-index: 12;
  top: 45px;
  left: 40px;
  width: max-content;
  min-width: 161px;
  background: #fff;
}

.map-city-filter__toggle,
.map-city-filter__option {
  display: flex;
  align-items: center;
  width: 100%;
  min-height: 50px;
  padding: 0 20px;
  border: 0;
  background: #fff;
  color: #000;
  font-family: 'DINPro Cond Medium', 'Inter', Arial, sans-serif;
  font-size: 18px;
  font-weight: 500;
  line-height: 50px;
  letter-spacing: 0.05em;
  text-align: left;
  text-transform: uppercase;
  white-space: nowrap;
  cursor: pointer;
}

.map-city-filter__toggle {
  justify-content: space-between;
  gap: 8px;
}

.map-city-filter__arrow {
  display: block;
  flex: none;
  transition: transform 0.2s ease;
}

.map-city-filter.is-open .map-city-filter__arrow {
  transform: rotate(180deg);
}

.map-city-filter__options {
  padding: 10px 0;
}

.map-city-filter__options[hidden] {
  display: none;
}

.map-city-filter__option:hover,
.map-city-filter__option:focus-visible {
  color: #E2480A;
}

.map-section__cta {
  position: absolute;
  left: 499px;
  top: 673px;
  width: 200px;
  z-index: 5;
}

.map-widget {
  position: absolute;
  left: 721px;
  top: 45px; /* координата из Figma-метаданных (149px) не совпадала с реальным
                рендером — Group-узлы в этом файле дают смещённые relative-
                координаты; значение сверено попиксельно со скриншотом */
  z-index: 10;
  width: 380px;
  background: #fff;
  box-shadow: 0 0 25px rgba(0, 0, 0, 0.1);
  padding: 40px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 48px;
}

.map-widget__brand {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;
  width: 165px;
}

.map-widget__logo {
  width: 80px;
  height: 9.854px;
}

.map-widget__name {
  font-family: 'DINPro Cond Medium', 'Inter', Arial, sans-serif;
  font-weight: 500;
  font-size: 30px;
  line-height: 33px;
  text-transform: uppercase;
  text-align: center;
  color: rgba(0, 0, 0, 0.8);
}

.map-widget__body {
  display: flex;
  flex-direction: column;
  gap: 32px;
  width: 100%;
}

.map-widget__photo {
  display: block;
  width: 100%;
  height: 200px;
  object-fit: cover;
}

.map-widget__details {
  display: flex;
  flex-direction: column;
  gap: 16px;
  width: 100%;
}

.map-widget__row {
  display: flex;
  align-items: center;
  gap: 24px;
  font-size: 16px;
  line-height: 12px;
}

.map-widget__row--wrap {
  align-items: flex-end;
  line-height: 16px;
}

.map-widget__label {
  flex-shrink: 0;
  width: 150px;
  font-family: 'DINPro Regular', 'Inter', Arial, sans-serif;
  font-weight: 400;
  color: rgba(0, 0, 0, 0.5);
}

.map-widget__value {
  font-family: 'DINPro Medium', 'Inter', Arial, sans-serif;
  font-weight: 500;
  color: #000;
}

/* .map-widget центрирует детей (align-items: center) ради брендового блока
   сверху — .slide-more тут не на всю ширину, поэтому наследует центровку.
   В Figma (4985:9939) кнопка прижата к левому краю. */
.map-widget .slide-more {
  align-self: flex-start;
}

/* Крестик закрытия карточки (Figma 4985:9939) — картинка уже с запасом
   вокруг самого "×" (64×63 при видимой отметке ~15×15), поэтому кликабельная
   зона больше самого штриха, а не только с точностью до пикселя иконки. */
.map-widget__close {
  position: absolute;
  top: 0;
  right: 0;
  width: 64px;
  height: 63px;
  padding: 0;
  border: 0;
  background: none;
  cursor: pointer;
}

.map-widget__close-icon {
  display: block;
  width: 100%;
  height: 100%;
}

/* ==========================================================================
   Свой подход к разной деятельности — Frame 42530099
   ========================================================================== */
.categories {
  margin-top: 160px;
}

.categories-inner {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 56px;
}

.categories__title-line {
  display: block;
}

.categories__title-line:first-child {
  color: #E2480A;
}

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

.categories__link {
  display: flex;
  align-items: flex-end;
  gap: 8px;
  font-family: 'DINPro Medium', 'Inter', Arial, sans-serif;
  font-weight: 500;
  font-size: 18px;
  line-height: 12px;
  text-transform: uppercase;
  color: #8E9B70;
  white-space: nowrap;
}

.categories__link--current {
  color: #000;
}

.categories__link-icon {
  width: 11px;
  height: 11px;
}

/* ==========================================================================
   "Тайга — сплав..." полноширинный баннер — Group 1228
   ========================================================================== */
.about-banner {
  margin-top: 160px;
  background: #FBF8F4;
}

.about-banner__inner {
  max-width: 1200px;
  margin: 0 auto;
  height: 674px;
  display: flex;
  gap: 104px;
}

.about-banner__photo {
  position: relative;
  flex-shrink: 0;
  width: 371px;
  height: 100%;
  overflow: hidden;
}

.about-banner__photo img {
  position: absolute;
  top: 0.01%;
  left: -73.34%;
  width: 272.17%;
  height: 100%;
  max-width: none;
}

.about-banner__content {
  padding-top: 104px;
  width: 726px;
  display: flex;
  flex-direction: column;
  gap: 238px;
}

.about-banner__heading {
  font-family: 'DINPro Cond Regular', 'Inter', Arial, sans-serif;
  font-weight: 400;
  font-size: 70px;
  line-height: 1.1;
  text-transform: uppercase;
  color: #000;
  text-box-trim: trim-both;
  text-box-edge: cap alphabetic;
}

.about-banner__heading span {
  color: #E2480A;
}

.about-banner__links {
  display: flex;
  align-items: center;
  gap: 56px;
}

.about-banner__link {
  display: flex;
  align-items: center;
  gap: 16px;
  font-family: 'DINPro Cond Regular', 'Inter', Arial, sans-serif;
  font-weight: 400;
  font-size: 30px;
  line-height: 0.7;
  color: #E2480A;
  white-space: nowrap;
}

.about-banner__link-icon {
  width: 19px;
  height: 19px;
}

/* ==========================================================================
   Авторские права и 200+ патентов — Frame 42530106
   ========================================================================== */
.patents {
  margin-top: 160px;
}

.patents-inner {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 56px;
}

.patents__title span {
  color: #E2480A;
}

.patents__row {
  display: flex;
  width: 100%;
}

.patents__col {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  width: 581px;
  height: 481px;
}

.patents__text {
  display: flex;
  flex-direction: column;
  gap: 40px;
}

.patents__text p {
  font-family: 'DINPro Regular', 'Inter', Arial, sans-serif;
  font-weight: 400;
  font-size: 18px;
  line-height: 25px;
  color: rgba(0, 0, 0, 0.6);
}

.patents__quote {
  display: flex;
  align-items: center;
  height: 77px;
  padding: 0 20px 0 24px;
  border-left: 5px solid #E2480A;
}

.patents__quote p {
  font-family: 'DINPro Cond Medium', 'Inter', Arial, sans-serif;
  font-weight: 500;
  font-size: 24px;
  line-height: 30px;
  text-transform: uppercase;
  color: rgba(226, 72, 10, 0.8);
}

.patents__card {
  margin-left: 139px; /* 720 (ml Figma) - 581 (ширина левой колонки) */
  width: 480px;
  height: 480.44px;
  background: #516B43;
  padding: 40px;
  display: flex;
  align-items: center;
}

.patents__card-inner {
  display: flex;
  flex-direction: column;
  gap: 126px;
  width: 400px;
}

.patents__number-group {
  display: flex;
  flex-direction: column;
  gap: 21px;
  width: 278.998px;
}

.patents__number {
  display: block;
  width: 278.998px;
  height: 143.442px;
}

.patents__number-label {
  font-family: 'DINPro Cond Medium', 'Inter', Arial, sans-serif;
  font-weight: 500;
  font-size: 30px;
  line-height: normal;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.8);
}

.patents__card-desc {
  font-family: 'DINPro Regular', 'Inter', Arial, sans-serif;
  font-weight: 400;
  font-size: 18px;
  line-height: 25px;
  color: #fff;
  text-align: right;
}

/* ==========================================================================
   Новости Тайги — Frame 42530105
   ========================================================================== */
.news {
  margin-top: 160px;
}

.news-inner {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 56px;
}

.news__title {
  line-height: 1.2; /* Figma: у этого заголовка leading-[1.2], не общие 1.1 */
}

.news__body {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 50px;
  width: 100%;
}

.news__grid {
  display: grid;
  grid-template-columns: repeat(3, 372px);
  column-gap: 44.5px;
  row-gap: 50px;
}

.news-card__photo {
  position: relative;
  width: 372px;
  height: 250px;
  overflow: hidden;
  background: rgba(0, 0, 0, 0.2);
}

.news-card__photo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.news-card__photo--dark-top::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0) 45%);
  pointer-events: none;
}

.news-card__badge {
  position: absolute;
  left: 10px;
  top: 10px;
  height: 44px;
  padding: 5px 20px;
  border-radius: 99px;
  background: #E2480A;
  display: flex;
  align-items: center;
  justify-content: center;
}

.news-card__badge-text {
  font-family: 'DINPro Cond Medium', 'Inter', Arial, sans-serif;
  font-weight: 500;
  font-size: 16px;
  line-height: 26px;
  text-transform: uppercase;
  color: #fff;
  white-space: nowrap;
}

.news-card__body {
  margin-top: 20px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 15px;
}

.news-card__text {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
  width: 100%;
}

.news-card__text--tight {
  gap: 6px;
}

.news-card__title {
  font-family: 'DINPro Cond Regular', 'Inter', Arial, sans-serif;
  font-weight: 400;
  font-size: 30px;
  line-height: normal;
  text-transform: uppercase;
  color: #000;
}

.news-card__excerpt {
  font-family: 'DINPro Regular', 'Inter', Arial, sans-serif;
  font-weight: 400;
  font-size: 18px;
  line-height: 25px;
  color: rgba(0, 0, 0, 0.6);
}

.news-card__date {
  font-family: 'DINPro Cond Regular', 'Inter', Arial, sans-serif;
  font-weight: 400;
  font-size: 22px;
  line-height: normal;
  text-transform: uppercase;
  color: rgba(81, 107, 67, 0.5);
}

.news__actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 624px;
}

.news__action {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 300px;
  height: 50px;
  font-family: 'DINPro Cond Medium', 'Inter', Arial, sans-serif;
  font-weight: 500;
  font-size: 16px;
  text-transform: uppercase;
  white-space: nowrap;
}

.news__action--outline {
  border: 1px solid #516B43;
  color: #516B43;
}

.news__action--filled {
  background: #516B43;
  color: #fff;
}

/* ==========================================================================
   Подвал сайта — Figma taiga_brand-components 5539:12083 (десктоп)
   ========================================================================== */
.footer {
  position: relative;
  overflow: hidden;
  background: #516B43;
  margin-top: 160px;
}

.footer__bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
}

.footer__inner {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: flex-start;
  gap: 50px;
  width: 1186px;
  max-width: 100%;
  margin: 0 auto;
  padding: 90px 0;
}

.footer__left {
  flex: none;
  width: 274px;
  display: flex;
  flex-direction: column;
  gap: 75px;
}

.footer__brand {
  display: flex;
  flex-direction: column;
  gap: 16px;
  width: 201px;
}

.footer__logo {
  display: block;
  width: 188px;
  height: 61.49px;
}

.footer__copyright {
  font-family: 'DINPro Regular', 'Inter', Arial, sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 10px;
  color: rgba(255, 255, 255, 0.5);
}

.footer__legal {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
}

.footer__legal a {
  font-family: 'DINPro Regular', 'Inter', Arial, sans-serif;
  font-weight: 400;
  font-size: 18px;
  line-height: 1.1;
  color: rgba(255, 255, 255, 0.5);
  text-box-trim: trim-both;
  text-box-edge: cap alphabetic;
}

/* Высоты 544 / 242 — фиксированные фреймы макета: ниже колонок ссылок
   остаётся воздух до линии, ниже контактов — до низа подвала. */
.footer__right {
  flex: none;
  width: 862px;
  height: 544px;
  display: flex;
  flex-direction: column;
  gap: 40px;
}

.footer__top {
  display: flex;
  flex-direction: column;
  gap: 30px;
  height: 242px;
}

.footer__columns {
  display: flex;
  align-items: flex-start;
  gap: 70px;
}

.footer__col {
  flex: none;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 30px;
}

.footer__col--catalog { width: 439px; }
.footer__col--partners { width: 150px; }
.footer__col--info { width: 134px; }

.footer__col-title {
  font-family: 'DINPro Cond Regular', 'Inter', Arial, sans-serif;
  font-weight: 400;
  font-size: 30px;
  line-height: 1.1;
  text-transform: uppercase;
  color: #fff;
  white-space: nowrap;
  text-box-trim: trim-both;
  text-box-edge: cap alphabetic;
}

.footer__catalog-lists {
  display: flex;
  align-items: flex-start;
  gap: 24px;
}

.footer__catalog-lists > .footer__col-list:first-child {
  width: 181px;
}

.footer__col-list {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
}

.footer__col-list a {
  font-family: 'DINPro Regular', 'Inter', Arial, sans-serif;
  font-weight: 400;
  font-size: 18px;
  line-height: 1.1;
  color: rgba(255, 255, 255, 0.6);
  white-space: nowrap;
  text-box-trim: trim-both;
  text-box-edge: cap alphabetic;
}

.footer__divider {
  display: block;
  flex: none;
  width: 100%;
  height: 1px;
  margin: 0;
  border: none;
  background: #B9C4B4;
}

/* Связаться | Адрес | Соцсети; вторая строка сетки — «Звонок бесплатный»
   под «Связаться» и сноска под соцсетями (в макете это отдельный ряд,
   выровненный по тем же столбцам). 36 между рядами = 10 + 16 + 10
   (паддинги обёрток и их gap в макете). */
.footer__contacts {
  display: grid;
  grid-template-columns: 167px auto 1fr;
  column-gap: 80px;
  row-gap: 36px;
  align-items: start;
  padding: 10px;
}

.footer__contact {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 30px;
}

.footer__contact-title {
  font-family: 'DINPro Cond Regular', 'Inter', Arial, sans-serif;
  font-weight: 400;
  font-size: 30px;
  line-height: 1.1;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.6);
  white-space: nowrap;
  text-box-trim: trim-both;
  text-box-edge: cap alphabetic;
}

.footer__contact-lines {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 14px;
}

.footer__contact-lines a,
.footer__address {
  font-family: 'DINPro Cond Regular', 'Inter', Arial, sans-serif;
  font-weight: 400;
  font-size: 30px;
  line-height: 1.1;
  color: #fff;
  white-space: nowrap;
  text-box-trim: trim-both;
  text-box-edge: cap alphabetic;
}

.footer__address {
  line-height: 1.2;
}

.footer__social-links {
  display: grid;
  grid-template-columns: 93px 96px;
  grid-template-rows: auto auto;
  grid-auto-flow: column;
  column-gap: 50px;
  row-gap: 24px;
}

.footer__social-links a {
  font-family: 'DINPro Cond Regular', 'Inter', Arial, sans-serif;
  font-weight: 400;
  font-size: 24px;
  line-height: 1.1;
  color: #fff;
  white-space: nowrap;
  text-box-trim: trim-both;
  text-box-edge: cap alphabetic;
}

.footer__note {
  font-family: 'DINPro Regular', 'Inter', Arial, sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 1.1;
  text-box-trim: trim-both;
  text-box-edge: cap alphabetic;
}

.footer__note--call {
  grid-column: 1;
  color: rgba(255, 255, 255, 0.6);
}

.footer__note--insta {
  grid-column: 3;
  width: 318px;
  color: rgba(255, 255, 255, 0.5);
}

/* ==========================================================================
   Каталог v2 — Frame 42530109 (альтернативная версия, ?catalog=2)
   Переиспользует .catalog__grid / .catalog__card--tall (раскладка грида),
   .catalog__badge* (плашка первой карточки — визуально идентична v1) и
   .catalog__actions/.catalog__action* (нижние 3 CTA — тоже идентичны).
   ========================================================================== */
.catalog-v2 {
  margin-top: 160px; /* тот же интервал, что и у .catalog (v1) — раньше отсутствовал, лого прилипали к каталогу */
  background: #FBF8F4;
  padding: 89px 0;
}

.catalog2__card {
  position: relative;
  background: #fff;
  padding: 20px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.catalog2__img {
  position: absolute;
  display: block;
  max-width: none;
  transition: transform 350ms ease;
}

.catalog2__img--1 { left: -24.71%; top: 19.29%; width: 157.68%; height: 80.59%; }
.catalog2__img--2 { left: 30.43%;  top: 23.2%;  width: 69.57%;  height: 76.8%; }
.catalog2__img--3 { left: 24.37%;  top: 23.5%;  width: 73.37%;  height: 81%; }
.catalog2__img--4 { left: 25%;     top: 22.3%;  width: 75.18%;  height: 83%; }
.catalog2__img--5 { left: 28.26%;  top: 17%;    width: 78.99%;  height: 87.2%; }
.catalog2__img--6 { left: 23.55%;  top: 17.5%;  width: 74.91%;  height: 82.7%; }
.catalog2__img--7 { left: 22.42%;  top: 21.5%;  width: 78.08%;  height: 86.2%; }

.catalog2__label {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  gap: 8px;
}

.catalog2__label-text {
  font-family: 'DINPro Cond Medium', 'Inter', Arial, sans-serif;
  font-weight: 500;
  font-size: 18px;
  line-height: 12px;
  text-transform: uppercase;
  color: #000;
  white-space: nowrap;
}

.catalog2__label-icon {
  width: 11px;
  height: 11px;
}

/* ==========================================================================
   Финальный призыв .cta-block — «О нас» (5200:20183) и «Контакты»
   (5500:11647), разметка в templates/_cta_block.html
   ========================================================================== */
.cta-block {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 64px;
  height: 474px;
  margin-top: 120px;
  padding: 100px;
  background: #FAF8F5;
}

.cta-block + .footer {
  margin-top: 0;
}

.cta-block__head {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 32px;
  text-align: center;
  text-transform: uppercase;
}

.cta-block__eyebrow,
.cta-block__subtitle {
  font-family: 'DINPro Medium', 'Inter', Arial, sans-serif;
  font-weight: 500;
  font-size: 16px;
  line-height: 22px;
  text-box-trim: trim-both;
  text-box-edge: cap alphabetic;
}

.cta-block__eyebrow {
  color: #E2480A;
}

.cta-block__subtitle {
  color: rgba(0, 0, 0, 0.6);
}

.cta-block__accent {
  color: inherit;
}

.cta-block__title {
  font-family: 'DINPro Cond Regular', 'Inter', Arial, sans-serif;
  font-weight: 400;
  font-size: 70px;
  line-height: 60px;
  color: #000;
  text-box-trim: trim-both;
  text-box-edge: cap alphabetic;
}

.cta-block__actions {
  display: flex;
  align-items: center;
  gap: 24px;
}

/* ==========================================================================
   Кнопка «в корзину» на карточках (cart/_add_button.html) и уведомление
   о добавлении (static/js/cart.js). Кнопка повторяет прежнюю картинку-иконку:
   размер задаёт класс карточки (.catpg-card__cart и т.п.), здесь только сброс.
   ========================================================================== */
.cart-add {
  padding: 0;
  border: 0;
  background: none;
  cursor: pointer;
}

.cart-add img {
  display: block;
  width: 100%;
  height: 100%;
}

.cart-add:disabled {
  cursor: progress;
}

.cart-toast {
  position: fixed;
  right: 24px;
  bottom: 24px;
  z-index: 1000;
  max-width: 360px;
  padding: 14px 20px;
  background: #516B43;
  font-family: 'DINPro Regular', 'Inter', Arial, sans-serif;
  font-size: 14px;
  line-height: 18px;
  color: #fff;
  opacity: 0;
  visibility: hidden;
  transform: translateY(8px);
  transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s ease;
}

.cart-toast.is-visible {
  opacity: 1;
  visibility: visible;
  transform: none;
}

.cart-toast a {
  color: #fff;
  text-decoration: underline;
}

@media (max-width: 767px) {
  .cart-toast {
    right: 16px;
    left: 16px;
    max-width: none;
  }
}

/* Кружок с числом товаров у иконки корзины в шапке (десктоп-топбар,
   мобильная шапка и меню). Цвета — фирменные: оранжевый #E2480A, белый текст. */
.cart-icon {
  position: relative;
  display: inline-flex;
}

.header__action-link .cart-badge,
.cart-badge {
  position: absolute;
  top: -7px;
  right: -9px;
  min-width: 16px;
  height: 16px;
  padding: 0 4px;
  border-radius: 8px;
  background: #E2480A;
  font-family: 'DINPro Medium', 'Inter', Arial, sans-serif;
  font-weight: 500;
  font-size: 10px;
  line-height: 16px;
  color: #fff;
  text-align: center;
  white-space: nowrap;
  pointer-events: none;
}

.cart-badge[hidden] {
  display: none;
}