/* AURUM theme 1.2.5 — мост между утилитами исходника и WordPress (см. CHANGELOG.md). */
/* ============================================================= *
 * aurum.css — «мост» между WordPress и собранным CSS исходника.
 *
 * site.css — это дословно Tailwind-сборка React-исходника (её мы не правим).
 * Здесь только то, что добавляет WordPress-обвязка и чего в исходнике нет:
 *   1) нейтрализация дефолтных стилей блоков (.wp-block-*, layout-классы);
 *   2) рендер иконок-масок (--aurum-ico из icons.css);
 *   3) админ-бар; 4) мелкие правки доступности/скролла.
 * ============================================================= */

/* --- 1. Дефолты Gutenberg, которые сдвигают вёрстку исходника --- */
/* ВАЖНО: весь этот блок живёт в @layer base. site.css — сборка Tailwind, её
   утилиты (px-5, md:px-10, mt-7 …) лежат в @layer utilities. НЕСЛОЁНЫЕ правила
   всегда громче слойных, поэтому «обнуляющий» reset вне слоя перебивал utility
   паддинги секций: секции теряли px-5/md:px-10 и вся сетка ехала на 40px.
   В base мы стоим там же, где preflight Tailwind: дефолты WP глушим, utilities
   не трогаем. На канвасе scope-css.py слои раскрывает — приоритеты те же. */
@layer base {
:where(.wp-block-group),
:where(.wp-block-buttons),
:where(.wp-block-button),
:where(.wp-block-image),
:where(.wp-block-image > figcaption),
:where(.wp-block-list),
:where(.wp-block-paragraph),
:where(.wp-block-heading),
:where(.wp-block-columns),
:where(.wp-block-column) {
	margin: 0;
	padding: 0;
	border: 0;
	background: none;
}

/* Расстояние между блоками.
   Ядро разводит детей flow/constrained/flex-контейнеров через
   margin-block-start: var(--wp--style--block-gap) и gap: var(--…). Гасим саму
   переменную: правило !important по логическому margin-block-start перебивает
   физический margin-top утилит (mt-6, mt-10, …) — на фронте из-за него пропадали
   отступы исходника, а канвас и фронт расходились на 24–68px. */
:root,
body.aurum-site,
.editor-styles-wrapper {
	--wp--style--block-gap: 0px;
}

:where(.is-layout-constrained) {
	max-width: none;
	margin-inline: 0;
}

:where(.is-layout-flex) {
	/* Tailwind сам задаёт flex/gap; WP-версию глушим, чтобы не плодить второй gap. */
	gap: inherit;
}

/* На канвасе layout-классы нейтрализует editor.css (без !important, иначе он
   перебивает утилиты margin-*). Здесь — только constrained-ограничитель. */
:where(.is-layout-constrained) {
	max-width: none;
	margin-inline: 0;
}

/* alignfull/alignwide: ядро ставит им width:100vw и отрицательные маргины. В
   канвасе iframe уже уже́, чем окно (1160 при 1440), поэтому 100vw рождает
   горизонтальное переполнение, а Chrome из-за него «autosizing» режет ВЕСЬ кегль
   на ~3 % — канвас перестаёт совпадать с фронтом. На фронте 100vw шире
   clientWidth на полосу прокрутки — эффект тот же. Возвращаем ширину в поток:
   секции исходника тянутся сами (w-full / max-w-[1440px] mx-auto). */
.alignwide,
.alignfull {
	margin-left: 0;
	margin-right: 0;
	max-width: none;
	width: auto;
}

/* .wp-site-blocks не должен добавлять паддинги-«рифму» к body исходника. */
.wp-site-blocks,
.wp-site-blocks > * + * {
	padding: 0;
	margin-block-start: 0;
}

/* --- конец слоя base --- */
}

body.aurum-site {
	min-height: 100vh;
	overflow-x: clip;
}

/* --- 2. Иконки: SVG исходника живёт в переменной --aurum-ico (см. icons.css) --- */
[class*=" aurum-ico-"],
[class^="aurum-ico-"] {
	position: relative;
}

/* Только ::before: у .btn и .link-line ::after занято «подчёркиванием» из
   site.css (.aurum-trail::after), а псевдоэлемент у элемента один — иконка
   сливалась с линией и исчезала. Ведомая позиция — order:1 ниже. */
[class*="aurum-ico-"]::before {
	content: "";
	display: inline-block;
	inline-size: var(--aurum-ico-size, 1rem);
	block-size: var(--aurum-ico-size, 1rem);
	flex: 0 0 auto;
	vertical-align: -0.125em;
	background-color: currentColor;
	-webkit-mask-image: var(--aurum-ico);
	mask-image: var(--aurum-ico);
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-size: contain;
	mask-size: contain;
}

/* ведущая иконка уже в потоке с gap; ведомая — с тем же отступом, что в исходнике */
[class*="aurum-ico-"]:not(.aurum-trail)::before {
	margin-inline-end: 0;
}

/* Иконка «после подписи»: в 1.2.2 здесь стояло content:none — для обёрток
   кнопок 1.2.0–1.2.1 (aurum-ico-* + aurum-trail на одном элементе) это
   означало «стрелки пропали», т.к. инлайнового <svg> в том контенте нет.
   Правильный порядок даёт order:1, а не подавление. */
[class*="aurum-ico-"].aurum-trail::before {
	margin-inline-end: 0;
	margin-inline-start: 0;
	order: 1;
}

[class*="aurum-ico-"].aurum-trail::after {
	margin-inline-start: 0.45em;
}

/* «стоп-символы» в списках, где исходник использовал маркер lucide-check */
.aurum-ico-check::before {
	margin-inline-end: 0.55em;
}

/* --- 3. Ядро переносит классы вёрстки на обёртку блока ---
   У core/button className живёт на <div class="wp-block-button"> (см.
   tools/probe-canonical.mjs), а btn/btn-gold/иконки в исходнике сидели на <a>.
   Правку в <a> ядро не примет — блок станет «невалидным».

   1.2.0 делала ссылку прозрачной ПОДЛОЖКОЙ (position:absolute; inset:0). Это
   лишало обёртку потокового содержимого: inline-flex без детей схлопывался до
   собственных паддингов, и на фронте подпись кнопки обрезалась («A CAM…» вместо
   «PLAN A CAMPAIGN ↗»), а иконки не становились вовсе — на 40px. Канвас этого не
   показывал, потому что там `.wp-block-button { width: fit-content }` задаёт
   ядро (block-library), а на фронте он снят.

   Поэтому: ссылка стоит В ПОТОКЕ и сама тянет размер обёртки, а кликабельную
   площадь закрывает её ::after. Порядок: ::before-иконку уводим за подпись —
   в исходнике svg идёт после текста. */
/* Разрыв блока здесь стоил 1.2.2 всех размеров кнопок: «висячие» `margin:0;`
   и `}` после закрытой правила парсер собирает в невалидное qualified-rule, а
   оно доедает СЛЕДУЮЩИЕ селектор и их тело — мост `.wp-block-button__link`
   исчезал из CSSOM, и неслоёные правила ядра `:where(.wp-block-button__link)
   {padding:calc(.667em+2px)}` оставались единственными. Поэтому: все объявления —
   внутри одной фигурной скобки, комментарии — над блоком. */
.wp-block-buttons > .wp-block-button,
.editor-styles-wrapper .wp-block-buttons > .wp-block-button {
	/* В канвасе ядро (block-library, грузится в iframe) даёт обёрткам
	   margin:0 0 var(--wp--style--block-gap) и свой gap на строке — на фронте
	   block-library снят, поэтому ряд кнопок в редакторе уезжал на 8–35px.
	   Нормализуем обе стороны одинаково: gap строки берём из атрибутов блока,
	   отступов у обёрток нет. */
	display: inline-flex;
	margin: 0;
	position: relative;
	width: -moz-fit-content;
	width: fit-content;
}


.wp-block-buttons > .wp-block-button > .wp-block-button__link,
.editor-styles-wrapper .wp-block-buttons > .wp-block-button > .wp-block-button__link {
	align-items: center;
	background: none;
	border: 0;
	border-radius: inherit;
	color: inherit;
	display: inline;
	font-size: inherit;
	gap: inherit;
	justify-content: inherit;
	letter-spacing: inherit;
	line-height: inherit;
	margin: 0;
	padding: 0;
	text-align: inherit;
	text-decoration: none;
	text-transform: inherit;
}

.wp-block-buttons > .wp-block-button > .wp-block-button__link::after,
.editor-styles-wrapper .wp-block-buttons > .wp-block-button > .wp-block-button__link::after {
	content: "";
	inset: 0;
	position: absolute;
}

.editor-styles-wrapper figure.aurum-fill > img {
	block-size: 100%;
	height: 100%;
	width: 100%;
	height: 100%;
	width: 100%;
	border-radius: inherit;
	display: block;
	inline-size: 100%;
	object-fit: cover;
	object-position: center;
}

.wp-block-button > .wp-block-button__link:focus-visible {
	outline-offset: -4px;
}

/* core/image: те же правила для <img> — ядро кладёт классы на <figure>. */
figure.aurum-fill {
	margin: 0;
}

figure.aurum-fill > img {
	block-size: 100%;
	height: 100%;
	width: 100%;
	border-radius: inherit;
	display: block;
	inline-size: 100%;
	object-fit: cover;
	object-position: center;
}

/* --- 3. Админ-бар: фиксированная шапка не должна под него проваливаться --- */
body.admin-bar .aurum-header,
body.admin-bar .wp-block-template-part > header.fixed {
	top: 32px;
}

@media screen and (min-width:783px) {
	body.admin-bar .aurum-header,
	body.admin-bar .wp-block-template-part > header.fixed {
		top: 32px;
	}
}

/* --- 4. Мелочи --- */
/* Якорные переходы плавные (в React-версии это делал scroll-behavior на html). */
@media (prefers-reduced-motion:no-preference) {
	html {
		scroll-behavior: smooth;
	}
}

/* Кастомный курсор не должен ловить клики и перекрывать нативный. */
.cursor-dot,
.cursor-ring {
	pointer-events: none;
}

/* Медиа в контенте: НЕ трокаем размеры — height/max-width уже задаёт префлайт
   и утилиты исходника (h-full/object-cover). Любое «разумное» правило здесь
   перебивает Tailwind по специфичности и ломает hero-картинки. */
figure.wp-block-image {
	overflow: hidden;
}

/* --- 5. Лента отзывов: слайдер и форма (1.2.5) ---
   Tailwind в сборке содержит только те утилиты, что встретились исходной странице,
   поэтому ширины слайда, «мягкий» скролл-бар, точки и состояние стрелок описаны здесь:
   w-[86%], min-w-0, gap-1.5, pb-1 в компиллят site.css не попали. Всё, что можно,
   берётся из переменных палитры — иначе отзыв на холсте редактора жил бы своими цветами. */

.aurum-slider {
	position: relative;             /* точка отсчёта для свечения секции и стрелок */
}

.aurum-slider-track {
	display: flex;
	gap: 1.25rem;                 /* gap-5 в утилитах есть, но дублируем: лента работает и без них */
	min-height: 0;
	overflow-x: auto;
	overscroll-behavior-x: contain;
	padding-bottom: 0.25rem;
	scroll-padding-inline: 0.0625rem;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
	-webkit-overflow-scrolling: touch;
}

.aurum-slider-track::-webkit-scrollbar {
	display: none;
}

.aurum-slide {
	flex: 0 0 86%;
	min-width: 0;
	scroll-snap-align: start;
}

/* Every card uses the tallest card in the current slider row, while its author
   footer is pinned to the bottom. Dividers and author names therefore form one
   stable horizontal line regardless of quote length or the More control. */
.aurum-slider-track > .wp-block-aurum-review-card {
	display: flex;
}

.aurum-slider-track > .wp-block-aurum-review-card > figure {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	width: 100%;
}

.aurum-slider-track > .wp-block-aurum-review-card > figure > :last-child {
	margin-top: auto;
}

.aurum-slider-track > .wp-block-aurum-review-card .aurum-review-more {
	align-self: flex-start;
}

/* md:text-2xl in the source is 1.5rem; 1.3rem keeps long reviews calmer while
   preserving the original 1.25rem mobile size. */
@media (min-width: 768px) {
	.wp-block-aurum-review-card blockquote {
		font-size: 1.3rem;
	}
}

@media (min-width: 640px) {
	.aurum-slide {
		flex-basis: 62%;         /* половина второй карточки честит ленту: видно, что есть ещё */
	}
}

@media (min-width: 1024px) {
	.aurum-slide {
		/* Три карточки в видимой области; горизонтальный slider и его управление сохранены. */
		flex-basis: calc((100% - 2.5rem) / 3);
	}
}

/* JS добавляет clamp только после создания доступной кнопки. Без JavaScript полный
   текст остаётся видимым, поэтому содержание отзыва никогда не теряется. */
.aurum-review-quote.is-collapsed {
	display: -webkit-box;
	overflow: hidden;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
}

/* Expanded reviews stay compact: only the quote becomes a scrollable reading
   area, so one long submission cannot stretch the whole slider row. */
.aurum-review-quote.is-expanded {
	display: block;
	max-height: 15.5rem;
	overflow-x: hidden;
	overflow-y: auto;
	padding-right: .75rem;
	overscroll-behavior: contain;
	scrollbar-color: rgba(227, 171, 74, .72) rgba(242, 237, 225, .08);
	scrollbar-gutter: stable;
	scrollbar-width: thin;
	-webkit-overflow-scrolling: touch;
}

.aurum-review-quote.is-expanded::-webkit-scrollbar {
	width: 5px;
}

.aurum-review-quote.is-expanded::-webkit-scrollbar-track {
	background: rgba(242, 237, 225, .08);
	border-radius: 999px;
}

.aurum-review-quote.is-expanded::-webkit-scrollbar-thumb {
	background: linear-gradient(180deg, var(--color-goldsoft), var(--color-golddeep));
	border-radius: 999px;
}

.aurum-review-quote.is-expanded::-webkit-scrollbar-thumb:hover {
	background: var(--color-gold);
}

@media (max-width: 639px) {
	.aurum-review-quote.is-expanded {
		max-height: 13rem;
	}
}

.aurum-review-more {
	margin-top: 1rem;
	border: 0;
	color: var(--color-goldsoft);
	cursor: pointer;
	font-size: .68rem;
	font-weight: 700;
	letter-spacing: .16em;
	line-height: 1.2;
	text-transform: uppercase;
}

.aurum-review-more:hover {
	color: var(--color-gold);
}

.aurum-review-more:focus-visible {
	outline: 2px solid var(--color-gold);
	outline-offset: 4px;
}

/* Декоративный glow выходит за правую грань review-dialog на 80px и создаёт
   горизонтальный scrollbar. Обрезаем только ось X; вертикальная прокрутка формы остаётся. */
.aurum-review [role="dialog"] {
	overflow-x: hidden;
}

.aurum-review textarea[name="text"] {
	height: 6rem;
	min-height: 6rem;
}

/* Лист отзыва на телефонах: 94vh считается от полной высоты вьюпорта и кнопка
   уезжала за нижний край — тот же фикс, что в responsive.css для модалки заявки. */
@supports (height: 100dvh) {
	.aurum-review [role="dialog"] {
		max-height: 94dvh;
	}
}

/* Прокрутка по-пластунски только если пользователь не просит меньше движения. */
@media (prefers-reduced-motion: no-preference) {
	.aurum-slider-track {
		scroll-behavior: smooth;
	}
}

/* Круглые стрелки прокрутки = тем же стилем, что крестик модалки заявки. */
.aurum-navbtn {
	align-items: center;
	border: 1px solid var(--color-line);
	border-radius: 9999px;
	color: var(--color-mute);
	display: flex;
	height: 2.25rem;
	justify-content: center;
	transition: border-color 0.3s var(--ease-expo, ease), color 0.3s var(--ease-expo, ease), opacity 0.3s ease;
	width: 2.25rem;
}

.aurum-navbtn:hover {
	border-color: var(--color-gold);
	color: var(--color-gold);
}

.aurum-navbtn[disabled] {
	cursor: not-allowed;
	opacity: 0.35;
}

.aurum-navbtn:focus-visible,
.aurum-slider-dot:focus-visible,
.aurum-star:focus-within {
	outline: 2px solid var(--color-gold);
	outline-offset: 2px;
}

/* Точки-индикатор: активная растягивается в полоску (как прогресс шагов в заявке). */
.aurum-slider-dots {
	align-items: center;
	display: flex;
	gap: 0.375rem;
}

.aurum-slider-dot {
	background: var(--color-line);
	border: 0;
	border-radius: 9999px;
	cursor: pointer;
	height: 0.375rem;
	padding: 0;
	transition: background 0.3s ease, width 0.4s var(--ease-expo, ease);
	width: 0.375rem;
}

.aurum-slider-dot[aria-current="true"] {
	background: linear-gradient(90deg, var(--color-golddeep), var(--color-goldsoft));
	width: 1.5rem;
}

/* Оценка в форме отзыва: нативные radio (работают без JS и в холсте), звёзды — метки. */
.aurum-stars {
	border: 0;
	margin: 0;
	padding: 0;
}

.aurum-star {
	color: var(--color-line);
	cursor: pointer;
	display: inline-flex;
	font-size: 1.15rem;
	line-height: 1;
	transition: color 0.2s ease, transform 0.2s ease;
}

.aurum-star input {
	opacity: 0;
	position: absolute;
	pointer-events: none;
}

.aurum-star[data-on="1"] {
	color: var(--color-gold);
}

.aurum-star:hover {
	transform: translateY(-1px);
}

.aurum-review-error {
	color: #e4796f;
	font-size: 0.78rem;
	margin-top: 0.75rem;
}

/* Honeypot: вне потока, вне tab-порядка, недоступен скринридерам. */
.aurum-hp {
	height: 1px;
	left: -9999px;
	overflow: hidden;
	position: absolute;
	top: 0;
	width: 1px;
}

/* Подписи для скринридеров: в сборке .sr-only есть, но правим на всякий свой случай. */
.aurum-sr {
	clip: rect(0 0 0 0);
	height: 1px;
	overflow: hidden;
	position: absolute;
	white-space: nowrap;
	width: 1px;
}

/* Стрелки ленты — свои, чтобы не зависеть от hidden/`sm:flex` в компилляте. */
.aurum-slider-nav {
	display: flex;
	align-items: center;
	gap: .625rem;
}

/* Global shell logo selected in Appearance → AURUM Header & Footer. */
.aurum-shell-logo{display:block;width:auto;max-width:100%;object-fit:contain}.aurum-shell-logo--header{height:2.25rem;max-width:12rem}.aurum-shell-logo--footer{height:2.75rem;max-width:14rem}

.wp-block-aurum-content-row > .hair { display: block; }

/* Unified section eyebrow for both Gutenberg output and the optional raw snapshot mode.
   Both render paths now emit .aurum-section-label; the utility signature remains
   as a compatibility fallback for cached block HTML. */
body.aurum-site .aurum-section-label,
body.aurum-site .wp-block-aurum-content-row.flex.items-center.gap-4 {
	display: grid !important;
	grid-template-columns: max-content 2.5rem max-content !important;
	grid-template-rows: auto !important;
	grid-auto-flow: column !important;
	align-items: center !important;
	column-gap: 1rem !important;
	row-gap: 0 !important;
	width: max-content !important;
	max-width: 100% !important;
	white-space: nowrap !important;
}
body.aurum-site .aurum-section-label > *,
body.aurum-site .wp-block-aurum-content-row.flex.items-center.gap-4 > * {
	grid-row: 1 !important;
	width: auto !important;
	max-width: none !important;
	min-width: 0 !important;
	margin: 0 !important;
}
body.aurum-site .aurum-section-label > .hair,
body.aurum-site .wp-block-aurum-content-row.flex.items-center.gap-4 > .hair {
	width: 2.5rem !important;
	min-width: 2.5rem !important;
}
