/*
 * Eurasian Transit 0.2.1 — supplied homepage media.
 *
 * Frontend selectors remain behind the static-front-page body marker from
 * 0.2.0. Editor selectors target only the exact homepage sections.
 */

/* Supplied hero fallback. The runtime replaces this variable with the native
 * Featured Image URL whenever the configured front page has one. */
body.et-brand-v2-home .et-home-hero,
body.et-brand-v2-home.home.et-visual-a .et-home-hero,
.editor-styles-wrapper .et-home-hero {
	background:
		linear-gradient(90deg, rgba(2, 27, 62, 0.96) 0%, rgba(2, 27, 62, 0.88) 43%, rgba(2, 27, 62, 0.46) 72%, rgba(2, 27, 62, 0.2) 100%),
		radial-gradient(circle at 78% 34%, rgba(40, 158, 157, 0.2), transparent 36rem),
		var(--et-v201-home-hero-image, url("../images/home-brand-v201/home-hero-stripes.webp")) center / cover no-repeat !important;
}

/* Six supplied transparent WebP icons replace only the decorative pixels of
 * the existing aria-hidden SVG nodes. The Gutenberg DOM stays unchanged. */
body.et-brand-v2-home .et-home-process-grid > .et-process-step,
body.et-brand-v2-home.home.et-visual-b .et-home-process-grid > .et-process-step,
.editor-styles-wrapper .et-home-process-section .et-home-process-grid > .et-process-step {
	grid-template-columns: 4rem minmax(0, 1fr);
}

body.et-brand-v2-home .et-home-process-icon,
body.et-brand-v2-home.home .et-home-process-grid .et-home-process-icon,
body.et-brand-v2-home.home.et-visual-b .et-home-process-grid .et-home-process-icon,
.editor-styles-wrapper .et-home-process-section .et-home-process-icon {
	background-color: transparent;
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
	color: transparent;
	display: block !important;
	height: 4rem !important;
	width: 4rem !important;
}

body.et-brand-v2-home .et-home-process-icon use,
.editor-styles-wrapper .et-home-process-section .et-home-process-icon use {
	opacity: 0;
}

body.et-brand-v2-home .et-home-process-grid .et-step-number,
.editor-styles-wrapper .et-home-process-section .et-home-process-grid .et-step-number {
	justify-self: center;
}

body.et-brand-v2-home .et-home-process-grid > .et-process-step:nth-child(1) .et-home-process-icon,
.editor-styles-wrapper .et-home-process-section .et-home-process-grid > .et-process-step:nth-child(1) .et-home-process-icon {
	background-image: url("../images/home-brand-v201/process-01-request.webp");
}

body.et-brand-v2-home .et-home-process-grid > .et-process-step:nth-child(2) .et-home-process-icon,
.editor-styles-wrapper .et-home-process-section .et-home-process-grid > .et-process-step:nth-child(2) .et-home-process-icon {
	background-image: url("../images/home-brand-v201/process-02-consultation.webp");
}

body.et-brand-v2-home .et-home-process-grid > .et-process-step:nth-child(3) .et-home-process-icon,
.editor-styles-wrapper .et-home-process-section .et-home-process-grid > .et-process-step:nth-child(3) .et-home-process-icon {
	background-image: url("../images/home-brand-v201/process-03-quote-contract.webp");
}

body.et-brand-v2-home .et-home-process-grid > .et-process-step:nth-child(4) .et-home-process-icon,
.editor-styles-wrapper .et-home-process-section .et-home-process-grid > .et-process-step:nth-child(4) .et-home-process-icon {
	background-image: url("../images/home-brand-v201/process-04-execution.webp");
}

body.et-brand-v2-home .et-home-process-grid > .et-process-step:nth-child(5) .et-home-process-icon,
.editor-styles-wrapper .et-home-process-section .et-home-process-grid > .et-process-step:nth-child(5) .et-home-process-icon {
	background-image: url("../images/home-brand-v201/process-05-delivery.webp");
}

body.et-brand-v2-home .et-home-process-grid > .et-process-step:nth-child(6) .et-home-process-icon,
.editor-styles-wrapper .et-home-process-section .et-home-process-grid > .et-process-step:nth-child(6) .et-home-process-icon {
	background-image: url("../images/home-brand-v201/process-06-reporting.webp");
}

/* Supplied CTA background: cover sizing is explicit and a navy overlay keeps
 * both copy and controls readable over its bright centre. */
body.et-brand-v2-home .et-request-panel,
.editor-styles-wrapper:has(.et-home-hero) .et-request-section .et-request-panel {
	background:
		linear-gradient(100deg, rgba(2, 27, 62, 0.98) 0%, rgba(2, 27, 62, 0.91) 58%, rgba(2, 27, 62, 0.68) 100%),
		url("../images/home-brand-v201/home-cta-network.webp") center / cover no-repeat !important;
}

/* The supplied ring is decorative and appears only in the homepage footer. */
body.et-brand-v2-home .et-site-footer {
	isolation: isolate;
	position: relative;
}

body.et-brand-v2-home .et-site-footer > * {
	position: relative;
	z-index: 1;
}

body.et-brand-v2-home .et-site-footer::after {
	z-index: 0;
}

body.et-brand-v2-home .et-site-footer::before {
	background: url("../images/home-brand-v201/home-footer-ring.webp") center / contain no-repeat;
	content: "";
	height: clamp(22rem, 38vw, 34rem);
	top: 50%;
	opacity: 0.18;
	pointer-events: none;
	position: absolute;
	right: clamp(-14rem, -9vw, -6rem);
	transform: translateY(-50%);
	width: clamp(22rem, 38vw, 34rem);
	z-index: 0;
}

@media (min-width: 80rem) {
	body.et-brand-v2-home .et-home-process-icon,
	body.et-brand-v2-home.home .et-home-process-grid .et-home-process-icon,
	body.et-brand-v2-home.home.et-visual-b .et-home-process-grid .et-home-process-icon,
	.editor-styles-wrapper .et-home-process-section .et-home-process-icon {
		height: 4.75rem !important;
		width: 4.75rem !important;
	}
}

@media (max-width: 47.99rem) {
	body.et-brand-v2-home .et-home-hero,
	body.et-brand-v2-home.home.et-visual-a .et-home-hero,
	.editor-styles-wrapper .et-home-hero {
		background:
			linear-gradient(180deg, rgba(2, 27, 62, 0.84) 0%, rgba(2, 27, 62, 0.93) 100%),
			var(--et-v201-home-hero-image, url("../images/home-brand-v201/home-hero-stripes.webp")) 62% center / cover no-repeat !important;
	}

	body.et-brand-v2-home .et-home-hero::before,
	.editor-styles-wrapper .et-home-hero::before {
		background: linear-gradient(180deg, rgba(2, 27, 62, 0.08), rgba(2, 27, 62, 0.28));
	}

	body.et-brand-v2-home .et-request-panel,
	.editor-styles-wrapper:has(.et-home-hero) .et-request-section .et-request-panel {
		background:
			linear-gradient(180deg, rgba(2, 27, 62, 0.92) 0%, rgba(2, 27, 62, 0.97) 100%),
			url("../images/home-brand-v201/home-cta-network.webp") center / cover no-repeat !important;
	}

	body.et-brand-v2-home .et-site-footer::before {
		height: 22rem;
		top: 7rem;
		opacity: 0.12;
		right: -12rem;
		transform: none;
		width: 22rem;
	}
}
