/*
* Prefixed by https://autoprefixer.github.io
* PostCSS: v8.4.14,
* Autoprefixer: v10.4.7
* Browsers: last 4 version
*/

section {
  width: var(--web-container);
  text-align: center;
  position: relative;
  margin: 50px auto;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

h3 {
  font-size: var(--title-font-size);
  line-height: var(--title-line-height);
  font-family: "BookAntiqua";
  font-style: italic;
}

.italic {
  font-style: italic;
  font-family: "BookAntiqua";
}

#highlights {
  width: 100%;
  position: relative;
  overflow: hidden;
  height: auto;
  margin-bottom: calc(calc(100% - var(--home-container)) / 4);
}

#highlights figure,
#highlights img {
  object-fit: cover;
  width: 100%;
  -o-object-fit: cover;
}

.highlight iframe {
  pointer-events: none;
}

#highlights .highlight {
  position: relative;
  width: 100%;
  display: block;
  height: auto;
  text-align: center;
  color: #fff;
  font-size: 48px;
  text-decoration: underline;
}

.widthContainer {
  width: 100%;
}


#imageGroupTitle {
  font-size: 20px;
  font-weight: 300;
  text-transform: uppercase;
  letter-spacing: 3px;
  margin-top: 50px;
  margin-bottom: 25px;
  color: #333234;
  text-align: center;
}

.group-look-slider .group-look-slider-title {
  margin-top: calc(calc(100% - var(--web-container)) / 1);
  font-size: var(--group-font-size);
  line-height: var(--group-line-height);
  /* margin-top: 0px; */
}

.look-slider-right-arrow.slick-arrow,
.look-slider-left-arrow.slick-arrow {
  top: calc(41% + calc(calc(100% - var(--web-container)) / 1) + 0px);
  background: var(--base-aux);
}

img.look-slider-arrow {
  -webkit-filter: invert(1);
  filter: invert(1);
}

.group-look-slider .look-slider-tag-info {
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  /* -webkit-transform: scale(0.75); */
  -webkit-transform: scale(0.75);
  -ms-transform: scale(0.75);
  transform: scale(0.75);
  margin-left: 0px;
}



.group-look-slider .look-slider-tag-price,
.group-look-slider .look-slider-tag-old-price {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  font-weight: 600;
  font-size: var(--base-font-size);
  color: var(--base);
}

.group-look-slider .look-slider-tag-name {
  width: 100%;
  color: var(--base);
  font-size: var(--base-font-size);
  margin-bottom: 3px;
}

.group-look-slider .look-slider-tag-old-price {
  opacity: 30%;
}

.slick-dots {
  bottom: 20px;
}

.slick-dots li,
.group-look-slider .slick-dots li {
  width: 14px !important;
  height: 14px;
  margin: 4px;
}

.slick-dots li button {
  width: 14px;
  height: 14px;
  padding: 0;
  border: 1px solid transparent;
}

.slick-dots li button:before {
  border-radius: 50px;
  width: 10px;
  height: 10px;
  margin: 10px;
  background-color: #fff;
  color: transparent;
  opacity: 1;
  font-size: 0;
  top: -8px;
  left: -8px;
}

.slick-dots li.slick-active {
  border: 1px solid white;
  border-radius: 50%;
}

.slick-dots li.slick-active button:before {
  opacity: 1;
  border: 1px solid var(--white);
}

/* Highlight Images Scroll / Menu*/


.highlightContainer {
  width: 100%;
  overflow: hidden;
}

.highlightContent {
  width: 80%;
  margin: 0 auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 40px;
  padding: 33px 0;
}

.highlightTitle {
  font-size: 36px;
  text-align: center;
  line-height: 46px;
  font-family: 'AlbertSans';
}

.highlightTitle .italic {
  font-size: 44px;
}


.highlightContent .buttonsDiv {
  margin: 0 auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  width: auto;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  gap: 18px;
}


.highlightImages {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 45px;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  height: auto;
  width: 190%;
  left: -5%;
  position: relative;
  margin-top: 40px;
  -webkit-transform: translateX(0);
  -ms-transform: translateX(0);
  transform: translateX(0);
  -webkit-transition: transform 0.3s ease-out, -webkit-transform 0.3s ease-out;
  transition: -webkit-transform 0.3s ease-out;
  -o-transition: transform 0.3s ease-out, -webkit-transform 0.3s ease-out;
  transition: transform 0.3s ease-out;
}

.highlightImages img {
  width: 100%;
  min-width: 320px;
  display: block;
  position: relative;
  overflow: hidden;
  aspect-ratio: 320/400;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 20px;
  min-height: 400px;
  /* background-color: whitesmoke; */
  /* -webkit-box-shadow: 0px 4px 61.8px 0px rgba(230, 230, 230, 0.68); */
  /* box-shadow: 0px 4px 61.8px 0px rgba(230, 230, 230, 0.68); */
  border-radius: 20px;
}

.highlightImages {
  display: flex;
  overflow-x: scroll;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  /* Firefox */
  -ms-overflow-style: none;
  /* Internet Explorer 10+ */
}

.highlightImages::-webkit-scrollbar {
  display: none;
  /* Safari and Chrome */
}

.highlightImage {
  flex: none;
  width: 100%;
  max-width: 300px;
  /* Ajusta el ancho según tus necesidades */
  margin-right: 10px;
  /* Espaciado entre imágenes */
  scroll-snap-align: center;
}

.highlightContent a.tr-3.btn-1:hover {
  background-color: #F9F9F9;
}

.highlightContent a.tr-3.btn-3 {
  background: #F9F9F9;
}

.highlightContent a.tr-3.btn-3:hover {
  background: #596840;
}

/* Nuestros vinos */
#winesContainer .sliderTitle {
  margin-bottom: 45px;
  font-size: 20px;
  line-height: 20px;
}

.sliderBrands {
  margin: 20px auto 50px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  gap: 2%;
  -ms-flex-line-pack: center;
  align-content: center;
}

.sliderBrands .brandContainer {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  background: #F2F4F0;
  aspect-ratio: 248 / 101;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  border-radius: var(--border-radius-small);
}

.sliderBrands .brandContainer .brand {
  max-width: 100%;
  max-height: 100%;
  height: auto;
  width: auto;
  display: block;
}

#winesContainer .sliderBrands .brandContainer {
  background: unset;
  margin: 0 8px;
  aspect-ratio: 259 / 127;
  display: flex;
  align-items: center;
  justify-content: center;
}



/* Services */
.servicesContainer {
  background-color: #F4E8DB;
  width: 100%;
  gap: 6rem;
  padding: 80px 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  margin-top: 275px;
}

.servicesContent {
  width: var(--web-container);
  margin: 0 auto;
  text-align: left
}

.servicesTitle {
  font-family: "BookAntiqua";
  font-size: 64px;
  font-style: italic;
  font-weight: 400;
  line-height: 68px;
  text-align: left;
  margin-bottom: 18px;
  width: 50%;
}

.servicesSubtitle {
  width: 45%;
}

.servicesCards {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: flex-start;
  width: var(--web-container);
  margin: 0 auto;
  align-content: flex-start;
}

.servicesContainer .service {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  width: calc((100% / 3) - 2%);
  );
}

.servicesContainer .imgContainer {
  aspect-ratio: 418/460;
  width: auto;
  height: 100%;
}

.servicesContainer .imgContainer img {
  aspect-ratio: 418/460;
  width: auto;
  height: 100%;
  border-radius: 24px;
  overflow: hidden;
}

.servicesContainer .textContainer {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  -ms-flex-line-pack: start;
  align-content: flex-start;
  height: 350px;
}

.servicesContainer .titleBox {
  font-family: "BookAntiqua";
  font-size: 32px;
  font-style: italic;
  font-weight: 400;
  line-height: 34px;
  margin-bottom: 24px;
  text-align: left;
}

.servicesContainer .textBox {
  margin-bottom: 4rem;
  text-align: left;
  width: 90%;
}

.servicesContainer .btn-1 {
  height: auto;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  bottom: 7%;
  position: absolute;
  padding: 8px 24px
}

a.tr-3.btn-1 {}

/* Team Work */
.teamContainer {
  margin: 100px auto;
  gap: 53px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}

.teamCards {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  /* gap: 58px; */
}

.team {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  width: calc((100% / 4) - 58px);
  -ms-flex-line-pack: justify;
  align-content: space-between;
}

.team figure {
  aspect-ratio: 300/398;
  border-radius: 160px;
  width: 100%;
  height: auto;
  overflow: hidden;
}

.team img {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  width: 100%;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-line-pack: center;
  align-content: center;
  aspect-ratio: 300 / 398;
  /* border-radius: 160px; */
}


.team .textContainer {
  margin-top: 20px;
}

.team .textContainer h4 {
  font-size: 16px;
  font-weight: 600;
  line-height: 20px;
}

.team .textContainer p {
  font-size: 12px;
  font-weight: 400;
  line-height: 14.4px;
}


/* Shows */
.showsContainer {
  background-color: #F2F4F0;
  gap: 1rem;
  padding: 80px 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}

.showsContainer .highlightContent {
  width: var(--web-container);
  margin: 0 auto;
  text-align: left;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
}


.showsContainer .highlighttextsContent {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}

.showsContainer .highlightTitle {
  font-family: "BookAntiqua";
  font-size: 64px;
  text-align: left;
  margin-bottom: 40px;
  width: 100%;
}

.showsContainer .highlightSubtitle {
  width: 65%;
}

.showsContainer .buttonsDiv {
  -webkit-box-pack: right;
  -ms-flex-pack: right;
  justify-content: right;
  gap: 0;
}

.showsContainer a.tr-3.btn-1:hover {
  background: #F2F4F0;
}

.servicesContainer {
  position: relative;
}

.servicesContainer {
  position: relative;
}

.wineImage {
  position: absolute;
  right: -450px;
  width: 500px;
  top: -25%;
  height: auto;
  -webkit-transition: top 1.5s ease, right 1.5s ease, -webkit-transform 1.5s ease;
  transition: top 1.5s ease, right 1.5s ease, -webkit-transform 1.5s ease;
  transition: transform 1.5s ease, top 1.5s ease, right 1.5s ease;
  transition: transform 1.5s ease, top 1.5s ease, right 1.5s ease, -webkit-transform 1.5s ease;
  -webkit-transform-origin: center right;
  -ms-transform-origin: center right;
  transform-origin: center right;
  -webkit-transition: transform 1.5s ease, top 1.5s ease, right 1.5s ease;
  -moz-transition: transform 1.5s ease, top 1.5s ease, right 1.5s ease;
  -ms-transition: transform 1.5s ease, top 1.5s ease, right 1.5s ease;
  -o-transition: transform 1.5s ease, top 1.5s ease, right 1.5s ease;
}

.wineImage.show {
  right: 0;
  top: -25%;
}

.wineImage.exit {
  right: -450px;
  top: -25%;
  -webkit-transition: top 1.5s ease, right 1.5s ease, -webkit-transform 1.5s ease;
  transition: top 1.5s ease, right 1.5s ease, -webkit-transform 1.5s ease;
  transition: transform 1.5s ease, top 1.5s ease, right 1.5s ease;
  transition: transform 1.5s ease, top 1.5s ease, right 1.5s ease, -webkit-transform 1.5s ease;
  -webkit-transform-origin: center right;
  -ms-transform-origin: center right;
  transform-origin: center right;
  -webkit-transition: transform 1.5s ease, top 1.5s ease, right 1.5s ease;
  -moz-transition: transform 1.5s ease, top 1.5s ease, right 1.5s ease;
  -ms-transition: transform 1.5s ease, top 1.5s ease, right 1.5s ease;
  -o-transition: transform 1.5s ease, top 1.5s ease, right 1.5s ease;
}

/* Brands */
#brandsContainer {
  width: calc(var(--web-container) + 3.2%);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 50px
}

#brandsContainer h3 {
  font-size: 35px
}

#brandsContainer .sliderBrands {
  display: block;
  width: 100%;
  position: relative;
  margin: 0 auto;
}

#brandsContainer .sliderBrands .brandContainer {
  background: unset;
  aspect-ratio: unset;
  border-radius: var(--border-radius-small);
  margin: 0 18px;
  aspect-ratio: 259 / 127;
  display: block;
}

#brandsContainer .sliderBrands .brandContainer .brand {
  max-width: unset;
  max-height: 100%;
  mix-blend-mode: unset;
  position: relative;
  width: 100%;
  aspect-ratio: 259/127;
  border-radius: 15px;
}



@media screen and (max-width: 768px) {
  #imageGroups {
    width: 100%;
  }

  .group-look-slider .look-slider-tag-info {
    -webkit-transform: unset;
    -ms-transform: unset;
    transform: unset;
    margin-left: 20px;
  }

  a.look-slider-tag-link {
    width: 100%;
  }

  .highlight iframe {
    aspect-ratio: 9/16;
  }

  .group-look-slider {
    width: calc(100% - 40px) !important;
    margin: 10px 20px auto !important;
    float: left;
  }

  .group-look-slider .slick-dots li button:before {
    width: 10px !important;
    height: 10px !important;
    border-radius: 30px !important;
  }

  .group-look-slider .look-slider-container ul.slick-dots li {
    width: 14px !important;
    margin: 0px 7px !important;
  }

  .group-look-slider .slick-dots li.slick-active button:before {
    background: var(--base);
    /* opacity: 30%; */
  }

  .group-look-slider .slick-dots li.slick-active button:before {
    background-color: var(--base) !important;
  }

  .group-look-slider .slick-dots li.slick-active {
    border: 1px solid var(--base);
  }

  .group-look-slider ul.slick-dots {
    bottom: 50px;
  }

  .group-look-slider .slick-dotted.slick-slider {
    margin-bottom: 0px;
  }

  .sliderContainer {
    margin-bottom: 40px;
  }

  /* Highlight Images Scroll / Menu*/
  .highlightContainer {
    overflow: hidden;
  }

  .highlightContent {
    padding: 0;
    gap: 40px;
    width: var(--web-container);
  }

  .highlightTitle {
    font-size: 18px;
    line-height: 26px;
    width: 100%;
  }

  .highlightTitle .italic {
    font-size: 20px;
  }

  .highlightContent .buttonsDiv {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    width: var(--web-container);
    text-align: center
  }


  .highlightImages {
    gap: 13px;
    left: -80%;
  }

  .highlightImages img {
    min-width: 184px;
    aspect-ratio: 184/230;
    min-height: 230px;
  }


  /* Nuestros vinos */
  #winesContainer {
    width: 100%;
    margin: 0
  }

  #winesContainer .sliderTitle {
    margin-bottom: 30px;
    font-size: 18px;
  }

  #winesContainer .sliderBrands {
    margin: 0px auto 30px;
    gap: 0;
    display: block;
    width: 100%;
    position: relative;
  }

  #winesContainer .sliderBrands .brandContainer {
    background: unset;
    margin: 0 8px;
    aspect-ratio: 259 / 127;
    display: block;
  }



  /* Services */
  .servicesContainer {
    gap: 50px;
    padding: 40px 0;
    margin-top: 80px;
  }

  .servicesTitle {
    font-size: 32px;
    line-height: 34px;
    margin-bottom: 30px;
  }

  .wineImage {
    top: -4%;
    width: 200px;
  }

  .wineImage.show {
    top: -4%;
  }

  .wineImage.exit {
    top: -4%;
  }


  .servicesSubtitle {
    width: 100%;
  }

  .servicesCards {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 58px;
  }

  .servicesContainer .service {
    width: 100%;
    aspect-ratio: unset;
  }

  .servicesContainer .imgContainer {
    aspect-ratio: 338/371;
    height: auto;
    width: 100%;
  }

  .servicesContainer .imgContainer img {
    height: auto;
    aspect-ratio: 338/371
  }

  .servicesContainer .titleBox {
    font-size: 28px;
    line-height: 32px;
    margin-bottom: 30px;
  }

  .servicesContainer .textBox {
    margin-bottom: 30px;
    text-align: left;
    width: 100%;
  }

  .servicesContainer .btn-1 {
    height: 44px;
    line-height: 24px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: 100%;
    padding: 8px 24px;
    position: relative;
    bottom: 0;
  }

  .servicesContainer .textContainer {
    height: auto;
  }

  /* Team Work */
  .teamContainer {
    margin: 50px auto;
    width: 100%;
    gap: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
  }

  .teamCards {
    display: block;
  }

  .team {
    width: 100%;
    margin: 52px 18px 10px;
    justify-items: center;
  }

  .team img {
    aspect-ratio: 221/294;
    width: 100%;
  }

  .team .textContainer h4 {
    padding-bottom: 6px
  }

  /* Shows */
  .showsContainer {
    gap: 1rem;
    padding: 50px 0;
  }

  .showsContainer .highlightTitle {
    font-size: 32px;
    line-height: 34px;
    margin-bottom: 24px;
  }

  .showsContainer .btn-1 {
    width: var(--web-container);
    margin-top: 24px;
  }

  /* Brands */
  #brandsContainer {
    width: 100%;
  }

  #brandsContainer .sliderBrands .brandContainer {
    margin: 0 8px;
    aspect-ratio: 149/72;
  }
}

@media screen and (min-width: 1100px) {
  .team figure img {
    transition: transform 0.3s ease-in-out;
    transform: scale(1);
    -webkit-transition: transform 0.3s ease-in-out;
    -moz-transition: transform 0.3s ease-in-out;
    -ms-transition: transform 0.3s ease-in-out;
    -o-transition: transform 0.3s ease-in-out;
  }

  .team:hover figure img {
    transform: scale(1.05);
  }

  .servicesContainer .btn-1:hover {
    background-color: #F4E8DB;
  }
}