/* =========================================================
   TERRARIA · SERVICIOS
   Modular architecture V0.5.0
   ========================================================= */
   
/* =========================================================
   TERRARIA · SERVICIOS · V0.3.0
   Append-only over V0.2.1
   ========================================================= */


/* =========================================================
   01. SERVICES PAGE INTRO
   ========================================================= */

.terraria-services-page-intro {
	width: 100%;

	padding-top:
		clamp(48px, 5vw, 76px);

	padding-bottom:
		clamp(110px, 10vw, 160px);
}


.terraria-services-page-intro__inner {
	width: min(
		calc(100% - 6vw),
		var(--terraria-width-site)
	);

	margin-inline: auto;

	display: grid;

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

	column-gap:
		clamp(58px, 8vw, 132px);

	align-items: start;
}


.terraria-services-page-intro__inner > * {
	margin-block-start: 0 !important;
	margin-block-end: 0 !important;
}


.terraria-services-page-intro__title {
	grid-column: 1;

	font-family:
		Georgia,
		"Times New Roman",
		serif;

	font-size:
		clamp(46px, 4.7vw, 68px);

	font-weight: 400;

	line-height: 1.03;

	letter-spacing: -0.03em;

	max-width: 13ch;

	margin: 0 !important;

	color: var(--terraria-charcoal);
}


.terraria-services-page-intro__text {
	grid-column: 2;

	font-family:
		-apple-system,
		BlinkMacSystemFont,
		"Segoe UI",
		Helvetica,
		Arial,
		sans-serif;

	font-size:
		clamp(17px, 1.3vw, 20px);

	font-weight: 400;

	line-height: 1.75;

	max-width: 530px;

	margin:
		clamp(8px, 1vw, 16px)
		0
		0 !important;

	color: var(--terraria-graphite);
}



/* =========================================================
   02. SERVICES DETAIL
   ========================================================= */

.terraria-services-detail {
	width: 100%;

	padding-bottom:
		clamp(130px, 12vw, 190px);
}


.terraria-services-detail__inner {
	width: min(
		calc(100% - 6vw),
		var(--terraria-width-site)
	);

	margin-inline: auto;

	border-top:
		1px solid
		var(--terraria-line);
}



/* =========================================================
   03. INDIVIDUAL SERVICE
   ========================================================= */

.terraria-service-detail {
	width: 100%;

	display: grid;

	grid-template-columns:
		64px
		minmax(320px, 0.85fr)
		minmax(0, 1.15fr);

	grid-template-rows:
		auto
		auto;

	column-gap:
		clamp(30px, 4vw, 64px);

	row-gap:
		clamp(20px, 2vw, 28px);

	align-items: start;

	padding-top:
		clamp(38px, 4vw, 58px);

	padding-bottom:
		clamp(42px, 4.5vw, 64px);

	border-bottom:
		1px solid
		var(--terraria-line);

	margin: 0 !important;
}


.terraria-service-detail > * {
	margin-block-start: 0 !important;
	margin-block-end: 0 !important;
}


/* Number */

.terraria-service-detail__number {
	grid-column: 1;
	grid-row: 1 / 3;

	font-family:
		-apple-system,
		BlinkMacSystemFont,
		"Segoe UI",
		Helvetica,
		Arial,
		sans-serif;

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

	line-height: 1.4;
	letter-spacing: 0.08em;

	margin:
		7px
		0
		0 !important;

	color: var(--terraria-mineral);
}


/* Service title */

.terraria-service-detail__title {
	grid-column: 2;
	grid-row: 1;

	font-family:
		Georgia,
		"Times New Roman",
		serif;

	font-size:
		clamp(30px, 2.9vw, 42px);

	font-weight: 400;

	line-height: 1.03;

	letter-spacing: -0.025em;

	max-width: 15ch;

	margin: 0 !important;

	color: var(--terraria-charcoal);

	word-break: normal;
	overflow-wrap: normal;
	hyphens: none;
}


/* Main explanation */

.terraria-service-detail__text {
	grid-column: 3;
	grid-row: 1;

	font-family:
		-apple-system,
		BlinkMacSystemFont,
		"Segoe UI",
		Helvetica,
		Arial,
		sans-serif;

	font-size:
		clamp(17px, 1.25vw, 19px);

	font-weight: 400;

	line-height: 1.7;

	max-width: 560px;

	margin:
		4px
		0
		0 !important;

	color: var(--terraria-graphite);
}


/* Scope / capabilities */

.terraria-service-detail__scope {
	grid-column: 3;
	grid-row: 2;

	font-family:
		-apple-system,
		BlinkMacSystemFont,
		"Segoe UI",
		Helvetica,
		Arial,
		sans-serif;

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

	line-height: 1.6;

	letter-spacing: 0.025em;

	max-width: 560px;

	margin: 0 !important;

	color: var(--terraria-mineral);
}



/* =========================================================
   04. SYSTEM TERRARIA
   ========================================================= */

.terraria-services-system {
	width: 100%;

	padding-top:
		clamp(72px, 7vw, 110px);

	padding-bottom:
		clamp(130px, 12vw, 184px);
}


.terraria-services-system__inner {
	width: min(
		calc(100% - 6vw),
		var(--terraria-width-site)
	);

	margin-inline: auto;

	display: grid;

	grid-template-columns:
		minmax(0, 0.95fr)
		minmax(0, 1.05fr);

	column-gap:
		clamp(56px, 7vw, 116px);

	align-items: start;
}


.terraria-services-system__inner > * {
	margin-block-start: 0 !important;
	margin-block-end: 0 !important;
}


.terraria-services-system__eyebrow {
	grid-column: 1 / -1;

	font-family:
		-apple-system,
		BlinkMacSystemFont,
		"Segoe UI",
		Helvetica,
		Arial,
		sans-serif;

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

	line-height: 1.4;

	letter-spacing: 0.12em;

	text-transform: uppercase;

	margin:
		0
		0
		38px !important;

	color: var(--terraria-mineral);
}


.terraria-services-system__title {
	grid-column: 1;

	font-family:
		Georgia,
		"Times New Roman",
		serif;

	font-size:
		clamp(44px, 4.4vw, 66px);

	font-weight: 400;

	line-height: 1.04;

	letter-spacing: -0.03em;

	max-width: 12ch;

	margin: 0 !important;

	color: var(--terraria-charcoal);
}


.terraria-services-system__text {
	grid-column: 2;

	font-family:
		-apple-system,
		BlinkMacSystemFont,
		"Segoe UI",
		Helvetica,
		Arial,
		sans-serif;

	font-size:
		clamp(17px, 1.3vw, 20px);

	font-weight: 400;

	line-height: 1.72;

	max-width: 570px;

	margin:
		clamp(8px, 1vw, 16px)
		0
		0 !important;

	color: var(--terraria-graphite);
}



/* =========================================================
   05. TABLET
   ========================================================= */

@media (max-width: 900px) {

	.terraria-services-page-intro__inner,
	.terraria-services-detail__inner,
	.terraria-services-system__inner {
		width: calc(100% - 8vw);
	}


	.terraria-services-page-intro__inner,
	.terraria-services-system__inner {
		grid-template-columns: 1fr;
	}


	.terraria-services-page-intro__title,
	.terraria-services-page-intro__text,
	.terraria-services-system__title,
	.terraria-services-system__text {
		grid-column: 1;
	}


	.terraria-services-page-intro__text,
	.terraria-services-system__text {
		margin-top: 30px !important;
	}


	.terraria-service-detail {
		grid-template-columns:
			48px
			minmax(240px, 0.85fr)
			minmax(0, 1.15fr);

		column-gap: 24px;
	}

}



/* =========================================================
   06. MOBILE
   ========================================================= */

@media (max-width: 600px) {

	.terraria-services-page-intro {
		padding-top: 32px;
		padding-bottom: 88px;
	}


	.terraria-services-page-intro__inner,
	.terraria-services-detail__inner,
	.terraria-services-system__inner {
		width: calc(100% - 12vw);
	}


	.terraria-services-page-intro__title {
		font-size:
			clamp(36px, 10vw, 48px);

		line-height: 1.06;

		max-width: 12ch;
	}


	.terraria-services-page-intro__text {
		font-size: 17px;
		line-height: 1.7;

		margin-top: 28px !important;
	}


	/* Service rows */

	.terraria-services-detail {
		padding-bottom: 104px;
	}


	.terraria-service-detail {
		grid-template-columns:
			38px
			minmax(0, 1fr);

		grid-template-rows:
			auto
			auto
			auto;

		column-gap: 14px;
		row-gap: 18px;

		padding-top: 28px;
		padding-bottom: 32px;
	}


	.terraria-service-detail__number {
		grid-column: 1;
		grid-row: 1;

		margin-top: 4px !important;
	}


	.terraria-service-detail__title {
		grid-column: 2;
		grid-row: 1;

		font-size:
			clamp(27px, 7.5vw, 34px);

		max-width: 100%;
	}


	.terraria-service-detail__text {
		grid-column: 2;
		grid-row: 2;

		font-size: 16px;

		line-height: 1.65;

		max-width: 100%;

		margin: 0 !important;
	}


	.terraria-service-detail__scope {
		grid-column: 2;
		grid-row: 3;

		font-size: 12px;

		line-height: 1.65;

		max-width: 100%;
	}


	/* System */

	.terraria-services-system {
		padding-top: 56px;
		padding-bottom: 104px;
	}


	.terraria-services-system__eyebrow {
		font-size: 11px;

		margin-bottom: 24px !important;
	}


	.terraria-services-system__title {
		font-size:
			clamp(36px, 10vw, 46px);

		line-height: 1.07;

		max-width: 12ch;
	}


	.terraria-services-system__text {
		font-size: 17px;

		line-height: 1.7;

		margin-top: 28px !important;
	}

}