/* ========================================
   Пиломатериалы — стили посадок
   pilomaterialy-sever / pilomaterialy-yug
======================================== */

:root {
  --red: #c02122;
  --red-hover: #a01b1c;
  --dark: #1a1515;
  --gray-bg: #f5f5f5;
  --btn-disabled: #b9b9b9;
}

/* ── Hero banner + Cover ── */

.s-hero {
  position: relative;
  padding: 0 0 50px;
  color: #101010;
}

.s-hero--cover {
  background: #e9e9e9 url("/static/images/img/pilomaterialy/hero-bg-rect.jpg") center top / cover no-repeat;
}

.s-hero .container {
  position: relative;
  z-index: 1;
  text-align: center;
  max-width: 1310px;
}

.s-hero--yug .hero__title {
  font-size: 60px !important;
  max-width: 900px;
}

.content .s-hero .hero__title {
  font-family: var(--second-family);
  font-size: clamp(32px, 3.958vw, 76px) !important;
  font-weight: 700;
  line-height: 1.05;
  text-transform: uppercase;
  margin: 0 auto 20px;
  max-width: 1147px;
  color: #222121;
  letter-spacing: 0;
}

.hero__subtitle {
  font-size: 20px;
  line-height: 1.2;
  max-width: 954px;
  margin: 0 auto 30px;
  color: #101010;
}

.hero__cond-label {
  font-size: 16px;
  margin-bottom: 16px;
  color: #333;
}

.hero__conditions {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  max-width: 960px;
  margin: 0 auto 30px;
}

.hero__cond {
  background: rgba(255,255,255,.92);
  color: #333;
  border-radius: 16px;
  padding: 20px 24px;
  text-align: center;
  backdrop-filter: blur(4px);
  border: 1px solid rgba(0,0,0,.06);
}

.hero__cond-num {
  display: inline-block;
  padding: 4px 12px;
  border-radius: 999px;
  background: var(--red);
  color: #fff;
  font-size: 15px;
  font-weight: 400;
  margin-bottom: 10px;
}

.hero__cond p {
  font-size: 14px;
  line-height: 1.5;
  margin: 0;
  color: #414040;
}

.hero__cta-row {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 24px;
  margin: 0 auto 24px;
}

.hero__cta-row .Button {
  padding: 20px 30px;
  font-size: 20px;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: none;
  border-radius: 10px;
}

.Button_Dark {
  background: var(--dark);
  color: #fff;
  border: none;
}

.Button_Dark:hover {
  background: #000;
  color: #fff;
}

.hero__phones {
  text-align: center;
  font-size: 15px;
  line-height: 1.6;
  color: #333;
}

.hero__phones strong { font-weight: 700; }

.hero__bottom-text {
  margin-top: 20px;
  font-size: 14px;
  line-height: 1.5;
  color: #666;
}


/* ── Карточки товаров ── */

.s-products {
  padding: 80px 0 60px;
  background: #fff;
}

.s-products .section__title {
  font-size: 83px;
  line-height: 1;
  color: #101010;
  margin-bottom: 16px;
}

.s-products .section__subtitle {
  font-size: 22px;
  line-height: 1.35;
  color: #565656;
  max-width: 980px;
}

.s-products > .container {
  max-width: 1574px;
}

.prod-card {
  display: grid;
  grid-template-columns: minmax(380px, 450px) minmax(0, 1fr);
  gap: 40px;
  align-items: start;
  margin-bottom: 40px;
  padding: 35px;
  background: #fff;
  border-radius: 20px;
  border: none;
}

.prod-card:last-child { margin-bottom: 0; }

.prod-card__gallery img {
  width: 100%;
  border-radius: 10px;
  object-fit: cover;
  display: block;
  height: auto;
  max-height: none;
  min-height: 0;
}

.prod-card__name {
  font-family: var(--second-family);
  font-size: 56px;
  font-weight: 700;
  text-transform: none;
  margin: 0 0 11px;
  color: #101010;
  line-height: 1;
}

.prod-card__desc {
  font-size: 14px;
  line-height: 1.4;
  color: #4b4b4b;
  margin: 0 0 20px;
  max-width: 891px;
}

.prod-card__props {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px 40px;
  margin: 20px 0 0;
  padding-top: 20px;
}

.prod-card__props + .prod-card__props {
  border-top: 1px solid #d3d3d3;
  margin-top: 22px;
  padding-top: 22px;
}

.prod-card__props--3 {
  grid-template-columns: minmax(120px, 193px) minmax(0, 1fr) minmax(240px, 271px);
  align-items: start;
}

.prod-card__props--3 > .prod-card__price-block {
  margin: 0;
  min-width: 0;
}

.prod-card__prop--spacer {
  visibility: hidden;
  pointer-events: none;
  min-height: 0;
}

.prod-card__prop {
  padding: 0;
  background: none;
  border-radius: 0;
}

.prod-card__prop-label {
  display: inline-block;
  margin: 0 0 10px;
  padding: 4px 12px;
  border-radius: 999px;
  background: rgba(216, 216, 216, 0.7);
  font-size: 15px;
  font-weight: 400;
  text-transform: none;
  color: #404040;
  line-height: 1.4;
}

.prod-card__prop-val {
  font-size: 15px;
  line-height: 1.35;
  color: #4b4b4b;
}

.prod-card__prop-val small {
  font-size: 13px;
  color: #565656;
}

.prod-card__prices {
  margin-top: 22px;
  padding-top: 22px;
  border-top: 1px solid #d3d3d3;
  display: grid;
  grid-template-columns: minmax(220px, 271px) minmax(0, 1fr);
  column-gap: 49px;
  row-gap: 12px;
  align-items: start;
}

.prod-card__prices > .prod-card__price-block:nth-of-type(1) { grid-column: 1; grid-row: 1; }
.prod-card__prices > .prod-card__price-block:nth-of-type(2) { grid-column: 1; grid-row: 2; }
.prod-card__prices > small { grid-column: 1; grid-row: 3; margin: 0; }
.prod-card__prices > .prod-card__price-block:nth-of-type(3) {
  grid-column: 2;
  grid-row: 1 / span 3;
  align-self: start;
}

.prod-card__prices--2plus1 > .prod-card__price-block:nth-of-type(1) {
  grid-column: 1;
  grid-row: 1 / span 2;
}

.prod-card__prices--2plus1 > small {
  grid-column: 1;
  grid-row: 3;
}

.prod-card__prices--2plus1 > .prod-card__price-block:nth-of-type(2) {
  grid-column: 2;
  grid-row: 1 / span 3;
}

.prod-card__prices--dop-only > small {
  grid-column: 1;
  grid-row: 1;
  align-self: start;
}

.prod-card__prices--dop-only > .prod-card__price-block:nth-of-type(1) {
  grid-column: 2;
  grid-row: 1 / span 2;
  align-self: start;
}

.prod-card__price-block {
  padding: 0;
  background: none;
  border-radius: 0;
  margin: 0;
}

.prod-card__price-label {
  display: inline-block;
  width: max-content;
  max-width: 100%;
  margin: 0 0 8px;
  padding: 4px 12px;
  border-radius: 999px;
  background: rgba(216, 216, 216, 0.7);
  font-size: 15px;
  font-weight: 400;
  color: #404040;
  white-space: nowrap;
}

.prod-card__price-val {
  font-size: 15px;
  line-height: 1.35;
  color: #4b4b4b;
}

.prod-card__prices > small {
  display: block;
  font-size: 13px;
  color: #565656;
  margin: 4px 0 12px;
}

.prod-card__price-block > small {
  display: block;
  font-size: 13px;
  color: #565656;
  margin: 4px 0 8px;
}

/* Toggle / spoiler (mobile only) */
.prod-card__toggle {
  display: none;
  align-items: center;
  gap: 8px;
  margin-top: 12px;
  cursor: pointer;
  color: var(--red);
  font-family: 'Rubik', sans-serif;
  font-size: 16px;
  font-weight: 400;
  -webkit-tap-highlight-color: transparent;
}
.prod-card__toggle-arrow {
  display: inline-block;
  width: 0;
  height: 0;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-top: 7px solid var(--red);
  transition: transform .25s ease;
}
.prod-card--expanded .prod-card__toggle-arrow {
  transform: rotate(180deg);
}

.prod-card__actions {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: flex-start;
  gap: 24px;
  margin-top: 28px;
}

.prod-card__actions > .Button,
.prod-card__actions > .prod-card__calc-btn {
  flex: 0 0 auto;
  width: auto;
  max-width: none;
}

.prod-card__calc-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  box-sizing: border-box;
  min-height: 64px;
  text-transform: none;
  letter-spacing: 0;
  font-size: 20px;
  font-weight: 400;
  font-family: var(--main-family, Rubik, sans-serif);
  padding: 20px 30px;
  border-radius: 10px;
  text-decoration: none;
  flex: 0 0 auto;
  width: auto;
}

.prod-card__footnote {
  display: flex;
  align-items: flex-start;
  gap: 6px;
  margin: 0;
  flex: 1 1 0;
  min-width: 0;
  max-width: 610px;
}

.prod-card__footnote-star {
  flex: 0 0 auto;
  font-size: 16px;
  line-height: 1.5;
  color: #565656;
}

.prod-card__footnote p {
  font-size: 12px;
  line-height: 1.5;
  color: #565656;
  margin: 0;
  flex: 1 1 auto;
  min-width: 0;
}


/* ── Сорта материала ── */

.s-sorts {
  padding: 80px 0;
  background: #fff;
}

.sorts__group-label {
  display: inline-block;
  padding: 8px 20px;
  background: var(--red);
  color: #fff;
  font-family: var(--second-family);
  font-size: 14px;
  font-weight: 700;
  text-transform: uppercase;
  border-radius: 6px;
  margin: 30px 0 20px;
}

.sorts__grid {
  display: grid;
  gap: 16px;
  margin-bottom: 30px;
}

/* Брус и обрезная доска: 3-column grid */
.sorts__grid--brus {
  grid-template-columns: repeat(3, 1fr);
  grid-template-areas:
    "s1 s1 s2"
    "s3 p1 p2"
    "s4 s4 p2";
}

.sorts__item--s1 { grid-area: s1; }
.sorts__item--s2 { grid-area: s2; }
.sorts__item--s3 { grid-area: s3; }
.sorts__photo--p1 { grid-area: p1; }
.sorts__photo--p2 { grid-area: p2; }
.sorts__item--s4 { grid-area: s4; }

/* Строганная доска: 3-column grid */
.sorts__grid--strog {
  grid-template-columns: repeat(3, 1fr);
  grid-template-areas:
    "ea ab ab"
    "pe sv pb"
    "pe sc sc";
}

.sorts__item--ea { grid-area: ea; }
.sorts__item--ab { grid-area: ab; }
.sorts__photo--pe { grid-area: pe; }
.sorts__item--sv { grid-area: sv; }
.sorts__photo--pb { grid-area: pb; }
.sorts__item--sc { grid-area: sc; }

.sorts__item {
  background: var(--gray-bg);
  border-radius: 14px;
  padding: 24px;
  background-size: cover;
  background-position: center;
}

.sorts__item[style*="background-image"] {
  background-color: rgba(246,246,246,.88);
  background-blend-mode: overlay;
}

.sorts__item h4 {
  font-family: var(--second-family);
  font-size: 18px;
  font-weight: 700;
  margin: 0 0 8px;
  color: var(--dark);
}

.sorts__item p {
  font-size: 14px;
  line-height: 1.5;
  color: #565656;
  margin: 0 0 12px;
}

.sorts__photo {
  border-radius: 14px;
  overflow: hidden;
}

.sorts__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  border-radius: 14px;
}

.sorts__note {
  font-size: 14px;
  line-height: 1.6;
  color: #999;
  max-width: 800px;
}


/* ── Почему с нами ── */

.s-why {
  padding: 80px 0 100px;
  background: var(--gray-bg);
}

.section__title--why {
  font-size: 74px;
  line-height: 1;
  text-transform: uppercase;
  max-width: 980px;
}

.why__list {
  margin-top: 40px;
  display: flex;
  flex-direction: column;
  gap: 0;
}

.why__row {
  padding: 28px 0;
  border-bottom: 1px solid #dfdfdf;
}

.why__row-head {
  display: flex;
  align-items: flex-start;
  gap: 20px;
  margin-bottom: 12px;
}

.why__num {
  font-family: var(--main-family, Rubik, sans-serif);
  font-size: 70px;
  font-weight: 300;
  line-height: 1;
  color: var(--red);
  flex: 0 0 auto;
  min-width: 90px;
}

.why__label {
  font-family: var(--second-family);
  font-size: 41px;
  font-weight: 700;
  text-transform: uppercase;
  color: #101010;
  line-height: 1.05;
  margin: 0;
}

.why__row p {
  font-size: 20px;
  line-height: 1.45;
  color: #565656;
  margin: 0 0 0 110px;
}


/* ── Калькулятор секция ── */

.s-calculator {
  padding: 100px 0;
  background: var(--red);
  position: relative;
}

.s-calculator::before {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, .21);
  pointer-events: none;
}

.s-calculator .container {
  position: relative;
  z-index: 1;
  max-width: 1315px;
}

/* ── Spec strip ── */

.s-spec-strip {
  padding: 40px 0 100px;
  background: #fff;
}

.s-spec-strip__inner {
  display: flex;
  align-items: center;
  gap: 40px;
  max-width: 1200px;
}

.s-spec-strip__inner .Button_Dark {
  flex: 0 0 auto;
  padding: 20px 30px;
  font-size: 20px;
  border-radius: 10px;
  text-transform: none;
  letter-spacing: 0;
}

.s-spec-strip__text {
  margin: 0;
  font-size: 20px;
  line-height: 1.25;
  color: #565656;
  max-width: 635px;
}

/* ── Warranty ── */

.s-warranty {
  padding: 60px 0 100px;
  background: #fff;
}

.section__title--warranty {
  font-size: 74px;
  line-height: 1;
  text-transform: uppercase;
}

.warranty__subhead {
  font-family: var(--second-family);
  font-size: 41px;
  text-transform: uppercase;
  margin: 40px 0 24px;
  color: #101010;
}

.warranty__cards {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  margin-bottom: 24px;
}

.warranty__card {
  background: #fdfdfd;
  border: 1px solid #d8d8d8;
  border-radius: 16px;
  overflow: hidden;
  min-height: 200px;
}

.warranty__card-img {
  width: calc(100% - 46px);
  margin: 23px 23px 0;
  height: auto;
  aspect-ratio: 352 / 169;
  object-fit: cover;
  display: block;
  border-radius: 15px;
}

.warranty__card-text {
  padding: 16px 23px 23px;
}

.warranty__card-tag {
  display: inline-block;
  margin: 0 0 12px;
  padding: 6px 15px;
  border-radius: 999px;
  background: var(--red);
}

.warranty__card h4 {
  font-family: var(--second-family);
  font-size: 26px;
  font-weight: 700;
  text-transform: lowercase;
  color: #fff;
  margin: 0;
  line-height: 1.05;
}

.warranty__card p {
  font-size: 17px;
  line-height: 1.35;
  color: #565656;
  margin: 0;
}

.warranty__bottom {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}

.warranty__block {
  border: 1px solid #d8d8d8;
  border-radius: 16px;
  overflow: hidden;
  display: grid;
  grid-template-columns: 1fr 1fr;
}

.warranty__block-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  border-radius: 15px 0 0 15px;
  min-height: 240px;
}

.warranty__block-text {
  padding: 22px 22px;
}

.warranty__block h4 {
  font-family: var(--second-family);
  font-size: 26px;
  text-transform: lowercase;
  color: var(--red);
  margin: 0 0 14px;
}

.warranty__block p {
  font-size: 17px;
  line-height: 1.35;
  color: #4b4b4b;
  margin: 0;
}


/* ── Доставка ── */

.s-delivery {
  padding: 80px 0;
  background: #fff;
}

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

.delivery__card {
  background: var(--gray-bg);
  border-radius: 14px;
  padding: 24px;
}

.delivery__card--photo {
  padding: 0;
  overflow: hidden;
}

.delivery__card--photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  border-radius: 14px;
}

.delivery__icon {
  width: 50px;
  height: 50px;
  object-fit: contain;
  margin-bottom: 14px;
}

.delivery__card h4 {
  font-family: var(--second-family);
  font-size: 16px;
  font-weight: 700;
  text-transform: uppercase;
  margin: 0 0 10px;
  color: var(--red);
}

.delivery__card p {
  font-size: 14px;
  line-height: 1.5;
  color: #565656;
  margin: 0;
}

.delivery__info-block {
  background: var(--red);
  color: #fff;
  border-radius: 16px;
  padding: 30px 40px;
  margin: 30px 0;
}

.delivery__info-block h4 {
  font-family: var(--second-family);
  font-size: 20px;
  font-weight: 700;
  margin: 0 0 20px;
  text-align: center;
}

.delivery__info-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 20px;
}

.delivery__info-item {
  font-size: 14px;
  line-height: 1.5;
  padding: 10px;
  border-left: 2px solid rgba(255,255,255,.3);
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.delivery__info-icon {
  width: 32px;
  height: 32px;
  object-fit: contain;
  filter: brightness(0) invert(1);
}

.delivery__cost {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 40px;
  align-items: center;
  margin-top: 30px;
}

.delivery__cost h4 {
  font-family: var(--second-family);
  font-size: 18px;
  font-weight: 700;
  margin: 0 0 10px;
}

.delivery__cost p {
  font-size: 14px;
  line-height: 1.6;
  color: #565656;
  margin: 0;
}

.delivery__cost-action { text-align: center; }

.delivery__cost-phones {
  margin-top: 12px;
  font-size: 14px;
  line-height: 1.6;
}


/* ── Контакты ── */

.s-contacts-pilom {
  padding: 80px 0;
  background-color: var(--gray-bg);
  background-size: cover;
  background-position: center right;
  background-repeat: no-repeat;
}

.contacts-pilom__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  margin-top: 30px;
}

.contacts-pilom__item {
  background: rgba(255,255,255,.92);
  backdrop-filter: blur(4px);
  border-radius: 14px;
  padding: 24px;
}

.contacts-pilom__item h4 {
  font-family: var(--second-family);
  font-size: 14px;
  font-weight: 700;
  text-transform: uppercase;
  color: #999;
  margin: 0 0 12px;
}

.contacts-pilom__item p {
  font-size: 15px;
  line-height: 1.6;
  color: #333;
  margin: 0;
}

.contacts-pilom__item a { color: #333; }

.contacts-pilom__item--cta {
  background: rgba(255,255,255,.92);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
}

.contacts-pilom__item--cta p {
  font-size: 13px;
  color: #666;
}


/* ── pcalc (калькулятор) ── */

.pcalc {
  max-width: 980px;
  margin: 0 auto;
  padding: 60px 167px;
  border-radius: 20px;
  background: #fff;
  box-shadow: none;
}

.pcalc__header { margin-bottom: 24px; }

.pcalc__title {
  margin: 0;
  font-family: var(--second-family);
  font-size: 70px;
  font-weight: 700;
  line-height: 1.05;
  text-transform: uppercase;
  color: #101010;
}

.pcalc__subtitle {
  margin: 12px 0 0;
  font-size: 20px;
  line-height: 1.35;
  color: #565656;
}

.pcalc__rows { margin-bottom: 16px; }
.pcalc__row { margin-bottom: 10px; }

.pcalc__row-labels {
  display: grid;
  grid-template-columns: 1fr 1fr 140px;
  gap: 16px;
  margin-bottom: 6px;
}

.pcalc__field-label {
  font-size: 13px;
  font-weight: 600;
  text-transform: uppercase;
  color: #333;
}

.pcalc__row-fields {
  display: grid;
  grid-template-columns: 1fr 1fr 140px;
  gap: 16px;
  align-items: center;
}

.pcalc__field { position: relative; }

.pcalc__select,
.pcalc__input {
  width: 100%;
  height: 48px;
  padding: 0 16px;
  border: 1px solid #d9d9d9;
  border-radius: 10px;
  background: #fff;
  font-family: var(--font-family);
  font-size: 15px;
  color: #333;
  box-sizing: border-box;
}

.pcalc__select {
  padding-right: 36px;
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%23666'/%3E%3C/svg%3E") no-repeat right 14px center;
  appearance: none;
  -webkit-appearance: none;
  cursor: pointer;
}

.pcalc__select:disabled,
.pcalc__input:disabled {
  background-color: #f5f5f5;
  color: #aaa;
  cursor: default;
}

.pcalc__input::placeholder { color: #bbb; }

.pcalc__remove-btn {
  position: absolute;
  top: 50%;
  right: -28px;
  transform: translateY(-50%);
  width: 24px; height: 24px;
  background: none; border: none;
  font-size: 20px; color: #999;
  cursor: pointer; line-height: 1; padding: 0;
}
.pcalc__remove-btn:hover { color: var(--red); }

.pcalc__tooltip {
  margin-top: 4px;
  padding: 6px 12px;
  background: #f8f8f8;
  border: 1px solid #eee;
  border-radius: 8px;
  font-size: 13px;
  color: #888;
  text-align: right;
}

.pcalc__add-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 0;
  background: none; border: none;
  font-family: var(--font-family);
  font-size: 15px;
  font-weight: 500;
  color: var(--red);
  cursor: pointer;
}

.pcalc__add-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px; height: 22px;
  border-radius: 50%;
  background: rgba(192,33,34,.1);
  font-weight: 700;
  font-size: 16px;
  color: var(--red);
}

.pcalc__warning {
  margin: 12px 0;
  padding: 10px 16px;
  border-radius: 10px;
  background: transparent;
  border: none;
  font-size: 14px;
  line-height: 1.4;
  color: #565656;
}

.pcalc__delivery {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  margin: 20px 0;
}

.pcalc__delivery-option {
  display: inline-flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 15px;
  color: #333;
  cursor: pointer;
}

.pcalc__delivery-option input[type="checkbox"] { display: none; }

.pcalc__delivery-check {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px; height: 22px;
  min-width: 22px;
  border: 2px solid #ccc;
  border-radius: 4px;
  background: #fff;
  margin-top: 1px;
  transition: all .2s;
}

.pcalc__delivery-option input:checked + .pcalc__delivery-check {
  border-color: var(--red);
  background: var(--red);
}

.pcalc__delivery-option input:checked + .pcalc__delivery-check::after {
  content: '✓';
  color: #fff;
  font-size: 14px;
  font-weight: 700;
}

.pcalc__delivery-note {
  display: block;
  margin-top: 4px;
  font-size: 13px;
  line-height: 1.5;
  color: #777;
}

.pcalc__unload-note {
  margin: 8px 0 16px;
  font-size: 13px;
  color: #999;
}

.pcalc__submit { margin-top: 20px; text-align: center; }

.pcalc__toast {
  max-width: 353px;
  margin: 16px auto 0;
  padding: 19px 23px;
  background: #fff;
  border-radius: 6px;
  font-size: 17px;
  color: #504f4f;
  text-align: center;
  box-shadow: 0 4px 24px rgba(0, 0, 0, .12);
}

.pcalc__toast[hidden] { display: none; }

.pcalc__submit-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 56px;
  border: none;
  border-radius: 12px;
  font-family: var(--second-family);
  font-size: 18px;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: #fff;
  transition: background .3s;
  cursor: pointer;
}

.pcalc__submit-btn--disabled { background: var(--btn-disabled); cursor: default; }
.pcalc__submit-btn--active { background: var(--red); }
.pcalc__submit-btn--active:hover { background: var(--red-hover); }

.pcalc__footer-note {
  margin-top: 20px;
  font-size: 20px;
  line-height: 1.35;
  color: #565656;
}
.pcalc__footer-note strong { color: #333; }

.pcalc__result-summary {
  margin: 16px 0;
  font-size: 15px;
  line-height: 1.6;
  color: #565656;
}

.pcalc__result-box {
  padding: 24px 28px;
  border-radius: 14px;
  background: var(--gray-bg);
  border: 1px solid #eee;
}

.pcalc__result-line {
  margin-bottom: 6px;
  font-size: 15px;
  line-height: 1.5;
  color: #565656;
}
.pcalc__result-line strong { color: #333; font-weight: 600; }

.pcalc__result-total {
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid #ddd;
  font-family: var(--second-family);
  font-size: 20px;
  font-weight: 700;
  text-transform: uppercase;
  color: #333;
}
.pcalc__result-total strong { color: var(--red); font-size: 24px; }

.pcalc__disclaimers {
  margin-top: 16px;
  font-size: 12px;
  line-height: 1.5;
  color: #999;
}
.pcalc__disclaimers p { margin: 4px 0; }

.pcalc__result-actions {
  display: flex;
  gap: 16px;
  margin-top: 24px;
}

.pcalc__btn {
  flex: 1;
  height: 56px;
  border-radius: 10px;
  font-family: var(--main-family, Rubik, sans-serif);
  font-size: 20px;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: none;
  cursor: pointer;
  transition: all .2s;
}

.pcalc__btn--primary { background: var(--red); color: #fff; border: none; }
.pcalc__btn--primary:hover { background: var(--red-hover); }
.pcalc__btn--outline { background: #fff; color: #333; border: 2px solid #ddd; }
.pcalc__btn--outline:hover { border-color: var(--red); color: var(--red); }
.pcalc__btn--full { width: 100%; }
.pcalc__btn--thanks { min-width: 200px; }

.pcalc__contact-overlay {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 300px;
}

.pcalc__contact-box {
  width: 100%;
  max-width: 500px;
  margin: 0 auto;
  position: relative;
}

.pcalc__contact-close {
  position: absolute;
  top: 0; right: 0;
  width: 32px; height: 32px;
  background: none; border: none;
  font-size: 24px; color: #999; cursor: pointer;
}

.pcalc__contact-title {
  font-family: var(--second-family);
  font-size: 28px;
  font-weight: 700;
  text-transform: uppercase;
  color: var(--dark);
  margin: 0 0 20px;
}

.pcalc__contact-fields {
  display: flex;
  flex-direction: column;
  gap: 14px;
  margin-bottom: 20px;
}

.pcalc__contact-field label {
  display: block;
  margin-bottom: 6px;
  font-size: 14px;
  color: #333;
}

.pcalc__thanks-overlay {
  text-align: center;
  padding: 50px 0;
}

.pcalc__thanks-title {
  font-family: var(--second-family);
  font-size: 52px;
  font-weight: 700;
  text-transform: uppercase;
  color: var(--dark);
}

.pcalc__thanks-text {
  margin: 12px 0 30px;
  font-size: 18px;
  color: #565656;
}


/* ── Общее ── */

.section__title {
  font-family: var(--second-family);
  font-size: 42px;
  font-weight: 700;
  line-height: 1.1;
  text-transform: uppercase;
  color: var(--dark);
  margin: 0 0 10px;
}

.section__subtitle {
  font-size: 16px;
  line-height: 1.5;
  color: #565656;
  margin: 0 0 20px;
  max-width: 800px;
}


/* ════════════════════════════════
   Responsive
════════════════════════════════ */

@media screen and (max-width: 1100px) {
  .content .s-hero .hero__title { font-size: 36px !important; }
  .hero__conditions { grid-template-columns: 1fr; max-width: 500px; }
  .prod-card { grid-template-columns: 280px minmax(0, 1fr); gap: 24px; padding: 30px; }
  .prod-card__props--3 { grid-template-columns: 1fr 1fr; }
  .prod-card__props--3 > .prod-card__price-block { grid-column: 1 / -1; }
  .prod-card__props { grid-template-columns: 1fr 1fr; }
  .prod-card__name { font-size: 42px; }
  .s-products .section__title { font-size: 56px; }
  .delivery__grid { grid-template-columns: repeat(2, 1fr); }
  .delivery__info-grid { grid-template-columns: repeat(3, 1fr); }
  .contacts-pilom__grid { grid-template-columns: repeat(2, 1fr); }
  .why__row p { margin-left: 0; }
  .why__num { font-size: 48px; min-width: 64px; }
  .why__label { font-size: 28px; }
  .warranty__cards {
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    gap: 16px;
    padding-bottom: 8px;
  }
  .warranty__card {
    flex: 0 0 320px;
    scroll-snap-align: start;
  }
  .warranty__bottom { grid-template-columns: 1fr; }
  .warranty__block { grid-template-columns: 1fr; }
  .warranty__block-img { border-radius: 15px 15px 0 0; min-height: 180px; }
  .s-spec-strip__inner { flex-direction: column; align-items: flex-start; }
  .section__title--why,
  .section__title--warranty { font-size: 42px; }
  .sorts__grid--brus,
  .sorts__grid--strog {
    grid-template-columns: 1fr 1fr;
    grid-template-areas: none;
  }
  .sorts__grid--brus > *,
  .sorts__grid--strog > * { grid-area: auto; }
  .pcalc { padding: 30px 32px; }
  .pcalc__title { font-size: 32px; }
  .section__title { font-size: 34px; }
}

@media screen and (max-width: 768px) {
  .content .s-hero .hero__title { font-size: 26px !important; }
  .s-hero--yug .hero__title { font-size: 24px !important; }
  .hero__cta-row { flex-direction: column; align-items: stretch; }
  .hero__cta-row .Button { width: 100%; text-align: center; }
  .warranty__cards {
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    gap: 12px;
    padding-bottom: 8px;
  }
  .warranty__card { flex: 0 0 280px; scroll-snap-align: start; }
  .warranty__block { grid-template-columns: 1fr; }
  .warranty__block-img { border-radius: 15px 15px 0 0; min-height: 160px; }
  .hero__subtitle { font-size: 15px; }
  .prod-card { grid-template-columns: 1fr; gap: 16px; padding: 20px 16px; }
  .prod-card__gallery img { max-height: 360px; min-height: 0; border-radius: 10px; }
  .prod-card__toggle { display: flex; }
  .prod-card__details { display: none; }
  .prod-card--expanded .prod-card__details { display: block; }
  .prod-card__desc {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
  .prod-card--expanded .prod-card__desc {
    display: block;
    -webkit-line-clamp: unset;
    overflow: visible;
  }
  .prod-card__props { grid-template-columns: 1fr; }
  .prod-card__name { font-size: 36px; }
  .prod-card__prices { grid-template-columns: 1fr; }
  .prod-card__prices > .prod-card__price-block,
  .prod-card__prices > small { grid-column: 1 !important; grid-row: auto !important; }
  .prod-card__actions { flex-direction: column; flex-wrap: nowrap; gap: 16px; }
  .prod-card__footnote { max-width: none; }
  .s-products .section__title { font-size: 40px; }
  .delivery__grid { grid-template-columns: 1fr; }
  .delivery__info-grid { grid-template-columns: 1fr; }
  .delivery__cost { grid-template-columns: 1fr; }
  .contacts-pilom__grid { grid-template-columns: 1fr; }
  .sorts__grid--brus,
  .sorts__grid--strog {
    grid-template-columns: 1fr;
    grid-template-areas: none;
  }
  .sorts__grid--brus > *,
  .sorts__grid--strog > * { grid-area: auto; }
  .sorts__photo { min-height: 200px; }
  .section__title { font-size: 26px; }
  .pcalc { padding: 24px 20px; border-radius: 16px; }
  .pcalc__title { font-size: 24px; }
  .pcalc__row-labels,
  .pcalc__row-fields { grid-template-columns: 1fr; gap: 8px; }
  .pcalc__row-labels { display: none; }
  .pcalc__field::before {
    content: attr(data-label);
    display: block;
    margin-bottom: 4px;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    color: #666;
  }
  .pcalc__remove-btn {
    position: static;
    text-align: right;
    width: 100%;
    margin-top: 6px;
  }
  .pcalc__delivery { flex-direction: column; gap: 12px; }
  .pcalc__result-actions { flex-direction: column; gap: 10px; }
  .pcalc__btn { width: 100%; }
}

@media screen and (max-width: 481px) {
  .hero__title { font-size: 22px; }
  .pcalc { padding: 20px 16px; }
  .pcalc__title { font-size: 20px; }
  .pcalc__thanks-title { font-size: 36px; }
  .pcalc__contact-title { font-size: 22px; }
}