/* ==========================================================================
   Goulash.tech — Главная v2
   Зависит от tokens.css + ui-kit.css
   ========================================================================== */

/* --------------------------------------------------------------------------
   Служебное
   -------------------------------------------------------------------------- */

.g2-section#product {
	padding-bottom: 132px;
}

.g2-section#guide {
	padding: 12px 0;
	border-top: 1px solid var(--g-line-on-light);
	border-bottom: 1px solid var(--g-line-on-light);
}

/* Заглушка изображения, пока ассет не выгружен */
.g2-imgstub {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 160px;
	padding: 24px;
	border-radius: var(--g-r-lg);
	background: repeating-linear-gradient(
		45deg,
		rgba(255, 255, 255, 0.035) 0 10px,
		rgba(255, 255, 255, 0.07) 10px 20px
	);
	border: 1px dashed var(--g-border-dark);
	color: var(--g-od-tertiary);
	text-align: center;
}
.g2-imgstub__label {
	font-size: var(--g-t6-size);
	line-height: 140%;
	max-width: 26ch;
}
.g2-section:not(.g2-section--dark) .g2-imgstub {
	background: repeating-linear-gradient(
		45deg,
		rgba(4, 4, 6, 0.02) 0 10px,
		rgba(4, 4, 6, 0.05) 10px 20px
	);
	border-color: var(--g-border-light);
	color: var(--g-ol-muted);
}

/* Шапка и мобильное меню — css/v2/header.css (общие для всех страниц) */

@media (max-width: 768px) {
	.g2-main {
		overflow-x: clip;
	}

	.g2-section#product {
		padding-bottom: 0;
		overflow: visible;
		position: relative;
		z-index: 2;
	}

	.g2-section#partners {
		padding-block: 0;
	}

	.g2-section#cases {
		padding-top: 80px;
	}

	.g2-section#connect {
		padding-block: 80px;
	}
}

/* --------------------------------------------------------------------------
   Интро: анимация первого экрана при загрузке.
   Светлая шторка «прокатом» уезжает вверх, открывая тёмный герой, следом
   каскадом выезжают тексты, светофор и логотипы клиентов.
   -------------------------------------------------------------------------- */

@keyframes g2-intro-wipe {
	from {
		transform: translateY(0);
	}
	to {
		transform: translateY(-101%);
	}
}

@keyframes g2-intro-rise {
	from {
		opacity: 0;
		transform: translateY(32px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

@keyframes g2-intro-drop {
	from {
		opacity: 0;
		transform: translateY(-12px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

@keyframes g2-intro-media {
	from {
		opacity: 0;
		transform: translateY(28px) scale(1.03);
	}
	to {
		opacity: 1;
		transform: translateY(0) scale(1);
	}
}

@keyframes g2-intro-fade {
	from {
		opacity: 0;
	}
	to {
		opacity: 1;
	}
}

@media (prefers-reduced-motion: no-preference) {
	/* Шторка: цвет страницы под героем, cyan-кромка по нижнему краю */
	.g2-hero::after {
		content: "";
		position: absolute;
		inset: 0;
		z-index: 5;
		background: var(--g-light-secondary);
		border-bottom: 2px solid var(--g-cyan);
		pointer-events: none;
		animation: g2-intro-wipe 0.9s cubic-bezier(0.65, 0, 0.35, 1) 0.15s both;
	}

	.g2-header {
		animation: g2-intro-drop 0.7s cubic-bezier(0.22, 1, 0.36, 1) 0.85s both;
	}

	.g2-hero .g2-gridlines {
		animation: g2-intro-fade 0.8s ease-out 1.05s both;
	}

	.g2-hero__eyebrow {
		animation: g2-intro-rise 0.8s cubic-bezier(0.22, 1, 0.36, 1) 0.55s both;
	}

	.g2-hero__title {
		animation: g2-intro-rise 0.8s cubic-bezier(0.22, 1, 0.36, 1) 0.67s both;
	}

	.g2-hero__lead {
		animation: g2-intro-rise 0.8s cubic-bezier(0.22, 1, 0.36, 1) 0.79s both;
	}

	.g2-hero__actions {
		animation: g2-intro-rise 0.8s cubic-bezier(0.22, 1, 0.36, 1) 0.91s both;
	}

	.g2-hero__media {
		animation: g2-intro-media 1.1s cubic-bezier(0.22, 1, 0.36, 1) 0.7s both;
	}

	/* Логотипы клиентов — друг за другом, шаг по индексу из разметки */
	.g2-logostrip__item {
		animation: g2-intro-rise 0.7s cubic-bezier(0.22, 1, 0.36, 1) both;
		animation-delay: calc(1.05s + var(--g2-i, 0) * 0.07s);
	}
}

/* --------------------------------------------------------------------------
   Hero
   -------------------------------------------------------------------------- */

/* Секция начинается от верха страницы — шапка лежит поверх неё,
   поэтому светофор уходит под шапку, как в макете */
.g2-hero {
	--g2-hero-pt: calc(var(--g-header-h) + 96px);
	/* Нижнего падинга нет: низ героя занимает полоса логотипов клиентов */
	--g2-hero-pb: 0px;

	position: relative;
	display: flex;
	flex-direction: column;
	/* Фулскрин: герой занимает весь первый экран, контент центрируется
	   в оставшемся месте (svh — чтобы мобильные панели не давали скролл) */
	min-height: 100vh;
	min-height: 100svh;
	overflow: hidden;
	margin-top: calc(var(--g-header-h) * -1);
	background: var(--g-dark-primary);
	color: var(--g-od-primary);
	padding-block: var(--g2-hero-pt) var(--g2-hero-pb);
	border-bottom: 1px solid var(--g-line-on-dark);
}

/* > — чтобы не задеть гридлайны полосы логотипов внутри героя */
.g2-hero > .g2-gridlines {
	margin-top: var(--g-header-h);
}

/* вертикальные линии сетки — тонкие, по краям контейнера */
.g2-hero > .g2-gridlines::before,
.g2-hero .g2-logostrip .g2-gridlines::before {
	border-color: var(--g-line-on-dark);
}

/* Полоса логотипов внутри героя: прижата к низу, отделена линией */
.g2-hero .g2-logostrip {
	margin-top: auto;
	border-top: 1px solid var(--g-line-on-dark);
}

.g2-hero__inner {
	position: relative;
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	justify-content: center;
	min-height: 495px;
}

.g2-hero__content {
	margin-left: 16px;
	position: relative;
	z-index: 1;
}

/* Надзаголовок с вертикальной cyan-чертой (см. макет) */
.g2-hero__eyebrow {
	display: flex;
	flex-direction: column;
	margin-bottom: 32px;
	margin-left: -16px;
	padding-left: 10px;
	border-left: 2px solid var(--g-cyan);
	font-size: var(--g-t4-size);
	line-height: var(--g-t4-lh);
	color: var(--g-od-primary);
}

.g2-hero__title {
	max-width: 18ch;
	margin-bottom: 32px;
}

/* «+3 млн ₽» — всегда отдельной строкой, остальной текст переносится по ширине */
.g2-hero__title-accent {
	display: block;
	font-size: 72px;
	line-height: 110%;
}

.g2-hero__sup {
	font-size: 0.45em;
	vertical-align: super;
	color: var(--g-od-tertiary);
}

.g2-hero__lead {
	display: flex;
	flex-direction: column;
	margin-bottom: 48px;
	font-size: var(--g-t2-size);
	line-height: var(--g-t2-lh);
	color: var(--g-od-secondary);
}

.g2-hero__actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 16px;
}

/* Светофор: Figma 679×810 — прижат к правому краю контейнера и растянут
   на всю высоту секции: от самого верха страницы (под шапкой) до низа героя */
.g2-hero__media {
	position: absolute;
	right: 40px;
	top: calc(var(--g2-hero-pt) * -1);
	bottom: calc(var(--g2-hero-pb) * -1);
	z-index: 0;
	width: 679px;
	max-width: 55%;
	pointer-events: none;
}

.g2-hero__media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center top;
}

.g2-hero__media picture {
	display: block;
	width: 100%;
	height: 100%;
}

.g2-hero__media .g2-imgstub {
	width: 100%;
	height: 100%;
	border-radius: 0;
}

@media (max-width: 1023px) {
	.g2-hero {
		--g2-hero-pt: calc(var(--g-header-h) + 32px);
	}
	.g2-hero__inner {
		gap: 32px;
		min-height: 0;
	}
	.g2-hero__title {
		max-width: none;
	}
	.g2-hero__media {
		position: relative;
		inset: auto;
		order: -1;
		width: auto;
		max-width: none;
		display: flex;
		justify-content: center;
	}
	.g2-hero__media img {
		width: auto;
		height: auto;
		max-width: 100%;
		max-height: 360px;
		object-fit: contain;
	}
	.g2-hero__media .g2-imgstub {
		height: auto;
		min-height: 260px;
	}
}

@media (max-width: 768px) {
	.g2-hero {
		position: static;
		min-height: 0;
		/* Шапка на мобилке fixed и вне потока — отрицательный margin-top
		   с десктопа уводил герой за верхний край экрана */
		margin-top: 0;
		padding-block: 0;
		--g2-hero-pt: 0px;
		background: #040406;
	}
	.g2-hero .g2-logostrip {
		margin-top: 0;
		background: #040406;
	}
	.g2-hero__inner {
		position: relative;
		box-sizing: border-box;
		/* Только svh: dvh меняется при появлении/скрытии панелей браузера,
		   а flex-end тогда «прыгает» заголовком. svh стабилен. */
		min-height: 100vh;
		min-height: 100svh;
		height: 100vh;
		height: 100svh;
		max-height: 100vh;
		max-height: 100svh;
		padding-top: calc(var(--g-header-h) + 16px);
		padding-bottom: 24px;
		justify-content: flex-end;
		overflow: hidden;
	}
	.g2-hero__eyebrow {
		margin-bottom: 16px;
	}
	.g2-hero__title,
	.g2-hero__lead {
		margin-bottom: 24px;
	}
	.g2-hero__actions .g2-btn {
		width: 100%;
	}

	.g2-hero__media {
		position: absolute;
		top: 0;
		right: 0;
		height: 700px;
		width: max-content;
	}

	.g2-hero__media img {
		max-height: none;
	}

	.g2-hero__content,
	.g2-hero__eyebrow {
		margin-left: 0;
	}
}

/* --------------------------------------------------------------------------
   Лента логотипов / интеграций
   -------------------------------------------------------------------------- */

.g2-logostrip {
	position: relative;
	background: var(--g-dark-primary);
	padding-block: 40px;
	overflow: hidden;
}

.g2-logostrip .g2-gridlines::before {
	border-color: var(--g-line-on-dark);
}

.g2-logostrip .g2-container {
	position: relative;
}

/* 2 ряда по 6 логотипов — каждый в своей клетке сетки (см. макет) */
.g2-logostrip__list {
	display: grid;
	grid-template-columns: repeat(6, minmax(0, 1fr));
	gap: 28px 32px;
}

.g2-logostrip__item {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 40px;
	color: var(--g-od-disabled);
	transition: color var(--g-dur) var(--g-ease);
}

.g2-logostrip__item:hover {
	color: var(--g-od-secondary);
}

.g2-logostrip__img {
	max-width: 100%;
	max-height: 40px;
	width: auto;
	height: auto;
	object-fit: contain;
}

/* Заглушка вместо логотипа: только название бренда, без рамки */
.g2-imgstub.g2-logostrip__img {
	min-height: 0;
	max-height: none;
	padding: 0;
	border: 0;
	background: none;
	color: inherit;
}

.g2-imgstub.g2-logostrip__img .g2-imgstub__label {
	max-width: none;
	font-size: var(--g-t3-size);
	line-height: 1.1;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	white-space: nowrap;
}

@media (max-width: 1023px) {
	.g2-logostrip__list {
		grid-template-columns: repeat(4, minmax(0, 1fr));
		gap: 24px;
	}
}

@media (max-width: 768px) {
	.g2-logostrip__list {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 18px 20px;
	}
	.g2-imgstub.g2-logostrip__img .g2-imgstub__label {
		font-size: var(--g-t5-size);
	}
}

/* --------------------------------------------------------------------------
   Видео над «Источники роста выручки»
   -------------------------------------------------------------------------- */

.g2-showreel {
	position: relative;
	padding-top: 48px;
	background: var(--g-light-primary);
}

.g2-showreel .g2-container {
	padding-inline: calc(var(--g-gutter) + 12px);
}

.g2-showreel__frame {
	position: relative;
	overflow: hidden;
	border-radius: var(--g-r-lg);
	background: var(--g-dark-primary);
	isolation: isolate;
	transform: translateZ(0);
}

.g2-showreel__media {
	display: block;
	width: 100%;
	height: auto;
	pointer-events: none;
	user-select: none;
	transform: translateZ(0);
	backface-visibility: hidden;
}

@media (max-width: 768px) {
	.g2-showreel .g2-container {
		padding-inline: var(--g-gutter);
	}

	.g2-showreel__frame {
		border-radius: var(--g-r-md);
	}
}

/* --------------------------------------------------------------------------
   Bento — источники роста выручки
   -------------------------------------------------------------------------- */

.g2-section#sources {
	padding-top: 48px;
}

.g2-sources-head {
	display: grid;
	grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
	align-items: start;
	gap: 40px;
	padding: 0;
}

.g2-sources__note {
	max-width: 540px;
	font-size: var(--g-t4-size);
	line-height: var(--g-t4-lh);
	color: var(--g-ol-secondary);
}

.g2-bento {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 20px;
	padding: 0 12px;
}

.g2-bento__item {
	padding: 28px;
	border-radius: var(--g-r-lg);
}

.g2-bento__item .g2-card__label {
	margin-bottom: 10px;
	font-size: var(--g-t4-size);
	line-height: var(--g-t4-lh);
	color: var(--g-light-primary);
}

/* Разделитель со списком прижаты к низу карточки */
.g2-bento__item .g2-card__divider {
	margin: 28px 0;
}

.g2-bento__item .g2-card__list {
	gap: 8px;
	font-size: var(--g-t5-size);
	line-height: var(--g-t5-lh);
}

/* Первая клетка — текст без подложки, на фоне секции */
.g2-bento__plain {
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: 28px 28px 28px 0;
	color: var(--g-ol-primary);
}

.g2-bento__plain .g2-bento__unit {
	color: var(--g-ol-primary);
}

.g2-bento__value {
	font-size: var(--g-h0-size);
	line-height: var(--g-h0-lh);
	/* моноширинные цифры — счётчик не «дёргает» вёрстку */
	font-variant-numeric: tabular-nums;
}

/* Отдельные значения набраны пиксельным шрифтом (см. макет) */
.g2-bento__value--pixel {
	font-family: var(--g-font-pixel);
}

.g2-bento__unit {
	font-size: var(--g-h3-size);
	line-height: var(--g-h3-lh);
	color: var(--g-od-primary);
}

/* flow — значение и подпись в один абзац: «2% потерь / возвращаем» */
p.g2-bento__headline {
	font-size: var(--g-h3-size);
	line-height: 125%;
}

p.g2-bento__headline .g2-bento__value,
p.g2-bento__headline .g2-bento__unit {
	display: inline;
}

@media (max-width: 1279px) {
	.g2-sources-head {
		grid-template-columns: 1fr;
		gap: 20px;
	}
	.g2-bento {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 767px) {
	.g2-sources-head {
		padding: 0;
		gap: 0;
	}
	.g2-card .g2-bento__headline {
		padding: 0;
	}
	.g2-bento {
		grid-template-columns: 1fr;
		padding: 0;
		gap: 12px;
	}
	.g2-bento__plain {
		padding: 0;
	}
	.g2-bento__headline {
		padding: 32px 20px;
	}
}

/* --------------------------------------------------------------------------
   Диаграмма — результат, который опережает рынок
   -------------------------------------------------------------------------- */

.g2-result-head {
	display: grid;
	grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
	align-items: start;
	gap: 40px;
	margin-bottom: 48px;
}

.g2-result__note {
	font-size: var(--g-t2-size);
	line-height: var(--g-t2-lh);
	color: var(--g-ol-secondary);
}

.g2-result__note small {
	display: block;
	margin-top: 8px;
	font-size: var(--g-t5-size);
	line-height: var(--g-t5-lh);
	color: var(--g-ol-muted);
}

/* Поле диаграммы: линии по верху/низу и по уровню низкого столбика */
.g2-chart {
	position: relative;
	display: grid;
	grid-template-columns: 1fr minmax(0, 200px) 1fr minmax(0, 200px) 1fr;
	align-items: end;
	height: 400px;
	border-top: 1px solid var(--g-line-on-light);
	border-bottom: 1px solid var(--g-line-on-light);
}

/* линия на уровне верхней кромки низкого столбика */
.g2-chart::before {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	top: 51%;
	border-top: 1px solid var(--g-line-on-light);
	pointer-events: none;
}

.g2-chart__bar {
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 12px;
	padding: 16px;
	overflow: hidden;
	border-top-left-radius: var(--g-r-sm);
	border-top-right-radius: var(--g-r-sm);
}

.g2-chart__bar--h1 {
	grid-column: 2;
	height: 49%;
	background: var(--g-dark-primary);
	color: var(--g-od-primary);
}

.g2-chart__bar--h2 {
	grid-column: 4;
	height: 100%;
	background: var(--g-cyan);
	color: var(--g-ol-primary);
}

.g2-chart__value {
	font-size: var(--g-h0-size);
	line-height: var(--g-h0-lh);
}

.g2-chart__bar--h1 .g2-chart__value,
.g2-chart__bar--h1 .g2-chart__label {
	color: var(--g-od-tertiary);
}

.g2-chart__label {
	margin-top: auto;
	font-size: var(--g-t4-size);
	line-height: var(--g-t4-lh);
}

/* Дельта: пунктир от верхней линии до уровня низкого столбика + подпись */
.g2-chart__delta {
	grid-column: 3;
	align-self: start;
	display: flex;
	flex-direction: column;
	align-items: center;
	height: 51%;
	text-align: center;
}

.g2-chart__line {
	position: relative;
	flex: 1;
	width: 1px;
	background: repeating-linear-gradient(
		to bottom,
		var(--g-ol-muted) 0 4px,
		transparent 4px 8px
	);
}

/* стрелка на верхнем конце пунктира */
.g2-chart__line--top::before {
	content: "";
	position: absolute;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;
	border-bottom: 7px solid var(--g-ol-muted);
}

.g2-chart__badge {
	flex: none;
	padding: 10px 0;
	color: var(--g-ol-primary);
}

.g2-chart__badge-value {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	font-size: 40px;
	font-weight: 700;
	line-height: 100%;
}

.g2-chart__badge-mark {
	flex: none;
	width: 40px;
	height: 40px;
}

.g2-chart__badge-label {
	margin-top: 4px;
	font-size: var(--g-t5-size);
	line-height: var(--g-t5-lh);
	color: var(--g-ol-secondary);
}

/* Рост столбиков привязан к скроллу: скрипт ставит класс is-armed и обновляет
   --g2-chart-p (0…1). Без JS диаграмма видна сразу. */
.g2-chart.is-armed .g2-chart__bar--h1 {
	height: calc(49% * var(--g2-chart-p, 0));
}

.g2-chart.is-armed .g2-chart__bar--h2 {
	height: calc(100% * var(--g2-chart-p, 0));
}

/* Подписи внутри столбиков проявляются на первой четверти роста,
   чтобы текст не торчал из ещё низкого столбика. */
.g2-chart.is-armed .g2-chart__value,
.g2-chart.is-armed .g2-chart__label {
	opacity: min(1, calc(var(--g2-chart-p, 0) * 4));
}

/* Дельта — только когда оба столбика на полной высоте. */
.g2-chart.is-armed .g2-chart__delta {
	opacity: 0;
	transform: translateY(12px);
	transition: opacity 0.35s ease-out, transform 0.35s ease-out;
}

.g2-chart.is-armed.is-full .g2-chart__delta {
	opacity: 1;
	transform: none;
}

@media (max-width: 1279px) {
	.g2-result-head {
		grid-template-columns: 1fr;
		gap: 20px;
	}
	.g2-chart {
		grid-template-columns: 1fr minmax(0, 160px) 1fr minmax(0, 160px) 1fr;
		height: 260px;
	}
}

@media (max-width: 768px) {
	.g2-chart {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		height: 248px;
		gap: 12px;
		border: 0;
	}

	.g2-chart::before {
		display: none;
	}

	.g2-chart__bar {
		padding: 12px;
	}

	.g2-chart__bar--h1 {
		grid-column: 1;
		height: 168px;
	}

	.g2-chart__bar--h2 {
		grid-column: 2;
		height: 248px;
	}

	.g2-chart.is-armed .g2-chart__bar--h1 {
		height: calc(168px * var(--g2-chart-p, 0));
	}

	.g2-chart.is-armed .g2-chart__bar--h2 {
		height: calc(248px * var(--g2-chart-p, 0));
	}

	.g2-chart__value {
		font-size: 32px;
	}

	.g2-chart__label {
		font-size: 11px;
		line-height: 1.25;
	}

	.g2-chart__delta {
		grid-column: auto;
		position: absolute;
		left: 0;
		top: 0;
		width: calc(50% - 6px);
		height: 80px;
		z-index: 2;
	}

	.g2-chart__badge {
		padding: 2px 0;
	}

	.g2-chart__badge-value {
		gap: 4px;
		font-size: 18px;
	}

	.g2-chart__badge-mark {
		width: 20px;
		height: 20px;
	}

	.g2-chart__badge-label {
		max-width: 14ch;
		margin-inline: auto;
		font-size: 10px;
		line-height: 1.15;
	}
}

/* --------------------------------------------------------------------------
   Промо-баннер (гайд)
   -------------------------------------------------------------------------- */

/* Фон — во всю ширину страницы, контент внутри — по контейнеру (см. макет) */
.g2-promo {
	position: relative;
	overflow: hidden;
	padding-block: 56px;
	background: var(--g-dark-primary);
	color: var(--g-od-primary);
}

.g2-promo__inner {
	display: grid;
	grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
	align-items: center;
	gap: 32px;
	min-height: 400px;
}

/* Подложка из макета: бирюзовое свечение за фигурой эксперта */
.g2-promo__glow {
	position: absolute;
	inset: 0;
	background: url("../../assets/images/v2/promo/bg.png") center / cover no-repeat;
	pointer-events: none;
}

.g2-promo__content {
	position: relative;
	z-index: 1;
}

.g2-promo__title {
	margin: 32px 0;
}

.g2-promo__accent {
	font-weight: 700;
}

.g2-promo__nl--m {
	display: none;
}

/* Правая часть: подпись эксперта и фото, прижатое к низу полосы */
.g2-promo__media {
	position: relative;
	z-index: 1;
	align-self: stretch;
	display: flex;
	align-items: flex-end;
	justify-content: flex-end;
	gap: 24px;
	margin-block: -56px;
}

.g2-promo__person {
	display: flex;
	flex-direction: column;
	gap: 4px;
	padding-bottom: 72px;
	text-align: right;
	font-size: var(--g-sh1-size);
	line-height: var(--g-sh1-lh);
	color: var(--g-od-tertiary);
}

.g2-promo__photo {
	flex: none;
	height: 100%;
	width: auto;
	max-width: 100%;
	object-fit: contain;
	object-position: right bottom;
}

.g2-imgstub.g2-promo__photo {
	min-width: 240px;
	min-height: 280px;
	height: auto;
	align-self: flex-end;
}

@media (max-width: 1023px) {
	.g2-promo {
		padding-block: 32px;
	}
	.g2-promo__inner {
		grid-template-columns: 1fr;
		min-height: 0;
	}
	.g2-promo__title {
		margin: 16px 0 24px;
	}
	.g2-promo__media {
		margin-block: 0;
		justify-content: flex-start;
	}
	.g2-promo__person {
		padding-bottom: 0;
		text-align: left;
	}
	.g2-promo__photo {
		display: none;
	}
}

@media (max-width: 768px) {
	.g2-promo {
		height: 600px;
		padding-block: 32px 24px;
		overflow: hidden;
	}

	.g2-promo__glow {
		background: url("../../assets/images/v2/promo/bg-mobile.png") center / 100% 100% no-repeat;
	}

	.g2-promo__inner {
		position: relative;
		display: flex;
		flex-direction: column;
		align-items: stretch;
		gap: 0;
		height: 100%;
		min-height: 0;
	}

	.g2-promo__content {
		display: contents;
	}

	.g2-promo .g2-eyebrow {
		order: 0;
		flex: none;
	}

	.g2-promo__title {
		order: 1;
		flex: none;
		margin: 16px 0 12px;
	}

	.g2-promo__nl--m {
		display: unset;
	}

	.g2-promo__nl--d {
		display: none;
	}

	.g2-promo__media {
		order: 2;
		flex: 1 1 auto;
		display: flex;
		justify-content: center;
		align-items: flex-end;
		min-height: 0;
		margin-inline: calc(var(--g-gutter) * -1);
		margin-bottom: -12px;
	}

	.g2-promo__photo {
		position: relative;
		z-index: 1;
		display: block;
		width: auto;
		height: 100%;
		max-width: 78%;
		max-height: 100%;
		object-fit: contain;
		object-position: center bottom;
	}

	.g2-promo__person {
		position: absolute;
		right: 16px;
		bottom: 24px;
		z-index: 3;
		padding-bottom: 0;
		max-width: 100%;
		text-align: right;
		font-size: var(--g-t5-size);
		line-height: var(--g-t5-lh);
	}

	.g2-promo .g2-btn {
		order: 3;
		position: relative;
		z-index: 2;
		flex: none;
		width: 100%;
		height: 52px;
		min-height: 52px;
		padding-block: 0;
		margin-top: 0;
	}
}

/* --------------------------------------------------------------------------
   Кому подходит — карточки-цитаты
   -------------------------------------------------------------------------- */

.g2-section-head__logo {
	display: inline-block;
	width: 0.75em;
	height: 0.75em;
	vertical-align: baseline;
}

.g2-quotes {
	display: flex;
	flex-direction: column;
	gap: 16px;
	padding: 0 12px;
}

.g2-quote {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 0.82fr);
	min-height: 520px;
	border-radius: var(--g-r-md);
	overflow: hidden;
	background: var(--g-dark-primary);
	color: var(--g-od-primary);
}

.g2-quote:nth-child(2) {
	background: var(--g-dark-secondary);
}

.g2-quote:nth-child(3) {
	background: var(--g-dark-tertiary);
}

.g2-quote__body {
	display: flex;
	flex-direction: column;
	padding: 24px;
}

.g2-quote__eyebrow {
	margin-bottom: 14px;
	font-size: 11px;
	letter-spacing: 0.1em;
	color: var(--g-od-secondary);
}

.g2-quote__eyebrow::before {
	width: 6px;
	height: 6px;
}

.g2-quote__lead {
	max-width: 46ch;
	font-size: var(--g-t3-size);
	line-height: var(--g-t3-lh);
	color: var(--g-od-primary);
}

.g2-quote__text {
	margin-top: 48px;
	max-width: 24ch;
	font-size: var(--g-t1-size);
	line-height: var(--g-t1-lh);
	font-weight: 700;
}

/* Бренд и автор — прижаты к низу карточки */
.g2-quote__author {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 20px;
	margin-top: auto;
	padding-top: 32px;
}

.g2-quote__brand {
	display: flex;
	align-items: flex-end;
}

.g2-quote__logo {
	max-height: 20px;
	width: auto;
	object-fit: contain;
}

/* Заглушка логотипа бренда — только текст, без рамки */
.g2-imgstub.g2-quote__logo {
	min-height: 0;
	max-height: none;
	padding: 0;
	border: 0;
	background: none;
	color: var(--g-od-primary);
}

.g2-imgstub.g2-quote__logo .g2-imgstub__label {
	max-width: none;
	font-size: var(--g-t3-size);
	font-weight: 800;
	font-style: italic;
	letter-spacing: 0.02em;
	text-transform: lowercase;
	white-space: nowrap;
}

.g2-quote__person {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 4px;
	text-align: right;
	font-size: var(--g-t6-size);
	line-height: var(--g-t6-lh);
	color: var(--g-od-tertiary);
}

.g2-quote__media {
	position: relative;
	overflow: hidden;
}

.g2-quote__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.45s var(--g-ease);
}

/* Наведение: фото подрастает на 5% в пределах своего фрейма (overflow скрыт) */
@media (hover: hover) {
	.g2-quote__media:hover img {
		transform: scale(1.05);
	}
}

@media (prefers-reduced-motion: reduce) {
	.g2-quote__media img,
	.g2-quote__media:hover img {
		transition: none;
		transform: none;
	}
}

.g2-quote__media .g2-imgstub {
	height: 100%;
	min-height: 100%;
	border-radius: 0;
	border: 0;
}

@media (max-width: 1023px) {
	.g2-quote {
		grid-template-columns: 1fr;
		min-height: 0;
	}
	.g2-quote__media {
		order: -1;
	}
	.g2-quote__media img {
		max-height: 280px;
	}
	.g2-quote__media .g2-imgstub {
		min-height: 200px;
	}
	.g2-quote__text {
		margin-top: 28px;
		max-width: none;
	}
}

@media (max-width: 768px) {
	.g2-quotes {
		padding: 0;
		gap: 12px;
	}

	.g2-quote {
		display: flex;
		flex-direction: column;
		padding: 20px;
	}

	.g2-quote__body {
		display: contents;
	}

	.g2-quote__eyebrow {
		order: 1;
	}

	.g2-quote__lead {
		order: 2;
		max-width: none;
	}

	.g2-quote__text {
		order: 3;
		margin-top: 48px;
		max-width: none;
		font-size: var(--g-t1-size);
	}

	.g2-quote__media {
		order: 4;
		margin-top: 40px;
		border-radius: var(--g-r-md);
	}

	.g2-quote__media img {
		max-height: 240px;
		height: 240px;
	}

	.g2-quote__author {
		order: 5;
		flex-direction: row;
		align-items: flex-end;
		justify-content: space-between;
		gap: 16px;
		margin-top: 40px;
		padding-top: 0;
	}

	.g2-quote__person {
		align-items: flex-end;
		text-align: right;
	}

	.g2-quote:last-child {
		position: relative;
		z-index: 2;
		margin-bottom: -120px;
	}
}

/* --------------------------------------------------------------------------
   Баннер «Мы помогаем ресторанам зарабатывать больше»
   -------------------------------------------------------------------------- */

/* Полоса баннера: баннер визуально наезжает на светлую секцию сверху.
   transform не влияет на поток — содержимое ниже остаётся на месте,
   а padding-bottom компенсирует пустоту, которую оставляет сдвиг. */
.g2-band--overlap {
	padding-top: 0;
	padding-bottom: 0;
}

.g2-banner {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	position: relative;
	z-index: 1;
	gap: 32px;
	height: 520px;
	overflow: hidden;
	padding: 0 40px;
	margin: 0 12px;
	border-radius: var(--g-r-lg);
	border: 1px solid var(--g-line-on-dark);
	background:
		url("../../assets/images/v2/numbers/bg.png") center / cover no-repeat,
		var(--g-dark-card);
	text-align: center;
	transform: translateY(-120px);
}

.g2-banner__title {
	position: relative;
	max-width: 24ch;
}

.g2-banner .g2-btn {
	position: relative;
}

@media (max-width: 768px) {
	.g2-band--overlap .g2-container {
		padding: 132px var(--g-gutter) 80px;
	}

	.g2-banner {
		height: auto;
		gap: 24px;
		margin: 0;
		padding: 40px var(--g-gutter);
		transform: none;
		background:
			url("../../assets/images/v2/numbers/bg-mobile.png") center / 100% 100% no-repeat,
			var(--g-dark-card);
	}
}

/* --------------------------------------------------------------------------
   Цифры
   -------------------------------------------------------------------------- */

.g2-stats {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 20px;
	padding: 0 12px;
}

.g2-stats__title {
	display: flex;
	align-items: center;
}

.g2-stats__pixel {
	font-family: var(--g-font-pixel);
}

.g2-stat {
	display: flex;
	flex-direction: column;
	gap: 8px;
	min-height: 156px;
	padding: 28px 24px;
	border-radius: var(--g-r-lg);
	background: var(--g-dark-card);
}

.g2-stat__value {
	font-size: var(--g-h0-size);
	line-height: 100%;
}

.g2-stat__label {
	max-width: 26ch;
	font-size: var(--g-t3-size);
	line-height: 125%;
	color: var(--g-od-primary);
}

@media (max-width: 1023px) {
	.g2-stats {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
	.g2-stats__title {
		grid-column: 1 / -1;
	}
}

@media (max-width: 768px) {
	.g2-stats {
		grid-template-columns: minmax(0, 1fr);
		gap: 12px;
		padding: 0;
	}
	.g2-stats__title {
		/* 20px + row-gap 12px = 32px от заголовка до первой карточки */
		margin-bottom: 20px;
	}
	.g2-stat {
		min-height: 0;
		padding: 18px 16px;
	}

	#numbers .g2-band:has(.g2-stats) {
		border-bottom: 0;
		padding-bottom: 80px;
	}

	#numbers .g2-band:has(.g2-kitchens) {
		padding-top: 0;
	}
}

/* --------------------------------------------------------------------------
   Кухни
   -------------------------------------------------------------------------- */

.g2-kitchens {
	text-align: center;
}

.g2-kitchens__title {
	max-width: 34ch;
	margin: 0 auto 54px;
}

.g2-kitchens__list {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 24px 64px;
}

.g2-kitchen {
	display: flex;
	align-items: center;
	gap: 12px;
	text-align: left;
}

.g2-kitchen__icon {
	width: 64px;
	height: 64px;
	flex: none;
	border-radius: var(--g-r-lg);
	object-fit: cover;
	background: var(--g-dark-card);
	border: 1px solid var(--g-border-dark);
}

.g2-imgstub.g2-kitchen__icon {
	min-height: 0;
	padding: 0;
	border-style: solid;
}

.g2-imgstub.g2-kitchen__icon .g2-imgstub__label {
	display: none;
}

.g2-kitchen__label {
	display: flex;
	flex-direction: column;
	font-size: var(--g-t3-size);
	line-height: var(--g-t3-lh);
	color: var(--g-od-secondary);
}

/* Появление по очереди: карточка проявляется крупной и садится в свой размер.
   Класс is-armed и прогресс каждой карточки (--g2-k, 0…1) ставит скрипт —
   значение идёт за скроллом, поэтому вверх карточки так же по очереди уходят. */
.g2-kitchens__list.is-armed .g2-kitchen {
	opacity: var(--g2-k, 0);
	transform: scale(calc(1.35 - 0.35 * var(--g2-k, 0)));
}

@media (max-width: 767px) {
	.g2-kitchens__title {
		margin-bottom: 28px;
	}
	.g2-kitchens__list {
		gap: 16px 24px;
	}
	.g2-kitchen {
		flex: 0 0 calc(50% - 12px);
	}
}

/* --------------------------------------------------------------------------
   Форма
   -------------------------------------------------------------------------- */

.g2-connect {
	position: relative;
	overflow: hidden;
	background: var(--g-dark-primary);
	color: var(--g-od-primary);
}

/* Фон секции: свечение слева, не выходит за верхний разделитель */
.g2-connect__glow {
	position: absolute;
	inset: 0;
	z-index: 0;
	background-color: #222222;
	background-image: url("../../assets/images/v2/cta/bg.png");
	background-position: center;
	background-size: 100% 100%;
	background-repeat: no-repeat;
	background-blend-mode: lighten;
	pointer-events: none;
}

.g2-connect__inner {
	position: relative;
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: 64px;
	align-items: start;
}

.g2-connect__title {
	max-width: 20ch;
}

/* Знак логотипа внутри строки заголовка */
.g2-connect__logo {
	display: inline-block;
	width: 0.8em;
	height: 0.8em;
	vertical-align: baseline;

	margin-right: -6px;
	margin-bottom: -4px;
}

.g2-form {
	display: flex;
	flex-direction: column;
	gap: 12px;
	max-width: 480px;
}

.g2-form .wpcf7,
.g2-form .wpcf7-form {
	width: 100%;
	margin: 0;
}

.g2-form .wpcf7-form {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.g2-form p {
	margin: 0;
}

.g2-form .wpcf7-form > p:has([type="hidden"]) {
	display: none;
}

.g2-form .form,
.g2-form .form__item,
.g2-form .wpcf7-form-control-wrap {
	display: block;
	width: 100%;
	margin: 0;
}

.g2-form fieldset {
	border: 0;
	margin: 0;
	padding: 0;
	min-width: 0;
}

.g2-form .form__wrapper {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.g2-form .form__actions {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.g2-form .form__submit {
	order: 1;
	display: flex;
	flex-direction: column;
	gap: 12px;
	align-items: stretch;
	margin-top: 8px;
}

.g2-form .form__desc,
.g2-form__note {
	order: 2;
	margin: 0;
	font-size: var(--g-t6-size);
	line-height: 145%;
	color: var(--g-od-tertiary);
}

.g2-form .form__desc a,
.g2-form .form__desc--link,
.g2-form__note a {
	color: var(--g-cyan);
	text-decoration: underline;
	text-underline-offset: 2px;
	transition: color var(--g-dur) var(--g-ease);
}

.g2-form .form__desc a:hover,
.g2-form .form__desc--link:hover,
.g2-form__note a:hover {
	color: var(--g-cyan-dark);
}

.g2-form .form__checkbox .wpcf7-list-item {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	margin: 0;
	cursor: pointer;
}

.g2-form .form__checkbox .wpcf7-list-item-label {
	font-size: var(--g-t6-size);
	line-height: 20px;
	color: var(--g-od-tertiary);
}

.g2-form .form__checkbox .wpcf7-list-item-label::before,
.g2-form .form__checkbox .wpcf7-list-item-label::after {
	content: none;
}

.g2-form .form__checkbox input[type="checkbox"] {
	appearance: none;
	-webkit-appearance: none;
	width: 20px;
	height: 20px;
	flex: none;
	margin: 0;
	border: 1px solid var(--g-border-situative);
	border-radius: var(--g-r-xs);
	background: transparent;
	cursor: pointer;
}

.g2-form .form__checkbox input[type="checkbox"]:checked {
	background-color: var(--g-cyan);
	border-color: var(--g-cyan);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5 10.5l3.2 3.2L15 7' fill='none' stroke='%23040406' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-position: center;
	background-repeat: no-repeat;
	background-size: 16px 16px;
}

.g2-form input.wpcf7-number::-webkit-outer-spin-button,
.g2-form input.wpcf7-number::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

.g2-form input.wpcf7-number {
	-moz-appearance: textfield;
}

.g2-form input.wpcf7-submit {
	margin-top: 8px;
	-webkit-appearance: none;
	appearance: none;
}

.g2-form .wpcf7-spinner {
	margin: 0 auto;
}

.g2-form .wpcf7 {
	position: relative;
}

.g2-form .screen-reader-response {
	position: absolute;
	overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	border: 0;
}

.g2-form .wpcf7-not-valid-tip {
	display: block;
	margin-top: 6px;
	font-size: var(--g-t6-size);
	line-height: var(--g-t6-lh);
	color: var(--g-error);
}

.g2-form .wpcf7-form-control-wrap .wpcf7-not-valid-tip ~ .wpcf7-not-valid-tip {
	display: none;
}

.g2-form .wpcf7-not-valid {
	border-color: var(--g-error);
}

.g2-form .form__checkbox:has(.wpcf7-not-valid-tip) input[type="checkbox"] {
	border-color: var(--g-error);
}

.g2-form .wpcf7-response-output {
	display: none;
	margin: 0;
}

.g2-form .wpcf7-form.sent .wpcf7-response-output,
.g2-form .wpcf7-form.failed .wpcf7-response-output,
.g2-form .wpcf7-form.aborted .wpcf7-response-output {
	display: block;
}

.g2-form .wpcf7-form.failed .wpcf7-response-output,
.g2-form .wpcf7-form.aborted .wpcf7-response-output {
	padding: 12px 16px;
	border: 1px solid var(--g-error);
	border-radius: 12px;
	font-size: var(--g-t6-size);
	line-height: 145%;
	color: var(--g-error);
}

@media (max-width: 1023px) {
	.g2-connect__inner {
		grid-template-columns: 1fr;
		gap: 32px;
	}
}

@media (max-width: 768px) {
	.g2-connect__glow {
		background-image: url("../../assets/images/v2/cta/bg-mobile.png");
	}

	.g2-connect__title,
	.g2-form {
		max-width: none;
	}

	.g2-connect__mark {
		display: none;
	}
}

/* --------------------------------------------------------------------------
   Кейсы / отзывы
   -------------------------------------------------------------------------- */

.g2-cases__head {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 24px;
	margin-bottom: 40px;
}

.g2-cases__nav {
	display: flex;
	gap: 12px;
}

/* Лента кейсов уходит за правый край контейнера — до края экрана (как в макете) */
.g2-cases__slider {
	margin-right: calc((100% - 100vw) / 2);
}

.g2-cases__track {
	display: flex;
	gap: 20px;
	overflow-x: auto;
	overscroll-behavior-x: contain;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
	-ms-overflow-style: none;
	padding-right: var(--g-gutter);
	cursor: grab;
}

.g2-cases__track::-webkit-scrollbar {
	display: none;
}

/* Во время перетаскивания мышью снап мешает — отключаем */
.g2-cases__track.is-dragging {
	scroll-snap-type: none;
	cursor: grabbing;
	user-select: none;
}

/* Figma: review-card / desktop — 480×529, radius 16, padding 32, gap 24 */
.g2-case {
	display: flex;
	flex: 0 0 480px;
	flex-direction: column;
	gap: 24px;
	min-height: 529px;
	padding: 32px;
	border-radius: var(--g-r-lg);
	background: var(--g-dark-card);
	color: var(--g-od-primary);
	scroll-snap-align: start;
}

.g2-case__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
}

.g2-case__person {
	display: flex;
	align-items: center;
	gap: 12px;
	font-size: var(--g-t3-size);
	line-height: var(--g-t3-lh);
}

.g2-case__avatar {
	width: 40px;
	height: 40px;
	flex: none;
	border-radius: 50%;
	object-fit: cover;
	background: var(--g-dark-muted);
}

/* Заглушка на месте аватара не должна растягивать шапку карточки */
.g2-imgstub.g2-case__avatar {
	min-height: 0;
	padding: 0;
	border-style: solid;
}

.g2-imgstub.g2-case__avatar .g2-imgstub__label {
	display: none;
}

.g2-case__brand {
	display: flex;
	align-items: center;
	flex: none;
	font-size: var(--g-t5-size);
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--g-od-secondary);
}

.g2-case__logo {
	max-height: 28px;
	width: auto;
	object-fit: contain;
}

.g2-imgstub.g2-case__logo {
	min-height: 0;
	padding: 6px 12px;
	border-radius: var(--g-r-sm);
}

.g2-case__metric {
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.g2-case__value {
	font-size: var(--g-h0-size);
	line-height: var(--g-h0-lh);
	color: var(--g-od-primary);
}

.g2-case__unit {
	font-size: var(--g-h3-size);
	line-height: var(--g-h3-lh);
	color: var(--g-od-primary);
}

.g2-case__quote {
	font-size: var(--g-t3-size);
	line-height: var(--g-t3-lh);
	color: var(--g-od-secondary);
}

.g2-case__footer {
	display: flex;
	justify-content: flex-end;
	margin-top: auto;
	padding-top: 8px;
}

/* Кнопка под лентой — по центру */
.g2-cases__more {
	display: flex;
	justify-content: center;
	margin-top: 40px;
}

@media (max-width: 1023px) {
	.g2-case {
		flex: 0 0 min(480px, 78vw);
	}
}

@media (max-width: 767px) {
	.g2-cases__head {
		margin-bottom: 32px;
	}
	.g2-cases__nav {
		display: none;
	}
	.g2-cases__track {
		gap: 12px;
		padding-right: var(--g-gutter);
	}
	.g2-case {
		flex: 0 0 84%;
		min-height: 0;
		gap: 20px;
		padding: 24px;
	}
	/* В макете на мобильном логотип бренда стоит над именем */
	.g2-case__head {
		flex-direction: column-reverse;
		align-items: flex-start;
		gap: 16px;
	}
	.g2-case__footer .g2-btn {
		width: 100%;
	}
	.g2-cases__more {
		margin-top: 32px;
	}
	.g2-cases__more .g2-btn {
		width: 100%;
	}
}

/* --------------------------------------------------------------------------
   Партнёры
   -------------------------------------------------------------------------- */

/* Сетка-таблица: первая ячейка — заголовок, остальные — логотипы.
   Вертикальные линии — только внутри блока, горизонтальные сверху и снизу
   уходят за края контейнера — во всю ширину экрана. */
.g2-partners {
	position: relative;
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	border-left: 1px solid var(--g-line-on-light);
}

.g2-partners::before,
.g2-partners::after {
	content: "";
	position: absolute;
	left: -100vw;
	right: -100vw;
	border-top: 1px solid var(--g-line-on-light);
}

.g2-partners::before {
	top: 0;
}

.g2-partners::after {
	bottom: 0;
}

.g2-partners__cell {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 158px;
	padding: 24px;
	border-right: 1px solid var(--g-line-on-light);
	border-bottom: 1px solid var(--g-line-on-light);
}

/* Нижний ряд закрывает линия во всю ширину (::after) */
.g2-partners__cell:nth-last-child(-n + 3) {
	border-bottom: 0;
}

.g2-partners__cell--title {
	justify-content: flex-start;
	padding-left: 0;
}

.g2-partners__logo {
	max-width: 100%;
	max-height: 44px;
	width: auto;
	height: auto;
	object-fit: contain;
	filter: grayscale(100%);
	opacity: 0.55;
	transition: opacity var(--g-dur) var(--g-ease), filter var(--g-dur) var(--g-ease);
}

.g2-partners__cell:hover .g2-partners__logo {
	filter: none;
	opacity: 1;
}

/* Заглушка логотипа не должна распирать ячейку */
.g2-imgstub.g2-partners__logo {
	min-height: 0;
	padding: 12px 16px;
	width: 100%;
	max-height: none;
	opacity: 1;
	filter: none;
	text-transform: uppercase;
	letter-spacing: 0.04em;
}

@media (max-width: 1023px) {
	.g2-partners {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
	.g2-partners__cell {
		min-height: 132px;
	}
	.g2-partners__cell:nth-last-child(-n + 3) {
		border-bottom: 1px solid var(--g-line-on-light);
	}
	.g2-partners__cell:nth-last-child(-n + 2) {
		border-bottom: 0;
	}
	.g2-partners__cell--title {
		grid-column: 1 / -1;
		min-height: 0;
		padding-block: 20px;
	}
}

/* Мобильный вид партнёров: вместо сетки — карусель, плавно едущая влево.
   Ниже 768px сетка полностью выключается, выше — выключается карусель.
   Линии — только по границам блока, во всю ширину экрана; вокруг самого
   ряда логотипов рамок нет (см. макет).
   Вертикальные отступы держит сам блок: у секции на мобилке padding: 0. */
.g2-partners-mobile {
	display: none;
	padding-block: 48px;
	border-block: 1px solid var(--g-line-on-light);
}

.g2-marquee {
	position: relative;
	margin-top: 28px;
	overflow: hidden;
}

.g2-marquee__track {
	display: flex;
	align-items: center;
	width: max-content;
	animation: g2-marquee 26s linear infinite;
}

.g2-marquee__item {
	flex: none;
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 64px;
	padding-inline: 28px;
}

/* Трек — две копии списка, поэтому сдвиг ровно на половину бесшовный */
@keyframes g2-marquee {
	from {
		transform: translateX(0);
	}
	to {
		transform: translateX(-50%);
	}
}

@media (prefers-reduced-motion: reduce) {
	.g2-marquee__track {
		animation: none;
	}
}

@media (max-width: 767px) {
	.g2-partners-mobile {
		display: block;
	}
	.g2-partners-desktop {
		display: none;
	}
	.g2-partners__logo {
		max-height: 32px;
		/* В карусели логотипы всегда в «спокойном» состоянии, ховера нет */
		filter: grayscale(100%);
		opacity: 0.55;
	}
}

/* --------------------------------------------------------------------------
   Карта
   -------------------------------------------------------------------------- */

.g2-map {
	position: relative;
}

.g2-map__image {
	margin-top: 32px;
}

.g2-map__image img {
	width: 100%;
}

/* --------------------------------------------------------------------------
   FAQ
   -------------------------------------------------------------------------- */

.g2-faq {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: 48px;
	align-items: start;
}

.g2-faq__caption {
	margin-bottom: 40px;
	color: var(--g-ol-secondary);
}

/* Линия под последним вопросом уходит во всю ширину экрана (как в макете) */
.g2-faq .g2-accordion {
	position: relative;
}

.g2-faq .g2-accordion__item:last-child {
	border-bottom: 0;
}

.g2-faq .g2-accordion::after {
	content: "";
	position: absolute;
	left: -100vw;
	right: -100vw;
	bottom: 0;
	border-top: 1px solid var(--g-border-light);
}

@media (max-width: 1023px) {
	.g2-faq {
		grid-template-columns: 1fr;
		gap: 24px;
	}
}

@media (max-width: 767px) {
	.g2-section#faq {
		padding-block: 80px;
	}
}

/* --------------------------------------------------------------------------
   Контакты
   -------------------------------------------------------------------------- */

/* Полоса 1 — заголовок + текст с кнопками */
.g2-contacts__intro {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: 40px;
	align-items: start;
}

.g2-contacts__cta {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 16px;
}

.g2-contacts__buttons {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
}

.g2-contacts__buttons .g2-btn {
	min-width: 184px;
}

	/* Полоса 2 — две карточки: контакты и юридическая информация */
.g2-contacts__cards {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px;
	padding: 0 12px;
}

.g2-contacts__card {
	padding: 32px;
	border-radius: var(--g-r-lg);
	background: var(--g-dark-card);
}

.g2-contacts__card-title {
	margin-bottom: 24px;
}

.g2-contacts__list {
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.g2-contacts__item {
	display: flex;
	align-items: center;
	gap: 12px;
	color: var(--g-od-primary);
	transition: color var(--g-dur) var(--g-ease);
}

.g2-contacts__item:hover {
	color: var(--g-cyan);
}

.g2-contacts__item svg {
	width: 24px;
	height: 24px;
	flex: none;
	color: var(--g-od-tertiary);
	transition: color var(--g-dur) var(--g-ease);
}

.g2-contacts__item:hover svg {
	color: var(--g-cyan);
}

.g2-contacts__legal {
	font-size: var(--g-t5-size);
	line-height: var(--g-t5-lh);
	color: var(--g-od-tertiary);
}

.g2-contacts__legal p + p {
	margin-top: 14px;
}

@media (max-width: 1023px) {
	.g2-contacts__intro,
	.g2-contacts__cards {
		grid-template-columns: 1fr;
		gap: 12px;
	}
}

@media (max-width: 767px) {
	/* Полоса с карточками контактов — отступы меньше, чем у остальных полос */
	.g2-contacts__band {
		padding-block: 16px;
	}
	.g2-contacts__cards {
		padding: 0;
	}
	.g2-contacts__card {
		padding: 20px;
	}
	.g2-contacts__buttons .g2-btn {
		flex: 1 1 auto;
	}
}

/* --------------------------------------------------------------------------
   Карьера (полоса 3 в секции контактов)
   -------------------------------------------------------------------------- */

.g2-band--tall {
	padding-block: 96px;
}

.g2-career {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 24px;
	text-align: center;
}

.g2-career__title {
	max-width: 850px;
}

.g2-career__text {
	max-width: 680px;
	color: var(--g-od-primary);
}

.g2-career .g2-btn {
	margin-top: 12px;
}

@media (max-width: 767px) {
	.g2-career {
		align-items: flex-start;
		text-align: left;
	}
	.g2-band--tall {
		padding-block: 48px;
	}
	.g2-career__title,
	.g2-career__text {
		max-width: none;
	}
}

