/* W3 home composition. This file loads after the existing home styles. */
.home-page .home-section {
	padding-block: var(--section-y-lg);
}

.home-page .home-shell {
	width: min(calc(100% - 2 * var(--page-padding-mobile)), var(--container));
}

.home-hero {
	min-block-size: 0;
	padding-block: var(--section-y-lg);
}

.home-hero__grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
}

.home-hero__content {
	max-inline-size: var(--container-copy);
}

.home-hero__brand {
	width: clamp(8rem, 17vw, 15rem);
	margin: 0;
	align-self: center;
	justify-self: end;
}

.home-hero__brand img {
	display: block;
	width: 100%;
	height: auto;
}

@media (max-width: 767px) {
	.home-hero__grid { grid-template-columns: minmax(0, 1fr); }
	.home-hero__brand { width: 4rem; justify-self: start; }
}

.home-hero h1 {
	max-inline-size: var(--measure-hero);
	margin-block-end: var(--space-6);
	line-height: var(--leading-display);
	letter-spacing: var(--tracking-display);
}

.home-hero__lede {
	max-inline-size: var(--measure-lead);
	margin-block-end: var(--space-6);
	font-size: var(--text-lead);
	line-height: var(--leading-lead);
}

.home-hero__lede strong {
	color: hsl(var(--foreground));
	font-weight: var(--font-weight-semibold);
}

.home-hero .home-inline-link {
	color: hsl(var(--accent-on-dark));
}

.home-hero__paths {
	opacity: 0.15;
}

.home-proof-section {
	background: hsl(var(--background));
}

.home-proof-section .home-heading {
	margin-block-end: var(--space-8);
}

.home-proof-section .home-proof {
	width: 100%;
	margin: 0;
	padding: 0;
	border: 0;
}

.home-proof-section .home-proof__clients.home-logo-wall {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--space-3);
	padding: 0;
}

.home-proof-section .home-logo-wall__item {
	inline-size: 100%;
	max-inline-size: 100%;
	min-inline-size: 0;
	min-block-size: var(--space-24);
	padding: var(--space-3);
	background: hsl(var(--card));
	border: 1px solid hsl(var(--border));
	border-radius: var(--radius-card);
}

.home-integrations .home-integrations__list {
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 10rem), 1fr));
}

.home-integrations__item,
.home-integrations__item a,
.home-integrations__copy {
	min-inline-size: 0;
	overflow-wrap: anywhere;
}

.home-proof-section .home-logo-wall__item--dark {
	background: hsl(var(--surface-deep));
	border-color: hsl(var(--surface-deep-border));
}

.home-proof-section .home-proof__client-link,
.home-proof-section .home-proof__client-static {
	display: grid;
	inline-size: 100%;
	min-block-size: var(--target-min);
	place-items: center;
}

.home-proof-section .home-proof__clients .home-proof__client-image {
	inline-size: auto;
	max-inline-size: 100%;
	max-block-size: var(--space-14);
	height: auto;
	filter: none;
	opacity: 1;
	transition: none;
}

.home-proof-section .home-proof__clients .home-proof__client-link:hover .home-proof__client-image,
.home-proof-section .home-proof__clients .home-proof__client-link:focus-visible .home-proof__client-image {
	filter: none;
	opacity: 1;
}

.home-proof-section .home-stat {
	border-color: hsl(var(--border));
}

.home-proof-section .home-stat__value {
	color: hsl(var(--accent-conversion));
}

.home-proof-section .home-stat__period,
.home-proof-section .home-stat__source {
	color: hsl(var(--muted-foreground));
}

.home-situations .home-situation-card {
	color: hsl(var(--foreground));
	border-color: hsl(var(--surface-deep-border));
}

.home-situations .home-situation-card p {
	color: hsl(var(--muted-warm));
}

.home-situations .home-chips > span {
	background: transparent;
	color: hsl(var(--muted-warm));
	border-color: hsl(var(--surface-deep-border));
}

.home-system__journey {
	display: grid;
	gap: var(--space-6);
	margin: 0 0 var(--space-12);
	padding: var(--space-6);
	background: hsl(var(--background));
	border: 1px solid hsl(var(--border));
	border-radius: var(--radius-panel);
}

.home-system__diagram {
	display: block;
	inline-size: 100%;
	block-size: auto;
	aspect-ratio: 4 / 1;
	object-fit: contain;
}

.home-system__journey figcaption {
	font-weight: var(--font-weight-semibold);
}

.home-system__steps {
	display: grid;
	gap: var(--space-4);
	margin: 0;
	padding: 0;
	list-style: none;
	counter-reset: system-step;
}

.home-system__steps li {
	display: grid;
	gap: var(--space-2);
	min-inline-size: 0;
	padding-block-start: var(--space-4);
	border-block-start: 1px solid hsl(var(--border));
	counter-increment: system-step;
}

.home-system__steps li::before {
	content: counter(system-step, decimal-leading-zero);
	color: hsl(var(--accent-conversion));
	font-weight: var(--font-weight-semibold);
}

.home-system__steps span {
	color: hsl(var(--muted-foreground));
}

.home-system .home-card-grid {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.home-system .home-spotlight-card {
	padding: var(--space-6);
	background: hsl(var(--background));
	border: 1px solid hsl(var(--border));
	border-radius: var(--radius-card);
}

.home-system .home-spotlight-card:last-child {
	grid-column: 1 / -1;
}

.home-system .home-spotlight-card::after {
	display: none;
}

.home-situation-card,
.home-spotlight-card,
.home-lever-card,
.home-case-card {
	transition: transform var(--dur-hover) var(--ease-out);
}

.home-results-carousel .home-case-card__image img {
	transition: opacity var(--dur-hover) var(--ease-out);
}

.home-results-carousel .case-coverflow.is-enhanced .case-coverflow__item {
	transition: transform var(--dur-hover) var(--ease-out);
}

.home-results-carousel .case-coverflow.is-enhanced .case-coverflow__item:not(.is-active) .home-case-card__image img {
	filter: none;
}

.home-cases .home-heading {
	margin-block-end: var(--space-4);
}

.home-cases__intro {
	max-inline-size: var(--measure-prose);
	margin-block-end: var(--space-8);
	color: hsl(var(--muted-foreground));
}

@media (hover: hover) and (pointer: fine) {
	.home-system .home-spotlight-card:hover {
		border-color: hsl(var(--accent-conversion));
		box-shadow: var(--shadow-card-hover);
	}
}

.home-testimonials__grid {
	columns: 1;
	column-gap: var(--space-4);
}

.home-testimonials__grid .home-quote {
	display: inline-flex;
	inline-size: 100%;
	margin-block-end: var(--space-4);
	break-inside: avoid;
}

@media (min-width: 768px) {
	.home-page .home-shell {
		width: min(calc(100% - 2 * var(--page-padding-tablet)), var(--container));
	}

	.home-proof-section .home-proof__clients.home-logo-wall {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.home-system__steps {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.home-testimonials__grid {
		columns: 2;
	}
}

@media (min-width: 1200px) {
	.home-page .home-shell {
		width: min(calc(100% - 2 * var(--page-padding-desktop)), var(--container));
	}

	.home-proof-section .home-proof__clients.home-logo-wall {
		grid-template-columns: repeat(6, minmax(0, 1fr));
	}

	.home-system__steps {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}

	.home-testimonials__grid {
		columns: 3;
	}
}

@media (max-width: 767px) {
	.home-page .home-section {
		padding-block: var(--section-y);
	}

	.home-hero h1 {
		font-size: var(--text-display);
	}

	.home-system .home-card-grid {
		grid-template-columns: minmax(0, 1fr);
	}
}

@media (prefers-reduced-motion: reduce) {
	.home-hero__paths {
		opacity: 0.15;
	}

	.home-situation-card,
	.home-spotlight-card,
	.home-lever-card,
	.home-case-card,
	.home-results-carousel .case-coverflow.is-enhanced .case-coverflow__item,
	.home-results-carousel .home-case-card__image img {
		transition: none;
	}
}
