/**
 * Cards / Steps vNext — scoped CSS.
 * OWNER: this file. All selectors under .ital-cards-steps
 */

.ital-cards-steps {
	--ital-cs-ink: var(--ital-color-ink, #252A2E);
	--ital-cs-muted: #5a6560;
	--ital-cs-gap: 1.25rem;
	--ital-cs-conn-size: 2.85rem;
	--ital-cs-conn-circle: #ffffff;
	--ital-cs-conn-arrow: #2a4a3a;
	--ital-cs-conn-border: rgba(28, 36, 32, 0.18);
	box-sizing: border-box;
	position: relative;
	isolation: isolate;
	padding-block: clamp(2.5rem, 5vw, 4rem);
	background-color: var(--ital-cs-bg, transparent);
	background-image: var(--ital-cs-bg-image, none);
	background-size: cover;
	background-position: center;
	color: var(--ital-cs-ink);
}

/* Steps ribbon: denser corridor so equal columns use the 1180 track. */
.ital-cards-steps--mode-steps {
	--ital-cs-gap: 0.875rem;
}

/* Circle sits on the junction — keep gap modest; disk overlaps cards. */
.ital-cards-steps--mode-steps.ital-cards-steps--connector {
	--ital-cs-gap: 0.75rem;
}

.ital-cards-steps--conn-size-s {
	--ital-cs-conn-size: 2.25rem;
}

.ital-cards-steps--conn-size-m {
	--ital-cs-conn-size: 2.85rem;
}

.ital-cards-steps--conn-size-l {
	--ital-cs-conn-size: 3.5rem;
}

/* Circle disk shared (desktop + mobile). Positioning is layout-specific. */
.ital-cards-steps--connector .ital-cards-steps__connector {
	pointer-events: none;
	z-index: 5;
}

.ital-cards-steps--connector .ital-cards-steps__connector-disk {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	border-radius: 50%;
	background-color: var(--ital-cs-conn-circle, #ffffff);
	color: var(--ital-cs-conn-arrow, #2a4a3a);
	border: 0 solid transparent;
	box-shadow: none;
	transition: transform 280ms cubic-bezier(0.33, 1, 0.68, 1), box-shadow 280ms cubic-bezier(0.33, 1, 0.68, 1);
}

.ital-cards-steps--conn-effect-shadow .ital-cards-steps__connector-disk {
	box-shadow: 0 4px 16px rgba(28, 36, 32, 0.16);
}

.ital-cards-steps--conn-effect-depth .ital-cards-steps__connector-disk {
	box-shadow:
		inset 0 1px 0 rgba(255, 255, 255, 0.9),
		0 2px 4px rgba(28, 36, 32, 0.1),
		0 10px 22px rgba(28, 36, 32, 0.18);
}

.ital-cards-steps--conn-border-thin .ital-cards-steps__connector-disk {
	border: 1.5px solid var(--ital-cs-conn-border, rgba(28, 36, 32, 0.18));
}

.ital-cards-steps--connector .ital-cards-steps__connector-arrow {
	display: block;
	width: 54%;
	height: 54%;
	flex: 0 0 auto;
}

.ital-cards-steps *,
.ital-cards-steps *::before,
.ital-cards-steps *::after {
	box-sizing: border-box;
}

.ital-cards-steps__inner {
	position: relative;
	z-index: 1;
	width: min(
		var(--ital-content-max, 1180px),
		calc(100% - 2 * var(--ital-content-gutter, clamp(1rem, 3vw, 2.5rem)))
	);
	max-width: none;
	margin-inline: auto;
	padding-inline: 0;
	box-sizing: border-box;
}

.ital-cards-steps--form-full .ital-cards-steps__inner {
	/* Legacy full-width value: keep content on the 1180 track. */
	width: min(
		var(--ital-content-max, 1180px),
		calc(100% - 2 * var(--ital-content-gutter, clamp(1rem, 3vw, 2.5rem)))
	);
	max-width: none;
}

.ital-cards-steps--form-rounded {
	border-radius: var(--ital-radius-section, 24px);
	overflow: hidden;
}

.ital-cards-steps--form-square .ital-cards-steps__inner {
	width: min(
		var(--ital-content-max, 1180px),
		calc(100% - 2 * var(--ital-content-gutter, clamp(1rem, 3vw, 2.5rem)))
	);
}

.ital-cards-steps__head {
	margin-bottom: clamp(1.5rem, 3vw, 2.25rem);
	width: 100%;
	max-width: none;
	box-sizing: border-box;
}

.ital-cards-steps--align-center .ital-cards-steps__head {
	margin-inline: auto;
	text-align: center;
}

.ital-cards-steps--align-right .ital-cards-steps__head {
	margin-inline: auto 0;
	text-align: right;
}

.ital-cards-steps--align-center .ital-cards-steps__lead {
	margin-inline: auto;
}

.ital-cards-steps--align-right .ital-cards-steps__lead {
	margin-inline: auto 0;
}

.ital-cards-steps__eyebrow {
	margin: 0 0 0.5rem;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--ital-cs-eyebrow, var(--ital-cs-muted));
}

.ital-cards-steps__title {
	margin: 0 0 0.65rem;
	max-width: none;
	font-size: clamp(1.5rem, 1.2rem + 1.2vw, 2.1rem);
	line-height: 1.2;
	font-weight: 600;
	color: var(--ital-cs-heading, var(--ital-cs-ink));
}

.ital-cards-steps__lead {
	margin: 0;
	max-width: 36rem;
	font-size: 14px;
	line-height: 1.5;
	color: var(--ital-cs-lead, var(--ital-cs-ink));
}

/*
 * Beat global body.italplast-theme h3/p (typography.css) which otherwise
 * inflate card H3 (~clamp h3) and clip inside overflow:hidden cards, and
 * leave lead/body looking muted/small vs neighbouring landing copy.
 */
body.italplast-theme .ital-cards-steps__lead {
	font-size: 14px;
	line-height: 1.5;
	font-weight: 400;
	color: var(--ital-cs-lead, var(--ital-cs-ink));
	opacity: 1;
}

body.italplast-theme .ital-cards-steps__card-title {
	font-size: 18px;
	line-height: 1.3;
	font-weight: 600;
	letter-spacing: normal;
	color: var(--ital-cs-title, var(--ital-cs-ink));
	overflow: visible;
	white-space: normal;
	overflow-wrap: break-word;
	word-break: normal;
	hyphens: none;
	text-overflow: unset;
	-webkit-line-clamp: unset;
	display: block;
	opacity: 1;
}

body.italplast-theme .ital-cards-steps__card-text {
	font-size: 14px;
	line-height: 1.5;
	font-weight: 400;
	color: var(--ital-cs-text, var(--ital-cs-ink));
	opacity: 1;
}

.ital-cards-steps__grid {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: var(--ital-cs-gap);
	align-items: stretch;
}

.ital-cards-steps__item {
	position: relative;
	min-width: 0;
	display: flex;
	flex-direction: column;
	height: 100%;
	overflow: visible;
}

.ital-cards-steps--mode-steps.ital-cards-steps--connector .ital-cards-steps__grid {
	overflow: visible;
}

.ital-cards-steps__card {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
	height: 100%;
	min-height: 0;
	padding: clamp(1.15rem, 2vw, 1.5rem);
	border-radius: var(--ital-cs-radius, var(--ital-radius-card, 12px));
	background-color: var(--ital-cs-card-bg, #fff);
	background-image: var(--ital-cs-card-bg-image, none);
	background-size: cover;
	background-position: center;
	/* visible: long H3 titles must wrap, not clip at column edge */
	overflow: visible;
}

.ital-cards-steps--motion-on .ital-cards-steps__card {
	transition:
		transform 300ms cubic-bezier(0.33, 1, 0.68, 1),
		box-shadow 300ms cubic-bezier(0.33, 1, 0.68, 1);
}

.ital-cards-steps--marker-pos-left .ital-cards-steps__card,
.ital-cards-steps--long .ital-cards-steps__card {
	flex-direction: row;
	align-items: flex-start;
	text-align: left;
}

.ital-cards-steps--effect-border .ital-cards-steps__card,
.ital-cards-steps--border-thin .ital-cards-steps__card {
	box-shadow: inset 0 0 0 1px var(--ital-cs-border, rgba(28, 36, 32, 0.12));
}

.ital-cards-steps--border-accent .ital-cards-steps__card {
	box-shadow: inset 0 0 0 2px var(--ital-cs-border, #2a4a3a);
}

.ital-cards-steps--effect-shadow .ital-cards-steps__card {
	box-shadow: 0 10px 28px rgba(16, 24, 20, 0.1);
}

.ital-cards-steps--effect-depth .ital-cards-steps__card {
	box-shadow:
		0 1px 0 rgba(255, 255, 255, 0.65) inset,
		0 14px 32px rgba(16, 24, 20, 0.12);
}

.ital-cards-steps__marker {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.ital-cards-steps--motion-on .ital-cards-steps__marker {
	transition: transform 300ms cubic-bezier(0.33, 1, 0.68, 1);
}

.ital-cards-steps__number {
	font-size: 1.75rem;
	font-weight: 700;
	line-height: 1;
	letter-spacing: -0.02em;
	color: var(--ital-cs-number, var(--ital-cs-ink));
}

.ital-cards-steps--number-large .ital-cards-steps__number {
	font-size: 2.15rem;
}

.ital-cards-steps__icon {
	/* Visible glyph target 28–32px (medium ≈ 30px). */
	width: 1.875rem;
	height: 1.875rem;
	color: var(--ital-cs-icon, var(--ital-cs-ink));
	background: var(--ital-cs-icon-bg, transparent);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	line-height: 0;
}

.ital-cards-steps--icon-size-large .ital-cards-steps__icon {
	width: 2rem;
	height: 2rem;
}

.ital-cards-steps--icon-size-xlarge .ital-cards-steps__icon {
	width: 2.25rem;
	height: 2.25rem;
}

.ital-cards-steps--icon-circle .ital-cards-steps__icon {
	border-radius: 999px;
}

.ital-cards-steps--icon-rounded .ital-cards-steps__icon {
	border-radius: 12px;
}

/* Glyph must fill the box — was 1.35em (~22px) inside a larger unused box. */
.ital-cards-steps__icon .ital-vnext-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	line-height: 0;
	color: inherit;
}

.ital-cards-steps__icon .ital-vnext-icon svg,
.ital-cards-steps__icon .ital-vnext-icon__svg,
.ital-cards-steps__icon svg,
.ital-cards-steps__icon img {
	width: 100%;
	height: 100%;
	max-width: 100%;
	max-height: 100%;
	display: block;
	object-fit: contain;
}

.ital-cards-steps__body {
	flex: 1 1 auto;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 0.45rem;
	overflow: visible;
}

.ital-cards-steps__card-title {
	margin: 0;
	font-size: 18px;
	line-height: 1.3;
	font-weight: 600;
	color: var(--ital-cs-title, var(--ital-cs-ink));
	overflow-wrap: break-word;
	word-break: normal;
	hyphens: none;
	white-space: normal;
}

.ital-cards-steps__card-text {
	margin: 0;
	font-size: 14px;
	line-height: 1.5;
	color: var(--ital-cs-text, var(--ital-cs-ink));
}

/* ------------------------------------------------------------------ *
 * Cards mode — item content alignment presets (not section header)
 * ------------------------------------------------------------------ */

.ital-cards-steps--mode-cards.ital-cards-steps--items-align-center .ital-cards-steps__card,
.ital-cards-steps--mode-cards.ital-cards-steps--items-align-heading_center_text_left .ital-cards-steps__card {
	flex-direction: column;
	align-items: center;
	text-align: center;
}

.ital-cards-steps--mode-cards.ital-cards-steps--items-align-right .ital-cards-steps__card {
	flex-direction: column;
	align-items: flex-end;
	text-align: right;
}

.ital-cards-steps--mode-cards.ital-cards-steps--items-align-center .ital-cards-steps__body,
.ital-cards-steps--mode-cards.ital-cards-steps--items-align-right .ital-cards-steps__body {
	width: 100%;
	align-items: inherit;
	text-align: inherit;
}

.ital-cards-steps--mode-cards.ital-cards-steps--items-align-center .ital-cards-steps__marker,
.ital-cards-steps--mode-cards.ital-cards-steps--items-align-center .ital-cards-steps__icon,
.ital-cards-steps--mode-cards.ital-cards-steps--items-align-center .ital-cards-steps__number,
.ital-cards-steps--mode-cards.ital-cards-steps--items-align-heading_center_text_left .ital-cards-steps__marker,
.ital-cards-steps--mode-cards.ital-cards-steps--items-align-heading_center_text_left .ital-cards-steps__icon,
.ital-cards-steps--mode-cards.ital-cards-steps--items-align-heading_center_text_left .ital-cards-steps__number {
	align-self: center;
	margin-inline: auto;
}

.ital-cards-steps--mode-cards.ital-cards-steps--items-align-right .ital-cards-steps__marker,
.ital-cards-steps--mode-cards.ital-cards-steps--items-align-right .ital-cards-steps__icon,
.ital-cards-steps--mode-cards.ital-cards-steps--items-align-right .ital-cards-steps__number {
	align-self: flex-end;
	margin-inline: auto 0;
}

.ital-cards-steps--mode-cards.ital-cards-steps--items-align-heading_center_text_left .ital-cards-steps__body {
	width: 100%;
	align-items: stretch;
	text-align: left;
}

.ital-cards-steps--mode-cards.ital-cards-steps--items-align-heading_center_text_left .ital-cards-steps__card-title {
	text-align: center;
	width: 100%;
}

.ital-cards-steps--mode-cards.ital-cards-steps--items-align-heading_center_text_left .ital-cards-steps__card-text {
	text-align: left;
	width: 100%;
}

/* Layouts — desktop */
@media (min-width: 900px) {
	.ital-cards-steps--layout-equal_2 .ital-cards-steps__grid,
	.ital-cards-steps--layout-long_2 .ital-cards-steps__grid,
	.ital-cards-steps--layout-rows_2_2 .ital-cards-steps__grid,
	.ital-cards-steps--layout-long_2_2 .ital-cards-steps__grid,
	.ital-cards-steps--layout-rows_2_2_2 .ital-cards-steps__grid,
	.ital-cards-steps--layout-rows_2_2_2_2 .ital-cards-steps__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.ital-cards-steps--layout-equal_3 .ital-cards-steps__grid,
	.ital-cards-steps--layout-rows_3_3 .ital-cards-steps__grid,
	.ital-cards-steps--layout-rows_3_3_2 .ital-cards-steps__grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.ital-cards-steps--layout-equal_4 .ital-cards-steps__grid,
	.ital-cards-steps--layout-rows_4_4 .ital-cards-steps__grid,
	.ital-cards-steps--layout-rows_4_2 .ital-cards-steps__grid {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}

	.ital-cards-steps--layout-equal_5 .ital-cards-steps__grid {
		grid-template-columns: repeat(5, minmax(0, 1fr));
	}

	.ital-cards-steps--layout-rows_4_2 .ital-cards-steps__item:nth-child(5),
	.ital-cards-steps--layout-rows_4_2 .ital-cards-steps__item:nth-child(6) {
		grid-column: span 2;
	}

	.ital-cards-steps--layout-rows_3_2 .ital-cards-steps__grid {
		grid-template-columns: repeat(6, minmax(0, 1fr));
	}

	.ital-cards-steps--layout-rows_3_2 .ital-cards-steps__item:nth-child(-n + 3) {
		grid-column: span 2;
	}

	.ital-cards-steps--layout-rows_3_2 .ital-cards-steps__item:nth-child(4) {
		grid-column: 2 / span 2;
	}

	.ital-cards-steps--layout-rows_3_2 .ital-cards-steps__item:nth-child(5) {
		grid-column: 4 / span 2;
	}

	.ital-cards-steps--layout-rows_3_3_2 .ital-cards-steps__item:nth-child(7),
	.ital-cards-steps--layout-rows_3_3_2 .ital-cards-steps__item:nth-child(8) {
		grid-column: span 1;
		/* within 3-col grid: center pair by spanning via 6-col switch */
	}

	.ital-cards-steps--layout-rows_3_3_2 .ital-cards-steps__grid {
		grid-template-columns: repeat(6, minmax(0, 1fr));
	}

	.ital-cards-steps--layout-rows_3_3_2 .ital-cards-steps__item:nth-child(-n + 6) {
		grid-column: span 2;
	}

	.ital-cards-steps--layout-rows_3_3_2 .ital-cards-steps__item:nth-child(7) {
		grid-column: 2 / span 2;
	}

	.ital-cards-steps--layout-rows_3_3_2 .ital-cards-steps__item:nth-child(8) {
		grid-column: 4 / span 2;
	}

	.ital-cards-steps--mode-steps .ital-cards-steps__grid,
	.ital-cards-steps--layout-steps_row .ital-cards-steps__grid {
		grid-template-columns: repeat(var(--ital-cs-count, 4), minmax(0, 1fr));
	}

	.ital-cards-steps--mode-steps .ital-cards-steps__card {
		padding: clamp(1rem, 1.7vw, 1.3rem) clamp(0.75rem, 1.15vw, 1rem);
		gap: 0.55rem;
	}

	.ital-cards-steps--mode-steps .ital-cards-steps__card-title {
		font-size: 19px;
		line-height: 1.28;
	}

	.ital-cards-steps--mode-steps .ital-cards-steps__card-text {
		font-size: 14px;
	}

	.ital-cards-steps--count-3 {
		--ital-cs-count: 3;
	}

	.ital-cards-steps--count-4 {
		--ital-cs-count: 4;
	}

	.ital-cards-steps--count-5 {
		--ital-cs-count: 5;
	}

	.ital-cards-steps--count-6 {
		--ital-cs-count: 6;
	}

	.ital-cards-steps--count-2 {
		--ital-cs-count: 2;
	}

	.ital-cards-steps--count-7,
	.ital-cards-steps--count-8 {
		--ital-cs-count: 4;
	}

	/* Desktop / wide: circle_arrow centered on the card junction (arrow →). */
	.ital-cards-steps--connector .ital-cards-steps__connector {
		position: absolute;
		top: 50%;
		left: 100%;
		transform: translate(-50%, -50%);
		width: var(--ital-cs-conn-size);
		height: var(--ital-cs-conn-size);
		display: block;
	}
}

/* Hover motion — only when instance animation is ON */
@media (hover: hover) and (pointer: fine) {
	.ital-cards-steps--motion-on .ital-cards-steps__card:hover {
		transform: translateY(-3px);
	}

	.ital-cards-steps--motion-on .ital-cards-steps__card:hover .ital-cards-steps__marker {
		transform: scale(1.035);
	}

	.ital-cards-steps--motion-on.ital-cards-steps--connector .ital-cards-steps__item:hover .ital-cards-steps__connector-disk {
		transform: scale(1.05);
	}
}

@media (prefers-reduced-motion: reduce) {
	.ital-cards-steps__card,
	.ital-cards-steps__marker,
	.ital-cards-steps__connector-disk {
		transition: none !important;
		transform: none !important;
	}
}

.ital-cards-steps--motion-off .ital-cards-steps__card,
.ital-cards-steps--motion-off .ital-cards-steps__marker,
.ital-cards-steps--motion-off .ital-cards-steps__connector-disk {
	transition: none;
	transform: none;
}

/* Mobile */
@media (max-width: 899.98px) {
	.ital-cards-steps__grid {
		grid-template-columns: minmax(0, 1fr);
	}

	.ital-cards-steps--mobile-two .ital-cards-steps__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.ital-cards-steps--long .ital-cards-steps__grid,
	.ital-cards-steps--layout-long_2 .ital-cards-steps__grid,
	.ital-cards-steps--layout-long_2_2 .ital-cards-steps__grid {
		grid-template-columns: minmax(0, 1fr);
	}

	.ital-cards-steps--marker-pos-left .ital-cards-steps__card,
	.ital-cards-steps--long .ital-cards-steps__card {
		flex-direction: row;
	}

	.ital-cards-steps__card-title,
	body.italplast-theme .ital-cards-steps__card-title {
		font-size: 17px;
		line-height: 1.3;
	}

	.ital-cards-steps__card-text,
	body.italplast-theme .ital-cards-steps__card-text,
	.ital-cards-steps__lead,
	body.italplast-theme .ital-cards-steps__lead {
		font-size: 14px;
		line-height: 1.5;
	}

	/* Mobile column: circle between cards, arrow ↓. */
	.ital-cards-steps--mobile-column.ital-cards-steps--mode-steps.ital-cards-steps--connector .ital-cards-steps__connector {
		position: relative;
		top: auto;
		left: auto;
		align-self: center;
		width: var(--ital-cs-conn-size);
		height: var(--ital-cs-conn-size);
		margin-block: calc(var(--ital-cs-conn-size) * -0.42);
		transform: none;
		z-index: 5;
	}

	.ital-cards-steps--mobile-column.ital-cards-steps--mode-steps.ital-cards-steps--connector .ital-cards-steps__connector-arrow {
		transform: rotate(90deg);
	}

	/* Mobile two-col: hide connectors (no clear between-cell path). */
	.ital-cards-steps--mobile-two.ital-cards-steps--mode-steps .ital-cards-steps__connector {
		display: none;
	}

	.ital-cards-steps--mobile-swipe.ital-cards-steps--mode-steps .ital-cards-steps__grid {
		display: flex;
		flex-direction: row;
		flex-wrap: nowrap;
		overflow-x: auto;
		scroll-snap-type: x mandatory;
		-webkit-overflow-scrolling: touch;
		gap: 1rem;
		padding-bottom: 0.35rem;
	}

	.ital-cards-steps--mobile-swipe.ital-cards-steps--mode-steps .ital-cards-steps__item {
		position: relative;
		flex: 0 0 min(78vw, 18rem);
		scroll-snap-align: start;
		overflow: visible;
	}

	/* Mobile swipe: circle on junction, arrow →. */
	.ital-cards-steps--mobile-swipe.ital-cards-steps--mode-steps.ital-cards-steps--connector .ital-cards-steps__connector {
		position: absolute;
		top: 50%;
		left: 100%;
		transform: translate(-50%, -50%);
		width: var(--ital-cs-conn-size);
		height: var(--ital-cs-conn-size);
		z-index: 5;
	}

	.ital-cards-steps--mobile-swipe.ital-cards-steps--mode-steps.ital-cards-steps--connector .ital-cards-steps__connector-arrow {
		transform: none;
	}
}

/* ------------------------------------------------------------------ *
 * Wide Cards family — PCM benefits rhythm (no PCM runtime dependency)
 * ------------------------------------------------------------------ */

.ital-cards-steps--mode-wide_cards {
	--ital-cs-gap: 0.875rem;
	--ital-cs-wide-icon: 2.5rem;
	--ital-cs-wide-glyph: 1.35rem;
	--ital-cs-wide-card-gap: 0.7rem;
	--ital-cs-wide-pad-y: 1.1rem;
	--ital-cs-wide-pad-x: 1.15rem;
	--ital-cs-wide-title: 17px;
	--ital-cs-wide-text: 14px;
}

.ital-cards-steps--mode-wide_cards.ital-cards-steps--layout-rows_2_2 {
	--ital-cs-wide-icon: 2.75rem;
	--ital-cs-wide-glyph: 1.45rem;
	--ital-cs-wide-title: 18px;
	--ital-cs-wide-pad-y: 1.2rem;
	--ital-cs-wide-pad-x: 1.25rem;
}

.ital-cards-steps--mode-wide_cards.ital-cards-steps--layout-rows_3_3 {
	--ital-cs-wide-icon: 2.4rem;
	--ital-cs-wide-glyph: 1.3rem;
	--ital-cs-wide-title: 17px;
	--ital-cs-wide-pad-y: 1.05rem;
	--ital-cs-wide-pad-x: 1.05rem;
}

.ital-cards-steps--mode-wide_cards.ital-cards-steps--layout-rows_4_4 {
	--ital-cs-gap: 0.75rem;
	--ital-cs-wide-icon: 2.15rem;
	--ital-cs-wide-glyph: 1.15rem;
	--ital-cs-wide-card-gap: 0.6rem;
	--ital-cs-wide-title: 16px;
	--ital-cs-wide-text: 13px;
	--ital-cs-wide-pad-y: 0.95rem;
	--ital-cs-wide-pad-x: 0.9rem;
}

.ital-cards-steps--mode-wide_cards .ital-cards-steps__connector {
	display: none !important;
}

.ital-cards-steps--mode-wide_cards .ital-cards-steps__card {
	flex-direction: row;
	align-items: flex-start;
	text-align: left;
	gap: var(--ital-cs-wide-card-gap);
	padding: var(--ital-cs-wide-pad-y) var(--ital-cs-wide-pad-x);
}

.ital-cards-steps--mode-wide_cards .ital-cards-steps__marker,
.ital-cards-steps--mode-wide_cards .ital-cards-steps__icon {
	flex: 0 0 auto;
	width: var(--ital-cs-wide-icon);
	height: var(--ital-cs-wide-icon);
	margin: 0;
}

.ital-cards-steps--mode-wide_cards .ital-cards-steps__icon .ital-vnext-icon,
.ital-cards-steps--mode-wide_cards .ital-cards-steps__icon svg,
.ital-cards-steps--mode-wide_cards .ital-cards-steps__icon img {
	width: var(--ital-cs-wide-glyph);
	height: var(--ital-cs-wide-glyph);
}

.ital-cards-steps--mode-wide_cards .ital-cards-steps__body {
	gap: 0.2rem;
	justify-content: center;
}

.ital-cards-steps--mode-wide_cards .ital-cards-steps__card-title {
	font-size: var(--ital-cs-wide-title);
	line-height: 1.3;
	letter-spacing: -0.005em;
}

.ital-cards-steps--mode-wide_cards .ital-cards-steps__card-text {
	font-size: var(--ital-cs-wide-text);
	line-height: 1.55;
}

/* Tablet: denser presets → 2 columns; keep icon-left composition. */
@media (min-width: 600px) and (max-width: 899.98px) {
	.ital-cards-steps--mode-wide_cards.ital-cards-steps--layout-rows_2_2 .ital-cards-steps__grid,
	.ital-cards-steps--mode-wide_cards.ital-cards-steps--layout-rows_3_3 .ital-cards-steps__grid,
	.ital-cards-steps--mode-wide_cards.ital-cards-steps--layout-rows_4_4 .ital-cards-steps__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 599.98px) {
	.ital-cards-steps--mode-wide_cards {
		--ital-cs-wide-icon: 2.25rem;
		--ital-cs-wide-glyph: 1.2rem;
		--ital-cs-wide-card-gap: 0.65rem;
		--ital-cs-wide-title: 16px;
		--ital-cs-wide-text: 13px;
		--ital-cs-wide-pad-y: 1rem;
		--ital-cs-wide-pad-x: 1rem;
	}

	.ital-cards-steps--mode-wide_cards .ital-cards-steps__grid {
		grid-template-columns: minmax(0, 1fr);
	}

	.ital-cards-steps--mode-wide_cards .ital-cards-steps__card {
		flex-direction: row;
		align-items: flex-start;
	}
}

.ital-cards-steps--has-bg-image {
	background-color: rgba(255, 255, 255, 0.88);
	background-blend-mode: lighten;
}