
/* !@group variables */

:root {

	--white: 			#ffffff;
	--black: 			#000000;
	--blue: 			#001865;
	--dk-blue: 			#131b35;
	--red: 				#e4032e;
	--grey: 			#f5f3f1;
	--grey-hover: 		#dcdbda;
	--md-grey: 			#8b8b8b;

	--font-base: 		10px;
	--font1: 			'nexa', sans-serif;

	--header-padding: 	clamp( 2rem, 2vw, 4rem );
	--logo-width: 		clamp( 12.4rem, 10.35vw, 20.7rem );
	--logo-height: 		clamp( 5.6rem, 4.65vw, 9.3rem );
	--cta-height: 		clamp( 5rem, 3.7vw, 7.4rem );
	--gutter: 			clamp( 16.5rem, 16.5vw, 33rem );

	--scroll-margin: 	calc( var(--logo-height) + ( var(--header-padding) * 2 ) );

	--accent: 			color-mix( in srgb, var(--red) 76%, transparent );
	--selection: 		rgba(8,24,101,.5);
	--selection-dark: 	rgba(255,255,255,.75);
	--menu-back: 		rgba(8,24,101,.8);
	--gallery-back: 	rgba(8,24,101,.8);
}


@media screen and (max-width: 767px) {

	:root {

		--header-padding: 	1.5rem;
		--logo-width: 		8.92rem;
		--logo-height: 		4.03rem;
	}
}

/* @end */


/* !@group global */

[data-aos] { visibility: hidden; }
[data-aos='imgzoom'],
[data-aos].animate__animated { visibility: visible; }
*,
*::before,
*::after { box-sizing: border-box; }

::-moz-selection {

	color: var(--white);
	background: var(--selection);
}

::selection {

	color: var(--white);
	background: var(--selection);
}

.dark ::-moz-selection {

	color: var(--red);
	background-color: var(--selection-dark);
}

.dark ::selection {

	color: var(--red);
	background: var(--selection-dark);
}

html {

	-webkit-tap-highlight-color: transparent;
	font-size: var(--font-base);
	scroll-behavior: smooth;
}

body {

	-webkit-font-smoothing: antialiased;
	background: var(--white);
	color: var(--green);
	font-family: var(--font1);
	font-size: 1.8rem;
	line-height: 1.9;
}

img {

	display: block;
	max-width: 100%;
	height: auto;
}

img.static {

	min-width: auto;
	max-width: none;
	display: inline-block;
}

a:hover,
a:active {

	text-decoration: none;
	outline: none;
}

button {

	-webkit-appearance: none;
	border: 0;
	padding: 0;
	background: transparent;
	cursor: pointer;
	outline: none;
	color: inherit;
	font-family: var(--font1);
	font-size: 1.8rem;
	line-height: 1;
}

/* @end */


/* !@group site header */

.scroll,
.no-slide { --header-padding: 2rem; }

#site-header {

	--color: var(--white);

	position: fixed;
	left: 0;
	right: 0;
	top: 0;
	z-index: 5;
	padding-inline: 3rem;
	background-color: rgba(255,255,255,0);
	box-shadow: 0 0 0 transparent;
	pointer-events: none;
	transition:
		color .35s ease,
		background-color .35s ease,
		box-shadow .35s ease;
}

#site-header :is( a, button, select ) {

	color: var(--color);
	pointer-events: all;
	transition: all .35s ease;
}

#site-header input {

	color: var(--black);
	pointer-events: all;
}

:is( .scroll, .no-slide ) #site-header {

	background-color: var(--blue);
	box-shadow: 0 .3rem .8rem rgba(0,0,0,.15);

}

.menu-open #site-header {

	--color: var(--white);
	background-color: rgba(255,255,255,0);
	box-shadow: 0 0 0 transparent;
}

#site-header > .inner {

	width: 100%;
	max-width: 181rem;
	padding-block: var(--header-padding);
	margin-inline: auto;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: space-between;
	align-items: center;
	transition: padding-block .35s ease;
}

#site-header > .inner > :is( .left, .right ) {

	display: flex;
	flex-direction: row;
	align-items: center;
}

#site-header > .inner > .left { column-gap: clamp( 6.8rem, 6.8vw, 13.6rem ); }

#header-logo {

	width: var(--logo-width);
	height: var(--logo-height);

	display: grid;
	grid-template-columns: 1fr;
	grid-template-rows: 1fr;
	grid-column-gap: 0rem;
	grid-row-gap: 0rem;
}

#header-logo > img {

	width: var(--logo-width);
	height: var(--logo-height);
}

#header-logo :is( .logo-1, .logo-2 ) { grid-area: 1 / 1 / -1 / -1; }

.header-items {

	display: flex;
	flex-direction: row;
	align-items: center;
	column-gap: clamp( 2.7rem, 2.7vw, 5.4rem );
}

.header-item {

	color: var(--color);
	font-size: 1.6rem;
	line-height: 1;
	font-weight: 200;
	text-decoration: none;
	display: inline-flex;
	align-items: center;
	column-gap: 1.2rem;
	transition: color .35s ease;
}

.header-item svg {

	fill: var(--color);
	display: block;
	transition: fill .35s ease;
}

.header-item b { font-weight: 900; }


@media screen and (max-width: 1200px) {

	.header-item {

		flex-direction: column;
		row-gap: .3rem;
	}

	.header-item > .label { display: none; }
}


@media screen and (max-width: 767px) {

	.scroll,
	.no-slide { --header-padding: .5rem; }

	#site-header { padding-inline: 1.5rem; }
	#site-header > .inner > .left { column-gap: 1rem; }
	.header-items { column-gap: 1.4rem; }
	.header-items li { display: flex; }
	.header-items li.main-cta-container { display: none; }

	.header-item {

		color: var(--color);
		font-size: 1.6rem;
		line-height: 1;
		font-weight: 200;
		text-decoration: none;
		display: inline-flex;
		align-items: center;
		column-gap: 1.2rem;
		margin: auto;
		transition: color .35s ease;
	}
}

/* @end */


/* !@group main menu */

#open-menu {

	color: var(--color);
	display: flex;
	flex-direction: row;
	align-items: center;
	column-gap: 1.6rem;
}

#open-menu .label {

	font-size: 1.6rem;
	line-height: 1;
	font-weight: 800;
}

#open-menu svg {

	fill: var(--color);
	transition: fill .35s ease;
}

.bar {

	transition:
		opacity .35s ease,
		transform .35s ease;
}

.close-1 { transform-origin: center center; }
.close-2 { transform-origin: center center; }
.open .openbar { opacity: 0; }
.open .close-1 { transform: rotate( 45deg ); }
.open .close-2 { transform: rotate( -45deg ); }


@media screen and (max-width: 1200px) {

	#open-menu { flex-direction: column; }
}


@media screen and (max-width: 767px) {

	#open-menu .label { font-size: 1.4rem; }
}

/* @end */


/* !@group main cta */

#main-cta {

	color: var(--color);
	font-size: 1.8rem;
	line-height: 1;
	font-weight: 300;
	text-transform: uppercase;
	height: var(--cta-height);
	border: .2rem solid var(--color);
	border-radius: calc( var(--cta-height) / 2 );
	padding-inline: calc( var(--cta-height) * .6 );
	background-color: rgba(255,255,255,0);
	text-decoration: none;
	display: inline-flex;
	align-items: center;
	transition: all 35s ease;
}

#main-cta b { font-weight: 900; }


@media screen and (max-width: 1023px) {

	#main-cta { display: none; }
}

/* @end */


/* !@group header slider */

#slider-section {

	background-color: var(--blue);
	position: relative;
	padding-bottom: clamp( 6.2rem, 6.2vw, 12.4rem );
}

.header-slideshow { position: relative; }

.header-slideshow .glide__slides {

	transform: translate3d(0,0,0) !important;
	width: 100vw !important;
	height: 100vh;
	height: 100dvh;
	max-height: 118.8rem;
}

.header-slideshow .slide {

	opacity: 0;
	z-index: 0;
	position: absolute;
	top: 0;
	left: 0;
	transition: opacity .75s ease;
	height: 100vh;
	height: 100dvh;
	max-height: 118.8rem;
	cursor: grab;
}

.header-slideshow .slide.is-active {

	opacity: 1;
	z-index: 1;
}

#slider-section .slide img {

	width: 100%;
	height: 100vh;
	height: 100dvh;
	max-height: 118.8rem;
	object-fit: cover;
}

/* @end */
