*,::after,::before{box-sizing:border-box}blockquote,body,dd,dl,figure,h1,h2,h3,h4,p{margin:0}ol[role=list],ul[role=list]{list-style:none}html:focus-within{scroll-behavior:smooth}body{min-height:100vh;text-rendering:optimizeSpeed;line-height:1.5}a:not([class]){text-decoration-skip-ink:auto}img,picture{max-width:100%;display:block}button,input,select,textarea{font:inherit}@media (prefers-reduced-motion:reduce){html:focus-within{scroll-behavior:auto}*,::after,::before{animation-duration:0s!important;animation-iteration-count:1!important;transition-duration:0s!important;scroll-behavior:auto!important}}

:root {

	touch-action: pan-x pan-y;
	height: 100%;
	
	--br1: 4px;
	--br2: 8px;
	--br3: 16px;
	
	--pb1: 16px;
	--pb2: 24px;
	--pb3: 32px;
	
	--t6: 48px;
	--t5: 36px;
	--t4: 24px;
	--t3: 18px;
	--t2: 16px;
	--t1: 12px;
	
	--c1: #FFFFFF;
	--c2: #f9f9f9;
	--c3: #e5e5e5;
	--c4: #585858;
	--c5: #000000;
	
	--ka: #89A753;
	--kad: #4E6C1A;
	--kb: #DFB145;
	--kbd: #A17900;
	
}

html{scroll-behavior: smooth;}

body{font-family: 'Roboto', sans-serif; font-size: var(--t2); color: var(--c4);}

h1{font-size: var(--t6); line-height: normal; padding-bottom: var(--pb3); color: var(--ka); font-weight: 700;}
h1:last-child{padding: 0 !important;}
h2{font-size: var(--t5); line-height: normal; padding-bottom: var(--pb2); color: var(--ka);}
h2:last-child{padding: 0 !important;}
h3{font-size: var(--t4); line-height: normal; padding-bottom: var(--pb2); color: var(--kb);}
h3:last-child{padding: 0 !important;}
h4{font-size: var(--t3); line-height: var(--t3); padding-bottom: var(--pb1); color: var(--kb);}

a { color: var(--c5); }

p {padding-bottom: var(--pb1); margin: 0; padding: 0 0 var(--pb1) 0;}
p:last-child{padding:0 !important;}

.nm{margin: 0px !important}
.np{padding: 0px !important}
.nbr{border-radius:0 !important;}

.ac{text-align: center !important}
.al{text-align: left !important}
.ar{text-align: right !important}
.acc{display:flex; justify-content:center; align-items:center;}
.alc{display:flex;  align-items:center;}

.spd{margin-bottom: 16px !important}
.spdh{margin-bottom: 8px !important}
.dspd{margin-bottom: 24px !important}
.spu{margin-top: 16px !important}
.spuh{margin-top: 8px !important}
.dspu{margin-top: 24px !important}

.mostrar { display: block !important; }
.ocultar { display: none !important; }

.bx {padding: 40px 80px !important;}
.bx-1 {display: grid; grid-gap: 40px; grid-template-columns: 1fr;}
.bx-2 {display: grid; grid-gap: 40px; grid-template-columns: 1fr 1fr;}
.bx-2.invert div:first-child{grid-column: 1 / 2; grid-row: 1 / 2;}
.bx-2.invert div:last-child{grid-column: 2 / 3; grid-row: 1 / 2;}
.bx-3 {display: grid; grid-gap: 40px; grid-template-columns: 1fr 1fr 1fr;}
.bx-4 {display: grid; grid-gap: 40px; grid-template-columns: 1fr 1fr 1fr 1fr;}

header { position: relative; z-index: 10; background-color: var(--c1); height: 96px; }
header .logo { position: absolute; left: 80px; top: 50%; transform: translate(0,-50%); color: var(--c5); font-size: var(--t4); font-weight: 700; text-decoration: none; display: block;}
header .logo img { height: 64px; }

header .burger { position: absolute; right: 72px; top: 16px; transform: translate(0,0%); display: none; width: 40px;height: 32px;-webkit-transform: rotate(0deg);-moz-transform: rotate(0deg);-o-transform: rotate(0deg);transform: rotate(0deg);-webkit-transition: .5s ease-in-out;-moz-transition: .5s ease-in-out;-o-transition: .5s ease-in-out;transition: .5s ease-in-out;cursor: pointer;}
header .burger span {display: block;position: absolute;height: 3px;width: calc(100% - 16px);background: var(--c5);border-radius: 9px;opacity: 1;left: 8px;-webkit-transform: rotate(0deg);-moz-transform: rotate(0deg);-o-transform: rotate(0deg);transform: rotate(0deg);-webkit-transition: .25s ease-in-out;-moz-transition: .25s ease-in-out;-o-transition: .25s ease-in-out;transition: .25s ease-in-out;pointer-events: none;}
header .burger span:nth-child(1) {top: 6px;}
header .burger span:nth-child(2), header .burger span:nth-child(3) {top: 13px;}
header .burger span:nth-child(4) {top: 20px;}
header .burger.burger-open span:nth-child(1) {top: 13px;width: 0%;left: 50%;}
header .burger.burger-open span:nth-child(2) {-webkit-transform: rotate(45deg);-moz-transform: rotate(45deg);-o-transform: rotate(45deg);transform: rotate(45deg);}
header .burger.burger-open span:nth-child(3) {-webkit-transform: rotate(-45deg);-moz-transform: rotate(-45deg);-o-transform: rotate(-45deg);transform: rotate(-45deg);}
header .burger.burger-open span:nth-child(4) {top: 13px;width: 0%;left: 50%;}

header .nav { position: absolute; right: 72px; top: 50%; transform: translate(0,-50%); display: block; }
header .nav ul.nav-a { margin: 0; padding: 0; display: inline-flex; }
header .nav ul.nav-a li { position: relative; list-style: none; margin: 0; padding: 0; }
header .nav ul.nav-a li a { margin: 0; padding: 8px 16px; display: block; text-decoration: none; color: var(--kad); font-weight: 500; }

header .nav ul.nav-a li ul.nav-b { position: absolute; top: calc(100% + 8px); left: 0; margin: 0; padding: 8px 0; min-width: 160px; background-color: var(--kb); border-radius: var(--br2); display: none;}
header .nav ul.nav-a li ul.nav-b li { border-bottom: 0px solid var(--c3); }
header .nav ul.nav-a li ul.nav-b li a { color: var(--c1); padding: 4px 16px; }
header .nav ul.nav-a li ul.nav-b li:last-child { border: 0; }
header .nav ul.nav-a li ul.nav-b.in{left: auto !important; right: 0 !important;}

footer { background-color: var(--c2); padding: 24px 80px;}

.bloques{display: grid; grid-gap: 0; grid-template-columns: 1fr; grid-template-rows: 1fr; padding: 0;}
.bloques .bloque-contenedor {padding: 0 80px 40px}
.bloques .bloque-contenedor .bloque-columnas {}

.slide { position: relative;}
.slide .slide-img {display: block; object-fit: cover; width: 100%;}
.slide .slide-img.slide-1-1 { aspect-ratio: 1/1; }
.slide .slide-img.slide-2-1 { aspect-ratio: 2/1; }
.slide .slide-img.slide-1-2 { aspect-ratio: 1/2; }
.slide .slide-contenido{ position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); max-width: 50%; pointer-events: none; }

.banner {position: relative;}
.banner .banner-img {display: block; object-fit: cover; width: 100%;}
.banner .banner-img.banner-1-1 { aspect-ratio: 1/1; }
.banner .banner-img.banner-2-1 { aspect-ratio: 2/1; }
.banner .banner-img.banner-1-2 { aspect-ratio: 1/2; }
.banner .banner-contenido{position: absolute; bottom: 24px; left: 24px; right: 24px; pointer-events: none;}
.banner .banner-contenido-out{position: relative; margin-top: 24px;}
.banner .banner-contenido h3 {color: var(--c1);}

.narrow{width: 72%; margin: 0 auto;}
.narrow-left{width: 72%; margin: 0 auto 0 0;}
.narrow-right{width: 72%; margin: 0 0 0 auto;}
.narrow-doble{width: 48%; margin: 0 auto;}
.narrow-doble-left{width: 48%; margin: 0 auto 0 0;}
.narrow-doble-right{width: 48%; margin: 0 0 0 auto;}

.ff-label { display: block; color: var(--c5); font-weight: 500; margin: 0; padding: 0 0 8px 0; }
.ff-input { display: block; width: 100%; color: var(--c4); margin: 0; padding: 0 0 0 8px; border: 1px solid var(--c3); height: 40px; line-height: 40px; border-radius: var(--br2); }
.ff-textarea { display: block; width: 100%; color: var(--c4); margin: 0; padding: 8px 0 0 8px; border: 1px solid var(--c3); border-radius: var(--br2); }
.ff-submit { background-color: var(--c5); color: var(--c1); font-weight: 500; height: 40px; line-height: 40px; padding: 0 16px; border-radius: var(--br2); display: inline-block; text-decoration: none; }

input:focus{border-color: var(--c4); outline: none;}
textarea:focus{border-color: var(--c4); outline: none;}
select:focus{border-color: var(--c4); outline: none;}

/* Extras */

.br-tl {border-radius: 160px 32px 32px 32px; overflow: hidden;}
.br-tr {border-radius: 32px 160px 32px 32px; overflow: hidden;}
.br-bl {border-radius: 32px 32px 32px 160px; overflow: hidden;}
.br-br {border-radius: 32px 32px 160px 32px; overflow: hidden;}

.bg-1 { background-color: var(--c2);}
.bg-2 { background-color: var(--c3);}

.btn { background-color: var(--c5); color: var(--c1); height: 32px; line-height: 32px; padding: 0 16px; display: inline-block; text-decoration: none; border-radius: var(--br2); }

.banner-tx-centro .banner .banner-contenido{position: absolute; top: 50%; bottom: auto; left: 50%; right: auto; transform: translate(-50%,-50%); text-align: center;}
.banner-tx-centro .banner .banner-contenido h1, .banner-tx-centro .banner .banner-contenido p { color: var(--c1); }

@media (max-width: 800px) {
	
	.bx {padding: 24px !important;}
	.bx-1 {display: grid; grid-gap: 24px; grid-template-columns: 1fr;}
	.bx-2 {display: grid; grid-gap: 24px; grid-template-columns: 1fr;}
	.bx-2.invert div:first-child{grid-column: 1 / 2; grid-row: 2 / 3;}
	.bx-2.invert div:last-child{grid-column: 1 / 2; grid-row: 1 / 2;}
	.bx-3 {display: grid; grid-gap: 24px; grid-template-columns: 1fr;}
	.bx-4 {display: grid; grid-gap: 24px; grid-template-columns: 1fr 1fr;}
	
	header { position: sticky; top: 0; }
	
	header .logo { left: 24px;}
	header .burger { right: 16px; display: block; }
	header .nav { display: none; }
	
	header .nav { position: absolute; left: 0; right: 0; top: 100%; transform: translate(0,0); display: none; background-color: var(--c1); padding: 16px 0px;}
	header .nav ul.nav-a { margin: 0; padding: 0; display: block; }
	header .nav ul.nav-a li { position: relative; list-style: none; margin: 0; padding: 0;}
	header .nav ul.nav-a li a { margin: 0; padding: 8px 24px; display: block; text-decoration: none; }
	
	header .nav ul.nav-a li ul.nav-b { position: relative; top: 0; left: 0; right: 0; margin: 0 0 0 24px; padding: 0; width: auto; background-color: transparent; display: none;}
	header .nav ul.nav-a li ul.nav-b li { border-bottom: 0; }
	header .nav ul.nav-a li ul.nav-b li:last-child { border: 0; }
	
	footer { padding: 16px;}
	
	.bloques{display: grid; grid-gap: 0px; grid-template-columns: 1fr; grid-template-rows: 1fr; padding: 0;}
	.bloques .bloque-contenedor {padding: 0 24px 24px 24px}
	
	
	
	.slide .slide-img.slide-2-1 { aspect-ratio: 1/2; }
	.slide .slide-contenido{ position: absolute; top: auto; bottom: 24px; left: 24px; right: 24px; transform: translate(0,0); max-width: none; pointer-events: none; }
	
	.narrow{width: 88%; margin: 0 auto;}
	.narrow-left{width: 88%; margin: 0 auto 0 0;}
	.narrow-right{width: 88%; margin: 0 0 0 auto;}
	.narrow-doble{width: 88%; margin: 0 auto;}
	.narrow-doble-left{width: 88%; margin: 0 auto 0 0;}
	.narrow-doble-right{width: 88%; margin: 0 0 0 auto;}
	
	.splide__arrow { display: none !important; }
	
}