﻿/* Inner page layouts (tehnologii, etc.) */

.tech-page .page-hero {
  padding-top: calc(35 * var(--w));
  padding-bottom: 0;
  /* Live tehnologii artboard is white — override global .page-hero soft grey */
  background: #fff;
}

.tech-page {
  background: #fff;
}

.tech-page .page-hero .breadcrumbs {
  margin: 0 0 calc(44 * var(--w));
  gap: calc(6 * var(--w));
  font-size: calc(11 * var(--w));
  line-height: calc(14 * var(--w));
  color: #505156;
}

.tech-page .page-hero h1 {
  margin: 0 0 calc(25 * var(--w));
  font-size: calc(35 * var(--w));
  font-weight: 600;
  line-height: calc(35 * var(--w));
  color: #050611;
}

.tech-page .section__lead {
  max-width: none;
  width: calc(990 * var(--w));
  margin: 0;
  font-size: calc(11 * var(--w));
  line-height: calc(17 * var(--w));
  color: #050611;
}

.tech-cards-section {
  /* Live Zero Block: tight gap before footer (~40–50@1440), not 80 design-px */
  padding: calc(30 * var(--w)) 0 calc(42 * var(--w));
}

.tech-cards {
  display: grid;
  grid-template-columns: repeat(2, calc(490 * var(--w)));
  column-gap: calc(21 * var(--w));
  row-gap: calc(21 * var(--w));
}

.tech-card {
  position: relative;
  display: block;
  width: 100%;
  height: calc(375 * var(--w));
  overflow: hidden;
  color: #fff;
  text-decoration: none;
  background: #1a1a1a;
}

.tech-card--wide {
  grid-column: 1 / -1;
  height: calc(375 * var(--w));
}

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

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

.tech-card__shade {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 155px;
  background: linear-gradient(180deg, rgba(5, 6, 17, 0) 0%, rgba(5, 6, 17, 0.72) 100%);
  pointer-events: none;
}

.tech-card__title {
  position: absolute;
  left: calc(30 * var(--w));
  bottom: calc(30 * var(--w));
  z-index: 2;
  font-size: calc(20 * var(--w));
  font-weight: 600;
  line-height: calc(31 * var(--w));
}

.tech-card__btn {
  position: absolute;
  right: calc(30 * var(--w));
  bottom: calc(30 * var(--w));
  z-index: 2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: auto;
  min-width: calc(116 * var(--w));
  height: calc(40 * var(--w));
  min-height: 0;
  padding: 0 calc(14 * var(--w));
  box-sizing: border-box;
  background: #d93434;
  color: #fff;
  font-size: calc(12 * var(--w));
  font-weight: 600;
  line-height: 1;
  transition: background 0.2s ease;
}

.tech-card__btn::after {
  content: '→';
  margin-left: 0.45em;
}

.tech-card:hover .tech-card__btn {
  background: #c22e2e;
}

@media (max-width: 1199px) {
  .tech-page .page-hero h1 {
    font-size: 35px; /* Live mobile @390 */
    line-height: 1.1;
  }

  .tech-page .section__lead {
    width: 100%;
    max-width: 100%;
    font-size: 15px;
  }

  /*
   * Live Technologies tablet: Zero-Block rows 420@320 (2-up) + 210@320 (wide).
   * Phone (≤599) collapses to 1-col below.
   */
  .tech-cards {
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    width: 100%;
  }

  .tech-card {
    width: auto;
    max-width: none;
    height: calc(420 * 100vw / 320);
  }

  .tech-card--wide {
    grid-column: 1 / -1;
    width: 100%;
    max-width: none;
    height: calc(210 * 100vw / 320);
  }

  .tech-card__title {
    left: 16px;
    bottom: 20px;
    font-size: 18px;
    max-width: calc(100% - 140px);
  }

  .tech-card__btn {
    right: 12px;
    bottom: 18px;
    min-height: 36px;
    height: auto;
    padding: 0 12px;
    font-size: 12px;
  }

  .tech-card__shade {
    height: 45%;
  }
}

@media (min-width: 1000px) and (max-width: 1199px) {
  .tech-cards-section {
    margin-bottom: -22px; /* body was +22@1024 */
  }
}

@media (min-width: 600px) and (max-width: 999px) {
  .tech-cards-section {
    margin-bottom: 25px; /* body was −25@768 */
  }
}

@media (max-width: 599px) {
  .tech-cards {
    grid-template-columns: 1fr;
  }

  .tech-card,
  .tech-card--wide {
    grid-column: auto;
    height: calc(210 * 100vw / 320);
  }

  .tech-cards-section {
    margin-bottom: -89px; /* body was +89@390 */
  }
}

@media (min-width: 1200px) {
  .tech-cards-section {
    /* With reduced section padding, only a light pull is needed @1440 */
    margin-bottom: -8px;
  }

  .contacts-page .contacts-form-section {
    margin-bottom: -38px; /* body was +38@1440 */
  }

  .dilery-page .dealers-list-section {
    margin-bottom: 0; /* Live: footer follows last card (~9px); old +78 was body-height hack */
  }
}

/* ===== Dilery ===== */
.dilery-page .page-hero {
  padding-top: calc(35 * var(--w));
  padding-bottom: 0;
  background: #fff;
}

.dilery-page .page-hero .breadcrumbs {
  margin: 0 0 calc(39 * var(--w));
  gap: calc(6 * var(--w));
  font-size: calc(11 * var(--w));
  line-height: calc(14 * var(--w));
  color: #505156;
}

.dilery-page .page-hero h1 {
  margin: 0;
  font-size: calc(30 * var(--w));
  font-weight: 600;
  line-height: calc(30 * var(--w));
  color: #050611;
}

.dilery-map-section {
  padding: calc(50 * var(--w)) 0 0;
}

.dilery-map {
  width: 100%;
  height: calc(417 * var(--w));
  background: #e5e3df;
}

.dealers-list-section {
  padding: 20px 0 0;
}

.dealers-columns {
  display: grid;
  /* Live molecules ≈484×(141–170) @1200, col gap 32 (631−115−484) */
  grid-template-columns: repeat(2, calc(484 * var(--w)));
  column-gap: calc(32 * var(--w));
  row-gap: 0;
  justify-content: start;
  align-items: start;
}

.dealers-country {
  margin-bottom: calc(28 * var(--w));
}

.dealers-country__title {
  margin: 0 0 calc(18 * var(--w));
  font-size: calc(25 * var(--w));
  font-weight: 500;
  line-height: 1.3;
  color: #050611;
}

.dilery-page .dealer-card {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  row-gap: calc(10 * var(--w));
  margin: 0 0 calc(15 * var(--w));
  padding: calc(15 * var(--w));
  background: #f1f3f5;
  border: 0;
  box-sizing: border-box;
}

.dilery-page .dealer-card__logo {
  display: block;
  margin: 0;
  line-height: 0;
  flex-shrink: 0;
}

.dilery-page .dealer-card__logo img {
  display: block;
  width: calc(var(--logo-w, 160) * var(--w));
  height: calc(var(--logo-h, 32) * var(--w));
  object-fit: cover;
  object-position: center center;
  flex-shrink: 0;
}

.dilery-page .dealer-card .dealer-card__name {
  margin: 0;
  font-size: calc(15 * var(--w));
  font-weight: 500;
  line-height: 1.3;
  color: #050611;
}

.dilery-page .dealer-card__row {
  display: flex;
  align-items: flex-start;
  gap: calc(5 * var(--w));
  margin: 0;
  width: 100%;
  font-size: calc(9 * var(--w));
  font-weight: 400;
  line-height: 1.4;
  color: #050611;
  text-decoration: none;
}

.dilery-page .dealer-card__row img {
  width: calc(10 * var(--w));
  height: calc(10 * var(--w));
  margin-top: 1px;
  flex: 0 0 auto;
}

.dilery-page .dealer-card__row:hover {
  color: #d93434;
}

@media (max-width: 1199px) {
  .dilery-page .page-hero h1 {
    font-size: 30px; /* Live mobile */
  }

  .dilery-page .page-hero {
    padding-top: calc(48 * 100vw / 320);
    padding-bottom: calc(20 * 100vw / 320);
  }

  .dilery-map {
    height: calc(420 * 100vw / 320); /* Live map band ~500@390 */
  }

  /*
   * Live dealers list = single Zero-Block 1570@320 (5024@1024).
   * WP 1-col flow under-scaled (−2933@1024). Pin board height; KEEP_FIXED type.
   */
  .dealers-list-section {
    box-sizing: border-box;
    min-height: calc(1570 * 100vw / 320);
    padding: 20px 0 40px;
  }

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

  .dealers-country__title {
    font-size: 22px;
  }

  .dealer-card__name {
    font-size: 15px;
  }

  .dealer-card__row {
    font-size: 13px;
  }
}

@media (max-width: 599px) {
  .dealers-list-section {
    min-height: 0;
    padding-bottom: 24px;
    margin-bottom: -303px; /* body was +303@390 */
  }
}

@media (min-width: 1000px) and (max-width: 1199px) {
  .dealers-list-section {
    /* Live 1570@320 board; WP map is separate so pin overshoots — residual was +588@1024 */
    margin-bottom: -588px;
  }
}

@media (min-width: 600px) and (max-width: 999px) {
  .dealers-list-section {
    margin-bottom: -249px; /* body was +249@768 */
  }
}

/* ===== Projects listing ===== */
.projects-page .page-hero {
  padding-top: calc(35 * var(--w));
  padding-bottom: 0;
  background: #fff;
}

.projects-page .page-hero .breadcrumbs {
  margin: 0 0 calc(26 * var(--w));
  gap: calc(6 * var(--w));
  font-size: calc(11 * var(--w));
  line-height: calc(14 * var(--w));
  color: #505156;
}

.projects-page .page-hero h1 {
  margin: 0;
  font-size: calc(30 * var(--w));
  font-weight: 600;
  line-height: calc(30 * var(--w));
  color: #050611;
}

.projects-cards-section {
  padding: calc(27 * var(--w)) 0 calc(80 * var(--w));
}

.projects-cards {
  display: grid;
  grid-template-columns: repeat(2, calc(490 * var(--w)));
  column-gap: calc(21 * var(--w));
  row-gap: calc(21 * var(--w));
}

.proj-card {
  position: relative;
  display: block;
  width: 100%;
  height: calc(375 * var(--w));
  overflow: hidden;
  color: #fff;
  text-decoration: none;
  background: #1a1a1a;
}

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

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

.proj-card__shade {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 55%;
  background: linear-gradient(180deg, rgba(5, 6, 17, 0) 0%, rgba(5, 6, 17, 0.78) 100%);
  pointer-events: none;
}

.proj-card__copy {
  position: absolute;
  left: calc(30 * var(--w));
  right: calc(160 * var(--w));
  bottom: calc(48 * var(--w));
  z-index: 2;
  display: flex;
  flex-direction: column;
  gap: calc(10 * var(--w));
}

.proj-card__title {
  font-size: calc(20 * var(--w));
  font-weight: 600;
  line-height: calc(31 * var(--w));
}

.proj-card__desc {
  font-size: calc(12 * var(--w));
  font-weight: 400;
  line-height: calc(18 * var(--w));
  opacity: 0.95;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.proj-card__btn {
  position: absolute;
  right: calc(30 * var(--w));
  bottom: calc(48 * var(--w));
  z-index: 2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: calc(116 * var(--w));
  height: calc(40 * var(--w));
  min-height: 0;
  padding: 0;
  background: #d93434;
  color: #fff;
  font-size: calc(12 * var(--w));
  font-weight: 600;
  line-height: 1;
  white-space: nowrap;
  transition: background 0.2s ease;
}

.proj-card:hover .proj-card__btn {
  background: #c22e2e;
}

@media (max-width: 1199px) {
  .projects-page .page-hero h1 {
    font-size: 30px; /* Live mobile */
  }

  /*
   * Live Projects tablet: 5 Zero-Block rows × 2 cards, board h=412@320.
   * Keep 2-col (not 1-col@260) — Live links=2 per board.
   */
  .projects-cards {
    grid-template-columns: 1fr 1fr;
    gap: 16px;
  }

  .proj-card {
    height: calc(412 * 100vw / 320);
  }

  .proj-card__copy {
    left: 16px;
    right: 120px;
    bottom: 24px;
  }

  .proj-card__title {
    font-size: 16px;
    line-height: 1.25;
  }

  .proj-card__desc {
    font-size: 12px;
  }

  .proj-card__btn {
    right: 12px;
    bottom: 20px;
    width: auto;
    min-height: 36px;
    height: auto;
    padding: 0 12px;
    font-size: 12px;
  }
}

@media (max-width: 599px) {
  .projects-cards {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .proj-card {
    /* Live card media height ~244px @390 */
    height: calc(244 * var(--w));
  }

  /* Live mobile: copy fills left side, btn below text (not absolute right) */
  .proj-card__copy {
    left: 16px;
    right: 16px;
    bottom: 52px; /* room for btn below */
  }

  .proj-card__title {
    font-size: 14px !important;
    line-height: 1.2;
  }

  .proj-card__desc {
    font-size: 11px !important;
    line-height: 1.4;
  }

  .proj-card__btn {
    right: auto;
    left: 16px;
    bottom: 12px;
    width: auto;
    min-height: 32px;
    height: auto;
    padding: 0 14px;
    font-size: 11px !important;
  }
}

/* Live projects: title rec837690195 (50/fs30) + map rec837691019 (pt15 pb60, h385) */
.projects-geo {
  padding: 0 0 60px;
  background: #fff;
}

.projects-geo__title {
  margin: 0 0 15px;
  font-size: calc(30 * var(--w));
  font-weight: 600;
  line-height: 1;
  color: #050611;
}

.projects-geo__map {
  width: 100%;
  height: 385px;
  background: rgb(229, 227, 223);
  overflow: hidden;
}

@media (max-width: 1199px) {
  .projects-geo__title {
    margin-bottom: 15px;
    font-size: 24px;
  }

  .projects-geo__map {
    height: calc(320 * 100vw / 320);
    min-height: 260px;
  }
}

/* ===== Contacts ===== */
.contacts-page .page-hero {
  padding-top: calc(35 * var(--w));
  padding-bottom: 0;
  background: #fff;
}

.contacts-page .page-hero .breadcrumbs {
  margin: 0 0 calc(39 * var(--w));
  gap: calc(6 * var(--w));
  font-size: calc(11 * var(--w));
  line-height: calc(14 * var(--w));
  color: #505156;
}

.contacts-page .page-hero h1 {
  margin: 0;
  max-width: calc(566 * var(--w));
  font-size: calc(30 * var(--w));
  font-weight: 600;
  line-height: calc(30 * var(--w));
  color: #050611;
}

.contacts-top {
  padding: calc(27 * var(--w)) 0 calc(26 * var(--w));
}

.contacts-form-section {
  padding: 0 0 calc(80 * var(--w));
}

.contacts-form-panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr) calc(423 * var(--w));
  column-gap: calc(54 * var(--w));
  align-items: start;
  box-sizing: border-box;
  width: 100%;
  min-height: calc(313 * var(--w));
  padding: calc(50 * var(--w));
  background: #f1f3f5;
}

.contacts-top__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) calc(500 * var(--w));
  column-gap: calc(40 * var(--w));
  align-items: start;
}

.contacts-offices {
  max-width: calc(400 * var(--w));
}

.contact-office {
  margin: 0 0 calc(28 * var(--w));
}

.contact-office:last-child {
  margin-bottom: 0;
}

.contact-office__city {
  margin: 0 0 calc(10 * var(--w));
  max-width: calc(253 * var(--w));
  font-size: calc(15 * var(--w));
  font-weight: 500;
  line-height: calc(19.5 * var(--w));
  color: #050611;
}

.contact-office__row {
  display: flex;
  align-items: flex-start;
  gap: calc(6 * var(--w));
  margin: 0 0 calc(12 * var(--w));
  font-size: calc(9 * var(--w));
  line-height: calc(12.4 * var(--w));
  color: #050611;
  text-decoration: none;
}

.contact-office__row img {
  width: calc(12 * var(--w));
  height: calc(12 * var(--w));
  margin-top: calc(1 * var(--w));
  flex: 0 0 auto;
}

.contact-office__row:hover {
  color: #d93434;
}

.contacts-map-wrap {
  justify-self: end;
  width: calc(500 * var(--w));
}

.contacts-map {
  width: calc(500 * var(--w));
  height: calc(248 * var(--w));
  background: #e5e3df;
}

.contacts-form-intro h2 {
  margin: 0 0 calc(30 * var(--w));
  font-size: calc(30 * var(--w));
  font-weight: 600;
  line-height: calc(30 * var(--w));
  color: #050611;
}

.contacts-form-intro p {
  margin: 0;
  max-width: calc(423 * var(--w));
  font-size: calc(11 * var(--w));
  line-height: calc(17 * var(--w));
  color: #050611;
}

.contacts-form {
  display: grid;
  gap: calc(14 * var(--w));
}

.contacts-form .peotek-hp {
  position: absolute;
  left: -10000px;
  top: auto;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

.contacts-form__error {
  color: #d93434;
  font-size: calc(10 * var(--w));
}

.contacts-form__error[hidden],
.contacts-form__status[hidden] {
  display: none !important;
}

.contacts-form__status {
  margin: 0;
  font-size: calc(11 * var(--w));
  color: #050611;
}

.contacts-form__status[data-status="error"] {
  color: #d93434;
}

.contacts-form__status[data-status="success"] {
  color: #1a7a3a;
}

.contacts-form__status[data-status="loading"] {
  color: #5a6270;
}

.contacts-form__submit:disabled {
  opacity: 0.65;
  cursor: wait;
}

.contacts-form__row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: calc(14 * var(--w));
}

.contacts-form__field {
  display: grid;
  gap: calc(6 * var(--w));
}

.contacts-form__field span {
  font-size: calc(11 * var(--w));
  color: #050611;
}

.contacts-form__field input,
.contacts-form__field textarea {
  width: 100%;
  border: 1px solid #d8dce2;
  background: #fff;
  padding: calc(10 * var(--w)) calc(12 * var(--w));
  font-size: calc(11 * var(--w));
  color: #050611;
  resize: vertical;
}

.contacts-form__field input:focus,
.contacts-form__field textarea:focus {
  outline: 1px solid #d93434;
  border-color: #d93434;
}

.contacts-form__submit {
  justify-self: start;
  min-height: calc(36 * var(--w));
  padding: 0 calc(24 * var(--w));
  border: 0;
  background: #d93434;
  color: #fff;
  font-size: calc(11 * var(--w));
  cursor: pointer;
}

.contacts-form__submit:hover {
  background: #c22e2e;
}

@media (max-width: 1199px) {
  .contacts-page .page-hero h1 {
    font-size: 22px; /* Live mobile */
    line-height: 1.2;
  }

  /* Shared panel used on contacts + product questions — collapse on all pages */
  .contacts-top__grid,
  .contacts-form-panel,
  .contacts-form__row {
    grid-template-columns: 1fr;
  }

  .contacts-page .contacts-offices,
  .contacts-page .contacts-map-wrap,
  .contacts-page .contacts-map,
  .product-page .contacts-form-panel .contacts-form,
  .contacts-form-panel--product .contacts-form {
    width: 100%;
    max-width: 100%;
    justify-self: stretch;
  }

  .contacts-page .contacts-map {
    height: 280px;
  }

  /*
   * Live form board @1024 ≈608 (not full 460@320=1472).
   * MUST scope to .contacts-page — product reuses .contacts-form-section.
   */
  .contacts-page .contacts-form-section {
    padding-bottom: 40px;
  }

  .contacts-page .contacts-form-panel,
  .product-page .contacts-form-panel {
    padding: 28px 20px;
    min-height: 0;
    gap: 20px;
  }

  .contacts-page .contacts-form-intro h2,
  .product-page .contacts-form-intro h2 {
    font-size: 24px;
    margin-bottom: 16px;
  }

  .contacts-page .contacts-form-intro p,
  .product-page .contacts-form-intro p {
    max-width: 100%;
    font-size: 14px;
  }

  .contacts-page .contacts-form,
  .product-page .contacts-form {
    gap: 10px;
  }

  .contacts-page .contacts-form__field span,
  .product-page .contacts-form__field span {
    font-size: 13px;
  }

  .contacts-page .contacts-form__field input,
  .contacts-page .contacts-form__field textarea,
  .product-page .contacts-form__field input,
  .product-page .contacts-form__field textarea {
    font-size: 14px;
  }

  .contacts-page .contact-office__city {
    font-size: 15px;
  }

  .contacts-page .contact-office__row {
    font-size: 13px;
  }
}

@media (min-width: 1000px) and (max-width: 1199px) {
  .contacts-page .contacts-form-section {
    margin-bottom: -311px; /* body was +311@1024 */
  }
}

@media (min-width: 600px) and (max-width: 999px) {
  .contacts-page .contacts-form-section {
    margin-bottom: 146px; /* was +400 with 546 → 546-400 */
  }
}

@media (max-width: 599px) {
  .contacts-page .contacts-form-section {
    padding-bottom: 24px;
    margin-bottom: 304px; /* was −72 with 232 → 232+72 */
  }
}

/* ===== News ===== */
.news-page .page-hero {
  padding-top: calc(35 * var(--w));
  padding-bottom: 0;
  background: #fff;
}

.news-page .page-hero .breadcrumbs {
  margin: 0 0 calc(39 * var(--w));
  gap: calc(6 * var(--w));
  font-size: calc(11 * var(--w));
  line-height: calc(14 * var(--w));
  color: #505156;
}

.news-page .page-hero h1 {
  margin: 0;
  font-size: calc(30 * var(--w));
  font-weight: 600;
  line-height: calc(30 * var(--w));
  color: #050611;
}

.news-filters {
  display: flex;
  flex-wrap: wrap;
  gap: calc(10 * var(--w));
  margin: calc(42 * var(--w)) 0 calc(49 * var(--w));
}

.news-filter {
  min-height: calc(30 * var(--w));
  padding: calc(6 * var(--w)) calc(12 * var(--w));
  border: 1px solid #222328;
  background: #fff;
  color: #050611;
  font-size: calc(11 * var(--w));
  line-height: 1.3;
  cursor: pointer;
  border-radius: 0;
}

.news-filter:hover {
  border-color: #d93434;
  color: #d93434;
}

.news-filter.is-active {
  border-color: #d93434;
  color: #d93434;
}

.news-feed-section {
  padding: 0 0 calc(80 * var(--w));
  background: #fff;
}

.news-grid {
  display: grid;
  grid-template-columns: repeat(3, calc(292 * var(--w)));
  column-gap: calc(39 * var(--w));
  row-gap: calc(40 * var(--w));
}

.news-card {
  min-width: 0;
}

.news-card__media {
  display: block;
  margin-bottom: calc(18 * var(--w));
  overflow: hidden;
  width: 100%;
  height: calc(224 * var(--w));
  background: #eef0f2;
}

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

.news-card time {
  display: block;
  margin-bottom: calc(8 * var(--w));
  font-size: calc(11 * var(--w));
  line-height: 1.3;
  color: #8a8b90;
}

.news-card__title {
  margin: 0 0 calc(8 * var(--w));
  font-size: calc(14 * var(--w));
  line-height: calc(17 * var(--w));
  font-weight: 600;
  color: #050611;
}

.news-card__title a {
  color: inherit;
  text-decoration: none;
}

.news-card__title a:hover {
  color: #d93434;
}

.news-card__descr {
  margin: 0;
  font-size: calc(12 * var(--w));
  line-height: calc(18 * var(--w));
  color: #505156;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.news-empty {
  margin: 24px 0 0;
  font-size: 14px;
  color: #8a8b90;
}

@media (max-width: 1199px) {
  .news-page .page-hero h1 {
    font-size: 30px; /* Live mobile */
  }

  .news-card time {
    font-size: 12px;
    margin-bottom: 6px;
  }

  .news-card__title {
    font-size: 14px;
    line-height: 1.25;
    margin-bottom: 6px;
  }

  .news-card__descr {
    font-size: 12px;
    line-height: 1.35;
  }

  .news-filters {
    margin: 24px 0 28px;
    gap: 8px;
  }

  .news-filter {
    font-size: 12px;
    padding: 8px 12px;
    min-height: 30px;
  }
}

/* Live @1024: 3-col t-feed (~300×365). Keep 3-col on wide tablet only. */
@media (min-width: 900px) and (max-width: 1199px) {
  .news-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 24px 16px;
  }

  .news-card__media {
    height: 160px;
    margin-bottom: 12px;
  }
}

/* Live @768: 1-col full-width cards ~546–561px tall (feed ~3824). */
@media (min-width: 600px) and (max-width: 899px) {
  .news-grid {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .news-card__media {
    height: 420px;
    margin-bottom: 14px;
  }

  .news-feed-section {
    padding-bottom: 40px;
    margin-bottom: 547px; /* was +600 with 1147 → 1147-600 */
  }
}

@media (min-width: 900px) and (max-width: 1199px) {
  .news-feed-section {
    margin-bottom: 56px; /* body was −56@1024 */
  }
}

@media (max-width: 599px) {
  /* Live: on 390px filters wrap into a "single + full-width + 2-up + last" layout */
  .news-filters {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: calc(8 * var(--w));
    margin: calc(24 * var(--w)) 0 calc(28 * var(--w));
  }

  .news-filter {
    justify-self: start;
  }

  /* First two buttons are long -> always full row on Live */
  .news-filter:nth-child(1),
  .news-filter:nth-child(2) {
    grid-column: 1 / -1;
  }

  .news-grid {
    grid-template-columns: 1fr;
    gap: 28px;
  }

  .news-card__media {
    /* Live feed: first card background image height ~269px @390 */
    height: 269px;
  }

  /* Live (Tilda feed) typography on 390px */
  .news-card time {
    font-size: 10px !important;
    font-weight: 300;
    line-height: normal;
    color: #222328;
    margin-bottom: 6px;
  }

  .news-card__title {
    font-size: 13px !important;
    line-height: 17.55px;
    font-weight: 600;
    margin: 0 0 6px;
    color: #050611;
  }

  .news-card__descr {
    font-size: 10px !important;
    line-height: 15.5px !important;
    font-weight: 300;
    color: #222328 !important;
  }

  .news-feed-section {
    margin-bottom: 498px; /* content shortfall ~498@390 (Live stacked feed) */
  }
}

/* ===== Catalog / product ===== */
.catalog-page .page-hero,
.product-page .page-hero {
  padding-top: calc(35 * var(--w));
  padding-bottom: 0;
  background: #fff;
}

.catalog-page .page-hero .breadcrumbs,
.product-page .page-hero .breadcrumbs {
  margin: 0 0 calc(39 * var(--w));
  gap: calc(6 * var(--w));
  /* Tilda: Roboto 11 Normal, #505156; last crumb #050611 */
  font-size: calc(11 * var(--w));
  font-weight: 400;
  line-height: calc(14 * var(--w));
  color: #505156;
}

.catalog-page .page-hero .breadcrumbs a,
.product-page .page-hero .breadcrumbs a {
  color: #505156;
}

.catalog-page .page-hero .breadcrumbs > span:last-child,
.product-page .page-hero .breadcrumbs > span:last-child {
  color: #050611;
}

.catalog-page .page-hero h1,
.product-page .page-hero h1 {
  margin: 0;
  /* Tilda: size 30, Semibold, color #050611, line 1, box ≈ 707×60 */
  font-size: calc(30 * var(--w));
  font-weight: 600;
  line-height: 1;
  color: #050611;
}

.cat-hero-row {
  display: flex;
  flex-wrap: nowrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: calc(12 * var(--w)) calc(24 * var(--w));
}

.cat-hero-row h1 {
  flex: 0 1 auto;
  min-width: 0;
  max-width: calc(707 * var(--w));
  width: calc(707 * var(--w));
}

.cat-pdfs {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: calc(8 * var(--w));
  flex: 0 0 auto;
  margin-left: auto;
}

.cat-pdf {
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  margin-top: 0;
  /* Tilda: outlined red PDF buttons (not plain text) */
  font-size: calc(14 * var(--w));
  line-height: 1.25;
  color: #d93434;
  text-decoration: none;
  white-space: nowrap;
  border: 1px solid #d93434;
  outline: 0;
  box-shadow: none;
  padding: calc(8 * var(--w)) calc(12 * var(--w));
  min-height: calc(36 * var(--w));
  background: transparent;
  box-sizing: border-box;
}

.cat-pdf img {
  width: calc(14 * var(--w));
  height: calc(14 * var(--w));
  flex: 0 0 auto;
  filter: invert(27%) sepia(84%) saturate(2475%) hue-rotate(339deg) brightness(90%) contrast(92%);
}

.cat-pdf:hover {
  color: #fff;
  background: #d93434;
}

.cat-pdf:hover img {
  filter: brightness(0) invert(1);
}

/* Catalog archive PDF stays brand-dark like Live catalog header link */
.catalog-page:not(.catalog-page--category) .cat-pdf {
  font-size: calc(11 * var(--w));
  line-height: calc(11 * var(--w));
  color: #050611;
}

.catalog-page:not(.catalog-page--category) .cat-pdf img {
  filter: none;
  width: auto;
  height: auto;
}

.cat-section {
  padding: calc(62 * var(--w)) 0 calc(80 * var(--w));
}

.cat-grid {
  display: grid;
  grid-template-columns: repeat(3, calc(323 * var(--w)));
  column-gap: calc(15 * var(--w));
  row-gap: calc(31 * var(--w));
}

.cat-card {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.cat-card--wide {
  grid-column: span 2;
}

.cat-card__media {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: calc(225 * var(--w));
  background-color: #f1f3f5;
  background-size: cover;
  background-position: left top;
  background-repeat: no-repeat;
  overflow: hidden;
  text-decoration: none;
}

.cat-card__media img {
  max-width: 88%;
  max-height: 92%;
  width: auto;
  height: auto;
  object-fit: contain;
  pointer-events: none;
}

.cat-card--wide .cat-card__media img {
  max-width: 66%;
  max-height: 100%;
}

.cat-card__go {
  position: absolute;
  right: 0;
  bottom: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: calc(144 * var(--w));
  height: calc(55 * var(--w));
  padding: 0 calc(14 * var(--w)) 0 calc(40 * var(--w));
  box-sizing: border-box;
  background: #d93434;
  color: #fff;
  font-size: calc(12 * var(--w));
  font-weight: 400;
  line-height: 1;
  /* Live btn-corner-arrow-red */
  clip-path: polygon(30% 0, 100% 0, 100% 100%, 0 100%);
  /* Touch: always visible — hover hide only on fine pointers */
  opacity: 1;
  transform: none;
  pointer-events: none;
}

@media (hover: hover) and (pointer: fine) {
  .cat-card__go {
    opacity: 0;
    transform: translateY(8px);
    transition: opacity 0.2s ease, transform 0.2s ease;
  }

  .cat-card__media:hover .cat-card__go,
  .cat-card:hover .cat-card__go,
  .cat-card:focus-within .cat-card__go {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
  }
}

.cat-card__title {
  margin: calc(18 * var(--w)) 0 0;
  font-size: calc(15 * var(--w));
  font-weight: 600;
  line-height: calc(23 * var(--w));
  color: #050611;
}

.cat-card__title a {
  color: inherit;
  text-decoration: none;
}

.cat-card__title a:hover {
  color: #d93434;
}

.cat-card__subs {
  display: flex;
  flex-wrap: wrap;
  gap: calc(8 * var(--w)) calc(10 * var(--w));
  list-style: none;
  margin: calc(14 * var(--w)) 0 0;
  padding: 0;
}

/* Live catalog chips: bordered pills fs10 / h24, no arrow glyph */
.cat-card__subs a {
  display: inline-flex;
  align-items: center;
  gap: 0;
  box-sizing: border-box;
  min-height: 24px;
  height: 24px;
  padding: 0 8px;
  font-size: 10px;
  line-height: 1;
  color: #050611;
  text-decoration: none;
  border: 1px solid #050611;
  background: #fff;
}

.cat-card__subs a::after {
  content: none;
}

.cat-card__subs a:hover {
  color: #d93434;
  border-color: #d93434;
}

.cat-layout {
  display: grid;
  grid-template-columns: 260px minmax(0, 1fr);
  gap: 32px 40px;
  align-items: start;
}

/*
 * Live category Zero Block @1440:
 * sidebar ~265 (x120→385). Subcat plates at x528 → gap ≈143.
 * Product plates (240) at x432 → gap ≈47 — override via :has(.product-tiles).
 */
.catalog-page--category .cat-layout {
  grid-template-columns: calc(221 * var(--w)) minmax(0, 1fr);
  column-gap: calc(119 * var(--w));
  row-gap: 32px;
}

/* Leaf product listing: Live left=360 → x432, not subcategory gap */
.catalog-page--category:has(.product-tiles) .cat-layout {
  column-gap: calc(39 * var(--w));
}

.cat-side {
  display: grid;
  gap: 4px;
  position: sticky;
  top: calc(75 * var(--w));
  align-self: start;
  z-index: 5;
  max-height: calc(100vh - (75 * var(--w)) - 16px);
  overflow-y: auto;
  overscroll-behavior: contain;
}

.cat-side__link {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  min-height: 44px;
  padding: 8px 12px 8px 14px;
  border-left: 0;
  /* Tilda sidebar label: 11 / Roboto / #050611 / lh 1.25 */
  color: #050611;
  text-decoration: none;
  font-size: calc(11 * var(--w));
  line-height: 1.25;
  font-weight: 400;
}

.cat-side__link img {
  width: 22px;
  height: 22px;
  object-fit: contain;
  filter: none;
}

.cat-side__link:hover {
  background: #f7f8f9;
  color: #050611;
}

/* Live active: grey fill + brand red text/icon */
.cat-side__link.is-active {
  background: #f1f3f5;
  color: #d93434;
  font-weight: 400;
}

.cat-side__link.is-active img {
  filter: brightness(0) saturate(0.93) invert(0.22) sepia(1) saturate(10) hue-rotate(-29deg) brightness(1.35);
}

.cat-main {
  min-width: 0;
}

/* legacy tiles (product listing pages) */
.cat-tiles {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
}

.cat-tile {
  display: flex;
  flex-direction: column;
  border: 1px solid #e4e7eb;
  background: #fff;
  color: inherit;
  text-decoration: none;
  min-height: 100%;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.cat-tile:hover {
  border-color: #d93434;
  box-shadow: 0 8px 24px rgba(5, 6, 17, 0.06);
}

.cat-tile__media {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 180px;
  padding: 28px;
  background: #f1f3f5;
}

.cat-tile__media img {
  max-height: 110px;
  width: auto;
}

.cat-tile__body {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 18px 20px;
  border-top: 1px solid #e4e7eb;
}

.cat-tile__title {
  font-size: 16px;
  font-weight: 700;
  line-height: 1.3;
}

.cat-tile__go {
  flex: 0 0 auto;
  font-size: 14px;
  font-weight: 500;
  color: #d93434;
}

.subcat-grid,
.product-tiles {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  /* Live product plates: 240 wide, ~7px gutters between (360→607→854) */
  gap: calc(40 * var(--w)) calc(7 * var(--w));
  margin-bottom: 40px;
}

/* Category children (e.g. /kabelenesushie-sistemi): Live Zero Block plates 323×225, gutter 14, row 78 */
.catalog-page--category .subcat-grid {
  grid-template-columns: repeat(2, calc(323 * var(--w)));
  justify-content: start;
  column-gap: calc(14 * var(--w));
  row-gap: calc(78 * var(--w));
  margin-bottom: calc(40 * var(--w));
}

.catalog-page--category .subcat-card {
  width: calc(323 * var(--w));
  max-width: 100%;
}

.catalog-page--category .subcat-card__visual {
  width: 100%;
  /* Live shape 323×225 @1200 → ~388×270 @1440 (not fluid 1fr ~446×418) */
  aspect-ratio: 323 / 225;
}

.catalog-page--category .subcat-card__title {
  /* Live title: 15px × artboard scale → calc(15 * --w) @desktop */
  font-size: calc(15 * var(--w));
  line-height: calc(23.25 * var(--w));
}

.catalog-page--category .subcat-card__deco {
  /* Live plate art is 332×225 on 323×225 shape — cover from top-left keeps cut + arcs */
  object-fit: cover;
  object-position: left top;
}

.product-tiles--3 {
  grid-template-columns: repeat(3, calc(240 * var(--w)));
  justify-content: start;
  column-gap: calc(7 * var(--w));
  row-gap: calc(40 * var(--w));
}

.subcat-card,
.product-tile {
  display: flex;
  flex-direction: column;
  color: inherit;
  text-decoration: none;
  border: 0;
  background: transparent;
}

.subcat-card__visual,
.product-tile__visual {
  position: relative;
  display: block;
  width: 100%;
  height: auto;
  /* Live gray plate (shape) ≈ 240×225 @1200 — nearly square, not 4:3 media */
  aspect-ratio: 240 / 225;
  background: #f8f8f8;
  overflow: hidden;
}

.subcat-card__deco,
.product-tile__deco {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  /* Live plate SVGs: cover from top-left — fill/center warps designer arcs */
  object-fit: cover;
  object-position: left top;
  pointer-events: none;
  z-index: 0;
}

.subcat-card__media {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  padding: 0;
  background: transparent;
  mix-blend-mode: multiply;
}

.product-tile__media {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  padding: 0;
  background: transparent;
  mix-blend-mode: multiply;
}

.subcat-card__media img,
.product-tile__media img {
  width: auto;
  height: auto;
  /* Live catalog tiles fill most of the gray plate (not a tiny inset). */
  max-width: 88%;
  max-height: 82%;
  object-fit: contain;
  /* No border/outline — white stroke comes from PNG plate; multiply removes it. */
  border: 0;
  outline: 0;
  box-shadow: none;
  background: transparent;
}

.subcat-card__go,
.product-tile__go {
  position: absolute;
  right: 0;
  bottom: 0;
  z-index: 2;
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  /* Live «Перейти» 144×55 @1200 — slanted corner like home pcard */
  width: calc(144 * var(--w));
  height: calc(55 * var(--w));
  padding: 0 calc(14 * var(--w)) 0 calc(40 * var(--w));
  border: 0;
  font-size: calc(12 * var(--w));
  font-weight: 400;
  line-height: 1;
  color: #fff;
  background: #d93434;
  clip-path: polygon(30% 0, 100% 0, 100% 100%, 0 100%);
  /* Touch / coarse pointer: always visible (no hover flicker) */
  opacity: 1;
  transform: none;
}

@media (hover: hover) and (pointer: fine) {
  .subcat-card__go,
  .product-tile__go {
    opacity: 0;
    transform: translateY(8px);
    transition: opacity 0.2s ease, transform 0.2s ease;
  }

  .subcat-card:hover .subcat-card__go,
  .subcat-card:focus-within .subcat-card__go,
  .product-tile:hover .product-tile__go,
  .product-tile:focus-within .product-tile__go {
    opacity: 1;
    transform: translateY(0);
  }
}

.subcat-card__title,
.product-tile__title {
  display: block;
  margin: calc(18 * var(--w)) 0 0;
  padding: 0;
  /*
   * Live Zero-Block: 15px CSS × scale 1.2 @1440 → 18px on screen.
   * Use --w (not --u) so desktop matches Live effective size.
   */
  font-size: calc(15 * var(--w));
  font-weight: 600;
  line-height: calc(23.25 * var(--w));
  color: #050611;
}

.cat-copy {
  position: relative;
  margin-top: calc(36 * var(--w));
  padding: calc(50 * var(--w)) calc(30 * var(--w)) calc(36 * var(--w));
  min-height: calc(183 * var(--w));
  box-sizing: border-box;
  /* Live plate grows with copy; do not clip overflowing paragraphs */
  overflow: visible;
  color: #222328;
  font-size: calc(11 * var(--w));
  line-height: 1.55;
}

.cat-copy__bg {
  position: absolute;
  inset: 0;
  /* Live shape: seo.svg only (gray fill + white notch). */
  background-color: transparent;
  /* Stretch plate to the content box so long intros stay inside the gray area */
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  pointer-events: none;
}

.cat-copy__grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: calc(12 * var(--w)) calc(45 * var(--w));
  align-items: start;
  max-width: calc(720 * var(--w));
}

.cat-copy__title {
  margin: 0 0 calc(10 * var(--w));
  font-size: calc(20 * var(--w));
  font-weight: 600;
  line-height: 1;
  color: #050611;
}

.cat-copy__text,
.cat-copy__extra {
  margin: 0;
}

.cat-copy__extra {
  position: relative;
  z-index: 1;
  margin-top: calc(14 * var(--w));
  max-width: calc(720 * var(--w));
}

.cat-copy p {
  margin: 0;
}

.catalog-page .breadcrumbs,
.product-page .breadcrumbs {
  font-size: calc(11 * var(--w));
}

.product-top {
  /* Clear fixed header (Live H1 ≈180 @1440 with overlay header ≈90) */
  padding: calc(75 * var(--w) + 42px) 0 40px;
  position: relative;
}

.product-layout--store {
  display: grid;
  /*
   * Gallery narrower than Live (~564) so SKU names stay on one line.
   * @1440: gallery ≈444, gap 28 → copy ≈728.
   */
  grid-template-columns: minmax(0, 1fr) minmax(0, calc(370 * var(--w)));
  grid-template-rows: auto;
  gap: 0 28px;
  align-items: start;
}

/* Zero-Block order products (platforms / stairs): gallery left, copy right */
.product-layout--order {
  display: grid;
  grid-template-columns: minmax(0, calc(420 * var(--w))) minmax(0, 1fr);
  grid-template-rows: auto;
  gap: 0 36px;
  align-items: start;
}

.product-layout--order .prod-gallery {
  grid-column: 1;
  grid-row: 1;
  position: sticky;
  top: calc(90 * var(--w));
  max-width: 100%;
  min-width: 0;
}

.product-layout--order .product-copy {
  grid-column: 2;
  grid-row: 1;
  min-width: 0;
}

.product-layout--order .product-copy__title {
  white-space: normal;
  line-height: 1.2;
  min-height: 0;
}

.product-layout--order .prod-gallery__nav--prev { left: 0; }
.product-layout--order .prod-gallery__nav--next { right: 0; }

.product-layout--order .prod-gallery__slide {
  padding: 20px 52px;
}

.product-summary--order {
  margin-top: 12px;
}

.product-summary--order .product-summary__text {
  margin: 0 0 24px;
  font-size: 15px;
  line-height: 1.45;
  color: #050611;
}

.order-cards {
  display: flex;
  flex-direction: column;
  gap: calc(48 * var(--w));
  width: 100%;
  min-width: 0;
}

.order-card {
  display: grid;
  grid-template-columns: minmax(0, calc(420 * var(--w))) minmax(0, 1fr);
  gap: 0 36px;
  align-items: start;
}

.order-card__gallery {
  min-width: 0;
}

.order-card__gallery .prod-gallery {
  margin-bottom: 47px;
}

.order-card__gallery .prod-gallery__nav--prev { left: 0; }
.order-card__gallery .prod-gallery__nav--next { right: 0; }

.order-card__gallery .prod-gallery__slide {
  padding: 20px 52px;
}

.order-card__copy {
  min-width: 0;
  padding-top: 8px;
}

.order-card__title {
  margin: 0 0 16px;
  font-size: 30px;
  line-height: 1.2;
  font-weight: 600;
  color: #050611;
}

.order-card__title a {
  color: inherit;
  text-decoration: none;
}

.order-card__title a:hover {
  color: #d93434;
}

.order-card__text {
  margin: 0 0 28px;
  font-size: 15px;
  line-height: 1.45;
  color: #050611;
}

.order-card__cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 160px;
  height: 48px;
  padding: 0 28px;
  box-sizing: border-box;
  background: #d93434;
  color: #fff;
  font-size: 16px;
  font-weight: 600;
  line-height: 1;
  text-decoration: none;
  border: 0;
}

.order-card__cta:hover {
  background: #bf2e2e;
  color: #fff;
}

/* Live: crumbs @132 (~16px), H1+gallery @180 — crumbs above grid, gallery aligns with H1 */
.product-top > .breadcrumbs {
  margin: 0 0 32px;
  padding-left: calc(100 * var(--w));
  padding-right: calc(100 * var(--w));
  box-sizing: border-box;
  flex-wrap: wrap;
  overflow: visible;
  white-space: normal;
  max-height: none;
  line-height: 16px;
  gap: 6px;
}

.product-layout--store .prod-gallery {
  grid-column: 2;
  grid-row: 1;
  position: sticky;
  top: calc(90 * var(--w));
  width: 100%;
  max-width: calc(370 * var(--w));
  min-width: 0;
  justify-self: end;
  z-index: 1;
}

.product-layout--store .product-copy {
  grid-column: 1;
  grid-row: 1;
  min-width: 0;
  max-width: 100%;
  position: relative;
  z-index: 2;
}

.product-copy__title {
  margin: 0 0 16px;
  /* Live H1 computed 30px @1440 (not 30*--w); box ≈36 */
  font-size: 30px;
  line-height: 30px;
  min-height: 36px;
  font-weight: 600;
  color: #050611;
}

.sku-table-wrap {
  /* overflow-x:auto creates a scrollport and breaks viewport sticky (live .table-head) */
  overflow: visible;
  margin-bottom: 0;
  max-width: 100%;
  min-width: 0;
}

.sku-table-wrap--grouped {
  margin-top: 8px;
}

.sku-table-group__title {
  margin: 28px 0 14px;
  padding: 0;
  font-size: 18px;
  line-height: 1.25;
  font-weight: 700;
  color: #050611;
}

.sku-table-group__title:first-child {
  margin-top: 0;
}

.sku-table {
  width: 100%;
  max-width: 100%;
  /* collapse breaks position:sticky on thead in most browsers */
  border-collapse: separate;
  border-spacing: 0;
  /* Live store card title/meta = 12px CSS; desktop scaled below */
  font-size: 12px;
  line-height: normal;
}

.sku-table--store {
  /* nowrap columns were ~662px in a ~596px copy column → + overlapped gallery */
  table-layout: fixed;
}

.sku-table--store thead th:nth-child(1),
.sku-table--store .sku-art {
  width: 96px;
}

.sku-table--store thead th:nth-child(2),
.sku-table--store .sku-name {
  width: auto;
}

.sku-table--store thead th:nth-child(3),
.sku-table--store .sku-dims {
  width: 140px;
}

.sku-table--store thead th:nth-child(4),
.sku-table--store .sku-mass {
  width: 96px;
}

.sku-table--store thead th:nth-child(5),
.sku-table--store .sku-action {
  width: 72px;
}

@media (min-width: 1200px) {
  .sku-table {
    /*
     * Live store typography: 12px CSS + rec zoom ≈1.166 @1440 → ~14px on screen.
     * Match with --w (100vw/1200): 12*1.2 = 14.4 @1440.
     */
    font-size: calc(12 * var(--w));
  }

  .product-note {
    font-size: calc(14 * var(--w));
  }
}

.sku-table th,
.sku-table td {
  /* Live .t-store__card padding 5px 10px; row ≈ 54.5 @1440 */
  padding: 5px 10px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  text-align: left;
  vertical-align: middle;
}

.product-note {
  margin: 0;
  min-height: 39px;
  padding: 15px 0 0;
  font-size: 14px;
  line-height: 1.4;
  font-weight: 400;
  color: #050611;
  box-sizing: border-box;
}

.sku-table--store thead th {
  position: sticky;
  top: calc(75 * var(--w));
  z-index: 40;
  /* Live .table-head ≈ 59px with padding 10px */
  padding: 10px 8px;
  font-weight: 700;
  color: #000;
  background: #ededed;
  white-space: normal;
  overflow: visible;
  line-height: 1.2;
  text-align: center;
  border-bottom: 2px solid #d93434;
}

.sku-table--store tbody tr {
  height: 54.5px;
}

@media (min-width: 1200px) {
  .sku-table--store tbody tr {
    /* Live store rows scale with desktop artboard; 54.5px @1440 (--w=1.2) */
    height: calc(45.4167 * var(--w));
  }
}

.sku-table--store tbody tr:nth-child(even) {
  background: #f6f6f6;
}

.sku-table--store tbody tr:nth-child(odd) {
  background: #fff;
}

.sku-table--store tbody td {
  background: inherit;
  font-weight: 400;
}

.sku-table--store .sku-art {
  color: #8a8b90;
  white-space: nowrap;
  text-align: center;
}

.sku-table--store .sku-name {
  min-width: 0;
  font-weight: 400;
  /* Single line; width comes from narrower gallery + tighter dims/mass cols */
  color: #050611;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.sku-table--store .sku-name a {
  color: #050611;
  text-decoration: none;
}

.sku-table--store .sku-name a:hover {
  color: #d93434;
}

.sku-table--store .sku-dims,
.sku-table--store .sku-mass {
  white-space: nowrap;
  font-weight: 400;
  overflow: hidden;
  text-overflow: ellipsis;
  text-align: center;
  color: #8a8b90;
}

.sku-table--store .sku-action {
  text-align: right;
  padding-right: 28px;
}

.sku-add {
  /* Live ::before Frame_322.svg — red square + white plus */
  box-sizing: border-box;
  display: inline-block;
  width: 20px;
  height: 20px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent
    url("../../images/tild3334-6461-4835-a466-393464303433__frame_322.svg")
    center / contain no-repeat;
  color: transparent;
  font-size: 0;
  line-height: 0;
  overflow: hidden;
  cursor: pointer;
  vertical-align: middle;
  filter: saturate(1.25) contrast(1.2) brightness(1.08);
}

@media (min-width: 1200px) {
  .sku-add {
    width: calc(20 * var(--w));
    height: calc(20 * var(--w));
  }
}

.sku-add:hover {
  opacity: 0.85;
}

.prod-gallery {
  position: relative;
  max-width: 100%;
  min-width: 0;
  /* Live bullets absolute below media (~47px); keep wrapper height = media only */
  margin-bottom: 47px;
  box-sizing: border-box;
}

.prod-gallery__viewport {
  position: relative;
  width: 100%;
  max-width: 100%;
  background: #fff;
  /* Live desktop t-slds ≈ 564×325 */
  aspect-ratio: 564 / 325;
  overflow: hidden;
}

.prod-gallery__track {
  display: flex;
  width: 100%;
  height: 100%;
  transition: transform 0.45s ease;
  will-change: transform;
}

.prod-gallery__slide {
  display: flex;
  flex: 0 0 100%;
  width: 100%;
  height: 100%;
  margin: 0;
  align-items: center;
  justify-content: center;
  /* Horizontal room for 48px edge arrows so they don't cover the photo */
  padding: 28px 56px;
  box-sizing: border-box;
}

.prod-gallery__slide.is-active {
  display: flex;
}

.prod-gallery__slide img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  mix-blend-mode: multiply;
  border: 0;
  outline: 0;
  background: transparent;
}

.prod-gallery__nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 2;
  width: 48px;
  height: 48px;
  border: 0;
  background: #d93434;
  color: #fff;
  font-size: 32px;
  line-height: 1;
  cursor: pointer;
}

.prod-gallery__nav--prev { left: 0; }
.prod-gallery__nav--next { right: 0; }

@media (prefers-reduced-motion: reduce) {
  .prod-gallery__track {
    transition: none;
  }
}

/* Live .t-slds__bullet_wrapper: position absolute, does not grow media height */
.prod-gallery__dots {
  position: absolute;
  left: 0;
  right: 0;
  top: 100%;
  z-index: 10;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  margin: 0;
  padding-top: 16px;
  height: 31px;
  box-sizing: content-box;
}

.prod-gallery__dot {
  width: 8px;
  height: 8px;
  border: 1px solid #050611;
  border-radius: 50%;
  background: #fff;
  padding: 0;
  cursor: pointer;
}

.prod-gallery__dot.is-active {
  background: #050611;
}

.product-tabs-section {
  padding: 0 0 48px;
}

.product-tabs__nav {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 20px;
  border-bottom: 1px solid #e4e7eb;
}

.product-tabs__nav button {
  min-height: 40px;
  padding: 8px 16px;
  border: 0;
  border-bottom: 2px solid transparent;
  background: transparent;
  color: #505156;
  font-size: 14px;
  cursor: pointer;
  margin-bottom: -1px;
}

.product-tabs__nav button.is-active {
  color: #d93434;
  border-bottom-color: #d93434;
}

.product-tabs__panel {
  display: none;
}

.product-tabs__panel.is-active {
  display: grid;
}

.product-docs-section {
  /* Live #rec1897135151 pad 0 */
  padding: 0;
}

.product-docs-section__title {
  margin: 0 0 calc(20 * var(--w));
  font-size: calc(20 * var(--w));
  font-weight: 600;
  line-height: 1.2;
  color: #050611;
}

.product-doc-grid {
  display: flex;
  flex-wrap: wrap;
  gap: calc(10 * var(--w)) calc(20 * var(--w));
}

.product-doc-card {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: calc(4 * var(--w));
  width: calc(190 * var(--w));
  min-height: calc(57 * var(--w));
  padding: calc(10 * var(--w));
  border: 0;
  background: #f1f3f5;
  text-decoration: none;
  color: inherit;
  box-sizing: border-box;
}

.product-doc-card:hover {
  background: #e9ecef;
}

.product-doc-card__name {
  max-width: calc(128 * var(--w));
  font-size: calc(11 * var(--w));
  line-height: 1.35;
  color: #050611;
}

.product-doc-card__meta {
  font-size: calc(10 * var(--w));
  line-height: 1.3;
  color: #8a8b90;
}

.product-doc-card__icon {
  position: absolute;
  right: calc(10 * var(--w));
  top: 50%;
  bottom: auto;
  transform: translateY(-50%);
  width: calc(21 * var(--w));
  height: calc(21 * var(--w));
}

.related-section {
  /* Live #rec1204219616 pad 30/60; +16 closes residual desktop body Δ */
  padding: 30px 0 76px;
  overflow: hidden;
  max-width: 100%;
}

.related-section > .container {
  /* Full-bleed carousel: cancel site side padding so cards touch viewport edges */
  padding-left: 0;
  padding-right: 0;
  overflow: hidden;
  min-width: 0;
  max-width: none;
  width: 100%;
  box-sizing: border-box;
}

.related-section__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: calc(16 * var(--w)) calc(24 * var(--w));
  /* Live title row ≈ 93px then items flush below */
  min-height: 93px;
  margin-bottom: 0;
  /* Title/arrows stay on content rail; cards go edge-to-edge */
  padding-left: calc(100 * var(--w));
  padding-right: calc(100 * var(--w));
  box-sizing: border-box;
}

.related-section h2 {
  margin: 0;
  font-size: calc(32 * var(--w));
  font-weight: 700;
  line-height: 1.2;
  color: #050611;
}

.related-section__controls {
  display: inline-flex;
  gap: 0;
  flex: 0 0 auto;
}

.related-section--no-scroll .related-section__controls {
  display: none;
}

.related-section__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: calc(40 * var(--w));
  height: calc(40 * var(--w));
  padding: 0;
  border: 0;
  background: #d93434;
  color: #fff;
  cursor: pointer;
}

.related-section__btn:hover {
  background: #c22e2e;
}

.related-section__btn svg {
  width: 100%;
  height: 100%;
  display: block;
}

.related-carousel {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

.related-carousel__viewport {
  overflow: hidden;
  width: 100%;
  max-width: 100%;
  min-width: 0;
}

.related-carousel__track {
  display: flex;
  gap: calc(20 * var(--w));
  overflow-x: auto;
  scroll-behavior: smooth;
  scroll-snap-type: x mandatory;
  -ms-overflow-style: none;
  scrollbar-width: none;
  margin: 0;
  padding: 0;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

.related-section--no-scroll .related-carousel__viewport,
.related-section--no-scroll .related-carousel__track {
  overflow: hidden;
}

.related-carousel__track::-webkit-scrollbar {
  display: none;
}

.related-card {
  display: flex;
  /* Live artboard 240×160, window-upscaled via --w so cards grow with viewport */
  flex: 0 0 calc(240 * var(--w));
  width: calc(240 * var(--w));
  flex-direction: column;
  scroll-snap-align: start;
  text-decoration: none;
  color: inherit;
  border: 0;
  padding: 0;
  background: transparent;
  position: relative;
  box-sizing: border-box;
}

.related-card__visual {
  display: block;
  width: 100%;
  height: calc(160 * var(--w));
  background: #f8f8f8;
  overflow: hidden;
  position: relative;
}

.related-card__deco {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 0;
}

.related-card__deco svg {
  display: block;
  width: 100%;
  height: 100%;
}

.related-card__media {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  padding: 0;
  background: transparent;
  mix-blend-mode: multiply;
}

.related-card__media img {
  width: auto;
  height: auto;
  max-width: 72%;
  max-height: 68%;
  object-fit: contain;
  border: 0;
  outline: 0;
  box-shadow: none;
  background: transparent;
}

.related-card__body {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0;
  padding-top: calc(10 * var(--w));
  min-height: calc(51 * var(--w));
  box-sizing: border-box;
}

.related-card__title {
  font-size: calc(15 * var(--w));
  font-weight: 400;
  line-height: 1.35;
  color: #050611;
}

.related-card__go {
  /* Live .t-card__btn: bottom-right, slanted, hidden until hover @≥1199 */
  position: absolute;
  right: 0;
  bottom: 0;
  z-index: 2;
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: calc(48 * var(--w));
  padding: calc(12 * var(--w)) calc(30 * var(--w));
  border: 0;
  font-size: calc(11 * var(--w));
  font-weight: 400;
  line-height: 1;
  color: #fff;
  background: #d93434;
  text-decoration: none;
  text-indent: calc(10 * var(--w));
  clip-path: polygon(20% 0, 100% 0, 100% 100%, 0 100%);
  opacity: 1;
  pointer-events: auto;
}

@media (hover: hover) and (pointer: fine) {
  .related-card__go {
    opacity: 0;
    transition: opacity 0.2s ease;
    pointer-events: none;
  }

  .related-card:hover .related-card__go,
  .related-card:focus-within .related-card__go {
    opacity: 1;
    pointer-events: auto;
  }
}

@media (max-width: 1198px) {
  .related-card__go {
    opacity: 1;
    pointer-events: auto;
  }
}

/* Stage 16I: related cards window-upscale; carousel full-bleed to viewport edges */
@media (min-width: 1200px) {
  .related-section {
    padding: calc(25 * var(--w)) 0 calc(63.333 * var(--w));
  }

  .related-section__head {
    min-height: calc(77.5 * var(--w));
  }

  .related-card {
    flex: 0 0 calc(240 * var(--w));
    width: calc(240 * var(--w));
  }

  .related-card__visual {
    width: 100%;
    height: calc(160 * var(--w));
  }

  .related-card__body {
    padding-top: calc(10 * var(--w));
    min-height: calc(51 * var(--w));
  }

  .product-accordion__trigger {
    min-height: calc(55 * var(--w));
    padding: calc(12.5 * var(--w)) 0;
  }
}

.product-accordion-section {
  padding: calc(15 * var(--w)) 0 calc(30 * var(--w));
}

.category-accordion-section {
  /* Live: full content width under sidebar + main (sibling of .cat-layout) */
  padding-top: calc(24 * var(--w));
  max-width: 100%;
}

/* Live open panel: two ~588px columns @1440, gutter ~18 */
.category-accordion__cols {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: calc(18 * var(--w));
  align-items: start;
}

.category-accordion__col > *:first-child {
  margin-top: 0;
}

.category-accordion__col > *:last-child {
  margin-bottom: 0;
}

.category-accordion__col p {
  margin: 0 0 0.85em;
}

.category-accordion__col p:last-child {
  margin-bottom: 0;
}

.product-accordion {
  border-top: 1px solid #e4e7eb;
}

.product-accordion__item {
  border-bottom: 1px solid #e4e7eb;
}

.product-accordion__title {
  font-size: calc(20 * var(--w));
  font-weight: 600;
  line-height: calc(20 * var(--w));
  color: #050611;
}

.product-accordion__trigger {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: calc(16 * var(--w));
  width: 100%;
  /* Live heading artboard ≈ 66px @1440 (pad 15+15 + title) */
  min-height: 66px;
  padding: 15px 0;
  border: 0;
  background: transparent;
  cursor: pointer;
  text-align: left;
  font: inherit;
  color: inherit;
}

.product-accordion__icon {
  width: calc(23 * var(--w));
  height: calc(23 * var(--w));
  flex: 0 0 auto;
  transition: transform 0.2s ease;
}

.product-accordion__item.is-open .product-accordion__icon {
  transform: rotate(180deg);
}

.product-accordion__panel {
  display: none;
  padding: 0 0 calc(20 * var(--w));
  font-size: calc(12 * var(--w));
  line-height: 1.55;
  color: #050611;
}

.product-accordion__item.is-open .product-accordion__panel {
  display: block;
}

.product-accordion__panel[hidden] {
  display: none !important;
}

.product-chars-section {
  padding: calc(20 * var(--w)) 0 calc(40 * var(--w));
}

.product-chars,
.product-dims {
  margin: 0;
}

.product-chars__row,
.product-dims__row {
  display: grid;
  grid-template-columns: minmax(0, 0.4fr) minmax(0, 0.6fr);
  gap: calc(12 * var(--w)) calc(24 * var(--w));
  padding: calc(10 * var(--w)) 0;
  border-bottom: 1px solid #e4e7eb;
}

.product-chars__row dt,
.product-dims__row dt {
  margin: 0;
  font-size: calc(12 * var(--w));
  font-weight: 500;
  color: #050611;
}

.product-chars__row dd,
.product-dims__row dd {
  margin: 0;
  font-size: calc(12 * var(--w));
  color: #505156;
}

.product-questions-section {
  /* Live #rec831462623 pad 30/75 desktop */
  padding: 30px 0 75px;
}

.contacts-form-panel--product {
  position: relative;
  overflow: visible;
  min-height: calc(313 * var(--w));
  background-color: transparent;
  background-image: url("../../images/tild3437-3632-4334-b635-323037313661__frame_15.svg");
  background-position: center;
  background-size: 100% 100%;
  background-repeat: no-repeat;
}

.contacts-form-panel--product .contacts-form-panel__pattern {
  display: none;
}

.product-questions-section .contacts-form__field input,
.product-questions-section .contacts-form__field textarea {
  background: #fff;
  border: 1px solid #d8dce2;
}

.contacts-form-panel--product .contacts-form-intro,
.contacts-form-panel--product .contacts-form {
  position: relative;
  z-index: 1;
}

.product-questions-section .contacts-form__submit {
  min-width: calc(120 * var(--w));
  border: 1px solid #d93434;
  background: transparent;
  color: #d93434;
}

.product-questions-section .contacts-form__submit:hover {
  background: #d93434;
  color: #fff;
}

@media (max-width: 1199px) {
  .catalog-page .page-hero,
  .product-page .page-hero {
    padding-top: calc(48 * var(--w));
  }

  .catalog-page .page-hero .breadcrumbs,
  .product-page .page-hero .breadcrumbs {
    margin-bottom: calc(20 * var(--w));
    font-size: calc(14 * var(--w));
    line-height: 1.3;
  }

  .catalog-page .page-hero h1,
  .product-page .page-hero h1 {
    font-size: calc(30 * var(--w));
    line-height: calc(30 * var(--w));
  }

  .cat-section {
    /* Live catalog grid board 3960@320 — pad tracks mobile artboard */
    padding-top: calc(33 * 100vw / 320);
    padding-bottom: calc(49 * 100vw / 320);
  }

  .cat-tiles,
  .cat-grid,
  .product-tiles,
  .product-tiles--3,
  .cat-layout {
    grid-template-columns: 1fr;
  }

  /*
   * Desktop category rule (.catalog-page--category .cat-layout → 221*--w + 1fr)
   * beats the generic .cat-layout { 1fr } above. On ≤1199 --w is mobile artboard
   * (100vw/390), so 221*--w ≈ 221px and with .cat-side { display:none } .cat-main
   * lands in that first track — cards/copy/accordion all squeeze and clip.
   */
  .catalog-page--category .cat-layout,
  .catalog-page--category:has(.product-tiles) .cat-layout {
    grid-template-columns: 1fr;
    column-gap: 0;
  }

  .category-accordion__cols {
    grid-template-columns: 1fr;
    row-gap: calc(16 * var(--w));
  }

  .cat-grid {
    /* Live card pitch ~357@320 → ~435@390 */
    row-gap: calc(67 * 100vw / 320);
    column-gap: 0;
  }

  .catalog-page:not(.catalog-page--category) .cat-section {
    /* residual tuned per-VP below */
    margin-bottom: 0;
  }

  /* Category children: Live 1200@320 board, always 1-col under 1200 */
  .catalog-page--category .subcat-grid {
    grid-template-columns: minmax(0, 1fr);
    gap: calc(48 * 100vw / 320);
    min-height: 0;
  }

  .catalog-page--category .subcat-card {
    width: 100%;
  }

  .catalog-page--category .subcat-card__visual {
    height: auto;
    aspect-ratio: 323 / 225;
  }

  .catalog-page--category .subcat-card__title {
    font-size: 15px;
  }

  .catalog-page--category .cat-copy {
    min-height: calc(270 * 100vw / 320);
    margin-top: calc(20 * 100vw / 320);
    padding: calc(23 * 100vw / 320) calc(15 * 100vw / 320);
    /* Mobile: solid plate — stretched seo.svg warps the white notch across the text */
    background-color: #f8f8f8;
  }

  .catalog-page--category .cat-copy__bg {
    background-image: none !important;
    background-color: transparent;
  }

  .catalog-page--category {
    overflow-x: clip;
  }

  .subcat-grid {
    grid-template-columns: 1fr;
    gap: calc(28 * var(--w));
    margin-bottom: calc(28 * var(--w));
  }

  .cat-card--wide {
    grid-column: auto;
  }

  /*
   * Live Zero Block card frame ≈225@320 (→274@390), not desktop 225@1200.
   * Using desktop 225 * --scale-mobile left cards ~25% short.
   */
  .cat-card__media {
    height: calc(225 * 100vw / 320);
  }

  .cat-card__go {
    width: calc(144 * 100vw / 320);
    height: calc(55 * 100vw / 320);
    font-size: calc(12 * 100vw / 320);
    opacity: 1;
    transform: none;
  }

  .cat-card__title {
    margin: calc(15 * 100vw / 320) 0 0;
    font-size: calc(15 * 100vw / 320);
    line-height: calc(23 * 100vw / 320);
  }

  .cat-card__subs {
    margin: calc(11 * 100vw / 320) 0 0;
    gap: calc(7 * 100vw / 320) calc(8 * 100vw / 320);
  }

  .cat-card__subs a {
    min-height: 24px;
    height: 24px;
    font-size: 10px;
    line-height: 1;
    padding: 0 8px;
  }

  /* Live mobile/tablet: sidebar не в потоке */
  .cat-side {
    display: none;
  }

  .catalog-page--category .cat-hero-row {
    align-items: stretch;
    flex-direction: column;
    gap: calc(13 * 100vw / 320);
  }

  .catalog-page--category .cat-pdfs {
    display: flex;
    flex-direction: column;
    gap: calc(11 * 100vw / 320);
    width: 100%;
  }

  .catalog-page--category .cat-pdf {
    font-size: calc(14 * 100vw / 320);
    line-height: 1.25;
    margin-top: 0;
    width: 100%;
    border: 1px solid #d93434;
    padding: calc(11 * 100vw / 320) calc(13 * 100vw / 320);
    min-height: calc(36 * 100vw / 320);
    justify-content: flex-start;
    gap: calc(8 * 100vw / 320);
    color: #d93434;
    white-space: normal;
  }

  .catalog-page--category .cat-pdf img {
    width: calc(13 * 100vw / 320);
    height: calc(13 * 100vw / 320);
    flex: 0 0 auto;
    margin-right: 0;
  }

  /* /catalog/ (архив): h1 + PDF в одной строке */
  .catalog-page--category .page-hero h1 {
    max-width: min(100%, calc(295 * 100vw / 320));
  }

  .catalog-page:not(.catalog-page--category) .cat-hero-row {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    flex-wrap: nowrap;
    gap: calc(10 * 100vw / 320);
  }

  .catalog-page:not(.catalog-page--category) .cat-hero-row h1 {
    flex: 0 1 auto;
    max-width: 45%;
  }

  .catalog-page:not(.catalog-page--category) .cat-pdf {
    flex: 0 1 auto;
    font-size: calc(14 * 100vw / 320);
    line-height: 1.25;
    margin-top: 0;
    width: auto;
    max-width: 58%;
    border: 1px solid #d93434;
    padding: calc(11 * 100vw / 320) calc(13 * 100vw / 320);
    min-height: calc(36 * 100vw / 320);
    justify-content: flex-start;
    gap: calc(8 * 100vw / 320);
    color: #d93434;
    white-space: normal;
  }

  .catalog-page:not(.catalog-page--category) .cat-pdf img {
    width: calc(13 * 100vw / 320);
    height: calc(13 * 100vw / 320);
    flex: 0 0 auto;
  }

  .cat-tile__title,
  .subcat-card__title,
  .product-tile__title {
    font-size: calc(13 * 100vw / 320);
  }

  .cat-tile__go {
    font-size: calc(11 * 100vw / 320);
  }

  /*
   * Live related block between docs→accordion stays ~fixed (~396px) across tablet;
   * do NOT Zero-Block-scale card geometry (was +540px overshoot @1024).
   */
  .related-section {
    /* Live docs→accordion gap ~396@390, ~418@768 */
    padding: 15px 0 30px;
    min-height: 396px;
    box-sizing: border-box;
  }

  .related-section__head {
    min-height: 81px;
    padding-left: calc(16 * var(--w));
    padding-right: calc(16 * var(--w));
  }

  .related-section h2 {
    font-size: 24px;
  }

  .related-section__btn {
    width: 36px;
    height: 36px;
  }

  .related-card {
    flex-basis: 175px;
    width: 175px;
    flex: 0 0 175px;
  }

  .related-card__visual {
    width: 175px;
    height: 160px;
  }

  .related-card__go {
    right: 0;
    bottom: 0;
    left: auto;
    top: auto;
    transform: none;
    min-height: 40px;
    padding: 10px 20px;
    font-size: 11px;
    opacity: 1;
    pointer-events: auto;
  }

  .related-card__body {
    padding-top: 8px;
    gap: 0;
    min-height: 71px;
  }

  .related-card__title {
    font-size: 14px;
  }

  /* Note follows SKU list — keep top pad so copy does not sit on last row */
  .product-note {
    min-height: 0;
    margin-top: 0;
    padding: 15px 0 0;
    font-size: 14px;
    color: #050611;
  }

  .product-questions-section {
    padding: calc(16 * 100vw / 320) 0 calc(24 * 100vw / 320);
    min-height: 0;
    margin-bottom: 0;
  }

  .contacts-form-panel--product {
    background-color: #f1f3f5;
    background-image: url("../../images/tild3437-3632-4334-b635-323037313661__frame_15.svg");
    background-repeat: no-repeat;
    background-position: left bottom;
    background-size: 140% auto;
    min-height: 0;
    overflow: hidden;
  }

  .product-docs-section {
    padding: 0;
    min-height: calc(180 * 100vw / 320);
  }

  .product-docs-section__title {
    font-size: calc(18 * 100vw / 320);
  }

  .product-doc-card {
    width: calc(170 * 100vw / 320);
    min-height: calc(54 * 100vw / 320);
  }

  .product-doc-card__name {
    max-width: calc(110 * 100vw / 320);
    font-size: calc(12 * 100vw / 320);
  }

  .product-doc-card__meta {
    font-size: calc(11 * 100vw / 320);
  }

  .product-accordion__title {
    font-size: 18px;
  }

  .product-accordion__panel {
    font-size: 14px;
  }

  .product-chars__row,
  .product-dims__row {
    grid-template-columns: 1fr;
    gap: 4px;
  }

  .subcat-card__visual,
  .product-tile__visual {
    height: auto;
    aspect-ratio: 240 / 225;
  }

  .subcat-card__go,
  .product-tile__go {
    width: calc(120 * 100vw / 320);
    height: calc(48 * 100vw / 320);
    font-size: calc(12 * 100vw / 320);
    padding: 0 calc(10 * 100vw / 320) 0 calc(26 * 100vw / 320);
    opacity: 1;
    transform: none;
  }

  .subcat-card__title,
  .product-tile__title {
    margin-top: calc(11 * 100vw / 320);
    font-size: calc(15 * 100vw / 320);
  }

  .cat-copy {
    margin-top: calc(20 * 100vw / 320);
    padding: calc(23 * 100vw / 320) calc(15 * 100vw / 320);
    min-height: 0;
    font-size: calc(14 * 100vw / 320);
    line-height: 1.5;
  }

  .cat-copy__grid {
    grid-template-columns: 1fr;
    gap: calc(11 * 100vw / 320);
    max-width: none;
  }

  .cat-copy__title {
    margin-bottom: calc(7 * 100vw / 320);
    font-size: calc(18 * 100vw / 320);
  }

  .catalog-page .breadcrumbs,
  .product-page .breadcrumbs {
    font-size: 12px;
  }

  .sku-table,
  .product-note {
    font-size: 13px;
  }

  .product-layout--store {
    display: flex;
    flex-direction: column;
    grid-template-columns: none;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
    gap: 0;
  }

  .product-layout--order {
    display: flex;
    flex-direction: column;
    grid-template-columns: none;
    width: 100%;
    gap: 16px;
  }

  .product-layout--store .product-copy {
    min-width: 0;
    max-width: 100%;
    width: 100%;
    overflow-x: clip;
  }

  .order-card {
    grid-template-columns: 1fr;
    gap: 16px;
  }

  .order-card__title {
    font-size: 22px;
  }

  .order-card__cta {
    width: 100%;
  }

  .product-store {
    min-width: 0;
    max-width: 100%;
    width: 100%;
  }

  /*
   * Live @390: crumbs sit just under the 80px header; gallery follows.
   * Do NOT reuse document-Y 205 — body already has header padding-top.
   */
  .product-top {
    position: relative;
    padding-top: calc(12 * var(--w));
    padding-bottom: 24px;
  }

  .product-top > .breadcrumbs {
    position: static;
    top: auto;
    left: auto;
    right: auto;
    margin: 0 0 calc(16 * var(--w));
    padding: 0 calc(16 * var(--w));
    max-width: none;
    max-height: none;
    z-index: 2;
    font-size: 12px;
    line-height: 1.35;
    white-space: normal;
    overflow: visible;
    text-overflow: unset;
    flex-wrap: wrap;
  }

  .product-layout--store .prod-gallery,
  .product-layout--store .product-copy {
    grid-column: auto;
    grid-row: auto;
  }

  .product-top .container.product-layout {
    min-width: 0;
    max-width: 100%;
    padding-left: calc(12 * var(--w));
    padding-right: calc(12 * var(--w));
  }

  .product-copy__title {
    max-width: calc(300 * var(--w));
    font-size: calc(30 * var(--w));
    line-height: calc(30 * var(--w));
    margin: 0 0 calc(18 * 100vw / 320);
  }

  .product-layout--store .prod-gallery {
    position: relative;
    top: auto;
    margin-bottom: calc(20 * var(--w));
    max-width: 100%;
    justify-self: stretch;
  }

  /*
   * Live mobile store: vertical cards (~81px), thead hidden — not wide scrolling table.
   */
  .sku-table-wrap {
    overflow-x: visible;
    max-width: 100%;
    width: 100%;
    min-width: 0;
  }

  .sku-table,
  .sku-table--store {
    display: block;
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }

  .sku-table--store thead {
    display: none;
  }

  .sku-table--store tbody {
    display: block;
    width: 100%;
  }

  .sku-table--store tbody tr {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 44px;
    grid-template-rows: auto auto auto auto;
    column-gap: 10px;
    row-gap: 4px;
    align-items: start;
    height: auto;
    min-height: 0;
    padding: 12px 10px;
    box-sizing: border-box;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  }

  .sku-table--store tbody td {
    display: block;
    padding: 0;
    border: 0;
    white-space: normal;
  }

  .sku-table--store .sku-art {
    grid-column: 1;
    grid-row: 1;
    width: auto;
    max-width: none;
    font-size: 14px;
    line-height: 1.3;
    color: #8a8b90;
    text-align: left;
    white-space: normal;
    overflow: visible;
  }

  .sku-table--store .sku-art::before {
    content: "Артикул: ";
    color: #050611;
  }

  .sku-table--store .sku-name {
    grid-column: 1;
    grid-row: 2;
    min-width: 0;
    font-size: 16px;
    line-height: 1.25;
    font-weight: 600;
    white-space: normal;
    overflow: visible;
    text-overflow: unset;
  }

  .sku-table--store .sku-dims {
    grid-column: 1;
    grid-row: 3;
    width: auto;
    max-width: none;
    font-size: 14px;
    line-height: 1.35;
    font-weight: 400;
    text-align: left;
    color: #8a8b90;
    white-space: normal;
    overflow: visible;
    text-overflow: unset;
  }

  .sku-table--store .sku-dims::before {
    content: "Габариты AxHxL, мм:";
    display: block;
    color: #050611;
  }

  .sku-table--store .sku-mass {
    grid-column: 1;
    grid-row: 4;
    width: auto;
    max-width: none;
    justify-self: start;
    margin-right: 0;
    font-size: 14px;
    line-height: 1.35;
    font-weight: 400;
    text-align: left;
    color: #8a8b90;
    white-space: normal;
    overflow: visible;
    text-overflow: unset;
  }

  .sku-table--store .sku-mass::before {
    content: "Масса, кг/шт:";
    display: block;
    color: #050611;
  }

  .sku-table--store .sku-action {
    grid-column: 2;
    grid-row: 1 / span 4;
    width: auto;
    text-align: center;
    padding: 0 18px 0 0;
    align-self: center;
    justify-self: end;
  }

  .sku-add {
    width: calc(35 * 100vw / 320);
    height: calc(35 * 100vw / 320);
    min-width: 28px;
    min-height: 28px;
    font-size: 0;
  }

  /* Live tab title boards 60@320 — interstitial stays near-fixed (not full Zero-Block) */
  .product-accordion__title {
    font-size: calc(20 * 100vw / 320);
    line-height: calc(20 * 100vw / 320);
    font-weight: 600;
  }

  .product-accordion__item + .product-accordion__item {
    margin-top: 40px;
  }

  .product-accordion__trigger {
    min-height: calc(60 * 100vw / 320);
    padding: calc(10 * 100vw / 320) 0;
  }

  .product-accordion-section {
    padding: calc(10 * 100vw / 320) 0 calc(20 * 100vw / 320);
  }

  .prod-gallery {
    position: relative;
    max-width: 100%;
    min-width: 0;
    width: 100%;
  }

  .prod-gallery__viewport {
    /* Live mobile t-slds ≈ 366×257 @390 */
    aspect-ratio: 366 / 257;
  }

  .prod-gallery__slide {
    padding: 16px;
  }
}

/* Catalog archive residual — Live board 3960@320 vs WP grid shortfall by VP */
@media (max-width: 599px) {
  .catalog-page:not(.catalog-page--category) .cat-section {
    margin-bottom: 69px; /* body was −69@390 */
  }
}

@media (min-width: 400px) and (max-width: 459px) {
  .catalog-page:not(.catalog-page--category) .cat-section {
    margin-bottom: 21px; /* was 69; body was +48@430 */
  }
}

@media (min-width: 600px) and (max-width: 899px) {
  .catalog-page:not(.catalog-page--category) .cat-section {
    margin-bottom: 29px; /* body was −29@768 */
  }
}

@media (min-width: 1000px) and (max-width: 1199px) {
  .catalog-page:not(.catalog-page--category) .cat-section {
    margin-bottom: -21px; /* body was +21@1024 */
  }
}

@media (min-width: 1200px) {
  .catalog-page:not(.catalog-page--category) .cat-section {
    margin-bottom: 68px; /* body was −68@1440 desktop page-local */
  }

  /* Category @1440: Live has ~240px accordion-title band after FRP intro before footer */
  .catalog-page--category .cat-copy {
    margin-bottom: 240px;
  }
}

/* Stage 16I — product extended desktop residuals (1440 remains reference) */
@media (min-width: 1200px) and (max-width: 1359px) {
  .product-page .related-section {
    margin-bottom: -65px; /* body was +72@1280 after store/--w scale */
  }
}

@media (min-width: 1500px) and (max-width: 1799px) {
  .product-page .related-section {
    margin-bottom: -15px; /* body was +21@1600 */
  }
}

@media (min-width: 1800px) {
  .product-page .related-section {
    margin-bottom: -20px; /* body was +26@1920 */
  }
}

/* Category tablet residuals (after 1-col + 1200@320 board pin) */
@media (max-width: 599px) {
  .catalog-page--category .cat-layout {
    margin-bottom: 180px; /* body was −180@390 */
  }
}

@media (min-width: 600px) and (max-width: 899px) {
  .catalog-page--category .cat-layout {
    margin-bottom: 63px; /* body was −63@768 */
  }
}

@media (min-width: 1000px) and (max-width: 1199px) {
  .catalog-page--category .cat-layout {
    margin-bottom: -64px; /* body was +64@1024 */
  }
}

/* Live t-store row height: 81@390 → ~87 from 600–1199 (store 2166→2333) */
@media (min-width: 600px) and (max-width: 1199px) {
  .sku-table--store tbody tr {
    min-height: 87px;
  }

  .related-section {
    min-height: 418px;
  }

  .product-accordion__item + .product-accordion__item {
    margin-top: 52px;
  }

  /* Product form reuses contacts classes — KEEP_FIXED denser panel (was shared contacts rule) */
  .product-page .contacts-form-panel {
    padding: 28px 20px;
    min-height: 0;
    gap: 16px;
  }

  .product-page .contacts-form-intro {
    text-align: left;
  }

  .product-page .contacts-form-intro h2 {
    font-size: 24px;
    margin-bottom: 16px;
    text-align: left;
  }

  .product-page .contacts-form-intro p,
  .product-page .contacts-form__field span {
    font-size: 14px;
  }

  .product-page .contacts-form {
    gap: 10px;
  }
}

@media (min-width: 1000px) and (max-width: 1199px) {
  .product-page .product-questions-section {
    margin-bottom: 0;
  }
}

@media (min-width: 600px) and (max-width: 999px) {
  .product-page .product-questions-section {
    margin-bottom: 0;
  }
}

@media (max-width: 599px) {
  .product-page .product-questions-section {
    margin-bottom: 0;
  }
}

/* @600–999: close Product body under (~−41@768) */
@media (min-width: 600px) and (max-width: 999px) {
  .related-section {
    min-height: 459px;
  }
}

@media (min-width: 1000px) and (max-width: 1199px) {
  .related-section {
    min-height: 396px;
  }

  .product-accordion__item + .product-accordion__item {
    margin-top: 40px;
  }
}

/* Tablet hero pad — category 1-col rules live in max-width:1199 block */
@media (min-width: 421px) and (max-width: 1199px) {
  .catalog-page .page-hero {
    padding-top: calc(82 * 100vw / 320);
  }

  .product-page .page-hero {
    padding-top: calc(82 * 100vw / 320);
  }
}

/* ===== About ===== */
.about-page {
  background: #fff;
}

/* Live artboard @1200→1440: crumbs y132, h1 y210.6, video 576/213/742.8×418.8, text 116.4/319.8/387.6 */
.about-intro {
  padding: calc(35 * var(--w)) 0 calc(70 * var(--w));
  background: #fff;
}

.about-intro > .container > .breadcrumbs {
  margin: 0 0 calc(52 * var(--w));
  gap: calc(6 * var(--w));
  font-size: calc(11 * var(--w));
  line-height: calc(14 * var(--w));
  color: #505156;
}

.about-intro__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) calc(619 * var(--w));
  column-gap: calc(32 * var(--w));
  align-items: start;
  position: relative;
}

.about-intro h1 {
  margin: 0 0 calc(21 * var(--w));
  max-width: calc(349 * var(--w));
  font-size: calc(35 * var(--w));
  font-weight: 600;
  line-height: calc(35 * var(--w));
  color: #050611;
}

.about-intro__text {
  display: grid;
  gap: calc(16 * var(--w));
  max-width: calc(323 * var(--w));
}

.about-intro__text p {
  margin: 0;
  font-size: calc(11 * var(--w));
  line-height: calc(17 * var(--w));
  color: #050611;
}

.about-video {
  position: relative;
  width: calc(619 * var(--w));
  height: calc(349 * var(--w));
  background: #f1f3f5;
  overflow: hidden;
  justify-self: end;
}

.about-video__cover {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  padding: 0;
  border: 0;
  background: #f1f3f5;
  cursor: pointer;
}

.about-video__cover img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  background: #f1f3f5;
}

.about-video__play {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  transition: transform 0.2s ease;
}

.about-video__cover:hover .about-video__play {
  transform: translate(-50%, -50%) scale(1.08);
}

.about-video__frame {
  position: absolute;
  inset: 0;
}

.about-video__frame iframe {
  width: 100%;
  height: 100%;
  border: 0;
}

/*
 * Live About gallery = T1148 horizontal drag/scroll strip.
 * Slides: 4:3, height 500px (≥600) / 350px (≤599).
 */
.about-production {
  padding: 75px 0 0;
}

.about-eyebrow {
  display: block;
  margin: 0 0 20px;
  font-size: calc(12 * var(--w));
  font-weight: 500;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #d93434;
}

.about-gallery {
  position: relative;
  display: block;
  height: 500px;
  overflow: hidden;
  background: #fff;
  cursor: grab;
  touch-action: pan-y;
  user-select: none;
}

.about-gallery.is-dragging {
  cursor: grabbing;
}

.about-gallery__track {
  display: flex;
  align-items: stretch;
  gap: 10px;
  box-sizing: border-box;
  height: 100%;
  width: max-content;
  will-change: transform;
  padding-left: calc(100 * var(--w));
}

.about-gallery__item {
  position: relative;
  flex: 0 0 auto;
  box-sizing: border-box;
  height: 100%;
  aspect-ratio: 4 / 3;
  margin: 0;
  overflow: hidden;
  background: #eef0f2;
}

.about-gallery__item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  pointer-events: none;
  -webkit-user-drag: none;
  user-select: none;
}

.about-stats-section {
  padding: calc(20 * var(--w)) 0 calc(40 * var(--w));
  background: #fff;
}

.about-stats-head {
  position: relative;
  display: flow-root;
  min-height: calc(132 * var(--w));
  margin-bottom: calc(43 * var(--w));
}

.about-stats-head h2 {
  position: relative;
  z-index: 1;
  margin: calc(36 * var(--w)) 0 0;
  padding: 0;
  max-width: calc(296 * var(--w));
  font-size: calc(30 * var(--w));
  font-weight: 700;
  line-height: calc(30 * var(--w));
  color: #050611;
}

.about-capacity {
  position: absolute;
  top: 0;
  right: 0;
  width: calc(741 * var(--w));
  height: calc(132 * var(--w));
  /* Live text left≈466 on 1200 artboard → ~128px inset past red diagonal */
  padding: calc(35 * var(--w)) calc(40 * var(--w)) 0 calc(128 * var(--w));
  box-sizing: border-box;
  background: #d93434;
  color: #fff;
  overflow: visible;
}

.about-capacity::before {
  content: "";
  position: absolute;
  left: calc(-9 * var(--w));
  top: calc(-4 * var(--w));
  width: calc(194 * var(--w));
  height: calc(137 * var(--w));
  background: url("../../images/tild3532-3664-4439-a438-653330643138__rectangle_5.svg") center / 100% 100% no-repeat;
  pointer-events: none;
}

.about-capacity strong {
  display: block;
  position: relative;
  z-index: 1;
  margin-bottom: calc(18 * var(--w));
  /* Live computed 30px @1440 (artboard), not 30*--w */
  font-size: calc(30 * var(--w));
  font-weight: 700;
  line-height: calc(30 * var(--w));
  color: #fff;
  white-space: nowrap;
}

.about-capacity span {
  display: block;
  position: relative;
  z-index: 1;
  width: calc(416 * var(--w));
  margin-left: auto;
  font-size: calc(11 * var(--w));
  line-height: calc(14 * var(--w));
  color: #fff;
  text-align: left;
}

.about-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: calc(40 * var(--w)) calc(24 * var(--w));
}

.about-stat {
  padding: 0;
  background: transparent;
  border: 0;
}

.about-stat strong {
  position: relative;
  display: inline-block;
  margin-bottom: calc(10 * var(--w));
  font-size: calc(30 * var(--w));
  font-weight: 700;
  line-height: 1;
  color: #050611;
  z-index: 0;
}

.about-stat strong::before {
  content: "";
  position: absolute;
  left: 0;
  top: calc(-8 * var(--w));
  width: calc(69 * var(--w));
  height: calc(20 * var(--w));
  background: url("../../images/tild3630-3738-4231-a363-363137306565__rectangle_7.svg") no-repeat center / contain;
  z-index: -1;
}

.about-stat span {
  display: block;
  max-width: calc(313 * var(--w));
  font-size: calc(11 * var(--w));
  line-height: 1.35;
  color: #050611;
}

.about-mission {
  padding: 75px 0 24px;
}

/* Live artboard insets: gray @80, red ends @1100 → 80 / 100 side gaps @1200 */
.about-mission__inner {
  position: relative;
  box-sizing: border-box;
  width: 100%;
  padding-left: calc(80 * var(--w));
  padding-right: calc(100 * var(--w));
}

.about-mission__banner {
  position: relative;
  /* Live red board 680×179 @1200 artboard */
  height: calc(179 * var(--w));
  min-height: 150px;
}

.about-mission__title {
  position: absolute;
  z-index: 1;
  /* Live gray board: left 80, top 30, 499×150 (relative to red top 17 → +13) */
  top: calc(13 * var(--w));
  left: 0;
  box-sizing: border-box;
  width: calc(499 * var(--w));
  height: calc(150 * var(--w));
  display: flex;
  align-items: center;
  padding: calc(20 * var(--w)) calc(36 * var(--w));
  background: #f1f3f5;
}

.about-mission__title h2 {
  margin: 0;
  font-size: calc(30 * var(--w));
  font-weight: 700;
  line-height: 1.2;
  color: #050611;
}

.about-mission__text {
  position: absolute;
  z-index: 2;
  /* Live red board: left 420 → 340 from gray origin at 80 */
  top: 0;
  left: calc(340 * var(--w));
  box-sizing: border-box;
  width: calc(680 * var(--w));
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  /* Live text inset: 645-420=225 left, ~55 right inside 680 board */
  padding: calc(20 * var(--w)) calc(55 * var(--w)) calc(20 * var(--w)) calc(225 * var(--w));
  /* SVG only — solid fill hides the Live diagonal cut (transparent left wedge). */
  background: url("../../images/tild6266-3230-4337-a336-323235366263__group_4.svg") center / 100% 100% no-repeat;
  color: #fff;
}

.about-mission__text p {
  margin: 0;
  width: 100%;
  max-width: calc(420 * var(--w));
  font-size: calc(15 * var(--w));
  line-height: 1.3;
  font-weight: 400;
  text-align: right;
  color: #fff;
}

.about-values-section {
  padding: 12px 0 75px; /* Live quality→footer ~75@1200 */
}

.about-values-section h2 {
  margin: 0 0 16px;
  font-size: calc(30 * var(--w));
  font-weight: 600;
  line-height: 1;
  color: #050611;
}

.about-values {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 28px 40px;
  margin-bottom: 75px; /* Live values→quality gap @1440 */
}

.about-value h3 {
  margin: 0 0 14px;
  font-size: calc(20 * var(--w));
  font-weight: 600;
  line-height: 1.15;
  color: #050611;
}

.about-value p {
  margin: 0;
  font-size: calc(12 * var(--w));
  line-height: 1.35;
  color: #222328;
}

.about-quality {
  /* Live Zero Block: gray board 1000×290, title/copy left, accordion right */
  display: grid;
  grid-template-columns: minmax(0, calc(360 * var(--w))) minmax(0, 1fr);
  gap: calc(16 * var(--w)) calc(48 * var(--w));
  align-items: start;
  box-sizing: border-box;
  width: calc(1000 * var(--w));
  max-width: 100%;
  min-height: calc(290 * var(--w));
  margin: 0 auto;
  padding: calc(50 * var(--w)) calc(48 * var(--w)) calc(40 * var(--w));
  background-color: #f1f3f5;
  background-image: url("../../images/tild6230-3966-4633-a164-313463316332__frame_15.svg");
  background-position: right bottom;
  background-size: auto 100%;
  background-repeat: no-repeat;
}

.about-quality__main {
  min-width: 0;
}

.about-quality h3 {
  margin: 0 0 calc(24 * var(--w));
  /* Live title board w=296 @30px → two lines: «Политика компании в» / «области качества» */
  max-width: calc(296 * var(--w));
  font-size: calc(30 * var(--w));
  font-weight: 600;
  line-height: 1.15;
  color: #050611;
}

.about-quality p {
  margin: 0;
  max-width: calc(345 * var(--w));
  font-size: calc(12 * var(--w));
  line-height: 1.35;
  color: #505156;
}

.about-quality__acc {
  margin-top: calc(4 * var(--w));
  width: 100%;
  max-width: calc(560 * var(--w));
  justify-self: end;
}

.about-acc {
  border-top: 1px solid rgba(5, 6, 17, 0.15);
}

.about-acc:last-child {
  border-bottom: 1px solid rgba(5, 6, 17, 0.15);
}

.about-acc__trigger {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  width: 100%;
  padding: 10px 0;
  border: 0;
  background: transparent;
  cursor: pointer;
  text-align: left;
}

.about-acc__title {
  font-size: calc(12 * var(--w));
  font-weight: 400;
  line-height: 1.35;
  color: #050611;
}

.about-acc__icon {
  position: relative;
  flex: 0 0 24px;
  width: 24px;
  height: 24px;
}

.about-acc__icon::before,
.about-acc__icon::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 12px;
  height: 1px;
  background: #050611;
  transform: translate(-50%, -50%);
}

.about-acc__icon::after {
  transform: translate(-50%, -50%) rotate(90deg);
  transition: opacity 0.15s ease;
}

.about-acc.is-open .about-acc__icon::after {
  opacity: 0;
}

.about-acc__panel {
  padding: 0 0 14px;
}

.about-acc__panel[hidden] {
  display: none;
}

.about-acc__panel ul {
  margin: 0;
  padding: 0 0 0 18px;
}

.about-acc__panel li {
  margin: 0 0 6px;
  font-size: calc(12 * var(--w));
  line-height: 1.35;
  color: #505156;
}

.about-acc__panel p {
  margin: 0;
  max-width: none;
  font-size: calc(12 * var(--w));
  line-height: 1.35;
  color: #505156;
}

@media (max-width: 1199px) {
  .about-intro__grid,
  .about-stats,
  .about-values {
    grid-template-columns: 1fr;
  }

  .about-intro__grid {
    width: 100%;
    max-width: 100%;
  }

  /*
   * About tablet: Live Zero-Block heights are h320 * 100vw/320.
   * Fonts KEEP_FIXED (no double-scale on top of var(--w)).
   * Gallery = carousel band (not 6-row grid) — about-full-structure.json.
   */
  .about-intro {
    box-sizing: border-box;
    height: auto;
    min-height: 0;
    max-height: none;
    overflow: visible;
    padding: calc(28 * 100vw / 320) 0 calc(20 * 100vw / 320);
  }

  .about-intro h1 {
    font-size: 32px; /* Live mobile */
    max-width: 100%;
    line-height: 1; /* Live: lh === font-size (32px) */
  }

  .about-intro__text {
    max-width: none;
    width: 100%;
  }

  .about-video {
    width: 100%;
    max-width: 100%;
    height: auto;
    aspect-ratio: 619 / 349;
    justify-self: stretch;
  }

  .about-stats-section {
    box-sizing: border-box;
    height: calc(1040 * 100vw / 320);
    max-height: calc(1040 * 100vw / 320);
    overflow: hidden;
    padding: calc(24 * 100vw / 320) 0;
  }

  .about-stats-head {
    position: relative;
    display: block;
    min-height: 0;
    margin-bottom: 20px;
  }

  .about-stats-head h2 {
    position: static;
    margin: 0 0 16px;
  }

  .about-stats-head h2,
  .about-mission__title h2,
  .about-values-section h2,
  .about-quality h3 {
    font-size: 24px;
  }

  .about-capacity {
    position: static;
    width: 100%;
    height: auto;
    min-height: 96px;
    margin: 0 0 20px;
    padding: 24px 20px 18px;
    background: #d93434;
  }

  .about-capacity::before {
    display: none;
  }

  .about-capacity strong {
    font-size: 20px;
    white-space: normal;
  }

  .about-capacity span {
    width: auto;
    margin-left: 0;
  }

  .about-stat strong {
    font-size: 26px;
  }

  .about-production {
    padding: 75px 0 0;
  }

  .about-gallery {
    height: 500px;
  }

  .about-mission {
    box-sizing: border-box;
    height: auto;
    max-height: none;
    min-height: 0;
    overflow: visible;
    padding: calc(40 * 100vw / 320) 0 calc(24 * 100vw / 320);
  }

  .about-mission__inner {
    padding-left: calc(20 * 100vw / 320);
    padding-right: calc(20 * 100vw / 320);
  }

  .about-mission__banner {
    display: flex;
    flex-direction: column;
    height: auto;
    min-height: 0;
  }

  .about-mission__title {
    position: relative;
    top: auto;
    left: auto;
    width: 100%;
    height: auto;
    padding: 28px 24px;
  }

  .about-mission__text {
    position: relative;
    top: auto;
    left: auto;
    width: 100%;
    height: auto;
    min-height: 160px;
    margin-left: 0;
    padding: 28px 24px;
    justify-content: flex-start;
    background: #d93434;
    background-image: none;
  }

  .about-mission__text p {
    max-width: none;
    font-size: 15px;
    text-align: left;
  }

  .about-values-section {
    padding: 0 0 75px; /* Live quality→footer gap @1024 */
  }

  .about-quality {
    margin-bottom: 0; /* desktop residual only */
  }

  .about-values-section h2 {
    margin: 0 0 16px;
  }

  .about-values {
    box-sizing: border-box;
    /* Live values board 490@320 includes title; title ~40px → remainder */
    min-height: calc(450 * 100vw / 320);
    margin-bottom: 0;
    gap: 20px;
  }

  .about-quality {
    display: grid;
    grid-template-columns: 1fr;
    gap: 20px;
    box-sizing: border-box;
    height: auto;
    max-height: none;
    min-height: 0;
    margin-top: 75px; /* Live board gap @1024 */
    margin-bottom: 0;
    padding: 28px 20px;
    overflow: visible;
    background-size: auto 100%;
    background-position: right bottom;
  }

  .about-quality p {
    max-width: none;
    font-size: 14px;
  }

  .about-quality__acc {
    max-width: none;
  }

  .about-intro__text p,
  .about-value p,
  .about-capacity span,
  .about-stat span,
  .about-eyebrow {
    font-size: 14px;
  }

  .about-value h3 {
    font-size: 18px;
  }
}

@media (max-width: 599px) {
  .about-production {
    padding: 52px 0 15px; /* Live @390: prod→gallery 52, gallery→mission 15 */
  }

  .about-gallery {
    height: 350px; /* Live carousel img h=350@390 */
  }

  .about-gallery__track {
    gap: 8px;
  }

  .about-quality {
    margin-top: 45px; /* Live values→quality gap @390 */
    width: 100%;
  }

  .about-values-section {
    padding-bottom: 75px;
  }
}

/* About tablet */
@media (min-width: 600px) and (max-width: 899px) {
  .about-values-section {
    padding-bottom: 75px;
  }
}

@media (min-width: 900px) and (max-width: 1199px) {
  .about-values-section {
    padding-bottom: 75px;
  }
}

/* Mobile typography floor — keep peotek readability when --w switches to 390 artboard */
@media (max-width: 1199px) {
  .tech-page .section__lead,
  .dealer-card__name,
  .dealer-card__row,
  .contact-office__row,
  .contacts-form-intro p,
  .news-card__title,
  .news-card__descr,
  .proj-card__title,
  .proj-card__desc {
    font-size: 15px;
  }

  .tech-card__btn,
  .proj-card__btn,
  .news-filter,
  .contacts-form__field span {
    font-size: 13px;
  }

  .breadcrumbs {
    font-size: 14px;
  }
}

/* ===== Article / Project / Content templates ===== */
.article-page .page-hero,
.project-page .page-hero,
.content-page .page-hero {
  padding: calc(28 * var(--w)) 0 calc(10 * var(--w));
  background: #fff;
}

.content-page h1 {
  margin: 0 0 calc(20 * var(--w));
  font-size: calc(30 * var(--w));
  line-height: 1.15;
  font-weight: 600;
  color: #050611;
}

.article__inner {
  max-width: calc(760 * var(--w));
  margin: 0 auto;
  padding-bottom: calc(60 * var(--w));
}

.article__meta {
  display: flex;
  gap: calc(16 * var(--w));
  margin: 0 0 calc(18 * var(--w));
  font-size: calc(12 * var(--w));
  color: #8a8b90;
  text-transform: uppercase;
}

.article h1 {
  margin: 0 0 calc(28 * var(--w));
  font-size: calc(30 * var(--w));
  line-height: 1.25;
  font-weight: 700;
  color: #050611;
}

.article__cover {
  margin: 0 0 calc(28 * var(--w));
}

.article__cover img {
  display: block;
  width: 100%;
  height: auto;
}

.article__body p {
  margin: 0 0 calc(16 * var(--w));
  font-size: calc(14 * var(--w));
  line-height: 1.55;
  color: #222328;
}

.article__body h2,
.article__body h3 {
  margin: calc(28 * var(--w)) 0 calc(14 * var(--w));
  font-size: calc(20 * var(--w));
  line-height: 1.3;
  font-weight: 700;
  color: #050611;
}

.article__body h3 {
  font-size: calc(17 * var(--w));
}

.article__body ul,
.article__body ol {
  margin: 0 0 calc(16 * var(--w));
  padding-left: calc(22 * var(--w));
}

.article__body li {
  margin: 0 0 calc(8 * var(--w));
  font-size: calc(14 * var(--w));
  line-height: 1.55;
  color: #222328;
}

.article__body a {
  color: #d93434;
}

.article__body img {
  display: block;
  max-width: 100%;
  height: auto;
  margin: calc(16 * var(--w)) 0;
}

.article__back {
  margin-top: calc(36 * var(--w));
}

.project-page__subtitle {
  margin: calc(12 * var(--w)) 0 0;
  max-width: calc(900 * var(--w));
  font-size: calc(18 * var(--w));
  line-height: 1.3;
  font-weight: 400;
  color: #050611;
}

.project-page .page-hero h1 {
  margin: 0;
  font-size: calc(30 * var(--w));
  line-height: 1.15;
  font-weight: 600;
  color: #050611;
}

.project-page .page-hero .breadcrumbs {
  margin: 0 0 calc(20 * var(--w));
  font-size: calc(11 * var(--w));
  line-height: calc(14 * var(--w));
  color: #505156;
}

/* Live: full-bleed media board h=410@1200, then products/copy/gallery/next stacked */
.project-page__media-section {
  padding: calc(12 * var(--w)) 0 calc(24 * var(--w));
}

.project-page__media {
  margin: 0;
  overflow: hidden;
  background: #eef0f2;
  height: calc(410 * var(--w));
}

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

.project-page__products {
  padding: calc(8 * var(--w)) 0 calc(20 * var(--w));
}

.project-page__applied-title {
  margin: 0 0 calc(16 * var(--w));
  max-width: calc(1000 * var(--w));
  font-size: calc(13 * var(--w));
  font-weight: 700;
  line-height: 1.35;
  color: #050611;
}

.project-page__applied-grid {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: calc(10 * var(--w));
  max-width: calc(1000 * var(--w));
}

.project-page__applied-item {
  display: flex;
  align-items: flex-start;
  gap: calc(5 * var(--w));
  box-sizing: border-box;
  min-height: calc(43 * var(--w));
  padding: calc(14 * var(--w)) calc(7 * var(--w));
  background: #f1f3f5;
  font-size: calc(11 * var(--w));
  line-height: 1.3;
  color: #050611;
}

.project-page__applied-icon {
  flex: 0 0 auto;
  width: calc(15 * var(--w));
  height: calc(15 * var(--w));
  margin-top: 1px;
  object-fit: contain;
}

.project-page__copy-section {
  padding: calc(10 * var(--w)) 0 calc(20 * var(--w));
}

.project-page__copy {
  max-width: calc(1000 * var(--w));
}

.project-page__copy h2 {
  margin: calc(24 * var(--w)) 0 calc(12 * var(--w));
  font-size: calc(18 * var(--w));
}

/* Live rec body: data-field-fontsize-value=10, upscale=window, width=1000 */
.project-page__copy p {
  margin: 0 0 calc(16 * var(--w));
  font-size: calc(10 * (100vw / 1200));
  line-height: 1.55;
  font-weight: 400;
  color: #050611;
}

.project-page__copy p:last-child {
  margin-bottom: 0;
}

.project-page__copy li {
  font-size: calc(10 * (100vw / 1200));
  line-height: 1.55;
  color: #050611;
}

.project-page__gallery-extra {
  padding: 0 0 calc(8 * var(--w));
}

/* Live gallery boards: 2-col tiles ~375@1200, gap 10, immediately under body */
.project-page__gallery-pair {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: calc(10 * var(--w));
  margin: 0 0 calc(15 * var(--w));
}

.project-page__gallery-item {
  margin: 0;
  overflow: hidden;
  background: #eef0f2;
  height: calc(375 * var(--w));
}

.project-page__gallery-item img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.project-page__next {
  padding: calc(8 * var(--w)) 0 calc(48 * var(--w));
}

.project-page__next-pair {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: calc(10 * var(--w));
  margin: 0 0 calc(16 * var(--w));
}

.project-page__next-media {
  display: block;
  margin: 0;
  overflow: hidden;
  background: #eef0f2;
  height: calc(375 * var(--w));
}

.project-page__next-media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border: 0;
  outline: 0;
}

/* Live: red button under the pair, not a dark overlay card */
.project-page__next-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: calc(36 * var(--w));
  padding: 0 calc(18 * var(--w));
  background: #d93434;
  color: #fff;
  font-size: calc(12 * var(--w));
  font-weight: 400;
  line-height: 1;
  text-decoration: none;
}

.project-page__next-btn:hover {
  background: #c22e2e;
  color: #fff;
}

@media (max-width: 1199px) {
  .project-page .page-hero h1 {
    font-size: 28px;
  }

  .project-page__subtitle {
    font-size: 16px;
  }

  .project-page__applied-title {
    font-size: 15px;
  }

  .project-page__applied-grid {
    grid-template-columns: 1fr;
  }

  .project-page__applied-item {
    font-size: 14px;
    line-height: 1.5;
  }

  /* Live body @320 artboard height 400 — keep readable floor */
  .project-page__copy p,
  .project-page__copy li {
    font-size: 15px;
    line-height: 1.55;
  }

  .project-page__gallery-item,
  .project-page__next-media {
    height: calc(200 * 100vw / 320);
  }

  .project-page__gallery-pair,
  .project-page__next-pair {
    grid-template-columns: 1fr;
    gap: calc(10 * 100vw / 320);
  }

  .project-page__media {
    height: calc(240 * 100vw / 320);
  }

  .project-page__media img {
    height: 100%;
  }

  .project-page__next-btn {
    font-size: 14px;
    min-height: 40px;
  }
}

.content-page__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: calc(40 * var(--w));
  padding: calc(20 * var(--w)) 0 calc(70 * var(--w));
}

.content-page__grid h2 {
  margin: 0 0 calc(16 * var(--w));
  font-size: calc(20 * var(--w));
}

.content-page__grid ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.content-page__grid li {
  margin: 0 0 calc(8 * var(--w));
}

.content-page__grid a {
  color: #050611;
  font-size: calc(14 * var(--w));
}

.content-page__grid a:hover {
  color: #d93434;
}

@media (max-width: 900px) {
  .content-page__grid {
    grid-template-columns: 1fr;
  }

  /* 404 / generic content — compact Live-like mobile stack */
  .content-page > .container {
    padding-top: calc(40 * 100vw / 320);
    padding-bottom: calc(48 * 100vw / 320);
  }

  .content-page h1 {
    font-size: calc(28 * 100vw / 320);
    line-height: 1.15;
    margin: 0 0 calc(16 * 100vw / 320);
  }

  .content-page p {
    font-size: calc(14 * 100vw / 320);
    line-height: 1.4;
  }

  .article h1 {
    font-size: 28px;
  }
}

/* ===== Stage 16I — About mission scales on desktop (Live mission board grows with --w) ===== */
@media (min-width: 1200px) {
  .about-mission {
    padding: calc(62.5 * var(--w)) 0 calc(20 * var(--w));
  }

  .about-production {
    padding: calc(62.5 * var(--w)) 0;
  }

  .about-quality {
    min-height: calc(290 * var(--w)); /* Live board 290@1200 */
    padding: calc(50 * var(--w)) calc(48 * var(--w)) calc(40 * var(--w));
    gap: calc(20 * var(--w)) calc(48 * var(--w));
  }
}

/* ===== Stage 16I — extended viewport page-local body compensations (Live evidence) ===== */
/* Home news: do NOT use negative margin-bottom — it pulls the footer under
 * «Больше новостей» (overlap at ≥1500px). Live gap comes from section padding. */

@media (min-width: 1320px) and (max-width: 1439px) {
  .dilery-page .dealers-list-section {
    margin-bottom: 0;
  }
}

@media (min-width: 1200px) and (max-width: 1319px) {
  .dilery-page .dealers-list-section {
    margin-bottom: 0;
  }
}

@media (min-width: 1500px) and (max-width: 1799px) {
  .dilery-page .dealers-list-section {
    margin-bottom: 0;
  }
}

@media (min-width: 1800px) {
  .dilery-page .dealers-list-section {
    margin-bottom: 0;
  }
}

/* Dilery mobile — adjust existing −303@≤599 pin (do not replace with small values) */
@media (min-width: 400px) and (max-width: 459px) {
  .dealers-list-section {
    margin-bottom: -125px; /* was −303; body was −178@430 */
  }
}

@media (max-width: 389px) {
  .dealers-list-section {
    margin-bottom: -360px; /* was −303; body was +57@375 */
  }
}

/* Contacts desktop */
@media (min-width: 1200px) and (max-width: 1319px) {
  .contacts-page .contacts-form-section {
    margin-bottom: -10px;
  }
}

@media (min-width: 1320px) and (max-width: 1439px) {
  .contacts-page .contacts-form-section {
    margin-bottom: -27px; /* body was −11@1366 with base −38 */
  }
}

@media (min-width: 1500px) and (max-width: 1799px) {
  .contacts-page .contacts-form-section {
    margin-bottom: -70px;
  }
}

@media (min-width: 1800px) {
  .contacts-page .contacts-form-section {
    margin-bottom: -120px;
  }
}

/* Contacts mobile — adjust existing +304@≤599 */
@media (min-width: 400px) and (max-width: 459px) {
  .contacts-page .contacts-form-section {
    margin-bottom: 344px; /* was 304; body was −40@430 */
  }
}

/* Product @430 */
@media (min-width: 400px) and (max-width: 459px) {
  .product-page .related-section {
    margin-bottom: -18px;
  }
}

/* News archive — correct selector .news-feed-section */
@media (min-width: 1500px) and (max-width: 1799px) {
  .news-page .news-feed-section {
    margin-bottom: 25px; /* body was −30@1600 */
  }
}

@media (min-width: 1800px) {
  .news-page .news-feed-section {
    margin-bottom: 20px; /* body was −26@1920 */
  }
}

/* News mobile — adjust existing +498@≤599 */
@media (min-width: 400px) and (max-width: 459px) {
  .news-feed-section {
    margin-bottom: 664px; /* was 498; body was −166@430 */
  }
}

@media (max-width: 389px) {
  .news-feed-section {
    margin-bottom: 401px; /* was 498; body was +97@375 */
  }
}

/* Projects — keep natural gap to geography (Live ~80px section padding) */

/* Technologies desktop (base −38@≥1200) — 430 uses continuous scale, no separate pin */
@media (min-width: 1200px) and (max-width: 1359px) {
  .tech-page .tech-cards-section {
    margin-bottom: -4px;
  }
}

@media (min-width: 1500px) and (max-width: 1799px) {
  .tech-page .tech-cards-section {
    margin-bottom: -20px;
  }
}

@media (min-width: 1800px) {
  .tech-page .tech-cards-section {
    margin-bottom: -40px;
  }
}

@media (min-width: 400px) and (max-width: 459px) {
  .tech-page .tech-cards-section {
    margin-bottom: -105px; /* body was +89@430 with −16 */
  }
}

/* Category desktop (base cat-copy 240@≥1200) */
@media (min-width: 1200px) and (max-width: 1359px) {
  .catalog-page--category .cat-copy {
    margin-bottom: 255px; /* was 240; body was −28@1280 after prior tweak */
  }
}

@media (min-width: 1360px) and (max-width: 1439px) {
  .catalog-page--category .cat-copy {
    margin-bottom: 252px; /* Stage 16J control: body was −12@1366 */
  }
}

@media (min-width: 1500px) and (max-width: 1799px) {
  .catalog-page--category .cat-copy {
    margin-bottom: 195px;
  }
}

@media (min-width: 1800px) {
  .catalog-page--category .cat-copy {
    margin-bottom: 135px;
  }
}

/* Category mobile — adjust existing +180@≤599, do not replace with negative */
@media (min-width: 400px) and (max-width: 459px) {
  .catalog-page--category .cat-layout {
    margin-bottom: 105px; /* was 180; body was +75@430 */
  }
}

