/* ==========================================================================
   IBET — Inteligência Brasileira de Empresas e Transações

   Paleta centralizada em duas cores de marca (26/09/2026):
     --azul    #04193C  navy do topo e do cartão da proposta — único azul do site
     --dourado #ECA20D  amostrado de assets/logo-referencia.jpg ("bet" e anel)
   Os demais tons são derivados dessas duas e existem só por contraste.
   Contrastes WCAG conferidos:
     navy sobre dourado (botões)          8,05:1  AA
     dourado-claro sobre navy (etiquetas) 10,32:1 AA
     dourado-texto sobre branco           5,93:1  AA
     branco sobre navy                    17,36:1 AA
   O dourado puro reprova sobre branco (2,16:1) — por isso existe --dourado-texto.
   ========================================================================== */

:root {
  --azul: #04193C;
  --azul-rgb: 4, 25, 60;

  --dourado: #ECA20D;
  --dourado-rgb: 236, 162, 13;
  --dourado-claro: #F6C022;   /* hover e texto dourado sobre o navy */
  --dourado-texto: #8A5A00;   /* texto dourado sobre fundo claro */

  --fundo: #FFFFFF;
  --fundo-claro: #F4F6F9;
  --borda: #DCE2EA;

  --texto: #14203A;
  --texto-suave: #4A5568;
  --texto-claro: rgba(255, 255, 255, 0.88);

  --borda-campo: #7C8799;     /* contorno de input sobre fundo claro — 3,35:1 (mín. 3:1) */

  --largura: 1140px;
  --raio: 10px;

  /* Elevação em fundo claro. Em fundo azul, sombra escura não aparece —
     lá os cartões usam contorno claro (ver .diferenciais). */
  --shadow-sm: 0 2px 6px rgba(var(--azul-rgb), .08);
  --shadow-lg: 0 24px 60px -20px rgba(var(--azul-rgb), .35);

  /* Luz dourada discreta vinda do canto superior direito, sobre o navy.
     No pico, o fundo chega a rgb(32,41,54): texto-claro ainda dá 11,62:1. */
  --glow: radial-gradient(1100px 600px at 80% -10%, rgba(var(--dourado-rgb), .12), rgba(var(--dourado-rgb), 0));

  /* Navy com 12% do dourado — o mesmo tom do glow, usado dentro do overlay do hero */
  --azul-dourado-rgb: 32, 41, 54;

  --transicao: 180ms ease;
}

@media (max-width: 640px) {
  :root { --glow: radial-gradient(520px 360px at 90% -8%, rgba(var(--dourado-rgb), .12), rgba(var(--dourado-rgb), 0)); }
}

*, *::before, *::after { box-sizing: border-box; }

html { scroll-behavior: smooth; scroll-padding-top: 88px; -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  background: var(--fundo);
  color: var(--texto);
  font-family: "Segoe UI", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif;
  font-size: 1.0625rem;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}

img { max-width: 100%; height: auto; }

h1, h2, h3 { line-height: 1.22; margin: 0 0 .6em; font-weight: 700; letter-spacing: -.01em; }
h1 { font-size: clamp(2rem, 6vw, 3.25rem); }
h2 { font-size: clamp(1.5rem, 4vw, 2.25rem); }
h3 { font-size: 1.0625rem; }
p  { margin: 0 0 1.1em; }

a { color: var(--azul); text-decoration-thickness: 1px; text-underline-offset: 3px; }
a:hover { color: var(--dourado-texto); }

:focus-visible {
  outline: 3px solid var(--dourado);
  outline-offset: 3px;
  border-radius: 4px;
}

.container { width: 100%; max-width: var(--largura); margin-inline: auto; padding-inline: 20px; }
@media (max-width: 380px) { .container { padding-inline: 16px; } }

.skip-link {
  position: absolute; left: 12px; top: -60px; z-index: 1000;
  background: var(--dourado); color: var(--azul);
  padding: 10px 18px; border-radius: var(--raio); font-weight: 700; text-decoration: none;
  transition: top var(--transicao);
}
.skip-link:focus { top: 12px; }

/* ---------- Topo ---------- */

.topo {
  position: sticky; top: 0; z-index: 90;
  background: var(--azul);
  border-bottom: 1px solid rgba(var(--dourado-rgb), .28);
}
/* Vidro fosco: só com fundo parcialmente transparente o blur aparece.
   Sem suporte a backdrop-filter, o topo fica com o navy sólido acima. */
@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
  .topo {
    background: rgba(var(--azul-rgb), .9);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
  }
}
.topo__linha {
  display: flex; align-items: center; justify-content: space-between;
  gap: 16px; min-height: 72px; flex-wrap: wrap;
}
.marca { display: inline-flex; align-items: center; padding-block: 6px; }
.marca img { display: block; height: 52px; width: auto; }
@media (max-width: 480px) { .marca img { height: 46px; } }

.menu-botao {
  display: inline-flex; flex-direction: column; justify-content: center; gap: 5px;
  width: 44px; height: 44px; padding: 10px;
  background: transparent; border: 1px solid rgba(255, 255, 255, .3);
  border-radius: 8px; cursor: pointer;
}
.menu-botao span { display: block; height: 2px; background: #fff; border-radius: 2px; }

.menu { flex-basis: 100%; display: none; }
.menu.aberto { display: block; }
.menu ul { list-style: none; margin: 0 0 14px; padding: 0; display: flex; flex-direction: column; gap: 2px; }
.menu a {
  display: block; padding: 11px 4px; color: var(--texto-claro);
  text-decoration: none; font-size: .975rem; border-radius: 6px;
}
.menu a:hover { color: var(--dourado-claro); }
.menu__cta {
  margin-top: 6px; text-align: center; background: var(--dourado);
  color: var(--azul) !important; font-weight: 700; padding: 11px 18px !important;
}
.menu__cta:hover { background: var(--dourado-claro); }

@media (min-width: 900px) {
  .menu-botao { display: none; }
  .menu { display: block; flex-basis: auto; }
  .menu ul { flex-direction: row; align-items: center; gap: 4px; margin-bottom: 0; }
  .menu a { padding: 9px 12px; }
}

/* ---------- Botões ---------- */

.botao {
  display: inline-flex; align-items: center; justify-content: center; gap: 9px;
  min-height: 52px; padding: 14px 26px;
  border: 2px solid transparent; border-radius: var(--raio);
  font: inherit; font-weight: 700; font-size: 1rem; line-height: 1.3;
  text-align: center; text-decoration: none; cursor: pointer;
  transition: background var(--transicao), color var(--transicao), transform var(--transicao);
}
.botao:hover { transform: translateY(-1px); }

/* Rótulos de ação em caixa alta, como definidos pelo cliente. O texto no HTML
   fica em caixa normal para leitores de tela não soletrarem letra a letra. */
.botao--principal, .botao--contorno { text-transform: uppercase; letter-spacing: .03em; font-size: .95rem; }

.botao--principal {
  background: var(--dourado); color: var(--azul);
  box-shadow: 0 0 0 6px rgba(var(--dourado-rgb), .18), 0 8px 28px -4px rgba(var(--dourado-rgb), .55);
}
.botao--principal:hover {
  background: var(--dourado-claro); color: var(--azul);
  box-shadow: 0 0 0 8px rgba(var(--dourado-rgb), .22), 0 10px 32px -4px rgba(var(--dourado-rgb), .65);
}

.botao--contorno { background: transparent; border-color: currentColor; color: var(--azul); }
.botao--contorno:hover { background: var(--azul); border-color: var(--azul); color: #fff; }
.secao--escura .botao--contorno, .cta-final .botao--contorno { background: #fff; border-color: #fff; color: var(--azul); }
.secao--escura .botao--contorno:hover, .cta-final .botao--contorno:hover {
  background: #fff; border-color: #fff; color: var(--azul);
  box-shadow: 0 0 0 8px rgba(var(--dourado-rgb), .22), 0 10px 32px -4px rgba(var(--dourado-rgb), .65);
}

.botao--largo { width: 100%; }

.acoes-centro { display: flex; flex-wrap: wrap; gap: 14px; justify-content: center; margin-top: 28px; }

/* ---------- Hero ---------- */

/* Fundo: foto corporativa licenciada (assets/hero-bg.*) sob UM overlay navy.
   O overlay é mais denso à esquerda, onde fica o texto, para manter AA mesmo
   sobre as áreas claras do céu. O toque dourado está dentro desse mesmo
   gradiente: a ponta do lado da foto usa o navy com 12% de dourado
   (--azul-dourado-rgb), em vez de somar uma terceira camada.
   A foto é decorativa: o texto não depende dela. */
.hero {
  --hero-overlay: linear-gradient(80deg,
    rgba(var(--azul-rgb), .96) 0%,
    rgba(var(--azul-rgb), .90) 45%,
    rgba(var(--azul-dourado-rgb), .62) 100%);
  position: relative;
  color: #fff;
  padding-block: clamp(64px, 12vw, 128px);
  background-color: var(--azul);
  background-image: var(--hero-overlay), url("assets/hero-bg-800.jpg");
  background-image: var(--hero-overlay),
    image-set(url("assets/hero-bg-800.webp") type("image/webp"), url("assets/hero-bg-800.jpg") type("image/jpeg"));
  background-size: cover;
  background-position: 70% center;
}
@media (min-width: 801px) {
  .hero {
    --hero-overlay: linear-gradient(80deg,
      rgba(var(--azul-rgb), .96) 0%,
      rgba(var(--azul-rgb), .88) 45%,
      rgba(var(--azul-rgb), .66) 72%,
      rgba(var(--azul-dourado-rgb), .55) 100%);
    background-image: var(--hero-overlay), url("assets/hero-bg.jpg");
    background-image: var(--hero-overlay),
      image-set(url("assets/hero-bg.webp") type("image/webp"), url("assets/hero-bg.jpg") type("image/jpeg"));
  }
}
/* Em telas estreitas o texto ocupa a largura toda: overlay uniforme em .90,
   com o tom dourado só no canto superior direito */
@media (max-width: 640px) {
  .hero {
    --hero-overlay: linear-gradient(200deg,
      rgba(var(--azul-dourado-rgb), .90) 0%,
      rgba(var(--azul-rgb), .90) 45%);
  }
}

.hero__conteudo > * { max-width: 760px; }
.hero__sobretitulo {
  margin: 0 0 14px; color: var(--dourado-claro);
  font-size: .82rem; font-weight: 700; letter-spacing: .11em; text-transform: uppercase;
}
.hero h1 { color: #fff; margin-bottom: .4em; text-transform: uppercase; letter-spacing: .01em; }
.hero__subtitulo {
  font-size: clamp(1.15rem, 2.8vw, 1.45rem); font-weight: 600; line-height: 1.4;
  color: #fff; margin-bottom: .8em;
}
.hero__linha { font-size: clamp(1.0625rem, 2.2vw, 1.15rem); color: var(--texto-claro); max-width: 62ch; }

.hero__acoes { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 30px; }
.hero__acoes .botao { flex: 0 1 auto; }
@media (max-width: 560px) { .hero__acoes .botao { flex: 1 1 100%; } }

.hero__tagline {
  margin-top: 28px; margin-bottom: 0;
  color: var(--dourado-claro); font-size: .9rem; font-weight: 600; letter-spacing: .06em;
}

/* ---------- Faixa de fatos ---------- */

.fatos {
  background: var(--azul); color: #fff; padding-block: 26px;
  border-top: 1px solid rgba(var(--dourado-rgb), .35);
}
.fatos__grade { display: grid; gap: 22px; }
.fato strong { display: block; color: var(--dourado-claro); font-size: 1.15rem; line-height: 1.3; }
.fato span { display: block; margin-top: 4px; color: var(--texto-claro); font-size: .92rem; }

@media (min-width: 760px) { .fatos__grade { grid-template-columns: repeat(3, 1fr); gap: 32px; } }

/* ---------- Seções ---------- */

.secao { padding-block: clamp(48px, 9vw, 88px); }
.secao--clara { background: var(--fundo-claro); }
.secao--escura { background: var(--glow), var(--azul); color: #fff; }
.secao--escura h2, .secao--escura h3 { color: #fff; }
.secao--escura p, .secao--escura li { color: var(--texto-claro); }
.secao--escura a:not(.botao) { color: var(--dourado-claro); }

/* Mantém a largura do container para o bloco alinhar no mesmo gutter das seções
   largas, e limita a medida de leitura nos filhos. Sem isso, margin-inline:auto
   do .container centraliza o bloco de 760px e o início do texto pula de seção
   para seção. */
.secao__estreita > * { max-width: 760px; }
.secao__etiqueta {
  margin: 0 0 10px; color: var(--dourado-texto);
  font-size: .78rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase;
}
.secao--escura .secao__etiqueta, .cta-final .secao__etiqueta { color: var(--dourado-claro); }
.secao__apoio { font-size: 1.08rem; color: var(--texto-suave); max-width: 62ch; }
.secao--escura .secao__apoio { color: var(--texto-claro); }

.destaque {
  margin-top: 28px; padding: 20px 22px;
  border-left: 4px solid var(--dourado);
  background: var(--fundo-claro); border-radius: 0 var(--raio) var(--raio) 0;
  font-size: 1.06rem; font-weight: 600;
}
.secao--clara .destaque { background: #fff; }
.secao--escura .destaque { background: var(--fundo-claro); color: var(--texto); }

/* ---------- Não somos um classificado ---------- */

.classificado h2 { color: var(--azul); }
.selos {
  list-style: none; margin: 26px 0 0; padding: 0;
  display: flex; flex-wrap: wrap; gap: 10px;
}
.selos li {
  padding: 9px 16px; border-radius: 999px;
  background: var(--azul); color: var(--dourado-claro);
  font-size: .8rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
}

/* ---------- Cartões ---------- */

.cartoes { list-style: none; margin: 34px 0 0; padding: 0; display: grid; gap: 16px; }
@media (min-width: 640px) { .cartoes { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 980px) { .cartoes { grid-template-columns: repeat(3, 1fr); } }

.cartao {
  background: #fff; border: 1px solid var(--borda);
  border-radius: var(--raio); padding: 22px 22px 18px;
  border-top: 3px solid var(--dourado);
  box-shadow: var(--shadow-sm), var(--shadow-lg);
}
.cartao h3 { color: var(--azul); margin-bottom: .45em; }
.cartao p { margin: 0; color: var(--texto-suave); font-size: .97rem; }

/* ---------- Etapas ---------- */

/* Diagrama de processo: os círculos numerados são ligados por uma linha
   dourada. Cada etapa (menos a última) desenha o trecho até a próxima no
   ::after, que passa por trás do círculo seguinte (z-index). Vertical no
   mobile e tablet, horizontal a partir de 1000px. */
.etapas {
  --circulo: 46px;
  --vao: 28px;
  --linha: rgba(var(--dourado-rgb), .55);
  list-style: none; margin: 40px 0 0; padding: 0; counter-reset: etapa;
  display: grid; gap: var(--vao);
}

.etapa {
  counter-increment: etapa;
  position: relative;
  display: grid; grid-template-columns: var(--circulo) 1fr; column-gap: 18px;
  align-items: start;
}
.etapa::before {
  content: counter(etapa, decimal-leading-zero);
  position: relative; z-index: 1;
  grid-row: 1 / span 2;
  display: inline-flex; align-items: center; justify-content: center;
  width: var(--circulo); height: var(--circulo);
  background: var(--azul); color: var(--dourado-claro);
  border: 2px solid var(--dourado);
  border-radius: 50%; font-weight: 700; font-size: 1rem;
}
.etapa:not(:last-child)::after {
  content: ""; position: absolute;
  left: calc(var(--circulo) / 2 - 1px);
  top: var(--circulo);
  height: calc(100% - var(--circulo) + var(--vao));
  width: 2px; background: var(--linha);
}
.etapa h3 {
  grid-column: 2; margin: 10px 0 .3em;
  color: #fff; font-size: .95rem; letter-spacing: .08em; text-transform: uppercase;
}
.etapa p { grid-column: 2; margin: 0; font-size: .97rem; }

@media (min-width: 1000px) {
  .etapas { grid-template-columns: repeat(5, 1fr); --vao: 20px; }
  .etapa { grid-template-columns: 1fr; justify-items: center; text-align: center; }
  .etapa::before { grid-row: auto; }
  .etapa h3 { grid-column: 1; margin-top: 16px; }
  .etapa p { grid-column: 1; max-width: 22ch; }
  .etapa:not(:last-child)::after {
    top: calc(var(--circulo) / 2 - 1px);
    left: calc(50% + var(--circulo) / 2);
    width: calc(100% + var(--vao) - var(--circulo));
    height: 2px;
  }
}

/* ---------- Como funciona — acabamento premium ---------- */

#como-funciona { position: relative; overflow: hidden; }
#como-funciona::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background:
    radial-gradient(760px 420px at 12% 108%, rgba(var(--dourado-rgb), .14), transparent 60%),
    radial-gradient(620px 360px at 88% -12%, rgba(var(--dourado-rgb), .22), transparent 60%);
}
#como-funciona .container { position: relative; z-index: 1; }

#como-funciona #como-titulo {
  background: linear-gradient(90deg, #fff 35%, var(--dourado-claro));
  -webkit-background-clip: text; background-clip: text; color: transparent;
}

#como-funciona .etapas {
  --linha: linear-gradient(90deg, rgba(var(--dourado-rgb), .12), rgba(var(--dourado-rgb), .9), rgba(var(--dourado-rgb), .12));
}
#como-funciona .etapa::before {
  background: linear-gradient(150deg, #0d2c58, var(--azul));
  box-shadow: 0 0 0 4px rgba(var(--dourado-rgb), .18), 0 0 26px 3px rgba(var(--dourado-rgb), .55);
}

.lista-simples { margin: 0 0 1.1em; padding-left: 1.15em; }
.lista-simples li { margin-bottom: .4em; color: var(--texto-suave); }
.secao--escura .lista-simples li { color: var(--texto-claro); }

/* ---------- Diferenciais ---------- */

.diferenciais { list-style: none; margin: 34px 0 0; padding: 0; display: grid; gap: 18px; }
@media (min-width: 760px) { .diferenciais { grid-template-columns: repeat(2, 1fr); } }

/* Em fundo azul a sombra escura some: a profundidade vem de um contorno mais
   claro que o fundo e de um filete de luz na borda superior. */
.diferenciais li {
  padding: 20px 22px;
  background: rgba(255, 255, 255, .05);
  border: 1px solid rgba(255, 255, 255, .14);
  border-radius: var(--raio);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .10), 0 0 0 1px rgba(var(--azul-rgb), .6);
}
.diferenciais h3 { color: var(--dourado-claro); margin-bottom: .4em; }
.diferenciais p { margin: 0; font-size: .97rem; }

/* ---------- Proposta ---------- */

.proposta {
  margin-top: 30px; border: 1px solid var(--borda); border-radius: var(--raio);
  overflow: hidden; box-shadow: var(--shadow-sm), var(--shadow-lg);
}
.proposta__valores { display: grid; }
@media (min-width: 760px) { .proposta__valores { grid-template-columns: repeat(2, 1fr); } }

.valor { padding: 26px 24px; background: var(--azul); color: #fff; }
.valor + .valor { border-top: 1px solid rgba(255, 255, 255, .14); }
@media (min-width: 760px) { .valor + .valor { border-top: 0; border-left: 1px solid rgba(255, 255, 255, .14); } }

.valor__rotulo {
  display: block; color: var(--dourado-claro);
  font-size: .78rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
}
.valor__numero { display: block; margin: 6px 0 12px; font-size: 2rem; line-height: 1.15; color: #fff; }
.valor p { margin: 0; font-size: .95rem; color: var(--texto-claro); }

.aviso {
  margin: 0; padding: 18px 24px;
  background: #FFF6E0; border-top: 1px solid #EBD08F;
  font-size: .94rem; color: #4A3B08;
}

/* ---------- Compradores ---------- */

.compradores { border-top: 4px solid var(--dourado); }

/* ---------- Frase de destaque ---------- */

.chamada { background: var(--fundo-claro); padding-block: clamp(40px, 7vw, 64px); }
.chamada__texto {
  margin: 0 auto; max-width: 820px; text-align: center;
  font-size: clamp(1.15rem, 2.6vw, 1.45rem); line-height: 1.5; font-weight: 600; color: var(--azul);
}
.chamada__texto::before {
  content: ""; display: block; width: 56px; height: 4px; margin: 0 auto 20px;
  background: var(--dourado); border-radius: 2px;
}

/* ---------- Formulário ---------- */

/* O formulário fica em seção clara (secao--clara) desde 26/09/2026. */
.formulario { margin-top: 30px; }

.perfil { border: 0; margin: 0 0 22px; padding: 0; min-width: 0; }
.perfil legend { padding: 0; margin-bottom: 10px; font-size: .92rem; font-weight: 600; color: var(--texto); }
.perfil__opcoes { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.perfil__opcao { position: relative; display: block; }
.perfil__opcao input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.perfil__opcao span {
  display: flex; align-items: center; justify-content: center; min-height: 52px;
  padding: 10px 12px; border-radius: 8px; text-align: center;
  border: 2px solid var(--azul); color: #fff; background: var(--azul);
  font-weight: 700; font-size: .95rem; line-height: 1.3;
  transition: background var(--transicao), border-color var(--transicao), color var(--transicao);
}
.perfil__opcao input:checked + span { background: var(--dourado); border-color: var(--dourado); color: var(--azul); }
.perfil__opcao input:focus-visible + span { outline: 3px solid var(--azul); outline-offset: 3px; }

.formulario__grade { display: grid; gap: 16px; }
.formulario__grade + .formulario__grade { margin-top: 16px; }
.formulario__grade[hidden] { display: none; }
@media (min-width: 700px) {
  .formulario__grade { grid-template-columns: repeat(2, 1fr); }
  .campo--largo { grid-column: 1 / -1; }
}

.campo { margin: 0; display: flex; flex-direction: column; gap: 6px; }
.campo label { font-size: .92rem; font-weight: 600; color: var(--texto); }
.campo input, .campo textarea {
  width: 100%; min-height: 48px; padding: 12px 14px;
  font: inherit; font-size: 1rem; color: var(--texto);
  background: #fff; border: 1px solid var(--borda-campo); border-radius: 8px;
}
.campo input:focus, .campo textarea:focus { border-color: var(--azul); }
.campo textarea { resize: vertical; min-height: 110px; }
.campo input::placeholder, .campo textarea::placeholder { color: #6B7587; }
.obrig { color: var(--dourado-texto); }
.opcional { font-weight: 400; color: var(--texto-suave); font-size: .85rem; }

.campo--consentimento {
  flex-direction: row; align-items: flex-start; gap: 11px;
  margin-top: 20px;
}
.campo--consentimento input { width: 22px; height: 22px; min-height: 0; flex: none; margin-top: 2px; accent-color: var(--dourado); }
.campo--consentimento label { font-weight: 400; font-size: .92rem; line-height: 1.5; }

.campo-oculto { position: absolute; left: -9999px; }

.formulario button[type="submit"] { margin-top: 22px; }
.formulario__nota { margin: 14px 0 0; font-size: .85rem; color: var(--texto-suave); }

/* ---------- CTA final ---------- */

.cta-final { background: var(--glow), var(--azul); color: #fff; text-align: center; }
.cta-final .secao__estreita > * { margin-inline: auto; }
.cta-final h2, .cta-final h1 { color: #fff; }
.cta-final p { color: var(--texto-claro); }
.cta-final .hero__acoes { justify-content: center; }

/* ---------- Rodapé ---------- */

.rodape {
  background: var(--azul); color: var(--texto-claro);
  border-top: 3px solid var(--dourado);
  padding-top: 48px; font-size: .95rem;
}
.rodape__grade { display: grid; gap: 32px; padding-bottom: 36px; }
@media (min-width: 820px) { .rodape__grade { grid-template-columns: 1.4fr 1fr 1fr; gap: 40px; } }

.rodape__marca img { display: block; height: 88px; width: auto; }
.rodape__marca p { margin: 12px 0 0; max-width: 34ch; }
.rodape__tagline { color: var(--dourado-claro); font-weight: 600; font-size: .88rem; letter-spacing: .05em; }

.rodape__bloco h2 {
  font-size: .8rem; letter-spacing: .12em; text-transform: uppercase;
  color: var(--dourado-claro); margin-bottom: 14px;
}
.rodape__bloco ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 9px; }
.rodape a { color: var(--texto-claro); text-decoration: none; }
.rodape a:hover { color: var(--dourado-claro); text-decoration: underline; }

.rodape__fim { border-top: 1px solid rgba(255, 255, 255, .12); padding-block: 20px; }
/* Páginas internas: rodapé só com a linha final, sem a grade acima */
.rodape:not(:has(.rodape__grade)) { padding-top: 8px; }
.rodape:not(:has(.rodape__grade)) .rodape__fim { border-top: 0; }
.rodape__fim p { margin: 0; font-size: .85rem; color: rgba(255, 255, 255, .75); }
.rodape__links { list-style: none; margin: 10px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px 0; font-size: .85rem; }
.rodape__links li + li::before { content: "|"; margin: 0 10px; color: rgba(255, 255, 255, .4); }
.rodape__links a { color: rgba(255, 255, 255, .85); text-decoration: underline; }

/* ---------- Aviso de cookies ---------- */

.cookies {
  position: fixed; inset-inline: 0; bottom: 0; z-index: 100;
  padding: 14px 16px calc(14px + env(safe-area-inset-bottom));
  background: var(--azul);
  border-top: 2px solid var(--dourado);
  box-shadow: 0 -6px 24px rgba(0, 0, 0, .24);
}
.cookies__caixa {
  max-width: var(--largura); margin-inline: auto;
  display: grid; gap: 12px; align-items: center;
}
.cookies__titulo { font-size: 1rem; margin: 0; color: #fff; }
.cookies p { margin: 0; font-size: .9rem; color: var(--texto-claro); }
.cookies a { color: var(--dourado-claro); }
.cookies__acoes { display: flex; flex-wrap: wrap; gap: 10px; }
.cookies__acoes .botao { min-height: 44px; padding: 10px 22px; font-size: .9rem; }
.cookies .botao--contorno { color: #fff; }
.cookies .botao--contorno:hover { background: #fff; color: var(--azul); }

@media (min-width: 900px) {
  .cookies__caixa { grid-template-columns: 1fr auto; gap: 24px; }
  .cookies__titulo { grid-column: 1; }
  .cookies p { grid-column: 1; grid-row: 2; }
  .cookies__acoes { grid-column: 2; grid-row: 1 / span 2; }
}

/* ---------- Páginas de texto (política e termos) ---------- */

.pagina-texto { padding-block: clamp(40px, 8vw, 72px); }
.pagina-texto .container { max-width: 760px; }
.pagina-texto h2 { font-size: 1.3rem; margin-top: 2em; }
.pagina-texto .voltar { display: inline-block; margin-bottom: 24px; font-weight: 600; }
.pagina-texto .atualizado {
  margin-top: 36px; padding-top: 18px; border-top: 1px solid var(--borda);
  font-size: .9rem; color: var(--texto-suave);
}

/* ---------- Preferências do usuário ---------- */

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: .001ms !important; animation-iteration-count: 1 !important;
    transition-duration: .001ms !important; scroll-behavior: auto !important;
  }
  .botao:hover { transform: none; }
}

@media print {
  .topo, .cookies, .hero__acoes, .acoes-centro { display: none !important; }
  body { color: #000; background: #fff; }
  .hero { background: none; color: #000; }
}