@charset "UTF-8";

@font-face {
	font-family: 'Aeonik';
	font-style: normal;
	font-weight: 300;
	src: url('/templates/taiafon/fonts/aeonik-light.woff2') format('woff2'),
		url('/templates/taiafon/fonts/aeonik-light.woff') format('woff');
}

@font-face {
	font-family: 'Aeonik';
	font-style: normal;
	font-weight: 400;
	src: url('/templates/taiafon/fonts/aeonik-regular.woff2') format('woff2'),
		url('/templates/taiafon/fonts/aeonik-regular.woff') format('woff');
}
@font-face {
	font-family: 'Aeonik';
	font-style: normal;
	font-weight: 700;
	src: url('/templates/taiafon/fonts/aeonik-bold.woff') format('woff2'),
		url('/templates/taiafon/fonts/aeonik-bold.woff') format('woff2');
}

:root{
	/*	sizing */
    --ss:100/393;
	--rem:16;
	
/*	colours */
    --white:#FFFFFF;
	--black:#000000;
	--off-black:#20251D;  	/* Dark Text 2 */
	--Morning-Haze:#F0E0CC; /* Morning Haze */
	--Rich-Steel:#484A3F; /* Rich Steel */
	--Grain:#D5C4A9;       /* Grain */
	--Light-Taf-Blue:#C5D4DA;       /* Light Taf Blue #C4D4CF */
	--Golden-Hour:#F29673;       /* Golden Hour */
	--Dark-Taf-Blue:#8C9290;  /* Dark Taf Blue */

/*	font-families */
	--ff:"Aeonik", sans-serif;
	
	--h1:normal 500 calc(var(--ss)*40vw) / 1.12em var(--ff);
	--h2:normal 500 calc(var(--ss)*32vw) / 1.12em var(--ff);
    --h3:normal 400 calc(var(--ss)*22vw) / 1.27em var(--ff);
	
	--sub:normal 700 calc(var(--ss)*12vw) / 1em var(--ff);
	
	--p1:normal 400 calc(var(--ss)*22vw) / 1.27em var(--ff);
	--p2:normal 300 calc(var(--ss)*16vw) / 1.25em var(--ff);
	
	--footer:normal 300 calc(var(--ss)*16vw) / 1.37em var(--ff);
	--footerb:normal 400 calc(var(--ss)*16vw) / 1.37em var(--ff);
	--footers:normal 400 calc(var(--ss)*12vw) / 1.2em var(--ff);
	
	--btn:normal 700 calc(var(--ss)*12vw) / 1em var(--ff);
	--nav:normal 400 calc(var(--ss)*22vw) / 1.27em var(--ff);
	--nav2:normal 300 calc(var(--ss)*16vw) / 1.37em var(--ff);
    
    --icons:normal 700 calc(var(--ss)*11.796vw) / 1em var(--ff);

	--hpad:calc(var(--ss)*30vw);
	--vpad:calc(var(--ss)*60vw);
    --vpads:calc(var(--ss)*40vw);
	
	--header-height:calc(var(--ss)*70vw);
	--banner-height:0vw;
	
	--bounce-right: 2s bounceright 2.5s infinite;
	--bounce-left: 2s bounceleft 2.5s infinite;
	--bounce-down: 2s bouncedown 2.5s infinite;
	
	
	--radius:calc(var(--ss)*5vw);
	
	--lsn01:-0.01em;
	--ls02:0.02em;
	--ls05:0.05em;
		
	--border:calc(var(--ss)*1vw) solid var(--Rich-Steel);
    --border2:calc(var(--ss)*0.5vw) solid var(--Dark-Taf-Blue);
    --shadow: 0 0 calc(var(--ss)*14.4vw) 0 rgba(0, 0, 0, 0.20);
    --blur:blur(calc(var(--ss)*5vw));
    --scale:1.03;
}

.has-banner.very-top{
	--banner-height:calc(var(--ss)*45vw);
}

@media(max-width:768px){
	body.mega-open.has-banner{
		--banner-height:0vw;
	}
}


/* DESKTOP */
@media(min-width:769px){
	:root{
		/*	sizing */
    	--ss:100/1440;
		
		--h1:normal 500 calc(var(--ss)*50vw) / 1.2em var(--ff);
		--h2:normal 500 calc(var(--ss)*40vw) / 1.12em var(--ff);
        --h3:normal 400 calc(var(--ss)*22vw) / 1.27em var(--ff);
		
		--p1:normal 400 calc(var(--ss)*25vw) / 1.27em var(--ff);
		--p2:normal 300 calc(var(--ss)*16vw) / 1.25em var(--ff);
		
		--nav:normal 700 calc(var(--ss)*12vw) / 1em var(--ff);
        
        --icons:normal 700 calc(var(--ss)*13vw) / 1em var(--ff);
		
		--hpad:calc(var(--ss)*150vw);
		--vpad:calc(var(--ss)*130vw);
        --vpads:calc(var(--ss)*80vw);
		
		--header-height:calc(var(--ss)*90vw);
	}
    
    body:not(.very-top){
        --header-height:calc(var(--ss)*64vw);
    }
	
}

/* XL DESKTOP */
@media(min-width:1441px){
	:root{
		--h1:normal 500 calc(50/16*1rem) / 1.2em var(--ff);
		--h2:normal 500 calc(40/16*1rem) / 1.12em var(--ff);
        --h3:normal 400 calc(22/16*1rem) / 1.27em var(--ff);
		
		--sub:normal 700 calc(12/16*1rem) / 1em var(--ff);
		
		--p1:normal 400 calc(25/16*1rem) / 1.27em var(--ff);
		--p2:normal 300 1rem / 1.25em var(--ff);
		
		--nav:normal 700 calc(12/16*1rem) / 1em var(--ff);
		
		--footer:normal 300 1rem / 1.37em var(--ff);
		--footerb:normal 400 1rem / 1.37em var(--ff);
		--footers:normal 400 calc(12/16*1rem) / 1.2em var(--ff);
		
		--btn:normal 700 calc(12/16*1rem) / 1em var(--ff);
        --icons:normal 700 calc(13/16*1rem) / 1em var(--ff);
		
		--hpad:calc(130/16*1rem);
		--vpad:calc(160/16*1rem);
        --vpads:calc(80/16*1rem);
		
		--header-height:calc(90/16*1rem);
		--banner-height:0rem;
		
		--radius:calc(5/16*1rem);
		
		--border:1px solid var(--Rich-Steel);
        --border2:0.5px solid var(--Dark-Taf-Blue);
        --shadow: 0 0 calc(14.4/16*1rem) 0 rgba(0, 0, 0, 0.20);
        --blur: blur(calc(5/16*1rem))
/*		--ls02:0.02em;*/
	}
	.has-banner.very-top{
		--banner-height:3.5625rem;
	}
    body:not(.very-top){
        --header-height:calc(64/16*1rem);
    }
}