.elementor-6583 .elementor-element.elementor-element-4037d401{--display:flex;--min-height:100vh;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:center;}.elementor-6583 .elementor-element.elementor-element-4037d401:not(.elementor-motion-effects-element-type-background), .elementor-6583 .elementor-element.elementor-element-4037d401 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}.elementor-6583 .elementor-element.elementor-element-599d984{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-6583 .elementor-element.elementor-element-4c8c24d{--display:flex;}.elementor-6583 .elementor-element.elementor-element-15a78539{--display:flex;--position:absolute;--align-items:flex-end;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );top:25px;--z-index:999;}body:not(.rtl) .elementor-6583 .elementor-element.elementor-element-15a78539{left:25px;}body.rtl .elementor-6583 .elementor-element.elementor-element-15a78539{right:25px;}body:not(.rtl) .elementor-6583 .elementor-element.elementor-element-70fdd589{right:-49px;}body.rtl .elementor-6583 .elementor-element.elementor-element-70fdd589{left:-49px;}.elementor-6583 .elementor-element.elementor-element-70fdd589{top:31px;text-align:center;}.elementor-6583 .elementor-element.elementor-element-70fdd589 img{width:39%;opacity:0.7;}.elementor-6583 .elementor-element.elementor-element-32c9fb83{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-6583 .elementor-element.elementor-element-60706a24{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--overlay-opacity:0.37;}.elementor-6583 .elementor-element.elementor-element-60706a24:not(.elementor-motion-effects-element-type-background), .elementor-6583 .elementor-element.elementor-element-60706a24 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-astglobalcolor4 );background-image:url("https://arquiteturaviva.com/wp-content/uploads/2025/11/02.jpg");background-position:center center;background-repeat:no-repeat;background-size:cover;}.elementor-6583 .elementor-element.elementor-element-60706a24::before, .elementor-6583 .elementor-element.elementor-element-60706a24 > .elementor-background-video-container::before, .elementor-6583 .elementor-element.elementor-element-60706a24 > .e-con-inner > .elementor-background-video-container::before, .elementor-6583 .elementor-element.elementor-element-60706a24 > .elementor-background-slideshow::before, .elementor-6583 .elementor-element.elementor-element-60706a24 > .e-con-inner > .elementor-background-slideshow::before, .elementor-6583 .elementor-element.elementor-element-60706a24 > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{background-color:#FFFFFF;--background-overlay:'';}.elementor-6583 .elementor-element.elementor-element-98005ae{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-6583 .elementor-element.elementor-element-98005ae.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-6583 .elementor-element.elementor-element-5897c992{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-6583 .elementor-element.elementor-element-5897c992.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-6583 .elementor-element.elementor-element-eaa6a0c{--grid-row-gap:35px;--grid-column-gap:30px;}.elementor-6583 .elementor-element.elementor-element-eaa6a0c .elementor-posts-container .elementor-post__thumbnail{padding-bottom:calc( 0.66 * 100% );}.elementor-6583 .elementor-element.elementor-element-eaa6a0c:after{content:"0.66";}.elementor-6583 .elementor-element.elementor-element-eaa6a0c .elementor-post__thumbnail__link{width:100%;}.elementor-6583 .elementor-element.elementor-element-eaa6a0c .elementor-post__meta-data span + span:before{content:"///";}.elementor-6583 .elementor-element.elementor-element-eaa6a0c.elementor-posts--thumbnail-left .elementor-post__thumbnail__link{margin-right:20px;}.elementor-6583 .elementor-element.elementor-element-eaa6a0c.elementor-posts--thumbnail-right .elementor-post__thumbnail__link{margin-left:20px;}.elementor-6583 .elementor-element.elementor-element-eaa6a0c.elementor-posts--thumbnail-top .elementor-post__thumbnail__link{margin-bottom:20px;}.elementor-6583 .elementor-element.elementor-element-60a2e88c{--display:flex;}.elementor-6583 .elementor-element.elementor-element-4e57479b{--display:flex;}.elementor-6583 .elementor-element.elementor-element-6f34b8c2 .elementor-icon-list-icon i{color:var( --e-global-color-astglobalcolor4 );transition:color 0.3s;}.elementor-6583 .elementor-element.elementor-element-6f34b8c2 .elementor-icon-list-icon svg{fill:var( --e-global-color-astglobalcolor4 );transition:fill 0.3s;}.elementor-6583 .elementor-element.elementor-element-6f34b8c2{--e-icon-list-icon-size:18px;--icon-vertical-offset:2px;}.elementor-6583 .elementor-element.elementor-element-6f34b8c2 .elementor-icon-list-icon{padding-inline-end:0px;}.elementor-6583 .elementor-element.elementor-element-6f34b8c2 .elementor-icon-list-text{color:var( --e-global-color-astglobalcolor4 );transition:color 0.3s;}@media(max-width:767px){.elementor-6583 .elementor-element.elementor-element-60706a24{--min-height:0px;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-6583 .elementor-element.elementor-element-60706a24:not(.elementor-motion-effects-element-type-background), .elementor-6583 .elementor-element.elementor-element-60706a24 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-position:center center;background-repeat:no-repeat;background-size:cover;}.elementor-6583 .elementor-element.elementor-element-eaa6a0c .elementor-posts-container .elementor-post__thumbnail{padding-bottom:calc( 0.5 * 100% );}.elementor-6583 .elementor-element.elementor-element-eaa6a0c:after{content:"0.5";}.elementor-6583 .elementor-element.elementor-element-eaa6a0c .elementor-post__thumbnail__link{width:100%;}}@media(min-width:768px){.elementor-6583 .elementor-element.elementor-element-4037d401{--width:1600px;}.elementor-6583 .elementor-element.elementor-element-98005ae{--width:23.615%;}.elementor-6583 .elementor-element.elementor-element-5897c992{--width:50%;}}@media(max-width:1024px) and (min-width:768px){.elementor-6583 .elementor-element.elementor-element-5897c992{--width:373.5px;}}@media(min-width:1025px){.elementor-6583 .elementor-element.elementor-element-60706a24:not(.elementor-motion-effects-element-type-background), .elementor-6583 .elementor-element.elementor-element-60706a24 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-attachment:scroll;}}/* Start custom CSS for container, class: .elementor-element-4037d401 */<section class="av-video-hero">
  <div class="av-video-slider">

    <!-- SLIDE 1 -->
    <div class="av-slide active">
      <video autoplay muted loop playsinline preload="auto">
        <source src="https://arquiteturaviva.com/wp-content/uploads/2026/04/V1.mp4" type="video/mp4">
      </video>

      <div class="av-text av-text-main">
        <span>por onde for,</span>
        <strong>NATUREZA!</strong>
      </div>
    </div>

    <!-- SLIDE 2 -->
    <div class="av-slide">
      <video autoplay muted loop playsinline preload="auto">
        <source src="URL-VIDEO-2.mp4" type="video/mp4">
      </video>

      <div class="av-text">
        <span>onde o hóspede descansa</span>
        <span>e a alma floresce</span>
      </div>
    </div>

    <!-- SLIDE 3 -->
    <div class="av-slide">
      <video autoplay muted loop playsinline preload="auto">
        <source src="URL-VIDEO-3.mp4" type="video/mp4">
      </video>

      <svg class="av-curved-text" viewBox="0 0 500 300">
        <path id="curve" d="M90,180 C150,40 350,40 420,180" fill="transparent"/>
        <text>
          <textPath href="#curve" startOffset="50%" text-anchor="middle">
            design que inspira
          </textPath>
        </text>
      </svg>
    </div>

    <!-- DUPLICA ESTOS PARA LOS VIDEOS 4, 5, 6 Y 7 -->
    
    <button class="av-arrow av-prev" aria-label="Anterior">‹</button>
    <button class="av-arrow av-next" aria-label="Próximo">›</button>

    <nav class="av-menu">
      <a href="#">projetos</a>
      <a href="#">conhecimento</a>
      <a href="#">loja</a>
      <a href="#">sobre nós</a>
    </nav>

  </div>
</section>

<style>
@font-face {
  font-family: 'Barcolen2';
  src: url('URL-DE-LA-FUENTE-BARCOLEN2.woff2') format('woff2');
  font-weight: normal;
  font-style: normal;
}

.av-video-hero {
  width: 100%;
  height: 100vh;
  min-height: 620px;
  position: relative;
  overflow: hidden;
  background: #000;
}

.av-video-slider,
.av-slide {
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0;
}

.av-slide {
  opacity: 0;
  pointer-events: none;
  transition: opacity 900ms ease;
}

.av-slide.active {
  opacity: 1;
  pointer-events: auto;
  z-index: 2;
}

.av-slide video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.av-slide::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.18);
  z-index: 1;
}

.av-text {
  position: absolute;
  z-index: 5;
  top: 46%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-family: 'Barcolen2', sans-serif;
  color: rgba(255,255,255,.72);
  text-align: center;
  font-size: clamp(34px, 6vw, 86px);
  line-height: .95;
  letter-spacing: .04em;
  width: 90%;
}

.av-text span,
.av-text strong {
  display: block;
  font-weight: normal;
}

.av-text-main strong {
  text-transform: uppercase;
  font-size: 1.08em;
}

.av-menu {
  position: absolute;
  z-index: 10;
  bottom: 9%;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  gap: clamp(28px, 7vw, 110px);
  align-items: center;
  justify-content: center;
  width: 90%;
}

.av-menu a {
  font-family: 'Barcolen2', sans-serif;
  color: rgba(255,255,255,.86);
  text-decoration: none;
  font-size: clamp(18px, 2vw, 26px);
  letter-spacing: .05em;
  transition: transform .25s ease, color .25s ease, opacity .25s ease;
}

.av-menu a:hover {
  transform: scale(1.08);
  color: #fff;
}

.av-arrow {
  position: absolute;
  z-index: 20;
  top: 50%;
  transform: translateY(-50%);
  width: 28px;
  height: 28px;
  border-radius: 50%;
  border: 0;
  background: rgba(255,255,255,.72);
  color: rgba(40,70,55,.9);
  font-size: 24px;
  line-height: 24px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background .25s ease, transform .25s ease;
}

.av-arrow:hover {
  background: #fff;
  transform: translateY(-50%) scale(1.08);
}

.av-prev {
  left: 11%;
}

.av-next {
  right: 4%;
}

.av-curved-text {
  position: absolute;
  z-index: 5;
  top: 12%;
  left: 22%;
  width: 38vw;
  max-width: 520px;
  min-width: 280px;
}

.av-curved-text text {
  font-family: 'Barcolen2', sans-serif;
  font-size: 38px;
  fill: rgba(255,255,255,.72);
  letter-spacing: .05em;
}

/* Ocultar redes sociales anteriores */
.av-rrss {
  display: none !important;
}

/* Tablet */
@media (max-width: 1024px) {
  .av-video-hero {
    min-height: 720px;
  }

  .av-prev {
    left: 5%;
  }

  .av-next {
    right: 5%;
  }

  .av-menu {
    gap: 42px;
    bottom: 8%;
  }

  .av-curved-text {
    left: 16%;
    width: 52vw;
  }
}

/* Mobile */
@media (max-width: 768px) {
  .av-video-hero {
    height: 100vh;
    min-height: 620px;
  }

  .av-text {
    top: 45%;
    font-size: clamp(34px, 11vw, 58px);
    line-height: 1;
  }

  .av-menu {
    bottom: 7%;
    flex-wrap: wrap;
    gap: 16px 28px;
  }

  .av-menu a {
    font-size: 18px;
  }

  .av-arrow {
    width: 26px;
    height: 26px;
    font-size: 22px;
  }

  .av-prev {
    left: 18px;
  }

  .av-next {
    right: 18px;
  }

  .av-curved-text {
    top: 16%;
    left: 8%;
    width: 80vw;
  }

  .av-curved-text text {
    font-size: 32px;
  }
}
</style>

<script>
document.addEventListener("DOMContentLoaded", function () {
  const slides = document.querySelectorAll(".av-slide");
  const next = document.querySelector(".av-next");
  const prev = document.querySelector(".av-prev");
  let current = 0;
  let timer;

  function showSlide(index) {
    slides[current].classList.remove("active");
    current = (index + slides.length) % slides.length;
    slides[current].classList.add("active");

    const video = slides[current].querySelector("video");
    if (video) {
      video.currentTime = 0;
      video.play();
    }
  }

  function nextSlide() {
    showSlide(current + 1);
  }

  function prevSlide() {
    showSlide(current - 1);
  }

  function startAuto() {
    timer = setInterval(nextSlide, 7000);
  }

  function resetAuto() {
    clearInterval(timer);
    startAuto();
  }

  next.addEventListener("click", function () {
    nextSlide();
    resetAuto();
  });

  prev.addEventListener("click", function () {
    prevSlide();
    resetAuto();
  });

  startAuto();
});
</script>/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-60706a24 */@media (max-width:768px){

.av-footerband{
  position: relative;
  background-position: center center !important;
  background-size: cover !important;
  background-repeat: no-repeat !important;
}

.av-footerband:before{
  content:"";
  position:absolute;
  inset:0;
  background: rgba(0,0,0,.35);
  pointer-events:none;
  z-index:0;
}

.av-footerband .e-con-inner,
.av-footerband .elementor-container{
  position: relative;
  z-index:1;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  text-align:center !important;
  gap:14px !important;
  padding:28px 18px !important;
}

.av-footerband .elementor-widget-image{
  margin:0 auto 8px auto !important;
}

.av-footerband .elementor-icon-list-items{
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  gap:10px !important;
}

.av-footerband .elementor-icon-list-item{
  justify-content:center !important;
}

.av-footerband .elementor-icon-list-text{
  font-size:16px !important;
  line-height:1.2 !important;
}

.av-footerband .elementor-icon-list-icon{
  margin-right:10px !important;
}

}/* End custom CSS */