/**
 * Base Variables
 */

/* @link https://utopia.fyi/type/calculator?c=320,16,1.2,1240,18,1.25,5,2,&s=0.75|0.5|0.25,1.5|2|3|4|6,s-l&g=s,l,xl,12 */

:root {
	/* Font Sizing */

	--fs-96: clamp(3.8rem, 2.6rem + 2vw, 6rem);
	--fs-72: clamp(3.5rem, 1.8rem + 1.2vw, 4.5rem);
	--fs-68: clamp(3rem, 1.8rem + 1.2vw, 3.75rem);
	--fs-60: clamp(3rem, 1.8rem + 1.2vw, 3.75rem);
	--fs-54: clamp(2.25rem, 1.8rem + 1.2vw, 3.375rem);
	--fs-48: clamp(2rem, 1.8rem + 1.2vw, 3rem);
	--fs-42: clamp(1.8rem, 1.2rem + 0.8vw, 2.625rem);
	--fs-36: clamp(1.8rem, 1.1rem + 0.8vw, 2.25rem);
	--fs-30: clamp(1.5rem, 1rem + 0.6vw, 1.875rem);
	--fs-24: clamp(1.2rem, 0.8rem + 0.4vw, 1.5rem);
	--fs-18: clamp(1rem, 0.7rem + 0.3vw, 1.125rem);
	--fs-16: clamp(0.9rem, 0.7rem + 0.2vw, 1rem);
	--fs-14: .875rem;
	--fs-12: .75rem;

	/* Spacing */

	--spacing-scale: 1;

	/* Colours */

	--black: #000;
	
	--grey-dark: #3F3F3F;
	
	--grey-light: #D9D9D9;

	--white: #FFF;

	/* Weights */

	--light: 300;
	--regular: 400;
	--medium: 500;
	--bold: 700;

}

@media screen and (max-width: 768px) {
	:root {
		--spacing-scale: 0.5;
	}
}

@media screen and (max-width: 480px) {
	:root {
		--spacing-scale: 0.25;
	}
}

/* Helpers */


.fs--96 {
	font-size: var(--fs-96);
}

.fs--72 {
	font-size: var(--fs-72);
}

.fs--68 {
	font-size: var(--fs-68);
}

.fs--60 {
	font-size: var(--fs-60);
}

.fs--54 {
	font-size: var(--fs-54);
}

.fs--48 {
	font-size: var(--fs-48);
}

.fs--42 {
	font-size: var(--fs-42);
}

.fs--36 {
	font-size: var(--fs-36);
}

.fs--30 {
	font-size: var(--fs-30);
}

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

.fs--18 {
	font-size: var(--fs-18);
}

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

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

.fs--12 {
	font-size: var(--fs-12);
}

.fw--light {
	font-weight: var(--light);	
}

.fw--regular {
	font-weight: var(--regular);	
}

.fw--medium {
	font-weight: var(--medium);	
}

.fw--bold {
	font-weight: var(--bold);	
}

.no-margin {
	margin: 0;
}

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

.grid {
	display: grid;
	grid-template-columns: repeat(12, 1fr);
	gap: 2.5rem;
}

.grid-span-full {
	grid-column: span 12;
}

.grid-span-three-quarter {
	grid-column: span 9;
}

.grid-span-two-third {
	grid-column: span 8;
}

.grid-span-half {
	grid-column: span 6;
}

.grid-span-five {
	grid-column: span 5;
}

.grid-span-third {
	grid-column: span 4;
}

.grid-span-quarter {
	grid-column: span 3;
}

.align-center {
	align-items: center;
}

@media screen and (max-width: 1024px) {
	.grid {
		grid-template-columns: repeat(6, 1fr);
	}

	.grid-span-two-third,
	.grid-span-half,
	.grid-span-quarter,
	.grid-span-third,
	.grid-span-three-quarter,
	.grid-span-five,
	.cascade {
		grid-column: span 6 !important;
	}
}