/* Corporate landing A/B presentation layers.
 * Control: /corporate/
 * Offer-first: /corporate/?variant=offer
 * Experience-first: /corporate/?variant=experience
 */

html[data-corporate-variant="offer"] .tb-hero {
	min-height: min(46rem, 82svh);
}

html[data-corporate-variant="offer"] .tb-hero::before {
	background:
		linear-gradient(90deg, rgba(5, 35, 72, 0.96) 0%, rgba(5, 35, 72, 0.88) 58%, rgba(5, 35, 72, 0.42) 100%),
		linear-gradient(0deg, rgba(5, 35, 72, 0.82) 0%, transparent 54%);
}

html[data-corporate-variant="offer"] .tb-hero__title {
	max-width: 18ch;
	font-size: clamp(2.4rem, 1.75rem + 2.1vw, 4rem);
}

html[data-corporate-variant="offer"] .tb-hero__offer {
	padding: 0.9rem 1rem;
	background: rgba(242, 242, 15, 0.12);
}

html[data-corporate-variant="offer"] .tb-hero__offer strong {
	font-size: 0.78rem;
}

html[data-corporate-variant="offer"] .tb-offer__card {
	background: linear-gradient(145deg, #ffffff 0%, #f2faff 100%);
	border: 2px solid var(--color-accent, #0a58b1);
	color: var(--color-dark, #111);
	box-shadow: 0 18px 48px rgba(10, 88, 177, 0.14);
}

html[data-corporate-variant="offer"] .tb-offer__eyebrow,
html[data-corporate-variant="offer"] .tb-offer__title,
html[data-corporate-variant="offer"] .tb-offer__price span {
	color: var(--color-accent-dark, #052348);
}

html[data-corporate-variant="offer"] .tb-offer__lead,
html[data-corporate-variant="offer"] .tb-offer__after {
	color: var(--color-dark, #111);
}

html[data-corporate-variant="offer"] .tb-offer__benefits li {
	border-color: rgba(10, 88, 177, 0.28);
	background: rgba(112, 191, 255, 0.12);
}

html[data-corporate-variant="offer"] .tb-offer__price del {
	color: var(--color-gray-dark, #777);
}

html[data-corporate-variant="offer"] .tb-usp__list {
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 1fr));
}

html[data-corporate-variant="experience"] .tb-hero {
	min-height: min(56rem, 92svh);
}

html[data-corporate-variant="experience"] .tb-hero::before {
	background:
		linear-gradient(90deg, rgba(5, 35, 72, 0.88) 0%, rgba(5, 35, 72, 0.62) 48%, rgba(5, 35, 72, 0.18) 100%),
		linear-gradient(0deg, rgba(5, 35, 72, 0.82) 0%, rgba(5, 35, 72, 0) 58%);
}

html[data-corporate-variant="experience"] .tb-hero__background img {
	object-position: center 46%;
	filter: brightness(74%) saturate(1.04);
}

html[data-corporate-variant="experience"] .tb-hero__title {
	max-width: 15ch;
}

html[data-corporate-variant="experience"] .tb-day__grid {
	background: linear-gradient(145deg, #f2faff 0%, #ffffff 100%);
	box-shadow: 0 18px 44px rgba(10, 88, 177, 0.1);
}

html[data-corporate-variant="experience"] .tb-atmosphere {
	padding-top: calc(var(--section-padding) * 0.75);
}

html[data-corporate-variant="experience"] .tb-final {
	order: initial;
}

@media (min-width: 64rem) {
	html[data-corporate-variant="offer"] .tb-hero__inner {
		display: grid;
		grid-template-columns: minmax(0, 1.12fr) minmax(21rem, 0.72fr);
		grid-template-areas:
			"eyebrow offer"
			"title offer"
			"lead ctas"
			"facts facts";
		column-gap: 3rem;
		row-gap: 1.15rem;
		align-items: start;
	}

	html[data-corporate-variant="offer"] .tb-hero__eyebrow { grid-area: eyebrow; }
	html[data-corporate-variant="offer"] .tb-hero__title { grid-area: title; }
	html[data-corporate-variant="offer"] .tb-hero__lead { grid-area: lead; }
	html[data-corporate-variant="offer"] .tb-hero__offer {
		grid-area: offer;
		align-self: end;
		width: 100%;
		min-height: 9rem;
		/* базовый чип — grid c двумя колонками; здесь нужна колонка,
		   иначе span выталкивается за рамку */
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: flex-start;
		gap: 0.45rem;
	}
	html[data-corporate-variant="offer"] .tb-hero__ctas {
		grid-area: ctas;
		grid-template-columns: 1fr;
		margin-top: 0;
	}
	html[data-corporate-variant="offer"] .tb-hero__ctas .button {
		width: 100%;
		min-width: 0;
		min-height: 3.75rem;
		justify-content: center;
		text-align: center;
		font-size: 0.9375rem;
	}
	html[data-corporate-variant="offer"] .tb-hero__possibilities {
		grid-area: facts;
		margin-top: 1rem;
	}
}

@media (max-width: 47.99rem) {
	html[data-corporate-variant="offer"] .tb-hero,
	html[data-corporate-variant="experience"] .tb-hero {
		min-height: auto;
	}

	html[data-corporate-variant="offer"] .tb-hero__title,
	html[data-corporate-variant="experience"] .tb-hero__title {
		font-size: clamp(1.9rem, 7.5vw, 2.2rem);
	}

	html[data-corporate-variant="offer"] .tb-hero__ctas,
	html[data-corporate-variant="experience"] .tb-hero__ctas {
		width: 100%;
	}

	html[data-corporate-variant="offer"] .tb-hero__ctas .button,
	html[data-corporate-variant="experience"] .tb-hero__ctas .button {
		width: 100%;
		min-width: 0;
		justify-content: center;
		text-align: center;
	}
}