:root {
	  --Padding-Section-padding-section-lg: 112px;
		--Padding-Section-padding-section-md: 80px;
		--Padding-Section-padding-section-sm: 48px;
	
	  --Space-100: 4px;
		--Space-200: 8px;
		--Space-300: 12px;
		--Space-400: 16px;
		--Space-600: 24px;
		--Space-800: 32px;
		--Space-900: 36px;
		--Space-1000: 40px;
		--Space-1200: 48px;
		--Space-1600: 64px;
		--Space-2000: 80px;
		
		--Size-Number-L: 68px;
		--Size-Heading-XXL: 60px;
		--Size-Heading-XL: 48px;
		--Size-Heading-L: 40px;
		--Size-Heading-M: 32px;
		--Size-Heading-S: 28px;
		--Size-Heading-XS: 24px;
		--Size-Heading-XXS: 20px;
		--Size-Heading-Body-Large: 18px;
		--Size-Heading-Body-Medium: 16px;
		--Size-Heading-Body-Small: 14px;
		--Size-Heading-Body-Tiny: 12px;
		--Size-Body-Tiny: 12px;
	
	
	--container-width-main: min(100%, 1440px);
	--container-width-container-lg: 1280px;
	--container-width-container-md: 1024px;
	--container-width-container-sm: 768px;
	--section-title-width: min(100%, 1024px);
	
	--Radius-XXsmal: 4px;
	--Radius-Xsmall: 8px;
	--Radius-Small: 12px;
	--Radius-Medium: 16px;
  --Radius-Large: 24px;
	
	--Icon-Large: 40px;
	--Icon-Medium: 32px;
	--Icon-Small: 24px;
	--Icon-Xsmall: 20px;
}

@media screen and (max-width: 1024px) {
	:root {
		--container-width-main:1024px;
	}
}

@media screen and (max-width: 768px) {
	:root {
		--container-width-main:767px;
		
		--Padding-Section-padding-section-lg: 48px;
		--Padding-Section-padding-section-md: 24px;
		--Padding-Section-padding-section-sm: 12px;
		
		--Space-100: 4px;
		--Space-200: 8px;
		--Space-300: 12px;
		--Space-400: 16px;
		--Space-600: 24px;
		--Space-800: 24px;
		--Space-900: 36px;
		--Space-1000: 40px;
		--Space-1200: 48px;
		--Space-1600: 32px;
		--Space-2000: 48px;
		
		--Size-Number-L: 60px;
		--Size-Heading-XXL: 32px;
		--Size-Heading-XL: 28px;
		--Size-Heading-L: 28px;
		--Size-Heading-M: 20px;
		--Size-Heading-S: 24px;
		--Size-Heading-XS: 20px;
		--Size-Heading-XXS: 18px;
		--Size-Heading-Body-Large: 18px;
		--Size-Heading-Body-Medium: 16px;
		--Size-Heading-Body-Small: 14px;
		--Size-Heading-Body-Tiny: 12px;
		--Size-Body-Tiny: 12px;
 }
}

html, body, .site {
	height: 100%;
}

.site {
	display: flex;
  flex-direction: column;
}

.site-main{
	flex-grow: 1;
}


.hfe-nav-menu-icon{
	padding: 12px!important;
	border: none!important;
}

#studio-companion-notice{
	display:none;
}