/******************************************/
/** General                              **/
/******************************************/

:root {
   --primary: #0b352a;
	--secondary: #a55414;
   --black: #000000;
   --dark: #111010;
	--gray: #535353;
   --white: #ffffff;
   --light: #dadada;
}

*, *::before, *::after {box-sizing: border-box;}

html {overflow-x: hidden;}

html, body {
	margin: 0;
   padding: 0;
   min-height: 100vh;
   position: relative;
	overflow-x: hidden;
   color: var(--gray) !important;
   background-color: var(--white);
   font-family: 'Inter', sans-serif;
}

.preload * {
   -o-transition: none !important;
   -ms-transition: none !important;
   -moz-transition: none !important;
   -webkit-transition: none !important;
}



/******************************************/
/** Utilities and Helpers                **/
/******************************************/

.fs-lg {font-size: 2.8rem;}
@media (max-width: 1200px) {
	.fs-lg {font-size: 2rem;}
}
@media (max-width: 768px) {
	.fs-lg {font-size: 1.5rem;}
}

.fs-7 {font-size: .9rem;}
.fs-8 {font-size: .8rem;}

.fw-black {font-weight: 900;}
.fw-extrabold {font-weight: 800;}
.fw-thin {font-weight: 100;}

.text-primary {color: var(--primary) !important;}
.text-secondary {color: var(--secondary) !important;}

.bg-primary {background-color: var(--primary) !important;}
.bg-secondary {background-color: var(--secondary) !important;}

.border-secondary {border-color: var(--secondary) !important;}

.top-40 {top: 40% !important;}

.transition-03 {
	transition: .3s all ease-in-out;
	-o-transition: .3s all ease-in-out;
	-moz-transition: .3s all ease-in-out;
	-webkit-transition: .3s all ease-in-out;
}



/******************************************/
/** Components                           **/
/******************************************/

/* Icons */

.icon {
	width: 50px;
	height: 50px;
	min-width: 50px;
	min-height: 50px;
}



/******************************************/
/** Navbar                               **/
/******************************************/

#navbarDesktop {z-index: 999;}

@media (max-width: 767px) {
	.navbar-brand svg {
		width: 150px;
	}
}

#navbarDesktop.shrink {
	padding: .5rem 1rem !important;
	background-color: var(--white) !important;
	box-shadow: 0 .5rem 1rem rgba(var(--bs-body-color-rgb),.15) !important;
}

#navbarDesktop.shrink .st0 {fill: var(--primary);}
#navbarDesktop.shrink .st1 {fill: var(--secondary);}

#navbarDesktop.shrink li a {color: var(--primary) !important;}
#navbarDesktop.shrink li a:hover {color: var(--secondary) !important;}

/* Burger */

#burger {width: 30px;}

#burger:before,
#burger:after,
#burger div {
	content: "";
	height: 3px;
	margin: 7px 0;
	display: block;
	transition: 0.5s;
	border-radius: 3px;
	background-color: var(--white);
}

#navbarDesktop.shrink #burger:before,
#navbarDesktop.shrink #burger:after,
#navbarDesktop.shrink #burger div {
	background-color: var(--primary);
}

#burger.open:before {transform: translateY(10px) rotate(135deg);}

#burger.open:after {transform: translateY(-10px) rotate(-135deg);}

#burger.open div {transform: scale(0);}

/* Mobile */

#navbarMobile {
	z-index: 998;
	transform: translateX(150%);
}

#navbarMobile.open {transform: translateX(0);}



/******************************************/
/** Footer                               **/
/******************************************/

footer img {mix-blend-mode: darken;}



/******************************************/
/** Hero                                 **/
/******************************************/

#hero {height: 95vh;}

.splide__arrow {background-color: transparent !important;}
.splide__arrow:disabled {cursor: default;}

.splide__arrow svg {
	width: 30px !important;
	height: 30px !important;
	fill: var(--white) !important;
}

.splide__arrow--prev {left: 5em !important;}
.splide__arrow--next {right: 5em !important;}

@media (max-width: 1600px) {
	.splide__arrow--prev {left: 1em !important;}
	.splide__arrow--next {right: 1em !important;}
}

@media (max-width: 575px) {
	.splide__arrow svg {
		width: 20px !important;
		height: 20px !important;
	}
}

@media (max-width: 420px) {
	.splide__arrow--prev {left: .5em !important;}
	.splide__arrow--next {right: .5em !important;}
}



/******************************************/
/** Empresa                              **/
/******************************************/

.divider {height: 450px;}

#empresa {margin-top: -500px;}

@media (max-width: 1600px) {
	#empresa .path {height: 500px;}
}

@media (max-width: 1200px) {
	.outline-logo {
		width: 1000px;
		top: 25% !important;
	}
}

@media (max-width: 991px) {
	.divider {display: none;}
	#empresa {margin-top: 0;}
	.outline-logo {display: none;}
}

@media (max-width: 991px) {
	.outline-logo {
		width: 750px;
		display: block;
		top: 20% !important;
		left: 50% !important;
	}
}

@media (max-width: 575px) {
	.outline-logo {display: none;}
}

/* Gallery */

.gallery {
	height: 500px;
	display: grid;
	grid-row-gap: 20px;
	grid-column-gap: 20px;
	grid-template-rows: repeat(2, 1fr);
	grid-template-columns: repeat(4, 1fr);
}

.image-one {grid-area: 1 / 1 / 2 / 2;}
.image-two {grid-area: 2 / 1 / 3 / 2;}
.image-three {grid-area: 1 / 2 / 3 / 4;}
.image-four {grid-area: 1 / 4 / 2 / 5;}
.image-five {grid-area: 2 / 4 / 3 / 5;}

.gallery-overlay {mix-blend-mode: multiply;}

.gallery > div:hover a div,
.gallery > div:hover a svg {opacity: 1 !important;}

@media (max-width: 991px) {
	.gallery {
		height: auto;
		display: grid;
		grid-row-gap: 20px;
		grid-column-gap: 20px;
		grid-template-rows: repeat(4, 1fr);
		grid-template-columns: repeat(2, 1fr);
	}
	.image-one {grid-area: 1 / 1 / 2 / 2;}
	.image-two {grid-area: 1 / 2 / 2 / 3;}
	.image-three {grid-area: 2 / 1 / 4 / 3;}
	.image-four {grid-area: 4 / 1 / 5 / 2;}
	.image-five {grid-area: 4 / 2 / 5 / 3;}
}



/******************************************/
/** Contactos                            **/
/******************************************/

@media (max-width: 1200px) {
	.footer-polygon {
		width: 300px;
	}
}

/* @media (max-width: 991px) { */
	#map {height: 500px !important;}
/* } */

/* Form */

::placeholder {
	opacity: 1;
	font-weight: 300 !important;
	color: var(--white) !important;
}
:-ms-input-placeholder {
	font-weight: 300 !important;
	color: var(--white) !important;
}
::-ms-input-placeholder {
	font-weight: 300 !important;
	color: var(--white) !important;
}

.form-select:active,
.form-select:focus,
.form-control:active,
.form-control:focus {
   box-shadow: none;
   background-color: transparent;
	border-color: var(--secondary);
}

.form-check-input {
   min-width: 1em !important;
   min-height: 1em !important;
}

.form-check-input:checked {
   border-color: var(--secondary) !important;
   background-color: var(--secondary) !important;
}

.form-check-input:focus {
   box-shadow: none;
   border-color: var(--secondary) !important;
}