/* Shared service-card presentation extracted from Consulting. Both service
 * sections use the same selectors, rings, reveal states and breakpoints. */


.ibenlo-consulting-service-grid {
	--consulting-service-gap: var(--ibenlo-card-gap, 12px);
	--consulting-ink: var(--ibenlo-color-heading);
	--consulting-muted: var(--ibenlo-color-text-muted);
	--consulting-border: var(--theme-edge);
	--consulting-service-stage-edge: 2px;
	align-items: stretch;
	display: grid;
	gap: var(--consulting-service-gap);
	grid-auto-rows: 1fr;
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.ibenlo-consulting-service-card {
	--tilt-rotate-x: 0deg;
	--tilt-rotate-y: 0deg;
	--tilt-shift-x: 0px;
	--tilt-shift-y: 0px;
	--tilt-lift: 0px;
	--tilt-glow-x: 50%;
	--tilt-glow-y: 22%;
	--tilt-glow-opacity: 0;
	--consulting-reveal-delay: 0ms;
	--consulting-reveal-opacity: 1;
	--consulting-reveal-rotate: 0deg;
	--consulting-reveal-scale: 1;
	--consulting-reveal-x: 0px;
	--consulting-reveal-y: 0px;
	--consulting-service-accent: var(--ibenlo-stage-readable-green, #5fed70);
	background-color: rgba(23, 33, 49, 0.82);
	background:
		radial-gradient(circle at var(--tilt-glow-x) var(--tilt-glow-y), color-mix(in srgb, var(--consulting-service-accent) 12%, transparent), transparent 34%),
		linear-gradient(145deg, rgba(255, 255, 255, 0.075), rgba(255, 255, 255, 0.015) 48%),
		rgba(23, 33, 49, 0.82);
	border: 1px solid color-mix(in srgb, var(--consulting-service-accent) 18%, var(--consulting-border));
	border-radius: calc(var(--radius-card) + 0.55rem);
	box-shadow: 0 18px 46px rgba(0, 0, 0, 0.16);
	display: grid;
	gap: clamp(1rem, 2.2vw, 1.35rem);
	/* Minimum card height must not stretch the text tracks beyond shared gaps. */
	align-content: start;
	height: 100%;
	min-height: clamp(20rem, 22vw, 26rem);
	opacity: var(--consulting-reveal-opacity);
	overflow: hidden;
	padding: clamp(1.35rem, 2.6vw, 2rem);
	position: relative;
	transform:
		perspective(1600px)
		rotateX(var(--tilt-rotate-x))
		rotateY(var(--tilt-rotate-y))
		translate3d(var(--consulting-reveal-x), calc(var(--tilt-lift) + var(--consulting-reveal-y)), 0)
		rotateZ(var(--consulting-reveal-rotate))
		scale(var(--consulting-reveal-scale));
	transform-style: preserve-3d;
	transition:
		background-color 180ms ease,
		border-color 180ms ease,
		opacity 520ms cubic-bezier(0.16, 1, 0.3, 1) var(--consulting-reveal-delay),
		box-shadow 180ms ease,
		transform 620ms cubic-bezier(0.16, 1, 0.3, 1) var(--consulting-reveal-delay);
	will-change: transform, opacity;
}

.ibenlo-consulting-service-card[data-ibenlo-consulting-reveal] {
	--consulting-reveal-opacity: 0;
	--consulting-reveal-rotate: 0deg;
	--consulting-reveal-scale: 0.965;
	--consulting-reveal-x: 0px;
	--consulting-reveal-y: clamp(1.8rem, 3vw, 3.5rem);
}

.ibenlo-consulting-service-card[data-ibenlo-consulting-reveal].is-consulting-reveal-from-left {
	--consulting-reveal-rotate: -1.1deg;
	--consulting-reveal-x: clamp(-2.2rem, -3vw, -1.1rem);
}

.ibenlo-consulting-service-card[data-ibenlo-consulting-reveal].is-consulting-reveal-from-right {
	--consulting-reveal-rotate: 1.1deg;
	--consulting-reveal-x: clamp(1.1rem, 3vw, 2.2rem);
}

.ibenlo-consulting-service-card[data-ibenlo-consulting-reveal].is-consulting-revealed {
	--consulting-reveal-opacity: 1;
	--consulting-reveal-rotate: 0deg;
	--consulting-reveal-scale: 1;
	--consulting-reveal-x: 0px;
	--consulting-reveal-y: 0px;
}

.ibenlo-consulting-service-card::before {
	background:
		radial-gradient(circle at 100% 100%, color-mix(in srgb, var(--consulting-service-accent) 22%, transparent), transparent 30%),
		linear-gradient(180deg, rgba(255, 255, 255, 0.05), transparent 44%);
	content: "";
	inset: 0;
	opacity: 0;
	pointer-events: none;
	position: absolute;
	transition: opacity 180ms ease;
	z-index: 0;
}

.ibenlo-consulting-service-card__rings {
	height: clamp(42rem, 46vw, 54rem);
	left: calc(var(--consulting-service-stage-edge) / -2);
	overflow: visible;
	pointer-events: none;
	position: absolute;
	top: calc(var(--consulting-service-stage-edge) / -2);
	width: calc(300% + (var(--consulting-service-gap) * 2) + (var(--consulting-service-stage-edge) * 2));
	z-index: 0;
}

.ibenlo-consulting-service-card__ring {
	--consulting-ring-size: 8rem;
	--consulting-ring-stroke: 1.5px;
	--consulting-ring-opacity: 0.34;
	aspect-ratio: 1;
	border: var(--consulting-ring-stroke) solid color-mix(in srgb, var(--consulting-service-accent) 44%, transparent);
	border-radius: 999px;
	height: var(--consulting-ring-size);
	opacity: var(--consulting-ring-opacity);
	position: absolute;
	transform: translate3d(0, 0, 0) scale(1);
	will-change: transform;
}

.ibenlo-consulting-service-card__ring--1 {
	--consulting-ring-opacity: 0.42;
	--consulting-ring-size: 8rem;
	--consulting-ring-stroke: 2.25px;
	animation: ibenloConsultingRingDriftA 17s cubic-bezier(0.37, 0, 0.2, 1) infinite alternate;
	left: 76%;
	top: 58%;
}

.ibenlo-consulting-service-card__ring--2 {
	--consulting-ring-opacity: 0.31;
	--consulting-ring-size: 11rem;
	--consulting-ring-stroke: 1.85px;
	animation: ibenloConsultingRingDriftB 23s cubic-bezier(0.42, 0, 0.24, 1) infinite alternate;
	animation-delay: -5s;
	left: 36%;
	top: 10%;
}

.ibenlo-consulting-service-card__ring--3 {
	--consulting-ring-opacity: 0.25;
	--consulting-ring-size: 14rem;
	--consulting-ring-stroke: 1.35px;
	animation: ibenloConsultingRingDriftC 29s cubic-bezier(0.35, 0, 0.16, 1) infinite alternate;
	animation-delay: -12s;
	left: 8%;
	top: 34%;
}

.ibenlo-consulting-service-card__ring--4 {
	--consulting-ring-opacity: 0.2;
	--consulting-ring-size: 18rem;
	--consulting-ring-stroke: 1.55px;
	animation: ibenloConsultingRingDriftD 31s cubic-bezier(0.4, 0, 0.2, 1) infinite alternate;
	animation-delay: -18s;
	left: 54%;
	top: 72%;
}

.ibenlo-consulting-service-card:nth-child(2) .ibenlo-consulting-service-card__rings,
.ibenlo-consulting-service-card:nth-child(5) .ibenlo-consulting-service-card__rings {
	left: calc(-100% - var(--consulting-service-gap) - (var(--consulting-service-stage-edge) * 1.5));
}

.ibenlo-consulting-service-card:nth-child(3) .ibenlo-consulting-service-card__rings,
.ibenlo-consulting-service-card:nth-child(6) .ibenlo-consulting-service-card__rings {
	left: calc(-200% - (var(--consulting-service-gap) * 2) - (var(--consulting-service-stage-edge) * 2.5));
}

.ibenlo-consulting-service-card:nth-child(n+4) .ibenlo-consulting-service-card__rings {
	top: calc(-100% - var(--consulting-service-gap) - (var(--consulting-service-stage-edge) * 1.5));
}

.ibenlo-consulting-service-card > * {
	position: relative;
	z-index: 1;
}

.ibenlo-consulting-service-card > .ibenlo-consulting-service-card__rings {
	position: absolute;
	z-index: 0;
}

.ibenlo-consulting-service-card:hover,
.ibenlo-consulting-service-card.is-tilt-active {
	--tilt-lift: -8px;
	background-color: color-mix(in srgb, var(--consulting-service-accent) 13%, rgba(23, 33, 49, 0.92));
	background:
		radial-gradient(circle at var(--tilt-glow-x) var(--tilt-glow-y), color-mix(in srgb, var(--consulting-service-accent) 24%, transparent), transparent 36%),
		linear-gradient(145deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.02) 48%),
		color-mix(in srgb, var(--consulting-service-accent) 13%, rgba(23, 33, 49, 0.92));
	border-color: color-mix(in srgb, var(--consulting-service-accent) 54%, var(--consulting-border));
	box-shadow:
		0 24px 54px rgba(0, 0, 0, 0.2),
		0 0 0 1px color-mix(in srgb, var(--consulting-service-accent) 16%, transparent);
}

.ibenlo-consulting-service-card:hover::before,
.ibenlo-consulting-service-card.is-tilt-active::before {
	opacity: 1;
}

.ibenlo-consulting-service-card--intro {
	align-content: start;
	background:
		radial-gradient(circle at 90% 18%, color-mix(in srgb, var(--consulting-service-accent) 18%, transparent), transparent 28rem),
		linear-gradient(145deg, rgba(255, 255, 255, 0.075), rgba(255, 255, 255, 0.015) 48%),
		rgba(23, 33, 49, 0.82);
}

.ibenlo-consulting-service-card--intro .ibenlo-stage-title {
	color: var(--consulting-ink);
	max-width: 12ch;
	white-space: normal;
}

body.ibenlo-stage-theme.ibenlo-light-mode .ibenlo-consulting-service-card {
	background-color: var(--ibenlo-light-card-surface, #fff);
	background:
		radial-gradient(circle at var(--tilt-glow-x) var(--tilt-glow-y), color-mix(in srgb, var(--consulting-service-accent) 6%, transparent), transparent 34%),
		linear-gradient(180deg, var(--ibenlo-light-card-surface, #fff), var(--ibenlo-color-surface-strong, #fffaf2));
	border-color: color-mix(in srgb, var(--consulting-service-accent) 22%, rgba(23, 33, 49, 0.1));
	box-shadow: 0 18px 42px rgba(44, 38, 70, 0.12);
}

body.ibenlo-stage-theme.ibenlo-light-mode .ibenlo-consulting-service-card__ring {
	opacity: 0.32;
}

body.ibenlo-stage-theme.ibenlo-light-mode .ibenlo-consulting-service-card:hover,
body.ibenlo-stage-theme.ibenlo-light-mode .ibenlo-consulting-service-card.is-tilt-active {
	background-color: var(--ibenlo-light-card-surface, #fff);
	background:
		radial-gradient(circle at var(--tilt-glow-x) var(--tilt-glow-y), color-mix(in srgb, var(--consulting-service-accent) 14%, transparent), transparent 36%),
		linear-gradient(180deg, var(--ibenlo-light-card-surface, #fff), var(--ibenlo-color-surface-strong, #fffaf2));
	border-color: color-mix(in srgb, var(--consulting-service-accent) 52%, rgba(23, 33, 49, 0.12));
	box-shadow: 0 20px 44px rgba(44, 38, 70, 0.16);
}

.ibenlo-consulting-service-card .ti {
	align-items: center;
	background: color-mix(in srgb, var(--consulting-service-accent) 14%, transparent);
	border: 1px solid color-mix(in srgb, var(--consulting-service-accent) 42%, transparent);
	border-radius: var(--radius-card-inner);
	color: var(--consulting-service-accent);
	display: inline-flex;
	font-size: clamp(2rem, 2.6vw, 2.55rem);
	height: clamp(4.15rem, 5vw, 4.9rem);
	justify-content: center;
	width: clamp(4.15rem, 5vw, 4.9rem);
	transition:
		background-color 180ms ease,
		border-color 180ms ease,
		color 180ms ease,
		transform 180ms ease;
}

.ibenlo-consulting-service-card:hover .ti,
.ibenlo-consulting-service-card.is-tilt-active .ti {
	background: color-mix(in srgb, var(--consulting-service-accent) 24%, transparent);
	border-color: color-mix(in srgb, var(--consulting-service-accent) 68%, transparent);
	transform: translate3d(0, -2px, 0);
}

@keyframes ibenloConsultingRingDriftA {
	0% {
		transform: translate3d(-90%, 34%, 0) scale(0.62);
	}

	31% {
		transform: translate3d(86%, -58%, 0) scale(1.42);
	}

	68% {
		transform: translate3d(-42%, -92%, 0) scale(0.88);
	}

	100% {
		transform: translate3d(124%, 64%, 0) scale(1.18);
	}
}

@keyframes ibenloConsultingRingDriftB {
	0% {
		transform: translate3d(54%, -44%, 0) scale(1.22);
	}

	24% {
		transform: translate3d(-108%, 92%, 0) scale(0.78);
	}

	61% {
		transform: translate3d(126%, 136%, 0) scale(1.58);
	}

	100% {
		transform: translate3d(-34%, 18%, 0) scale(0.96);
	}
}

@keyframes ibenloConsultingRingDriftC {
	0% {
		transform: translate3d(142%, 26%, 0) scale(0.72);
	}

	38% {
		transform: translate3d(226%, -64%, 0) scale(1.34);
	}

	74% {
		transform: translate3d(54%, 156%, 0) scale(1.78);
	}

	100% {
		transform: translate3d(172%, 82%, 0) scale(0.9);
	}
}

@keyframes ibenloConsultingRingDriftD {
	0% {
		transform: translate3d(70%, 102%, 0) scale(1.55);
	}

	29% {
		transform: translate3d(-64%, -52%, 0) scale(0.84);
	}

	66% {
		transform: translate3d(118%, -82%, 0) scale(1.18);
	}

	100% {
		transform: translate3d(-96%, 86%, 0) scale(1.92);
	}
}

@media (prefers-reduced-motion: reduce) {
	.ibenlo-consulting-service-card[data-ibenlo-consulting-reveal] {
		--consulting-reveal-opacity: 1;
		--consulting-reveal-rotate: 0deg;
		--consulting-reveal-scale: 1;
		--consulting-reveal-x: 0px;
		--consulting-reveal-y: 0px;
		filter: none;
		transition-delay: 0ms;
	}

	.ibenlo-consulting-service-card__ring {
		animation: none;
		transform: translate3d(0, 0, 0);
	}
}

.ibenlo-consulting-service-card h3 {
	color: var(--consulting-ink);
	font-family: var(--ibenlo-type-family, Montserrat, sans-serif);
	font-size: 1.25rem;
	font-weight: 900;
	letter-spacing: 0;
	line-height: 1.18;
	margin: 0;
	text-transform: uppercase;
}

.ibenlo-consulting-service-card p {
	color: var(--consulting-muted);
	font-size: var(--ibenlo-type-paragraph);
	line-height: var(--ibenlo-type-paragraph-line-height);
	margin: 0;
}

@media (max-width: 1180px) {
	.ibenlo-consulting-service-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.ibenlo-consulting-service-card {
		min-height: clamp(17rem, 31vw, 22rem);
	}

	.ibenlo-consulting-service-card__rings {
		height: clamp(58rem, 92vw, 74rem);
		left: calc(var(--consulting-service-stage-edge) / -2);
		top: calc(var(--consulting-service-stage-edge) / -2);
		width: calc(200% + var(--consulting-service-gap) + (var(--consulting-service-stage-edge) * 2));
	}

	.ibenlo-consulting-service-card:nth-child(odd) .ibenlo-consulting-service-card__rings {
		left: calc(var(--consulting-service-stage-edge) / -2);
	}

	.ibenlo-consulting-service-card:nth-child(even) .ibenlo-consulting-service-card__rings {
		left: calc(-100% - var(--consulting-service-gap) - (var(--consulting-service-stage-edge) * 1.5));
	}

	.ibenlo-consulting-service-card:nth-child(3) .ibenlo-consulting-service-card__rings,
	.ibenlo-consulting-service-card:nth-child(4) .ibenlo-consulting-service-card__rings {
		top: calc(-100% - var(--consulting-service-gap) - (var(--consulting-service-stage-edge) * 1.5));
	}

	.ibenlo-consulting-service-card:nth-child(5) .ibenlo-consulting-service-card__rings,
	.ibenlo-consulting-service-card:nth-child(6) .ibenlo-consulting-service-card__rings {
		top: calc(-200% - (var(--consulting-service-gap) * 2) - (var(--consulting-service-stage-edge) * 2.5));
	}
}

@media (max-width: 620px) {

	.ibenlo-consulting-service-grid {
		grid-template-columns: 1fr;
	}

	.ibenlo-consulting-service-card {
		min-height: 0;
		padding: clamp(1.2rem, 6vw, 1.55rem);
	}

	.ibenlo-consulting-service-card__rings {
		height: clamp(112rem, 380vw, 148rem);
		left: calc(var(--consulting-service-stage-edge) / -2) !important;
		width: 100%;
	}

	.ibenlo-consulting-service-card:nth-child(1) .ibenlo-consulting-service-card__rings {
		top: calc(var(--consulting-service-stage-edge) / -2);
	}

	.ibenlo-consulting-service-card:nth-child(2) .ibenlo-consulting-service-card__rings {
		top: calc(-100% - var(--consulting-service-gap) - (var(--consulting-service-stage-edge) * 1.5));
	}

	.ibenlo-consulting-service-card:nth-child(3) .ibenlo-consulting-service-card__rings {
		top: calc(-200% - (var(--consulting-service-gap) * 2) - (var(--consulting-service-stage-edge) * 2.5));
	}

	.ibenlo-consulting-service-card:nth-child(4) .ibenlo-consulting-service-card__rings {
		top: calc(-300% - (var(--consulting-service-gap) * 3) - (var(--consulting-service-stage-edge) * 3.5));
	}

	.ibenlo-consulting-service-card:nth-child(5) .ibenlo-consulting-service-card__rings {
		top: calc(-400% - (var(--consulting-service-gap) * 4) - (var(--consulting-service-stage-edge) * 4.5));
	}

	.ibenlo-consulting-service-card:nth-child(6) .ibenlo-consulting-service-card__rings {
		top: calc(-500% - (var(--consulting-service-gap) * 5) - (var(--consulting-service-stage-edge) * 5.5));
	}
}