/* ==========================================================================
   ГНБ ПРОКОЛ — каркас дизайн-системы Dual Route
   Версия 1.15.1 · 11.08.2026

   Единственный источник правды по сетке, токенам и компонентам.
   Локальные цвета в паттернах и шаблонах запрещены — только --gp-*.
   Префикс проекта: gp (§7.6 инструкции).
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Шрифт

   Geologica — вариативный, self-hosted в assets/fonts/.
   Один файл 67 КБ покрывает веса от 100 до 900: браузер интерполирует
   промежуточные начертания, отдельные файлы под каждый вес не нужны.

   Исходный шрифт вариативен по четырём осям (wght, CRSV, SHRP, slnt).
   Лишние три зафиксированы в нуле при сборке — проекту нужен только вес,
   а каждая ось добавляет вес файлу.

   Выбран за технический характер и широкие уверенные формы: заголовки
   читаются крупно, кириллица родная. Прежний Inter в крупном кегле
   выглядел суше и хуже держал длинные русские слова.

   Отдельного Display-начертания нет — крупные заголовки используют
   то же семейство с большим весом. Переменная --gp-font-display
   сохранена, чтобы не переписывать компоненты.

   Внешние источники шрифтов запрещены (часть X инструкции): запрос
   к иностранному домену передаёт IP посетителя за рубеж.
   Лицензия SIL OFL — OFL.txt лежит рядом со шрифтом.
   Файл исключён из git (.gitignore): при развёртывании темы на новом
   сервере его нужно положить отдельно.
   -------------------------------------------------------------------------- */

@font-face {
	font-family: 'Geologica';
	font-style: normal;
	font-weight: 100 900;
	font-display: swap;
	src: url('fonts/Geologica-Variable.woff2') format('woff2');
}

/* --------------------------------------------------------------------------
   2. Токены проекта
   Соответствие брендбуку Dual Route v1.1 — один к одному по значениям,
   имена префиксованы во избежание коллизий с переменными Blocksy.
   -------------------------------------------------------------------------- */

:root {
	--gp-ink: #0C2531;
	--gp-ink-2: #123642;
	--gp-paper: #F8FAFA;
	--gp-white: #FFFFFF;
	--gp-warm: #F3EEE6;
	--gp-warm-2: #E9E0D4;
	--gp-mint: #7BD0C8;
	--gp-mint-soft: #E7F4F2;
	--gp-signal: #E05F35;
	--gp-signal-dark: #B94224;
	--gp-text: #172127;
	--gp-muted: #67757C;
	--gp-line: #D3DCDF;
	--gp-line-dark: #2C4651;
	--gp-success: #167E74;
	--gp-danger: #B94E36;

	--gp-on-ink: #F7FBFB;
	--gp-on-ink-muted: #B8C9CE;
	--gp-on-warm-muted: #6D6964;
	--gp-menu: #32424A;

	--gp-radius: 3px;
	--gp-wrap: min(1280px, calc(100vw - 48px));
	--gp-gutter-edge: max(24px, calc((100vw - 1280px) / 2 + 24px));

	--gp-font: 'Geologica', 'Segoe UI', Arial, Helvetica, sans-serif;
	--gp-font-display: 'Geologica', 'Segoe UI', Arial, sans-serif;

	/* шкала отступов: 4 / 8 / 12 / 16 / 24 / 32 / 48 / 64 / 96 */
	--gp-s1: 4px;
	--gp-s2: 8px;
	--gp-s3: 12px;
	--gp-s4: 16px;
	--gp-s5: 24px;
	--gp-s6: 32px;
	--gp-s7: 48px;
	--gp-s8: 64px;
	--gp-s9: 96px;

	/* Переопределение акцента Blocksy: дефолтный синий не входит в палитру */
	--theme-palette-color-1: #E05F35;
	--theme-palette-color-2: #B94224;
	--theme-link-initial-color: #0C2531;
	--theme-link-hover-color: #E05F35;
}

/* --------------------------------------------------------------------------
   3. База и типографика
   -------------------------------------------------------------------------- */

body {
	font-family: var(--gp-font);
	color: var(--gp-text);
	background: var(--gp-paper);
	-webkit-font-smoothing: antialiased;
}

.gp-wrap {
	width: var(--gp-wrap);
	margin-inline: auto;
}

.gp-kicker {
	font-size: 11px;
	font-weight: 800;
	letter-spacing: .12em;
	text-transform: uppercase;
	margin: 0 0 var(--gp-s3);
	color: var(--gp-muted);
}

.gp-section--ink .gp-kicker { color: var(--gp-mint); }
.gp-section--warm .gp-kicker { color: var(--gp-signal); }

.gp-h2 {
	font-family: var(--gp-font-display);
	font-weight: 720;
	font-size: clamp(34px, 4vw, 54px);
	line-height: .99;
	letter-spacing: -.015em;
	margin: 0;
	max-width: 20ch;
}

.gp-h3 {
	font-size: 20px;
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: -.02em;
	margin: 0;
}

/* Длина строки 50–55 знаков: сплошной текст на всю ширину не читается */
.gp-lead {
	font-size: 16px;
	line-height: 1.65;
	color: var(--gp-muted);
	margin: 0;
	max-width: 52ch;
}

.gp-section--ink .gp-lead { color: var(--gp-on-ink-muted); }
.gp-section--warm .gp-lead { color: var(--gp-on-warm-muted); }

.gp-note {
	font-size: 13px;
	line-height: 1.6;
	color: var(--gp-muted);
	margin: var(--gp-s5) 0 0;
	max-width: 62ch;
}

/* Шапка секции: заголовок слева, лид справа */
.gp-head {
	display: grid;
	grid-template-columns: minmax(340px, .9fr) 1.4fr;
	gap: var(--gp-s8);
	align-items: end;
	margin-bottom: var(--gp-s6);
}

/* --------------------------------------------------------------------------
   4. Секции и фоны
   Соседние секции не должны совпадать по фону (§10 инструкции).
   -------------------------------------------------------------------------- */

/* Вертикальный ритм секций. Значения — половина исходных:
   на длинной странице с восемью и более блоками крупные поля
   разгоняют прокрутку сильнее, чем помогают читать. */
.gp-section { padding: var(--gp-s7) 0; }
.gp-section--tight { padding: var(--gp-s6) 0; }

.gp-section--white { background: var(--gp-white); }
.gp-section--paper { background: var(--gp-paper); }
.gp-section--warm  { background: var(--gp-warm); }
.gp-section--ink   { background: var(--gp-ink); color: var(--gp-on-ink); }

.gp-section--ink .gp-h2,
.gp-section--ink .gp-h3 { color: var(--gp-white); }

.gp-section--bordered { border-top: 1px solid var(--gp-line); }

/* --------------------------------------------------------------------------
   5. Кнопки и ссылки
   Стили ложатся поверх разметки core/button: класс .gp-btn на wp-block-button.
   -------------------------------------------------------------------------- */

.gp-btn .wp-block-button__link,
a.gp-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--gp-s2);
	min-height: 46px;
	padding: 0 18px;
	border-radius: var(--gp-radius);
	border: 1px solid transparent;
	font-size: 12px;
	font-weight: 850;
	letter-spacing: .04em;
	text-transform: uppercase;
	text-decoration: none;
	transition: background-color 140ms ease, border-color 140ms ease, color 140ms ease;
}

.gp-btn--mint .wp-block-button__link,
a.gp-btn--mint { background: var(--gp-mint); color: var(--gp-ink); }
.gp-btn--mint .wp-block-button__link:hover,
a.gp-btn--mint:hover { background: #6AC3BA; }

.gp-btn--signal .wp-block-button__link,
a.gp-btn--signal { background: var(--gp-signal); color: var(--gp-white); }
.gp-btn--signal .wp-block-button__link:hover,
a.gp-btn--signal:hover { background: var(--gp-signal-dark); }

.gp-btn--ink .wp-block-button__link,
a.gp-btn--ink { background: var(--gp-ink); color: var(--gp-white); }
.gp-btn--ink .wp-block-button__link:hover,
a.gp-btn--ink:hover { background: var(--gp-ink-2); }

.gp-btn--outline-dark .wp-block-button__link,
a.gp-btn--outline-dark { background: transparent; border-color: #8B8379; color: #373431; }
.gp-btn--outline-dark .wp-block-button__link:hover,
a.gp-btn--outline-dark:hover { border-color: var(--gp-ink); }

.gp-btn--outline-light .wp-block-button__link,
a.gp-btn--outline-light { background: transparent; border-color: #65808B; color: var(--gp-white); }
.gp-btn--outline-light .wp-block-button__link:hover,
a.gp-btn--outline-light:hover { border-color: var(--gp-mint); color: var(--gp-mint); }

.gp-link {
	display: inline-flex;
	align-items: center;
	gap: var(--gp-s2);
	font-size: 12px;
	font-weight: 800;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--gp-signal);
	text-decoration: none;
	border-bottom: 1px solid transparent;
}

.gp-link:hover { border-bottom-color: currentColor; }

:where(a, button, input, textarea, select):focus-visible {
	outline: 2px solid var(--gp-signal);
	outline-offset: 2px;
}

/* --------------------------------------------------------------------------
   6. Hero Dual Route
   Общая главная — равноправный split 50/50.
   -------------------------------------------------------------------------- */

.gp-hero {
	position: relative;
	display: grid;
	grid-template-columns: 1fr 1fr;
	min-height: 540px;
	overflow: hidden;
	border-bottom: 1px solid var(--gp-line);
}

.gp-hero__panel {
	position: relative;
	z-index: 2;
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	align-self: stretch;
	padding: 80px var(--gp-gutter-edge) 72px;
}

.gp-hero__panel--b2b {
	background: var(--gp-ink);
	color: var(--gp-on-ink);
	padding-right: 72px;
}

.gp-hero__panel--b2c {
	background: var(--gp-warm);
	color: #292C2C;
	padding-left: 72px;
}

.gp-hero__panel--b2b .gp-kicker { color: var(--gp-mint); }
.gp-hero__panel--b2c .gp-kicker { color: var(--gp-signal); }

.gp-hero h1,
.gp-hero .gp-hero__title {
	font-family: var(--gp-font-display);
	font-weight: 760;
	font-size: clamp(42px, 4.4vw, 68px);
	line-height: .94;
	letter-spacing: -.02em;
	margin: 0;
	max-width: 13ch;
}

.gp-hero__panel--b2b .gp-hero__title { color: var(--gp-white); }

.gp-hero p {
	font-size: 16px;
	line-height: 1.65;
	margin: var(--gp-s5) 0 0;
	max-width: 40ch;
}

.gp-hero__panel--b2b p { color: var(--gp-on-ink-muted); }

/* Разделитель и узел маршрутов.
   Узел — элемент схемы Dual Route, не логотип. Держим в CSS,
   чтобы редактор не мог удалить его из разметки. */
.gp-hero::before {
	content: '';
	position: absolute;
	top: 0;
	bottom: 0;
	left: 50%;
	width: 1px;
	background: rgba(255, 255, 255, .8);
	z-index: 5;
}

.gp-hero::after {
	content: '';
	position: absolute;
	z-index: 7;
	left: calc(50% - 25px);
	top: 50%;
	margin-top: -25px;
	width: 50px;
	height: 50px;
	border-radius: 50%;
	background: var(--gp-white);
	border: 9px solid var(--gp-signal);
	box-shadow: 0 0 0 11px rgba(255, 255, 255, .20);
}

/* Фирменная траектория. Цвет наследуется от родителя (§10). */
.gp-hero__route {
	position: absolute;
	z-index: 6;
	left: 0;
	right: 0;
	bottom: 52px;
	width: 100%;
	height: 128px;
	pointer-events: none;
	opacity: .86;
	color: var(--gp-signal);
}

/* --------------------------------------------------------------------------
   7. Fact strip
   -------------------------------------------------------------------------- */

.gp-facts {
	background: var(--gp-white);
	border-bottom: 1px solid var(--gp-line);
}

.gp-facts__grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
}

.gp-fact {
	padding: var(--gp-s5);
	border-right: 1px solid var(--gp-line);
}

.gp-fact:first-child { padding-left: 0; }
.gp-fact:last-child { border-right: 0; }

.gp-fact__label {
	display: block;
	font-size: 10px;
	font-weight: 800;
	letter-spacing: .11em;
	text-transform: uppercase;
	color: #77868D;
	margin-bottom: var(--gp-s2);
}

.gp-fact__value {
	display: block;
	font-size: 14px;
	line-height: 1.4;
	font-weight: 600;
	max-width: 30ch;
}

/* --------------------------------------------------------------------------
   8. Задача: две колонки ссылок
   Архитектурная сетка на общих линиях вместо плавающих карточек.
   -------------------------------------------------------------------------- */

.gp-tasks {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: var(--gp-s8);
}

.gp-tasks__col h3 {
	font-size: 11px;
	font-weight: 800;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--gp-muted);
	margin: 0 0 var(--gp-s4);
	padding-bottom: var(--gp-s3);
	border-bottom: 1px solid var(--gp-line);
}

.gp-tasks__list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.gp-tasks__list li { border-bottom: 1px solid var(--gp-line); }

.gp-tasks__list a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--gp-s4);
	min-height: 52px;
	padding: var(--gp-s3) 0;
	font-size: 15px;
	font-weight: 600;
	color: var(--gp-text);
	text-decoration: none;
}

.gp-tasks__list a::after {
	content: '→';
	color: var(--gp-line);
	font-weight: 400;
}

.gp-tasks__list a:hover { color: var(--gp-signal); }
.gp-tasks__list a:hover::after { color: var(--gp-signal); }

/* --------------------------------------------------------------------------
   9. Матрица границ работ — фирменный B2B-модуль
   Ограничения не заливаются красным: Signal только в точке статуса.
   -------------------------------------------------------------------------- */

.gp-scope {
	display: grid;
	grid-template-columns: 1fr 1fr;
	border: 1px solid var(--gp-line);
	background: var(--gp-white);
}

.gp-scope__col { padding: var(--gp-s6) var(--gp-s6) var(--gp-s7); }
.gp-scope__col + .gp-scope__col { border-left: 1px solid var(--gp-line); }

.gp-scope__col h3 {
	font-size: 22px;
	font-weight: 700;
	letter-spacing: -.015em;
	margin: 0 0 var(--gp-s5);
}

.gp-scope__list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.gp-scope__list li {
	position: relative;
	padding: var(--gp-s4) 0 var(--gp-s4) var(--gp-s5);
	border-top: 1px solid var(--gp-line);
	font-size: 15px;
	line-height: 1.5;
}

.gp-scope__list li::before {
	content: '';
	position: absolute;
	left: 0;
	top: 22px;
	width: 8px;
	height: 8px;
	border-radius: 50%;
}

.gp-scope__col--in .gp-scope__list li::before { background: var(--gp-success); }
.gp-scope__col--out .gp-scope__list li::before { background: var(--gp-signal); }

.gp-scope__list b { display: block; font-weight: 700; }

.gp-scope__list span {
	display: block;
	margin-top: var(--gp-s1);
	font-size: 13px;
	line-height: 1.55;
	color: var(--gp-muted);
}

/* --------------------------------------------------------------------------
   10. Рабочий маршрут — без декоративных номеров
   -------------------------------------------------------------------------- */

.gp-route {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	border-top: 1px solid var(--gp-line);
}

.gp-route__step {
	position: relative;
	padding: var(--gp-s6) var(--gp-s5) var(--gp-s5) 0;
}

.gp-route__step + .gp-route__step {
	padding-left: var(--gp-s5);
	border-left: 1px solid var(--gp-line);
}

.gp-route__step::before {
	content: '';
	position: absolute;
	top: -5px;
	left: 0;
	width: 9px;
	height: 9px;
	border-radius: 50%;
	background: var(--gp-signal);
}

.gp-route__step + .gp-route__step::before { left: var(--gp-s5); }

.gp-route__label {
	display: block;
	font-size: 10px;
	font-weight: 800;
	letter-spacing: .11em;
	text-transform: uppercase;
	color: var(--gp-signal);
	margin-bottom: var(--gp-s3);
}

.gp-route__step b {
	display: block;
	font-size: 17px;
	line-height: 1.3;
	letter-spacing: -.02em;
	margin-bottom: var(--gp-s2);
}

.gp-route__step p {
	margin: 0;
	font-size: 14px;
	line-height: 1.6;
	color: var(--gp-muted);
}

/* На кремовом фоне линии тёплые, иначе холодный серый выбивается */
.gp-section--warm .gp-route,
.gp-section--warm .gp-route__step + .gp-route__step { border-color: var(--gp-warm-2); }
.gp-section--warm .gp-route__step p { color: var(--gp-on-warm-muted); }

/* --------------------------------------------------------------------------
   10.1. Примеры работ — фотодоказательства под рабочим маршрутом

   Исходники снимков 698–720 × 1280 px: это потолок, апскейл запрещён —
   выжженная подпись с координатами перестаёт читаться, а она и есть
   доказательство. Отсюда три колонки на десктопе (≈410 px на кадр,
   запас 1,7× к исходнику), а не две.

   Пропорции кадров расходятся на 3 %: 720 × 1280 у двух снимков (ровно 9:16)
   и 698–708 × 1280 у остальных четырёх. Рамка задана по 9:16, кадр заполняет
   её целиком, лишняя высота срезается сверху — object-position: 50% 100%
   прибивает снимок к нижнему краю.

   Срезается ≈23 px из 751 на десктопе, то есть 3 % от верха кадра, где небо
   и грунт. Выжженная подпись GPS с координатами и датой стоит внизу и не
   затрагивается принципиально: она и есть доказательство выполненной работы.
   Резать её нельзя ни при каких правках этого блока.

   Прежний вариант с object-fit: contain оставлял у четырёх узких кадров
   тёмные поля по бокам — отклонён владельцем 11.08.2026.
   -------------------------------------------------------------------------- */

.gp-works { margin-top: var(--gp-s8); }

.gp-works__head {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: var(--gp-s5);
	align-items: end;
	margin-bottom: var(--gp-s6);
}

.gp-works__title {
	margin: 0;
	font-size: 28px;
	line-height: 1.15;
	letter-spacing: -.015em;
}

.gp-works__note {
	margin: 0;
	font-size: 14px;
	line-height: 1.6;
	color: var(--gp-muted);
}

.gp-works__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: var(--gp-s6) var(--gp-s5);
}

.gp-works__item { margin: 0; }

.gp-works__frame {
	aspect-ratio: 9 / 16;
	background: var(--gp-ink);
	border-radius: var(--gp-radius);
	overflow: hidden;
}

/* Кадр прибит к низу: срезается только верх, подпись с координатами цела */
.gp-works__img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: 50% 100%;
}

.gp-works__cap {
	display: block;
	margin-top: var(--gp-s4);
	padding-top: var(--gp-s4);
	border-top: 1px solid var(--gp-line);
}

.gp-works__place {
	display: block;
	font-size: 15px;
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: -.01em;
}

.gp-works__desc {
	display: block;
	margin-top: var(--gp-s1);
	font-size: 13px;
	line-height: 1.55;
	color: var(--gp-muted);
}

/* Дата набрана как метка шага маршрута — блок живёт внутри той же секции */
.gp-works__date {
	display: block;
	margin-top: var(--gp-s2);
	font-size: 10px;
	font-weight: 800;
	letter-spacing: .11em;
	text-transform: uppercase;
	color: var(--gp-signal);
}

/* На кремовом фоне линии тёплые, иначе холодный серый выбивается */
.gp-section--warm .gp-works__cap { border-color: var(--gp-warm-2); }
.gp-section--warm .gp-works__desc { color: var(--gp-on-warm-muted); }


/* --------------------------------------------------------------------------
   11. Результат — Ink-секция
   -------------------------------------------------------------------------- */

.gp-deliver {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	border-top: 1px solid var(--gp-line);
}

.gp-deliver__item { padding: var(--gp-s6) var(--gp-s5) 0 0; }

.gp-deliver__item + .gp-deliver__item {
	padding-left: var(--gp-s5);
	border-left: 1px solid var(--gp-line);
}

.gp-deliver__item svg {
	width: 26px;
	height: 26px;
	stroke: var(--gp-signal);
	fill: none;
	stroke-width: 1.6;
	margin-bottom: var(--gp-s4);
}

.gp-deliver__item b {
	display: block;
	font-size: 16px;
	line-height: 1.35;
	color: var(--gp-text);
	margin-bottom: var(--gp-s2);
}

.gp-deliver__item p {
	margin: 0;
	font-size: 13px;
	line-height: 1.6;
	color: var(--gp-muted);
	max-width: 40ch;
}

/* Вариант на кремовом фоне */
.gp-section--warm .gp-deliver,
.gp-section--warm .gp-deliver__item + .gp-deliver__item { border-color: var(--gp-warm-2); }
.gp-section--warm .gp-deliver__item p { color: var(--gp-on-warm-muted); }

/* Вариант на тёмном фоне — компонент используется и на Ink-секциях */
.gp-section--ink .gp-deliver,
.gp-section--ink .gp-deliver__item + .gp-deliver__item { border-color: var(--gp-line-dark); }
.gp-section--ink .gp-deliver__item svg { stroke: var(--gp-mint); }
.gp-section--ink .gp-deliver__item b { color: var(--gp-white); }
.gp-section--ink .gp-deliver__item p { color: var(--gp-on-ink-muted); }

/* --------------------------------------------------------------------------
   12. Повторный CTA-ряд
   -------------------------------------------------------------------------- */

.gp-ctarow {
	display: flex;
	align-items: center;
	gap: var(--gp-s5);
	flex-wrap: wrap;
	padding: var(--gp-s6) 0;
	border-top: 1px solid var(--gp-line);
	border-bottom: 1px solid var(--gp-line);
}

.gp-ctarow__text {
	flex: 1 1 320px;
	margin: 0;
	font-size: 16px;
	font-weight: 600;
	line-height: 1.5;
}

.gp-ctarow .wp-block-buttons { gap: 10px; }

/* --------------------------------------------------------------------------
   13. Интеграция с WordPress и Blocksy

   Ядро WP добавляет :where(.is-layout-flow) > * { margin-block-start: 24px }.
   В сетках это ломает выравнивание: вторая колонка съезжает вниз,
   между секциями появляются полосы. Гасим адресно.
   -------------------------------------------------------------------------- */

.gp-hero > *,
.gp-facts > *,
.gp-section > *,
.gp-head > *,
.gp-head > * > *,
.gp-ctarow > * {
	margin-block-start: 0;
	margin-block-end: 0;
}

.gp-hero__panel > * { margin-block: 0; }
.gp-hero__panel > .gp-kicker { margin-bottom: var(--gp-s3); }
.gp-hero__panel > p { margin-top: var(--gp-s5); }
.gp-head .gp-kicker { margin-bottom: var(--gp-s3); }

/* Главная: секции идут встык и от края до края.
   Blocksy даёт контейнеру data-vertical-spacing и 60px по вертикали —
   на главной первый экран должен начинаться сразу под шапкой.
   Только на главной: на остальных страницах воздух под шапкой нужен. */
body.home .site-main > [data-vertical-spacing] {
	padding-block-start: 0;
	padding-block-end: 0;
}

body.home .entry-content > * {
	margin-block-start: 0;
	margin-block-end: 0;
}

body.home .entry-content > .alignfull {
	margin-inline: 0;
	max-width: none;
	width: auto;
}

/* --------------------------------------------------------------------------
   14. Шапка Blocksy

   Wordmark ГНБ●ПРОКОЛ. Название сайта в базе остаётся текстовым
   («ГНБ Прокол») — оно уходит в <title> и в микроразметку,
   HTML туда класть нельзя. Поэтому написание собирается псевдоэлементами,
   а точка рисуется градиентом: без картинок, без JS, без правки опции.
   -------------------------------------------------------------------------- */

/* Верхняя полоса: география слева, контакты справа.
   Выводится хуком blocksy:header:before из inc/contacts.php.
   Светлая, отделена от шапки тонкой линией — по правилу пропорции цвета
   Ink не должен растекаться по мелким служебным элементам. */
.gp-topbar {
	background: var(--gp-paper);
	border-bottom: 1px solid var(--gp-line);
	font-size: 12.5px;
	line-height: 1.4;
	color: var(--gp-muted);
}

/* Ширину и боковые отступы задаёт .ct-container родительской темы —
   так края полосы совпадают с краями шапки на всех брейкпоинтах */
.gp-topbar__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--gp-s5);
	min-height: 42px;
}

.gp-topbar__geo {
	display: inline-flex;
	align-items: center;
	gap: var(--gp-s2);
	letter-spacing: .02em;
}

.gp-topbar__label {
	font-weight: 700;
	color: var(--gp-text);
}

.gp-topbar__contacts {
	display: flex;
	align-items: center;
	white-space: nowrap;
}

/* Вертикальные разделители между контактами */
.gp-topbar__item {
	display: inline-flex;
	align-items: center;
	gap: var(--gp-s2);
	padding: var(--gp-s3) 0 var(--gp-s3) var(--gp-s5);
	margin-left: var(--gp-s5);
	border-left: 1px solid var(--gp-line);
	color: var(--gp-text);
	font-weight: 600;
	text-decoration: none;
	transition: color 140ms ease;
}

.gp-topbar__contacts > :first-child .gp-topbar__item,
.gp-topbar__contacts > .gp-topbar__item:first-child {
	border-left: 0;
	margin-left: 0;
	padding-left: 0;
}

.gp-topbar__item:hover { color: var(--gp-signal); }
.gp-topbar__phone { font-weight: 700; }

/* Иконки контурные, цвет наследуется через currentColor */
.gp-topbar .gp-icon {
	flex: 0 0 auto;
	color: var(--gp-signal);
}

.gp-topbar__item:hover .gp-icon { color: var(--gp-signal-dark); }

.ct-header .site-title a {
	display: inline-flex;
	align-items: center;
	font-family: var(--gp-font-display);
	font-weight: 900;
	font-size: 0;
	line-height: 1;
	letter-spacing: -.015em;
	color: var(--gp-ink);
	text-decoration: none;
	white-space: nowrap;
}

.ct-header .site-title a::before {
	content: 'ГНБ';
	font-size: 22px;
}

.ct-header .site-title a::after {
	content: 'ПРОКОЛ';
	font-size: 22px;
	padding-left: 15px;
	background-image: radial-gradient(circle 4.5px at 7px 52%, var(--gp-signal) 99%, rgba(0, 0, 0, 0) 100%);
	background-repeat: no-repeat;
}

/* ВАЖНО про специфичность.
   Blocksy позиционирует и меряет шапку ID-селекторами:
       #header { position: relative; z-index: 50 }
       #header [data-row] > div { min-height: var(--shrink-height, var(--height)) }
   Это 1,0,0 и 1,0,1. Любое правило на классах (0,x,y) слабее независимо
   от порядка загрузки файлов. Поэтому здесь тоже используется #header —
   это не «утяжеление селектора ради победы», а единственный корректный вес.

   Высота ряда меняется через --height, а не через min-height:
   переменная участвует и в расчёте shrink-состояния. */
#header [data-row*="middle"] {
	--height: 90px;
}

#header [data-row="middle"] > .ct-container {
	padding-block: 0;
}

/* Шапка залипает при прокрутке. По брендбуку — лёгкий blur
   и тонкая линия, без тяжёлой тени. Верхняя полоса уезжает вместе
   с контентом: в залипшем состоянии нужен только бренд и меню. */
#header.ct-header {
	position: sticky;
	top: 0;
	z-index: 100;
	background: rgba(255, 255, 255, .94);
	backdrop-filter: blur(14px);
	-webkit-backdrop-filter: blur(14px);
	border-bottom: 1px solid var(--gp-line);
}

body.admin-bar #header.ct-header { top: 32px; }

/* overflow-x: hidden у предка молча отключает position: sticky.
   Blocksy ставит его на body в main.min.css; clip даёт тот же
   визуальный эффект, но sticky сохраняет. */
html,
body {
	overflow-x: clip;
}

@media (max-width: 782px) {
	body.admin-bar #header.ct-header { top: 46px; }
}

.ct-header .ct-menu-link {
	color: var(--gp-menu);
	transition: color 140ms ease;
}

.ct-header .menu-item:hover > .ct-menu-link,
.ct-header .ct-menu-link:focus-visible { color: var(--gp-signal); }

.ct-header .current-menu-item > .ct-menu-link,
.ct-header .current_page_item > .ct-menu-link,
.ct-header .current-menu-ancestor > .ct-menu-link { color: var(--gp-ink); }

.ct-header .ct-header-search:hover .ct-icon,
.ct-header .ct-header-search:focus-visible .ct-icon {
	fill: var(--gp-signal);
	color: var(--gp-signal);
}

/* Главный CTA в шапке — элемент «Кнопка» конструктора Blocksy.

   Раньше это был пункт меню с классом gp-nav-cta. Внутри <ul> он подчинялся
   флексу списка и гриду колонки, причём Blocksy явно разрешает колонкам
   сжиматься меньше содержимого (`[data-column=end] { min-width: 0 }`) —
   текст выезжал за фон, и обойти это правилами не удалось.
   Отдельный элемент колонки от всей цепочки ограничений свободен.

   Цвет Ink — нейтральный CTA, не принадлежащий ни B2B-, ни B2C-маршруту:
   Mint и Signal остаются за кнопками внутри hero. */
#header .ct-header-cta > .ct-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	padding: 0 22px;
	background: var(--gp-ink);
	color: var(--gp-white);
	border: 0;
	border-radius: var(--gp-radius);
	font-family: var(--gp-font);
	font-size: 12px;
	font-weight: 800;
	letter-spacing: .04em;
	text-transform: uppercase;
	text-decoration: none;
	white-space: nowrap;
	transition: background-color 140ms ease;
}

#header .ct-header-cta > .ct-button:hover,
#header .ct-header-cta > .ct-button:focus-visible {
	background: var(--gp-ink-2);
	color: var(--gp-white);
}

#header .ct-header-cta { margin-inline-start: var(--gp-s3); }

/* Кнопка в мобильном раскрытии — отдельный элемент офканваса,
   не тот же, что в десктопном ряду. Панель тёмная, поэтому Ink на ней
   почти сливается: берём Mint, он и есть акцент для тёмных полей. */
/* Боковых отступов у обёртки нет: они добавлялись поверх собственных
   отступов панели, и кнопка уезжала правее пунктов меню.
   Отступ наследуется от контейнера офканваса — левый край совпадает
   с текстом пунктов при любых настройках Blocksy. */
#offcanvas .ct-header-cta,
.ct-panel .ct-header-cta {
	display: block;
	margin: var(--gp-s5) 0 0;
	padding-inline: 0;
}

#offcanvas .ct-header-cta > .ct-button,
.ct-panel .ct-header-cta > .ct-button {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	min-height: 50px;
	padding: 0 20px;
	background: var(--gp-mint);
	color: var(--gp-ink);
	border: 0;
	border-radius: var(--gp-radius);
	font-family: var(--gp-font);
	font-size: 13px;
	font-weight: 800;
	letter-spacing: .04em;
	text-transform: uppercase;
	text-decoration: none;
	white-space: nowrap;
}

#offcanvas .ct-header-cta > .ct-button:hover,
.ct-panel .ct-header-cta > .ct-button:hover {
	background: #6AC3BA;
	color: var(--gp-ink);
}

.entry-content a:not(.wp-block-button__link):not(.gp-link):hover { color: var(--gp-signal); }

/* --------------------------------------------------------------------------
   15. География
   -------------------------------------------------------------------------- */

.gp-geo {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: var(--gp-s8);
	border-top: 1px solid var(--gp-line);
	padding-top: var(--gp-s6);
}

.gp-geo__col h3 {
	font-size: 11px;
	font-weight: 800;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--gp-muted);
	margin: 0 0 var(--gp-s4);
}

.gp-geo__lead {
	font-size: 17px;
	line-height: 1.55;
	margin: 0 0 var(--gp-s4);
	max-width: 44ch;
}

.gp-geo__cities {
	display: flex;
	flex-wrap: wrap;
	gap: var(--gp-s2);
}

.gp-geo__cities span {
	display: inline-block;
	padding: 7px 13px;
	border: 1px solid var(--gp-line);
	border-radius: var(--gp-radius);
	font-size: 14px;
	background: var(--gp-white);
}

.gp-geo__regions {
	list-style: none;
	margin: 0;
	padding: 0;
}

.gp-geo__regions li {
	display: flex;
	justify-content: space-between;
	gap: var(--gp-s4);
	padding: var(--gp-s3) 0;
	border-bottom: 1px solid var(--gp-line);
	font-size: 15px;
}

.gp-geo__regions b { font-weight: 600; }

.gp-geo__regions em {
	font-style: normal;
	color: var(--gp-muted);
	font-size: 13px;
}

/* --------------------------------------------------------------------------
   16. FAQ

   Аккордеон на нативном <details>: без JavaScript, текст целиком
   присутствует в HTML и доступен поисковому роботу и скринридерам.
   Из этой же разметки собирается схема FAQPage — см. inc/schema.php.
   -------------------------------------------------------------------------- */

.gp-faq { border-top: 1px solid var(--gp-line); }

.gp-faq details { border-bottom: 1px solid var(--gp-line); }

.gp-faq summary {
	position: relative;
	list-style: none;
	cursor: pointer;
	padding: var(--gp-s5) 44px var(--gp-s5) 0;
	font-size: 17px;
	font-weight: 600;
	line-height: 1.4;
}

.gp-faq summary::-webkit-details-marker { display: none; }

.gp-faq summary::after {
	content: '';
	position: absolute;
	right: 8px;
	top: 50%;
	width: 11px;
	height: 11px;
	margin-top: -8px;
	border-right: 2px solid var(--gp-signal);
	border-bottom: 2px solid var(--gp-signal);
	transform: rotate(45deg);
	transition: transform 180ms ease;
}

.gp-faq details[open] summary::after {
	transform: rotate(225deg);
	margin-top: -3px;
}

.gp-faq summary:focus-visible {
	outline: 2px solid var(--gp-signal);
	outline-offset: 2px;
}

.gp-faq__a {
	padding: 0 60px var(--gp-s5) 0;
	font-size: 15px;
	line-height: 1.7;
	color: var(--gp-muted);
	max-width: 84ch;
}

.gp-faq__a p { margin: 0 0 var(--gp-s3); }
.gp-faq__a p:last-child { margin: 0; }

.gp-faq__a a {
	color: var(--gp-signal);
	text-decoration: none;
	border-bottom: 1px solid rgba(224, 95, 53, .35);
}

.gp-faq__a a:hover { border-bottom-color: var(--gp-signal); }

/* --------------------------------------------------------------------------
   17. Подвал
   Выводится хуком blocksy:footer:before из inc/footer.php.
   Штатный подвал темы скрыт: в нём была только строка копирайта Blocksy.
   Карта разделов не дублируется — шапка липкая и доступна с любой точки.
   -------------------------------------------------------------------------- */

.gp-footer {
	background: var(--gp-ink);
	color: var(--gp-on-ink-muted);
	font-size: 14px;
	line-height: 1.6;
}

.gp-footer__inner { padding-block: var(--gp-s7) var(--gp-s5); }

.gp-footer__cols {
	display: grid;
	grid-template-columns: 1.5fr 1.2fr 1fr;
	gap: var(--gp-s8);
	padding-bottom: var(--gp-s5);
}

.gp-footer__logo {
	display: inline-block;
	font-family: var(--gp-font-display);
	font-weight: 900;
	font-size: 20px;
	line-height: 1;
	letter-spacing: -.015em;
	color: var(--gp-white);
}

.gp-footer__logo b { color: var(--gp-signal); font-weight: 900; }

.gp-footer__about {
	margin: var(--gp-s3) 0 0;
	max-width: 40ch;
}

.gp-footer__geo { margin: var(--gp-s2) 0 0; }

.gp-footer__title {
	font-size: 12px;
	font-weight: 800;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--gp-mint);
	margin: 0 0 var(--gp-s4);
}

.gp-footer a {
	color: var(--gp-on-ink-muted);
	text-decoration: none;
	transition: color 140ms ease;
}

.gp-footer a:hover { color: var(--gp-mint); }

.gp-footer__phone {
	display: block;
	font-size: 19px;
	font-weight: 700;
	color: var(--gp-white);
	letter-spacing: -.01em;
}

.gp-footer__mail { display: block; margin-top: var(--gp-s2); }

/* Реквизиты построчно: контрагент сканирует их глазами,
   сплошная строка для этого не годится. */
/* Один цвет на весь текст подвала, кроме заголовков колонок:
   три оттенка серого в одном блоке читаются как небрежность.
   Иерархию задаёт кегль, а не цвет. */
.gp-footer__reqs {
	font-size: 13px;
	line-height: 1.65;
}

.gp-footer__reqs span { display: block; }

.gp-footer__bottom {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--gp-s3) var(--gp-s5);
	flex-wrap: wrap;
	padding-top: var(--gp-s4);
	border-top: 1px solid var(--gp-line-dark);
	font-size: 13px;
}

.gp-footer__legal-menu {
	display: flex;
	flex-wrap: wrap;
	gap: var(--gp-s5);
	list-style: none;
	margin: 0;
	padding: 0;
}

/* --------------------------------------------------------------------------
   18. Адаптив
   Мобильная версия проектируется первой: прораб и собственник участка
   открывают сайт с телефона прямо на объекте.
   -------------------------------------------------------------------------- */

@media (max-width: 1100px) {
	:root { --gp-wrap: min(900px, calc(100vw - 40px)); }

	.gp-head { grid-template-columns: 1fr; gap: var(--gp-s5); }
	.gp-facts__grid { grid-template-columns: repeat(2, 1fr); }
	.gp-fact:nth-child(2) { border-right: 0; }
	.gp-fact:nth-child(3),
	.gp-fact:nth-child(4) { border-top: 1px solid var(--gp-line); }
	.gp-fact:nth-child(3) { padding-left: 0; }
	.gp-route { grid-template-columns: repeat(2, 1fr); }
	.gp-deliver { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 900px) {
	.gp-section { padding: var(--gp-s6) 0; }
	.gp-section--tight { padding: var(--gp-s5) 0; }

	/* Панели hero вертикально, B2B сверху */
	.gp-hero { grid-template-columns: 1fr; min-height: 0; }
	.gp-hero__panel { padding: 56px 20px 48px; }
	.gp-hero__panel--b2b { padding-right: 20px; }
	.gp-hero__panel--b2c { padding-left: 20px; }

	.gp-hero::before {
		left: 0;
		right: 0;
		top: auto;
		bottom: auto;
		width: auto;
		height: 1px;
	}

	.gp-hero::after { display: none; }
	.gp-hero__route { display: none; }

	.gp-hero h1,
	.gp-hero .gp-hero__title { font-size: clamp(34px, 9vw, 46px); max-width: none; }

	/* Сложные конструкции — последовательными блоками,
	   без горизонтального скролла */
	.gp-tasks { grid-template-columns: 1fr; gap: var(--gp-s6); }
	.gp-scope { grid-template-columns: 1fr; }
	.gp-scope__col + .gp-scope__col { border-left: 0; border-top: 1px solid var(--gp-line); }
	.gp-route { grid-template-columns: 1fr; }
	.gp-route__step + .gp-route__step { border-left: 0; padding-left: 0; }
	.gp-route__step + .gp-route__step::before { left: 0; }
	.gp-works__head { grid-template-columns: 1fr; align-items: start; }
	.gp-works__grid { grid-template-columns: repeat(2, 1fr); }
	.gp-deliver { grid-template-columns: 1fr; }
	.gp-deliver__item + .gp-deliver__item { border-left: 0; padding-left: 0; }

	/* Минимальная кликабельная зона 44×44 */
	.gp-btn .wp-block-button__link,
	a.gp-btn { width: 100%; }

	.gp-ctarow .wp-block-buttons { width: 100%; }
	.gp-ctarow .wp-block-button { flex: 1 1 100%; }

	.ct-header .site-title a::before,
	.ct-header .site-title a::after { font-size: 19px; }

	/* Полоса: география уходит, остаются контакты.
	   Экономим высоту первого экрана на телефоне. */
	.gp-topbar__geo { display: none; }
	.gp-topbar__inner { justify-content: center; min-height: 40px; }
	.gp-topbar { font-size: 12px; }
	.gp-topbar__item { padding-left: var(--gp-s4); margin-left: var(--gp-s4); }
}

/* Мобильная высота ряда. Брейкпоинт 999px — граница, на которой
   Blocksy переключает --height на 70px; переопределяем в тех же рамках. */
@media (max-width: 999px) {
	#header [data-row*="middle"] { --height: 56px; }
}

@media (max-width: 999px) {
	/* В мобильном раскрытии кнопка идёт полосой на всю ширину */
}

@media (max-width: 900px) {
	.gp-geo { grid-template-columns: 1fr; gap: var(--gp-s6); }
	.gp-faq summary { font-size: 16px; padding-right: 36px; }
	.gp-faq__a { padding-right: 0; }
	.gp-footer__cols { grid-template-columns: 1fr; gap: var(--gp-s5); }
	.gp-footer__inner { padding-block: var(--gp-s6) var(--gp-s5); }
}

@media (max-width: 560px) {
	.gp-facts__grid { grid-template-columns: 1fr; }
	.gp-fact { border-right: 0; padding-left: 0; }
	.gp-fact + .gp-fact { border-top: 1px solid var(--gp-line); }

	/* Одна колонка: на телефоне подпись с координатами должна
	   оставаться читаемой, ради этого жертвуем компактностью */
	.gp-works__grid { grid-template-columns: 1fr; }
	.gp-works__item { max-width: 420px; margin-inline: auto; }
}

/* --------------------------------------------------------------------------
   19. Motion
   Движение только для ориентации и обратной связи.
   -------------------------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .01ms !important;
		scroll-behavior: auto !important;
	}
}