/* Ajustes estilos existentes */

.productDetailNutrition {
  margin: 0 !important;
  padding: 0;
  padding-bottom: 180px;
  color: white;

  @media (max-width: 800px) {
    padding-bottom: 100px;
  }
}

.productDetailNutrition h2 {
  font: normal normal bold 40px/50px Chaumont;
  margin: 1rem 0 1.5rem 0;
}

.productDetailNutrition:before,
body.single-product .textWithImages.twi0:after,
body.single-product .fullwidthText.fwt1:before {
  width: 0 !important;
  height: 0 !important;
}

.productDetailNutrition .c1,
.productDetailNutrition .c3 {
  width: 50% !important;

  @media (max-width: 800px) {
    width: 100% !important;
    text-align: center;
  }
}

body.single-product .productDetailNutrition:after {
  z-index: 2;
  content: "";
  width: 270px;
  height: 340px;
  background: url(images/coupleDeco.svg) no-repeat center center / contain;
  position: absolute;
  left: calc(50% - -270px);
  bottom: -20px;

  @media (max-width: 768px) {
    left: calc(50% - 100px);
    bottom: -100px;
    width: 256px;
    height: 210px;

    /*left: calc(50% - -25px);
    bottom: -10px;
    width: 135px;
    height: 140px;*/
  }
}

body.single-product .textWithImages.twi0 .images {
  top: 0;
}

/* **************************** Nuevos estilos */

.gridBlock {
  display: grid;
  grid-template-columns: 55% 45%;
  grid-template-rows: auto auto;
  align-items: center;
  width: 100%;
  padding: 20px;

  @media (max-width: 768px) {
    /*display: block;*/
    padding: 0;
    grid-template-columns: 100%;
    grid-template-rows: auto 1fr 1fr;
  }
}

.gridItem {}

.gridItem-1 {
  grid-column: 2;
  grid-row: 1;

    @media (max-width: 768px) {
    grid-column: 1;
    grid-row: 2;

    display: flex;
    flex-direction: column-reverse;
  }
}

.gridItem-2 {
  grid-column: 1;
  grid-row: 1 / span 2;
  align-self: end;
  position: relative;
  justify-items: center;

  @media (max-width: 768px) {
    grid-row: 1 / 2;
  }
}

.gridItem-3 {
  grid-column: 2;
  grid-row: 2;

  @media (max-width: 768px) {
    grid-column: 1;
    grid-row: 3;
  }
}

.productMain {
  width: 100%;
  max-width: 800px;
  z-index: 10;
  position: relative;
  display: block;
  margin-bottom: -40px;

  @media (max-width: 768px) {
    margin-bottom: 0;
    padding-left: 20px;
  }

  @media (max-width: 370px) {
    max-width: 350px;
  }
}

.maskProduct {
  width: auto;
  max-height: 600px;
  transform: rotate(-60deg);
  position: absolute;
  left: -160px;
  top: -150px;

  @media (max-width: 768px) {
    max-height: 400px;
    left: -160px;
    top: -50px;
  }

  @media (max-width: 480px) {
    left: -280px;
  }
}

.starContent {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: left;
  font-size: 32px;
  line-height: 1.2;
  gap: 10px;

  @media (max-width: 768px) {
    justify-content: center;
  }

  .star {
    color: #d5e373;
  }

  .number {
    color: white;
    font: normal normal 400 42px/1.2 Chaumont;
  }
}

.productDetail {
  padding-top: 100px;
  position: relative;
  color: white;
}

.productDetail-content {}

.productDetail-title {
  font: normal normal bold 70px/80px Chaumont;
  color: white;
  margin: 20px 0;
  text-align: left !important;
  text-transform: uppercase;

  @media (max-width: 768px) {
    text-align: center !important;
    font: normal normal bold 40px/42px Chaumont;
  }

  .t1 {
    display: inline-block;

    @media (max-width: 768px) {
      display: none;
    }
  }

  .t2 {
    display: none;

    @media (max-width: 768px) {
      display: inline-block;
    }
  }
}

.btnContent {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: left;
  gap: 20px;
  margin-top: 20px;

  @media (max-width: 768px) {
    justify-content: center;
    flex-direction: column;
  }
}

.mount {
  font: normal normal bold 40px/50px "brandon-grotesque";
  letter-spacing: 0.8px;

  @media (max-width: 768px) {
    text-align: center;
  }
}

.nutritionButton {
  margin-top: 50px;
}

.productDetailBenefits {
  position: relative;
  padding-inline: 4rem;

  @media (max-width: 768px) {
    padding-inline: 2rem;
    margin: 0 0 -1px;
  }

  &:before {
    content: "";
    width: 102%;
    height: 226px;
    background: #638c2e;
    -webkit-clip-path: url(#legumesPath);
    clip-path: url(#legumesPath);
    position: absolute;
    left: 0;
    top: -224px;

    @media (max-width: 800px) {
      height: 62px;
      top: -60px;
    }
  }

  .productDetailBenefits-title {
    letter-spacing: 0;
    text-transform: uppercase;
    padding-top: 4rem;

    @media (max-width: 768px) {
      text-align: center;
    }

    .t1 {
      opacity: 0.5;
      color: #815842;
      font: normal normal bold 180px/118px Chaumont;
      display: block;

      @media (max-width: 768px) {
        font: normal normal bold 63px/60px Chaumont;
      }
    }

    .t2,
    .t3 {
      color: white;
      font: normal normal bold 70px/80px Chaumont;
      display: block;
      padding-top: 30px;

      @media (max-width: 768px) {
        font: normal normal bold 40px/42px Chaumont;
        padding-top: 5px;
      }
    }

    .t2 {
      display: block;

      @media (max-width: 768px) {
        display: none;
      }
    }

    .t3 {
      display: none;

      @media (max-width: 768px) {
        display: block;
      }
    }
  }

  .productDetailBenefits-container {
    display: flex;
    flex-direction: row;
    gap: 40px;
    padding-bottom: 300px;
    flex-wrap: wrap;
    max-width: 1680px;
    position: relative;
    margin-inline: auto;

    @media (max-width: 1200px) {
      gap: 0;
    }

    @media (max-width: 768px) {
      flex-direction: column;
      gap: 20px;
      padding-bottom: 200px;
    }

    .benefit {
      width: 48%;
      position: relative;
      z-index: 2;
      min-height: 80px;

      @media (max-width: 768px) {
        width: 100%;
      }

      p {
        background: #ffffff 0% 0% no-repeat padding-box;
        box-shadow: 10px 20px 30px #00000029;
        border-radius: 30px;
        opacity: 0.8;
        margin: 5px;
        text-align: center;
        font: normal normal bold 40px/39px "brandon-grotesque";
        letter-spacing: 0;
        color: #497137;
        padding: 10px;
        max-width: 400px;
        width: 100%;
        display: block;

        @media (max-width: 1200px) {
          font: normal normal bold 28px/30px Brandon Grotesque;
        }

        @media (max-width: 768px) {
          display: none;
          font: normal normal bold 18px/20px Brandon;
        }
      }

      span {
        background: #ffffff 0% 0% no-repeat padding-box;
        box-shadow: 10px 20px 30px #00000029;
        border-radius: 50%;
        width: 40px;
        height: 40px;
        justify-content: center;
        align-items: center;
        font-size: 40px;
        opacity: 0.8;
        color: #497137;
        cursor: pointer;
        font: normal normal bold 35px/50px Brandon;
        display: none;

        @media (max-width: 768px) {
          display: flex;
        }
      }
    }
  }
}

.brigth {
  justify-items: end;
  place-self: start;
}

.benefitImagen {
  position: absolute;
  top: -150px;
  left: calc(50% - 160px);
  width: 325px;
  transform: rotate(50deg);
  z-index: 1;

  @media (max-width: 1200px) {
    width: 250px;
  }

  @media (max-width: 768px) {
    top: -25px;
    left: calc(50% - 75px);
    width: 150px;
  }
}

.title-center {
  text-align: center;
  padding-top: 50px;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 20px;
  flex-wrap: wrap;
}

.d-none {
  display: none !important;
}

.d-block {
  display: block !important;
}

.shiftTitle {
  position: static;
  width: auto;
}

/*  GENERICO SIN ID */
body.single-product.productDetail h1 {
  font-size: 7.629rem; /* 267px */
  opacity: 0.7;
  padding: 0 70px 0 0;
  margin: 13px 0 53px 0;
}

body.single-product.productDetail h1 span {
  font-size: 4.886rem; /* 171px */
  margin: 8px 0 0;
}

body.single-product.productDetail .deco0 {
  display: block;
  position: absolute;
  left: calc(50% - 890px);
  top: -196px;
  width: 1140px;
  height: 750px;
  transform: scale(0.4);
}

body section,
body.single-product section {
  margin: -15px 0 0 0;
}

body.single-product section {
  margin: 15px 0 0 0;
}

header .logo {
  width: 100px;
  height: 50px;
}

@media screen and (min-width: 810px) and (max-width: 1279px) {
  header .logo {
    width: 140px;
    height: 50px;
  }
}

@media screen and (min-width: 1280px) {
  header .logo {
    width: 220px;
    height: 100px;
  }
}


body.single-product.postid-27 .productDetailTop .productDetail .productDetail-content .gridBlock,
body.single-product.postid-164 .productDetailTop .productDetail .productDetail-content .gridBlock,
body.single-product.postid-154 .productDetailTop .productDetail .productDetail-content .gridBlock,
body.single-product.postid-162 .productDetailTop .productDetail .productDetail-content .gridBlock  {
  @media (max-width: 768px) {
    margin-top: 8rem;
  }
}