@media (max-width: 768px) {
    h1 { font-size: 52px!important; line-height: 1.2; }
    h2 { font-size: 36px!important;; line-height: 1.3; }
    h3 { font-size: 24px!important;; line-height: 1.4; }
    h4 { font-size: 20px!important;; line-height: 1.5; }
    h5 { font-size: 18px!important;; line-height: 1.5; }
    h6 { font-size: 16px!important;; line-height: 1.6; }
  .scroll-backhorizontal {
    height: 40vh !important;
    top: 0 !important;
    width: 100% !important;
  }
  .menu-one {
    display: none !important;
  }
   .menu-two {
    display: none !important;
  }
  .scroll-section {
    height: 70vh !important;
    width: 400% !important;
  }
  .title-hero {
    text-transform: uppercase;
      margin-top: 0;
      position: relative;
      bottom: 45vw !important;
      left: 1% !important;
  }
  .icon-hero {
    width: 90px !important;
    left: 90px !important;
  }
  .padding-section{
    padding: 10px !important ;
  }
  .row-header {
   padding: 32px 10px !important;
   display: flex;
   flex-direction: row;
   justify-content: space-between;
   top: 0px !important;
}
  .space-ser-sec {
    display: none !important;

  }
  .pin-spacer {
    margin: 0 !important;
    height: 2000px !important;
  }
  .image-hover-effect {
    opacity: 1 !important; 
    transform: translateX(0) !important; 
}
.image-left {
  display: none !important;
}
.image-right {
  display: none !important;
}
.img-flip {
  height: 60vh !important;
  width: 100% !important;
  left: 0 !important;
}
.parallax-container {
  min-width: 100% !important;
  max-width: 100% !important;
  min-height: 128vw !important;
  max-height: 128vw !important;
}

.parallax {
  min-width: 42vw !important;
        max-width: 42vw !important ;
        min-height: 56vw !important;
        max-height: 56vw !important;
}
.img-center {
  min-width: 42vw !important;
        max-width: 42vw !important;
        min-height: 56vw !important;
        max-height: 56vw !important;
}
.parallax-2 {
  min-width: 42vw !important;
  max-width: 42vw !important;
  min-height: 56vw !important;
  max-height: 56vw !important;
}
.menu-three {
  position: relative;
  display:flex !important;
}
}
.menu-three {
  display: none ;
}
.block-testemonial {
  height: 500px;
}
.scroll-backhorizontal {
    justify-content: flex-start;
    align-items: center;
    width: 100vw;
    height: 100vh;
    display: flex;
    position: relative;
}
.row-header {
    flex-flow: row;
    align-items: center;
    width: 100%;
    z-index: 1000;
    margin-left: auto;
    margin-right: auto;
    display: flex;
    position: fixed;
    top: 20px;
    overflow: hidden;
}
html, body {
  margin: 0 ;
  padding: 0;
  overflow-x: hidden; 
}

.scroll-container {
  width: 100vw;
  height: 100vh;
  overflow: hidden;
  position: relative;
  left: 0 !important;
}
.scroll-section {
  display: flex;
  width: 400vw; 
  height: 100vh;
  will-change: transform;
  transform: translateX(0); 
}
.scroll-section .section {
  flex: 1;
  height: 100vh;
  background-size: cover;
  background-position: center;
}
.pin-spacer {
  margin: 0 !important;
  
}
.title-hero {
  text-transform: uppercase;
    margin-top: 0;
    position: relative;
    bottom: 28vw;
    
}
.brands-wrapper {
    width: 251px;
   
    height: 251px;
    
}
.brands-img {
  opacity: 40%;

}
/* IMG-BLUR */
.reviews-avatar-wrapper {
  position: relative;
}
.avatar-reviews-image.blur {
  z-index: -1;
  opacity: .5;
  filter: blur(.25rem);
  position: absolute;
  inset: auto auto -.56vw -.56vw;
}

.contact-img-wrapper-1 {
  top: 2vw;
  left: 6vw;
  position: absolute;
  min-width: 14vw;
  min-height: 14vw;
}
.contact-img-wrapper-2 {
  top: 18vw;
    left: 11vw;
  overflow: visible;
  position: absolute;
  min-width: 14vw;
  min-height: 14vw;
}
.contact-img-wrapper-3 {
  top: 2vw;
    right: 12vw;
  overflow: visible;
  position: absolute;
  min-width: 14vw;
  min-height: 14vw;
}
.contact-img-wrapper-4 {
  top: 18vw;
    right: 17vw;
  overflow: visible;
  position: absolute;
  min-width: 14vw;
  min-height: 14vw;
}
.conteiner-cta-wrapper {
  position: relative;
}
.contact-img-wrapper-blur-1 {
  opacity: .3;
  filter: blur(1rem);
  min-width: 11.1vw;
  max-width: 11.1vw;
  min-height: 11.1vw;
  max-height: 11.1vw;
  position: absolute;
  inset: auto auto 0% 0%;
  z-index: -1;
}
/* REVEAL-ARCCODION */
.reveal-element {
  overflow: hidden;
}
.reveal-element {
  
  opacity: 0;
  transform: scaleX(0);
  transform-origin: center;
}
/* REVEAL-VERTICAL */
.reveal {
  opacity: 0; 
  transform: translateY(50px); 
  transition: opacity 1s ease, transform 1s ease; 
}
.reveal.show {
  opacity: 1;
  transform: translateY(0);
}
/* IMAGE-HOVER */
.default-img {
  width: 100%;
}
 .works-pala{
  width: 100%;
    max-width: none;
    margin-left: auto;
    margin-right: auto;
    overflow: hidden;
}
.works-single-img {
  aspect-ratio: 16 / 9;
    min-width: 100%;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    overflow: hidden;
}
.works-container {
  aspect-ratio: 16 / 9;
    min-width: 100%;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    overflow: hidden;
}
.works-single-img img {
  display: block;
  width: 100%;
  top: 50px;
} 

.image-hover {
  position: relative;
  display: inline-block;
  overflow: hidden;
}

.image-hover img {
  display: block;
  width: 100%;
  transition: opacity 0.3s ease-in-out;
}

.image-hover .hover-img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  transition: opacity 0.3s ease-in-out;
  opacity: 0;
}

.image-hover:hover .hover-img {
  opacity: 1;
}

.image-hover:hover .default-img {
  opacity: 0;
}
/* IMAGE-HOVER */
.overlay-image {
  position: absolute;
  top: 40%;
  left: 50%;
  
  transform: translate(-50%, -50%);
  transition: all 0.4s ease-in-out;
  opacity: 0.5;
}

.image-container:hover .overlay-image {
  width: 100px;
  height: 120px;
  top: 80%;
  left: 95%;
  transform: translate(-80%, -80%); 
  z-index: 10;
}
/* IMAGE-HOVER-HOZONTAL */
.ser-hover-wrapper {
  position: relative;
  overflow: hidden; 
  height: 250px;
}

.image-hover-effect {
  position: absolute;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0; 
  transform: translateX(100%); 
}
/* IMAGE-HOVER-EXPARSE */
.image-spacer {
  position: relative;
  width: 100%;
  
  overflow: hidden; 
}
.image-hover-spacer {
  width: 100%;
  height: 100%;
  object-fit: cover; 
  transition: transform 0.3s ease-in-out; 
}

.image-spacer:hover .image-hover-spacer {
  transform: scale(1.1); 
}
/* H-BORDER */
.outline-white {
  color: var(--wp--preset--color--transparent);
  -webkit-text-stroke-width: .07vw;
  -webkit-text-stroke-color:var(--wp--preset--color--text-color);
}


/* PARALLAX */
.parallax-container {
  position: relative;
  min-height: 44vw;
  max-height: 44vw;
  min-width: 30vw;
  max-width: 30vw;
  display: flex;
}

.parallax {
  z-index: -1;
  position: absolute;
  inset: 0% auto auto 0%;
  object-fit: cover;
    object-position: 30% 50%;
    min-width: 15vw;
    max-width: 15vw;
    min-height: 22vw;
    max-height: 22vw;
  transform: translateY(0);
  transition: transform 0.1s linear;
}
.img-center {
  object-fit: cover;
  object-position: 30% 50%;
  min-width: 15vw;
  max-width: 15vw;
  min-height: 22vw;
  max-height: 22vw;
}
.parallax-2 {
  z-index: 1;
    position: absolute;
    inset: auto 0% 0% auto;
  object-fit: cover;
    object-position: 30% 50%;
    min-width: 15vw;
    max-width: 15vw;
    min-height: 22vw;
    max-height: 22vw;
  transform: translateY(0);
  transition: transform 0.1s linear;
}
.works-parallax  {
  width: 110% !important; 
  height: auto;
  transition: transform 0.1s ease-out; 
  will-change: transform; 
  display: block;
}
/* IMAGE-HOVER-EXPARSE */
.img-extend {
  position: relative;
  width: 100%;
  max-width: none;
  margin-left: auto;
  margin-right: auto;
  overflow: hidden; 
}
.img-extend-hover {
  width: 100%;
  height: 100%;
  object-fit: cover; 
  transition: transform 0.3s ease-in-out;
}
.img-extend {
  position: relative;
  width: 100% !important;
  overflow: hidden; 
}
.img-extend-hover img {
  display: block;
  width: 100%;
  
}
.img-extend:hover .img-extend-hover {
  transform: scale(1.1); 
}