@charset "UTF-8";


@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');

html, body{ overflow-x: hidden !important;  scroll-behavior: smooth;}
body{background-image: url("../img/background1.webp");background-position: center top; background-repeat: no-repeat; background-size: cover;}
.container{max-width: 1540px; }
div{ scroll-margin-top: 50px;}
#topo{padding: 45px 0; background-color: #111008;}
.navbar-brand img{width: 100%;}
.navbar .container-fluid {display: flex;justify-content: center;align-items: center; gap: 60px;}
.navbar-collapse {flex-grow: 0;}
.navbar-nav {display: flex;gap: 50px;}
.nav-link{ font-family: "Roboto", sans-serif; font-size: 18px; color: #e0e3b8; transition: all .3s;}
.nav-link:hover{color: #abad8a; transition: all .3s;}

.banner {padding-top: 30px ;display: flex;justify-content: center;}
.banner .container{position: relative;}
.imagem-banner img{width: 100%;}
.titulo {display: flex;align-items: center;justify-content: space-between;gap: 15px; margin: 30px 0;}
.titulo h2 { font-family: "Roboto", sans-serif;font-weight: 900;font-size: 27px;white-space: nowrap;margin: 0;text-transform: uppercase;color: #e0e3b8; letter-spacing: -1px; padding-left: 60px;}
.titulo img {max-height: 20px;}


.slider { width: 100%;overflow: hidden;position: relative;}
.track {display: flex;width: calc(480px * 10); animation: scroll 100s linear infinite;}
.slide {width: 480px;flex-shrink: 0;padding: 0 5px;position: relative; /* IMPORTANTE */overflow: hidden;border-radius: 32px;}
.slider::after {content: "";position: absolute;bottom: 0;left: 0;width:100%;height: 180px; background: linear-gradient( to top, rgba(0,0,0,4.8), rgba(0,0,0,0.4),rgba(0,0,0,0));pointer-events: none;}
.slide img { width: 100%;height: 100%;object-fit: cover;}
.overlay-texto{ position: absolute;bottom: 20px;left: 0;width: 100%;padding: 60px 150px; box-sizing: border-box;z-index: 2;display: flex;justify-content: left;}

@keyframes scroll {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-2400px); /* 5 slides */
  }
}

.para-sempre {display: grid;grid-template-columns: 1fr 1fr;margin: 40px 0;}
.box {border-radius: 20px;overflow: hidden;}
.box-black-ouro { background: #111008;color: #e0e3b8;padding: 0 60px;height: 100%;display: flex;flex-direction: column;justify-content: center;}
.box-black-ouro h3 {font-family: "Roboto", sans-serif; font-weight: 900; letter-spacing: -1px; color: #e0e3b8;font-size: 25px;margin-bottom: 15px;line-height: 1;}
.box-black-ouro p {font-family: "Roboto", sans-serif;font-size: 20px;line-height: 1.2;color: #e0e3b8;}
.box-imagem img {width: 100%;height: 100%;object-fit: cover;display: block;}

.beneficios { display: grid;grid-template-columns: repeat(3, 1fr);gap: 30px;}
.card-beneficios{background-image: url("../img/overlay.png"); background-position: center top; background-repeat: no-repeat; background-size: cover;  border-radius: 20px; height: 80vh; margin: 30px 0;}
.card-imagem{width: 100%; height: 395px; overflow: hidden; border-radius: 20px;}
.card-imagem img{width: 100%; height: 100%; object-fit: cover;}
.overlay{ color: #e0e3b8; padding: 60px 40px; }
.overlay h3{font-family: "Roboto", sans-serif; font-size: 27px; font-weight: 900; letter-spacing: -1px; line-height: 1; padding-bottom: 30px;}
.overlay p{font-size: 22px;}
.aviso{margin: 10px 0 80px 0; text-align: center;}
.aviso p{color: #e0e3b8;}


.vantagens{position: relative;}
.linhas-overlay-left {position: absolute;top: -220px;left: 0;width: 50%;z-index: 5;pointer-events: none;}
.linhas-overlay-left img {display: block;width: 100%;max-width: 328px;margin-left: 0;margin-right: auto;}
.linhas-overlay-right {position: absolute;top: -220px;right: 0;width: 50%;z-index: 5;pointer-events: none;}
.linhas-overlay-right img { display: block; width: 100%; max-width: 328px; margin-left: auto; margin-right: 0;}
.plan-card{height: 100%;}
.plan-card-black{display: flex; align-items: center; justify-content: center; flex-direction: column; background-image: url("../img/black.png"); background-position: center top; background-repeat: no-repeat; background-size: cover;  border-radius: 20px; padding:70px 0;}
.plan-card-gold{display: flex; align-items: center;  flex-direction: column; background-image: url("../img/gold.png"); background-position: center top; background-repeat: no-repeat; background-size: cover; border-radius: 20px; padding:70px 0;}
.eyebrow {position: relative;width: fit-content;margin: 0 auto;font-family: "Roboto", sans-serif; font-size:16px;font-weight: 600;text-transform: uppercase;color: #c7aa4e;}
.eyebrow::before,
.eyebrow::after {content: "";position: absolute;top: 50%;width: 20px;height: 2px;background: currentColor;opacity: 0.35;}
.eyebrow::before {right: calc(100% + 10px);}
.eyebrow::after {left: calc(100% + 10px);}
.eyebrow1 {position: relative;width: fit-content;margin: 0 auto;font-family: "Roboto", sans-serif; font-size:16px;font-weight: 600;text-transform: uppercase;color: #e0e3b9;}
.eyebrow1::before,
.eyebrow1::after {content: "";position: absolute;top: 50%;width: 20px;height: 2px;background: currentColor;opacity: 0.35;}
.eyebrow1::before {right: calc(100% + 10px);}
.eyebrow1::after {left: calc(100% + 10px);}
.plan-title {margin: 0px 0 10px;text-align: center;font-family: "Roboto", sans-serif;font-weight: 900;font-size: 80px;transform: scaleX(1.3); letter-spacing: -4px; line-height: .8;}
.plan-card-black .plan-title {color: #e0e3b9;}
.plan-card-gold .plan-title {color: #111008;}
.section-tag {width: 45%; margin: 30px auto ;padding: 9px 14px;border-radius: 4px;text-align: center;text-transform: uppercase;font-size: 25px; background: #5e4a1f;color: #ddd8aa;}
.menor{font-size: 15px;}
.feature-list {position: relative; width: 500px;list-style: none;padding: 0;margin: 0 auto;display: grid;gap: 15px;}
.feature-list--compact {margin-top: 4px;}
.feature-item {position: relative;z-index: 1;display: grid;grid-template-columns: 89px minmax(0, 1fr);align-items: center;}
.feature-icon {display: grid;place-items: center;width: 89px;height: 89px;border-radius: 8px;background: #dfe2b7;color: #94803a;}
.feature-icon img {width: 65px;height: 65px;object-fit: contain;}
.feature-text {padding: 8px 12px 8px 10px;border-radius: 0px 12px 12px 0;font-size: 20px;line-height: 1.2;height: 70px;font-weight: 700;display: flex;flex-direction: column;justify-content: center;}
.feature-text p {margin: 0;}
.feature-text .cidade {font-size: 14px;  white-space: nowrap;}
.exclusivo{position: absolute; right: -100px;}
.plan-card-black .feature-text {background: #c8ab4f;color: #2d2614;}
.plan-card-gold .feature-text {background: #1f1b13;color: #d8c671;}
.collector-heading {margin: 60px 0 30px 0;}

.hospedagem{position: relative;}
.linhas-overlay-left1 {position: absolute; bottom: -125px;left: 0;width: 50%;z-index: 5;pointer-events: none;}
.linhas-overlay-left1 img {display: block;width: 100%;max-width: 328px;margin-left: 0;margin-right: auto;}
.linhas-overlay-right1 {position: absolute;bottom: -125px;right: 0;width: 50%;z-index: 5;pointer-events: none;}
.linhas-overlay-right1 img { display: block; width: 100%; max-width: 328px; margin-left: auto; margin-right: 0;}


.banner-final{position: relative; text-align: center;}
.banner-final img{width: 100%;}
.aviso-sobre {position: absolute;left: 50%;bottom: 80px;transform: translateX(-50%);background-color: #181709;padding: 8px;}
.aviso-sobre p{ color: #e0e3b8; font-family: "Roboto", sans-serif; margin: 0; white-space: nowrap;}

footer{padding: 175px 0 50px 0;}
footer .container{padding: 50px;}
footer h4{color:  #e0e3b9; font-style: italic; font-family: "Roboto", sans-serif; font-weight: 100; padding: 30px 0; font-size: 35px;}
.email{text-decoration: none; color: #e0e3b9; }
.email:hover{color: #abad8a; text-decoration: none;}
footer img{width: 100%;}
.logofinal{text-align: right;}
.logofinal img{width: 360px;}
.logo-historias{width: 80%;}
.logo-mobile{display: none;}

@media (max-width: 1440px){
    .card-beneficios{height: auto;}
    .linhas-overlay-left img{max-width: 220px;}
    .linhas-overlay-right img{max-width: 220px;}
    .linhas-overlay-left1 img{max-width: 220px;}
    .linhas-overlay-right1 img{max-width: 220px;}
    .exclusivo {right: 20px;}
    .exclusivo img{width: 50px; filter: invert(1) brightness(0.2) contrast(1.1);}
 
}



@media (max-width: 1024px) {
    .navbar .container-fluid {flex-direction: column;align-items: center;gap: 15px;}
    .navbar-brand {display: flex;justify-content: center;}
    .navbar-brand img {width: 160px;}
    .navbar-nav {flex-direction: row; justify-content: center;gap: 20px;flex-wrap: wrap; }
    .nav-link {font-size: 14px;text-align: center;padding: 5px 0;}
    .navbar-toggler {display: none;}
    .navbar-collapse {display: flex !important;justify-content: center;}
    .overlay-texto{padding: 60px 20px;}
    .overlay-texto img{width: 340px;}
    .para-sempre {display: flex;flex-direction: column;}
    .para-sempre .box:nth-child(1) {order: 2;}
    .para-sempre .box:nth-child(2) {order: 1; }
    .para-sempre .box:nth-child(3) { order: 3; }
    .para-sempre .box:nth-child(4) {order: 4;}
    .box-black-ouro{padding: 30px 60px;}
    .box{margin: 10px 0;}
    .card-beneficios{height: auto; margin: 10px 0;}
    .beneficios {grid-template-columns: 1fr;}
    .titulo {flex-direction: column;align-items: center;text-align: center;}
    .titulo h2 { white-space: normal;  padding-left: 0; font-size: 22px;}
    .plan-card-black,
    .plan-card-gold {padding: 40px 20px;}
    .plan-title {font-size: 50px;}
    .section-tag {width: 100%;font-size: 18px;}
    .feature-list { width: 100%;}
    .feature-item { grid-template-columns: 60px 1fr;}
    .feature-icon { width: 60px; height: 60px;}
    .feature-icon img {width: 40px;height: 40px;}
    .feature-text {font-size: 14px;height: 55px;padding: 5px 10px;}
    .feature-text .cidade {font-size: 10px;}
    .collector-heading img{width: 100%;}
    .aviso-sobre p{font-size: 13px; white-space: wrap;}
    footer{padding: 50px 0;}
    .logofinal{text-align: center; margin-top: 50px;}
    .logofinal img{width: 50%;}
    .linhas-overlay-left {top: -50px;}
    .linhas-overlay-left img{max-width: 100px;}
    .linhas-overlay-right {top: -50px;}
    .linhas-overlay-right img{max-width: 100px;}
    .linhas-overlay-left1 {bottom: 0px;}
    .linhas-overlay-left1 img{max-width: 100px;}
    .linhas-overlay-right1 {bottom: 0px;}
    .linhas-overlay-right1 img{max-width: 100px;}
    footer h4{font-size: 20px !important;}
    .logo-historias{width: 100%; text-align: center;}
    .logo-desktop{display: none;}
    .logo-mobile{display: block; width: 220px; margin: 0 auto;}
}

@media (max-width: 990px) {
    .titulo h2{font-size: 27px;}
    .line{display: none;}
    .track {width: max-content;}
    .slide {width: 50vw; }
    .overlay-texto img {width: 270px;}

  
}

@media (max-width: 748px){
  #topo {padding: 10px 0;}
  .banner {padding-top: 15px;}
  .aviso-sobre{bottom: 20px;}
  .aviso-sobre p{font-size: 5px; white-space: wrap;}
}

@media (max-width: 490px){
    .linhas-overlay-left {top: -50px;}
    .linhas-overlay-left img{max-width: 80px;}
    .linhas-overlay-right {top: -50px;}
    .linhas-overlay-right img{max-width: 80px;}
    .linhas-overlay-left1 {bottom: -65px;}
    .linhas-overlay-left1 img{max-width: 80px;}
    .linhas-overlay-right1 {bottom: -65px;}
    .linhas-overlay-right1 img{max-width: 80px;}
    .exclusivo {right: 10px;}

}


@media (max-width: 390px){
  .feature-text {font-size: 11px;height: 55px;padding: 5px 10px;}
  .exclusivo img { width: 35px;}
}