/* Shell additions over the frozen v10 bundle: only what server markup needs. */

/* Reserve the page scrollbar width while any modal locks root scrolling. */
html{scrollbar-gutter:stable}

/* Cold cache: Arial is ~9% wider than Myriad, so the font swap re-wrapped the header (CLS, #398).
   A metric-matched fallback keeps line lengths equal before and after the swap. */
@font-face{font-family:"Starina Text Fallback";src:local("Arial");font-weight:400;size-adjust:92%}
@font-face{font-family:"Starina Text Fallback";src:local("Arial Bold"),local("Arial");font-weight:600 700;size-adjust:90%}
:root{--ds-type-family-sans:"Starina Text","Starina Text Fallback",Arial,sans-serif}

.starina-cookie-banner{position:fixed;z-index:55;right:max(.75rem,env(safe-area-inset-right));bottom:max(.75rem,env(safe-area-inset-bottom));left:max(.75rem,env(safe-area-inset-left));pointer-events:none}
.starina-cookie-banner__card{display:grid;grid-template-columns:2.5rem minmax(0,1fr) auto;gap:.75rem;align-items:center;width:min(100%,58rem);margin-inline:auto;padding:.75rem;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--surface);box-shadow:0 .75rem 2.5rem rgb(24 18 12 / .2);pointer-events:auto}
.starina-cookie-banner__icon{display:grid;place-items:center;width:2.5rem;height:2.5rem;border-radius:50%;background:var(--accent-soft);color:var(--accent-text)}
.starina-cookie-banner p{margin:0;color:var(--muted);font-size:.8125rem;line-height:1.4}
.starina-cookie-banner p a{color:var(--primary);font-weight:600;text-decoration:underline;text-underline-offset:3px}
.starina-cookie-banner__actions{display:flex;gap:.375rem}
.starina-cookie-banner__actions .button{min-width:3.25rem}
@media(max-width:620px){.starina-cookie-banner__card{grid-template-columns:2.25rem minmax(0,1fr);gap:.625rem;padding:.625rem}.starina-cookie-banner__icon{width:2.25rem;height:2.25rem}.starina-cookie-banner__actions{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr}.starina-cookie-banner__actions .button{width:100%}}

/* Keep the choice panel clear of the gallery thumbnails and the order action on product
   details: from 621px it sits bottom-right over the summary's lower part, and the
   «Связаться» launcher steps above it (contact-widget.js). Bottom-left covered the
   thumbnails on every desktop height (Павел, 01.10.2026). */
body.has-cookie-banner.single-product .starina-cookie-banner,
body.has-cookie-banner:has(.page.active[data-page="product"]) .starina-cookie-banner{left:max(.75rem,env(safe-area-inset-left));right:auto;width:min(28rem,calc(100vw - 1.5rem))}
body.has-cookie-banner.single-product .starina-cookie-banner__card,
body.has-cookie-banner:has(.page.active[data-page="product"]) .starina-cookie-banner__card{width:100%;margin:0;grid-template-columns:1.5rem minmax(0,1fr) auto;gap:.375rem;padding:.25rem}
body.has-cookie-banner.single-product .starina-cookie-banner__icon,
body.has-cookie-banner:has(.page.active[data-page="product"]) .starina-cookie-banner__icon{width:1.5rem;height:1.5rem}
body.has-cookie-banner.single-product .starina-cookie-banner p,
body.has-cookie-banner:has(.page.active[data-page="product"]) .starina-cookie-banner p{font-size:.75rem;line-height:1.2}
body.has-cookie-banner.single-product .starina-cookie-banner__actions,
body.has-cookie-banner:has(.page.active[data-page="product"]) .starina-cookie-banner__actions{grid-column:auto;display:flex;gap:.25rem}
body.has-cookie-banner.single-product .starina-cookie-banner__actions .button,
body.has-cookie-banner:has(.page.active[data-page="product"]) .starina-cookie-banner__actions .button{width:auto;min-width:2.75rem;min-height:2.5rem;padding:6px 8px}
@media(min-width:621px){
	body.has-cookie-banner.single-product .starina-cookie-banner,
	body.has-cookie-banner:has(.page.active[data-page="product"]) .starina-cookie-banner{left:auto;right:max(.75rem,env(safe-area-inset-right));width:min(28rem,calc(100vw - 16.25rem))}
}
@media(max-width:620px){
	body.has-cookie-banner.single-product .starina-cookie-banner,
	body.has-cookie-banner:has(.page.active[data-page="product"]) .starina-cookie-banner{left:max(.75rem,env(safe-area-inset-left));right:max(.75rem,env(safe-area-inset-right));width:auto}
}

/* Mobile accordion: tap targets from 44px (DESIGN-SYSTEM «Мобильное меню»). */
.shell-drawer summary,
.shell-drawer__quick a,
.shell-drawer__subnav > a,
.shell-drawer__category,
.shell-footer__group summary,
.shell-footer__group a {
	min-height: 44px;
	display: flex;
	align-items: center;
}
@media (min-width: 701px) {
	.shell-footer__group summary,
	.shell-footer__group a { min-height: 0; }
	.shell-footer__group summary { pointer-events: none; }
}

/* The mega-menu never widens the page. */
.shell-mega { max-width: calc(100vw - 2rem); }
html, body { overflow-x: clip; }

/* The frozen mockup hides /rooms and /business links, while WordPress uses
   /interer/ and /dlya-biznesa/. Hide the actual links before the menu collides. */
@media (max-width: 1180px) {
	.shell-nav-cluster--browse > a[href*="/dlya-biznesa/"] { display: none; }
}
@media (max-width: 1023px) {
	.shell-nav-cluster--browse > a[href*="/interer/"] { display: none; }
}
@media (min-width: 901px) and (max-width: 1020px) {
	.shell-header__nav { display: block; }
	.shell-menu-toggle { display: none; }
	.shell-header__cta .shell-callback { display: none; }
}

/* The promo has no editable image yet: the caption sits on a dark card instead of over a photo. */
.shell-mega-promo:not(:has(img)) { background: #2b2119; }
.shell-mega-promo:not(:has(img)) span { position: static; background: none; }

/* Kitchen cards must stay in reading order; CSS columns split them unevenly. */
.shell-mega .shell-catalog-tabpanel--kitchens > .shell-mega-grid {
	display: grid;
	columns: auto;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	align-items: start;
}
@media (max-width: 1180px) {
	.shell-mega .shell-catalog-tabpanel--kitchens > .shell-mega-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* CF7 order profile outside the inline v10 steps (shared dialog): step 1 chips and step navigation need order-steps.js, so the dialog shows the plain fields. */
.starina-form-dialog form [data-step="1"],.starina-form-dialog .order-nav [data-step-back],.starina-form-dialog .order-nav [data-step-next]{display:none}
.starina-form-dialog form fieldset[data-step]{margin:0;padding:0;border:0}
.full-order [data-order-files].is-enhanced .order-file{display:none}
.full-order .order-consent .wpcf7-list-item{display:block;margin:0}
.full-order .order-consent label{display:grid;grid-template-columns:24px 1fr;gap:var(--s2);align-items:start;font-size:.84rem;color:var(--muted)}
.full-order .order-nav .wpcf7-submit[hidden]{display:none}
.full-order .order-nav [data-step-next],.full-order .order-nav .wpcf7-submit{margin-left:auto}
.full-order .order-nav > br,.full-order fieldset > br{display:none}
/* Validation feedback stays in flow so messages cannot cover the next control. */
.full-order .wpcf7-form-control-wrap{position:relative;display:block}
.full-order .wpcf7-not-valid-tip{position:static;display:block;margin-top:2px;color:var(--danger);font-size:.8rem;line-height:1.3}
.full-order .order-field,.full-order .order-row{margin-bottom:1.25rem}
.full-order .order-consent .wpcf7-not-valid-tip{position:static}
.full-order .order-nav .wpcf7-submit{flex:0 0 auto;width:auto}
.full-order .order-nav .wpcf7-spinner{position:absolute;margin:0}
/* CF7 callback profile on the v10 .callback-form contract: consent row and CF7 wrappers. */
.callback-form .wpcf7-form-control-wrap{display:block}
.callback-form .wpcf7-acceptance .wpcf7-list-item{display:block;margin:0}
.callback-form .wpcf7-acceptance label{display:grid;grid-template-columns:24px 1fr;gap:var(--s2);align-items:start;min-height:44px;color:var(--muted);font-size:.84rem;font-weight:400;line-height:1.4;cursor:pointer}
.callback-form .wpcf7-acceptance input{width:24px;height:24px;margin:0;accent-color:var(--primary)}
.callback-form .wpcf7-acceptance a{text-decoration:underline;text-underline-offset:3px}
.callback-form input.wpcf7-submit{width:100%;min-height:48px;border:1px solid var(--primary);border-radius:var(--r-sm);background:var(--primary);color:var(--primary-ink);font:600 1rem var(--sans);cursor:pointer}
.callback-form input.wpcf7-submit:hover{filter:brightness(1.1)}
.callback-form .callback-status{min-height:1.3em;margin:0;color:var(--muted);font-size:.84rem;line-height:1.4}
.callback-form .wpcf7-spinner{position:absolute}
.full-order .order-native[hidden]{display:none}

/* Search (#318): a lightbox-style panel. The dialog fills the viewport, the close button sits above the panel, only the results scroll. */
html.is-search-open{overflow:hidden}
dialog.shell-search-dialog{width:100%;max-width:none;height:100dvh;max-height:none;margin:0;padding:4rem 1.5rem 1.5rem;box-sizing:border-box;border:0;background:transparent;overflow:visible}
dialog.shell-search-dialog[open]{display:flex;flex-direction:column;align-items:center}
dialog.shell-search-dialog .shell-search-dialog__card{display:flex;flex-direction:column;gap:1rem;box-sizing:border-box;width:100%;max-width:1200px;min-height:0;max-height:100%;overflow:hidden;padding:clamp(1rem,2.5vw,2rem)}
dialog.shell-search-dialog>.shell-search-dialog__close{position:absolute;top:.5rem;right:max(1rem,calc((100% - 1200px) / 2));width:var(--target,44px);height:var(--target,44px);border:1px solid var(--line);background:var(--surface);color:var(--ink);box-shadow:var(--shadow)}
dialog.shell-search-dialog>.shell-search-dialog__close:hover{border-color:var(--primary);background:var(--accent-soft)}
dialog.shell-search-dialog>.shell-search-dialog__close .shell-icon{width:1.5rem;height:1.5rem}
.shell-search-dialog__head{display:block;flex:none;padding:0}
dialog.shell-search-dialog .shell-search-dialog__bar{display:flex;align-items:center;box-sizing:border-box;width:100%;gap:.75rem;min-height:3.75rem;padding:.375rem .5rem .375rem 1.125rem;border:1px solid var(--outline);border-radius:var(--r-sm);background:var(--surface)}
dialog.shell-search-dialog .shell-search-dialog__bar>.shell-icon{width:1.5rem;height:1.5rem}
dialog.shell-search-dialog .shell-search-dialog__bar input{flex:1 1 auto;width:auto;min-width:0;min-height:3rem;padding:0;border:0;outline:0;background:transparent;font-size:1.25rem;box-shadow:none;text-align:left}
dialog.shell-search-dialog .shell-search-dialog__bar input::-webkit-search-cancel-button,dialog.shell-search-dialog .shell-search-dialog__bar input::-webkit-search-decoration{-webkit-appearance:none;appearance:none;display:none}
dialog.shell-search-dialog .shell-search-dialog__bar .button{display:inline-flex;flex:none;grid-column:auto;width:auto}
.shell-search-dialog__clear{display:grid;place-items:center;flex:none;width:44px;height:44px;padding:0;border:0;border-radius:50%;background:transparent;color:var(--muted)}
.shell-search-dialog__clear:hover{background:var(--surface-2);color:var(--ink)}
.shell-search-dialog__clear[hidden]{display:none}
dialog.shell-search-dialog .shell-search-tabs{display:flex;flex-direction:row;flex-wrap:nowrap;gap:.5rem;overflow-x:auto;flex:none;scrollbar-width:thin}
dialog.shell-search-dialog .shell-search-tabs[hidden]{display:none}
dialog.shell-search-dialog .shell-search-tab{flex:none;width:auto;min-height:44px;padding:0 1rem;border:1px solid var(--line);border-radius:999px;background:var(--surface);color:var(--ink);font:inherit;white-space:nowrap}
.shell-search-tab[aria-selected="true"]{border-color:var(--primary);background:var(--primary);color:var(--primary-contrast,#fff)}
.shell-search-status{flex:none;margin:0;color:var(--muted);font-size:.875rem}
.shell-search-status:empty{display:none}
dialog.shell-search-dialog .shell-search-suggestions{display:block;flex:1 1 auto;min-height:0;max-height:none;overflow-y:auto;overscroll-behavior:contain;padding-top:.25rem;border-top:1px solid var(--line)}
.shell-search-suggestions[aria-busy="true"]{opacity:.6}
.shell-search-suggestions .shell-search-group{display:block;margin:0 0 1.5rem}
.shell-search-suggestions .shell-search-group h3{margin:1rem 0 .75rem}
.shell-search-chips{display:flex;flex-wrap:wrap;align-content:flex-start;gap:.5rem}
.shell-search-chip{display:inline-flex;align-items:center;min-height:44px;padding:0 1rem;border:1px solid var(--line);border-radius:999px;background:var(--surface);color:var(--ink);text-decoration:none}
.shell-search-chip:hover,.shell-search-chip:focus-visible{border-color:var(--primary);background:var(--accent-soft)}
.shell-search-group__list{display:grid;grid-template-columns:repeat(auto-fill,minmax(20rem,1fr));gap:.5rem}
.shell-search-card{display:flex;flex-direction:row;align-items:center;gap:.75rem;min-width:0;min-height:44px;padding:.375rem .75rem .375rem .375rem;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--surface);color:var(--ink);text-decoration:none}
.shell-search-card:hover,.shell-search-card:focus-visible{border-color:var(--primary);background:var(--accent-soft)}
.shell-search-card img,.shell-search-card__thumb{display:block;flex:none;width:56px;height:56px;border-radius:var(--r-sm);object-fit:cover;background:var(--surface-2)}
.shell-search-card__info{display:grid;flex:1;align-content:center;gap:.125rem;min-width:0}
.shell-search-card__title{font-weight:600;line-height:1.3;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.shell-search-card small{color:var(--muted);font-size:.8125rem;line-height:1.35;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.shell-search-group--directions .shell-search-card{border-color:var(--primary)}
.shell-search-chips--suggest{margin:0 0 1rem}
.search-groups .shell-search-group{margin-bottom:2rem}
.search-groups .shell-search-group h2{margin:0 0 .75rem}
.shell-search-suggestions__all{display:inline-flex;align-items:center;min-height:44px;color:var(--primary);font-weight:600}
.shell-search-correction{margin:.75rem 0 0;color:var(--muted)}
.shell-search-correction__exact{min-height:44px;padding:0 .25rem;border:0;background:none;color:var(--primary);font:inherit;text-decoration:underline}
.shell-search-empty{display:grid;gap:.75rem;justify-items:start;max-width:40rem;padding:1.5rem 0}
.shell-search-empty b{font-size:1.125rem}
.shell-search-empty p{margin:0;color:var(--muted)}
@media(max-width:560px){dialog.shell-search-dialog{padding:3.5rem .5rem .5rem}dialog.shell-search-dialog .shell-search-dialog__card{max-height:none;flex:1 1 auto;padding:.75rem;border-radius:var(--r-md)}dialog.shell-search-dialog>.shell-search-dialog__close{right:.5rem}dialog.shell-search-dialog .shell-search-dialog__bar{min-height:3.25rem;padding-left:.75rem}dialog.shell-search-dialog .shell-search-dialog__bar input{font-size:1.0625rem}.shell-search-group__list{grid-template-columns:minmax(0,1fr)}dialog.shell-search-dialog .shell-search-dialog__bar .button{display:none}}
@media(prefers-reduced-motion:no-preference){dialog.shell-search-dialog[open]{animation:shell-search-in .18s ease-out}}
@keyframes shell-search-in{from{opacity:0;transform:translateY(.5rem)}to{opacity:1;transform:none}}
.shell-prefooter__avatar{display:grid;place-items:center;flex:none;width:3.5rem;height:3.5rem;overflow:hidden;border-radius:50%;background:var(--primary);color:var(--primary-ink);font:600 1rem/1 var(--sans)}
.shell-prefooter__avatar img{width:100%;height:100%;object-fit:cover;object-position:center 20%}
/* Портрет мастера в префутере крупнее: 6rem на ПК, 4.5rem на телефоне; подпись центрируется по аватару. */
.shell-prefooter__master{grid-template-columns:6rem auto;gap:1rem;padding:.625rem 1.75rem .625rem .625rem}
.shell-prefooter__avatar,.shell-prefooter__master img{width:6rem;height:6rem}
.shell-prefooter__avatar{font-size:1.75rem}
.shell-prefooter__master b{font-size:1.125rem}
@media(max-width:560px){.shell-prefooter__master{grid-template-columns:4.5rem auto;gap:.75rem;padding:.5rem 1.25rem .5rem .5rem}.shell-prefooter__avatar,.shell-prefooter__master img{width:4.5rem;height:4.5rem}.shell-prefooter__avatar{font-size:1.375rem}.shell-prefooter__master b{font-size:1rem}}
/* Профиль мастера: «Написал / Проверил / Кейсы» — вкладки дизайн-системы (.shell-catalog-tabs), без дублей. */
/* Внутри вкладки — группы по разделу (Новости / Журнал / Справочник), строки списка из masters.css в две колонки. */
.master-writings-tabs{margin-bottom:1.25rem}
.master-writings-group+.master-writings-group{margin-top:2rem}
.master-writings-group h3{margin:0 0 .5rem}
.master-writings{grid-template-columns:repeat(auto-fill,minmax(min(100%,22rem),1fr));column-gap:2rem;border-top:0}
/* Карточка кейса во вкладке: атрибут height у <img> не должен ломать 4:3 из masters.css. */
.master-case img{height:auto}

/* The child shell is packaged separately from the frozen prototype bundle.
   Keep the historical workshop grain beside this runtime stylesheet. */
.shell-prefooter__card,.info-faq-wrap,.section--grain{position:relative;isolation:isolate}
.info-faq-wrap::before,.section--grain::before{content:"";position:absolute;inset:0;z-index:-1;background:url("textures/wood-grain.svg?v=2") 0 0/240px 360px;opacity:.4;pointer-events:none}
.section--grain::before{opacity:.45}
/* #402: префутер — горизонтальная текстура без сучков. Переключатель: data-tex на .shell-prefooter
   (lines | waves | strokes; по умолчанию lines) или токен --starina-prefooter-tex в custom_css. */
.shell-prefooter{--starina-prefooter-tex:url("textures/prefooter-lines.svg?v=1");--starina-prefooter-size:480px 160px}
.shell-prefooter[data-tex="waves"]{--starina-prefooter-tex:url("textures/prefooter-waves.svg?v=1");--starina-prefooter-size:480px 160px}
.shell-prefooter[data-tex="strokes"]{--starina-prefooter-tex:url("textures/prefooter-strokes.svg?v=1");--starina-prefooter-size:320px 160px}
.shell-prefooter__card::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;background:var(--starina-prefooter-tex) 0 0/var(--starina-prefooter-size);pointer-events:none}
.product-master__avatar{display:grid;place-items:center;flex:none;width:64px;height:64px;border-radius:50%;background:var(--surface-2);color:var(--accent-text);font:600 1.25rem/1 var(--sans)}

.catalog-text-after{padding-block:clamp(1.5rem,3vw,2.5rem)}
.catalog-text-after .prose{max-width:none}
.catalog-layout:has(+ .catalog-text-after){padding-bottom:0}
/* Category without filter groups (only one value everywhere): no empty sheet or side column, the sort stays. */
.catalog-layout.catalog-layout--no-filters{grid-template-columns:minmax(0,1fr)}
/* Without the 15.5rem side column two cards would grow to ~650px: one more column keeps the card size of other categories. */
@media(min-width:1280px){[data-page="catalog"] .catalog-layout.catalog-layout--no-filters .product-grid{grid-template-columns:repeat(calc(var(--catalog-cols, 2) + 1),minmax(0,1fr))}}
.catalog-mobilebar.catalog-mobilebar--sort-only{grid-template-columns:minmax(0,1fr)}
@media(max-width:480px){.catalog-mobilebar--sort-only .catalog-mobilebar__sort{display:block}}
.catalog-text-after .prose>:first-child{margin-top:0}

/* Catalogue: two cards per row (the four/three-up grids cropped and shrank the
   solid-wood photography). Photo frame is fixed 4/3 with object-fit: contain, so
   portrait and landscape shots both show whole; one column only on phones. */
[data-page="catalog"] .catalog-layout .product-grid { grid-template-columns: repeat(var(--catalog-cols, 2), minmax(0, 1fr)); gap: 1.25rem; }
/* Columns come from Pavo settings → Каталог (inline :root vars); the fallbacks are the approved look. */
@media (max-width: 1279px) {
	[data-page="catalog"] .catalog-layout .product-grid { grid-template-columns: repeat(var(--catalog-cols-tablet, 2), minmax(0, 1fr)); }
}
@media (max-width: 640px) {
	[data-page="catalog"] .catalog-layout .product-grid { grid-template-columns: repeat(var(--catalog-cols-mobile, 1), minmax(0, 1fr)); }
}
.product-card--wide .product-card__image { aspect-ratio: 4 / 3; background: var(--surface-2); overflow: hidden; }
.product-card--wide .product-card__image > a { display: block; width: 100%; height: 100%; }
.product-card--wide .product-card__image img { width: 100%; height: 100%; aspect-ratio: auto; object-fit: contain; }
.product-card--wide .product-card__image img:not([src]) { visibility: hidden; }
.product-card--wide .product-card__image--missing { height: 100%; aspect-ratio: auto; }
.product-card__track { display: flex; width: 100%; height: 100%; overflow: hidden; }
.product-card__track > img { flex: 0 0 100%; min-width: 0; }
.product-card__image--gallery.is-ready .product-card__track { overflow-x: auto; scroll-snap-type: x mandatory; overscroll-behavior-x: contain; scrollbar-width: none; }
.product-card__image--gallery.is-ready .product-card__track::-webkit-scrollbar { display: none; }
.product-card__image--gallery.is-ready .product-card__track > img { scroll-snap-align: start; scroll-snap-stop: always; }
.product-card__dots, .product-card__nav { display: none; }
.product-card__image--gallery.is-ready .product-card__dots { position: absolute; z-index: 2; left: 50%; bottom: .5rem; display: flex; gap: 0; transform: translateX(-50%); padding: 0 .25rem; border-radius: 999px; background: rgb(255 255 255 / .85); }
.product-card__dots button { position: relative; width: 1.5rem; height: 1.5rem; padding: 0; border: 0; background: none; }
.product-card__dots button::before { content: ""; position: absolute; inset: 0; margin: auto; width: .5rem; height: .5rem; border-radius: 50%; background: var(--outline, #8b8478); opacity: .55; }
.product-card__dots button[aria-current="true"]::before { background: var(--primary); opacity: 1; }
.product-card__dots button:focus-visible, .product-card__nav:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }
@media (hover: hover) and (pointer: fine) {
	.product-card__image--gallery.is-ready .product-card__nav { position: absolute; z-index: 2; top: 50%; display: block; width: 2.5rem; height: 2.5rem; margin-top: -1.25rem; border: 1px solid var(--line); border-radius: 50%; background: rgb(255 255 255 / .92); color: var(--ink); opacity: 0; transition: opacity var(--motion-fast) var(--ease); }
	.product-card__nav::before { content: ""; display: block; width: 24px; height: 24px; margin: auto; background: currentColor; -webkit-mask: var(--nav-icon) center/contain no-repeat; mask: var(--nav-icon) center/contain no-repeat; }
	.product-card__nav--prev { left: .5rem; --nav-icon: url("design-system/assets/icons/chevron_left.svg"); }
	.product-card__nav--next { right: .5rem; --nav-icon: url("design-system/assets/icons/chevron_right.svg"); }
	.product-card__image--gallery.is-ready:hover .product-card__nav, .product-card__image--gallery.is-ready:focus-within .product-card__nav { opacity: 1; }
}
[data-page="catalog"] .product-card--wide .product-card__body { display: grid; justify-items: start; text-align: left; grid-template-columns: minmax(0, 1fr) auto; align-content: start; align-items: center; column-gap: 1rem; row-gap: .625rem; }
[data-page="catalog"] .product-card--wide .product-card__body > small, [data-page="catalog"] .product-card--wide .product-card__body > :is(h2, h3), .product-card--wide .product-card__meta, [data-page="catalog"] .product-card--wide .product-card__actions { grid-column: 1 / -1; justify-self: stretch; }
[data-page="catalog"] .product-card--wide .product-card__price { margin-top: 0; grid-column: 1; }
.product-card--wide .product-quantity { grid-column: 2; justify-self: end; }
.product-card--wide .product-card__meta div { grid-template-columns: 5.5rem minmax(0, 1fr); }
[data-page="catalog"] .product-card--wide .product-card__price { white-space: nowrap; }
/* Narrow cards (sidebar layouts below 1280, phones): price and quantity stack. */
@media (max-width: 1279px) {
	[data-page="catalog"] .product-card--wide .product-card__body { grid-template-columns: minmax(0, 1fr); }
	.product-card--wide .product-quantity { grid-column: 1; justify-self: start; }
}
@media (min-width: 641px) and (max-width: 1279px) { .product-card--wide .product-card__body { padding: var(--s3, 1rem); } }
[data-page="catalog"] .product-card__body { display: flex; flex-direction: column; }
[data-page="catalog"] .product-card__price { margin-top: auto; }
[data-page="catalog"] .product-card__actions { margin-top: 0; }
.product-card__tags { position: absolute; z-index: 2; top: .625rem; left: .625rem; display: flex; flex-wrap: wrap; gap: .25rem; max-width: calc(100% - 4.5rem); pointer-events: none; }
.product-card__tags { max-height: 3.05rem; overflow: hidden; align-content: flex-start; }
.product-card__tags span { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding: .25rem .5rem; border: 1px solid rgb(255 255 255 / .8); border-radius: 999px; background: rgb(255 255 255 / .94); color: var(--ink); font: 600 .75rem/1.2 var(--sans); }
.product-card__tags [data-style="light-outline"] { border-color: var(--muted); }
.product-card__tags [data-style="accent"] { border-color: var(--accent); background: var(--accent); }
.product-card__tags [data-style="accent-outline"] { border-color: var(--accent); }
.product-card__tags [data-style="dark"] { border-color: var(--primary); background: var(--primary); color: var(--primary-ink); }
.product-card__tags [data-style="success"] { border-color: var(--success); background: var(--success); color: var(--primary-ink); }
.product-card__tags [data-style="danger"] { border-color: var(--danger); background: var(--danger); color: var(--primary-ink); }
.product-card__tags [data-style="brown"] { border-color: var(--approved-marker); background: var(--approved-marker); color: var(--primary-ink); }

/* Keep the shared breadcrumb trail readable without changing its hierarchy. */
.page .crumbs { font-size: 1rem; font-weight: 500; }
.page .crumbs > * { min-height: 40px; }
.page .crumbs > a:first-child::before { width: 1.125rem; height: 1.125rem; }
.crumbs > a:first-child { min-width: 1.5rem; }
.page .crumbs > * + *::before { border-width: 2px; opacity: .75; }
.page .crumbs [aria-current="page"] { font-weight: 600; }
@media (max-width: 560px) {
	.page .crumbs { font-size: .875rem; }
}
/*
 * Новость, журнал, справочник, кейс (≤768): крошки в одну строку, текущая
 * страница обрезается многоточием (как в категории каталога, filters.css) —
 * H1 ниже её повторяет. Одна строка при любом шрифте заодно держит CLS кейса
 * (раньше название переносилось на свою строку, flex-basis: 100%).
 */
@media (max-width: 768px) {
	.page :is(.article-layout > article.prose, .portfolio-case__head) > .crumbs { flex-wrap: nowrap; }
	.page :is(.article-layout > article.prose, .portfolio-case__head) > .crumbs > a { flex: none; }
	.page :is(.article-layout > article.prose, .portfolio-case__head) > .crumbs > [aria-current="page"] { display: block; flex: 0 1 auto; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; line-height: 40px; }
	.page :is(.article-layout > article.prose, .portfolio-case__head) > .crumbs > [aria-current="page"]::before { display: inline-block; vertical-align: middle; }
}

/* paginate_links() renders page-numbers, not the mockup's .button class. */
.catalog-pagination { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: .5rem; margin-top: 2.5rem; }
.catalog-pagination .page-numbers { display: inline-grid; place-items: center; min-width: 3.5rem; min-height: 3.5rem; padding: .625rem .875rem; border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--surface); color: var(--ink); font: 600 1.0625rem/1.2 var(--sans); text-decoration: none; }
.catalog-pagination a.page-numbers:hover { border-color: var(--primary); background: var(--surface-2); }
.catalog-pagination .page-numbers.current { border-color: var(--primary); background: var(--primary); color: var(--primary-ink); }
.catalog-pagination .page-numbers.dots { min-width: 1.5rem; padding-inline: 0; border: 0; background: transparent; }
.catalog-pagination .page-numbers.prev,.catalog-pagination .page-numbers.next { padding-inline: 1rem; }
.catalog-pagination .page-numbers.is-disabled { color: #6b6966; background: transparent; }
@media (max-width: 560px) {
	.catalog-pagination { gap: .375rem; }
	.catalog-pagination .page-numbers { min-width: 2.5rem; min-height: 2.75rem; padding: .5rem; font-size: .875rem; }
}

/* Keep the full filter list in page flow; only the action footer follows the viewport. */
@media (min-width: 901px) {
	.catalog-layout .filters { display: flex; position: relative; top: auto; max-height: none; overflow: visible; padding: 0; }
	.catalog-layout .filters__head { flex: none; padding: 1rem 1rem .875rem; }
	.catalog-layout .filters__body { flex: none; min-height: auto; max-height: none; overflow: visible; padding: 0 1rem; }
	.catalog-layout .filters__foot { position: sticky; top: calc(100vh - 9rem - var(--catalog-filter-footer-bottom, 0px)); bottom: var(--catalog-filter-footer-bottom, 0px); z-index: 2; flex: none; box-shadow: 0 -8px 18px rgb(24 18 12 / .08); }
}
.catalog-layout .product-card__body h2 { font-size: 1.34rem; }
.filters .filter-group { display: block; padding: .875rem 0; border-top: 1px solid var(--line); }
.filters .filter-group h3 { display: flex; align-items: center; justify-content: space-between; gap: .5rem; margin: 0 0 .5rem; font: 600 .9375rem/1.3 var(--sans); }
.filters .filter-group h3 b { display: inline-grid; place-items: center; min-width:1.25rem; height:1.25rem; border-radius:50%; background:var(--accent-soft); color:var(--accent-text); font-size:.7rem; }
.filters__fallback-select { display: grid; gap: .35rem; color: var(--muted); font-size: .8125rem; }
.filters__fallback-select select { width: 100%; min-height: 2.75rem; padding: .5rem .75rem; border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--surface); color: var(--ink); font: 500 .9375rem/1.3 var(--sans); }
.filters .filters__options { display: grid; gap: .125rem; }
.filters .filters__options label { display: grid; grid-template-columns: 18px minmax(0,1fr) auto; align-items: center; gap: .5rem; min-height: 36px; padding: .375rem .5rem; border: 1px solid transparent; border-radius: var(--r-sm); font-size: .8125rem; line-height: 1.3; cursor: pointer; transition: background-color var(--motion-fast) var(--ease), border-color var(--motion-fast) var(--ease), color var(--motion-fast) var(--ease); }
.filters .filters__options label:has(input:checked) { border-color: var(--line); border-radius: var(--r-sm); background: var(--surface-2); }
.filters .filters__options label:has(input:focus-visible) { border-color: var(--focus); border-radius: var(--r-sm); box-shadow: 0 0 0 2px var(--focus); }
.filters .filters__options input { width: 18px; height: 18px; min-height: 18px; margin: 0; accent-color: var(--primary); }
.filters .filters__options small { color: var(--muted); font-size: .75rem; }
.catalog-intersections { margin: .75rem auto 1.5rem; }
.catalog-intersections > b { display: block; margin-bottom: .5rem; color: var(--muted); font-size: .8125rem; text-transform: uppercase; letter-spacing: .07em; }
.catalog-intersections > div { display: flex; flex-wrap: wrap; gap: .5rem; }
.catalog-intersections .chip { display: inline-flex; align-items: center; gap: .375rem; min-height: 2.5rem; padding: .4rem .875rem; color: var(--ink); text-decoration: none; }
.catalog-intersections .chip span { color: var(--muted); font-size: .8rem; }
.catalog-intersections .chip.is-selected { border-color: var(--primary); background: var(--primary); color: var(--primary-ink); }
.catalog-intersections .chip.is-selected span { color: inherit; }
.catalog-landing-links { display: grid; gap: .625rem; margin: 0 0 1.25rem; padding: 1rem 1.125rem; border: 1px solid var(--line); border-radius: var(--r); background: var(--surface-2); }
.catalog-landing-links h2 { margin: 0; font-size: clamp(1.2rem, 2vw, 1.5rem); }
.catalog-landing-links__lead { margin: 0; max-width: var(--prose); color: var(--muted); }
.catalog-landing-links .chips { display: flex; flex-wrap: wrap; gap: .5rem; }
.catalog-landing-links .chip { display: inline-flex; align-items: center; gap: .375rem; min-height: 2.5rem; padding: .375rem .875rem; color: var(--ink); text-decoration: none; }
.catalog-landing-links .chip span { color: var(--muted); font-size: .8rem; }
.catalog-landing-links span.chip[aria-current="page"] { cursor: default; }
@media (max-width: 700px) { .catalog-landing-links { padding: .875rem; } .catalog-landing-links .chip { min-height: 2.25rem; } }
/* The Woo catalog does not enqueue client-pages.css. Give secondary section
   cards enough room for long Russian names in the shell loaded on every route. */
@media (min-width: 701px) {
	.catalog-hub__group:not(:first-child) .catalog-hub__grid,
	.category-navigation .catalog-hub__grid { grid-template-columns: repeat(auto-fill, minmax(min(100%, 19rem), 1fr)); }
}
.catalog-hub .hub-tile__main,.catalog-hub .hub-tile__text { min-width: 0; }
.catalog-hub .hub-tile__text b,.catalog-hub .hub-tile__links a { overflow-wrap: anywhere; }
.catalog-hub .hub-tile__links a { max-width: 100%; }
.catalog-hub .hub-tile__links a span { white-space: nowrap; }
.filters__price-range { display: grid; gap: .625rem; }
.filters__price-pill { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); min-width: 0; margin: 0; padding: 0; overflow: hidden; border: 1px solid var(--line); border-radius: var(--r-xs); background: var(--surface); }
.filters__price-pill label { display: grid; grid-template-columns: auto minmax(0,1fr); align-items: center; gap: .375rem; min-width: 0; min-height: 42px; padding: .5rem .625rem; color: var(--muted); font: 500 .875rem/1.2 var(--sans); }
.filters__price-pill label + label { border-left: 1px solid var(--line); }
.filters__price-pill input { width: 100%; min-width: 0; min-height: 0; margin: 0; padding: 0; border: 0; outline: 0; appearance: textfield; background: transparent; color: var(--ink); font: 600 .875rem/1.2 var(--sans); }
.filters__price-pill input::-webkit-inner-spin-button,.filters__price-pill input::-webkit-outer-spin-button { margin: 0; appearance: none; }
.filters__price-pill input::placeholder { color: var(--muted); opacity: 1; }
.filters__price-pill label:focus-within { background: var(--accent-soft); }
.filters__price-pill input:focus-visible { outline: 2px solid var(--focus); outline-offset: 4px; border-radius: 2px; }
.filters .filters__quote { display: grid; grid-template-columns: 18px minmax(0,1fr); gap: .5rem; align-items: start; min-height: 32px; margin-top: .25rem; font-size: .8125rem; line-height: 1.3; cursor: pointer; }
.filters__quote input { width: 18px; height: 18px; margin: 0; accent-color: var(--primary); }
.filters__foot { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: .5rem; padding: .75rem; border-top: 1px solid var(--line); background: var(--surface); }
.filters__pending { grid-column: 1; margin: 0; color: var(--muted); font-size: .8125rem; line-height: 1.35; }
.filters__count-retry { display: inline-flex; align-items: center; min-height: 2.75rem; margin-left: .375rem; padding: 0 .375rem; border: 0; border-radius: var(--r-xs); background: transparent; color: var(--primary); font: 600 .8125rem/1.2 var(--sans); text-decoration: underline; text-underline-offset: .15em; cursor: pointer; }
.filters__foot .filter-show { min-height: 44px; }
.filters__pending:empty { display: none; }
.filters__foot .filters__reset { grid-column: 1 / -1; justify-self: start; }
.filters__foot .filters__reset[hidden] { display: none; }
.catalog-sort { display: inline-flex; align-items: center; min-height: 2.75rem; padding: .25rem .375rem; border: 1px solid var(--line); border-radius: 999px; background: var(--surface); }
.catalog-sort select { width: 10rem; max-width: calc(100vw - 6rem); min-height: 2.25rem; padding: .25rem 1.5rem .25rem .5rem; border: 0; background-color: transparent; color: var(--ink); font-size: .875rem; font-weight: 600; }
.filters__options label:has(input:focus-visible) { outline: 0; }
main#main[data-listing-loading]::before { content: ""; position: fixed; z-index: 999; top: 0; left: 0; width: 100%; height: 3px; background: var(--accent); transform-origin: left; animation: listing-progress 1s ease-in-out infinite alternate; }
@keyframes listing-progress { from { transform: scaleX(.15); } to { transform: scaleX(.9); } }
main#main[data-listing-loading] .catalog-main { opacity: .55; transition: opacity .15s; pointer-events: none; }
.quick-order[aria-busy="true"] { opacity: .65; cursor: progress; }
/* Spinner over the reloading region: veil + ring centred in the viewport part of the region. */
.listing-busy-host { position: relative; }
.listing-busy { position: absolute; inset: 0; z-index: 20; background: color-mix(in srgb, var(--surface) 70%, transparent); cursor: progress; }
.listing-busy__ring { position: sticky; top: calc(50vh - 1.5rem); display: block; width: 3rem; height: 3rem; margin: 0 auto; box-sizing: border-box; border: 3px solid var(--accent-soft); border-top-color: var(--accent); border-radius: 50%; animation: listing-spin .8s linear infinite; }
.listing-busy__text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
main#main[data-listing-loading]:has(.listing-busy)::before { display: none; }
main#main[data-listing-loading] .price-from__grid { pointer-events: none; opacity: .7; }
@keyframes listing-spin { to { transform: rotate(360deg); } }
@keyframes listing-pulse { from { opacity: .45; } to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) { main#main[data-listing-loading]::before { animation: none; } .listing-busy__ring { animation: listing-pulse 1.2s ease-in-out infinite alternate; border-color: var(--accent); } }
@media (prefers-reduced-motion: reduce) and (update: none) { .listing-busy__ring { animation: none; } }

/* Keep direct manipulation clear without adding a JavaScript animation layer. */
.product-gallery > div > button {
	border-color: transparent;
	transition: border-color var(--motion-fast) var(--ease), background-color var(--motion-fast) var(--ease), transform var(--motion-fast) var(--ease);
}
.product-gallery > div > button[aria-pressed="true"] { border-color: var(--primary); }
.product-gallery > div > button:focus-visible {
	outline: 3px solid var(--focus);
	outline-offset: 3px;
	border-color: var(--primary);
}
.product-zoom { transition: box-shadow var(--motion-fast) var(--ease), background-color var(--motion-fast) var(--ease); }
.product-zoom:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }
.filters .filters__options label,
.filters .filters__quote {
	border-radius: var(--r-xs);
	transition: background-color var(--motion-fast) var(--ease), color var(--motion-fast) var(--ease);
}
.filters .filters__options label:focus-within,
.filters .filters__quote:focus-within { outline: 0; }
@media (hover: hover) {
	.product-gallery > div > button:hover { border-color: var(--outline); background: var(--surface-2); }
	.filters .filters__options label:hover,
	.filters .filters__quote:hover { background: var(--surface-2); }
}
@media (prefers-reduced-motion: no-preference) {
	.product-gallery > div > button:hover { transform: translateY(-2px); }
	.shell-nav-details[open] > .shell-nav-popover { animation: shell-popover-in var(--motion-fast) var(--ease) both; }
}
@keyframes shell-popover-in {
	from { opacity: 0; transform: translateY(-4px); }
	to { opacity: 1; transform: translateY(0); }
}

/* Legal copy remains readable and below the footer links at every width. */
.shell-footer__legal{padding-top:1rem;padding-bottom:2rem;color:#c8c6c2;font-size:.8125rem;line-height:1.6}
.shell-footer__legal p{max-width:none;width:auto;margin:0 0 .75rem}
.shell-footer__legal p:last-child{margin-bottom:0}

/* Route-backed selections should read as selected just like explicit facets. */
.catalog-landing-links .chip.is-selected{background:var(--primary);border-color:var(--primary);color:var(--primary-ink)}
/* #731: count and close icon on the dark selected chip use on-primary ink (~10:1), hover darkens like primary buttons. */
.catalog-landing-links .chip.is-selected span{color:inherit}
.catalog-landing-links .chip.is-selected:hover{background:var(--primary-hover);border-color:var(--primary-hover)}
/* Header logo = vector lettering + WebP mark of one box (view.php starina_render_brand): the SVG's own proportions, not the file's rounded ones. */
.shell-header .shell-brand{position:relative}
@media(min-width:1181px){.shell-header .shell-brand{width:clamp(275px,23vw,338px)}}.shell-header .shell-brand img{aspect-ratio:338.3/90}.shell-header .shell-brand img+img{position:absolute;top:0;left:0}
/* Give the mobile brand the remaining width without shrinking44px tools. */
@media(max-width:1020px){.shell-header .shell-brand{width:clamp(175px,calc(100vw - 180px),290px);max-width:calc(100vw - 168px)}.shell-header__tools{flex-shrink:0}.shell-header__top-inner{column-gap:8px}}

.shell-prefooter__socials{margin-block:1rem;flex-wrap:wrap}

/* Shared table surface across imported pages, editorial content and products. */
main :is(.table-scroll,.content-table-wrap):has(>table){min-width:0;max-width:100%;overflow-x:auto;overscroll-behavior-inline:contain;border:1px solid #cfc8bb;border-radius:14px;background:var(--surface,#fff);box-shadow:0 2px 8px rgb(36 24 15 / .035)}
main table{width:100%;border-collapse:separate;border-spacing:0;background:var(--surface,#fff);border:1px solid #cfc8bb;border-radius:14px}
main :is(.table-scroll,.content-table-wrap)>table{margin:0;border:0;border-radius:0}
main table :is(th,td){padding:1rem 1.125rem;border:0;border-bottom:1px solid #ddd7cc;vertical-align:top}
main table thead th{background:#e8e3d8;color:var(--ink,#251d17);font-weight:600}
main table tbody tr{background:var(--surface,#fff)}
main table tbody tr:nth-child(even){background:#f7f5ef}
main table tbody tr:last-child>:is(th,td){border-bottom:0}
main table tbody th{font-weight:600}
main table tr.is-on{background:#eee0c9}
main table>thead:first-child>tr:first-child>th:first-child{border-top-left-radius:13px}
main table>thead:first-child>tr:first-child>th:last-child{border-top-right-radius:13px}
main table>tbody:last-child>tr:last-child>:first-child{border-bottom-left-radius:13px}
main table>tbody:last-child>tr:last-child>:last-child{border-bottom-right-radius:13px}
@media(max-width:600px){main table :is(th,td){padding:.75rem .875rem}}

.contact-details__socials{display:flex;flex-wrap:wrap;gap:.5rem;margin:1rem 0}

/* The slider footer link must not inherit animated underline backgrounds. */
.hero-slider__meta .hero-slider__works{flex:0 0 auto;white-space:nowrap;min-height:44px;padding:.5rem .125rem;background:none;border:0;line-height:1.4;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px;transition:color var(--motion-fast) var(--ease)}
.hero-slider__meta .hero-slider__works:is(:hover,:focus-visible){background:none;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px;transform:none;color:var(--ink)}
.hero-slider__meta .hero-slider__works:focus-visible{outline:2px solid var(--focus);outline-offset:3px}

.full-order>header{margin-bottom:1.75rem}
.full-order .order-consent{margin:1.5rem 0}
.full-order .order-consent label{font-weight:400;line-height:1.5;gap:.75rem;min-height:44px;align-items:start}
.full-order .order-consent input[type=checkbox]{width:22px;height:22px;margin:0}
.full-order .order-consent .wpcf7-list-item-label{padding-top:1px}
.full-order .order-photo{padding:1rem;border:1px dashed var(--outline);border-radius:12px;background:var(--surface-2)}
.starina-form-dialog .order-photo{display:none}
/* Vacancies hub: resume field of the application form (prefooter) looks like the order photo field; the modal form has no resume. */
.shell-prefooter .vacancy-resume{position:relative;padding:1rem;border:1px dashed var(--outline);border-radius:12px;background:var(--surface-2)}
.starina-form-dialog .vacancy-resume{display:none}
/* Hero «Откликнуться» scrolls to the prefooter form: stop below the sticky header. */
.shell-prefooter{scroll-margin-top:10rem}
@media(max-width:600px){.shell-prefooter{scroll-margin-top:6rem}}
/* Форма заказа на странице услуги: две колонки на ПК (контакты 40% слева, форма 60% справа); на телефоне форма первой, контакты ниже. */
.full-order .order-split{display:grid;gap:clamp(1.5rem,3vw,3rem);align-items:stretch}
.full-order .order-split__form,.full-order .order-split__contact{min-width:0}
.full-order .order-split__contact{display:grid;align-content:center;justify-items:start;gap:.25rem;padding:clamp(1.25rem,2.5vw,2rem);border-radius:var(--r-md);background:var(--surface-2)}
.full-order .order-split__contact h3{margin:0;font:400 clamp(1.25rem,1.8vw,1.5rem)/1.25 var(--display)}
.full-order .order-split__contact>p{margin:0;color:var(--muted)}
.full-order .order-split__contact .shell-prefooter__master{margin-top:1rem}
.full-order .order-split__contact .social-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%}
.full-order .order-split__contact .shell-prefooter__links{margin-top:0;width:100%}
@media(min-width:1024px){.full-order .order-split{grid-template-columns:minmax(0,2fr) minmax(0,3fr)}.full-order .order-split__contact{order:-1}.full-order .order-split__form>header{max-width:none}}
/* Отправка формы заказа — главное действие страницы: оранжевый акцент (как .button--accent). */
.full-order .callback-form input.wpcf7-submit{border-color:var(--accent);background:var(--accent);color:var(--ink);font-weight:700}
.full-order .callback-form input.wpcf7-submit:hover{border-color:color-mix(in srgb,var(--accent) 88%,#000);background:color-mix(in srgb,var(--accent) 88%,#000);filter:none}
/* Поле файла: нативный ввод скрыт, вместо него ghost-кнопка дизайн-системы (forms.js). */
.full-order .order-photo{position:relative}
.starina-file-input{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.starina-file-pick{justify-self:start;width:auto}

/* Mobile drawer: thin sticky head → three actions in one row → quick links → accordions → contacts.
   The whole panel is one scroll: an open «Каталог» used to get ~30% of the screen in a nested
   scroller under phones, hours and messengers (Павел, 01.10.2026). */
.shell-drawer__quick { margin-bottom: 8px; }
.shell-drawer__links a.shell-drawer__all { justify-content: center; margin-top: 12px; border: 1px solid var(--outline, var(--line)); border-radius: 999px; }
/* Drawer heart = the header heart: filled glyph with the count centred inside it (was an outline heart plus a separate pill — Павел, 09.10.2026).
   Селектор с запасом по специфичности: правило `.shell-drawer .shell-drawer__actions .button` иначе возвращает flex и счётчик уезжает вбок. */
.shell-drawer .shell-drawer__actions .button.shell-drawer__favorites { display: inline-grid; place-items: center; min-width: 3.25rem; gap: 0; }
.shell-drawer .shell-drawer__actions .button.shell-drawer__favorites > * { grid-area: 1 / 1; }
.shell-drawer .shell-drawer__actions .button.shell-drawer__favorites .shell-icon { width: 1.75rem; height: 1.75rem; }
.shell-drawer .shell-drawer__actions .button.shell-drawer__favorites:has(b:not([hidden])) .shell-icon--favorite_border { background: var(--approved-marker); -webkit-mask-image: url("design-system/assets/icons/favorite-filled.svg"); mask-image: url("design-system/assets/icons/favorite-filled.svg"); }
.shell-drawer .shell-drawer__actions .button.shell-drawer__favorites b { min-width: 0; padding: 0; border-radius: 0; background: none; color: #fff; font: 700 .6875rem/1 var(--sans); transform: translateY(-6%); pointer-events: none; }
.shell-drawer__panel { overflow-y: auto; overscroll-behavior: contain; }
.shell-drawer__head { position: sticky; top: 0; z-index: 1; padding-block: 10px; background: var(--surface); }
.shell-drawer .shell-drawer__actions { display: grid; grid-template-columns: 1fr 1fr auto; flex: none; gap: 8px; margin: 0; padding: 12px 20px 4px; border: 0; }
.shell-drawer__actions .button { display: inline-flex; align-items: center; justify-content: center; gap: 6px; width: auto; min-width: 0; margin: 0; padding-inline: 10px; white-space: nowrap; }
.shell-drawer__links { flex: none; overflow: visible; }
.shell-drawer .shell-drawer__contacts { display: grid; flex: none; gap: 6px; margin: 0; padding: 16px 20px calc(20px + env(safe-area-inset-bottom)); border-top: 1px solid var(--line); background: none; font-size: .8125rem; }
.shell-drawer .shell-drawer__contacts > div { display: flex; flex-wrap: wrap; column-gap: 16px; }
.shell-drawer .shell-drawer__contacts > div a { display: inline-flex; align-items: center; min-height: 44px; padding: 0; border: 0; background: none; font-size: .9375rem; }
.shell-drawer .shell-drawer__contacts > span { display: block; text-align: left; }
.shell-drawer__contacts .social-links { gap: .25rem; margin-top: .25rem; }
.shell-drawer__contacts .social-link { min-height: 2.75rem; padding-right: .625rem; font-size: .75rem; }

/* Header favourites heart: larger glyph, 44px touch area kept. */
.shell-favorite-toggle b { font-size: .75rem; }

/* Подпись таблицы (<caption>) — отдельным заголовком над таблицей, а не строкой внутри рамки (Павел 29.09).
   Рамку переносим с обёртки на саму таблицу, чтобы заголовок оказался снаружи. */
.table-scroll:has(> table > caption) { border: 0; background: none; box-shadow: none; overflow-x: auto; }
.table-scroll > table:has(> caption) { border-collapse: separate; border-spacing: 0; }
.table-scroll > table > caption { caption-side: top; text-align: left; padding: 0 0 1rem; font: 1.45rem var(--display); /* размер подписи как в дизайн-системе (.info-table caption), не заголовок H2 */ color: var(--ink); }
.table-scroll > table:has(> caption) > :is(thead, tbody) > tr > :is(th, td) { border-bottom: 1px solid var(--line); }
.table-scroll > table:has(> caption) > thead > tr > th:first-child { border-top-left-radius: var(--r); }
.table-scroll > table:has(> caption) > thead > tr > th:last-child { border-top-right-radius: var(--r); }

/* Two-up phone catalogue (Pavo settings → «Товаров в ряду на мобилке» = 2): marketplace-style compact card. */
@media (max-width: 640px) {
	.starina-cols-m2 [data-page="catalog"] .catalog-layout .product-grid { gap: .625rem; }
	.starina-cols-m2 .product-card--wide .product-card__body { display: flex; flex-direction: column; align-items: stretch; gap: .375rem; padding: .625rem; }
	.starina-cols-m2 .product-card--wide .product-card__body > small,
	.starina-cols-m2 .product-card--wide .product-card__meta,
	.starina-cols-m2 .product-card--wide .product-quantity,
	.starina-cols-m2 .product-card--wide .product-card__dots,
	.starina-cols-m2 .product-card--wide .product-card__actions .button:not(.quick-order) { display: none; }
	.starina-cols-m2 .product-card--wide .product-card__body > :is(h2, h3) { margin: 0; font-size: .875rem; line-height: 1.25; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; overflow-wrap: anywhere; }
	.starina-cols-m2 .product-card--wide .product-card__price { margin: 0; font-size: 1rem; white-space: normal; }
	.starina-cols-m2 .product-card--wide .product-card__actions { display: block; margin-top: .25rem; }
	.starina-cols-m2 .product-card--wide .product-card__actions .quick-order { width: 100%; min-width: 0; padding-inline: .5rem; }
	.starina-cols-m2 .product-card--wide .product-card__tags { left: .375rem; top: .375rem; max-width: calc(100% - 3.5rem); max-height: 2.5rem; }
	.starina-cols-m2 .product-card--wide .product-card__tags span { font-size: .6875rem; padding: .125rem .375rem; }
	.starina-cols-m2 .product-card--wide .product-card__favorite { width: 2.25rem; height: 2.25rem; right: .375rem; top: .375rem; }
}

.starina-file-name{display:flex;gap:.75rem;align-items:center;margin:.4rem 0 0;font-size:.875rem;word-break:break-all}.starina-file-name button{flex:none;border:0;background:none;color:var(--primary);text-decoration:underline;cursor:pointer;font:inherit;padding:.25rem}

/* Preserve complete furniture silhouettes in category and landing covers. */
[data-page="catalog"] .media-hero__figure{background:var(--surface-2)}
[data-page="catalog"] .media-hero__figure img{object-fit:contain}

.search-page--empty .page-head{padding-block:clamp(2rem,4vw,3rem)}
.search-page-start{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(1.5rem,4vw,3rem);padding-block:1rem 3rem}
.search-page-start h2{margin:0 0 1rem}
.search-page-start__links{display:flex;flex-wrap:wrap;gap:.75rem}
.search-page-start__links .button{white-space:normal;text-align:left}
@media(max-width:700px){.search-page-start{grid-template-columns:1fr}}

.search-section-nav{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1.5rem}
.search-section-nav .button{white-space:normal}

/* Shared file-format icons are also used by the global favourites panel. */
/* Плашка формата на кнопках-файлах: те же классы и правила, что tp-filebtn в theme/resources/css/tp-layout.css (#445); там pavo-app снят на Starina. */
.tp-filebtn { display: inline-flex; align-items: center; gap: .65rem; }
.tp-filebtn::before { content: ""; flex: none; width: 28px; height: 30px; background: center / contain no-repeat; pointer-events: none; }
.tp-filebtn--xlsx::before { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2228%22%20height%3D%2230%22%20viewBox%3D%220%200%2028%2030%22%3E%3Cpath%20fill%3D%22%23fff%22%20stroke%3D%22%23217346%22%20stroke-width%3D%221.5%22%20d%3D%22M7%201h13l7%207v21H7z%22%2F%3E%3Cpath%20fill%3D%22none%22%20stroke%3D%22%23217346%22%20d%3D%22M20%201v7h7M11%2012h12M11%2017h12M11%2022h12M17%2012v10%22%2F%3E%3Crect%20x%3D%220%22%20y%3D%229%22%20width%3D%2215%22%20height%3D%2215%22%20rx%3D%223%22%20fill%3D%22%23217346%22%2F%3E%3Cpath%20stroke%3D%22%23fff%22%20stroke-width%3D%222%22%20d%3D%22m4%2013%207%207m0-7-7%207%22%2F%3E%3C%2Fsvg%3E"); }
.tp-filebtn--csv::before { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2228%22%20height%3D%2230%22%20viewBox%3D%220%200%2028%2030%22%3E%3Cpath%20fill%3D%22%23fff%22%20stroke%3D%22%234a6274%22%20stroke-width%3D%221.5%22%20d%3D%22M7%201h13l7%207v21H7z%22%2F%3E%3Cpath%20fill%3D%22none%22%20stroke%3D%22%234a6274%22%20d%3D%22M20%201v7h7%22%2F%3E%3Crect%20x%3D%220%22%20y%3D%2212%22%20width%3D%2225%22%20height%3D%2213%22%20rx%3D%223%22%20fill%3D%22%234a6274%22%2F%3E%3Ctext%20x%3D%2212.5%22%20y%3D%2221%22%20fill%3D%22%23fff%22%20font-family%3D%22Arial%2Csans-serif%22%20font-size%3D%228%22%20font-weight%3D%22bold%22%20text-anchor%3D%22middle%22%3ECSV%3C%2Ftext%3E%3C%2Fsvg%3E"); }
.tp-filebtn--pdf::before { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2228%22%20height%3D%2230%22%20viewBox%3D%220%200%2028%2030%22%3E%3Cpath%20fill%3D%22%23fff%22%20stroke%3D%22%23b83b32%22%20stroke-width%3D%221.5%22%20d%3D%22M7%201h13l7%207v21H7z%22%2F%3E%3Cpath%20fill%3D%22none%22%20stroke%3D%22%23b83b32%22%20d%3D%22M20%201v7h7%22%2F%3E%3Crect%20x%3D%220%22%20y%3D%2212%22%20width%3D%2225%22%20height%3D%2213%22%20rx%3D%223%22%20fill%3D%22%23b83b32%22%2F%3E%3Ctext%20x%3D%2212.5%22%20y%3D%2221%22%20fill%3D%22%23fff%22%20font-family%3D%22Arial%2Csans-serif%22%20font-size%3D%228%22%20font-weight%3D%22bold%22%20text-anchor%3D%22middle%22%3EPDF%3C%2Ftext%3E%3C%2Fsvg%3E"); }
/* Вид «плашка»: текстовый бейдж XLS/CSV/PDF вместо иконки файла (выбор в админке: «Вид иконки»). */
.tp-filebtn--badge { gap: .5rem; }
.tp-filebtn--badge::before { width: auto; height: auto; min-width: 2.1rem; padding: .15rem .3rem; border-radius: .25rem; background-image: none; color: #fff; font-size: .6rem; font-weight: 700; line-height: 1.2; letter-spacing: .04em; text-align: center; }
.tp-filebtn--badge.tp-filebtn--xlsx::before { content: "XLS"; background-color: #1d6f42; }
.tp-filebtn--badge.tp-filebtn--csv::before { content: "CSV"; background-color: #4a6274; }
.tp-filebtn--badge.tp-filebtn--pdf::before { content: "PDF"; background-color: #b3261e; }

/* Keep native article/FAQ anchors below the sticky site header. */
main :is(h2,h3)[id]{scroll-margin-top:10rem}
@media(max-width:600px){main :is(h2,h3)[id]{scroll-margin-top:6rem}}

/* Compact sticky header (desktop only, «Шапка и подвал → Липкая шапка на ПК»).
   Folding never changes the layout boxes' size: the header keeps its full-height footprint and is only translated up by the
   height of the top row (transform: nothing below moves, CLS 0, compositor only). The top row fades out, the mark and icons
   fade + slide in, «Помещения / Для проектов / Заказать звонок» fade out as ghosts while site.js slides the neighbours
   into their new places with a FLIP transform. One duration and one easing (--shell-t, --ease) for all of it.
   Mobile keeps the old header untouched. */
.shell-mark, .shell-header__compact-tools, .shell-phone-pop { display: none; }
@media (min-width: 1024px) {
	.shell-header--static { position: static; }
	.shell-header--compact { --shell-t: .3s; --shell-top-h: 4.6875rem; transition: transform var(--shell-t) var(--ease), box-shadow var(--shell-t) var(--ease); }
	.shell-header--compact .shell-header__top { transition: opacity calc(var(--shell-t) * .6) var(--ease) calc(var(--shell-t) * .4), visibility 0s; }
	.shell-header--compact.is-compact { transform: translateY(calc(var(--shell-top-h) * -1)); box-shadow: 0 1px 0 var(--line), 0 6px 16px -10px rgb(24 18 12 / .3); }
	.shell-header--compact.is-compact .shell-header__top { opacity: 0; visibility: hidden; transition-property: opacity, visibility; transition-delay: 0s, var(--shell-t); }
	/* Items that leave: out of the flow (site.js pins them where they were) and fade; items that come back fade in. */
	.shell-header--compact :is(.shell-mark, .shell-header__compact-tools) { display: flex; align-items: center; flex: none; position: absolute; opacity: 0; visibility: hidden; pointer-events: none; transition: opacity var(--shell-t) var(--ease), visibility 0s linear var(--shell-t); }
	.shell-header--compact.is-compact :is(.shell-mark, .shell-header__compact-tools) { position: static; opacity: 1; visibility: visible; pointer-events: auto; transition-delay: 0s; animation: shell-compact-in var(--shell-t) var(--ease) both; }
	.shell-header--compact .shell-header__compact-tools { gap: 2px; margin-left: auto; }
	.shell-header--compact.is-compact .shell-header__compact-tools { --shell-slide: 10px; }
	.shell-header--compact :is(.shell-header__cta .shell-callback, .shell-nav-cluster--browse > a, .shell-nav-divider) { transition: opacity calc(var(--shell-t) * .6) var(--ease) calc(var(--shell-t) * .4), visibility 0s; }
	.shell-header--compact.is-compact :is(.shell-header__cta .shell-callback, .shell-nav-cluster--browse > a, .shell-nav-divider) { position: absolute; white-space: nowrap; opacity: 0; visibility: hidden; pointer-events: none; transition-property: opacity, visibility; transition-delay: 0s, var(--shell-t); }
	/* Знак K1 квадратный: 46×46 (было 34×40 — мелко и с вертикальной растяжкой). */
	.shell-mark img { display: block; width: 46px; height: 46px; }
	.shell-header--compact .shell-nav-cluster--browse { transition: background-color var(--shell-t) var(--ease), border-color var(--shell-t) var(--ease); }
	.shell-header--compact.is-compact .shell-nav-cluster--browse { border-color: transparent; background: transparent; }
	/* Not enough room for everything: drop the lowest-priority links first (they stay in the unfolded header and the footer). */
	@media (max-width: 1199px) {
		.shell-header--compact .shell-nav-cluster--editorial > a[href*="shou-rum"] { transition: opacity calc(var(--shell-t) * .6) var(--ease) calc(var(--shell-t) * .4), visibility 0s; }
		.shell-header--compact.is-compact .shell-nav-cluster--editorial > a[href*="shou-rum"] { position: absolute; white-space: nowrap; opacity: 0; visibility: hidden; pointer-events: none; transition-property: opacity, visibility; transition-delay: 0s, var(--shell-t); }
		.shell-header--compact.is-compact .shell-navigation { gap: 8px; }
		.shell-header--compact.is-compact .shell-nav-cluster--editorial { gap: 12px; }
	}
	/* Phone popover under the compact phone icon (position set by site.js). */
	.shell-phone-pop { position: absolute; z-index: 45; top: calc(100% + 8px); right: 1rem; display: grid; gap: 12px; width: min(20rem, calc(100vw - 2rem)); padding: 18px; border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--surface); box-shadow: var(--shadow); opacity: 0; visibility: hidden; transform: translateY(-6px); transition: opacity var(--motion-fast) var(--ease), transform var(--motion-fast) var(--ease), visibility 0s linear var(--motion-fast); }
	.shell-phone-pop.is-open { opacity: 1; visibility: visible; transform: none; transition-delay: 0s; }
	.shell-header--compact .shell-phone-pop { display: grid; }
	.shell-phone-pop__tel { display: grid; color: var(--ink); font-size: 1.375rem; font-weight: 700; line-height: 1.2; text-decoration: none; }
	.shell-phone-pop__tel small { color: var(--muted); font-size: .8125rem; font-weight: 500; }
	.shell-phone-pop__tel:hover { color: var(--primary); }
	.shell-phone-pop__callback { justify-self: stretch; }
	.shell-phone-pop__hours { margin: 0; color: var(--muted); font-size: .875rem; }
	.shell-phone-pop__socials { display: flex; flex-wrap: wrap; gap: 8px 12px; }
	.shell-phone-pop a:focus-visible, .shell-phone-pop button:focus-visible { outline: 2px solid var(--outline, var(--primary)); outline-offset: 3px; }
	/* Anchors land below the folded header, not the full one. */
	html:has(.shell-header--compact) { scroll-padding-top: 4.5rem; }
	body:has(.shell-header--compact) main :is(h2,h3)[id] { scroll-margin-top: 5rem; }
	body:has(.shell-header--compact) .shell-prefooter { scroll-margin-top: 5rem; }
}
@media (prefers-reduced-motion: reduce) {
	.shell-header--compact, .shell-header--compact *, .shell-phone-pop { transition: none !important; animation: none !important; }
}
@keyframes shell-compact-in { from { opacity: 0; transform: translateX(calc(var(--shell-slide, -10px))); } to { opacity: 1; transform: none; } }

/* Text for assistive tech and crawlers only: keeps generic link labels ("Подробнее") descriptive without changing the layout. */
.starina-sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* Variant A has its own light artwork for the dark footer. */
.shell-footer .shell-brand{filter:none}

/* Юзабилити-тест #674: оранжевый акцент — для главного действия на экране (токен --accent). Тёмный текст: белый на #d97757 не проходит контраст. */
.button--accent { --button-bg: var(--accent); --button-ink: var(--ink); --button-border: var(--accent); --button-hover-bg: color-mix(in srgb, var(--accent) 88%, #000); --button-hover-ink: var(--ink); --button-hover-border: color-mix(in srgb, var(--accent) 88%, #000); --button-active-bg: color-mix(in srgb, var(--accent) 78%, #000); --button-active-ink: var(--ink); --button-active-border: color-mix(in srgb, var(--accent) 78%, #000); font-weight: 700; }
.catalog-sections-toggle.button--accent { margin-top: 1.5rem; min-height: 3.5rem; padding: 0 1.75rem; border-color: var(--accent); background: var(--accent); color: var(--ink); font-size: 1.125rem; font-weight: 700; }
.catalog-sections-toggle.button--accent:hover { border-color: color-mix(in srgb, var(--accent) 88%, #000); background: color-mix(in srgb, var(--accent) 88%, #000); }
.media-hero > .catalog-sections-toggle--after { display: none; }
@media (max-width: 900px) {
	.media-hero__copy .catalog-sections-toggle { display: none; }
	.media-hero > .catalog-sections-toggle--after { display: inline-flex; margin-top: 0; }
}
@media (max-width: 700px) { .catalog-sections-toggle.button--accent { width: 100%; justify-content: space-between; } }

/* Меню с колонками («Услуги и доставка»): у пункта подменю свои ссылки — заголовок колонки и список под ним. Компактно, как «Полезное». */
.shell-nav-popover--cols { display: grid; grid-template-columns: repeat(2, minmax(11rem, 1fr)); gap: 0 1.25rem; width: min(26rem, calc(100vw - 2rem)); padding: 14px 18px; }
.shell-nav-col { display: grid; align-content: start; gap: 0; }
.shell-nav-col__title { padding-bottom: 6px; border-bottom: 1px solid var(--line); color: var(--muted); font: 600 .75rem/1.2 var(--sans); text-transform: uppercase; letter-spacing: .06em; }
.shell-nav-popover--cols a { min-height: 2.25rem; }
.shell-drawer__label { display: block; padding: 12px 0 4px; color: var(--muted); font: 600 .8125rem/1.2 var(--sans); text-transform: uppercase; letter-spacing: .06em; }

/* Главная: переключатель «Каталог · Мебель по комнатам · Для бизнеса» — та же капсула, что в шапке (#674 п.7); переключает панель блока на месте. */
.home-switch { display: flex; width: fit-content; max-width: 100%; margin-bottom: 1rem; overflow-x: auto; }
.home-switch > button { flex: none; min-height: 52px; padding: 0 17px; border: 0; border-radius: 999px; background: transparent; color: var(--ink); font: 600 1.1rem/1.2 var(--sans); cursor: pointer; transition: background-color var(--motion-fast) var(--ease), color var(--motion-fast) var(--ease); }
.home-switch > button:hover { background: var(--surface); box-shadow: inset 0 0 0 1px var(--line); }
.home-switch > button[aria-selected="true"] { background: var(--primary); color: var(--primary-ink); box-shadow: none; }
.home-switch > button:focus-visible { outline: 3px solid var(--focus); outline-offset: 1px; }
.home-switch__panel[hidden] { display: none; }
.home-switch__panel .shell-mega { display: block; }
.home-switch__panel .shell-mega__main { padding: clamp(1rem, 2.5vw, 1.75rem); }

/* Иерархия CTA (аудит #674): один оранжевый на экран; повторяющиеся «Подробнее» — ссылка, вторичное — контур на белом. */
.hero__copy .actions .button--ghost { --button-bg: var(--surface); }
:is(.shell-navigation, .home-catalog-mega) .shell-mega .shell-mega-aside .shell-catalog-all.button--accent { background: var(--accent); border-color: var(--accent); color: var(--ink); }
:is(.shell-navigation, .home-catalog-mega) .shell-mega .shell-mega-aside .shell-catalog-all.button--accent:hover { background: color-mix(in srgb, var(--accent) 88%, #000); border-color: color-mix(in srgb, var(--accent) 88%, #000); color: var(--ink); }
.product-card__actions .button--text { align-self: center; min-height: 2.75rem; display: inline-flex; align-items: center; color: var(--ink); font-weight: 600; }
.product-samples-open.button--outline { --button-bg: var(--surface); }
@media (max-width: 560px) { .home-switch { width: 100%; } .home-switch > button { flex: 1 1 auto; padding: 0 10px; font-size: 1.06rem; } }
/* Тёмная секция «Наши работы»: «Все проекты» — главное действие блока, оранжевая (перебивает светлый контур секции). */
.section--gallery .section-heading > a.button.button--accent { border-color: var(--accent); background: var(--accent); color: var(--ink); }
.section--gallery .section-heading > a.button.button--accent:hover { border-color: color-mix(in srgb, var(--accent) 88%, #000); background: color-mix(in srgb, var(--accent) 88%, #000); }

/* «Наши работы»: главное действие после сетки (#674). */
.portfolio-cta { display: flex; justify-content: center; padding-block: clamp(1.5rem, 4vw, 2.5rem); }
@media (max-width: 560px) { .portfolio-cta .button { width: 100%; } }
/* Оранжевая кнопка на баннере с фото и на тёмных hero страниц: тёмный текст, не кремовая плашка. */
.media-hero--banner .button.button--accent:not(.button--ghost):not(.button--outline),
body[class*="starina-workshop-"] .page-head--tex .button.button--accent:not(.button--ghost):not(.button--outline) { background: var(--accent); border-color: var(--accent); color: var(--ink); }

/* Фильтры на ПК: панель без внутреннего скролла (все группы целиком), «Показать N» — липкая нижняя строка панели: всегда в кадре, пока панель на экране (#674). */
@media (min-width: 901px) {
	.catalog-layout .filters .filters__foot { position: sticky; top: auto; bottom: var(--catalog-filter-footer-bottom, 0px); z-index: 2; border-radius: 0 0 var(--r) var(--r); background: var(--surface); box-shadow: 0 -8px 18px rgb(24 18 12 / .08); }
}
/* Пустая группа (нет вариантов и поля цены) не занимает место. */
.filters .filter-group:not(:has(.filters__options label, .filters__fallback-select, .filters__price-range)) { display: none; }

/* Cookie choice panel: while it is on screen the page end gets matching room
   (site.js measures the panel), so the footer and the last rows are never stuck
   under it. Tokens only; the panel itself keeps its design-system look. */
body.has-cookie-banner { padding-bottom: var(--cookie-banner-space, 0px); }

/* Печатная версия (template-parts/print-sheet.php): на экране скрыта. */
.starina-print-sheet { display: none; }
@media print {
	@page { margin: 14mm 12mm; }
	/* Печать — документ, а не слепок экрана: из body остаётся только содержимое
	   страницы (или открытое избранное). Cookie-баннер, «Связаться», шапка, меню,
	   префутер, оценка страницы и подвал не печатаются при любом выборе cookie. */
	body > :not(main):not(dialog[open]) { display: none !important; }
	html, body { background: #fff !important; }
	body.has-cookie-banner { padding-bottom: 0; }
	main:has(.starina-print-sheet) .page-head,
	main:has(.starina-print-sheet) .crumbs { display: none !important; }
	main:has(.starina-print-sheet) .section { padding-block: 0; }
	.starina-print-sheet { display: block; color: var(--ink); font-size: 10pt; line-height: 1.4; }
	.starina-print-sheet p { margin: 0; }
	.starina-print-sheet__title { font-size: 13pt; font-weight: 700; }
	.starina-print-sheet--head { break-inside: avoid; display: flex; align-items: center; justify-content: space-between; gap: var(--s4); margin-bottom: var(--s4); padding-bottom: var(--s3); border-bottom: 1px solid var(--outline); }
	.starina-print-sheet--head img { width: 190px; height: auto; }
	.starina-print-sheet--head div { text-align: right; }
	.starina-print-sheet--foot { margin-top: var(--s5); padding-top: var(--s3); border-top: 1px solid var(--outline); }
	.starina-print-sheet__note { margin-bottom: var(--s3) !important; color: var(--muted); break-after: avoid; }
	.starina-print-sheet dl { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: 2px var(--s4); margin: var(--s2) 0 0; }
	.starina-print-sheet dt { color: var(--muted); }
	.starina-print-sheet dd { margin: 0; }
}

/* «Скриншот отзыва» на главной: вторая ссылка карточки поверх растянутой ссылки «Смотреть на картах». */
.home-review__shot { position: relative; z-index: 1; }
.home-review__shot::after { content: none; }

/* Группы кнопок (правило Павла 01.10.2026): рядом не стоят две одинаковые кнопки — одна основная + вторичная
   другого вида или текстовая ссылка; ряд выровнен по центру, кнопки одной высоты; в соседних карточках ряд
   прижат к низу на одной линии; при переносе на узком экране — столбик на всю ширину, без лесенки. */
:is(.actions, .colors-detail__actions, .post-share) > .text-link { align-self: center; }
/* «Поделиться»: мессенджеры — круглые иконки-кнопки 44 px с обводкой (как закрытие диалога), значки — фирменные из дизайн-системы. */
.post-share__icon { border: 1px solid var(--line); background: var(--surface); text-decoration: none; transition: border-color var(--motion-fast, .15s) var(--ease, ease); }
.post-share__icon:hover { border-color: var(--outline); background: var(--surface); }
.post-share__icon:focus-visible { outline: 2px solid var(--outline, var(--primary)); outline-offset: 3px; }
.post-share__icon span { width: 1.5rem; height: 1.5rem; background: center / contain no-repeat; }
.post-share__icon--telegram span { background-image: url("design-system/assets/brands/telegram.svg"); }
.post-share__icon--whatsapp span { background-image: url("design-system/assets/brands/whatsapp.svg"); }
.service-feature__body { display: flex; flex-direction: column; }
.service-feature .actions > .button:not(:only-child) { flex: 1 1 auto; }
.order-ways > li > a:last-child { margin-top: auto; }
.masters-grid .master-card > div { display: flex; flex-direction: column; align-items: flex-start; }
.masters-grid .master-card > div > .button:last-child { margin-top: auto; }
.masters-grid .master-card > div > :nth-last-child(2) { margin-bottom: var(--s4); }
/* Текстовая ссылка на тёмной фото-шапке — цветом текста шапки (как светлая рамка ghost на тёмном), иначе тёмная ссылка не читается. */
.media-hero--banner .actions > .text-link { color: inherit; }
@media (max-width: 600px) {
	/* Столбик на всю ширину вместо лесенки: кнопки — по строке, ссылки — под ними. */
	.colors-detail__actions > .button { flex: 1 1 100%; }
	/* Шапка цен: кнопки столбиком на всю ширину; кнопка-файл с иконкой выше обычной small — высоты выравниваются. */
	.price-actions > .button { flex: 1 1 100%; min-height: 48px; }
	/* «Поделиться:» — своей строкой, кнопка и иконки мессенджеров — одним рядом. */
	.post-share > span:first-child { flex-basis: 100%; }
}

/* Шапка на ПК (02.10.2026): поиск — иконка-кнопка 44px с контуром, чтобы глаз цеплялся. «Каталог» тёмная, как до #898. */
@media (min-width: 1021px) {
	.shell-header .shell-search-toggle { border: 1px solid var(--outline); background: var(--surface); }
	.shell-header .shell-search-toggle:hover { border-color: var(--primary); background: var(--surface-2); }
}

/* Каталог на телефоне: панель «Фильтры» (80 %) + «Заказать звонок» (20 %) закреплена внизу экрана, над cookie-баннером;
   плавающий «Связаться» её не дублирует. Конец страницы получает место под панель. */
.catalog-mobilebar__call { display: none; }
@media (max-width: 900px) {
	.catalog-mobilebar { position: fixed; top: auto; left: max(.75rem, env(safe-area-inset-left)); right: max(.75rem, env(safe-area-inset-right)); bottom: calc(max(.75rem, env(safe-area-inset-bottom)) + var(--cookie-banner-space, 0px)); z-index: 45; margin: 0; grid-template-columns: minmax(0, 2fr) minmax(0, 2fr) minmax(0, 1fr); }
	.catalog-mobilebar.catalog-mobilebar--sort-only { grid-template-columns: minmax(0, 4fr) minmax(0, 1fr); }
	.catalog-mobilebar__call { display: inline-flex; min-height: 2.75rem; padding: 0; border-radius: 999px; }
	.catalog-mobilebar__call .shell-icon { width: 1.5rem; height: 1.5rem; }
	body:has(.catalog-mobilebar) { padding-bottom: calc(4.5rem + env(safe-area-inset-bottom) + var(--cookie-banner-space, 0px)); }
	body:has(.catalog-mobilebar) .starina-contact-widget { display: none; }
	/* «Все N вариантов» на телефоне раскрывает полный список на месте, в общей прокрутке листа. */
	.filter-group.is-expanded > .filters__all .shell-icon { transform: rotate(-90deg); }
	.filters__find { margin: 0 0 .5rem; font-size: 1rem; }
	.filters__find[hidden] { display: none; }
}
@media (max-width: 480px) {
	.catalog-mobilebar { grid-template-columns: minmax(0, 4fr) minmax(0, 1fr); }
}