/*
 * Glue for server-rendered client pages. The design system stays the source:
 * these rules only mirror v10 selectors where the server emits a link instead
 * of the prototype's JS button (a real URL per state), or where WP wraps
 * markup differently. Values are copied from content.css/styles.css.
 */

/* /ceny/: category tiles and pagination are links, controls are a GET form. */
.price-from__grid a {
	display: grid;
	gap: .125rem;
	padding: .875rem 1rem;
	border: 1px solid var(--line);
	border-radius: var(--r-md);
	background: var(--surface);
	color: var(--ink);
	text-align: left;
	text-decoration: none;
	transition: border-color var(--duration) var(--ease), background-color var(--duration) var(--ease);
}
.price-from__grid a:hover { border-color: var(--outline); }
.price-from__grid a[aria-pressed="true"] { border-color: var(--primary); box-shadow: inset 0 0 0 1px var(--primary); }
.price-list__pagination a { min-width: 44px; min-height: 44px; justify-content: center; }
.price-list__pagination a[aria-current="page"] { background: var(--primary); color: var(--primary-ink); border-color: var(--primary); }
.price-list__submit {
	position: absolute !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}
.price-list__controls:focus-within .price-list__submit:focus {
	position: static !important;
	width: auto;
	height: auto;
	clip: auto;
}

/* WP page wrapper: v10 page blocks carry their own .wrap, so the
 * entry-content container must not add a second gutter. */
.page-content > .entry-content.wrap { width: auto; max-width: none; padding: 0; margin: 0; }
/* Imported media keep their intrinsic sizes; never overflow a narrow column. */
.page-content img, .page-content svg { max-width: 100%; }
@media print {
	.shell-header, .shell-footer, .shell-prefooter, .price-actions, .price-list__controls, .price-list__pagination, .price-list__actions { display: none !important; }
}

/* WP uses the prototype's `.page.active` main wrapper, but server navigation
 * has already rendered the destination. Replaying the prototype router's
 * entry animation briefly fades real pages to white on every direct load. */
body.page, .type-page.page, main.page { display: block; animation: none; }

/* Workshop starts share v10 geometry but need their own material. The SVG
 * textures already ship in `assets/design-system`; this adds no hero image
 * request and keeps the title immediately readable during navigation. */
body.starina-workshop-walnut .page-head--tex,
body.starina-workshop-portfolio .page-head--tex,
body.starina-workshop-showroom .page-head--tex,
body.starina-workshop-honey .page-head--tex,
body.starina-workshop-ash .page-head--tex,
body.starina-workshop-oak .page-head--tex,
body.starina-workshop-contact .page-head--tex {
	--tex-ink: #f8f1e8;
	--tex-muted: rgb(248 241 232 / .82);
	--tex-size: 360px 120px;
	--tex-op: .32;
}
body.starina-workshop-walnut .page-head--tex { --tex-bg: #e2cda9; --tex-ink: #2c2119; --tex-muted: rgb(44 33 25 / .76); --tex-size: 420px 300px; --tex-op: .84; }
body.starina-workshop-portfolio .page-head--tex { --tex-bg: #2b2018; --tex-size: 420px 300px; --tex-op: .72; }
/* Plank texture under light copy: keep the seams quiet so the lead text does
   not shimmer on phones (tester feedback 30.09). */
body.starina-workshop-showroom .page-head--tex { --tex-bg: #4f3d30; --tex-size: 360px 162px; --tex-op: .26; }
body.starina-workshop-honey .page-head--tex { --tex-bg: #5c4130; --tex-size: 360px 162px; --tex-op: .28; }
body.starina-workshop-ash .page-head--tex { --tex-bg: #d8c8b4; --tex-ink: #2c2119; --tex-muted: rgb(44 33 25 / .76); --tex-size: 280px; --tex-op: .8; }
/* Reviews share the light prototype treatment: a single wood field keeps the
   background distinct while the dark copy and actions remain legible. */
body.starina-workshop-ash .reviews-page__head.page-head--tex { --tex-bg: #efe3d2; --tex-size: 420px 300px; --tex-op: .9; }
/* The vacancy title needs a single timber field, not a tiled plank pattern:
   repeated seams competed with the copy at both desktop and mobile widths. */
body.starina-workshop-oak .page-head--tex { --tex-bg: #392519; --tex-size: 420px 300px; --tex-op: .54; }
/* The live vacancy is a child page with the shared `starina-workshop-honey`
   body class. Scope its correction to its own header so other honey pages
   retain their approved plank treatment. */
body.starina-workshop-honey .vacancy-head.page-head--tex { --tex-bg: #392519; --tex-size: 420px 300px; --tex-op: .54; }
/* Contacts are a short introduction, so keep its warm ash grain visible
   without the dark brown treatment used by the portfolio and showroom. */
body.starina-workshop-contact .page-head--tex { --tex-bg: #b4aa9e; --tex-ink: #2c2119; --tex-muted: rgb(44 33 25 / .76); --tex-size: 420px 300px; --tex-op: .76; min-height: clamp(17rem, 26vw, 21rem); justify-content: center; }
/* URLs in custom properties are resolved where the frozen bundle uses them.
   Declare the image on this child stylesheet's pseudo-element instead. */
body.starina-workshop-walnut .page-head--tex::before { background-image: url("textures/wood-grain-flow-wide.svg"); }
body.starina-workshop-portfolio .page-head--tex::before { background-image: url("textures/wood-grain-flow-light.svg"); }
body.starina-workshop-showroom .page-head--tex::before,
body.starina-workshop-honey .page-head--tex::before { background-image: url("textures/planks-light.svg"); }
body.starina-workshop-ash .page-head--tex::before { background-image: url("textures/rings-light.svg"); }
body.starina-workshop-ash .reviews-page__head.page-head--tex::before { background-image: url("textures/wood-grain-flow-wide.svg"); background-repeat: no-repeat; background-size: cover; background-position: center; }
body.starina-workshop-oak .page-head--tex::before { background-image: url("textures/wood-grain-flow-light.svg"); }
body.starina-workshop-honey .vacancy-head.page-head--tex::before { background-image: url("textures/wood-grain-flow-light.svg"); background-repeat: no-repeat; background-size: cover; background-position: center; }
body.starina-workshop-contact .page-head--tex::before { background-image: url("textures/wood-grain-flow-wide.svg"); }
body.starina-workshop-honey .page-head--tex::before { background-repeat: no-repeat; background-size: 100% auto; background-position: center; }
body.starina-workshop-walnut .page-head--tex::before,
body.starina-workshop-portfolio .page-head--tex::before,
body.starina-workshop-oak .page-head--tex::before,
body.starina-workshop-contact .page-head--tex::before { background-repeat: no-repeat; background-size: cover; background-position: center; }
body.starina-workshop-walnut .page-head--tex :is(p:not(.eyebrow), .lead, .info-lead),
body.starina-workshop-ash .page-head--tex :is(p:not(.eyebrow), .lead, .info-lead),
body.starina-workshop-contact .page-head--tex :is(p:not(.eyebrow), .lead, .info-lead) { color: var(--tex-muted) !important; }
body.starina-workshop-walnut .page-head--tex :is(.button--ghost, .button--outline),
body.starina-workshop-ash .page-head--tex :is(.button--ghost, .button--outline),
body.starina-workshop-contact .page-head--tex :is(.button--ghost, .button--outline) { background: transparent !important; border-color: rgb(44 33 25 / .55) !important; color: #2c2119 !important; }
body.starina-workshop-ash .reviews-page__head.page-head--tex :is(h1, .crumbs, .crumbs a, .crumbs span) { color: inherit; }
body.starina-workshop-ash .reviews-page__head.page-head--tex .eyebrow { color: #7a4525; }
/* The pale timber hero needs a darker carpenter's mark. It remains 4.5:1+
 * against every approved page base without changing headings or surfaces. */
body.starina-workshop-walnut .page-head--tex .eyebrow,
body.starina-workshop-ash .reviews-page__head.page-head--tex .eyebrow,
body.starina-workshop-contact .page-head--tex .eyebrow { color: #4b2818; }
body.starina-workshop-walnut .page-head--tex .eyebrow::before,
body.starina-workshop-ash .reviews-page__head.page-head--tex .eyebrow::before,
body.starina-workshop-contact .page-head--tex .eyebrow::before { background: #4b2818; }
body.starina-workshop-ash .reviews-page__head.page-head--tex .page-head__facts :is(li, a) { background: rgb(255 255 255 / .52); color: #2c2119; }
body.starina-workshop-ash .reviews-page__head.page-head--tex .button:not(.button--ghost):not(.button--outline) { background: #2c2119; border-color: #2c2119; color: #fff; }

/* Reviews: one hero card — text on the left, the two review QR cards on the right; phones keep only the buttons. */
.reviews-page__head { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: clamp(1.5rem, 4vw, 3rem); max-width: none; }
.reviews-page__qrs { display: flex; gap: 1rem; }
.reviews-page__qrs .reviews-leave__qr > img { width: 8.5rem; height: 8.5rem; }
/* «Подарок за отзыв»: плашка как .product-customisation-note, но в тёплом тоне акцента; кавычка — декор. */
.reviews-promo { position: relative; overflow: hidden; margin: clamp(1.5rem, 3vw, 2.5rem) 0; padding: 1.25rem 1.5rem 1.25rem 6.25rem; border: 1px solid color-mix(in srgb, var(--accent) 40%, #f3e6cf); border-radius: 16px; background: linear-gradient(135deg, color-mix(in srgb, var(--accent) 10%, #fbf3e4) 0%, color-mix(in srgb, var(--accent) 20%, #f7ead3) 100%); color: var(--ink); }
.reviews-promo__quote { position: absolute; left: 1.25rem; top: 50%; transform: translateY(-50%); font: 700 4.5rem/1 var(--display, Georgia, serif); color: color-mix(in srgb, var(--accent) 38%, transparent); pointer-events: none; user-select: none; }
.reviews-promo__body { position: relative; min-width: 0; }
.reviews-promo strong { display: block; font-size: 1.25rem; line-height: 1.3; font-weight: 600; }
.reviews-promo p { margin: .5rem 0 0; max-width: none; line-height: 1.6; color: var(--muted); }
@media (max-width: 640px) { .reviews-promo { padding: 1.125rem 1.125rem 1.125rem 3.75rem; } .reviews-promo__quote { left: .75rem; font-size: 3rem; } .reviews-promo strong { font-size: 1.125rem; } }
@media (max-width: 768px) {
	.reviews-page__head { grid-template-columns: minmax(0, 1fr); gap: 1.25rem; }
	.reviews-page__qrs { flex-wrap: wrap; gap: .75rem; }
	.reviews-page__qrs .reviews-leave__qr { padding: 0; border: 0; background: none; }
	.reviews-page__qrs .reviews-leave__qr > img { display: none; }
}

/* Contacts: four different tasks instead of a row of indistinguishable buttons. */
.contact-details {
	display: grid;
	grid-template-columns: repeat(12, minmax(0, 1fr));
	gap: clamp(1rem, 2vw, 1.5rem);
	padding-block: clamp(2.5rem, 6vw, 5rem);
}
.contact-details__card {
	min-width: 0;
	padding: clamp(1.25rem, 3vw, 2rem);
	border: 1px solid var(--line);
	border-radius: var(--r-lg);
	background: var(--surface);
}
/* Шоу-рум и мастерская — равноправные карточки; без мастерской шоу-рум занимает ряд. */
.contact-details__card--visit, .contact-details__card--workshop { grid-column: span 6; }
.contact-details__card--wide { grid-column: 1 / -1; }
.contact-details__map { display: block; width: 100%; height: 18rem; margin-top: 1.25rem; border: 0; border-radius: var(--r); }
.contact-details__card--logistics { grid-column: span 7; }
.contact-details__card--masters { grid-column: span 5; }
.contact-details h2 { margin-top: .25rem; font-size: clamp(1.7rem, 2.6vw, 2.4rem); }
.contact-details__card > p:not(.eyebrow) { max-width: 38rem; margin-top: .75rem; color: var(--muted); }
.contact-details__hours { margin-bottom: 0; font-size: .9375rem; }
.contact-details__actions { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem 1rem; margin-top: 1.5rem; }
.contact-details__address { color: var(--ink) !important; font: 400 clamp(1.25rem, 2vw, 1.65rem) / 1.28 var(--display); }
.contact-details__links { display: grid; gap: .5rem; margin-top: 1.25rem; }
.contact-details__links a, .contact-details__master { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 4.5rem; padding: .875rem 1rem; border: 1px solid var(--line); border-radius: var(--r); color: var(--ink); text-decoration: none; transition: border-color var(--duration) var(--ease), background-color var(--duration) var(--ease); }
.contact-details__links a:hover, .contact-details__master:hover { border-color: var(--primary); background: var(--surface-2); }
.contact-details__links b, .contact-details__links span, .contact-details__master b, .contact-details__master small { display: block; }
.contact-details__links span, .contact-details__master small { margin-top: .15rem; color: var(--muted); font-size: .8125rem; }
.contact-details__masters { display: grid; gap: .5rem; margin-top: 1.25rem; }
.contact-details__master > span:last-child { font-size: 1.25rem; }
.contact-public-map { position: relative; margin-top: clamp(1.5rem, 4vw, 3rem); overflow: hidden; border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--surface-2); }
.contact-public-map__frame { display: block; width: 100%; min-height: clamp(22rem, 48vw, 38rem); border: 0; }
.contact-public-map__open { position: absolute; right: 1rem; bottom: 1rem; background: color-mix(in srgb, var(--surface) 92%, transparent); box-shadow: 0 3px 14px rgb(36 25 15 / .18); }
@media (max-width: 900px) {
	.contact-details__card--logistics, .contact-details__card--masters { grid-column: span 6; }
}
@media (max-width: 620px) {
	.contact-details { grid-template-columns: 1fr; padding-block: 2rem 3rem; }
	.contact-details__card--visit, .contact-details__card--workshop, .contact-details__card--wide, .contact-details__card--logistics, .contact-details__card--masters { grid-column: auto; }
	.contact-details__card { padding: 1.25rem; }
	.contact-details__actions .button { width: 100%; }
	.contact-public-map__open { right: .75rem; bottom: .75rem; }
}

body.starina-workshop-portfolio .page-head--tex :is(h1, .crumbs, .crumbs a, .crumbs span),
body.starina-workshop-showroom .page-head--tex :is(h1, .crumbs, .crumbs a, .crumbs span),
body.starina-workshop-honey .page-head--tex :is(h1, .crumbs, .crumbs a, .crumbs span),
body.starina-workshop-oak .page-head--tex :is(h1, .crumbs, .crumbs a, .crumbs span) { color: inherit; }
body.starina-workshop-portfolio .page-head--tex .eyebrow,
body.starina-workshop-showroom .page-head--tex .eyebrow,
body.starina-workshop-honey .page-head--tex .eyebrow,
body.starina-workshop-oak .page-head--tex .eyebrow { color: #e6c9a6; }
body.starina-workshop-portfolio .page-head--tex :is(.button:not(.button--ghost):not(.button--outline)),
body.starina-workshop-showroom .page-head--tex :is(.button:not(.button--ghost):not(.button--outline)),
body.starina-workshop-honey .page-head--tex :is(.button:not(.button--ghost):not(.button--outline)),
body.starina-workshop-oak .page-head--tex :is(.button:not(.button--ghost):not(.button--outline)) { background: #f8f1e8; border-color: #f8f1e8; color: #2c2119; }
body.starina-workshop-portfolio .page-head--tex :is(.button--ghost, .button--outline),
body.starina-workshop-showroom .page-head--tex :is(.button--ghost, .button--outline),
body.starina-workshop-honey .page-head--tex :is(.button--ghost, .button--outline),
body.starina-workshop-oak .page-head--tex :is(.button--ghost, .button--outline) { background: transparent !important; border-color: rgb(248 241 232 / .58) !important; color: #f8f1e8 !important; }

@media (max-width: 700px) {
	body.starina-workshop-walnut .page-head--tex,
	body.starina-workshop-portfolio .page-head--tex,
	body.starina-workshop-showroom .page-head--tex,
	body.starina-workshop-honey .page-head--tex,
	body.starina-workshop-ash .page-head--tex,
	body.starina-workshop-oak .page-head--tex,
	body.starina-workshop-contact .page-head--tex { --tex-size: 260px auto; }
	body.starina-workshop-oak .page-head--tex h1 { font-size: clamp(2rem, 9vw, 2.55rem); }
	body.starina-workshop-honey .vacancy-head.page-head--tex h1 { font-size: clamp(2rem, 9vw, 2.55rem); }
}

/* Missing routes should explain the error before offering other sections. */
[data-page="404"] .not-found{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.95fr);align-items:center;gap:clamp(2rem,5vw,5rem);max-width:var(--container);padding-block:clamp(3rem,7vw,7rem);text-align:left}
.not-found__copy>p:not(.eyebrow){max-width:38rem;margin-top:1.5rem;color:var(--muted)}
.not-found__links{display:flex;flex-wrap:wrap;align-items:center;gap:.75rem 1rem;margin-top:2rem}
.not-found__art{width:100%;max-width:52rem;margin:0;justify-self:center}
.not-found__art img{display:block;width:100%;height:auto}
@media(max-width:800px){[data-page="404"] .not-found{grid-template-columns:1fr;padding-block:2.5rem 4rem}.not-found__links{gap:.75rem}.not-found__art{max-width:42rem}}
.wpcf7 .g-recaptcha,.wpcf7 .cf-turnstile{margin:1rem 0 1.5rem}

/* Catalog hub: a half-width group cannot fit two cards with a thumbnail and
   readable Russian labels at tablet widths. The bundled v10 source uses the
   same breakpoint; this keeps the server-rendered WordPress archive in step. */
@media (min-width:701px) {
	.catalog-hub__group:not(:first-child) .catalog-hub__grid {
		grid-template-columns:repeat(auto-fill,minmax(min(100%,19rem),1fr));
	}
}
.hub-tile__main,.hub-tile__text { min-width:0; }
.hub-tile__text b,.hub-tile__links a { overflow-wrap:anywhere; }
.hub-tile__links a { max-width:100%; }
.hub-tile__links a span { white-space:nowrap; }

/* Both legal documents use the available article column rather than a fixed 720px track. */
.legal-layout{grid-template-columns:minmax(0,1fr) 17.5rem;gap:clamp(1.5rem,3vw,3rem)}
.legal-layout>.info-prose{width:100%;min-width:0;max-width:none;box-sizing:border-box}
.legal-layout>.info-prose p,.legal-layout>.info-prose ul,.legal-layout>.info-prose ol{max-width:none}
@media(max-width:800px){.legal-layout{grid-template-columns:minmax(0,1fr)}.legal-layout>.legal-aside{width:100%;min-width:0}}

.delivery-zones__side>.eyebrow{margin:0 0 1rem}
.delivery-zones__side>h2{margin:0 0 1rem}
.delivery-zones__side>.info-copy{margin:0 0 1.5rem;line-height:1.65}
.delivery-zones__side>.delivery-note{margin:1rem 0 0;line-height:1.6}
@media(max-width:600px){.delivery-zones__side>h2{margin-bottom:.75rem}.delivery-zones__side>.info-copy{margin-bottom:1.25rem}}

/* /ceny/ герой: основная + «Excel» с обводкой + ссылки CSV/PDF — одним рядом от 1024 (ряд шире колонки текста),
   на планшете кнопки первой строкой, ссылки — второй; телефон — столбик из shell.css. */
@media(min-width:1024px){.media-hero__copy>.price-actions{flex-wrap:nowrap;width:max-content;max-width:none}}
@media(min-width:601px) and (max-width:1023px){
.price-actions::before{content:"";order:1;flex-basis:100%;height:0;margin-top:-.625rem}
.price-actions>.text-link{order:2}
}

/* /ceny/: действия строки в один ряд — компактный степпер (подпись скрыта), сердечко --small, «Заказать» button--small; всё по центру строки вместе с ценой. */
.price-list .price-list__table td{vertical-align:middle}
.price-list .price-list__table .price-list__actions{width:1%;white-space:nowrap}
.price-list__action-group{display:flex;align-items:center;justify-content:flex-end;gap:.5rem}
.price-list__action-group>.product-quantity{margin:0;flex:none}
.price-list__action-group .quantity-stepper{gap:.125rem}
.price-list__action-group :is(.quantity-stepper__button,[data-product-quantity]){width:2.25rem;min-width:0;height:2.5rem;min-height:0;padding:0}
.price-list__action-group [data-product-quantity]{width:2.75rem}
.price-list__action-group>.favorite-button{flex:none;width:2.5rem;height:2.5rem;min-width:2.5rem;margin:0}
.price-list__action-group>.button{flex:none;min-height:2.5rem;margin:0;padding:.375rem 1rem}
/* < 1024: строка — карточка (рецепт v10.5): название во всю ширину, ниже цена слева и действия справа. */
@media(max-width:1023px){
.price-list .price-list__table{overflow:visible}
.price-list .price-list__table :is(.spec-table,tbody){display:block;width:100%}
.price-list .price-list__table thead{display:none}
.price-list .price-list__table tr{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:.5rem .75rem;padding:.875rem .75rem;border-bottom:1px solid var(--line)}
.price-list .price-list__table td{display:block;width:auto;padding:0;border:0;background:none}
.price-list .price-list__table td:first-child{grid-column:1/-1;width:auto}
.price-list .price-list__table tr:hover td{background:none}
.price-list .price-list__table tr:hover{background:var(--surface-2)}
.price-list .price-list__table .price-list__price{white-space:nowrap}
.price-list .price-list__table .price-list__actions{display:block;width:auto}
.price-list .price-list__table :is(.price-list__product,.price-list__product span){max-width:none;width:100%}
}
/* Телефон: цена и действия не помещаются в ряд — действия отдельной строкой во всю ширину, кнопка забирает остаток. */
@media(max-width:600px){
.price-list .price-list__table tr{grid-template-columns:minmax(0,1fr)}
.price-list__action-group{justify-content:flex-start}
.price-list__action-group>.button{flex:1 1 auto;min-width:0}
.price-list__action-group :is(.quantity-stepper__button,[data-product-quantity]),.price-list__action-group>.button{height:2.75rem;min-height:2.75rem}
.price-list__action-group>.favorite-button{width:2.75rem;height:2.75rem;min-width:2.75rem}
}

/* WP image height attributes must not override the service card's responsive ratio. */
.service-feature>img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover}

.order-ways{grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}
.order-ways>li{padding:1.5rem;gap:.75rem}
.order-ways__socials{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:auto}
.order-ways .text-link{overflow-wrap:anywhere;min-width:0}
@media(max-width:900px){.order-ways{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.order-ways{grid-template-columns:minmax(0,1fr)}.order-ways>li{padding:1.25rem}}

/* Vacancies: hub cards and single-page block grid (tokens of the design system). */
.vacancy-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(1rem, 2.5vw, 2rem); padding-block: clamp(1rem, 3vw, 2rem); }
.vacancy-card { display: grid; align-content: start; gap: 1rem; padding: clamp(1.25rem, 2.5vw, 2rem); border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--surface); }
.vacancy-card h2 { font-size: clamp(1.375rem, 2vw, 1.75rem); }
.vacancy-card .page-head__facts { margin: 0; }
.vacancy-card .page-head__facts :is(li, a) { background: var(--surface-2); color: var(--ink); }
.vacancy-card .text-link { justify-self: start; }
.vacancy-empty { padding-block: clamp(1rem, 3vw, 2rem); color: var(--muted); }
.vacancy-date { margin-top: .75rem; opacity: .8; font-size: .875rem; }
.vacancy-grid { display: grid; gap: clamp(1rem, 2.5vw, 2rem); }
.vacancy-grid--1 { grid-template-columns: minmax(0, 1fr); }
.vacancy-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 900px) {
	.vacancy-list, .vacancy-grid--2 { grid-template-columns: minmax(0, 1fr); }
}

/* Single vacancy hero: light warm field, container width, salary opposite the H1.
   Scoped to --single so the vacancies hub keeps its approved treatment. */
body.starina-workshop-honey .vacancy-head--single.page-head--tex { --tex-bg: #efe3d2; --tex-ink: #2c2119; --tex-muted: rgb(44 33 25 / .76); --tex-op: .9; }
/* Hub and single vacancy heroes sit in the .wrap container like every other hero. */
body.starina-workshop-honey .vacancy-head.page-head--tex { width: min(calc(100% - 48px), var(--container)); max-width: var(--container) !important; justify-self: center; margin-inline: auto; }
body.starina-workshop-honey .vacancy-head--single.page-head--tex::before { background-image: url("textures/wood-grain-flow-wide.svg"); }
body.starina-workshop-honey .vacancy-head--single.page-head--tex :is(h1, .crumbs, .crumbs a, .crumbs span, .vacancy-salary b) { color: var(--tex-ink); }
body.starina-workshop-honey .vacancy-head--single.page-head--tex :is(p:not(.eyebrow), .lead) { color: var(--tex-muted) !important; }
body.starina-workshop-honey .vacancy-head--single.page-head--tex .eyebrow { color: #4b2818; }
body.starina-workshop-honey .vacancy-head--single.page-head--tex .eyebrow::before { background: #4b2818; }
body.starina-workshop-honey .vacancy-head--single .vacancy-date { color: var(--tex-muted) !important; opacity: 1; }
.vacancy-head--single .vacancy-date, .vacancy-head--single .vacancy-date time { color: var(--tex-muted, #5a4636) !important; opacity: 1; }
body.starina-workshop-honey .vacancy-head--single .vacancy-social { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; margin-top: 1.25rem; color: var(--tex-muted); font-size: .9375rem; }
body.starina-workshop-honey .vacancy-head--single .vacancy-social .social-links { margin: 0; }
body.starina-workshop-honey .vacancy-head--single .page-head__facts :is(li, a) { background: rgb(255 255 255 / .52); color: #2c2119; }
body.starina-workshop-honey .vacancy-head--single .button:not(.button--ghost):not(.button--outline) { background: #2c2119; border-color: #2c2119; color: #fff; }
body.starina-workshop-honey .vacancy-head--single :is(.button--ghost, .button--outline) { background: transparent !important; border-color: rgb(44 33 25 / .55) !important; color: #2c2119 !important; }
.vacancy-head__top { display: grid; grid-template-columns: auto 1fr; align-items: end; gap: 1rem 2rem; width: 100%; max-width: none; }
.vacancy-head__top h1 { max-width: none; white-space: nowrap; }
.vacancy-salary { justify-self: end; }
.vacancy-salary { margin: 0; display: grid; justify-items: end; line-height: 1.1; }
.vacancy-salary b { font-family: var(--display); font-size: clamp(2rem, 4vw, 3.25rem); font-weight: 700; white-space: nowrap; }
.vacancy-salary span { font-size: .875rem; color: var(--tex-muted); }
@media (max-width: 800px) {
	.vacancy-head__top { grid-template-columns: minmax(0, 1fr); }
	.vacancy-head__top h1 { white-space: normal; }
	.vacancy-salary { justify-self: start; }
	.vacancy-salary { justify-items: start; }
	.vacancy-salary b { font-size: 2rem; }
}

/* Vacancy blocks: icon cards with check marks, then the work gallery. */
.vacancy-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.vacancy-block { display: grid; align-content: start; gap: 1rem; padding: clamp(1.25rem, 2.5vw, 2rem); border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--surface); }
.vacancy-block__head { display: flex; align-items: center; gap: .75rem; }
.vacancy-block__head h2 { margin: 0; font-size: clamp(1.25rem, 1.8vw, 1.5rem); }
.vacancy-block__icon { display: grid; place-items: center; flex: none; width: 2.75rem; height: 2.75rem; border-radius: 50%; background: var(--accent-soft); color: var(--accent-text); }
.vacancy-block .check-list { margin: 0; }
.vacancy-works .mosaic-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .75rem; }
.vacancy-works figure { margin: 0; aspect-ratio: 4 / 3; overflow: hidden; border-radius: var(--r-lg); background: var(--surface-2); }
.vacancy-works img { width: 100%; height: 100%; object-fit: cover; display: block; }
@media (max-width: 1000px) { .vacancy-grid--3 { grid-template-columns: minmax(0, 1fr); } .vacancy-works .mosaic-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

@media (max-width: 1000px) { .vacancy-grid--3 { grid-template-columns: minmax(0, 1fr); } }

/* Заголовок широкой таблицы не уезжает за край экрана при горизонтальной прокрутке (#425). */
@media (max-width: 760px) { .table-scroll .info-table > caption { position: sticky; left: 0; box-sizing: border-box; width: min(620px, calc(100vw - 2rem)); max-width: calc(100vw - 2rem); } }

/* Витрина услуг из пяти карточек: 3 + 2 на широком экране, 2 + 2 + 1 на среднем, одна колонка на телефоне. */
@media(min-width:861px){.services-main:has(>.service-feature:nth-child(5):last-child){grid-template-columns:repeat(6,minmax(0,1fr))}.services-main:has(>.service-feature:nth-child(5):last-child)>.service-feature{grid-column:span 3}.services-main:has(>.service-feature:nth-child(5):last-child)>.service-feature:nth-child(5){grid-column:1/-1}}
@media(min-width:1101px){.services-main:has(>.service-feature:nth-child(5):last-child)>.service-feature{grid-column:span 2}.services-main:has(>.service-feature:nth-child(5):last-child)>.service-feature:nth-child(n+4){grid-column:span 3}}
.services-more:has(>:only-child){grid-template-columns:minmax(0,1fr)}

/* Связанные ссылки в боковых блоках «Клиенту» — тот же компонент .buyer-links (карточки-ссылки), что на хабе: одна колонка, одна ширина. */
:is(.info-callout, .info-box, .info-note) .buyer-links { grid-template-columns: minmax(0, 1fr); margin-top: 1rem; }
:is(.info-callout, .info-box, .info-note) .buyer-links a { display: grid; width: auto; margin: 0; }
:is(.info-callout, .info-box, .info-note) .buyer-links b { display: block; font-size: 1.05rem; }
/* Главная кнопка боковой заметки — accent, без растяжения и лишнего отступа. */
.info-note a.button--accent { display: inline-flex; width: fit-content; margin-top: .5rem; }

/* Нумерованный список: содержимое пункта не разбивается на колонки (жирный заголовок + текст в одну строку потока, #FAQ). */
.number-list li { display: block; position: relative; padding-left: 2.25rem; }
.number-list li::before { position: absolute; left: 0; top: 0; }

/* Ссылки шага таймлайна: под текстом, по краю колонки текста */
.vtimeline__links{display:flex;flex-wrap:wrap;gap:.25rem 1.25rem;justify-content:flex-end}
.vtimeline article:nth-child(even) .vtimeline__links{justify-content:flex-start}
@media (max-width:760px){.vtimeline__links,.vtimeline article:nth-child(even) .vtimeline__links{justify-content:flex-start}}

/* Карточки-шаги «Оплаты» (cards / payment): у них нет внутреннего отступа таймлайна, поэтому заголовок держит штатный отступ .section-heading (styles.css: s8, на телефоне s6), а не .5rem из content.css. */
.info-steps-heading:has(+ .payment-cards) { margin-bottom: var(--s8); }
@media (max-width: 560px) { .info-steps-heading:has(+ .payment-cards) { margin-bottom: var(--s6); } }
/* Тонированный блок сразу под карточкой-героем (Оплата: «Три шага» первым): без зазора фон блока упирается в низ карточки. Отступ — как у .page-head (margin-bottom 2.5rem). */
.info-hero + .section:is(.section--tone, .info-section--quiet) { margin-top: var(--s10); }