.ll-feature-switcher {
	display: flex;
	flex-direction: column;
	gap: var(--spacing-10, 2.5rem);
	width: 100%;
}

.ll-feature-switcher__panels {
	position: relative;
	min-height: 280px;
}

/* Divi wraps each child module — flatten wrapper for layout/tabs */
.ll-feature-switcher__panels > .et_pb_module {
	margin: 0;
	padding: 0;
	border: none;
	background: transparent;
}

.ll-feature-switcher__panels > .et_pb_module .et_pb_module_inner {
	display: contents;
}

.ll-feature-switcher__panel {
	display: none;
	animation: ll-feature-switcher-fade var(--transition-base, 300ms ease-in-out);
}

.ll-feature-switcher__panel.is-active {
	display: block;
}

.ll-feature-switcher__panel[hidden] {
	display: none !important;
}

.ll-feature-switcher__layout {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: var(--spacing-10, 2.5rem);
	align-items: center;
}

.ll-feature-switcher__media {
	width: 100%;
}

.ll-feature-switcher__media img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	border-radius: var(--radius-2xl, 1rem);
	background-color: var(--ink-100, hsl(214 32% 91%));
}

.ll-feature-switcher__text {
	display: flex;
	flex-direction: column;
	gap: var(--spacing-4, 1rem);
}

.ll-feature-switcher__title {
	margin: 0;
	color: var(--text-dark-text, var(--ink-800));
}

.ll-feature-switcher__body {
	color: var(--text-dark-text, var(--ink-800));
}

.ll-feature-switcher__body p {
	margin: 0 0 var(--spacing-4, 1rem);
}

.ll-feature-switcher__body p:last-child {
	margin-bottom: 0;
}

.ll-feature-switcher__nav-scroll {
	overflow-x: auto;
	overflow-y: hidden;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: none;
	display: flex;
	justify-content: center;
}

.ll-feature-switcher__nav-scroll::-webkit-scrollbar {
	display: none;
}

.ll-feature-switcher__nav {
	display: inline-flex;
	flex-wrap: nowrap;
	gap: var(--spacing-2, 0.5rem);
	min-width: min-content;
	padding: var(--spacing-2, 0.5rem);
	background-color: var(--accent-050, #e5f0ff);
	border-radius: var(--radius-full, 9999px);
}

.ll-feature-switcher__tab {
	flex: 0 0 auto;
	margin: 0;
	padding: var(--spacing-3, 0.75rem) var(--spacing-6, 1.5rem);
	border: none;
	border-radius: var(--radius-full, 9999px);
	background: transparent;
	color: var(--ink-800, hsl(215 61% 11%));
	font-family: var(--font-family, "neuzeit-grotesk", sans-serif);
	font-size: var(--font-size-base, 16px);
	font-weight: var(--font-weight-base, 400);
	line-height: var(--line-height-base, 1.5);
	white-space: nowrap;
	cursor: pointer;
	transition:
		background-color var(--transition-fast, 220ms ease-in-out),
		color var(--transition-fast, 220ms ease-in-out);
}

.ll-feature-switcher__tab:hover {
	color: var(--accent-700, hsl(218 100% 42%));
}

.ll-feature-switcher__tab:focus-visible {
	outline: 2px solid var(--accent-500, hsl(216 100% 55%));
	outline-offset: 2px;
}

.ll-feature-switcher__tab.is-active {
	background-color: var(--accent-600, hsl(217 100% 50%));
	color: var(--ink-050, hsl(214 47% 97%));
}

@keyframes ll-feature-switcher-fade {
	from {
		opacity: 0;
		transform: translateY(6px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

@media screen and (max-width: 767px) {
	.ll-feature-switcher__layout {
		grid-template-columns: 1fr;
		gap: var(--spacing-6, 1.5rem);
	}

	.ll-feature-switcher__nav-scroll {
		margin-inline: calc(-1 * var(--spacing-4, 1rem));
		padding-inline: var(--spacing-4, 1rem);
	}

	.ll-feature-switcher__nav {
		width: max-content;
		max-width: none;
	}
}