/* gtb-custom.css — estilos proprios da GTB Prime (07/10/2026).
   Carregado DEPOIS do easilon.css: o arquivo do tema nao e editado.
   Cores: as variaveis do proprio tema, que ja sao a identidade da GTB
   (--easilon-base dourado #C9A227, --easilon-black #17130D, branco). */

/* ---------- topo: aparece na hora (07/10) ----------
   O tema esconde o carrossel (display:none) ate o JavaScript montar, e o JavaScript so
   montava depois de TODAS as imagens da pagina. Antes de montar, mostramos o 1o slide
   ja pronto; o gtb-home.js liga o carrossel assim que o HTML chega. */
.main-slider-one__carousel:not(.owl-loaded) {
  display: block;
}
.main-slider-one__carousel:not(.owl-loaded) > .item:not(:first-child) {
  display: none;
}
.main-slider-one__carousel:not(.owl-loaded) > .item:first-child .main-slider-one__title__text,
.main-slider-one__carousel:not(.owl-loaded) > .item:first-child .main-slider-one__top__inner,
.main-slider-one__carousel:not(.owl-loaded) > .item:first-child .main-slider-one__button {
  opacity: 1;
  transform: none;
}
/* entrada do titulo mais curta: antes eram 0,6 a 1,4 s de espera + 1,4 s de animacao */
.main-slider-one__title__text,
.main-slider-one__top__inner,
.main-slider-one__button {
  transition-duration: 700ms;
}
.main-slider-one .active .main-slider-one__title__text--1 { transition-delay: 100ms; }
.main-slider-one .active .main-slider-one__title__text--2 { transition-delay: 200ms; }
.main-slider-one .active .main-slider-one__title__text--3 { transition-delay: 300ms; }
.main-slider-one .active .main-slider-one__button--1 { transition-delay: 400ms; }
.main-slider-one .active .main-slider-one__button--2 { transition-delay: 500ms; }
@media (prefers-reduced-motion: reduce) {
  .main-slider-one__title__text,
  .main-slider-one__top__inner,
  .main-slider-one__button {
    transition: none !important;
  }
}

/* ---------- qualificador (substitui a calculadora de emprestimo do topo) ---------- */
.gtb-avaliacao {
  position: relative;
  z-index: 10;
  padding: 28px 30px 26px;
  background-color: var(--easilon-white, #ffffff);
  box-shadow: 0 20px 60px rgba(23, 19, 13, 0.18);
}
.gtb-avaliacao::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 6px;
  background-color: var(--easilon-base, #C9A227);
}
.gtb-avaliacao__title {
  margin: 0 0 4px;
  font-size: 22px;
  font-weight: 700;
  line-height: 1.25;
  color: var(--easilon-black, #17130D);
}
.gtb-avaliacao__lead {
  margin: 0 0 14px;
  font-size: 13px;
  line-height: 1.5;
  color: var(--easilon-text, #6E6B66);
}
.gtb-avaliacao__objetivos {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 6px;
  margin: 0 0 12px;
  padding: 0;
  border: 0;
}
.gtb-avaliacao__objetivos label {
  margin: 0;
  cursor: pointer;
}
.gtb-avaliacao__objetivos input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.gtb-avaliacao__objetivos span {
  display: block;
  padding: 9px 4px;
  font-size: 12px;
  font-weight: 600;
  text-align: center;
  border: 1px solid var(--easilon-border-color, #E8E1D2);
  color: var(--easilon-black, #17130D);
  transition: background-color 200ms ease, border-color 200ms ease, color 200ms ease;
}
.gtb-avaliacao__objetivos input:checked + span {
  background-color: var(--easilon-black, #17130D);
  border-color: var(--easilon-black, #17130D);
  color: var(--easilon-base, #C9A227);
}
.gtb-avaliacao__objetivos input:focus-visible + span {
  outline: 2px solid var(--easilon-base, #C9A227);
  outline-offset: 2px;
}
.gtb-avaliacao__linha {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.gtb-avaliacao__campo {
  display: block;
  margin: 0 0 10px;
}
.gtb-avaliacao__campo span {
  display: block;
  margin-bottom: 4px;
  font-size: 12px;
  font-weight: 600;
  color: var(--easilon-black, #17130D);
}
.gtb-avaliacao__campo input,
.gtb-avaliacao__campo select {
  width: 100%;
  height: 40px;
  padding: 0 10px;
  font-size: 13px;
  color: var(--easilon-black, #17130D);
  background-color: var(--easilon-white, #ffffff);
  border: 1px solid var(--easilon-border-color, #E8E1D2);
  border-radius: 0;
}
.gtb-avaliacao__campo input:focus,
.gtb-avaliacao__campo select:focus {
  outline: none;
  border-color: var(--easilon-base, #C9A227);
}
.gtb-avaliacao__erro {
  margin: 0 0 10px;
  font-size: 13px;
  font-weight: 600;
  color: #b3261e;
}
.gtb-avaliacao__btn {
  width: 100%;
  justify-content: center;
}
.gtb-avaliacao__nota {
  margin: 10px 0 0;
  font-size: 11px;
  line-height: 1.45;
  color: var(--easilon-text, #6E6B66);
}
@media (max-width: 575px) {
  .gtb-avaliacao {
    padding: 24px 18px 22px;
  }
  .gtb-avaliacao__objetivos {
    grid-template-columns: repeat(2, 1fr);
  }
  .gtb-avaliacao__linha {
    grid-template-columns: 1fr;
    gap: 0;
  }
}

/* ---------- rodape: copyright numa linha + aviso de consorcio embaixo (07/10) ---------- */
.gtb-copyright {
  text-transform: none;            /* o tema punha Maiuscula Em Toda Palavra */
  font-size: 14px;
  line-height: 1.6;
}
.gtb-copyright__sep {
  margin: 0 8px;
  color: var(--easilon-base, #C9A227);
}
.gtb-assinatura {
  white-space: nowrap;
}
.gtb-assinatura a {
  color: var(--easilon-base, #C9A227);
}
.gtb-assinatura a:hover {
  color: var(--easilon-white, #ffffff);
}
.gtb-aviso-legal {
  margin: 28px 0 0;
  padding-top: 20px;
  border-top: 1px solid rgba(var(--easilon-gray-rgb, 182, 174, 156), 0.18);
  max-width: none;
  font-size: 12px;
  line-height: 1.7;
  text-align: center;
  color: rgba(var(--easilon-gray-rgb, 182, 174, 156), 0.8);
}
@media (max-width: 767px) {
  .gtb-copyright {
    text-align: center;
  }
  .gtb-aviso-legal {
    text-align: left;
  }
}

/* links do menu, da barra de cima e do rodape em escrita normal (o tema forcava
   "Maiuscula Em Toda Palavra": "Sobre A GTB", "Investimento E Patrimonio") */
.main-menu__list > li > a,
.topbar__pages a,
.footer-widget__links a {
  text-transform: none;
}

/* ---------- WhatsApp flutuante (07/10) ----------
   A seta "voltar ao topo" do tema e girada na vertical e ocupa ~54px a ~90px da borda
   direita, de ~3px a ~170px do fim da tela. O botao fica A ESQUERDA dela, com folga
   (right 104px), e so aparece depois de 500px de rolagem, o mesmo criterio da seta:
   no topo ele cobriria o botao do qualificador. */
.gtb-whatsapp-flutuante {
  position: fixed;
  right: 104px;
  bottom: 16px;
  z-index: 98;
  display: block;
  width: 252px;                /* 07/10: 150px ficou pequeno; 14/10: 220 -> 252, pedido do Gabriel */
  line-height: 0;
  opacity: 0;
  visibility: hidden;
  transform: translateY(12px);
  transition: opacity 250ms ease, transform 250ms ease, visibility 250ms;
  filter: drop-shadow(0 6px 14px rgba(23, 19, 13, 0.25));
}
.gtb-whatsapp-flutuante.mostrar {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}
.gtb-whatsapp-flutuante img {
  display: block;
  width: 100%;
  height: auto;
}
.gtb-whatsapp-flutuante.mostrar:hover,
.gtb-whatsapp-flutuante.mostrar:focus-visible {
  transform: translateY(-3px);
}
.gtb-whatsapp-flutuante:focus-visible {
  outline: 2px solid var(--easilon-base, #C9A227);
  outline-offset: 3px;
}
@media (max-width: 767px) {
  .gtb-whatsapp-flutuante {
    right: 98px;               /* ao lado da seta "voltar ao topo", sem encostar */
    bottom: 12px;
    width: 196px;
  }
}
@media (max-width: 359px) {
  .gtb-whatsapp-flutuante {
    right: 94px;
    width: 166px;              /* tela bem estreita: nao ocupar metade da largura */
  }
}
@media (prefers-reduced-motion: reduce) {
  .gtb-whatsapp-flutuante { transition: none; }
}

/* ---------- logos oficiais (08/10) ----------
   O tema tem ".main-header__logo img {height:auto}" (mais especifico) e
   ".logo-retina img {image-rendering: crisp-edges}" (serrilha a logo reduzida).
   Por isso os seletores abaixo repetem o container. */
.gtb-logo,
.logo-retina img.gtb-logo {
  display: block;
  image-rendering: auto;
}
.main-header__logo { margin-right: 30px; }
.main-header__logo img.gtb-logo--menu { width: auto; height: 94px; max-width: none; margin: 6px 0; }
.main-footer img.gtb-logo--escuro { width: 200px; height: auto; }
.mobile-nav__content img.gtb-logo--escuro { width: 150px; height: auto; }
@media (max-width: 1199px) { .main-header__logo img.gtb-logo--menu { height: 74px; } }
@media (max-width: 767px)  {
  .main-header__logo img.gtb-logo--menu { height: 60px; margin: 6px 0; }
  .main-footer img.gtb-logo--escuro { width: 170px; }
  .mobile-nav__content img.gtb-logo--escuro { width: 130px; }
}
/* menu principal em escrita normal (o tema tem seletor mais especifico com capitalize) */
.main-menu .main-menu__list > li > a { text-transform: none; }

/* respiro entre a logo do rodape e o texto (08/10) */
.main-footer img.gtb-logo--escuro { margin-bottom: 22px; }

/* quem-somos (14/10): no lugar das barras de % do tema, o compromisso real da GTB */
.gtb-compromisso {
  margin-top: 28px;
  padding: 18px 22px;
  border-left: 3px solid var(--easilon-base, #C9A227);
  background-color: rgba(201, 162, 39, 0.08);
}
.gtb-compromisso p { margin: 0; font-size: 15px; line-height: 1.7; }

/* quem-somos (14/10): o tema poe Maiuscula Em Toda Palavra (text-transform: capitalize).
   Em portugues fica errado ("A GTB Prime É Uma..."). Nas secoes marcadas com .gtb-pt
   o texto aparece como foi escrito. A home nao usa a classe e continua igual. */
.gtb-pt .page-header__title,
.gtb-pt .easilon-breadcrumb li,
.gtb-pt .sec-title__title,
.gtb-pt .about-one__text,
.gtb-pt .about-one__experience__title,
.gtb-pt .about-one__list__item,
.gtb-pt .why-choose-one__text,
.gtb-pt .why-choose-one__list__item,
.gtb-pt .loan-reasons-one__card__title,
.gtb-pt .funfact-one__item__title { text-transform: none; }

/* como-funciona (14/10): texto como foi escrito tambem nos blocos da pagina de servico do tema */
.gtb-pt .service-details__title,
.gtb-pt .service-details__text,
.gtb-pt .service-details__list li,
.gtb-pt .service-sidebar__nav li a,
.gtb-pt .service-sidebar__appointment__title,
.gtb-pt .service-sidebar__contact__time,
.gtb-pt .accordion-title h4,
.gtb-pt .accordion-content p,
.gtb-pt.service-details .faq-accordion .accordion-content p { text-transform: none; }
.gtb-pt .service-details__text + .service-details__text { margin-top: 16px; }

/* texto da caixa "Faca sua avaliacao" (no lugar do formulario do tema) */
.gtb-sidebar-texto { margin: 0 0 24px; font-size: 15px; line-height: 1.7; }
.service-sidebar__appointment a.easilon-btn { width: 100%; justify-content: center; }

/* passo a passo numerado */
.gtb-passos { counter-reset: passo; list-style: none; margin: 18px 0 0; padding: 0; display: grid; gap: 14px; }
.gtb-passos li { counter-increment: passo; position: relative; padding: 14px 18px 14px 64px; background-color: rgba(201, 162, 39, 0.06); line-height: 1.7; }
.gtb-passos li::before {
  content: counter(passo); position: absolute; left: 16px; top: 14px;
  width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center;
  background-color: var(--easilon-base, #C9A227); color: var(--easilon-black, #17130D); font-weight: 700;
}
.gtb-passos strong { color: var(--easilon-black, #17130D); }

/* dois caminhos do briefing: ja sabe o que quer / ainda pesquisando */
.gtb-caminhos { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 20px; margin: 40px 0; }
.gtb-caminhos__item { padding: 26px 24px; background-color: var(--easilon-black, #17130D); color: rgba(255, 255, 255, 0.8); border-bottom: 3px solid var(--easilon-base, #C9A227); }
.gtb-caminhos__item h3 { color: #fff; font-size: 20px; margin: 0 0 10px; text-transform: none; }
.gtb-caminhos__item p { margin: 0 0 16px; line-height: 1.7; }
.gtb-caminhos__item a { color: var(--easilon-base, #C9A227); font-weight: 700; display: inline-flex; gap: 8px; align-items: center; }
.gtb-caminhos__item a:hover, .gtb-caminhos__item a:focus-visible { color: #fff; }

/* solucoes (14/10): um bloco por solucao do briefing (imovel, veiculos, empresas, patrimonio) */
.gtb-solucao { padding-top: 44px; margin-top: 44px; border-top: 1px solid var(--easilon-border-color, #E6E6ED); scroll-margin-top: 130px; }
.gtb-solucao__img { display: block; width: 100%; height: auto; margin-bottom: 26px; }
.gtb-solucao__subtitulo { font-size: 18px; font-weight: 700; margin: 22px 0 14px; text-transform: none; }
.gtb-solucao__lista { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 10px 24px; margin-bottom: 26px; }
.gtb-solucao__lista { max-width: none; }
.gtb-solucao__lista li,
.gtb-solucao__lista li + li { margin: 0; }
.gtb-solucao__nota { font-size: 14px; line-height: 1.7; margin: -8px 0 24px; padding-left: 14px; border-left: 3px solid var(--easilon-base, #C9A227); }
.gtb-pt .service-details__faq { margin-top: 50px; }

/* 14/10: foto real do Bruno e da Tati em "Por que escolher a GTB Prime".
   Teste do Gabriel: sem as faixas pretas, a foto preenche a caixa do tema (cover, igual ao original).
   Para voltar a mostrar a foto inteira no computador, reative o bloco abaixo. */
/*
@media (min-width: 992px) {
  .features-one__image.gtb-foto-equipe {
    background-size: contain;
    background-position: center;
    background-color: var(--easilon-black, #17130D);
  }
}
*/

/* 14/10 (Gabriel): todo botao que abre conversa e VERDE do WhatsApp, com o icone dele.
   Quem ve reconhece na hora o que acontece ao clicar ("abre o WhatsApp"), e isso tira a
   duvida que segura o clique. Botoes que so navegam no site continuam dourados.
   Vale para as tres variantes do tema (cheio, --border e --white). Hover: verde escuro. */
.easilon-btn.gtb-btn-whats,
.easilon-btn--border.gtb-btn-whats,
.easilon-btn--white.gtb-btn-whats {
  color: #fff;
  background-color: #25D366;
  border: 1px solid #25D366;
  font-weight: 700;
}
.easilon-btn.gtb-btn-whats::before,
.easilon-btn.gtb-btn-whats::after { background-color: #128C7E; }
.easilon-btn.gtb-btn-whats:hover,
.easilon-btn.gtb-btn-whats:focus-visible { color: #fff; border-color: #128C7E; }
.easilon-btn.gtb-btn-whats .easilon-btn__icon::after,
.easilon-btn.gtb-btn-whats:hover .easilon-btn__icon::after { background-color: rgba(255, 255, 255, 0.6); }
.easilon-btn.gtb-btn-whats .easilon-btn__icon .fa-whatsapp { font-size: 20px; line-height: 1; }
.easilon-btn.gtb-btn-whats:focus-visible { outline: 2px solid #128C7E !important; outline-offset: 3px; }

/* 14/10 (Gabriel, teste na pagina Solucoes): caixa "Faça sua avaliação" FLUTUANTE (sticky).
   Acompanha a rolagem e para no fim da coluna, antes de "Seu objetivo começa aqui".
   O tema poe overflow:hidden no .page-wrapper, que desliga o sticky; "clip" corta igual sem
   desligar, e so vale na pagina que tem a caixa (:has). So no computador: no celular a
   coluna lateral fica empilhada e nao ha o que acompanhar. */
@media (min-width: 992px) {
  .page-wrapper:has(.gtb-sidebar-fixa) { overflow: clip; }
  .service-sidebar.gtb-sidebar-coluna { height: 100%; }
  /* 14/10: perto do topo quando o menu esta escondido; desce para baixo do menu quando ele
     aparece (rolagem para cima: o tema poe .active no menu clonado), no mesmo tempo do menu. */
  .gtb-sidebar-fixa { position: sticky; top: 30px; z-index: 2; transition: top 500ms ease; }
  body:has(.sticky-header--cloned.active) .gtb-sidebar-fixa { top: 145px; }
}
@media (min-width: 992px) and (max-width: 1199px) {
  body:has(.sticky-header--cloned.active) .gtb-sidebar-fixa { top: 156px; } /* menu mais alto nessa largura */
}
@media (prefers-reduced-motion: reduce) { .gtb-sidebar-fixa { transition: none; } }