/* =========================================================
   SOLUTIONS
   Growth Marketing
   ========================================================= */

.gm-solutions {
	position: relative;

	padding:
		112px
		0
		125px;

	background: #ffffff;

	color: #10323d;
}


/* =========================================================
   HEADER
   ========================================================= */

.gm-solutions__header {
	margin-bottom: 64px;
}


/* =========================================================
   EYEBROW
   ========================================================= */

.gm-solutions__eyebrow {
	display: flex;
	align-items: center;

	gap: 16px;

	margin-bottom: 27px;

	font-size: 10px;
	font-weight: 800;

	line-height: 1;

	letter-spacing: .15em;

	color: #0b5367;
}

.gm-solutions__eyebrow span {
	display: block;

	width: 25px;
	height: 2px;

	background: #2caf2e;
}


/* =========================================================
   HEADING
   ========================================================= */

.gm-solutions__heading {
	display: grid;

	grid-template-columns:
		minmax(0, 1.3fr)
		minmax(300px, .7fr);

	align-items: end;

	gap: 80px;
}

.gm-solutions__heading h2 {
	max-width: 950px;

	margin: 0;

	font-size: clamp(52px, 4.1vw, 76px);
	font-weight: 700;

	line-height: .97;

	letter-spacing: -.055em;

	color: #123540;
}

.gm-solutions__heading h2 span {
	display: block;

	color: #0a6078;
}

.gm-solutions__heading p {
	max-width: 430px;

	margin:
		0
		0
		6px;

	font-size: 16px;
	font-weight: 400;

	line-height: 1.65;

	color: #6b7f85;
}


/* =========================================================
   GRID
   ========================================================= */

.gm-solutions__grid {
	display: grid;

	grid-template-columns:
		repeat(3, minmax(0, 1fr));

	border-top: 1px solid #b7d1d5;
	border-left: 1px solid #b7d1d5;
}


/* =========================================================
   CARD
   ========================================================= */

.gm-solution-card {
	position: relative;

	display: flex;
	flex-direction: column;

	min-height: 330px;

	padding:
		28px
		29px
		28px;

	background: #ffffff;

	border-right: 1px solid #b7d1d5;
	border-bottom: 1px solid #b7d1d5;

	transition:
		background .22s ease,
		box-shadow .22s ease;
}

.gm-solution-card:hover {
	background: #fbfdfc;
}


/* =========================================================
   TOP
   ========================================================= */

.gm-solution-card__top {
	display: flex;
	align-items: center;
	justify-content: space-between;

	margin-bottom: 49px;
}

.gm-solution-card__icon {
	display: flex;
	align-items: center;
	justify-content: center;

	width: 20px;
	height: 20px;

	color: #2daf2a;
}

.gm-solution-card__icon svg {
	display: block;

	width: 18px;
	height: 18px;
}

.gm-solution-card__number {
	font-size: 12px;
	font-weight: 500;

	line-height: 1;

	color: #81949a;
}


/* =========================================================
   TITLE
   ========================================================= */

.gm-solution-card h3 {
	max-width: 470px;

	margin:
		0
		0
		17px;

	font-size: 21px;
	font-weight: 500;

	line-height: 1.28;

	letter-spacing: -.02em;

	color: #073449;
}


/* =========================================================
   TEXT
   ========================================================= */

.gm-solution-card p {
	max-width: 480px;

	margin:
		0
		0
		34px;

	font-size: 14px;
	font-weight: 400;

	line-height: 1.55;

	color: #72878e;
}


/* =========================================================
   CTA
   ========================================================= */

.gm-solution-card__cta {
	display: flex;
	align-items: center;
	justify-content: space-between;

	gap: 20px;

	margin-top: auto;

	padding-top: 25px;

	border-top: 1px solid #d5e1e3;

	font-size: 16px;
	font-weight: 700;

	line-height: 1.2;

	color: #07536b;

	transition:
		color .2s ease,
		border-color .2s ease;
}

.gm-solution-card__cta-arrow {
	font-size: 17px;
	font-weight: 400;

	line-height: 1;

	transition: transform .2s ease;
}

.gm-solution-card__cta:hover {
	color: #2daf2a;

	border-color: #b9d9bb;
}

.gm-solution-card__cta:hover .gm-solution-card__cta-arrow {
	transform: translateX(5px);
}


/* =========================================================
   TABLET GRANDE
   ========================================================= */

@media (max-width: 1200px) {

	.gm-solutions__heading {
		grid-template-columns:
			minmax(0, 1.2fr)
			minmax(260px, .8fr);

		gap: 50px;
	}

	.gm-solutions__grid {
		grid-template-columns:
			repeat(3, minmax(0, 1fr));
	}

}


/* =========================================================
   TABLET / MEDIUM
   ========================================================= */

@media (max-width: 900px) {

	.gm-solutions {
		padding:
			85px
			0
			95px;
	}

	.gm-solutions__heading {
		display: block;
	}

	.gm-solutions__heading p {
		margin-top: 26px;
	}

	.gm-solutions__grid {
		grid-template-columns:
			repeat(2, minmax(0, 1fr));
	}

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 600px) {

	.gm-solutions {
		padding:
			65px
			0
			75px;
	}

	.gm-solutions__header {
		margin-bottom: 40px;
	}

	.gm-solutions__eyebrow {
		gap: 10px;

		margin-bottom: 21px;

		font-size: 8px;
	}

	.gm-solutions__eyebrow span {
		width: 18px;
	}

	.gm-solutions__heading h2 {
		font-size: clamp(41px, 12vw, 55px);
	}

	.gm-solutions__heading p {
		font-size: 14px;
	}

	.gm-solutions__grid {
		display: block;

		border-left: 1px solid #b7d1d5;
	}

	.gm-solution-card {
		min-height: 310px;

		padding:
			25px
			24px;
	}

	.gm-solution-card__top {
		margin-bottom: 40px;
	}

	.gm-solution-card h3 {
		font-size: 20px;
	}

	.gm-solution-card p {
		margin-bottom: 30px;

		font-size: 13px;
	}

	.gm-solution-card__cta {
		font-size: 15px;
	}

}

/* =========================================================
   CARD DESTACADA 12
   ========================================================= */

.gm-solution-card:nth-child(12) {
	background: #0f5263;
}

.gm-solution-card:nth-child(12) h3 {
	color: #ffffff;
}

.gm-solution-card:nth-child(12) p {
	color: rgba(255, 255, 255, .82);
}

.gm-solution-card:nth-child(12) .gm-solution-card__number {
	color: rgba(255, 255, 255, .6);
}

.gm-solution-card:nth-child(12) .gm-solution-card__icon {
	color: #67e653;
}

.gm-solution-card:nth-child(12) .gm-solution-card__cta {
	color: #ffffff;
	border-top-color: rgba(255, 255, 255, .25);
}

.gm-solution-card:nth-child(12) .gm-solution-card__cta-arrow {
	color: #67e653;
}

.gm-solution-card:nth-child(12):hover {
	background: #0c4655;
}