/* =============================================================
   ATTIVITÀ
   ============================================================= */

.intro-att__inner { display: grid; gap: clamp(2rem, 5vw, 4rem); }

@media (min-width: 960px) {
	.intro-att__inner { grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); align-items: start; }
}

.intro-att__claim {
	font-family: var(--font-display);
	font-size: clamp(1.5rem, 3vw, 2.25rem);
	font-weight: 500;
	line-height: 1.24;
	letter-spacing: -0.026em;
}

.intro-att__testo p + p { margin-top: var(--space-5); }

/* Ambiti: scheda tecnica per riga ------------------------------------- */

.ambito {
	display: grid;
	gap: clamp(1.25rem, 3vw, 2.5rem);
	padding-block: clamp(2.25rem, 5vw, 3.75rem);
	border-top: 1px solid var(--color-border);
	position: relative;
}
.ambito:last-of-type { border-bottom: 1px solid var(--color-border); }

@media (min-width: 900px) {
	.ambito { grid-template-columns: minmax(0, 0.42fr) minmax(0, 0.58fr); }
}

.ambito::after {
	content: '';
	position: absolute;
	left: 0; top: -1px;
	width: 0;
	height: 1px;
	background: var(--color-accent);
	transition: width var(--transition-slow);
}
.ambito:hover::after { width: 100%; }

.ambito__num {
	display: block;
	font-family: var(--font-mono);
	font-size: var(--text-xs);
	font-weight: 500;
	letter-spacing: 0.12em;
	color: var(--color-accent);
	margin-bottom: var(--space-3);
}

.ambito__titolo {
	font-size: clamp(1.5rem, 3vw, 2.125rem);
	letter-spacing: -0.028em;
	max-width: 16ch;
}

.ambito__testo { color: var(--color-text-muted); margin-bottom: var(--space-6); }

.ambito__lista { list-style: none; margin: 0; padding: 0; }

.ambito__lista li {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	gap: var(--space-3);
	padding-block: var(--space-3);
	border-top: 1px solid var(--color-border);
	font-size: var(--text-base);
	color: var(--color-text);
}
.ambito__lista li::before {
	content: '';
	width: 6px;
	height: 6px;
	margin-top: .62em;
	background: var(--color-accent);
	transform: rotate(45deg);
	flex: none;
}

/* Destinatari --------------------------------------------------------- */

.destinatari__grid { display: grid; gap: clamp(1.5rem, 3vw, 2rem); }

@media (min-width: 800px) {
	.destinatari__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

.destinatario {
	padding: clamp(1.5rem, 3vw, 2rem);
	border: 1px solid var(--color-ink-line);
	border-radius: var(--radius-md);
	background: rgba(255, 255, 255, .02);
	transition: border-color var(--transition-base), background-color var(--transition-base);
}
.destinatario:hover { border-color: rgba(255, 255, 255, .22); background: rgba(255, 255, 255, .045); }
.destinatario h3 { font-size: var(--text-lg); margin-bottom: var(--space-3); }
.destinatario p { color: var(--color-muted-on-dark); font-size: var(--text-base); }

/* Fasi dell'incarico -------------------------------------------------- */

.fasi {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 1px;
	background: var(--color-border);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-md);
	overflow: hidden;
}

@media (min-width: 1000px) {
	.fasi { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

.fase {
	background: var(--color-surface);
	padding: clamp(1.5rem, 3vw, 2rem);
	display: flex;
	flex-direction: column;
	gap: var(--space-3);
	transition: background-color var(--transition-base);
}
.fase:hover { background: var(--color-bg-alt); }

.fase__num {
	font-family: var(--font-mono);
	font-size: var(--text-xs);
	letter-spacing: 0.12em;
	color: var(--color-text-muted);
}
.fase__titolo { font-size: var(--text-lg); }
.fase__testo { font-size: var(--text-sm); color: var(--color-text-muted); }

.fase__esito {
	margin-top: auto;
	padding-top: var(--space-4);
	border-top: 1px solid var(--color-border);
	font-size: var(--text-sm);
	color: var(--color-text);
}
.fase__esito strong { font-weight: 600; }