@charset "UTF-8";

/**************************/
/**************************/
/********** VARS **********/
/**************************/
/**************************/

@media (min-width:0px) {
	body {
		--header-height:4.375rem;
		--footer-height:2.75rem;
		--global-margin: 1rem;
		--border-width:.0625rem;
	}
}
@media (min-width:760px) {
	body {
		--header-height:5rem;
		--footer-height:3rem;
		--global-margin: 2rem;
	}
}
@media (min-width:1200px) {
	body {
		--global-margin: 3rem;
	}
}

/****************************/
/****************************/
/********** GLOBAL **********/
/****************************/
/****************************/

html, body {
	margin:0;
	padding:0;
	border:0;
	height:100%;
	width:100%;
}

/********** BODY **********/

body {
	-webkit-overflow-scrolling:touch;
	overflow-x:hidden;
	color:var(--dark-color);
	text-shadow:0 0 0 var(--dark-color);
	background:var(--bright-color);
}

/********** WRAPPER **********/
/* flex == footer at bottom */

#wrapper {
	position:relative;
	display:-webkit-box;
	display:-webkit-flex;
	display:-moz-box;
	display:-ms-flexbox;
	display:flex;
	-webkit-box-orient:vertical;
	-webkit-box-direction:normal;
	-webkit-flex-direction:column;
	   -moz-box-orient:vertical;
	   -moz-box-direction:normal;
	    -ms-flex-direction:column;
	        flex-direction:column;
	min-height:100%;
	background:var(--light-color);
	margin:0;
	padding:0;
}

/********** MAIN **********/

main {
	position:relative;
	display:-webkit-box;
	display:-webkit-flex;
	display:-moz-box;
	display:-ms-flexbox;
	display:flex;
	-webkit-box-orient:vertical;
	-webkit-box-direction:normal;
	-webkit-flex-direction:column;
	   -moz-box-orient:vertical;
	   -moz-box-direction:normal;
	    -ms-flex-direction:column;
	        flex-direction:column;
	-webkit-box-align:center;
	-webkit-align-items:center;
	   -moz-box-align:center;
	    -ms-flex-align:center;
	        align-items:center;
	padding:0;
	margin:0;
	-webkit-box-flex:1;
	-webkit-flex-grow:1;
	   -moz-box-flex:1;
	    -ms-flex-positive:1;
	        flex-grow:1;
	overflow:hidden;
}

/****************************/
/****************************/
/********** HEADER **********/
/****************************/
/****************************/

header {
	position:-webkit-sticky;
	position:sticky;
	z-index:1200;
	top:0;
	pointer-events:none;
	display:-webkit-box;
	display:-webkit-flex;
	display:-moz-box;
	display:-ms-flexbox;
	display:flex;
	-webkit-box-align:stretch;
	-webkit-align-items:stretch;
	   -moz-box-align:stretch;
	    -ms-flex-align:stretch;
	        align-items:stretch;
	-webkit-box-pack:justify;
	-webkit-justify-content:space-between;
	   -moz-box-pack:justify;
	    -ms-flex-pack:justify;
	        justify-content:space-between;
	background:var(--bright-color);
	width:100%;
	margin:0;
	padding:1em;
}
header > * {
	z-index:10;
	pointer-events:auto;
	margin:0;
	color:inherit;
	text-shadow:inherit;
	fill:inherit;
}

/********** LOGO **********/

#logo {
	position:absolute;
	z-index:2000;
	display:block;
}
#logo:after {
	content:"";
	position:absolute;
	z-index:-1;
	top:0;
	left:0;
	height:100%;
	width:100%;
	background:var(--bright-color);
	-webkit-transform:rotate(90deg) scale(1.75) translate(0,7.5%);
	   -moz-transform:rotate(90deg) scale(1.75) translate(0,7.5%);
	    -ms-transform:rotate(90deg) scale(1.75) translate(0,7.5%);
	     -o-transform:rotate(90deg) scale(1.75) translate(0,7.5%);
	        transform:rotate(90deg) scale(1.75) translate(0,7.5%);
	background-repeat: no-repeat !important;
	-webkit-background-size: contain !important;
	   -moz-background-size: contain !important;
	     -o-background-size: contain !important;
	        background-size: contain !important;
	background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1 1" xml:space="preserve"><path fill="rgb(255, 255, 255)" d="M.81.87A.921.921 0 0 0 .92.836.04.04 0 0 0 .944.815a1.047 1.047 0 0 0 .05-.189A.436.436 0 0 0 1 .548.108.108 0 0 0 .992.516.399.399 0 0 0 .96.447a4.295 4.295 0 0 0-.163-.23L.78.197A154.67 154.67 0 0 1 .466.076C.461.074.458.076.454.077l-.058.03a688.932 688.932 0 0 1-.36.4.019.019 0 0 0-.004.009C.022.568.015.62.008.674A.663.663 0 0 0 0 .788C.001.806.013.81.026.814.116.843.207.873.3.897a.56.56 0 0 0 .213.025C.533.92.634.906.662.901L.81.869"/></svg>');
}

/********** @MEDIA **********/

@media (min-width:0px) {
	#logo {
		top:1rem;
		left:1rem;
	}
	#logo svg {
		height:5rem;
	}
}
@media (min-width:760px) {
	#logo svg {
		height:7rem;
	}
	body.index #logo {
		opacity:0;
		-webkit-transform:translate3d(0,-50%,0);
		   -moz-transform:translate3d(0,-50%,0);
		        transform:translate3d(0,-50%,0);
	}
	body.index.scrolled #logo {
		opacity:1;
		-webkit-transform:translate3d(0,0,0);
		   -moz-transform:translate3d(0,0,0);
		        transform:translate3d(0,0,0);
	}
}
@media (min-width:1000px) {
	#logo {
		top:1.25rem;
		left:2rem;
	}
}
@media (min-width:1200px) {
	#logo {
		top:1.5rem;
	}
}
@media (min-width:1400px) {
	#logo {
		top:2rem;
	}
}

/** mobile **/

@media (max-width:760px) {
	header .socialbar {
		margin-left:auto;
	}
}

/** desktop **/

@media (min-width:760px) {
	header #primary {
		margin:0 0 0 auto;
	}
}

/****************************/
/****************************/
/********** FOOTER **********/
/****************************/
/****************************/

footer {
	position:-webkit-sticky;
	position:sticky;
	z-index:10;
	left:0;
	bottom:0;
	display:-webkit-box;
	display:-webkit-flex;
	display:-moz-box;
	display:-ms-flexbox;
	display:flex;
	-webkit-box-pack:justify;
	-webkit-justify-content:space-between;
	   -moz-box-pack:justify;
	    -ms-flex-pack:justify;
	        justify-content:space-between;
	-webkit-box-align:center;
	-webkit-align-items:center;
	   -moz-box-align:center;
	    -ms-flex-align:center;
	        align-items:center;
	width:100%;
	pointer-events:none;
	line-height:1em;
	background:var(--bright-color);
}
footer > * {
	text-align:center;
	pointer-events:auto;
	margin:0;
}

/********** CONTENT **********/

footer .copyright {
	padding:1rem;
	margin:0;
	white-space: nowrap;
}
footer .socialbar {
	margin:0 auto 0 0;
}
footer a:hover {
	-webkit-transform:scale(.9);
	   -moz-transform:scale(.9);
	    -ms-transform:scale(.9);
	     -o-transform:scale(.9);
	        transform:scale(.9);
}

/********** @MEDIA **********/

@media (max-width:760px) {
	footer {
		font-size:.75rem;
	}
}

/******************************/
/******************************/
/********** SECTIONS **********/
/******************************/
/******************************/

/*
[default]	== normal content max-width
.focus		== heading section
.full		== no content max-width / no padding
.large		== no content max-width
.cover		== Fullscreen (100vh) min-height

css <=> wp 
section <=> .section / .wp-block-group
section .content <=> .wp-block-group__inner-container

null		<=> short
alignwide 	<=> normal
alignfull	<=> large
*/

section {
	position:relative;
	z-index:10;
	clear:both;
	display:-webkit-box;
	display:-webkit-flex;
	display:-moz-box;
	display:-ms-flexbox;
	display:flex;
	-webkit-box-align: start;
	-webkit-align-items: flex-start;
	   -moz-box-align: start;
	    -ms-flex-align: start;
	        align-items: flex-start;
	-webkit-box-pack:center;
	-webkit-justify-content:center;
	   -moz-box-pack:center;
	    -ms-flex-pack:center;
	        justify-content:center;
	overflow:initial;
	width:100%;
	padding:0 !important;
	margin:0;
}
section .content {
	max-width:75rem;
}
section.vertical-centered .content {
	-webkit-align-self: center;
	    -ms-flex-item-align: center;
	            -ms-grid-row-align: center;
	        align-self: center;
}

/********** SECTION FULL **********/

section.full > .content {
	margin:0 !important;
	max-width:none;
}

/********** SECTION FIT **********/
/* no margin */

section.fit,
section.fit > .content {
	margin:0 !important;
}

/********** SECTION LARGE **********/
/* like full with margin */

section.large,
section.large > .content {
	max-width:none;
}

/********** SECTION SHORT **********/
/* short content */

section.short > .content {
	max-width:45rem;
}

/********** SECTION COVER **********/
/* fullscreen */

section.cover {
	display:-webkit-box;
	display:-webkit-flex;
	display:-moz-box;
	display:-ms-flexbox;
	display:flex;
	min-height:-webkit-calc(100vh - var(--header-height) - var(--footer-height));
	min-height:-moz-calc(100vh - var(--header-height) - var(--footer-height));
	min-height:calc(100vh - var(--header-height) - var(--footer-height));
}

/********** SECTION CONTENT / ASIDE **********/

section .content {
	position:relative;
	z-index:10;
	-webkit-box-flex:1;
	-webkit-flex-grow:1;
	   -moz-box-flex:1;
	    -ms-flex-positive:1;
	        flex-grow:1;
	margin-left:auto;
	margin-right:auto;
}
section > .content {
	-webkit-flex-basis:0;
	    -ms-flex-preferred-size:0;
	        flex-basis:0;
}

section .content .columns .short img {
	margin:0 0 0 auto;
}

/********** MARGIN **********/
/*
section .content {
	margin:var(--global-margin) calc(var(--global-margin) * 2);
	width:calc(100% - var(--global-margin) * 4);
}
section.large .content {
	margin:var(--global-margin);
	width:calc(100% - var(--global-margin) * 2);
}
section.has-dark-background-color .content,
.has-white-background-color .content,
.has-light-background-color .content {
	margin:calc(var(--global-margin) * 2);
}
main > section:last-child .content {
	margin-bottom:calc(var(--global-margin) * 2);
}
*/
/********** @MEDIA **********/

@media (min-width:0px) {
	section .content {
		margin:4rem 2rem;
	}
	section.min .content {
		margin:2rem;
	}
}
@media (min-width:480px) {
	section .content {
		margin:4rem;
	}
}
@media (min-width:760px) {
	section .content {
		margin:6rem;
	}
	section.min .content {
		margin:3rem;
	}
}
@media (min-width:1000px) {
	section .content {
		margin:8rem;
	}
	section.min .content {
		margin:4rem;
	}
}

/**********************************/
/**********************************/
/********** INTRODUCTION **********/
/**********************************/
/**********************************/
/* aspect-ratio == 1366/768 */

section.introduction {
	background:var(--bright-color);
}

/********** BACKGROUND **********/

#background {
	position:relative;
	z-index:-1;
	height:100%;
	background:rgba(255,255,255,.9775); /* opacity1 + opacity2 - opacity1 x opacity2 */
	aspect-ratio:1/1;
}
#background > * {
	margin:0;
}
#background svg {
	position:absolute;
	z-index:10;
	top:0;
	left:0;
}
#background .svg-layer,
#background .svg-background {
	height:100%;
	width:100%;
	fill:var(--bright-color);
}
#background .svg-layer {
	opacity:.85;
}
#background video {
	top:50%;
	left:50%;
	height:-webkit-calc(100% - 1px);
	height:-moz-calc(100% - 1px);
	height:calc(100% - 1px);
	width:-webkit-calc(100% - 1px);
	width:-moz-calc(100% - 1px);
	width:calc(100% - 1px);
	opacity:.75;
	-webkit-transform:translate3d(-50%,-50%,0);
	   -moz-transform:translate3d(-50%,-50%,0);
	        transform:translate3d(-50%,-50%,0);
}
#background:after {
	content:"";
	position:absolute;
	z-index: 5;
	top:50%;
	left:50%;
	height:-webkit-calc(100% - 1px);
	height:-moz-calc(100% - 1px);
	height:calc(100% - 1px);
	width:-webkit-calc(100% - 1px);
	width:-moz-calc(100% - 1px);
	width:calc(100% - 1px);
	opacity:.5;
	-webkit-transform:translate3d(-50%,-50%,0);
	   -moz-transform:translate3d(-50%,-50%,0);
	        transform:translate3d(-50%,-50%,0);
	background:var(--dark-color);
}
#background .logo {
	position:absolute;
	z-index:15;
	top:50%;
	left:auto;
	right:0;
	height:30%;
	width:auto;
	-webkit-transform:translate3d(0,-50%,0);
	   -moz-transform:translate3d(0,-50%,0);
	        transform:translate3d(0,-50%,0);
}

/********** @MEDIA **********/
/* min-height:15rem == iphone5 */

/** mobile **/

@media (max-width:1000px) {
	#background {
		opacity:.25;
	}
}

/** responsive **/

@media (min-width:0px) {
	#background .logo {
		display:none;
	}
	#background {
		position:absolute;
		left:50%;
		width:auto;
		-webkit-transform:translate3d(-50%,0,0) scale(1.5);
		   -moz-transform:translate3d(-50%,0,0) scale(1.5);
		        transform:translate3d(-50%,0,0) scale(1.5);
		-webkit-transform-origin: center center;
		   -moz-transform-origin: center center;
		    -ms-transform-origin: center center;
		     -o-transform-origin: center center;
		        transform-origin: center center;
	}
}
@media (min-width:760px) {
	#background {
		position:relative;
		width:100%;
		margin-left:-10%;
		-webkit-transform:translate3d(-50%,0,0) scale(2);
		   -moz-transform:translate3d(-50%,0,0) scale(2);
		        transform:translate3d(-50%,0,0) scale(2);
		-webkit-transform-origin: center right;
		   -moz-transform-origin: center right;
		    -ms-transform-origin: center right;
		     -o-transform-origin: center right;
		        transform-origin: center right;
	}
	#background .logo {
		display:block;
	}
}

/***********************************/
/***********************************/
/********** SECTION FOCUS **********/
/***********************************/
/***********************************/

section.focus:not(.cover) {
	min-height:60vh;
}

/********************************/
/********************************/
/********** WP CONTENT **********/
/********************************/
/********************************/
/* css <> wp */

/********** FRONT **********/
/** no section == directly in main == apply to content like is section **/

main > *:not(section):not(#contextual):not([class*="-background-color"]):not(.full) {
	width:-webkit-calc(100% - var(--global-margin) * 4);
	width:-moz-calc(100% - var(--global-margin) * 4);
	width:calc(100% - var(--global-margin) * 4);
	margin:var(--global-margin) -webkit-calc(var(--global-margin) * 2);
	margin:var(--global-margin) -moz-calc(var(--global-margin) * 2);
	margin:var(--global-margin) calc(var(--global-margin) * 2);
}

/** group ending with -background-color **/

main > *[class*="-background-color"] {
	width:100%;
	margin:0;
	padding:var(--global-margin) -webkit-calc(var(--global-margin) * 2);
	padding:var(--global-margin) -moz-calc(var(--global-margin) * 2);
	padding:var(--global-margin) calc(var(--global-margin) * 2);
}

/********** BACK **********/
/* back is--root-container <> front main */

.is-root-container {
	position:relative;
	display:-webkit-box;
	display:-webkit-flex;
	display:-moz-box;
	display:-ms-flexbox;
	display:flex;
	-webkit-box-orient:vertical;
	-webkit-box-direction:normal;
	-webkit-flex-direction:column;
	   -moz-box-orient:vertical;
	   -moz-box-direction:normal;
	    -ms-flex-direction:column;
	        flex-direction:column;
	-webkit-box-align:center;
	-webkit-align-items:center;
	   -moz-box-align:center;
	    -ms-flex-align:center;
	        align-items:center;
	padding:0;
	margin:0;
	-webkit-box-flex:1;
	-webkit-flex-grow:1;
	   -moz-box-flex:1;
	    -ms-flex-positive:1;
	        flex-grow:1;
}
.is-root-container > *:not(section):not(#contextual):not([class*="-background-color"]) {
	width:-webkit-calc(100% - var(--global-margin) * 4);
	width:-moz-calc(100% - var(--global-margin) * 4);
	width:calc(100% - var(--global-margin) * 4);
	margin:var(--global-margin) -webkit-calc(var(--global-margin) * 2);
	margin:var(--global-margin) -moz-calc(var(--global-margin) * 2);
	margin:var(--global-margin) calc(var(--global-margin) * 2);
	max-width:none;
}

/** group ending with -background-color **/

.is-root-container > *[class*="-background-color"] {
	width:100%;
	margin:0;
	padding:var(--global-margin) -webkit-calc(var(--global-margin) * 2);
	padding:var(--global-margin) -moz-calc(var(--global-margin) * 2);
	padding:var(--global-margin) calc(var(--global-margin) * 2);
	max-width:none;
}