@import url('https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&family=Outfit:ital,wght@0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;0,1000;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900;1,1000&family=Playfair+Display:ital,wght@0,400;0,500;0,600;0,700;0,800;0,900;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

@import url('https://cdnjs.cloudflare.com/ajax/libs/bootstrap-icons/1.10.3/font/bootstrap-icons.min.css');

body,html{
	font-family: var(--mainfont);
	font-size:16px;
	overflow-x:hidden;
}

:root{

	--c1-h: 200;
	--c1-s: 95%;
	--c1-l: 14%;

	--c1: hsl(var(--c1-h),
	 var(--c1-s), 
	var(--c1-l));

	/* light color version*/
	--c1-lighten: hsl(
	    var(--c1-h),
	    var(--c1-s),
	    calc(var(--c1-l) * 1.2)
	);

	/* dark color version*/
	--c1-darken: hsl(
	    var(--c1-h),
	    var(--c1-s),
	    calc(var(--c1-l) * .8)
	);

	--c1-desate: hsl(
	    var(--c1-h),
	    calc(var(--c1-s) * .6),
	    calc(var(--c1-l) * 1.4)
	);

	--c2-h: 223;
	--c2-s: 100%;
	--c2-l: 50%;

	--c2: hsl(var(--c2-h),
	 var(--c2-s), 
	var(--c2-l));

	/* light color version*/
	--c2-lighten: hsl(
	    var(--c2-h),
	    var(--c2-s),
	    calc(var(--c2-l) * 1.2)
	);

	/* dark color version*/
	--c2-darken: hsl(
	    var(--c2-h),
	    var(--c2-s),
	    calc(var(--c2-l) * .8)
	);

	--c2-desate: hsl(
	    var(--c2-h),
	    calc(var(--c2-s) * .6),
	    calc(var(--c2-l) * 1.4)
	);

	--c3-h: 20;
	--c3-s: 69%;
	--c3-l: 67%;

	--c3: hsl(var(--c3-h),
	 var(--c3-s), 
	var(--c3-l));

	/* light color version*/
	--c3-lighten: hsl(
	    var(--c3-h),
	    var(--c3-s),
	    calc(var(--c3-l) * 1.2)
	);

	/* dark color version*/
	--c3-darken: hsl(
	    var(--c3-h),
	    var(--c3-s),
	    calc(var(--c3-l) * .8)
	);

	--c3-desate: hsl(
	    var(--c3-h),
	    calc(var(--c3-s) * .6),
	    calc(var(--c3-l) * 1.4)
	);

	--c4-h: 54;
	--c4-s: 100%;
	--c4-l: 50%;

	--c4: hsl(var(--c4-h),
	 var(--c4-s), 
	var(--c4-l));

	/* light color version*/
	--c4-lighten: hsl(
	    var(--c4-h),
	    var(--c4-s),
	    calc(var(--c4-l) * 1.2)
	);

	/* dark color version*/
	--c4-darken: hsl(
	    var(--c4-h),
	    var(--c4-s),
	    calc(var(--c4-l) * .8)
	);

	--c4-desate: hsl(
	    var(--c4-h),
	    calc(var(--c4-s) * .6),
	    calc(var(--c4-l) * 1.4)
	);

	--mainfont: 'Inter', sans-serif;
	--subfont: 'Outfit', sans-serif;
	--serif: 'Playfair Display', serif;

}

*{
	box-sizing:border-box;
}

.cw{
	width:100%;
	max-width:1000px;
	margin:0px auto;
}

.btn-s{
	display:block;
	width:100%;
	text-align:center;
	text-decoration: none;
	max-width:max-content;
	padding:.25em 1em;
	transition:.3s background;
}

.btn-s.btn-fw{
	max-width:100%;
}

.btn-s.c1{
	background:var(--c1);
	color:#fff;
}

.btn-s.c1-lighten:hover{
	background:var(--c1-lighten);
}

.btn-s.c1-darken:hover{
	background:var(--c1-darken);
}

.btn-s.c1-desate:hover{
	background:var(--c1-desate);
}

.btn-s.c2{
	background:var(--c2);
	color:#fff;
}

.btn-s.c2-lighten:hover{
	background:var(--c2-lighten);
}

.btn-s.c2-darken:hover{
	background:var(--c2-darken);
}

.btn-s.c2-desate:hover{
	background:var(--c2-desate);
}

.btn-s.c4{
	background:var(--c4);
	color:#000;
}

.btn-s.c4-lighten:hover{
	background:var(--c4-lighten);
}

.btn-s.c4-darken:hover{
	background:var(--c4-darken);
}

.btn-s.c4-desate:hover{
	background:var(--c4-desate);
}

.btn-s.center{
	margin-inline:auto;
}

.btn-wht{
	background:#fff;
}

.btn-wt{
	color: #fff;
}

.section{
	padding:4em;
	padding-inline:2em;
}

.grid-row{
	--col:2;
	display:grid;
	grid-template-columns: repeat(var(--col),minmax(0,1fr));
}

/*typography*/

.s-t{
	font-size:2.5em;
	line-height:1.25em;
	font-weight:800;
	font-family:var(--subfont);
}

.s-h{
	font-size:1.75em;
	line-height:1.25em;
	font-weight:700;
	font-family:var(--subfont);
}

.s-sh{
	font-size:1.15em;
	line-height:1.25em;
	font-weight:400;
	font-family:var(--subfont);
}

.p{
	font-weight:300;
	line-height:1.5em;
}

/*topbar*/

body{
/*	margin-top:10em;*/
}

.tb-sticky{
	position: fixed;
	top:0;
	left:0;
	height:10em;
	width:100%;
	z-index:100;
	background:var(--c1);
	box-shadow:0 0 .5em 1em rgba(0,0,0,.50);
	font-family: var(--subfont);
}

.tb-sticky.style2{
	position: relative;
	inset:initial;
	height:auto;
	box-shadow:none;
}

.tb-sticky.style2 .tb-lower{
	display:none;
}

.topbar{
	height:calc(100% - 2em);
	padding:.5em 0 0;
	padding-inline:5%;
	color:#fff;
}

.tb-lower{
	height:2em;
	padding-inline:2em;
	background:var(--c1);
	color:#fff;
	font-size:1.5em;
	font-weight:800;
	text-transform: uppercase;
	display:flex;
	align-items: center;
}

.tb-grid{
	display:grid;
	grid-template-columns: repeat(2,minmax(0,1fr));
	gap:1em;
	align-items: center;
}

.tb-grid > div:last-child{
	text-align:right;
}

.tb-logo{
	display:block;
	aspect-ratio:21/9;
	width:50%;
	object-fit: contain;
}

.tb-cta{
	font-weight:300;
	font-size:.9em;
	margin-bottom:.2em;
}

.tb-contact{
	font-weight:600;
	font-size:2em;
	margin-bottom:.2em;
}

.tb-contact .bi,
.cta-btn .bi{
	display: inline-block;
	transform: rotate(10deg);
}

.tb-btn{
	padding:.3em 1.5em;
	font-weight:700;
	margin-right:0;
	margin-left:auto;
	border-radius:.3em;
}

@media(max-width:660px){
	/*.tb-sticky{
		height:8em;
	}*/

	.tb-lower{
		padding-inline:1em;
	}

	.tb-logo{
		width:70%;
	}

	/*body{
		margin-top:8em;
	}*/
	.tb-btn{
		display:none;
	}

	.tb-contact {
	    font-size: 4.5vw;
	}

}

/*section1*/

.s1{
	background:var(--c1);
	color:#fff;
}

.s1-row{
	display:grid;
	grid-template-columns: repeat(2,minmax(0,1fr));
	gap:3em;
	margin-bottom:2em;
}

.s1-row > div{
	position: relative;
}

.s1-row > .col1{

}

.s1-row > .col2 img{
	position: absolute;
	inset:0;
	width:100%;
	height:100%;
	object-fit: cover;
	pointer-events: none;
	border-radius: .3em;
}

.s1 .s-t{
	line-height:1.4em;
	margin-bottom:.25em;
}

.s1 .p{
	margin-bottom:1em;
}

.s1 .s-sh{
	text-transform: uppercase;
	color:var(--c3);
}

.q-list > div:not(:first-child){
	display:none;
}

.q-btn{
	max-width:320px;
	font-weight:800;
	padding-block:.75em;
	font-size:1.5em;
	text-transform: uppercase;
	margin-bottom:.75em;
	border-radius: .15em;
}

.q-text{
	font-size:1.2em;
	font-weight:400;
}

/*section2*/

.s2{
	text-align:center;
}

.s2 .s-h{
	margin-bottom:.5em;
}

.s2 .p,
.s2 .s-sh{
	margin-bottom:1em;
}

.s2 .s-sh{
	color:var(--c2);
	font-weight:600;
}

.cta-btn{
	padding:.5em 2.5em;
	font-size:1.5em;
	font-weight:800;
	font-family:var(--subfont);
	border-radius:.15em;
}

.smol{
	margin-top: .5em;
	font-size: .8em;
	font-weight: 400;
	color:#a0a0a0;
}

/*footer*/

.footer{
	background:#1e1e1e;
	color:#fff;
}

.footer .s-h{
	font-size:1.2em;
}

.footer-flex{
	display:flex;
	gap:2em;
}

.footer-logo{
	display:block;
	aspect-ratio:21/9;
	object-fit: contain;
	width:10em;
}

.footer-flex > div:first-child{
	margin:0 auto 0 0;
}

.footer-flex > div:last-child{
	margin:0 0 0 auto;
	text-align: right;
}

.footer-links{
	display:flex;
	flex-direction: column;
	gap:1em;
}

.footer-links a{
	color:#fff;
}

/*whitepanel*/

.white-panel{
	background:#fff;
	padding:1.5em;
	text-align:center;
	color:#000;
	border-radius: .3em;
}

.white-panel .s-h{
	margin-bottom: 1em;
}

/*loader*/

.lds-roller {
  display: inline-block;
  position: relative;
  width: 80px;
  height: 80px;
}
.lds-roller div {
  animation: lds-roller 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
  transform-origin: 40px 40px;
}
.lds-roller div:after {
  content: " ";
  display: block;
  position: absolute;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #a0a0a0;
  margin: -4px 0 0 -4px;
}
.lds-roller div:nth-child(1) {
  animation-delay: -0.036s;
}
.lds-roller div:nth-child(1):after {
  top: 63px;
  left: 63px;
}
.lds-roller div:nth-child(2) {
  animation-delay: -0.072s;
}
.lds-roller div:nth-child(2):after {
  top: 68px;
  left: 56px;
}
.lds-roller div:nth-child(3) {
  animation-delay: -0.108s;
}
.lds-roller div:nth-child(3):after {
  top: 71px;
  left: 48px;
}
.lds-roller div:nth-child(4) {
  animation-delay: -0.144s;
}
.lds-roller div:nth-child(4):after {
  top: 72px;
  left: 40px;
}
.lds-roller div:nth-child(5) {
  animation-delay: -0.18s;
}
.lds-roller div:nth-child(5):after {
  top: 71px;
  left: 32px;
}
.lds-roller div:nth-child(6) {
  animation-delay: -0.216s;
}
.lds-roller div:nth-child(6):after {
  top: 68px;
  left: 24px;
}
.lds-roller div:nth-child(7) {
  animation-delay: -0.252s;
}
.lds-roller div:nth-child(7):after {
  top: 63px;
  left: 17px;
}
.lds-roller div:nth-child(8) {
  animation-delay: -0.288s;
}
.lds-roller div:nth-child(8):after {
  top: 56px;
  left: 12px;
}

.q-reveal{
	display:none;
	text-align:center;
	font-size:1.2em;
}

.q-reveal .s-h{
	font-size:1.5em;
	font-weight:600;
}

@keyframes lds-roller {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

@media(max-width: 1200px){
	body{
		font-size: 14px;
	}
}

@media(max-width:900px){
	body{
		font-size:12px;
	}
}

@media(max-width:768px){
	body{
		font-size:11px;
	}
}

@media(max-width:660px){
	.s1-row{
		grid-template-columns: 1fr;
	}

	.s1-row .col2{
		display:none;
	}

	.s1{
		text-align:center;
	}

	.q-btn{
		margin-inline:auto;
	}
}