/* =========================================================
   ABOUT / NOSOTROS
   Growth Marketing
   ========================================================= */

.gm-about {
	position: relative;

	background: #093b4b;

	color: #ffffff;
}


/* =========================================================
   GRID
   ========================================================= */

.gm-about__grid {
	display: grid;

	grid-template-columns:
		repeat(2, minmax(0, 1fr));

	min-height: 510px;
}


/* =========================================================
   LEFT
   ========================================================= */

.gm-about__quote {
	display: flex;
	align-items: center;

	background: #0d5062;
}

.gm-about__quote-inner {
	position: relative;

	width: min(100% - 90px, 770px);

	margin:
		0
		auto;
}


/* QUOTE MARK */

.gm-about__quote-mark {
	position: absolute;

	top: -4px;
	left: -30px;

	font-size: 56px;
	font-weight: 800;

	line-height: 1;

	color: #31b732;
}


/* QUOTE */

.gm-about__quote p {
	margin: 0;

	max-width: 720px;

	font-size: clamp(32px, 2.45vw, 48px);
	font-weight: 400;

	line-height: 1.08;

	letter-spacing: -.045em;

	color: #ffffff;
}


/* =========================================================
   RIGHT
   ========================================================= */

.gm-about__content {
	display: flex;
	align-items: center;

	background: #083847;
}

.gm-about__content-inner {
	width: min(100% - 90px, 780px);

	margin:
		0
		auto;
}


/* =========================================================
   EYEBROW
   ========================================================= */

.gm-about__eyebrow {
	margin-bottom: 18px;

	font-size: 11px;
	font-weight: 850;

	line-height: 1;

	letter-spacing: .16em;

	color: #69ed55;
}


/* =========================================================
   TITLE
   ========================================================= */

.gm-about__content h2 {
	max-width: 750px;

	margin: 0;

	font-size: clamp(42px, 3.5vw, 64px);
	font-weight: 400;

	line-height: .98;

	letter-spacing: -.05em;

	color: #ffffff;
}


/* =========================================================
   TEXT
   ========================================================= */

.gm-about__text {
	max-width: 780px;

	margin-top: 14px;
}

.gm-about__text p {
	margin:
		0
		0
		6px;

	font-size: 15px;
	font-weight: 400;

	line-height: 1.55;

	color: rgba(255,255,255,.93);
}

.gm-about__text p:last-child {
	margin-bottom: 0;
}


/* =========================================================
   LEGAL
   ========================================================= */

.gm-about__legal {
	margin-top: 40px;

	padding-top: 21px;

	border-top: 1px solid rgba(255,255,255,.16);

	font-size: 9px;
	font-weight: 500;

	line-height: 1;

	letter-spacing: .15em;

	color: #73aeb9;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 1100px) {

	.gm-about__quote-inner,
	.gm-about__content-inner {
		width: calc(100% - 60px);
	}

	.gm-about__quote p {
		font-size: clamp(29px, 3vw, 39px);
	}

	.gm-about__content h2 {
		font-size: clamp(38px, 4vw, 52px);
	}

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 800px) {

	.gm-about__grid {
		grid-template-columns: 1fr;

		min-height: 0;
	}

	.gm-about__quote,
	.gm-about__content {
		padding:
			75px
			0;
	}

	.gm-about__quote-inner,
	.gm-about__content-inner {
		width: min(
			calc(100% - (var(--gm-gutter) * 2)),
			var(--gm-container)
		);
	}

	.gm-about__quote-mark {
		position: static;

		display: block;

		height: 37px;
	}

}


/* =========================================================
   SMALL MOBILE
   ========================================================= */

@media (max-width: 600px) {

	.gm-about__quote,
	.gm-about__content {
		padding:
			60px
			0;
	}

	.gm-about__quote p {
		font-size: clamp(31px, 9vw, 42px);
	}

	.gm-about__content h2 {
		font-size: clamp(40px, 11vw, 52px);
	}

	.gm-about__text p {
		font-size: 14px;
	}

	.gm-about__legal {
		margin-top: 30px;

		font-size: 8px;

		line-height: 1.5;
	}

}