/* Bruno Odonto · página inicial · VISS Digital · viss.digital
   Valores em px aqui são do original (Elementor) e viram rem na conversão (px ÷ 16).
   Faixas: celular até 767 · tablet 768 a 1024 · desktop 1025 em diante. */

/* ======================= CABEÇALHO ======================= */
.topo {
  /* o original rola junto com a página, por cima do hero */
  position: absolute; top: 0; left: 0; z-index: var(--layer-header);
  width: 100%;
}
.topo__interno {
  display: flex; align-items: center; justify-content: space-between;
  min-height: 8.125rem; padding: 1.25rem;
}
.topo__logo { display: block; width: 10.9375rem; margin: .625rem 0; }
.topo__logo img { width: 100%; height: auto; }
.menu, .topo__telefone { display: none; }
.topo__abrir {
  display: flex; align-items: center; justify-content: center;
  margin-top: .625rem; color: #fff; font-size: 1.625rem; line-height: 1;
}
.topo__abrir .icone { width: .875em; height: 1em; }

@media (min-width: 768px) {
  .topo__interno { min-height: 5.625rem; padding: 0 7.5% 0 2.5%; }
  .topo__logo { width: 11.25rem; margin: 0; }
  .topo__abrir { margin: 0; font-size: 1.875rem; }
}

@media (min-width: 1025px) {
  .topo__interno {
    /* 180 + 762 + 175 e 83 de sobra à direita (a coluna do menu do celular, escondida, ocupava esse espaço) */
    display: grid; grid-template-columns: 11.25rem 1fr 10.9375rem; align-items: center;
    width: min(100% - 2.5rem, var(--content)); margin-inline: auto; padding: 0 5.1875rem 0 0;
  }
  .topo__abrir { display: none; }
  .menu { display: block; padding-right: 1.25rem; }
  .menu__lista { display: flex; justify-content: flex-end; gap: 1.5625rem; }
  .menu__link {
    position: relative; display: block;
    padding: 2.1875rem 0;
    font: 300 .9375rem/1.25rem var(--font-titulo); text-transform: uppercase; color: #fff;
  }
  .menu__link::before {
    content: ''; position: absolute; top: 0; left: 0; width: 100%; height: .125rem; background: #fff;
    opacity: 0; transform: translateY(-0.625rem); transition: opacity .3s ease, transform .3s ease;
  }
  .menu__link:hover::before, .menu__link:focus-visible::before, .menu__link[aria-current]::before { opacity: 1; transform: none; }
  .topo__telefone {
    display: flex; width: auto; justify-self: stretch;
    padding: .9375rem .9375rem .6875rem; gap: .3125rem;
    font: 200 .875rem/.875rem var(--font-titulo);
    box-shadow: 0 .125rem 1.6875rem -0.5rem rgb(235 91 41 / 0);
  }
  .topo__telefone b { font-weight: 400; }
  .topo__telefone .icone { margin-right: 0; }
}

/* ======================= HERO ======================= */
.hero {
  position: relative; display: flex; align-items: center;
  min-height: 47rem; padding: 14.875rem 1.5625rem 0;
  background: #000; overflow: hidden;
  align-items: flex-start;
}
.hero__fundo { position: absolute; top: -.4375rem; left: .1875rem; width: 102%; height: calc(100% + 1.5625rem); }
.hero__fundo img { width: 100%; height: 100%; max-width: none; object-fit: cover; object-position: 50% 50%; }
.hero__conteudo { position: relative; width: 100%; }
.hero__titulo {
  margin: 0 0 1.25rem; padding-right: 1.25rem;
  font: 600 2.1875rem/2.625rem var(--font-titulo); text-transform: uppercase; color: #fff;
}
.hero__texto { margin: 0 0 1.25rem; font: 300 .875rem/1.8 var(--font-titulo); color: #fff; }
.hero .botoes { grid-template-columns: 1fr 1fr; }
.hero .botoes > :first-child { margin-right: .5rem; }
.hero .botoes > :nth-child(2) { margin-left: .5rem; }

@media (min-width: 768px) {
  .hero {
    align-items: center; min-height: 48.75rem; padding: 0 1.5625rem 1.25rem;
  }
  .hero__fundo { top: -1.25rem; left: 0; width: 102%; height: calc(100% + 2.25rem); }
  .hero__fundo img { object-position: 48.7% 50%; }
  .hero__conteudo { padding-right: 50%; }
  .hero__titulo { padding-right: 0; font-size: 2.8125rem; line-height: 3.375rem; }
  .hero__texto { margin-bottom: 4.375rem; font-size: 1rem; }
  .hero .botoes { grid-template-columns: 40% 40% 10%; }
  .hero .botoes > :first-child { margin-right: .3125rem; }
  .hero .botoes > :nth-child(2) { margin-left: .3125rem; }
}

@media (min-width: 1025px) {
  .hero { min-height: calc(100svh + 5rem); padding: 5rem 0 0; }
  .hero__fundo { height: calc(100% + 2.5rem); }
  .hero__fundo img { object-position: 45.6% 50%; }
  .hero__conteudo { width: min(100% - 2.5rem, var(--content)); margin-inline: auto; padding-right: 0; }
  .hero__conteudo > * { max-width: 40%; }
  .hero__titulo { font-size: 3.8125rem; line-height: 3.8125rem; }
  .hero__texto { margin-bottom: 4.375rem; }
  .hero .botoes { grid-template-columns: repeat(3, 1fr); }
}

/* ======================= COLUNAS (sobre, artistas, depoimento) ======================= */
.duas-colunas { display: flex; flex-direction: column; width: 100%; max-width: var(--content); margin-inline: auto; }
.coluna-texto { display: flex; flex-direction: column; justify-content: center; }
.coluna-foto {
  display: flex; align-items: center;
  background: no-repeat left center / 21.875rem auto;
}
.coluna-foto--dir { background-position: right center; }
.coluna-foto picture { flex: 1 1 auto; min-width: 0; }
.coluna-foto__img { width: 100%; height: auto; }
.texto p { margin: 0 0 .9rem; font: 200 .875rem/1.4 var(--font-texto); color: var(--color-text); }
.texto { margin-bottom: 1.25rem; }

@media (min-width: 768px) {
  .texto p { font-size: 1rem; }
}
@media (min-width: 1025px) {
  .duas-colunas { display: grid; grid-template-columns: 1fr 1fr; width: min(100% - 2.5rem, var(--content)); max-width: none; }
}

/* ======================= SOBRE ======================= */
.sobre { padding: 6.25rem 0 3.125rem; }
.sobre .duas-colunas { display: flex; flex-direction: column; }
.sobre .coluna-texto { order: 1; padding: 5%; }
.sobre .coluna-foto {
  order: 2; margin-top: 15%; padding: 0 5% 0 0;
  background-image: url('../img/pontos-fotos.webp');
}
.sobre .coluna-foto__img { margin-bottom: -3.125rem; }
.sobre__titulo {
  margin: 0 0 1.25rem;
  font: 600 1.125rem/1.4 var(--font-titulo); color: var(--color-title);
}
.sobre__titulo i { font-style: italic; }
.sobre .botoes, .artistas .botoes { grid-template-columns: 1fr 1fr; }

@media (min-width: 768px) {
  .sobre { margin-top: 15%; }
  .sobre .coluna-texto { padding: 0 35% 0 5%; }
  .sobre .coluna-foto { margin-top: 0; padding: 0 9% 0 0; }
  .sobre__titulo { font-size: 2.1875rem; line-height: 1.2; }
  .sobre .botoes, .artistas .botoes { grid-template-columns: repeat(3, 1fr); }
}
@media (min-width: 1025px) {
  .sobre { margin-top: 0; }
  .sobre .duas-colunas { display: grid; }
  .sobre .coluna-texto { order: 2; padding: 1.875rem 0 1.875rem 3.75rem; }
  .sobre .coluna-foto { order: 1; padding: .625rem; }
  .sobre__titulo { font-size: 2rem; }
}

/* ======================= ARTISTAS ======================= */
.artistas { padding: 3.125rem 0 6.25rem; }
.artistas .coluna-texto { padding: 5%; }
.artistas .titulo { height: 3.28rem; font-size: 1.375rem; line-height: 1.65rem; }
.artistas .coluna-foto {
  margin-top: 15%; padding: 0 5% 0 0;
  background-image: url('../img/pontos-fotos.webp'); background-position: right center;
}
.artistas .coluna-foto__img { margin-bottom: -1.25rem; }
.artistas .botoes .botao { font-size: .75rem; }

@media (min-width: 768px) {
  .artistas { margin-top: 15%; }
  .artistas .titulo { height: 4rem; font-size: 2rem; line-height: 2.5rem; }
  .artistas .coluna-texto { padding: 0 35% 0 5%; }
  .artistas .coluna-foto { order: -1; margin-top: 0; padding: 0 9% 0 0; }
  .artistas .botoes .botao { font-size: .9375rem; }
}
@media (min-width: 1025px) {
  .artistas { margin-top: 0; }
  .artistas .duas-colunas { display: grid; }
  .artistas .coluna-texto { padding: 1.875rem 3.75rem 1.875rem 0; }
  .artistas .coluna-foto { order: 0; padding: .625rem; }
}

/* ======================= FAIXAS ESCURAS (experiência, agende) ======================= */
.faixa {
  position: relative; display: flex; align-items: center; isolation: isolate;
  background: var(--color-navy) no-repeat center / cover;
}
.faixa::before {
  /* o original escurece a foto com preto a 11% em mistura "luminosidade" */
  content: ''; position: absolute; inset: 0; z-index: -1;
  background: #000; opacity: .11; mix-blend-mode: luminosity;
}
.experiencia { background-image: url('../img/fundo-experiencia-1956.webp'); padding: 6.875rem 1.25rem 6.25rem; }
.experiencia__interno { width: min(100%, var(--content)); margin-inline: auto; }
.experiencia__interno { display: flex; flex-direction: column; }
.experiencia .subtitulo { margin-bottom: 1.25rem; }
.titulo--claro { color: #fff; }
.subtitulo--claro { color: #fff; }

.metricas { display: grid; grid-template-columns: repeat(2, 1fr); padding-top: 1.5625rem; }
.metrica { display: flex; flex-direction: column; align-items: center; padding: 0 0 .90625rem; }
.anel { position: relative; width: 8.125rem; height: 8.125rem; display: flex; align-items: center; justify-content: center; }
.anel__svg { position: absolute; inset: 0; width: 8.125rem; height: 8.125rem; overflow: visible; }
.anel__trilha { fill: none; stroke: rgb(0 0 0 / .1); stroke-width: 9.2857; }
.anel__arco { fill: none; stroke: url(#grad-anel); stroke-width: 9.2857; stroke-linecap: round; }
.anel__numero { position: relative; display: flex; align-items: center; gap: .1875rem; margin: 0; font: 400 2.1875rem/3.2812rem var(--font-titulo); color: #f4f4f4; }
.anel__sufixo { font-size: 1.0938rem; line-height: 1.6406rem; color: #efefef; }
.anel__sufixo--antes { order: -1; }
.metrica__texto { margin: 1.125rem 0 0; text-align: center; font: 400 1rem/1.5rem var(--font-titulo); color: #efefef; }

@media (min-width: 768px) {
  .experiencia { padding: 0 1.5625rem; min-height: 50rem; }
  .metricas { grid-template-columns: repeat(4, 1fr); }
  .metrica { padding: .9375rem .9375rem 1.8125rem; }
}
@media (min-width: 1025px) {
  .experiencia { min-height: 34.375rem; padding: 0 1.25rem; }
  .metricas { width: 95%; margin-inline: auto; padding-top: 3.125rem; }
  .metrica { padding: 1.875rem 1.875rem 2.75rem; }
}

/* ======================= ESPECIALIDADES ======================= */
.especialidades { padding-top: 3.125rem; }
.especialidades__interno { width: min(100%, var(--content)); margin-inline: auto; }
.cartoes { display: grid; grid-template-columns: 1fr; margin-top: 3.6562rem; padding: 0 5%; }
.cartao {
  display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center;
  margin: 3%; padding: 10% 10%;
  background: #fff; border-bottom: .3125rem solid #fff; border-radius: .125rem;
  box-shadow: var(--shadow-card);
  transition: border-color .3s ease;
}
.cartao:hover { border-bottom-color: #22478c; }
.cartao:last-child { padding-inline: 5%; }
.cartao__icone { width: 2.625rem; height: 2.625rem; margin-bottom: 2.125rem; }
.cartao__icone--grande { width: 3.125rem; height: 3.125rem; }
.cartao__titulo { margin: 0 0 1rem; font: 600 1rem/1.2 var(--font-titulo); text-transform: capitalize; color: var(--color-card-title); }
.cartao__texto { font: 300 .875rem/1.4 var(--font-titulo); color: var(--color-card-text); }

@media (min-width: 768px) {
  .especialidades { padding-top: 6.25rem; }
  .cartoes { grid-template-columns: repeat(4, 1fr); margin-top: 5.525rem; }
  .cartao { align-items: flex-start; text-align: left; padding: 15% 8%; }
  .cartao:last-child { padding-inline: 8%; }
  .cartao__texto { font-size: .9375rem; }
}
@media (min-width: 1025px) {
  .especialidades__interno { width: min(100% - 2.5rem, var(--content)); }
  .cartoes { margin-top: 6.25rem; padding: 0; }
  .cartao__texto { font-size: .875rem; }
}

/* ======================= RESULTADOS ======================= */
.resultados { padding: 1.25rem 1.25rem 2.5rem; margin-bottom: 3.125rem; }
.resultados { position: relative; overflow-x: clip; }
.resultados::before {
  /* trama de pontos atrás do quadro: no celular e no tablet fica no canto, no desktop vai para trás da base do quadro */
  content: ''; position: absolute; top: 0; left: 0; width: 37.5rem; height: 21.69rem; max-width: none;
  background: url('../img/pontos-resultados.webp') center / 100% 100% no-repeat; pointer-events: none;
}
.resultados__interno { position: relative; z-index: 1; width: min(100%, 62.5rem); margin-inline: auto; }
.resultados .cabecalho { margin-bottom: 3.125rem; }
.comparador { position: relative; margin: 0; }
.comparador__quadro {
  position: relative; overflow: hidden; border: .5rem solid #fff; background: #fff;
  box-shadow: var(--shadow-moldura); line-height: 0; --pos: 50%;
}
.comparador__img { width: 100%; height: auto; }
.comparador__antes { position: absolute; inset: 0; clip-path: inset(0 calc(100% - var(--pos)) 0 0); }
.comparador__antes .comparador__img { width: 100%; height: 100%; object-fit: cover; }
.comparador__rotulo {
  position: absolute; bottom: 0; padding: .3125rem 1.25rem;
  font: 400 .875rem/1.4 var(--font-titulo); color: #fff; background: rgb(255 255 255 / .349);
}
.comparador__rotulo--antes { left: 0; }
.comparador__rotulo--depois { right: 0; }
.comparador__linha { position: absolute; top: 0; bottom: 0; left: var(--pos); width: 1px; background: #fff; }
.comparador__alca {
  position: absolute; top: 50%; left: var(--pos); width: 2.75rem; height: 2.75rem; margin: -1.375rem 0 0 -1.375rem;
  border-radius: 50%; background: rgb(255 253 253 / .56); color: #7bcdf0; pointer-events: none;
}
.comparador__alca svg { width: 100%; height: 100%; fill: currentColor; }
.comparador__controle {
  position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: ew-resize;
  touch-action: pan-y; appearance: none; -webkit-appearance: none;
}
.comparador__controle:focus-visible ~ .comparador__alca { outline: .125rem solid var(--color-focus); outline-offset: .125rem; }

@media (min-width: 768px) {
  .resultados { padding: 3.125rem 0 7.5rem; margin-bottom: 0; }
}
@media (min-width: 1025px) {
  .resultados::before { top: 23.1875rem; left: calc(50% - 10.5rem); }
}

/* ======================= AGENDE SUA CONSULTA ======================= */
.agende { background-image: url('../img/fundo-agende-1956.webp'); padding: 6.875rem 1.25rem 6.25rem; }
.agende__interno { display: flex; flex-direction: column; width: min(100%, var(--content)); margin-inline: auto; }
.agende__texto { text-align: center; }
.agende__titulo { margin: 0 0 1.25rem; font: 600 1.375rem/1.4 var(--font-titulo); color: #fff; }
.agende__sub { margin: 0 0 2.15rem; font: 200 .875rem/1.4 var(--font-texto); letter-spacing: -.1px; color: #fff; }
.agende__pilula {
  display: flex; align-items: flex-start; height: 3.875rem; margin: 0;
  border-radius: var(--radius-pill); background: var(--gradient-agende); color: #fff;
}
.agende__play {
  flex: none; display: flex; align-items: center; justify-content: center;
  width: 20%; padding-top: .5rem; box-sizing: border-box;
}
.agende__play::before { content: none; }
.agende__play .icone { box-sizing: content-box; width: .5rem; height: .5rem; padding: 1.25rem; border-radius: 50%; background: #fff; color: #0577e4; }
.agende__pilula-texto { align-self: center; margin-left: 0; font: 600 .875rem/.875rem var(--font-titulo); text-align: left; }
.agende__nota { margin: 1.5625rem 0 .9rem; font: 200 .875rem/1.4 var(--font-texto); color: #fff; }
.agende__cartao {
  padding: 1.25rem; border-radius: .9375rem; background: #fff;
  box-shadow: 0 .3125rem 3.125rem 1.25rem rgb(0 0 0 / .23);
}

.form { display: flex; flex-wrap: wrap; margin: 0 -0.3125rem -0.625rem; }
.campo { position: relative; width: 100%; padding: 0 .3125rem; margin-bottom: .625rem; }
.campo__rotulo { display: block; margin: 0; font: 400 1rem/1rem var(--font-titulo); color: #000; }
.campo__controle {
  display: block; width: 100%; min-height: 2.5rem; padding: .3125rem .875rem;
  border: 1px solid rgb(2 1 1 / .19); border-radius: .3125rem; background: #fff;
  font: 400 max(1rem, 16px)/1.3125rem var(--font-titulo); color: rgb(2 1 1 / .5);
}
.campo__controle::placeholder { color: rgb(2 1 1 / .3); opacity: 1; }
textarea.campo__controle { height: auto; resize: vertical; }
.campo__select { position: relative; }
.campo__select::after {
  content: ''; position: absolute; top: 50%; right: .65625rem; margin-top: -.15625rem;
  border: .3125rem solid transparent; border-top-color: #808080; border-bottom: 0; pointer-events: none;
}
select.campo__controle { appearance: none; -webkit-appearance: none; padding-right: 2.25rem; }
.campo__controle--data { position: relative; }
.campo__controle--data::-webkit-calendar-picker-indicator { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; }
.campo__controle--data:invalid:not(:focus) { color: transparent; }
.campo__dica {
  position: absolute; left: 1.1875rem; bottom: .5625rem; display: none; pointer-events: none;
  font: 400 max(1rem, 16px)/1.3125rem var(--font-titulo); color: rgb(2 1 1 / .3);
}
.campo__controle--data:invalid:not(:focus) ~ .campo__dica { display: block; }
.form__enviar { height: 2.5rem; padding: 0; margin: 0; background-color: var(--color-blue-btn); background-image: var(--gradient-btn); cursor: pointer; }

@media (min-width: 768px) {
  .agende { min-height: 50rem; padding: 0 1.5625rem; }
  .agende__interno { display: grid; grid-template-columns: 1fr 1fr; align-items: center; }
  .agende__texto { padding-right: 9.375rem; text-align: left; }
  .agende__titulo { font-size: 2.1875rem; line-height: 1.2; }
  .agende__sub, .agende__nota { font-size: 1rem; text-align: left; }
  .agende__pilula { height: auto; min-height: 3.875rem; }
  .agende__pilula-texto { font-size: 2rem; line-height: 2rem; }
  .agende__cartao { padding: 3.125rem; }
  .campo--metade { width: 50%; }
}
@media (min-width: 1025px) {
  .agende { min-height: 34.375rem; padding: 0 1.25rem; }
  .agende__titulo { font-size: 2rem; line-height: 1.2; }
  .agende__play { width: 14.222%; justify-content: center; }
  .agende__pilula-texto { font-size: 2rem; }
  .campo__controle { font-size: .9375rem; }
  .campo__dica { font-size: .9375rem; }
}

/* ======================= DEPOIMENTO ======================= */
.depoimento { padding: 6.25rem 0 3.125rem; }
.depoimento .duas-colunas { flex-direction: column-reverse; }
.depoimento .coluna-foto { background: none; padding: 0; }
.depoimento .coluna-foto__img { margin-bottom: 0; }
.depoimento .coluna-texto { align-items: center; text-align: center; padding: 0 1.875rem; }
.depoimento__etiqueta { margin: 0 0 1.25rem; padding: 0; font: 600 .625rem/1.4 var(--font-titulo); text-transform: uppercase; color: var(--color-blue); }
.depoimento__titulo { margin: -.625rem 0 1.25rem; font: 600 1.25rem/1.4 var(--font-titulo); color: var(--color-title); }
.depoimento__citacao { margin: 0; padding: 1.25rem 0 4.125rem; text-align: left; }
.depoimento__fala { font: italic 300 .875rem/1.5 var(--font-titulo); color: #686868; }
.depoimento__autor { display: flex; align-items: center; gap: 1.25rem; margin-top: 1.5625rem; }
.depoimento__avatar { width: 3.125rem; height: 3.125rem; border-radius: 50%; object-fit: cover; }
.depoimento__autor cite { font: normal 600 .875rem/1.5 var(--font-titulo); color: #393939; }

@media (min-width: 768px) {
  .depoimento { margin-top: 15%; }
  .depoimento .duas-colunas { flex-direction: column; }
  .depoimento .coluna-foto { padding: 0 9% 0 0; }
  .depoimento .coluna-foto__img { margin-bottom: -3.125rem; }
  .depoimento .coluna-texto { align-items: flex-start; text-align: left; padding: 0 35% 0 5%; }
  .depoimento__etiqueta { padding-left: 1.875rem; font-size: 2.1875rem; line-height: 1.2; }
  .depoimento__titulo { margin: 0 0 1.25rem; font-size: 2.1875rem; line-height: 1.2; padding-left: 1.875rem; }
  .depoimento__citacao { margin: 0 1.9375rem 0 1.975rem; padding: 1.25rem 0 4.125rem; }
  .depoimento__autor { margin-top: 1.5625rem; }
  .depoimento__fala { font-size: 1rem; line-height: 1.5; }
}
@media (min-width: 1025px) {
  .depoimento .duas-colunas { display: grid; }
  .depoimento .coluna-foto { padding: .625rem; }
  .depoimento .coluna-texto { padding: 1.875rem 0 1.875rem 3.75rem; }
  .depoimento__etiqueta { padding-left: 1.875rem; font-size: .75rem; line-height: 1.2; }
  .depoimento__titulo { padding-left: 1.875rem; font-size: 2rem; }
  .depoimento__citacao { margin: 0 2.0625rem 0 2.125rem; padding: 1.25rem 0 4.125rem; }
  .depoimento__autor { margin-top: 1.5625rem; }
  .depoimento__fala { font-size: 1rem; line-height: 1.5; }
}

/* ======================= MAPA ======================= */
.mapa { padding: 0 1.25rem 3.125rem; }
.mapa__interno { width: min(100%, 62.5rem); margin-inline: auto; }
.mapa .cabecalho { margin-bottom: 3.125rem; }
.mapa .subtitulo { font-size: 1.125rem; }
.mapa__quadro { border: .5rem solid #fff; background: #fff; box-shadow: var(--shadow-moldura); line-height: 0; }
.mapa__iframe { width: 100%; height: 25rem; border: 0; filter: saturate(0); transition: filter .3s ease; }
.mapa__iframe:hover { filter: saturate(1.12); }
@media (min-width: 768px) { .mapa { padding: 50px 0 100px; } }

/* ======================= RODAPÉ ======================= */
.rodape__cta { padding: 2.5rem 1.25rem; background: linear-gradient(170deg, #223a66 0%, #0e2653 100%); }
.rodape__cta-interno { display: grid; grid-template-columns: 1fr; width: min(100%, 71.25rem); margin-inline: auto; text-align: center; }
.rodape__cta-titulo { margin: 0 0 1.25rem; font: 500 1.5625rem/1.3 var(--font-titulo); color: #fff; }
.rodape__cta-sub { font: 300 1rem/1.2 var(--font-titulo); color: #fff; }
.rodape__cta-botao { margin-top: 1.25rem; padding: .625rem; }
.rodape__cta-texto { padding: 0; }
.rodape__saber { padding: .9375rem 1.6875rem; font-size: 1rem; }

.rodape__links { padding: 3.125rem 1.25rem 1.875rem; background: var(--color-footer); }
.rodape__links-interno { display: grid; grid-template-columns: 1fr 1fr; width: min(100%, 71.25rem); margin-inline: auto; }
.rodape__marca { margin-bottom: 3.125rem; }
.rodape__logo { width: 8.125rem; height: auto; }
.redes { display: flex; gap: .5625rem; margin-top: 1.25rem; padding-top: 1.25rem; }
.redes--centro { justify-content: center; }
.redes__link {
  display: flex; align-items: center; justify-content: center;
  width: 1.375rem; height: 1.375rem; border-radius: 50%;
  background: rgb(255 255 255 / .21); color: #fff; font-size: .625rem;
  transition: background-color .3s ease, color .3s ease;
}
.redes__link .icone { width: 1em; height: 1em; }
.redes__link:hover, .redes__link:focus-visible { background: #fff; color: #001c38; }
.rodape__titulo { margin: 0 0 1.25rem; font: 500 1rem/1rem var(--font-titulo); text-transform: uppercase; color: #fff; }
.rodape__lista { display: flex; flex-direction: column; gap: .3125rem; }
.rodape__lista a, .rodape__lista span { display: block; font: 200 .8125rem/1.5 var(--font-titulo); color: rgb(255 255 255 / .79); transition: color .3s ease; }
.rodape__lista a:hover, .rodape__lista a:focus-visible { color: #fff; }
.rodape__lista b { font-weight: 400; }
.rodape__barra { border-top: 1px solid rgb(255 255 255 / .06); background: var(--color-footer-bar); }
.rodape__barra-interno { display: flex; align-items: center; justify-content: space-between; width: min(100%, 71.25rem); min-height: 5.125rem; margin-inline: auto; padding: 1.875rem 1.25rem 1.25rem; }
.rodape__copy { font: 300 .75rem/.75rem var(--font-titulo); color: #fff; }
.rodape__copy b { font-weight: 400; }
.rodape__assinatura { display: block; opacity: .5; transition: opacity .3s ease; }
.rodape__assinatura:hover, .rodape__assinatura:focus-visible { opacity: 1; }
.rodape__assinatura img { width: 1.4375rem; height: 1.25rem; }

@media (min-width: 768px) {
  .rodape__cta { padding: 2.5rem 1.25rem; }
  .rodape__cta-interno { grid-template-columns: 70% 30%; align-items: center; text-align: left; }
  .rodape__cta-titulo { font-size: 1.875rem; line-height: 1.875rem; }
  .rodape__cta-sub { line-height: 1.5rem; }
  .rodape__cta-botao { margin-top: 0; }
  .rodape__cta-texto { padding: .625rem; }
  .rodape__links { padding: 3.125rem 1.25rem; }
  .rodape__links-interno { grid-template-columns: 25% 20% 22% 30%; }
  .rodape__marca { margin-bottom: 0; padding: .625rem; }
  .rodape__coluna { padding: .625rem; }
  .rodape__logo { width: 8.4375rem; }
  .rodape__barra-interno { min-height: 3.25rem; padding: .625rem 1.25rem; }
}
@media (min-width: 1025px) {
  .depoimento { margin-top: 0; }
  .rodape__cta { padding: 3.75rem 0; }
  .rodape__cta-interno { grid-template-columns: 80% 19.436%; width: min(100% - 2.5rem, 71.25rem); }
  .rodape__cta-texto { padding: .625rem 2.5rem .625rem .625rem; }
  .redes__link { width: 2.0625rem; height: 2.0625rem; font-size: .9375rem; }
  .rodape__links { padding: 4.375rem 0; }
  .rodape__links-interno { grid-template-columns: 40% 22.281% 21.49% 16.229%; width: min(100% - 2.5rem, 71.25rem); }
  .rodape__marca { padding: .625rem 5rem .625rem .625rem; }
  .rodape__coluna { padding: .625rem; }
  .rodape__logo { width: 11.25rem; }
  .rodape__lista a, .rodape__lista span { font-size: .875rem; }
  .rodape__barra-interno { min-height: 3.125rem; padding: .625rem; width: min(100% - 2.5rem, 71.25rem); }
}

/* ======================= MENU DO CELULAR (gaveta) ======================= */
.gaveta {
  position: fixed; inset: 0 0 0 auto; margin: 0; width: 18.75rem; max-width: 100%; height: 100dvh; max-height: none; padding: 0;
  border: 0; color: #fff;
  background: linear-gradient(130deg, #030a1c 0%, #17213a 100%);
  box-shadow: 2px 8px 23px 3px rgb(0 0 0 / .2);
  overflow: auto;
}
.gaveta::backdrop { background: rgb(0 0 0 / .8); }
.gaveta[open] { animation: gaveta-entra 1.2s ease both; }
@keyframes gaveta-entra { from { opacity: 0; transform: translateX(3.125rem); } to { opacity: 1; transform: none; } }
.gaveta__conteudo { position: relative; display: flex; flex-direction: column; justify-content: center; min-height: 100%; padding: 3.125rem; }
.gaveta__fechar { position: absolute; top: 1.6%; right: 83.2%; display: flex; width: 1.125rem; height: 1.125rem; align-items: center; justify-content: center; color: #fff; }
.gaveta__fechar svg { width: .6875rem; height: .6875rem; fill: currentColor; }
.gaveta__logo { display: block; margin: 0 -1.25rem 4.375rem 0; text-align: center; }
.gaveta__logo img { width: 10.125rem; height: auto; margin-inline: auto; }
.gaveta__filete { height: 0; margin: 0 0 1.25rem; border: 0; border-top: 1px solid rgb(255 255 255 / .12); }
.gaveta__lista { display: flex; flex-direction: column; gap: .3125rem; margin-bottom: 1.25rem; text-align: center; }
.gaveta__lista a { display: block; font: 300 .8125rem/1.5 var(--font-titulo); text-transform: uppercase; color: rgb(255 255 255 / .77); transition: color .3s ease; }
.gaveta__lista a:hover, .gaveta__lista a:focus-visible { color: #fff; }
.gaveta .redes { justify-content: center; margin-top: 3.125rem; padding-top: 0; }

@media (min-width: 768px) {
  .gaveta { width: 25rem; }
  .gaveta__conteudo { padding: 0 2.5rem; }
  .gaveta__fechar { top: 3.3%; right: 6.6%; }
  .gaveta__logo { margin: 0 0 1.25rem; }
  .gaveta__filete { margin: .9375rem 0 2.1875rem; }
  .gaveta__lista { margin-bottom: 1.25rem; }
  .gaveta .redes { margin-top: 0; }
}

@media (prefers-reduced-motion: reduce) {
  .gaveta[open] { animation: none; }
}
