/* Section Hero */

.c-hero .owl-nav img {
  filter: brightness(0) invert(1);
}


@media only screen and (max-width: 767px) {
  .c-hero .content {
    padding-bottom: 88px;
  }

  .c-hero h2 {
    font-size: var(--fs-h3);
    line-height: 32px;
  }

  .c-hero-slider-counter {
    padding: 0px;
    bottom: 30px;
    left: 16px;
  
  }

  .c-hero-slider-counter .slider-counter-box,
  .c-hero-slider-counter .cantidad {
    color: var(--grey-900);
  }

  .c-hero .owl-nav img {
    filter: none;
  }
}

@media only screen and (min-width: 767px) {
  /* .c-hero-slider-counter {
    background-color: red;
  } */
}

@media (min-width: 768px) and (max-width: 868px) {
  .c-hero-slider-counter {
    right: 0px;
  }
}

.c-hero-link .button--primary {
  position: relative;
  display: block;
  text-align: center;
}

@media (min-width: 765px) and (max-width: 1199px) {
  .c-hero {
    margin-bottom: 80px;
  }

  .c-hero-slider-counter {
    right: 38px;
    bottom: 7px;
  }

  .c-hero .content {
    padding: 36px 36px 40px 0px;
    width: 422px;
  }

  .c-hero-link .button--primary {
    position: relative;
    max-width: 100px;
    display: block;
  }

  /* .c-hero-link .button--primary:after {
    content: "";
    background: url("../images/icons/icon_play.svg") no-repeat center center;
    position: absolute;
    right: 20px;
    width: 24px;
    height: 24px;
  } */
}

@media only screen and (min-width: 1200px) {
  .c-hero .content {
    padding: 36px 36px 20px 0;
  }
}

/* Section Soluciones */

@media only screen and (max-width: 767px) {
  .section-soluciones h2 {
    font-size: var(--fs-h3);
    line-height: 32px;
  }
}


/* Section Pilares */

.section-pilares .item {
  padding: 0px 10px;
}

@media only screen and (max-width: 1200px) {
  .owl-pilares .owl-stage {
    padding-left: 0px !important;
  }

  .section-pilares .c-slider-counter-box .counter-box {
    margin-right: 30px;
  }
}

@media only screen and (max-width: 767px) {
  .section-pilares h2 {
    font-size: var(--fs-600);
  }
}

@media (min-width: 768px) and (max-width: 1199px) {
  .section-pilares {
    margin-top: 80px;
    margin-bottom: 60px;
  }

  .section-pilares h2 {
    font-size: var(--fs-750);
  }

  .beneficios-container,
  .holcim-container {
    padding-left: 35px;
  }
}

@media (min-width: 1200px) {
  .section-pilares {
    margin-bottom: 100px;
  }
}


/* Section Productos */

.section-productos {
  padding-top: 80px;
  margin-bottom: 50px;
}

@media only screen and (max-width: 767px) {
  .section-productos h2 {
    font-size: var(--fs-800);
    line-height: 52px;
  }

  .section-productos {
    padding-top: 0px;
    margin-bottom: 10px;
  }
}

@media (min-width: 768px) and (max-width: 1199px) {
  .section-productos {
    padding-top: 60px;
  }

  .section-productos h2 {
    font-size: var(--fs-800);
    width: 70%;
  }

  .section-productos p {
    width: 70%;
  }
}


/* Section Proveedores */

.section-proveedores .c-box-gray-call-to-action {
  background: url("../images/proveedores-ypf.webp") center center no-repeat;
  background-size: cover;
}

.section-proveedores .c-box-gray-call-to-action:before {
  content: "";
  display: none;
}

@media only screen and (max-width: 767px) {
  .section-proveedores .button--primary {
    display: block;
  }
}


/* Section Sustentabilidad */

.sustentabilidad-row {
  display: flex;
  align-items: flex-start;
  padding-top: 35px;
}

.sustentabilidad-row img {
  font-weight: 300;
  color: var(--primary-700);
  margin-bottom: 12px;
  font-size: 16px;
  line-height: 22px;
  width: 20px !important;
  margin-right: 20px !important;
  margin-top: 3px;
}

.sustentabilidad-row p {
  font-size: var(--fs-200);
  line-height: 18px;
  color: var(--grey-700);
}

.section-sustentabilidad .c-button {
  max-width: 216px;
}

.section-sustentabilidad {
  margin-top: 50px;
  margin-bottom: 30px;
}

@media only screen and (max-width: 767px) {
  .section-sustentabilidad h2 {
    font-size: 40px;
    line-height: 44px;
  }

  .section-sustentabilidad {
    margin-top: 60px;
    margin-bottom: 0px;
  }

  .section-sustentabilidad .c-button {
    max-width: 100%;
  }

  /* .img-sustentabilidad-sm {
    visibility: hidden;
    display: none;
  } */

  .container-sustentabilidad-row {
    margin-bottom: 40px;
  }
}

@media only screen and (min-width: 768px) {

  .sustentabilidad-row img,
  .sustentabilidad-row p {
    display: inline-block;
    vertical-align: top;
    width: 37px;
    margin: 0;
  }

  .sustentabilidad-row p {
    width: calc(100% - 37px);
    line-height: 22px;
  }

  .sustentabilidad-row {
    padding-top: 25px;
  }

  /* .img-sustentabilidad-sm {
    visibility: hidden;
  } */

  .section-sustentabilidad p {
    margin-bottom: 20px;
  }

  .container-sustentabilidad-row {
    margin-bottom: 40px;
  }
}

@media (min-width: 768px) and (max-width: 1199px) {
  /* .section-sustentabilidad h2 {
    font-size: var(--fs-850);
  } */



  .section-sustentabilidad p {
    margin-bottom: 0px;
  }

  /* .img-sustentabilidad {
    visibility: hidden;
  } */

  /* .img-sustentabilidad-sm {
    visibility: visible;
  } */

  .c-hero-simple figure {
    align-items: flex-start;
    padding-top: 80px;
    padding-left: 15px;
  }

  .sustentabilidad-row {
    padding: 12px 0px;
  }

  .columna-sustentabilidad {
    padding-left: 10px;
  }

  .container-sustentabilidad-row {
    margin-bottom: 0px;
  }
}

@media (min-width: 768px) and (max-width: 1024px) {
  .section-sustentabilidad {
    margin-top: 0px;
    padding: 42px 0px;
  }

}
@media only screen and (min-width: 1200px) {

  .c-hero-simple .wrapper {
    padding-top: 0px;
  }

  .section-sustentabilidad h2 {
    font-size: var(--fs-900);
  }

  .img-sustentabilidad-sm {
    visibility: hidden;
  }

  .section-sustentabilidad p {
    margin-bottom: 8px;
  }

  .container-sustentabilidad-row {
    margin-bottom: 40px;
  }

  .c-hero-simple figure {
    align-items: flex-start;
    padding-top: 90px;
  }

  .columna-sustentabilidad {
    padding-right: 0px;
  }
}


/* Section Logos */

.logos {
  margin-top: 60px;
  padding: 40px;
  overflow: hidden;
}

.owl-logos a:before {
  content: "";
  position: absolute;
  right: -30px;
  top: -10px;
  background: url("../images/icons/arrow-blue.webp") center center no-repeat;
  background-size: contain;
  width: 14px;
  display: block;
  -moz-transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transform: rotate(180deg);
  height: 48px;
}

.owl-logos .item {
  display: flex;
  align-items: center;
  justify-items: center;
  text-align: center;
}

.owl-logos a {
  opacity: 0.4;
  position: relative;
  display: flex;
  -webkit-transition: all 250ms ease-in-out;
  -moz-transition: all 250ms ease-in-out;
  -ms-transition: all 250ms ease-in-out;
  -o-transition: all 250ms ease-in-out;
  transition: all 250ms ease-in-out;
}

.owl-logos a:hover {
  opacity: 1;
}

.owl-logos {
  padding: 65px 0px 0px 0px;
}

@media only screen and (max-width: 767px) {
  .logos {
    margin-top: 40px;
  }

  /* .owl-logos {
    padding: 40px 0px 52px 15px !important;
  } */

  .logos {
    padding: 0px;
    background: url(../images/dots.webp) no-repeat right bottom;
  }
}

@media (min-width: 768px) and (max-width: 1199px) {
  .logos {
    margin-top: 90px;
    padding: 40px 0px 20px 0px;
  }

  .owl-logos {
    padding: 45px 0px 0px 38px;
  }
}

/* Section Preguntas Frecuentes */

@media only screen and (max-width: 767px) {
  .section-preguntas-frecuentes h2 {
    margin-bottom: 20px;
  }

  .section-preguntas-frecuentes .c-button {
    display: none !important;
  }

  .section-preguntas-frecuentes #accordion-button-1 {
    padding-left: 0px;
  }

  .section-preguntas-frecuentes .c-accordion button .icon::after {
    top: 19px;
  }

  .section-preguntas-frecuentes small {
    margin-bottom: 0px;
  }

  .section-preguntas-frecuentes h2 {
    margin-bottom: 10px;
  }

  .columna-preguntas-frecuente {
    padding-bottom: 35px;
  }
}

@media (min-width: 768px) and (max-width: 1199px) {
  .columna-preguntas-frecuentes {
    padding-top: 75px;
  }
  .section-preguntas-frecuentes p {
    padding-right: 0px;
  }
  .c-accordion button .icon::after {
    top: 10px;
    right: 0px;
  }
}


/* Section Blog */

.badge {
  position: absolute;
  top: 25px;
  left: 22px;
  background-color: var(--grey-50);
  padding: 5px 10px;
  border-radius: 100px;
  color: var(--primary-700);
  font-size: 14px;
}

.section-blog {
  background-color: var(--grey-50);
}

.slider-blog {
  padding-bottom: 100px;
}

@media only screen and (max-width: 767px) {
  .section-blog {
    padding-top: 16px;
  }

  .section-blog h2 {
    font-size: var(--fs-900);
    margin-bottom: 25px;
  }

  .slider-blog {
    padding-left: 16px;
  }
  #nav-blog {
    margin-top: 20px;
  }
  #nav-blog .owl-prev {
    -moz-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
    position: relative;
    top: 1px;
  }

  .slider-blog {
    padding-bottom: 50px;
  }

  .slider-blog .owl-nav {
    display: inline-block;
    vertical-align: middle;
    margin-left: 20px;
  }

  .slider-blog .owl-nav button {
    background: transparent;
    border: 0;
    margin-right: 16px;
  }

  .slider-blog .owl-nav button img {
    width: 32px;
  }

  .slider-blog .owl-nav .disabled {
    opacity: .4;
    filter: grayscale(100%);
  }

  .slider-blog .slider-counter-box {
    display: inline-flex;
  }

  .slider-blog .c-box-image-text-link {
    padding-bottom: 0px;
  }

  .slider-blog .slider-counter-box {
    padding-bottom: 20px;
  }
}

@media (min-width: 768px) and (max-width: 1199px) {
  .section-blog {
    padding-top: 38px;

  }

  .section-blog .copy {
    width: 100%;
  }

  .section-blog h2 {
    font-size: var(--fs-900);
  }

  .badge {
    visibility: hidden;
  }

  .slider-blog {
    padding: 28px 0 50px 15px;
  }

  .owl-dots {
    display: none;
  }

  .c-box-image-text-link {
    padding-bottom: 38px;
  }
}

.c-button-margin {
  margin-top: 50px;
}



/******************************************
HOME NEGOCIOS - ESTILOS NO COMPONETIZADOS
*******************************************/
@media only screen and (min-width: 768px) {
  .sectionSustentabilidad .c-image {
    height: 655px;
  }
  .sectionSustentabilidad .c-button {
    margin-top: 20px;
  }
}