/* =========================================================
   ANJ DIGITAL — SERVICE DETAIL PAGES
   ========================================================= */


/* BASE
--------------------------------------------------------- */

.service-page {
	padding-bottom: 2em !important;
}

.service-page h2,
.service-page h3 {
	text-transform: none;
	letter-spacing: -0.02em;
}

.service-page h2 {
	font-size: 2.2em;
	line-height: 1.2;
}

.service-page p {
	line-height: 1.75;
}


/* SHARED LABEL
--------------------------------------------------------- */

.service-section-label {
	display: flex;
	align-items: center;
	gap: 1em;
	margin-bottom: 1.5em;
}

.service-section-label > span {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	flex: 0 0 40px;
	border-radius: 50%;
	background: linear-gradient(135deg, #f2849e, #7ecaf6);
	color: #ffffff;
	font-size: 0.72em;
	font-weight: 900;
}

.service-section-label p {
	margin: 0;
	font-size: 0.72em;
	font-weight: 900;
	letter-spacing: 0.28em;
}

.service-section-label--light p {
	color: #ffffff;
}


/* HERO
--------------------------------------------------------- */

.service-hero {
	position: relative;
	display: grid;
	grid-template-columns: minmax(0, 1.35fr) minmax(300px, 0.65fr);
	gap: 4em;
	align-items: center;

	margin: 1em 0 6em;
	padding: 4.5em;

	border-radius: 22px;
	overflow: hidden;

	background:
		radial-gradient(
			circle at 95% 5%,
			rgba(126,202,246,0.22),
			transparent 32%
		),
		radial-gradient(
			circle at 0% 100%,
			rgba(242,132,158,0.18),
			transparent 32%
		),
		#ffffff;

	border: 1px solid #e5e5e5;
}

.service-hero::after {
	content: '';
	position: absolute;
	right: -140px;
	top: -160px;
	width: 440px;
	height: 440px;
	border-radius: 50%;
	border: 1px solid rgba(126,202,246,0.22);
	box-shadow:
		0 0 0 45px rgba(126,202,246,0.04),
		0 0 0 90px rgba(242,132,158,0.025);
}

.service-hero > * {
	position: relative;
	z-index: 2;
}

.service-eyebrow {
	display: inline-block;
	margin-bottom: 1.3em;
	color: #888888;
	font-size: 0.7em;
	font-weight: 900;
	letter-spacing: 0.28em;
	text-transform: uppercase;
}

.service-hero h1 {
	max-width: 780px;
	margin-bottom: 0.55em;
	font-size: clamp(3.2em, 5.5vw, 5.3em);
	line-height: 0.98;
}

.service-hero h1 span {
	display: block;

	background:
		linear-gradient(
			90deg,
			#f2849e,
			#ae85ca,
			#7ecaf6
		);

	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text;
}

.service-hero__lead {
	max-width: 850px;
	margin-bottom: 1em;
	font-size: 1.12em;
}

.service-hero__support {
	max-width: 850px;
	margin-bottom: 2em;
}

.service-hero__panel {
	padding: 2em;
	border-radius: 18px;
	background: #585858;
	color: #ffffff;
	box-shadow: 0 18px 45px rgba(88,88,88,0.15);
}

.service-hero__panel-label {
	margin-bottom: 1.8em;
	color: #ffffff;
	font-size: 0.68em;
	font-weight: 900;
	letter-spacing: 0.22em;
}

.service-stat {
	display: grid;
	grid-template-columns: 35px 1fr;
	gap: 1em;
	padding: 1em 0;
	border-top: 1px solid rgba(255,255,255,0.14);
}

.service-stat:first-of-type {
	border-top: 0;
}

.service-stat span {
	color: #f2849e;
	font-size: 0.7em;
	font-weight: 900;
}

.service-stat p {
	margin: 0;
	color: #ffffff;
	font-weight: 700;
	line-height: 1.45;
}


/* SPLIT SECTION
--------------------------------------------------------- */

.service-split {
	display: grid;
	grid-template-columns: minmax(0, 0.75fr) minmax(0, 1.25fr);
	gap: 5em;
	margin-bottom: 6em;
}

.service-section-heading h2 {
	margin-bottom: 0.7em;
}

.service-section-heading > p {
	margin-bottom: 0;
}

.service-split__content > p:first-child {
	font-size: 1.08em;
}

.service-check-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1em;
	margin: 2em 0;
}

.service-check {
	display: grid;
	grid-template-columns: 30px 1fr;
	gap: 0.7em;
	padding: 1.25em;
	border-radius: 12px;
	background: #fafafa;
	border: 1px solid #e5e5e5;
}

.service-check span {
	color: #f2849e;
	font-weight: 900;
}

.service-check p {
	margin: 0;
}

.service-callout-line {
	margin: 0 !important;
	padding-left: 1.2em;
	border-left: 3px solid #7ecaf6;
	font-weight: 700;
}


/* LARGE FEATURE SECTION
--------------------------------------------------------- */

.service-feature {
	margin-bottom: 6em;
	padding: 4em;
	border-radius: 22px;
	background: #585858;
	color: #ffffff;
}

.service-feature__intro {
	max-width: 850px;
	margin-bottom: 3em;
}

.service-feature h2,
.service-feature h3 {
	color: #ffffff;
}

.service-feature__intro h2 {
	margin-bottom: 0.7em;
	font-size: 2.5em;
}

.service-feature__intro p {
	color: rgba(255,255,255,0.78);
}

.service-feature__grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1px;
	background: rgba(255,255,255,0.13);
	border: 1px solid rgba(255,255,255,0.13);
	border-radius: 15px;
	overflow: hidden;
}

.service-feature__grid article {
	padding: 2em;
	background: #585858;
}

.service-feature__grid article > span {
	display: block;
	margin-bottom: 2em;
	color: #f2849e;
	font-size: 0.7em;
	font-weight: 900;
}

.service-feature__grid article:nth-child(2) > span {
	color: #7ecaf6;
}

.service-feature__grid article:nth-child(3) > span {
	color: #7bd0c1;
}

.service-feature__grid article:nth-child(4) > span {
	color: #ae85ca;
}

.service-feature__grid h3 {
	margin: 0 0 0.65em;
	font-size: 1.2em;
}

.service-feature__grid p {
	margin: 0;
	color: rgba(255,255,255,0.74);
}


/* OUTCOMES
--------------------------------------------------------- */

.service-outcomes {
	margin-bottom: 6em;
}

.service-outcomes > .service-section-heading {
	max-width: 760px;
	margin-bottom: 2.5em;
}

.service-outcomes__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1.2em;
}

.service-outcome-card {
	min-height: 280px;
	padding: 2em;
	border-radius: 16px;
	border: 1px solid #e4e4e4;
	background: #ffffff;
}

.service-outcome-card > span {
	display: block;
	margin-bottom: 2.2em;
	color: #f2849e;
	font-size: 0.7em;
	font-weight: 900;
}

.service-outcome-card:nth-child(2) > span {
	color: #7ecaf6;
}

.service-outcome-card:nth-child(3) > span {
	color: #7bd0c1;
}

.service-outcome-card:nth-child(4) > span {
	color: #c75b9b;
}

.service-outcome-card:nth-child(5) > span {
	color: #ae85ca;
}

.service-outcome-card:nth-child(6) > span {
	color: #8499e7;
}

.service-outcome-card h3 {
	margin: 0 0 0.7em;
	font-size: 1.15em;
}

.service-outcome-card p {
	margin: 0;
}


/* DELIVERY
--------------------------------------------------------- */

.service-delivery {
	display: grid;
	grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
	gap: 5em;
	margin-bottom: 6em;
}

.service-delivery__heading h2 {
	margin-bottom: 0.7em;
}

.service-delivery__list {
	border-top: 1px solid #d8d8d8;
}

.service-delivery__list > div {
	display: grid;
	grid-template-columns: 55px 1fr;
	gap: 1em;
	padding: 1.2em 0;
	border-bottom: 1px solid #d8d8d8;
}

.service-delivery__list span {
	color: #f2849e;
	font-size: 0.7em;
	font-weight: 900;
}

.service-delivery__list p {
	margin: 0;
	font-weight: 700;
}


/* PROCESS
--------------------------------------------------------- */

.service-process {
	display: grid;
	grid-template-columns: minmax(0, 0.75fr) minmax(0, 1.25fr);
	gap: 5em;
	margin-bottom: 6em;
	padding: 4em;
	border-radius: 22px;

	background:
		linear-gradient(
			135deg,
			#f2849e 0%,
			#ae85ca 50%,
			#7ecaf6 100%
		);

	color: #ffffff;
}

.service-process h2,
.service-process h3 {
	color: #ffffff;
}

.service-process__intro h2 {
	font-size: 2.25em;
}

.service-process__intro p {
	color: rgba(255,255,255,0.85);
}

.service-process__steps {
	border-top: 1px solid rgba(255,255,255,0.25);
}

.service-process__steps article {
	display: grid;
	grid-template-columns: 55px 1fr;
	gap: 1em;
	padding: 1.35em 0;
	border-bottom: 1px solid rgba(255,255,255,0.25);
}

.service-process__steps > article > span {
	color: #ffffff;
	font-size: 0.7em;
	font-weight: 900;
}

.service-process__steps h3 {
	margin: 0 0 0.3em;
	font-size: 1em;
}

.service-process__steps p {
	margin: 0;
	color: rgba(255,255,255,0.8);
}


/* CTA
--------------------------------------------------------- */

.service-cta {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 3em;
	margin-bottom: 2em;
	padding: 4em;
	border-radius: 22px;
	overflow: hidden;
	background: #f7f7f7;
	border: 1px solid #e3e3e3;
}

.service-cta::after {
	content: '';
	position: absolute;
	right: -170px;
	top: -190px;
	width: 430px;
	height: 430px;
	border-radius: 50%;
	background:
		linear-gradient(
			135deg,
			rgba(242,132,158,0.13),
			rgba(126,202,246,0.16)
		);
}

.service-cta > * {
	position: relative;
	z-index: 2;
}

.service-cta h2 {
	max-width: 750px;
	margin-bottom: 0.55em;
	font-size: 2.4em;
}

.service-cta p {
	max-width: 720px;
	margin: 0;
}

.service-cta__button {
	flex: 0 0 auto;
}


/* TABLET
--------------------------------------------------------- */

@media screen and (max-width: 980px) {

	.service-hero,
	.service-split,
	.service-delivery,
	.service-process {
		grid-template-columns: 1fr;
		gap: 2.5em;
	}

	.service-hero {
		padding: 3em;
	}

	.service-outcomes__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.service-cta {
		flex-direction: column;
		align-items: flex-start;
	}

}


/* MOBILE
--------------------------------------------------------- */

@media screen and (max-width: 736px) {

	.service-hero {
		margin-bottom: 4em;
		padding: 2.2em 1.5em;
		border-radius: 16px;
	}

	.service-hero h1 {
		font-size: 2.7em;
	}

	.service-split,
	.service-feature,
	.service-outcomes,
	.service-delivery,
	.service-process {
		margin-bottom: 4em;
	}

	.service-check-grid,
	.service-feature__grid,
	.service-outcomes__grid {
		grid-template-columns: 1fr;
	}

	.service-feature,
	.service-process {
		padding: 2em 1.5em;
		border-radius: 15px;
	}

	.service-feature__intro h2,
	.service-process__intro h2 {
		font-size: 1.8em;
	}

	.service-outcome-card {
		min-height: auto;
	}

	.service-cta {
		padding: 2.5em 1.6em;
		border-radius: 15px;
	}

	.service-cta h2 {
		font-size: 1.9em;
	}

	.service-cta__button {
		width: 100%;
	}

}


/* SMALL MOBILE
--------------------------------------------------------- */

@media screen and (max-width: 480px) {

	.service-section-label p {
		font-size: 0.62em;
		letter-spacing: 0.2em;
	}

	.service-hero h1 {
		font-size: 2.35em;
	}

	.service-stat {
		grid-template-columns: 30px 1fr;
	}

}

/* =========================================================
   LOCAL SEO
   ========================================================= */


/* HERO VARIATION
--------------------------------------------------------- */

.service-hero--local {
	background:
		radial-gradient(
			circle at 95% 10%,
			rgba(123,208,193,0.20),
			transparent 30%
		),
		radial-gradient(
			circle at 5% 95%,
			rgba(242,132,158,0.15),
			transparent 34%
		),
		#ffffff;
}


/* LOCAL SEARCH MOCKUP
--------------------------------------------------------- */

.local-search-panel {
	position: relative;
	padding: 1.8em;
	border-radius: 20px;
	background: #ffffff;
	border: 1px solid #e1e1e1;
	box-shadow: 0 22px 55px rgba(88,88,88,0.13);
}

.local-search-panel__top {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 1.3em;
}

.local-search-panel__top span {
	color: #999999;
	font-size: 0.65em;
	font-weight: 900;
	letter-spacing: 0.2em;
}

.local-search-panel__top strong {
	color: #f2849e;
	font-size: 0.8em;
}

.local-search-query {
	display: flex;
	align-items: center;
	gap: 0.8em;
	margin-bottom: 1.5em;
	padding: 0.9em 1em;
	border-radius: 100px;
	background: #f7f7f7;
	border: 1px solid #e5e5e5;
}

.local-search-query__icon {
	color: #7ecaf6;
	font-size: 1.4em;
}

.local-search-query p {
	margin: 0;
	font-size: 0.88em;
	font-weight: 700;
}

.local-result {
	display: grid;
	grid-template-columns: 38px 1fr;
	gap: 0.9em;
	align-items: center;
	padding: 1em 0;
	border-top: 1px solid #e7e7e7;
}

.local-result__pin {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	border-radius: 50%;
	background: #f2849e;
	color: #ffffff;
	font-size: 0.7em;
	font-weight: 900;
}

.local-result:nth-child(4) .local-result__pin {
	background: #7ecaf6;
}

.local-result:nth-child(5) .local-result__pin {
	background: #7bd0c1;
}

.local-result strong {
	display: block;
	margin-bottom: 0.1em;
}

.local-result p {
	margin: 0;
	color: #888888;
	font-size: 0.78em;
}


/* LOCAL INSIGHT
--------------------------------------------------------- */

.local-insight-section {
	margin-bottom: 6em;
	padding: 4em;
	border-radius: 22px;
	background:
		linear-gradient(
			135deg,
			rgba(123,208,193,0.13),
			rgba(126,202,246,0.12),
			rgba(242,132,158,0.10)
		);
	border: 1px solid rgba(126,202,246,0.22);
}

.local-insight-section__intro {
	max-width: 850px;
	margin-bottom: 3em;
}

.local-insight-section__intro h2 {
	margin-bottom: 0.7em;
	font-size: 2.45em;
}

.local-insight-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1.2em;
	margin-bottom: 2em;
}

.local-insight-grid article {
	padding: 2em;
	border-radius: 16px;
	background: rgba(255,255,255,0.78);
	border: 1px solid rgba(255,255,255,0.9);
}

.local-insight-grid article > span {
	display: block;
	margin-bottom: 2em;
	color: #f2849e;
	font-size: 0.7em;
	font-weight: 900;
}

.local-insight-grid article:nth-child(2) > span {
	color: #7ecaf6;
}

.local-insight-grid article:nth-child(3) > span {
	color: #7bd0c1;
}

.local-insight-grid article:nth-child(4) > span {
	color: #ae85ca;
}

.local-insight-grid h3 {
	margin: 0 0 0.65em;
	font-size: 1.2em;
}

.local-insight-grid p {
	margin: 0;
}


/* SCHEMA CALLOUT
--------------------------------------------------------- */

.local-schema-callout {
	display: grid;
	grid-template-columns: 0.7fr 1.3fr;
	gap: 3em;
	margin-top: 2em;
	padding: 2em;
	border-radius: 16px;
	background: #585858;
	color: #ffffff;
}

.local-schema-callout span {
	display: block;
	margin-bottom: 0.5em;
	color: #7bd0c1;
	font-size: 0.68em;
	font-weight: 900;
	letter-spacing: 0.2em;
}

.local-schema-callout h3 {
	margin: 0;
	color: #ffffff;
	font-size: 1.35em;
}

.local-schema-callout p {
	margin-bottom: 1em;
	color: rgba(255,255,255,0.78);
}

.local-inline-link {
	border: 0;
	color: #ffffff;
	font-size: 0.75em;
	font-weight: 900;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.local-inline-link span {
	display: inline;
	margin-left: 0.4em;
	color: #f2849e;
	letter-spacing: 0;
}


/* LOCAL PROCESS
--------------------------------------------------------- */

.local-process {
	margin-bottom: 6em;
}

.local-process__heading {
	max-width: 780px;
	margin-bottom: 3em;
}

.local-process__heading h2 {
	margin-bottom: 0.7em;
}

.local-process__timeline {
	position: relative;
	max-width: 900px;
	margin-left: auto;
}

.local-process__timeline::before {
	content: '';
	position: absolute;
	top: 0;
	bottom: 0;
	left: 23px;
	width: 1px;
	background:
		linear-gradient(
			to bottom,
			#f2849e,
			#7ecaf6,
			#7bd0c1,
			#ae85ca
		);
}

.local-process__timeline article {
	position: relative;
	display: grid;
	grid-template-columns: 48px 1fr;
	gap: 1.4em;
	padding-bottom: 2em;
}

.local-process__timeline article > span {
	position: relative;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 46px;
	border-radius: 50%;
	background: #ffffff;
	border: 2px solid #f2849e;
	color: #f2849e;
	font-size: 0.68em;
	font-weight: 900;
}

.local-process__timeline article:nth-child(2n) > span {
	border-color: #7ecaf6;
	color: #7ecaf6;
}

.local-process__timeline article:nth-child(3n) > span {
	border-color: #7bd0c1;
	color: #7bd0c1;
}

.local-process__timeline article:nth-child(4n) > span {
	border-color: #ae85ca;
	color: #ae85ca;
}

.local-process__timeline article > div {
	padding: 0.5em 0 1.5em;
	border-bottom: 1px solid #e0e0e0;
}

.local-process__timeline h3 {
	margin: 0 0 0.4em;
	font-size: 1.1em;
}

.local-process__timeline p {
	margin: 0;
}


/* LOCAL CTA
--------------------------------------------------------- */

.service-cta--local {
	background:
		linear-gradient(
			110deg,
			rgba(123,208,193,0.11),
			rgba(126,202,246,0.13),
			rgba(242,132,158,0.10)
		);
}


/* RESPONSIVE
--------------------------------------------------------- */

@media screen and (max-width: 980px) {

	.local-schema-callout {
		grid-template-columns: 1fr;
		gap: 1.5em;
	}

}


@media screen and (max-width: 736px) {

	.local-insight-section {
		margin-bottom: 4em;
		padding: 2em 1.5em;
		border-radius: 15px;
	}

	.local-insight-section__intro h2 {
		font-size: 1.8em;
	}

	.local-insight-grid {
		grid-template-columns: 1fr;
	}

	.local-schema-callout {
		padding: 1.5em;
	}

}

/* =========================================================
   NATIONAL SEO
   ========================================================= */


/* HERO
--------------------------------------------------------- */

.service-hero--national {
	background:
		radial-gradient(
			circle at 92% 8%,
			rgba(174,133,202,0.18),
			transparent 31%
		),
		radial-gradient(
			circle at 5% 95%,
			rgba(126,202,246,0.16),
			transparent 34%
		),
		#ffffff;
}


/* NATIONAL REACH PANEL
--------------------------------------------------------- */

.national-reach-panel {
	padding: 1.8em;
	border-radius: 20px;
	background: #585858;
	color: #ffffff;
	box-shadow: 0 22px 55px rgba(88,88,88,0.18);
}

.national-reach-panel__top {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 1.5em;
}

.national-reach-panel__top span {
	font-size: 0.65em;
	font-weight: 900;
	letter-spacing: 0.2em;
}

.national-reach-panel__top strong {
	color: #7ecaf6;
	font-size: 0.75em;
}


/* ABSTRACT MARKET REACH VISUAL */

.national-reach-visual {
	position: relative;
	height: 120px;
	margin-bottom: 1em;
	border-radius: 12px;
	background:
		linear-gradient(
			110deg,
			rgba(242,132,158,0.12),
			rgba(174,133,202,0.12),
			rgba(126,202,246,0.13)
		);
	overflow: hidden;
}

.national-reach-line {
	position: absolute;
	left: 14%;
	right: 14%;
	top: 50%;
	height: 2px;
	background:
		linear-gradient(
			90deg,
			#f2849e,
			#ae85ca,
			#7ecaf6
		);
	transform: translateY(-50%);
}

.national-market {
	position: absolute;
	top: 50%;
	transform: translate(-50%, -50%);
	text-align: center;
}

.national-market--1 {
	left: 18%;
}

.national-market--2 {
	left: 50%;
}

.national-market--3 {
	left: 82%;
}

.national-market span {
	display: block;
	width: 18px;
	height: 18px;
	margin: 0 auto 0.45em;
	border-radius: 50%;
	background: #ffffff;
	border: 4px solid #f2849e;
	box-shadow: 0 0 0 5px rgba(242,132,158,0.12);
}

.national-market--2 span {
	border-color: #ae85ca;
	box-shadow: 0 0 0 5px rgba(174,133,202,0.12);
}

.national-market--3 span {
	border-color: #7ecaf6;
	box-shadow: 0 0 0 5px rgba(126,202,246,0.12);
}

.national-market p {
	margin: 0;
	color: #ffffff;
	font-size: 0.68em;
	font-weight: 900;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.national-reach-metric {
	display: grid;
	grid-template-columns: 36px 1fr;
	gap: 0.9em;
	padding: 1em 0;
	border-top: 1px solid rgba(255,255,255,0.14);
}

.national-reach-metric > span {
	color: #f2849e;
	font-size: 0.7em;
	font-weight: 900;
}

.national-reach-metric:nth-of-type(4) > span {
	color: #7ecaf6;
}

.national-reach-metric:nth-of-type(5) > span {
	color: #7bd0c1;
}

.national-reach-metric strong {
	display: block;
	color: #ffffff;
	margin-bottom: 0.1em;
}

.national-reach-metric p {
	margin: 0;
	color: rgba(255,255,255,0.68);
	font-size: 0.8em;
}


/* NATIONAL STRATEGY
--------------------------------------------------------- */

.national-strategy-section {
	margin-bottom: 6em;
	padding: 4em;
	border-radius: 22px;

	background:
		linear-gradient(
			135deg,
			#585858 0%,
			#626064 100%
		);

	color: #ffffff;
}

.national-strategy__intro {
	max-width: 850px;
	margin-bottom: 3em;
}

.national-strategy__intro h2 {
	margin-bottom: 0.7em;
	color: #ffffff;
	font-size: 2.45em;
}

.national-strategy__intro p {
	color: rgba(255,255,255,0.78);
}

.national-strategy__grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1px;
	margin-bottom: 2em;
	background: rgba(255,255,255,0.15);
	border: 1px solid rgba(255,255,255,0.15);
	border-radius: 15px;
	overflow: hidden;
}

.national-strategy__grid article {
	padding: 2em;
	background: #585858;
}

.national-strategy__grid article > span {
	display: block;
	margin-bottom: 2em;
	color: #f2849e;
	font-size: 0.7em;
	font-weight: 900;
}

.national-strategy__grid article:nth-child(2) > span {
	color: #7ecaf6;
}

.national-strategy__grid article:nth-child(3) > span {
	color: #7bd0c1;
}

.national-strategy__grid article:nth-child(4) > span {
	color: #ae85ca;
}

.national-strategy__grid h3 {
	margin: 0 0 0.65em;
	color: #ffffff;
	font-size: 1.2em;
}

.national-strategy__grid p {
	margin: 0;
	color: rgba(255,255,255,0.72);
}


/* NATIONAL TOOLS CALLOUT
--------------------------------------------------------- */

.national-tools-callout {
	display: grid;
	grid-template-columns: 0.75fr 1.25fr;
	gap: 3em;
	padding: 2em;
	border-radius: 16px;

	background:
		linear-gradient(
			110deg,
			rgba(242,132,158,0.12),
			rgba(174,133,202,0.12),
			rgba(126,202,246,0.14)
		);

	border: 1px solid rgba(255,255,255,0.14);
}

.national-tools-callout > div:first-child > span {
	display: block;
	margin-bottom: 0.6em;
	color: #7bd0c1;
	font-size: 0.68em;
	font-weight: 900;
	letter-spacing: 0.2em;
}

.national-tools-callout h3 {
	margin: 0;
	color: #ffffff;
	font-size: 1.35em;
}

.national-tools-callout p {
	margin-bottom: 1em;
	color: rgba(255,255,255,0.8);
}

.national-tools-link {
	border: 0;
	color: #ffffff;
	font-size: 0.75em;
	font-weight: 900;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.national-tools-link span {
	display: inline-block;
	margin-left: 0.4em;
	color: #f2849e;
}


/* NATIONAL PROCESS
--------------------------------------------------------- */

.national-process {
	margin-bottom: 6em;
	padding: 4em;
	border-radius: 22px;

	background:
		linear-gradient(
			135deg,
			rgba(242,132,158,0.10),
			rgba(174,133,202,0.09),
			rgba(126,202,246,0.11)
		);

	border: 1px solid #e5e5e5;
}

.national-process__heading {
	max-width: 800px;
	margin-bottom: 3em;
}

.national-process__heading h2 {
	margin-bottom: 0.7em;
	font-size: 2.35em;
}

.national-process__heading p {
	margin-bottom: 0;
}

.national-process__grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1.2em;
}

.national-process__grid article {
	min-height: 260px;
	padding: 2em;
	border-radius: 16px;
	background: rgba(255,255,255,0.86);
	border: 1px solid rgba(255,255,255,0.95);
}

.national-process__number {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 42px;
	height: 42px;
	margin-bottom: 2em;
	border-radius: 50%;
	background: #f2849e;
	color: #ffffff;
	font-size: 0.7em;
	font-weight: 900;
}

.national-process__grid article:nth-child(2) .national-process__number,
.national-process__grid article:nth-child(6) .national-process__number {
	background: #7ecaf6;
}

.national-process__grid article:nth-child(3) .national-process__number,
.national-process__grid article:nth-child(7) .national-process__number {
	background: #7bd0c1;
}

.national-process__grid article:nth-child(4) .national-process__number,
.national-process__grid article:nth-child(8) .national-process__number {
	background: #ae85ca;
}

.national-process__grid h3 {
	margin: 0 0 0.6em;
	font-size: 1.15em;
}

.national-process__grid p {
	margin: 0;
}


/* NATIONAL CTA
--------------------------------------------------------- */

.service-cta--national {
	background:
		linear-gradient(
			110deg,
			rgba(126,202,246,0.11),
			rgba(174,133,202,0.10),
			rgba(242,132,158,0.09)
		);
}


/* NATIONAL RESPONSIVE
--------------------------------------------------------- */

@media screen and (max-width: 980px) {

	.national-tools-callout {
		grid-template-columns: 1fr;
		gap: 1.5em;
	}

}


@media screen and (max-width: 736px) {

	.national-strategy-section,
	.national-process {
		margin-bottom: 4em;
		padding: 2em 1.5em;
		border-radius: 15px;
	}

	.national-strategy__intro h2,
	.national-process__heading h2 {
		font-size: 1.8em;
	}

	.national-strategy__grid,
	.national-process__grid {
		grid-template-columns: 1fr;
	}

	.national-process__grid article {
		min-height: auto;
	}

	.national-tools-callout {
		padding: 1.5em;
	}

}

/* =========================================================
   PAID SEARCH ADVERTISING
   ========================================================= */


/* HERO
--------------------------------------------------------- */

.service-hero--paid-search {
	background:
		radial-gradient(
			circle at 94% 10%,
			rgba(126,202,246,0.18),
			transparent 30%
		),
		radial-gradient(
			circle at 5% 90%,
			rgba(242,132,158,0.16),
			transparent 34%
		),
		#ffffff;
}


/* HERO PERFORMANCE PANEL
--------------------------------------------------------- */

.paid-search-panel {
	padding: 1.8em;
	border-radius: 20px;
	background: #585858;
	color: #ffffff;
	box-shadow: 0 22px 55px rgba(88,88,88,0.18);
}

.paid-search-panel__top {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 1.4em;
}

.paid-search-panel__top span {
	font-size: 0.63em;
	font-weight: 900;
	letter-spacing: 0.2em;
}

.paid-search-panel__top strong {
	color: #7ecaf6;
	font-size: 0.7em;
}

.paid-search-query {
	display: flex;
	align-items: center;
	gap: 0.8em;
	margin-bottom: 1.4em;
	padding: 0.9em 1em;
	border-radius: 8px;
	background: rgba(255,255,255,0.09);
	border: 1px solid rgba(255,255,255,0.12);
}

.paid-search-query > span {
	color: #7ecaf6;
	font-size: 1.2em;
}

.paid-search-query p {
	margin: 0;
	color: #ffffff;
	font-size: 0.82em;
}

.paid-search-metric {
	padding: 1em 0;
	border-top: 1px solid rgba(255,255,255,0.14);
}

.paid-search-metric > div {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1em;
	margin-bottom: 0.25em;
}

.paid-search-metric span {
	color: #f2849e;
	font-size: 0.62em;
	font-weight: 900;
	letter-spacing: 0.16em;
}

.paid-search-metric strong {
	color: #ffffff;
}

.paid-search-metric p {
	margin: 0;
	color: rgba(255,255,255,0.65);
	font-size: 0.76em;
}

.paid-search-metric--primary strong {
	color: #7bd0c1;
}


/* WHY SEARCH
--------------------------------------------------------- */

.paid-search-why {
	margin-bottom: 6em;
}

.paid-search-why > .service-section-heading {
	max-width: 760px;
	margin-bottom: 2.5em;
}

.paid-search-why__grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 1em;
}

.paid-search-why__grid article {
	min-height: 250px;
	padding: 1.8em;
	border-radius: 16px;
	border: 1px solid #e4e4e4;
	background: #ffffff;
}

.paid-search-why__grid article > span {
	display: block;
	margin-bottom: 2em;
	color: #f2849e;
	font-size: 0.68em;
	font-weight: 900;
}

.paid-search-why__grid article:nth-child(2) > span {
	color: #7ecaf6;
}

.paid-search-why__grid article:nth-child(3) > span {
	color: #7bd0c1;
}

.paid-search-why__grid article:nth-child(4) > span {
	color: #ae85ca;
}

.paid-search-why__grid h3 {
	margin: 0 0 0.65em;
	font-size: 1.1em;
}

.paid-search-why__grid p {
	margin: 0;
}


/* STRATEGY
--------------------------------------------------------- */

.paid-search-strategy {
	display: grid;
	grid-template-columns: minmax(0, 1.2fr) minmax(280px, 0.8fr);
	gap: 4em;
	align-items: center;

	margin-bottom: 6em;
	padding: 4em;

	border-radius: 22px;
	background: #585858;
	color: #ffffff;
}

.paid-search-strategy h2,
.paid-search-strategy h3 {
	color: #ffffff;
}

.paid-search-strategy__intro h2 {
	margin-bottom: 0.7em;
	font-size: 2.4em;
}

.paid-search-strategy__intro p {
	color: rgba(255,255,255,0.78);
}

.paid-search-strategy__statement {
	padding: 2em;
	border-radius: 16px;
	background:
		linear-gradient(
			135deg,
			rgba(242,132,158,0.13),
			rgba(126,202,246,0.13)
		);
	border: 1px solid rgba(255,255,255,0.14);
}

.paid-search-strategy__statement > span {
	display: block;
	margin-bottom: 1.5em;
	color: #7bd0c1;
	font-size: 0.66em;
	font-weight: 900;
	letter-spacing: 0.18em;
}

.paid-search-strategy__statement h3 {
	margin: 0;
	font-size: 1.7em;
	line-height: 1.2;
}

.paid-search-strategy__statement h3 span {
	color: #f2849e;
}


/* PLATFORMS
--------------------------------------------------------- */

.paid-search-platforms {
	margin-bottom: 6em;
}

.paid-search-platforms > .service-section-heading {
	max-width: 760px;
	margin-bottom: 2.5em;
}

.paid-search-platform-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1.4em;
}

.paid-platform-card {
	position: relative;
	min-height: 360px;
	padding: 2.4em;
	border-radius: 18px;
	border: 1px solid #e3e3e3;
	background: #ffffff;
	overflow: hidden;
}

.paid-platform-card::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 5px;
}

.paid-platform-card--google::before {
	background:
		linear-gradient(
			90deg,
			#f2849e,
			#7ecaf6,
			#7bd0c1
		);
}

.paid-platform-card--microsoft::before {
	background:
		linear-gradient(
			90deg,
			#7ecaf6,
			#ae85ca
		);
}

.paid-platform-card__number {
	margin-bottom: 2em;
	color: #999999;
	font-size: 0.68em;
	font-weight: 900;
}

.paid-platform-card__eyebrow {
	display: block;
	margin-bottom: 0.8em;
	color: #999999;
	font-size: 0.65em;
	font-weight: 900;
	letter-spacing: 0.18em;
}

.paid-platform-card h3 {
	margin: 0 0 0.7em;
	font-size: 1.6em;
}

.paid-platform-card p {
	margin-bottom: 1.5em;
}

.paid-platform-tags {
	display: flex;
	flex-wrap: wrap;
	gap: 0.6em;
}

.paid-platform-tags span {
	padding: 0.45em 0.8em;
	border-radius: 100px;
	background: #f7f7f7;
	border: 1px solid #e5e5e5;
	font-size: 0.7em;
	font-weight: 700;
}


/* COMPONENTS
--------------------------------------------------------- */

.paid-search-components {
	margin-bottom: 6em;
}

.paid-search-components__heading {
	max-width: 780px;
	margin-bottom: 2.5em;
}

.paid-search-components__heading h2 {
	margin-bottom: 0.7em;
}

.paid-search-components__grid {
	display: grid;
	grid-template-columns: repeat(6, minmax(0, 1fr));
	gap: 1.2em;
}

.paid-search-components__grid article {
	grid-column: span 2;
	min-height: 300px;
	padding: 2em;
	border-radius: 16px;
	background:
		linear-gradient(
			145deg,
			#ffffff,
			#fafafa
		);
	border: 1px solid #e5e5e5;
}

.paid-search-components__grid article:nth-child(4),
.paid-search-components__grid article:nth-child(5) {
	grid-column: span 3;
}

.paid-component-number {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	margin-bottom: 2em;
	border-radius: 50%;
	background: #f2849e;
	color: #ffffff;
	font-size: 0.68em;
	font-weight: 900;
}

.paid-search-components__grid article:nth-child(2) .paid-component-number {
	background: #7ecaf6;
}

.paid-search-components__grid article:nth-child(3) .paid-component-number {
	background: #7bd0c1;
}

.paid-search-components__grid article:nth-child(4) .paid-component-number {
	background: #c75b9b;
}

.paid-search-components__grid article:nth-child(5) .paid-component-number {
	background: #ae85ca;
}

.paid-search-components__grid h3 {
	margin: 0 0 0.65em;
	font-size: 1.15em;
}

.paid-search-components__grid p {
	margin: 0;
}


/* AI
--------------------------------------------------------- */

.paid-search-ai {
	display: grid;
	grid-template-columns: 0.8fr 1.2fr;
	gap: 5em;
	align-items: center;

	margin-bottom: 6em;
	padding: 4em;

	border-radius: 22px;
	background: #585858;
	color: #ffffff;
}

.paid-search-ai h2 {
	color: #ffffff;
	margin-bottom: 0.7em;
	font-size: 2.4em;
}

.paid-search-ai__copy p {
	color: rgba(255,255,255,0.78);
}

.paid-search-ai__visual {
	position: relative;
	min-height: 320px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.paid-ai-circle {
	position: absolute;
	border-radius: 50%;
	border: 1px solid rgba(255,255,255,0.14);
}

.paid-ai-circle--1 {
	width: 290px;
	height: 290px;
}

.paid-ai-circle--2 {
	width: 220px;
	height: 220px;
	border-color: rgba(126,202,246,0.3);
}

.paid-ai-circle--3 {
	width: 150px;
	height: 150px;
	border-color: rgba(242,132,158,0.35);
}

.paid-ai-center {
	position: relative;
	z-index: 2;
	display: flex;
	align-items: center;
	gap: 0.7em;
	font-size: 0.8em;
	font-weight: 900;
	letter-spacing: 0.15em;
}

.paid-ai-center span:first-child {
	color: #7ecaf6;
}

.paid-ai-center span:last-child {
	color: #f2849e;
}


/* PROCESS
--------------------------------------------------------- */

.paid-search-process {
	margin-bottom: 6em;
}

.paid-search-process__heading {
	max-width: 780px;
	margin-bottom: 3em;
}

.paid-search-process__heading h2 {
	margin-bottom: 0.7em;
}

.paid-search-process__steps {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1.2em;
}

.paid-search-process__steps article {
	min-height: 270px;
	padding: 2em;
	border-radius: 16px;
	border: 1px solid #e3e3e3;
	background: #ffffff;
}

.paid-search-process__steps article > span {
	display: block;
	margin-bottom: 2em;
	color: #f2849e;
	font-size: 0.7em;
	font-weight: 900;
}

.paid-search-process__steps article:nth-child(2) > span,
.paid-search-process__steps article:nth-child(6) > span {
	color: #7ecaf6;
}

.paid-search-process__steps article:nth-child(3) > span {
	color: #7bd0c1;
}

.paid-search-process__steps article:nth-child(4) > span {
	color: #c75b9b;
}

.paid-search-process__steps article:nth-child(5) > span {
	color: #ae85ca;
}

.paid-search-process__steps h3 {
	margin: 0 0 0.55em;
	font-size: 1.1em;
}

.paid-search-process__steps p {
	margin: 0;
}


/* CONNECTED SYSTEM
--------------------------------------------------------- */

.paid-search-system {
	margin-bottom: 6em;
	padding: 4em;
	border-radius: 22px;

	background:
		linear-gradient(
			120deg,
			rgba(242,132,158,0.10),
			rgba(174,133,202,0.09),
			rgba(126,202,246,0.12)
		);

	border: 1px solid #e5e5e5;
}

.paid-search-system__heading {
	max-width: 720px;
	margin-bottom: 2.5em;
}

.paid-search-system__heading > span {
	display: block;
	margin-bottom: 0.9em;
	color: #f2849e;
	font-size: 0.68em;
	font-weight: 900;
	letter-spacing: 0.2em;
}

.paid-search-system__heading h2 {
	margin: 0;
}

.paid-search-system__flow {
	display: flex;
	align-items: stretch;
	gap: 1em;
}

.paid-search-system__flow > div {
	flex: 1 1 0;
	padding: 1.4em;
	border-radius: 14px;
	background: rgba(255,255,255,0.82);
	border: 1px solid #e6e6e6;
}

.paid-search-system__flow > div > span {
	display: block;
	margin-bottom: 0.5em;
	font-size: 0.68em;
	font-weight: 900;
	letter-spacing: 0.12em;
}

.paid-search-system__flow > div p {
	margin: 0;
	font-size: 0.84em;
}

.paid-search-system__flow > strong {
	display: flex;
	align-items: center;
	color: #f2849e;
	font-size: 1.2em;
}

.paid-search-system__closing {
	max-width: 800px;
	margin: 2em 0 0;
	font-weight: 700;
}


/* CTA
--------------------------------------------------------- */

.service-cta--paid-search {
	background:
		linear-gradient(
			110deg,
			rgba(242,132,158,0.10),
			rgba(126,202,246,0.12)
		);
}


/* TABLET
--------------------------------------------------------- */

@media screen and (max-width: 980px) {

	.paid-search-why__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.paid-search-strategy,
	.paid-search-ai {
		grid-template-columns: 1fr;
		gap: 2.5em;
	}

	.paid-search-components__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.paid-search-components__grid article,
	.paid-search-components__grid article:nth-child(4),
	.paid-search-components__grid article:nth-child(5) {
		grid-column: auto;
	}

	.paid-search-process__steps {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.paid-search-system__flow {
		display: grid;
		grid-template-columns: 1fr 1fr;
	}

	.paid-search-system__flow > strong {
		display: none;
	}

}


/* MOBILE
--------------------------------------------------------- */

@media screen and (max-width: 736px) {

	.paid-search-why,
	.paid-search-strategy,
	.paid-search-platforms,
	.paid-search-components,
	.paid-search-ai,
	.paid-search-process,
	.paid-search-system {
		margin-bottom: 4em;
	}

	.paid-search-why__grid,
	.paid-search-platform-grid,
	.paid-search-components__grid,
	.paid-search-process__steps,
	.paid-search-system__flow {
		grid-template-columns: 1fr;
	}

	.paid-search-strategy,
	.paid-search-ai,
	.paid-search-system {
		padding: 2em 1.5em;
		border-radius: 15px;
	}

	.paid-search-strategy__intro h2,
	.paid-search-ai h2 {
		font-size: 1.8em;
	}

	.paid-search-why__grid article,
	.paid-search-components__grid article,
	.paid-search-process__steps article {
		min-height: auto;
	}

	.paid-search-ai__visual {
		min-height: 240px;
	}

	.paid-ai-circle--1 {
		width: 220px;
		height: 220px;
	}

	.paid-ai-circle--2 {
		width: 170px;
		height: 170px;
	}

	.paid-ai-circle--3 {
		width: 115px;
		height: 115px;
	}

}

/* =========================================================
   DISPLAY ADVERTISING
   ========================================================= */


/* HERO
--------------------------------------------------------- */

.service-hero--display {
	background:
		radial-gradient(
			circle at 94% 8%,
			rgba(174,133,202,0.18),
			transparent 30%
		),
		radial-gradient(
			circle at 5% 92%,
			rgba(123,208,193,0.16),
			transparent 34%
		),
		#ffffff;
}


/* DISPLAY JOURNEY PANEL
--------------------------------------------------------- */

.display-journey-panel {
	padding: 1.8em;
	border-radius: 20px;
	background: #585858;
	color: #ffffff;
	box-shadow: 0 22px 55px rgba(88,88,88,0.18);
}

.display-journey-panel__top {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 1.5em;
}

.display-journey-panel__top span {
	font-size: 0.63em;
	font-weight: 900;
	letter-spacing: 0.2em;
}

.display-journey-panel__top strong {
	color: #7bd0c1;
	font-size: 0.7em;
}

.display-journey-stage {
	display: grid;
	grid-template-columns: 42px 1fr;
	gap: 1em;
	align-items: center;
	padding: 1em;
	border-radius: 12px;
	background: rgba(255,255,255,0.07);
	border: 1px solid rgba(255,255,255,0.1);
}

.display-journey-stage > span {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border-radius: 50%;
	background: #f2849e;
	color: #ffffff;
	font-size: 0.68em;
	font-weight: 900;
}

.display-journey-stage--consideration > span {
	background: #7ecaf6;
}

.display-journey-stage--retarget > span {
	background: #ae85ca;
}

.display-journey-stage--convert > span {
	background: #7bd0c1;
}

.display-journey-stage strong {
	display: block;
	color: #ffffff;
	margin-bottom: 0.1em;
}

.display-journey-stage p {
	margin: 0;
	color: rgba(255,255,255,0.68);
	font-size: 0.78em;
}

.display-journey-connector {
	padding: 0.35em 0;
	text-align: center;
	color: rgba(255,255,255,0.4);
}


/* STRATEGY
--------------------------------------------------------- */

.display-strategy {
	display: grid;
	grid-template-columns: minmax(0, 1.2fr) minmax(300px, 0.8fr);
	gap: 4em;
	align-items: center;

	margin-bottom: 6em;
	padding: 4em;

	border-radius: 22px;

	background:
		linear-gradient(
			135deg,
			#585858,
			#626064
		);

	color: #ffffff;
}

.display-strategy h2 {
	margin-bottom: 0.7em;
	color: #ffffff;
	font-size: 2.4em;
}

.display-strategy__intro p {
	color: rgba(255,255,255,0.78);
}

.display-strategy__visual {
	position: relative;
	min-height: 320px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.display-ring {
	position: absolute;
	border-radius: 50%;
	border: 1px solid rgba(255,255,255,0.14);
}

.display-ring--1 {
	width: 300px;
	height: 300px;
}

.display-ring--2 {
	width: 220px;
	height: 220px;
	border-color: rgba(126,202,246,0.3);
}

.display-ring--3 {
	width: 145px;
	height: 145px;
	border-color: rgba(242,132,158,0.35);
}

.display-strategy__center {
	position: relative;
	z-index: 2;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.35em;
	font-size: 0.7em;
	font-weight: 900;
	letter-spacing: 0.14em;
	text-align: center;
}

.display-strategy__center span:nth-of-type(1) {
	color: #7ecaf6;
}

.display-strategy__center span:nth-of-type(2) {
	color: #f2849e;
}

.display-strategy__center span:nth-of-type(3) {
	color: #7bd0c1;
}


/* COMPONENTS
--------------------------------------------------------- */

.display-components {
	margin-bottom: 6em;
}

.display-components__heading {
	max-width: 780px;
	margin-bottom: 2.5em;
}

.display-components__heading h2 {
	margin-bottom: 0.7em;
}

.display-components__grid {
	display: grid;
	grid-template-columns: repeat(6, minmax(0, 1fr));
	gap: 1.2em;
}

.display-components__grid article {
	grid-column: span 2;
	min-height: 300px;
	padding: 2em;
	border-radius: 16px;
	border: 1px solid #e5e5e5;
	background: #ffffff;
}

.display-components__grid article:nth-child(4),
.display-components__grid article:nth-child(5) {
	grid-column: span 3;
}

.display-component-number {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	margin-bottom: 2em;
	border-radius: 50%;
	background: #f2849e;
	color: #ffffff;
	font-size: 0.68em;
	font-weight: 900;
}

.display-components__grid article:nth-child(2) .display-component-number {
	background: #7ecaf6;
}

.display-components__grid article:nth-child(3) .display-component-number {
	background: #7bd0c1;
}

.display-components__grid article:nth-child(4) .display-component-number {
	background: #c75b9b;
}

.display-components__grid article:nth-child(5) .display-component-number {
	background: #ae85ca;
}

.display-components__grid h3 {
	margin: 0 0 0.65em;
	font-size: 1.15em;
}

.display-components__grid p {
	margin: 0;
}


/* INFLUENCE PATH
--------------------------------------------------------- */

.display-influence {
	display: grid;
	grid-template-columns: 0.8fr 1.2fr;
	gap: 4em;
	align-items: center;

	margin-bottom: 6em;
	padding: 4em;

	border-radius: 22px;

	background:
		linear-gradient(
			125deg,
			rgba(126,202,246,0.11),
			rgba(174,133,202,0.09),
			rgba(242,132,158,0.10)
		);

	border: 1px solid #e5e5e5;
}

.display-influence__copy h2 {
	margin-bottom: 0.7em;
	font-size: 2.15em;
}

.display-influence__path {
	display: flex;
	align-items: center;
	gap: 0.7em;
}

.display-influence__path > div {
	flex: 1 1 0;
	padding: 1.3em;
	border-radius: 14px;
	background: rgba(255,255,255,0.82);
	border: 1px solid #e5e5e5;
}

.display-influence__path span {
	display: block;
	margin-bottom: 0.7em;
	color: #f2849e;
	font-size: 0.68em;
	font-weight: 900;
}

.display-influence__path > div:nth-of-type(2) span {
	color: #7ecaf6;
}

.display-influence__path > div:nth-of-type(3) span {
	color: #ae85ca;
}

.display-influence__path > div:nth-of-type(4) span {
	color: #7bd0c1;
}

.display-influence__path strong {
	font-size: 0.88em;
}

.display-influence__path > b {
	color: #b5b5b5;
}


/* AI
--------------------------------------------------------- */

.display-ai {
	display: grid;
	grid-template-columns: 0.8fr 1.2fr;
	gap: 5em;
	align-items: center;

	margin-bottom: 6em;
	padding: 4em;

	border-radius: 22px;
	background: #585858;
	color: #ffffff;
}

.display-ai h2 {
	margin-bottom: 0.7em;
	color: #ffffff;
	font-size: 2.4em;
}

.display-ai__copy p {
	color: rgba(255,255,255,0.78);
}

.display-ai__visual {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1em;
}

.display-ai-block {
	min-height: 125px;
	padding: 1.4em;
	border-radius: 14px;
	background: rgba(255,255,255,0.07);
	border: 1px solid rgba(255,255,255,0.12);
}

.display-ai-block span {
	display: block;
	margin-bottom: 1.4em;
	color: #f2849e;
	font-size: 0.67em;
	font-weight: 900;
}

.display-ai-block--2 span {
	color: #7ecaf6;
}

.display-ai-block--3 span {
	color: #7bd0c1;
}

.display-ai-block--4 span {
	color: #ae85ca;
}

.display-ai-block p {
	margin: 0;
	color: #ffffff;
	font-weight: 700;
}


/* PROCESS
--------------------------------------------------------- */

.display-process {
	margin-bottom: 6em;
}

.display-process__heading {
	max-width: 780px;
	margin-bottom: 3em;
}

.display-process__heading h2 {
	margin-bottom: 0.7em;
}

.display-process__steps {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1.2em;
}

.display-process__steps article {
	min-height: 270px;
	padding: 2em;
	border-radius: 16px;
	background: #ffffff;
	border: 1px solid #e4e4e4;
}

.display-process__steps article > span {
	display: block;
	margin-bottom: 2em;
	color: #f2849e;
	font-size: 0.7em;
	font-weight: 900;
}

.display-process__steps article:nth-child(2) > span,
.display-process__steps article:nth-child(6) > span {
	color: #7ecaf6;
}

.display-process__steps article:nth-child(3) > span {
	color: #7bd0c1;
}

.display-process__steps article:nth-child(4) > span {
	color: #c75b9b;
}

.display-process__steps article:nth-child(5) > span {
	color: #ae85ca;
}

.display-process__steps h3 {
	margin: 0 0 0.55em;
	font-size: 1.1em;
}

.display-process__steps p {
	margin: 0;
}


/* CONNECTED SYSTEM
--------------------------------------------------------- */

.display-system {
	margin-bottom: 6em;
	padding: 4em;
	border-radius: 22px;
	background: #fafafa;
	border: 1px solid #e5e5e5;
}

.display-system__heading {
	max-width: 760px;
	margin-bottom: 2.5em;
}

.display-system__heading > span {
	display: block;
	margin-bottom: 0.8em;
	color: #f2849e;
	font-size: 0.68em;
	font-weight: 900;
	letter-spacing: 0.2em;
}

.display-system__heading h2 {
	margin-bottom: 0.7em;
}

.display-system__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1em;
}

.display-system__grid > div {
	min-height: 150px;
	padding: 1.5em;
	border-radius: 14px;
	background: #ffffff;
	border: 1px solid #e5e5e5;
}

.display-system__grid span {
	display: block;
	margin-bottom: 0.7em;
	color: #f2849e;
	font-size: 0.68em;
	font-weight: 900;
	letter-spacing: 0.1em;
}

.display-system__grid > div:nth-child(2) span {
	color: #7ecaf6;
}

.display-system__grid > div:nth-child(3) span {
	color: #7bd0c1;
}

.display-system__grid > div:nth-child(4) span {
	color: #c75b9b;
}

.display-system__grid > div:nth-child(5) span {
	color: #ae85ca;
}

.display-system__grid > div:nth-child(6) span {
	color: #8499e7;
}

.display-system__grid p {
	margin: 0;
}


/* CTA
--------------------------------------------------------- */

.service-cta--display {
	background:
		linear-gradient(
			110deg,
			rgba(123,208,193,0.10),
			rgba(174,133,202,0.10),
			rgba(242,132,158,0.09)
		);
}


/* TABLET
--------------------------------------------------------- */

@media screen and (max-width: 980px) {

	.display-strategy,
	.display-influence,
	.display-ai {
		grid-template-columns: 1fr;
		gap: 2.5em;
	}

	.display-components__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.display-components__grid article,
	.display-components__grid article:nth-child(4),
	.display-components__grid article:nth-child(5) {
		grid-column: auto;
	}

	.display-process__steps,
	.display-system__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.display-influence__path {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.display-influence__path > b {
		display: none;
	}

}


/* MOBILE
--------------------------------------------------------- */

@media screen and (max-width: 736px) {

	.display-strategy,
	.display-components,
	.display-influence,
	.display-ai,
	.display-process,
	.display-system {
		margin-bottom: 4em;
	}

	.display-components__grid,
	.display-process__steps,
	.display-system__grid,
	.display-influence__path {
		grid-template-columns: 1fr;
	}

	.display-strategy,
	.display-influence,
	.display-ai,
	.display-system {
		padding: 2em 1.5em;
		border-radius: 15px;
	}

	.display-strategy h2,
	.display-ai h2,
	.display-influence__copy h2 {
		font-size: 1.8em;
	}

	.display-components__grid article,
	.display-process__steps article {
		min-height: auto;
	}

	.display-strategy__visual {
		min-height: 250px;
	}

	.display-ring--1 {
		width: 230px;
		height: 230px;
	}

	.display-ring--2 {
		width: 170px;
		height: 170px;
	}

	.display-ring--3 {
		width: 110px;
		height: 110px;
	}

}

/* =========================================================
   PAID SOCIAL ADVERTISING
   ========================================================= */


/* HERO
--------------------------------------------------------- */

.service-hero--social {
	background:
		radial-gradient(
			circle at 94% 8%,
			rgba(242,132,158,0.18),
			transparent 31%
		),
		radial-gradient(
			circle at 4% 94%,
			rgba(174,133,202,0.15),
			transparent 34%
		),
		#ffffff;
}


/* SOCIAL PERFORMANCE PANEL
--------------------------------------------------------- */

.social-performance-panel {
	padding: 1.8em;
	border-radius: 20px;
	background: #585858;
	color: #ffffff;
	box-shadow: 0 22px 55px rgba(88,88,88,0.18);
}

.social-performance-panel__top {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 1.5em;
}

.social-performance-panel__top span {
	font-size: 0.63em;
	font-weight: 900;
	letter-spacing: 0.2em;
}

.social-performance-panel__top strong {
	color: #7bd0c1;
	font-size: 0.7em;
}

.social-performance-card {
	display: grid;
	grid-template-columns: 42px 1fr;
	gap: 1em;
	align-items: center;
	padding: 1em 0;
	border-top: 1px solid rgba(255,255,255,0.14);
}

.social-performance-card > span {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 35px;
	height: 35px;
	border-radius: 10px;
	background: #f2849e;
	color: #ffffff;
	font-size: 0.67em;
	font-weight: 900;
}

.social-performance-card--creative > span {
	background: #7ecaf6;
}

.social-performance-card--offer > span {
	background: #ae85ca;
}

.social-performance-card--measurement > span {
	background: #7bd0c1;
}

.social-performance-card strong {
	display: block;
	color: #ffffff;
	margin-bottom: 0.1em;
}

.social-performance-card p {
	margin: 0;
	color: rgba(255,255,255,0.68);
	font-size: 0.78em;
}


/* STRATEGY
--------------------------------------------------------- */

.social-strategy {
	display: grid;
	grid-template-columns: minmax(0, 1.2fr) minmax(280px, 0.8fr);
	gap: 4em;
	align-items: center;

	margin-bottom: 6em;
	padding: 4em;

	border-radius: 22px;
	background: #585858;
	color: #ffffff;
}

.social-strategy h2,
.social-strategy h3 {
	color: #ffffff;
}

.social-strategy__intro h2 {
	margin-bottom: 0.7em;
	font-size: 2.4em;
}

.social-strategy__intro p {
	color: rgba(255,255,255,0.78);
}

.social-strategy__statement {
	padding: 2em;
	border-radius: 16px;

	background:
		linear-gradient(
			135deg,
			rgba(242,132,158,0.15),
			rgba(174,133,202,0.14),
			rgba(126,202,246,0.12)
		);

	border: 1px solid rgba(255,255,255,0.14);
}

.social-strategy__statement > span {
	display: block;
	margin-bottom: 1.5em;
	color: #7bd0c1;
	font-size: 0.66em;
	font-weight: 900;
	letter-spacing: 0.18em;
}

.social-strategy__statement h3 {
	margin: 0;
	font-size: 1.65em;
	line-height: 1.25;
}

.social-strategy__statement h3 span {
	color: #f2849e;
}


/* PLATFORMS
--------------------------------------------------------- */

.social-platforms {
	margin-bottom: 6em;
}

.social-platforms > .service-section-heading {
	max-width: 760px;
	margin-bottom: 2.5em;
}

.social-platform-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1.2em;
}

.social-platform-card {
	position: relative;
	min-height: 360px;
	padding: 2.2em;
	border-radius: 18px;
	background: #ffffff;
	border: 1px solid #e4e4e4;
	overflow: hidden;
}

.social-platform-card::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 5px;
}

.social-platform-card--meta::before {
	background:
		linear-gradient(
			90deg,
			#f2849e,
			#ae85ca
		);
}

.social-platform-card--linkedin::before {
	background:
		linear-gradient(
			90deg,
			#7ecaf6,
			#8499e7
		);
}

.social-platform-card--video::before {
	background:
		linear-gradient(
			90deg,
			#7bd0c1,
			#7ecaf6
		);
}

.social-platform-card__number {
	margin-bottom: 2em;
	color: #999999;
	font-size: 0.68em;
	font-weight: 900;
}

.social-platform-card__eyebrow {
	display: block;
	margin-bottom: 0.8em;
	color: #999999;
	font-size: 0.63em;
	font-weight: 900;
	letter-spacing: 0.17em;
}

.social-platform-card h3 {
	margin: 0 0 0.7em;
	font-size: 1.5em;
}

.social-platform-card p {
	margin-bottom: 1.5em;
}

.social-platform-tags {
	display: flex;
	flex-wrap: wrap;
	gap: 0.6em;
}

.social-platform-tags span {
	padding: 0.45em 0.8em;
	border-radius: 100px;
	background: #f7f7f7;
	border: 1px solid #e5e5e5;
	font-size: 0.7em;
	font-weight: 700;
}


/* COMPONENTS
--------------------------------------------------------- */

.social-components {
	margin-bottom: 6em;
}

.social-components__heading {
	max-width: 780px;
	margin-bottom: 2.5em;
}

.social-components__heading h2 {
	margin-bottom: 0.7em;
}

.social-components__grid {
	display: grid;
	grid-template-columns: repeat(6, minmax(0, 1fr));
	gap: 1.2em;
}

.social-components__grid article {
	grid-column: span 2;
	min-height: 300px;
	padding: 2em;
	border-radius: 16px;
	background: #ffffff;
	border: 1px solid #e4e4e4;
}

.social-components__grid article:nth-child(4),
.social-components__grid article:nth-child(5) {
	grid-column: span 3;
}

.social-component-number {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	margin-bottom: 2em;
	border-radius: 12px;
	background: #f2849e;
	color: #ffffff;
	font-size: 0.68em;
	font-weight: 900;
}

.social-components__grid article:nth-child(2) .social-component-number {
	background: #7ecaf6;
}

.social-components__grid article:nth-child(3) .social-component-number {
	background: #7bd0c1;
}

.social-components__grid article:nth-child(4) .social-component-number {
	background: #c75b9b;
}

.social-components__grid article:nth-child(5) .social-component-number {
	background: #ae85ca;
}

.social-components__grid h3 {
	margin: 0 0 0.65em;
	font-size: 1.15em;
}

.social-components__grid p {
	margin: 0;
}


/* CREATIVE
--------------------------------------------------------- */

.social-creative {
	display: grid;
	grid-template-columns: 0.9fr 1.1fr;
	gap: 4em;
	align-items: center;

	margin-bottom: 6em;
	padding: 4em;

	border-radius: 22px;

	background:
		linear-gradient(
			125deg,
			rgba(242,132,158,0.11),
			rgba(174,133,202,0.10),
			rgba(126,202,246,0.10)
		);

	border: 1px solid #e5e5e5;
}

.social-creative__copy h2 {
	margin-bottom: 0.7em;
	font-size: 2.2em;
}

.social-creative__cards {
	display: grid;
	gap: 1em;
}

.social-creative-card {
	padding: 1.6em;
	border-radius: 14px;
	background: rgba(255,255,255,0.86);
	border: 1px solid #e5e5e5;
}

.social-creative-card > span {
	display: block;
	margin-bottom: 0.6em;
	color: #f2849e;
	font-size: 0.66em;
	font-weight: 900;
	letter-spacing: 0.17em;
}

.social-creative-card--message > span {
	color: #7ecaf6;
}

.social-creative-card--action > span {
	color: #7bd0c1;
}

.social-creative-card strong {
	display: block;
	margin-bottom: 0.3em;
}

.social-creative-card p {
	margin: 0;
}


/* AI
--------------------------------------------------------- */

.social-ai {
	display: grid;
	grid-template-columns: 0.8fr 1.2fr;
	gap: 5em;
	align-items: center;

	margin-bottom: 6em;
	padding: 4em;

	border-radius: 22px;
	background: #585858;
	color: #ffffff;
}

.social-ai h2 {
	color: #ffffff;
	margin-bottom: 0.7em;
	font-size: 2.4em;
}

.social-ai__copy p {
	color: rgba(255,255,255,0.78);
}

.social-ai__visual {
	position: relative;
	min-height: 330px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.social-ai-core {
	position: relative;
	z-index: 3;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	width: 125px;
	height: 125px;
	border-radius: 50%;

	background:
		linear-gradient(
			135deg,
			rgba(242,132,158,0.25),
			rgba(126,202,246,0.20)
		);

	border: 1px solid rgba(255,255,255,0.18);

	font-size: 0.7em;
	font-weight: 900;
	letter-spacing: 0.1em;
}

.social-ai-core span:first-child {
	color: #7ecaf6;
}

.social-ai-core span:last-child {
	color: #f2849e;
}

.social-ai-orbit {
	position: absolute;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 82px;
	height: 82px;
	border-radius: 50%;
	background: rgba(255,255,255,0.07);
	border: 1px solid rgba(255,255,255,0.14);
	color: #ffffff;
	font-size: 0.68em;
	font-weight: 700;
}

.social-ai-orbit--1 {
	top: 5%;
	left: 41%;
}

.social-ai-orbit--2 {
	top: 39%;
	left: 5%;
}

.social-ai-orbit--3 {
	top: 39%;
	right: 5%;
}

.social-ai-orbit--4 {
	bottom: 3%;
	left: 41%;
}


/* PROCESS
--------------------------------------------------------- */

.social-process {
	margin-bottom: 6em;
}

.social-process__heading {
	max-width: 780px;
	margin-bottom: 3em;
}

.social-process__heading h2 {
	margin-bottom: 0.7em;
}

.social-process__steps {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1.2em;
}

.social-process__steps article {
	min-height: 270px;
	padding: 2em;
	border-radius: 16px;
	background: #ffffff;
	border: 1px solid #e4e4e4;
}

.social-process__steps article > span {
	display: block;
	margin-bottom: 2em;
	color: #f2849e;
	font-size: 0.7em;
	font-weight: 900;
}

.social-process__steps article:nth-child(2) > span,
.social-process__steps article:nth-child(6) > span {
	color: #7ecaf6;
}

.social-process__steps article:nth-child(3) > span {
	color: #7bd0c1;
}

.social-process__steps article:nth-child(4) > span {
	color: #c75b9b;
}

.social-process__steps article:nth-child(5) > span {
	color: #ae85ca;
}

.social-process__steps h3 {
	margin: 0 0 0.55em;
	font-size: 1.1em;
}

.social-process__steps p {
	margin: 0;
}


/* CONNECTED SYSTEM
--------------------------------------------------------- */

.social-system {
	margin-bottom: 6em;
	padding: 4em;
	border-radius: 22px;
	background: #fafafa;
	border: 1px solid #e5e5e5;
}

.social-system__heading {
	max-width: 760px;
	margin-bottom: 2.5em;
}

.social-system__heading > span {
	display: block;
	margin-bottom: 0.8em;
	color: #f2849e;
	font-size: 0.68em;
	font-weight: 900;
	letter-spacing: 0.2em;
}

.social-system__heading h2 {
	margin-bottom: 0.7em;
}

.social-system__flow {
	display: flex;
	align-items: stretch;
	gap: 0.75em;
}

.social-system__flow > div {
	flex: 1 1 0;
	padding: 1.3em;
	border-radius: 14px;
	background: #ffffff;
	border: 1px solid #e5e5e5;
}

.social-system__flow > div > span {
	display: block;
	margin-bottom: 0.5em;
	font-size: 0.65em;
	font-weight: 900;
	letter-spacing: 0.1em;
}

.social-system__flow > div:nth-of-type(1) > span {
	color: #f2849e;
}

.social-system__flow > div:nth-of-type(2) > span {
	color: #7ecaf6;
}

.social-system__flow > div:nth-of-type(3) > span {
	color: #7bd0c1;
}

.social-system__flow > div:nth-of-type(4) > span {
	color: #ae85ca;
}

.social-system__flow > div:nth-of-type(5) > span {
	color: #c75b9b;
}

.social-system__flow p {
	margin: 0;
	font-size: 0.82em;
}

.social-system__flow > strong {
	display: flex;
	align-items: center;
	color: #bbbbbb;
}


/* CTA
--------------------------------------------------------- */

.service-cta--social {
	background:
		linear-gradient(
			110deg,
			rgba(242,132,158,0.11),
			rgba(174,133,202,0.10),
			rgba(126,202,246,0.11)
		);
}


/* TABLET
--------------------------------------------------------- */

@media screen and (max-width: 980px) {

	.social-strategy,
	.social-creative,
	.social-ai {
		grid-template-columns: 1fr;
		gap: 2.5em;
	}

	.social-platform-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.social-components__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.social-components__grid article,
	.social-components__grid article:nth-child(4),
	.social-components__grid article:nth-child(5) {
		grid-column: auto;
	}

	.social-process__steps {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.social-system__flow {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.social-system__flow > strong {
		display: none;
	}

}


/* MOBILE
--------------------------------------------------------- */

@media screen and (max-width: 736px) {

	.social-strategy,
	.social-platforms,
	.social-components,
	.social-creative,
	.social-ai,
	.social-process,
	.social-system {
		margin-bottom: 4em;
	}

	.social-platform-grid,
	.social-components__grid,
	.social-process__steps,
	.social-system__flow {
		grid-template-columns: 1fr;
	}

	.social-strategy,
	.social-creative,
	.social-ai,
	.social-system {
		padding: 2em 1.5em;
		border-radius: 15px;
	}

	.social-strategy__intro h2,
	.social-creative__copy h2,
	.social-ai h2 {
		font-size: 1.8em;
	}

	.social-platform-card,
	.social-components__grid article,
	.social-process__steps article {
		min-height: auto;
	}

	.social-ai__visual {
		min-height: 280px;
	}

	.social-ai-orbit {
		width: 68px;
		height: 68px;
		font-size: 0.6em;
	}

	.social-ai-orbit--1,
	.social-ai-orbit--4 {
		left: 39%;
	}

}

/* =========================================================
   A/B TESTING
   ========================================================= */


/* HERO
--------------------------------------------------------- */

.service-hero--ab-testing {
	background:
		radial-gradient(
			circle at 94% 8%,
			rgba(126,202,246,0.17),
			transparent 30%
		),
		radial-gradient(
			circle at 5% 92%,
			rgba(242,132,158,0.17),
			transparent 34%
		),
		#ffffff;
}


/* HERO TEST PANEL
--------------------------------------------------------- */

.ab-test-panel {
	padding: 1.8em;
	border-radius: 20px;
	background: #585858;
	color: #ffffff;
	box-shadow: 0 22px 55px rgba(88,88,88,0.18);
}

.ab-test-panel__top {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 1.6em;
}

.ab-test-panel__top span {
	font-size: 0.63em;
	font-weight: 900;
	letter-spacing: 0.2em;
}

.ab-test-panel__top strong {
	color: #7ecaf6;
}

.ab-variant {
	padding: 1em;
	border-radius: 12px;
	background: rgba(255,255,255,0.07);
	border: 1px solid rgba(255,255,255,0.1);
}

.ab-variant__label {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 0.8em;
}

.ab-variant__label span {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	background: #f2849e;
	color: #ffffff;
	font-size: 0.7em;
	font-weight: 900;
}

.ab-variant--b .ab-variant__label span {
	background: #7ecaf6;
}

.ab-variant__label strong {
	font-size: 0.68em;
	letter-spacing: 0.12em;
}

.ab-variant__bar {
	height: 8px;
	margin-bottom: 0.7em;
	border-radius: 100px;
	background: rgba(255,255,255,0.1);
	overflow: hidden;
}

.ab-variant__bar i {
	display: block;
	height: 100%;
	border-radius: inherit;
	background: #f2849e;
}

.ab-variant--b .ab-variant__bar i {
	background: #7ecaf6;
}

.ab-variant p {
	margin: 0;
	color: rgba(255,255,255,0.65);
	font-size: 0.76em;
}

.ab-test-vs {
	padding: 0.5em 0;
	text-align: center;
	color: rgba(255,255,255,0.45);
	font-size: 0.65em;
	font-weight: 900;
}

.ab-test-result {
	display: grid;
	grid-template-columns: 50px 1fr;
	gap: 1em;
	margin-top: 1.2em;
	padding-top: 1.2em;
	border-top: 1px solid rgba(255,255,255,0.14);
}

.ab-test-result > span {
	color: #7bd0c1;
	font-size: 0.62em;
	font-weight: 900;
	letter-spacing: 0.12em;
}

.ab-test-result strong {
	color: #ffffff;
}

.ab-test-result p {
	margin: 0;
	color: rgba(255,255,255,0.65);
	font-size: 0.75em;
}


/* TEST AREAS
--------------------------------------------------------- */

.ab-test-areas {
	margin-bottom: 6em;
}

.ab-test-areas > .service-section-heading {
	max-width: 780px;
	margin-bottom: 2.5em;
}

.ab-test-areas__grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 1em;
}

.ab-test-areas__grid article {
	min-height: 235px;
	padding: 1.8em;
	border-radius: 16px;
	background: #ffffff;
	border: 1px solid #e4e4e4;
}

.ab-test-areas__grid article:last-child {
	grid-column: span 2;
}

.ab-test-areas__grid article > span {
	display: block;
	margin-bottom: 2em;
	color: #f2849e;
	font-size: 0.68em;
	font-weight: 900;
}

.ab-test-areas__grid article:nth-child(2) > span {
	color: #7ecaf6;
}

.ab-test-areas__grid article:nth-child(3) > span {
	color: #7bd0c1;
}

.ab-test-areas__grid article:nth-child(4) > span {
	color: #c75b9b;
}

.ab-test-areas__grid article:nth-child(5) > span {
	color: #ae85ca;
}

.ab-test-areas__grid article:nth-child(6) > span {
	color: #8499e7;
}

.ab-test-areas__grid article:nth-child(7) > span {
	color: #f2849e;
}

.ab-test-areas__grid h3 {
	margin: 0 0 0.6em;
	font-size: 1.1em;
}

.ab-test-areas__grid p {
	margin: 0;
}


/* WHY TESTING WORKS
--------------------------------------------------------- */

.ab-why {
	margin-bottom: 6em;
	padding: 4em;
	border-radius: 22px;
	background: #585858;
	color: #ffffff;
}

.ab-why__intro {
	max-width: 820px;
	margin-bottom: 3em;
}

.ab-why h2,
.ab-why h3 {
	color: #ffffff;
}

.ab-why__intro h2 {
	margin-bottom: 0.7em;
	font-size: 2.45em;
}

.ab-why__intro p {
	color: rgba(255,255,255,0.78);
}

.ab-why__grid {
	display: grid;
	grid-template-columns: repeat(5, minmax(0, 1fr));
	gap: 1px;
	background: rgba(255,255,255,0.14);
	border: 1px solid rgba(255,255,255,0.14);
	border-radius: 15px;
	overflow: hidden;
}

.ab-why__grid article {
	min-height: 240px;
	padding: 1.7em;
	background: #585858;
}

.ab-why__grid article > span {
	display: block;
	margin-bottom: 2em;
	color: #f2849e;
	font-size: 0.68em;
	font-weight: 900;
}

.ab-why__grid article:nth-child(2) > span {
	color: #7ecaf6;
}

.ab-why__grid article:nth-child(3) > span {
	color: #7bd0c1;
}

.ab-why__grid article:nth-child(4) > span {
	color: #ae85ca;
}

.ab-why__grid article:nth-child(5) > span {
	color: #c75b9b;
}

.ab-why__grid h3 {
	margin: 0 0 0.6em;
	font-size: 1em;
}

.ab-why__grid p {
	margin: 0;
	color: rgba(255,255,255,0.7);
	font-size: 0.9em;
}


/* TESTING PROCESS
--------------------------------------------------------- */

.ab-process {
	margin-bottom: 6em;
}

.ab-process__heading {
	max-width: 780px;
	margin-bottom: 3em;
}

.ab-process__heading h2 {
	margin-bottom: 0.7em;
}

.ab-process__timeline {
	position: relative;
	max-width: 900px;
	margin-left: auto;
}

.ab-process__timeline::before {
	content: '';
	position: absolute;
	top: 0;
	bottom: 0;
	left: 23px;
	width: 1px;
	background:
		linear-gradient(
			to bottom,
			#f2849e,
			#7ecaf6,
			#7bd0c1,
			#ae85ca
		);
}

.ab-process__timeline article {
	position: relative;
	display: grid;
	grid-template-columns: 48px 1fr;
	gap: 1.4em;
	padding-bottom: 2em;
}

.ab-process__timeline article > span {
	position: relative;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 46px;
	border-radius: 50%;
	background: #ffffff;
	border: 2px solid #f2849e;
	color: #f2849e;
	font-size: 0.68em;
	font-weight: 900;
}

.ab-process__timeline article:nth-child(2) > span,
.ab-process__timeline article:nth-child(6) > span {
	border-color: #7ecaf6;
	color: #7ecaf6;
}

.ab-process__timeline article:nth-child(3) > span {
	border-color: #7bd0c1;
	color: #7bd0c1;
}

.ab-process__timeline article:nth-child(4) > span {
	border-color: #c75b9b;
	color: #c75b9b;
}

.ab-process__timeline article:nth-child(5) > span {
	border-color: #ae85ca;
	color: #ae85ca;
}

.ab-process__timeline article > div {
	padding: 0.5em 0 1.6em;
	border-bottom: 1px solid #e2e2e2;
}

.ab-process__timeline h3 {
	margin: 0 0 0.4em;
	font-size: 1.1em;
}

.ab-process__timeline p {
	margin: 0;
}


/* MEASUREMENT
--------------------------------------------------------- */

.ab-measurement {
	display: grid;
	grid-template-columns: 0.8fr 1.2fr;
	gap: 4em;
	margin-bottom: 6em;
	padding: 4em;
	border-radius: 22px;

	background:
		linear-gradient(
			125deg,
			rgba(242,132,158,0.10),
			rgba(174,133,202,0.09),
			rgba(126,202,246,0.11)
		);

	border: 1px solid #e5e5e5;
}

.ab-measurement__copy h2 {
	margin-bottom: 0.7em;
	font-size: 2.25em;
}

.ab-measurement__grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1em;
}

.ab-measurement__grid article {
	min-height: 145px;
	padding: 1.5em;
	border-radius: 14px;
	background: rgba(255,255,255,0.84);
	border: 1px solid #e5e5e5;
}

.ab-measurement__grid article:last-child {
	grid-column: 1 / -1;
}

.ab-measurement__grid span {
	display: block;
	margin-bottom: 0.65em;
	color: #f2849e;
	font-size: 0.66em;
	font-weight: 900;
}

.ab-measurement__grid article:nth-child(2) span {
	color: #7ecaf6;
}

.ab-measurement__grid article:nth-child(3) span {
	color: #7bd0c1;
}

.ab-measurement__grid article:nth-child(4) span {
	color: #ae85ca;
}

.ab-measurement__grid article:nth-child(5) span {
	color: #c75b9b;
}

.ab-measurement__grid strong {
	display: block;
	margin-bottom: 0.25em;
}

.ab-measurement__grid p {
	margin: 0;
}


/* DASHBOARDS
--------------------------------------------------------- */

.ab-dashboards {
	display: grid;
	grid-template-columns: 0.85fr 1.15fr;
	gap: 5em;
	align-items: center;

	margin-bottom: 6em;
	padding: 4em;

	border-radius: 22px;
	background: #585858;
	color: #ffffff;
}

.ab-dashboards h2 {
	margin-bottom: 0.7em;
	color: #ffffff;
	font-size: 2.4em;
}

.ab-dashboards__copy p {
	color: rgba(255,255,255,0.78);
}

.ab-dashboard-window {
	padding: 1.4em;
	border-radius: 16px;
	background: rgba(255,255,255,0.07);
	border: 1px solid rgba(255,255,255,0.13);
}

.ab-dashboard-window__top {
	display: flex;
	gap: 0.4em;
	margin-bottom: 1.5em;
}

.ab-dashboard-window__top span {
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: rgba(255,255,255,0.35);
}

.ab-dashboard-chart {
	display: flex;
	align-items: flex-end;
	gap: 0.8em;
	height: 170px;
	padding: 1em;
	border-radius: 10px;
	background: rgba(255,255,255,0.04);
}

.ab-dashboard-chart__bar {
	flex: 1;
	border-radius: 7px 7px 2px 2px;
	background: #f2849e;
}

.ab-dashboard-chart__bar--1 {
	height: 42%;
}

.ab-dashboard-chart__bar--2 {
	height: 58%;
	background: #7ecaf6;
}

.ab-dashboard-chart__bar--3 {
	height: 72%;
	background: #7bd0c1;
}

.ab-dashboard-chart__bar--4 {
	height: 88%;
	background: #ae85ca;
}

.ab-dashboard-stats {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 0.7em;
	margin-top: 1em;
}

.ab-dashboard-stats > div {
	padding: 0.9em;
	border-radius: 10px;
	background: rgba(255,255,255,0.06);
}

.ab-dashboard-stats span {
	display: block;
	margin-bottom: 0.35em;
	color: rgba(255,255,255,0.55);
	font-size: 0.58em;
	font-weight: 900;
	letter-spacing: 0.1em;
}

.ab-dashboard-stats strong {
	color: #ffffff;
}

.ab-dashboard-link {
	border: 0;
	color: #ffffff;
	font-size: 0.75em;
	font-weight: 900;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.ab-dashboard-link span {
	display: inline-block;
	margin-left: 0.4em;
	color: #f2849e;
}


/* CONTINUOUS LOOP
--------------------------------------------------------- */

.ab-loop {
	margin-bottom: 6em;
	padding: 4em;
	border-radius: 22px;
	background: #fafafa;
	border: 1px solid #e5e5e5;
}

.ab-loop__heading {
	max-width: 760px;
	margin-bottom: 2.5em;
}

.ab-loop__heading > span {
	display: block;
	margin-bottom: 0.8em;
	color: #f2849e;
	font-size: 0.68em;
	font-weight: 900;
	letter-spacing: 0.2em;
}

.ab-loop__heading h2 {
	margin-bottom: 0.7em;
}

.ab-loop__flow {
	display: flex;
	align-items: stretch;
	gap: 0.7em;
}

.ab-loop__flow > div {
	flex: 1 1 0;
	padding: 1.35em;
	border-radius: 14px;
	background: #ffffff;
	border: 1px solid #e5e5e5;
}

.ab-loop__flow > div span {
	display: block;
	margin-bottom: 0.6em;
	color: #f2849e;
	font-size: 0.65em;
	font-weight: 900;
}

.ab-loop__flow > div:nth-of-type(2) span {
	color: #7ecaf6;
}

.ab-loop__flow > div:nth-of-type(3) span {
	color: #7bd0c1;
}

.ab-loop__flow > div:nth-of-type(4) span {
	color: #ae85ca;
}

.ab-loop__flow > div:nth-of-type(5) span {
	color: #c75b9b;
}

.ab-loop__flow strong {
	display: block;
	margin-bottom: 0.3em;
}

.ab-loop__flow p {
	margin: 0;
	font-size: 0.82em;
}

.ab-loop__flow > b {
	display: flex;
	align-items: center;
	color: #bbbbbb;
}


/* CTA
--------------------------------------------------------- */

.service-cta--ab-testing {
	background:
		linear-gradient(
			110deg,
			rgba(242,132,158,0.10),
			rgba(174,133,202,0.09),
			rgba(126,202,246,0.11)
		);
}


/* TABLET
--------------------------------------------------------- */

@media screen and (max-width: 980px) {

	.ab-test-areas__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.ab-test-areas__grid article:last-child {
		grid-column: auto;
	}

	.ab-why__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.ab-measurement,
	.ab-dashboards {
		grid-template-columns: 1fr;
		gap: 2.5em;
	}

	.ab-loop__flow {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.ab-loop__flow > b {
		display: none;
	}

}


/* MOBILE
--------------------------------------------------------- */

@media screen and (max-width: 736px) {

	.ab-test-areas,
	.ab-why,
	.ab-process,
	.ab-measurement,
	.ab-dashboards,
	.ab-loop {
		margin-bottom: 4em;
	}

	.ab-test-areas__grid,
	.ab-why__grid,
	.ab-measurement__grid,
	.ab-loop__flow {
		grid-template-columns: 1fr;
	}

	.ab-measurement__grid article:last-child {
		grid-column: auto;
	}

	.ab-why,
	.ab-measurement,
	.ab-dashboards,
	.ab-loop {
		padding: 2em 1.5em;
		border-radius: 15px;
	}

	.ab-why__intro h2,
	.ab-measurement__copy h2,
	.ab-dashboards h2 {
		font-size: 1.8em;
	}

	.ab-why__grid article {
		min-height: auto;
	}

	.ab-dashboard-chart {
		height: 140px;
	}

}

/* =========================================================
   CUSTOM DASHBOARDS
   ========================================================= */


/* HERO
--------------------------------------------------------- */

.service-hero--dashboard {
	background:
		radial-gradient(
			circle at 94% 8%,
			rgba(126,202,246,0.18),
			transparent 30%
		),
		radial-gradient(
			circle at 5% 92%,
			rgba(199,91,155,0.13),
			transparent 34%
		),
		#ffffff;
}


/* DASHBOARD HERO MOCKUP
--------------------------------------------------------- */

.dashboard-hero-panel {
	padding: 1.5em;
	border-radius: 20px;
	background: #585858;
	color: #ffffff;
	box-shadow: 0 22px 55px rgba(88,88,88,0.18);
}

.dashboard-hero-panel__top {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 1.4em;
}

.dashboard-hero-panel__top > div {
	display: flex;
	gap: 0.4em;
}

.dashboard-hero-panel__top > div span {
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: rgba(255,255,255,0.35);
}

.dashboard-hero-panel__top strong {
	color: #7ecaf6;
	font-size: 0.62em;
	letter-spacing: 0.14em;
}

.dashboard-kpis {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 0.7em;
	margin-bottom: 0.8em;
}

.dashboard-kpis > div {
	padding: 1em;
	border-radius: 10px;
	background: rgba(255,255,255,0.07);
	border: 1px solid rgba(255,255,255,0.08);
}

.dashboard-kpis span {
	display: block;
	margin-bottom: 0.5em;
	color: rgba(255,255,255,0.55);
	font-size: 0.55em;
	font-weight: 900;
	letter-spacing: 0.1em;
}

.dashboard-kpis strong {
	display: block;
	color: #ffffff;
	font-size: 1.25em;
}

.dashboard-kpis i {
	display: block;
	margin-top: 0.3em;
	color: #7bd0c1;
	font-size: 0.6em;
	font-style: normal;
}

.dashboard-hero-chart {
	position: relative;
	height: 150px;
	padding: 1em;
	margin-bottom: 0.8em;
	border-radius: 10px;
	background: rgba(255,255,255,0.04);
	overflow: hidden;
}

.dashboard-line-chart {
	position: relative;
	width: 100%;
	height: 100%;
	background:
		linear-gradient(
			to right,
			transparent 0%,
			transparent 19%,
			rgba(255,255,255,0.05) 20%,
			transparent 21%,
			transparent 39%,
			rgba(255,255,255,0.05) 40%,
			transparent 41%,
			transparent 59%,
			rgba(255,255,255,0.05) 60%,
			transparent 61%,
			transparent 79%,
			rgba(255,255,255,0.05) 80%,
			transparent 81%
		);
}

.dashboard-line-chart::before {
	content: '';
	position: absolute;
	left: 5%;
	right: 5%;
	top: 61%;
	height: 3px;

	background:
		linear-gradient(
			90deg,
			#f2849e,
			#ae85ca,
			#7ecaf6,
			#7bd0c1
		);

	transform: rotate(-8deg);
	transform-origin: center;
	border-radius: 100px;
}

.dashboard-point {
	position: absolute;
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: #ffffff;
	border: 3px solid #f2849e;
	z-index: 2;
}

.dashboard-point--1 {
	left: 6%;
	top: 71%;
}

.dashboard-point--2 {
	left: 27%;
	top: 61%;
	border-color: #ae85ca;
}

.dashboard-point--3 {
	left: 49%;
	top: 52%;
	border-color: #7ecaf6;
}

.dashboard-point--4 {
	left: 71%;
	top: 42%;
	border-color: #7bd0c1;
}

.dashboard-point--5 {
	right: 5%;
	top: 31%;
	border-color: #f2849e;
}

.dashboard-hero-bottom {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 0.7em;
}

.dashboard-hero-bottom > div {
	padding: 0.9em;
	border-radius: 10px;
	background: rgba(255,255,255,0.06);
}

.dashboard-hero-bottom span {
	display: block;
	margin-bottom: 0.3em;
	color: rgba(255,255,255,0.5);
	font-size: 0.55em;
	font-weight: 900;
	letter-spacing: 0.1em;
}

.dashboard-hero-bottom strong {
	color: #ffffff;
	font-size: 0.8em;
}


/* WHAT CUSTOM MEANS
--------------------------------------------------------- */

.dashboard-custom {
	margin-bottom: 6em;
}

.dashboard-custom > .service-section-heading {
	max-width: 780px;
	margin-bottom: 2.5em;
}

.dashboard-custom__grid {
	display: grid;
	grid-template-columns: repeat(6, minmax(0, 1fr));
	gap: 1.2em;
}

.dashboard-custom__grid article {
	grid-column: span 2;
	min-height: 260px;
	padding: 2em;
	border-radius: 16px;
	background: #ffffff;
	border: 1px solid #e4e4e4;
}

.dashboard-custom__grid article:nth-child(4),
.dashboard-custom__grid article:nth-child(5) {
	grid-column: span 3;
}

.dashboard-custom__grid article > span {
	display: block;
	margin-bottom: 2em;
	color: #f2849e;
	font-size: 0.68em;
	font-weight: 900;
}

.dashboard-custom__grid article:nth-child(2) > span {
	color: #7ecaf6;
}

.dashboard-custom__grid article:nth-child(3) > span {
	color: #7bd0c1;
}

.dashboard-custom__grid article:nth-child(4) > span {
	color: #c75b9b;
}

.dashboard-custom__grid article:nth-child(5) > span {
	color: #ae85ca;
}

.dashboard-custom__grid h3 {
	margin: 0 0 0.6em;
	font-size: 1.15em;
}

.dashboard-custom__grid p {
	margin: 0;
}


/* POWER BI
--------------------------------------------------------- */

.dashboard-powerbi {
	display: grid;
	grid-template-columns: 1.1fr 0.9fr;
	gap: 5em;
	align-items: center;

	margin-bottom: 6em;
	padding: 4em;

	border-radius: 22px;
	background: #585858;
	color: #ffffff;
}

.dashboard-powerbi h2 {
	margin-bottom: 0.7em;
	color: #ffffff;
	font-size: 2.45em;
}

.dashboard-powerbi__copy p {
	color: rgba(255,255,255,0.78);
}

.dashboard-powerbi__link {
	display: inline-block;
	margin-top: 0.5em;
	border: 0;
	color: #ffffff;
	font-size: 0.75em;
	font-weight: 900;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.dashboard-powerbi__link span {
	display: inline-block;
	margin-left: 0.4em;
	color: #f2849e;
}

.dashboard-powerbi__visual {
	min-height: 350px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.powerbi-model {
	position: relative;
	width: 100%;
	max-width: 430px;
	height: 320px;
}

.powerbi-model::before,
.powerbi-model::after {
	content: '';
	position: absolute;
	z-index: 1;
	background: rgba(255,255,255,0.14);
}

.powerbi-model::before {
	left: 18%;
	right: 18%;
	top: 50%;
	height: 1px;
}

.powerbi-model::after {
	top: 17%;
	bottom: 17%;
	left: 50%;
	width: 1px;
}

.powerbi-model__table {
	position: absolute;
	z-index: 2;
	width: 125px;
	padding: 1em;
	border-radius: 12px;
	background: rgba(255,255,255,0.08);
	border: 1px solid rgba(255,255,255,0.13);
}

.powerbi-model__table--1 {
	top: 0;
	left: 0;
}

.powerbi-model__table--2 {
	top: 0;
	right: 0;
}

.powerbi-model__table--3 {
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
}

.powerbi-model__table span {
	display: block;
	margin-bottom: 0.8em;
	color: #7ecaf6;
	font-size: 0.62em;
	font-weight: 900;
	letter-spacing: 0.1em;
}

.powerbi-model__table i {
	display: block;
	height: 5px;
	margin-top: 0.45em;
	border-radius: 100px;
	background: rgba(255,255,255,0.18);
}

.powerbi-model__center {
	position: absolute;
	z-index: 3;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);

	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;

	width: 145px;
	height: 145px;

	border-radius: 50%;

	background:
		linear-gradient(
			135deg,
			rgba(242,132,158,0.24),
			rgba(126,202,246,0.22)
		);

	border: 1px solid rgba(255,255,255,0.16);

	text-align: center;
}

.powerbi-model__center span {
	margin-bottom: 0.5em;
	color: #7bd0c1;
	font-size: 0.62em;
	font-weight: 900;
	letter-spacing: 0.14em;
}

.powerbi-model__center strong {
	color: #ffffff;
	font-size: 0.85em;
	line-height: 1.4;
}


/* EXCEL + R
--------------------------------------------------------- */

.dashboard-tools {
	margin-bottom: 6em;
}

.dashboard-tools__heading {
	max-width: 780px;
	margin-bottom: 2.5em;
}

.dashboard-tools__heading h2 {
	margin-bottom: 0.7em;
}

.dashboard-tools__grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1.4em;
}

.dashboard-tool-card {
	position: relative;
	min-height: 310px;
	padding: 2.3em;
	border-radius: 18px;
	background: #ffffff;
	border: 1px solid #e4e4e4;
	overflow: hidden;
}

.dashboard-tool-card::before {
	content: '';
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 5px;
}

.dashboard-tool-card--excel::before {
	background: #7bd0c1;
}

.dashboard-tool-card--r::before {
	background:
		linear-gradient(
			90deg,
			#7ecaf6,
			#ae85ca
		);
}

.dashboard-tool-card > span {
	display: block;
	margin-bottom: 1.7em;
	color: #999999;
	font-size: 0.68em;
	font-weight: 900;
	letter-spacing: 0.2em;
}

.dashboard-tool-card h3 {
	margin: 0 0 0.7em;
	font-size: 1.4em;
}

.dashboard-tool-tags {
	display: flex;
	flex-wrap: wrap;
	gap: 0.6em;
	margin-top: 1.5em;
}

.dashboard-tool-tags span {
	padding: 0.45em 0.8em;
	border-radius: 100px;
	background: #f7f7f7;
	border: 1px solid #e5e5e5;
	font-size: 0.7em;
	font-weight: 700;
}

.dashboard-tools__closing {
	max-width: 800px;
	margin: 2em 0 0;
	padding-left: 1.2em;
	border-left: 3px solid #7ecaf6;
	font-weight: 700;
}


/* USE CASES
--------------------------------------------------------- */

.dashboard-use-cases {
	margin-bottom: 6em;
	padding: 4em;
	border-radius: 22px;
	background: #585858;
	color: #ffffff;
}

.dashboard-use-cases__intro {
	max-width: 800px;
	margin-bottom: 3em;
}

.dashboard-use-cases h2,
.dashboard-use-cases h3 {
	color: #ffffff;
}

.dashboard-use-cases__intro h2 {
	margin-bottom: 0.7em;
	font-size: 2.4em;
}

.dashboard-use-cases__intro p {
	color: rgba(255,255,255,0.78);
}

.dashboard-use-cases__grid {
	display: grid;
	grid-template-columns: repeat(6, minmax(0, 1fr));
	gap: 1px;
	background: rgba(255,255,255,0.13);
	border: 1px solid rgba(255,255,255,0.13);
	border-radius: 15px;
	overflow: hidden;
}

.dashboard-use-cases__grid article {
	grid-column: span 2;
	min-height: 240px;
	padding: 2em;
	background: #585858;
}

.dashboard-use-cases__grid article:nth-child(4),
.dashboard-use-cases__grid article:nth-child(5) {
	grid-column: span 3;
}

.dashboard-use-cases__grid article > span {
	display: block;
	margin-bottom: 2em;
	color: #f2849e;
	font-size: 0.68em;
	font-weight: 900;
}

.dashboard-use-cases__grid article:nth-child(2) > span {
	color: #7ecaf6;
}

.dashboard-use-cases__grid article:nth-child(3) > span {
	color: #7bd0c1;
}

.dashboard-use-cases__grid article:nth-child(4) > span {
	color: #c75b9b;
}

.dashboard-use-cases__grid article:nth-child(5) > span {
	color: #ae85ca;
}

.dashboard-use-cases__grid h3 {
	margin: 0 0 0.6em;
	font-size: 1.1em;
}

.dashboard-use-cases__grid p {
	margin: 0;
	color: rgba(255,255,255,0.72);
}


/* PROCESS
--------------------------------------------------------- */

.dashboard-process {
	margin-bottom: 6em;
}

.dashboard-process__heading {
	max-width: 800px;
	margin-bottom: 3em;
}

.dashboard-process__heading h2 {
	margin-bottom: 0.7em;
}

.dashboard-process__steps {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1.2em;
}

.dashboard-process__steps article {
	min-height: 280px;
	padding: 2em;
	border-radius: 16px;
	background: #ffffff;
	border: 1px solid #e4e4e4;
}

.dashboard-process__steps article > span {
	display: block;
	margin-bottom: 2em;
	color: #f2849e;
	font-size: 0.68em;
	font-weight: 900;
}

.dashboard-process__steps article:nth-child(2) > span,
.dashboard-process__steps article:nth-child(6) > span {
	color: #7ecaf6;
}

.dashboard-process__steps article:nth-child(3) > span {
	color: #7bd0c1;
}

.dashboard-process__steps article:nth-child(4) > span {
	color: #c75b9b;
}

.dashboard-process__steps article:nth-child(5) > span {
	color: #ae85ca;
}

.dashboard-process__steps h3 {
	margin: 0 0 0.6em;
	font-size: 1.1em;
}

.dashboard-process__steps p {
	margin: 0;
}


/* DECISION QUESTIONS
--------------------------------------------------------- */

.dashboard-decisions {
	display: grid;
	grid-template-columns: 0.8fr 1.2fr;
	gap: 5em;

	margin-bottom: 6em;
	padding: 4em;

	border-radius: 22px;

	background:
		linear-gradient(
			125deg,
			#f2849e,
			#ae85ca,
			#7ecaf6
		);

	color: #ffffff;
}

.dashboard-decisions h2 {
	margin-bottom: 0.7em;
	color: #ffffff;
	font-size: 2.3em;
}

.dashboard-decisions__heading > p {
	color: rgba(255,255,255,0.85);
}

.dashboard-decisions__questions {
	border-top: 1px solid rgba(255,255,255,0.25);
}

.dashboard-decisions__questions article {
	display: grid;
	grid-template-columns: 50px 1fr;
	gap: 1em;
	padding: 1.4em 0;
	border-bottom: 1px solid rgba(255,255,255,0.25);
}

.dashboard-decisions__questions article > span {
	color: #ffffff;
	font-size: 0.68em;
	font-weight: 900;
}

.dashboard-decisions__questions p {
	margin: 0;
	color: rgba(255,255,255,0.82);
	font-size: 1em;
}

.dashboard-decisions__questions strong {
	color: #ffffff;
}


/* DATA → DECISION FLOW
--------------------------------------------------------- */

.dashboard-system {
	margin-bottom: 6em;
	padding: 4em;
	border-radius: 22px;
	background: #fafafa;
	border: 1px solid #e5e5e5;
}

.dashboard-system__heading {
	max-width: 760px;
	margin-bottom: 2.5em;
}

.dashboard-system__heading > span {
	display: block;
	margin-bottom: 0.8em;
	color: #f2849e;
	font-size: 0.68em;
	font-weight: 900;
	letter-spacing: 0.2em;
}

.dashboard-system__heading h2 {
	margin: 0;
}

.dashboard-system__flow {
	display: flex;
	align-items: stretch;
	gap: 0.7em;
}

.dashboard-system__flow > div {
	flex: 1 1 0;
	padding: 1.4em;
	border-radius: 14px;
	background: #ffffff;
	border: 1px solid #e5e5e5;
}

.dashboard-system__flow > div span {
	display: block;
	margin-bottom: 0.6em;
	color: #f2849e;
	font-size: 0.65em;
	font-weight: 900;
}

.dashboard-system__flow > div:nth-of-type(2) span {
	color: #7ecaf6;
}

.dashboard-system__flow > div:nth-of-type(3) span {
	color: #7bd0c1;
}

.dashboard-system__flow > div:nth-of-type(4) span {
	color: #ae85ca;
}

.dashboard-system__flow > div:nth-of-type(5) span {
	color: #c75b9b;
}

.dashboard-system__flow strong {
	display: block;
	margin-bottom: 0.3em;
}

.dashboard-system__flow p {
	margin: 0;
	font-size: 0.82em;
}

.dashboard-system__flow > b {
	display: flex;
	align-items: center;
	color: #bbbbbb;
}


/* CTA
--------------------------------------------------------- */

.service-cta--dashboard {
	background:
		linear-gradient(
			110deg,
			rgba(126,202,246,0.12),
			rgba(174,133,202,0.09),
			rgba(242,132,158,0.09)
		);
}


/* TABLET
--------------------------------------------------------- */

@media screen and (max-width: 980px) {

	.dashboard-custom__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.dashboard-custom__grid article,
	.dashboard-custom__grid article:nth-child(4),
	.dashboard-custom__grid article:nth-child(5) {
		grid-column: auto;
	}

	.dashboard-powerbi,
	.dashboard-decisions {
		grid-template-columns: 1fr;
		gap: 2.5em;
	}

	.dashboard-use-cases__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.dashboard-use-cases__grid article,
	.dashboard-use-cases__grid article:nth-child(4),
	.dashboard-use-cases__grid article:nth-child(5) {
		grid-column: auto;
	}

	.dashboard-process__steps {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.dashboard-system__flow {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.dashboard-system__flow > b {
		display: none;
	}

}


/* MOBILE
--------------------------------------------------------- */

@media screen and (max-width: 736px) {

	.dashboard-custom,
	.dashboard-powerbi,
	.dashboard-tools,
	.dashboard-use-cases,
	.dashboard-process,
	.dashboard-decisions,
	.dashboard-system {
		margin-bottom: 4em;
	}

	.dashboard-custom__grid,
	.dashboard-tools__grid,
	.dashboard-use-cases__grid,
	.dashboard-process__steps,
	.dashboard-system__flow {
		grid-template-columns: 1fr;
	}

	.dashboard-powerbi,
	.dashboard-use-cases,
	.dashboard-decisions,
	.dashboard-system {
		padding: 2em 1.5em;
		border-radius: 15px;
	}

	.dashboard-powerbi h2,
	.dashboard-use-cases__intro h2,
	.dashboard-decisions h2 {
		font-size: 1.8em;
	}

	.dashboard-custom__grid article,
	.dashboard-tool-card,
	.dashboard-use-cases__grid article,
	.dashboard-process__steps article {
		min-height: auto;
	}

	.dashboard-powerbi__visual {
		min-height: 310px;
	}

	.dashboard-kpis {
		grid-template-columns: 1fr;
	}

	.dashboard-hero-bottom {
		grid-template-columns: 1fr;
	}

}

/* =========================================================
   DASHBOARD HUB
   ========================================================= */


/* HERO
--------------------------------------------------------- */

.service-hero--dashboard-hub {
	background:
		radial-gradient(
			circle at 94% 8%,
			rgba(126,202,246,0.18),
			transparent 30%
		),
		radial-gradient(
			circle at 5% 92%,
			rgba(174,133,202,0.14),
			transparent 34%
		),
		#ffffff;
}


/* HERO PANEL
--------------------------------------------------------- */

.dashboard-hub-panel {
	padding: 1.5em;
	border-radius: 20px;
	background: #585858;
	color: #ffffff;
	box-shadow: 0 22px 55px rgba(88,88,88,0.18);
}

.dashboard-hub-panel__top {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 1.3em;
}

.dashboard-hub-panel__top span {
	font-size: 0.63em;
	font-weight: 900;
	letter-spacing: 0.18em;
}

.dashboard-hub-panel__top strong {
	color: #7ecaf6;
	font-size: 0.7em;
}

.dashboard-hub-kpis {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 0.7em;
	margin-bottom: 0.8em;
}

.dashboard-hub-kpis > div {
	padding: 1em;
	border-radius: 10px;
	background: rgba(255,255,255,0.07);
	border: 1px solid rgba(255,255,255,0.08);
}

.dashboard-hub-kpis span {
	display: block;
	margin-bottom: 0.5em;
	color: #f2849e;
	font-size: 0.6em;
	font-weight: 900;
}

.dashboard-hub-kpis > div:nth-child(2) span {
	color: #7ecaf6;
}

.dashboard-hub-kpis > div:nth-child(3) span {
	color: #7bd0c1;
}

.dashboard-hub-kpis strong {
	display: block;
	color: #ffffff;
	font-size: 0.85em;
}

.dashboard-hub-kpis p {
	margin: 0.3em 0 0;
	color: rgba(255,255,255,0.6);
	font-size: 0.68em;
}

.dashboard-hub-chart {
	display: flex;
	align-items: flex-end;
	gap: 0.55em;
	height: 145px;
	padding: 1em;
	border-radius: 10px;
	background: rgba(255,255,255,0.04);
}

.dashboard-hub-chart i {
	flex: 1;
	border-radius: 6px 6px 2px 2px;
	background:
		linear-gradient(
			to top,
			#f2849e,
			#7ecaf6
		);
}

.dashboard-hub-panel__bottom {
	margin-top: 0.9em;
	padding-top: 0.9em;
	border-top: 1px solid rgba(255,255,255,0.13);
}

.dashboard-hub-panel__bottom span {
	color: rgba(255,255,255,0.62);
	font-size: 0.6em;
	font-weight: 900;
	letter-spacing: 0.15em;
}


/* CUSTOM DASHBOARD FEATURE
--------------------------------------------------------- */

.dashboard-custom-feature {
	display: grid;
	grid-template-columns: 0.8fr 1.2fr;
	gap: 4em;
	align-items: center;
	margin-bottom: 6em;
}

.dashboard-custom-feature__copy h2 {
	margin-bottom: 0.7em;
	font-size: 2.25em;
}

.dashboard-custom-feature__link {
	display: inline-block;
	margin-top: 0.5em;
	border: 0;
	font-size: 0.75em;
	font-weight: 900;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.dashboard-custom-feature__link span {
	display: inline-block;
	margin-left: 0.4em;
	color: #f2849e;
}

.dashboard-custom-feature__card {
	display: block;
	padding: 2em;
	border: 0;
	border-radius: 20px;
	background: #585858;
	color: #ffffff;
	box-shadow: 0 20px 50px rgba(88,88,88,0.14);
	transition:
		transform 0.25s ease,
		box-shadow 0.25s ease;
}

.dashboard-custom-feature__card:hover {
	transform: translateY(-5px);
	box-shadow: 0 26px 60px rgba(88,88,88,0.18);
}

.dashboard-custom-feature__card-top {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 1.4em;
}

.dashboard-custom-feature__card-top span {
	color: #7ecaf6;
	font-size: 0.62em;
	font-weight: 900;
	letter-spacing: 0.16em;
}

.dashboard-custom-feature__card-top strong {
	color: rgba(255,255,255,0.4);
}

.dashboard-custom-feature__mockup {
	padding: 1em;
	margin-bottom: 1.5em;
	border-radius: 12px;
	background: rgba(255,255,255,0.05);
}

.dashboard-custom-mini-kpis {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 0.5em;
	margin-bottom: 0.7em;
}

.dashboard-custom-mini-kpis i {
	height: 38px;
	border-radius: 7px;
	background: rgba(255,255,255,0.08);
}

.dashboard-custom-mini-chart {
	position: relative;
	height: 100px;
	border-radius: 8px;
	background:
		linear-gradient(
			135deg,
			rgba(242,132,158,0.10),
			rgba(126,202,246,0.08)
		);
	overflow: hidden;
}

.dashboard-custom-mini-chart span {
	position: absolute;
	left: 7%;
	right: 7%;
	top: 55%;
	height: 3px;
	border-radius: 100px;
	background:
		linear-gradient(
			90deg,
			#f2849e,
			#ae85ca,
			#7ecaf6,
			#7bd0c1
		);
	transform: rotate(-7deg);
}

.dashboard-custom-mini-bars {
	display: grid;
	gap: 0.4em;
	margin-top: 0.8em;
}

.dashboard-custom-mini-bars i {
	display: block;
	height: 6px;
	border-radius: 100px;
	background: rgba(255,255,255,0.15);
}

.dashboard-custom-feature__card-copy h3 {
	margin: 0 0 0.6em;
	color: #ffffff;
	font-size: 1.4em;
}

.dashboard-custom-feature__card-copy p {
	color: rgba(255,255,255,0.75);
}

.dashboard-custom-feature__cta {
	display: block;
	margin-top: 1em;
	color: #f2849e;
	font-size: 0.72em;
	font-weight: 900;
	letter-spacing: 0.11em;
	text-transform: uppercase;
}


/* POWER BI
--------------------------------------------------------- */

.dashboard-hub-powerbi {
	display: grid;
	grid-template-columns: 0.9fr 1.1fr;
	gap: 5em;
	align-items: center;
	margin-bottom: 6em;
	padding: 4em;
	border-radius: 22px;
	background: #585858;
	color: #ffffff;
}

.dashboard-hub-powerbi h2 {
	margin-bottom: 0.7em;
	color: #ffffff;
	font-size: 2.4em;
}

.dashboard-hub-powerbi__copy p {
	color: rgba(255,255,255,0.78);
}

.dashboard-bi-window {
	padding: 1.2em;
	border-radius: 16px;
	background: rgba(255,255,255,0.07);
	border: 1px solid rgba(255,255,255,0.12);
}

.dashboard-bi-window__header {
	display: flex;
	align-items: center;
	gap: 0.4em;
	margin-bottom: 1em;
}

.dashboard-bi-window__header > span {
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: rgba(255,255,255,0.32);
}

.dashboard-bi-window__header strong {
	margin-left: auto;
	color: #7ecaf6;
	font-size: 0.62em;
	letter-spacing: 0.12em;
}

.dashboard-bi-window__body {
	display: grid;
	grid-template-columns: 55px 1fr;
	gap: 0.7em;
}

.dashboard-bi-sidebar {
	display: grid;
	align-content: start;
	gap: 0.6em;
	padding: 0.6em;
	border-radius: 8px;
	background: rgba(255,255,255,0.04);
}

.dashboard-bi-sidebar i {
	height: 22px;
	border-radius: 5px;
	background: rgba(255,255,255,0.08);
}

.dashboard-bi-main {
	display: grid;
	gap: 0.7em;
}

.dashboard-bi-metrics {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 0.5em;
}

.dashboard-bi-metrics i {
	height: 48px;
	border-radius: 7px;
	background: rgba(255,255,255,0.07);
}

.dashboard-bi-chart {
	display: flex;
	align-items: flex-end;
	gap: 0.5em;
	height: 170px;
	padding: 1em;
	border-radius: 8px;
	background: rgba(255,255,255,0.04);
}

.dashboard-bi-bar {
	flex: 1;
	border-radius: 6px 6px 2px 2px;
	background: #f2849e;
}

.dashboard-bi-bar--1 {
	height: 42%;
}

.dashboard-bi-bar--2 {
	height: 65%;
	background: #7ecaf6;
}

.dashboard-bi-bar--3 {
	height: 52%;
	background: #7bd0c1;
}

.dashboard-bi-bar--4 {
	height: 82%;
	background: #ae85ca;
}

.dashboard-bi-bar--5 {
	height: 71%;
	background: #c75b9b;
}


/* EXPECTATIONS
--------------------------------------------------------- */

.dashboard-expectations {
	margin-bottom: 6em;
}

.dashboard-expectations > .service-section-heading {
	max-width: 800px;
	margin-bottom: 2.5em;
}

.dashboard-expectations__grid {
	display: grid;
	grid-template-columns: repeat(6, minmax(0, 1fr));
	gap: 1.2em;
}

.dashboard-expectations__grid article {
	grid-column: span 2;
	min-height: 260px;
	padding: 2em;
	border-radius: 16px;
	background: #ffffff;
	border: 1px solid #e4e4e4;
}

.dashboard-expectations__grid article:nth-child(4),
.dashboard-expectations__grid article:nth-child(5) {
	grid-column: span 3;
}

.dashboard-expectations__grid article > span {
	display: block;
	margin-bottom: 2em;
	color: #f2849e;
	font-size: 0.68em;
	font-weight: 900;
}

.dashboard-expectations__grid article:nth-child(2) > span {
	color: #7ecaf6;
}

.dashboard-expectations__grid article:nth-child(3) > span {
	color: #7bd0c1;
}

.dashboard-expectations__grid article:nth-child(4) > span {
	color: #c75b9b;
}

.dashboard-expectations__grid article:nth-child(5) > span {
	color: #ae85ca;
}

.dashboard-expectations__grid h3 {
	margin: 0 0 0.6em;
	font-size: 1.15em;
}

.dashboard-expectations__grid p {
	margin: 0;
}


/* USE CASES
--------------------------------------------------------- */

.dashboard-hub-use-cases {
	margin-bottom: 6em;
	padding: 4em;
	border-radius: 22px;
	background: #585858;
	color: #ffffff;
}

.dashboard-hub-use-cases__intro {
	max-width: 800px;
	margin-bottom: 3em;
}

.dashboard-hub-use-cases h2,
.dashboard-hub-use-cases h3 {
	color: #ffffff;
}

.dashboard-hub-use-cases__intro h2 {
	margin-bottom: 0.7em;
	font-size: 2.4em;
}

.dashboard-hub-use-cases__intro p {
	color: rgba(255,255,255,0.78);
}

.dashboard-hub-use-cases__grid {
	display: grid;
	grid-template-columns: repeat(5, minmax(0, 1fr));
	gap: 1px;
	background: rgba(255,255,255,0.14);
	border: 1px solid rgba(255,255,255,0.14);
	border-radius: 15px;
	overflow: hidden;
}

.dashboard-hub-use-cases__grid article {
	min-height: 245px;
	padding: 1.7em;
	background: #585858;
}

.dashboard-hub-use-cases__grid article > span {
	display: block;
	margin-bottom: 2em;
	color: #f2849e;
	font-size: 0.68em;
	font-weight: 900;
}

.dashboard-hub-use-cases__grid article:nth-child(2) > span {
	color: #7ecaf6;
}

.dashboard-hub-use-cases__grid article:nth-child(3) > span {
	color: #7bd0c1;
}

.dashboard-hub-use-cases__grid article:nth-child(4) > span {
	color: #c75b9b;
}

.dashboard-hub-use-cases__grid article:nth-child(5) > span {
	color: #ae85ca;
}

.dashboard-hub-use-cases__grid p {
	margin: 0;
	color: rgba(255,255,255,0.7);
	font-size: 0.9em;
}


/* EXCEL + R
--------------------------------------------------------- */

.dashboard-hub-tools {
	margin-bottom: 6em;
}

.dashboard-hub-tools__heading {
	max-width: 780px;
	margin-bottom: 2.5em;
}

.dashboard-hub-tools__heading h2 {
	margin-bottom: 0.7em;
}

.dashboard-hub-tools__grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1.4em;
}

.dashboard-hub-tools__grid article {
	padding: 2.3em;
	border-radius: 18px;
	background: #ffffff;
	border: 1px solid #e4e4e4;
}

.dashboard-hub-tools__grid article > span {
	display: block;
	margin-bottom: 1.4em;
	color: #7bd0c1;
	font-size: 0.7em;
	font-weight: 900;
	letter-spacing: 0.18em;
}

.dashboard-hub-tools__grid article:nth-child(2) > span {
	color: #7ecaf6;
}

.dashboard-hub-tools__grid h3 {
	margin: 0 0 0.7em;
	font-size: 1.35em;
}

.dashboard-hub-tools__grid p {
	margin: 0;
}

.dashboard-hub-tools__closing {
	max-width: 800px;
	margin: 2em 0 0;
	padding-left: 1.2em;
	border-left: 3px solid #7ecaf6;
	font-weight: 700;
}


/* PROCESS
--------------------------------------------------------- */

.dashboard-hub-process {
	margin-bottom: 6em;
}

.dashboard-hub-process__heading {
	max-width: 800px;
	margin-bottom: 3em;
}

.dashboard-hub-process__heading h2 {
	margin-bottom: 0.7em;
}

.dashboard-hub-process__steps {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1.2em;
}

.dashboard-hub-process__steps article {
	min-height: 270px;
	padding: 2em;
	border-radius: 16px;
	background: #ffffff;
	border: 1px solid #e4e4e4;
}

.dashboard-hub-process__steps article > span {
	display: block;
	margin-bottom: 2em;
	color: #f2849e;
	font-size: 0.68em;
	font-weight: 900;
}

.dashboard-hub-process__steps article:nth-child(2) > span,
.dashboard-hub-process__steps article:nth-child(6) > span {
	color: #7ecaf6;
}

.dashboard-hub-process__steps article:nth-child(3) > span {
	color: #7bd0c1;
}

.dashboard-hub-process__steps article:nth-child(4) > span {
	color: #c75b9b;
}

.dashboard-hub-process__steps article:nth-child(5) > span {
	color: #ae85ca;
}

.dashboard-hub-process__steps h3 {
	margin: 0 0 0.55em;
	font-size: 1.1em;
}

.dashboard-hub-process__steps p {
	margin: 0;
}


/* MARKETING CONNECTION
--------------------------------------------------------- */

.dashboard-marketing {
	display: grid;
	grid-template-columns: 0.9fr 1.1fr;
	gap: 4em;
	align-items: center;
	margin-bottom: 6em;
	padding: 4em;
	border-radius: 22px;

	background:
		linear-gradient(
			125deg,
			#f2849e,
			#ae85ca,
			#7ecaf6
		);

	color: #ffffff;
}

.dashboard-marketing h2 {
	margin-bottom: 0.7em;
	color: #ffffff;
	font-size: 2.3em;
}

.dashboard-marketing__copy p {
	color: rgba(255,255,255,0.86);
}

.dashboard-marketing__flow {
	display: flex;
	align-items: stretch;
	gap: 0.65em;
}

.dashboard-marketing__flow > div {
	flex: 1 1 0;
	padding: 1.2em;
	border-radius: 12px;
	background: rgba(255,255,255,0.1);
	border: 1px solid rgba(255,255,255,0.2);
}

.dashboard-marketing__flow span {
	display: block;
	margin-bottom: 0.5em;
	color: #ffffff;
	font-size: 0.65em;
	font-weight: 900;
	letter-spacing: 0.08em;
}

.dashboard-marketing__flow p {
	margin: 0;
	color: rgba(255,255,255,0.78);
	font-size: 0.78em;
}

.dashboard-marketing__flow > b {
	display: flex;
	align-items: center;
	color: rgba(255,255,255,0.7);
}


/* CTA
--------------------------------------------------------- */

.service-cta--dashboard-hub {
	background:
		linear-gradient(
			110deg,
			rgba(126,202,246,0.12),
			rgba(174,133,202,0.09),
			rgba(242,132,158,0.09)
		);
}


/* TABLET
--------------------------------------------------------- */

@media screen and (max-width: 980px) {

	.dashboard-custom-feature,
	.dashboard-hub-powerbi,
	.dashboard-marketing {
		grid-template-columns: 1fr;
		gap: 2.5em;
	}

	.dashboard-expectations__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.dashboard-expectations__grid article,
	.dashboard-expectations__grid article:nth-child(4),
	.dashboard-expectations__grid article:nth-child(5) {
		grid-column: auto;
	}

	.dashboard-hub-use-cases__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.dashboard-hub-process__steps {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.dashboard-marketing__flow {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.dashboard-marketing__flow > b {
		display: none;
	}

}


/* MOBILE
--------------------------------------------------------- */

@media screen and (max-width: 736px) {

	.dashboard-custom-feature,
	.dashboard-hub-powerbi,
	.dashboard-expectations,
	.dashboard-hub-use-cases,
	.dashboard-hub-tools,
	.dashboard-hub-process,
	.dashboard-marketing {
		margin-bottom: 4em;
	}

	.dashboard-expectations__grid,
	.dashboard-hub-use-cases__grid,
	.dashboard-hub-tools__grid,
	.dashboard-hub-process__steps,
	.dashboard-marketing__flow {
		grid-template-columns: 1fr;
	}

	.dashboard-hub-powerbi,
	.dashboard-hub-use-cases,
	.dashboard-marketing {
		padding: 2em 1.5em;
		border-radius: 15px;
	}

	.dashboard-hub-powerbi h2,
	.dashboard-hub-use-cases__intro h2,
	.dashboard-marketing h2 {
		font-size: 1.8em;
	}

	.dashboard-expectations__grid article,
	.dashboard-hub-use-cases__grid article,
	.dashboard-hub-process__steps article {
		min-height: auto;
	}

	.dashboard-hub-kpis {
		grid-template-columns: 1fr;
	}

}

/* =========================================================
   WEB DESIGN
   ========================================================= */


/* HERO
--------------------------------------------------------- */

.webdesign-hero {
	position: relative;
	display: grid;
	grid-template-columns: minmax(0, 1.05fr) minmax(380px, 0.95fr);
	gap: 4em;
	align-items: center;

	margin: 1em 0 6em;
	padding: 4.5em;

	border-radius: 24px;
	overflow: hidden;

	background:
		radial-gradient(
			circle at 92% 8%,
			rgba(126,202,246,0.19),
			transparent 30%
		),
		radial-gradient(
			circle at 8% 94%,
			rgba(242,132,158,0.17),
			transparent 34%
		),
		#ffffff;

	border: 1px solid #e5e5e5;
}

.webdesign-hero::after {
	content: '';
	position: absolute;
	right: -160px;
	top: -170px;
	width: 450px;
	height: 450px;
	border-radius: 50%;
	border: 1px solid rgba(126,202,246,0.22);
	box-shadow:
		0 0 0 45px rgba(126,202,246,0.04),
		0 0 0 90px rgba(242,132,158,0.03);
}

.webdesign-hero > * {
	position: relative;
	z-index: 2;
}

.webdesign-hero h1 {
	max-width: 820px;
	margin-bottom: 0.55em;
	font-size: clamp(3.2em, 5.4vw, 5.25em);
	line-height: 0.98;
}

.webdesign-hero h1 span {
	display: block;

	background:
		linear-gradient(
			90deg,
			#f2849e,
			#ae85ca,
			#7ecaf6
		);

	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text;
}

.webdesign-hero__lead {
	margin-bottom: 0.8em;
	font-size: 1.14em;
}

.webdesign-hero__support {
	margin-bottom: 2em;
	line-height: 1.75;
}


/* HERO BROWSER MOCKUP
--------------------------------------------------------- */

.webdesign-hero__visual {
	position: relative;
	min-height: 470px;
}

.webdesign-browser {
	position: absolute;
	top: 15px;
	left: 0;
	right: 35px;
	border-radius: 18px;
	overflow: hidden;
	background: #ffffff;
	border: 1px solid #dddddd;
	box-shadow: 0 26px 60px rgba(88,88,88,0.16);
}

.webdesign-browser__top {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 0.85em 1em;
	background: #585858;
}

.webdesign-browser__top > div {
	display: flex;
	gap: 0.35em;
}

.webdesign-browser__top > div span {
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: rgba(255,255,255,0.35);
}

.webdesign-browser__top strong {
	color: rgba(255,255,255,0.7);
	font-size: 0.55em;
	letter-spacing: 0.12em;
}

.webdesign-browser__site {
	padding: 1em;
}

.webdesign-browser__nav {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 0.8em;
}

.webdesign-browser__nav > i {
	width: 70px;
	height: 12px;
	border-radius: 100px;
	background: #585858;
}

.webdesign-browser__nav > div {
	display: flex;
	gap: 0.45em;
}

.webdesign-browser__nav span {
	width: 34px;
	height: 6px;
	border-radius: 100px;
	background: #dddddd;
}

.webdesign-browser__hero {
	min-height: 235px;
	padding: 2em;
	border-radius: 12px;

	background:
		linear-gradient(
			135deg,
			rgba(242,132,158,0.16),
			rgba(174,133,202,0.11),
			rgba(126,202,246,0.15)
		);
}

.webdesign-browser__hero > span {
	display: block;
	margin-bottom: 0.8em;
	color: #f2849e;
	font-size: 0.55em;
	font-weight: 900;
	letter-spacing: 0.15em;
}

.webdesign-browser__hero h3 {
	max-width: 280px;
	margin-bottom: 1em;
	font-size: 1.45em;
	line-height: 1.15;
}

.webdesign-browser__hero i {
	display: block;
	width: 90px;
	height: 9px;
	border-radius: 100px;
	background: #585858;
}

.webdesign-browser__cards {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 0.6em;
	margin-top: 0.8em;
}

.webdesign-browser__cards span {
	height: 60px;
	border-radius: 8px;
	background: #f4f4f4;
}

.webdesign-device {
	position: absolute;
	z-index: 3;
	padding: 7px;
	background: #585858;
	box-shadow: 0 16px 35px rgba(88,88,88,0.2);
}

.webdesign-device > div {
	width: 100%;
	height: 100%;
	background:
		linear-gradient(
			145deg,
			rgba(242,132,158,0.22),
			rgba(126,202,246,0.24)
		);
}

.webdesign-device--tablet {
	right: 0;
	bottom: 25px;
	width: 135px;
	height: 175px;
	border-radius: 14px;
}

.webdesign-device--phone {
	right: 115px;
	bottom: 0;
	width: 72px;
	height: 145px;
	border-radius: 16px;
}


/* LIBRARY INTRO
--------------------------------------------------------- */

.webdesign-library-intro {
	margin-bottom: 4em;
}

.webdesign-library-intro__grid {
	display: grid;
	grid-template-columns: 0.8fr 1.2fr;
	gap: 5em;
}

.webdesign-library-intro h2 {
	margin: 0;
	font-size: 2.35em;
	line-height: 1.2;
}

.webdesign-library-intro__grid p {
	font-size: 1.05em;
	line-height: 1.8;
}

.webdesign-library-intro__note {
	margin-top: 1.5em;
	padding-left: 1.2em;
	border-left: 3px solid #f2849e;
}


/* CONCEPT LIBRARY
--------------------------------------------------------- */

.webdesign-concepts {
	margin-bottom: 6em;
}

.webdesign-concepts__heading {
	max-width: 760px;
	margin-bottom: 2.5em;
}

.webdesign-concepts__heading > span {
	display: block;
	margin-bottom: 0.9em;
	color: #f2849e;
	font-size: 0.68em;
	font-weight: 900;
	letter-spacing: 0.2em;
}

.webdesign-concepts__heading h2 {
	margin: 0;
	font-size: 2.2em;
}

.webdesign-concepts__grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1.5em;
}

.webdesign-concept-card {
	display: block;
	border: 0;
	border-radius: 20px;
	overflow: hidden;
	background: #ffffff;
	border: 1px solid #e4e4e4;
	transition:
		transform 0.25s ease,
		box-shadow 0.25s ease;
}

.webdesign-concept-card:hover {
	transform: translateY(-6px);
	box-shadow: 0 24px 55px rgba(88,88,88,0.12);
}

.webdesign-concept-card__image {
	position: relative;
	height: 280px;
	overflow: hidden;
	background: #f4f4f4;
}

.webdesign-concept-card__image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.4s ease;
}

.webdesign-concept-card:hover .webdesign-concept-card__image img {
	transform: scale(1.035);
}

.webdesign-concept-card__image > span {
	position: absolute;
	top: 1.2em;
	left: 1.2em;
	padding: 0.55em 0.8em;
	border-radius: 100px;
	background: rgba(88,88,88,0.88);
	color: #ffffff;
	font-size: 0.62em;
	font-weight: 900;
	letter-spacing: 0.12em;
}

.webdesign-concept-card__copy {
	padding: 2em;
}

.webdesign-concept-card__number {
	margin-bottom: 1.5em;
	color: #f2849e;
	font-size: 0.68em;
	font-weight: 900;
}

.webdesign-concept-card:nth-child(2) .webdesign-concept-card__number {
	color: #7ecaf6;
}

.webdesign-concept-card:nth-child(3) .webdesign-concept-card__number {
	color: #7bd0c1;
}

.webdesign-concept-card:nth-child(4) .webdesign-concept-card__number {
	color: #c75b9b;
}

.webdesign-concept-card:nth-child(5) .webdesign-concept-card__number {
	color: #ae85ca;
}

.webdesign-concept-card:nth-child(6) .webdesign-concept-card__number {
	color: #7ecaf6;
}

.webdesign-concept-card__copy h3 {
	margin: 0 0 0.65em;
	font-size: 1.45em;
}

.webdesign-concept-card__copy p {
	margin-bottom: 1.4em;
}

.webdesign-concept-card__copy strong {
	color: #585858;
	font-size: 0.72em;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.webdesign-concept-card--custom {
	background:
		linear-gradient(
			145deg,
			rgba(242,132,158,0.055),
			rgba(126,202,246,0.07)
		);
}


/* MORE THAN VISUAL
--------------------------------------------------------- */

.webdesign-more {
	margin-bottom: 6em;
	padding: 4em;
	border-radius: 22px;
	background: #585858;
	color: #ffffff;
}

.webdesign-more h2,
.webdesign-more h3 {
	color: #ffffff;
}

.webdesign-more__intro {
	max-width: 820px;
	margin-bottom: 3em;
}

.webdesign-more__intro h2 {
	margin-bottom: 0.7em;
	font-size: 2.45em;
}

.webdesign-more__intro p {
	color: rgba(255,255,255,0.78);
}

.webdesign-more__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1px;
	border: 1px solid rgba(255,255,255,0.13);
	border-radius: 15px;
	overflow: hidden;
	background: rgba(255,255,255,0.13);
}

.webdesign-more__grid article {
	min-height: 260px;
	padding: 2em;
	background: #585858;
}

.webdesign-more__grid article > span {
	display: block;
	margin-bottom: 2em;
	color: #f2849e;
	font-size: 0.68em;
	font-weight: 900;
}

.webdesign-more__grid article:nth-child(2) > span {
	color: #7ecaf6;
}

.webdesign-more__grid article:nth-child(3) > span {
	color: #7bd0c1;
}

.webdesign-more__grid article:nth-child(4) > span {
	color: #c75b9b;
}

.webdesign-more__grid article:nth-child(5) > span {
	color: #ae85ca;
}

.webdesign-more__grid article:nth-child(6) > span {
	color: #8499e7;
}

.webdesign-more__grid h3 {
	margin: 0 0 0.6em;
	font-size: 1.1em;
}

.webdesign-more__grid p {
	margin: 0;
	color: rgba(255,255,255,0.7);
}


/* PROCESS
--------------------------------------------------------- */

.webdesign-process {
	margin-bottom: 6em;
}

.webdesign-process__heading {
	max-width: 800px;
	margin-bottom: 3em;
}

.webdesign-process__heading h2 {
	margin-bottom: 0.7em;
}

.webdesign-process__steps {
	position: relative;
	display: grid;
	grid-template-columns: repeat(5, minmax(0, 1fr));
	gap: 1em;
}

.webdesign-process__steps::before {
	content: '';
	position: absolute;
	left: 7%;
	right: 7%;
	top: 23px;
	height: 1px;
	background:
		linear-gradient(
			90deg,
			#f2849e,
			#7ecaf6,
			#7bd0c1,
			#ae85ca,
			#c75b9b
		);
}

.webdesign-process__steps article {
	position: relative;
	z-index: 2;
}

.webdesign-process__steps article > span {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 46px;
	margin-bottom: 1.5em;
	border-radius: 50%;
	background: #ffffff;
	border: 2px solid #f2849e;
	color: #f2849e;
	font-size: 0.68em;
	font-weight: 900;
}

.webdesign-process__steps article:nth-child(2) > span {
	border-color: #7ecaf6;
	color: #7ecaf6;
}

.webdesign-process__steps article:nth-child(3) > span {
	border-color: #7bd0c1;
	color: #7bd0c1;
}

.webdesign-process__steps article:nth-child(4) > span {
	border-color: #ae85ca;
	color: #ae85ca;
}

.webdesign-process__steps article:nth-child(5) > span {
	border-color: #c75b9b;
	color: #c75b9b;
}

.webdesign-process__steps h3 {
	margin: 0 0 0.5em;
	font-size: 1.05em;
}

.webdesign-process__steps p {
	margin: 0;
	font-size: 0.9em;
}


/* REDESIGN
--------------------------------------------------------- */

.webdesign-redesign {
	display: grid;
	grid-template-columns: 0.9fr 1.1fr;
	gap: 5em;
	align-items: center;

	margin-bottom: 6em;
	padding: 4em;

	border-radius: 22px;

	background:
		linear-gradient(
			125deg,
			rgba(242,132,158,0.10),
			rgba(174,133,202,0.09),
			rgba(126,202,246,0.11)
		);

	border: 1px solid #e5e5e5;
}

.webdesign-redesign__eyebrow {
	display: block;
	margin-bottom: 1em;
	color: #f2849e;
	font-size: 0.68em;
	font-weight: 900;
	letter-spacing: 0.2em;
}

.webdesign-redesign__copy h2 {
	margin-bottom: 0.7em;
	font-size: 2.35em;
}

.webdesign-redesign__link {
	display: inline-block;
	margin-top: 0.6em;
	border: 0;
	font-size: 0.74em;
	font-weight: 900;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.webdesign-redesign__link span {
	margin-left: 0.4em;
	color: #f2849e;
}

.webdesign-before-after {
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	gap: 1em;
	align-items: center;
}

.webdesign-before,
.webdesign-after {
	padding: 1.3em;
	border-radius: 14px;
	background: #ffffff;
	border: 1px solid #e5e5e5;
}

.webdesign-before span,
.webdesign-after span {
	display: block;
	margin-bottom: 1em;
	font-size: 0.62em;
	font-weight: 900;
	letter-spacing: 0.15em;
}

.webdesign-before span {
	color: #999999;
}

.webdesign-after span {
	color: #7bd0c1;
}

.webdesign-before i,
.webdesign-after i {
	display: block;
	height: 9px;
	margin-bottom: 0.5em;
	border-radius: 100px;
	background: #e1e1e1;
}

.webdesign-before i:nth-child(3) {
	width: 70%;
}

.webdesign-before i:nth-child(4) {
	width: 85%;
}

.webdesign-before i:nth-child(5) {
	width: 55%;
}

.webdesign-after i {
	background:
		linear-gradient(
			90deg,
			#f2849e,
			#7ecaf6
		);
}

.webdesign-after i:nth-child(3) {
	width: 85%;
}

.webdesign-after i:nth-child(4) {
	width: 65%;
}

.webdesign-after i:nth-child(5) {
	width: 92%;
}

.webdesign-redesign-arrow {
	color: #f2849e;
	font-size: 1.5em;
}


/* MOCKUP CTA
--------------------------------------------------------- */

.webdesign-mockup-cta {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 3em;

	margin-bottom: 6em;
	padding: 4em;

	border-radius: 22px;
	overflow: hidden;

	background:
		linear-gradient(
			125deg,
			#f2849e 0%,
			#ae85ca 50%,
			#7ecaf6 100%
		);

	color: #ffffff;
}

.webdesign-mockup-cta__copy {
	max-width: 760px;
}

.webdesign-mockup-cta__copy > span {
	display: block;
	margin-bottom: 1em;
	font-size: 0.68em;
	font-weight: 900;
	letter-spacing: 0.2em;
}

.webdesign-mockup-cta h2 {
	margin-bottom: 0.5em;
	color: #ffffff;
	font-size: 2.4em;
}

.webdesign-mockup-cta p {
	margin: 0;
	color: rgba(255,255,255,0.88);
}

.webdesign-mockup-cta__button {
	flex: 0 0 auto;
	color: #ffffff !important;
	box-shadow: inset 0 0 0 2px #ffffff !important;
}

.webdesign-mockup-cta__button:hover {
	background: #ffffff;
	color: #585858 !important;
}


/* FINAL CTA
--------------------------------------------------------- */

.service-cta--web-design {
	background:
		linear-gradient(
			110deg,
			rgba(242,132,158,0.10),
			rgba(174,133,202,0.09),
			rgba(126,202,246,0.11)
		);
}


/* TABLET
--------------------------------------------------------- */

@media screen and (max-width: 980px) {

	.webdesign-hero,
	.webdesign-library-intro__grid,
	.webdesign-redesign {
		grid-template-columns: 1fr;
		gap: 2.5em;
	}

	.webdesign-hero__visual {
		min-height: 470px;
	}

	.webdesign-process__steps {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.webdesign-process__steps::before {
		display: none;
	}

	.webdesign-process__steps article {
		padding: 1.5em;
		border-radius: 14px;
		border: 1px solid #e5e5e5;
	}

	.webdesign-more__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.webdesign-mockup-cta {
		flex-direction: column;
		align-items: flex-start;
	}

}


/* MOBILE
--------------------------------------------------------- */

@media screen and (max-width: 736px) {

	.webdesign-hero {
		margin-bottom: 4em;
		padding: 2.2em 1.5em;
		border-radius: 16px;
	}

	.webdesign-hero h1 {
		font-size: 2.7em;
	}

	.webdesign-library-intro,
	.webdesign-concepts,
	.webdesign-more,
	.webdesign-process,
	.webdesign-redesign,
	.webdesign-mockup-cta {
		margin-bottom: 4em;
	}

	.webdesign-concepts__grid,
	.webdesign-more__grid,
	.webdesign-process__steps {
		grid-template-columns: 1fr;
	}

	.webdesign-concept-card__image {
		height: 230px;
	}

	.webdesign-more,
	.webdesign-redesign,
	.webdesign-mockup-cta {
		padding: 2em 1.5em;
		border-radius: 15px;
	}

	.webdesign-more__intro h2,
	.webdesign-redesign__copy h2,
	.webdesign-mockup-cta h2 {
		font-size: 1.8em;
	}

	.webdesign-more__grid article {
		min-height: auto;
	}

	.webdesign-hero__visual {
		min-height: 390px;
	}

	.webdesign-browser {
		right: 10px;
	}

	.webdesign-device--tablet {
		width: 110px;
		height: 145px;
	}

	.webdesign-device--phone {
		right: 90px;
		width: 60px;
		height: 120px;
	}

	.webdesign-before-after {
		grid-template-columns: 1fr;
	}

	.webdesign-redesign-arrow {
		text-align: center;
		transform: rotate(90deg);
	}

	.webdesign-mockup-cta__button {
		width: 100%;
	}

}


/* SMALL MOBILE
--------------------------------------------------------- */

@media screen and (max-width: 480px) {

	.webdesign-hero h1 {
		font-size: 2.35em;
	}

	.webdesign-hero__visual {
		min-height: 330px;
	}

	.webdesign-browser__hero {
		min-height: 185px;
		padding: 1.4em;
	}

	.webdesign-browser__hero h3 {
		font-size: 1.15em;
	}

}

/* =========================================================
   SEO HUB
   ========================================================= */


/* HERO
--------------------------------------------------------- */

.seo-hub-hero {
	position: relative;
	display: grid;
	grid-template-columns: minmax(0, 1.1fr) minmax(330px, 0.9fr);
	gap: 4em;
	align-items: center;

	margin: 1em 0 6em;
	padding: 4.5em;

	border-radius: 24px;
	overflow: hidden;

	background:
		radial-gradient(
			circle at 94% 8%,
			rgba(123,208,193,0.18),
			transparent 30%
		),
		radial-gradient(
			circle at 5% 94%,
			rgba(242,132,158,0.16),
			transparent 34%
		),
		#ffffff;

	border: 1px solid #e5e5e5;
}

.seo-hub-hero::after {
	content: '';
	position: absolute;
	right: -160px;
	top: -175px;
	width: 460px;
	height: 460px;
	border-radius: 50%;
	border: 1px solid rgba(126,202,246,0.22);
	box-shadow:
		0 0 0 45px rgba(126,202,246,0.04),
		0 0 0 90px rgba(242,132,158,0.025);
}

.seo-hub-hero > * {
	position: relative;
	z-index: 2;
}

.seo-hub-hero h1 {
	max-width: 800px;
	margin-bottom: 0.55em;
	font-size: clamp(3.2em, 5.4vw, 5.25em);
	line-height: 0.98;
}

.seo-hub-hero h1 span {
	display: block;
	background:
		linear-gradient(
			90deg,
			#f2849e,
			#ae85ca,
			#7ecaf6
		);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text;
}

.seo-hub-hero__lead {
	font-size: 1.14em;
	margin-bottom: 0.8em;
}

.seo-hub-hero__support {
	margin-bottom: 2em;
}


/* SEO HERO PANEL
--------------------------------------------------------- */

.seo-hub-panel {
	padding: 1.8em;
	border-radius: 20px;
	background: #585858;
	color: #ffffff;
	box-shadow: 0 22px 55px rgba(88,88,88,0.18);
}

.seo-hub-panel__top {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 1.4em;
}

.seo-hub-panel__top span {
	font-size: 0.62em;
	font-weight: 900;
	letter-spacing: 0.18em;
}

.seo-hub-panel__top strong {
	color: #7bd0c1;
	font-size: 0.7em;
}

.seo-hub-panel__search {
	display: flex;
	align-items: center;
	gap: 0.8em;
	margin-bottom: 1.2em;
	padding: 0.9em 1em;
	border-radius: 100px;
	background: rgba(255,255,255,0.08);
	border: 1px solid rgba(255,255,255,0.12);
}

.seo-hub-panel__search > span {
	color: #7ecaf6;
	font-size: 1.2em;
}

.seo-hub-panel__search p {
	margin: 0;
	color: #ffffff;
	font-size: 0.82em;
}

.seo-hub-signal {
	display: grid;
	grid-template-columns: 42px 1fr;
	gap: 1em;
	align-items: center;
	padding: 1em 0;
	border-top: 1px solid rgba(255,255,255,0.14);
}

.seo-hub-signal > span {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 35px;
	height: 35px;
	border-radius: 50%;
	background: #f2849e;
	color: #ffffff;
	font-size: 0.67em;
	font-weight: 900;
}

.seo-hub-signal:nth-of-type(3) > span {
	background: #7ecaf6;
}

.seo-hub-signal:nth-of-type(4) > span {
	background: #7bd0c1;
}

.seo-hub-signal strong {
	color: #ffffff;
}

.seo-hub-signal p {
	margin: 0;
	color: rgba(255,255,255,0.65);
	font-size: 0.76em;
}

.seo-hub-panel__bottom {
	margin-top: 0.8em;
	padding-top: 0.9em;
	border-top: 1px solid rgba(255,255,255,0.13);
}

.seo-hub-panel__bottom span {
	color: rgba(255,255,255,0.58);
	font-size: 0.6em;
	font-weight: 900;
	letter-spacing: 0.14em;
}


/* APPROACHES
--------------------------------------------------------- */

.seo-hub-approaches {
	margin-bottom: 6em;
}

.seo-hub-approaches__intro {
	max-width: 850px;
	margin-bottom: 3em;
}

.seo-hub-approaches__intro h2 {
	margin-bottom: 0.7em;
	font-size: 2.4em;
}

.seo-hub-approaches__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1.4em;
}

.seo-approach-card {
	display: block;
	border: 0;
	border-radius: 20px;
	overflow: hidden;
	background: #ffffff;
	border: 1px solid #e4e4e4;
	transition:
		transform 0.25s ease,
		box-shadow 0.25s ease;
}

.seo-approach-card:hover {
	transform: translateY(-6px);
	box-shadow: 0 24px 55px rgba(88,88,88,0.12);
}

.seo-approach-card__image {
	position: relative;
	height: 220px;
	overflow: hidden;
}

.seo-approach-card__image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.4s ease;
}

.seo-approach-card:hover .seo-approach-card__image img {
	transform: scale(1.035);
}

.seo-approach-card__image > span {
	position: absolute;
	left: 1.2em;
	top: 1.2em;
	padding: 0.55em 0.8em;
	border-radius: 100px;
	background: rgba(88,88,88,0.88);
	color: #ffffff;
	font-size: 0.6em;
	font-weight: 900;
	letter-spacing: 0.11em;
}

.seo-approach-card__copy {
	padding: 2em;
}

.seo-approach-card__number {
	margin-bottom: 1.5em;
	color: #f2849e;
	font-size: 0.68em;
	font-weight: 900;
}

.seo-approach-card--national .seo-approach-card__number {
	color: #7ecaf6;
}

.seo-approach-card--local .seo-approach-card__number {
	color: #7bd0c1;
}

.seo-approach-card__copy h3 {
	margin: 0 0 0.65em;
	font-size: 1.4em;
}

.seo-approach-card__copy p {
	margin-bottom: 1.4em;
}

.seo-approach-card__copy strong {
	color: #585858;
	font-size: 0.72em;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}


/* WHY
--------------------------------------------------------- */

.seo-hub-why {
	margin-bottom: 6em;
	padding: 4em;
	border-radius: 22px;
	background: #585858;
	color: #ffffff;
}

.seo-hub-why h2,
.seo-hub-why h3 {
	color: #ffffff;
}

.seo-hub-why__intro {
	max-width: 820px;
	margin-bottom: 3em;
}

.seo-hub-why__intro h2 {
	margin-bottom: 0.7em;
	font-size: 2.4em;
}

.seo-hub-why__intro p {
	color: rgba(255,255,255,0.78);
}

.seo-hub-why__grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 1px;
	border: 1px solid rgba(255,255,255,0.13);
	border-radius: 15px;
	overflow: hidden;
	background: rgba(255,255,255,0.13);
}

.seo-hub-why__grid article {
	min-height: 260px;
	padding: 2em;
	background: #585858;
}

.seo-hub-why__grid article > span {
	display: block;
	margin-bottom: 2em;
	color: #f2849e;
	font-size: 0.68em;
	font-weight: 900;
}

.seo-hub-why__grid article:nth-child(2) > span {
	color: #7ecaf6;
}

.seo-hub-why__grid article:nth-child(3) > span {
	color: #7bd0c1;
}

.seo-hub-why__grid article:nth-child(4) > span {
	color: #ae85ca;
}

.seo-hub-why__grid p {
	margin: 0;
	color: rgba(255,255,255,0.7);
}


/* AI SECTION
--------------------------------------------------------- */

.seo-hub-ai {
	display: grid;
	grid-template-columns: 0.8fr 1.2fr;
	gap: 5em;
	align-items: center;
	margin-bottom: 6em;
	padding: 4em;
	border-radius: 22px;

	background:
		linear-gradient(
			125deg,
			rgba(123,208,193,0.11),
			rgba(126,202,246,0.11),
			rgba(242,132,158,0.09)
		);

	border: 1px solid #e5e5e5;
}

.seo-hub-ai__copy h2 {
	margin-bottom: 0.7em;
	font-size: 2.35em;
}

.seo-hub-ai__visual {
	position: relative;
	min-height: 340px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.seo-ai-core {
	position: relative;
	z-index: 3;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	width: 140px;
	height: 140px;
	border-radius: 50%;

	background:
		linear-gradient(
			135deg,
			#585858,
			#686868
		);

	color: #ffffff;
	font-size: 0.75em;
	font-weight: 900;
	letter-spacing: 0.1em;
}

.seo-ai-core span:first-child {
	color: #7bd0c1;
}

.seo-ai-core span:last-child {
	color: #7ecaf6;
}

.seo-ai-orbit {
	position: absolute;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 88px;
	height: 88px;
	border-radius: 50%;
	background: #ffffff;
	border: 1px solid #e1e1e1;
	box-shadow: 0 12px 30px rgba(88,88,88,0.08);
	font-size: 0.68em;
	font-weight: 700;
}

.seo-ai-orbit--1 {
	top: 2%;
	left: 39%;
}

.seo-ai-orbit--2 {
	top: 40%;
	left: 3%;
}

.seo-ai-orbit--3 {
	top: 40%;
	right: 3%;
}

.seo-ai-orbit--4 {
	bottom: 0;
	left: 39%;
}

.seo-ai-benefits {
	margin-top: 2em;
	border-top: 1px solid #dddddd;
}

.seo-ai-benefits > div {
	display: grid;
	grid-template-columns: 45px 1fr;
	gap: 1em;
	padding: 1em 0;
	border-bottom: 1px solid #dddddd;
}

.seo-ai-benefits span {
	color: #f2849e;
	font-size: 0.68em;
	font-weight: 900;
}

.seo-ai-benefits p {
	margin: 0;
}


/* IMPACT
--------------------------------------------------------- */

.seo-hub-impact {
	margin-bottom: 6em;
	padding: 4em;
	border-radius: 22px;

	background:
		linear-gradient(
			125deg,
			#f2849e,
			#ae85ca,
			#7ecaf6
		);

	color: #ffffff;
}

.seo-hub-impact h2 {
	color: #ffffff;
}

.seo-hub-impact__heading {
	max-width: 830px;
	margin-bottom: 2.5em;
}

.seo-hub-impact__heading h2 {
	margin-bottom: 0.7em;
	font-size: 2.4em;
}

.seo-hub-impact__heading p {
	color: rgba(255,255,255,0.84);
}

.seo-hub-impact__metrics {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 1px;
	background: rgba(255,255,255,0.25);
	border: 1px solid rgba(255,255,255,0.25);
	border-radius: 14px;
	overflow: hidden;
}

.seo-hub-impact__metrics > div {
	padding: 1.7em;
	background: rgba(255,255,255,0.08);
}

.seo-hub-impact__metrics span {
	display: block;
	margin-bottom: 1.2em;
	color: rgba(255,255,255,0.72);
	font-size: 0.66em;
	font-weight: 900;
}

.seo-hub-impact__metrics strong {
	color: #ffffff;
	font-size: 1.05em;
}

.seo-hub-impact__closing {
	max-width: 850px;
	margin: 2em 0 0;
	color: #ffffff;
	font-weight: 700;
}


/* PROCESS
--------------------------------------------------------- */

.seo-hub-process {
	margin-bottom: 6em;
}

.seo-hub-process__heading {
	max-width: 800px;
	margin-bottom: 3em;
}

.seo-hub-process__heading h2 {
	margin-bottom: 0.7em;
}

.seo-hub-process__steps {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1.2em;
}

.seo-hub-process__steps article {
	min-height: 280px;
	padding: 2em;
	border-radius: 16px;
	background: #ffffff;
	border: 1px solid #e4e4e4;
}

.seo-hub-process__steps article > span {
	display: block;
	margin-bottom: 2em;
	color: #f2849e;
	font-size: 0.68em;
	font-weight: 900;
}

.seo-hub-process__steps article:nth-child(2) > span,
.seo-hub-process__steps article:nth-child(6) > span {
	color: #7ecaf6;
}

.seo-hub-process__steps article:nth-child(3) > span {
	color: #7bd0c1;
}

.seo-hub-process__steps article:nth-child(4) > span {
	color: #c75b9b;
}

.seo-hub-process__steps article:nth-child(5) > span {
	color: #ae85ca;
}

.seo-hub-process__steps h3 {
	margin: 0 0 0.55em;
	font-size: 1.1em;
}

.seo-hub-process__steps p {
	margin: 0;
}


/* FUTURE
--------------------------------------------------------- */

.seo-hub-future {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 5em;
	align-items: center;
	margin-bottom: 6em;
	padding: 4em;
	border-radius: 22px;
	background: #585858;
	color: #ffffff;
}

.seo-hub-future h2 {
	margin-bottom: 0.7em;
	color: #ffffff;
	font-size: 2.35em;
}

.seo-hub-future__copy p {
	color: rgba(255,255,255,0.78);
}

.seo-hub-future__signals {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1em;
}

.seo-hub-future__signals > div {
	min-height: 150px;
	padding: 1.4em;
	border-radius: 14px;
	background: rgba(255,255,255,0.07);
	border: 1px solid rgba(255,255,255,0.12);
}

.seo-hub-future__signals span {
	display: block;
	margin-bottom: 1em;
	color: #f2849e;
	font-size: 0.66em;
	font-weight: 900;
}

.seo-hub-future__signals > div:nth-child(2) span {
	color: #7ecaf6;
}

.seo-hub-future__signals > div:nth-child(3) span {
	color: #7bd0c1;
}

.seo-hub-future__signals > div:nth-child(4) span {
	color: #ae85ca;
}

.seo-hub-future__signals strong {
	color: #ffffff;
}

.seo-hub-future__signals p {
	margin: 0.3em 0 0;
	color: rgba(255,255,255,0.68);
	font-size: 0.82em;
}


/* CTA
--------------------------------------------------------- */

.service-cta--seo-hub {
	background:
		linear-gradient(
			110deg,
			rgba(123,208,193,0.10),
			rgba(126,202,246,0.11),
			rgba(242,132,158,0.09)
		);
}


/* TABLET
--------------------------------------------------------- */

@media screen and (max-width: 980px) {

	.seo-hub-hero,
	.seo-hub-ai,
	.seo-hub-future {
		grid-template-columns: 1fr;
		gap: 2.5em;
	}

	.seo-hub-approaches__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.seo-hub-why__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.seo-hub-impact__metrics {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.seo-hub-process__steps {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

}


/* MOBILE
--------------------------------------------------------- */

@media screen and (max-width: 736px) {

	.seo-hub-hero {
		margin-bottom: 4em;
		padding: 2.2em 1.5em;
		border-radius: 16px;
	}

	.seo-hub-hero h1 {
		font-size: 2.7em;
	}

	.seo-hub-approaches,
	.seo-hub-why,
	.seo-hub-ai,
	.seo-hub-impact,
	.seo-hub-process,
	.seo-hub-future {
		margin-bottom: 4em;
	}

	.seo-hub-approaches__grid,
	.seo-hub-why__grid,
	.seo-hub-impact__metrics,
	.seo-hub-process__steps,
	.seo-hub-future__signals {
		grid-template-columns: 1fr;
	}

	.seo-hub-why,
	.seo-hub-ai,
	.seo-hub-impact,
	.seo-hub-future {
		padding: 2em 1.5em;
		border-radius: 15px;
	}

	.seo-hub-why__intro h2,
	.seo-hub-ai__copy h2,
	.seo-hub-impact__heading h2,
	.seo-hub-future h2 {
		font-size: 1.8em;
	}

	.seo-hub-why__grid article,
	.seo-hub-process__steps article {
		min-height: auto;
	}

	.seo-ai-orbit {
		width: 72px;
		height: 72px;
		font-size: 0.6em;
	}

	.seo-ai-orbit--1,
	.seo-ai-orbit--4 {
		left: 38%;
	}

}


/* SMALL MOBILE
--------------------------------------------------------- */

@media screen and (max-width: 480px) {

	.seo-hub-hero h1 {
		font-size: 2.35em;
	}

}

/* =========================================================
   PAID ADVERTISING HUB
   ========================================================= */


/* HERO
--------------------------------------------------------- */

.paid-hub-hero {
	position: relative;
	display: grid;
	grid-template-columns: minmax(0, 1.1fr) minmax(330px, 0.9fr);
	gap: 4em;
	align-items: center;

	margin: 1em 0 6em;
	padding: 4.5em;

	border-radius: 24px;
	overflow: hidden;

	background:
		radial-gradient(
			circle at 94% 8%,
			rgba(242,132,158,0.18),
			transparent 30%
		),
		radial-gradient(
			circle at 5% 94%,
			rgba(126,202,246,0.16),
			transparent 34%
		),
		#ffffff;

	border: 1px solid #e5e5e5;
}

.paid-hub-hero::after {
	content: '';
	position: absolute;
	right: -160px;
	top: -175px;
	width: 460px;
	height: 460px;
	border-radius: 50%;
	border: 1px solid rgba(174,133,202,0.22);
	box-shadow:
		0 0 0 45px rgba(174,133,202,0.04),
		0 0 0 90px rgba(242,132,158,0.025);
}

.paid-hub-hero > * {
	position: relative;
	z-index: 2;
}

.paid-hub-hero h1 {
	max-width: 820px;
	margin-bottom: 0.55em;
	font-size: clamp(3.2em, 5.4vw, 5.25em);
	line-height: 0.98;
}

.paid-hub-hero h1 span {
	display: block;

	background:
		linear-gradient(
			90deg,
			#f2849e,
			#ae85ca,
			#7ecaf6
		);

	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text;
}

.paid-hub-hero__lead {
	font-size: 1.14em;
	margin-bottom: 0.8em;
}

.paid-hub-hero__support {
	margin-bottom: 2em;
}


/* HERO PANEL
--------------------------------------------------------- */

.paid-hub-panel {
	padding: 1.8em;
	border-radius: 20px;
	background: #585858;
	color: #ffffff;
	box-shadow: 0 22px 55px rgba(88,88,88,0.18);
}

.paid-hub-panel__top {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 1.4em;
}

.paid-hub-panel__top span {
	font-size: 0.62em;
	font-weight: 900;
	letter-spacing: 0.18em;
}

.paid-hub-panel__top strong {
	color: #7bd0c1;
	font-size: 0.7em;
}

.paid-hub-metric {
	display: grid;
	grid-template-columns: 42px 1fr;
	gap: 1em;
	align-items: center;
	padding: 1em 0;
	border-top: 1px solid rgba(255,255,255,0.14);
}

.paid-hub-metric > span {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 35px;
	height: 35px;
	border-radius: 10px;
	background: #f2849e;
	color: #ffffff;
	font-size: 0.67em;
	font-weight: 900;
}

.paid-hub-metric:nth-of-type(3) > span {
	background: #7ecaf6;
}

.paid-hub-metric:nth-of-type(4) > span {
	background: #7bd0c1;
}

.paid-hub-metric:nth-of-type(5) > span {
	background: #ae85ca;
}

.paid-hub-metric strong {
	color: #ffffff;
}

.paid-hub-metric p {
	margin: 0;
	color: rgba(255,255,255,0.65);
	font-size: 0.76em;
}

.paid-hub-panel__bottom {
	margin-top: 0.8em;
	padding-top: 0.9em;
	border-top: 1px solid rgba(255,255,255,0.13);
}

.paid-hub-panel__bottom span {
	color: rgba(255,255,255,0.58);
	font-size: 0.6em;
	font-weight: 900;
	letter-spacing: 0.14em;
}


/* NORTH STAR
--------------------------------------------------------- */

.paid-hub-north-star {
	display: grid;
	grid-template-columns: 0.8fr 1.2fr;
	gap: 5em;
	align-items: center;
	margin-bottom: 6em;
}

.paid-hub-north-star__copy h2 {
	margin-bottom: 0.7em;
	font-size: 2.35em;
}

.paid-hub-north-star__metrics {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1em;
}

.paid-hub-north-star__metrics article {
	min-height: 170px;
	padding: 1.5em;
	border-radius: 14px;
	background: #ffffff;
	border: 1px solid #e4e4e4;
}

.paid-hub-north-star__metrics span {
	display: block;
	margin-bottom: 0.9em;
	color: #f2849e;
	font-size: 0.66em;
	font-weight: 900;
}

.paid-hub-north-star__metrics article:nth-child(2) span {
	color: #7ecaf6;
}

.paid-hub-north-star__metrics article:nth-child(3) span {
	color: #7bd0c1;
}

.paid-hub-north-star__metrics article:nth-child(4) span {
	color: #ae85ca;
}

.paid-hub-north-star__metrics strong {
	display: block;
	margin-bottom: 0.3em;
}

.paid-hub-north-star__metrics p {
	margin: 0;
}


/* WHY ANJ DIGITAL
--------------------------------------------------------- */

.paid-hub-why {
	margin-bottom: 6em;
	padding: 4em;
	border-radius: 22px;
	background: #585858;
	color: #ffffff;
}

.paid-hub-why h2,
.paid-hub-why h3 {
	color: #ffffff;
}

.paid-hub-why__intro {
	max-width: 850px;
	margin-bottom: 3em;
}

.paid-hub-why__intro h2 {
	margin-bottom: 0.7em;
	font-size: 2.4em;
}

.paid-hub-why__intro p {
	color: rgba(255,255,255,0.78);
}

.paid-hub-why__grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 1px;
	border: 1px solid rgba(255,255,255,0.13);
	border-radius: 15px;
	overflow: hidden;
	background: rgba(255,255,255,0.13);
}

.paid-hub-why__grid article {
	min-height: 250px;
	padding: 2em;
	background: #585858;
}

.paid-hub-why__grid article > span {
	display: block;
	margin-bottom: 2em;
	color: #f2849e;
	font-size: 0.68em;
	font-weight: 900;
}

.paid-hub-why__grid article:nth-child(2) > span {
	color: #7ecaf6;
}

.paid-hub-why__grid article:nth-child(3) > span {
	color: #7bd0c1;
}

.paid-hub-why__grid article:nth-child(4) > span {
	color: #ae85ca;
}

.paid-hub-why__grid p {
	margin: 0;
	color: rgba(255,255,255,0.7);
}


/* SOLUTIONS
--------------------------------------------------------- */

.paid-hub-solutions {
	margin-bottom: 6em;
}

.paid-hub-solutions__intro {
	max-width: 850px;
	margin-bottom: 3em;
}

.paid-hub-solutions__intro h2 {
	margin-bottom: 0.7em;
	font-size: 2.4em;
}

.paid-hub-solutions__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1.4em;
}

.paid-hub-solution-card {
	display: block;
	border: 0;
	border-radius: 20px;
	overflow: hidden;
	background: #ffffff;
	border: 1px solid #e4e4e4;
	transition:
		transform 0.25s ease,
		box-shadow 0.25s ease;
}

.paid-hub-solution-card:hover {
	transform: translateY(-6px);
	box-shadow: 0 24px 55px rgba(88,88,88,0.12);
}

.paid-hub-solution-card__image {
	position: relative;
	height: 220px;
	overflow: hidden;
}

.paid-hub-solution-card__image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.4s ease;
}

.paid-hub-solution-card:hover .paid-hub-solution-card__image img {
	transform: scale(1.035);
}

.paid-hub-solution-card__image > span {
	position: absolute;
	left: 1.2em;
	top: 1.2em;
	padding: 0.55em 0.8em;
	border-radius: 100px;
	background: rgba(88,88,88,0.88);
	color: #ffffff;
	font-size: 0.58em;
	font-weight: 900;
	letter-spacing: 0.1em;
}

.paid-hub-solution-card__copy {
	padding: 2em;
}

.paid-hub-solution-card__number {
	margin-bottom: 1.5em;
	color: #f2849e;
	font-size: 0.68em;
	font-weight: 900;
}

.paid-hub-solution-card--display .paid-hub-solution-card__number {
	color: #7ecaf6;
}

.paid-hub-solution-card--social .paid-hub-solution-card__number {
	color: #7bd0c1;
}

.paid-hub-solution-card__copy h3 {
	margin: 0 0 0.65em;
	font-size: 1.4em;
}

.paid-hub-solution-card__copy p {
	margin-bottom: 1.4em;
}

.paid-hub-solution-card__copy strong {
	color: #585858;
	font-size: 0.72em;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}


/* PLATFORM GUIDE
--------------------------------------------------------- */

.paid-hub-platform-guide {
	margin-bottom: 6em;
	padding: 4em;
	border-radius: 22px;

	background:
		linear-gradient(
			125deg,
			rgba(242,132,158,0.10),
			rgba(174,133,202,0.09),
			rgba(126,202,246,0.11)
		);

	border: 1px solid #e5e5e5;
}

.paid-hub-platform-guide__heading {
	max-width: 780px;
	margin-bottom: 2.5em;
}

.paid-hub-platform-guide__heading h2 {
	margin-bottom: 0.7em;
}

.paid-hub-platform-guide__grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 1em;
}

.paid-hub-platform-guide__grid article {
	min-height: 210px;
	padding: 1.6em;
	border-radius: 14px;
	background: rgba(255,255,255,0.85);
	border: 1px solid #e5e5e5;
}

.paid-hub-platform-guide__grid article > span {
	display: block;
	margin-bottom: 1em;
	color: #f2849e;
	font-size: 0.64em;
	font-weight: 900;
	letter-spacing: 0.14em;
}

.paid-hub-platform-guide__grid article:nth-child(2) > span {
	color: #7ecaf6;
}

.paid-hub-platform-guide__grid article:nth-child(3) > span {
	color: #7bd0c1;
}

.paid-hub-platform-guide__grid article:nth-child(4) > span {
	color: #ae85ca;
}

.paid-hub-platform-guide__grid h3 {
	margin: 0 0 0.6em;
	font-size: 1.05em;
}

.paid-hub-platform-guide__grid p {
	margin: 0;
}


/* AI
--------------------------------------------------------- */

.paid-hub-ai {
	display: grid;
	grid-template-columns: 0.8fr 1.2fr;
	gap: 5em;
	align-items: center;
	margin-bottom: 6em;
	padding: 4em;
	border-radius: 22px;
	background: #585858;
	color: #ffffff;
}

.paid-hub-ai h2 {
	margin-bottom: 0.7em;
	color: #ffffff;
	font-size: 2.4em;
}

.paid-hub-ai__copy p {
	color: rgba(255,255,255,0.78);
}

.paid-hub-ai__visual {
	position: relative;
	min-height: 330px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.paid-hub-ai-core {
	position: relative;
	z-index: 3;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	width: 135px;
	height: 135px;
	border-radius: 50%;

	background:
		linear-gradient(
			135deg,
			rgba(242,132,158,0.24),
			rgba(126,202,246,0.22)
		);

	border: 1px solid rgba(255,255,255,0.16);
	font-size: 0.72em;
	font-weight: 900;
	letter-spacing: 0.1em;
}

.paid-hub-ai-core span:first-child {
	color: #7ecaf6;
}

.paid-hub-ai-core span:last-child {
	color: #f2849e;
}

.paid-hub-ai-orbit {
	position: absolute;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 82px;
	height: 82px;
	border-radius: 50%;
	background: rgba(255,255,255,0.07);
	border: 1px solid rgba(255,255,255,0.14);
	font-size: 0.66em;
	font-weight: 700;
}

.paid-hub-ai-orbit--1 {
	top: 3%;
	left: 40%;
}

.paid-hub-ai-orbit--2 {
	top: 40%;
	left: 3%;
}

.paid-hub-ai-orbit--3 {
	top: 40%;
	right: 3%;
}

.paid-hub-ai-orbit--4 {
	bottom: 1%;
	left: 40%;
}


/* PROCESS
--------------------------------------------------------- */

.paid-hub-process {
	margin-bottom: 6em;
}

.paid-hub-process__heading {
	max-width: 800px;
	margin-bottom: 3em;
}

.paid-hub-process__heading h2 {
	margin-bottom: 0.7em;
}

.paid-hub-process__steps {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1.2em;
}

.paid-hub-process__steps article {
	min-height: 275px;
	padding: 2em;
	border-radius: 16px;
	background: #ffffff;
	border: 1px solid #e4e4e4;
}

.paid-hub-process__steps article > span {
	display: block;
	margin-bottom: 2em;
	color: #f2849e;
	font-size: 0.68em;
	font-weight: 900;
}

.paid-hub-process__steps article:nth-child(2) > span,
.paid-hub-process__steps article:nth-child(6) > span {
	color: #7ecaf6;
}

.paid-hub-process__steps article:nth-child(3) > span {
	color: #7bd0c1;
}

.paid-hub-process__steps article:nth-child(4) > span {
	color: #c75b9b;
}

.paid-hub-process__steps article:nth-child(5) > span {
	color: #ae85ca;
}

.paid-hub-process__steps h3 {
	margin: 0 0 0.55em;
	font-size: 1.1em;
}

.paid-hub-process__steps p {
	margin: 0;
}


/* CONNECTED SYSTEM
--------------------------------------------------------- */

.paid-hub-system {
	display: grid;
	grid-template-columns: 0.9fr 1.1fr;
	gap: 4em;
	align-items: center;
	margin-bottom: 6em;
	padding: 4em;
	border-radius: 22px;

	background:
		linear-gradient(
			125deg,
			#f2849e,
			#ae85ca,
			#7ecaf6
		);

	color: #ffffff;
}

.paid-hub-system h2 {
	margin-bottom: 0.7em;
	color: #ffffff;
	font-size: 2.3em;
}

.paid-hub-system__copy p {
	color: rgba(255,255,255,0.86);
}

.paid-hub-system__flow {
	display: flex;
	align-items: stretch;
	gap: 0.65em;
}

.paid-hub-system__flow > div {
	flex: 1 1 0;
	padding: 1.2em;
	border-radius: 12px;
	background: rgba(255,255,255,0.1);
	border: 1px solid rgba(255,255,255,0.2);
}

.paid-hub-system__flow span {
	display: block;
	margin-bottom: 0.5em;
	color: #ffffff;
	font-size: 0.64em;
	font-weight: 900;
	letter-spacing: 0.08em;
}

.paid-hub-system__flow p {
	margin: 0;
	color: rgba(255,255,255,0.78);
	font-size: 0.78em;
}

.paid-hub-system__flow > b {
	display: flex;
	align-items: center;
	color: rgba(255,255,255,0.72);
}


/* CTA
--------------------------------------------------------- */

.service-cta--paid-hub {
	background:
		linear-gradient(
			110deg,
			rgba(242,132,158,0.10),
			rgba(174,133,202,0.09),
			rgba(126,202,246,0.11)
		);
}


/* TABLET
--------------------------------------------------------- */

@media screen and (max-width: 980px) {

	.paid-hub-hero,
	.paid-hub-north-star,
	.paid-hub-ai,
	.paid-hub-system {
		grid-template-columns: 1fr;
		gap: 2.5em;
	}

	.paid-hub-why__grid,
	.paid-hub-platform-guide__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.paid-hub-solutions__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.paid-hub-process__steps {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.paid-hub-system__flow {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.paid-hub-system__flow > b {
		display: none;
	}

}


/* MOBILE
--------------------------------------------------------- */

@media screen and (max-width: 736px) {

	.paid-hub-hero {
		margin-bottom: 4em;
		padding: 2.2em 1.5em;
		border-radius: 16px;
	}

	.paid-hub-hero h1 {
		font-size: 2.7em;
	}

	.paid-hub-north-star,
	.paid-hub-why,
	.paid-hub-solutions,
	.paid-hub-platform-guide,
	.paid-hub-ai,
	.paid-hub-process,
	.paid-hub-system {
		margin-bottom: 4em;
	}

	.paid-hub-north-star__metrics,
	.paid-hub-why__grid,
	.paid-hub-solutions__grid,
	.paid-hub-platform-guide__grid,
	.paid-hub-process__steps,
	.paid-hub-system__flow {
		grid-template-columns: 1fr;
	}

	.paid-hub-why,
	.paid-hub-platform-guide,
	.paid-hub-ai,
	.paid-hub-system {
		padding: 2em 1.5em;
		border-radius: 15px;
	}

	.paid-hub-why__intro h2,
	.paid-hub-ai h2,
	.paid-hub-system h2 {
		font-size: 1.8em;
	}

	.paid-hub-why__grid article,
	.paid-hub-process__steps article {
		min-height: auto;
	}

	.paid-hub-ai-orbit {
		width: 68px;
		height: 68px;
		font-size: 0.58em;
	}

	.paid-hub-ai-orbit--1,
	.paid-hub-ai-orbit--4 {
		left: 39%;
	}

}


/* SMALL MOBILE
--------------------------------------------------------- */

@media screen and (max-width: 480px) {

	.paid-hub-hero h1 {
		font-size: 2.35em;
	}

}