/*
 * Sezioni aggiunte alla home dopo il mockup (pattern home-evidence,
 * home-onboarding, home-agencies): solo le classi nuove, sui componenti del
 * mockup. Caricato solo dove queste sezioni sono presenti (inc/assets.php).
 */

/*
 * "Cosa comprende il lavoro" (.deliverables): sfondo a piena larghezza del
 * viewport pur restando .container, come .business. L'inset verticale di 1px
 * rifila l'antialiasing del clip-path ai bordi. Deviazione voluta dal mockup
 * (dettagli in README, sezione 6; la stessa regola è applicata anche al
 * mockup in tests/e2e/visual.spec.ts prima delle baseline).
 */
.deliverables {
	background: var(--soft);
	box-shadow: 0 0 0 100vmax var(--soft);
	clip-path: inset(1px -100vmax);
}

.onboarding h2 > span,
.evidence h2 > span {
	color: var(--blue);
}

/*
 * .deliverables h2 e .reading-heading h2 allineati allo stesso stile di
 * .plugin-limits-heading h2 (la regola di base del mockup per h2, senza
 * override proprio). Deviazione voluta dal mockup (dettagli in README,
 * sezione 6; headingParityRules() in tests/e2e/normalize.ts legge questi
 * marcatori HEADING-PARITY e li applica anche al mockup prima delle
 * baseline).
 */

/* HEADING-PARITY:START */
.deliverables h2,
.reading-heading h2 {
	font-size: clamp(2.2rem, 3.2vw, 3.25rem);
	line-height: 1.16;
	letter-spacing: -1.6px;
	font-weight: 500;
	color: var(--ink);
}

@media (max-width: 720px) {

	.deliverables h2,
	.reading-heading h2 {
		font-size: 2.125rem;
		line-height: 1.17;
		letter-spacing: -1px;
	}
}

/* HEADING-PARITY:END */

/* Prima di iniziare: .steps del metodo, su due colonne. */
.onboarding {
	border-top: 1px solid #e9edf2;
}

.onboarding .steps {
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 40px 32px;
}

/* Numeri più scuri di quelli del metodo (#8b94a2): contrasto AA su bianco. */
.onboarding .step-top {
	color: var(--muted);
}

/* Web agency: .expertise-card, tre su una riga. */
.agencies .expertise-grid {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.agencies .expertise-card p {
	margin-bottom: 0;
}

.agencies-cta {
	margin-top: 44px;
}

/* Dati pubblici: .benefits-grid su quattro colonne. */
.evidence .benefits-grid {
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 32px;
}

.evidence .benefits-grid article {
	display: flex;
	flex-direction: column;
}

.evidence .evidence-figure {
	margin: 18px 0 14px;
	font-size: 2.25rem;
	line-height: 1.15;
	letter-spacing: -1.2px;
	font-weight: 500;
	color: var(--blue);
	font-variant-numeric: tabular-nums;
}

.evidence .text-link {
	align-self: flex-start;
	margin-top: auto;
	padding-top: 18px;
	color: var(--blue);
}

@media (max-width: 1199px) {

	.evidence .benefits-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 40px 28px;
	}
}

@media (max-width: 950px) {

	.agencies .expertise-grid {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 720px) {

	.onboarding .steps,
	.evidence .benefits-grid {
		grid-template-columns: 1fr;
		gap: 31px;
	}

	.evidence .evidence-figure {
		font-size: 2rem;
	}

	.agencies-cta {
		margin-top: 32px;
	}
}

/* Illustrazioni in fondo ai titoli (tools/home-additions.json). */

/* HOME-ADDITIONS:START */
.symptoms-heading .symptoms-illustration,
.faq .faq-illustration {
	display: block;
	width: 100%;
	max-width: 520px;
	height: auto;
	margin-top: 40px;
}

@media (max-width: 720px) {

	.symptoms-heading .symptoms-illustration,
	.faq .faq-illustration {
		max-width: 360px;
		margin: 28px auto 0;
	}
}

/* HOME-ADDITIONS:END */