/** @format */
@font-face {
	font-family: 'AkzidenzGroteskPro';
	src: url('../../fonts/AkzidenzGroteskProLightRegular.woff2') format('woff2');
	font-weight: 300;
	font-style: normal;
	font-display: swap;
}

@font-face {
	/* Italic */
	font-family: 'AkzidenzGroteskPro';
	src: url('../../fonts/AkzidenzGroteskProLightItalic.woff2') format('woff2');
	font-weight: 300;
	font-style: italic;
	font-display: swap;
}

@font-face {
	/* Bold */
	font-family: 'AkzidenzGroteskPro';
	src: url('../../fonts/AkzidenzGroteskProSuper.woff2') format('woff2');
	font-weight: 900;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-display: block;
	font-family: 'Icons';
	font-style: normal;
	font-weight: normal;
	src:
		url('../../fonts/MaterialIcons-Regular.woff2') format('woff2'),
		url('../../fonts/MaterialIcons-Regular.woff') format('woff');
}

:root {
	/*
	---COLORS---
	*/
	--color-black: #000000;
	--color-white: #ffffff;
	--color-orange-red: #ff3c00;
	--color-grey: #d9d9d9;
	--color-light-orange-red: #ff3c0080;
	/*
	---FONT FAMILIES---
	*/
	--ff-main-font: 'AkzidenzGroteskPro', Helvetica, Arial, sans-serif; /* Akzidenz-Grotesk Pro */
	--ff-icon-font: 'Icons', sans-serif;
	/*
	---ICONS---
	*/
	--icon-arrow-right: url('../../img/icons/arrow-right.svg');
	--icon-arrow-left: url('../../img/icons/arrow-left.svg');
	--icon-projectsback: url('../../img/icons/projectsback.svg');
	--icon-arrow-down: url('../../img/icons/arrow-down.svg');
	--icon-plus: url('../../img/icons/accordion.svg');
	/*
	---FONT SIZES---
	*/
	--fs-titleprimary: clamp(2.5rem, 6.5vw, 5rem); /* 40px - 80px */
	--fs-titlesecondary: clamp(1.375rem, 3.575vw, 2.8125rem); /* 22px - 45px */
	--fs-textstandard: clamp(1.125rem, 2.295vw, 1.875rem); /* 18px - 30px */
	--fs-textcommon: 1rem; /* only 16px */

	/*
	---WRAPPER---
	*/
	--wrapper-width: 1200px;

	/*   

	---SPACING / GAPS---
	*/
	--universal-gap: clamp(1.125rem, 2.295vh, 1.875rem);
	--wrapper-padding: clamp(1rem, 4vw, 3rem);

	--universal-large-gap: calc(var(--universal-gap) * 4);
	--universal-big-gap: calc(var(--universal-gap) * 2);
	--universal-small-gap: calc(var(--universal-gap) / 2);
	--universal-tiny-gap: calc(var(--universal-gap) / 4);
	--gap-50: clamp(1.125rem, 2.295vw, 3.125rem);

	/*
	---HEIGHT CALCULATIONS---
	 */
	--header-height: 0px;
	--wpadminbar-height: 0px;
	--height-of-fixed-elements: calc(var(--header-height) + var(--wpadminbar-height));
}