/*
|--------------------------------------------------------------------------
|  DESIGN TOKENS
|--------------------------------------------------------------------------
*/
:root {
	--size-1:  0.0625rem;
	--size-2:  0.125rem;
	--size-3:  0.1875rem;
	--size-4:  0.25rem;
	--size-5:  0.3125rem;
	--size-6:  0.375rem;
	--size-7:  0.4375rem;
	--size-8:  0.5rem;
	--size-9:  0.5625rem;
	--size-10: 0.625rem;

	--size-11: 0.6875rem;
	--size-12: 0.75rem;
	--size-13: 0.8125rem;
	--size-14: 0.875rem;
	--size-15: 0.9375rem;
	--size-16: 1rem;
	--size-17: 1.0625rem;
	--size-18: 1.125rem;
	--size-19: 1.1875rem;
	--size-20: 1.25rem;

	--size-21: 1.3125rem;
	--size-22: 1.375rem;
	--size-23: 1.4375rem;
	--size-24: 1.5rem;
	--size-25: 1.5625rem;
	--size-26: 1.625rem;
	--size-27: 1.6875rem;
	--size-28: 1.75rem;
	--size-29: 1.8125rem;
	--size-30: 1.875rem;

	--size-31: 1.9375rem;
	--size-32: 2rem;
	--size-33: 2.0625rem;
	--size-34: 2.125rem;
	--size-35: 2.1875rem;
	--size-36: 2.25rem;
	--size-37: 2.3125rem;
	--size-38: 2.375rem;
	--size-39: 2.4375rem;
	--size-40: 2.5rem;

	--size-41: 2.5625rem;
	--size-42: 2.625rem;
	--size-43: 2.6875rem;
	--size-44: 2.75rem;
	--size-45: 2.8125rem;
	--size-46: 2.875rem;
	--size-47: 2.9375rem;
	--size-48: 3rem;
	--size-49: 3.0625rem;
	--size-50: 3.125rem;

	--size-51: 3.1875rem;
	--size-52: 3.25rem;
	--size-53: 3.3125rem;
	--size-54: 3.375rem;
	--size-55: 3.4375rem;
	--size-56: 3.0625rem;
	--size-57: 3.5625rem;
	--size-58: 3.625rem;
	--size-59: 3.6875rem;
	--size-60: 3.75rem;

	--size-80: 5rem;

	--c-white: #ffffff;
	--c-black: #000000;

	--c-teal-dark-900: #113644;
	--c-teal-dark-800: #003A49;
	--c-teal-dark-100: #315F6B;
	--c-teal-dark-50: #F4F9F9;
	--c-aqua-light: #8ED9E6;
	--c-yellow-acid: #E1E61E;
	--c-grey-100: #F2F4F7;
	--c-grey-200: #E2DBDB;
	--c-grey-400: #93AAB0;
	--c-grey-600: #667085;

	--ff-body: 'Museo Sans', system-ui, -apple-system, sans-serif;
	--ff-heading: 'Museo Sans', system-ui, -apple-system, sans-serif;

	--fs-xs: 0.875rem;
	--fs-sm: 0.9rem;
	--fs-base: 1rem;

	--space-xs: 0.45rem;
	--space-sm: 0.75rem;
	--space-md: 1.25rem;
	--space-lg: 2rem;
	--space-xl: 2.5rem;

	--radius-pill: 999px;
	--radius-sm: 6px;

	--container-max: 1280px;
}

:root {
	--space-10: 10px;
	--space-20: 20px;
	--space-30: 30px;
	--space-40: 40px;
	--space-50: 50px;
	--space-60: 60px;
	--space-70: 70px;
	--space-80: 80px;
	--space-90: 90px;
	--space-100: 100px;
}

/*
|--------------------------------------------------------------------------
|  GENERAL
|--------------------------------------------------------------------------
*/
	body {
		font-family: var(--ff-body) !important;
		font-size: var(--size-16);
	}

	h1, h2, h3, h4, h5, h6 {
		font-family: var(--ff-heading) !important;
	}

	/* No top margin by default */
	.entry-content :is(h1, h2, h3, h4, h5, h6) {
		margin-top: 0;
	}

	/* Add margin ONLY when a heading follows content */
	.entry-content :is(p, ul, ol, hr, figure, blockquote)
	+ :is(h1, h2, h3, h4, h5, h6) {
		margin-top: 2.5rem;
	}

	/* Dark Teal Background */
	.bg-dark-teal {
		background-color: var(--c-teal-dark-900);
		color: var(--c-white);
	}

	/* Yellow Acid Background */
	.bg-accent {
		background-color: var(--c-yellow-acid) !important;
		color: var(--c-teal-dark-900) !important;
	}

/*
|--------------------------------------------------------------------------
|  SINGLE BLOG POST
|--------------------------------------------------------------------------
*/
	.single-post {

		h2, h3, h4 {
			color: var(--c-teal-dark-900)
		}

		/* Header Section */
		header.entry-header {
			display: flex;
			flex-direction: column;
			justify-content: center;
			padding: 8.75rem 0 10rem 0;
		}

		.author {
			font-weight: 600;
		}

		.category-pill {
			border: var(--size-1) solid var(--c-aqua-light);
			font-size: var(--size-14);
			padding: var(--size-6) var(--size-12);
			align-self: flex-start;
			background: transparent;
			color: var(--c-aqua-light);
			border-radius: 10em;
			font-weight: 400;
			margin-bottom: var(--size-12);
			letter-spacing: 0.05em;
		}

		.entry-meta > span {
			display: block;
		}

		.entry-title {
			margin: var(--size-32) 0 var(--size-32) !important;
		}

		.entry-meta {
			font-size: var(--size-16);

			.date {
				font-size: var(--size-14);
			}
		}

		/* Featured Image */
		.featured-image {
			margin-bottom: 4rem;

			img {
				margin-top: -105px;
				width: 100%;
				height: 600px;
				border-radius: var(--size-12);
				box-shadow: 0 8px 40px rgba(0, 0, 0, 0.12);
				object-fit: cover;
			}
		}

		/* Share Section */
		.share-section {

			.author {
				color: var(--c-black);
			}

			.row {
				align-items: center;
				display: flex;
			}

			.share-container {
				padding: var(--size-35) 0;
				position: relative;
				margin-top: var(--size-48);
				border-top: 1px solid #62858E;
				border-bottom: 1px solid #62858E;
			}

			.share-col {
				align-items: center;
				display: flex;
				gap: var(--size-10);
				justify-content: flex-end;

				.social-link {
					align-items: center;
					background-color: var(--c-grey-100);
					border-radius: 50%;
					display: flex;
					height: var(--size-35);
					justify-content: center;
					padding: var(--size-6);
					width: var(--size-35);
				}
			}

		}

		/* Table Of Contents */
		.toc-wrapper {
			border: var(--size-1) solid var(--c-grey-200);
			border-radius: var(--size-12);
			overflow: hidden;

			.toc-button {
				background: transparent;
				border: none;
				color: var(--c-teal-dark-900);
				cursor: pointer;
				font-weight: 900;
				padding: var(--size-32) var(--size-24);
				text-align: left;
				transition: background-color 0.4s ease;
				width: 100%;
				display: flex;
				justify-content: space-between;
				align-items: center;

				&:hover {
					background-color: rgba(0, 58, 73, 0.05);
				}

				.toc-symbol {
					width: 1.25rem;
					height: 1.25rem;
					color: var(--c-grey-600);
					transition: transform 0.35s ease-in-out;
				}

				&.active .toc-symbol {
					transform: rotate(180deg);
				}
			}

			.toc-panel {
				max-height: 0;
				overflow: hidden;
				transition: max-height 0.35s ease-out, padding 0.35s ease-out;
				padding: 0 var(--size-24);
				border-top: var(--size-1) solid var(--c-grey-200);

				.list-group-item {
					border: none;
					padding-top: 0;
					padding-bottom: var(--size-8);
					padding-left: var(--size-40);
					transition: all 0.4s ease-in-out;
					background-color: transparent;
					color: inherit;
					position: relative;

					&:hover {
						color: var(--c-teal-dark-900);
					}

					&:before {
						position: absolute;
						top: var(--size-10);
						left: 0;
						content: '';
						width: var(--size-10);
						height: var(--size-10);
						display: block;
						background-color: var(--wp--preset--color--cyan-bluish-gray);
						border-radius: 50%;
						transition: background-color 0.4s ease;
					}
				}

				.list-group-item.active-toc {
					font-weight: 600;
					color: var(--c-teal-dark-900);
					padding-left: var(--size-30);

					&:before {
						background-color: var(--c-aqua-light);
					}
				}
			}
		}

		.toc-fixed {
			position: sticky;
			top: 3.0625rem;
		}

	}


/*
|--------------------------------------------------------------------------
|  SINGLE PRODUCT & SOLUTION
|--------------------------------------------------------------------------
*/

	/* ----- Shared CTA Button ----- */
	.btn-yellow-acid {
		background-color: var(--c-yellow-acid);
		color: var(--c-teal-dark-900);
		font-weight: 600;
		padding: var(--size-14) var(--size-32);
		border-radius: var(--radius-sm);
		text-decoration: none;
		display: inline-block;
		transition: background-color 0.3s ease;

		&:hover {
			background-color: #c8cc1a;
			color: var(--c-teal-dark-900);
		}
	}

	/* ----- Hero Section ----- */
	.page-hero {
		padding: 8.75rem 0 var(--space-80) 0;

		.page-hero__breadcrumbs {
			margin-bottom: var(--space-60);
			font-size: var(--fs-sm);
			opacity: 0.7;

			a {
				color: var(--c-white);
				text-decoration: none;

				&:hover { text-decoration: underline; }
			}

			.separator { margin: 0 var(--space-xs); }
			.current { opacity: 0.7; }
		}

		.page-hero__title {
			font-size: clamp(2.2rem, 4vw, 3.0625rem);
			font-weight: 600;
			margin-bottom: var(--size-20);
		}

		.page-hero__content {
			font-size: var(--size-16);
			opacity: 0.85;
			margin-bottom: var(--size-30);
			line-height: 1.7;

			p:last-child { margin-bottom: 0; }
		}

		/* COLUMN HEIGHT FIX */
		.page-hero__media-col {
			display: flex;
			align-items: stretch;
		}

		.page-hero__media {
			position: relative;
			border: var(--size-3) solid var(--c-yellow-acid);
			border-radius: var(--size-3);
			overflow: hidden;
			width: 100%;
			height: 100%;
			min-height: 440px; /* prevents jump before video loads */

			img {
				width: 100%;
				height: 100%;
				object-fit: cover;
				display: block;
			}
		}

		.page-hero__media--image {
			border: none;
			border-radius: 0;
		}

		/* NEW INNER WRAPPER (stabilizes layout) */
		.page-hero__media-inner {
			position: relative;
			width: 100%;
			height: 100%;
		}

		.page-hero__media-thumbnail {
			position: absolute;
			inset: 0;
			cursor: pointer;

			img {
				width: 100%;
				height: 100%;
				object-fit: cover;
			}

			&::after {
				content: '';
				position: absolute;
				inset: 0;
				background: rgba(0, 0, 0, 0.2);
				transition: background 0.3s ease;
			}

			&:hover::after {
				background: rgba(0, 0, 0, 0.35);
			}

			&.page-hero__media-thumbnail--no-thumb {
				background: rgba(0, 0, 0, 0.3);
				display: flex;
				align-items: center;
				justify-content: center;
			}
		}

		.page-hero__media-play-btn {
			position: absolute;
			top: 50%;
			left: 50%;
			transform: translate(-50%, -50%);
			z-index: 2;
			border: none;
			background: none;
			cursor: pointer;
			transition: transform 0.3s ease;

			&:hover {
				transform: translate(-50%, -50%) scale(1.1);
			}
		}

		/* VIDEO PLAYER LAYER */
		.page-hero__media-player {
			position: absolute;
			inset: 0;
			width: 100%;
			height: 100%;

			iframe,
			video {
				width: 100%;
				height: 100%;
				object-fit: cover;
				border: none;
				display: block;
			}
		}

		.page-hero__media-embed {
			aspect-ratio: 361 / 220;

			iframe, video {
				width: 100%;
				height: 100%;
				border: none;
			}
		}
	}

	/* ----- Value Stack (Benefits) ----- */
	.value-stack {
		padding: var(--space-80) 0;

		.value-stack__card {
			padding: var(--size-30);
			border-radius: var(--size-12);
			background: var(--c-white);
			height: 100%;
			border: 1px solid var(--c-grey-100);
			transition: box-shadow 0.3s ease;
			text-align: center;

			&:hover {
				box-shadow: 0 8px 30px rgba(0, 0, 0, 0.08);
			}
		}

		.value-stack__card-icon {
			width: 56px;
			height: 56px;
			margin: 0 auto var(--size-20);

			img {
				width: 100%;
				height: 100%;
				object-fit: contain;
			}
		}

		.value-stack__card-title {
			font-size: var(--size-20);
			font-weight: 600;
			color: var(--c-teal-dark-900);
			margin-bottom: var(--space-sm);
		}

		.value-stack__card-desc {
			font-size: var(--fs-sm);
			color: var(--c-grey-600);
			line-height: 1.6;
			margin-bottom: 0;
		}
	}

	/* ----- Value Section (Why Choose Us) ----- */
	.value-section {
		padding: var(--space-80) 0;
		position: relative;

		.value-section__subtitle {
			display: block;
			font-size: var(--fs-xs);
			font-weight: 600;
			text-transform: uppercase;
			letter-spacing: 2px;
			color: var(--c-teal-dark-900);
			opacity: 0.6;
			margin-bottom: var(--space-sm);
		}

		.value-section__title {
			font-size: clamp(2.2rem, 3vw, 2.5rem);
			font-weight: 600;
			color: var(--c-teal-dark-900);
		}

		.value-section__text {
			font-size: var(--size-16);
			color: var(--c-grey-600);
			line-height: 1.7;
			margin-bottom: var(--size-30);
		}
	}

	.value-section:before {
		position: absolute;
		content: '';
		left: 0;
		right: 0;
		border-bottom: 1px solid #C4D0D3;
		bottom: 0;
		width: 1280px;
		max-width: 100%;
		margin: auto;
	}

	/* ----- Logo Marquee ----- */
	.logo-marquee--two-rows {
		overflow: hidden;
		padding-top: 0;
		padding-bottom: var(--space-80);
	}

	.logo-marquee__row {
		display: flex;
		gap: 4rem;
		width: max-content;
		white-space: nowrap;
		animation: marquee-seamless 160s linear infinite;
		--marquee-gap: 4rem;
	}

	.logo-marquee__group {
		display: flex;
		gap: 4rem;
		flex: 0 0 auto;
	}

	/* Uniform slot width — guarantees top/bottom rows have identical total width so they animate at the same pixel speed */
	.logo-marquee__row .logo-marquee__item {
		flex: 0 0 11.25rem;
		width: 11.25rem;
		display: flex;
		align-items: center;
		justify-content: center;
		padding: 0;
	}

	.logo-marquee__row .logo-marquee__item img {
		max-width: 100%;
		max-height: var(--space-60);
		width: auto;
		height: auto;
		display: block;
		object-fit: contain;
	}

	.logo-marquee__row--bottom {
		margin-top: var(--space-70);
		animation-delay: -30s; /* stagger via time offset — keeps rows edge-to-edge, same direction, different visible content */
	}

	.pod-marquee__heading {
		text-align: center;
		font-size: var(--size-20);
		font-weight: 600;
		margin-bottom: var(--size-30);
	}

	.logo-marquee {
		padding: var(--space-60) 0;
		overflow: hidden;

		.logo-marquee__track {
			display: flex;
			width: max-content;
			animation: marquee 30s linear infinite;

			&:hover { animation-play-state: paused; }
		}

		.logo-marquee__item {
			flex-shrink: 0;
			padding: 0 var(--size-40);
			display: flex;
			align-items: center;
			justify-content: center;

			img {
				height: var(--size-40);
				width: auto;
				object-fit: contain;
				filter: grayscale(100%);
				opacity: 0.6;
				transition: all 0.3s ease;

				&:hover {
					filter: grayscale(0%);
					opacity: 1;
				}
			}
		}
	}

	@keyframes marquee {
		from { transform: translateX(0); }
		to   { transform: translateX(-50%); }
	}

	/* ----- Tab Section ----- */
	.tab-section {
		padding-top: var(--space-80);
		padding-bottom: 0;

		.tab-section__header {
			margin-bottom: var(--size-40);
		}

		.tab-section__title {
			font-size: clamp(2.2rem, 3vw, 2.5rem);
			font-weight: 600;
			margin-bottom: var(--size-20);
		}

		.tab-section__desc {
			font-size: var(--size-16);
		}

		.tab-section__nav {
			display: flex;
			flex-direction: column;
			gap: var(--size-4);
			justify-content: flex-start;
		}

		.tab-section__nav-item {
			background: none;
			border: none;
			color: rgba(255, 255, 255, 0.6);
			text-align: left;
			padding: var(--size-16) var(--size-24);
			font-size: var(--size-16);
			font-weight: 600;
			cursor: pointer;
			transition: all 0.3s ease;
			position: relative;

			&:hover {
				color: var(--c-white);
				border-left-color: rgba(255, 255, 255, 0.4);
			}

			&.tab-section__nav-item--active {
				background: rgba(225, 230, 30, 0.10);
				color: var(--c-white);
				font-weight: 600;
			}
		}

		.tab-section__panel {
			background-color: var(--c-teal-dark-800);
			border-radius: .75rem .75rem 0 0;
			border-top: var(--size-1) solid var(--c-teal-dark-100);
			border-right: var(--size-1) solid var(--c-teal-dark-100);
			border-left: var(--size-1) solid var(--c-teal-dark-100);
			display: none;
			padding-left: var(--size-40);
			padding-right: var(--size-40);
			padding-top: var(--size-40);
			padding-bottom: var(--size-20);
			height: 100%;

			&.tab-section__panel img {
				margin-top: var(--size-20);
				margin-bottom: var(--size-35);
				width: 70%;
			}

			&.tab-section__panel--active {
				display: block;
				animation: tabFadeIn 0.4s ease;
			}
		}

		.tab-section__panel-heading {
			font-size: clamp(1.25rem, 2vw, 1.75rem);
			font-weight: 600;
			color: var(--c-white);
			margin: var(--size-20) 0 var(--size-10);
		}

		.tab-section__panel-content {
			font-size: var(--size-16);
			line-height: 1.7;
			margin-bottom: var(--size-30);
			display: flex;
			flex-direction: column;
			justify-content: center;
		}

		.tab-section__panel-asset {
			img {
				width: 100%;
				border-radius: var(--size-12);
			}
		}
	}

	@keyframes tabFadeIn {
		from { opacity: 0; }
		to   { opacity: 1; }
	}

	/* ----- Key Points (Alternating Layout) ----- */
	.key-points {
		padding: var(--space-80) 0;

		.key-points__block {
			margin-bottom: var(--space-80);

			.image-column {
				border-radius: .75rem;
				padding: 0;
				overflow: hidden;

				img {
					width: 100%;
					height: 100%;
					object-fit: cover;
					display: block;
					border-radius: .75rem;
				}
			}

			&:last-child { margin-bottom: 0; }
		}

		.key-points__asset img {
			width: 100%;
			border-radius: var(--size-12);
		}

		.key-points__content { padding: var(--size-30) 0; }

		.key-points__title {
			font-size: clamp(1.5rem, 2.5vw, 2rem);
			font-weight:600;
			color: var(--c-teal-dark-900);
			margin-bottom: var(--size-20);
		}

		.key-points__body {
			font-size: var(--size-16);
			color: var(--c-grey-600);
			line-height: 1.7;
			margin-bottom: var(--size-20);
		}

		.key-points__header {
			max-width: 760px;
			margin-bottom: var(--size-40, 2.5rem);
		}
		.key-points__heading {
			color: var(--c-teal-dark-900);
			font-size: var(--size-40, 2.5rem);
			font-weight: 700;
			line-height: 1.2;
		}
	}

	/* ----- Testimonials Section ----- */
	.testimonials-section {
		padding-top: var(--space-80);
		padding-bottom: var(--space-60);

		.testimonials-section__heading {
			font-size: clamp(2.2rem, 3vw, 2.5rem);
			font-weight: 600;
			margin-bottom: var(--size-20);
		}

		.testimonials-section__card {
			border-radius: var(--size-12);
			height: 100%;
		}

		.testimonials-section__stars {
			margin-bottom: var(--size-20);
			.star {
				color: var(--c-white);
				font-size: var(--size-20);
			}
		}

		.testimonials-swiper .swiper-wrapper {
			padding-bottom: var(--space-60);
		}

		.testimonials-section__quote {
			font-size: var(--size-16);
			line-height: 1.5;
			opacity: 0.9;
			flex: 1;
			display: -webkit-box;
			-webkit-line-clamp: 6;
			-webkit-box-orient: vertical;
			overflow: hidden;

			p:last-child { margin-bottom: 0; }
		}

		.testimonials-section__author {
			font-weight: 600;
			font-size: var(--size-16);
		}

		.testimonials-section__role {
			font-size: var(--fs-sm);
		}

		.testimonials-section__client-logos {
			display: flex;
			align-items: center;
			justify-content: center;
			gap: var(--space-40);
			margin-top: var(--space-50);
			padding-top: var(--space-40);
			border-top: 1px solid rgba(255, 255, 255, 0.1);
			flex-wrap: wrap;

			img {
				height: var(--size-32);
				width: auto;
				filter: brightness(0) invert(1);
				opacity: 0.5;
			}
		}

	}

.testimonials-carousel {
    margin-top: var(--space-50);
}

.testimonial-slide {
    padding: 0 var(--size-20);
}

.testimonials-section__author-block div {
    position: relative;
}

.testimonials-section__author-block div:before {
    content: "";
    position: absolute;
    top: 0;
    right: -8px;
    border-right: var(--size-1) solid var(--c-teal-dark-900);
    height: 100%;
}

.testimonials-section__avatar{
    width:var(--size-48);
    height:var(--size-48);
    border-radius:50%;
    object-fit:cover;
}

/* ----- Case Study CTA ----- */
.case-study-cta {
	padding: var(--space-80) 0;
	background: var(--c-grey-100);

	.case-study-cta__heading {
		font-size: clamp(2.2rem, 3vw, 2.5rem);
		font-weight: 600;
		color: var(--c-teal-dark-900);
		margin-bottom: var(--space-40);
	}

	.case-study-cta__card {
		border-radius: var(--size-12);
		overflow: hidden;
		box-shadow: 0 var(--size-4) var(--size-20) rgba(0, 0, 0, 0.06);
		transition: box-shadow 0.3s ease;
		height: 100%;
		display: flex;

		&:hover {
			box-shadow: 0 8px 30px rgba(0, 0, 0, 0.12);
		}
	}

	.case-study-cta__image img {
		width: 100%;
		height: 200px;
		object-fit: cover;
	}

	.case-study-cta__body {
		padding: var(--size-30);
		flex: 1;
		display: flex;
		flex-direction: column;
	}

	.case-study-cta__title {
		font-size: var(--size-20);
		font-weight: 600;
		color: var(--c-teal-dark-900);
		margin-bottom: var(--space-sm);
	}

	.case-study-cta__excerpt {
		font-size: var(--fs-sm);
		color: var(--c-grey-600);
		line-height: 1.6;
		flex: 1;
	}

	.case-study-cta__link {
		background-color: var(--c-teal-dark-900);
		color: var(--c-white);
		font-weight: 600;
		padding: var(--size-12) var(--size-24);
		border-radius: var(--radius-sm);
		text-decoration: none;
		display: inline-block;
		align-self: flex-start;
		transition: background-color 0.3s ease;

		&:hover {
			background-color: #004d5e;
			color: var(--c-white);
		}
	}
}

.case-study-product__card:before,
.case-study-cta__card.solution::before {
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    content: '';
    background-color: var(--c-teal-dark-900);
    height: 100%;
    opacity: 0.65;
	z-index: 1;
}

.product-feature-template-default {
	.temp-cta {
	    padding-top: var(--size-80);
	    padding-bottom: var(--size-40);
	}
}

.solution-template-default {
	.temp-cta {
	    padding-bottom: var(--size-40);
	}
}

/*
|--------------------------------------------------------------------------
|  SINGLE SOLUTION (solution-specific overrides)
|--------------------------------------------------------------------------
*/
	.type-solution .page-hero {
		padding-bottom: 14.75rem;
	}

	section.page-hero.video-sec,
	section.page-hero.image-sec {
		padding-bottom: 0;
	}

	/* Lock the media to a predictable 16:9 aspect so we can centre it
	   exactly on the dark/light boundary, and pull it up by half its
	   own height for a perfect 50/50 overlap of the dark and light
	   backgrounds. For a 16:9 element, height = 56.25% of width, so
	   half = 28.125%. Percentage margins resolve against the parent's
	   WIDTH (which here equals the media's width), so -28.125% =
	   -½ × media height exactly, regardless of breakpoint. */
	section.video-sec .page-hero__media,
	section.image-sec .page-hero__media {
		min-height: 0;
		aspect-ratio: 16 / 9;
		margin-top: -45.125%;
	}

	/* Override the legacy column-level negative margin */
	section.video-sec .page-hero__media-col,
	section.image-sec .page-hero__media-col {
		margin-top: 0;
	}

	.page-stats__item {
		text-align: left;
		border-left: var(--size-2) solid var(--c-yellow-acid);
		padding-left: var(--size-25);
		padding-top: var(--size-8);
	}

	.page-stats__value {
		font-size: var(--size-60);
		padding-bottom: var(--size-20);
	}

	.centered-title {
		max-width: 900px;
	}

	.real-world-section {
		padding: var(--space-80) 0;
	}

	.real-world-section .testimonials-section {
		padding-top: 0;
		padding-bottom: 0;

		.swiper-container {
			border-radius: var(--size-12);
			border: var(--size-1) solid #cbd5da;
		}
	}

	.real-world-section .testimonials-section__card {
		background: var(--c-white);
		border-radius: var(--size-16);
		padding: var(--size-40);
		min-height: 520px;
		display: flex;
		flex-direction: column;
		justify-content: center;

		.star {
			color: var(--c-yellow-acid) !important;
		}

		.testimonials-section__quote {
			font-weight: 300 !important;
			font-size: var(--size-20);
		}
	}

	.real-world-section .testimonials-section .swiper-wrapper {
		padding-bottom: 0;
	}

	.real-world-section .testimonials-section .swiper-pagination {
		bottom: var(--size-35);
		width: 100%;
		display: flex;
		justify-content: center;
		gap: var(--size-5);
	}

	.real-world-section .testimonials-section .swiper-pagination-bullet-active {
		background-color: var(--c-yellow-acid);
	}

	.stat-block {
		position: absolute;
		top: 0;
		right: 0;
		padding-top: var(--size-30);
		padding-right: var(--size-30);
		padding-left: var(--size-30);
		width: 100%;
		z-index: 1;

		.case-study-cta__content {
			max-width: 200px;
			float: right;
		}

		.client-logo-overlay {
			width: max-content;
		}
		
		p.small {
			line-height: 1.5em;
		}
	}

	.case-study-overlay {
		z-index: 1;
	}

	.case-study-cta__card.solution .case-study-overlay {
		padding: var(--size-30);
	}

	.case-study-cta__card {
		border-radius: var(--size-16);
	}

	.stat-block .value {
		font-size: 4rem;
		line-height: 1em;
	}

	.card.feature-card {
		border-radius: var(--size-24);
		border: var(--size-1) solid rgba(147, 170, 176, 0.50);
		background: var(--c-white);
		box-shadow: 0 var(--size-4) var(--size-14) 0 rgba(98, 133, 142, 0.15);
	}

	.feature-card__desc {
		display: -webkit-box;
		-webkit-line-clamp: 5;
		-webkit-box-orient: vertical;
		overflow: hidden;
	}

	.card-img-top {
		border-top-left-radius: var(--size-24);
		border-top-right-radius: var(--size-24);
	}

	.card-title {
		color: var(--c-teal-dark-900);
		font-size: var(--size-24);
	}

	.readmore-btn {
		color: var(--c-teal-dark-900);
		text-decoration: none;
		font-weight: 600;
	}

	[data-testimonial-count="1"] {
		.swiper-pagination {
			display: none;
		}

		.testimonials-swiper .swiper-wrapper {
			padding-bottom: var(--size-20) !important;
		}
	}

.case-study-cta__card .col-md-6 {
    position: relative;
}

.case-study-product__card {
	.client-logo-overlay {
		margin-top: var(--size-30);
		margin-left: var(--size-30);
		z-index: 1;
	}
}

/*
|--------------------------------------------------------------------------
|  RESPONSIVENESS
|--------------------------------------------------------------------------
*/
	@media all and ( max-width: 980px ) {

		/* ----- Single Blog Post ----- */
		.single-post {

			header.entry-header {
				padding: var(--size-48) 0 12rem 0;
			}

			.entry-title {
				font-size: clamp(2.65rem, 5vw, 3.75rem);
			}

			.entry-meta {
				margin-bottom: var(--size-40);
			}

			.share-section {
				justify-content: flex-start;

					.row {
						display: initial;
					}

					.share-col {
						justify-content: flex-start;
					}
				}
			}

			.featured-image {
				img {
					height: 400px;
				}
			}

			.toc-fixed {
				position: relative !important;
				top: auto !important;
			}

			#toc-sidebar {
				margin-bottom: var(--size-48);
			}

		}
	}

	@media all and ( max-width: 992px ) {

		/* ----- Page Hero ----- */
		.page-hero {
			padding: var(--space-50) 0 var(--space-60) 0;
		}

		.tab-section {
			.tab-section__nav {
				flex-direction: column;
				flex-wrap: wrap;
				gap: var(--size-8);
				margin-bottom: var(--size-30);
			}

			.tab-section__nav-item {
				border-left: none;
				padding: var(--size-12) var(--size-16);
				font-size: var(--size-18);

				&.tab-section__nav-item--active {
					border-bottom-color: var(--c-yellow-acid);
					border-left: none;
				}
			}
		}

		.key-points .key-points__block {
			margin-bottom: var(--space-30);
		}

		.key-points .key-points__content {
			padding: var(--size-20) 0 0;
		}
	}

/** General **/
.equal-padding {
    padding: var(--size-80);
}

.object-cover {
    object-fit: cover;
}

.accent-color {
	color: var(--c-yellow-acid);
}

.first-counter {
    background-color: rgb(255 255 255 / 22%);
	margin: var(--size-30);
	z-index: 1;
}

/** Tagline **/
.tagline {
    border-radius: 10px;
    background: rgba(241, 242, 202, 0.15);
    margin-bottom: var(--size-30);
    padding-left: var(--size-6);
    padding-top: var(--size-2);
    padding-bottom: var(--size-2);
    padding-right: var(--size-12);
    line-height: 1.25em;
    display: inline-flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: var(--size-5);
}

.accent.tagline {
    color: var(--c-yellow-acid);
    border: var(--size-1) solid var(--c-yellow-acid);
}

.blue-tagline .tagline {
    color: var(--c-teal-dark-900);
	border: var(--size-1) solid var(--c-teal-dark-900);

	svg circle {
		fill: var(--c-teal-dark-900);
	}
}

.accent-dark.tagline {
    color: var(--c-teal-dark-900);
    border: var(--size-1) solid var(--c-teal-dark-900);
}

/** Buttons **/
.cta {
    padding: var(--size-12) var(--size-22);
    border-radius: var(--size-8);
    text-decoration: none;
    transition: background-color 0.3s ease;
    width: 100%;
    min-width: 16em;
	max-width: max-content;
    display: flex;
    text-align: center;
    justify-content: center;
    align-items: center;
    gap: var(--size-8);

	& span {
		font-weight:600;
	}
}

.accent.cta {
	background-color: var(--c-yellow-acid);
	color: var(--c-teal-dark-900);
    z-index: 4;
    position: relative;

	&:hover {
		background-color: var(--c-yellow-acid);
		color: var(--c-teal-dark-900);
	}
}

.accent-dark.cta {
	background-color: var(--c-teal-dark-900);
	color: var(--c-white);

	&:hover {
		background-color: var(--c-teal-dark-900);
		color: var(--c-white);
	}
}

/** Vertical Tabs **/
.tab-section__nav-item:before {
    position: absolute;
    left: 0;
    content: '';
    height: 100%;
    width: var(--size-3);
    background-color: rgba(255, 255, 255, 0.15);
    top: 0;
}

.tab-section__nav-item--active:before {
    width: var(--size-6);
    background-color: var(--c-yellow-acid);
    left: -3px;
}

/* Each logo */
.logo-marquee__item img {
    max-height: var(--space-60);
    display: block;
}

.text-yellow-acid {
	color: var(--c-yellow-acid);
}

/*
|--------------------------------------------------------------------------
|  SINGLE CASE STUDY
|--------------------------------------------------------------------------
*/

	/* ----- Case Study Hero (white bg override) ----- */
	.type-case-study .page-hero {
		background-color: var(--c-white);
		color: var(--c-teal-dark-900);
		padding-bottom: var(--space-40);

		.page-hero__content {
			color: var(--c-teal-dark-800);
			opacity: 1;
		}
	}

	.cs-hero__breadcrumbs {
		opacity: 0.5;

		a {
			color: var(--c-teal-dark-900) !important;
		}
	}

	.cs-hero__title {
		color: var(--c-teal-dark-800);
	}

	.cs-hero__excerpt {
		color: var(--c-teal-dark-900);
		opacity: 0.8;
	}

	.cs-hero__tags {
		display: flex;
		flex-wrap: wrap;
		gap: var(--size-8);
		margin-top: var(--space-20);
	}

	.cs-hero__tag {
		background: var(--c-grey-100);
		color: #93aab0;
		font-size: var(--fs-xs);
		padding: var(--size-4) var(--size-16);
		border-radius: var(--radius-pill);
	}

	/* Client Info Grid */
	.cs-hero__client-info {
		border: var(--size-1) solid #C4D0D3;
		border-radius: var(--size-12);
		padding: var(--space-30);
	}

	.cs-hero__client-grid {
		display: grid;
		grid-template-columns: 1fr 1fr;
		position: relative;
	}

	/* Vertical line (center column) */
	.cs-hero__client-grid::before {
		content: '';
		position: absolute;
		top: 0;
		bottom: 0;
		left: 50%;
		width: var(--size-1);
		background-color: #C4D0D3;
	}

	/* Horizontal line (center row) */
	.cs-hero__client-grid::after {
		content: '';
		position: absolute;
		left: 0;
		right: 0;
		top: 50%;
		height: var(--size-1);
		background-color: #C4D0D3;
	}

	.cs-hero__client-cell {
		display: flex;
		flex-direction: column;
		gap: var(--size-4);
		padding: var(--space-20);
	}

	.cs-hero__client-label {
		font-size: var(--fs-xs);
		color: var(--c-grey-400);
		font-weight: 600;
	}

	.cs-hero__client-value {
		font-size: var(--size-16);
		font-weight: 600;
		color: var(--c-teal-dark-900);
	}

	.cs-hero__client-logo {
		margin-top: var(--space-30);
		margin-right: var(--size-30);
		position: absolute;
		top: 0;
		right: 0;
		box-shadow: var(--size-4) var(--size-4) var(--size-11) var(--size-6) rgba(49, 95, 107, 0.31);

		img {
			max-height: var(--space-100);
			width: auto;
			object-fit: contain;
			border-radius: .75rem;
		}
	}

	/* ----- Featured Image (overlap) ----- */
	.cs-featured-image {
		padding-top: var(--space-80);
		background: linear-gradient(to bottom, transparent 0%, transparent 35%, #F4F9F9 35%, #F4F9F9 100%);
	}

	.cs-featured-image__wrapper {
		margin-top: -40px;
		position: relative;
		z-index: 1;
	}

	.cs-featured-image__img {
		width: 100%;
		height: 600px;
		border-radius: var(--size-12);
		box-shadow: 0 8px 40px rgba(0, 0, 0, 0.12);
		object-fit: cover;
	}

	/* ----- Case Study Stats (yellow bg variant) ----- */
	.type-case-study .page-stats.bg-accent {
		padding: var(--space-60) 0;
	}

	.cs-stats__item {
		border-left-color: var(--c-grey-200) !important;
	}

	.cs-stats__value {
		font-size: var(--size-60);
		font-weight: 600;
		color: var(--c-teal-dark-900) !important;
		line-height: 1;
	}

	/* ----- Flexible Content Sections ----- */
	.cs-content-section .row {
		padding: var(--space-80) 0;
		border-bottom: 1px solid #C4D0D3;
	}

	.cs-content-section:last-of-type .row {
		border-bottom: none;
		padding-bottom: 0;
	}

	.cs-content-section__tagline {
		display: block;
		font-size: var(--fs-xs);
		color: var(--c-grey-400);
		font-weight: 600;
		margin-bottom: var(--space-sm);
	}

	.cs-content-section__heading {
		font-size: 2rem;
		font-weight: 600;
		color: var(--c-teal-dark-900);
		margin-bottom: var(--space-20);
	}

	.cs-content-section__body {
		font-size: var(--size-16);
		color: var(--c-teal-dark-800);
		line-height: 1.7;

		p:last-child { margin-bottom: 0; }
	}

	/* ----- Testimonials on Dark Teal ----- */
	.testimonials-section.bg-dark-teal {
		color: var(--c-white);

		.testimonials-section__heading {
			color: var(--c-white);
		}

		.testimonial_body p {
			color: rgba(255, 255, 255, 0.7);
		}

		.testimonials-section__stars .star {
			color: var(--c-yellow-acid);
		}

		.testimonials-section__quote {
			color: var(--c-white);
		}

		.testimonials-section__author {
			color: var(--c-white);
		}

		.testimonials-section__role {
			color: rgba(255, 255, 255, 0.6);
		}

		.testimonials-section__author-block div:before {
			border-right-color: rgba(255, 255, 255, 0.2);
		}

		.swiper-pagination-bullet {
			background-color: rgba(255, 255, 255, 0.3);
		}

		.swiper-pagination-bullet-active {
			background-color: var(--c-yellow-acid);
		}
	}

	/* ----- Related Work / Case Studies ----- */
	.related-work,
	.related-features {
		padding: var(--space-80) 0;
	}

	.related-list-wrapper {
		display: flex;
		flex-direction: column;
		gap: var(--size-50);
	}

	.related-work__heading {
		font-size: clamp(2.2rem, 3vw, 2.5rem);
		font-weight: 600;
		color: var(--c-teal-dark-900);
		margin-bottom: var(--space-40);
	}

	.related-work__item {
		border-top: var(--size-1) solid #C4D0D3;
		border-bottom: var(--size-1) solid #C4D0D3;
		padding: var(--space-40) 0;
  
		a {
			text-decoration: none;
		}
	}

	.related-work__title {
		font-size: 2rem;
		font-weight: 600;
		color: var(--c-teal-dark-900);
		margin-bottom: var(--space-sm);
	}

	.related-work__excerpt {
		font-size: var(--size-16);
		color: var(--c-teal-dark-900);
		line-height: 1.6;
		margin-bottom: var(--space-20);
	}

	.related-work__tags {
		display: flex;
		flex-wrap: wrap;
		gap: var(--size-8);
		margin-bottom: var(--space-20);
	}

	.related-work__tag {
		background: var(--c-grey-100);
		color: #93aab0;
		font-size: var(--fs-xs);
		padding: var(--size-4) var(--size-16);
		border-radius: var(--radius-pill);
	}

	.related-work__link {
		color: var(--c-teal-dark-900);
		font-weight: 600;
		text-decoration: none;
		font-size: var(--size-16);

		&:hover {
			text-decoration: underline;
		}

		span {
			margin-left: var(--size-4);
		}
	}

	.related-work__image {
		aspect-ratio: 16 / 9;
		position: relative;
		overflow: hidden;

		img {
			aspect-ratio: 16 / 9;
			width: 100%;
			height: 100%;
			object-fit: cover;
		}
	}

	/* ----- Case Study Value Stack bg ----- */
	.type-case-study .value-stack.alt-1 {
		background-color: #f4f9f9;
	}

	/* ----- Case Study Responsive ----- */
	@media all and (max-width: 992px) {
		.cs-hero__client-info {
			margin-top: var(--size-30);
			margin-bottom: var(--size-30);
			padding: var(--size-10);
		}

		.cs-content-section__heading {
			margin-bottom: var(--space-sm);
		}

		.cs-content-section .col-lg-4 {
			margin-bottom: var(--size-5);
		}

		.related-work__image {
			margin-top: var(--size-20);
		}
	}

.event-date-card {
	position: absolute;
	top: var(--size-20);
	left: var(--size-20);
	background: var(--c-white);
	border-radius: var(--size-12);
	padding: var(--size-16) var(--size-20);
	text-align: center;
	box-shadow: 0 var(--size-4) var(--size-20) rgba(0, 0, 0, 0.15);
	z-index: 2;
	min-width: 140px;
}

.event-date-card__day   { font-size: 2.8rem; line-height: 1; font-weight: 600; }
.event-date-card__year  { font-size: 1rem; }
.event-date-card__time  { margin-top: var(--size-8); font-size: 0.95rem; }

.event-meta-list {
    list-style: none;
    padding: 0;
}

.event-meta-list li {
    display: flex;
    gap: var(--size-15);
    padding: var(--size-15) 0;
    border-bottom: var(--size-1) solid #eee;
}

.event-meta-list li:last-child { border-bottom: none; }

.btn-primary {
    background: #e74c3c;
    border: none;
}

.related-event-card img {
    border-radius: .75rem .75rem 0 0;
}

/* =============================================
   CONTENT POD LAYOUTS — About Us Page
   ============================================= */

/* ----- Hero Section Pod ----- */
.pod-hero__title {
    font-size: var(--space-60);
    font-weight: 600;
    line-height: 1.1;
    margin-bottom: 0;
}

.pod-hero__content {
    font-size: var(--size-18);
    line-height: 1.6;
    margin-bottom: var(--space-30);
}

.pod-hero__image {
    width: 100%;
    margin-top: var(--space-40);
}

@media (max-width: 992px) {
    .pod-hero__title {
        font-size: var(--size-36) !important;
        margin-bottom: var(--space-20);
    }
}

/* ----- Timeline Pod ----- */
.pod-timeline__heading {
    font-weight: 600;
    margin-bottom: var(--space-60);
}

.pod-timeline {
    display: flex;
    gap: var(--space-40);
	margin-top: var(--space-50);
}

.pod-timeline__items {
    position: relative;
    z-index: 0;
    flex: 1;
}

.pod-timeline__items::before {
    content: '';
    position: absolute;
    left: 97px;
    top: 0;
    height: var(--timeline-line-height, 100%);
    width: var(--size-2);
    background: #93AAB0;
	z-index: 0;
}

.pod-timeline__items::after {
    content: '';
    position: absolute;
    left: 97px;
    top: 0;
    width: var(--size-2);
    height: var(--timeline-progress, 0%);
    background: var(--c-yellow-acid);
    z-index: 0;
    will-change: height;
}

.pod-timeline__item {
    display: flex;
    align-items: flex-start;
    gap: var(--space-30);
    margin-bottom: var(--space-40);
    position: relative;
}

.pod-timeline__year {
    flex-shrink: 0;
    width: var(--space-60);
    font-size: var(--size-18);
    font-weight: 600;
    color: var(--c-teal-dark-800);
}

.pod-timeline__dot {
    flex-shrink: 0;
    width: var(--size-16);
    height: var(--size-16);
    border-radius: 50%;
    background: var(--c-teal-dark-800);
    border: none;
    box-shadow: none;
    position: relative;
    top: 0;
    z-index: 2;
    transition: background 0.3s ease;
}

.pod-timeline__dot.is-active {
    background: var(--c-yellow-acid);
}

.pod-timeline__content {
    flex: 1;
    max-width: 480px;
}

.pod-timeline--no-images .pod-timeline__content {
    max-width: none;
}

.pod-timeline__content h3 {
    font-size: var(--size-20);
    font-weight: 600;
    margin-bottom: var(--size-8);
}

.pod-timeline__content p {
    font-size: var(--size-16);
    line-height: 1.5;
    color: #667085;
    margin-bottom: 0;
}

.pod-timeline__images {
    flex-shrink: 0;
    width: 33%;
    display: flex;
    flex-direction: column;
    gap: var(--space-30);
	margin-top: -20px;
}

.pod-timeline__image {
    width: 100%;
    object-fit: cover;
}

.pod-timeline__content {
    opacity: 0.4;
    transform: translateY(5px);
    transition: opacity 0.8s ease, transform 0.8s ease;
}

.pod-timeline__item.is-active .pod-timeline__content {
    opacity: 1;
    transform: translateY(0);
}

@media (max-width: 992px) {
    .pod-timeline {
        flex-direction: column;
    }

    .pod-timeline__images {
        width: 100%;
        flex-direction: row;
        order: -1;
    }

    .pod-timeline__image {
        max-width: 50%;
    }

    /* Stacked layout: dot + year inline, title and description below */
    .pod-timeline__item {
        display: block;
        position: relative;
        padding-left: var(--size-32);
        margin-bottom: var(--size-40);
        gap: 0;
    }

    .pod-timeline__dot {
        position: absolute;
        left: 2px;
        top: 4px;
        width: var(--size-12);
        height: var(--size-12);
    }

    .pod-timeline__year {
        display: block;
        width: auto;
        font-size: var(--size-14);
        margin-bottom: var(--size-6);
    }

    .pod-timeline__content {
        max-width: none;
    }

    /* Reposition the container line so it starts at the first dot's center */
    .pod-timeline__items::before {
        left: 7px;
        top: 10px;
        height: calc(var(--timeline-line-height, 100%) - 10px);
    }

    /* Yellow progress fill — JS sets --timeline-progress; offset by first dot center */
    .pod-timeline__items::after {
        left: 7px;
        top: 10px;
        height: max(calc(var(--timeline-progress, 0px) - 10px), 0px);
    }

    .pod-timeline__heading {
        margin-bottom: var(--space-40);
    }
}

@media (max-width: 480px) {
    .pod-timeline__images {
        flex-direction: column;
    }

    .pod-timeline__image {
        max-width: 100%;
    }

    .pod-timeline__content h3 {
        font-size: var(--size-17);
    }

    .pod-timeline__content p {
        font-size: var(--size-14);
    }

    .pod-timeline__heading {
        font-size: var(--size-24);
    }
}

/* ----- Testimonials Posts Pod ----- */
.pod-testimonials-posts {
    background-color: var(--c-teal-dark-800);
    color: var(--c-white);
}

.pod-testimonials-posts__heading {
    font-size: var(--size-36);
    font-weight: 600;
    margin-bottom: var(--size-12);
}

.pod-testimonials-posts__desc {
    font-size: var(--size-16);
    opacity: 0.85;
    margin-bottom: var(--size-40);
}

.pod-testimonials-posts__card {
    display: flex;
    flex-direction: column;
    gap: var(--size-24);
    height: 100%;
}

.pod-testimonials-posts__stars .star {
    font-size: var(--size-20);
}

.pod-testimonials-posts__quote {
    font-size: var(--size-16);
    line-height: 1.5;
    flex: 1;
    display: -webkit-box;
    -webkit-line-clamp: 6;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.pod-testimonials-posts__quote p:last-child {
    margin-bottom: 0;
}

.pod-testimonials-posts__name {
    font-size: var(--size-16);
}

.pod-testimonials-posts__role {
    opacity: 0.7;
}

.pod-testimonials-posts .swiper-pagination-bullet {
    background: var(--c-white);
    opacity: 0.4;
}

.pod-testimonials-posts .swiper-pagination-bullet-active {
    opacity: 1;
}

/* ----- Marquee Logos Pod ----- */
.pod-marquee-logos .logo-marquee__item img {
    max-height: var(--space-60);
    max-width: 180px;
    object-fit: contain;
    filter: grayscale(100%);
    opacity: 0.7;
    transition: all 0.3s ease;
}

.pod-marquee-logos .logo-marquee__item:hover img {
    filter: grayscale(0%);
    opacity: 1;
}

/* ----- Team Members Pod ----- */
.pod-team__heading {
    font-size: var(--size-36);
    font-weight: 600;
    margin-bottom: var(--size-12);
}

.pod-team__description {
    font-size: var(--size-16);
    color: #667085;
    margin: 0 auto var(--space-40);
}

.pod-team__card {
    margin-bottom: var(--space-20);
    position: relative;
    z-index: 9;
}

.pod-team-members {
    position: relative;
}

.pod-team__photo {
    overflow: hidden;
    margin-bottom: 16px;
}

.pod-team__photo img {
    width: 100%;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    display: block;
    transition: transform 0.3s ease;
}

.pod-team__card:hover .pod-team__photo img {
    transform: scale(1.05);
}

.pod-team__name {
    font-size: var(--size-24);
    font-weight: 600;
    margin-bottom: var(--size-4) !important;
}

.pod-team__role {
    font-size: var(--size-16);
    color: #1a1a1a;
    margin-bottom: var(--size-8);
}

.pod-team__bio {
    font-size: var(--size-16);
    color: #667085;
    line-height: var(--size-22);
}

.pod-team__bio p:last-child {
    margin-bottom: 0;
}

.pod-team__linkedin {
    display: inline-flex;
    color: #667085;
    margin-top: var(--size-12);
    transition: color 0.2s ease;
}

.pod-team__linkedin:hover {
    color: #0077b5;
}

/* Team list layout */
.pod-team__photo--list {
    flex-shrink: 0;
    width: var(--space-80);
    height: var(--space-80);
    border-radius: 50%;
    margin-bottom: 0;
}

.pod-team__photo--list img {
    border-radius: 50%;
}

.pod-team__card--list {
    padding: var(--space-20);
    border-bottom: 1px solid #eee;
}

@media (max-width: 768px) {
    .pod-team__name {
        font-size: var(--size-20);
    }
}

/* ==========================================================================
   Single Event Styles
   ========================================================================== */
.event-hero__image-wrapper {
    position: relative;
    border-radius: var(--size-12);
    overflow: hidden;
    height: 500px;
}

.event-hero__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.event-hero__info {
    padding-top: var(--space-lg);
}

.event-hero__breadcrumbs {
    font-size: var(--fs-sm);
    margin-bottom: var(--space-md);
}

.event-hero__breadcrumbs a {
    text-decoration: none;
}

.event-hero__title {
    font-size: clamp(2.2rem, 4vw, 3.0625rem);
    font-weight: 600;
    margin-bottom: var(--space-md);
	color: var(--c-teal-dark-800);
}

.event-hero__excerpt {
    font-size: var(--size-18);
    max-width: 700px;
}

.event-type-badge {
    align-items: center;
    padding: var(--size-6) var(--size-12);
    border-radius: 5px;
    font-size: var(--size-14);
    font-weight: 600;
    color: var(--c-teal-dark-800);
}

.event-type-physical { background: var(--c-yellow-acid); }
.event-type-online { background: #2E7D32; }
.event-type-hybrid { background: #6C3483; }

.event-date-card__month {
    font-size: var(--size-14);
    font-weight: 600;
    text-transform: uppercase;
    color: var(--c-teal-dark-800);
    letter-spacing: var(--size-1);
}

.event-date-card__day {
    font-size: var(--size-40);
    font-weight: 600;
    line-height: 1.1;
    color: var(--c-teal-dark-900);
}

.event-date-card__year {
    font-size: var(--size-13);
    color: var(--c-grey-600);
}

.event-date-card__time {
    font-size: var(--size-12);
    color: var(--c-grey-600);
    margin-top: var(--size-4);
}

.event-main {
    padding-top: var(--space-80);
    padding-bottom: var(--space-80);
}

.event-content {
    font-size: var(--size-16);
    line-height: 1.8;
}

.event-sidebar {
    top: 100px;
}

.event-meta-card {
    background: var(--c-white);
    border-radius: var(--size-12);
    padding: var(--size-30);
    box-shadow: rgba(0, 0, 0, 0.08) 0px 4px 20px;
    border-radius: var(--size-12);
    overflow: hidden;
    transition: all 0.4s ease !important;
    min-width: 300px;
    border: 0.625px solid rgba(49, 95, 107, 0.18);

	.accent.cta {
		width: 100%;
		max-width: 100%;
	}
}

.teal {
    color: var(--c-teal-dark-900);
}

.event-meta-card__title {
	color: var(--c-teal-dark-900);
    font-size: var(--size-20);
    font-weight: 600;
    margin-bottom: var(--space-lg);
    padding-bottom: var(--space-sm);
    border-bottom: var(--size-2) solid var(--c-grey-100);
}

.event-meta-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.event-meta-list li {
    display: flex;
    gap: var(--size-14);
    padding: var(--size-14) 0;
    border-bottom: var(--size-1) solid var(--c-grey-100);
}

.event-meta-list li:last-child {
    border-bottom: none;
}

.event-meta-list .icon {
    flex-shrink: 0;
    width: var(--size-20);
    height: var(--size-20);
    color: var(--c-teal-dark-800);
    margin-top: var(--size-2);
}

.event-meta-list .icon svg {
    display: block;
}

.event-meta-list .badge {
    display: inline-block;
    padding: var(--size-2) var(--size-10);
    border-radius: 10em;
    font-size: var(--size-11);
    font-weight: 600;
    margin-left: var(--size-6);
}

.event-meta-list .badge.online {
    background: #e8f5e9;
    color: #2E7D32;
}

.related-events {
    margin-top: var(--size-40);
}

.related-event-card {
    background: var(--c-white);
    border-radius: var(--size-12);
    overflow: hidden;
    box-shadow: 0 var(--size-4) var(--size-16) rgba(0, 0, 0, 0.08);
    transition: transform 0.3s ease;
}

.related-event-card:hover {
    transform: translateY(-4px);
}

.related-event-card__body {
    padding: var(--size-20);
}

.related-event-card__body h4 {
    margin: 0 0 var(--size-8);
    font-size: var(--size-18);
}

.related-event-card__body h4 a {
    color: inherit;
    text-decoration: none;
}

/* ==========================================================================
   Single Video / Webinar Styles
   ========================================================================== */

.single-video {

	h2, h3, h4 {
		color: var(--c-teal-dark-900)
	}

	/* Header Section */
	header.entry-header {
		display: flex;
		flex-direction: column;
		justify-content: center;
		padding: 8.75rem 0 10rem 0;
	}

	.category-pill {
        border: var(--size-1) solid var(--c-aqua-light);
        font-size: var(--size-14);
        padding: var(--size-6) var(--size-12);
        align-self: flex-start;
        background: var(--c-aqua-light);
        color: var(--c-white);
        border-radius: var(--size-5);
        font-weight: 600;
        margin-bottom: var(--size-12);
    }

	.entry-title {
		margin: var(--size-32) 0 var(--size-32) !important;
	}

	.video-media-wrapper img {
		aspect-ratio: 16 / 9;
		object-fit: cover;
		height: 500px;
		border-radius: var(--size-12);
	}
}

.dcb-card-media .dcb-card-content {
    padding-top: 0px;
}

.single-video,
.single-webinar {

    .entry-title {
        font-size: clamp(2.2rem, 4vw, 3.0625rem);
    }

	.video-media-wrapper img {
		height: 500px !important;
	}

	h2, h3, h4 {
		color: var(--c-teal-dark-900)
	}

	/* Header Section */
	header.entry-header {
		display: flex;
		flex-direction: column;
		justify-content: center;
		padding: 8.75rem 0 10rem 0;
	}

	.category-pill {
        border: var(--size-1) solid var(--c-aqua-light);
        font-size: var(--size-14);
        padding: var(--size-6) var(--size-12);
        align-self: flex-start;
        background: var(--c-aqua-light);
        color: var(--c-white);
        border-radius: var(--size-5);
        font-weight: 600;
        margin-bottom: var(--size-12);
    }

	.entry-title {
		margin: var(--size-32) 0 var(--size-32) !important;
	}

	.video-media-wrapper img {
		aspect-ratio: 16 / 9;
		object-fit: cover;
		height: 500px;
		border-radius: var(--size-12);
	}
}

.single-event {

	h2, h3, h4 {
		color: var(--c-teal-dark-900)
	}

	header.entry-header {
		display: flex;
		flex-direction: column;
		justify-content: center;
		padding: 5rem 0 8rem 0;
	}

	.entry-title {
		margin: var(--size-32) 0 var(--size-32) !important;
	}

	.video-media-wrapper {
		position: relative;
	}

	.video-media-wrapper img {
		aspect-ratio: 16 / 9;
		object-fit: cover;
		height: 500px;
		border-radius: var(--size-12);
	}

	.event-date-card__month {
		font-size: var(--size-13);
		font-weight: 600;
		text-transform: uppercase;
		color: var(--c-teal-dark-800);
		letter-spacing: 0.05em;
	}

	.event-date-card__day {
		font-size: 2.5rem;
		line-height: 1;
		font-weight: 800;
		color: var(--c-teal-dark-900);
	}

	.event-date-card__year {
		font-size: var(--size-13);
		color: var(--c-grey-400);
	}

	.event-date-card__time {
		margin-top: var(--size-8);
		font-size: var(--size-12);
		color: var(--c-grey-600);
		border-top: 1px solid var(--c-grey-200);
		padding-top: var(--size-8);
	}
}

/* Event sidebar details list */
.event-sidebar__details {
	list-style: none;
	padding: 0;
	margin: 0 0 var(--size-14) 0;
}

.event-sidebar__details li {
	display: flex;
	align-items: flex-start;
	gap: var(--size-12);
	padding: var(--size-14) 0;
	border-bottom: 1px solid var(--c-grey-200);
}

.event-sidebar__details li:last-child {
	border-bottom: none;
}

.event-sidebar__details li svg {
	flex-shrink: 0;
	margin-top: var(--size-2);
	color: var(--c-teal-dark-800);
}

.event-sidebar__details li strong {
	display: block;
	font-size: var(--size-14);
	font-weight: 600;
	color: var(--c-teal-dark-900);
}

.event-sidebar__details li span {
	display: block;
	font-size: var(--size-13);
	color: var(--c-grey-400);
}

.video-hero__meta,
.webinar-hero__meta {
    display: flex;
    flex-wrap: wrap;
    gap: var(--size-20);
    margin-bottom: var(--space-lg);
}

.video-meta-item,
.webinar-meta-item {
    display: inline-flex;
    align-items: center;
    gap: var(--size-6);
    font-size: var(--size-15);
    opacity: 0.85;
}

.video-meta-item svg,
.webinar-meta-item svg {
    flex-shrink: 0;
    opacity: 0.7;
}

.video-player-section {
    padding: var(--size-40) 0;
}

.video-wrapper {
    border-radius: var(--size-12);
    overflow: hidden;
    background: var(--c-black);
    aspect-ratio: 16 / 9;
}

.video-wrapper iframe,
.video-wrapper video {
    border-radius: var(--size-12);
}

.video-fallback-wrapper {
    position: relative;
}

.video-fallback-wrapper .fallback-image {
    width: 100%;
    height: auto;
    display: block;
}

.video-fallback-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: var(--c-white);
}

.video-fallback-play {
    width: 72px;
    height: 72px;
    background: rgba(255, 255, 255, 0.2);
    border: var(--size-2) solid rgba(255, 255, 255, 0.6);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: var(--size-16);
    transition: background 0.3s ease;
}

.video-tags-section,
.webinar-tags-section {
    padding: var(--size-20) 0 var(--size-40);
}

.video-tags {
    display: flex;
    flex-wrap: wrap;
    gap: var(--size-10);
}

.video-tag-pill {
    display: inline-block;
    padding: var(--size-4) var(--size-16);
    border: var(--size-1) solid var(--c-grey-200);
    border-radius: 10em;
    font-size: var(--size-13);
    color: var(--c-grey-600);
    text-decoration: none;
    transition: all 0.2s ease;
}

.video-tag-pill:hover {
    background: var(--c-teal-dark-800);
    color: var(--c-white);
    border-color: var(--c-teal-dark-800);
}


.video-hero__play-btn {
    width: var(--space-70);
    height: var(--space-70);
    border-radius: 50%;
    border: var(--size-2) solid var(--c-yellow-acid);
    background: rgba(255, 255, 255, 0.15);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s ease;
    color: var(--c-white);
    padding: 0;
}

.video-hero__play-btn svg {
    margin-left: var(--size-4);
}

.video-hero__play-btn:hover {
    background: rgba(255, 255, 255, 0.3);
    transform: scale(1.1);
    border-color: rgba(255, 255, 255, 0.9);
}

@keyframes playPulse {
    0%   { box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.3); }
    70%  { box-shadow: 0 0 0 20px rgba(255, 255, 255, 0); }
    100% { box-shadow: 0 0 0 0 rgba(255, 255, 255, 0); }
}

.video-hero__play-btn {
    animation: playPulse 2.5s infinite;
}

.video-hero__watch-btn {
    display: inline-flex;
    align-items: center;
    gap: var(--size-8);
    padding: var(--size-8) var(--size-20);
    border-radius: var(--size-8);
    border: var(--size-1) solid rgba(255, 255, 255, 0.5);
    background: rgba(255, 255, 255, 0.1);
    color: var(--c-white);
    font-size: var(--size-16);
    font-weight: 600;
    transition: all 0.3s ease;
    width: 12em;
    text-align: center;
    justify-content: center;
}

.semi-bg {
    border: var(--size-1) solid rgba(255, 255, 255, 0.5);
    background: rgba(255, 255, 255, 0.1);
    color: var(--c-white);
    width: 12em;
	flex-direction: row-reverse;
	transition: all 0.3s ease;

	svg path {
		stroke: var(--c-white);
	}
}

.semi-bg:hover,
.video-hero__watch-btn:hover {
    background: rgba(255, 255, 255, 0.25);
    border-color: rgba(255, 255, 255, 0.8);
	transition: all 0.3s ease;
}

/* Video media play overlay */
.video-media-wrapper {
    position: relative;
    cursor: pointer;
	margin-top: -105px;
}

.video-media-play-overlay {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgb(17 54 68 / 65%);
	border-radius: var(--size-12);
    transition: background 0.3s ease;
}

.video-media-play-overlay:hover {
    background: rgb(17 54 68 / 50%);
}

.video-media-play-overlay:hover .video-hero__play-btn {
    transform: scale(1.1);
    background: rgba(255, 255, 255, 0.3);
}

/* Video sidebar */
.video-sidebar {
    border: var(--size-1) solid var(--c-grey-200);
    border-radius: var(--size-12);
    padding: var(--size-24);
    background: var(--c-white);
}

.video-sidebar__like-btn {
    display: flex;
    align-items: center;
    gap: var(--size-10);
    width: 100%;
    padding: var(--size-12) var(--size-16);
    border: var(--size-1) solid var(--c-grey-200);
    border-radius: .75rem;
    background: var(--c-white);
    cursor: pointer;
    font-size: var(--size-14);
    font-weight: 600;
    color: var(--c-grey-600);
    transition: all 0.2s ease;
    margin-bottom: var(--size-24);
}

.video-sidebar__like-btn:hover {
    border-color: var(--c-teal-dark-800);
    color: var(--c-teal-dark-800);
}

.video-sidebar__like-btn .like-count {
    margin-left: auto;
    background: var(--c-grey-100, #f3f4f6);
    padding: var(--size-2) var(--size-10);
    border-radius: 10em;
    font-size: var(--size-13);
}

.video-sidebar__like-btn.is-liked {
    background: var(--c-teal-dark-800);
    border-color: var(--c-teal-dark-800);
    color: var(--c-white);
}

.video-sidebar__like-btn.is-liked .like-icon {
    fill: var(--c-white);
    stroke: var(--c-white);
}

.video-sidebar__like-btn.is-liked .like-count {
    background: rgba(255, 255, 255, 0.2);
    color: var(--c-white);
}

.video-sidebar__heading {
    font-size: var(--size-16);
    font-weight: 600;
    margin-bottom: var(--size-16);
}

.video-sidebar__social-links {
    display: flex;
    flex-direction: column;
    gap: var(--size-4);
}

.video-sidebar__social-link {
    display: flex;
    align-items: center;
    gap: var(--size-12);
    padding: var(--size-10) var(--size-12);
    border-radius: .75rem;
    color: var(--c-grey-600);
    text-decoration: none;
    font-size: var(--size-14);
    font-weight: 500;
    transition: all 0.2s ease;
    border: none;
    background: none;
    cursor: pointer;
    width: 100%;
    text-align: left;
}

.video-sidebar__social-link:hover {
    background: var(--c-grey-50, #f9fafb);
    color: var(--c-teal-dark-800);
}

/* Related videos carousel arrow overrides */
.related-videos-section .swiper-button-next,
.related-videos-section .swiper-button-prev {
    display: flex;
    color: var(--c-white);
}

.related-videos-section .swiper-pagination-bullet {
    background: var(--c-white);
    opacity: 0.4;
}

.related-videos-section .swiper-pagination-bullet-active {
    opacity: 1;
    background: var(--c-white);
}

/* Webinar-specific */
.webinar-hero__header {
    display: flex;
    align-items: center;
    gap: var(--size-16);
    flex-wrap: wrap;
}

.webinar-status-badge {
    color: var(--c-white);
    font-size: var(--size-14);
    padding: var(--size-6) var(--size-12);
    align-self: flex-start;
    border-radius: var(--size-5);
    font-weight: 600;
}

.webinar-status-upcoming { background: #FFF4CC; color: #B08900; }
.webinar-status-live { background: #D92D20; color: var(--c-white);}
.webinar-status-recorded { background: #137333; color: var(--c-white);}

.webinar-speakers {
    padding: var(--size-40) 0;
}

.speaker-card {
    background: var(--c-white);
    border-radius: var(--size-12);
    padding: var(--size-24);
    box-shadow: 0 var(--size-2) var(--size-12) rgba(0, 0, 0, 0.06);
    text-align: center;
}

.speaker-card h4 {
    margin: 0 0 var(--size-6);
    font-size: var(--size-18);
    font-weight: 600;
}

.speaker-role {
    margin: 0;
    font-size: var(--size-14);
    color: var(--c-grey-600);
}

.webinar-registration-cta {
    padding: 60px 0;
    background: var(--c-teal-dark-800);
    color: var(--c-white);
}

.webinar-cta-content {
    text-align: center;
    max-width: 600px;
    margin: 0 auto;
}

.webinar-cta-content h2 {
    font-size: clamp(2.2rem, 3vw, 2.25rem);
    margin-bottom: 12px;
    color: var(--c-white);
}

.webinar-cta-content p {
    font-size: var(--size-18);
    opacity: 0.85;
    margin-bottom: 28px;
}

.webinar-register-btn {
    display: inline-block;
    padding: 14px 40px;
    background: var(--c-white);
    color: var(--c-teal-dark-800);
    border-radius: .75rem;
    font-weight: 600;
    font-size: var(--size-16);
    text-decoration: none;
    transition: all 0.3s ease;
}

.webinar-register-btn:hover {
    background: var(--c-aqua-light);
    color: var(--c-teal-dark-900);
    transform: translateY(-2px);
}

/* Webinar sidebar */
.webinar-sidebar__register-btn {
    display: block;
    padding: var(--size-14) var(--size-20);
    background: var(--c-teal-dark-800);
    color: var(--c-white);
    border: none;
    border-radius: .75rem;
    font-weight: 600;
    font-size: var(--size-15);
    text-align: center;
    text-decoration: none;
    transition: all 0.3s ease;
    width: 100%;
	max-width: 100%;
    margin-bottom: var(--size-15);
}

.webinar-sidebar__register-btn:hover {
    background: var(--c-teal-dark-900);
    color: var(--c-white);
    transform: translateY(-1px);
}

.webinar-sidebar__date-note {
    font-size: var(--size-14);
    color: var(--c-grey-400);
    margin-bottom: var(--size-24);

	svg {
		margin-top: -5px;
	}
}

.webinar-sidebar__speakers {
    margin-bottom: var(--size-24);
    padding-bottom: var(--size-24);
    border-bottom: var(--size-1) solid var(--c-grey-200);
}

.webinar-sidebar__speaker {
    display: flex;
    align-items: center;
    gap: var(--size-12);
    margin-bottom: var(--size-12);
}

.webinar-sidebar__speaker:last-child {
    margin-bottom: 0;
}

.webinar-sidebar__speaker-avatar {
    width: var(--size-40);
    height: var(--size-40);
    border-radius: 50%;
    background: var(--c-teal-dark-800);
    color: var(--c-white);
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    font-size: var(--size-14);
    flex-shrink: 0;
}

.webinar-sidebar__speaker-name {
    font-weight: 600;
    font-size: var(--size-14);
    color: var(--c-grey-800, #1f2937);
}

.webinar-sidebar__speaker-role {
    font-size: var(--size-13);
    color: var(--c-grey-400);
}


/*
|--------------------------------------------------------------------------
| BLOG ARTICLES
|--------------------------------------------------------------------------
*/	
.blog-section {
	.dcb-card-image-wrapper {
		box-shadow: 0 2px 14px 0 rgba(17, 54, 68, 0.10);
		border-radius: .75rem;
	}
}

/* Responsive - Single Templates */
@media (max-width: 768px) {
    .event-hero {
        padding: var(--space-20) 0;
    }

    .event-hero__image-wrapper {
        height: 250px;
    }

    .event-date-card {
        bottom: var(--size-12);
        right: var(--size-12);
        padding: var(--size-14) var(--size-18);
    }

    .event-main {
        padding-top: var(--size-40);
    }

    .event-sidebar {
        position: relative !important;
        top: auto !important;
        margin-top: var(--size-30);
    }

    .webinar-hero__header {
        flex-direction: column;
        align-items: flex-start;
        gap: var(--size-10);
    }

    .webinar-registration-cta {
        padding: var(--size-40) 0;
    }

    .speaker-card {
        padding: var(--size-16);
    }
}

@media (max-width: 480px) {
    .video-hero__meta,
    .webinar-hero__meta {
        flex-direction: column;
        gap: var(--size-10);
    }

    .event-meta-card {
        padding: var(--size-20);
    }
}


/*
|--------------------------------------------------------------------------
| VIDEO CONTENT SECTION
|--------------------------------------------------------------------------
*/
.video-content-section {
    padding: var(--size-40) 0;
}

.video-content-body {
    max-width: 800px;
    font-size: var(--size-17);
    line-height: 1.7;
}


/*
|--------------------------------------------------------------------------
| CLICK-TO-PLAY VIDEO PLAYER
|--------------------------------------------------------------------------
*/
.video-click-to-play {
    position: relative;
    width: 100%;
    height: 100%;
}

.video-click-to-play__thumbnail {
    position: relative;
    width: 100%;
    height: 100%;
    cursor: pointer;
}

.video-click-to-play__thumbnail img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.video-click-to-play__thumbnail::after {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.25);
    transition: background 0.3s ease;
}

.video-click-to-play__thumbnail:hover::after {
    background: rgba(0, 0, 0, 0.15);
}

.video-click-to-play__btn {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 2;
    background: rgba(255, 255, 255, 0.2);
    border: var(--size-2) solid rgba(255, 255, 255, 0.6);
    border-radius: 50%;
    width: var(--space-80);
    height: var(--space-80);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background 0.3s ease, transform 0.3s ease;
}

.video-click-to-play__btn:hover {
    background: rgba(255, 255, 255, 0.35);
    transform: translate(-50%, -50%) scale(1.08);
}

.video-click-to-play__btn svg {
    margin-left: var(--size-4);
}


/*
|--------------------------------------------------------------------------
| RELATED POSTS SECTION (shared across video / webinar)
|--------------------------------------------------------------------------
*/
.related-posts-section {
    padding: var(--space-80) 0;
    background: var(--c-grey-50, #f8f9fa);
}

.related-posts__heading {
    font-size: clamp(2.2rem, 3vw, 2rem);
    font-weight: 600;
    margin-bottom: var(--size-40);
}

.related-post-card {
    display: flex;
    flex-direction: column;
    text-decoration: none;
    color: inherit;
    transition: transform 0.25s ease, box-shadow 0.25s ease;
    height: 100%;
}

.related-post-card:hover {
    color: inherit;
    text-decoration: none;
}

.related-post-card__image {
    overflow: hidden;
    aspect-ratio: 16 / 9;
    box-shadow: 0 2px 14px 0 rgba(17, 54, 68, 0.10);
    border-radius: .75rem;
}

.related-post-card__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.related-post-card__body {
    padding: var(--size-24);
    display: flex;
    flex-direction: column;
    flex: 1;
}

.related-post-card__category {
	display: inline-block;
	align-self: flex-start;
	background: var(--c-aqua-light);
	color: var(--c-white);
	padding: var(--size-3) var(--size-12);
	border-radius: var(--size-5);
	font-size: var(--size-12);
	font-weight: 600;
	margin-bottom: var(--size-12);
}

.related-post-card__title {
    font-size: var(--size-22);
    font-weight: 600;
    line-height: 1.3;
    margin-bottom: var(--size-8);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.related-post-card__excerpt {
    font-size: var(--size-16);
    line-height: 1.6;
    color: var(--c-grey-600);
    margin-bottom: var(--size-16);
    flex: 1;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.related-post-card__date {
    font-size: 0.8rem;
    color: var(--c-grey-500);
    margin-bottom: var(--size-16);
}

.related-post-card__link {
    display: inline-flex;
    align-items: center;
    gap: var(--size-8);
    font-size: var(--size-16);
    font-weight: 600;
    color: var(--c-teal-dark-800);
    margin-top: auto;
}


.related-post-card__link svg {
    width: var(--size-16);
    height: var(--size-16);
}

@media (max-width: 768px) {
    .video-click-to-play__btn {
        width: var(--space-60);
        height: var(--space-60);
    }

    .video-click-to-play__btn svg {
        width: var(--size-36);
        height: var(--size-36);
    }
}


/*
|--------------------------------------------------------------------------
| HERO SECTION POD - CENTERED LAYOUT
|--------------------------------------------------------------------------
*/
.pod-hero-section--centered .pod-hero__title {
    font-size: clamp(2.65rem, 5vw, 3.75rem);
    line-height: 1.15em;
    color: var(--c-teal-dark-800);
    margin-bottom: var(--size-20);
}

.pod-hero-section--centered .pod-hero__content {
    font-size: 1.125rem;
    color: var(--c-teal-dark-100);
    max-width: 700px;
    margin: 0 auto var(--size-24);
}

.pod-hero-section--centered .accent.tagline {
    display: inline-flex;
    align-items: center;
    gap: var(--size-8);
}

.pod-hero-section--centered .btn {
    margin: var(--size-8) auto 0;
}

.pod-hero-section--centered .pod-hero__image,
.pod-hero-section--centered dotlottie-player,
.pod-hero-section--centered video.pod-hero__image {
    width: 100%;
}

.pod-hero-section--centered .pod-hero__image,
.pod-hero-section--centered video.pod-hero__image {
    box-shadow: rgba(0, 0, 0, 0.12) 0px 8px 40px;
    max-width: 900px;
    position: relative;
    z-index: 1;
    margin: var(--size-8) auto 0 !important;
    border: var(--size-2) solid var(--c-teal-dark-800);
    /* border-radius: .75rem; */
}

video.pod-hero__image {
    display: block;
}

.pod-hero__device-frame-screen .pod-hero__image {
    margin-top: 0;
}

/*
|--------------------------------------------------------------------------
| HERO SECTION POD - BUTTONS (SPLIT / CENTERED / STACKED)
|--------------------------------------------------------------------------
*/
.pod-hero__buttons {
    display: flex;
    gap: var(--size-16);
    margin-top: var(--size-20);
}

.pod-hero__buttons--inline {
    flex-direction: row;
    flex-wrap: wrap;
}

.pod-hero__buttons--stacked {
    flex-direction: column;
    align-items: stretch;
}

.pod-hero__buttons--stacked .cta {
    width: 100%;
    min-width: 16em;
    max-width: max-content;
}

.ghost.cta {
    background-color: transparent;
    color: var(--c-teal-dark-900);
    border: var(--size-1) solid var(--c-teal-dark-900);
}

.ghost.cta:hover {
    background-color: var(--c-teal-dark-900);
    color: var(--c-white);
}

.pod-hero-section.dark .ghost.cta,
.pod-hero-section.alt-2 .ghost.cta {
    color: var(--c-white);
    border-color: var(--c-white);
}

.pod-hero-section.dark .ghost.cta:hover,
.pod-hero-section.alt-2 .ghost.cta:hover {
    background-color: var(--c-white);
    color: var(--c-teal-dark-900);
}

.pod-hero__video-embed {
    position: relative;
    padding-top: 56.25%;
    height: 0;
    overflow: hidden;
    border-radius: var(--radius-16, 16px);
}

.pod-hero__video-embed iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

/* ---- Hero device frame (e.g. laptop) ----
   Insets are measured from the actual frame PNG's screen cutout
   (assets/img/laptop-frame.png, 1440x810 — screen at 188,44 to 1255,681). */
.pod-hero__device-frame {
    position: relative;
    width: 100%;
}

.pod-hero__device-frame::before {
    content: '';
    display: block;
    padding-top: 56.25%;
}

.pod-hero__device-frame-screen {
    position: absolute;
    top: 5.43%;
    left: 13.06%;
    right: 12.85%;
    bottom: 15.93%;
    overflow: hidden;
}

.pod-hero__device-frame-screen img,
.pod-hero__device-frame-screen video,
.pod-hero__device-frame-screen iframe,
.pod-hero__device-frame-screen dotlottie-player {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
    border: 0;
}

.pod-hero__device-frame-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 2;
}

/* YouTube/Vimeo embeds bring their own padding-top aspect-ratio box — override
   it to just fill the screen cutout instead of double-applying an aspect ratio. */
.pod-hero__device-frame-screen .pod-hero__video-embed {
    position: absolute;
    inset: 0;
    padding-top: 0;
    height: 100%;
}

/*** Hero Gradients ***/
.gradient-wrapper {
    position: relative;

	.pod-cta__image {
		position: relative;
		z-index: 1;
	}
}

.gradient-wrapper:before {
    position: absolute;
    content: '';
    right: 100px;
    background-size: contain;
    width: 500px;
    height: 500px;
    background-repeat: no-repeat;
    top: -20px;
    background-color: var(--c-yellow-acid) !important;
    border-radius: 50%;
    filter: blur(47px);
    opacity: 0.85;
}

.gradient-wrapper:after {
    position: absolute;
    content: '';
    left: 130px;
    background-size: contain;
    width: 314px;
    height: 314px;
    background-color: #315F6B;
    background-repeat: no-repeat;
    bottom: 20px;
    border-radius: 50%;
    filter: blur(47px);
    opacity: 0.85;
}

.gradient-wrapper::before,
.gradient-wrapper::after {
    opacity: 0;
    transition: opacity 0.6s ease;
}

/* When ready */
.gradient-wrapper.asset-loaded::before,
.gradient-wrapper.asset-loaded::after {
    opacity: 0.85;
}

.remove-gradient .gradient-wrapper:after,
.remove-gradient .gradient-wrapper:before {
		display: none;
} 
/*** End Hero Gradients ***/

/*
|--------------------------------------------------------------------------
| CONTENT + LINKS + IMAGE POD
|--------------------------------------------------------------------------
*/
.pod-content-links-image .pod-cli__heading {
    font-size: clamp(1.8rem, 4vw, 2.5rem);
    line-height: 1.1;
    color: var(--c-teal-dark-800);
    margin-bottom: var(--size-24);
}

.pod-content-links-image .pod-cli__description {
    font-size: clamp(1.8rem, 4vw, 2.4rem);
    line-height: 1.1em;
    font-weight: 300;
    letter-spacing: -1.4px;
    margin-top: -20px;
}

.pod-content-links-image .pod-cli__intro {
    font-size: 0.9375rem;
    color: var(--c-teal-dark-100);
    margin-bottom: var(--size-24);
    line-height: 1.6;
}

.pod-content-links-image .pod-cli__links {
    display: flex;
    flex-direction: column;
}

.pod-content-links-image .pod-cli__link-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--size-14) 0;
    border-top: var(--size-1) solid var(--c-grey-200);
    text-decoration: none;
    color: var(--c-teal-dark-800);
    font-weight: 600;
    font-size: var(--size-16);
    transition: color 0.2s ease;
}

.pod-content-links-image .pod-cli__link-item:last-child {
    border-bottom: var(--size-1) solid var(--c-grey-200);
}

.pod-content-links-image .pod-cli__link-item:hover {
    color: var(--c-yellow-acid);
}

.pod-content-links-image .pod-cli__link-item svg {
    width: var(--size-22);
    height: var(--size-22);
    flex-shrink: 0;
    transition: transform 0.2s ease;
}

.pod-content-links-image .pod-cli__link-item:hover svg {
    transform: translateX(4px);
}

.pod-content-links-image .pod-cli__image {
    border-radius: var(--size-16);
    width: 100%;
}


/*
|--------------------------------------------------------------------------
| DESKTOP MEDIA QUERIES
|--------------------------------------------------------------------------
*/
@media all and (min-width: 1024px) {
	.pod-team-members:before {
		position: absolute;
		right: 0;
		content: '';
		background-image: url(https://makodatadev.wpenginepowered.com/wp-content/uploads/2026/04/waves.svg);
		width: 100%;
		max-width: 400px;
		height: 250px;
		background-repeat: no-repeat;
		top: 200px;
	}

	.pod-team-members > .container:before {
		position: absolute;
		content: '';
		right: -40%;
		width: 900px;
		height: 1000px;
		top: 100px;
		background-color: var(--c-yellow-acid) !important;
		border-radius: 50%;
		filter: blur(182px);
		opacity: 0.75;
	}

	.pod-team-members > .container:after {
		position: absolute;
		content: '';
		left: -40%;
		width: 900px;
		height: 1000px;
		bottom: 0px;
		background-color: var(--c-yellow-acid) !important;
		border-radius: 50%;
		filter: blur(182px);
		opacity: 0.75;
	}
}

@media all and (min-width: 991px) {
	h1, h2 {
		letter-spacing: -1.4px;
	}

	.tab-section--horizontal .tab-section__nav-item,
	.tab-section--horizontal .tab-section__nav--horizontal,
	.tab-section--horizontal .tab-section__nav--horizontal::before {
		border-radius: 10em !important;
	}

	.tab-section--horizontal .tab-section__panel-asset dotlottie-player {
		padding-bottom: var(--size-60) !important;
	}
	
	.legal-content .content-wrap {
		background-color: #f4f9f9;
		padding: var(--space-70);
		border-radius: var(--space-20);
	}

	.pod-timeline__images .pod-timeline__image--top {
		height: 400px;
	}

	.pod-timeline__images .pod-timeline__image--bottom {
		height: 400px;
		object-position: 68% 100%;
	}
}

/* =============================================
   HORIZONTAL TABS - PREMIUM SLIDE INDICATOR
   ============================================= */

.tab-section--horizontal .tab-section__nav--horizontal {
    display: flex;
	flex-direction: row;
    background: var(--c-white);
    border-radius: .75rem;
    padding: var(--size-8);
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.08),
  0 2px 6px rgba(0, 0, 0, 0.06);
    gap: var(--size-4);
    position: relative;
    overflow: hidden;
    margin: 0 auto -30px;
    width: max-content;
	z-index: 1;

    /* dynamic values */
    --pill-x: 0px;
    --pill-width: 0px;
}

.tab-section--horizontal {
	.tab-section__panel-body {
		padding-right: var(--space-80);
	}

	.tab-section__panel-title {
		font-size: clamp(2.2rem, 3vw, 2.5rem);
	}
}

/* Sliding pill (transform instead of left) */
.tab-section--horizontal .tab-section__nav--horizontal::before {
    content: '';
    position: absolute;
    top: var(--size-6);
    bottom: var(--size-6);
    left: 0;
    width: var(--pill-width);
    transform: translateX(var(--pill-x));
    background: var(--c-teal-dark-800);
    border-radius: .75rem;
    z-index: 1;

    /* smooth, controlled, premium easing */
    transition:
        transform 0.38s cubic-bezier(0.4, 0, 0.2, 1),
        width 0.32s cubic-bezier(0.4, 0, 0.2, 1);
}

.tab-section--horizontal .tab-section__header {
    margin-bottom: 0;
}

.tab-section__nav.tab-section__nav--horizontal .tab-section__nav-item--active {
    background: transparent;
}

.tab-section__nav.tab-section__nav--horizontal .tab-section__nav-item--active:before {
	width: 0;
}

.tab-section--horizontal .tab-section__panel {
    background-color: #F4F9F9;
    padding: 0px;
    border-top-left-radius: .75rem;
    border-top-right-radius: .75rem;
    border: var(--size-1) solid #E5EAEB;
    border-bottom: 0;
}

.tab-section--horizontal .tab-section__panel-asset img,
.tab-section--horizontal .tab-section__panel-asset dotlottie-player,
.tab-section--horizontal .tab-section__panel-asset video {
    width: 100%;
    margin: auto;
    padding: var(--size-80);
    padding-right: var(--size-40);
    border-radius: var(--radius-16, 16px);
}

/* Tabs */
.tab-section--horizontal .tab-section__nav-item {
    position: relative;
    background: transparent;
    border: none;
    padding: var(--size-14) var(--size-32) var(--size-14) var(--size-24);
    font-size: var(--size-16);
    font-weight: 600;
    color: var(--c-grey-600);
    cursor: pointer;
    border-radius: .75rem;
    transition: color 0.25s ease;
    display: inline-flex;
    align-items: center;
    gap: var(--size-10);
    white-space: nowrap;
    z-index: 2;
}

.tab-section__nav.tab-section__nav--horizontal .tab-section__nav-item:before {
    background: transparent;
}

.tab-section--horizontal .tab-section__nav-icon {
    width: 22px;
    height: 22px;
    flex-shrink: 0;
    transition: filter 0.25s ease;
}

.tab-section--horizontal .tab-section__nav-item:hover {
    color: var(--c-teal-dark-900);
}
.tab-section__nav.tab-section__nav--horizontal .tab-section__nav-item--active,
.tab-section__nav.tab-section__nav--horizontal .tab-section__nav-item--active:hover {
    color: var(--c-white);
}

.tab-section--horizontal .tab-section__nav-item--active {
    color: var(--c-teal-dark-900);
    font-weight: 600;
}

.tab-section--horizontal .tab-section__nav-item--active .tab-section__nav-icon {
    filter: brightness(0) invert(1);
}

/* Responsive */
@media (max-width: 991px) {
	.pod-hero__device-frame {
		margin-bottom: 20px;
	}

    .tab-section--horizontal .tab-section__nav--horizontal {
        flex-wrap: wrap;
        justify-content: center;
        gap: var(--size-6);
    }

    .tab-section--horizontal .tab-section__nav-item {
		padding: var(--size-12) var(--size-24);
        padding-left: var(--size-18);
        font-size: var(--size-15);
        width: 100%;
        justify-content: center;
        align-items: center;
    }
	
    .legal-content .content-wrap {
        background-color: #f4f9f9;
        padding: var(--space-30);
        border-radius: var(--space-20);
    }
}

@media (max-width: 768px) {
    .tab-section--horizontal .tab-section__nav--horizontal {
		margin: 0 auto 0px;
        padding: var(--size-8);
        width: 80%;
    }
}

/* Vertical tabs: nav icon alignment */
.tab-section__nav:not(.tab-section__nav--horizontal) .tab-section__nav-item {
    display: flex;
    align-items: center;
}

.light-tabs {
	.tab-section__panel {
		background-color: #F4F9F9;
		border: 1px solid #E5EAEB;
		border-radius: .75rem;
	}

	.tab-section__nav-item {
		color: #93AAB0 !important;
	}

	.tab-section__nav-item::before {
		background-color: #93AAB0 !important;
	}

	.tab-section__nav-item--active {
		background: var(--c-yellow-acid) !important;
		color: var(--c-teal-dark-800) !important;
	}

	.tab-section__nav-item--active::before {
		background-color: var(--c-teal-dark-800) !important;
	}
}

/*
|--------------------------------------------------------------------------
| BENTO GRID POD
|--------------------------------------------------------------------------
*/
.pod-bento-grid.dark,
.pod-bento-grid.alt-2 {
    background-color: var(--c-teal-dark-900);
    color: var(--c-white);
}

.pod-bento-grid.light,
.pod-bento-grid.alt-1 {
    background-color: var(--c-white);
    color: var(--c-teal-dark-900);
}

.pod-bento-grid--showcase.dark,
.pod-bento-grid--showcase.alt-2 {
    background-image: url(https://makodatadev.wpenginepowered.com/wp-content/uploads/2026/03/MakoData-Layer-WWD.svg);
    background-repeat: no-repeat;
    background-position: right;
    background-size: 570px;
}

.pod-bento__header {
    margin-bottom: var(--size-40);
}

.pod-bento__heading {
    font-size: clamp(2.2rem, 4vw, 2.5rem) !important;
    line-height: 1.1;
    color: inherit;
    margin-bottom: var(--size-16);
}

.pod-bento__description {
    font-size: var(--size-16);
    line-height: 1.6;
}

/* ---- Grid ---- */
.pod-bento__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-auto-rows: 250px;        /* Fixed base row height — tighter than minmax */
    grid-auto-flow: dense;
    gap: var(--size-20);
}

/* ---- Card base ---- */
.pod-bento__card {
	border-radius: var(--size-16);
    overflow: hidden;
    position: relative;
    transition: transform 0.25s ease, box-shadow 0.25s ease;
    box-shadow: 0 0 #0000, 0 0 #0000, 0px 0.5px 0px 0px hsla(0, 0%, 100%, .2) inset, 0px 0px 8px 2px hsla(0, 0%, 100%, .12) inset, 0px 0.5px 2px 0px rgba(0, 0, 0, .08), 0px 2px 16px -4px rgba(0, 0, 0, .1);
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}

/* ---- Card inner ---- */
.pod-bento__card-inner {
    display: flex;
    flex-direction: column;
    height: 100%;
}

/* Wide cards: text left, image right */
.pod-bento__card--wide.pod-bento__card--has-image .pod-bento__card-inner {
    flex-direction: row;
}

.pod-bento__card--wide.pod-bento__card--has-image .pod-bento__card-content {
    flex: 1;
}

.pod-bento__card--wide.pod-bento__card--has-image .pod-bento__card-image {
    flex: 1;
}

/* Tall cards: text top, image bottom (image fills remaining) */
.pod-bento__card--tall .pod-bento__card-inner {
    flex-direction: column;
}

.pod-bento__card--tall .pod-bento__card-image {
    flex: 1;           /* Already there — good */
    min-height: 0;     /* Important for flex shrinking */
    overflow: hidden;
}

.pod-bento__card--tall .pod-bento__card-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;   /* Ensures image fills without distortion */
    display: block;
}

/* ---- Card CTA: always the accent colour, regardless of card style ---- */
.pod-bento__card-cta {
    color: var(--c-yellow-acid);
}

/* ---- Card style: dark (default) — white text ---- */
.pod-bento__card--dark {
    background-color: var(--c-teal-dark-800);
}

.pod-bento__card--dark .pod-bento__card-desc {
    color: var(--c-white);
}

/* ---- Card style: light — dark text ---- */
.pod-bento__card--light {
    background-color: var(--c-white);
}

.pod-bento__card--light .pod-bento__card-title,
.pod-bento__card--light .pod-bento__card-title a {
    color: var(--c-teal-dark-800);
}

.pod-bento__card--light .pod-bento__card-desc {
    color: var(--c-grey-600);
}

/* ---- Card style: muted (grey-teal) — white text ---- */
.pod-bento__card--muted {
    background-color: var(--c-grey-400);
}

.pod-bento__card--muted .pod-bento__card-desc {
    color: rgba(255, 255, 255, 0.8);
}

.pod-bento__card--muted .pod-bento__card-title,
.pod-bento__card--muted .pod-bento__card-title a,
.pod-bento__card--dark .pod-bento__card-title,
.pod-bento__card--dark .pod-bento__card-title a {
    color: var(--c-white);
}

/* ---- Card content ---- */
.pod-bento__card-content {
    padding: var(--size-24);           /* Reduced from 28px */
    display: flex;
    flex-direction: column;
    justify-content: flex-end;   /* Text sticks to bottom in normal cards */
}

/* Only tall cards with a background PHOTO need the content pulled out of flow
   to overlay the image — icon-only Tall cards (Showcase style) must keep
   content in normal flow, otherwise the card has nothing to size itself by
   once the grid switches to content-driven row heights (e.g. on mobile). */
.pod-bento__card--tall.pod-bento__card--has-image .pod-bento__card-content {
    justify-content: flex-start;   /* Or 'space-between' if you want more breathing room */
    position: absolute;
    inset: 0;                    /* Covers the entire card */
    z-index: 2;                  /* Above image */
    padding: var(--size-32);               /* Slightly more for tall cards if needed */
}

.pod-bento__card-title {
    font-size: clamp(1.25rem, 2.5vw, 1.75rem);
    font-weight: 600;
    margin-bottom: var(--size-10);
    line-height: 1.2;
}

.pod-bento__card-title a {
    text-decoration: none;
    color: inherit;
    transition: color 0.2s ease;
}

.pod-bento__card-title a:hover {
    color: var(--c-yellow-acid);
}

.pod-bento__card-desc {
    /* font-size: 0.9rem; */
    line-height: 1.55;
    margin: 0;
}

/* ---- Card CTA link ---- */
.pod-bento__card-cta {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 0.875rem;
    font-weight: 600;
    text-decoration: none;
    margin-top: 16px;
    transition: gap 0.2s ease;
}

.pod-bento__card-cta svg {
    width: 18px;
    height: 18px;
}

/* ---- Card image ---- */
.pod-bento__card-image {
    overflow: hidden;
}

.pod-bento__card-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* ---- Card icon (Showcase style) ----
   Icons here are illustrative graphics with irregular (non-square) aspect
   ratios, not simple square glyphs — always size by width and let height
   scale naturally so nothing gets stretched/cropped. */
.pod-bento__card-icon {
    width: 72px;
    margin-bottom: var(--size-16);
}

.pod-bento__card-icon img {
    display: block;
    width: 100%;
    height: auto;
}

/* Corner/edge variants — lifted out of flow so title/description can occupy
   the rest of the card independently. Sized relative to the card so they
   read as full illustrations, not small badges. */
.pod-bento__card-icon--top-right,
.pod-bento__card-icon--bottom-left,
.pod-bento__card-icon--bottom-right,
.pod-bento__card-icon--right,
.pod-bento__card-icon--bottom {
    position: absolute;
    margin-bottom: 0;
}

.pod-bento__card-icon--top-right {
    top: var(--size-24);
    right: var(--size-24);
    width: clamp(70px, 22%, 110px);
}

.pod-bento__card-icon--bottom-left {
    bottom: var(--size-24);
    left: var(--size-24);
    width: clamp(90px, 32%, 160px);
}

.pod-bento__card-icon--bottom-right {
    bottom: var(--size-24);
    right: var(--size-24);
    width: clamp(90px, 25%, 140px);
}

/* Use on Medium (2x1 wide) cards — icon fills the right ~60% of the card,
   bounded on both axes so tall/irregular artwork can't overflow the card;
   object-fit:contain letterboxes instead of cropping or overflowing. */
.pod-bento__card-icon--right {
    top: var(--size-16);
    bottom: var(--size-16);
    right: 0;
    width: 60%;
    height: auto;
}

.pod-bento__card-icon--right img {
    width: 100%;
    height: 100%;
    transform: scale(1.75) translateX(0px) !important;
}

/* Use on Tall (1x2) cards — icon anchored to the bottom, spanning most of the width */
.pod-bento__card-icon--bottom {
    bottom: 0;
    left: -30px;    
	right: var(--size-24);
    width: auto;
    max-width: 85%;
	padding-bottom: var(--size-32);
}

.pod-bento__card--has-icon .pod-bento__card-content {
    justify-content: flex-start;
}

/* Icon-right cards: keep text constrained to the left half so it doesn't run under the icon */
.pod-bento__card-content:has(.pod-bento__card-icon--right) {
    max-width: 40%;
}

/* ---- Feature Links style: full-bleed photo card with overlay + explore link ---- */
.pod-bento-grid--feature_links .pod-bento__card--has-image .pod-bento__card-inner {
    position: relative;
    flex-direction: column;
}

.pod-bento-grid--feature_links .pod-bento__card--has-image .pod-bento__card-image {
    position: absolute;
    inset: 0;
    z-index: 0;
    flex: none;
    min-width: 0;
}

.pod-bento-grid--feature_links .pod-bento__card--has-image .pod-bento__card-image::after {
    content: '';
    position: absolute;
    inset: 0;
	opacity: 0.85;
    background: #466579;
}

.pod-bento-grid--feature_links .pod-bento__card--has-image .pod-bento__card-content {
    position: relative;
    z-index: 1;
    justify-content: center;
    height: 100%;
	padding-right: 40%;
}

.pod-bento-grid--feature_links .pod-bento__card--has-image .pod-bento__card-title,
.pod-bento-grid--feature_links .pod-bento__card--has-image .pod-bento__card-title a,
.pod-bento-grid--feature_links .pod-bento__card--has-image .pod-bento__card-desc {
    color: var(--c-white);
}

/* ---- Bento Grid Mobile Responsive ---- */
@media (max-width: 991px) {

    .pod-bento__grid {
        grid-template-columns: repeat(2, 1fr);
        grid-auto-rows: minmax(180px, auto);
    }

	.pod-bento__card-title {
		font-size: var(--size-34, 2.125rem) !important;
		padding-right: 15%;
	}

	.pod-bento__card--size-tall .pod-bento__card-icon--bottom {
		width: 100% !important;
		margin-top: -30px;
	}

	.pod-bento__card--size-tall .pod-bento__card-icon--bottom img {
		transform: translateX(-65px) !important;
	}

	.pod-bento__card--size-medium .pod-bento__card-icon--right {
		width: 100% !important;
	}

	.pod-bento__card-icon--right img {
		transform: scale(1.35) translateX(0px) !important;
	}

	.pod-bento__card-icon--bottom-right {
		margin-left: auto;
	}

	.pod-bento__card-icon--bottom {
		max-width: 100% !important;
	}

	.pod-bento__card--light .pod-bento__card-desc {
		color: var(--c-teal-dark-900);
		padding-right: 15%;
	}

	.pod-bento-grid--feature_links .pod-bento__card:nth-child(1) .pod-bento__card-inner, 
	.pod-bento-grid--feature_links .pod-bento__card:nth-child(2) .pod-bento__card-inner,  
	.pod-bento-grid--feature_links .pod-bento__card:nth-child(4) .pod-bento__card-inner {
		min-height: 300px;
		justify-content: center;
	}

	.pod-bento__card--dark .pod-bento__card-desc {
		max-width: 75%;
	}

	.pod-bento__grid {
		gap: var(--size-25);
	}

	.stages-row {
		gap: var(--size-25);
	}

	.stage-block__desc {
		font-size: var(--fs-md);
	}

    /* Wide cards that span 2 still fit in 2-col grid */
    .pod-bento__card--wide.pod-bento__card--has-image .pod-bento__card-inner {
        flex-direction: column;
    }

	.stage-block__body {
		flex-direction: column;
	}

	.stage-block__text {
		padding-right: 3rem;
	}
}

@media (max-width: 575px) {
    .pod-bento__grid {
        grid-template-columns: 1fr;
        grid-auto-rows: min-content;
        grid-auto-flow: row;
    }

    .pod-bento__card {
        grid-column: span 1 !important;
        grid-row: span 1 !important;
        height: auto;
    }

    .pod-bento__card-inner {
        height: auto;
    }

    .pod-bento__card-content {
        padding: var(--size-25);
    }
}

/* Icon position variants (Right, Bottom, Top Right, Bottom Left/Right) are sized
   and anchored for the wide (2x1) / tall (1x2) card shapes that only exist in the
   3-column desktop grid. Once cards stack into a single column on mobile, every
   card becomes the same width, so those absolute placements would overflow or
   crowd the text. Fall back to an in-flow icon sitting after the text (bottom of
   the card) instead — layout only, none of the type sizes below change. Size
   still varies by Card Size so cards keep a natural height difference rather
   than all reading as the same visual weight. */
@media (max-width: 767px) {
    .pod-bento__card--has-icon .pod-bento__card-content {
        display: flex;
        flex-direction: column;
    }

    .pod-bento__card-icon--top-right,
    .pod-bento__card-icon--bottom-left,
    .pod-bento__card-icon--bottom-right,
    .pod-bento__card-icon--right,
    .pod-bento__card-icon--bottom {
        position: static;
        top: auto;
        left: auto;
        right: auto;
        bottom: auto;
        transform: none;
        height: auto;
        margin-bottom: 0;
        margin-top: var(--size-20);
        order: 2;
        width: 130px;
    }

    .pod-bento__card--size-medium .pod-bento__card-icon--top-right,
    .pod-bento__card--size-medium .pod-bento__card-icon--bottom-left,
    .pod-bento__card--size-medium .pod-bento__card-icon--bottom-right,
    .pod-bento__card--size-medium .pod-bento__card-icon--right,
    .pod-bento__card--size-medium .pod-bento__card-icon--bottom {
        width: 170px;
    }

    .pod-bento__card--size-tall .pod-bento__card-icon--top-right,
    .pod-bento__card--size-tall .pod-bento__card-icon--bottom-left,
    .pod-bento__card--size-tall .pod-bento__card-icon--bottom-right,
    .pod-bento__card--size-tall .pod-bento__card-icon--right,
    .pod-bento__card--size-tall .pod-bento__card-icon--bottom,
    .pod-bento__card--size-large .pod-bento__card-icon--top-right,
    .pod-bento__card--size-large .pod-bento__card-icon--bottom-left,
    .pod-bento__card--size-large .pod-bento__card-icon--bottom-right,
    .pod-bento__card--size-large .pod-bento__card-icon--right,
    .pod-bento__card--size-large .pod-bento__card-icon--bottom {
        width: 200px;
    }

    .pod-bento__card-icon--right img,
    .pod-bento__card-icon--bottom img {
        width: 100%;
        height: auto;
        object-fit: contain;
    }

    .pod-bento__card-title,
    .pod-bento__card-desc,
    .pod-bento__card-cta {
        order: 1;
    }

    .pod-bento__card-content:has(.pod-bento__card-icon--right) {
        max-width: 100%;
    }
}


/*
|--------------------------------------------------------------------------
| MARQUEE TAGS POD
|--------------------------------------------------------------------------
*/
.pod-marquee-tags {
    overflow: hidden;
}

.tag-marquee__row {
    display: flex;
    gap: var(--size-16);
    width: max-content;
    white-space: nowrap;
    animation: marquee-seamless 100s linear infinite;
    padding: var(--size-8) 0;
    --marquee-gap: var(--size-16);
}

.tag-marquee__group {
    display: flex;
    gap: var(--size-16);
    flex: 0 0 auto;
}

@keyframes marquee-seamless {
    from { transform: translate3d(0, 0, 0); }
    to   { transform: translate3d(calc(-50% - var(--marquee-gap, 0px) / 2), 0, 0); }
}

.tag-marquee--two-rows .tag-marquee__row--bottom {
    animation-delay: -20s; /* stagger via time offset — same direction as top, different visible content */
}

.tag-marquee:hover .tag-marquee__row,
.pod-marquee-tags:hover .tag-marquee__row {
    animation-play-state: paused;
}

.tag-marquee__item {
    flex-shrink: 0;
}

.tag-marquee__pill {
    display: inline-block;
    color: #93AAB0;
    font-size: 0.875rem;
    font-weight: 400;
    padding: 10px 20px;
    border-radius: 10em;
    white-space: nowrap;
    line-height: 1.4;
    box-shadow: rgb(0 0 0 / 10%) 0px 2px 15px 0px;
    letter-spacing: 1px;
    text-transform: uppercase;
}

/*
|--------------------------------------------------------------------------
| STATS SECTION POD
|--------------------------------------------------------------------------
*/
.pod-stats-section .pod-stats__media {
    position: relative;
}

.pod-stats-section .pod-stats__image,
.pod-stats-section dotlottie-player {
    border-radius: var(--size-16);
    width: 100%;
}

.pod-stats-section .pod-stats__heading {
    font-size: clamp(2.2rem, 3vw, 2.5rem);
    font-weight: 600;
    line-height: 1.2;
}

.pod-stats-section .pod-stats__description {
    font-size: 1rem;
    line-height: 1.7;
    margin-bottom: var(--size-40);
}

/* Stats grid — inspired by page-stats with yellow-acid accent border */
.pod-stats__grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--size-24);
}

.pod-stats__item {
    border-left: var(--size-2) solid var(--c-yellow-acid);
    padding-left: var(--size-25);
    padding-top: var(--size-8);
    padding-bottom: var(--size-8);
}

.pod-stats__number {
    font-size: clamp(2.2rem, 4vw, 3rem);
    font-weight: 600;
    line-height: 1;
    margin-bottom: var(--size-8);
}

.pod-stats__prefix,
.pod-stats__suffix {
    font-size: 0.65em;
    font-weight: 600;
    opacity: 0.7;
    vertical-align: top;
}

.pod-stats__label {
    font-size: 0.9375rem;
    line-height: 1.4;
    opacity: 0.7;
}

/* Dark background variant — text colours auto-adapt */
.pod-stats-section.bg-dark-teal .pod-stats__heading,
.pod-stats-section.bg-dark-teal .pod-stats__number {
    color: var(--c-white);
}

.pod-stats-section.bg-dark-teal .pod-stats__description,
.pod-stats-section.bg-dark-teal .pod-stats__label {
    color: rgba(255, 255, 255, 0.7);
}

/* Light background variant */
.pod-stats-section:not(.bg-dark-teal) .pod-stats__heading,
.pod-stats-section:not(.bg-dark-teal) .pod-stats__number {
    color: var(--c-teal-dark-800);
}

.pod-stats-section:not(.bg-dark-teal) .pod-stats__description {
    color: var(--c-teal-dark-100);
}

.pod-stats-section:not(.bg-dark-teal) .pod-stats__label {
    color: var(--c-grey-600);
}

@media (max-width: 991px) {
    .pod-stats-section .pod-stats__media {
        margin-bottom: var(--size-40);
    }

    .pod-stats__grid {
        grid-template-columns: 1fr;
    }
}

/*
|--------------------------------------------------------------------------
| Homepage Reviews
|--------------------------------------------------------------------------
*/
.homepage_reviews {
	.pod-testimonials-posts__stars .star {
		color: var(--c-white);
	}
}

/*
|--------------------------------------------------------------------------
| Homepage Stats
|--------------------------------------------------------------------------
*/
.homepage_stats {
    .pod-stats__media {
        padding-right: 2rem;
    }

    .pod-stats__content {
        padding-left: 2rem;
    }

    .pod-stats__media:before {
        position: absolute;
        content: "";
        background-image: url(https://makodatadev.wpenginepowered.com/wp-content/uploads/2026/03/yellow-acid-gradient.webp);
        right: 0;
        background-size: contain;
        width: 500px;
        height: 500px;
        background-repeat: no-repeat;
        top: -60px;
        transform: scale(1.45);
    }

	.pod-stats__item {
		padding: var(--size-25);
		background-color: #F4F9F9;
		border: 1px solid #E5EAEB;
		border-radius: .75rem;
	}
}

/*
|--------------------------------------------------------------------------
| CTA SECTION POD
|--------------------------------------------------------------------------
*/
.pod-cta-section .pod-cta__content {
    max-width: 700px;
    margin: 0 auto var(--size-40);
}

.pod-cta-section {
    .gradient-wrapper:before {
        top: 40px;
        width: 400px;
        height: 400px;
        right: 180px;
    }

	.gradient-wrapper::after {
        top: 120px;
        width: 240px;
        height: 240px;
        left: 180px;
        opacity: 1;
	}
}

.pod-cta-section .pod-cta__heading {
    font-size: clamp(2.2rem, 4vw, 2.5rem);
    line-height: 1.1;
    color: var(--c-teal-dark-800);
    margin-bottom: var(--size-16);
}

.pod-cta-section .pod-cta__description {
    font-size: 1.125rem;
    color: var(--c-teal-dark-100);
    line-height: 1.6;
    margin-bottom: var(--size-24);
}

.pod-cta-section .pod-cta__image {
    border-radius: var(--size-16);
    width: 100%;
    display: block;
    margin: 0 auto;
}

.pod-cta-section dotlottie-player {
    width: 100%;
    display: block;
    margin: 0 auto;
}

/*
|--------------------------------------------------------------------------
| HUBSPOT MEETING
|--------------------------------------------------------------------------
*/
.hubspot-meeting-wrap {
    max-width: 100%;
    margin: 0 auto;
    overflow: hidden;
}

.hubspot-meeting-wrap iframe {
  width: 100%;
  height: 850px;
  border: none;
}

/*
|--------------------------------------------------------------------------
| FOOTER SECTION
|--------------------------------------------------------------------------
*/
section.footer {
    h4 {
        font-size: var(--size-16) !important;
        font-weight: 600 !important;
        color: var(--c-white);
        letter-spacing: 0.02rem;
    }

	.main-brand {
		padding-right: 6rem;
		font-size: 14px;

		img {
			width: 200px;
			margin-bottom: 20px;
		}
	}

	ul.menu {
		list-style: none;
		padding-left: 0;
		margin-bottom: 0;

		a {
			text-decoration: none;
		}

		li {
			font-size: 14px;
		}

		li:last-child {
			margin-bottom: 0;
		}
	}
}

section.footer-bar .container {
    font-size: var(--size-14);
    padding-bottom: var(--size-22);
    padding-top: var(--size-22);
    border-top: var(--size-1) solid;
}

.social-icons {
    display: flex;
    flex-direction: row;
    gap: 10px;
}

/*
|--------------------------------------------------------------------------
| MOBILE MEDIA QUERIES
|--------------------------------------------------------------------------
*/
@media all and (max-width: 991px) {

/*
|--------------------------------------------------------------------------
| HERO / CTA / CASE STUDY REVIEWS
|--------------------------------------------------------------------------
*/

	.mobile-hero-asset {
		margin-top: 0 !important;
	}

	/* Media appears before the text on mobile, regardless of layout (Split,
	   Stacked, Centered). For Split/Centered the text row and the media row
	   are sibling .row elements inside .container, so container needs to be
	   a flex column for `order` to take effect; for Stacked, the two columns
	   already sit inside a Bootstrap .row (flex by default), so this is a
	   no-op there beyond the order itself. */
	.pod-hero-section .container {
		display: flex;
		flex-direction: column;
	}

	.pod-hero__media-col {
		order: -1;
	}

	/* Explicit fallback: the pod's outer <section> carries BOTH
	   .pod-case-study-reviews and .real-world-section on the SAME element, so
	   the nested ".solution-template-default, .pod-case-study-reviews { .real-world-section .testimonials-section__card {...} }"
	   rule above compiles to require .real-world-section as a *descendant* of
	   .pod-case-study-reviews — which never matches when they're the same
	   element. Target the pod directly instead so the fixed 520px desktop
	   height doesn't get forced onto a much narrower mobile column. */
	.pod-case-study-reviews .testimonials-section__card {
		min-height: auto !important;
		padding: var(--size-25) var(--size-20) !important;
	}

	.pod-case-study-reviews .testimonials-section .swiper-pagination {
		bottom: 0;
	}

    .tagline {
        font-size: 14px;
        margin-bottom: var(--size-24);
        letter-spacing: 0.02rem;
    }

    .gradient-wrapper {
        margin-left: var(--size-5);
        margin-right: var(--size-5);
    }

    .gradient-wrapper:before {
        width: 200px;
        height: 200px;
        right: 0px;
        top: -10px;
        opacity: 1 !important;
        filter: blur(25px);
    }

    .gradient-wrapper:after {
        width: 160px;
		height: 160px;
        left: 10px;
        filter: blur(25px);
        opacity: 1 !important;
        bottom: 10px;
    }

	.pod-cta-section .gradient-wrapper:after {
		width: 100px;
		height: 100px;
		left: 40px;
		top: 40px;
	}

	.pod-cta-section .gradient-wrapper:before {
		width: 180px;
		height: 180px;
		top: 0;
		right: 30px;
		opacity: 0.85 !important;
	}


/*
|--------------------------------------------------------------------------
| SECTION SPACING
|--------------------------------------------------------------------------
*/
	.key-points,
	.tab-section,
	.value-stack,
	.value-section,
	.pod-bento-grid,
	.case-study-cta,
	.pod-cta-section,
	.testimonials-section,
	.pod-testimonials-posts,
	.pod-content-links-image {
		padding-top: var(--size-60) !important;
		padding-bottom: var(--size-60) !important;
	}

	.pod-tabs-section.tab-section--horizontal {
		padding-top: 0 !important;
		padding-bottom: 0 !important;
	}

/*
|--------------------------------------------------------------------------
| HERO SECTION / VIDEO
|--------------------------------------------------------------------------
*/
	.page-hero {
		.page-hero__media {
			min-height: 240px;
		}

		.page-hero__breadcrumbs {
			margin-bottom: var(--space-20);
		}
	}

	.page-hero,
	.pod-hero-section {
		padding-top: 120px !important;
		padding-bottom: var(--size-60) !important;
	}

	.page-hero__media-play-btn svg {
		width: var(--size-50);
	}	

	.pod-content-links-image .pod-cli__image {
		transform: translate(0px, 5px) scale(1.2);
	}

	.pod-hero-section--centered .btn {
		margin: var(--size-8) auto var(--size-30);
	}

/*
|--------------------------------------------------------------------------
| FILTER
|--------------------------------------------------------------------------
*/
	.dcb-filter-bar {
		margin-bottom: 0;
		padding-bottom: var(--size-35);
	}

	.dcb-list-wrapper,
	.related-list-wrapper {
		gap: var(--size-40);
	}

	.dcb-card-standard-list .dcb-card-content {
		flex: 0 0 100% !important;
		max-width: 100% !important;
	}

	.dcb-card-standard .dcb-card-title {
		font-size: var(--size-25);
	}

	.dcb-card-standard-list {
		padding: var(--space-30, 30px) 0;
	}

	.learn-more {
		font-size: var(--size-16) !important;
	}

/*
|--------------------------------------------------------------------------
| LOGOS
|--------------------------------------------------------------------------
*/
	/** Template Logos **/
    .logo-marquee {
		padding: var(--space-60) 0 !important;

        .logo-marquee__item {
            padding: 0 var(--size-15);
        }

        .logo-marquee__row {
            display: flex;
            gap: 0;
        }

        .logo-marquee__row--bottom {
            margin-top: 20px;
            padding-left: 0;
        }
    }

	/** Pod Logos **/
    .pod-marquee-logos {
        padding-top: 0 !important;
        padding-bottom: 0 !important;

        .logo-marquee__item {
            padding: 0 var(--size-15);
        }

        .logo-marquee__row {
            display: flex;
            gap: 0;
        }

        .logo-marquee__row--bottom {
            margin-top: 20px;
            padding-left: 0rem;
        }
    }

	.about_logos {
		padding: var(--size-60) 0 !important;
	}

	.logo-grid {
		margin-left: -10px;
    	margin-right: -10px;

		li.medium {
			width: 33.3333% !important;
		}

		ul {
			padding-left: 0;

			li .image {
				width: 130px !important;
				height: 56px !important;
			}
		}
	}
	
/*
|--------------------------------------------------------------------------
| TABS
|--------------------------------------------------------------------------
*/
    .tab-section__nav.tab-section__nav--horizontal .tab-section__nav-item:before {
        background: transparent;
        width: 100%;
        z-index: -1;
        border-radius: .75rem;
    }

    .tab-section__nav.tab-section__nav--horizontal .tab-section__nav-item--active:before {
        left: 0;
        background: var(--c-teal-dark-800);
    }

    .tab-section--horizontal .tab-section__nav--horizontal::before {
        background-color: transparent;
    }

    .tab-section--horizontal {
        .tab-section__panel-body {
            padding-right: var(--size-35);
            padding-left: var(--size-35);
        }

        .tab-section__panel {
			margin-top: -5rem;
            padding-top: var(--space-80) !important;
            padding-bottom: var(--size-30) !important;
            padding-left: var(--size-10) !important;
            padding-right: var(--size-10) !important;
            margin-bottom: var(--size-60) !important;
            border: var(--size-1) solid #E5EAEB !important;
            border-radius: .75rem !important;
        }

        .tab-section__panel-asset img, 
        .tab-section__panel-asset dotlottie-player, 
        .tab-section__panel-asset video {
            padding: var(--size-35);
        }
    }

	.tab-section {
		.tab-section__panel {
			padding-left: var(--size-30);
			padding-right: var(--size-30);
			padding-top: var(--size-30);
			padding-bottom: var(--size-20);
		    border-radius: .75rem;
			border-bottom: var(--size-1) solid var(--c-teal-dark-100);
		}

		.tab-section__panel--active {
            display: block !important;
        }

		.tab-section__panel img {
			width: 100% !important;
		}
	}

	.light-tabs {
		.tab-section__panel {
			border: var(--size-1) solid #E5EAEB;
		}
	}

	.tab-section__panel h3.tab-section__panel-title {
		font-size: var(--size-24);
	}

/*
|--------------------------------------------------------------------------
| BENTO GRID
|--------------------------------------------------------------------------
*/
	.pod-bento__card--wide.pod-bento__card--has-image .pod-bento__card-content {
		flex: initial;
		padding-right: 0;
	}

/*
|--------------------------------------------------------------------------
| STATS
|--------------------------------------------------------------------------
*/
	.homepage_stats {

		.pod-stats__media,
		.pod-stats__content {
			padding-left: var(--size-10);
			padding-right: var(--size-10);
		}
	}

/*
|--------------------------------------------------------------------------
| EQUAL PADDING - KEYPOINTS
|--------------------------------------------------------------------------
*/
	.equal-padding {
		padding-top: var(--size-25);
		padding-left: var(--size-30);
		padding-right: var(--size-30);
		padding-bottom: 0;
	}

/*
|--------------------------------------------------------------------------
| HOMEPAGE STATS
|--------------------------------------------------------------------------
*/
	.homepage_stats {
		.pod-stats__media:before {
			width: 300px;
			height: 300px;
			left: 0;
			top: -20px;
			transform: scale(1.45);
		}
	}

/*
|--------------------------------------------------------------------------
| TESTIMONIALS
|--------------------------------------------------------------------------
*/
	.pod-testimonials-posts__desc {
		margin-bottom: var(--size-20);
	}

	.swiper-pagination {
		position: relative;
		display: flex;
		flex-direction: row;
		gap: 6px;
	}

	.swiper-pagination-bullet-active {
		background: var(--c-white);
	}

	.pod-testimonials-posts__author {
		padding-bottom: var(--size-30);
	}

/*
|--------------------------------------------------------------------------
| CTA IMAGE
|--------------------------------------------------------------------------
*/
	.pod-cta__image {
		transform: scale(1.3) !important;
	}


	.col-md-6.p-5.position-relative {
		padding-top: var(--size-30) !important;
		padding-left: var(--size-20) !important;
		padding-right: var(--size-20) !important;
	}

/*
|--------------------------------------------------------------------------
| CASE STUDY - BOTTOM CTA SECTION
|--------------------------------------------------------------------------
*/

	.case-hero-section {
		padding-top: 120px !important;
		padding-bottom: var(--size-40) !important;
	}
	
	.type-case-study .page-hero {
		padding-bottom: var(--size-10) !important;
	}

	.type-case-study .value-stack {
		padding-top: var(--size-40) !important;
	}

	.case-study-product__card,
	.cs-featured-image__img {
		height: 376px;
	}

	.type-case-study .page-stats {
		padding-left: var(--size-20) !important;
		padding-right: var(--size-20) !important;
		padding-top: var(--size-60) !important;
		padding-bottom: var(--size-60) !important;
	}

	.case-study-cta__card.mb-5:last-child {
		margin-bottom: 0 !important;
	}

	.client-logo-overlay {
		width: 170px;
		padding: var(--size-5) !important;
	}

	.cs-content-section .row {
		padding: var(--space-60) 0;
	}

	.cs-stats__value {
		font-size: var(--size-40);
	}

	.cs-stats__item {
		margin-bottom: var(--size-20);
	}
	
	.cs-stats__value,
	.page-stats__value {
		padding-bottom: var(--size-10);
	}

	.related-work__item {
		padding: var(--space-30, 30px) 0;
	}

	.related-work__item .align-items-center {
		display: flex;
		flex-direction: column-reverse;
		gap: var(--size-20, 20px);
	}

	.product-feature-template-default {
		.page-hero__content-col {
			padding-bottom: var(--size-40);
		}
	} 

/*
|--------------------------------------------------------------------------
| SOLUTION
|--------------------------------------------------------------------------
*/

	.type-solution .page-hero {
		padding-bottom: 0 !important;
	}

	/* .pod-case-study-reviews is added here alongside .solution-template-default
	   so the Case Study + Reviews pod (used on any page via the flexible-content
	   "pods" system) gets the same mobile layout fixes as the single-solution.php
	   template it was extracted from — without this, .stat-block/.case-study-cta__card/
	   .testimonials-section never get their mobile-specific repositioning because
	   .solution-template-default is a body class that only exists on that one
	   page template. */
	.solution-template-default, .pod-case-study-reviews {

		.page-stats__value {
			font-size: var(--size-40);
		}

		.value-section {
			padding-bottom: 0 !important;
		}

		.page-stats__item {
			margin-bottom: 20px;
		}

		section.page-stats {
			padding-bottom: 7rem !important;
		}

		.case-study-cta__card {
			height: auto !important;
		}

		.case-study-cta__card.solution {
			flex-direction: column !important;
			background: var(--c-white) !important;
			border-radius: var(--size-16);
			overflow: hidden;
			position: relative;
		}

		.case-study-cta__card.solution::before {
			height: 300px !important;
			border-radius: var(--size-16) var(--size-16) 0 0;
		}

		.case-study-cta__card.solution > img.img-fluid {
			height: 300px !important;
			width: 100% !important;
			object-fit: cover !important;
			position: relative;
			flex-shrink: 0;
		}

		.case-study-cta__card.solution .stat-block .value {
			font-size: 2.5rem;
		}

		.case-study-cta__card.solution .stat-block .case-study-cta__content {
			float: right;
			max-width: 150px;
		}

		.case-study-cta__card.solution .stat-block .client-logo-overlay {
			position: absolute;
			top: var(--size-30);
			left: var(--size-20);
			float: none;
			z-index: 2;
		}

		.case-study-cta__heading {
			margin-bottom: var(--size-20) !important;
			font-size: clamp(2.2rem, 3vw, 2.5rem);
		}

		.case-study-cta__card.solution .case-study-overlay {
			position: relative !important;
			bottom: auto !important;
			left: auto !important;
			padding: var(--size-30) var(--size-20) !important;
			background: var(--c-teal-dark-900);
			color: var(--c-white);
		}

		.case-study-cta__card.solution .case-study-overlay h3 {
			color: var(--c-white);
			font-size: var(--size-20);
			margin-bottom: var(--size-16);
		}

		.real-world-section .testimonials-section__card {
			min-height: auto;
			padding: var(--size-25) var(--size-20);
		}

		/* ----- Testimonials Section ----- */
		.testimonials-section {
			padding-top: 0 !important;
			padding-bottom: var(--size-20) !important;

			.swiper-container {
					background-color: var(--c-white);
					padding-bottom: var(--size-30);
			}
		}

		section.related-features .mb-5 {
			margin-bottom: var(--size-30) !important;
		}

		.real-world-section .testimonials-section .swiper-pagination {
			bottom: 0;
		}
	}


	.blog-section {
		article.dcb-card.dcb-card-standard {
			padding-bottom: var(--size-35);
			border-bottom: var(--size-1) solid var(--c-teal-dark-800);
			margin-bottom: var(--size-20);
		}

		.dcb-card-content {
			padding: 0;
		}
	}
	
/*
|--------------------------------------------------------------------------
| SINGLE WEBINAR + SINGLE VIDEO
|--------------------------------------------------------------------------
*/
	.single-video,
	.single-webinar {
		header.entry-header {
			padding: 7.75rem var(--size-10) 7rem var(--size-10);
		}

		.content-sidear {
			margin-bottom: var(--size-35) !important;
		}

		.video-sidebar {
			margin-top: var(--size-25);
		}

		.related-videos-section {
			padding-top: var(--size-60) !important;
			padding-bottom: var(--size-60) !important;
		}

		.related-videos-section h2.section-title {
			color: var(--c-white);
			margin-bottom: 0 !important;
		}
		
	}

/*
|--------------------------------------------------------------------------
| SINGLE WEBINAR + SINGLE VIDEO
|--------------------------------------------------------------------------
*/
	.single-post {
		header.entry-header {
			padding: 7.75rem var(--size-10) 7rem var(--size-10);
		}
	}

/*
|--------------------------------------------------------------------------
| FOOTER SECTION
|--------------------------------------------------------------------------
*/
	section.footer {
		padding-left: var(--size-10);
		padding-right: var(--size-10);

		.col-md-2 {
			margin-bottom: 1.5rem;
		}

		.main-brand {
			padding-right: 0;
		}
	}

	section.footer-bar {
		padding-bottom: var(--size-10) !important;
	}
}


/*
|--------------------------------------------------------------------------
|  FAQ ACCORDION
|--------------------------------------------------------------------------
*/

.faq-accordion {
	margin: 0 auto;
}

.faq-accordion__item {
	border-bottom: 1px solid var(--c-grey-200);
}

.faq-accordion__item:first-child {
	border-top: 1px solid var(--c-grey-200);
}

.faq-accordion__trigger {
	display: flex;
	align-items: center;
	width: 100%;
	padding: var(--size-24) 0;
	background: none;
	border: none;
	cursor: pointer;
	text-align: left;
	gap: var(--size-16);
	transition: color 0.3s ease;
}

.faq-accordion__trigger:hover {
	color: var(--c-teal-dark-800);
}

.faq-accordion__number {
	flex-shrink: 0;
	width: var(--size-40);
	height: var(--size-40);
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	border: 1px solid var(--c-grey-400);
	font-size: var(--size-14);
	font-weight: 600;
	color: var(--c-teal-dark-800);
	transition: all 0.3s ease;
}

.faq-accordion__item.is-open .faq-accordion__number {
	background-color: var(--c-teal-dark-800);
	border-color: var(--c-teal-dark-800);
	color: var(--c-white);
}

.faq-accordion__question {
	flex: 1;
	font-size: clamp(1rem, 2vw, 1.25rem);
	font-weight: 600;
	color: var(--c-teal-dark-800);
	line-height: 1.4;
}

.faq-accordion__icon {
	flex-shrink: 0;
	width: var(--size-24);
	height: var(--size-24);
	position: relative;
	margin-left: auto;
}

.faq-accordion__icon::before,
.faq-accordion__icon::after {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	background-color: var(--c-teal-dark-800);
	transition: transform 0.4s ease;
}

.faq-accordion__icon::before {
	width: 16px;
	height: 2px;
	transform: translate(-50%, -50%);
}

.faq-accordion__icon::after {
	width: 2px;
	height: 16px;
	transform: translate(-50%, -50%);
}

.faq-accordion__item.is-open .faq-accordion__icon::after {
	transform: translate(-50%, -50%) rotate(90deg);
}

.faq-accordion__panel {
	overflow: hidden;
	max-height: 0;
	transition: max-height 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

.faq-accordion__item.is-open .faq-accordion__panel {
	max-height: 500px;
	transition: max-height 0.7s cubic-bezier(0.4, 0, 0.2, 1);
}

.faq-accordion__answer {
	padding: 0 0 var(--size-24) calc(var(--size-40) + var(--size-16));
	font-size: var(--size-16);
	line-height: 1.7;
	color: var(--c-grey-600);
}

.faq-accordion__answer p:last-child {
	margin-bottom: 0;
}

/* FAQ Accordion — Tablet */
@media (max-width: 991px) {
	.faq-accordion {
		max-width: 100%;
	}

	.faq-accordion__number {
		width: var(--size-36);
		height: var(--size-36);
		font-size: var(--size-13);
	}

	.faq-accordion__question {
		font-size: clamp(0.95rem, 2vw, 1.125rem);
	}

	.faq-accordion__answer {
		padding-left: calc(var(--size-36) + var(--size-16));
	}
}

/* FAQ Accordion — Mobile */
@media (max-width: 768px) {
	.faq-accordion__trigger {
		padding: var(--size-16) 0;
		gap: var(--size-12);
	}

	.faq-accordion__number {
		width: var(--size-32);
		height: var(--size-32);
		font-size: var(--size-12);
	}

	.faq-accordion__question {
		font-size: var(--size-16);
	}

	.faq-accordion__icon {
		width: var(--size-20);
		height: var(--size-20);
	}

	.faq-accordion__icon::before {
		width: 12px;
	}

	.faq-accordion__icon::after {
		height: 12px;
	}

	.faq-accordion__answer {
		padding: 0 0 var(--size-16) calc(var(--size-32) + var(--size-12));
		font-size: var(--size-15);
		line-height: 1.6;
	}
}

/*
|--------------------------------------------------------------------------
|  SEARCH RESULTS MASONRY
|--------------------------------------------------------------------------
*/

.search-results__grid {
	columns: 3;
	column-gap: var(--size-25);
}

.search-results__item {
	break-inside: avoid;
	margin-bottom: var(--size-35);
}

.search-results__item {
    .card.feature-card {
        border-radius: 0;
        background: transparent;
        box-shadow: none;
        border: none;
        display: flex;
        gap: 20px;
        flex-direction: column;
    }

    .card.feature-card.has-thumbnail .card-img-top {
        box-shadow: 0 2px 14px 0 rgba(17, 54, 68, 0.10);
        border-radius: .75rem;
        aspect-ratio: 16 / 9;
        position: relative;
        overflow: hidden;
        object-fit: cover;
    }

	.card.feature-card.no-thumbnail {
		box-shadow: 0 2px 14px 0 rgba(17, 54, 68, 0.10);
		border-radius: .75rem;
	}	

    .card-body {
        padding: 0 var(--size-24) !important;
        gap: var(--size-12);
    }

	.card.feature-card.no-thumbnail .card-body {
		padding: var(--size-24) var(--size-24) !important;
	}

	.category-pill {
		display: inline-block;
		align-self: flex-start;
		background: var(--c-aqua-light);
		color: var(--c-white);
		padding: var(--size-3) var(--size-12);
		border-radius: var(--size-5);
		font-size: var(--size-12);
		font-weight: 600;
	}

	.card-title, .category-pill, .feature-card__desc {
		margin-bottom: 0 !important;
	}
	
    .feature-card__title a {
        color: var(--c-teal-dark-800) !important;
        text-decoration: blink;
    }

}

.search-results {
    .form-control {
        padding-top: var(--size-12);
        padding-bottom: var(--size-12);
        padding-right: var(--size-24);
        padding-left: var(--size-24);
        outline: none;
        border: none;
        box-shadow: none !important;
    }

    .search-form {
        width: 100%;
        max-width: 550px;
        display: flex;
        flex-direction: row;
        justify-content: center;
		margin: auto;
    }
}

section.results {
    padding-top: var(--size-80);
    padding-bottom: var(--size-80);
}

.page-not-found .form-control {
    border: 1px solid #d2d2d2;
    padding-top: var(--size-11);
    padding-bottom: var(--size-11);
}

.error404 .page-hero {
    padding: 9.75rem 0 var(--space-60) 0;
}

@media (max-width: 991px) {
	.search-results__grid {
		columns: 2;
	}
}

@media (max-width: 768px) {
	.search-results__grid {
		columns: 1;
	}
}

/*
|--------------------------------------------------------------------------
|  CONTACT FORM
|--------------------------------------------------------------------------
*/
.makodata-form {
	.gform_heading {
	    display: none;
	}

	.col-md-8.left {
	    padding-right: 5rem;
	}

	#gform_wrapper_1[data-form-index="0"].gform-theme {
	    padding: 40px 50px;
	    background-color: #f4f9f9;
	    border-radius: var(--space-20);
	    border: 0.625px solid rgba(49, 95, 107, 0.18);
	}

	.gform-theme--foundation .ginput_complex input, 
	.gform-theme--foundation .ginput_complex select, 
	.gform-theme--foundation .gfield .ginput_password.large, 
	.gform-theme--foundation .gfield input.large, 
	.gform-theme--foundation .gfield select.large {
	    height: 48px;
	    border-radius: 10px;
	    box-shadow: none;
	    border: 0.625px solid rgba(49, 95, 107, 0.18);
	}

	.gform-theme--foundation .gfield textarea.medium {
	    min-block-size: 9rem;
	    border-radius: 10px;
	    box-shadow: none;
	    border: 0.625px solid rgba(49, 95, 107, 0.18);
	}
}


input.gform_button.button.gform-button--width-full {
    background: var(--c-yellow-acid) !important;
    border: var(--size-1) solid var(--c-yellow-acid) !important;
    color: var(--c-teal-dark-900, #003a49) !important;
    padding: var(--size-14) var(--size-18) !important;
    border-radius: var(--size-8) !important;
    font-size: var(--size-16) !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    transition: opacity 0.2s, transform 0.2s !important;
    box-shadow: none !important;
    height: auto !important;
    width: 100% !important;
}

@media (max-width: 981px) {
	.makodata-form {
		.col-md-8.left {
			padding-right: 0;
		}
	}
}

/* =====================================================
   PRODUCT FEATURE - OPTIONAL SECTIONS
   (Value stack heading, Green card, Feature columns,
   Outcomes & stats, Highlights)
   ===================================================== */

/* ----- Value Stack heading ----- */
.value-stack__header {
	max-width: 760px;
	margin-bottom: var(--size-40, 2.5rem);
}
.value-stack__heading {
	font-size: var(--size-40, 2.5rem);
	font-weight: 700;
	line-height: 1.2;
	color: var(--c-teal-dark-900);
	margin-bottom: 0;
}

/* ----- Green Card block (accent band, dark text) ----- */
.green-card-section {
	padding: var(--space-80) 0;
}
.green-card {
	display: flex;
	align-items: center;
	gap: var(--size-32, 2rem);
	padding: var(--size-48, 3rem);
	border-radius: var(--size-16, 1rem);
	color: var(--c-teal-dark-900);
}
.green-card__icon {
	flex: 0 0 auto;
	width: 56px;
	height: 56px;
}
.green-card__icon img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}
.green-card__body {
	flex: 1 1 auto;
}
.green-card__title {
	font-size: var(--size-28, 1.75rem);
	font-weight: 700;
	color: var(--c-teal-dark-900);
	margin-bottom: var(--size-8, 0.5rem);
}
.green-card__desc {
	color: rgba(17, 54, 68, 0.8);
	line-height: 1.6;
	margin-bottom: 0;
}
.green-card__btn {
	flex: 0 0 auto;
}

/* ----- Feature Columns (dark) ----- */
.wmad-section {
	padding: var(--space-80) 0;
}
.wmad-section__title {
	font-size: var(--size-52, 3.25rem);
	font-weight: 700;
	line-height: 1.2;
	margin-bottom: 0;
}
.wmad-section__intro {
	line-height: 1.6;
	margin-bottom: 0;
}
.wmad-section__items {
	margin-top: var(--size-64, 4rem);
}
.wmad-card__icon {
	width: 48px;
	height: 48px;
	margin-bottom: var(--size-24, 1.5rem);
}
.wmad-card__icon img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}
.wmad-card__title {
	font-size: var(--size-24, 1.5rem);
	font-weight: 700;
	line-height: 1.3;
	margin-bottom: var(--size-12, 0.75rem);
}
.wmad-card__desc {
	line-height: 1.6;
	margin-bottom: 0;
}
.wmad-section__actions {
	margin-top: var(--size-48, 3rem);
}

/* ----- Outcomes & Stats (dark) ----- */
.stats-section {
	padding: var(--space-80) 0;
}

.stats-section__header {
	margin-bottom: var(--size-48, 3rem);
}

.stats-section__title {
	font-size: var(--size-40, 2.5rem);
	font-weight: 700;
	line-height: 1.2;
	margin-bottom: 0;
}

.stats-section__intro {
	line-height: 1.6;
	margin-bottom: 0;
}

.stat-card {
	padding: var(--size-24, 1.5rem) 0;
}

.stat-card__value {
	display: flex;
	align-items: baseline;
	gap: 1px;
	font-size: var(--size-24, 1.5rem);
	font-weight: 700;
	line-height: 1.1;
}

/* animated count + suffix inherit the big value styling */
.stat-card__value .page-stats__count,
.stat-card__value .stat-card__suffix {
	font-size: inherit;
	font-weight: inherit;
	line-height: inherit;
	color: inherit;
}

.stat-card__label {
	line-height: 1.5;
	margin-top: var(--size-8, 0.5rem);
}

/* ----- Highlights ----- */
.highlights-section {
	padding: var(--space-80) 0;
}
.highlights-section__header {
	margin-bottom: var(--size-48, 3rem);
}
.highlights-section__header .highlights-section__intro {
	margin-bottom: 0;
}
.highlights-section__title {
	font-size: var(--size-40, 2.5rem);
	font-weight: 700;
	line-height: 1.2;
	margin-bottom: 0;
}
.highlights-section__intro {
	line-height: 1.6;
	margin-bottom: var(--size-40, 2.5rem);
}
.highlights-section__items {
	margin-top: 0;
}

.highlights-card__icon {
	width: 48px;
	height: 48px;
	margin-bottom: var(--size-24, 1.5rem);
}

.highlights-card__icon img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.highlights-card__title {
	font-size: var(--size-24, 1.5rem);
	font-weight: 700;
	line-height: 1.3;
	margin-bottom: var(--size-12, 0.75rem);
}

.highlights-card__desc {
	line-height: 1.6;
	margin-bottom: 0;
}

/* ----- Tablet ----- */
@media (max-width: 991px) {
	.value-stack__heading {
		font-size: var(--size-32, 2rem);
	}
	.green-card {
		flex-direction: column;
		align-items: flex-start;
		text-align: left;
		padding: var(--size-32, 2rem);
        gap: var(--size-20, 2rem);
	}
	.wmad-section__title {
		font-size: var(--size-36, 2.25rem);
	}
	.wmad-section__items {
		margin-top: var(--size-40, 2.5rem);
	}
	.stats-section__title,
	.highlights-section__title {
		font-size: var(--size-32, 2rem);
	}
	.highlights-section__heading-col {
		margin-bottom: var(--size-24, 1.5rem);
	}
	.stats-section__heading-col {
		margin-bottom: var(--size-20, 1.25rem);
	}
	.product-feature-template-default {
		.value-section:before {
			display: none;
		}	
	}

	.mobipad {
        padding-left: var(--size-10);
        padding-right: var(--size-10);
    }

	.mobipad-15 {
        padding-left: var(--size-15);
        padding-right: var(--size-15);
    }

	.stat-card {
		padding: .5rem 0;
	}

	.stats-section__header,
	.highlights-section__header {
		margin-bottom: var(--size-30, 1.875rem);
	}

	.stats-section__header .col-lg-6 {
		margin-top: 0;
	}

	.stats-section__intro {
		margin-top: var(--size-8, 0.5rem);
	}
}

/* ----- Mobile ----- */
@media (max-width: 768px) {
	.wmad-section__title {
		font-size: var(--size-28, 1.75rem);
	}
}

/* Admin bar pushes html down on mobile — neutralise it at the breakpoint where WP hides the bar */
@media screen and (max-width: 600px) {
	html.admin-bar {
		margin-top: 0 !important;
	}
}

/*
|--------------------------------------------------------------------------
| PROBLEMS & SOLUTIONS POD
|--------------------------------------------------------------------------
*/
.pod-problems-solutions__header {
	margin: 0 auto var(--size-40);
}

.pod-problems-solutions__heading {
	font-size: clamp(1.75rem, 3vw, 2.2rem);
	color: var(--c-teal-dark-800);
	margin-bottom: var(--size-12);
}

.pod-problems-solutions__description {
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 0;
}

.pod-problems-solutions__panels {
	display: flex;
	align-items: stretch;
	gap: var(--size-20);
    max-width: 90%;
    margin: auto;
}

.pod-problems-solutions__panel {
	flex: 1 1 0;
	border-radius: var(--size-24, 1.5rem);
	padding: var(--size-20) var(--size-32);
}

.pod-problems-solutions__panel-header {
	border-radius: var(--radius-sm);
	color: var(--c-white);
	font-weight: 600;
	font-size: var(--size-22);
	text-align: center;
	padding: var(--size-8) var(--size-16);
	margin-bottom: var(--size-12);
}

.pod-problems-solutions__panel--problems {
	background: rgba(161, 27, 27, 0.08);
}

.pod-problems-solutions__panel--problems .pod-problems-solutions__panel-header {
	background-color: #a11b1b;
}

.pod-problems-solutions__panel--solutions {
	background: var(--c-teal-dark-50);
}

.pod-problems-solutions__panel--solutions .pod-problems-solutions__panel-header {
	background-color: var(--c-teal-dark-900);
}

.pod-problems-solutions__list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.pod-problems-solutions__item {
	display: flex;
	align-items: center;
	gap: var(--size-12);
	padding: var(--size-12) 0;
	border-bottom: 1px solid var(--c-white);
}

.pod-problems-solutions__item:last-child {
	border-bottom: none;
}

.pod-problems-solutions__icon {
	flex-shrink: 0;
	display: inline-flex;
}

.pod-problems-solutions__panel--problems .pod-problems-solutions__text {
	color: #a11b1b;
}

.pod-problems-solutions__panel--solutions .pod-problems-solutions__text {
	color: var(--c-teal-dark-900);
}

.pod-problems-solutions__text {
	font-weight: 700;
	font-size: var(--size-16);
}

.pod-problems-solutions__arrow {
	flex-shrink: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	align-self: center;
}

.pod-problems-solutions__arrow svg {
	width: 52px;
	height: 52px;
}

@media (max-width: 991px) {
	.pod-problems-solutions__panels {
		flex-direction: column;
	}

	.pod-problems-solutions__arrow {
		transform: rotate(90deg);
		margin: 0 auto;
	}
}

/*
|--------------------------------------------------------------------------
| STAGES POD
|--------------------------------------------------------------------------
*/
.pod-stages__header {
	margin: 0 0 var(--size-40);
}

.pod-stages__heading {
	font-size: clamp(2.2rem, 4vw, 2.5rem) !important;
	color: var(--c-teal-dark-800);
	margin-bottom: var(--size-12);
}

.pod-stages__description {
	color: var(--c-teal-dark-800);
	font-size: var(--size-16);
}

.stage-block {
    position: relative;
    padding-top: var(--size-33);
    padding-left: var(--size-20);
    padding-right: var(--size-20);
    padding-bottom: var(--size-20);
    border-radius: var(--size-12);
	background: rgba(196, 208, 211, 0.25);
    height: 100%;
    transition: box-shadow 0.3s ease;
}

.stage-block__eyebrow {
    position: absolute;
    top: -12px;
    left: var(--size-20);
    z-index: 2;
    display: inline-flex;
    align-items: center;
    padding: 0px var(--size-28);
    border-radius: var(--size-8);
    background: var(--c-yellow-acid);
    color: var(--c-teal-dark-900);
    font-size: 0.8rem;
    font-weight: 700;
    white-space: nowrap;
}

.stage-block__body {
	display: flex;
	align-items: flex-start;
	gap: var(--size-20);
}

.stage-block__icon {
    flex-shrink: 0;
    width: 100px;
    height: 87px;
    padding: var(--size-16) var(--size-22);
    border-radius: var(--size-10);
    background: var(--c-teal-dark-50);
    display: flex;
    align-items: center;
    justify-content: center;
}

.stage-block__icon img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.stage-block__text {
	flex: 1;
	min-width: 0;
}

.stage-block__title {
    font-size: var(--size-20) !important;
    font-weight: 600 !important;
    color: var(--c-teal-dark-900);
    margin-bottom: var(--size-4) !important;
}

.stage-block__desc {
	font-size: var(--fs-sm);
	color: var(--c-grey-600);
	line-height: 1.6;
	margin-bottom: 0;
}

/*
|--------------------------------------------------------------------------
| VALUE STACKS POD
|--------------------------------------------------------------------------
*/
.pod-value-stacks__header {
	margin: 0 auto var(--size-40);
}

/* Base card — icon-top + text-center is the default combination */
.pod-value-stacks .value-stack__card {
	padding: var(--size-30);
	border-radius: var(--size-12);
	background: var(--c-white);
	height: 100%;
	border: 1px solid var(--c-grey-100);
	transition: box-shadow 0.3s ease;
	text-align: center;
}

.pod-value-stacks .value-stack__card:hover {
	box-shadow: 0 8px 30px rgba(0, 0, 0, 0.08);
}

.pod-value-stacks .value-stack__card-icon {
	width: 56px;
	height: 56px;
	margin: 0 auto var(--size-20);
}

.pod-value-stacks .value-stack__card-icon img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.pod-value-stacks__heading {
	font-size: clamp(2.2rem, 4vw, 2.5rem) !important;
	margin-bottom: var(--size-12);
}

.pod-value-stacks__description {
	font-size: 1.125rem;
}

.pod-value-stacks.dark .pod-value-stacks__heading,
.pod-value-stacks.alt-2 .pod-value-stacks__heading {
	color: var(--c-white);
}

.pod-value-stacks.dark .pod-value-stacks__description,
.pod-value-stacks.alt-2 .pod-value-stacks__description {
	color: var(--c-aqua-light);
}

.pod-value-stacks:not(.dark):not(.alt-2) .pod-value-stacks__heading {
	color: var(--c-teal-dark-800);
}

.pod-value-stacks:not(.dark):not(.alt-2) .pod-value-stacks__description {
	color: var(--c-teal-dark-100);
}

.pod-value-stacks.dark .value-stack__card-title,
.pod-value-stacks.alt-2 .value-stack__card-title {
	color: var(--c-white);
}

.pod-value-stacks.dark .value-stack__card-desc,
.pod-value-stacks.alt-2 .value-stack__card-desc {
	color: var(--c-aqua-light);
}

.pod-value-stacks.dark .value-stack__card,
.pod-value-stacks.alt-2 .value-stack__card {
	background: transparent;
	border-color: rgba(255, 255, 255, 0.15);
}

.pod-value-stacks--icon-left .value-stack__card {
	display: flex;
	align-items: flex-start;
	gap: var(--size-16);
	text-align: left;
}

.pod-value-stacks--icon-left .value-stack__card-icon {
	margin: 0;
	flex-shrink: 0;
}

.pod-value-stacks--text-left .value-stack__card {
	text-align: left;
}

.pod-value-stacks--text-left .value-stack__card-icon {
	margin-left: 0;
	margin-right: 0;
}

.h3-size h2 {
    font-size: var(--size-24) !important;
    letter-spacing: 0;
}

.pod-hero-section .gradient-wrapper::before, 
.pod-hero-section .gradient-wrapper::after {
	display: none;
}

.pod-bento-grid--feature_links .pod-bento__card-cta svg path {
    stroke: #fff;
}

@media all and (min-width: 991px) {
	/**
	 * Bento Grid with Icons
	 */
	.pod-bento-grid--showcase .pod-bento__card--tall .pod-bento__card-title {
		max-width: 12ch;
	}

	.pod-bento-grid--showcase .pod-bento__card--tall .pod-bento__card-desc,
	.pod-bento-grid--showcase .pod-bento__card--size-medium .pod-bento__card-desc {
		max-width: 22ch;
	}

	.pod-bento-grid--showcase .pod-bento__card--size-small .pod-bento__card-title {
		max-width: 15ch;
	}

	.pod-bento-grid--showcase .pod-bento__card--size-small .pod-bento__card-desc {
		max-width: 24ch;
	}

	.pod-bento-grid--showcase .pod-bento__card.pod-bento__card--size-small:last-child .pod-bento__card-title {
		max-width: 9ch;
	}


	/**
	 * Bento Grid with Images
	 */
	.pod-bento-grid--feature_links .pod-bento__card--size-medium .pod-bento__card-title {
		max-width: 20ch;
	}

	.pod-bento-grid--feature_links .pod-bento__card--size-small .pod-bento__card-desc {
		max-width: 25ch;
	}

	.pod-bento-grid--feature_links .pod-bento__card-inner {
		justify-content: center;
	}

}