/*
 * Design System - AELITA
 * components/home-services.css - front page advantages / services block.
 *
 * WP4 redesign: unified design-system section heading (title + red accent) and
 * six value tiles in a responsive grid with crisp inline-SVG icons (no PNG
 * sprite). Loaded on the front page only (see inc/enqueue.php).
 */

/* -------------------------------------------------------------------- */
/* Section                                                              */
/* -------------------------------------------------------------------- */
.a-home-services {
	padding-block: var(--home-section-space);
	background-color: var(--bg-muted);
}

.a-home-services .a-container {
	max-width: var(--container);
}

/* -------------------------------------------------------------------- */
/* Header (unified section heading)                                     */
/* -------------------------------------------------------------------- */
.a-home-services__header {
	display: flex;
	flex-direction: column;
	gap: var(--space-2);
	margin-bottom: var(--space-6);
}

/* Matches .a-home-models__title / .a-home-brands__title. */
.a-home-services__title {
	margin: 0;
	font-family: var(--font-display-strong);
	font-size: var(--fs-h2);
	font-weight: var(--fw-bold);
	line-height: var(--lh-heading);
	color: var(--text-primary);
	text-transform: uppercase;
}

.a-home-services__accent {
	display: block;
	width: var(--space-8); /* 64px */
	height: var(--space-1); /* 4px */
	background-color: var(--c-red-600);
}

/* -------------------------------------------------------------------- */
/* Grid                                                                 */
/* -------------------------------------------------------------------- */
.a-home-services__grid {
	display: grid;
	grid-template-columns: repeat(6, minmax(0, 1fr));
	gap: var(--space-6) var(--space-5);
	margin: 0;
	padding: 0;
	list-style: none;
}

@media (max-width: 992px) {
	.a-home-services__grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

@media (max-width: 600px) {
	.a-home-services__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

/* -------------------------------------------------------------------- */
/* Tile                                                                 */
/* -------------------------------------------------------------------- */
.a-home-services__item {
	display: flex;
}

.a-home-services__tile {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--space-4);
	width: 100%;
	padding: var(--space-3) var(--space-2);
	color: var(--text-primary);
	text-align: center;
	text-decoration: none;
	transition:
		color var(--dur-popover) var(--ease-out),
		transform var(--dur-press) var(--ease-out);
}

.a-home-services__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	width: calc(var(--space-8) + var(--space-2)); /* 72px */
	height: calc(var(--space-8) + var(--space-2));
	color: var(--c-red-600);
	transition:
		color var(--dur-popover) var(--ease-out),
		background-color var(--dur-popover) var(--ease-out);
}

.a-home-services__icon svg {
	display: block;
	width: calc(var(--space-6) + var(--space-1)); /* 36px */
	height: calc(var(--space-6) + var(--space-1));
	transition: transform var(--dur-popover) var(--ease-out);
}

.a-home-services__label {
	font-family: var(--font-body);
	font-size: var(--fs-small); /* 14px */
	font-weight: var(--fw-semibold);
	line-height: var(--lh-body);
	text-wrap: balance;
}

@media (hover: hover) and (pointer: fine) {
	.a-home-services__tile:hover {
		color: var(--link-hover);
		transform: translateY(-2px);
	}

	.a-home-services__tile:hover .a-home-services__icon {
		color: var(--link-hover);
	}

	.a-home-services__tile:hover .a-home-services__icon svg {
		transform: scale(1.12);
	}
}

.a-home-services__tile:active {
	transform: scale(0.98);
}

.a-home-services__tile:focus-visible {
	outline: 2px solid var(--focus-ring) !important;
	outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
	.a-home-services__tile {
		transition-duration: 0.01ms;
	}

	.a-home-services__tile:hover {
		transform: none;
	}

	.a-home-services__tile:active {
		transform: none;
	}

	.a-home-services__icon svg {
		transition-duration: 0.01ms;
	}

	.a-home-services__tile:hover .a-home-services__icon svg {
		transform: none;
	}
}

/* -------------------------------------------------------------------- */
/* Homepage SEO text block: unify its vertical padding with the rhythm. */
/* -------------------------------------------------------------------- */
body.home .maincontent-text {
	padding-block: var(--home-section-space);
}