/* Start:/css/hardware.css?17918778584893*/
/* Карточка фурнитуры /catalog/furnitura/{код}/ и список фурнитуры в кейсах (13.10.2026).
   Каркас — классы карточки двери (.pdp__*, .pdp-*, css/product-detail.css); здесь только
   то, чем фурнитура отличается: квадратное фото, плашки цветов, компактные строки. */

/* ---------- фото ---------- */
.pdp_hw .hw-stage {
  aspect-ratio: 1 / 1;
  padding: clamp(28px, 6%, 64px);
}
/* Кадры производителя (чертёж, ракурс) сняты на белом — multiply растворяет белый
   в фоне сцены, и они встают в один ряд с основным фото на прозрачном фоне. */
.pdp_hw .hw-stage img,
.pdp_hw .hw-thumbs img { mix-blend-mode: multiply; }
.pdp_hw .hw-thumbs .pdp__thumb { padding: 6px; }
.pdp_hw .pdp__thumb:focus-visible { outline: 2px solid var(--color-accent, #8c1f3b); outline-offset: 2px; }

/* ---------- цвета модели: каждая плашка — ссылка на позицию этого цвета ---------- */
.hw-colors__list {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 14px 0 0;
  padding: 0;
  list-style: none;
}
.hw-swatch {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 48px;
  padding: 4px 16px 4px 4px;
  border: 1px solid var(--color-border, #e6e2dc);
  border-radius: 999px;
  background: #fff;
  color: var(--color-text-primary, #1a1a1a);
  font-size: 14px;
  line-height: 1.2;
  text-decoration: none;
  transition: border-color .18s, box-shadow .18s;
}
.hw-swatch img {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  object-fit: cover;
  flex: 0 0 auto;
}
.hw-swatch:hover { border-color: var(--color-text-secondary, #6b6b6b); }
.hw-swatch.is-active {
  border-color: var(--color-accent, #8c1f3b);
  box-shadow: inset 0 0 0 1px var(--color-accent, #8c1f3b);
  cursor: default;
}
.hw-swatch:focus-visible { outline: 2px solid var(--color-accent, #8c1f3b); outline-offset: 2px; }

.pdp_hw .pdp-price { margin-top: 4px; }
.pdp_hw .pdp-actions { margin-top: 0; }
.hw-tip {
  margin: 18px 0 0;
  font-size: 14px;
  line-height: 1.55;
  color: var(--color-text-secondary, #4f4f4f);
}

/* ---------- о модели: текст и характеристики рядом ---------- */
.hw-about__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 24px clamp(24px, 4vw, 64px);
  align-items: start;
}
.hw-about__grid .pdp-desc__text { max-width: 60ch; }
.hw-specs .pdp-specs__val { text-wrap: pretty; }

/* ---------- компактные строки фурнитуры (карточка + кейсы) ---------- */
.hw-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr));
  gap: 12px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.hw-row {
  display: grid;
  grid-template-columns: 76px minmax(0, 1fr) auto;
  align-items: center;
  gap: 16px;
  height: 100%;
  padding: 10px 18px 10px 10px;
  border: 1px solid var(--color-border, #e6e2dc);
  border-radius: 8px;
  background: #fff;
  color: var(--color-text-primary, #1a1a1a);
  text-decoration: none;
  transition: border-color .18s;
}
.hw-row:hover { border-color: var(--color-accent, #8c1f3b); }
.hw-row:focus-visible { outline: 2px solid var(--color-accent, #8c1f3b); outline-offset: 2px; }
.hw-row__media {
  display: block;
  width: 76px;
  height: 76px;
  border-radius: 6px;
  background: var(--color-section-alt, #f7f6f4);
  overflow: hidden;
}
.hw-row__media img { width: 100%; height: 100%; object-fit: contain; padding: 8px; box-sizing: border-box; }
.hw-row__body { display: grid; gap: 3px; min-width: 0; }
.hw-row__kind {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--color-text-light, #8a8a8a);
}
.hw-row__name { font-size: 16px; font-weight: 500; line-height: 1.3; }
.hw-row__price,
.hw-row__meta { font-size: 14px; color: var(--color-text-secondary, #4f4f4f); }
.hw-row__go { color: var(--color-accent, #8c1f3b); font-size: 18px; transition: transform .18s; }
.hw-row:hover .hw-row__go { transform: translateX(3px); }

/* ---------- кейс: фурнитура под сеткой дверей ---------- */
.project-hw { margin-top: clamp(28px, 3vw, 40px); }
.project-hw_solo { margin-top: 0; }
.project-hw__title { margin: 0 0 16px; font-size: 20px; font-weight: 600; }

@media (max-width: 720px) {
  .hw-about__grid { grid-template-columns: minmax(0, 1fr); }
  .hw-swatch { font-size: 13px; padding-right: 14px; }
  .hw-row { grid-template-columns: 64px minmax(0, 1fr) auto; gap: 12px; }
  .hw-row__media { width: 64px; height: 64px; }
}

@media (prefers-reduced-motion: reduce) {
  .hw-swatch, .hw-row, .hw-row__go { transition: none; }
}

/* End */


/* Start:/local/assets/product/product.css?179265195342376*/
/* ==========================================================================
   Карточка товара — редизайн 22.10.2026. Разметка: catalog.element/dveryaninov_v2/template.php,
   движение — product.js. Логика (покрытия, ПГ/ПО, галерея, корзина) — прежние js/modules/product-detail.js
   и js/shop.js; их крючки (.pdp-*, .product__*) остались в разметке, поэтому здесь старые правила
   css/product-detail.css перекрываются от .pd с явными значениями (скругления, uppercase, серые плашки).
   Язык новых страниц: края как у шапки, острые углы, заголовок с приглушённой второй частью,
   бордовый — только действие и выбранное. Фото двери — на тёплой подложке, галерея липнет при прокрутке.
   ГОЧИ общих стилей: [class*="btn"], [class*="__panel"], input:not(…)×4 скругляют — углы заданы явно.
   ========================================================================== */
.pdp.pd {
  --text: #1A1A1A;
  --mute: #6E6862;
  --soft: #8C857D;
  --line: rgba(26, 26, 26, .12);
  --warm: #F7F5F2;
  --stone: #EDE8E1;
  --accent: #8C1F3B;
  --accent-h: #6E1630;
  --pad: clamp(16px, 3vw, 40px);
  --edge: max(var(--pad), calc((100% - 1440px) / 2 + var(--pad)));
  --ease: cubic-bezier(.22, .61, .36, 1);
  --out: cubic-bezier(.16, 1, .3, 1);
  --head-h: var(--dv-header-h, 104px);
  display: block; width: 100%; max-width: none; margin: 0; padding: 0 0 clamp(80px, 9vw, 140px);
  background: #fff; color: var(--text); font-family: Manrope, system-ui, sans-serif; overflow-x: clip;
}
.pd *, .pd *::before, .pd *::after { box-sizing: border-box; }
.pd [hidden] { display: none !important; }
.pd img { display: block; max-width: 100%; }
.pd a { color: inherit; text-decoration: none; }
.pd :where(h1, h2, h3, p, ul, dl, dd, dt) { margin: 0; padding: 0; }
.pd :where(ul) { list-style: none; }
.pd svg { width: 12px; height: 12px; flex: none; }
.pd :focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.pd ::selection { background: rgba(140, 31, 59, .16); color: var(--text); }

.pd-w { display: inline-block; overflow: hidden; vertical-align: top; padding-bottom: .12em; margin-bottom: -.12em; }
.pd-w__i { display: inline-block; will-change: transform; }

/* ---------- общее: ссылка, кнопка, заголовок раздела ---------- */
.pd .pd-link {
  display: inline-flex; align-items: center; gap: 10px; width: auto; padding: 0 0 6px; border: 0; border-radius: 0;
  background: linear-gradient(currentColor, currentColor) 0 100% / 100% 1px no-repeat; box-shadow: none;
  font: 500 15px/1.3 Manrope, system-ui, sans-serif; color: var(--text); text-decoration: none; text-transform: none; letter-spacing: 0;
  cursor: pointer; transition: background-size .5s var(--ease), color .25s;
}
.pd .pd-link:hover { color: var(--accent); background-size: 40% 1px; opacity: 1; }
.pd .pd-link svg { transition: transform .35s var(--ease); }
.pd .pd-link:hover svg { transform: translate(2px, -2px); }

.pd .pd-btn,
.pd .pdp-btn {
  position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 12px; min-height: 56px; padding: 0 28px;
  border: 1px solid var(--accent); border-radius: 0; background: var(--accent); color: #fff; box-shadow: none;
  font: 500 15px/1.2 Manrope, system-ui, sans-serif; letter-spacing: 0; text-transform: none; white-space: nowrap;
  cursor: pointer; overflow: hidden; isolation: isolate; transition: color .3s, border-color .3s, transform .2s;
}
.pd .pd-btn::before,
.pd .pdp-btn::before { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--accent-h); transform: scaleY(0); transform-origin: 50% 100%; transition: transform .45s var(--out); }
.pd .pd-btn:hover, .pd .pdp-btn:hover { background: var(--accent); color: #fff; }
.pd .pd-btn:hover::before, .pd .pdp-btn:hover::before { transform: scaleY(1); }
.pd .pd-btn:active, .pd .pdp-btn:active { transform: translateY(1px); }
.pd .pd-btn svg { transition: transform .35s var(--ease); }
.pd .pd-btn:hover svg { transform: translate(2px, -2px); }
/* «Собрать в конструкторе» — вторая по важности: линия, заливка поднимается светлым камнем. */
.pd .pd-btn_line { width: 100%; background: #fff; border-color: rgba(26, 26, 26, .28); color: var(--text); }
.pd .pd-btn_line::before { background: var(--stone); }
.pd .pd-btn_line:hover { background: #fff; color: var(--text); border-color: var(--text); }

.pd .pd-h2 { font: 500 clamp(30px, 3.4vw, 52px)/1.05 Manrope, system-ui, sans-serif; letter-spacing: -.035em; color: var(--text); text-wrap: balance; }
/* Приглушённая вторая часть — только «свой» span: слова анимации (.pd-w) тоже span, их не красим. */
.pd .pd-h2 > span:not(.pd-w) { color: var(--soft); }

/* ---------- крошки ---------- */
.pd-crumbs { display: flex; flex-wrap: wrap; gap: 10px; padding: 24px var(--edge) 0; font-size: 14px; color: var(--mute); }
.pd-crumbs a { transition: color .2s; }
.pd-crumbs a:hover { color: var(--accent); }
.pd-crumbs [aria-current] { color: var(--text); }

/* ---------- первый экран: фото + выбор ---------- */
.pd .pd-hero {
  display: grid; grid-template-columns: minmax(0, 7fr) minmax(360px, 5fr); gap: clamp(32px, 5vw, 88px); align-items: start;
  margin: 0; padding: 24px var(--edge) 0;
}
.pd .pd-gallery { position: sticky; top: calc(var(--head-h) + 16px); min-width: 0; }
.pd .pdp__stage.pd-stage {
  --sp: clamp(28px, 4vw, 64px);
  position: relative; display: block; aspect-ratio: auto;
  height: min(calc(100dvh - var(--head-h) - 120px), 860px); min-height: 480px;
  padding: 0; overflow: hidden; border-radius: 0; background: var(--warm);
}
/* Картинка — абсолютно в рамке с полями: в сетке/флексе процентная высота у img считалась от содержимого,
   и дверь вылезала за подложку. */
.pd .pdp__stage.pd-stage > img {
  position: absolute; top: var(--sp); left: var(--sp); width: calc(100% - 2 * var(--sp)); height: calc(100% - 2 * var(--sp));
  max-width: none; object-fit: contain; z-index: 1; transition: transform 1.2s var(--out);
}
/* Дверь не висит в воздухе: под ней светлая полоса пола и мягкая тень у порога (фото — вырезка). */
.pd .pdp__stage.pd-stage::before {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: calc(var(--sp) + 6px); pointer-events: none; /* +6px: пол заходит под полотно — в щели под дверью виден пол, а не стена */
  background: linear-gradient(180deg, #E9E3DA, #F1ECE5);
}
.pd .pdp__stage.pd-stage::after {
  content: ""; position: absolute; z-index: 0; left: 50%; bottom: calc(var(--sp) - 10px); width: min(46%, 300px); height: 20px; transform: translateX(-50%); pointer-events: none;
  background: radial-gradient(closest-side, rgba(40, 30, 20, .22), rgba(40, 30, 20, 0));
}
.pd .pd-stage__nav { position: absolute; right: 16px; bottom: 16px; display: flex; gap: 8px; z-index: 6; }
.pd .pdp__arrow.pd-arrow {
  position: static; transform: none; display: grid; place-items: center; width: 48px; height: 48px; margin: 0; padding: 0;
  border: 0; border-radius: 0; background: #fff; color: var(--text); box-shadow: none; cursor: pointer; transition: background-color .25s, color .25s;
}
.pd .pdp__arrow.pd-arrow::before { content: none; }
.pd .pdp__arrow.pd-arrow:hover { background: var(--accent); color: #fff; }
.pd .pdp__arrow.pd-arrow svg { width: 14px; height: 14px; }

.pd .pd-thumbs { display: flex; gap: 8px; margin-top: 8px; overflow-x: auto; scrollbar-width: none; }
.pd .pd-thumbs::-webkit-scrollbar { display: none; }
.pd .pdp__thumb.pd-thumb {
  flex: none; width: 76px; height: 76px; margin: 0; padding: 6px; border: 0; border-bottom: 2px solid transparent; border-radius: 0;
  background: var(--warm); cursor: pointer; opacity: .7; transition: opacity .25s, border-color .25s;
}
.pd .pdp__thumb.pd-thumb img { width: 100%; height: 100%; object-fit: contain; }
.pd .pdp__thumb.pd-thumb:hover { opacity: 1; }
.pd .pdp__thumb.pd-thumb.pdp__thumb_active { opacity: 1; border-bottom-color: var(--accent); }

/* ---------- примерка в интерьере: сцена целиком в CSS ----------
   Масштаб от высоты рамки (cqh): стена ≈ 2,9 м, дверь с наличниками ≈ 2,1 м → 58cqh; торшер правее двери —
   источник вечернего света. Вечер — слой-«карта света» (тёплые пятна от абажура поверх тёмно-синей
   темноты) в режиме multiply: стена, пол и дверь темнеют и теплеют одинаково, как от настоящей лампы. */
:is(.pd, .cfg-v2) .pd-room-toggle {
  position: absolute; left: 16px; top: 16px; z-index: 6; display: inline-flex; align-items: center; gap: 10px; height: 44px; margin: 0; padding: 0 16px;
  border: 0; border-radius: 0; background: #fff; color: var(--text); box-shadow: none;
  font: 500 14px/1 Manrope, system-ui, sans-serif; letter-spacing: 0; text-transform: none; cursor: pointer; transition: background-color .25s, color .25s;
}
@media (hover: hover) { :is(.pd, .cfg-v2) .pd-room-toggle:hover { background: var(--accent); color: #fff; } }
:is(.pd, .cfg-v2) .pd-room-toggle svg { width: 16px; height: 16px; }

:is(.pd, .cfg-v2) .pd-room {
  --fl: 80cqh;
  --dh: 58cqh;
  --dx: 40cqw;
  --lh: 46cqh;
  --lx: calc(var(--dx) + var(--dh) * .225 + 10cqh);
  --ly: calc(var(--fl) - var(--lh) + var(--lh) * .11 + 1.6cqh);
  position: absolute; inset: 0; z-index: 1; overflow: hidden; container-type: size; background: var(--wall, #E6E1D9);
}
:is(.pd, .cfg-v2) .pd-room > * { position: absolute; }
:is(.pd, .cfg-v2) .pd-room__wall { left: 0; right: 0; top: 0; height: var(--fl); background: var(--wall, #E6E1D9); transition: background-color .6s var(--ease); }
/* штукатурка: мелкий шум (soft-light не меняет средний тон стены) */
:is(.pd, .cfg-v2) .pd-room__wall::before {
  content: ""; position: absolute; inset: 0; opacity: .55; mix-blend-mode: soft-light;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
/* объём: потолок и угол у пола темнее, от окна слева светлее */
:is(.pd, .cfg-v2) .pd-room__wall::after {
  content: ""; position: absolute; inset: 0;
  background:
    linear-gradient(180deg, rgba(24, 18, 12, .16), rgba(24, 18, 12, 0) 30%),
    linear-gradient(0deg, rgba(24, 18, 12, .16), rgba(24, 18, 12, 0) 8cqh),
    linear-gradient(90deg, rgba(255, 255, 255, .12), rgba(255, 255, 255, 0) 45%, rgba(24, 18, 12, .1));
}
/* дневной свет из окна за кадром слева: мягкое размытое пятно на стене и на полу, без чётких граней */
:is(.pd, .cfg-v2) .pd-room__sun {
  inset: 0; z-index: 1; pointer-events: none; mix-blend-mode: screen; transition: opacity 1.4s var(--ease);
  background:
    radial-gradient(ellipse 42cqh 58cqh at 6% 42%, rgba(255, 246, 228, .34), rgba(255, 246, 228, .12) 45%, rgba(255, 246, 228, 0) 75%),
    radial-gradient(ellipse 56cqh 12cqh at 14% calc(var(--fl) + 9cqh), rgba(255, 240, 214, .3), rgba(255, 240, 214, 0) 70%);
}
:is(.pd, .cfg-v2) .pd-room__floor { left: 0; right: 0; top: var(--fl); bottom: 0; overflow: hidden; perspective: 22cqh; perspective-origin: var(--dx) -36cqh; }
:is(.pd, .cfg-v2) .pd-room__boards {
  --fc: #C49E72; --fj: rgba(72, 42, 16, .38);
  position: absolute; left: -150%; right: -150%; top: 0; height: 200cqh; transform-origin: 50% 0; transform: rotateX(76deg);
  background:
    repeating-linear-gradient(90deg, var(--fj) 0 1px, transparent 1px 3.4cqh),
    repeating-linear-gradient(90deg, rgba(0, 0, 0, .035) 0 1px, transparent 1px .5cqh),
    repeating-linear-gradient(90deg, transparent 0 6.8cqh, rgba(60, 34, 12, .09) 6.8cqh 10.2cqh, transparent 10.2cqh 17cqh),
    repeating-linear-gradient(90deg, transparent 0 13.6cqh, rgba(255, 238, 214, .08) 13.6cqh 17cqh, transparent 17cqh 23.8cqh),
    var(--fc);
  transition: background-color .5s;
}
:is(.pd, .cfg-v2) .pd-room[data-floor="walnut"] .pd-room__boards { --fc: #6E4B34; --fj: rgba(20, 10, 4, .5); }
:is(.pd, .cfg-v2) .pd-room[data-floor="cement"] .pd-room__boards {
  background:
    radial-gradient(40cqh 18cqh at 22% 20%, rgba(255, 255, 255, .09), transparent),
    radial-gradient(60cqh 24cqh at 70% 50%, rgba(0, 0, 0, .07), transparent),
    radial-gradient(30cqh 14cqh at 45% 80%, rgba(255, 255, 255, .06), transparent),
    #A9A59E;
}
:is(.pd, .cfg-v2) .pd-room__floor::after {
  content: ""; position: absolute; inset: 0;
  background:
    linear-gradient(180deg, rgba(18, 12, 6, .38) 0, rgba(18, 12, 6, .1) 1.4cqh, rgba(18, 12, 6, 0) 55%),
    linear-gradient(0deg, rgba(18, 12, 6, .14), rgba(18, 12, 6, 0) 70%);
}
:is(.pd, .cfg-v2) .pd-room__plinth {
  left: 0; right: 0; top: calc(var(--fl) - 2.6cqh); height: 2.6cqh;
  background: linear-gradient(180deg, #FCFBF8 0 14%, #EFECE6 14% 100%); box-shadow: 0 -.25cqh .8cqh rgba(24, 18, 12, .1), 0 .15cqh .3cqh rgba(24, 18, 12, .2);
}
/* дверь опущена на высоту щели под полотном (0,7% картинки): в щели — пол, а не белый плинтус */
:is(.pd, .cfg-v2) .pd-room__door { z-index: 2; left: var(--dx); top: calc(var(--fl) - var(--dh) * .993); height: var(--dh); transform: translateX(-50%); }
:is(.pd, .cfg-v2) .pd-room__door img {
  position: static; display: block; width: auto; height: 100%; max-width: none;
  filter: drop-shadow(0 0 .12cqh rgba(24, 16, 8, .45)) drop-shadow(.8cqh 0 1.4cqh rgba(24, 16, 8, .18));
  transition: filter 1.4s var(--ease);
}
/* тень у пола под коробом */
:is(.pd, .cfg-v2) .pd-room__door::after { content: ""; position: absolute; z-index: -1; left: -3%; right: -3%; bottom: -1cqh; height: 2cqh; background: radial-gradient(closest-side, rgba(24, 16, 8, .35), transparent); }
:is(.pd, .cfg-v2) .pd-room__lamp {
  z-index: 3; width: calc(var(--lh) * 60 / 220); height: var(--lh); left: calc(var(--lx) - var(--lh) * 30 / 220); top: calc(var(--fl) - var(--lh) + 1.6cqh);
  overflow: visible; filter: drop-shadow(.6cqh .3cqh .8cqh rgba(24, 16, 8, .2));
}
/* Торшер: тканевый абажур (объём — градиентом по ширине, фактура — тонкими нитями), тёмное отверстие сверху,
   скруглённый нижний край, металлическая стойка и тяжёлое основание. Вечером абажур светится изнутри (::after). */
:is(.pd, .cfg-v2) .pd-room__lamp > i { position: absolute; display: block; }
:is(.pd, .cfg-v2) .pd-lamp__shade {
  left: 4%; right: 4%; top: 0; height: 20%; clip-path: polygon(19% 0, 81% 0, 100% 100%, 0 100%);
  background:
    repeating-linear-gradient(90deg, rgba(60, 45, 30, .04) 0 1px, transparent 1px 3px),
    linear-gradient(180deg, rgba(255, 255, 255, .2), rgba(255, 255, 255, 0) 35%, rgba(60, 45, 30, .1)),
    linear-gradient(90deg, #C9BEAC 0%, #E7DFD1 22%, #F4EEE3 48%, #E4DBCB 76%, #BFB3A0 100%);
}
:is(.pd, .cfg-v2) .pd-lamp__hem {
  left: 4%; right: 4%; top: 18.6%; height: 2.8%; border-radius: 50%;
  background: linear-gradient(90deg, #B9AD99 0%, #DCD3C3 25%, #E8E1D4 50%, #D8CEBD 75%, #B3A693 100%);
}
:is(.pd, .cfg-v2) .pd-lamp__top {
  left: 22%; right: 22%; top: -1.1%; height: 2.2%; border-radius: 50%;
  background: radial-gradient(ellipse at 50% 65%, #5E564B, #8E8474 60%, #CFC6B6 100%); box-shadow: 0 .1cqh 0 rgba(255, 255, 255, .35);
}
:is(.pd, .cfg-v2) .pd-lamp__shade::after, :is(.pd, .cfg-v2) .pd-lamp__hem::after, :is(.pd, .cfg-v2) .pd-lamp__top::after {
  content: ""; position: absolute; inset: 0; border-radius: inherit; opacity: 0; transition: opacity 1.4s var(--ease);
}
:is(.pd, .cfg-v2) .pd-lamp__shade::after { background: radial-gradient(ellipse 62% 95% at 50% 75%, #FFF4DA 0%, #FFDDA6 45%, #F0B66E 100%); }
:is(.pd, .cfg-v2) .pd-lamp__hem::after { background: linear-gradient(90deg, #EBB46E, #FFE7BC 50%, #EBB46E); }
:is(.pd, .cfg-v2) .pd-lamp__top::after { background: radial-gradient(ellipse at 50% 60%, #FFF8E6, #FFD48E 70%, #E9AE63 100%); }
:is(.pd, .cfg-v2) .pd-lamp__pole {
  left: 48.3%; width: 3.4%; top: 20%; bottom: 2%;
  background: linear-gradient(90deg, #1C1A18, #5E5953 42%, #2B2825 70%, #1C1A18);
}
:is(.pd, .cfg-v2) .pd-lamp__base {
  left: 21%; right: 21%; bottom: 0; height: 3.4%; border-radius: 50%;
  background: radial-gradient(ellipse 70% 90% at 50% 25%, #625D56, #24221F 75%); box-shadow: 0 .5cqh .9cqh rgba(20, 14, 8, .3);
}
:is(.pd, .cfg-v2) .pd-room__night, :is(.pd, .cfg-v2) .pd-room__glow { inset: 0; pointer-events: none; opacity: 0; transition: opacity 1.4s var(--ease); }
:is(.pd, .cfg-v2) .pd-room__night {
  z-index: 4; mix-blend-mode: multiply; background-blend-mode: screen;
  background:
    radial-gradient(ellipse 12cqh 22cqh at var(--lx) calc(var(--ly) - 11cqh), rgba(255, 216, 164, 1) 0%, rgba(255, 190, 130, .55) 42%, rgba(255, 170, 110, 0) 100%),
    radial-gradient(ellipse 19cqh 27cqh at var(--lx) calc(var(--ly) + 21cqh), rgba(255, 208, 152, .95) 0%, rgba(236, 168, 108, .5) 46%, rgba(236, 168, 108, 0) 100%),
    radial-gradient(circle 82cqh at var(--lx) var(--ly), rgba(230, 170, 112, .9) 0%, rgba(168, 120, 88, .55) 40%, rgba(96, 76, 74, .2) 72%, rgba(90, 70, 70, 0) 100%),
    #30343F;
}
:is(.pd, .cfg-v2) .pd-room__glow {
  z-index: 5; mix-blend-mode: screen;
  background: radial-gradient(circle 9cqh at var(--lx) var(--ly), rgba(255, 228, 182, .8) 0%, rgba(255, 200, 140, .22) 42%, rgba(255, 200, 140, 0) 72%);
}
:is(.pd, .cfg-v2) .pd-room[data-time="night"] .pd-room__night, :is(.pd, .cfg-v2) .pd-room[data-time="night"] .pd-room__glow { opacity: 1; }
:is(.pd, .cfg-v2) .pd-room[data-time="night"] .pd-room__sun { opacity: 0; }
:is(.pd, .cfg-v2) .pd-room[data-time="night"] :is(.pd-lamp__shade, .pd-lamp__hem, .pd-lamp__top)::after { opacity: 1; }
:is(.pd, .cfg-v2) .pd-room[data-time="night"] .pd-room__door img { filter: drop-shadow(0 0 .12cqh rgba(0, 0, 0, .55)) drop-shadow(-1.6cqh 0 1.8cqh rgba(0, 0, 0, .4)); }

/* в режиме примерки: фото, стрелки и миниатюры уступают место сцене и её настройкам */
.pd .pd-gallery.is-room .pd-stage__nav, .pd .pd-gallery.is-room .pd-thumbs { display: none; }
:is(.pd, .cfg-v2) .pd-room-bar { display: flex; flex-wrap: wrap; gap: 16px clamp(24px, 3vw, 44px); margin-top: 8px; padding: 16px 0 0; }
:is(.pd, .cfg-v2) .pd-room-bar__label { margin: 0 0 10px; font-size: 13px; color: var(--mute); }
:is(.pd, .cfg-v2) .pd-room-bar__row { display: flex; flex-wrap: wrap; gap: 6px; }
:is(.pd, .cfg-v2) .pd-room-sw {
  position: relative; display: block; width: 32px; height: 32px; margin: 0; padding: 0; border: 1px solid rgba(26, 26, 26, .14); border-radius: 0;
  background: var(--c, #ddd); cursor: pointer; transition: transform .25s var(--out), outline-color .2s;
}
:is(.pd, .cfg-v2) .pd-room-sw:hover { transform: translateY(-2px); }
:is(.pd, .cfg-v2) .pd-room-sw.is-active { outline: 2px solid var(--accent); outline-offset: 2px; }
:is(.pd, .cfg-v2) .pd-room-sw_pick { overflow: hidden; background: conic-gradient(from 200deg, #d9a6a0, #d8c79a, #a9c4a0, #9fb9cf, #b6a6cf, #d9a6a0); }
:is(.pd, .cfg-v2) .pd-room-sw_pick.has-c { background: var(--c); }
:is(.pd, .cfg-v2) .pd-room-sw_pick::after { content: "+"; position: absolute; inset: 0; display: grid; place-items: center; font: 400 18px/1 Manrope, system-ui, sans-serif; color: #fff; text-shadow: 0 1px 2px rgba(0, 0, 0, .35); pointer-events: none; }
:is(.pd, .cfg-v2) .pd-room-sw_pick.has-c::after { content: none; }
:is(.pd, .cfg-v2) .pd-room-sw_pick input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; padding: 0; border: 0; border-radius: 0; opacity: 0; cursor: pointer; }
:is(.pd, .cfg-v2) .pd-room-sw_floor[data-pd-floor="oak"] { background: repeating-linear-gradient(90deg, #C49E72 0 7px, #A9845A 7px 8px); }
:is(.pd, .cfg-v2) .pd-room-sw_floor[data-pd-floor="walnut"] { background: repeating-linear-gradient(90deg, #6E4B34 0 7px, #4B3222 7px 8px); }
:is(.pd, .cfg-v2) .pd-room-sw_floor[data-pd-floor="cement"] { background: radial-gradient(circle at 30% 30%, #BDB9B2, #A9A59E 70%); }
:is(.pd, .cfg-v2) .pd-room-time { display: flex; }
:is(.pd, .cfg-v2) .pd-room-time button {
  height: 32px; margin: 0 0 0 -1px; padding: 0 16px; border: 1px solid rgba(26, 26, 26, .16); border-radius: 0; background: #fff; box-shadow: none;
  font: 500 13px/1 Manrope, system-ui, sans-serif; color: var(--mute); text-transform: none; cursor: pointer; transition: color .2s, border-color .2s;
}
:is(.pd, .cfg-v2) .pd-room-time button:first-child { margin-left: 0; }
:is(.pd, .cfg-v2) .pd-room-time button:hover { color: var(--text); }
:is(.pd, .cfg-v2) .pd-room-time button.is-active { position: relative; z-index: 1; border-color: var(--accent); color: var(--accent); box-shadow: inset 0 0 0 1px var(--accent); }

.pd .pdp__info.pd-info { display: block; min-width: 0; }
.pd .pd-title { margin: 0; font: 500 clamp(40px, 4vw, 64px)/1.02 Manrope, system-ui, sans-serif; letter-spacing: -.04em; color: var(--text); }
.pd .pd-coll {
  display: inline-flex; align-items: center; gap: 8px; margin-top: 12px; font-size: 16px; color: var(--mute); transition: color .25s;
}
.pd a.pd-coll:hover { color: var(--accent); }
.pd a.pd-coll svg { transition: transform .35s var(--ease); }
.pd a.pd-coll:hover svg { transform: translate(2px, -2px); }

.pd .pdp-price.pd-price { margin: 28px 0 0; }
.pd .pd-price .pdp-price__value { margin: 0; font: 500 clamp(30px, 2.6vw, 40px)/1 Manrope, system-ui, sans-serif; letter-spacing: -.035em; color: var(--text); font-variant-numeric: tabular-nums; }
.pd .pd-price .pdp-price__note { margin: 8px 0 0; font-size: 13px; line-height: 1.45; color: var(--mute); }

/* опции: полотно, размер, покрытие — каждая отделена линией */
.pd .pd-opt { margin: 28px 0 0; padding: 24px 0 0; border-top: 1px solid var(--line); }
.pd .pd-opt__label { margin: 0 0 14px; font-size: 14px; color: var(--mute); }
.pd .pd-opt__label b { margin-left: 6px; font-weight: 500; color: var(--text); }
.pd .pd-opt__head { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; margin: 0 0 14px; }
.pd .pd-opt__head .pd-opt__label { margin: 0; }
.pd .pdp-coating__all.pd-opt__all {
  padding: 0; border: 0; border-radius: 0; background: none; font: 400 14px/1.4 Manrope, system-ui, sans-serif; color: var(--text);
  text-decoration: underline; text-decoration-color: rgba(26, 26, 26, .25); text-underline-offset: 4px; text-transform: none; letter-spacing: 0;
  cursor: pointer; transition: color .25s;
}
.pd .pdp-coating__all.pd-opt__all:hover { color: var(--accent); text-decoration-color: currentColor; }

.pd .pdp-toggle.pd-toggle { display: flex; gap: 28px; margin: 0; border: 0; border-bottom: 1px solid var(--line); border-radius: 0; overflow: visible; }
.pd .pd-toggle .pdp-toggle__btn {
  margin: 0 0 -1px; padding: 0 0 12px; border: 0; border-bottom: 2px solid transparent; border-radius: 0; background: none; box-shadow: none;
  font: 500 16px/1.3 Manrope, system-ui, sans-serif; color: var(--mute); cursor: pointer; transition: color .25s, border-color .25s;
}
.pd .pd-toggle .pdp-toggle__btn:hover { color: var(--text); }
.pd .pd-toggle .pdp-toggle__btn.is-active { color: var(--text); font-weight: 500; border-bottom-color: var(--accent); box-shadow: none; background: none; }

.pd .pd-sizes { display: flex; flex-wrap: wrap; gap: 8px; }
.pd .pd-sizes .pdp-size {
  min-height: 46px; padding: 0 14px; border: 1px solid rgba(26, 26, 26, .16); border-radius: 0; background: #fff;
  font: 500 14px/1 Manrope, system-ui, sans-serif; color: var(--text); font-variant-numeric: tabular-nums; cursor: pointer;
  transition: border-color .2s, color .2s, box-shadow .2s;
}
.pd .pd-sizes .pdp-size:hover { border-color: var(--text); }
.pd .pd-sizes .pdp-size.is-active { background: #fff; border-color: var(--accent); color: var(--accent); box-shadow: inset 0 0 0 1px var(--accent); }
/* «Нужен замер» — не размер, а заявка: ссылкой, чтобы не читалась пятым вариантом. */
.pd .pd-sizes .pdp-size_action {
  min-height: 46px; padding: 0 4px; border: 0; background: none; color: var(--text); font-weight: 500;
  text-decoration: underline; text-decoration-color: rgba(26, 26, 26, .3); text-underline-offset: 4px;
}
.pd .pd-sizes .pdp-size_action:hover { border: 0; color: var(--accent); text-decoration-color: currentColor; }
.pd .pd-hint { margin: 12px 0 0; font-size: 13px; line-height: 1.5; color: var(--mute); }

.pd .pdp-coating__swatches { display: grid; grid-template-columns: 48px 44px repeat(auto-fill, 48px); grid-auto-rows: 48px; gap: 8px; }
.pd .pdp-swatch {
  width: 48px; height: 48px; padding: 0; border: 1px solid rgba(26, 26, 26, .08); border-radius: 0; background-size: cover; background-position: center;
  cursor: pointer; transition: transform .25s var(--out), outline-color .2s;
}
.pd .pdp-swatch:hover { transform: translateY(-2px); }
.pd .pdp-swatch.is-active { box-shadow: none; outline: 2px solid var(--accent); outline-offset: 2px; }
.pd .pdp-swatch__check svg { width: 20px; height: 20px; }
.pd .pdp-coatings-menu {
  top: 34px; width: min(460px, 100%); padding: 18px 18px 16px; border: 0; border-radius: 0; background: #fff;
  box-shadow: 0 24px 60px rgba(40, 30, 20, .18), 0 0 0 1px rgba(26, 26, 26, .06);
}
.pd .pdp-coatings-menu__group-title { margin: 0 0 8px; font-size: 13px; font-weight: 500; letter-spacing: 0; text-transform: none; color: var(--mute); }
.pd .pdp-coatings-menu__swatch { border-radius: 0; }
.pd .pdp-coatings-menu__swatch.is-active { box-shadow: none; outline: 2px solid var(--accent); outline-offset: 1px; }

/* действия */
.pd .pdp-actions.pd-actions { display: grid; gap: 10px; margin: 32px 0 0; }
.pd .pd-actions__row { display: flex; gap: 10px; }
.pd .pd-actions__row .pd-btn { flex: 1; }
.pd .pdp-fav.pd-fav { flex: 0 0 56px; width: 56px; height: 56px; border: 1px solid rgba(26, 26, 26, .2); border-radius: 0; background-color: #fff; transition: border-color .25s; }
.pd .pdp-fav.pd-fav:hover, .pd .pdp-fav.pd-fav.is-active { border-color: var(--accent); }

.pd .pdp-quote.pd-quote {
  display: grid; gap: 14px; margin: 24px 0 0; padding: 22px 24px; border-radius: 0; background: var(--stone);
}
.pd .pd-quote__t { margin: 0; font-size: 17px; font-weight: 500; color: var(--text); }
.pd .pd-quote__p { margin: 6px 0 0; font-size: 14px; line-height: 1.55; color: #4a4640; }
.pd .pd-quote .pd-link { justify-self: start; font-size: 15px; }

.pd .pd-facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin: 28px 0 0; padding: 20px 0 0; border-top: 1px solid var(--line); }
.pd .pd-facts li { display: grid; gap: 4px; }
.pd .pd-facts b { font-size: 17px; font-weight: 500; letter-spacing: -.01em; color: var(--text); }
.pd .pd-facts span { font-size: 13px; line-height: 1.4; color: var(--mute); }

/* ---------- о модели: описание + характеристики ---------- */
.pd .pd-about { margin: 0; padding: clamp(88px, 10vw, 160px) var(--edge) 0; }
.pd .pd-about__grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: clamp(32px, 6vw, 112px); margin-top: clamp(32px, 3.4vw, 52px); align-items: start; }
.pd .pd-desc { max-width: 60ch; font-size: 17px; line-height: 1.65; color: #4a4640; }
.pd .pd-desc p { margin: 0 0 1em; }
.pd .pd-desc em { font-style: normal; }
.pd .pd-desc .pd-link { margin-top: 12px; }
.pd .pd-specs { display: grid; margin: 0; border-bottom: 1px solid var(--line); }
.pd .pd-specs__row { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); gap: 24px; padding: 16px 0; border-top: 1px solid var(--line); }
.pd .pd-specs dt { font-size: 14px; line-height: 1.5; color: var(--mute); }
.pd .pd-specs dd { margin: 0; font-size: 15px; line-height: 1.5; font-weight: 500; color: var(--text); }

/* ---------- блоки ниже: исполнение, полотно, покрытия, комплект, заказ, вопросы ---------- */
.pd .pd-exec, .pd .pd-core, .pd .pd-kit, .pd .pd-steps, .pd .pd-faq { margin: 0; padding: clamp(88px, 10vw, 160px) var(--edge) 0; }
.pd .pd-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px 48px; flex-wrap: wrap; margin-bottom: clamp(28px, 3.4vw, 52px); }
.pd .pd-head > .pd-h2 { flex: 1 1 560px; }
.pd .pd-head__text { flex: 0 1 420px; max-width: 46ch; font-size: 15px; line-height: 1.6; color: var(--mute); }

.pd .pd-exec__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid var(--line); }
.pd .pd-exec__cell { display: grid; align-content: start; gap: 10px; padding: 28px clamp(20px, 2.4vw, 40px) 32px 0; border-bottom: 1px solid var(--line); }
.pd .pd-exec__cell:not(:nth-child(3n+1)) { padding-left: clamp(20px, 2.4vw, 40px); border-left: 1px solid var(--line); }
.pd .pd-exec__label { font-size: 14px; color: var(--mute); }
.pd .pd-exec__val { font-size: clamp(21px, 1.8vw, 28px); font-weight: 500; line-height: 1.2; letter-spacing: -.025em; color: var(--text); }
.pd .pd-exec__note { max-width: 40ch; font-size: 14px; line-height: 1.55; color: var(--mute); }
.pd .pd-exec__cell.is-off .pd-exec__val { color: var(--soft); }

.pd .pd-core, .pd .pd-kit { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: 40px clamp(40px, 7vw, 120px); }
.pd .pd-core { align-items: center; }
.pd .pd-kit { align-items: start; }
.pd .pd-core__photo { margin: 0; overflow: hidden; background: var(--stone); }
.pd .pd-core__photo img { width: 100%; height: auto; }
.pd .pd-core__copy > p, .pd .pd-kit__copy > p { margin-top: 22px; max-width: 52ch; font-size: 16px; line-height: 1.65; color: var(--mute); }
.pd .pd-core__facts { margin: 32px 0 28px; border-top: 1px solid var(--line); }
.pd .pd-core__facts li { display: grid; gap: 4px; padding: 16px 0; border-bottom: 1px solid var(--line); }
.pd .pd-core__facts strong { font-size: 17px; font-weight: 500; }
.pd .pd-core__facts span { font-size: 14px; line-height: 1.5; color: var(--mute); }
.pd .pd-kit__hw h3 { margin: 0 0 14px; font-size: 15px; font-weight: 600; }
.pd .pd-kit__hw .hw-list { margin-bottom: 24px; }

.pd .pd-finish { margin: clamp(88px, 10vw, 160px) 0 0; padding: clamp(56px, 7vw, 96px) var(--edge); background: var(--warm); }
.pd .pd-finish__board { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 44px clamp(32px, 5vw, 88px); }
.pd .pd-finish__board:has(> :only-child) { grid-template-columns: minmax(0, 1fr); }
.pd .pd-finish__group h3 { display: flex; align-items: baseline; gap: 10px; margin: 0 0 18px; padding-bottom: 12px; border-bottom: 1px solid var(--line); font-size: 17px; font-weight: 500; }
.pd .pd-finish__group h3 span { font-size: 14px; font-weight: 400; color: var(--soft); font-variant-numeric: tabular-nums; }
.pd .pd-coats { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 20px 12px; }
.pd .pd-finish__board:has(> :only-child) .pd-coats { grid-template-columns: repeat(auto-fill, minmax(88px, 1fr)); }
.pd .pd-coats button {
  display: grid; gap: 10px; align-content: start; width: 100%; margin: 0; padding: 0; border: 0; border-radius: 0; background: none;
  font: inherit; text-align: left; color: inherit; cursor: pointer;
}
.pd .pd-coats img, .pd .pd-coats i {
  display: block; width: 100%; aspect-ratio: 1; object-fit: cover; box-shadow: inset 0 0 0 1px rgba(26, 26, 26, .08);
  transition: transform .45s var(--out), outline-color .2s; outline: 2px solid transparent; outline-offset: 2px;
}
.pd .pd-coats button:hover img, .pd .pd-coats button:hover i { transform: translateY(-4px); }
.pd .pd-coats button:focus-visible { outline: none; }
.pd .pd-coats button:focus-visible img, .pd .pd-coats button:focus-visible i { outline-color: var(--accent); }
.pd .pd-coats span { font-size: 12.5px; line-height: 1.35; color: var(--mute); transition: color .2s; }
.pd .pd-coats button:hover span { color: var(--text); }
.pd .pd-finish__foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px 40px; margin-top: clamp(36px, 4vw, 52px); }
.pd .pd-finish__foot p { font-size: 14px; color: var(--mute); }
.pd .pd-finish__foot p .pd-link { padding-bottom: 4px; font-size: 14px; }
/* выбранное с доски покрытие подсвечиваем над ценой */
.pd .pdp-coating.is-flash { animation: pd-flash 1.6s var(--ease); }
@keyframes pd-flash { 0%, 100% { background: transparent; } 25% { background: rgba(140, 31, 59, .06); } }

.pd .pd-steps__list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 32px clamp(20px, 2.4vw, 36px); margin: clamp(32px, 4vw, 52px) 0 0; padding: 0; list-style: none; }
.pd .pd-steps__list li { padding-top: 18px; border-top: 1px solid rgba(26, 26, 26, .3); }
.pd .pd-steps__list span { font-size: 12px; font-weight: 600; color: var(--accent); font-variant-numeric: tabular-nums; }
.pd .pd-steps__list h3 { margin: 20px 0 10px; font-size: 18px; font-weight: 500; }
.pd .pd-steps__list p { font-size: 14.5px; line-height: 1.6; color: var(--mute); }

.pd .pd-faq { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 32px clamp(40px, 6vw, 100px); align-items: start; }
.pd .pd-faq__list { border-top: 1px solid var(--line); }
.pd .pd-faq__item { border-bottom: 1px solid var(--line); }
.pd .pd-faq__item summary {
  display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 22px 0;
  font-size: 17px; font-weight: 500; cursor: pointer; list-style: none; transition: color .25s;
}
.pd .pd-faq__item summary::-webkit-details-marker { display: none; }
.pd .pd-faq__item summary:hover { color: var(--accent); }
.pd .pd-faq__item summary i { position: relative; flex: none; width: 14px; height: 14px; }
.pd .pd-faq__item summary i::before, .pd .pd-faq__item summary i::after {
  content: ""; position: absolute; left: 0; right: 0; top: 50%; height: 1.5px; margin-top: -.75px; background: currentColor; transition: transform .35s var(--ease);
}
.pd .pd-faq__item summary i::after { transform: rotate(90deg); }
.pd .pd-faq__item[open] summary i::after { transform: rotate(0deg); }
.pd .pd-faq__item p { max-width: 60ch; padding: 0 0 24px; font-size: 15px; line-height: 1.65; color: var(--mute); }

/* ---------- в интерьерах и другие коллекции ---------- */
.pd .pd-cases, .pd .pd-related { margin: 0; padding: clamp(88px, 10vw, 160px) var(--edge) 0; }
.pd .pd-cases__head { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px 32px; flex-wrap: wrap; margin-bottom: clamp(28px, 3vw, 44px); }
.pd .pd-cases__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(10px, 1.1vw, 18px); }
.pd .pd-case { display: grid; gap: 6px; align-content: start; } /* заголовки у верха, даже если фото/подписи разной высоты */
.pd .pd-case__img { display: block; aspect-ratio: 3 / 4; overflow: hidden; margin-bottom: 10px; background: var(--stone); }
.pd .pd-case__img img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--out); }
.pd .pd-case:hover .pd-case__img img { transform: scale(1.03); }
.pd .pd-case__t { font-size: 18px; font-weight: 500; letter-spacing: -.01em; line-height: 1.3; transition: color .25s; }
.pd .pd-case:hover .pd-case__t { color: var(--accent); }
.pd .pd-case__c { font-size: 14px; color: var(--mute); }
/* какие наши двери стоят в объекте — обратная сторона блока «Модели в этом проекте» */
.pd .pd-case__used { display: grid; gap: 4px; margin-top: 8px; padding-top: 12px; border-top: 1px solid var(--line); font-size: 14px; line-height: 1.45; color: var(--mute); }
.pd .pd-case__used b { margin-right: 8px; font-weight: 500; color: var(--text); }
.pd .pdp-related__grid.pd-related__grid { margin: 0; }

/* ---------- отзывы (виджет Яндекса) и заявка ---------- */
.pd .pd-reviews { padding: clamp(72px, 8vw, 128px) var(--edge) 0; }
.pd .pd-reviews > * { margin-top: 0; }
.pd .pd-cta {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 32px clamp(32px, 6vw, 112px); align-items: start;
  margin-top: clamp(88px, 10vw, 160px); padding: clamp(56px, 7vw, 104px) var(--edge); background: var(--stone);
}
.pd .pd-cta__side p { max-width: 46ch; font-size: 17px; line-height: 1.6; color: #4a4640; }
.pd .pd-cta__acts { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 32px; margin-top: 28px; }

/* ---------- телефон: плашка над нижним меню (логика — в шаблоне) ---------- */
@media (max-width: 768px) {
  .pdp-sticky { box-shadow: none; border-top: 1px solid rgba(26, 26, 26, .12); }
  .pdp-sticky .pdp-sticky__price { font: 500 20px/1 Manrope, system-ui, sans-serif; letter-spacing: -.02em; }
  .pdp-sticky .pdp-sticky__btn { min-height: 46px; border-radius: 0; font: 500 14px/1.2 Manrope, system-ui, sans-serif; text-transform: none; }
}

/* ================= планшет ================= */
@media (max-width: 1000px) {
  .pd .pd-hero { grid-template-columns: minmax(0, 1fr); }
  .pd .pd-gallery { position: static; }
  /* Название и коллекция — над фото, чтобы первый экран не был одной картинкой: правая колонка
     «растворяется» (display: contents) и её блоки встают в общую сетку по order. */
  .pd .pd-hero { row-gap: 0; }
  .pd .pdp__info.pd-info, .pd .pd-info__in { display: contents; }
  .pd .pd-info__in > * { order: 4; }
  .pd .pd-info__in > .pd-title { order: 1; }
  .pd .pd-info__in > .pd-coll { order: 2; justify-self: start; }
  .pd .pd-hero > .pd-gallery { order: 3; margin-top: 24px; }
  .pd .pdp__stage.pd-stage { height: min(70vh, 680px); min-height: 0; }
  .pd .pd-about__grid { grid-template-columns: minmax(0, 1fr); }
  .pd .pd-cta { grid-template-columns: minmax(0, 1fr); }
  .pd .pd-exec__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pd .pd-exec__cell:not(:nth-child(3n+1)) { padding-left: 0; border-left: 0; }
  .pd .pd-exec__cell:nth-child(2n) { padding-left: clamp(20px, 2.4vw, 40px); border-left: 1px solid var(--line); }
  .pd .pd-core, .pd .pd-kit, .pd .pd-faq { grid-template-columns: minmax(0, 1fr); }
  .pd .pd-finish__board { grid-template-columns: minmax(0, 1fr); }
  .pd .pd-steps__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ================= телефон ================= */
@media (max-width: 640px) {
  .pd .pd-hero { padding-top: 16px; row-gap: 0; }
  .pd .pdp__stage.pd-stage { --sp: 28px; height: min(58svh, 520px); max-height: none; }
  /* фото во всю ширину экрана; миниатюры и настройки интерьера — с полями */
  .pd .pd-gallery { margin: 20px calc(-1 * var(--pad)) 0; }
  .pd .pd-thumbs, :is(.pd, .cfg-v2) .pd-room-bar { padding-left: var(--pad); padding-right: var(--pad); }
  :is(.pd, .cfg-v2) .pd-room-toggle { top: auto; bottom: 12px; left: 12px; }
  .pd .pd-sizes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pd .pd-sizes .pdp-size_action { grid-column: 1 / -1; justify-self: start; min-height: 36px; }
  .pd .pd-stage__nav { right: 8px; bottom: 8px; }
  .pd .pdp__arrow.pd-arrow { width: 44px; height: 44px; }
  .pd .pdp__thumb.pd-thumb { width: 64px; height: 64px; }
  .pd .pd-title { font-size: 40px; }
  .pd .pd-sizes .pdp-size { min-height: 44px; padding: 0 12px; }
  .pd .pdp-coating__swatches { grid-template-columns: repeat(auto-fill, 48px); }
  .pd .pdp-coating__active-slot, .pd .pdp-coating__gap { grid-column: auto; }
  .pd .pdp-coating__gap { display: none; }
  .pd .pd-facts { gap: 12px; }
  .pd .pd-facts b { font-size: 15px; }
  .pd .pd-facts span { font-size: 12px; }
  .pd .pd-specs__row { grid-template-columns: minmax(0, 1fr); gap: 4px; padding: 12px 0; }
  .pd .pd-cases__grid { grid-template-columns: minmax(0, 1fr); }
  .pd .pd-btn, .pd .pdp-btn { padding: 0 18px; }
  :is(.pd, .cfg-v2) .pd-room-toggle { height: 40px; padding: 0 12px; }
  :is(.pd, .cfg-v2) .pd-room { --dx: 38cqw; --dh: 56cqh; }
  :is(.pd, .cfg-v2) .pd-room-bar { gap: 14px 24px; }
  :is(.pd, .cfg-v2) .pd-room-sw { width: 30px; height: 30px; }
  .pd .pd-exec__grid { grid-template-columns: minmax(0, 1fr); }
  .pd .pd-exec__cell, .pd .pd-exec__cell:nth-child(2n) { padding: 22px 0 24px; border-left: 0; }
  .pd .pd-coats, .pd .pd-finish__board:has(> :only-child) .pd-coats { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px 10px; }
  .pd .pd-coats span { font-size: 11.5px; }
  .pd .pd-steps__list { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .pd .pd-faq__item summary { font-size: 16px; padding: 18px 0; }
}

@media (prefers-reduced-motion: reduce) {
  .pd .pdp-swatch, .pd .pd-case__img img, .pd .pdp__stage.pd-stage > img, .pd .pd-coats img, .pd .pd-coats i { transition: none; }
  :is(.pd, .cfg-v2) .pd-room__night, :is(.pd, .cfg-v2) .pd-room__glow, :is(.pd, .cfg-v2) .pd-room__sun, :is(.pd, .cfg-v2) .pd-room__door img, :is(.pd, .cfg-v2) .pd-room__lamp i::after { transition: none; }
}

/* End */


/* Start:/local/assets/product/cfg.css?179265175118472*/
/* ==========================================================================
   Конструктор — новый вид (23.10.2026). Включается классом .cfg-v2 на #configModal (ставит product.js),
   поэтому старые страницы с прежним окном не меняются. Разметка — компонент dveryaninov:configurator
   (.default), логика — js/shop.js: id, классы и data-атрибуты не трогаем, здесь только вид и движение.
   Язык новых страниц: острые углы, Manrope, линии вместо плашек, бордовый — только действие и выбранное.
   Перебиваем css/main.css и bitrix.css специфичностью .cfg-modal.cfg-v2 (там встречаются и #id).
   ========================================================================== */
.cfg-modal.cfg-v2 {
  --text: #1A1A1A;
  --mute: #6E6862;
  --soft: #8C857D;
  --line: rgba(26, 26, 26, .12);
  --warm: #F7F5F2;
  --stone: #EDE8E1;
  --accent: #8C1F3B;
  --accent-h: #6E1630;
  --ease: cubic-bezier(.22, .61, .36, 1);
  --out: cubic-bezier(.16, 1, .3, 1);
  font-family: Manrope, system-ui, sans-serif;
  color: var(--text);
}
.cfg-modal.cfg-v2 [hidden] { display: none !important; }

/* ---------- появление окна: фото открывается от центра, как дверь; графы — следом ---------- */
@keyframes cfg-door { from { clip-path: inset(0 50% 0 50%); } to { clip-path: inset(0 0 0 0); } }
@keyframes cfg-rise { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
@keyframes cfg-side { from { opacity: 0; transform: translateX(28px); } to { opacity: 1; transform: none; } }
@keyframes cfg-fade { from { opacity: 0; } to { opacity: 1; } }
.cfg-modal.cfg-v2[aria-hidden="false"] .cfg-stage { animation: cfg-door 1.1s var(--out) .05s backwards; }
.cfg-modal.cfg-v2[aria-hidden="false"] .cfg-kit-head,
.cfg-modal.cfg-v2[aria-hidden="false"] .cfg-kit { animation: cfg-rise .9s var(--out) .35s backwards; }
.cfg-modal.cfg-v2[aria-hidden="false"] .cfg-modal__side { animation: cfg-side .8s var(--out) .1s backwards; }
/* смена шага: новая страница граф въезжает справа; раскрытая графа — опции поднимаются по очереди */
.cfg-modal.cfg-v2 .cfg-modal__params .config-step_active { animation: cfg-side .6s var(--out) backwards; }
.cfg-modal.cfg-v2 .config-detail-options.is-open > *,
.cfg-modal.cfg-v2 .cfg-section__body.is-open > * { animation: cfg-rise .55s var(--out) backwards; }
.cfg-modal.cfg-v2 .is-open > :nth-child(2) { animation-delay: .03s; }
.cfg-modal.cfg-v2 .is-open > :nth-child(3) { animation-delay: .06s; }
.cfg-modal.cfg-v2 .is-open > :nth-child(4) { animation-delay: .09s; }
.cfg-modal.cfg-v2 .is-open > :nth-child(5) { animation-delay: .12s; }
.cfg-modal.cfg-v2 .is-open > :nth-child(6) { animation-delay: .15s; }
.cfg-modal.cfg-v2 .is-open > :nth-child(7) { animation-delay: .18s; }
.cfg-modal.cfg-v2 .is-open > :nth-child(n+8) { animation-delay: .21s; }

/* ---------- левая колонка: название, дверь на полу, комплектация ---------- */
.cfg-modal.cfg-v2 .cfg-modal__image { background: var(--warm); padding: 32px clamp(24px, 3.2vw, 56px) 24px; gap: 18px; }
.cfg-modal.cfg-v2 .cfg-kit__eyebrow { display: none; }
.cfg-modal.cfg-v2 .cfg-kit__name { margin: 0; font-size: clamp(32px, 3vw, 48px); font-weight: 500; line-height: 1.02; letter-spacing: -.04em; }
.cfg-modal.cfg-v2 .cfg-stage { position: relative; overflow: hidden; }
/* пол и тень у порога — дверь стоит, а не висит */
.cfg-modal.cfg-v2 .cfg-stage::before {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 24px; pointer-events: none; /* на 6px выше низа двери: щель под полотном — пол */
  background: linear-gradient(180deg, #E9E3DA, #F1ECE5);
}
.cfg-modal.cfg-v2 .cfg-modal__image .cfg-stage > img {
  position: relative; z-index: 1; height: calc(100% - 18px); align-self: flex-start; margin-top: 0;
  filter: none; /* тень со сдвигом вниз не ложилась под щель полотна — щель светилась полоской; тень у порога — ниже */
}
.cfg-modal.cfg-v2 .cfg-stage::after {
  content: ""; position: absolute; z-index: 0; left: 50%; bottom: 10px; width: min(46%, 280px); height: 18px; transform: translateX(-50%); pointer-events: none;
  background: radial-gradient(closest-side, rgba(40, 30, 20, .22), rgba(40, 30, 20, 0));
}
.cfg-modal.cfg-v2 .cfg-stage .pd-room__door img { width: auto; height: 100%; max-height: none; object-fit: fill; }
.cfg-modal.cfg-v2 .cfg-kit__row { padding: 7px 0; border-top-color: var(--line); }
.cfg-modal.cfg-v2 .cfg-kit__row dt { font-size: 12.5px; color: var(--mute); }
.cfg-modal.cfg-v2 .cfg-kit__row dd { font-size: 13.5px; font-weight: 500; }
.cfg-modal.cfg-v2 .pd-room-bar { margin-top: -6px; padding-top: 0; gap: 12px 24px; }
.cfg-modal.cfg-v2 .pd-room-bar__label { margin-bottom: 8px; font-size: 12px; }
.cfg-modal.cfg-v2 .pd-room-sw { width: 26px; height: 26px; }
.cfg-modal.cfg-v2 .pd-room-time button { height: 26px; padding: 0 12px; font-size: 12.5px; }

/* ---------- шаги: три вкладки и бордовая линия прогресса под ними ---------- */
.cfg-modal.cfg-v2 .cfg-modal__topbar { position: relative; padding: 0 clamp(20px, 2.4vw, 36px); border-bottom-color: var(--line); }
.cfg-modal.cfg-v2 .cfg-modal__topbar::after {
  content: ""; position: absolute; left: 0; bottom: -1px; width: 33.34%; height: 2px; background: var(--accent);
  transition: width .8s var(--out);
}
.cfg-modal.cfg-v2[data-step="molding"] .cfg-modal__topbar::after { width: 66.67%; }
.cfg-modal.cfg-v2[data-step="hardware"] .cfg-modal__topbar::after { width: 100%; }
.cfg-modal.cfg-v2 .cfg-stepper { padding: 22px 0; gap: 28px; }
.cfg-modal.cfg-v2 .cfg-stepper__line { display: none; }
.cfg-modal.cfg-v2 .cfg-stepper__step { gap: 8px; opacity: 1; color: var(--soft); transition: color .3s; }
.cfg-modal.cfg-v2 .cfg-stepper__step:hover { color: var(--text); }
.cfg-modal.cfg-v2 .cfg-stepper__num {
  width: auto; height: auto; border: 0; border-radius: 0; background: none; color: inherit;
  font-size: 12px; font-weight: 600; font-variant-numeric: tabular-nums;
}
.cfg-modal.cfg-v2 .cfg-stepper__label { font-size: 14px; font-weight: 500; color: inherit; }
.cfg-modal.cfg-v2 .cfg-stepper__step_active,
.cfg-modal.cfg-v2 .cfg-stepper__step_active .cfg-stepper__label { color: var(--text); font-weight: 500; }
.cfg-modal.cfg-v2 .cfg-stepper__step_active .cfg-stepper__num { background: none; border: 0; color: var(--accent); }
.cfg-modal.cfg-v2 .cfg-modal__close { gap: 10px; font-size: 14px; color: var(--text); transition: color .25s; }
.cfg-modal.cfg-v2 .cfg-modal__close:hover { color: var(--accent); }
.cfg-modal.cfg-v2 .cfg-modal__close-icon {
  display: grid; place-items: center; width: 40px; height: 40px; border: 1px solid var(--line); border-radius: 0; font-size: 20px; line-height: 1;
  transition: border-color .25s, transform .4s var(--out);
}
.cfg-modal.cfg-v2 .cfg-modal__close:hover .cfg-modal__close-icon { border-color: var(--accent); transform: rotate(90deg); }

/* ---------- графы: подпись слева, выбранное справа, плюс из линий ---------- */
.cfg-modal.cfg-v2 .cfg-modal__params { padding: 0 clamp(20px, 2.4vw, 36px); }
.cfg-modal.cfg-v2 .cfg-modal__params .config-detail-item,
.cfg-modal.cfg-v2 .cfg-modal__params .cfg-section { border-bottom: 1px solid var(--line); }
.cfg-modal.cfg-v2 .cfg-section__body.is-open { border-bottom: 0; }
.cfg-modal.cfg-v2 .config-detail-label { font-size: 15px; color: var(--mute); transition: color .25s; }
.cfg-modal.cfg-v2 .config-detail-header:hover .config-detail-label { color: var(--text); }
.cfg-modal.cfg-v2 .config-detail-value { font-size: 15px; font-weight: 500; color: var(--text); }
.cfg-modal.cfg-v2 .config-detail-toggle,
.cfg-modal.cfg-v2 .config-detail-toggle[aria-expanded="true"],
.cfg-modal.cfg-v2 .config-detail-toggle[aria-expanded="false"] {
  position: relative; flex: none; width: 20px; height: 20px; background-image: none; transform: none;
}
.cfg-modal.cfg-v2 .config-detail-toggle::before,
.cfg-modal.cfg-v2 .config-detail-toggle::after {
  content: ""; display: block; position: absolute; left: 3px; right: 3px; top: 50%; height: 1.5px; margin-top: -.75px;
  background: var(--text); transition: transform .4s var(--out), background-color .25s;
}
.cfg-modal.cfg-v2 .config-detail-toggle::after { transform: rotate(90deg); }
.cfg-modal.cfg-v2 .config-detail-toggle[aria-expanded="true"]::after { transform: rotate(0deg); }
.cfg-modal.cfg-v2 .config-detail-header:hover .config-detail-toggle::before,
.cfg-modal.cfg-v2 .config-detail-header:hover .config-detail-toggle::after { background: var(--accent); }

/* чипы: размер, тип полотна, тип покрытия */
.cfg-modal.cfg-v2 .config-chip {
  height: 46px; padding: 0 16px; border: 1px solid rgba(26, 26, 26, .16); border-radius: 0; background: #fff;
  font: 500 14px/1.2 Manrope, system-ui, sans-serif; color: var(--text); font-variant-numeric: tabular-nums;
  transition: border-color .2s, color .2s, box-shadow .2s, transform .2s;
}
.cfg-modal.cfg-v2 .config-chip:hover { border-color: var(--text); }
.cfg-modal.cfg-v2 .config-chip:active { transform: translateY(1px); }
.cfg-modal.cfg-v2 .config-chip_active,
.cfg-modal.cfg-v2 .config-chip_active:hover { border-color: var(--accent); color: var(--accent); box-shadow: inset 0 0 0 1px var(--accent); font-weight: 500; }
.cfg-modal.cfg-v2 .config-chip_active .config-chip__delta { color: var(--accent); }

/* покрытия: квадратные образцы */
.cfg-modal.cfg-v2 #cfgCoatingsContainer .cfg-coatings-grid { gap: 14px 10px; }
.cfg-modal.cfg-v2 #cfgCoatingsContainer .cfg-coating-swatch {
  width: 72px; padding: 0; gap: 8px; border: 0; border-radius: 0; box-shadow: none; background: none;
}
.cfg-modal.cfg-v2 #cfgCoatingsContainer .cfg-coating-swatch__color {
  width: 72px; height: 72px; border-radius: 0; border: 1px solid rgba(26, 26, 26, .08);
  outline: 2px solid transparent; outline-offset: 2px; transition: transform .35s var(--out), outline-color .2s;
}
.cfg-modal.cfg-v2 #cfgCoatingsContainer .cfg-coating-swatch:hover .cfg-coating-swatch__color { transform: translateY(-3px); }
.cfg-modal.cfg-v2 #cfgCoatingsContainer .cfg-coating-swatch_active .cfg-coating-swatch__color { outline-color: var(--accent); transform: none; }
.cfg-modal.cfg-v2 #cfgCoatingsContainer .cfg-coating-swatch__label { font-size: 11.5px; line-height: 1.3; color: var(--mute); text-align: left; }
.cfg-modal.cfg-v2 #cfgCoatingsContainer .cfg-coating-swatch_active .cfg-coating-swatch__label { color: var(--text); }
.cfg-modal.cfg-v2 .cfg-swatch-zoom { border-radius: 0; }

/* карточки вариантов: стекло, кромка, открывание, погонаж, фурнитура */
.cfg-modal.cfg-v2 .cfg-radio-group .cfg-item {
  gap: 10px; padding: 12px 10px 14px; border: 1px solid var(--line); border-radius: 0; background: #fff;
  transition: border-color .2s, box-shadow .2s, transform .35s var(--out);
}
.cfg-modal.cfg-v2 .cfg-radio-group .cfg-item:hover { border-color: rgba(26, 26, 26, .4); transform: translateY(-2px); }
.cfg-modal.cfg-v2 .cfg-radio-group .cfg-item_active,
.cfg-modal.cfg-v2 .cfg-radio-group .cfg-item_active:hover { border-color: var(--accent); box-shadow: inset 0 0 0 1px var(--accent); transform: none; }
.cfg-modal.cfg-v2 .cfg-item__thumb { border-radius: 0; background: var(--warm); }
.cfg-modal.cfg-v2 .cfg-item__thumb-none { color: var(--soft); font-size: 18px; }
.cfg-modal.cfg-v2 .cfg-item__name { font-size: 13.5px; font-weight: 500; line-height: 1.3; color: var(--text); }
.cfg-modal.cfg-v2 .cfg-item_active .cfg-item__name { color: var(--accent); }
.cfg-modal.cfg-v2 .config-chip__delta, .cfg-modal.cfg-v2 .cfg-item__price { color: var(--mute); }
.cfg-modal.cfg-v2 .cfg-item__zoom { border-radius: 0; box-shadow: 0 24px 60px rgba(40, 30, 20, .18); }
.cfg-modal.cfg-v2 .cfg-color-tile__swatch { border-radius: 50%; }
.cfg-modal.cfg-v2 .cfg-color-tile__label { font-size: 11.5px; color: var(--mute); }

/* ---------- подвал: цена и действия ---------- */
.cfg-modal.cfg-v2 .cfg-modal__footer { padding: 18px clamp(20px, 2.4vw, 36px); border-top-color: var(--line); gap: 14px 20px; }
.cfg-modal.cfg-v2 .cfg-modal__price-row { display: flex; align-items: baseline; gap: 8px; }
.cfg-modal.cfg-v2 .cfg-modal__price-prefix { font-size: 14px; color: var(--mute); }
.cfg-modal.cfg-v2 .cfg-modal__price strong { font-size: clamp(26px, 2.2vw, 34px); font-weight: 500; letter-spacing: -.03em; font-variant-numeric: tabular-nums; }
.cfg-modal.cfg-v2 .cfg-modal__calc-toggle {
  padding: 0 0 4px; border: 0; background: linear-gradient(currentColor, currentColor) 0 100% / 100% 1px no-repeat;
  font: 500 14px/1.3 Manrope, system-ui, sans-serif; color: var(--text); text-decoration: none; cursor: pointer;
  transition: color .25s, background-size .5s var(--ease);
}
.cfg-modal.cfg-v2 .cfg-modal__calc-toggle:hover { color: var(--accent); background-size: 40% 1px; }
.cfg-modal.cfg-v2 .cfg-modal__calc-popover { border-radius: 0; box-shadow: 0 24px 60px rgba(40, 30, 20, .18), 0 0 0 1px rgba(26, 26, 26, .06); }
.cfg-modal.cfg-v2 .cfg-modal__calc-input { border-radius: 0; }

.cfg-modal.cfg-v2 .cfg-btn {
  position: relative; height: 54px; padding: 0 24px; border-radius: 0; overflow: hidden; isolation: isolate;
  font: 500 15px/1 Manrope, system-ui, sans-serif; letter-spacing: 0; text-transform: none; transition: color .3s, border-color .3s, transform .2s;
}
.cfg-modal.cfg-v2 .cfg-btn::before {
  content: ""; position: absolute; inset: 0; z-index: -1; transform: scaleY(0); transform-origin: 50% 100%; transition: transform .45s var(--out);
}
.cfg-modal.cfg-v2 .cfg-btn:hover::before { transform: scaleY(1); }
.cfg-modal.cfg-v2 .cfg-btn:active { transform: translateY(1px); }
.cfg-modal.cfg-v2 .cfg-btn_fill, .cfg-modal.cfg-v2 .cfg-btn_fill:hover { background: var(--accent); border: 1px solid var(--accent); color: #fff; }
.cfg-modal.cfg-v2 .cfg-btn_fill::before { background: var(--accent-h); }
.cfg-modal.cfg-v2 .cfg-btn_outline, .cfg-modal.cfg-v2 .cfg-btn_outline:hover { background: #fff; border: 1px solid rgba(26, 26, 26, .28); color: var(--text); }
.cfg-modal.cfg-v2 .cfg-btn_outline:hover { border-color: var(--text); }
.cfg-modal.cfg-v2 .cfg-btn_outline::before { background: var(--stone); }
/* Подписи кнопок в разметке и в shop.js — капсом («ВЫБРАТЬ ПОГОНАЖ →»); показываем как предложение.
   ::first-letter работает только у блочных/строчно-блочных — поэтому «Далее» не flex, а текст в спане — inline-block. */
.cfg-modal.cfg-v2 #cfgNextBtn { display: inline-block; line-height: 52px; text-transform: lowercase; }
.cfg-modal.cfg-v2 #cfgNextBtn::first-letter { text-transform: uppercase; }
.cfg-modal.cfg-v2 .cfg-btn_outline > span { display: inline-block; text-transform: lowercase; }
.cfg-modal.cfg-v2 .cfg-btn_outline > span::first-letter { text-transform: uppercase; }
.cfg-modal.cfg-v2 .cfg-modal__share {
  width: 54px; height: 54px; border: 1px solid rgba(26, 26, 26, .2); border-radius: 0; background: #fff; color: var(--text);
  display: grid; place-items: center; transition: border-color .25s, color .25s;
}
.cfg-modal.cfg-v2 .cfg-modal__share:hover { border-color: var(--accent); color: var(--accent); }

/* ---------- планшет и телефон ---------- */
@media (max-width: 1024px) {
  .cfg-modal.cfg-v2 .cfg-modal__image { padding: 20px 20px 16px; }
  .cfg-modal.cfg-v2 .cfg-stepper { gap: 16px; padding: 16px 0; }
  .cfg-modal.cfg-v2 .cfg-modal__close-text { display: none; }
}
@media (max-width: 768px) {
  .cfg-modal.cfg-v2 .cfg-kit__name { font-size: 26px; }
  .cfg-modal.cfg-v2 .cfg-stage { height: clamp(280px, 46vh, 460px); }
  .cfg-modal.cfg-v2 .config-chip { height: 44px; padding: 0 12px; }
  .cfg-modal.cfg-v2 #cfgCoatingsContainer .cfg-coating-swatch { width: 64px; }
  .cfg-modal.cfg-v2 #cfgCoatingsContainer .cfg-coating-swatch__color { width: 64px; height: 64px; }
  .cfg-modal.cfg-v2 .cfg-btn { height: 50px; font-size: 14px; }
  .cfg-modal.cfg-v2 #cfgNextBtn { line-height: 48px; }
  .cfg-modal.cfg-v2 .cfg-modal__share { width: 50px; height: 50px; }
  .cfg-modal.cfg-v2 .pd-room-toggle { top: 8px; left: 8px; height: 38px; padding: 0 12px; font-size: 13px; }
  .cfg-modal.cfg-v2 .cfg-kit__toggle { border: 1px solid var(--line); border-radius: 0; background: #fff; box-shadow: none; }
  /* подвал в две строки: цена со ссылкой «Прислать расчёт», ниже — поделиться, корзина (значок) и «Далее» */
  .cfg-modal.cfg-v2 .cfg-modal__footer { flex-direction: column; align-items: stretch; gap: 10px; padding: 12px 16px calc(12px + env(safe-area-inset-bottom, 0px)); }
  .cfg-modal.cfg-v2 .cfg-modal__price { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; width: 100%; text-align: left; }
  .cfg-modal.cfg-v2 .cfg-modal__price strong { font-size: 24px; }
  .cfg-modal.cfg-v2 .cfg-modal__calc-toggle { font-size: 13px; }
  .cfg-modal.cfg-v2 .cfg-modal__actions { display: flex; flex-direction: row; flex-wrap: nowrap; gap: 8px; width: 100%; margin: 0; }
  .cfg-modal.cfg-v2 .cfg-modal__actions .cfg-btn_fill { grid-column: auto; }
  .cfg-modal.cfg-v2 .cfg-modal__actions .cfg-btn_outline { flex: 0 0 50px; width: 50px; padding: 0; }
  .cfg-modal.cfg-v2 .cfg-modal__actions .cfg-btn_outline > span {
    position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap;
  }
  .cfg-modal.cfg-v2 .cfg-modal__share { flex: 0 0 50px; align-self: auto; }
  .cfg-modal.cfg-v2 #cfgNextBtn { flex: 1 1 auto; width: auto; min-width: 0; padding: 0 14px; }
}

@media (prefers-reduced-motion: reduce) {
  .cfg-modal.cfg-v2 *, .cfg-modal.cfg-v2 *::before, .cfg-modal.cfg-v2 *::after { animation: none !important; transition: none !important; }
}

/* End */
/* /css/hardware.css?17918778584893 */
/* /local/assets/product/product.css?179265195342376 */
/* /local/assets/product/cfg.css?179265175118472 */