/* Оформление каталога памятников. Правится скриптом stili.py */

/* --- Плитка каталога --- */
.woocommerce ul.products{display:grid!important;grid-template-columns:repeat(4,1fr);gap:26px;margin:0 0 30px}
.woocommerce ul.products::before,.woocommerce ul.products::after{display:none!important}
.woocommerce ul.products li.product{width:auto!important;margin:0!important;float:none!important;
  border:1px solid #e3e6ea;border-radius:10px;padding:18px 16px 20px;background:#fff;text-align:center;
  display:flex;flex-direction:column;transition:box-shadow .2s,border-color .2s}
.woocommerce ul.products li.product:hover{border-color:#c9ced6;box-shadow:0 6px 20px rgba(20,30,50,.09)}
.woocommerce ul.products li.product a img{height:230px;width:auto;max-width:100%;object-fit:contain;
  margin:0 auto 14px!important;display:block}
.woocommerce ul.products li.product .woocommerce-loop-product__title{font-size:15px!important;line-height:1.35;
  font-weight:600;padding:0 0 6px!important;min-height:44px;color:#1c2431}
.woocommerce ul.products li.product .price{font-size:19px!important;font-weight:700;color:#111823;margin-top:auto}
.woocommerce ul.products li.product .price del,.woocommerce ul.products li.product .price ins{display:none}

/* --- Страница модели --- */
.woocommerce div.product{display:flex;flex-wrap:wrap;gap:44px;align-items:flex-start}
.woocommerce div.product div.images.woocommerce-product-gallery{flex:0 0 360px;max-width:360px;
  width:360px!important;margin:0!important;border:1px solid #e3e6ea;border-radius:10px;padding:18px;background:#fff}
.woocommerce div.product div.images img{width:100%;height:auto}
.woocommerce div.product div.summary{flex:1 1 340px;margin:0!important;width:auto!important;min-width:0}
.woocommerce div.product .product_title{font-size:28px;line-height:1.25;margin-bottom:14px}
.woocommerce div.product p.price{font-size:30px!important;font-weight:700;color:#111823;margin:0 0 16px}
.woocommerce div.product .woocommerce-product-details__short-description{font-size:15px;line-height:1.6;color:#39424f}
.woocommerce div.product .product_meta{font-size:14px;color:#6a7280;margin-top:18px}

/* --- Витрина каталога: заявка вместо корзины --- */
.woocommerce a.add_to_cart_button,.woocommerce button.single_add_to_cart_button,
.woocommerce div.product form.cart,.woocommerce .quantity,
.woocommerce a.added_to_cart,.woocommerce .woocommerce-message,
.woocommerce-cart-form,.wc-block-cart{display:none!important}

/* --- Кнопка «Оставить заявку», подставляется в описание товара --- */
.zayavka{display:inline-block;margin:0;padding:15px 32px;border-radius:8px;background:#c04f40;
  color:#fff!important;font-weight:600;font-size:16px;text-decoration:none!important;transition:background .2s}
.zayavka:hover{background:#a8442f}
.zayavka:focus-visible{outline:2px solid #0c1f2f;outline-offset:3px}

/* --- Телефоны и планшеты --- */
@media(max-width:1100px){.woocommerce ul.products{grid-template-columns:repeat(3,1fr)}}
@media(max-width:820px){
  .woocommerce ul.products{grid-template-columns:repeat(2,1fr);gap:16px}
  .woocommerce ul.products li.product a img{height:170px}
  .woocommerce div.product{gap:24px}
  .woocommerce div.product div.images.woocommerce-product-gallery{flex:1 1 100%;max-width:100%;width:100%!important}
  .woocommerce div.product .product_title{font-size:22px}
  .woocommerce div.product p.price{font-size:25px!important}
}
@media(max-width:480px){.woocommerce ul.products{grid-template-columns:1fr}}

/* --- Ширина колонки описания: длинная строка нечитаема --- */
.woocommerce div.product div.summary{max-width:640px}
.woocommerce div.product .woocommerce-product-details__short-description{max-width:640px}

/* ==========================================================================
   Блок описания на карточке модели: лид → что входит → этапы → числа.
   Разметку собирает scripts/pamyatnikspb/kartochka.py, поле «кратко».
   Цвет акцента #c04f40 — фирменная терракота темы, затемнённая до контраста 4,7.
   ========================================================================== */
.kt-lid{font-size:15px;line-height:1.6;color:#41505c;margin:0 0 20px}
.kt-zag{font-size:17px;font-weight:700;color:#0c1f2f;margin:26px 0 12px}
.kt-knopka{margin:22px 0 0}
.kt-pod{font-size:13.5px;color:#7c8894;margin:10px 0 0}

/* --- своё описание модели: форма, участок, размер, камень ---
   Ставится между лидом и рамкой «Что входит». Разметку даёт
   kartochka_teksty.блок. Мелкая метка над текстом вместо крупного
   заголовка: крупные (kt-zag) остаются разделителями больших блоков,
   иначе верх карточки читается как сплошная простыня.
   Ширина строки ограничена: на мониторе 1920 колонка описания около
   1000 точек, и без ограничения строка выходит под 140 знаков. */
.kt-opis{display:grid;grid-template-columns:1fr 1fr;gap:20px 28px;margin:22px 0 26px}
.kt-o-shir{grid-column:1/-1}
.kt-o-kus{padding:14px 0 0;border-top:1px solid #e2e7ea}
.kt-tzag{font-size:12px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;
  color:#7c8894;margin:0 0 9px}
.kt-opis p{font-size:14.5px;line-height:1.55;color:#41505c;margin:0}
.kt-opis b{color:#0c1f2f}
.kt-sosedi-zag{font-size:13.5px;color:#7c8894;margin:0 0 10px}
.kt-sosedi{display:flex;flex-wrap:wrap;gap:8px 10px}
.kt-sosedi a{font-size:13.5px;line-height:1.2;color:#233240;background:#f4f6f7;
  border:1px solid #e2e7ea;border-radius:20px;padding:7px 14px;text-decoration:none;
  white-space:nowrap}
.kt-sosedi a:hover{border-color:#c04f40;color:#c04f40;background:#fff}

/* --- что входит в цену --- */
.kt-vhodit{display:grid;grid-template-columns:1fr 1fr;border:1px solid #e2e7ea;border-radius:12px;
  overflow:hidden;margin:0}
.kt-st{padding:18px 22px 20px;margin:0}
.kt-st+.kt-st{border-left:1px solid #e2e7ea;background:#f4f6f7}
.kt-vhodit h4{font-size:12px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;
  margin:0 0 13px;color:#7c8894}
.kt-vhodit ul{list-style:none;margin:0;padding:0}
.kt-vhodit li{position:relative;padding:0 0 0 27px;margin:0 0 9px;font-size:15px;line-height:1.45;color:#233240}
.kt-vhodit li:last-child{margin-bottom:0}
.kt-vhodit li::after{display:none}
.kt-vhodit li::before{position:absolute;left:0;top:1px;width:18px;height:18px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;line-height:1}
.kt-da li::before{content:"✓";background:#e4f0e8;color:#2f7a4a}
.kt-net li::before{content:"+";background:#f6e7e4;color:#a8442f}
.kt-snoska{grid-column:1/-1;border-top:1px solid #e2e7ea;padding:13px 22px;margin:0;
  font-size:14px;line-height:1.5;color:#7c8894;background:#fff}

/* --- как проходит заказ ---
   Описание живёт в колонке рядом с картинкой (примерно 800 точек), поэтому этапы
   идут не лентой в пять колонок, а карточками-строками: кадр слева, текст справа. */
.kt-etapy{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:0}
.kt-etap{border:1px solid #e2e7ea;border-radius:12px;overflow:hidden;background:#fff;
  display:flex;align-items:stretch;min-height:104px}
.kt-kadr{width:118px;flex:0 0 118px;margin:0;padding:0;background:#f4f6f7;overflow:hidden}
.kt-etap img{width:100%;height:100%;min-height:104px;object-fit:cover;display:block;margin:0}
.kt-telo{flex:1 1 auto;min-width:0;padding:13px 15px}
.kt-etap b,.kt-etap .kt-t,.kt-nom{display:block}
.kt-nom{font-size:11.5px;font-weight:700;letter-spacing:.08em;color:#c04f40;margin-bottom:5px}
.kt-etap b{font-size:15px;line-height:1.3;color:#0c1f2f;margin-bottom:4px}
.kt-etap .kt-t{font-size:13.5px;line-height:1.45;color:#41505c}

/* --- почему берут у нас --- */
.kt-chisla{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:0}
.kt-chisla-3{grid-template-columns:repeat(3,1fr)}
.kt-chisla>div{border:1px solid #e2e7ea;border-radius:12px;padding:17px 19px 19px;background:#f4f6f7}
.kt-chisla strong{display:block;font-size:27px;line-height:1.05;font-weight:700;color:#c04f40;margin-bottom:3px}
.kt-chisla b{display:block;font-size:15px;line-height:1.3;color:#0c1f2f;margin-bottom:6px}
.kt-chisla .kt-t{display:block;font-size:13.5px;line-height:1.45;color:#41505c}
.kt-stroka{display:flex;flex-wrap:wrap;gap:8px 10px;margin:16px 0 0}
.kt-stroka span{font-size:13.5px;color:#233240;background:#f4f6f7;border:1px solid #e2e7ea;
  border-radius:20px;padding:6px 14px}

/* карточка модели: описание шире, чтобы этапы помещались в пять колонок */
.woocommerce div.product div.summary,
.woocommerce div.product .woocommerce-product-details__short-description{max-width:none}

@media(max-width:820px){
  .kt-opis{grid-template-columns:1fr;gap:16px}
  .kt-vhodit{grid-template-columns:1fr}
  .kt-st+.kt-st{border-left:0;border-top:1px solid #e2e7ea}
  .kt-chisla,.kt-chisla-3{grid-template-columns:1fr 1fr}
  .zayavka{display:block;text-align:center}
}
@media(max-width:640px){
  .kt-etapy{grid-template-columns:1fr}
  .kt-kadr{width:96px;flex:0 0 96px}
}

/* ==========================================================================
   Фильтры в описании раздела.
   Описание раздела чистится WordPress: там выживают только ссылки и <strong>,
   без классов. Поэтому различаем по структуре:
     .term-description > p > strong   — название группы фильтров
     .term-description a strong       — число моделей внутри ссылки
   ========================================================================== */
.term-description{margin:0 0 26px;padding:18px 20px;background:#f8f9fb;
  border:1px solid #e3e6ea;border-radius:10px}
.term-description p{margin:0;font-size:15px;color:#4a5361;line-height:1.6}
.term-description > p > strong{display:block;margin:16px 0 8px;font-size:12px;
  letter-spacing:.08em;text-transform:uppercase;color:#8a93a0;font-weight:600}
.term-description > p > strong:first-of-type{margin-top:14px}
.term-description a{display:inline-block;margin:0 6px 6px 0;padding:6px 12px;
  border:1px solid #d7dce3;border-radius:999px;background:#fff;
  font-size:14px;color:#16202e;text-decoration:none;transition:border-color .15s,background .15s}
.term-description a:hover{border-color:#c04f40;background:#fdf3f1}
.term-description a:focus-visible{outline:2px solid #c04f40;outline-offset:2px}
.term-description a strong{margin-left:6px;font-weight:500;color:#8a93a0;font-size:13px}
/* «Сбросить фильтры» — последняя ссылка, отличаем по подсказке */
.term-description a[title="Показать все модели"]{border-style:dashed;color:#6b7480;
  margin-top:12px}
.term-description a[title="Показать все модели"]:hover{color:#16202e;border-color:#8a93a0;background:#fff}

/* --- Цена в каталоге показывается как «от», точная считается под участок --- */
.woocommerce ul.products li.product .price::before,
.woocommerce div.product p.price::before{content:"от ";font-size:.82em;color:#6b7480;
  font-weight:400;margin-right:2px}

/* --- Плитки входов: только разделы каталога, по ширине содержимого --- */
.kat-vhody{display:flex;flex-wrap:wrap;gap:10px;margin:22px 0 18px;padding:0;list-style:none}
.kat-vhod{display:inline-flex;align-items:center;gap:10px;padding:11px 16px;
  border:1px solid #e3e6ea;border-radius:10px;background:#fff;text-decoration:none;
  color:#16202e;transition:border-color .15s,box-shadow .15s}
.kat-vhod:hover{border-color:#c04f40;box-shadow:0 2px 10px rgba(22,32,46,.07)}
.kat-vhod:focus-visible{outline:2px solid #c04f40;outline-offset:2px}
.kat-imya{font-size:15px;font-weight:600}
.kat-chislo{font-size:13px;color:#8a93a0;font-variant-numeric:tabular-nums}

/* --- Вопросы и ответы внизу каталога --- */
.kat-voprosy{margin:8px 0 10px;border-top:1px solid #e3e6ea}
.kat-vopros{border-bottom:1px solid #e3e6ea}
.kat-vopros summary{padding:15px 34px 15px 0;font-size:16px;font-weight:600;
  color:#16202e;cursor:pointer;position:relative;list-style:none}
.kat-vopros summary::-webkit-details-marker{display:none}
.kat-vopros summary::after{content:"+";position:absolute;right:6px;top:13px;
  font-size:20px;font-weight:400;color:#8a93a0}
.kat-vopros[open] summary::after{content:"−"}
.kat-vopros summary:focus-visible{outline:2px solid #c04f40;outline-offset:2px}
.kat-vopros p{margin:0 0 16px;font-size:15px;line-height:1.62;color:#4a5361;max-width:75ch}

@media(max-width:760px){
  .kat-gruppa{grid-template-columns:1fr;gap:8px;padding:10px 0}
  .kat-zag{padding-top:0}
  .kat-telo{padding:0 14px 12px}
  .kat-shapka-f{padding:13px 14px}
  .kat-vhod{padding:10px 13px}
  .kat-imya{font-size:14px}
}
@media(max-width:640px){
  .term-description{padding:14px 15px}
  .term-description a{font-size:13.5px;padding:5px 10px}
}

/* --- Маркеры списка у карточек ---
   Тема рисует синий кружок правилом `article ul li::after` (position:absolute,
   border-radius:50%). Именно ::after, не ::before. Гасим только в товарных сетках
   и в фильтрах — в статьях маркеры списков нужны. */
article ul.wc-block-product-template > li::after,
article ul.wc-block-product-template > li::before,
article ul.products > li::after,
article ul.products > li::before,
article .kat-vhody > li::after,
article .kat-filtr li::after{content:none!important;display:none!important;
  background:none!important;width:0!important;height:0!important}
.woocommerce ul.products,.woocommerce ul.products li.product{list-style:none!important}
.woocommerce ul.products li.product::marker{content:""}
.woocommerce ul.products li.product::before{display:none!important;content:none!important}
.woocommerce nav.woocommerce-pagination ul li{list-style:none!important}
.woocommerce nav.woocommerce-pagination ul li::marker{content:""}

/* ==========================================================================
   Витрина на странице каталога: сетка собрана блоками WooCommerce,
   у неё свои классы — старые правила для ul.products сюда не достают.
   ========================================================================== */
.wp-block-woocommerce-product-collection ul.wc-block-product-template,
ul.wc-block-product-template{display:grid!important;
  grid-template-columns:repeat(4,1fr);gap:26px;margin:0 0 30px;padding:0;list-style:none!important}
li.wc-block-product{list-style:none!important;margin:0!important;padding:14px;
  border:1px solid #e3e6ea;border-radius:12px;background:#fff;text-align:center}
li.wc-block-product::marker{content:""}
li.wc-block-product::before{display:none!important;content:none!important}
li.wc-block-product img{height:230px!important;width:auto!important;object-fit:contain!important;
  margin:0 auto 10px}
li.wc-block-product .wp-block-post-title{margin:0 0 6px;font-size:15px;line-height:1.35}
li.wc-block-product .wp-block-post-title a{color:#16202e;text-decoration:none}
li.wc-block-product .wp-block-post-title a:hover{color:#c04f40}
/* цена в блочной витрине показывается так же «от», как в обычной */
li.wc-block-product .wc-block-components-product-price{font-size:17px;font-weight:700;color:#16202e}
li.wc-block-product .wc-block-components-product-price::before{content:"от ";font-size:.82em;
  color:#6b7480;font-weight:400;margin-right:2px}

/* --- Подбор по параметрам: складывающийся блок с группами в строку --- */
.kat-filtr{margin:0 0 26px;border:1px solid #e3e6ea;border-radius:12px;background:#f8f9fb;
  overflow:hidden}
.kat-shapka-f{display:flex;align-items:center;gap:10px;padding:14px 18px;cursor:pointer;
  font-size:15px;font-weight:600;color:#16202e;list-style:none;user-select:none}
.kat-shapka-f::-webkit-details-marker{display:none}
.kat-shapka-f::before{content:"";width:8px;height:8px;border-right:2px solid #8a93a0;
  border-bottom:2px solid #8a93a0;transform:rotate(45deg);transition:transform .15s;
  margin-right:2px;flex:none}
.kat-filtr[open] .kat-shapka-f::before{transform:rotate(-135deg)}
.kat-shapka-f:focus-visible{outline:2px solid #c04f40;outline-offset:-2px}
.kat-vybrano{font-size:13px;font-weight:500;color:#c04f40}
.kat-telo{padding:0 18px 14px}
.kat-gruppa{display:grid;grid-template-columns:132px minmax(0,1fr);align-items:baseline;
  gap:10px 14px;padding:12px 0;border-top:1px solid #e8ebef}
.kat-zag{font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:#8a93a0;
  font-weight:600;padding-top:5px}
.kat-znacheniya{display:flex;flex-wrap:wrap;gap:6px}
.kat-f{display:inline-block;padding:6px 12px;border:1px solid #d7dce3;border-radius:999px;
  background:#fff;font-size:14px;line-height:1.25;color:#16202e;text-decoration:none;
  transition:border-color .15s,background .15s,color .15s}
.kat-f:hover{border-color:#c04f40;background:#fdf3f1}
.kat-f:focus-visible{outline:2px solid #c04f40;outline-offset:2px}
.kat-f i{font-style:normal;margin-left:6px;color:#8a93a0;font-size:13px;
  font-variant-numeric:tabular-nums}
.kat-f.vybran{border-color:#16202e;background:#16202e;color:#fff}
.kat-f.vybran i{color:#c8cdd6}
.kat-sbros{display:none;margin:12px 0 0;font-size:14px;color:#6b7480;text-decoration:underline}
.kat-sbros.vidno{display:inline-block}
.kat-sbros:hover{color:#16202e}

/* --- Плашка на страницах, где изделие делается под заказ ---
   Нужна, чтобы человек не решил, будто цена в карточках относится к мрамору
   или к памятнику на троих. Это предупреждение, а не абзац текста. */
.vid-plashka{margin:22px 0 26px;padding:16px 20px;background:#fdf6e9;
  border:1px solid #e8d9b8;border-left:3px solid #c79a3e;border-radius:8px;
  font-size:15px;line-height:1.6;color:#4a4032}
.vid-plashka b{display:block;margin-bottom:4px;color:#2b2519}
@media(max-width:640px){.vid-plashka{padding:14px 15px;font-size:14.5px}}

/* --- Главная: пустая обёртка каруселей.
       Сами карусели убраны 24 августа в полях страницы, но шаблон темы всё равно
       рисует стрелки и точки перелистывания — им теперь нечего листать.
       Прячем только обёртку слайдера, заголовок и список остаются. --- */
body.home section.catalog .slider__wrapper{display:none}
body.home section.catalog{padding-bottom:60px}

/* --- Главная: блок «почему у нас» снова виден с 2026-08-24.
       Прятали его 21 августа из-за неверных обещаний внутри. Теперь неверное
       убрано в самих полях страницы, прятать нечего. --- */

/* ==========================================================================
   Каталог: лента фактов под заголовком и плита под сеткой моделей.
   Без плиты чёрные памятники висят на белом фоне и страница читается сырой.
   ========================================================================== */
.kat-lenta{background:#eceef0;border-radius:12px;padding:22px 26px 20px;margin:0 0 22px}
.kat-lenta__text{margin:0 0 18px;font-size:15px;line-height:1.62;color:#41505c;max-width:78ch}
.kat-fakty{display:flex;flex-wrap:wrap;gap:14px}
.kat-fakt{flex:1 1 150px;background:#fff;border:1px solid #dfe3e6;border-radius:10px;
  padding:13px 16px 14px}
.kat-fakt strong{display:block;font-size:22px;line-height:1.1;font-weight:700;color:#c04f40;
  margin-bottom:3px}
.kat-fakt span{display:block;font-size:13.5px;line-height:1.35;color:#586066}

.kat-plita{background:#eceef0;border-radius:14px;padding:24px 24px 4px;margin:0 0 26px}
.kat-plita .woocommerce ul.products li.product,
.kat-plita ul.products li.product{background:#fff;border-color:#dfe3e6}
.kat-plita ul.products li.product:hover{box-shadow:0 8px 24px rgba(21,24,27,.12)}

@media(max-width:760px){
  .kat-lenta{padding:16px 16px 14px}
  .kat-fakt{flex:1 1 130px;padding:11px 13px 12px}
  .kat-fakt strong{font-size:19px}
  .kat-plita{padding:14px 14px 2px}
}

/* --- Ширина описания на карточке модели ---
   Описание стоит справа от картинки, и под картинкой оставалась пустая колонка.
   Нижняя часть блока (этапы и числа) сдвигается влево под картинку и идёт во всю
   ширину. Верхняя часть держит минимальную высоту кадра, чтобы нижняя никогда
   не наехала на картинку: у всех 75 моделей кадр одной высоты после выравнивания. */
@media(min-width:1101px){
  .woocommerce div.product .kt-verh{min-height:474px}
  .woocommerce div.product .kt-shir{margin-left:-404px}
}

/* --- Число «изготовили и установили более N памятников» ---
   Было картинкой icon_11.svg с намертво зашитым «10000»: поиск её не читал,
   а поменять число нельзя было вовсе. Стало текстом тем же шрифтом.
   Конструкция повторяет исходную: белая лицевая часть и градиентная
   «толщина» позади, градиент взят из самой картинки. */
#main-catalog .catalog__heading .mk-chislo{
  position:relative;z-index:8;flex-shrink:0;
  font-family:YanoneKaffeesatz,sans-serif;font-weight:700;
  font-size:min(384px,46vw);line-height:.8;letter-spacing:-.02em;
  color:#fff;-webkit-user-select:text;user-select:text}
#main-catalog .catalog__heading .mk-chislo::before{
  content:attr(data-chislo);position:absolute;left:0;right:0;top:0;z-index:-1;
  text-align:inherit;
  -webkit-text-stroke:.028em transparent;
  background:linear-gradient(180deg,#202F3C 0%,#7B5334 62%,#F0F0F0 92%);
  -webkit-background-clip:text;background-clip:text;color:transparent}
@media all and (max-width:1199px){
  #main-catalog .catalog__heading .mk-chislo{font-size:min(265px,46vw)}}

/* --- Блок «Чем подтверждаем» ---
   Поставлен на место снятых отзывов. Карточки повторяют приём секции
   ссылок: та же подложка #e8f0f2, тот же радиус 12px. */
#podtverzhdenie{padding:90px 0}
#podtverzhdenie .podtv__lid{margin-top:14px;max-width:56ch;
  font-size:18px;line-height:1.5;color:rgba(255,255,255,.74)}
#podtverzhdenie .wrapper{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
#podtverzhdenie .podtv__item{background:#e8f0f2;border-radius:12px;
  padding:26px 24px 30px;display:flex;flex-direction:column;gap:10px}
#podtverzhdenie .podtv__nom{font-family:YanoneKaffeesatz,sans-serif;
  font-size:34px;line-height:1;font-weight:700;color:#dc6555}
#podtverzhdenie .podtv__item h3{font-family:YanoneKaffeesatz,sans-serif;
  font-size:26px;line-height:1.1;font-weight:600;text-transform:uppercase;
  margin:0;color:#202f3c}
#podtverzhdenie .podtv__item p{margin:0;font-size:15px;line-height:1.5;color:#5b6670}
@media all and (max-width:1199px){
  #podtverzhdenie{padding:70px 0}
  #podtverzhdenie .wrapper{grid-template-columns:repeat(2,1fr)}}
@media all and (max-width:575px){
  #podtverzhdenie{padding:44px 0}
  #podtverzhdenie .wrapper{grid-template-columns:1fr}
  #podtverzhdenie .podtv__lid{font-size:16px}}

/* --- Имя и знак мастерской вместо логотипа-картинки --- */
.mk-logo{display:inline-flex;align-items:center;gap:14px;text-decoration:none;
  color:inherit;max-width:100%}
/* Знак двухцветный: рамка и цоколь берут currentColor (тёмные на светлом,
   белые на тёмной полосе шапки), стела — отдельную переменную. На светлом
   фоне терракота нужна темнее, иначе не хватает контраста. */
.mk-logo__znak{flex:none;width:44px;height:44px;--mk-rez:#c04f40}
.mk-logo__slova{display:block;min-width:0}
.mk-logo__slova b{display:block;font-family:YanoneKaffeesatz,sans-serif;
  font-size:22px;line-height:.98;font-weight:700;text-transform:uppercase;
  letter-spacing:.01em;text-wrap:balance}
.mk-logo__slova small{display:block;margin-top:4px;font-size:11px;line-height:1.2;
  opacity:.66;white-space:nowrap}
@media all and (max-width:1399px){
  .mk-logo__znak{width:38px;height:38px}
  .mk-logo__slova b{font-size:19px}
  .mk-logo__slova small{font-size:10px}}
@media all and (max-width:575px){
  .mk-logo{gap:10px}
  .mk-logo__znak{width:34px;height:34px}
  .mk-logo__slova b{font-size:17px}
  .mk-logo__slova small{display:none}}

/* --- Шапка: одна тёмная полоса вместо прозрачной поверх зелёного ---
   Владелец 22 августа: «ни один человек не прочитает». Так и было:
   на телефоне полоса тёмная (#223240 из темы), на компьютере — зелёное
   фото, а надписи в обоих случаях тёмные. Делаем полосу тёмной везде
   и текст на ней светлым: одно состояние вместо двух неудачных. */
header .header__top{background-color:#223240}
header .header__top .mk-logo{color:#fff}
header .header__top .mk-logo__znak{--mk-rez:#dc6555}
header .header__top .mk-logo__slova small{opacity:.7}
header .header__top .header__contacts .contacts__inner,
header .header__top .header__contacts .contacts__inner a,
header .header__top .header__contacts .contacts__inner p{color:#fff}
header .header__top .header__contacts img{filter:brightness(0) invert(1);opacity:.85}
/* В подвале фон тоже тёмный (проверено снимком 9 сентября - прежний
   комментарий тут врал про светлую полосу). Слова и рамка берут цвет от
   подвала, а стеле нужна светлая терракота: тёмная #c04f40 даёт на этом
   фоне контраст 2,8 вместо 3,8 и выглядит грязным пятном. */
footer .mk-logo{color:inherit}
footer .mk-logo__znak{--mk-rez:#dc6555}

/* --- Число «2500» на телефоне ---
   При крупном кегле обводка с обеих сторон каждой цифры съедала просветы,
   а отрицательный межбуквенный интервал добивал: цифры слипались в кашу.
   На узком экране кегль меньше, интервал положительный, обводка тоньше. */
@media all and (max-width:767px){
  #main-catalog .catalog__heading .mk-chislo{
    font-size:min(132px,34vw);letter-spacing:.02em;line-height:.92}
  #main-catalog .catalog__heading .mk-chislo::before{
    -webkit-text-stroke-width:.026em}
}

/* ==========================================================================
   Статьи раздела «Полезные материалы». Приставка st-.
   Раньше статья была сплошным текстом с одной картинкой сверху.
   Блоки ниже дают глазу опору: врезки, плитки, таблицы, шаги, вопросы.
   ========================================================================== */

.st-korotko{margin:0 0 28px;padding:20px 24px;border-left:3px solid #c04f40;
  border-radius:0 12px 12px 0;background:#f4f6f7}
.st-korotko p{margin:0 0 8px;font-size:14px;font-weight:700;letter-spacing:.06em;
  text-transform:uppercase;color:#8a93a0}
/* Маркеры свои: у темы они выравниваются по середине пункта, и на узком
   экране точка оказывалась посреди абзаца. */
.st-korotko ul{margin:0;padding:0;list-style:none}
.st-korotko li{position:relative;margin:0 0 7px;padding-left:19px;
  font-size:16px;line-height:1.55;color:#1c2b38}
.st-korotko li::before{content:'';position:absolute;left:0;top:.62em;
  width:7px;height:7px;border-radius:50%;background:#c04f40}
.st-korotko li:last-child{margin:0}

.st-soderzhanie{margin:0 0 30px;padding:18px 22px;border:1px solid #e2e7ea;border-radius:12px}
.st-soderzhanie p{margin:0 0 10px;font-size:13px;font-weight:700;letter-spacing:.06em;
  text-transform:uppercase;color:#8a93a0}
.st-soderzhanie ol{margin:0;padding:0 0 0 20px;columns:2;column-gap:28px}
.st-soderzhanie li{margin:0 0 6px;break-inside:avoid}
.st-soderzhanie a{color:#1c2b38;text-decoration:none;border-bottom:1px solid #cfd6db}
.st-soderzhanie a:hover{color:#c04f40;border-color:#c04f40}

.st-plitki{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:22px 0;
  padding:0;list-style:none}
.st-plitki-2{grid-template-columns:repeat(2,1fr)}
.st-plitki li{margin:0;padding:17px 19px 19px;border:1px solid #e2e7ea;border-radius:12px;
  background:#fff}
.st-plitki b{display:block;margin:0 0 6px;font-size:16px;color:#0c1f2f}
.st-plitki span{display:block;font-size:14.5px;line-height:1.5;color:#5b6773}

.st-shagi{display:grid;gap:12px;margin:22px 0;padding:0;list-style:none;counter-reset:st}
.st-shagi li{position:relative;margin:0;padding:16px 20px 18px 62px;border:1px solid #e2e7ea;
  border-radius:12px;background:#fff;counter-increment:st}
.st-shagi li::before{content:counter(st);position:absolute;left:20px;top:16px;
  width:28px;height:28px;border-radius:50%;background:#c04f40;color:#fff;
  font-size:14px;font-weight:700;display:flex;align-items:center;justify-content:center}
.st-shagi b{display:block;margin:0 0 5px;font-size:16px;color:#0c1f2f}
.st-shagi span{display:block;font-size:14.5px;line-height:1.55;color:#5b6773}

.st-tablica{width:100%;margin:22px 0;border-collapse:collapse;font-size:15px}
.st-tablica th,.st-tablica td{padding:11px 14px;border-bottom:1px solid #e2e7ea;text-align:left}
.st-tablica th{background:#f4f6f7;font-size:13.5px;font-weight:700;color:#0c1f2f;
  letter-spacing:.02em}
.st-tablica td{color:#3a4753}
/* Вправо прижимаем только числовую колонку — у текстовой это читается как ошибка. */
.st-tablica.st-vpravo td:last-child,.st-tablica.st-vpravo th:last-child{text-align:right;
  font-variant-numeric:tabular-nums;white-space:nowrap}
.st-tablica tr:last-child td{border-bottom:0}
.st-obertka{overflow-x:auto;margin:22px 0}
.st-obertka .st-tablica{margin:0;min-width:460px}

.st-vrezka{margin:24px 0;padding:18px 22px;border:1px solid #e2e7ea;border-radius:12px;
  background:#f8f9fb}
/* Красным и отдельной строкой — только заголовок врезки, а не любой <b> внутри. */
.st-vrezka>b{display:block;margin:0 0 6px;font-size:15px;color:#c04f40;
  letter-spacing:.02em}
.st-vrezka p b{color:inherit}
.st-vrezka p{margin:0;font-size:15.5px;line-height:1.6;color:#3a4753}

.st-modeli{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:24px 0;
  padding:0;list-style:none}
.st-modeli li{margin:0;border:1px solid #e2e7ea;border-radius:12px;overflow:hidden;
  background:#fff}
.st-modeli a{display:block;color:inherit;text-decoration:none}
.st-modeli img{display:block;width:100%;height:auto;background:#f4f6f7}
.st-modeli .st-podpis{padding:12px 15px 15px}
.st-modeli b{display:block;font-size:15px;line-height:1.35;color:#0c1f2f}
.st-modeli span{display:block;margin-top:5px;font-size:14px;color:#c04f40;font-weight:700}
.st-modeli a:hover b{color:#c04f40}

.st-voprosy{margin:26px 0;border-top:1px solid #e3e6ea}
.st-vopros{border-bottom:1px solid #e3e6ea}
.st-vopros summary{cursor:pointer;padding:15px 34px 15px 0;position:relative;
  font-size:16.5px;font-weight:600;color:#0c1f2f;list-style:none}
.st-vopros summary::-webkit-details-marker{display:none}
.st-vopros summary::after{content:'';position:absolute;right:6px;top:50%;width:9px;height:9px;
  margin-top:-6px;border-right:2px solid #8a93a0;border-bottom:2px solid #8a93a0;
  transform:rotate(45deg);transition:transform .18s}
.st-vopros[open] summary::after{transform:rotate(-135deg);margin-top:-2px}
.st-vopros .st-otvet{padding:0 0 16px;font-size:15.5px;line-height:1.6;color:#3a4753}
.st-vopros .st-otvet p{margin:0 0 10px}
.st-vopros .st-otvet p:last-child{margin:0}

.st-dalshe{margin:28px 0 0;padding:22px 24px;border-radius:12px;background:#0c1f2f;color:#fff}
.st-dalshe b{display:block;margin:0 0 12px;font-size:18px}
.st-dalshe ul{margin:0 0 18px;padding:0;list-style:none}
.st-dalshe li{position:relative;margin:0 0 7px;padding-left:19px;
  font-size:15.5px;line-height:1.5}
.st-dalshe li::before{content:'';position:absolute;left:0;top:.62em;
  width:7px;height:7px;border-radius:50%;background:#f07969}
.st-dalshe a{color:#fff;border-bottom:1px solid rgba(255,255,255,.4);text-decoration:none}
.st-dalshe a:hover{border-color:#fff}
.st-dalshe .zayavka{margin-top:4px}

/* Схемы рисуем разметкой, а не картинкой: они не весят и читаются на любой ширине. */
.st-shema{margin:24px 0;padding:22px;border:1px solid #e2e7ea;border-radius:12px;
  background:#f8f9fb}
.st-shema svg{display:block;width:100%;height:auto}
.st-shema figcaption{margin:14px 0 0;font-size:14px;line-height:1.5;color:#7c8894}

@media all and (max-width:900px){
  .st-plitki,.st-modeli{grid-template-columns:repeat(2,1fr)}
  .st-soderzhanie ol{columns:1}
}
@media all and (max-width:600px){
  .st-plitki,.st-plitki-2,.st-modeli{grid-template-columns:1fr}
  .st-korotko{padding:16px 18px}
  .st-shagi li{padding:14px 16px 16px 56px}
  .st-dalshe{padding:18px 19px}
}

/* Тема рисует синий кружок правилом `article ul li::after` и ставит его по
   середине пункта: на узком экране точка оказывалась посреди абзаца.
   В своих блоках гасим её и рисуем свой маркер по первой строке. */
article .st-korotko li::after,
article .st-dalshe li::after,
article .st-plitki>li::after,
article .st-plitki>li::before,
article .st-modeli>li::after,
article .st-modeli>li::before,
article .st-shagi>li::after,
article .st-soderzhanie li::after,
article .st-soderzhanie li::before{content:none!important;display:none!important;
  background:none!important;width:0!important;height:0!important}

/* --- Путь заказа картинками ---
   Рисунки свои, та же изометрия, что на главной: чужих фотографий в теме
   похорон лучше не показывать вовсе. */
.st-etapy{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:24px 0;
  padding:0;list-style:none;counter-reset:ste}
.st-etapy>li{position:relative;margin:0;border:1px solid #e2e7ea;border-radius:12px;
  overflow:hidden;background:#fff;counter-increment:ste}
.st-etapy figure{margin:0;background:#eef1f3;aspect-ratio:4/3;overflow:hidden}
.st-etapy img{display:block;width:100%;height:100%;object-fit:cover}
.st-etap-telo{padding:13px 15px 16px}
.st-etapy b{display:block;margin:0 0 5px;font-size:15.5px;line-height:1.3;color:#0c1f2f}
.st-etapy b::before{content:counter(ste);display:inline-flex;align-items:center;
  justify-content:center;width:20px;height:20px;margin-right:7px;border-radius:50%;
  background:#c04f40;color:#fff;font-size:11.5px;vertical-align:1px}
.st-etapy span{display:block;font-size:14px;line-height:1.5;color:#5b6773}

/* --- Плитки с рисунком сверху --- */
.st-plitki-foto>li{padding:0;overflow:hidden}
.st-plitki-foto figure{margin:0;background:#eef1f3;aspect-ratio:1/1;overflow:hidden;
  display:flex;align-items:center;justify-content:center}
.st-plitki-foto img{display:block;width:100%;height:100%;object-fit:contain}
.st-plitka-telo{padding:14px 17px 17px}

@media all and (max-width:900px){
  .st-etapy{grid-template-columns:repeat(2,1fr)}
}
@media all and (max-width:560px){
  .st-etapy{grid-template-columns:1fr}
  .st-etapy figure{aspect-ratio:16/9}
}
article .st-etapy>li::after,article .st-etapy>li::before,
article .st-plitki-foto>li::after,article .st-plitki-foto>li::before{
  content:none!important;display:none!important;background:none!important;
  width:0!important;height:0!important}

/* Заглавная картинка статьи: тема тянет её под свой размер и портит пропорции. */
article .st-glavnaya img{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;
  border-radius:12px}
article .st-glavnaya figcaption{margin:10px 0 0;font-size:14px;line-height:1.5;
  color:#7c8894;text-align:left}

/* --- Карточка автора и рубрики --- */
.st-avtor{display:flex;gap:16px;align-items:flex-start;margin:30px 0 0;padding:18px 20px;
  border:1px solid #e2e7ea;border-radius:12px;background:#f8f9fb}
.st-avtor-znak{flex:0 0 46px;width:46px;height:46px;border-radius:50%;background:#0c1f2f;
  color:#fff;display:flex;align-items:center;justify-content:center;
  font-size:15px;font-weight:700;letter-spacing:.04em}
.st-avtor-telo{min-width:0}
.st-avtor-telo b{display:block;font-size:16.5px;color:#0c1f2f}
.st-avtor-rol{display:block;margin:2px 0 8px;font-size:13.5px;color:#c04f40;
  letter-spacing:.02em}
.st-avtor-telo p{margin:0;font-size:14.5px;line-height:1.55;color:#5b6773}

.st-rubriki{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:26px 0 0;
  padding:0;list-style:none}
.st-rubriki>li{margin:0}
.st-rubriki a{display:block;height:100%;padding:14px 16px 16px;border:1px solid #e2e7ea;
  border-radius:12px;background:#fff;color:inherit;text-decoration:none}
.st-rubriki a:hover{border-color:#c04f40;box-shadow:0 2px 10px rgba(22,32,46,.07)}
.st-rubriki b{display:block;margin:0 0 4px;font-size:15px;color:#0c1f2f}
.st-rubriki span{display:block;font-size:13.5px;line-height:1.45;color:#7c8894}
.st-rubriki a:hover b{color:#c04f40}

@media all and (max-width:900px){.st-rubriki{grid-template-columns:repeat(2,1fr)}}
@media all and (max-width:520px){
  .st-rubriki{grid-template-columns:1fr}
  .st-avtor{flex-direction:column;gap:12px}
}
article .st-rubriki>li::after,article .st-rubriki>li::before{
  content:none!important;display:none!important;background:none!important;
  width:0!important;height:0!important}

/* Рубрикатор на странице раздела: фон там тёмный, поэтому плитки светлые
   и с запасом по отступу от заголовка. */
.st-rubriki-arhiv{grid-template-columns:repeat(3,1fr);margin:4px 0 30px}
.st-rubriki-arhiv .st-rubrika-tut a{border-color:#c04f40;background:#fff}
.st-rubriki-arhiv .st-rubrika-tut b{color:#c04f40}
@media all and (max-width:900px){.st-rubriki-arhiv{grid-template-columns:repeat(2,1fr)}}
@media all and (max-width:520px){.st-rubriki-arhiv{grid-template-columns:1fr}}
#page .st-rubriki-arhiv>li::after,#page .st-rubriki-arhiv>li::before{
  content:none!important;display:none!important}

/* Карточки преимуществ на главной ведут в статьи. Ссылка накрывает карточку
   целиком, поэтому вёрстка карточки не меняется ни на пиксель. */
#profit .item.mk-item-ssylka{position:relative}
#profit .mk-nakrytie{position:absolute;inset:0;z-index:3;border-radius:inherit}
#profit .mk-item-ssylka{transition:transform .18s,box-shadow .18s}
#profit .mk-item-ssylka:hover{transform:translateY(-2px);
  box-shadow:0 6px 18px rgba(8,18,28,.18)}
#profit .mk-nakrytie:focus-visible{outline:2px solid #c04f40;outline-offset:2px}

/* Крупный рендер модели на странице вида: страница была сплошным текстом,
   картинка разбивает её пополам. */
.st-vid-foto{margin:24px 0;text-align:center}
.st-vid-foto img{display:inline-block;width:auto;max-width:min(420px,100%);height:auto;
  border:1px solid #e2e7ea;border-radius:12px;background:#f4f6f7;padding:14px}

/* Карточка модели: вместо кнопки «В корзину» - переход к заявке. Памятник
   не покупают кнопкой: сначала замер участка, гравировка и согласование. */
.mk-vit{margin:18px 0 4px;display:flex;flex-wrap:wrap;align-items:center;gap:12px}
.mk-vit .zayavka{margin:0}
.mk-vit-tel{display:inline-block;padding:15px 24px;border:1px solid #c04f40;
  border-radius:8px;color:#0c1f2f;font-weight:600;text-decoration:none;white-space:nowrap}
.mk-vit-tel:hover{background:#fdf1ef}
.mk-vit-pod{flex-basis:100%;margin:2px 0 0;font-size:14px;line-height:1.45;color:#5b6a75}
@media all and (max-width:520px){
  .mk-vit .zayavka,.mk-vit-tel{display:block;width:100%;text-align:center}}

.st-artikul{margin-left:6px;font-size:13px;color:#8a93a0;white-space:nowrap}

/* На телефоне таблица не должна уезжать за край: колонка с ценой оказывалась
   за пределами экрана, и человек видел таблицу без единой цены. */
@media all and (max-width:600px){
  .st-obertka .st-tablica{min-width:0}
  .st-tablica th,.st-tablica td{padding:10px 8px;font-size:14.5px}
  .st-tablica th{font-size:12.5px}
}
@media all and (max-width:430px){
  .st-artikul{display:none}
}

/* --- Полоса чисел на странице вида ---
   Страница была стеной текста: числа вытаскиваем из абзацев наружу,
   чтобы главное считывалось за секунду. */
.st-chisla{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:22px 0;
  padding:0;list-style:none}
.st-chisla>li{margin:0;padding:16px 18px 18px;border:1px solid #e2e7ea;border-radius:12px;
  background:#f4f6f7}
.st-chisla b{display:block;font-size:clamp(17px,2vw,24px);line-height:1.15;
  color:#0c1f2f;font-variant-numeric:tabular-nums;white-space:nowrap}
/* Длинные значения цены рвались на две строки и ломали ряд:
   ужимаем кегль по ширине колонки и запрещаем перенос внутри числа. */
.st-chisla span{display:block;margin-top:6px;font-size:13.5px;line-height:1.4;color:#5b6773}
@media all and (max-width:700px){.st-chisla{grid-template-columns:repeat(2,1fr)}}
@media all and (max-width:380px){.st-chisla b{font-size:17px}}
article .st-chisla>li::after,article .st-chisla>li::before,
#page .st-chisla>li::after,#page .st-chisla>li::before{
  content:none!important;display:none!important;background:none!important;
  width:0!important;height:0!important}

/* Витрина моделей: на телефоне три карточки в столбик занимали три экрана.
   Держим две в ряд и ограничиваем высоту рисунка. */
.st-modeli img{aspect-ratio:3/4;object-fit:contain;padding:8px}
@media all and (max-width:600px){
  .st-modeli{grid-template-columns:repeat(2,1fr);gap:10px}
  .st-modeli .st-podpis{padding:10px 11px 12px}
  .st-modeli b{font-size:13.5px;line-height:1.3}
  .st-modeli span{font-size:13px}
}

/* ==========================================================================
   Шапка: кнопка звонка на телефоне и полоса с условиями работы
   ========================================================================== */

/* На телефоне в шапке был только знак и бургер: позвонить в один клик
   было нельзя. Кнопка видна только там, где скрыты контакты. */
.mk-zvonok{display:none;align-items:center;justify-content:center;
  width:40px;height:40px;margin-right:12px;border-radius:10px;
  background:rgba(255,255,255,.12);color:#fff;flex:0 0 40px}
.mk-zvonok svg{width:22px;height:22px;fill:currentColor}
.mk-zvonok:hover{background:rgba(255,255,255,.2)}
.mk-zvonok:focus-visible{outline:2px solid #f07969;outline-offset:2px}
@media all and (max-width:1199px){
  .mk-zvonok{display:flex}
  .header__contacts{display:flex;align-items:center;justify-content:flex-end}
}

/* Полоса под шапкой: одно короткое обещание за раз, рядом кнопка. */
.mk-lenta{background:#f3ece2;border-bottom:1px solid #e6dccd}
.mk-lenta__inner{display:flex;align-items:center;gap:16px;
  min-height:56px;padding:9px 0}
.mk-lenta__okno{position:relative;flex:1 1 auto;min-width:0;height:24px}
.mk-lenta__stroka{position:absolute;left:0;top:0;right:0;margin:0;
  font-size:16px;line-height:24px;color:#2c2419;white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis;
  opacity:0;transform:translateY(6px);transition:opacity .35s,transform .35s;
  pointer-events:none}
.mk-lenta__stroka b{color:#a8442f;font-weight:700}
.mk-lenta__stroka.mk-vidna{opacity:1;transform:none;pointer-events:auto}
.mk-lenta__knopka{flex:0 0 auto;display:inline-block;padding:10px 22px;
  border-radius:8px;background:#c04f40;color:#fff;font-size:15px;font-weight:600;
  text-decoration:none;white-space:nowrap}
.mk-lenta__knopka:hover{background:#a8442f;color:#fff}
.mk-lenta__knopka:focus-visible{outline:2px solid #0c1f2f;outline-offset:2px}
.mk-lenta__tochki{flex:0 0 auto;display:flex;gap:6px}
.mk-lenta__tochka{width:7px;height:7px;border-radius:50%;background:#cfc2ae;
  border:0;padding:0;cursor:pointer}
.mk-lenta__tochka.mk-tut{background:#a8442f}
.mk-lenta__tochka:focus-visible{outline:2px solid #0c1f2f;outline-offset:2px}

@media all and (max-width:767px){
  .mk-lenta__inner{gap:10px;min-height:52px}
  .mk-lenta__stroka{font-size:14.5px;white-space:normal;line-height:1.25;
    display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
  .mk-lenta__okno{height:36px}
  .mk-lenta__knopka{padding:9px 14px;font-size:14px}
  .mk-lenta__tochki{display:none}
}
@media (prefers-reduced-motion:reduce){
  .mk-lenta__stroka{transition:none}
}

/* Полоса: невидимые строки прятали только прозрачностью, и в момент смены
   две фразы накладывались друг на друга. Убираем их из отрисовки. */
.mk-lenta__stroka{visibility:hidden;transition:opacity .25s,transform .25s,visibility .25s}
.mk-lenta__stroka.mk-vidna{visibility:visible}

/* Шапка стояла неровно из-за того, что название переносилось на две строки
   и блок логотипа становился выше соседей. На широком экране держим в строку. */
@media all and (min-width:1200px){
  .mk-logo__slova b{white-space:nowrap;font-size:20px}
  .header__top .row{min-height:74px}
}
@media all and (min-width:1400px){
  .mk-logo__slova b{font-size:22px}
}

/* Режим работы в шапке: человеку важно знать, дозвонится ли он сейчас. */
.mk-rezhim{margin:0;font-size:14px;color:rgba(255,255,255,.75);white-space:nowrap}
.mk-rezhim span{color:#fff;font-weight:600}
/* На 1440 режим работы поджимал адрес и тот ломался на две строки. */
@media all and (max-width:1599px){.mk-rezhim{display:none}}

/* ==========================================================================
   Закреплённая шапка: при прокрутке она уезжала вместе со страницей,
   и полоса с условиями пропадала из виду.
   ========================================================================== */
/* В этой теме первый экран лежит внутри <header>, поэтому закреплять сам
   <header> бесполезно: он высокий, и шапка уехала бы вместе с ним.
   Закрепляем только верхнюю полосу с лентой. Отступ под неё выставляет
   скрипт в header.php — высота разная на разных ширинах. */
.mk-verh{position:fixed;top:0;left:0;right:0;z-index:60}
body.admin-bar .mk-verh{top:32px}
@media screen and (max-width:782px){body.admin-bar .mk-verh{top:46px}}

/* Переход по оглавлению не должен прятать заголовок под закреплённой шапкой. */
h2[id],h3[id],.st-vopros[id],[id^="mk-"]{scroll-margin-top:calc(var(--mk-verh, 120px) + 14px)}

/* Строки полосы не должны пересекаться в момент смены: старая уходит,
   и только потом появляется новая. */
.mk-lenta__stroka{opacity:0;visibility:hidden;transform:none;
  transition:opacity .18s ease, visibility 0s linear .18s}
.mk-lenta__stroka.mk-vidna{opacity:1;visibility:visible;
  transition:opacity .18s ease .18s, visibility 0s}


/* ==========================================================================
   Страницы кладбищ. Приставка kl-.
   ========================================================================== */
/* ============================================================
   Страница кладбища. Приставка kl-.
   Пишется в том же языке, что stili.css: Lato для текста,
   YanoneKaffeesatz заглавными для заголовков, акцент #c04f40,
   кнопка #dc6555, рамки #e2e7ea, заливка #f4f6f7.

   На боевом сайте этот файл дописывается в конец stili.css —
   отдельного запроса за стилями не появляется.
   ============================================================ */

/* ---------- хлебные крошки ---------- */
.kl-krohi{margin:0 0 18px;font-size:14px;color:#7c8894}
.kl-krohi ol{display:flex;flex-wrap:wrap;gap:6px;margin:0;padding:0;list-style:none}
.kl-krohi li+li::before{content:"/";margin-right:6px;color:#c3ccd2}
.kl-krohi a{color:#5b6773;text-decoration:none;border-bottom:1px solid #dfe4e8}
.kl-krohi a:hover{color:#c04f40;border-color:#c04f40}

/* ---------- первый экран ---------- */
.kl-pervyj{display:grid;grid-template-columns:minmax(0,1fr) 340px;
  gap:44px;align-items:start;margin:0 0 34px}
.kl-pervyj__lid{margin:0 0 22px;font-size:17px;line-height:1.62;color:#41505c;max-width:58ch}
.kl-pervyj__knopki{display:flex;flex-wrap:wrap;gap:12px;margin:24px 0 0}
.kl-tihaya{display:inline-block;padding:15px 28px;border-radius:8px;
  border:1px solid #d7dce3;background:#fff;color:#233240;
  font:700 16px/1 Lato,sans-serif;text-decoration:none}
.kl-tihaya:hover{border-color:#c04f40;color:#c04f40}
.kl-pervyj__snoska{margin:14px 0 0;font-size:14px;line-height:1.6;color:#7c8894;max-width:60ch}

/* ---------- карточка «кладбище сейчас» ---------- */
.kl-sejchas{border:1px solid #e2e7ea;border-radius:12px;background:#fff;padding:20px 22px}
.kl-sejchas__zag{margin:0 0 12px;font-size:12px;font-weight:700;letter-spacing:.1em;
  text-transform:uppercase;color:#8a93a0}
.kl-status{display:flex;align-items:baseline;gap:9px;margin:0 0 14px;padding:0 0 14px;
  border-bottom:1px solid #e2e7ea}
.kl-status b{font:600 21px/1.15 YanoneKaffeesatz,Lato,sans-serif;
  text-transform:uppercase;color:#233240}
.kl-tochka{flex:none;width:9px;height:9px;border-radius:50%;background:#2f7a4a;
  transform:translateY(-3px)}
.kl-tochka--zakryto{background:#c08a2f}
.kl-sejchas dl{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:9px 14px;margin:0}
.kl-sejchas dt{font-size:14px;color:#5b6773}
.kl-sejchas dd{margin:0;font-size:14px;color:#233240;text-align:right;
  font-variant-numeric:tabular-nums}
.kl-sejchas__snoska{margin:14px 0 0;padding:14px 0 0;border-top:1px solid #e2e7ea;
  font-size:13px;line-height:1.5;color:#7c8894}

/* ---------- справка о кладбище ---------- */
.kl-spravka{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;margin:22px 0 0;
  background:#e2e7ea;border:1px solid #e2e7ea;border-radius:12px;overflow:hidden}
.kl-spravka>div{margin:0;padding:18px 20px 20px;background:#fff}
.kl-spravka dt{margin:0 0 7px;font-size:11.5px;font-weight:700;letter-spacing:.1em;
  text-transform:uppercase;color:#8a93a0}
.kl-spravka dd{margin:0;font-size:15px;line-height:1.5;color:#233240}
/* ---------- цены благоустройства на странице кладбища ---------- */
.kl-ceny dd b{display:block;font-size:19px;font-weight:700;color:#c04f40;
  font-family:YanoneKaffeesatz,Lato,sans-serif;letter-spacing:.01em}
.kl-ceny dd span{display:block;margin-top:4px;font-size:13.5px;line-height:1.45;
  color:#7c8894}

.kl-proverka{display:flex;align-items:flex-start;gap:8px;margin:16px 0 0;
  font-size:13.5px;line-height:1.5;color:#7c8894}
.kl-proverka svg{flex:none;margin-top:2px;color:#2f7a4a}

/* ---------- диспетчерская ---------- */
.kl-disp{display:flex;align-items:center;gap:26px;flex-wrap:wrap;margin:20px 0 0;
  padding:20px 24px;border:1px solid #e2e7ea;border-left:3px solid #c04f40;
  border-radius:12px;background:#f8f9fb}
.kl-disp>div{flex:1 1 400px;min-width:0}
.kl-disp b{display:block;margin:0 0 5px;font:600 21px/1.2 YanoneKaffeesatz,Lato,sans-serif;
  text-transform:uppercase;color:#233240}
.kl-disp p{margin:0;font-size:14.5px;line-height:1.55;color:#5b6773;max-width:64ch}
.kl-disp .zayavka{flex:none}

/* ---------- проезд ---------- */
.kl-proezd{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);
  gap:26px;align-items:start;margin:22px 0 0}
.kl-shema{margin:0;padding:18px;border:1px solid #e2e7ea;border-radius:12px;background:#fff}
.kl-shema svg{display:block;width:100%;height:auto}
.kl-shema figcaption{margin:12px 0 0;font-size:13px;line-height:1.5;color:#7c8894}
.kl-sposoby{display:grid;gap:12px;margin:0;padding:0;list-style:none}
.kl-sposob{margin:0;padding:16px 20px 18px;border:1px solid #e2e7ea;
  border-radius:12px;background:#fff}
.kl-sposob b{display:block;margin:0 0 6px;font-size:16px;color:#0c1f2f}
.kl-sposob span{display:block;font-size:14.5px;line-height:1.55;color:#5b6773}
.kl-sposob .kl-marshrut{display:inline-block;margin:10px 6px 0 0;padding:5px 12px;
  border:1px solid #d7dce3;border-radius:999px;background:#f4f6f7;
  font-size:13.5px;font-weight:600;color:#233240;font-variant-numeric:tabular-nums}

/* ---------- кладбища рядом ---------- */
.kl-ryadom{display:flex;flex-wrap:wrap;gap:9px;margin:20px 0 0;padding:0;list-style:none}
.kl-ryadom li{margin:0}
.kl-ryadom a{display:inline-flex;align-items:baseline;gap:8px;padding:9px 15px;
  border:1px solid #d7dce3;border-radius:999px;background:#fff;
  font-size:14.5px;color:#233240;text-decoration:none}
.kl-ryadom a:hover{border-color:#c04f40;background:#fdf3f1}
.kl-ryadom small{color:#8a93a0;font-size:13px}

/* ---------- связка со вторым сайтом (блок «Похороны и подзахоронение») ----------
   Ссылка уводит на ritual-gu.spb.ru, поэтому она нарочно спокойнее наших
   кнопок заявки: это ответ на соседний вопрос, а не призыв к действию. */
.mk-sosed__ssylka{margin:16px 0 0}
.mk-sosed__ssylka a{display:inline-flex;align-items:center;gap:9px;padding:11px 18px;
  border:1px solid #d7dce3;border-radius:999px;background:#fff;
  font-size:15px;color:#233240;text-decoration:none}
.mk-sosed__ssylka a::after{content:"→";color:#8a93a0;font-size:16px;line-height:1}
.mk-sosed__ssylka a:hover{border-color:#c04f40;background:#fdf3f1}
.mk-sosed__ssylka a:hover::after{color:#c04f40}
@media all and (max-width:575px){
  .mk-sosed__ssylka a{width:100%;justify-content:space-between}
}

/* ---------- телефон ---------- */
@media all and (max-width:1023px){
  .kl-pervyj{grid-template-columns:1fr;gap:26px}
  .kl-proezd{grid-template-columns:1fr}
  .kl-spravka{grid-template-columns:1fr 1fr}
}
@media all and (max-width:575px){
  .kl-spravka{grid-template-columns:1fr}
  .kl-disp{gap:14px;padding:18px}
  .kl-disp .zayavka{width:100%}
  .kl-pervyj__knopki .zayavka,.kl-pervyj__knopki .kl-tihaya{flex:1 1 100%;text-align:center}
}

/* ---------- форма заявки ----------
   На сайте её рисует Contact Form 7; здесь та же сетка полей,
   чтобы вид совпадал до подстановки шорткода. */
.kl-forma{display:grid;grid-template-columns:1fr 1fr;gap:16px 20px;
  margin:22px 0 0;padding:26px 28px 28px;border:1px solid #e2e7ea;
  border-radius:12px;background:#f8f9fb}
.kl-pole{display:block;min-width:0}
.kl-pole--shirokoe{grid-column:1/-1}
.kl-pole span{display:block;margin:0 0 7px;font-size:12px;font-weight:700;
  letter-spacing:.08em;text-transform:uppercase;color:#7c8894}
.kl-pole input,.kl-pole select{width:100%;padding:14px 16px;border:1px solid #d7dce3;
  border-radius:8px;background:#fff;color:#233240;
  font:400 15px/1.3 Lato,sans-serif}
.kl-pole input::placeholder{color:#a7b0b8}
.kl-pole input:focus,.kl-pole select:focus{outline:2px solid #c04f40;outline-offset:1px;
  border-color:#c04f40}
.kl-soglasie{grid-column:1/-1;display:flex;gap:10px;align-items:flex-start;
  font-size:13.5px;line-height:1.5;color:#5b6773}
.kl-soglasie input{flex:none;margin-top:3px}
.kl-forma .zayavka{grid-column:1/-1;justify-self:start}
.kl-forma__snoska{grid-column:1/-1;margin:0;font-size:13.5px;line-height:1.55;
  color:#7c8894;max-width:70ch}
@media all and (max-width:575px){
  .kl-forma{grid-template-columns:1fr;padding:20px}
  .kl-forma .zayavka{justify-self:stretch;text-align:center}
}

/* ---------- 3D-предмакеты участка ----------
   Подпись «визуализация» обязательна и не убирается: это макет,
   а не снимок установленной работы. Путать одно с другим нельзя. */
.kl-makety{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;
  margin:22px 0 0;padding:0;list-style:none}
.kl-maket{margin:0;border:1px solid #e2e7ea;border-radius:12px;overflow:hidden;
  background:#fff}
.kl-maket img{display:block;width:100%;height:auto;background:#f4f6f7}
.kl-maket figcaption{padding:14px 18px 16px}
.kl-maket b{display:block;margin:0 0 4px;font-size:16px;color:#0c1f2f}
.kl-maket span{display:block;font-size:14px;line-height:1.5;color:#5b6773}
.kl-metka{display:inline-block;margin:0 0 8px;padding:4px 10px;border-radius:999px;
  background:#f0f2f4;color:#5b6773;font-size:12px;font-weight:700;
  letter-spacing:.06em;text-transform:uppercase}
@media all and (max-width:1023px){.kl-makety{grid-template-columns:1fr 1fr}}
@media all and (max-width:575px){.kl-makety{grid-template-columns:1fr}}

/* ---------- раздел страницы кладбища ----------
   Тема оформляет только h1 в шапке страницы (.heading). Заголовки внутри
   содержимого остаются без стиля, поэтому задаём их здесь — тем же
   узким шрифтом заглавными, что и на страницах видов. */
.kl-razdel{margin:52px 0 0}
.kl-razdel h2{margin:0 0 6px;font-family:YanoneKaffeesatz,sans-serif;font-weight:600;
  font-size:34px;line-height:1.12;letter-spacing:.01em;text-transform:uppercase;
  color:#233240}
.kl-razdel h3,.kl-razdel h4{margin:0 0 6px;font-family:Lato,sans-serif;font-weight:700;
  font-size:17px;line-height:1.3;color:#0c1f2f}
.kl-razdel__pod{margin:8px 0 0;font-size:16px;line-height:1.62;color:#5b6773;
  max-width:74ch}
.kl-pervyj+.kl-razdel{margin-top:44px}
@media all and (max-width:767px){
  .kl-razdel{margin-top:38px}
  .kl-razdel h2{font-size:26px}
}

/* ---------- гашение маркеров темы ----------
   Тема рисует синий кружок у каждого li внутри <article> и отступ 30px.
   Нашим сеткам это не нужно: карточки и плитки — не маркированный список. */
article .kl-sposoby li,article .kl-makety li,article .kl-ryadom li,
article .kl-spisok li{padding-left:0;margin-bottom:0}
article .kl-sposoby li::after,article .kl-makety li::after,
article .kl-ryadom li::after,article .kl-spisok li::after{content:none;display:none}

/* ---------- надзаголовок первого экрана ---------- */
.kl-nadzag{margin:0 0 10px;font-size:12px;font-weight:700;letter-spacing:.12em;
  text-transform:uppercase;color:#c04f40}

/* ---------- опорная страница: список кладбищ ---------- */
.kl-spisok{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;
  margin:24px 0 0;padding:0;list-style:none}
.kl-spisok li{margin:0}
.kl-spisok a{display:block;height:100%;padding:20px 22px 22px;text-decoration:none;
  border:1px solid #e2e7ea;border-radius:12px;background:#fff;color:inherit}
.kl-spisok a:hover{border-color:#c04f40;box-shadow:0 2px 14px rgba(12,31,47,.06)}
.kl-spisok b{display:block;margin:0 0 6px;font:600 24px/1.15 YanoneKaffeesatz,Lato,sans-serif;
  text-transform:uppercase;color:#233240}
.kl-spisok span{display:block;font-size:14.5px;line-height:1.5;color:#5b6773}
.kl-spisok__c{margin-top:10px;color:#c04f40;font-weight:600}
@media all and (max-width:1023px){.kl-spisok{grid-template-columns:1fr 1fr}}
@media all and (max-width:575px){.kl-spisok{grid-template-columns:1fr}}

/* ==========================================================================
   Читаемость: отступы под закреплённой шапкой и размеры заголовков
   ========================================================================== */

/* На страницах без хлебных крошек (виды, каталог) содержимое упиралось
   в полосу шапки: раньше воздух давала сама шапка, но она ушла из потока. */
main > #page:first-child{padding-top:26px}
@media all and (max-width:767px){
  main > #page:first-child{padding-top:24px}
}

/* H1 на телефоне занимал четыре строки крупным капсом и читался тяжело. */
@media all and (max-width:767px){
  #page .heading-page h1,
  #page .heading h1{font-size:25px;line-height:1.16;letter-spacing:.01em;
    margin-bottom:14px}
}
@media all and (max-width:400px){
  #page .heading-page h1,
  #page .heading h1{font-size:23px}
}

/* Первый абзац после заголовка не должен липнуть к нему. */
#page .heading + p,
#page .heading-page + p{margin-top:0}

/* Текст страниц: интервал под чтение с телефона. */
#page p{line-height:1.6}
@media all and (max-width:767px){
  #page p{font-size:16px;line-height:1.62}
}

/* Заголовки внутри страницы: воздух сверху больше, чем снизу, — так видно,
   к какому разделу относится текст. */
#page h2{margin:34px 0 14px;line-height:1.2}
#page h3{margin:26px 0 10px;line-height:1.25}
@media all and (max-width:767px){
  #page h2{margin:28px 0 12px;font-size:22px}
  #page h3{font-size:19px}
}

/* Заголовок раздела на тёмном фоне был мельче плиток под ним. */
#page .heading-white h1{font-size:32px;line-height:1.15}
@media all and (max-width:767px){
  #page .heading-white h1{font-size:26px;margin-bottom:16px}
}

/* Широкая таблица на телефоне обрезалась справа: колонки «что учесть»
   и «моделей» просто не помещались. Там она становится карточками,
   подпись столбца берётся из data-stolbec. */
@media all and (max-width:640px){
  .st-tablica-shirokaya{display:block}
  .st-tablica-shirokaya thead{display:none}
  .st-tablica-shirokaya tbody,
  .st-tablica-shirokaya tr{display:block}
  .st-tablica-shirokaya tr{margin:0 0 12px;border:1px solid #e2e7ea;border-radius:12px;
    overflow:hidden;background:#fff}
  .st-tablica-shirokaya tr:last-child{margin-bottom:0}
  .st-tablica-shirokaya td{display:flex;gap:12px;align-items:baseline;
    justify-content:space-between;border-bottom:1px solid #eef1f3;text-align:right}
  .st-tablica-shirokaya td:last-child{border-bottom:0}
  .st-tablica-shirokaya td::before{content:attr(data-stolbec);flex:0 0 42%;
    text-align:left;font-size:12.5px;line-height:1.3;color:#8a93a0;
    letter-spacing:.02em;text-transform:uppercase}
  .st-tablica-shirokaya td:first-child{background:#f4f6f7;font-weight:600;color:#0c1f2f}
  .st-obertka:has(.st-tablica-shirokaya){overflow:visible}
}

/* --- Блок кладбищ на главной ---
   Секция печатается mu-плагином sajt-kladbishcha.php. Карточки повторяют
   приём секции ссылок на виды: подложка #e8f0f2, радиус 12px, стрелка
   в углу. Сетка авторазмерная: кладбищ станет больше — перестроится сама. */
#kl-glavnaya{padding:0 0 90px}
#kl-glavnaya .heading{margin-bottom:40px}
#kl-glavnaya .kl-glavnaya__lid{margin:16px 0 0;max-width:62ch;
  font-size:18px;line-height:1.55;color:#5b6670}
#kl-glavnaya .wrapper{display:grid;gap:10px;
  grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
#kl-glavnaya .kl-glavnaya__item{position:relative;display:flex;flex-direction:column;
  gap:8px;min-height:150px;padding:24px 26px 52px;border-radius:12px;
  background:#e8f0f2;color:#0c1f2f;text-decoration:none;
  transition:background .2s ease,color .2s ease}
#kl-glavnaya .kl-glavnaya__item:hover{background:#dde8ea;color:#dc6555}
#kl-glavnaya .kl-glavnaya__imya{font-family:YanoneKaffeesatz,Lato,sans-serif;
  font-size:28px;line-height:1.05;font-weight:600;text-transform:uppercase}
#kl-glavnaya .kl-glavnaya__adres{font-size:14.5px;line-height:1.5;color:#5b6670}
#kl-glavnaya .kl-glavnaya__item:hover .kl-glavnaya__adres{color:#5b6670}
#kl-glavnaya .kl-glavnaya__item::after{content:"";position:absolute;
  right:22px;bottom:24px;width:22px;height:10px;
  background:currentColor;transition:transform .2s ease;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 10'%3E%3Cpath d='M0 5h20M16 1l4 4-4 4' fill='none' stroke='%23000' stroke-width='1.6'/%3E%3C/svg%3E") no-repeat center/contain;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 10'%3E%3Cpath d='M0 5h20M16 1l4 4-4 4' fill='none' stroke='%23000' stroke-width='1.6'/%3E%3C/svg%3E") no-repeat center/contain}
#kl-glavnaya .kl-glavnaya__item:hover::after{transform:translateX(4px)}
#kl-glavnaya .kl-glavnaya__vse{background:#233240;color:#fff}
#kl-glavnaya .kl-glavnaya__vse:hover{background:#1b2833;color:#fff}
#kl-glavnaya .kl-glavnaya__vse .kl-glavnaya__adres,
#kl-glavnaya .kl-glavnaya__vse:hover .kl-glavnaya__adres{color:rgba(255,255,255,.72)}
@media all and (max-width:1199px){
  #kl-glavnaya{padding-bottom:70px}
  #kl-glavnaya .kl-glavnaya__lid{font-size:17px}}
@media all and (max-width:575px){
  #kl-glavnaya{padding-bottom:44px}
  #kl-glavnaya .wrapper{grid-template-columns:1fr}
  #kl-glavnaya .kl-glavnaya__item{min-height:0}
  #kl-glavnaya .kl-glavnaya__imya{font-size:24px}
  #kl-glavnaya .kl-glavnaya__lid{font-size:16px}}

/* --- Зазор в горизонтальном меню ---
   У темы пункты разложены justify-content:space-between без gap. Пока их
   было шесть, ширины хватало; седьмой («Кладбища») сжал строку, и на
   1440px слова слиплись. Зазор задаём минимальный — раскладку не трогаем. */
header .header__menu .wrapper ul{gap:20px}
@media all and (max-width:1500px){header .header__menu .wrapper ul{gap:14px}}

/* --- Перечень кладбищ на опорной странице раздела ---
   Два столбца: город и область. Внутри — списком в несколько колонок,
   иначе 57 названий уезжают на два экрана. Ссылками отмечены те кладбища,
   по которым собрана своя страница. */
.kl-perechen{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);
  gap:28px;margin:22px 0 0;padding:26px 28px 28px;border:1px solid #e2e7ea;
  border-radius:12px;background:#fff}
.kl-perechen h3{margin:0 0 14px;padding:0 0 10px;border-bottom:1px solid #e2e7ea;
  font:600 21px/1.15 YanoneKaffeesatz,Lato,sans-serif;text-transform:uppercase;
  letter-spacing:.01em;color:#233240}
.kl-perechen ul{margin:0;padding:0;list-style:none;columns:2;column-gap:26px}
.kl-perechen li{margin:0 0 7px;padding:0;font-size:14.5px;line-height:1.45;
  color:#5b6773;break-inside:avoid}
/* Тема рисует синий кружок через ::after и отодвигает текст на 30px.
   В перечне названий это накладывается на первую букву — гасим точечно. */
article .kl-perechen li::after{content:none}
article .kl-perechen li{padding-left:0;margin-bottom:7px}
.kl-perechen a{color:#c04f40;text-decoration:none;font-weight:600;
  border-bottom:1px solid rgba(192,79,64,.35)}
.kl-perechen a:hover{border-bottom-color:#c04f40}
.kl-perechen__snoska{margin:14px 0 0;font-size:13.5px;line-height:1.55;color:#7c8894}
@media all and (max-width:991px){
  .kl-perechen{grid-template-columns:1fr;gap:22px;padding:22px}}
@media all and (max-width:575px){
  .kl-perechen ul{columns:1}}

/* --- Вкладки «Описание / Детали» на карточке модели ---
   Тема печатает свой маркер списка правилом `article ul li::after` — синий
   кружок 5×5 в левом верхнем углу пункта. Вкладки WooCommerce — это тоже
   <ul><li>, поэтому кружок садился прямо на слово и читался как случайная
   точка на букве. Гасим оба псевдоэлемента: ::after — кружок темы,
   ::before — дефолтные «уши» WooCommerce, из-за которых вкладка выглядела
   надорванной. Взамен — простая линия под активной вкладкой. */
.woocommerce div.product .woocommerce-tabs ul.tabs li::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::after,
.woocommerce div.product .woocommerce-tabs ul.tabs::before,
.woocommerce div.product .woocommerce-tabs ul.tabs::after{
  content:none!important;display:none!important;background:none!important;
  border:0!important;box-shadow:none!important;width:0!important;height:0!important}
.woocommerce div.product .woocommerce-tabs ul.tabs{
  margin:0 0 20px!important;padding:0!important;border-bottom:1px solid #e3e6ea;
  display:flex;flex-wrap:wrap;gap:6px 26px}
.woocommerce div.product .woocommerce-tabs ul.tabs li{
  background:none!important;border:0!important;border-radius:0!important;
  margin:0!important;padding:0!important;box-shadow:none!important}
.woocommerce div.product .woocommerce-tabs ul.tabs li a{
  display:inline-block;padding:10px 0 12px;font-size:16px;font-weight:600;
  color:#5b6773;text-decoration:none;border-bottom:2px solid transparent}
.woocommerce div.product .woocommerce-tabs ul.tabs li a:hover{color:#c04f40}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a{
  color:#111823;border-bottom-color:#c04f40}

/* --- Служебная строка карточки и заголовки внутри вкладок ---
   1. WooCommerce печатает «Артикул: С1-2» и «Категория: …» двумя span подряд,
      без разделителя — читалось как одна слипшаяся строка. Ставим точку-разделитель
      и переводим ссылку категории с дефолтного голубого на цвет сайта.
   2. Внутри панели ещё раз стоит заголовок с именем вкладки: «Описание» под
      вкладкой «Описание». Дубль убираем, вкладка и так подписана. */
.woocommerce div.product .product_meta > span{display:inline}
.woocommerce div.product .product_meta .posted_in::before{content:"·";margin:0 8px;color:#b6bec8}
.woocommerce div.product .product_meta a{color:#c04f40;text-decoration:none;
  border-bottom:1px solid rgba(192,79,64,.35)}
.woocommerce div.product .product_meta a:hover{border-bottom-color:#c04f40}
.woocommerce div.product .woocommerce-Tabs-panel > h2:first-child{
  position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);
  clip-path:inset(50%);white-space:nowrap}


/* ==========================================================================
   Страница услуги «Установка памятника».
   Своих фотографий с установок нет, поэтому иллюстрации рисованные — в той же
   изометрии, что графика на главной. Картинка идёт над разделом и держит
   пропорцию 16:9, чтобы тема не тянула её под свой размер.
   ========================================================================== */
/* фон белый: у самих рисунков белая подложка, серые поля по бокам
   на широком экране бросались в глаза */
.us-risunok{margin:0 0 24px;border-radius:12px;overflow:hidden;background:#fff}
.us-risunok img{display:block;width:100%;height:auto;max-height:380px;object-fit:contain}
.us-risunok figcaption{margin:6px 14px 14px;font-size:14px;line-height:1.5;color:#7c8894}

/* Заглавная картинка под первым экраном: шире и выше остальных, но не на
   пол-экрана — иначе первый экран уезжает вниз и цену не видно. */
.us-glavnaya{margin:0 0 34px}
.us-glavnaya img{max-height:440px}

@media all and (max-width:640px){
  .us-risunok img{max-height:260px}
  .us-glavnaya img{max-height:300px}
}

/* --- Блок «Процесс изготовления»: заголовок уходил под сцену ---
   Сцена (svg, 1080 px) лежит в .process__wrapper и в потоке идёт после
   заголовка, но начинается выше него. Оба элемента без z-index, поэтому
   картинка рисовалась поверх слов: на широком экране «ПАМЯТНИКА» читалось
   сквозь крышу павильона. Поднимаем текстовую колонку над сценой —
   раскладка не меняется, меняется только порядок отрисовки. */
.section-tabs.tabs .container-top .heading,
.section-tabs.tabs .container-top .heading__content{position:relative;z-index:25}

/* --- Превью видео на главной: кадр обрезался по краям ---
   Контейнер почти квадратный (619×626 на широком экране), кадр — 16:9,
   а картинка стояла object-fit:cover. Из 1280 px ширины было видно 56 %:
   надпись в кадре обрывалась с обеих сторон и читалась как «…овление
   …ков на могилу». Показываем кадр целиком; поля сверху и снизу
   закрашиваем цветом секции, чтобы врезки не было видно. */
.profit__video .video__inner{background:#223240;border-radius:10px;overflow:hidden}
.profit__video .video__inner img{width:100%;height:100%;object-fit:contain!important;
  background:#223240;display:block}

/* --- Постраничная навигация каталога ---
   Тот же маркер темы (`article ul li::after`) садился поверх цифр
   в переключателе страниц: на «1» лежал синий кружок 10×10. */
.woocommerce nav.woocommerce-pagination ul.page-numbers li::after,
.woocommerce nav.woocommerce-pagination ul.page-numbers li::before,
.woocommerce nav.woocommerce-pagination ul li::after,
.woocommerce nav.woocommerce-pagination ul li::before{
  content:none!important;display:none!important;background:none!important;
  width:0!important;height:0!important}
.woocommerce nav.woocommerce-pagination ul li{padding-left:0!important}


/* ==========================================================================
   Сжатие закреплённой шапки при прокрутке.
   Целиком закреплённая шапка занимала на компьютере около 200 точек, и текст
   страницы читался в оставшейся щели. Класс вешает скрипт mu-plugin
   sajt-shapka-szhatie.php, вся геометрия — здесь.
   ========================================================================== */
.mk-verh{transition:box-shadow .18s ease}
.mk-verh .header__top,
.mk-verh .mk-lenta{transition:max-height .22s ease, opacity .18s ease,
  padding .22s ease, margin .22s ease}

@media all and (min-width:993px){
  /* полоса условий уходит первой: она справочная, а не навигационная */
  .mk-verh--szhata .mk-lenta{max-height:0;opacity:0;overflow:hidden;
    padding-top:0;padding-bottom:0;border-bottom-color:transparent}
  /* строка с логотипом остаётся, но ниже: телефон и адрес нужны всегда */
  .mk-verh--szhata .header__top .row{min-height:52px}
  .mk-verh--szhata .header__top .mk-logo__znak{transform:scale(.82)}
  .mk-verh--szhata .header__top .mk-logo__slova small{display:none}
  .mk-verh--szhata{box-shadow:0 6px 18px rgba(12,31,47,.10)}
}

/* На телефоне шапка и так короткая, а прыжки высоты там заметнее. Не трогаем. */


/* Галерея производства на странице изготовления: три снимка в ряд.
   Фотографии разной высоты (цех горизонтальный, стела вертикальная),
   поэтому кадрируем их по общей пропорции, а не растягиваем. */
.pr-galereya{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:0 0 8px}
.pr-galereya .pr-plitka{margin:0}
.pr-galereya .pr-plitka img{aspect-ratio:4/3;object-fit:cover;max-height:none}
.pr-galereya figcaption{margin:8px 2px 0;font-size:13.5px;line-height:1.45}

@media all and (max-width:860px){
  .pr-galereya{grid-template-columns:1fr;gap:18px}
  .pr-galereya .pr-plitka img{aspect-ratio:16/10}
}

/* ==========================================================================
   Витрина моделей на страницах кладбищ
   ========================================================================== */

/* Колонка на страницах кладбищ — во всю ширину, 1138 px. Три карточки
   растягивались там до 370 px, памятник в них вырастал до 450 px в высоту,
   и блок занимал полтора экрана: глаз читал его как «шесть огромных камней»,
   а не как витрину.

   Правило привязано к обёртке `.kl-razdel`, а не к ширине окна, потому что
   в статьях колонка 734 px и те же три карточки смотрятся верно. Медиазапрос
   по окну задел бы и их. */
.kl-razdel .st-modeli{grid-template-columns:repeat(6,1fr);gap:10px}
.kl-razdel .st-modeli .st-podpis{padding:10px 12px 13px}
.kl-razdel .st-modeli b{font-size:13.5px;line-height:1.3}
.kl-razdel .st-modeli span{font-size:13px}

/* Уже 1200 px шесть в ряд становятся слишком мелкими — возвращаем три,
   но с потолком по высоте рисунка, иначе возвращается та же болезнь. */
@media all and (max-width:1200px){
  .kl-razdel .st-modeli{grid-template-columns:repeat(3,1fr);gap:12px}
  .kl-razdel .st-modeli img{max-height:300px}
}

/* На телефоне остаются две в ряд, как и было. Потолок снимаем: там его
   роль играет сама узкая колонка. */
@media all and (max-width:600px){
  .kl-razdel .st-modeli{grid-template-columns:repeat(2,1fr);gap:10px}
  .kl-razdel .st-modeli img{max-height:none}
}

/* ==========================================================================
   Цитаты в статьях
   ==========================================================================
   Появились со статьёй про сроки установки (1340): там три цитаты из закона
   и из ответов священников. Тема штатный wp-block-quote никак не оформляет -
   цитата читалась как обычный абзац, а подпись под ней слипалась со следующим
   текстом. Правило общее для всех статей, а не для одной: цитаты с атрибуцией
   нужны каждой статье, где есть нормативный источник. */
/* Контейнер статьи на этом сайте - .main__inner (класс single-post-content
   у темы отсутствует; проверено на боевой странице 31.08.2026). Дублируем
   селектор без контейнера, чтобы правило работало и в локальном превью. */
.main__inner blockquote.wp-block-quote,
article blockquote.wp-block-quote{margin:26px 0;padding:16px 22px;
  border:0;border-left:3px solid #c04f40;background:#f8f9fb;border-radius:0 10px 10px 0}
.main__inner blockquote.wp-block-quote p,
article blockquote.wp-block-quote p{margin:0;font-size:16.5px;
  line-height:1.6;color:#2b3641}
.main__inner blockquote.wp-block-quote cite,
article blockquote.wp-block-quote cite{display:block;margin:10px 0 0;
  font-size:14px;font-style:normal;color:#6b7683}

/* ==========================================================================
   Главная как страница продажи (mu-plugin sajt-glavnaya-prodazha.php)
   План: plans/2026-09-03-glavnaya-kak-stranica-prodazhi.md
   ========================================================================== */

/* --- Кнопки: пара «расчёт + телефон», одна на все четыре блока ---
   Основная кнопка повторяет акцент первого экрана (#dc6555 из main.css),
   телефон — контурная: два одинаково ярких пятна рядом спорят друг с другом. */
.gp-knopki{display:flex;flex-wrap:wrap;align-items:center;gap:12px}
.gp-knopka{display:inline-flex;align-items:center;justify-content:center;
  padding:15px 30px;border-radius:8px;background:#dc6555;border:1px solid #dc6555;
  font-family:Lato,sans-serif;font-size:15px;font-weight:800;line-height:1.2;
  letter-spacing:.03em;text-transform:uppercase;color:#fff;text-decoration:none;
  transition:.25s all;cursor:pointer}
.gp-knopka:hover{background:#f07969;border-color:#f07969;color:#fff}
.gp-tel{display:inline-flex;align-items:center;padding:14px 26px;border-radius:8px;
  font-family:YanoneKaffeesatz,Lato,sans-serif;font-size:24px;font-weight:600;
  line-height:1;letter-spacing:.01em;text-decoration:none;transition:.25s all;
  border:1px solid #c9d4d8;color:#202f3c;background:#fff}
.gp-tel:hover{border-color:#dc6555;color:#dc6555}

/* --- Цена под ключ на первом экране ---
   Врезка внутри .content, сразу под заголовком и лидом.

   Подложка тёмная, а не светлая, хотя текст первого экрана белый
   (.content__inner{color:#fff} в main.css). Причина: фон первого экрана —
   светло-зелёная изометрия, и белый по ней читается на пределе. Светлая
   полупрозрачная врезка, снятая первой, добавляла света и делала лид почти
   нечитаемым. Тёмная возвращает контраст и заодно отделяет цену от лида.

   z-index нужен: рисунок памятника из соседней колонки вылезает влево
   и на ширине 1440 ложился поверх текста врезки. */
.gp-pervyj{position:relative;z-index:3;
  margin:26px 0 0;padding:22px 24px 24px;border-radius:12px;
  background:rgba(18,30,40,.72);border:1px solid rgba(255,255,255,.18);
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.gp-pervyj__cena{margin:0 0 10px;max-width:none!important;
  font-family:YanoneKaffeesatz,Lato,sans-serif;font-size:27px;line-height:1.15;
  font-weight:600;color:#fff;text-transform:uppercase}
.gp-pervyj__cena b{font-weight:700;white-space:nowrap}
.gp-pervyj__pod{margin:0 0 18px;max-width:none!important;font-size:15px;
  line-height:1.55;color:rgba(255,255,255,.86)}
/* На тёмной подложке контурный телефон должен быть светлым, а не серым. */
.gp-knopki--pervyj .gp-tel{background:transparent;color:#fff;
  border-color:rgba(255,255,255,.4)}
.gp-knopki--pervyj .gp-tel:hover{background:rgba(255,255,255,.1);color:#fff;
  border-color:#fff}

@media all and (max-width:1199px){
  .gp-pervyj{margin-top:22px;padding:20px}
  .gp-pervyj__cena{font-size:24px}}
@media all and (max-width:575px){
  .gp-pervyj{padding:18px 16px 20px;border-radius:10px}
  .gp-pervyj__cena{font-size:21px}
  .gp-pervyj__pod{font-size:14.5px;margin-bottom:16px}
  .gp-knopki{gap:10px}
  .gp-knopka,.gp-knopki--pervyj .gp-tel{width:100%;justify-content:center}
  .gp-knopka{padding:14px 20px}
  .gp-tel{padding:12px 20px;font-size:22px}}

/* --- Из чего складывается цена ---
   Четыре доли одной строкой. Подложка и радиус — как у «Чем подтверждаем»,
   чтобы блоки читались одной семьёй, а не набором чужих карточек. */
#gp-cena{padding:0 0 90px}
#gp-cena .heading{margin-bottom:40px}
#gp-cena .gp-cena__lid{margin:16px 0 0;max-width:62ch;font-size:18px;
  line-height:1.5;color:#5b6670}
#gp-cena .wrapper{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
#gp-cena .gp-dolya{background:#e8f0f2;border-radius:12px;padding:24px 22px 26px;
  display:flex;flex-direction:column;gap:8px}
#gp-cena .gp-dolya h3{margin:0;font-family:YanoneKaffeesatz,sans-serif;
  font-size:26px;line-height:1.1;font-weight:600;text-transform:uppercase;
  color:#202f3c}
#gp-cena .gp-dolya__cena{margin:0;font-family:YanoneKaffeesatz,sans-serif;
  font-size:23px;line-height:1;font-weight:700;color:#dc6555}
#gp-cena .gp-dolya__text{margin:2px 0 0;font-size:15px;line-height:1.5;
  color:#5b6670}
#gp-cena .gp-cena__snoska{margin:22px 0 0;padding:18px 20px;background:#f8f9fb;
  border:1px solid #e3e6ea;border-radius:12px;font-size:15.5px;line-height:1.55;
  color:#233240}
#gp-cena .gp-cena__snoska b{white-space:nowrap}

@media all and (max-width:1199px){
  #gp-cena{padding-bottom:70px}
  #gp-cena .wrapper{grid-template-columns:repeat(2,1fr)}}
@media all and (max-width:575px){
  #gp-cena{padding-bottom:44px}
  #gp-cena .wrapper{grid-template-columns:1fr}
  #gp-cena .gp-cena__lid{font-size:16px}
  #gp-cena .gp-dolya{padding:20px 18px 22px}
  #gp-cena .gp-dolya h3{font-size:23px}}

/* --- Полоса действия между блоками ---
   Тёмная, чтобы работать паузой между двумя светлыми секциями. До неё заявку
   можно было оставить только внизу страницы. */
#gp-polosa{padding:0 0 90px}
#gp-polosa .gp-polosa__inner{display:flex;align-items:center;
  justify-content:space-between;gap:30px;padding:34px 40px;border-radius:12px;
  background:#202f3c}
#gp-polosa .gp-polosa__zag{margin:0 0 8px;font-family:YanoneKaffeesatz,sans-serif;
  font-size:30px;line-height:1.1;font-weight:600;text-transform:uppercase;
  color:#fff}
#gp-polosa .gp-polosa__pod{margin:0;max-width:58ch;font-size:15.5px;
  line-height:1.55;color:rgba(255,255,255,.76)}
#gp-polosa .gp-knopki{flex-shrink:0}
#gp-polosa .gp-tel{background:transparent;color:#fff;
  border-color:rgba(255,255,255,.4)}
#gp-polosa .gp-tel:hover{background:rgba(255,255,255,.1);color:#fff;
  border-color:#fff}

@media all and (max-width:1199px){
  #gp-polosa{padding-bottom:70px}
  #gp-polosa .gp-polosa__inner{flex-direction:column;align-items:flex-start;
    gap:22px;padding:30px}
  #gp-polosa .gp-knopki{width:100%}}
@media all and (max-width:575px){
  #gp-polosa{padding-bottom:44px}
  #gp-polosa .gp-polosa__inner{padding:24px 18px;border-radius:10px}
  #gp-polosa .gp-polosa__zag{font-size:24px}
  #gp-polosa .gp-polosa__pod{font-size:14.5px}
  #gp-polosa .gp-knopka,#gp-polosa .gp-tel{width:100%;justify-content:center}}

/* --- Частые вопросы ---
   Раскрывашки на <details>: без единой строки скрипта, читаются поиском
   и с клавиатуры. Первый открыт — иначе блок выглядит пустой лестницей. */
#gp-voprosy{padding:0 0 90px}
#gp-voprosy .heading{margin-bottom:36px}
#gp-voprosy .gp-voprosy__lid{margin:16px 0 0;max-width:62ch;font-size:18px;
  line-height:1.5;color:#5b6670}
#gp-voprosy .wrapper{display:flex;flex-direction:column;gap:8px;
  margin-bottom:32px}
.gp-vopros{border:1px solid #e3e6ea;border-radius:12px;background:#fff;
  overflow:hidden}
.gp-vopros summary{list-style:none;cursor:pointer;padding:19px 54px 19px 22px;
  position:relative;font-family:YanoneKaffeesatz,Lato,sans-serif;font-size:22px;
  line-height:1.25;font-weight:600;color:#202f3c;transition:.2s color}
.gp-vopros summary::-webkit-details-marker{display:none}
.gp-vopros summary:hover{color:#c04f40}
/* Знак «плюс» рисуем двумя палочками: в открытом состоянии вертикальная
   прячется, и он становится минусом. Картинок и шрифта-иконок не нужно. */
.gp-vopros summary::before,.gp-vopros summary::after{content:"";position:absolute;
  right:24px;top:50%;background:#dc6555;transition:.2s all}
.gp-vopros summary::before{width:14px;height:2px;margin-top:-1px}
.gp-vopros summary::after{width:2px;height:14px;margin-top:-7px;margin-right:6px}
.gp-vopros[open] summary::after{opacity:0;transform:rotate(90deg)}
.gp-vopros[open] summary{color:#202f3c}
.gp-vopros__otvet{padding:0 22px 20px}
.gp-vopros__otvet p{margin:0;font-size:15.5px;line-height:1.6;color:#5b6670}

@media all and (max-width:1199px){
  #gp-voprosy{padding-bottom:70px}}
@media all and (max-width:575px){
  #gp-voprosy{padding-bottom:44px}
  #gp-voprosy .gp-voprosy__lid{font-size:16px}
  .gp-vopros summary{font-size:19px;padding:16px 46px 16px 16px}
  .gp-vopros summary::before,.gp-vopros summary::after{right:18px}
  .gp-vopros__otvet{padding:0 16px 17px}
  .gp-vopros__otvet p{font-size:15px}
  #gp-voprosy .gp-knopka,#gp-voprosy .gp-tel{width:100%;justify-content:center}}

/* ==========================================================================
   Блоки статей: сравнение, ошибки, крупный баннер
   ==========================================================================
   Добавлены 31.08.2026 по образцу вёрстки, которую выбрал владелец.
   Три новых кирпича: сравнение двух вариантов карточками (вместо таблицы,
   которая на телефоне разворачивается в столбик), перечень типичных ошибок
   и крупный блок с призывом вместо тихой врезки. */

/* --- Сравнение двух вариантов --- */
.st-sravnenie{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:24px 0}
.st-sravnenie-karta{border:1px solid #e2e7ea;border-radius:14px;padding:20px 22px 18px;
  background:#fff}
.st-sravnenie-karta>b{display:block;margin:0 0 8px;font-size:17px;line-height:1.3;
  color:#0c1f2f}
.st-sravnenie-karta p{margin:0 0 14px;font-size:15px;line-height:1.6;color:#3a4753}
.st-sravnenie-karta ul{margin:0;padding:0;list-style:none}
.st-sravnenie-karta li{position:relative;margin:0 0 9px;padding-left:26px;
  font-size:14.5px;line-height:1.5;color:#3a4753}
.st-sravnenie-karta li:last-child{margin-bottom:0}
.st-sravnenie-karta li::before{position:absolute;left:0;top:1px;width:18px;height:18px;
  border-radius:50%;font-size:13px;font-weight:700;line-height:18px;text-align:center}
.st-sravnenie-karta li.st-plus::before{content:"+";background:#e8f4ec;color:#2f7d4f}
.st-sravnenie-karta li.st-minus::before{content:"\2212";background:#fbeceb;color:#c04f40}
article .st-sravnenie-karta li::after,#page .st-sravnenie-karta li::after{
  content:none!important;display:none!important}
@media all and (max-width:700px){.st-sravnenie{grid-template-columns:1fr}}

/* --- Частые ошибки --- */
.st-oshibki{margin:24px 0;padding:0;list-style:none}
.st-oshibki>li{display:flex;gap:14px;align-items:flex-start;margin:0 0 10px;
  padding:16px 20px;border:1px solid #e2e7ea;border-radius:12px;background:#fff}
.st-oshibki>li:last-child{margin-bottom:0}
.st-oshibka-znak{flex:0 0 30px;width:30px;height:30px;border-radius:50%;
  background:#fbeceb;position:relative}
.st-oshibka-znak::before{content:"!";position:absolute;inset:0;text-align:center;
  line-height:30px;font-size:16px;font-weight:700;color:#c04f40}
.st-oshibki b{display:block;margin:0 0 4px;font-size:15.5px;line-height:1.35;color:#0c1f2f}
.st-oshibki span:not(.st-oshibka-znak){display:block;font-size:14.5px;line-height:1.55;
  color:#5b6773}
article .st-oshibki>li::after,article .st-oshibki>li::before,
#page .st-oshibki>li::after,#page .st-oshibki>li::before{
  content:none!important;display:none!important;background:none!important;
  width:0!important;height:0!important}

/* --- Крупный блок с призывом --- */
.st-banner{margin:28px 0;padding:26px 28px;border-radius:16px;
  background:linear-gradient(135deg,#12263a,#20405c)}
.st-banner-nad{display:block;margin:0 0 10px;font-size:12px;letter-spacing:.08em;
  text-transform:uppercase;color:#8fd3a8}
.st-banner>b{display:block;margin:0 0 8px;font-size:21px;line-height:1.3;color:#fff}
.st-banner p{margin:0 0 18px;font-size:15.5px;line-height:1.6;color:#c9d6e2;max-width:640px}
/* Строка ссылок на страницы кладбищ внутри тёмного баннера.
   Добавлено 14.09.2026: статьи про благоустройство приводят людей со всей
   страны, блок даёт петербуржцам выход на свою страницу кладбища.
   На тёмном фоне ссылка темы неразличима, поэтому свой цвет. */
.st-banner-ssylki{font-size:14.5px;line-height:1.8;color:#9fb3c4}
.st-banner-ssylki a{color:#8fd3a8;text-decoration:underline;text-underline-offset:2px}
.st-banner-ssylki a:hover{color:#fff}
.st-banner-niz{display:flex;flex-wrap:wrap;gap:12px}
.st-banner-knopka{display:inline-block;padding:12px 22px;border-radius:10px;
  font-size:15px;font-weight:600;text-decoration:none;transition:background .2s}
.st-banner-knopka.st-osnovnaya{background:#c04f40;color:#fff}
.st-banner-knopka.st-osnovnaya:hover{background:#a94436;color:#fff}
.st-banner-knopka.st-vtoraya{background:rgba(255,255,255,.12);color:#fff;
  border:1px solid rgba(255,255,255,.35)}
.st-banner-knopka.st-vtoraya:hover{background:rgba(255,255,255,.2);color:#fff}
@media all and (max-width:600px){
  .st-banner{padding:22px 20px}
  .st-banner>b{font-size:19px}
  .st-banner-knopka{width:100%;text-align:center}
}

/* ==========================================================================
   Значки в блоках статей
   ==========================================================================
   Свой линейный набор (24x24, stroke currentColor) вместо картинок: вектор
   чёткий на любом экране, весит десятки байт и наследует цвет текста.
   Добавлено 31.08.2026 вместе с переверсткой всех статей раздела. */

.st-znak{display:block;width:26px;height:26px;color:#c04f40;flex:0 0 26px}

/* Плитки со значком: значок слева, текст справа. */
.st-plitki-znaki>li.st-s-znakom{display:flex;gap:13px;align-items:flex-start}
.st-plitki-znaki>li.st-s-znakom>div{min-width:0}
.st-plitki-znaki .st-znak{margin-top:2px}

/* Значок в полосе крупных чисел - над числом, приглушённый. */
.st-chisla .st-znak{width:22px;height:22px;margin:0 0 8px;color:#8d99a6}

/* Значок вместо восклицательного знака в перечне. */
.st-spisok-znak{flex:0 0 30px;width:30px;height:30px;padding:3px;border-radius:50%;
  background:#fbeceb;color:#c04f40;box-sizing:border-box}
.st-oshibki.st-galochka .st-spisok-znak{background:#e8f4ec;color:#2f7d4f}

/* Значок в карточке сравнения - рядом с заголовком. */
.st-sravnenie-karta>b .st-znak{display:inline-block;vertical-align:-6px;
  margin-right:8px;width:22px;height:22px}

/* ==========================================================================
   Широкие экраны (1500 px и шире)
   ==========================================================================
   Сайт всё время проверялся на 390 и 1440 - на них всё было цело. Владелец
   7 сентября показал снимки со своего экрана (1920): страница ездит вбок,
   число «2500» съедено памятником, карточки моделей на главной размером
   почти в экран. Всё три - только на ширине больше 1440. */

/* Меню подвала стояло в одну строку без переноса (flex nowrap, flex:1 у
   пунктов). Пока пунктов было пять, оно влезало; после страниц кладбищ,
   установки и доставки - перестало, и последний пункт вылезал за правый
   край. Из-за него весь сайт получал боковую прокрутку на 64 px.
   Перенос строки + натуральная ширина пунктов (иначе одинокий пункт во
   второй строке растягивается на всю ширину). */
footer .footer__menu .menu__inner > ul{flex-wrap:wrap;row-gap:8px}
footer .footer__menu .menu__inner > ul > li{flex:0 0 auto !important}

/* Блок «Популярные модели» на главной берёт сетку `st-modeli` из статей.
   В статье колонка узкая, и три карточки в ряд там к месту; на главной
   контейнер 1754 px, и та же сетка давала карточки 565×849 - два ряда
   высотой в два экрана. Шесть моделей ставим в один ряд, как в разделе
   кладбищ (.kl-razdel). */
@media all and (min-width:1200px){
  #pop-glavnaya .pop-setka{grid-template-columns:repeat(6,1fr);gap:10px}
  #pop-glavnaya .pop-setka .st-podpis{padding:10px 12px 13px}
  #pop-glavnaya .pop-setka b{font-size:13.5px;line-height:1.3}
}

/* Подпись под заголовком блока осталась без стилей и печаталась тёмно-серым
   по тёмному мрамору - её не было видно ни на одном экране. */
#pop-glavnaya .pop-pod{color:rgba(255,255,255,.78);font-size:16px;
  max-width:80ch;margin:6px 0 0}

/* --- Число «2500»: три причины, почему его не было видно ---
   1. Тема держит на этом месте коробку max-width:320px (она была под
      картинку icon_11.svg). Текст числа шире коробки и вылезал за неё, а
      градиент «толщины» рисуется только внутри коробки - у последних цифр
      контур пропадал вовсе, и само число стояло не по центру.
   2. Сцена участка лежит выше числа (.wrapper z-index:10 против 8), и
      памятник закрывал цифры. На широком экране сцена выше, перекрытие
      больше.
   3. Нижний конец градиента - #F0F0F0 из исходной картинки: на белом небе
      контур пропадал. Делаем конец тёплым серым.
   Правки 1 и 3 нужны на любой ширине, 2 - на десктопе. */
#main-catalog .catalog__heading .mk-chislo{max-width:none;width:auto;z-index:11}
#main-catalog .catalog__heading .mk-chislo::before{
  background:linear-gradient(180deg,#202F3C 0%,#7B5334 62%,#C0AC95 96%);
  -webkit-background-clip:text;background-clip:text}

/* Кегль числа был жёстким (384 px) и на 1200-1500 отжимал надписи к самым
   краям экрана. Привязываем к ширине окна: на 1920 те же 384 px, на 1280 -
   269 px, поля по бокам остаются всегда. */
@media all and (min-width:1200px){
  #main-catalog .catalog__heading .mk-chislo{font-size:min(384px,21vw)}
}

/* --- Блок «Полезная информация и статьи» под статьёй ------------------------

   Тема задавала карточке жёсткие 422 px, а слайдеру Swiper - режим
   slidesPerView:'auto', то есть ширину он берёт из стилей. На мониторе 1920
   контейнер блока 1754 px, три карточки занимали 1286 - справа зияла пустота
   на 468 px. На 1440 наоборот: 1286 не влезали в контейнер 1170 и третья
   карточка обрезалась.

   Ширину считаем от контейнера, зазор между карточками - 10 px (его ставит
   сам Swiper, spaceBetween:10 в main.js). Формула: N карточек и N-1 зазоров.
   Сколько карточек в ряд - по ширине окна, поэтому пустоты не остаётся ни на
   одном экране. Телефон оставляем как был: карточка 300 px, следующая
   выглядывает краем и подсказывает, что блок листается. */

#articles .articles__slider{overflow:hidden}          /* чтобы за краем ряда
        не выглядывала половина пятой карточки: рядов теперь несколько */
#articles .articles__slider .swiper-slide{
  width:calc((100% - 30px)/4) !important}             /* 4 в ряд: 1500 и шире */
#articles .articles__slider .slide__inner{width:100%}

@media all and (max-width:1499px){
  #articles .articles__slider .swiper-slide{width:calc((100% - 20px)/3) !important}
}
@media all and (max-width:991px){
  #articles .articles__slider .swiper-slide{width:calc((100% - 10px)/2) !important}
}
@media all and (max-width:575px){
  #articles .articles__slider{overflow:visible}
  #articles .articles__slider .swiper-slide{width:300px !important}
}

/* --- Качество картинок в карточках блока -----------------------------------

   Коробка картинки в теме имеет жёсткую высоту (320 / 280 / 230 px по
   ширине окна), а сами картинки статей - 16:9. Пропорции не совпадали:
   коробка 423x320 это 1.32, картинка 1.79. При обрезке object-fit:cover
   картинку приходится растягивать по высоте, то есть точек нужно больше,
   чем ширина коробки. Браузер об этом не знает: в sizes стоит `auto`, и он
   считает по ширине - и берёт файл на ступень мельче, чем нужно. На 1440
   это давало 400x223 в коробку 373x230, то есть растяжение.

   Отдаём коробке ту же пропорцию, что у картинок. Тогда ширина коробки и
   есть нужное число точек, `auto` считает верно на любой плотности экрана,
   и файл всегда только уменьшается, а не растягивается. Картинка заодно
   перестаёт обрезаться сверху и снизу - это рисунки, их резать незачем. */
#articles .post__item .post__image{height:auto;aspect-ratio:16/9}

/* --- Хлебные крошки ---------------------------------------------------------

   План: plans/2026-09-09-hlebnye-kroshki-pamyatnikspb.md

   Крошки печатает mu-плагин sajt-krohi.php. Форма разметки осталась той же,
   что была в теме, поэтому правила #breadcrumbs в main.css продолжают
   работать - здесь только то, чего в них не хватало. Замер 9 сентября
   показал три вещи, которые надо было поправить:

   1. Крошки шли шрифтом 16px цветом #233240 - то есть размером основного
      текста и цветом заголовка. Служебная строка не должна выглядеть как
      содержимое: на телефоне H1 всего 23px, и крошки в 16px с ним спорили.
   2. На телефоне цепочка занимала три строки (66px), причём последняя
      ступень слово в слово повторяла заголовок, стоящий прямо под ней.
   3. Вокруг строки в 22px стояло 104px отступов (44 сверху, 60 снизу).

   Оформление берём не новое, а то, что уже придумано для крошек на
   страницах кладбищ (.kl-krohi выше в этом файле): приглушённый серо-синий,
   тонкая линия под ссылкой вместо подчёркивания, акцент #c04f40 по наведению.
   Одни крошки на сайте должны выглядеть одинаково. */

#breadcrumbs{padding-top:28px;margin-bottom:28px}
@media all and (max-width:1199px){
  #breadcrumbs{padding-top:20px;margin-bottom:20px}
}

/* Одна строка. Ступени пути не переносим и не рвём - они короткие и по ним
   уходят назад. Сжимается только последняя, текущая: её содержимое и так
   стоит заголовком ниже, поэтому многоточие тут ничего не отнимает. */
#breadcrumbs .breadcrumbs{display:flex;flex-wrap:nowrap;align-items:baseline;
  overflow:hidden;font-size:14px;line-height:1.5;color:#7c8894}
#breadcrumbs .breadcrumbs>span{display:inline-block;flex:0 0 auto;white-space:nowrap}
#breadcrumbs .breadcrumbs>span:last-child{flex:0 1 auto;min-width:0;
  overflow:hidden;text-overflow:ellipsis}
#breadcrumbs .breadcrumbs>span:last-child span{display:inline}

#breadcrumbs .breadcrumbs span{color:#7c8894}
#breadcrumbs .breadcrumbs span a{color:#5b6773;text-decoration:none}
#breadcrumbs .breadcrumbs span a span{color:inherit;text-decoration:none;
  border-bottom:1px solid #dfe4e8}
#breadcrumbs .breadcrumbs span a:hover{color:#c04f40}
#breadcrumbs .breadcrumbs span a:hover span{border-color:#c04f40}
#breadcrumbs .breadcrumbs span a:focus-visible{outline:2px solid #c04f40;
  outline-offset:3px;border-radius:2px}

/* Текущая ступень - самая тихая: это не ссылка, а отметка «вы здесь».
   Тише, но не бледнее нормы: #6b7480 на белом даёт 4.74:1 при требуемых
   4.5:1. Первый вариант (#8a93a0) давал 3.11 - замерено, а не прикинуто. */
#breadcrumbs .breadcrumbs .current-item{color:#6b7480}

/* Тёмная подложка: статьи и рубрики. Те же роли, только светлыми.

   Внутренний span ступени приходится называть selectorом явно: правило
   `.white .breadcrumbs span` бьёт по нему напрямую и перекрывает цвет,
   унаследованный от ссылки. Без этой строки ссылки и текущая ступень
   на тёмном становились одного цвета, и ссылки переставали читаться
   как ссылки. */
#breadcrumbs.white .breadcrumbs,
#breadcrumbs.white .breadcrumbs span{color:rgba(255,255,255,.62)}
#breadcrumbs.white .breadcrumbs span a,
#breadcrumbs.white .breadcrumbs span a span{color:rgba(255,255,255,.88)}
#breadcrumbs.white .breadcrumbs span a span{border-bottom-color:rgba(255,255,255,.32)}
#breadcrumbs.white .breadcrumbs span a:hover,
#breadcrumbs.white .breadcrumbs span a:hover span{color:#fff}
#breadcrumbs.white .breadcrumbs span a:hover span{border-color:#fff}
#breadcrumbs.white .breadcrumbs .current-item{color:rgba(255,255,255,.62)}

@media all and (max-width:767px){
  #breadcrumbs .breadcrumbs{font-size:13px}
}

/* ==========================================================================
   Толщина стелы на карточке: 5 или 8 см (sajt-tolshchina.php).
   Цена витрины - за 5 см, кнопка 8 см меняет цену. Рамки, скругление и
   терракота - те же, что у блока «Что входит» ниже по карточке.
   ========================================================================== */
.mk-tol{margin:-6px 0 20px;padding:14px 16px 14px;border:1px solid #e2e7ea;border-radius:12px;
  background:#fff;max-width:640px}
.mk-tol-zag{font-size:12px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;
  color:#7c8894;margin:0 0 10px}
.mk-tol-stroka{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.mk-tol-knopka{appearance:none;-webkit-appearance:none;background:#fff;border:1px solid #e2e7ea;
  border-radius:10px;padding:9px 14px;margin:0;cursor:pointer;text-align:left;line-height:1.25;
  font-family:inherit;font-size:15px;color:#233240;box-shadow:none;transition:border-color .15s,background .15s}
.mk-tol-knopka b{display:block;font-size:16px;font-weight:700;color:#0c1f2f}
.mk-tol-knopka span{display:block;font-size:12.5px;font-weight:400;color:#7c8894;margin-top:3px}
.mk-tol-knopka:hover{border-color:#c04f40;background:#fff}
.mk-tol-knopka[aria-pressed="true"]{border-color:#c04f40;background:#fdf6f5;box-shadow:inset 0 0 0 1px #c04f40}
.mk-tol-knopka:focus-visible{outline:2px solid #0c1f2f;outline-offset:2px}
.mk-tol-pod{font-size:13.5px;line-height:1.5;color:#41505c;margin:12px 0 0}
@media(max-width:480px){.mk-tol-stroka{grid-template-columns:1fr}}

/* ——— Карточка модели: размеры, объём, панель (11.09.2026) ——————————————
   Чертёж и объёмный вид собирает mk-kartochka.js из данных, которые готовит
   scripts/pamyatnikspb/chertezh.py. Оформление держим тем же, что у
   переключателя толщины (.mk-tol): рамка #e2e7ea, радиус 10, выбранное —
   терракотой. Иначе на одной карточке окажется два разных стиля кнопок. */

.mk-kv-vidy{display:flex;gap:8px;margin:12px 0 0;flex-wrap:wrap}
.mk-kv-vid{appearance:none;-webkit-appearance:none;font-family:inherit;font-size:14px;
  line-height:1.2;color:#233240;background:#fff;border:1px solid #e2e7ea;border-radius:10px;
  padding:9px 16px;cursor:pointer;transition:border-color .15s,background .15s}
.mk-kv-vid:hover{border-color:#c04f40}
.mk-kv-vid--vybran{border-color:#c04f40;background:#fdf6f5;box-shadow:inset 0 0 0 1px #c04f40;
  font-weight:600}
.mk-kv-vid:focus-visible{outline:2px solid #0c1f2f;outline-offset:2px}

/* Пока показан чертёж или объём, штатная галерея прячется — но только после
   того, как замена построена скриптом. Без скрипта класс не появляется. */
.mk-kv-foto-spryatano .woocommerce-product-gallery__wrapper,
.mk-kv-foto-spryatano .flex-viewport,
.mk-kv-foto-spryatano .woocommerce-product-gallery__trigger{display:none}

/* Кнопка «смотреть фото во весь экран» (лупа) — своим слоем 99 от WooCommerce
   она перекрывала закреплённую шапку (слой 60): при прокрутке белый круг с
   лупой проступал поверх логотипа и полосы с условиями (владелец 14.09:
   «лупа уезжает, шапку смотри»). Ей хватает слоя над картинкой галереи. */
.woocommerce div.product div.images .woocommerce-product-gallery__trigger{z-index:5}

.mk-kv-korob{margin:0}
.mk-kv-chertezh-pole{display:flex;justify-content:center;align-items:flex-end;
  min-height:320px;background:#f7f8f9;border:1px solid #e3e6ea;border-radius:10px;padding:18px}
.mk-kv-chertezh-pole svg{max-width:100%;height:auto}
.mk-kv-stupeni{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0 0}
.mk-kv-stupen{appearance:none;-webkit-appearance:none;font-family:inherit;font-size:14.5px;
  color:#233240;background:#fff;border:1px solid #e2e7ea;border-radius:10px;padding:8px 13px;
  cursor:pointer;transition:border-color .15s,background .15s}
.mk-kv-stupen:hover{border-color:#c04f40}
.mk-kv-stupen--vybrana{border-color:#c04f40;background:#fdf6f5;box-shadow:inset 0 0 0 1px #c04f40;
  font-weight:600}
.mk-kv-stupen:focus-visible{outline:2px solid #0c1f2f;outline-offset:2px}
.mk-kv-sostav{font-size:13.5px;line-height:1.5;color:#41505c;margin:12px 0 0}
.mk-kv-snoska{font-size:13px;line-height:1.5;color:#7c8894;margin:6px 0 0}

.mk-kv-obyom .mk-obyom{background:#f7f8f9;border:1px solid #e3e6ea;border-radius:10px;
  touch-action:pan-y;overflow:hidden}
.mk-obyom-holst{display:block;margin:0 auto;cursor:grab}
.mk-obyom--tyanut .mk-obyom-holst{cursor:grabbing}
.mk-obyom-holst:focus-visible{outline:2px solid #0c1f2f;outline-offset:-2px}
.mk-obyom-pod{font-size:12.5px;color:#7c8894;text-align:center;margin:0;padding:0 0 10px}

/* Чертёж: стили вынесены сюда из самой разметки, чтобы один и тот же блок
   не повторялся в каждом из 288 чертежей. */
.ch-kamen{fill:#223240}
.ch-tumba{fill:#2c3f4f}
.ch-cvetnik{fill:#41566a;stroke:#223240;stroke-width:.8}
.ch-razmer line{stroke:#9aa6ae;stroke-width:1}
.ch-razmer .ch-strelka{fill:none;stroke:#9aa6ae;stroke-width:1.2}
.ch-razmer text{fill:#41505c;font:600 11px Lato,system-ui,sans-serif;
  paint-order:stroke;stroke:#f7f8f9;stroke-width:2;stroke-linejoin:round}
.ch-vynos{stroke:#9aa6ae;stroke-width:.8;stroke-dasharray:3 3}

/* Липкая панель. Появляется, когда цена уехала вверх за край экрана. */
.mk-kv-panel{position:fixed;left:0;right:0;bottom:0;z-index:60;display:flex;
  align-items:center;justify-content:space-between;gap:16px;
  padding:10px 18px;background:#fff;border-top:1px solid #e3e6ea;
  box-shadow:0 -4px 18px rgba(12,31,47,.09)}
.mk-kv-panel[hidden]{display:none}
/* Пока панель на экране, она закрывала бы низ страницы — даём отступ. */
body.mk-kv-s-panelyu{padding-bottom:78px}
.mk-kv-panel-kto{display:flex;align-items:center;gap:12px;min-width:0}
.mk-kv-panel-kto img{width:46px;height:46px;object-fit:contain;background:#f4f6f7;border-radius:8px}
.mk-kv-panel-imya{font-size:14.5px;color:#0c1f2f;white-space:nowrap;overflow:hidden;
  text-overflow:ellipsis;max-width:38vw}
.mk-kv-panel-nabor{font-size:13px;color:#7c8894;white-space:nowrap}
.mk-kv-panel-dejstvie{display:flex;align-items:center;gap:14px;flex:none}
.mk-kv-panel-cena{font-size:17px;font-weight:700;color:#0c1f2f;white-space:nowrap}
.mk-kv-panel-knopka{display:inline-block;padding:11px 22px;border-radius:8px;
  background:#c04f40;color:#fff;font-size:15px;line-height:1.2;text-decoration:none;white-space:nowrap}
.mk-kv-panel-knopka:hover{background:#a8422f;color:#fff}

@media(max-width:760px){
  .mk-kv-chertezh-pole{min-height:260px;padding:12px}
  .mk-kv-panel{padding:8px 12px;gap:10px}
  .mk-kv-panel-kto img,.mk-kv-panel-nabor{display:none}
  .mk-kv-panel-imya{max-width:44vw;font-size:13.5px}
  .mk-kv-panel-cena{font-size:15.5px}
  .mk-kv-panel-knopka{padding:10px 16px;font-size:14px}
}

/* Выбор кладбища на карточке. Ограничений по высоте у нас в данных нет,
   поэтому модели по кладбищу не фильтруются — выбор нужен, чтобы менеджер
   знал участок заранее, а человек попал на страницу своего кладбища. */
.mk-kv-kladbishche{border:1px solid #e2e7ea;border-radius:12px;padding:16px 18px 18px;
  margin:22px 0 0;background:#f7f8f9}
.mk-kv-kl-zag{font-size:12px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;
  color:#7c8894;margin:0 0 8px}
.mk-kv-kl-pod{font-size:14px;line-height:1.5;color:#41505c;margin:0 0 12px}
.mk-kv-kl-vybor{width:100%;max-width:420px;font-family:inherit;font-size:15px;color:#233240;
  background:#fff;border:1px solid #d7dce3;border-radius:10px;padding:11px 13px;cursor:pointer}
.mk-kv-kl-vybor:focus-visible{outline:2px solid #0c1f2f;outline-offset:2px}
.mk-kv-kl-otvet{font-size:14px;line-height:1.5;color:#41505c;margin:12px 0 0}
.mk-kv-kl-otvet a{color:#c04f40}
.mk-kv-kl-otvet[hidden]{display:none}

/* Плитка каталога: габарит и камень под именем модели. Строку дописывает
   mk-vitrina.js — в блочной витрине WooCommerce шаблонные хуки не работают. */
.mk-vit-stroka{font-size:13px;line-height:1.4;color:#7c8894;margin:4px 0 0}

/* Кнопка «человек рядом» в объёмном виде: мерка роста для понимания габарита. */
.mk-obyom-merka{display:block;margin:0 auto 8px;appearance:none;-webkit-appearance:none;
  font-family:inherit;font-size:13.5px;color:#233240;background:#fff;border:1px solid #e2e7ea;
  border-radius:10px;padding:7px 14px;cursor:pointer;transition:border-color .15s,background .15s}
.mk-obyom-merka:hover{border-color:#c04f40}
.mk-obyom-merka--vkl{border-color:#c04f40;background:#fdf6f5;box-shadow:inset 0 0 0 1px #c04f40}
.mk-obyom-merka:focus-visible{outline:2px solid #0c1f2f;outline-offset:2px}

/* Набросок надписи на камне. Не конструктор: один шрифт, портрет только
   рамкой. Введённое никуда не уходит — это имя умершего человека. */
.mk-nadpis-holst{display:block;width:100%;border-radius:10px;background:#f7f8f9}
.mk-nadpis-polya{display:flex;flex-direction:column;gap:8px;margin:12px 0 0}
.mk-nadpis-vvod{font-family:inherit;font-size:15px;color:#233240;background:#fff;
  border:1px solid #d7dce3;border-radius:10px;padding:10px 13px;resize:vertical}
.mk-nadpis-vvod::placeholder{color:#9aa6ae}
.mk-nadpis-vvod:focus-visible{outline:2px solid #0c1f2f;outline-offset:2px}
.mk-nadpis-portret{align-self:flex-start;appearance:none;-webkit-appearance:none;
  font-family:inherit;font-size:13.5px;color:#233240;background:#fff;
  border:1px solid #e2e7ea;border-radius:10px;padding:8px 14px;cursor:pointer}
.mk-nadpis-portret:hover{border-color:#c04f40}
.mk-nadpis-portret--vkl{border-color:#c04f40;background:#fdf6f5;box-shadow:inset 0 0 0 1px #c04f40}
.mk-nadpis-portret:focus-visible{outline:2px solid #0c1f2f;outline-offset:2px}
.mk-nadpis-snoska{font-size:13px;line-height:1.5;color:#7c8894;margin:10px 0 0}

/* Окно-справка «Какой размер выбрать». Приём взят у конкурента, содержание
   своё — из размерного ряда. Про полировку окна нет: у нас полируют всё. */
.mk-kv-spravka-vyzov{display:inline-block;margin:10px 0 0;appearance:none;-webkit-appearance:none;
  font-family:inherit;font-size:13.5px;color:#c04f40;background:none;border:0;padding:0;
  cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.mk-kv-spravka-vyzov:hover{color:#a8422f}
.mk-kv-spravka-vyzov:focus-visible{outline:2px solid #0c1f2f;outline-offset:2px}
/* margin:auto — штатный способ поставить dialog по центру экрана.
   Без него окно прижимается к левому верхнему углу (замер 11.09: 0, 0). */
.mk-kv-spravka{max-width:520px;width:calc(100% - 32px);margin:auto;border:1px solid #e2e7ea;
  border-radius:12px;padding:24px 26px 22px;color:#233240;background:#fff;
  max-height:calc(100vh - 48px);overflow:auto}
.mk-kv-spravka::backdrop{background:rgba(12,31,47,.45)}
.mk-kv-spravka-zag{font-size:19px;font-weight:700;color:#0c1f2f;margin:0 0 14px}
.mk-kv-spravka-spisok{margin:0}
.mk-kv-spravka-spisok dt{font-size:15px;font-weight:600;color:#0c1f2f;margin:14px 0 4px}
.mk-kv-spravka-spisok dd{font-size:14.5px;line-height:1.5;color:#41505c;margin:0}
.mk-kv-spravka-hvost{font-size:13.5px;line-height:1.5;color:#7c8894;margin:18px 0 0}
.mk-kv-spravka-zakryt{margin:18px 0 0;appearance:none;-webkit-appearance:none;font-family:inherit;
  font-size:15px;color:#fff;background:#c04f40;border:0;border-radius:8px;padding:11px 24px;cursor:pointer}
.mk-kv-spravka-zakryt:hover{background:#a8422f}

/* Ступень с ценой: размер крупно, цена этого размера под ним. */
.mk-kv-stupen b{display:block;font-size:14.5px;font-weight:700;color:#0c1f2f;line-height:1.2}
.mk-kv-stupen span{display:block;font-size:13px;color:#7c8894;margin-top:2px}
.mk-kv-stupen--vybrana span{color:#c04f40}

/* Под галереей: левая колонка не должна обрываться пустотой, пока справа
   идёт длинный текст. Только подтверждённые факты, без обещаний. */
.mk-kv-pod{margin:18px 0 0;border:1px solid #e2e7ea;border-radius:12px;background:#fff;
  overflow:hidden}
.mk-kv-pod-kus{padding:13px 16px 14px;border-top:1px solid #eef1f3}
.mk-kv-pod-kus:first-child{border-top:0}
.mk-kv-pod-kus b{display:block;font-size:14.5px;font-weight:600;color:#0c1f2f;line-height:1.3}
.mk-kv-pod-kus span{display:block;font-size:13px;line-height:1.5;color:#7c8894;margin-top:3px}
@media(max-width:760px){
  .mk-kv-pod{margin-top:14px}
  .mk-kv-pod-kus{padding:11px 14px 12px}
}

/* Вторая строка выбора — толщина стелы. Недоступная пара гасится, а не
   прячется: человек должен видеть, что у этого габарита её просто нет. */
.mk-kv-tolshchiny{align-items:center;margin-top:10px}
.mk-kv-tol-zag{font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;
  color:#7c8894;margin-right:4px}
.mk-kv-stupen[disabled]{opacity:.45;cursor:default}
.mk-kv-stupen[disabled]:hover{border-color:#e2e7ea}
.mk-kv-stupen--net{opacity:.6}

/* Описание модели на телефоне: карточками, а не сплошной стеной.
   На узком экране четыре блока подряд — «Форма», «На участке», «Размер»,
   «Камень» — сливались в один текст, и читать это было нечем
   (владелец 11.09: «нечитабельно, просто сплошной текст»). */
@media(max-width:760px){
  .kt-opis{gap:12px;margin:18px 0 22px}
  .kt-o-kus{padding:15px 16px 16px;border-top:0;border:1px solid #e2e7ea;
    border-radius:12px;background:#fff}
  .kt-o-kus:nth-child(even){background:#f7f8f9}
  .kt-tzag{font-size:11.5px;letter-spacing:.09em;color:#c04f40;margin:0 0 8px}
  .kt-opis p{font-size:15px;line-height:1.62}
  .kt-o-shir{padding:0;border:0;background:none}
  .kt-lid{font-size:15.5px;line-height:1.62;margin-bottom:18px}
  .kt-sosedi a{font-size:14px;padding:8px 13px}
}

/* ——— Карточка на телефоне (14.09.2026) ———————————————————————————————
   Владелец: «слишком неудобно читать, что-то не влезает». На 390 px было:
   четыре вкладки в две строки, чертёж высотой в полэкрана и кнопки размеров
   по три в ряд, из-за чего четвёртая висела одна. */
@media(max-width:520px){
  /* Вкладки — одной строкой. Четыре кнопки влезают, если ужать поля. */
  .mk-kv-vidy{gap:6px;flex-wrap:nowrap;margin-top:10px}
  .mk-kv-vid{flex:1 1 0;min-width:0;padding:9px 4px;font-size:13px;text-align:center}

  /* Чертёж ниже: по ширине он и так вписан, но по высоте занимал пол-экрана.
     Ограничиваем высоту — пропорции SVG сохраняются сами. */
  .mk-kv-chertezh-pole{min-height:0;padding:10px}
  /* Высота в точках, а не в vh: на телефоне адресная строка меняет vh на лету,
     и чертёж прыгал бы при прокрутке. */
  .mk-kv-chertezh-pole svg{max-height:300px;width:auto}

  /* Размеры — ровной сеткой по два, а не «три и один». */
  .mk-kv-stupeni{display:grid;grid-template-columns:1fr 1fr;gap:8px}
  .mk-kv-stupen{padding:9px 10px}
  .mk-kv-stupen b{font-size:14px}
  .mk-kv-stupen span{font-size:12.5px}

  /* Толщина — своей строкой, подпись над кнопками, а не сбоку. */
  .mk-kv-tolshchiny{grid-template-columns:1fr 1fr;margin-top:8px}
  .mk-kv-tol-zag{grid-column:1/-1;margin:2px 0 0}

  .mk-kv-sostav{font-size:13px}
  .mk-kv-snoska{font-size:12.5px}
  .mk-obyom-pod{font-size:12px}
}

/* ============================================================
   16.09.2026. Две правки по разбору «нужен ли редизайн»
   (thoughts/research/2026-09-16-nuzhen-li-redizayn-pamyatnikspb.md,
   пункты 1 и 5). План — plans/2026-09-16-shest-tochechnyh-pravok-pamyatnikspb.md.
   ============================================================ */

/* --- 1. Плашка про cookies компактнее ---------------------------------
   Замерено до правки: 184 точки на 390 — пятая часть экрана, и она
   накрывала кнопку под ценой на первом экране. С телефона приходит
   большинство заходов.

   Ничего не прячем: текст и ссылка на политику остаются целиком,
   уплотнены кегль, отступы и кнопка. Стало 125 точек (14 %).

   Селектор с `body` не для красоты: стили плашки тема печатает тегом
   <style> внутри страницы, и при равной силе побеждают они.
   `body #id` сильнее, чем `#id`, и перебивает без !important. */
body #kv-cookie-alert{padding:10px 12px;gap:8px;border-radius:2px;
  box-shadow:0 2px 14px rgba(20,32,46,.14)}
body #kv-cookie-alert p{font-size:12.5px;line-height:1.35;margin:0}
body #kv-cookie-alert button{height:34px;padding:0 18px;font-size:14px;
  border-radius:2px}
@media (max-width:600px){
  body #kv-cookie-alert{padding:8px 10px;gap:6px;bottom:0;left:0;right:0;
    width:auto;max-width:none;transform:none}
  body #kv-cookie-alert p{font-size:11px;line-height:1.3}
  body #kv-cookie-alert button{height:32px;padding:0 14px;font-size:13px}
}

/* --- 5. Заголовок первого экрана: с четырёх строк до трёх -------------
   Замерено до правки: 60 точек кегля в колонке 468 — четыре строки
   и 264 точки высоты на 1440; четыре строки на 390.

   Текст заголовка НЕ трогаем. Главная показывается по ценовым запросам
   («поставить памятник на могилу цена» — 14 показов, «стоимость
   изготовления памятника на могилу» — 11), и слова в H1 подобраны
   под них. Меняем только кегль.

   Селектор повторяет селектор темы из main.css
   (`header .header__main .main__content .content__inner h1`) и добавляет
   `body`: короче него не перебить.

   Стало: 1440 — три строки и 140 точек, 1920 — две строки и 102,
   390 — три строки и 102. */
body header .header__main .main__content .content__inner h1{
  font-size:48px;line-height:1.06}
@media (max-width:1780px){
  body header .header__main .main__content .content__inner h1{font-size:44px}}
@media (max-width:575px){
  body header .header__main .main__content .content__inner h1{
    font-size:31px;line-height:1.1}}

/* --- 4. Карточка «Что спросим на замере» на странице установки --------
   У .kl-sejchas список сделан под часы работы кладбища: две колонки,
   значение прижато вправо. Здесь в значении не «9:00–18:00», а фраза,
   поэтому колонка одна и текст идёт слева.
   16.09.2026, пункт 4 разбора. */
.kl-sejchas--shirokaya dl{grid-template-columns:1fr;gap:12px 0}
.kl-sejchas--shirokaya dt{font-size:14px;font-weight:700;color:#233240}
.kl-sejchas--shirokaya dd{text-align:left;font-size:13.5px;color:#5b6773;
  margin-top:1px;line-height:1.5}