/* ==========================================================================
   Undare Energia - estilo principal (site estatico)
   Cores: amarelo #FEBA12 | verde #11A29E | escuro #041817 | texto #383838
   ========================================================================== */

:root {
  --amarelo: #FEBA12;
  --verde: #11A29E;
  --escuro: #041817;
  --texto: #383838;
  --cinza: #7A7A7A;
  --container: 1140px;
}

*, *::before, *::after { box-sizing: border-box; }
html { font-size: 62.5%; -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: "Open Sans", sans-serif;
  font-size: 14px;
  line-height: 1.8;
  color: #4a4a4a;
  background: #fff;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
}
img { max-width: 100%; height: auto; border: 0; vertical-align: middle; }
#conteudo { overflow-x: hidden; overflow-x: clip; }
a { color: #333; text-decoration: none; transition: color .3s; }
p { margin: 0 0 20px; }
h1, h2, h3, h4, h5, h6 { margin: 0; line-height: 1; font-weight: 600; }
ul { margin: 0; padding: 0; list-style: none; }
figure { margin: 0; }
address { font-style: normal; }
button, input, textarea { font: inherit; }
.svg-icon { display: inline-block; width: 1em; height: 1em; fill: currentColor; vertical-align: -0.125em; overflow: visible; }
.sr-only { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* --------------------------------------------------------------------------
   Grade (mesma logica do layout original: container 1140px, colunas com 10px)
   -------------------------------------------------------------------------- */
.sec { position: relative; }
.sec--c { width: 1400px; max-width: 90%; margin-left: auto; margin-right: auto; }
.row { display: flex; flex-wrap: wrap; max-width: var(--container); margin: 0 auto; position: relative; }
.row--full { max-width: none; }
.row--inner, .row--inner.w { max-width: none; margin: 0; }
.row--inner:last-child { margin-bottom: 0; }
.col { position: relative; display: flex; min-height: 1px; }
.col > .cw { display: flex; flex-wrap: wrap; align-content: flex-start; width: 100%; padding: 10px; position: relative; }
.col > .cw > * { width: 100%; }
.w { margin-bottom: 20px; position: relative; }
.w:last-child { margin-bottom: 0; }
.cw--center { align-content: center !important; align-items: center; }
.t-center { text-align: center; }
.t-left { text-align: left; }
.t-right { text-align: right; }

/* titulos e textos */
.h-sec { font-family: "Barlow", sans-serif; font-size: 3.5rem; font-weight: 900; color: var(--escuro); line-height: 1; }
.subtit { font-family: "Barlow", sans-serif; font-size: 1.5rem; font-weight: 400; color: var(--amarelo); line-height: 1.8; }
.txt { font-family: "Roboto", sans-serif; font-size: 1.5rem; font-weight: 400; color: var(--texto); line-height: 1.8; }

/* botoes */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 5px;
  padding: 12px 24px; border: 0; border-radius: 3px;
  background: var(--amarelo); color: #fff; cursor: pointer;
  font-family: "Roboto", sans-serif; font-size: 1.5rem; font-weight: 500; line-height: 1;
  transition: all .3s;
}
.btn:hover, .btn:focus { color: #fff; }
.btn .svg-icon { width: auto; height: 1em; }

/* --------------------------------------------------------------------------
   Cabecalho
   -------------------------------------------------------------------------- */
.site-header { position: absolute; top: 0; left: 0; right: 0; z-index: 100; padding-top: 20px; }
.site-header.is-fixed {
  position: fixed; background: rgba(255, 255, 255, .95); padding-bottom: 20px;
  box-shadow: 0 0 10px rgba(0, 0, 0, .1);
  animation: header-down .3s ease;
}
@keyframes header-down { from { transform: translateY(-100%); } to { transform: none; } }
.site-header .c-logo { width: 33.771%; }
.site-header .c-menu { width: 48.876%; }
.site-header .c-btn { width: 16.658%; }
.site-header .logo { display: block; text-align: center; }
.site-header .logo img { width: 80%; }

.nav-main ul { display: flex; flex-wrap: wrap; justify-content: flex-end; }
.nav-main a {
  position: relative; display: block; padding: 13px 20px;
  font-family: "Roboto", sans-serif; font-size: 1.5rem; font-weight: 600; line-height: 20px;
  color: var(--verde);
}
.nav-main a::after {
  content: ""; position: absolute; left: 0; bottom: 0; width: 100%; height: 3px;
  background: var(--amarelo); opacity: 0; transition: opacity .3s;
}
.nav-main a:hover, .nav-main a:focus, .nav-main a.ativo { color: var(--amarelo); }
.nav-main a:hover::after, .nav-main a:focus::after, .nav-main a.ativo::after { opacity: 1; }
.menu-toggle {
  display: none; align-items: center; justify-content: center; margin: 0 auto;
  width: 42px; height: 42px; padding: .25em; border: 0; border-radius: 3px; cursor: pointer;
  background: #fff; color: var(--verde); font-size: 22px;
}
.menu-toggle:hover { color: var(--amarelo); }
.menu-toggle .i-close { display: none; }
.menu-toggle[aria-expanded="true"] .i-open { display: none; }
.menu-toggle[aria-expanded="true"] .i-close { display: inline-block; }
.nav-drop { display: none; }
.site-header .nav-main, .site-header .w-toggle { margin-bottom: 0; }
.site-header .btn-header { font-size: 1.4rem; line-height: 1; }

/* --------------------------------------------------------------------------
   Banner (slider)
   -------------------------------------------------------------------------- */
.hero { position: relative; width: 100%; height: 900px; margin-top: var(--hero-top, -28px); margin-bottom: 10px; overflow: hidden; background: #fff; }
.hero__slide { position: absolute; inset: 0; opacity: 0; transition: opacity .3s linear; }
.hero__slide.is-active { opacity: 1; z-index: 1; }
.hero__bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.hero__grid { position: absolute; top: 0; left: 50%; width: var(--gw); height: var(--gh); transform: translateX(-50%) scale(var(--s, 1)); transform-origin: top center; }
.hero__layer { position: absolute; overflow: hidden; }
.hero__layer > * { display: block; transform: translateY(-100%); }
.hero__slide.is-active .hero__layer > * { animation: layer-in 1.2s cubic-bezier(.25, .46, .45, .94) forwards; }
@keyframes layer-in { to { transform: none; } }
.hero__layer img { width: 100%; height: 100%; }
.hero__title { font-family: "Roboto", sans-serif; font-weight: 700; color: var(--amarelo); white-space: nowrap; }
.hero__dots { position: absolute; left: 50%; bottom: 44px; transform: translateX(-50%); display: flex; gap: 10px; z-index: 5; }
.hero__dot {
  position: relative; width: 15px; height: 15px; padding: 0; border: 0; border-radius: 50%; cursor: pointer;
  background: transparent; box-shadow: 0 0 0 2px rgba(255, 255, 255, 0); transition: box-shadow .3s ease;
}
.hero__dot::before {
  content: ""; position: absolute; inset: 0; border-radius: 50%;
  background: rgba(255, 255, 255, .3); transition: background-color .3s ease, transform .3s ease;
}
.hero__dot::after { content: ""; position: absolute; inset: -5px; }
.hero__dot.is-active, .hero__dot:hover { box-shadow: 0 0 0 2px #fff; }
.hero__dot.is-active::before, .hero__dot:hover::before { transform: scale(.4); background: #fff; }

/* grade do slider por faixa de tela (mesmas medidas do Slider Revolution) */
.hero { --gw: 1240px; --gh: 900px; }
.hero .ly-logo { left: 128px; top: 340px; width: 495px; height: 123px; }
.hero .ly-texto { left: 129px; top: 351px; width: 485px; height: 174px; }
.hero .ly-texto .hero__title { font-size: 80px; line-height: 80px; }

/* --------------------------------------------------------------------------
   Caixa "Investidor" abaixo do banner
   -------------------------------------------------------------------------- */
.destaque .c-box { width: 28.333%; margin-top: -60px; z-index: 10; }
.destaque .c-box > .cw { padding: 30px; background: var(--amarelo); border-radius: 5px; align-content: center; }
.icon-box { display: flex; flex-direction: row-reverse; align-items: center; text-align: left; }
.icon-box__icon { flex: 0 0 auto; margin-left: 15px; font-size: 1.9rem; line-height: 1; color: #fff; }
.icon-box__icon a { color: #fff; display: inline-block; }
.icon-box__body { flex-grow: 1; }
.icon-box__title { font-family: "Barlow", sans-serif; font-size: 3rem; font-weight: 600; line-height: 1.4; color: #fff; margin-bottom: 0; }
.icon-box__title a { color: #fff; }
.icon-box__desc { font-family: "Roboto", sans-serif; font-size: 1.5rem; line-height: 1.8; color: #fff; margin: 0; }

/* --------------------------------------------------------------------------
   Home - "Por que escolher"
   -------------------------------------------------------------------------- */
.porque { padding-bottom: 100px; }
.lottie { margin: 0 auto; width: 15%; aspect-ratio: 1 / 1; }
.porque .c-half { width: 50%; }
.porque .c-half > .cw { padding: 2rem; }

/* contadores */
.numeros { margin-top: -20rem; padding-bottom: 100px; }
.numeros .c-vazio { width: 10.259%; }
.numeros .c-quadro { width: 40.193%; }
.numeros .c-quadro > .cw { padding: 25px 50px 25px 25px; background: url(../img/quadrado-amarelo.webp) center / cover no-repeat; }
.numeros .c-resto { width: 49.212%; }
.numeros .c-num { width: 50%; }
.counter__num { display: flex; justify-content: center; font-family: "Roboto", sans-serif; font-size: 5.5rem; font-weight: 600; line-height: 1; color: #fff; }
.counter__title { font-family: "Roboto", sans-serif; font-size: 1.5rem; font-weight: 600; line-height: 2.5; color: #fff; text-align: center; }

/* --------------------------------------------------------------------------
   Home - "Como funciona" (bloco verde)
   -------------------------------------------------------------------------- */
.como .row { max-width: none; }
.como .c-esp { width: 8.051%; }
.como .c-a { width: 45.984%; }
.como .c-b { width: 45.629%; }
.como .c-a > .cw, .como .c-b > .cw { background: var(--verde); padding: 150px 50px 100px 100px; }
.como .c-b > .cw { padding: 150px 100px 100px 0; }
.como .h-sec { color: #fff; }
.img-box { text-align: left; }
.img-box__img { display: inline-block; width: 15%; }
.img-box__img img { width: 100%; vertical-align: baseline; }
.img-box__desc { margin: 0; font-family: "Barlow", sans-serif; font-size: 1.5rem; font-weight: 500; line-height: 1.8; color: #fff; }
.como .w-mapa { padding-top: 50px; }
.como .w-casa img { width: 75%; }
.como .w-alemanha { padding: 20px 0; }

/* --------------------------------------------------------------------------
   Home - "Quem somos"
   -------------------------------------------------------------------------- */
.quem { padding-top: 100px; }
.quem .c-half { width: 50%; }
.quem .w-img { margin-top: -35px; }
.quem .c-texto > .cw { padding: 0 30px; align-content: center; }

/* --------------------------------------------------------------------------
   Rodape: bloco "Fale Conosco" + rodape escuro
   -------------------------------------------------------------------------- */
.contato-box { margin-top: 50px; padding-bottom: 10rem; }
.contato-box .c-amarelo { width: 100%; }
.contato-box .c-amarelo > .cw { background: var(--amarelo); border-radius: 5px; padding: 60px; }
.contato-box .c-form, .contato-box .c-info { width: 50%; }
.contato-box .c-form > .cw { background: #fff; border-radius: 5px; padding: 50px; }
.contato-box .c-info > .cw { padding: 50px; align-content: center; }
.fc-title { font-family: "Roboto", sans-serif; font-size: 2rem; font-weight: 700; color: #000; }
.fc-intro { font-family: "Roboto", sans-serif; font-size: 1.4rem; color: var(--cinza); }
.fc-intro p { margin-bottom: 20px; }
.form { display: flex; flex-wrap: wrap; margin: 0 -5px -10px; }
.form.w { margin-bottom: -10px; }
.form__field { width: 100%; padding: 0 5px; margin-bottom: 10px; }
.form__field--half { width: 50%; }
.form input, .form textarea {
  display: block; width: 100%; padding: 6px 12px; min-height: 41px;
  border: 1px solid rgba(219, 219, 219, .35); border-radius: 3px; background: #fff;
  font-family: "Roboto", sans-serif; font-size: 1.5rem; line-height: 1.8; color: var(--cinza);
  outline: none; transition: border-color .3s;
}
.form textarea { padding: 5px 14px; line-height: 1.4; resize: vertical; height: 138px; }
.form input::placeholder, .form textarea::placeholder { color: var(--cinza); opacity: .6; }
.form input:focus, .form textarea:focus { border-color: #bbb; }
.form .btn-enviar { width: 100%; min-height: 40px; padding: 0 20px; font-size: 1.2rem; text-transform: uppercase; letter-spacing: 0; }
.form__msg { width: 100%; padding: 0 5px; margin: 0 0 10px; font-family: "Roboto", sans-serif; font-size: 1.4rem; }
.form__msg.ok { color: #61CE70; }
.form__msg.erro { color: #d9534f; }
.hp { position: absolute !important; left: -9999px !important; }
.info-title { font-family: "Roboto", sans-serif; font-size: 2.5rem; font-weight: 600; line-height: 30px; color: #fff; }
.info-txt { font-family: "Roboto", sans-serif; font-size: 1.5rem; font-weight: 500; line-height: 2rem; color: #fff; }
.divisor { padding: 15px 0; }
.divisor span { display: block; border-top: 2.5px dotted #fff; }
.icon-list li { display: flex; align-items: flex-start; }
.icon-list .ic { flex: 0 0 auto; width: 1.5rem; margin-right: 4px; padding-top: 6px; color: #3B3B3B; font-size: 1.5rem; line-height: 1; text-align: center; }
.icon-list .tx { font-family: "Roboto", sans-serif; font-size: 1.5rem; line-height: 1.8; color: #fff; padding-left: 5px; }
.icon-list a { display: flex; align-items: flex-start; }

.site-footer { background: var(--escuro); padding-top: 120px; }
.site-footer .c-3 { width: 33.333%; }
.f-logo { margin-top: -2rem; text-align: left; }
.f-txt { font-family: "Roboto", sans-serif; font-size: 1.5rem; font-weight: 500; line-height: 1.8; color: #fff; }
.f-contato { margin-top: -2rem; font-family: "Roboto", sans-serif; font-size: 1.6rem; font-weight: 600; line-height: 1; color: var(--amarelo); }
.f-contato a { color: var(--amarelo); }
.f-title { font-family: "Roboto", sans-serif; font-size: 1.5rem; font-weight: 600; line-height: 1; color: #fff; text-align: center; }
.nav-footer a { display: block; padding: .8rem 20px; text-align: center; font-family: "Roboto", sans-serif; font-size: 1.4rem; font-weight: 600; line-height: 20px; color: #fff; }
.nav-footer a:hover, .nav-footer a.ativo { color: var(--amarelo); }
.news { display: flex; flex-wrap: wrap; }
.news input {
  width: 80%; min-height: 40px; padding: 6px 12px; border: 0; border-radius: 0; background: #fff; outline: none;
  font-family: "Roboto", sans-serif; font-size: 1.5rem; font-weight: 500; line-height: 1.8; color: var(--amarelo);
}
.news input::placeholder { color: var(--amarelo); opacity: .6; }
.news button { width: 20%; min-height: 40px; padding: 0; border: 0; border-radius: 0; background: #fff; color: var(--amarelo); cursor: pointer; font-size: 1.2rem; }
.news button:hover { color: var(--verde); }
.news .form__msg { color: #fff; font-family: "Barlow", sans-serif; font-size: 1.5rem; padding: 0; margin: 10px 0 0; }
.social { display: flex; justify-content: flex-end; gap: 5px; }
.social a { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 10%; background: var(--amarelo); color: #fff; font-size: 1.6rem; transition: opacity .3s; }
.social a:hover { opacity: .9; }
.copy { background: var(--escuro); padding-bottom: 40px; }
.copy .c-half { width: 50%; }
.copy__txt { font-family: "Roboto", sans-serif; font-size: 1.2rem; line-height: 1.8; color: #fff; text-align: right; }
.copy__txt .heart { color: var(--amarelo); }
.copy__txt a { color: #fff; }
.copy__txt a:hover { color: var(--amarelo); }

/* botao WhatsApp flutuante e voltar ao topo */
.wpp-float {
  position: fixed; right: 28px; bottom: 170px; z-index: 9000;
  display: flex; align-items: center; justify-content: center; width: 60px; height: 60px; border-radius: 50%;
  background: #25D366; color: #fff; font-size: 33px; box-shadow: 1px 6px 24px 0 rgba(7, 94, 84, .24);
  animation: wpp-show .5s cubic-bezier(.18, .89, .32, 1.28) both; transition: background .3s;
}
.wpp-float:hover { background: #4bf598; color: #fff; }
@keyframes wpp-show { from { transform: scale(0); } to { transform: scale(1); } }
.to-top {
  position: fixed; right: 20px; bottom: 20px; z-index: 100; display: flex; align-items: center; justify-content: center;
  width: 40px; height: 40px; border-radius: 2px; background: rgba(0, 0, 0, .4); color: #fff; font-size: 18px;
  opacity: 0; visibility: hidden; transition: all .3s;
}
.to-top.show { opacity: 1; visibility: visible; }
.to-top:hover { background: rgba(0, 0, 0, .8); color: #fff; }

/* --------------------------------------------------------------------------
   Animacoes de entrada (iguais as do layout original)
   -------------------------------------------------------------------------- */
.anim { visibility: hidden; }
.anim.animated { visibility: visible; animation-duration: 1.25s; animation-fill-mode: both; }
.anim.slow.animated { animation-duration: 2s; }
.anim.animated.fadeInUp { animation-name: fadeInUp; }
.anim.animated.fadeInLeft { animation-name: fadeInLeft; }
.anim.animated.fadeInRight { animation-name: fadeInRight; }
.anim.animated.slideInUp { animation-name: slideInUp; }
@keyframes fadeInUp { from { opacity: 0; transform: translate3d(0, 100%, 0); } to { opacity: 1; transform: none; } }
@keyframes fadeInLeft { from { opacity: 0; transform: translate3d(-100%, 0, 0); } to { opacity: 1; transform: none; } }
@keyframes fadeInRight { from { opacity: 0; transform: translate3d(100%, 0, 0); } to { opacity: 1; transform: none; } }
@keyframes slideInUp { from { transform: translate3d(0, 100%, 0); visibility: visible; } to { transform: none; } }
@media (prefers-reduced-motion: reduce) {
  .anim { visibility: visible; }
  .anim.animated { animation: none !important; }
  .hero__layer > * { transform: none; animation: none !important; }
}

/* ==========================================================================
   Pagina INVESTIDOR
   ========================================================================== */
.inv-intro { padding: 100px 0 50px; }
.inv-intro .c-img { width: 51.964%; }
.inv-intro .c-img > .cw { padding: 2rem; }
.inv-intro .c-img img { width: 100%; }
.inv-intro .c-txt { width: 47.993%; }
.inv-intro .c-txt > .cw { padding: 2rem; align-content: center; }
.inv-intro .h-sec { color: var(--verde); text-align: left; }
.inv-serv { padding-bottom: 50px; }
.inv-serv .h-sec { color: var(--amarelo); text-align: center; }
.inv-serv .cards { margin: 5rem 0 0; }
.inv-serv .cards + .cards { margin-top: 1rem; }
.inv-serv .c-card { width: 33.333%; }
.inv-serv .c-card.col--vazio { display: none; }
.inv-serv .c-card > .cw { margin: 10px; padding: 20px; background: #fff; box-shadow: 0 0 10px 0 rgba(0, 0, 0, .11); }
.card { text-align: center; }
.card__img { display: inline-block; width: 40%; margin-bottom: 15px; }
.card__img img { width: auto; max-width: 100%; vertical-align: baseline; }
.card__title { font-family: "Barlow", sans-serif; font-size: 1.7rem; font-weight: 600; line-height: 1.4; color: var(--amarelo); margin: 0 0 20px; }
.card__title a { color: var(--amarelo); }
.card__desc { font-family: "Barlow", sans-serif; font-size: 1.4rem; font-weight: 400; line-height: 1.8; color: var(--texto); margin: 0; }
.inv-por .c-full > .cw { background: var(--verde); padding: 50px; }
.inv-por .h-sec { color: #fff; text-align: center; }
.inv-por .c-g1 { width: 52.306%; }
.inv-por .c-t1 { width: 47.65%; }
.inv-por .c-t2 { width: 48.415%; }
.inv-por .c-g2 { width: 51.541%; }
.inv-por .c-t1 > .cw, .inv-por .c-g2 > .cw { align-content: center; }
.inv-por .w-img { text-align: right; }
.inv-por .w-img img { width: 100%; }
.inv-por .col > .cw > .w-cofre { width: calc(100% + 218px); margin-right: -218px; padding-right: 1px; }
.h-item { font-family: "Barlow", sans-serif; font-size: 2.5rem; font-weight: 700; line-height: 1; color: #fff; }
.h-item span { color: var(--amarelo); }
.txt-branco { font-family: "Roboto", sans-serif; font-size: 1.5rem; line-height: 1.8; color: #fff; }

/* ==========================================================================
   Pagina NOSSO NEGOCIO
   ========================================================================== */
.neg-intro { padding-top: 100px; }
.neg-intro .c-full > .cw { padding: 0; }
.neg-intro .h-sec { color: var(--amarelo); text-align: center; }
.neg-intro .c-txt { width: 47.993%; }
.neg-intro .c-txt > .cw { padding: 2rem; align-content: center; }
.neg-intro .c-img { width: 51.964%; }
.neg-intro .c-img > .cw { padding: 2rem; }
.neg-intro .c-img img { width: 100%; }
.neg-num { padding-bottom: 100px; }
.neg-num .c-quadro { width: 39.737%; }
.neg-num .c-quadro > .cw { padding: 25px 50px 25px 25px; background: url(../img/quadrado-amarelo.webp) center / cover no-repeat; }
.neg-num .c-resto { width: 60.263%; }
.neg-num .c-num { width: 50%; }
.neg-tipos .row { max-width: none; }
.neg-tipos .c-img { width: 28.963%; }
.neg-tipos .c-img > .cw { padding: 0; align-content: flex-end; }
.neg-tipos .col > .cw > .w-paineis { width: calc(100% + 170px); margin-right: -170px; z-index: 5; }
.neg-tipos .w-paineis img { width: 100%; }
.neg-tipos .c-verde { width: 71.037%; }
.neg-tipos .c-verde > .cw { background: var(--verde); padding: 100px 300px 100px 100px; }
.neg-tipos .h-sec { color: #fff; text-align: left; }
.neg-tipos .c-letra { width: 11.447%; }
.neg-tipos .c-letra.l-b { width: 10.143%; }
.neg-tipos .c-letra.l-c { width: 11.08%; }
.neg-tipos .c-desc { width: 88.553%; }
.neg-tipos .c-desc.d-b { width: 89.857%; }
.neg-tipos .c-desc.d-c { width: 88.92%; }
.letra { font-family: "Roboto", sans-serif; font-size: 3.5rem; font-weight: 800; line-height: 1; color: var(--amarelo); }
.txt-g { font-family: "Roboto", sans-serif; font-size: 2rem; line-height: 1.8; color: #fff; }
.neg-modelos { padding: 100px 0; }
.neg-modelos .c-full > .cw { background: var(--verde); padding: 50px; }
.neg-modelos .h-item { text-align: left; }
.list-modelos li { display: flex; align-items: center; }
.list-modelos .ic { flex: 0 0 auto; display: inline-flex; width: 25px; color: var(--amarelo); font-size: 2rem; margin-right: 0; }
.list-modelos .tx { padding-left: 5px; font-family: "Barlow", sans-serif; font-size: 2rem; font-weight: 500; line-height: 1.8; color: #fff; }

/* ==========================================================================
   Pagina DUVIDAS (perguntas frequentes)
   ========================================================================== */
.faq { padding: 100px 0 50px; }
.faq .h-sec { color: var(--amarelo); text-align: center; }
.faq .row--inner { padding-top: 20px; }
.faq__item + .faq__item { margin-top: 10px; }
.faq__h { margin: 0; font: inherit; }
.faq__q {
  display: block; width: 100%; margin: 0; padding: 30px; border: 0; border-radius: 0; cursor: pointer;
  background: var(--verde); color: #fff; text-align: left;
  font-family: "Barlow", sans-serif; font-size: 2rem; font-weight: 700; line-height: 1;
}
.faq__q::after { content: ""; display: table; clear: both; }
.faq__icon { float: right; width: 1em; margin-left: 10px; color: var(--amarelo); font-size: 1.4rem; text-align: right; line-height: 1; }
.faq__icon .i-fechar { display: none; }
.faq__q[aria-expanded="true"] .i-abrir { display: none; }
.faq__q[aria-expanded="true"] .i-fechar { display: inline-block; }
.faq__a { overflow: hidden; background: var(--verde); transition: height .4s ease; }
.faq__a[hidden] { display: none; }
.faq__a > div { padding: 15px; font-family: "Barlow", sans-serif; font-size: 1.6rem; line-height: 1.8; color: #fff; }

/* pagina 404 */
.pg404 { padding: 200px 0 50px; text-align: center; }
.pg404 .h-sec { color: var(--verde); }
@media (max-width: 767px) { .pg404 { padding: 40px 0 0; } }

/* animacao extra usada nas paginas internas */
.anim.animated.bounceInUp { animation-name: bounceInUp; }
@keyframes bounceInUp {
  from, 60%, 75%, 90%, to { animation-timing-function: cubic-bezier(.215, .61, .355, 1); }
  from { opacity: 0; transform: translate3d(0, 3000px, 0); }
  60% { opacity: 1; transform: translate3d(0, -20px, 0); }
  75% { transform: translate3d(0, 10px, 0); }
  90% { transform: translate3d(0, -5px, 0); }
  to { transform: none; }
}

@media (max-width: 1366px) {
  .neg-tipos .col > .cw > .w-paineis { width: calc(100% + 115px); margin-right: -115px; }
  .inv-por .col > .cw > .w-cofre { width: calc(100% + 128px); margin-right: -128px; }
}
@media (max-width: 1024px) {
  .inv-intro .c-img, .inv-intro .c-txt { width: 100%; }
  .neg-intro .c-txt, .neg-intro .c-img { width: 100%; }
  .neg-intro .h-sec, .neg-intro .txt { text-align: center; }
  .neg-num { padding-bottom: 50px; }
  .neg-num .c-quadro { width: 65%; }
  .neg-tipos .c-img > .cw { align-content: center; }
  .neg-tipos .col > .cw > .w-paineis { width: 100%; margin-right: 0; }
  .neg-tipos .c-verde { width: 71%; }
  .neg-tipos .c-verde > .cw { padding: 50px 20px; }
  .neg-tipos .c-letra, .neg-tipos .c-letra.l-b, .neg-tipos .c-letra.l-c { width: 12%; }
  .neg-modelos { padding: 50px 0; }
}
@media (max-width: 767px) {
  .inv-intro { padding: 0; }
  .inv-intro .h-sec, .inv-intro .txt { text-align: center; }
  .inv-serv .cards { margin-top: 5rem; }
  .inv-serv .cards + .cards { margin-top: 1rem; }
  .inv-por .c-full > .cw { padding: 50px 20px; }
  .inv-por .h-item, .inv-por .txt-branco { text-align: center; }
  .inv-por .w-img { text-align: center; }
  .inv-por .col > .cw > .w-cofre { width: 100%; margin-right: 0; padding-right: 0; }

  .neg-intro { padding-top: 50px; }
  .neg-num .c-quadro > .cw { padding: 0; }
  .neg-num .c-quadro .row--inner { padding: 65px; }
  .neg-tipos .c-verde > .cw { padding: 50px 20px; }
  .neg-tipos .h-sec, .neg-tipos .letra, .neg-tipos .txt-g { text-align: center; }
  .neg-modelos { padding: 50px 0 0; }
  .neg-modelos .c-full > .cw { padding: 50px 30px; }
  .neg-modelos .h-item { text-align: center; }

  .faq { padding: 50px 0; }
  .faq .row--inner { padding-top: 0; }
}

/* ==========================================================================
   Responsivo - notebook / tablet (ate 1239px / 1024px)
   ========================================================================== */
@media (max-width: 1239px) {
  .hero { height: 768px; --gw: 1024px; --gh: 768px; }
  .hero .ly-logo { left: 105px; top: 280px; width: 447px; height: 111px; }
  .hero .ly-texto { left: 84px; top: 190px; width: 479px; }
  .hero .ly-texto .hero__title { font-size: 79px; line-height: 79px; }
}
@media (max-width: 1024px) {
  .row { max-width: 1024px; }
  .destaque .c-box { width: 40%; }
  .porque .c-half { width: 100%; }
  .numeros { margin-top: -12rem; margin-bottom: 9rem; padding-bottom: 0; }
  .numeros .c-vazio { width: 2%; }
  .numeros .c-quadro { width: 67%; }
  .numeros .c-resto { width: 40%; }
  .como { margin-top: -80px; }
  .como .c-a > .cw, .como .c-b > .cw { padding: 50px 20px; }
  .quem { padding: 50px 0; }
  .quem .h-sec, .quem .subtit { text-align: center; }
}
@media (max-width: 1023px) {
  .hero { height: min(480px, 60vw); --gw: 800px; --gh: 480px; }
  .hero .ly-logo { left: 222px; top: 188px; width: 381px; height: 94px; }
  .hero .ly-texto { left: 171px; top: 178px; width: 450px; }
  .hero .ly-texto .hero__title { font-size: 70px; line-height: 74px; }
  .hero__dots { display: none; }
}

/* menu "sanduiche" a partir de tablet (igual ao original) */
@media (max-width: 1024px) {
  .nav-main { display: none; }
  .menu-toggle { display: flex; }
  .site-header .c-menu > .cw { position: static; align-content: flex-start; }
  .site-header .c-menu { position: relative; }
  .nav-drop { position: absolute; left: 10px; right: 10px; top: 53px; z-index: 20; background: #fff; }
  .nav-drop.open { display: block; }
  .nav-drop a { display: block; padding: 10px 20px; text-align: center; font-family: "Roboto", sans-serif; font-size: 1.5rem; font-weight: 600; line-height: 20px; color: var(--verde); }
  .nav-drop a:hover, .nav-drop a.ativo { color: var(--amarelo); }
}

/* ==========================================================================
   Responsivo - celular (ate 959px menu / ate 767px layout)
   ========================================================================== */
@media (max-width: 767px) {
  .row { flex-wrap: wrap; max-width: 767px; }
  .col { width: 100% !important; }
  .col--vazio { display: none; }

  .site-header { position: relative; padding-top: 20px; }
  .site-header .c-menu, .site-header .c-btn { width: 50% !important; }
  .nav-drop { left: 0; top: calc(100% - 10px); }
  .site-header .c-btn .cw { justify-content: center; }
  .site-header .c-btn .w { text-align: center; }

  .hero { height: min(480px, 100vw); margin-top: var(--hero-top-m, 35px); --gw: 480px; --gh: 480px; }
  .hero .ly-logo { left: var(--mx, 84px); top: var(--my, 222px); width: var(--mw, 333px); height: var(--mh, 83px); }
  .hero .ly-texto { left: 76px; top: 213px; width: 324px; }
  .hero .ly-texto .hero__title { font-size: 53px; line-height: 53px; }
  .hero__dots { display: flex; }

  .destaque .c-box { margin-top: -25px; }
  .destaque .c-box > .cw { padding: 30px; }
  .destaque .icon-box__icon { position: absolute; right: 0; top: 0; margin: 0; }

  .porque { padding-bottom: 50px; }
  .lottie { width: 45%; }
  .porque .w-texto { text-align: center; }
  .numeros { padding: 50px 0; }
  .numeros .c-quadro > .cw { padding: 25px; }

  .como .c-a > .cw { padding: 50px 50px 0; }
  .como .c-b > .cw { padding: 30px 50px 50px; }
  .img-box { text-align: center; }
  .img-box__img { width: 30%; }
  .como .w-casa { text-align: center; }
  .como .w-casa img { width: 100%; }

  .quem { margin-bottom: -50px; padding: 70px 0 0; }
  .contato-box { margin-top: 90px; }
  .quem .c-texto .txt { text-align: center; }

  .contato-box { padding-bottom: 0; }
  .contato-box .c-amarelo > .cw { padding: 50px 25px; }
  .contato-box .c-form > .cw, .contato-box .c-info > .cw { padding: 30px; }
  .form__field--half { width: 100%; }
  .info-title, .info-txt { text-align: center; }

  .site-footer { padding-top: 5rem; }
  .f-txt, .f-contato { text-align: center; }
  .nav-footer a { padding: 6px 0; font-size: 13px; font-weight: 500; }
  .news input, .news button { width: 100%; }
  .news button { margin-top: 10px; }
  .social { justify-content: center; }
  .copy__txt { text-align: center; }

  .wpp-float { right: 14px; bottom: 156px; }
  .to-top { right: 10px; bottom: 10px; width: 26px; height: 26px; font-size: 14px; }
}
