@font-face{
	font-family: source-bold;
	src: url('../../fonts/Lexend-Bold.ttf') format('truetype');
}

@font-face{
	font-family: source-light;
	src: url('../../fonts/Lexend-Light.ttf') format('truetype');
}

@font-face{
	font-family: source-regular;
	src: url('../../fonts/Lexend-Regular.ttf') format('truetype');
}

* { 
	margin: 0;
 	padding: 0;
 	font-family: source-bold, sans-serif;
}

body {
    scroll-behavior: smooth;
	transition: .6s all ease;
    width: 100vw;
}

:root {
	--color-primary: #a88b07;
	--color-secundary: #292929;
    --color-tercety: #0b6b4f;
	--color-back: #f7f3e6;
	--color-white: #ffffff;
    --color-light: #0b6b4f;
	--color-black: #1c1c1c;
    --color-gray: #777777;
	--color-wsp: #3BAF4F;
    --color-red: #c51216;
	--font-family-bold: source-bold;
	--font-family-light: source-light;
    --font-family-regular: source-regular;
}

::-webkit-scrollbar {
	width: 0;
	height: 0;
}

::-webkit-scrollbar-thumb {
	background: var(--color-gray);
	border-radius: 2.5px;
	margin-inline: 2px;
}

body {
    background: var(--color-back);
}

/* Header */
.header {
    display: flex;
    flex-direction: column;
    width: 100vw;
    height: auto;
    background: transparent;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 99999;
}

.header__image {
    display: block;
    width: 14vw;
    margin-inline: auto;
    position: relative;
    margin-block: 1.5vw .5vw;
    transition: all 0.5s ease;
}

.header__image.fixed {
    position: fixed;
    top: 0; /* o top: 20px si preferís arriba */
    left: 0;
    right: 0;
    transform: translateY(-9vw);
    margin-inline: auto;
    opacity: 0;
    z-index: 1000;
}

.header__image.fixed.active {
    transform: translateY(0);
    opacity: 1;
}

.header__image-icon {
    width: 100%;
    height: auto;
    padding-inline: .5vw;
    /* background: var(--color-white); */
    /* filter: drop-shadow(2px 2px 3px rgba(255, 255, 255, 1)); */
    border-radius: 0 0 .7vw .7vw;
    margin-block: 0 .5vw;
}

.header__content {
    display: flex;
    width: 100%;
    justify-content: space-between;
}

.header__item {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28vw;
}

.header__item:nth-of-type(1) .header__item-data:nth-of-type(1) .header__item-label {
    font-size: .8vw;
}

.header__item-data {
    display: flex;
    text-decoration: none;
    align-items: center;
    margin-inline: 1.4vw;
    margin-block: 0;
    transition: .3s all ease;
    cursor: pointer;
}

.header__item-data:hover {
    transform: scale(1.06);
}

.header__item-icon {
    height: 1.7vw;
    width: auto;
    fill: var(--color-white);
}

.header__item-label {
    color: var(--color-white);
    font-family: var(--font-family-light);
    font-size: .9vw;
    margin-inline: 1vw 0;
}

.header__item-btn {
    color: var(--color-white);
    font-family: var(--font-family-light);
    font-size: 1.3vw;
    padding-inline: .4vw;
    margin-inline: .8vw;
    padding-block: 4px;
    text-decoration: none;
    position: relative;
    cursor: pointer;
}

.header__item-btn:after {
    content: '';
    width: 0;
    height: 1.5px;
    background: var(--color-white);
    position: absolute;
    bottom: 0;
    left: 0;
    border-radius: 1px;
    transition: .4s all cubic-bezier(0.075, 0.82, 0.165, 1);
}

.header__item-btn:hover:after {
    width: 100%;
}

.header__category {
    display: none;
    align-items: center;
    padding: .1vw 1vw;
    border-radius: 1vw;
    border: 2px solid var(--color-white);
    cursor: pointer;
    margin-inline: 1vw;
    position: absolute;
    right: 5vw;
    top: 9vw;
}

.header__category-user {
    margin-inline: 1vw 0;
    text-decoration: none;
}

.header__category-ico {
    width: 1vw;
    height: auto;
    margin-inline: .5vw 0;
}

.header__category-lines {
    width: 35px;
    height: 35px;
    cursor: pointer;
    border: none;
    background: transparent;
    display: block;
    margin-inline: 0;
    transform: scale(.8);
    z-index: 999999;
}

.header__category-l1, .header__category-l2, .header__category-l3 {
    background: var(--color-white);
    width: 100%;
    height: 5px;
    border-radius: 1.5px;
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    transition: transform 0.7s, width 0.5s ;
}

.header__category-activo .header__category-l1, 
.header__category-activo .header__category-l2,
.header__category-activo .header__category-l3 {
    background: var(--color-black);
}

.header__category-l1 { transform: translate(-50%, -14px); }
.header__category-l3 { transform: translate(-50%, 8px); }

.header__category-activo .header__category-l1 { transform: translate(-50%, -50%) rotate(45deg); }
.header__category-activo .header__category-l3 { transform: translate(-50%, -50%) rotate(-45deg); }
.header__category-activo .header__category-l2 { width: 0; }

.header__category-text {
    color: var(--color-white);
    font-family: var(--font-secundary-bold);
    font-size: 1.2vw;
}


/* Main */
.main {
    display: flex;
    width: 100vw;
    height: auto;
}

.main__content {
    width: 100%;
    height: auto;
    overflow: hidden;
    position: relative;
}

.main__content-btns {
    display: flex;
    align-items: center;
    padding: .3vw .6vw;
    background: var(--color-secundary);
    border: 1px solid var(--color-black);
    border-radius: 1vw;
    width: max-content;
    position: absolute;
    bottom: 2vw;
    left: 0;
    right: 0;
    margin-inline: auto;
}

.main__content-btn {
    display: flex;
    width: .6vw;
    height: .6vw;
    background: var(--color-white);
    border: 1px solid var(--color-black);
    border-radius: 50%;
    margin-inline: .2vw;
    cursor: pointer;
    transition: .3s all ease;
    opacity: .4;
}

.main__content-btn-active {
    opacity: 1;
    transform: scale(1.1);
}

.main__slider {
    display: flex;
    width: 500vw;
    transition: 700ms all cubic-bezier(0.22, 0.61, 0.36, 1);
    position: relative;
}

.main__item {
    display: flex;
    width: 100vw;
    height: auto;
    aspect-ratio: 1200/620;
    position: relative;
    z-index: 500;
}

.main__item-img:after {
    content: '';
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, .3);
    position: absolute;
    top: 0;
    left: 0;
}

.main__item-img {
    width: 100%;
    height: auto;
    /* aspect-ratio: 1103/620; */
    position: absolute;
    top: 0;
    left: 0;
    transition: .5s all ease;
    position: relative;
}

.main__item-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.main__item-texts {
    display: flex;
    flex-direction: column;
    width: 45%;
    height: max-content;
    position: absolute;
    top: 0;
    left: 10%;
    bottom: 0;
    margin-block: auto;
}

.main__item-title {
    color: var(--color-white);
    font-size: 2.8vw;
    margin-block: 2vw;
    transition: .3s all cubic-bezier(0.19, 1, 0.22, 1);
    transform: translateX(20vw) translateY(4vw);
    opacity: 0;
}

.main__item-text {
    font-family: var(--font-family-light);
    color: var(--color-white);
    font-size: 1.8vw;
    transition: .4s all cubic-bezier(0.19, 1, 0.22, 1);
    transform: translateX(20vw) translateY(4vw);
    opacity: 0;
}

.titleActiveX {
    transform: translateX(0) translateY(4vw);
    opacity: 1;
}

.titleActiveY {
    transform: translateX(0) translateY(0);
    opacity: 1;
}


/* History */
.history {
    width: 100vw;
    height: auto;
    display: flex;
    background: var(--color-back);
}

.history__container {
    display: flex;
    justify-content: center;
    width: 100%;
    padding-block: 4vw 7vw;
}

.history__content {
    display: flex;
    align-items: center;
}

.history__images {
    display: flex;
    width: 18vw;
    aspect-ratio: 540/1000;
    height: auto;
    margin-inline: 1vw;
    border-radius: .7vw;
    overflow: hidden;
    transition: opacity 0.8s ease,
    transform 4s cubic-bezier(0.19, 1, 0.22, 1);
}

.history.active .history__images:nth-of-type(1) {
    transform: translateY(0);
}

.history.active .history__images:nth-of-type(2) {
    transform: translateY(2vw);
}

.history.out .history__images:nth-of-type(1) {
    transform: translateY(2vw);
}

.history.out .history__images:nth-of-type(2) {
    transform: translateY(-2vw);
}

.esencia.out .history__images {
    opacity: 0;
}

.history__img {
    width: 100%;
    height: auto;
}

.history__texts {
    display: flex;
    max-width: 40vw;
    flex-direction: column;
    margin-inline: 4vw 0;
}

.history__title {
    font-size: 2.8vw;
    line-height: 1;
    margin-block: 5vw 0;
}

.history__subtitle {
    color: var(--color-gray);
    font-size: 1.4vw;
    font-family: var(--font-family-light);
    margin-block: 1.4vw;
}

.history__text {
    color: var(--color-gray);
    font-size: 1.3vw;
    font-family: var(--font-family-light);
}

/* Valores */
.valores {
    width: 100vw;
    height: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    background: var(--color-back);
    padding-block: 0 4vw;
}

.valores__title {
    font-size: 2.8vw;
    margin-block: 1vw 2vw;
    text-align: center;
    max-width: 58vw;
}

.valores__texts {
    display: flex;
    width: 70vw;
    flex-wrap: wrap;
}

.valores__item {
    display: flex;
    align-items: center;
    margin-inline: .2vw;
    justify-content: center;
    margin-block: .6vw;
}

.valores__check {
    width: 2vw;
    height: auto;
    transition: opacity 0.8s ease,
    transform 4s cubic-bezier(0.19, 1, 0.22, 1);
}


.valores.active .valores__item:nth-of-type(1) .valores__check {
    transform: translateY(0);
    transition-delay: .2s;
}

.valores.active .valores__item:nth-of-type(2) .valores__check {
    transform: translateY(0);
    transition-delay: .6s;
}

.valores.active .valores__item:nth-of-type(3) .valores__check {
    transform: translateY(0);
    transition-delay: .8s;
}

.valores.active .valores__item:nth-of-type(4) .valores__check {
    transform: translateY(0);
    transition-delay: 1.2s;
}

.valores.active .valores__item:nth-of-type(5) .valores__check {
    transform: translateY(0);
    transition-delay: 1.7s;
}

.valores.active .valores__item:nth-of-type(6) .valores__check {
    transform: translateY(0);
    transition-delay: 2.3s;
}

.valores.out .valores__check {
    opacity: 0;
    transform: translateY(2vw);
    transition-delay: 0;
}

.valores__text {
    color: var(--color-gray);
    font-size: 1.3vw;
    font-family: var(--font-family-light);
    margin-inline: 1vw 0;
    width: 30vw;
}

/* Caballos */
.caballo {
    width: 100vw;
    height: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    background: var(--color-back);
    margin-block: 2vw 0;
    overflow: hidden;
}

.caballo__container {
    display: flex;
    justify-content: center;
    width: 100%;
    padding-block: 3vw 2vw;
}

.caballo__content {
    display: flex;
    align-items: center;
}

.caballo__slider {
    width: 35vw;
    aspect-ratio: 5/3;
    height: auto;
    overflow: hidden;
    border-radius: 2vw;
    transition: .8s all ease-out;
    transition-delay: 1s;
}

.caballo__slider-container {
    display: flex;
    width: 800%;
    height: 100%;
}

.caballo__slider-item {
    display: block;
    width: calc(100% / 8);
    height: 100%;
    object-fit: cover;
}

.caballo__slider-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.caballo.active .caballo__title {
    transform: translateY(0) translateY(0);
    opacity: 1;
}

.caballo.active .caballo__text {
    transform: translateY(0) translateY(0);
    opacity: 1;
}

.caballo.active .caballo__slider {
    opacity: 1;
}

.caballo.active .caballo__video {
    opacity: 1;
}

.caballo.out .caballo__title {
    transform: translateY(4vw) translateX(4vw);
    opacity: 0;
}

.caballo.out .caballo__text {
    transform: translateY(4vw) translateX(4vw);
    opacity: 0;
}

.caballo.out .caballo__slider {
    opacity: 0;
}

.caballo.out .caballo__video {
    opacity: 0;
}


.caballo__texts {
    display: flex;
    max-width: 30vw;
    flex-direction: column;
    margin-inline: 0 5vw;
}

.caballo__title {
    text-align: center;
    font-size: 2.8vw;
    line-height: 1;
    margin-block: 0;
    transition: opacity 0.8s ease,
    transform 1s cubic-bezier(0.19, 1, 0.22, 1);
}

.caballo__text {
    color: var(--color-gray);
    font-size: 1.3vw;
    text-align: center;
    font-family: var(--font-family-light);
    margin-block: 1.4vw 0;
    transition: opacity 0.8s ease,
    transform 1s cubic-bezier(0.19, 1, 0.22, 1);
    transition-delay: .8s;
}

.caballo__video {
    display: flex;
    width: 50vw;
    overflow: hidden;
    border-radius: 2vw;
    margin-block: 2vw 4vw;
    position: relative;
    transition: .8s all ease-out;
    transition-delay: 1.5s;
}

.caballo__video-video {
    display: flex;
    width: 100%;
}

.caballo__video-btn {
    display: flex;
    width: max-content;
    height: max-content;
    padding: .5vw 1vw;
    font-size: 1.2vw;
    cursor: pointer;
    border: none;
    border-radius: 1vw;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    transition: .3s all ease;
    background: rgba(255, 255, 255, .6);
}

.caballo__video-btn:hover {
    transform: scale(1.1);
}

/* Places */
.places {
    width: 100vw;
    height: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    background: var(--color-back);
    margin-block: 2vw 0;
    overflow: hidden;
}

.places__container {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    width: 80%;
    padding-block: 3vw 6vw;
}

.places__content {
    display: flex;
    align-items: center;
}

.places__title {
    text-align: center;
    font-size: 2.8vw;
    line-height: 1;
    margin-block: 0;
    transition: opacity 0.8s ease,
    transform 1s cubic-bezier(0.19, 1, 0.22, 1);
}

.places__item {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 18vw;
    height: 19vw;
    margin-inline: 1vw;
    margin-block: 1vw 1vw;
    padding: 1vw .5vw;
    background: rgba(11, 107, 79, .1);
    background-color: rgba(168, 139, 7, .1);
    border-radius: 1vw;
    transition: .5s cubic-bezier(0.19, 1, 0.22, 1);
}

.places__item:nth-of-type(1) { transition-delay: 0s; }
.places__item:nth-of-type(2) { transition-delay: .6s; }
.places__item:nth-of-type(3) { transition-delay: 1.2s; }
.places__item:nth-of-type(4) { transition-delay: 1.8s; }
.places__item:nth-of-type(5) { transition-delay: 2.4s; }

.places__item-title {
    font-size: 1.3vw;
    margin-block: 0 .5vw;
    text-align: center;
}

.places__item-text {
    font-family: var(--font-family-light);
    font-size: 1.2vw;
    text-align: center;
    margin-block: .2vw auto;
}

.places__data {
    width: 17vw;
    display: flex;
    align-items: center;
    margin-block: .2vw;
    position: relative;
}

.places__data:nth-of-type(1):after {
    content: '';
    display: flex;
    width: 100%;
    height: 4px;
    border-radius: 2px;
    background: var(--color-secundary);
    position: absolute;
    top: -1.2vw;
    left: 0;
    transition: .4s all ease;
}

.places__item:nth-of-type(1) .places__data:nth-of-type(1):after { transition-delay: 0s; }
.places__item:nth-of-type(2) .places__data:nth-of-type(1):after { transition-delay: 1.1s; }
.places__item:nth-of-type(3) .places__data:nth-of-type(1):after { transition-delay: 1.7s; }
.places__item:nth-of-type(4) .places__data:nth-of-type(1):after { transition-delay: 2.3s; }
.places__item:nth-of-type(5) .places__data:nth-of-type(1):after { transition-delay: 2.9s; }

.places__data-icon {
    display: block;
    width: 1vw;
    height: auto;
}

.places__data-text {
    max-width: 15vw;
    font-family: var(--font-family-light);
    font-size: 1.2vw;
    margin-inline: .8vw 0;
}

.places.active .places__item {
    transform: translateY(0) translateY(0);
    opacity: 1;
}

.places.active .places__data:nth-of-type(1):after {
    width: 100%;
}

.places.out .places__item {
    transform: translateY(4vw) translateX(4vw);
    opacity: 0;
}

.places.out .places__data:nth-of-type(1):after {
    width: 0;
}


/* Nosotros */
.nosotros {
    width: 95vw;
    padding-block: 2vw;
    display: flex;
    flex-direction: row-reverse;
    justify-content: center;
    background: var(--color-light);
    margin-inline: auto;
    border-radius: .7vw;
    margin-block: 0 3vw;
}

.nosotros__texts {
    display: flex;
    flex-direction: column;
    width: 40vw;
    margin-inline: 3vw 8vw;
    margin-block: auto;
}

.nosotros__title {
    color: var(--color-white);
    font-size: 2.6vw;
    margin-block: 0 3vw;
    max-width: 58vw;
    position: relative;
}

.nosotros__title:after {
    content: '';
    display: flex;
    width: 80%;
    height: 4px;
    background: var(--color-white);
    position: absolute;
    bottom: -1.5vw;
    left: 0;
    border-radius: 2px;
    transition: 1s all ease;
}

.nosotros.active .nosotros__title:after {
    width: 80%;
}

.nosotros.out .nosotros__title:after {
    width: 0;
}

.nosotros__text {
    color: var(--color-white);
    font-size: 1.3vw;
    font-family: var(--font-family-light);
}

.nosotros__images {
    display: block;
    width: 40vw;
    height: 40vw;
    border-radius: .6vw;
    overflow: hidden;
}

.nosotros__slider {
    display: flex;
    width: 400%;
    height: 100%;
}

.nosotros__item {
    display: flex;
    height: 100%;
    aspect-ratio: 1;
    width: auto;
}

.nosotros__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* contacto */
.contacto {
    width: 100vw;
    overflow: hidden;
    height: auto;
    display: flex;
    background: var(--color-back);
}

.contacto__container {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    padding-block: 4vw;
}

.contacto__content {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.contacto__data {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 25vw;
    padding-block: 1vw;
    position: relative;
}

.contacto__data:after {
    content: '';
    display: flex;
    width: 100%;
    height: 2px;
    border-radius: 1px;
    background: var(--color-black);
    position: absolute;
    top: 0;
    left: 0;
}

.contacto__data:before {
    /* content: ''; */
    display: flex;
    width: 100%;
    height: 2px;
    border-radius: 1px;
    background: var(--color-black);
    position: absolute;
    bottom: 0;
    left: 0;
}

.contacto__item {
    display: flex;
    align-items: center;
    margin-block: .5vw;
    text-decoration: none;
    transition: .3s all ease;
    cursor: pointer;
}

.contacto__item:hover {
    transform: scale(1.06);
}

.contacto__ico {
    width: 1.8vw;
    height: auto;
}

.contacto__text {
    color: var(--color-gray);
    font-size: 1.2vw;
    font-family: var(--font-family-light);
    margin-inline: 1vw 0;
}

.contacto__mapa-title {
    font-family: var(--font-family-bold);
    font-size: 1.2vw;
    text-align: center;
    margin-block: .2vw;
    text-decoration: underline;
    max-width: 25vw;
}

.contacto__mapa {
    display: block;
    margin-block: 1vw;
    width: 25vw;
    height: 25vw;
    border-radius: .7vw;
    overflow: hidden;
    border: 2px solid var(--color-black);
}

.contacto__form {
    display: flex;
    flex-direction: column;
    margin-inline: 5vw;
    margin-block: auto;
    background: var(--color-white);
    padding: 2vw 3vw;
    border-radius: 1vw;
    transition: opacity 0.8s ease,
    transform 2.5s cubic-bezier(0.19, 1, 0.22, 1);
}

.contacto__title {
    font-size: 2.8vw;
    margin-block: 0 1vw;
    text-align: center;
    max-width: 20vw;
    line-height: 1;
}

.contacto__input {
    color: var(--color-black);
    font-family: var(--font-family-light);
    font-size: 1.2vw;
    width: 20vw;
    padding: .2vw 1vw;
    border: 1px solid var(--color-gray);
    background: transparent;
    border-radius: .2vw;
    outline: none;
    margin-block: .4vw;
}

.contacto__textarea {
    color: var(--color-black);
    font-family: var(--font-family-light);
    font-size: 1.2vw;
    width: 20vw;
    height: 9vw;
    padding: .2vw 1vw;
    border: 1px solid var(--color-gray);
    background: transparent;
    border-radius: .2vw;
    outline: none;
    margin-block: .4vw;
}

.contacto__btn {
    color: var(--color-white);
    font-size: 1.2vw;
    display: flex;
    justify-content: center;
    width: 20vw;
    border-radius: .3vw;
    padding: .3vw 1vw;
    background: var(--color-light);
    border: 1px solid var(--color-light);
    cursor: pointer;
    text-decoration: none;
    margin-block: .4vw;
}

.contacto__info {
    display: flex;
    flex-direction: column;
}

.contacto__info-item {
    display: flex;
    flex-direction: column;
    margin-block: .8vw;
    transition: opacity 0.7s ease,
    transform 1s cubic-bezier(0.19, 1, 0.22, 1);
}

.contacto__info-title {
    font-family: var(--font-family-bold);
    font-size: 1.2vw;
    margin-block: .2vw;
    text-decoration: underline;
}

.contacto__info-data {
    color: var(--color-black);
    text-decoration: none;
    display: flex;
    align-items: center;
    margin-block: .2vw;
    transition: .3s all ease;
    cursor: pointer;
}

.contacto__info-data:hover {
    transform: scale(1.05);
}

.contacto__info-icon {
    width: 1vw;
    height: auto;
}

.contacto__info-text {
    font-family: var(--font-family-light);
    font-size: 1.2vw;
    margin-inline: .8vw 0;
}


.contacto.active .contacto__info-item:nth-of-type(1) {
    transform: translateY(0) translateX(0);
    opacity: 1;
    transition-delay: .2s;
}

.contacto.active .contacto__info-item:nth-of-type(2){
    transform: translateY(0) translateX(0);
    opacity: 1;
    transition-delay: .6s;
}

.contacto.active .contacto__info-item:nth-of-type(3){
    transform: translateY(0) translateX(0);
    opacity: 1;
    transition-delay: .8s;
}

.contacto.active .contacto__info-item:nth-of-type(4){
    transform: translateY(0) translateX(0);
    opacity: 1;
    transition-delay: 1.2s;
}

.contacto.active .contacto__form {
    transform: translateY(0);
    opacity: 1;
    transition-delay: .4s;
}

.contacto.out .contacto__info-item:nth-of-type(1) {
    transform: translateY(13vw) translateX(100%);
    opacity: 0;
}

.contacto.out .contacto__info-item:nth-of-type(2){
    transform: translateY(13vw) translateX(100%);
    opacity: 0;
}

.contacto.out .contacto__info-item:nth-of-type(3){
    transform: translateY(13vw) translateX(100%);
    opacity: 0;
}

.contacto.out .contacto__info-item:nth-of-type(4){
    transform: translateY(13vw) translateX(100%);
    opacity: 0;
}

.contacto.out .contacto__form {
    transform: translateY(90%);
    opacity: 0;
}

/* Ecencia */
.esencia {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100vw;
    height: auto;
    padding-block: 2vw 7vw;
}

.esencia__title {
    font-size: 2.8vw;
    line-height: 1;
    margin-block: 0 5vw;
}

.esencia__content {
    display: flex;
    align-items: center;
}

.esencia__images {
    display: flex;
    width: 18vw;
    aspect-ratio: 540/1000;
    height: auto;
    margin-inline: 1vw;
    border-radius: .7vw;
    overflow: hidden;
    transition: opacity 0.8s ease,
    transform 2.5s cubic-bezier(0.19, 1, 0.22, 1);
}

.esencia.active .esencia__images:nth-of-type(1) {
    transform: translateY(0);
    transition-delay: 0.1s;
}

.esencia.active .esencia__images:nth-of-type(2) {
    transform: translateY(2vw);
    transition-delay: 0.2s;
}

.esencia.active .esencia__images:nth-of-type(3) {
    transform: translateY(-2vw);
    transition-delay: 0.3s;
}

.esencia.active .esencia__images:nth-of-type(4) {
    transform: translateY(0);
    transition-delay: 0.4s;

}

.esencia.out .esencia__images {
    opacity: 0;
    transform: translateY(0);
    transition-delay: 0s;
}

.esencia.out .esencia__images:nth-of-type(1) {
    transform: translateY(4vw);
    transition-delay: 0.1s;
}

.esencia.out .esencia__images:nth-of-type(2) {
    transform: translateY(-2vw);
    transition-delay: 0.2s;
}

.esencia.out .esencia__images:nth-of-type(3) {
    transform: translateY(2vw);
    transition-delay: 0.3s;
}

.esencia.out .esencia__images:nth-of-type(4) {
    transform: translateY(-4vw);
    transition-delay: 0.4s;

}

.esencia__img {
    width: 100%;
    height: auto;
}

/* Footer */
.footer {
    display: flex;
    flex-direction: column;
    width: 100vw;
    background: var(--color-light);
    padding-block: 2vw 0;
}

.footer__content {
    display: flex;
    align-items: center;
    width: 75vw;
    margin-inline: auto;
}

.footer__logos {
    display: flex;
    align-items: center;
    justify-content: center;
}

.footer__logo, .footer__logo-respo {
    display: none;
    width: 15vw;
    height: auto;
    border-radius: .7vw;
    filter: drop-shadow(2px 2px 3px rgba(255, 255, 255, 1));
}

.footer__logo-respo {
    display: flex;
    filter: none;
}


.footer__logo-huegen {
    display: flex;
    width: 8vw;
    height: auto;
    border-radius: .7vw;
    filter: drop-shadow(2px 2px 3px rgba(255, 255, 255, 1));
}

.footer__text {
    color: var(--color-white);
    font-size: 1vw;
    font-family: var(--font-family-light);
    margin-inline: 2vw;
}

.footer__powered {
    display: flex;
    width: 90vw;
    border-top: 1px solid var(--color-white);
    margin-block: 2vw 0;
    margin-inline: auto;
    position: relative;
}

.footer__copy {
    color: var(--color-white);
    font-family: var(--font-family-light);
    font-size: 1vw;
    padding-block: .2vw .3vw;
    margin-inline: 0 auto;
}

.footer__custom {
    display: flex;
    width: max-content;
    align-items: center;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
}

.footer__custom-text {
    color: var(--color-white);
    font-family: var(--font-family-light);
    font-size: .9vw;
    margin-inline: 0 .5vw;
}

.footer__custom-link {
    color: var(--color-white);
    font-family: var(--font-family-light);
    font-size: .9vw;
    text-decoration: underline;
    margin-inline: 0 .5vw;
}

/* Imagen */
.imagen {
    display: flex;
    width: 100vw;
    height: 100vh;
    justify-content: center;
    align-items: center;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    transition: .3s all ease;
    transform: scale(0);
    position: fixed;
    top: 0;
    left: 0;
}

.imagen__btn {
    color: var(--color-white);
    font-family: var(--font-family-bold);
    font-size: 1.8vw;
    line-height: 1;
    display: flex;
    width: 2.5vw;
    height: 2.5vw;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    background: rgba(0, 0, 0, .5);
    margin-inline: 1.5vw;
    border: 1px solid var(--color-secundary);
    transition: .3s all ease-in;
    cursor: pointer;
}

.imagen__btn-left {
    transform: rotate(180deg);
}

.imagen__btn:hover {
    background: var(--color-black);
}

.imagen__btn-icon {
    fill: var(--color-white);
    width: 1.4vw;
    height: auto;
}

.imagen__container {
    display: flex;
    justify-content: center;
    width: 25vw;
    height: auto;
    border-radius: 1vw;
    border: 1px solid var(--color-secundary);
    overflow: hidden;
}

.imagen__slider {
    display: flex;
    justify-content: center;
    width: 300%;
    height: auto;
    transition: .5s all cubic-bezier(0.075, 0.82, 0.165, 1);
}

.imagen__slider-item {
    display: block;
    width: 25vw;
    height: auto;
}

.image-slider-img {
    width: 100%;
    height: auto;
}

@media screen and (max-width: 600px) {
    /* Header */
    .header {  }
    .header__content { position: fixed; top: 0; left: 0; background: var(--color-back); width: 100vw; height: 100vh; z-index: 999999; transition: .5s all ease; transform: translateY(-105vh); flex-direction: column; align-items: center; justify-content: center;}
    .header__content-active { transform: translateY(0); }
    .header__item { width: 80vw; flex-direction: column; }
    .header__item:nth-of-type(2) { margin-block: auto; }
    .header__item:nth-of-type(1) { position: absolute; bottom: 20vw; }
    .header__item:nth-of-type(3) { margin-block: 0 10vw; }
    .header__item-data { margin-block: 2vw; }
    .header__item-icon { fill: var(--color-black); height: 5vw; }
    .header__item:nth-of-type(1) .header__item-data:nth-of-type(1) .header__item-label { font-size: 4vw; }
    .header__item-label { color: var(--color-black); font-size: 4.5vw; margin-inline: 3vw 0; text-align: center; }
    .header__item-btn { color: var(--color-black); font-family: var(--font-family-bold); font-size: 5.5vw;  margin-block: 3vw;}
    .header__category { display: flex; padding-inline: 0; margin-inline: 3vw 0; border: none; z-index: 999999; }
    .header__image { position: absolute; top: 5vw; left: 9vw; width: 34vw; }
    .header__image-icon { border-radius: 0; }
    /* Main    */
    .main__item { aspect-ratio: 3/4; }
    .main__item-texts { width: 80%; }
    .main__item-title { font-size: 8.4vw; line-height: 1.1; margin-block: 6vw; }
    .main__item-text { font-size: 4.7vw; }
    .main__content-btn { width: 2.3vw; height: 2.3vw; margin-inline: .6vw; }
    .main__content-btns { bottom: 4vw; padding: .6vw 2vw; border-radius: 4vw; }
    /* History */
    .history { padding-block: 5vw; }
    .history__container { flex-direction: column-reverse; align-items: center; }
    .history__texts { width: 85vw; max-width: 85vw; margin-inline: 0; margin-block: 0 8vw; }
    .history__title { font-size: 7vw; margin-block: 0; }
    .history__subtitle { font-size: 4.5vw; margin-block: 7vw 4vw; }
    .history__text { font-size: 4vw; }
    .history__images { width: 40vw; margin-inline: 2vw; border-radius: 2vw; }
    .history.active .history__images:nth-of-type(2) { transform: translateY(6vw); }
    .history.out .history__images:nth-of-type(1) { transform: translateY(6vw); }
    .history.out .history__images:nth-of-type(2) { transform: translateY(-6vw); }
    /* Valores */
    .valores { padding-block: 2vw 6vw; }
    .valores__title { font-size: 7vw; max-width: 85vw; line-height: 1.1; margin-block: 0 4vw; }
    .valores__texts { width: 85vw; }
    .valores__item { margin-inline: 0; margin-block: 2vw; }
    .valores__check { width: 5vw; }
    .valores__text { font-size: 3vw; margin-inline: 4vw 0; width: 75vw; }
    /* Caballo */
    .caballo { padding-block: 5vw; }
    .caballo__container { flex-direction: column; align-items: center; }
    .caballo__texts { width: 85vw; max-width: 85vw; margin-inline: 0; margin-block: 0 2vw; }
    .caballo__title { font-size: 7vw; margin-block: 0; }
    .caballo__text { font-size: 4vw; margin-block: 4vw; transition-delay: .5s; }
    .caballo__slider { width: 100vw; border-radius: 4vw; transition-delay: .8s; }
    .caballo__video { display: none; }
    /* Places */
    .places__container { width: 95vw; }
    .places__title { font-size: 7vw; }
    .places__item { width: 39vw; height: 50vw; margin: 2vw; padding: 4vw 2vw; border-radius: 4vw; }
    .places__item-title { font-size: 3vw; }
    .places__item-text { font-size: 2.8vw; }
    .places__data:nth-of-type(1):after { height: 2px; top: -3vw; }
    .places__data { width: 40vw; margin-block: 1vw; }
    .places__data-icon { width: 3vw; margin-inline: 2vw; }
    .places__data-text { font-size: 2.8vw; margin-inline: 0; max-width: 32vw; }
    /* Nosotros */
    .nosotros { flex-direction: column; border-radius: 2vw; padding-block: 5vw; }
    .nosotros__texts { width: 80%; margin-inline: auto; }
    .nosotros__title { font-size: 7vw; max-width: 100%; margin-block: 0 7vw; }
    .nosotros__title:after { bottom: -4vw; height: 2px; }
    .nosotros__text { font-size: 3.5vw; }
    .nosotros__images { width: 80vw; height: 80vw; margin-inline: auto; margin-block: 5vw 0; border-radius: 2vw; }
    /* Contacto */
    .contacto__container { flex-direction: column; align-items: center; }
    .contacto__form { margin-inline: auto; padding: 6vw 0; margin-block: 4vw 6vw; width: 100vw; align-items: center; border-radius: 0; }
    .contacto__title { font-size: 7vw; max-width: 80vw; margin-block: 0 4vw; }
    .contacto__input { font-size: 3.5vw; padding: .8vw 3vw; border-radius: 0; width: 70vw; margin-block: 1vw; }
    .contacto__textarea { font-size: 3.5vw; padding: .8vw 3vw; border-radius: 0; width: 70vw; margin-block: 1vw; height: 35vw; }
    .contacto__btn { font-size: 4vw; width: 70vw; padding: 1vw 3vw; margin-block: 2vw 0; }
    .contacto__content { flex-direction: column; margin-block: 2vw; }
    .contacto__mapa-title { font-size: 4vw; max-width: 80vw; margin-block: 0 1vw; }
    .contacto__mapa { width: 80vw; height: 70vw; border-radius: 2vw; }
    .contacto__data { width: 100vw; margin-block: 4vw 0; background: var(--color-white); }
    .contacto__data::after { display: none; }
    .contacto__item { margin-block: 1.5vw; }
    .contacto__ico { width: 4vw; }
    .contacto__text { margin-inline: 3vw; font-size: 3.5vw; }
    .contacto__info { flex-direction: row; flex-wrap: wrap; }
    .contacto__info-item { align-items: center; margin-inline: auto; margin-block: 2vw; }
    .contacto__info-title { font-size: 4vw; }
    .contacto__info-data { margin-block: .8vw; }
    .contacto__info-icon { width: 3.2vw; }
    .contacto__info-text { font-size: 4vw; margin-inline: 2vw 0; }
    /* Esencia */
    .esencia { padding-block: 3vw 10vw; }
    .esencia__title { font-size: 7vw; margin-block: 0 4vw; text-align: center; }
    .esencia__content { flex-wrap: wrap; justify-content: center; }
    .esencia__images { width: 40vw; margin-inline: 2vw; border-radius: 2vw; margin-block: 3vw; }
    .esencia.active .esencia__images:nth-of-type(2) { transform: translateY(5vw); }
    .esencia.active .esencia__images:nth-of-type(4) { transform: translateY(3vw); }
    /* Footer */
    .footer { padding-block: 4vw 2vw; }
    .footer__content { flex-direction: column; align-items: center; width: 80vw; }
    .footer__logo { width: 24vw; display: flex; }
    .footer__logo-respo { display: flex; margin-inline: 6vw 0; width: 45vw; }
    .footer__logo-huegen { display: none; }
    .footer__text { margin-block: 4vw 0; margin-inline: 0; font-size: 3vw; }
    .footer__powered { margin-block: 4vw 0; padding-block: 2vw 0; }
    .footer__copy { padding-block: 1vw; font-size: 2.5vw; padding-block: 0; }
    .footer__custom { position: relative; margin-inline: auto 0; }
    .footer__custom-text { font-size: 2.5vw; margin-inline: 0 2vw; }
    .footer__custom-link { font-size: 2.5vw; }
    /* Imagen */
    .imagen__container { width: 75vw; border-radius: 4vw; }
    .imagen__slider-item { width: 75vw; }
    .imagen__btn { margin-inline: 3vw; width: 8vw; height: 8vw; }
    .imagen__btn-icon { width: 3.4vw; }
}