/**
 * ACF Repeater blocks for Use Cases
 *   .faddom-problem-cards / .faddom-problem-card
 *   .faddom-how-steps / .faddom-how-step
 */

.faddom-problem-cards,
.faddom-how-steps,
.faddom-repeater {
	--faddom-repeater-color: var(--faddom-color-aqua-200);
	box-sizing: border-box;
	width: 100%;
}

.faddom-problem-card.is-green,
.faddom-repeater__item.is-green {
	--faddom-repeater-color: var(--faddom-color-aqua-700);
}

.faddom-problem-card.is-blue,
.faddom-repeater__item.is-blue {
	--faddom-repeater-color: var(--faddom-color-bright-aqua-400);
}

.faddom-problem-card.is-orange,
.faddom-repeater__item.is-orange {
	--faddom-repeater-color: var(--faddom-color-orange-300);
}

.faddom-problem-cards {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 16px;
}

.faddom-problem-card {
	display: flex;
	flex-direction: column;
	min-width: 0;
	overflow: hidden;
	background: var(--faddom-color-aqua-25, #f7fbfb);
	border-radius: 12px;
	box-shadow: inset 0 0 0 1px var(--faddom-color-border, rgba(6, 35, 35, 0.2));
}

.faddom-problem-card__media {
	position: relative;
	aspect-ratio: 16 / 10;
	background: var(--faddom-repeater-color);
}

.faddom-problem-card__media::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 4px;
	background: var(--faddom-repeater-color);
}

.faddom-problem-card__media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.faddom-problem-card__body {
	display: flex;
	flex-direction: column;
	gap: 8px;
	padding: 20px 20px 24px;
}

.faddom-problem-card__title {
	margin: 0;
	font-family: var(--faddom-type-title-small-family);
	font-size: var(--faddom-type-title-small-size);
	font-weight: var(--faddom-type-title-small-weight);
	line-height: var(--faddom-type-title-small-line);
	letter-spacing: var(--faddom-type-title-small-tracking);
	color: var(--faddom-color-text);
}

.faddom-problem-card__desc {
	margin: 0;
	font-family: var(--faddom-type-body-small-family);
	font-size: var(--faddom-type-body-small-size);
	font-weight: var(--faddom-type-body-small-weight);
	line-height: var(--faddom-type-body-small-line);
	letter-spacing: var(--faddom-type-body-small-tracking);
	color: var(--faddom-color-text-muted);
}

/*
 * Elementor loop item (shortcode widgets).
 * Heading/text widgets lost typography after the switch to [faddom_row].
 */
.faddom-problem-cards .faddom-row--problem_title,
.faddom-problem-cards .problem-title,
.faddom-problem-cards .problem-title .elementor-shortcode {
	display: block;
	font-family: var(--faddom-type-title-small-family);
	font-size: 24px;
	font-weight: var(--faddom-type-title-small-weight);
	line-height: 32px;
	letter-spacing: -0.02em;
	color: var(--faddom-color-white);
	text-align: center;
}

.faddom-repeater__item.is-blue .faddom-row--problem_title,
.faddom-repeater__item.is-orange .faddom-row--problem_title,
.faddom-repeater__item.is-blue .problem-title,
.faddom-repeater__item.is-orange .problem-title,
.faddom-repeater__item.is-blue .problem-title .elementor-shortcode,
.faddom-repeater__item.is-orange .problem-title .elementor-shortcode {
	color: var(--faddom-color-aqua-800) !important;
}

.faddom-problem-cards .faddom-row--problem_description,
.faddom-problem-cards .problem-desc,
.faddom-problem-cards .elementor-element-03c6f52,
.faddom-problem-cards .elementor-element-03c6f52 .elementor-shortcode {
	display: block;
	font-family: var(--faddom-type-body-medium-family);
	font-size: 18px;
	font-weight: var(--faddom-type-body-medium-weight);
	line-height: 28px;
	letter-spacing: -0.01em;
	color: var(--faddom-color-text-muted);
	text-align: center;
}

.faddom-how-tabs {
	display: grid;
	grid-template-columns: repeat(var(--faddom-how-tabs-count, 3), minmax(0, 1fr));
	column-gap: 4px;
	row-gap: 72px;
	width: 100%;
	box-sizing: border-box;
}

.faddom-how-tabs__item {
	display: contents;
}

button.faddom-how-tabs__tab,
.faddom-how-tabs__tab {
	display: flex;
	align-items: center;
	justify-content: center !important;
	gap: 12px !important;
	flex-wrap: nowrap;
	grid-row: 1;
	width: 100%;
	height: auto;
	min-height: 0;
	margin: 0;
	padding: 16px;
	border: none !important;
	border-radius: 8px;
	box-shadow: none !important;
	background: var(--faddom-color-white) !important;
	background-color: var(--faddom-color-white) !important;
	background-image: none !important;
	color: var(--faddom-color-aqua-800) !important;
	font-family: var(--faddom-type-body-small-emphasis-family);
	font-size: 16px;
	font-weight: 500;
	line-height: 24px;
	letter-spacing: -0.01em;
	text-align: center;
	text-transform: none;
	text-decoration: none;
	white-space: normal !important;
	cursor: pointer;
	appearance: none;
	-webkit-appearance: none;
	transition: background-color 0.3s ease, color 0.3s ease;
}

button.faddom-how-tabs__tab:hover,
button.faddom-how-tabs__tab:focus,
button.faddom-how-tabs__tab.is-active,
.faddom-how-tabs__tab:hover,
.faddom-how-tabs__tab:focus,
.faddom-how-tabs__tab.is-active {
	background: var(--faddom-color-aqua-75) !important;
	background-color: var(--faddom-color-aqua-75) !important;
	background-image: none !important;
	color: var(--faddom-color-aqua-800) !important;
	box-shadow: none !important;
}

.faddom-how-tabs__tab:focus-visible {
	outline: 2px solid var(--faddom-color-aqua-600);
	outline-offset: 2px;
}

.faddom-how-tabs__num {
	display: inline-flex;
	flex: 0 0 auto;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 8px;
	background: var(--faddom-color-aqua-50);
	color: var(--faddom-color-aqua-900);
	font-family: var(--faddom-type-caption-m-family);
	font-size: 14px;
	font-weight: var(--faddom-type-caption-m-weight);
	line-height: 22px;
	letter-spacing: var(--faddom-type-caption-m-tracking);
	text-transform: none;
	transition: background-color 0.3s ease, color 0.3s ease;
}

.faddom-how-tabs__tab:hover .faddom-how-tabs__num,
.faddom-how-tabs__tab.is-active .faddom-how-tabs__num {
	background: var(--faddom-color-aqua-700);
	color: var(--faddom-color-white);
}

.faddom-how-tabs__label {
	display: block;
	flex: 0 1 auto;
	min-width: 0;
	white-space: normal;
	overflow-wrap: break-word;
	text-align: start;
}

.faddom-how-tabs__panel {
	grid-column: 1 / -1;
	grid-row: 2;
	width: 100%;
	min-width: 0;
}

.faddom-how-tabs__panel[hidden] {
	display: none !important;
}

.faddom-how-step {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 576px;
	align-items: stretch;
	width: 100%;
}

.faddom-how-step:not(:has(.faddom-how-step__media)) {
	grid-template-columns: 1fr;
}

.faddom-how-step__body {
	display: flex;
	flex-direction: column;
	justify-content: center;
	min-width: 0;
	padding-right: 48px;
}

.faddom-how-step__desc {
	display: flex;
	flex-direction: column;
	gap: 24px;
	max-width: 480px;
	font-family: var(--faddom-type-body-medium-family);
	font-size: 18px;
	font-weight: var(--faddom-type-body-medium-weight);
	line-height: 28px;
	letter-spacing: -0.01em;
	color: var(--faddom-color-text-muted);
}

.faddom-how-step__desc > *:first-child {
	margin-top: 0;
}

.faddom-how-step__desc > *:last-child {
	margin-bottom: 0;
}

.faddom-how-step__desc h1,
.faddom-how-step__desc h2,
.faddom-how-step__desc h3,
.faddom-how-step__desc h4,
.faddom-how-step__desc h5,
.faddom-how-step__desc h6,
.faddom-how-tabs .faddom-row--step_heading {
	margin: 0;
	font-family: var(--faddom-type-title-medium-family);
	font-size: 40px;
	font-weight: var(--faddom-type-title-medium-weight);
	line-height: 48px;
	letter-spacing: -0.02em;
	color: var(--faddom-color-aqua-800);
}

.faddom-how-step__desc p {
	margin: 0;
}

.faddom-how-step__desc ul,
.faddom-how-step__desc ol {
	margin: 0;
	padding: 0 0 0 25px;
}

.faddom-how-step__desc li {
	font-family: var(--faddom-type-body-medium-family);
	font-size: 18px;
	font-weight: var(--faddom-type-body-medium-weight);
	line-height: 28px;
	letter-spacing: -0.01em;
	color: var(--faddom-color-text-muted);
}

.faddom-how-step__media {
	min-width: 0;
	width: 100%;
	max-width: 540px;
	height: auto;
	aspect-ratio: 1 / 1;
	overflow: hidden;
	border-radius: 8px;
	background: var(--faddom-color-aqua-25, #f7fbfb);
}

.faddom-how-step__media img,
.faddom-how-tabs .faddom-row--step_image,
.faddom-how-tabs .faddom-row--image {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 8px;
}

@media (max-width: 1024px) {
	.faddom-problem-cards {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.faddom-how-tabs {
		display: flex;
		flex-direction: column;
		gap: 8px;
		row-gap: 8px;
	}

	.faddom-how-tabs__item {
		display: flex;
		flex-direction: column;
		gap: 20px;
		width: 100%;
	}

	.faddom-how-tabs__tab,
	button.faddom-how-tabs__tab {
		position: relative;
		justify-content: flex-start !important;
		grid-row: auto;
		width: 100%;
		min-width: 0;
		padding-right: 80px;
		text-align: left;
		white-space: normal !important;
	}

	.faddom-how-tabs__tab::after {
		content: "";
		position: absolute;
		right: 20px;
		top: 50%;
		transform: translateY(-50%) rotate(90deg);
		width: 40px;
		height: 40px;
		border-radius: 8px;
		border: 1px solid var(--faddom-color-aqua-900);
		background-color: transparent;
		background-image: url("/wp-content/uploads/2026/07/arrow-sm-right-1.svg");
		background-repeat: no-repeat;
		background-position: center;
		background-size: 18px;
		transition: 0.4s ease;
	}

	.faddom-how-tabs__tab::before {
		content: "";
		position: absolute;
		right: 16px;
		top: 50%;
		transform: translateY(-50%);
		width: 48px;
		height: 48px;
		border: 1px solid rgba(6, 35, 35, 0.2);
		border-radius: 12px;
		pointer-events: none;
		transition: 0.4s ease;
	}

	.faddom-how-tabs__tab.is-active::after {
		transform: translateY(-50%) rotate(-90deg);
		background-color: var(--faddom-color-aqua-900);
		background-image: url("/wp-content/uploads/2026/07/arrow-sm-right-2.svg");
	}

	.faddom-how-tabs__panel {
		grid-column: auto;
		grid-row: auto;
		padding: 4px 16px 16px;
		box-sizing: border-box;
	}

	.faddom-how-step {
		grid-template-columns: 1fr;
	}

	.faddom-how-step__body {
		padding-right: 0;
		padding-bottom: 24px;
	}

	.faddom-how-step__desc {
		max-width: none;
	}

	.faddom-how-step__media {
		height: auto;
		max-height: none;
		aspect-ratio: 1 / 1;
	}

	.faddom-how-tabs .faddom-row--image,
	.faddom-how-tabs .faddom-row--step_image,
	.faddom-how-step__media img {
		height: 100%;
		max-height: none;
		width: 100%;
		object-fit: cover;
	}

	.faddom-problem-cards .faddom-row--problem_image,
	.faddom-problem-cards .faddom-row--problem_image.faddom-row--image,
	.faddom-problem-card__media img {
		height: auto;
		max-height: 171px !important;
		width: 100%;
		object-fit: cover;
	}
}

@media (max-width: 767px) {
	.faddom-how-tabs__label {
		font-size: 14px;
		line-height: 22px;
	}

	.faddom-problem-cards {
		grid-template-columns: 1fr;
	}

	.faddom-problem-cards .faddom-row--problem_title,
	.faddom-problem-cards .problem-title,
	.faddom-problem-cards .problem-title .elementor-shortcode,
	.faddom-problem-card__title {
		font-size: 22px !important;
		line-height: 30px !important;
		letter-spacing: -0.04em !important;
	}

	.faddom-problem-cards .faddom-row--problem_description,
	.faddom-problem-cards .problem-desc,
	.faddom-problem-cards .elementor-element-03c6f52,
	.faddom-problem-cards .elementor-element-03c6f52 .elementor-shortcode,
	.faddom-problem-card__desc {
		font-size: 16px !important;
		line-height: 24px !important;
		letter-spacing: -0.01em !important;
	}

	.faddom-how-step__desc {
		gap: 16px;
	}

	.faddom-how-step__desc h1,
	.faddom-how-step__desc h2,
	.faddom-how-step__desc h3,
	.faddom-how-step__desc h4,
	.faddom-how-step__desc h5,
	.faddom-how-step__desc h6 {
		font-size: 24px;
		line-height: 31px;
		letter-spacing: -0.04em;
	}

	.faddom-how-step__desc,
	.faddom-how-step__desc li {
		font-size: 16px;
		line-height: 24px;
		letter-spacing: -0.01em;
	}

	.faddom-how-step__media {
		height: auto;
		min-height: 0;
		max-height: none;
		aspect-ratio: 1 / 1;
	}

	.faddom-how-tabs .faddom-row--image,
	.faddom-how-tabs .faddom-row--step_image,
	.faddom-how-step__media img {
		height: 100%;
		min-height: 0;
		max-height: none;
		width: 100%;
		object-fit: cover;
	}
}

.faddom-achieve-cards {
	width: 100%;
	box-sizing: border-box;
}

.faddom-achieve-cards__track {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	grid-auto-rows: 1fr;
	align-items: stretch;
	gap: 8px;
}

.faddom-achieve-cards__slide {
	display: flex;
	flex-direction: column;
	min-width: 0;
	height: 100%;
}

.faddom-achieve-cards__slide > * {
	flex: 1 1 auto;
	height: 100%;
	min-height: 100%;
}

.faddom-achieve-cards__dots {
	display: none;
}

.faddom-achieve-card {
	display: flex;
	flex-direction: column;
	box-sizing: border-box;
	height: 100%;
	padding: 32px;
	border: 1px solid var(--faddom-color-border, rgba(6, 35, 35, 0.2));
	border-radius: 8px;
	background: var(--faddom-color-white);
	text-align: start;
}

.faddom-achieve-cards__slide > .elementor,
.faddom-achieve-cards__slide > .elementor > .e-con {
	height: 100%;
}

.faddom-achieve-card__icon img,
.faddom-achieve-cards .faddom-row--icon,
.faddom-achieve-cards .elementor-widget-image img {
	display: block;
	width: 100%;
	max-width: 24px;
	height: auto;
}

.faddom-achieve-cards .elementor-widget-image {
	text-align: start;
}

.faddom-achieve-card__title,
.faddom-achieve-cards .faddom-row--title,
.faddom-achieve-cards .elementor-heading-title,
.faddom-achieve-cards h6 {
	display: block;
	margin: 0;
	font-family: var(--faddom-type-title-small-family);
	font-size: 24px;
	font-weight: 400;
	line-height: 32px;
	letter-spacing: -0.02em;
	color: var(--faddom-color-aqua-800);
	text-align: start;
}

.faddom-achieve-card__desc,
.faddom-achieve-cards .faddom-row--description,
.faddom-achieve-cards .elementor-widget-text-editor {
	display: block;
	margin: 0;
	padding: 0;
	font-family: var(--faddom-type-body-medium-family);
	font-size: 18px;
	font-weight: 400;
	line-height: 28px;
	letter-spacing: -0.01em;
	color: var(--faddom-color-text-muted);
	text-align: start;
}

.faddom-achieve-cards .elementor-widget-text-editor p {
	margin: 0;
	margin-block-end: 0;
	font: inherit;
	letter-spacing: inherit;
	color: inherit;
	text-align: inherit;
}

@media (max-width: 1024px) {
	.faddom-achieve-card__title,
	.faddom-achieve-cards .faddom-row--title,
	.faddom-achieve-cards .elementor-heading-title,
	.faddom-achieve-cards h6 {
		font-size: 20px;
		line-height: 28px;
		letter-spacing: -0.02em;
	}

	.faddom-achieve-card__desc,
	.faddom-achieve-cards .faddom-row--description,
	.faddom-achieve-cards .elementor-widget-text-editor {
		font-size: 16px;
		line-height: 24px;
		letter-spacing: -0.01em;
	}
}

@media (max-width: 767px) {
	.faddom-achieve-cards__viewport {
		overflow-x: auto;
		overflow-y: hidden;
		scroll-snap-type: x mandatory;
		scroll-behavior: smooth;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
	}

	.faddom-achieve-cards__viewport::-webkit-scrollbar {
		display: none;
	}

	.faddom-achieve-cards__track {
		display: flex;
		flex-wrap: nowrap;
		align-items: stretch;
		gap: 10px;
		width: auto;
		max-width: none;
		grid-template-columns: none;
		grid-auto-rows: auto;
		grid-auto-flow: row;
		grid-auto-columns: auto;
	}

	.faddom-achieve-cards__slide {
		display: flex;
		flex-direction: column;
		flex: 0 0 100%;
		width: 100%;
		max-width: 100%;
		height: auto;
		min-height: 0;
		scroll-snap-align: start;
		scroll-snap-stop: always;
	}

	.faddom-achieve-cards__slide > *,
	.faddom-achieve-cards__slide > .elementor,
	.faddom-achieve-cards__slide > .elementor > .e-con,
	.faddom-achieve-cards__slide .faddom-achieve-card {
		flex: 1 1 auto;
		width: 100%;
		height: auto;
		min-height: 100%;
		box-sizing: border-box;
	}

	.faddom-achieve-cards__dots {
		display: flex;
		align-items: center;
		justify-content: flex-start;
		gap: 8px;
		margin-top: 24px;
	}

	.faddom-acf-repeater.faddom-achieve-cards button.faddom-achieve-cards__dot,
	.faddom-acf-repeater .faddom-achieve-cards__dot {
		display: block !important;
		box-sizing: border-box !important;
		width: 12px !important;
		min-width: 12px !important;
		max-width: 12px !important;
		height: 12px !important;
		min-height: 12px !important;
		max-height: 12px !important;
		padding: 0 !important;
		margin: 0 !important;
		border: none !important;
		border-radius: 4px !important;
		background: var(--faddom-color-aqua-75, #cbeeee) !important;
		background-color: var(--faddom-color-aqua-75, #cbeeee) !important;
		background-image: none !important;
		box-shadow: none !important;
		overflow: hidden !important;
		font-size: 0 !important;
		line-height: 0 !important;
		color: transparent !important;
		cursor: pointer;
		appearance: none !important;
		-webkit-appearance: none !important;
		transition: width 0.3s ease, max-width 0.3s ease, background-color 0.3s ease;
	}

	.faddom-acf-repeater.faddom-achieve-cards button.faddom-achieve-cards__dot.is-active,
	.faddom-acf-repeater .faddom-achieve-cards__dot.is-active {
		width: 24px !important;
		min-width: 24px !important;
		max-width: 24px !important;
		background: var(--faddom-color-aqua-300, #64c1c1) !important;
		background-color: var(--faddom-color-aqua-300, #64c1c1) !important;
		background-image: none !important;
	}

	.faddom-achieve-card {
		padding: 20px;
	}

	.faddom-achieve-card__title,
	.faddom-achieve-cards .faddom-row--title,
	.faddom-achieve-cards .elementor-heading-title,
	.faddom-achieve-cards h6 {
		font-size: 18px;
		line-height: 26px;
		letter-spacing: -0.04em;
	}

	.faddom-achieve-card__desc,
	.faddom-achieve-cards .faddom-row--description,
	.faddom-achieve-cards .elementor-widget-text-editor {
		font-size: 16px;
		line-height: 24px;
		letter-spacing: -0.01em;
	}
}

@keyframes faddom-testimonial-fade {
	from {
		opacity: 0;
	}
	to {
		opacity: 1;
	}
}

.faddom-testimonials {
	box-sizing: border-box;
	width: 100% !important;
	max-width: none !important;
	min-width: 0;
	margin: 0;
}

.elementor-widget-shortcode:has(.faddom-acf-repeater.faddom-testimonials),
.elementor-shortcode:has(.faddom-acf-repeater.faddom-testimonials) {
	width: 100% !important;
	max-width: 100% !important;
	align-self: stretch !important;
	flex-grow: 1 !important;
	--container-widget-width: 100% !important;
	--container-widget-flex-grow: 1 !important;
}

.faddom-acf-repeater .faddom-testimonials__viewport,
.faddom-acf-repeater .faddom-testimonial {
	width: 100% !important;
	max-width: none !important;
	box-sizing: border-box;
}

.faddom-testimonials-hide,
.elementor-widget-shortcode:has(.faddom-testimonials-hide),
.e-con:has(> .e-con-inner > .elementor-element .faddom-testimonials-hide) {
	display: none !important;
}

.faddom-testimonials__nav {
	display: flex;
	flex-wrap: wrap;
	width: 100%;
	margin: 0 0 4px;
	padding: 0;
	overflow: hidden;
	border: 1px solid var(--faddom-color-border, rgba(6, 35, 35, 0.2));
	border-radius: 12px;
}

.faddom-acf-repeater.faddom-testimonials.is-single .faddom-testimonials__nav {
	display: none !important;
}

.faddom-testimonials button.faddom-testimonials__tab,
.faddom-testimonials__tab {
	display: flex;
	flex: 1 1 0;
	align-items: center;
	justify-content: center;
	width: 0;
	min-width: 0;
	min-height: 60px;
	margin: 0;
	padding: 12px 16px;
	border: none;
	border-right: 1px solid var(--faddom-color-border, rgba(6, 35, 35, 0.2));
	border-radius: 0;
	background: transparent !important;
	background-color: transparent !important;
	background-image: none !important;
	box-shadow: none !important;
	color: inherit;
	cursor: pointer;
	appearance: none;
	-webkit-appearance: none;
	transition: background-color 0.3s ease;
}

.faddom-testimonials__tab:last-child {
	border-right: 0;
}

.faddom-testimonials__tab:first-child.is-active,
.faddom-testimonials__tab:first-child:hover {
	border-top-left-radius: 12px;
	border-bottom-left-radius: 12px;
}

.faddom-testimonials__tab:last-child.is-active,
.faddom-testimonials__tab:last-child:hover {
	border-top-right-radius: 12px;
	border-bottom-right-radius: 12px;
}

.faddom-testimonials button.faddom-testimonials__tab:hover,
.faddom-testimonials button.faddom-testimonials__tab.is-active,
.faddom-testimonials__tab:hover,
.faddom-testimonials__tab.is-active {
	background: var(--faddom-color-aqua-100, #ace6e6) !important;
	background-color: var(--faddom-color-aqua-100, #ace6e6) !important;
	background-image: none !important;
	box-shadow: none !important;
}

.faddom-testimonials__tab:focus-visible {
	outline: 2px solid var(--faddom-color-aqua-600);
	outline-offset: -2px;
}

.faddom-testimonials__tab-logo {
	display: block;
	width: auto;
	max-width: 118px;
	height: auto;
	max-height: 48px;
	object-fit: contain;
}

.faddom-testimonials__viewport {
	width: 100%;
}

.faddom-acf-repeater .faddom-testimonials__track {
	display: grid;
	width: 100%;
}

.faddom-acf-repeater .faddom-testimonials__slide {
	grid-column: 1;
	grid-row: 1;
	min-width: 0;
}

.faddom-acf-repeater .faddom-testimonials__slide[hidden] {
	display: block !important;
	visibility: hidden;
	pointer-events: none;
	z-index: 0;
}

.faddom-acf-repeater .faddom-testimonials__slide.is-active {
	visibility: visible;
	z-index: 1;
	animation: faddom-testimonial-fade 0.6s ease-in;
}

.faddom-testimonial {
	display: grid;
	grid-template-columns: 40% 60%;
	grid-template-rows: auto 1fr auto;
	grid-template-areas:
		"photo icon"
		"photo quote"
		"photo person";
	box-sizing: border-box;
	width: 100%;
	height: 100%;
	min-height: 482px;
	overflow: hidden;
	border-radius: 8px;
	background: var(--faddom-color-white);
}

.faddom-testimonial__photo {
	grid-area: photo;
	min-height: 100%;
	background-color: var(--faddom-color-aqua-50);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	border-radius: 8px 0 0 8px;
}

.faddom-testimonial__icon {
	grid-area: icon;
	display: flex;
	align-items: flex-start;
	justify-content: flex-start;
	padding: 40px 48px 0;
	line-height: 0;
}

.faddom-testimonial__icon svg {
	display: block;
	width: auto;
	height: 48px;
}

.faddom-testimonial__quote {
	grid-area: quote;
	margin: 0;
	padding: 56px 48px 38px;
	font-family: var(--faddom-type-title-small-family);
	font-size: var(--faddom-type-title-small-size);
	font-weight: var(--faddom-type-title-small-weight);
	line-height: var(--faddom-type-title-small-line);
	letter-spacing: var(--faddom-type-title-small-tracking);
	color: var(--faddom-color-aqua-800);
}

.faddom-testimonial__person {
	grid-area: person;
	padding: 0 48px 32px;
}

.faddom-testimonial__name {
	margin: 0;
	font-family: var(--faddom-type-body-medium-emphasis-family);
	font-size: var(--faddom-type-body-medium-emphasis-size);
	font-weight: var(--faddom-type-body-medium-emphasis-weight);
	line-height: var(--faddom-type-body-medium-emphasis-line);
	letter-spacing: var(--faddom-type-body-medium-emphasis-tracking);
	color: #0c0c0b;
}

.faddom-testimonial__role {
	margin: 0;
	font-family: var(--faddom-type-body-small-family);
	font-size: var(--faddom-type-body-small-size);
	font-weight: var(--faddom-type-body-small-weight);
	line-height: var(--faddom-type-body-small-line);
	letter-spacing: var(--faddom-type-body-small-tracking);
	color: var(--faddom-color-granite-400, #5c7a7a);
}

.faddom-acf-repeater .faddom-testimonial__logo {
	display: none;
	grid-area: logo;
	width: auto;
	max-width: 100%;
	height: auto;
	max-height: 30px;
	object-fit: contain;
	object-position: left center;
}

.faddom-testimonials__dots {
	display: none;
}

@media (max-width: 767px) {
	.faddom-testimonials__nav {
		display: none;
	}

	.faddom-testimonials__viewport {
		overflow-x: auto;
		overflow-y: hidden;
		scroll-snap-type: x mandatory;
		scroll-behavior: smooth;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
	}

	.faddom-testimonials__viewport::-webkit-scrollbar {
		display: none;
	}

	.faddom-acf-repeater .faddom-testimonials__track {
		display: flex;
		align-items: stretch;
		gap: 10px;
	}

	.faddom-acf-repeater .faddom-testimonials__slide {
		display: flex;
		flex: 0 0 100%;
		grid-column: auto;
		grid-row: auto;
		scroll-snap-align: start;
		scroll-snap-stop: always;
		visibility: visible;
	}

	.faddom-acf-repeater .faddom-testimonials__slide[hidden] {
		display: flex !important;
		visibility: visible;
		pointer-events: auto;
	}

	.faddom-acf-repeater .faddom-testimonials__slide.is-active {
		animation: none;
	}

	.faddom-acf-repeater .faddom-testimonial {
		grid-template-columns: 45% 1fr;
		grid-template-rows: auto auto 1fr auto;
		grid-template-areas:
			"photo person"
			"icon icon"
			"quote quote"
			"logo logo";
		flex: 1 1 auto;
		width: 100%;
		height: auto;
		min-height: 100%;
		column-gap: 16px;
	}

	.faddom-testimonial__photo {
		min-height: 122px;
		aspect-ratio: 130 / 122;
		border-radius: 8px 0 0 0;
		margin: 20px 0 16px 20px;
	}

	.faddom-testimonial__person {
		display: flex;
		flex-direction: column;
		justify-content: center;
		padding: 20px 20px 16px 0;
	}

	.faddom-testimonial__icon {
		padding: 0 20px;
		max-height: 20px;
	}

	.faddom-testimonial__icon svg {
		height: 20px;
	}

	.faddom-testimonial__quote {
		padding: 16px 20px;
	}

	.faddom-acf-repeater .faddom-testimonial__logo {
		display: block;
		margin: 0 20px 20px;
	}

	.faddom-testimonials__dots {
		display: flex;
		align-items: center;
		justify-content: flex-start;
		gap: 8px;
		margin-top: 24px;
	}

	.faddom-acf-repeater.faddom-testimonials button.faddom-testimonials__dot,
	.faddom-acf-repeater .faddom-testimonials__dot {
		display: block !important;
		box-sizing: border-box !important;
		width: 12px !important;
		min-width: 12px !important;
		max-width: 12px !important;
		height: 12px !important;
		min-height: 12px !important;
		max-height: 12px !important;
		padding: 0 !important;
		margin: 0 !important;
		border: none !important;
		border-radius: 4px !important;
		background: var(--faddom-color-aqua-75, #cbeeee) !important;
		background-color: var(--faddom-color-aqua-75, #cbeeee) !important;
		background-image: none !important;
		box-shadow: none !important;
		overflow: hidden !important;
		font-size: 0 !important;
		line-height: 0 !important;
		color: transparent !important;
		cursor: pointer;
		appearance: none !important;
		-webkit-appearance: none !important;
		transition: width 0.3s ease, max-width 0.3s ease, background-color 0.3s ease;
	}

	.faddom-acf-repeater.faddom-testimonials button.faddom-testimonials__dot.is-active,
	.faddom-acf-repeater .faddom-testimonials__dot.is-active {
		width: 24px !important;
		min-width: 24px !important;
		max-width: 24px !important;
		background: var(--faddom-color-aqua-300, #64c1c1) !important;
		background-color: var(--faddom-color-aqua-300, #64c1c1) !important;
	}
}

/* ------------------------------------------------------------------ */
/* Featured integrations (Use Case logo strip)                        */
/* ------------------------------------------------------------------ */

.faddom-featured-integrations {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	padding-top: 98px;
}

.faddom-featured-integrations__title {
	margin: 0 0 40px;
	font-family: var(--faddom-type-caption-s-family, var(--faddom-font-body, sans-serif));
	font-size: var(--faddom-type-caption-s-size, 12px);
	font-weight: var(--faddom-type-caption-s-weight, 500);
	line-height: var(--faddom-type-caption-s-line, 16px);
	letter-spacing: var(--faddom-type-caption-s-tracking, 0.05em);
	text-transform: var(--faddom-type-caption-s-transform, uppercase);
	color: var(--faddom-color-aqua-800, #032d2d);
}

.faddom-featured-integrations__list {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	list-style: none;
	margin: 0;
	padding: 0;
}

.faddom-featured-integrations__item {
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0;
	padding: 0;
}

.faddom-featured-integrations__sep {
	display: block;
	width: 1px;
	height: 35px;
	min-height: 35px;
	margin: 0 56px;
	padding: 0;
	background: var(--faddom-color-border, rgba(6, 35, 35, 0.2));
	flex-shrink: 0;
	align-self: center;
}

.faddom-featured-integrations__link {
	display: block;
	line-height: 0;
}

.elementor .faddom-featured-integrations img,
.elementor-widget-shortcode .faddom-featured-integrations img,
.faddom-featured-integrations img,
.faddom-featured-integrations__logo {
	display: block !important;
	width: auto !important;
	max-width: 210px !important;
	height: auto !important;
	object-fit: contain;
}

@media (max-width: 767px) {
	.faddom-featured-integrations__title {
		margin-bottom: 20px;
	}

	.faddom-featured-integrations__list {
		flex-direction: column;
		flex-wrap: nowrap;
		align-items: center;
		gap: 24px;
	}

	.faddom-featured-integrations__item {
		padding: 0;
	}

	.faddom-featured-integrations__sep {
		display: none;
	}

	.elementor .faddom-featured-integrations img,
	.elementor-widget-shortcode .faddom-featured-integrations img,
	.faddom-featured-integrations img,
	.faddom-featured-integrations__logo {
		width: 150px !important;
		max-width: 150px !important;
		height: auto !important;
	}
}
