/**
 * Home V4 — homepage-specific styles layered on top of tour-v4.css design tokens.
 * Loaded only when ACF option `v4_home_enabled` is true (front-page.php fork).
 *
 * Reuses every t4- token, color, easing, and shared component from tour-v4.css.
 * Only NEW styles for sections that don't exist on the tour page (hero, tour grid,
 * KPI cards, fleet, contact-cards) live here.
 */

/* ====================== TRUST STRIP — dark band, full width, above the fold ======================
   Sits between the white header and the hero. Branded square badges (G blue / TA green),
   5 yellow stars, score + count, trophy + shield outlined icons. */
body.t4-home .t4-trust {
	background: var(--t4-ink); /* #0c0c0c */
	color: #fff;
	padding: 14px 0;
	width: 100%;
}
body.t4-home .t4-trust__inner {
	max-width: var(--t4-container);
	margin: 0 auto;
	padding: 0 var(--t4-gutter);
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 22px;
	font-family: var(--t4-sans);
	font-size: var(--t4-fs-small);
	color: rgba(255,255,255,0.9);
}
body.t4-home .t4-trust__item {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	color: rgba(255,255,255,0.92);
	text-decoration: none;
	transition: color 200ms var(--t4-ease), opacity 200ms var(--t4-ease);
}
body.t4-home .t4-trust__item:hover { opacity: 0.85; }
/* Square brand badges — Google blue, TripAdvisor green */
body.t4-home .t4-trust__brand {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	border-radius: 6px;
	font-family: var(--t4-sans);
	font-size: var(--t4-fs-small);
	font-weight: 600;
	color: #fff;
	letter-spacing: -0.01em;
	flex-shrink: 0;
}
body.t4-home .t4-trust__brand--g  { background: #4285F4; }   /* Google blue */
body.t4-home .t4-trust__brand--ta { background: #00AA6C; font-size: var(--t4-fs-micro); } /* TA green */
body.t4-home .t4-trust__stars {
	display: inline-flex;
	gap: 2px;
	color: #f5b800; /* gold */
}
body.t4-home .t4-trust__stars svg { width: 14px; height: 14px; }
body.t4-home .t4-trust__num {
	font-weight: 600;
	font-size: var(--t4-fs-body);
	color: #fff;
	letter-spacing: -0.005em;
}
body.t4-home .t4-trust__count {
	color: rgba(255,255,255,0.6);
	font-size: var(--t4-fs-small);
	font-weight: 400;
}
body.t4-home .t4-trust__divider {
	width: 1px;
	height: 24px;
	background: rgba(255,255,255,0.15);
	display: inline-block;
}
body.t4-home .t4-trust__item--text {
	gap: 8px;
	font-weight: 600;
	color: #fff;
}
body.t4-home .t4-trust__icon {
	width: 18px;
	height: 18px;
	color: rgba(255,255,255,0.85);
	flex-shrink: 0;
}
body.t4-home .t4-trust__sub {
	color: rgba(255,255,255,0.55);
	font-weight: 400;
	margin-left: 2px;
	text-transform: lowercase;
}
body.t4-home .t4-trust__item--text strong { color: #fff; font-weight: 600; margin-left: 2px; }

@media (max-width: 1100px) {
	body.t4-home .t4-trust__inner { gap: 16px; }
	body.t4-home .t4-trust__count { display: none; }
}
@media (max-width: 768px) {
	body.t4-home .t4-trust__inner { gap: 14px; padding: 0 12px; font-size: 12px; }
	body.t4-home .t4-trust__divider { display: none; }
	body.t4-home .t4-trust__brand { width: 24px; height: 24px; font-size: 12px; }
	body.t4-home .t4-trust__stars svg { width: 12px; height: 12px; }
	body.t4-home .t4-trust__num { font-size: 14px; }
}
@media (max-width: 480px) {
	body.t4-home .t4-trust { padding: 10px 0; }
	body.t4-home .t4-trust__sub { display: none; }
	body.t4-home .t4-trust__inner { gap: 10px; }
}

/* ====================== HOME HERO — exactly one viewport (banner+strip fit a screen) ====================== */
body.t4-home .t4-hhero {
	position: relative;
	/* 100vh minus only the promo banner (38px) — the only element that actually
	   occupies flow-space above the hero (body.t4-page gets padding-top: 38px to
	   compensate for it). The header is position:fixed and overlaps the hero photo
	   instead of pushing it down, so it must NOT be subtracted again here — doing
	   so previously shorted the hero by ~80-90px and left a gap before the next
	   section within the first screen. */
	min-height: calc(100vh - 38px);
	display: flex;
	flex-direction: column;
	align-items: stretch;
	color: #fff;
	overflow: hidden;
	background: var(--t4-ink);
}
@media (max-width: 768px) {
	body.t4-home .t4-hhero {
		min-height: calc(100vh - 32px);
	}
}
body.t4-home .t4-hhero__media {
	position: absolute;
	inset: 0;
	z-index: 0;
}
body.t4-home .t4-hhero__bg {
	position: absolute;
	inset: 0;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	opacity: 0.55;
	transform: scale(1.04);
}
body.t4-home .t4-hhero__scrim {
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(12,12,12,0.30) 0%, rgba(12,12,12,0.55) 50%, rgba(12,12,12,0.85) 100%);
}
body.t4-home .t4-hhero__inner {
	position: relative;
	z-index: 1;
	max-width: var(--t4-container);
	margin: 0 auto;
	padding: 120px var(--t4-gutter) 80px;
	width: 100%;
}
body.t4-home .t4-hhero__top { margin-bottom: 24px; }
body.t4-home .t4-hhero__title {
	font-family: var(--t4-sans);
	font-weight: 800; /* PJS: Bebas был одновесный */
	font-size: clamp(var(--t4-fs-h2), 3.2vw, var(--t4-fs-h1));
	line-height: 0.92;
	letter-spacing: -0.01em;
	margin: 0 0 24px;
	color: #fff;
}
body.t4-home .t4-hhero__title-line { display: block; }
/* 27.07: на телефоне заголовок в две строки наезжал сам на себя — при 0.92
   строки перекрывались хвостами букв (g, y, D). Ниже 900px даём воздух;
   десктоп оставляем как принято владельцем. */
@media (max-width: 900px) {
	body.t4-home .t4-hhero__title { line-height: 1.06; }
	/* 27.07, решение владельца: русский заголовок короче английского («Багги туры
	   в Дубае»), поэтому на телефоне он крупнее — 46px вместо общих 26px.
	   Привязка к html[lang] — единственный способ отличить язык в CSS. */
	html[lang="ru-RU"] body.t4-home .t4-hhero__title { font-size: 46px; }
}
body.t4-home .t4-hhero__title-line--accent { color: var(--t4-red); }
body.t4-home .t4-hhero__lede {
	font-family: var(--t4-sans);
	font-size: clamp(var(--t4-fs-body), 1.4vw, var(--t4-fs-lg));
	line-height: 1.55;
	color: rgba(255,255,255,0.85);
	max-width: var(--t4-measure);
	margin: 0 0 32px;
}
body.t4-home .t4-hhero__rating {
	display: inline-flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 14px;
	margin-bottom: 28px;
}
body.t4-home .t4-hhero__rating .t4-hero__rating-item { padding: 8px 14px; }
body.t4-home .t4-hhero__ctas {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
}

@media (max-width: 768px) {
	body.t4-home .t4-hhero__inner { padding: 80px 16px 48px; }
	body.t4-home .t4-hhero__ctas { width: 100%; flex-direction: column; }
	body.t4-home .t4-hhero__ctas .t4-btn { width: 100%; justify-content: center; }
}

/* ====================== CATEGORY CARDS — design-exact ====================== */
body.t4-home .t4-cats {
	background: #fff;
	padding: var(--t4-sec) 0;
}
body.t4-home .t4-cats__inner {
	max-width: var(--t4-container);
	margin: 0 auto;
	padding: 0 var(--t4-gutter);
}
body.t4-home .t4-cats__head {
	margin-bottom: 48px;
	max-width: var(--t4-measure);
}
body.t4-home .t4-cats__lede {
	font-family: var(--t4-sans);
	font-size: var(--t4-fs-body);
	line-height: 1.65;
	color: var(--t4-body);
	margin: 18px 0 0;
}
body.t4-home .t4-cats__grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 28px;
}
@media (max-width: 900px) {
	body.t4-home .t4-cats__grid { grid-template-columns: 1fr; gap: 20px; }
	body.t4-home .t4-cats { padding: var(--t4-sec) 0; }
}
body.t4-home .t4-cat {
	position: relative;
	background: #fff;
	border: 1px solid var(--t4-line);
	border-radius: var(--t4-r-lg);
	overflow: hidden;
	display: flex;
	flex-direction: column;
	transition: transform 280ms var(--t4-ease), box-shadow 280ms var(--t4-ease), border-color 280ms var(--t4-ease);
}
body.t4-home .t4-cat:hover {
	transform: translateY(-4px);
	box-shadow: var(--t4-sh-md);
	border-color: rgba(255,40,0,0.4);
}
body.t4-home .t4-cat__media {
	position: relative;
	height: 320px;
	background: var(--t4-bg-1);
	overflow: hidden;
}
body.t4-home .t4-cat__slide {
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center;
	opacity: 0;
	transition: opacity 600ms var(--t4-ease);
}
body.t4-home .t4-cat__slide.is-active { opacity: 1; }
body.t4-home .t4-cat__dots {
	position: absolute;
	left: 50%;
	bottom: 16px;
	transform: translateX(-50%);
	display: inline-flex;
	gap: 6px;
	background: rgba(12,12,12,0.55);
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
	padding: 6px 10px;
	border-radius: 100px;
	z-index: 2;
}
body.t4-home .t4-cat__dot {
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: rgba(255,255,255,0.45);
	border: none;
	padding: 0;
	cursor: pointer;
	transition: background 200ms var(--t4-ease), transform 200ms var(--t4-ease);
}
body.t4-home .t4-cat__dot.is-active { background: #fff; transform: scale(1.25); }
body.t4-home .t4-cat__dot:hover { background: rgba(255,255,255,0.85); }
body.t4-home .t4-cat__badge {
	position: absolute;
	top: 16px;
	left: 16px;
	background: var(--t4-red);
	color: #fff;
	font-family: var(--t4-mono);
	font-size: var(--t4-fs-micro);
	letter-spacing: 0.1em;
	font-weight: 600;
	padding: 7px 12px;
	border-radius: 4px;
	z-index: 2;
	box-shadow: 0 2px 10px rgba(255,40,0,0.35);
}
body.t4-home .t4-cat__body {
	padding: 24px 26px 26px;
	display: flex;
	flex-direction: column;
	flex: 1;
	gap: 14px;
}
body.t4-home .t4-cat__incl {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 16px;
	font-family: var(--t4-mono);
	font-size: var(--t4-fs-micro);
	letter-spacing: 0.05em;
	text-transform: uppercase;
	color: var(--t4-body);
}
body.t4-home .t4-cat__incl span {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	line-height: 1;
}
body.t4-home .t4-cat__incl svg {
	width: 13px;
	height: 13px;
	color: var(--t4-red);
	flex-shrink: 0;
}
body.t4-home .t4-cat__title {
	font-family: var(--t4-sans);
	font-weight: 800; /* PJS: Bebas был одновесный */
	font-size: var(--t4-fs-h2);
	color: var(--t4-ink);
	letter-spacing: 0.005em;
	line-height: 1.05;
	margin: 0;
}
body.t4-home .t4-cat__blurb {
	font-family: var(--t4-sans);
	font-size: var(--t4-fs-small);
	line-height: 1.6;
	color: var(--t4-body);
	margin: 0;
	flex: 1;
}
body.t4-home .t4-cat__foot {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 16px;
	margin-top: auto;
	padding-top: 18px;
	border-top: 1px solid var(--t4-line);
}
body.t4-home .t4-cat__price {
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}
body.t4-home .t4-cat__was {
	font-family: var(--t4-mono);
	font-size: var(--t4-fs-micro);
	color: var(--t4-muted);
	text-decoration: line-through;
}
body.t4-home .t4-cat__now {
	font-family: var(--t4-sans);
	font-weight: 800; /* PJS: Bebas был одновесный */
	font-size: var(--t4-fs-h3);
	color: var(--t4-red);
	letter-spacing: 0.005em;
	line-height: 1;
}
body.t4-home .t4-cat__per {
	font-family: var(--t4-mono);
	font-size: var(--t4-fs-micro);
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--t4-muted);
	margin-top: 2px;
}
body.t4-home .t4-cats__more {
	margin-top: 36px;
	text-align: center;
}
@media (max-width: 600px) {
	body.t4-home .t4-cat__title { font-size: 32px; }
	body.t4-home .t4-cat__media { height: 210px; }
	body.t4-home .t4-cat__body { padding: 18px 20px 20px; gap: 12px; }
	/* Cap the blurb at 3 lines — 4 stacked cards must not read as a wall of text */
	body.t4-home .t4-cat__blurb {
		display: -webkit-box;
		-webkit-line-clamp: 3;
		-webkit-box-orient: vertical;
		overflow: hidden;
	}
	body.t4-home .t4-cat__foot { flex-direction: column; align-items: stretch; gap: 12px; padding-top: 14px; }
	body.t4-home .t4-cat__foot .t4-btn { width: 100%; justify-content: center; }
}

/* Legacy .t4-htours kept for backward compatibility — currently unused on home */
body.t4-home .t4-htours {
	background: #fff;
	padding: var(--t4-sec) 0;
}
body.t4-home .t4-htours__inner {
	max-width: var(--t4-container);
	margin: 0 auto;
	padding: 0 var(--t4-gutter);
}
body.t4-home .t4-htours__head {
	margin-bottom: 40px;
}
body.t4-home .t4-htours__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 24px;
}
@media (max-width: 1024px) {
	body.t4-home .t4-htours__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
}
@media (max-width: 600px) {
	body.t4-home .t4-htours__grid { grid-template-columns: 1fr; }
	body.t4-home .t4-htours { padding: var(--t4-sec) 0; }
}

body.t4-home .t4-htcard {
	display: flex;
	flex-direction: column;
	background: var(--t4-bg-1);
	border: 1px solid var(--t4-line);
	border-radius: var(--t4-r-lg);
	overflow: hidden;
	text-decoration: none;
	color: var(--t4-ink);
	transition: transform 280ms var(--t4-ease), box-shadow 280ms var(--t4-ease), border-color 280ms var(--t4-ease);
}
body.t4-home .t4-htcard:hover {
	transform: translateY(-4px);
	box-shadow: var(--t4-sh-md);
	border-color: rgba(255,40,0,0.4);
}
body.t4-home .t4-htcard:active { transform: translateY(-2px) scale(0.99); }
/* ENRICHED tour card — badge top-left, glass price chip bottom-right, rating
   chip in body, meta row, pickup line, tag chips, CTA with circular arrow. */
body.t4-home .t4-htcard__media {
	position: relative;
	height: 240px;
	background-size: cover;
	background-position: center;
	overflow: hidden;
	transition: transform 600ms var(--t4-ease);
}
body.t4-home .t4-htcard:hover .t4-htcard__media { transform: scale(1.04); }
body.t4-home .t4-htcard__badge {
	position: absolute;
	top: 14px;
	left: 14px;
	background: var(--t4-red);
	color: #fff;
	font-family: var(--t4-mono);
	font-size: var(--t4-fs-micro);
	letter-spacing: 0.08em;
	padding: 6px 11px;
	border-radius: 4px;
	font-weight: 600;
	box-shadow: 0 2px 8px rgba(255,40,0,0.3);
}
body.t4-home .t4-htcard__price {
	position: absolute;
	bottom: 14px;
	right: 14px;
	display: inline-flex;
	flex-direction: column;
	align-items: flex-end;
	background: rgba(12,12,12,0.78);
	color: #fff;
	padding: 6px 12px;
	border-radius: 6px;
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
	line-height: 1;
}
body.t4-home .t4-htcard__price-label {
	font-family: var(--t4-mono);
	font-size: var(--t4-fs-micro);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: rgba(255,255,255,0.7);
	margin-bottom: 3px;
}
body.t4-home .t4-htcard__price-amount {
	font-family: var(--t4-sans);
	font-weight: 800; /* PJS: Bebas был одновесный */
	font-size: var(--t4-fs-h4);
	letter-spacing: 0.01em;
}
body.t4-home .t4-htcard__body { padding: 22px 24px; flex: 1; display: flex; flex-direction: column; gap: 12px; }
body.t4-home .t4-htcard__head {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 12px;
}
body.t4-home .t4-htcard__title {
	font-family: var(--t4-sans);
	font-weight: 800; /* PJS: Bebas был одновесный */
	font-size: var(--t4-fs-h3);
	line-height: 1.05;
	color: var(--t4-ink);
	margin: 0;
	letter-spacing: 0.005em;
	flex: 1;
	min-width: 0;
}
body.t4-home .t4-htcard__rating {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	flex-shrink: 0;
	background: var(--t4-bg-1);
	padding: 4px 8px;
	border-radius: 100px;
	font-family: var(--t4-sans);
	font-size: var(--t4-fs-micro);
	color: var(--t4-ink);
}
body.t4-home .t4-htcard__rating svg { width: 12px; height: 12px; color: var(--t4-gold, #f5b800); }
body.t4-home .t4-htcard__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 12px 16px;
	font-family: var(--t4-sans);
	font-size: var(--t4-fs-micro);
	color: var(--t4-muted);
}
body.t4-home .t4-htcard__meta span {
	display: inline-flex;
	align-items: center;
	gap: 5px;
}
body.t4-home .t4-htcard__meta svg {
	width: 13px;
	height: 13px;
	color: var(--t4-red);
	flex-shrink: 0;
}
body.t4-home .t4-htcard__pickup {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-family: var(--t4-sans);
	font-size: var(--t4-fs-micro);
	color: var(--t4-body);
}
body.t4-home .t4-htcard__pickup svg { width: 12px; height: 12px; color: var(--t4-red); }
body.t4-home .t4-htcard__chips {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
}
body.t4-home .t4-htcard__chip {
	font-family: var(--t4-mono);
	font-size: var(--t4-fs-micro);
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--t4-ink);
	background: var(--t4-bg-1);
	border: 1px solid var(--t4-line);
	padding: 4px 8px;
	border-radius: 4px;
	font-weight: 600;
}
body.t4-home .t4-htcard__cta {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 8px;
	font-family: var(--t4-sans);
	font-size: var(--t4-fs-small);
	font-weight: 600;
	color: var(--t4-red);
	margin-top: auto;
	padding-top: 14px;
	border-top: 1px solid var(--t4-line);
}
body.t4-home .t4-htcard__arrow {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	background: var(--t4-red);
	color: #fff;
	transition: transform 280ms var(--t4-ease);
}
body.t4-home .t4-htcard__arrow svg { width: 14px; height: 14px; }
body.t4-home .t4-htcard:hover .t4-htcard__arrow { transform: translateX(4px); }

/* ====================== WHY US ====================== */
body.t4-home .t4-hwhy {
	background: var(--t4-bg-1);
	border-top: 1px solid var(--t4-line);
	border-bottom: 1px solid var(--t4-line);
	padding: var(--t4-sec) 0;
}
body.t4-home .t4-hwhy__inner {
	max-width: var(--t4-container);
	margin: 0 auto;
	padding: 0 var(--t4-gutter);
	display: grid;
	grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
	gap: 64px;
	align-items: start;
}
body.t4-home .t4-hwhy__head .t4-block__title { max-width: 100%; }
body.t4-home .t4-hwhy__lede {
	font-family: var(--t4-sans);
	font-size: var(--t4-fs-body);
	line-height: 1.7;
	color: var(--t4-body);
	margin-top: 22px;
	max-width: var(--t4-measure);
}
body.t4-home .t4-hwhy__kpis {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 16px;
}
body.t4-home .t4-kpi {
	background: #fff;
	border: 1px solid var(--t4-line);
	border-radius: var(--t4-r-md);
	padding: 28px 24px;
	transition: transform 280ms var(--t4-ease), border-color 280ms var(--t4-ease);
}
body.t4-home .t4-kpi:hover { transform: translateY(-3px); box-shadow: var(--t4-sh-md); }
body.t4-home .t4-kpi__num {
	font-family: var(--t4-sans);
	font-weight: 800; /* PJS: Bebas был одновесный */
	font-size: var(--t4-fs-h3); /* шкала агрегаторов */
	line-height: 1;
	color: var(--t4-red);
	letter-spacing: -0.01em;
	margin-bottom: 10px;
	/* Count-up animation: equal-width digits so the box doesn't jitter while counting */
	font-variant-numeric: tabular-nums;
}
body.t4-home .t4-kpi__label {
	/* был JetBrains Mono капсом — «странный шрифт» (юзер 2026-07-14); mono теперь только для коротких кикеров */
	font-family: var(--t4-sans);
	font-size: var(--t4-fs-small);
	line-height: 1.5;
	color: var(--t4-muted);
}
/* Two-word KPI headlines (FREE PICKUP / PRO GUIDES) — smaller display size so they
   stay on one line and read as a claim, not a number */
body.t4-home .t4-kpi__num--text {
	font-size: var(--t4-fs-h4);
	font-weight: 600;
	line-height: 1.2;
	letter-spacing: 0;
}
@media (max-width: 1024px) {
	body.t4-home .t4-hwhy__inner { grid-template-columns: 1fr; gap: 40px; }
}
@media (max-width: 600px) {
	body.t4-home .t4-hwhy { padding: var(--t4-sec) 0; }
	body.t4-home .t4-kpi { padding: 22px 18px; }
	/* Мобилка: цифры были КРУПНЕЕ десктопа (30px) и дёргали сетку при анимации —
	   ужаты (юзер 2026-07-15); tabular-nums выше добивает джиттер ширины. */
	body.t4-home .t4-kpi__num { font-size: 22px; }
	body.t4-home .t4-kpi__num--text { font-size: 18px; }
}

/* ====================== FLEET ====================== */
body.t4-home .t4-hfleet {
	background: #fff;
	padding: var(--t4-sec) 0;
}
body.t4-home .t4-hfleet__inner {
	max-width: var(--t4-container);
	margin: 0 auto;
	padding: 0 var(--t4-gutter);
}
body.t4-home .t4-hfleet__head { margin-bottom: 40px; }
body.t4-home .t4-hfleet__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 24px;
}
@media (max-width: 900px) {
	body.t4-home .t4-hfleet__grid { grid-template-columns: 1fr; }
	body.t4-home .t4-hfleet { padding: var(--t4-sec) 0; }
}
body.t4-home .t4-fcard {
	background: var(--t4-bg-1);
	border: 1px solid var(--t4-line);
	border-radius: var(--t4-r-lg);
	overflow: hidden;
}
body.t4-home .t4-fcard__media {
	height: 200px;
	background-size: cover;
	background-position: center;
}
body.t4-home .t4-fcard__body { padding: 22px 24px; }
body.t4-home .t4-fcard__name {
	font-family: var(--t4-sans);
	font-weight: 800; /* PJS: Bebas был одновесный */
	font-size: var(--t4-fs-h3);
	color: var(--t4-ink);
	letter-spacing: 0.005em;
	margin-bottom: 4px;
}
body.t4-home .t4-fcard__spec {
	font-family: var(--t4-mono);
	font-size: var(--t4-fs-micro);
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--t4-red);
	margin-bottom: 12px;
}
body.t4-home .t4-fcard__role {
	font-family: var(--t4-sans);
	font-size: var(--t4-fs-small);
	line-height: 1.55;
	color: var(--t4-body);
}

/* ====================== REVIEWS — reuse t4-fr carousel from tour-v4.css ====================== */
body.t4-home .t4-hreviews,
body.t4-catalog .t4-hreviews {
	background: var(--t4-bg-1);
	border-top: 1px solid var(--t4-line);
	border-bottom: 1px solid var(--t4-line);
	padding: var(--t4-sec) 0;
}
body.t4-home .t4-hreviews__inner,
body.t4-catalog .t4-hreviews__inner {
	max-width: var(--t4-container);
	margin: 0 auto;
	padding: 0 var(--t4-gutter);
	min-width: 0;
}
body.t4-home .t4-hreviews__head,
body.t4-catalog .t4-hreviews__head {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	gap: 24px;
	margin-bottom: 32px;
	min-width: 0;
}
body.t4-home .t4-hreviews__head .t4-block__title,
body.t4-catalog .t4-hreviews__head .t4-block__title { margin-bottom: 0; }
@media (max-width: 768px) {
	body.t4-home .t4-hreviews,
	body.t4-catalog .t4-hreviews { padding: var(--t4-sec) 0; }
	body.t4-home .t4-hreviews__head,
	body.t4-catalog .t4-hreviews__head { flex-direction: column; align-items: flex-start; }
	body.t4-home .t4-hreviews__head .t4-fr-block__nav,
	body.t4-catalog .t4-hreviews__head .t4-fr-block__nav { align-self: flex-end; }
}

/* ====================== SAFETY INFO ACCORDION ====================== */
body.t4-home .t4-hsafety {
	background: #fff;
	padding: var(--t4-sec) 0;
}
body.t4-home .t4-hsafety__inner {
	max-width: var(--t4-content);
	margin: 0 auto;
	padding: 0 var(--t4-gutter);
}
body.t4-home .t4-hsafety__head { margin-bottom: 36px; text-align: center; }
body.t4-home .t4-hsafety .t4-faq__a ul { padding-left: 18px; margin: 0; }
body.t4-home .t4-hsafety .t4-faq__a li { padding: 7px 0; line-height: 1.6; }
@media (max-width: 600px) {
	body.t4-home .t4-hsafety { padding: var(--t4-sec) 0; }
}

/* ====================== CONTACT — Variant A: cream cards ====================== */
body.t4-home .t4-hcontact,
body.t4-catalog .t4-hcontact {
	background: linear-gradient(180deg, #ffffff 0%, var(--t4-bg-1) 100%);
	padding: var(--t4-sec) 0;
	border-top: 1px solid var(--t4-line);
}
body.t4-home .t4-hcontact__inner,
body.t4-catalog .t4-hcontact__inner {
	max-width: var(--t4-container);
	margin: 0 auto;
	padding: 0 var(--t4-gutter);
}
body.t4-home .t4-hcontact__head,
body.t4-catalog .t4-hcontact__head {
	text-align: center;
	margin-bottom: 48px;
}
body.t4-home .t4-hcontact__sub,
body.t4-catalog .t4-hcontact__sub {
	font-family: var(--t4-sans);
	font-size: var(--t4-fs-body);
	line-height: 1.6;
	color: var(--t4-body);
	max-width: var(--t4-measure);
	margin: 16px auto 0;
}
body.t4-home .t4-hcontact__cards,
body.t4-catalog .t4-hcontact__cards {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 20px;
	max-width: var(--t4-content);
	margin: 0 auto;
}
@media (max-width: 768px) {
	body.t4-home .t4-hcontact__cards,
body.t4-catalog .t4-hcontact__cards { grid-template-columns: 1fr; gap: 14px; }
	body.t4-home .t4-hcontact,
body.t4-catalog .t4-hcontact { padding: var(--t4-sec) 0; }
}
body.t4-home .t4-ccard,
body.t4-catalog .t4-ccard {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	background: #fff;
	border: 1px solid var(--t4-line);
	border-radius: var(--t4-r-lg);
	padding: 32px 28px;
	text-decoration: none;
	color: var(--t4-ink);
	transition: transform 280ms var(--t4-ease), box-shadow 280ms var(--t4-ease), border-color 280ms var(--t4-ease);
}
body.t4-home .t4-ccard:hover,
body.t4-catalog .t4-ccard:hover {
	transform: translateY(-4px);
	box-shadow: var(--t4-sh-md);
	border-color: var(--t4-red);
}
body.t4-home .t4-ccard:active,
body.t4-catalog .t4-ccard:active { transform: translateY(-2px) scale(0.99); }
body.t4-home .t4-ccard__icon,
body.t4-catalog .t4-ccard__icon {
	width: 56px;
	height: 56px;
	border-radius: 50%;
	background: rgba(255,40,0,0.10);
	color: var(--t4-red);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 20px;
	transition: background 280ms var(--t4-ease);
}
body.t4-home .t4-ccard:hover .t4-ccard__icon,
body.t4-catalog .t4-ccard:hover .t4-ccard__icon { background: var(--t4-red); color: #fff; }
body.t4-home .t4-ccard__icon svg,
body.t4-catalog .t4-ccard__icon svg { width: 24px; height: 24px; }
body.t4-home .t4-ccard__name,
body.t4-catalog .t4-ccard__name {
	font-family: var(--t4-sans);
	font-weight: 800; /* PJS: Bebas был одновесный */
	font-size: var(--t4-fs-h4);
	color: var(--t4-ink);
	letter-spacing: 0.005em;
	margin-bottom: 6px;
}
body.t4-home .t4-ccard__action,
body.t4-catalog .t4-ccard__action {
	font-family: var(--t4-sans);
	font-size: var(--t4-fs-body);
	font-weight: 600;
	color: var(--t4-red);
	margin-bottom: 4px;
	word-break: break-word;
}
body.t4-home .t4-ccard__hint,
body.t4-catalog .t4-ccard__hint {
	font-family: var(--t4-mono);
	font-size: var(--t4-fs-micro);
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--t4-muted);
}
body.t4-home .t4-hcontact__foot,
body.t4-catalog .t4-hcontact__foot {
	margin-top: 40px;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 8px;
	font-family: var(--t4-mono);
	font-size: var(--t4-fs-micro);
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--t4-muted);
}
body.t4-home .t4-hcontact__foot svg,
body.t4-catalog .t4-hcontact__foot svg { width: 14px; height: 14px; color: var(--t4-red); }
body.t4-home .t4-hcontact__dot,
body.t4-catalog .t4-hcontact__dot { color: var(--t4-line-2); }

/* ====================== HOW IT WORKS — vertical timeline ====================== */
body.t4-home .t4-hsteps {
	background: #fff;
	padding: var(--t4-sec) 0;
	border-top: 1px solid var(--t4-line);
}
body.t4-home .t4-hsteps__inner {
	max-width: var(--t4-content);
	margin: 0 auto;
	padding: 0 var(--t4-gutter);
}
body.t4-home .t4-hsteps__head {
	margin-bottom: 50px;
	text-align: center;
}
body.t4-home .t4-steps {
	list-style: none;
	margin: 0;
	padding: 0;
	position: relative;
}
body.t4-home .t4-steps::before {
	content: '';
	position: absolute;
	left: 21px;
	top: 22px;
	bottom: 22px;
	width: 2px;
	background: linear-gradient(180deg, var(--t4-red) 0%, var(--t4-line-2) 100%);
}
body.t4-home .t4-step {
	display: flex;
	gap: 24px;
	padding: 12px 0 28px;
	position: relative;
}
body.t4-home .t4-step:last-child { padding-bottom: 0; }
body.t4-home .t4-step__num {
	flex-shrink: 0;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background: #fff;
	border: 2px solid var(--t4-red);
	color: var(--t4-red);
	font-family: var(--t4-sans);
	font-weight: 800; /* PJS: Bebas был одновесный */
	font-size: var(--t4-fs-lg);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	position: relative;
	z-index: 1;
	letter-spacing: 0.02em;
	transition: background 280ms var(--t4-ease), color 280ms var(--t4-ease);
}
body.t4-home .t4-step:hover .t4-step__num { background: var(--t4-red); color: #fff; }
body.t4-home .t4-step__body { flex: 1; padding-top: 4px; }
body.t4-home .t4-step__kicker {
	font-family: var(--t4-mono);
	font-size: var(--t4-fs-micro);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--t4-muted);
	margin-bottom: 6px;
}
body.t4-home .t4-step__title {
	font-family: var(--t4-sans);
	font-weight: 800; /* PJS: Bebas был одновесный */
	font-size: var(--t4-fs-h3);
	color: var(--t4-ink);
	letter-spacing: 0.005em;
	margin-bottom: 8px;
	line-height: 1.1;
}
body.t4-home .t4-step__desc {
	font-family: var(--t4-sans);
	font-size: var(--t4-fs-body);
	line-height: 1.65;
	color: var(--t4-body);
	margin: 0;
}
@media (max-width: 600px) {
	body.t4-home .t4-hsteps { padding: var(--t4-sec) 0; }
	body.t4-home .t4-step { gap: 16px; padding: 8px 0 24px; }
	body.t4-home .t4-step__num { width: 38px; height: 38px; font-size: 16px; }
	body.t4-home .t4-steps::before { left: 18px; }
	body.t4-home .t4-step__title { font-size: 22px; }
}

/* ====================== WATCH A TOUR — video preview gallery ====================== */
body.t4-home .t4-hgal {
	background: var(--t4-bg-1);
	border-top: 1px solid var(--t4-line);
	border-bottom: 1px solid var(--t4-line);
	padding: var(--t4-sec) 0;
}
body.t4-home .t4-hgal__inner {
	max-width: var(--t4-container);
	margin: 0 auto;
	padding: 0 var(--t4-gutter);
}
body.t4-home .t4-hgal__head { margin-bottom: 36px; }
body.t4-home .t4-hgal__grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 18px;
}
@media (max-width: 1024px) {
	body.t4-home .t4-hgal__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
	body.t4-home .t4-hgal { padding: var(--t4-sec) 0; }
	body.t4-home .t4-hgal__grid { grid-template-columns: 1fr; }
}
body.t4-home .t4-hgal__item {
	position: relative;
	display: block;
	aspect-ratio: 4 / 5;
	border-radius: var(--t4-r-md);
	background-size: cover;
	background-position: center;
	background-color: var(--t4-ink);
	overflow: hidden;
	color: #fff;
	text-decoration: none;
	transition: transform 280ms var(--t4-ease), box-shadow 280ms var(--t4-ease);
}
body.t4-home .t4-hgal__item::after {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, transparent 40%, rgba(0,0,0,0.7) 100%);
}
body.t4-home .t4-hgal__item:hover { transform: translateY(-4px); box-shadow: var(--t4-sh-md); }
body.t4-home .t4-hgal__play {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 64px;
	height: 64px;
	border-radius: 50%;
	background: var(--t4-red);
	color: #fff;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	z-index: 2;
	transition: transform 280ms var(--t4-ease);
	box-shadow: 0 6px 20px rgba(255,40,0,0.4);
}
body.t4-home .t4-hgal__item:hover .t4-hgal__play { transform: translate(-50%, -50%) scale(1.08); }
body.t4-home .t4-hgal__play svg { width: 24px; height: 24px; margin-left: 3px; }
body.t4-home .t4-hgal__title {
	position: absolute;
	left: 16px;
	right: 16px;
	bottom: 16px;
	z-index: 2;
	font-family: var(--t4-sans);
	font-weight: 800; /* PJS: Bebas был одновесный */
	font-size: var(--t4-fs-lg);
	letter-spacing: 0.005em;
	line-height: 1.15;
}

/* ====================== PROUD PARTNERS — logo strip ====================== */
body.t4-home .t4-hpartners,
body.t4-catalog .t4-hpartners {
	background: #fff;
	padding: var(--t4-sec-sm) 0;
}
body.t4-home .t4-hpartners__inner,
body.t4-catalog .t4-hpartners__inner {
	max-width: var(--t4-container);
	margin: 0 auto;
	padding: 0 var(--t4-gutter);
}
body.t4-home .t4-hpartners__lab,
body.t4-catalog .t4-hpartners__lab {
	font-family: var(--t4-mono);
	font-size: var(--t4-fs-micro);
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--t4-muted);
	text-align: center;
	margin-bottom: 28px;
}
body.t4-home .t4-hpartners__row,
body.t4-catalog .t4-hpartners__row {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 36px 48px;
}
body.t4-home .t4-hpartners__row li,
body.t4-catalog .t4-hpartners__row li {
	display: inline-flex;
	align-items: center;
	justify-content: center;
}
body.t4-home .t4-hpartners__row img,
body.t4-catalog .t4-hpartners__row img {
	height: 32px;
	width: auto;
	max-width: 140px;
	object-fit: contain;
	opacity: 0.65;
	filter: grayscale(60%);
	transition: opacity 280ms var(--t4-ease), filter 280ms var(--t4-ease);
}
body.t4-home .t4-hpartners__row li:hover img,
body.t4-catalog .t4-hpartners__row li:hover img {
	opacity: 1;
	filter: grayscale(0%);
}
@media (max-width: 768px) {
	body.t4-home .t4-hpartners__row,
	body.t4-catalog .t4-hpartners__row { gap: 24px 32px; }
	body.t4-home .t4-hpartners__row img,
	body.t4-catalog .t4-hpartners__row img { height: 26px; max-width: 110px; }
}

/* ====================== HHERO__STRIP — trust signals at hero bottom ======================
   Sits at the bottom of the hero section, full hero width, frosted dark backdrop. */
body.t4-home .t4-hhero__strip ,
body.t4-catalog .t4-hhero__strip {
	position: relative;
	z-index: 2;
	margin-top: auto;
	background: rgba(0,0,0,0.55);
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
	border-top: 1px solid rgba(255,255,255,0.1);
}
body.t4-home .t4-hhero__strip-inner ,
body.t4-catalog .t4-hhero__strip-inner {
	max-width: var(--t4-container);
	margin: 0 auto;
	padding: 14px var(--t4-gutter);
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 22px;
	color: rgba(255,255,255,0.92);
	font-family: var(--t4-sans);
	font-size: var(--t4-fs-small);
}
body.t4-home .t4-hstat,
body.t4-catalog .t4-hstat {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	color: rgba(255,255,255,0.92);
	text-decoration: none;
	transition: opacity 200ms var(--t4-ease);
}
body.t4-home .t4-hstat:hover,
body.t4-catalog .t4-hstat:hover { opacity: 0.78; }
body.t4-home .t4-hstat strong,
body.t4-catalog .t4-hstat strong { color: #fff; font-weight: 600; font-size: var(--t4-fs-body); }
/* Logos sourced same as tour-page hero (PNG from media library) */
body.t4-home .t4-hstat__logo,
body.t4-catalog .t4-hstat__logo {
	height: 22px;
	width: auto;
	display: inline-block;
	flex-shrink: 0;
}
/* TripAdvisor PNG is dark — invert to white silhouette so it reads on the dark hero strip */
body.t4-home .t4-hstat__logo--ta,
body.t4-catalog .t4-hstat__logo--ta {
	height: 18px;
	filter: brightness(0) invert(1);
}
/* Google stars — same trick as tour-page: repeat single-star PNG horizontally */
body.t4-home .t4-hstat__stars,
body.t4-catalog .t4-hstat__stars {
	display: inline-block;
	flex-shrink: 0;
	width: 70px;
	height: 14px;
	background-image: url('https://www.bigreddxb.com/wp-content/uploads/2026/02/google-stars.png');
	background-size: 14px 14px;
	background-repeat: repeat-x;
	background-position: left center;
}
/* TripAdvisor 5 green dots — inline SVG matching tour page */
body.t4-home .t4-hstat__tadots,
body.t4-catalog .t4-hstat__tadots {
	height: 11px;
	width: auto;
	flex-shrink: 0;
	display: inline-block;
}
body.t4-home .t4-hstat__count,
body.t4-catalog .t4-hstat__count { color: rgba(255,255,255,0.6); font-weight: 400; }
body.t4-home .t4-hstat__icon,
body.t4-catalog .t4-hstat__icon { width: 16px; height: 16px; color: rgba(255,255,255,0.85); }
/* Travelers' Choice owl SVG (same as tour hero) — small, full color */
body.t4-home .t4-hstat__tc,
body.t4-catalog .t4-hstat__tc {
	width: 22px;
	height: 22px;
	flex-shrink: 0;
}
body.t4-home .t4-hstat__sub,
body.t4-catalog .t4-hstat__sub { color: rgba(255,255,255,0.55); font-weight: 400; }
@media (max-width: 1024px) {
	body.t4-home .t4-hhero__strip-inner ,
	body.t4-catalog .t4-hhero__strip-inner { gap: 14px; font-size: 12px; }
	body.t4-home .t4-hstat__count,
	body.t4-catalog .t4-hstat__count { display: none; }
}
@media (max-width: 768px) {
	/* Grid (not flex-wrap) so column 2 (TripAdvisor / Travelers' Choice) lines up
	   vertically instead of each row right-aligning independently based on its own
	   content width. */
	body.t4-home .t4-hhero__strip-inner ,
	body.t4-catalog .t4-hhero__strip-inner {
		display: grid;
		grid-template-columns: 1fr 1fr;
		justify-content: normal;
		padding: 12px 14px;
		gap: 12px;
	}
	body.t4-home .t4-hstat__logo,
	body.t4-catalog .t4-hstat__logo { height: 18px; }
	body.t4-home .t4-hstat__logo--ta,
	body.t4-catalog .t4-hstat__logo--ta { height: 14px; }
	body.t4-home .t4-hstat__stars,
	body.t4-catalog .t4-hstat__stars { height: 12px; width: 60px; background-size: 12px 12px; }
	body.t4-home .t4-hstat__tadots,
	body.t4-catalog .t4-hstat__tadots { height: 9px; }
}

/* Hero column layout — banner content fills, strip sits flush at bottom */
body.t4-home .t4-hhero__inner {
	flex: 1;
	align-items: flex-start;
	padding-top: 100px;
	padding-bottom: 60px;
	position: relative; /* anchor for the desktop review card */
}
body.t4-home .t4-hhero__strip ,
body.t4-catalog .t4-hhero__strip { width: 100%; }

/* ====================== MOBILE TRUST (V2): two white chips + caption ====================== */
body.t4-home .t4-hhero__mtrust { display: none; }
@media (max-width: 768px) {
	/* Strip's 2×2 grid replaced by the V2 chips block on phones */
	body.t4-home .t4-hhero__strip { display: none; }
	body.t4-home .t4-hhero__mtrust {
		display: block;
		position: relative;
		z-index: 2;
		padding: 0 16px 18px;
	}
	body.t4-home .t4-hhero__mchips { display: flex; gap: 10px; margin-bottom: 10px; }
	body.t4-home .t4-mchip {
		flex: 1;
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 8px;
		/* Glass, not solid white — quieter against the photo */
		background: rgba(255,255,255,0.14);
		-webkit-backdrop-filter: blur(10px);
		backdrop-filter: blur(10px);
		border: 1px solid rgba(255,255,255,0.22);
		border-radius: 12px;
		padding: 10px 8px;
		text-decoration: none;
		color: #fff;
	}
	body.t4-home .t4-mchip__logo { width: 20px; height: 20px; flex-shrink: 0; }
	body.t4-home .t4-mchip__logo--ta { width: auto; height: 16px; filter: brightness(0) invert(1); }
	body.t4-home .t4-mchip__lines { line-height: 1.2; }
	body.t4-home .t4-mchip__score { display: block; font-family: var(--t4-sans); font-size: 14px; font-weight: 800; }
	body.t4-home .t4-mchip__stars { font-style: normal; color: #FBBC04; font-size: 12px; letter-spacing: 1px; }
	body.t4-home .t4-mchip__tadots { font-style: normal; color: #00EB8C; font-size: 12px; letter-spacing: 1px; }
	body.t4-home .t4-mchip__sub { display: block; font-family: var(--t4-sans); font-size: 12px; font-weight: 600; color: rgba(255,255,255,0.65); }
	body.t4-home .t4-hhero__mcap {
		text-align: center;
		font-family: var(--t4-mono);
		font-size: 12px;
		letter-spacing: 0.02em;
		color: rgba(255,255,255,0.75);
		white-space: nowrap;
		overflow: hidden;
	}

	/* Content block (pill + title + lede + CTA) VERTICALLY CENTERED in the free
	   zone between the fixed promo+header and the trust chips (user 2026-07-15;
	   was: fixed padding-top 118px). Horizontal alignment stays left. */
	body.t4-home .t4-hhero__inner {
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		justify-content: center;
		padding-top: 92px; /* fixed promo bar 36px + header 56px — min clearance */
		padding-bottom: 16px;
	}
}

/* ====================== HERO PILL — TC badge icon inside the glass pill ====================== */
body.t4-home .t4-hhero__top .t4-pill .t4-pill__tc {
	width: 16px;
	height: 16px;
	flex-shrink: 0;
}

/* ====================== V2 DESKTOP TWEAKS (homepage only) ======================
   1) Promo bar ~30% lower and typographically quieter — stays, stops stealing focus.
   2) Bottom trust strip = glass over the photo (light tint + strong blur) instead of
      a black footer-like band; hero scrim eased towards the bottom so the dunes show
      through. Both scoped to body.t4-home ≥769px — catalog/other pages keep the
      shared 38px promo and dark strip. */
@media (min-width: 769px) {
	/* Hero content sits ~50px lower — more air under the header */
	body.t4-home .t4-hhero__inner { padding-top: 150px; }
	/* Book now: same footprint, "richer" type — bigger/bolder text, paddings trimmed
	   to compensate so the button gets neither wider nor taller */
	body.t4-home .t4-hhero__ctas .t4-btn {
		font-size: var(--t4-fs-body);
		font-weight: 600;
		letter-spacing: 0.005em;
		padding: 10px 18px;
		/* Wider, not taller — "confident" premium footprint (was ~130px auto) */
		min-width: 150px;
	}
	/* Quiet 22px promo bar, header top/body padding 22px and the outline header
	   "Book online" moved to tour-v4.css (site-wide V4 etalon, 2026-07-07). */
	body.t4-home .t4-hhero { min-height: calc(100vh - 22px); }
	body.t4-home .t4-hhero__strip {
		background: rgba(0,0,0,0.28);
		-webkit-backdrop-filter: blur(18px);
		backdrop-filter: blur(18px);
		border-top-color: rgba(255,255,255,0.12);
	}
	body.t4-home .t4-hhero__scrim {
		background: linear-gradient(180deg, rgba(12,12,12,0.50) 0%, rgba(12,12,12,0.25) 40%, rgba(12,12,12,0.35) 80%, rgba(12,12,12,0.45) 100%);
	}
}

/* ====================== HOWW — 3 steps + PAY WITH ====================== */
body.t4-home .t4-howw {
	background: var(--t4-bg-1);
	border-top: 1px solid var(--t4-line);
	border-bottom: 1px solid var(--t4-line);
	padding: var(--t4-sec) 0;
}
body.t4-home .t4-howw__inner {
	max-width: var(--t4-container);
	margin: 0 auto;
	padding: 0 var(--t4-gutter);
	text-align: center;
}
body.t4-home .t4-howw__inner .t4-kicker { display: inline-block; }
body.t4-home .t4-howw__inner .t4-block__title { margin-bottom: 50px; }
body.t4-home .t4-howw__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 28px;
	text-align: left;
}
@media (max-width: 800px) {
	body.t4-home .t4-howw__grid { grid-template-columns: 1fr; gap: 18px; }
	body.t4-home .t4-howw { padding: var(--t4-sec) 0; }
}
body.t4-home .t4-hstep {
	background: #fff;
	border: 1px solid var(--t4-line);
	border-radius: var(--t4-r-md);
	padding: 32px 28px 28px;
	transition: transform 280ms var(--t4-ease), border-color 280ms var(--t4-ease);
}
body.t4-home .t4-hstep:hover {
	transform: translateY(-3px);
	border-color: rgba(255,40,0,0.4);
}
body.t4-home .t4-hstep__n {
	font-family: var(--t4-sans);
	font-weight: 800; /* PJS: Bebas был одновесный */
	font-size: var(--t4-fs-h2);
	color: var(--t4-red);
	line-height: 1;
	margin-bottom: 16px;
	letter-spacing: 0.005em;
}
body.t4-home .t4-hstep__t {
	font-family: var(--t4-sans);
	font-weight: 800; /* PJS: Bebas был одновесный */
	font-size: var(--t4-fs-h3);
	color: var(--t4-ink);
	letter-spacing: 0.005em;
	margin: 0 0 10px;
}
body.t4-home .t4-hstep__c {
	font-family: var(--t4-sans);
	font-size: var(--t4-fs-small);
	line-height: 1.6;
	color: var(--t4-body);
	margin: 0;
}
body.t4-home .t4-howw__pay {
	margin-top: 40px;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 16px;
	flex-wrap: wrap;
}
body.t4-home .t4-howw__paylab {
	font-family: var(--t4-mono);
	font-size: var(--t4-fs-micro);
	letter-spacing: 0.18em;
	color: var(--t4-muted);
	font-weight: 600;
}
body.t4-home .t4-howw__paychips {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
}
body.t4-home .t4-howw__paychips span {
	background: #fff;
	border: 1px solid var(--t4-line);
	color: var(--t4-ink);
	font-family: var(--t4-sans);
	font-size: var(--t4-fs-micro);
	font-weight: 600;
	padding: 7px 12px;
	border-radius: 100px;
}

/* ====================== HGAL__RAIL — horizontal video scroll ====================== */
body.t4-home .t4-hgal__head {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	gap: 20px;
	margin-bottom: 28px;
}
body.t4-home .t4-hgal__all {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-family: var(--t4-sans);
	font-size: var(--t4-fs-small);
	font-weight: 600;
	color: var(--t4-red);
	text-decoration: none;
	transition: gap 200ms var(--t4-ease);
}
body.t4-home .t4-hgal__all:hover { gap: 10px; }
body.t4-home .t4-hgal__all svg { width: 14px; height: 14px; }
body.t4-home .t4-hgal__rail {
	display: flex;
	gap: 16px;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: none;
	padding-bottom: 8px;
	margin: 0 calc(-1 * var(--t4-gutter)); /* full bleed at edges */
	padding-left: var(--t4-gutter);
	padding-right: var(--t4-gutter);
	min-width: 0;
}
body.t4-home .t4-hgal__rail::-webkit-scrollbar { display: none; }

/* Управление рельсой с десктопа (аудит UX 2026-07-14: скроллбар спрятан, стрелок не было —
   лента была недоступна мышью). Стрелки в стиле v6-карусели; drag через data-t4rail в tour-v4.js */
body.t4-home .t4-hgal__railwrap { position: relative; }
body.t4-home .t4-hgal__arrow {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 2;
	width: 40px;
	height: 40px;
	display: none;
	align-items: center;
	justify-content: center;
	border: 1px solid rgba(0,0,0,0.08);
	border-radius: 50%;
	background: #fff;
	box-shadow: 0 4px 14px rgba(0,0,0,0.18);
	color: var(--t4-ink);
	cursor: pointer;
	transition: opacity 180ms var(--t4-ease), background 180ms var(--t4-ease);
}
body.t4-home .t4-hgal__arrow svg { width: 20px; height: 20px; }
body.t4-home .t4-hgal__arrow:hover { background: var(--t4-red); color: #fff; border-color: var(--t4-red); }
body.t4-home .t4-hgal__arrow--prev { left: -6px; }
body.t4-home .t4-hgal__arrow--next { right: -6px; }
body.t4-home .t4-hgal__arrow.is-hidden { opacity: 0; pointer-events: none; }
@media (min-width: 769px) {
	body.t4-home .t4-hgal__arrow { display: flex; }
	body.t4-home .t4-hgal__rail { cursor: grab; }
	body.t4-home .t4-hgal__rail.t4-dragging { cursor: grabbing; scroll-snap-type: none; user-select: none; }
}
body.t4-home .t4-hvid {
	flex: 0 0 auto;
	width: 280px;
	scroll-snap-align: start;
	text-decoration: none;
	color: var(--t4-ink);
	transition: transform 280ms var(--t4-ease);
}
body.t4-home .t4-hvid:hover { transform: translateY(-3px); }
body.t4-home .t4-hvid__thumb {
	position: relative;
	aspect-ratio: 16/10;
	background-size: cover;
	background-position: center;
	background-color: var(--t4-ink);
	border-radius: var(--t4-r-md);
	overflow: hidden;
	margin-bottom: 10px;
	transition: box-shadow 280ms var(--t4-ease);
}
body.t4-home .t4-hvid__thumb::after {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, transparent 50%, rgba(0,0,0,0.5) 100%);
}
body.t4-home .t4-hvid:hover .t4-hvid__thumb { box-shadow: var(--t4-sh-md); }
body.t4-home .t4-hvid__play {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 56px;
	height: 56px;
	border-radius: 50%;
	background: var(--t4-red);
	color: #fff;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	z-index: 2;
	box-shadow: 0 6px 20px rgba(255,40,0,0.4);
	transition: transform 280ms var(--t4-ease);
}
body.t4-home .t4-hvid:hover .t4-hvid__play { transform: translate(-50%, -50%) scale(1.08); }
body.t4-home .t4-hvid__play svg { width: 22px; height: 22px; margin-left: 2px; }
body.t4-home .t4-hvid__t {
	font-family: var(--t4-sans);
	font-size: var(--t4-fs-small);
	font-weight: 600;
	color: var(--t4-ink);
	padding-top: 4px;
}
@media (max-width: 768px) {
	body.t4-home .t4-hgal__head { flex-direction: column; align-items: flex-start; gap: 6px; }
	/* Kill the title's inherited 40px bottom margin — in column mode it opened a
	   hole between the title and the "See all" link */
	body.t4-home .t4-hgal__head .t4-block__title { margin-bottom: 6px; }
	/* Card ≈80% of the screen with a peek of the next one — big enough to read,
	   obviously a carousel */
	body.t4-home .t4-hvid { width: min(78vw, 340px); }
	body.t4-home .t4-hvid__t { font-size: 16px; line-height: 1.35; }
}

/* ====================== HCTA — closing dark scrim CTA ====================== */
body.t4-home .t4-hcta,
body.t4-catalog .t4-hcta {
	position: relative;
	min-height: 480px;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	color: #fff;
	background: var(--t4-ink);
}
body.t4-home .t4-hcta__bg,
body.t4-catalog .t4-hcta__bg {
	position: absolute;
	inset: 0;
	background-position: center;
	background-size: cover;
	opacity: 0.45;
	transform: scale(1.04);
}
body.t4-home .t4-hcta__scrim,
body.t4-catalog .t4-hcta__scrim {
	position: absolute;
	inset: 0;
	background:
		radial-gradient(ellipse at center, rgba(255,40,0,0.18) 0%, transparent 60%),
		linear-gradient(180deg, rgba(12,12,12,0.6) 0%, rgba(12,12,12,0.92) 100%);
}
body.t4-home .t4-hcta__inner,
body.t4-catalog .t4-hcta__inner {
	position: relative;
	z-index: 2;
	max-width: var(--t4-content);
	margin: 0 auto;
	padding: 100px var(--t4-gutter);
	text-align: center;
}
body.t4-home .t4-hcta__pill,
body.t4-catalog .t4-hcta__pill {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	background: rgba(255,255,255,0.12);
	border: 1px solid rgba(255,255,255,0.2);
	padding: 6px 14px;
	border-radius: 100px;
	font-family: var(--t4-mono);
	font-size: var(--t4-fs-micro);
	letter-spacing: 0.1em;
	font-weight: 600;
	color: #fff;
	margin-bottom: 28px;
}
body.t4-home .t4-hcta__title,
body.t4-catalog .t4-hcta__title {
	font-family: var(--t4-sans);
	font-weight: 800; /* PJS: Bebas был одновесный */
	font-size: clamp(var(--t4-fs-h3), 2.8vw, var(--t4-fs-h2));
	line-height: 1.0;
	letter-spacing: 0.005em;
	margin: 0 0 20px;
	color: #fff;
}
body.t4-home .t4-hcta__sub,
body.t4-catalog .t4-hcta__sub {
	font-family: var(--t4-sans);
	font-size: var(--t4-fs-body);
	line-height: 1.65;
	color: rgba(255,255,255,0.85);
	margin: 0 auto 32px;
	max-width: var(--t4-measure);
}
body.t4-home .t4-hcta__ctas,
body.t4-catalog .t4-hcta__ctas {
	display: flex;
	gap: 12px;
	justify-content: center;
	flex-wrap: wrap;
}
@media (max-width: 600px) {
	body.t4-home .t4-hcta,
body.t4-catalog .t4-hcta { min-height: 380px; }
	body.t4-home .t4-hcta__inner,
body.t4-catalog .t4-hcta__inner { padding: 64px 16px; }
	body.t4-home .t4-hcta__ctas,
	body.t4-catalog .t4-hcta__ctas { flex-direction: column; align-items: stretch; }
	body.t4-home .t4-hcta__ctas .t4-btn,
	body.t4-catalog .t4-hcta__ctas .t4-btn { justify-content: center; }
}

/* XL button + ghost-on-dark variant for hcta */
body.t4-home .t4-btn--xl,
body.t4-catalog .t4-btn--xl { padding: 16px 28px; font-size: var(--t4-fs-body); }
body.t4-home .t4-btn--ghost-dark,
body.t4-catalog .t4-btn--ghost-dark {
	background: rgba(255,255,255,0.08);
	border: 1px solid rgba(255,255,255,0.3);
	color: #fff;
}
body.t4-home .t4-btn--ghost-dark:hover,
body.t4-catalog .t4-btn--ghost-dark:hover {
	background: rgba(255,255,255,0.16);
	border-color: rgba(255,255,255,0.5);
}

/* Promo banner styles moved to tour-v4.css so they apply on every V4 page,
   not just the homepage. */

/* ---- Category card links: photo overlay + title link + Read more (2026-07-06) ----
   Photo/title/Read-more -> category archive page (SEO internal links);
   the red Book now button keeps deep-linking to /book-now/ with the time preselected. */
body.t4-home .t4-cat__medialink {
	position: absolute;
	inset: 0;
	z-index: 1; /* above slides (z:auto), below dots + badge (z:2) */
}
body.t4-home .t4-cat__title a {
	color: inherit;
	text-decoration: none;
	transition: color .18s var(--t4-ease);
}
body.t4-home .t4-cat__title a:hover { color: var(--t4-red); }
body.t4-home .t4-cat__ctas {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 12px;
}
body.t4-home .t4-cat__readmore {
	font-family: var(--t4-sans);
	font-size: var(--t4-fs-small);
	font-weight: 600;
	color: var(--t4-body);
	text-decoration: underline;
	text-underline-offset: 3px;
	text-decoration-color: rgba(115,115,115,0.5);
	padding: 2px 6px; /* generous tap target without visual weight */
	transition: color .18s var(--t4-ease);
}
body.t4-home .t4-cat__readmore:hover { color: var(--t4-red); text-decoration-color: currentColor; }

/* ====================== FINAL UX PASS (2026-07-07) — home-scoped only ======================
   Catalog/booknow keep the shared component defaults; overrides below apply to the
   homepage. Extend selectors with body.t4-catalog later if the user wants parity. */

/* --- Partners: slightly more present (still quiet), bigger on phones --- */
body.t4-home .t4-hpartners__row img {
	opacity: 0.78;
	filter: grayscale(45%);
}
@media (max-width: 768px) {
	body.t4-home .t4-hpartners__row { gap: 22px 28px; }
	body.t4-home .t4-hpartners__row img {
		height: 34px;
		max-width: 132px;
		opacity: 0.85;
	}
}

/* --- Contact cards: compact horizontal layout on phones (icon left, copy right) --- */
@media (max-width: 768px) {
	body.t4-home .t4-hcontact__cards { gap: 10px; }
	body.t4-home .t4-ccard {
		display: grid;
		grid-template-columns: 44px minmax(0, 1fr);
		grid-template-rows: auto auto auto;
		column-gap: 14px;
		align-items: center;
		padding: 16px 18px;
	}
	body.t4-home .t4-ccard__icon {
		grid-row: 1 / 4;
		width: 44px;
		height: 44px;
		margin-bottom: 0;
	}
	body.t4-home .t4-ccard__icon svg { width: 20px; height: 20px; }
	body.t4-home .t4-ccard__name { font-size: 22px; margin-bottom: 1px; }
	body.t4-home .t4-ccard__action { font-size: 16px; margin-bottom: 1px; }
	body.t4-home .t4-ccard__hint { font-size: 12px; }
	body.t4-home .t4-hcontact__foot { margin-top: 28px; }
}

/* --- Vertical rhythm: one 64px section padding below 768 (breakpoints were a mix
       of 600/800/900, leaving 100px sections on 601–768px screens) --- */
@media (max-width: 768px) {
	body.t4-home .t4-cats,
	body.t4-home .t4-hwhy,
	body.t4-home .t4-hfleet,
	body.t4-home .t4-howw,
	body.t4-home .t4-hgal,
	body.t4-home .t4-hsafety { padding: var(--t4-sec) 0; }
	body.t4-home .t4-cats__head { margin-bottom: 36px; }
}

/* --- Tour cards on phones: chips a touch larger, Read more clearly separated --- */
@media (max-width: 600px) {
	body.t4-home .t4-cat__incl { font-size: 12px; }
	body.t4-home .t4-cat__ctas { gap: 10px; }
}

/* ====================== POINT FIXES (2026-07-07, round 2) ====================== */

/* Kickers: the shared .t4-kicker is an inline <span>, so its 16px margin-bottom
   never applied — section labels (05 — REVIEWS etc.) sat cramped against titles. */
body.t4-home .t4-kicker { display: inline-block; }

/* Desktop tour cards: more commercial weight after the big hero — taller photo,
   larger title/price, Book now reads as the card's main action. Grid stays 2×2. */
@media (min-width: 901px) {
	body.t4-home .t4-cat__media { height: 340px; }
	body.t4-home .t4-cat__title { font-size: var(--t4-fs-h1); }
	body.t4-home .t4-cat__now { font-size: var(--t4-fs-h2); }
	body.t4-home .t4-cat__body { padding: 26px 30px 28px; }
	body.t4-home .t4-cat__ctas .t4-btn { padding: 14px 28px; font-size: var(--t4-fs-body); font-weight: 600; }
}

/* Final CTA on phones: more air above the display title, slightly looser leading
   so Bebas caps don't kiss the section edge */
@media (max-width: 600px) {
	body.t4-home .t4-hcta__inner { padding: 84px 16px 64px; }
	body.t4-home .t4-hcta__title { line-height: 1.06; }
}

/* tour-v4.css reserves 70px under ≤1024 for the fixed .t4-mobar (tour pages only) —
   the homepage has no mobar, so that reserve rendered as a white strip below the
   footer. Double class beats body.t4-page regardless of file order. */
@media (max-width: 1024px) {
	body.t4-page.t4-home { padding-bottom: 0; }
}

/* ============ HERO BACKGROUND VIDEO (2026-07-08) ============
   Sits between the photo bg (LCP/poster/fallback) and the scrim.
   Hidden until actually playing — photo shows through meanwhile. */
body.t4-home .t4-hhero__video {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	opacity: 0;
	transition: opacity .8s ease;
	pointer-events: none;
}
body.t4-home .t4-hhero__video.is-playing { opacity: 1; }
@media (prefers-reduced-motion: reduce) {
	body.t4-home .t4-hhero__video { display: none; }
}

/* ============ BUGGY-FIRST CARDS (t4-bugs) — sample v1, 2026-07-13 ============
   Карточки багги-категорий на главной (по скрину юзера): одно фото без карусели,
   бейдж, сисер-подпись, спеки, чипы, «N experiences», from-цена + одна CTA. */
body.t4-home .t4-bugs {
	padding: var(--t4-sec) 0;
	background: var(--t4-bg-1);
}
body.t4-home .t4-bugs__inner {
	max-width: var(--t4-container);
	margin: 0 auto;
	padding: 0 var(--t4-gutter);
}
body.t4-home .t4-bugs__grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 24px;
	margin-top: 40px;
}
body.t4-home .t4-bug {
	position: relative;
	display: flex;
	flex-direction: column;
	background: #fff;
	border: 1px solid var(--t4-line);
	border-radius: var(--t4-r-lg);
	overflow: hidden;
	transition: transform .25s var(--t4-ease), box-shadow .25s var(--t4-ease), border-color .25s var(--t4-ease);
}
body.t4-home .t4-bug:hover {
	transform: translateY(-4px);
	box-shadow: var(--t4-sh-md);
}
body.t4-home .t4-bug__media {
	position: relative;
	height: 220px;
	background: var(--t4-bg-1);
	overflow: hidden;
}
body.t4-home .t4-bug__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform .4s var(--t4-ease);
}
body.t4-home .t4-bug:hover .t4-bug__media img { transform: scale(1.04); }
body.t4-home .t4-bug__medialink { position: absolute; inset: 0; }
body.t4-home .t4-bug__badge {
	position: absolute;
	top: 12px;
	left: 12px;
	background: var(--t4-red);
	color: #fff;
	font-family: var(--t4-mono);
	font-size: var(--t4-fs-micro); /* компактнее — не съедать фото (юзер 2026-07-13, ужато 07-14) */
	letter-spacing: 0.06em;
	padding: 3px 8px;
	border-radius: 999px;
	pointer-events: none;
}
body.t4-home .t4-bug__body {
	display: flex;
	flex-direction: column;
	flex: 1;
	gap: 10px;
	padding: 20px 22px 22px;
}
body.t4-home .t4-bug__title {
	font-family: var(--t4-sans);
	font-weight: 800; /* PJS: Bebas был одновесный */
	font-size: var(--t4-fs-lg); /* шкала агрегаторов 2026-07-14 (Viator карточки 16/500) */
	line-height: 1.05;
	color: var(--t4-ink);
	margin: 0;
}
body.t4-home .t4-bug__title a { color: inherit; text-decoration: none; transition: color .18s var(--t4-ease); }
body.t4-home .t4-bug__title a:hover { color: var(--t4-red); }
body.t4-home .t4-bug__sub {
	font-family: var(--t4-mono);
	font-size: var(--t4-fs-micro);
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: rgba(26,22,18,0.55);
	margin-top: -4px;
}
body.t4-home .t4-bug__specs {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 8px;
	font-size: var(--t4-fs-body);
	color: rgba(26,22,18,0.8);
}
body.t4-home .t4-bug__dot { color: rgba(26,22,18,0.35); }

/* Спек-ряд с иконками (мокап 2026-07-14): 3 колонки clock/users/gear с вертикальными
   разделителями, значение жирным, микро-подпись капсом в моно-стиле V4-лейблов */
/* 27.07: спеков стало два (коробка убрана). Колонки больше не растягиваем на всю
   ширину карточки — иначе пара «висит» по краям; ставим их по центру ряда. */
body.t4-home .t4-bug__specs--icons {
	display: flex;
	justify-content: center;
	gap: 0;
	align-items: start;
}
body.t4-home .t4-bug__specs--icons .t4-bug__spec { flex: 0 1 50%; max-width: 50%; }
body.t4-home .t4-bug__spec {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 3px;
	padding: 2px 2px; /* боковой padding отдан подписи: «Transmission» иначе не помещается */
	min-width: 0;
	flex: 1 1 0;
}
body.t4-home .t4-bug__spec + .t4-bug__spec { border-left: 1px solid rgba(26,22,18,0.1); }
body.t4-home .t4-bug__spec svg {
	width: 15px;
	height: 15px;
	color: rgba(26,22,18,0.32); /* легче: иконки не должны спорить с названием и ценой */
	margin-bottom: 1px;
}
body.t4-home .t4-bug__spec-v {
	font-weight: 600;
	font-size: var(--t4-fs-small);
	color: rgba(26,22,18,0.85);
	white-space: nowrap;
}
body.t4-home .t4-bug__spec-l {
	/* Не моно: подпись выросла с 9.5px до 12px по шкале, а моноширинный на ~15% шире
	   пропорционального — «TRANSMISSION» перестал помещаться в колонку карточки.
	   Моно оставлен на коротких метках (badge, per, was), где ширина не критична. */
	font-family: var(--t4-sans);
	font-size: var(--t4-fs-micro);
	letter-spacing: 0;
	/* Без капса: «TRANSMISSION» капсом занимает 92px при 68 доступных и ломается на две
	   строки. Строчными укладывается в одну. Капс остался на коротких метках карточки. */
	text-transform: none;
	white-space: nowrap;
	color: rgba(26,22,18,0.38);
}
body.t4-home .t4-bug__chips {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}
body.t4-home .t4-bug__chip {
	background: var(--t4-bg-1);
	border-radius: 999px;
	padding: 6px 13px;
	font-size: var(--t4-fs-small);
	color: rgba(26,22,18,0.85);
}
body.t4-home .t4-bug__avail {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	font-size: var(--t4-fs-small);
	font-weight: 600;
	color: #1a7f37;
	text-decoration: none;
}
body.t4-home .t4-bug__avail-main { display: flex; align-items: center; gap: 8px; }
body.t4-home .t4-bug__avail svg { width: 17px; height: 17px; flex: 0 0 auto; }
body.t4-home .t4-bug__avail-chev { color: rgba(26,22,18,0.35); transition: transform 180ms var(--t4-ease), color 180ms var(--t4-ease); }
body.t4-home .t4-bug__avail:hover .t4-bug__avail-chev { transform: translateX(3px); color: #1a7f37; }
body.t4-home .t4-bug__foot {
	display: flex;
	align-items: center; /* кнопка по центру напротив цены (юзер 2026-07-13) */
	justify-content: space-between;
	gap: 14px;
	margin-top: auto;
	padding-top: 14px;
	border-top: 1px solid var(--t4-line);
}
body.t4-home .t4-bug__price { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
/* CTA всегда в одну строку с ценой (просьба юзера) — компактнее и без переносов */
body.t4-home .t4-bug__foot .t4-btn { padding: 12px 16px; font-size: var(--t4-fs-small); white-space: nowrap; flex: 0 0 auto; }
body.t4-home .t4-bug__from {
	font-size: var(--t4-fs-small);
	color: rgba(26,22,18,0.55);
}
body.t4-home .t4-bug__aed {
	font-family: var(--t4-sans);
	font-weight: 800; /* PJS: Bebas был одновесный */
	font-size: var(--t4-fs-body); /* 26px → 20px (PJS шире), 20px → 15px: контейнер секции сведён к 1280,
	                    карточка стала уже на ~20px и цена снова наезжала на кнопку (юзер 26.07) */
	color: var(--t4-ink);
	letter-spacing: 0.005em;
	white-space: nowrap;
}
body.t4-home .t4-bug__per {
	/* обычный текст, не моно-капс — «выглядит дороже» (юзер 2026-07-13) */
	font-size: var(--t4-fs-small);
	color: rgba(26,22,18,0.55);
}
/* Мостик на конфигуратор под сеткой */
body.t4-home .t4-bugs__conf {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	margin-top: 28px;
	padding: 22px 26px;
	background: #fff;
	border: 1px solid var(--t4-line);
	border-radius: var(--t4-r-lg);
}
body.t4-home .t4-bugs__conftext {
	display: flex;
	flex-direction: column;
	gap: 3px;
	min-width: 0;
}
body.t4-home .t4-bugs__conftext strong {
	/* var(--t4-sans) (Bebas-капс) плохо читался — юзер 2026-07-14: обычный UI-шрифт, пожирнее */
	font-family: var(--t4-sans);
	font-weight: 800;
	font-size: var(--t4-fs-h4);
	letter-spacing: -0.01em;
	color: var(--t4-ink);
}
body.t4-home .t4-bugs__conftext span {
	font-size: var(--t4-fs-small);
	color: rgba(26,22,18,0.65);
}
@media (max-width: 1100px) {
	body.t4-home .t4-bugs__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 767px) {
	body.t4-home .t4-bugs { padding: var(--t4-sec) 0; }
	body.t4-home .t4-bugs__inner { padding: 0 20px; }
	body.t4-home .t4-bugs__grid { grid-template-columns: 1fr; gap: 16px; }
	body.t4-home .t4-bug__media { height: 200px; }
	body.t4-home .t4-bugs__conf { flex-direction: column; align-items: stretch; text-align: center; }
	body.t4-home .t4-bugs__conf .t4-btn { justify-content: center; }

	/* ---- Карточка багги на мобиле по РЕФЕРЕНСУ владельца (Downloads/tour-card.html, 28.07) ----
	   Взята геометрия референса, но нашими токенами: шрифт PJS, красный #FF2800, наши размеры.
	   Отличия от прежнего мобильного вида: цена красная и без «From», спеки без вертикального
	   разделителя с иконкой В СТРОКУ слева от значения и подписью под ним, чипсы с иконками,
	   кнопка 52px с радиусом 10px. Десктоп не затронут — весь блок внутри max-width:767px. */
	body.t4-home .t4-bug__from { display: none; }              /* референс: без «From» */
	body.t4-home .t4-bug__aed {
		color: var(--t4-red);
		font-weight: 800;
		font-size: 22px;
		line-height: 1.1;
		letter-spacing: -0.02em;
	}
	body.t4-home .t4-bug__per { font-size: 12px; color: rgba(26,22,18,0.55); margin-top: 3px; }

	/* Спек: иконка в строку со значением, подпись под ними; разделителя нет */
	body.t4-home .t4-bug__specs--icons .t4-bug__spec {
		display: grid;
		grid-template-columns: auto auto;
		grid-template-areas: "icon value" "label label";
		align-items: center;
		justify-content: start;
		text-align: left;
		gap: 2px 6px;
		padding: 0;
		border-left: 0; /* убираем вертикальную черту между спеками */
	}
	body.t4-home .t4-bug__spec svg { grid-area: icon; width: 15px; height: 15px; margin: 0; }
	body.t4-home .t4-bug__spec-v { grid-area: value; font-size: 13px; }
	body.t4-home .t4-bug__spec-l { grid-area: label; font-size: 12px; }

	/* Чипсы: прямоугольные, с иконкой (иконки в разметке есть всегда, но видны только тут) */
	body.t4-home .t4-bug__chip {
		display: inline-flex;
		align-items: center;
		gap: 6px;
		border-radius: 8px;
		padding: 7px 12px;
		font-size: 13px;
	}
	body.t4-home .t4-bug__chip-i { display: inline-flex; flex: none; color: rgba(26,22,18,0.45); }
	body.t4-home .t4-bug__chip-i svg { width: 15px; height: 15px; }

	/* ---- Мобильная раскладка карточки багги по макету владельца (28.07.2026) ----
	   Было: спеки отдельной центрированной строкой, внизу ряд «цена + узкая кнопка».
	   Стало: цена поднята НАВЕРХ и стоит в одном ряду со спеками (цена слева, спеки справа),
	   кнопка — во всю ширину карточки. Порядок: заголовок → модель → [цена | спеки] →
	   чипсы → доступность → кнопка.
	   Приём: тело карточки — грид с именованными областями, а `.t4-bug__foot` получает
	   `display: contents`, поэтому его дети (цена и кнопка) становятся прямыми элементами
	   грида и раскладываются по своим областям. Десктоп не затронут — правило только здесь. */
	body.t4-home .t4-bug__body {
		display: grid;
		grid-template-columns: auto 1fr;
		grid-template-areas:
			"title title"
			"sub   sub"
			"price specs"
			"chips chips"
			"avail avail"
			"cta   cta";
		align-items: start;
		column-gap: 12px;
		row-gap: 14px;
		padding: 18px;
	}
	/* Референс: название 21px/700, модель под ним через 5px — вариант «модель справа»
	   отклонён, он ломал заголовок на две строки. */
	body.t4-home .t4-bug__title { grid-area: title; font-size: 21px; line-height: 1.2; letter-spacing: -0.015em; }
	body.t4-home .t4-bug__sub {
		grid-area: sub;
		margin-top: -9px; /* итоговый отступ от названия = 5px, как в референсе */
		font-size: 12px;
		letter-spacing: 0.08em;
	}
	body.t4-home .t4-bug__price { grid-area: price; align-self: center; }
	body.t4-home .t4-bug__specs--icons {
		grid-area: specs;
		justify-content: flex-end; /* спеки прижаты к правому краю, как на макете */
		align-self: center;
	}
	/* Спеки разведены: на мобиле «1–2 hrs» и «2 persons» стояли впритык друг к другу
	   (замечание владельца 28.07). Разделитель оставлен, но воздуха вокруг него больше. */
	body.t4-home .t4-bug__specs--icons .t4-bug__spec { flex: 0 0 auto; max-width: none; padding: 2px 14px; }
	body.t4-home .t4-bug__specs--icons .t4-bug__spec:last-child { padding-right: 0; }
	body.t4-home .t4-bug__chips { grid-area: chips; }
	body.t4-home .t4-bug__avail { grid-area: avail; }
	/* foot «растворяется»: его дети уезжают в свои области грида */
	body.t4-home .t4-bug__foot {
		display: contents;
		border-top: 0;
		padding-top: 0;
		margin-top: 0;
	}
	body.t4-home .t4-bug__foot .t4-btn {
		grid-area: cta;
		width: 100%;
		height: 52px;          /* референс */
		padding: 0 16px;
		border-radius: 10px;
		justify-content: center;
		font-size: 15.5px;
	}
	/* Строка «N tour options available» — по референсу: тонкая линия сверху, отступ 13px */
	body.t4-home .t4-bug__avail { padding-top: 13px; border-top: 1px solid var(--t4-line); }
}

/* Иконки чипсов есть в разметке всегда, но нужны только в мобильной карточке по референсу —
   на десктопе прежний вид чипсов сохраняем без изменений. */
@media (min-width: 768px) {
	body.t4-home .t4-bug__chip-i { display: none; }
}

/* ============ WHY US — редизайн 2026-07-13 (по мокапу юзера) ============ */
/* Строка соц-пруфа под лидом: звёзды + 5.0 + счётчик отзывов */
body.t4-home .t4-hwhy__proof {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 26px;
	font-size: var(--t4-fs-body);
	color: var(--t4-body);
}
body.t4-home .t4-hwhy__stars {
	color: #f0a437;
	font-size: var(--t4-fs-body);
	letter-spacing: 2px;
}
body.t4-home .t4-hwhy__proof strong { color: var(--t4-ink); font-weight: 600; }
body.t4-home .t4-hwhy__revs { color: var(--t4-muted); }
/* Фич-тайтлы карточек — чёрным (красные только цифры-статы) */
body.t4-home .t4-kpi__num--text { color: var(--t4-ink); }
/* Нижняя моно-лента фактов */
body.t4-home .t4-hwhy__strip {
	max-width: var(--t4-container);
	margin: 72px auto 0;
	padding: 28px var(--t4-gutter) 0;
	border-top: 1px solid var(--t4-line);
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	gap: 12px 18px;
	font-family: var(--t4-mono);
	font-size: var(--t4-fs-micro);
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: #5e5e5e; /* muted #737373, ~15% темнее (юзер 2026-07-13) */
	text-align: center;
}
body.t4-home .t4-hwhy__stripdot { color: var(--t4-red); font-size: var(--t4-fs-micro); }
@media (max-width: 600px) {
	body.t4-home .t4-hwhy__strip { margin-top: 48px; gap: 8px 12px; font-size: 12px; }
}

/* ============ 08 — ABOUT (SEO-текст, рерайт лайв-блока; 2026-07-14) ============ */
body.t4-home .t4-habout {
	background: var(--t4-bg-1);
	padding: var(--t4-sec) 0;
	border-top: 1px solid var(--t4-line);
}
body.t4-home .t4-habout__inner {
	max-width: var(--t4-container); /* контейнер как у остальных секций — иначе кикер/текст не в линию */
	margin: 0 auto;
	padding: 0 var(--t4-gutter);
}
body.t4-home .t4-habout__inner { text-align: center; } /* соседние секции 07/09 центрированы */
body.t4-home .t4-habout__h { margin: 14px 0 18px; }
body.t4-home .t4-habout__h span { color: var(--t4-red); }
body.t4-home .t4-habout__text {
	max-width: var(--t4-measure);
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	gap: 14px;
}
body.t4-home .t4-habout__text p {
	margin: 0;
	font-size: var(--t4-fs-body);
	line-height: 1.65;
	color: rgba(26,22,18,0.75);
}
body.t4-home .t4-habout__text a {
	color: var(--t4-red);
	font-weight: 600;
	text-decoration: none;
	border-bottom: 1px solid rgba(255,40,0,0.3);
}
body.t4-home .t4-habout__text a:hover { border-bottom-color: var(--t4-red); }
@media (max-width: 640px) {
	body.t4-home .t4-habout { padding: var(--t4-sec-sm) 0; }
}

/* ====================== HERO: composition VERTICALLY centered on desktop
   (user 2026-07-15 — left alignment stays; title a notch larger).
   Inner is the flex:1 item between the fixed header and the bottom trust strip —
   centering its own column puts the stack in the middle of that free space. */
@media (min-width: 769px) {
	body.t4-home .t4-hhero__inner {
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		justify-content: center;
	}
	body.t4-home .t4-hhero__title { font-size: clamp(var(--t4-fs-h1), 4.2vw, var(--t4-fs-h1)); }
}

/* TC pill per user example (2026-07-15): full TA badge + two lines —
   "Travelers' Choice" over "2026", sentence case (no mono caps).
   Applies to BOTH desktop and mobile on the home hero (user 2026-07-15);
   other pages keep the old single-line pill until sign-off. */
body.t4-home .t4-hhero__top .t4-pill {
	padding: 8px 18px 8px 10px;
	gap: 10px;
	text-transform: none;
	letter-spacing: 0;
}
body.t4-home .t4-hhero__top .t4-pill .t4-pill__tc {
	width: 39px;
	height: 39px;
	flex-shrink: 0;
}
body.t4-home .t4-hhero__top .t4-pill__tctext {
	display: flex;
	flex-direction: column;
	gap: 1px;
	line-height: 1.15;
	text-align: left;
}
body.t4-home .t4-hhero__top .t4-pill__tcname {
	font-size: var(--t4-fs-body);
	font-weight: 600;
}
body.t4-home .t4-hhero__top .t4-pill__tcyear {
	font-size: var(--t4-fs-small);
	font-weight: 600;
	color: rgba(255,255,255,0.85);
}
@media (max-width: 768px) {
	body.t4-home .t4-hhero__top .t4-pill .t4-pill__tc {
		width: 34px;
		height: 34px;
	}
	body.t4-home .t4-hhero__top .t4-pill__tcname { font-size: 14px; }
	body.t4-home .t4-hhero__top .t4-pill__tcyear { font-size: 12px; }
}

/* ====================== СТЫКИ СЕКЦИЙ С ОДИНАКОВЫМ ФОНОМ (2026-07-27) ======================
   Замер главной и хаба: подряд идущие секции с одним и тем же фоном давали 144px пустоты
   (72 снизу + 72 сверху). Где фон меняется (кремовый -> белый -> тёмный) сумма оправдана:
   граница цвета проходит по её середине, и это не воспринимается как дыра. Где фон один —
   вторая секция берёт половинный верхний паддинг (--t4-sec-join).
   Пары выписаны явно: порядок секций закреплён шаблонами, а сравнить фон в CSS нельзя. */
body.t4-home .t4-bugs + .t4-hwhy,
body.t4-home .t4-howw + .t4-hreviews,
body.t4-home .t4-hreviews + .t4-hgal,
body.t4-home .t4-habout + .t4-hcontact,
body.t4-home .t4-hpartners + .t4-hsafety,
body.t4-catalog .t4-hcontact + .t4-cgrid,
body.t4-catalog .t4-cgrid + .t4-qa,
body.t4-catalog .t4-hpartners + .t4-hcontact {
	padding-top: var(--t4-sec-join);
}