:root {
	/* 	Fluid type scale calculator: Calculated font sizes
		@link https://utopia.fyi/type/calculator?c=320,18,1.2,1920,32,1.25,5,2,&s=0.75|0.5|0.25,1.5|2|3|4|6,s-l&g=s,l,xl,12 */

	/* Step -2      : 12.5px → 20.48px */
	 --step--2      : clamp(0.7813rem, 0.6815rem + 0.4988vw, 1.28rem);
	/* Step -1      : 15px → 25.6px */
	 --step--1      : clamp(0.9375rem, 0.805rem + 0.6625vw, 1.6rem);
	/*  Step 0      : 18px → 32px */
	  --step-0      : clamp(1.125rem, 0.95rem + 0.875vw, 2rem);
	/*  Step 1      : 21.6px → 40px */
	  --step-1      : clamp(1.35rem, 1.12rem + 1.15vw, 2.5rem);
	/*  Step 2      : 25.92px → 50px */
	  --step-2      : clamp(1.62rem, 1.319rem + 1.505vw, 3.125rem);
	/*  Step 3      : 31.104px → 62.5px */
	  --step-3      : clamp(1.944rem, 1.5516rem + 1.9623vw, 3.9063rem);
	/*  Step 4      : 37.3248px → 78.125px */
	  --step-4      : clamp(2.3328rem, 1.8228rem + 2.55vw, 4.8828rem);
	/*  Step 5      : 44.7898px → 97.6563px */
	  --step-5      : clamp(2.7994rem, 2.1385rem + 3.3042vw, 6.1035rem);



	/* 	Fluid Space Calculator: Individual space values
		@link https://utopia.fyi/space/calculator?c=320,18,1.2,1920,32,1.25,5,2,&s=0.75|0.5|0.25,1.5|2|3|4|6,s-l&g=s,l,xl,12 */

	/* Space 3xs    : 5px → 8px */
	 --space-3xs    : clamp(0.3125rem, 0.275rem + 0.1875vw, 0.5rem);
	/* Space 2xs    : 9px → 16px */
	 --space-2xs    : clamp(0.5625rem, 0.475rem + 0.4375vw, 1rem);
	/* Space xs     : 14px → 24px */
	 --space-xs     : clamp(0.875rem, 0.75rem + 0.625vw, 1.5rem);
	/* Space s      : 18px → 32px */
	 --space-s      : clamp(1.125rem, 0.95rem + 0.875vw, 2rem);
	/* Space m      : 27px → 48px */
	 --space-m      : clamp(1.6875rem, 1.425rem + 1.3125vw, 3rem);
	/* Space l      : 36px → 64px */
	 --space-l      : clamp(2.25rem, 1.9rem + 1.75vw, 4rem);
	/* Space xl     : 54px → 96px */
	 --space-xl     : clamp(3.375rem, 2.85rem + 2.625vw, 6rem);
	/* Space 2xl    : 72px → 128px */
	 --space-2xl    : clamp(4.5rem, 3.8rem + 3.5vw, 8rem);
	/* Space 3xl    : 108px → 192px */
	 --space-3xl    : clamp(6.75rem, 5.7rem + 5.25vw, 12rem);

	/* One-up pairs */
	/* Space 3xs-2xs: 5px → 16px */
	 --space-3xs-2xs: clamp(0.3125rem, 0.175rem + 0.6875vw, 1rem);
	/* Space 2xs-xs : 9px → 24px */
	 --space-2xs-xs : clamp(0.5625rem, 0.375rem + 0.9375vw, 1.5rem);
	/* Space xs-s   : 14px → 32px */
	 --space-xs-s   : clamp(0.875rem, 0.65rem + 1.125vw, 2rem);
	/* Space s-m    : 18px → 48px */
	 --space-s-m    : clamp(1.125rem, 0.75rem + 1.875vw, 3rem);
	/* Space m-l    : 27px → 64px */
	 --space-m-l    : clamp(1.6875rem, 1.225rem + 2.3125vw, 4rem);
	/* Space l-xl   : 36px → 96px */
	 --space-l-xl   : clamp(2.25rem, 1.5rem + 3.75vw, 6rem);
	/* Space xl-2xl : 54px → 128px */
	 --space-xl-2xl : clamp(3.375rem, 2.45rem + 4.625vw, 8rem);
	/* Space 2xl-3xl: 72px → 192px */
	 --space-2xl-3xl: clamp(4.5rem, 3rem + 7.5vw, 12rem);

	/* Custom pairs */
	/* Space s-l    : 18px → 64px */
	 --space-s-l    : clamp(1.125rem, 0.55rem + 2.875vw, 4rem);
}



/*	Fluid Grid Calculator: 
	@link https://utopia.fyi/grid/calculator?c=320,18,1.2,1920,32,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 {
	--grid-max-width: 124.00rem;
	--grid-gutter   : var(--space-s-l, clamp(1.125rem, 0.5721rem + 2.7644vw, 4rem));
	--grid-columns : 12;
}

.u-container {
  max-width: var(--grid-max-width);
  padding-inline: var(--grid-gutter);
  margin-inline: auto;
}

.u-grid {
  display: grid;
  gap: var(--grid-gutter);
}