body.momento-page--servizi .momento-page__main {
	padding:
		clamp(24px, 4vw, 40px)
		clamp(18px, 3.6vw, 40px)
		clamp(72px, 10vw, 120px);
}

.servizi-page {
	display: grid;
	gap: clamp(72px, 10vw, 128px);
}

.servizi-hero {
	display: grid;
	gap: clamp(36px, 6vw, 48px);
	align-items: start;
}

.servizi-hero__pitch {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: clamp(40px, 6vw, 64px);
	min-height: 0;
}

.servizi-hero__title {
	margin: 0;
	max-width: 11ch;
	font-size: clamp(36px, 8.6vw, 52px);
	line-height: 0.95;
	font-weight: 400;
	letter-spacing: -0.04em;
	text-transform: none;
}

.servizi-hero__title span {
	display: block;
}

.servizi-hero__mark {
	display: block;
	width: min(100%, clamp(200px, 52vw, 280px));
	color: var(--hero-fg);
}

.servizi-hero__mark svg,
.servizi-hero__mark .momento-inline-logo {
	display: block;
	width: 100%;
	height: auto;
}

.servizi-hero__cta {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: fit-content;
	min-width: clamp(220px, 54vw, 260px);
	padding: clamp(18px, 3.8vw, 22px) clamp(36px, 7vw, 52px) clamp(17px, 3.6vw, 21px);
	border: 1px solid var(--hero-fg);
	color: var(--hero-fg);
	text-decoration: none;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	font-size: clamp(16px, 3.6vw, 18px);
	line-height: 1;
	font-weight: 600;
	transition:
		background-color 0.24s ease,
		color 0.24s ease,
		transform 0.24s ease;
}

.servizi-hero__cta:hover,
.servizi-hero__cta:focus-visible,
.servizi-hero__cta:active,
.servizi-hero__cta:visited {
	color: var(--hero-bg);
	background: var(--hero-fg);
	text-decoration: none;
}

.servizi-hero__wallet {
	width: 100%;
	min-width: 0;
}

.about-services--stack {
	margin: 0;
	padding-left: 0;
	width: 100%;
}

.about-services--stack .about-services__list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.about-services--stack .about-services__item {
	position: relative;
	list-style: none;
}

.about-services--stack .about-services__item::marker {
	content: none;
}

/* Overlap minimo: lascia quasi tutto l'header della scheda sotto ben leggibile. */
.about-services--stack .about-services__item + .about-services__item {
	margin-top: clamp(-18px, -4vw, -12px);
}

.about-services--stack .about-services__item:nth-child(1) {
	z-index: 5;
}

.about-services--stack .about-services__item:nth-child(2) {
	z-index: 4;
}

.about-services--stack .about-services__item:nth-child(3) {
	z-index: 3;
}

.about-services--stack .about-services__item:nth-child(4) {
	z-index: 2;
}

.about-services--stack .about-services__item:nth-child(5) {
	z-index: 1;
}

.about-services--stack .about-services__card {
	position: relative;
	display: grid;
	grid-template-columns: minmax(0, 1.05fr) minmax(132px, 0.95fr);
	grid-template-areas:
		"title tagline"
		"rule rule"
		"body body";
	align-content: start;
	column-gap: clamp(16px, 3vw, 28px);
	row-gap: 0;
	min-height: clamp(108px, 24vw, 128px);
	padding:
		clamp(22px, 5vw, 30px)
		clamp(20px, 4.8vw, 28px)
		clamp(24px, 5.4vw, 30px);
	border-radius: clamp(24px, 5.6vw, 34px);
	box-shadow: 0 -18px 40px rgba(0, 0, 0, 0.08);
	overflow: hidden;
	transition:
		min-height 0.48s cubic-bezier(0.22, 1, 0.36, 1),
		box-shadow 0.32s ease;
}

.about-services--stack .about-services__item--tone-green .about-services__card {
	background: var(--about-bg);
	color: var(--about-fg);
}

.about-services--stack .about-services__item--tone-cream .about-services__card {
	background: var(--hero-fg);
	color: var(--hero-bg);
}

.about-services--stack .about-services__title {
	grid-area: title;
	position: static;
	margin: 0;
	padding-right: 0;
	font-size: clamp(20px, 5.2vw, 28px);
	line-height: 0.94;
	font-weight: 500;
	letter-spacing: -0.018em;
	text-transform: uppercase;
}

.about-services--stack .about-services__title-line {
	display: block;
}

.about-services--stack .about-services__tagline {
	grid-area: tagline;
	margin: 0;
	align-self: start;
	justify-self: stretch;
	max-width: none;
	font-size: clamp(10px, 2.3vw, 11px);
	line-height: 1.18;
	font-weight: 600;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	text-align: right;
}

.about-services--stack .about-services__rule {
	grid-area: rule;
	position: static;
	width: 100%;
	height: 0;
	margin: 0;
	opacity: 0;
	overflow: hidden;
	transition:
		opacity 0.28s ease,
		margin 0.28s ease,
		height 0.28s ease;
}

.about-services--stack .about-services__body {
	grid-area: body;
	position: static;
	width: auto;
	min-height: 0;
	max-height: 0;
	max-width: none;
	margin: 0;
	padding: 0;
	opacity: 0;
	overflow: hidden;
	transform: none;
	pointer-events: none;
	transition:
		max-height 0.48s cubic-bezier(0.22, 1, 0.36, 1),
		opacity 0.36s ease;
}

.about-services--stack .about-services__text {
	margin: 0;
	max-width: 62ch;
	font-size: clamp(15px, 3.6vw, 18px);
	line-height: 1.38;
	font-weight: 400;
	opacity: 0.86;
}

.about-services--stack .about-services__works {
	margin-top: clamp(18px, 4vw, 24px);
}

.about-services--stack .about-services__works-label {
	margin: 0 0 clamp(8px, 2vw, 12px);
	font-size: clamp(14px, 3.2vw, 16px);
	line-height: 1.2;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

.about-services--stack .about-services__works-list {
	margin: 0;
	max-width: 62ch;
	font-size: clamp(14px, 3.2vw, 16px);
	line-height: 1.42;
	font-weight: 500;
	opacity: 0.9;
}

.about-services--stack .about-services__item {
	cursor: default;
}

.about-services--stack.about-services--mobile .about-services__item {
	cursor: pointer;
	-webkit-tap-highlight-color: transparent;
}

.about-services--stack.about-services--mobile .about-services__item.is-open .about-services__card {
	min-height: clamp(360px, 78vw, 520px);
	box-shadow: 0 -18px 40px rgba(0, 0, 0, 0.14);
}

.about-services--stack.about-services--mobile .about-services__item.is-open .about-services__rule,
.about-services--stack.about-services--stack-desktop .about-services__item:hover .about-services__rule {
	height: 1px;
	margin: clamp(18px, 3.6vw, 24px) 0 clamp(16px, 3.2vw, 22px);
	opacity: 0.34;
}

.about-services--stack.about-services--mobile .about-services__item.is-open .about-services__body,
.about-services--stack.about-services--stack-desktop .about-services__item:hover .about-services__body {
	max-height: 1200px;
	opacity: 1;
	pointer-events: auto;
}

.about-services--stack.about-services--stack-desktop .about-services__item:hover .about-services__card {
	min-height: clamp(560px, 58vh, 760px);
	box-shadow: 0 -18px 40px rgba(0, 0, 0, 0.14);
}

.servizi-collaboration {
	display: grid;
	gap: clamp(28px, 6vw, 44px);
}

.servizi-collaboration__title {
	margin: 0;
	max-width: 16ch;
	font-size: clamp(34px, 8vw, 58px);
	line-height: 0.98;
	font-weight: 400;
	letter-spacing: -0.04em;
}

.servizi-collaboration__grid {
	display: grid;
	gap: clamp(18px, 4vw, 24px);
}

.servizi-collaboration__card {
	display: grid;
	gap: clamp(18px, 4vw, 24px);
	min-height: 100%;
	padding:
		clamp(24px, 5vw, 32px)
		clamp(20px, 4.5vw, 28px)
		clamp(22px, 4.8vw, 30px);
	background: var(--hero-fg);
	color: var(--hero-bg);
	border-radius: clamp(22px, 5vw, 32px);
}

.servizi-collaboration__card-title {
	margin: 0;
	font-size: clamp(22px, 5vw, 28px);
	line-height: 1;
	font-weight: 600;
	letter-spacing: 0.03em;
	text-transform: uppercase;
}

.servizi-collaboration__card-text {
	margin: 0;
	font-size: clamp(15px, 3.4vw, 17px);
	line-height: 1.42;
	opacity: 0.82;
}

.servizi-collaboration__card-cta {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: fit-content;
	margin-top: auto;
	padding: clamp(12px, 2.8vw, 14px) clamp(18px, 4vw, 22px);
	border: 1px solid #000000;
	border-radius: 0;
	background: transparent;
	color: #000000;
	text-decoration: none;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	font-size: clamp(13px, 3vw, 15px);
	line-height: 1;
	font-weight: 600;
	box-shadow: none;
	transition:
		background-color 0.24s ease,
		color 0.24s ease;
}

.servizi-collaboration__card-cta:hover,
.servizi-collaboration__card-cta:focus-visible,
.servizi-collaboration__card-cta:active,
.servizi-collaboration__card-cta:visited {
	border-color: #000000;
	color: #000000;
	background: transparent;
	text-decoration: none;
	box-shadow: none;
}

.servizi-collaboration__card-cta:hover,
.servizi-collaboration__card-cta:focus-visible {
	background: #000000;
	color: var(--hero-fg, #f0efd7);
}

@media (max-width: 1023px) {
	body.momento-page--servizi .momento-page__main {
		padding:
			clamp(20px, 5vw, 28px)
			0
			clamp(56px, 12vw, 88px);
	}

	.servizi-page {
		gap: clamp(56px, 12vw, 80px);
	}

	.servizi-hero {
		gap: clamp(28px, 7vw, 40px);
	}

	.servizi-hero__pitch {
		padding: 0 clamp(20px, 5.2vw, 28px);
		gap: 0;
	}

	.servizi-hero__title {
		max-width: 10ch;
		font-size: clamp(40px, 11vw, 56px);
		line-height: 0.98;
		letter-spacing: -0.035em;
		text-transform: none;
	}

	.servizi-hero__mark,
	.servizi-hero__cta {
		display: none;
	}

	.servizi-hero__wallet {
		width: 100%;
	}

	.about-services--stack .about-services__item + .about-services__item {
		margin-top: clamp(-8px, -2vw, -4px);
	}

	.about-services--stack .about-services__card {
		grid-template-columns: minmax(0, 0.95fr) minmax(150px, 1.15fr);
		column-gap: clamp(12px, 3vw, 18px);
		min-height: clamp(92px, 22vw, 112px);
		padding:
			clamp(18px, 4.6vw, 24px)
			clamp(18px, 4.8vw, 24px)
			clamp(20px, 5vw, 26px);
		border-radius: clamp(20px, 5vw, 28px);
		box-shadow: 0 -12px 28px rgba(0, 0, 0, 0.16);
	}

	.about-services--stack .about-services__title {
		font-size: clamp(16px, 4.4vw, 20px);
		line-height: 1;
		padding-right: 0;
	}

	.about-services--stack .about-services__tagline {
		max-width: none;
		width: 100%;
		padding-left: clamp(8px, 2vw, 14px);
		font-size: clamp(10px, 2.6vw, 12px);
		line-height: 1.2;
		text-align: right;
	}

	.about-services--stack.about-services--mobile .about-services__item.is-open .about-services__card {
		min-height: 0;
		padding-bottom: clamp(28px, 7vw, 36px);
	}

	.about-services--stack.about-services--mobile .about-services__item.is-open .about-services__body {
		max-height: 2000px;
	}

	.about-services--stack .about-services__text {
		font-size: clamp(14px, 3.8vw, 16px);
		line-height: 1.4;
		max-width: none;
	}

	.about-services--stack .about-services__works-list {
		font-size: clamp(13px, 3.5vw, 15px);
		max-width: none;
	}

	.servizi-collaboration {
		padding: 0 clamp(20px, 5.2vw, 28px);
		gap: clamp(24px, 6vw, 32px);
	}

	.servizi-collaboration__title {
		max-width: 12ch;
		font-size: clamp(32px, 8.5vw, 42px);
		line-height: 1.02;
		letter-spacing: -0.03em;
	}

	.servizi-collaboration__grid {
		grid-template-columns: 1fr;
		gap: clamp(16px, 4vw, 20px);
	}

	.servizi-collaboration__card {
		gap: clamp(16px, 4vw, 20px);
		padding:
			clamp(22px, 5.5vw, 28px)
			clamp(18px, 4.8vw, 24px)
			clamp(20px, 5vw, 26px);
		border-radius: clamp(20px, 5vw, 28px);
	}

	.servizi-collaboration__card-cta {
		background: transparent;
		border: 1px solid #000000;
		border-radius: 0;
		color: #000000;
		padding: clamp(12px, 3.2vw, 14px) clamp(18px, 4.5vw, 22px);
	}

	.servizi-collaboration__card-cta:hover,
	.servizi-collaboration__card-cta:focus-visible,
	.servizi-collaboration__card-cta:active,
	.servizi-collaboration__card-cta:visited {
		border-color: #000000;
		color: #000000;
		background: transparent;
	}

	.servizi-collaboration__card-cta:hover,
	.servizi-collaboration__card-cta:focus-visible {
		background: #000000;
		color: var(--hero-fg, #f0efd7);
	}
}

@media (min-width: 768px) and (max-width: 1023px) {
	.servizi-collaboration__grid {
		grid-template-columns: 1fr;
	}
}

@media (min-width: 1024px) {
	.servizi-hero {
		grid-template-columns: minmax(280px, 31%) minmax(0, 69%);
		gap: clamp(24px, 2.8vw, 40px);
		align-items: start;
	}

	.servizi-hero__pitch {
		position: sticky;
		top: clamp(24px, 4vw, 40px);
		align-self: start;
		width: 100%;
		max-width: clamp(280px, 28vw, 360px);
		gap: clamp(48px, 5.2vw, 72px);
	}

	.servizi-hero__title {
		max-width: 8.5ch;
		font-size: clamp(44px, 3.8vw, 58px);
		line-height: 0.94;
		text-transform: uppercase;
	}

	.servizi-hero__mark {
		display: block;
		width: min(100%, clamp(220px, 16vw, 300px));
	}

	.servizi-hero__cta {
		display: inline-flex;
		min-width: clamp(220px, 16vw, 280px);
	}

	.servizi-collaboration__grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.servizi-hero__wallet {
		min-height: 0;
	}

	.about-services--stack {
		display: block;
		width: 100%;
		margin-top: 0;
		margin-bottom: 0;
		padding-left: 0;
	}

	.about-services--stack .about-services__list {
		display: block;
		width: 100%;
		min-height: 0;
		padding-bottom: clamp(80px, 10vw, 120px);
	}

	/*
	 * Header chiuso ~130–150px.
	 * Overlap ~-16px → restano visibili ~115–135px di titolo/tagline sotto.
	 */
	.about-services--stack .about-services__item + .about-services__item {
		margin-top: clamp(-20px, -1.6vw, -14px);
	}

	.about-services--stack .about-services__card {
		position: relative;
		top: auto;
		right: auto;
		height: auto;
		width: 100%;
		grid-template-columns: minmax(340px, 1.45fr) minmax(200px, 0.7fr);
		column-gap: clamp(24px, 2.8vw, 40px);
		min-height: clamp(136px, 12.5vh, 160px);
		padding:
			clamp(30px, 2.8vw, 40px)
			clamp(32px, 3vw, 44px)
			clamp(32px, 3vw, 44px);
		border-radius: clamp(30px, 7.5vw, 54px);
	}

	.about-services--stack .about-services__item:hover .about-services__card {
		width: 100%;
	}

	.about-services--stack .about-services__title {
		position: static;
		top: auto;
		left: auto;
		right: auto;
		font-size: clamp(36px, 3.1vw, 56px);
		line-height: 0.92;
		min-width: 0;
	}

	.about-services--stack .about-services__title-line {
		display: block;
		white-space: nowrap;
	}

	.about-services--stack .about-services__body {
		position: static;
		top: auto;
		bottom: auto;
		left: auto;
		width: auto;
		min-height: 0;
		max-height: 0;
		opacity: 0;
		pointer-events: none;
	}

	.about-services--stack .about-services__tagline {
		justify-self: start;
		max-width: 26ch;
		width: auto;
		min-width: 0;
		padding-left: 0;
		font-size: clamp(12px, 0.9vw, 14px);
		line-height: 1.28;
		letter-spacing: 0.03em;
		text-align: left;
	}

	.about-services--stack .about-services__text,
	.about-services--stack .about-services__works-list {
		font-size: clamp(16px, 1.05vw, 19px);
		line-height: 1.4;
		max-width: 58ch;
	}

	.about-services--stack.about-services--stack-desktop .about-services__item:hover .about-services__card {
		min-height: clamp(620px, 62vh, 820px);
	}

	.about-services--stack.about-services--stack-desktop .about-services__item:hover .about-services__body {
		max-height: 1400px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.about-services--stack .about-services__card,
	.about-services--stack .about-services__body {
		transition: none;
	}
}