/* sn22-article-offer.css — блок предложения в теле статьи.
   15.08.2026 — создан. 21.08.2026 — прайс-таблица.
   21.08.2026 (вечер) — перевёрстан: было три ребёнка в сетке из двух колонок,
   из-за чего карточки каталога уезжали на новый ряд во всю ширину, а под формой
   зияла пустота высотой с таблицу. Теперь левая колонка = форма + карточки,
   правая = прайс; обе тянутся на одну высоту. */

.sn22-art-offer{
  margin:32px 0; padding:22px;
  border:1px solid #e3e8ef; border-radius:14px;
  background:linear-gradient(180deg,#f7fbff 0%,#ffffff 100%);
  display:grid; gap:18px;
  grid-template-columns:1fr;
  grid-template-areas:"form" "price" "cats";
}
@media (min-width:900px){
  .sn22-art-offer{
    grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);
    grid-template-areas:
      "form  price"
      "cats  price";
    grid-template-rows:auto 1fr;
    gap:20px 26px; padding:26px;
  }
}
.sn22-art-offer__form{grid-area:form;min-width:0}
.sn22-art-offer__price{grid-area:price;min-width:0}
.sn22-art-offer__cats{grid-area:cats;min-width:0;align-self:end}

.sn22-art-offer__title{ font-size:20px; line-height:1.3; font-weight:700; color:#12263f; margin:0 0 8px; }
@media (min-width:900px){ .sn22-art-offer__title{ font-size:22px; } }
.sn22-art-offer__lead{ margin:0 0 14px; color:#44536b; font-size:15px; line-height:1.5; }

.sn22-art-offer__row{ display:flex; flex-wrap:wrap; gap:10px; }
.sn22-art-offer__row input[type=tel]{
  flex:1 1 190px; min-width:0; min-height:46px; padding:0 14px;
  border:1px solid #cfd8e6; border-radius:9px; font-size:16px; background:#fff; color:#12263f;
}
.sn22-art-offer__row input[type=tel]:focus{ outline:none; border-color:#1a73c9; box-shadow:0 0 0 3px rgba(26,115,201,.15); }
.sn22-art-offer__btn{
  flex:0 1 auto; min-height:46px; padding:0 20px; border:0; border-radius:9px; cursor:pointer;
  background:#e8542a; color:#fff; font-size:15px; font-weight:600; line-height:46px;
  transition:background .15s ease;
}
.sn22-art-offer__btn:hover{ background:#cf4720; }
.sn22-art-offer__btn:focus-visible{ outline:2px solid #12263f; outline-offset:2px; }

.sn22-art-offer__agree{ display:flex; align-items:flex-start; gap:8px; margin:12px 0 0; font-size:12.5px; line-height:1.45; color:#5b6b82; cursor:pointer; }
.sn22-art-offer__agree input{ margin-top:2px; width:16px; height:16px; flex:none; }
.sn22-art-offer__agree a{ color:#1a73c9; }
.sn22-art-offer__mess{ min-height:0; margin:6px 0 0; font-size:13px; color:#b3391a; }
.sn22-art-offer__mess:empty{ margin:0; }
.sn22-art-offer__phone{ margin-top:10px; font-size:14px; color:#44536b; }
.sn22-art-offer__phone a{ color:#12263f; font-weight:700; text-decoration:none; }

/* Карточки каталога — в ряд, а не тремя полосами во всю ширину */
.sn22-art-offer__cats-title{ font-size:12px; font-weight:600; color:#7b8794; margin:0 0 8px; text-transform:uppercase; letter-spacing:.04em; }
.sn22-art-offer__cards{ display:grid; gap:8px; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); }
.sn22-art-offer__card{
  display:flex; flex-direction:column; gap:3px; padding:10px 12px;
  border:1px solid #dbe3ee; border-radius:10px; background:#fff; text-decoration:none;
  transition:border-color .15s ease, transform .15s ease;
}
.sn22-art-offer__card:hover{ border-color:#1a73c9; transform:translateY(-1px); }
.sn22-art-offer__card:focus-visible{ outline:2px solid #1a73c9; outline-offset:2px; }
.sn22-art-offer__card-name{ font-size:14px; font-weight:600; color:#12263f; line-height:1.3; }
.sn22-art-offer__card-go{ font-size:12.5px; color:#1a73c9; }
@media (prefers-reduced-motion:reduce){
  .sn22-art-offer__card{ transition:none }
  .sn22-art-offer__card:hover{ transform:none }
}

/* Прайс-таблица. Цены из базы закупа, сверены с фактом сделок B24. */
.sn22-art-offer__price{
  margin:0; padding:16px 18px; background:#fff;
  border:1px solid #e3e8ee; border-radius:10px;
  display:flex; flex-direction:column;
}
.sn22-art-offer__price-title{ font-weight:700; font-size:15px; color:#14283d; margin-bottom:10px; line-height:1.3; }
.sn22-art-offer__price-tbl{ width:100%; border-collapse:collapse; font-size:13.5px; }
.sn22-art-offer__price-tbl td{ padding:6px 4px; border-bottom:1px solid #eef2f6; vertical-align:top; }
.sn22-art-offer__price-tbl tr:last-child td{ border-bottom:0; }
.sn22-art-offer__price-tbl td.pn{ font-weight:600; color:#14283d; line-height:1.3; }
.sn22-art-offer__price-tbl td.pd{ color:#6b7a8a; font-size:12.5px; line-height:1.35; padding-left:10px; }
.sn22-art-offer__price-tbl td.pp{ text-align:right; font-weight:700; color:#c0392b; white-space:nowrap; font-variant-numeric:tabular-nums; padding-left:10px; }
.sn22-art-offer__price-note{ margin-top:auto; padding-top:10px; font-size:12px; color:#8b95a1; line-height:1.45; }

@media (max-width:899px){
  .sn22-art-offer__price{ margin-top:0; }
}
@media (max-width:600px){
  .sn22-art-offer{ padding:16px; margin:24px 0; gap:14px; }
  .sn22-art-offer__btn{ width:100%; }
  .sn22-art-offer__price{ padding:13px 14px; }
  .sn22-art-offer__price-tbl{ font-size:13px; }
  .sn22-art-offer__price-tbl td.pd{ display:none; }
  .sn22-art-offer__cards{ grid-template-columns:1fr; }
}

/* Блок «зоны ответственности» — только у монтажного интента (21.08.2026).
   Услуги монтажа мы не оказываем, но трафик по ним денежный: показываем честно,
   что берём на себя (расчёт, подбор, поставка, документация) и что остаётся
   монтажникам клиента. Живёт в левой колонке между формой и карточками. */
.sn22-art-offer{ grid-template-areas:"form" "price" "steps" "cats"; }
@media (min-width:900px){
  .sn22-art-offer{
    grid-template-areas:
      "form   price"
      "steps  price"
      "cats   price";
    grid-template-rows:auto auto 1fr;
  }
}
.sn22-art-offer__steps{ grid-area:steps; min-width:0; padding:14px 16px; background:#fff; border:1px solid #e3e8ee; border-radius:10px; }
.sn22-art-offer__steps-title{ font-size:13px; font-weight:700; color:#12263f; margin-bottom:10px; text-transform:uppercase; letter-spacing:.04em; }
.sn22-art-offer__steps-cols{ display:grid; gap:14px; grid-template-columns:1fr; }
@media (min-width:560px){ .sn22-art-offer__steps-cols{ grid-template-columns:1fr 1fr; gap:18px; } }
.sn22-art-offer__steps-head{ font-size:12.5px; font-weight:700; margin-bottom:6px; padding-bottom:5px; border-bottom:2px solid; }
.sn22-art-offer__steps-head.sn-ours{ color:#1a7a4a; border-color:#bfe3cd; }
.sn22-art-offer__steps-head.sn-yours{ color:#8a6212; border-color:#ecdcb0; }
.sn22-art-offer__steps-col ul{ margin:0; padding-left:16px; }
.sn22-art-offer__steps-col li{ font-size:13.5px; line-height:1.45; color:#44536b; margin-bottom:5px; }
.sn22-art-offer__steps-col li:last-child{ margin-bottom:0; }
.sn22-art-offer__steps-note{ margin-top:11px; padding-top:10px; border-top:1px solid #eef2f6; font-size:12.5px; line-height:1.45; color:#7b8794; }
@media (max-width:600px){
  .sn22-art-offer__steps{ padding:12px 13px; }
  .sn22-art-offer__steps-col li{ font-size:13px; }
}
