/* ==========================================================================
   MADEIREIRA WALMAR — Design System
   Tudo em Madeira. Desde 1984.
   ========================================================================== */

/* -------------------- Tokens -------------------- */
:root {
  /* Marca */
  --verde: #1E3B2E;
  --verde-escuro: #122720;
  --verde-claro: #2C4F3D;
  --madeira: #8B5A2B;
  --madeira-escura: #6B4520;
  --madeira-clara: #B98A54;
  --creme: #F2EDE2;
  --creme-escuro: #E7DFCC;
  --grafite: #222222;
  --grafite-suave: #5B5B54;
  --branco: #FFFFFF;
  --whatsapp: #25D366;
  --whatsapp-escuro: #1DA851;

  /* Tipografia */
  --fonte-titulo: 'Roboto Slab', 'Georgia', serif;
  --fonte-corpo: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --fonte-utilitaria: 'IBM Plex Mono', 'Courier New', monospace;

  /* Layout */
  --container: 1180px;
  --raio: 6px;
  --raio-peq: 4px;
  --sombra: 0 2px 10px rgba(18, 39, 32, 0.08);
  --sombra-media: 0 8px 28px rgba(18, 39, 32, 0.14);
  --transicao: 180ms ease;
}

@media (prefers-reduced-motion: reduce) {
  :root { --transicao: 0ms; }
  *, *::before, *::after { animation-duration: 0.001ms !important; animation-iteration-count: 1 !important; transition-duration: 0.001ms !important; scroll-behavior: auto !important; }
}

/* -------------------- Reset -------------------- */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
svg { max-width: 100%; height: auto; display: inline-block; vertical-align: middle; }
body {
  margin: 0;
  font-family: var(--fonte-corpo);
  color: var(--grafite);
  background: var(--branco);
  font-size: 16px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}
img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
ul { list-style: none; margin: 0; padding: 0; }
button { font-family: inherit; cursor: pointer; }
h1, h2, h3, h4 { font-family: var(--fonte-titulo); line-height: 1.2; margin: 0 0 0.5em; color: var(--verde); font-weight: 700; }
p { margin: 0 0 1em; }
address { font-style: normal; }

:focus-visible {
  outline: 3px solid var(--madeira);
  outline-offset: 2px;
}

/* -------------------- Layout helpers -------------------- */
.container { width: 100%; max-width: var(--container); margin: 0 auto; padding: 0 24px; }
.secao { padding: 88px 0; }
.secao--compacta { padding: 40px 0; }
.secao--creme { background: var(--creme); }
.secao--creme-escuro { background: var(--creme-escuro); }
.secao--verde { background: var(--verde); color: var(--creme); }
.secao--verde h2, .secao--verde h3 { color: var(--branco); }
.secao--branca { background: var(--branco); }
.grade { display: grid; gap: 32px; }
.grade--2 { grid-template-columns: repeat(2, 1fr); }
.grade--3 { grid-template-columns: repeat(3, 1fr); }
.grade--4 { grid-template-columns: repeat(4, 1fr); }
.grade--5 { grid-template-columns: repeat(5, 1fr); }
@media (max-width: 980px) {
  .grade--3, .grade--4 { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 620px) {
  .secao { padding: 56px 0; }
  .grade--2, .grade--3, .grade--4 { grid-template-columns: 1fr; }
}
/* grade--5 tem cascata própria: 5 cols (largo) -> 3 (notebook) -> 2 (tablet) -> 1 (celular) */
@media (max-width: 1180px) { .grade--5 { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 780px)  { .grade--5 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px)  { .grade--5 { grid-template-columns: 1fr; } }

.reveal { opacity: 0; transform: translateY(14px); transition: opacity 520ms ease, transform 520ms ease; }
.reveal.is-visible { opacity: 1; transform: translateY(0); }

/* -------------------- Assinatura: Etiqueta de madeira --------------------
   Elemento de assinatura do site: pequenas etiquetas com "furo de amarração",
   como as usadas para identificar lotes de madeira no pátio — usadas com
   moderação em eyebrows, badges e marcadores de linha do tempo. */
.etiqueta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: var(--fonte-utilitaria);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--madeira-escura);
  border: 1.5px solid var(--madeira);
  border-radius: var(--raio-peq);
  padding: 6px 12px 6px 10px;
  background: rgba(139, 90, 43, 0.06);
}
.etiqueta::before {
  content: '';
  width: 6px;
  height: 6px;
  border-radius: 50%;
  border: 1.5px solid var(--madeira);
  flex: none;
}
.secao--verde .etiqueta { color: var(--creme); border-color: var(--madeira-clara); background: rgba(242, 237, 226, 0.12); }
.secao--verde .etiqueta::before, .hero .etiqueta::before { border-color: var(--madeira-clara); background: var(--madeira-clara); }
/* Hero: fundo é foto real + degradê (não cor sólida) — nas partes onde o
   degradê fica mais transparente, uma foto clara por trás derrubaria o
   contraste do texto claro. Por isso a etiqueta aqui leva um fundo verde
   escuro BEM opaco (0.72), funcionando como uma "chapinha" que garante
   contraste alto (~6,8:1 no pior caso testado) não importa o que esteja
   atrás dela na foto. */
.hero .etiqueta { color: var(--creme); border-color: var(--madeira-clara); background: rgba(18, 39, 32, 0.72); }
.hero .etiqueta { font-size: 13px; padding: 7px 14px 7px 11px; }

.eyebrow-wrap { margin-bottom: 14px; }

/* -------------------- Cabeçalho de seção -------------------- */
.cabecalho-secao { max-width: 680px; margin-bottom: 44px; }
.cabecalho-secao.centralizado { margin-left: auto; margin-right: auto; text-align: center; }
.cabecalho-secao h2 { font-size: clamp(1.65rem, 1.3rem + 1.4vw, 2.4rem); margin-bottom: 0.4em; }
.cabecalho-secao__regua {
  width: 46px; height: 3px; background: var(--madeira); border-radius: 2px; margin-bottom: 18px;
}
.cabecalho-secao.centralizado .cabecalho-secao__regua { margin-left: auto; margin-right: auto; }
.cabecalho-secao p { color: var(--grafite-suave); font-size: 1.05rem; }

/* -------------------- Botões -------------------- */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 14px 26px;
  border-radius: var(--raio);
  font-weight: 600;
  font-size: 0.98rem;
  border: 2px solid transparent;
  transition: background var(--transicao), color var(--transicao), border-color var(--transicao), transform var(--transicao);
  white-space: nowrap;
}
.btn svg { width: 19px; height: 19px; flex: none; }
.btn--primario { background: var(--madeira); color: var(--branco); }
.btn--primario:hover { background: var(--madeira-escura); transform: translateY(-1px); }
.btn--secundario { background: transparent; color: var(--branco); border-color: rgba(242,237,226,0.55); }
.btn--secundario:hover { background: rgba(242, 237, 226, 0.12); border-color: var(--creme); }
.btn--verde { background: var(--verde); color: var(--branco); }
.btn--verde:hover { background: var(--verde-escuro); transform: translateY(-1px); }
.btn--contorno { background: transparent; color: var(--verde); border-color: var(--verde); }
.btn--contorno:hover { background: var(--verde); color: var(--branco); }
.btn--whatsapp { background: var(--whatsapp); color: var(--branco); }
.btn--whatsapp:hover { background: var(--whatsapp-escuro); transform: translateY(-1px); }
.btn--grande { padding: 16px 32px; font-size: 1.05rem; }
.btn--bloco { width: 100%; }

/* -------------------- Cabeçalho / Nav -------------------- */
.cabecalho {
  position: sticky; top: 0; z-index: 200;
  background: var(--branco);
  box-shadow: var(--sombra);
}
.ancora-secao { scroll-margin-top: 105px; }
.cabecalho__barra { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 12px 0; }
.cabecalho__logo { display: flex; align-items: center; flex: none; }
.cabecalho__logo img { height: 68px; width: auto; }
.nav-principal { display: flex; align-items: center; gap: 18px; }
.nav-principal a {
  font-size: 0.88rem; font-weight: 600; color: var(--verde); white-space: nowrap;
  padding: 6px 1px; border-bottom: 2px solid transparent; transition: border-color var(--transicao), color var(--transicao);
}
.nav-principal a:hover, .nav-principal a[aria-current="page"] { border-color: var(--madeira); }
.cabecalho__acoes { display: flex; align-items: center; gap: 10px; flex: none; }
.cabecalho__acoes .btn--primario { padding: 12px 18px; font-size: 0.92rem; white-space: nowrap; }
.cabecalho__whatsapp-icone {
  display: inline-flex; align-items: center; justify-content: center;
  width: 42px; height: 42px; border-radius: 50%; background: var(--whatsapp); color: var(--branco); flex: none;
  transition: background var(--transicao);
}
.cabecalho__whatsapp-icone:hover { background: var(--whatsapp-escuro); }
.cabecalho__whatsapp-icone svg { width: 22px; height: 22px; }

.botao-menu {
  display: none; align-items: center; justify-content: center;
  width: 44px; height: 44px; border: none; background: transparent; color: var(--verde); flex: none;
}
.botao-menu svg { width: 26px; height: 26px; }

.menu-mobile {
  display: none;
  position: fixed; inset: 0; z-index: 300;
  background: var(--verde); color: var(--creme);
  padding: 20px 24px; overflow-y: auto;
}
.menu-mobile.aberto { display: block; }
.menu-mobile__topo { display: flex; align-items: center; justify-content: space-between; margin-bottom: 32px; }
.menu-mobile__topo img { height: 46px; display: block; }
.menu-mobile__fechar { background: none; border: none; color: var(--creme); width: 40px; height: 40px; }
.menu-mobile__fechar svg { width: 26px; height: 26px; }
.menu-mobile nav ul { display: flex; flex-direction: column; }
.menu-mobile nav a {
  display: block; padding: 16px 0; font-size: 1.25rem; font-family: var(--fonte-titulo); font-weight: 700;
  color: var(--branco); border-bottom: 1px solid rgba(242,237,226,0.15);
}
.menu-mobile__acoes { margin-top: 28px; display: flex; flex-direction: column; gap: 14px; }
.menu-mobile__contato { margin-top: 32px; font-size: 0.95rem; color: rgba(242,237,226,0.8); }
.menu-mobile__contato a { color: var(--creme); font-weight: 600; }
.menu-mobile__contato p { margin-bottom: 6px; }

@media (max-width: 1140px) {
  .nav-principal, .cabecalho__acoes .btn { display: none; }
  .cabecalho__acoes .cabecalho__whatsapp-icone { display: none; }
  .botao-menu { display: inline-flex; }
}

/* -------------------- Hero -------------------- */
.hero {
  position: relative;
  color: var(--branco);
  padding: 120px 0 100px;
  overflow: hidden;
}
.hero__fundo { position: absolute; inset: 0; z-index: 0; overflow: hidden; background: var(--verde); }
.hero__fundo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.hero__overlay {
  position: absolute; inset: 0;
  background:
    linear-gradient(155deg, rgba(18,39,32,0.94) 10%, rgba(30,59,46,0.86) 55%, rgba(30,59,46,0.72) 100%),
    repeating-linear-gradient(100deg, rgba(139,90,43,0.16) 0 2px, transparent 2px 46px);
}
.hero__conteudo { position: relative; z-index: 1; max-width: 700px; }
.hero h1 { color: var(--branco); font-size: clamp(2.1rem, 1.6rem + 2.2vw, 3.4rem); margin-bottom: 0.35em; }
.hero__sub { font-size: 1.2rem; color: var(--creme); margin-bottom: 0.4em; max-width: 560px; }
.hero__complemento { font-size: 1.02rem; color: rgba(242,237,226,0.85); margin-bottom: 2em; }
.hero__ctas { display: flex; flex-wrap: wrap; gap: 16px; margin-bottom: 48px; }
.hero__indicadores { display: flex; flex-wrap: wrap; gap: 12px; }

/* -------------------- Banner de página interna -------------------- */
.banner-pagina {
  background: var(--verde);
  color: var(--creme);
  padding: 64px 0 48px;
  position: relative;
  overflow: hidden;
}
.banner-pagina::after {
  content: '';
  position: absolute; inset: 0;
  background: repeating-linear-gradient(100deg, rgba(139,90,43,0.14) 0 2px, transparent 2px 46px);
  pointer-events: none;
}
.banner-pagina__conteudo { position: relative; max-width: 720px; }
.banner-pagina h1 { color: var(--branco); font-size: clamp(1.9rem, 1.5rem + 1.6vw, 2.7rem); margin-bottom: 0.3em; }
.banner-pagina p { color: rgba(242,237,226,0.9); font-size: 1.08rem; max-width: 620px; }
.trilha { font-size: 0.85rem; color: rgba(242,237,226,0.7); margin-bottom: 14px; }
.trilha a { color: var(--creme); border-bottom: 1px solid rgba(242,237,226,0.4); }

/* -------------------- Textura envelhecida (uso restrito à Nossa História) -------------------- */
.textura-envelhecida {
  position: relative;
  background-color: var(--creme-escuro);
  background-image:
    radial-gradient(circle at 12% 20%, rgba(139,90,43,0.10) 0, transparent 40%),
    radial-gradient(circle at 85% 15%, rgba(139,90,43,0.08) 0, transparent 35%),
    radial-gradient(circle at 30% 85%, rgba(18,39,32,0.06) 0, transparent 40%),
    radial-gradient(circle at 75% 70%, rgba(139,90,43,0.09) 0, transparent 38%),
    repeating-linear-gradient(0deg, rgba(34,34,34,0.025) 0 1px, transparent 1px 3px);
}

/* -------------------- Placeholder de imagem --------------------
   Sistema próprio de imagem provisória: sem dependência externa, sempre
   confiável, com gradiente na paleta da marca + ícone + selo "Imagem
   ilustrativa". Marcar sempre com comentário PLACEHOLDER_IMAGE no HTML. */
.ph-imagem {
  position: relative;
  display: flex; align-items: center; justify-content: center;
  background: linear-gradient(135deg, var(--verde) 0%, var(--verde-claro) 100%);
  color: rgba(242, 237, 226, 0.9);
  border-radius: var(--raio);
  overflow: hidden;
  min-height: 100px;
}
.ph-imagem svg { width: 25%; max-width: 84px; height: auto; opacity: 0.85; }
.ph-imagem__badge {
  position: absolute; top: 10px; right: 10px;
  background: rgba(18, 39, 32, 0.5);
  color: var(--creme);
  font-family: var(--fonte-utilitaria);
  font-size: 9.5px; letter-spacing: 0.04em; text-transform: uppercase;
  padding: 3px 8px; border-radius: var(--raio-peq);
  opacity: 0.85;
}
.ph-imagem__legenda {
  position: absolute; left: 0; right: 0; bottom: 0;
  background: linear-gradient(0deg, rgba(18,39,32,0.75), transparent);
  color: var(--creme); font-size: 0.82rem; padding: 26px 14px 10px;
  text-align: center;
}
.ph-imagem--madeira { background: linear-gradient(135deg, var(--madeira-escura) 0%, var(--madeira) 100%); }
.ph-imagem--creme { background: linear-gradient(135deg, #d8cdb3 0%, var(--creme-escuro) 100%); color: var(--verde-escuro); }
.ph-imagem--creme .ph-imagem__badge { background: rgba(34,34,34,0.6); }

/* wrapper para foto real com legenda sobreposta (mesmo padrão visual do ph-imagem) */
.foto-com-legenda { position: relative; border-radius: var(--raio); overflow: hidden; aspect-ratio: 4/3; }
.foto-com-legenda .ph-imagem__legenda { border-radius: 0; }
.foto-com-legenda .ph-imagem__badge { border-radius: var(--raio-peq); }

/* placeholder "aguardando conteúdo histórico" — nunca fingir ser foto real */
.ph-historico {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px;
  border: 2px dashed var(--madeira);
  border-radius: var(--raio);
  background: rgba(139, 90, 43, 0.05);
  color: var(--madeira-escura);
  min-height: 200px;
  padding: 20px;
  text-align: center;
}
.ph-historico svg { width: 34px; height: 34px; opacity: 0.8; }
.ph-historico span { font-family: var(--fonte-utilitaria); font-size: 11.5px; letter-spacing: 0.04em; text-transform: uppercase; }

/* -------------------- Cartões -------------------- */
.cartao {
  background: var(--branco);
  border-radius: var(--raio);
  overflow: hidden;
  box-shadow: var(--sombra);
  transition: transform var(--transicao), box-shadow var(--transicao);
  display: flex; flex-direction: column;
  height: 100%;
}
.cartao:hover { transform: translateY(-4px); box-shadow: var(--sombra-media); }
.cartao__imagem { aspect-ratio: 4 / 3; overflow: hidden; position: relative; }
.cartao__imagem .ph-imagem { border-radius: 0; min-height: 100%; height: 100%; }
.cartao__imagem img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 420ms ease; }
.cartao:hover .cartao__imagem img { transform: scale(1.04); }
.foto-cobrir { width: 100%; height: 100%; object-fit: cover; display: block; border-radius: var(--raio); }
.cartao__corpo { padding: 22px 22px 24px; display: flex; flex-direction: column; gap: 10px; flex: 1; }
.cartao__categoria { font-family: var(--fonte-utilitaria); font-size: 11px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--madeira-escura); }
.cartao__titulo { font-size: 1.18rem; margin: 0; }
.cartao__texto { color: var(--grafite-suave); font-size: 0.95rem; flex: 1; }
.cartao__cta { margin-top: 8px; font-weight: 700; color: var(--verde); display: inline-flex; align-items: center; gap: 6px; font-size: 0.94rem; }
.cartao__cta svg { width: 16px; height: 16px; transition: transform var(--transicao); }
.cartao:hover .cartao__cta svg { transform: translateX(3px); }

.cartao-produto__corpo { padding: 18px; }
.cartao-produto__titulo { font-size: 1.05rem; margin-bottom: 4px; }
.cartao-produto__texto { font-size: 0.9rem; color: var(--grafite-suave); margin-bottom: 14px; }

/* -------------------- B2B callout -------------------- */
.b2b-callout {
  background: var(--creme-escuro);
  border-left: 4px solid var(--madeira);
  border-radius: var(--raio);
  padding: 32px;
  display: flex; align-items: center; gap: 28px; flex-wrap: wrap;
  justify-content: space-between;
}
.b2b-callout__texto { max-width: 560px; }
.b2b-callout h3 { margin-bottom: 0.3em; font-size: 1.35rem; }
.b2b-callout p { margin: 0; color: var(--grafite-suave); }

/* -------------------- Bloco "não sabe qual madeira" -------------------- */
.duvida {
  background: var(--verde);
  color: var(--creme);
  border-radius: var(--raio);
  padding: 56px;
  text-align: center;
}
.duvida h2 { color: var(--branco); }
.duvida p { max-width: 600px; margin-left: auto; margin-right: auto; color: rgba(242,237,226,0.88); font-size: 1.08rem; }
@media (max-width: 620px) { .duvida { padding: 36px 24px; } }

/* -------------------- Timeline histórica -------------------- */
.timeline { position: relative; padding-left: 32px; }
.timeline::before { content: ''; position: absolute; left: 6px; top: 6px; bottom: 6px; width: 2px; background: var(--madeira); opacity: 0.4; }
.timeline__item { position: relative; padding-bottom: 40px; }
.timeline__item:last-child { padding-bottom: 0; }
.timeline__marcador {
  position: absolute; left: -32px; top: 2px;
  width: 14px; height: 14px; border-radius: 50%;
  background: var(--creme); border: 3px solid var(--madeira);
}
.timeline__ano { margin-bottom: 6px; }
.timeline__item h3 { font-size: 1.2rem; margin-bottom: 6px; }
.timeline__item p { color: var(--grafite-suave); max-width: 560px; }

/* -------------------- Retirada / Entrega -------------------- */
.re-cartao { background: var(--branco); border-radius: var(--raio); box-shadow: var(--sombra); padding: 32px; }
.re-cartao h3 { display: flex; align-items: center; gap: 12px; font-size: 1.25rem; }
.re-cartao h3 svg { width: 26px; height: 26px; color: var(--madeira); flex: none; }
.re-cartao ul { display: flex; flex-direction: column; gap: 10px; margin-top: 16px; }
.re-cartao li { display: flex; gap: 10px; align-items: flex-start; color: var(--grafite-suave); }
.re-cartao li svg { width: 18px; height: 18px; color: var(--madeira); flex: none; margin-top: 2px; }

/* -------------------- Avaliações (placeholder) -------------------- */
.avaliacoes {
  background: var(--branco);
  border: 1.5px solid var(--creme-escuro);
  border-radius: var(--raio);
  padding: 44px; text-align: center;
}
.avaliacoes svg.icone-google { width: 34px; height: 34px; color: var(--madeira); margin-bottom: 14px; }
.avaliacoes__estrelas { display: flex; gap: 4px; justify-content: center; margin: 14px 0; }
.avaliacoes__estrelas svg { width: 20px; height: 20px; color: var(--creme-escuro); }
.avaliacoes p { color: var(--grafite-suave); max-width: 480px; margin-left: auto; margin-right: auto; }

/* -------------------- Contato -------------------- */
.contato-grade { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: start; }
@media (max-width: 860px) { .contato-grade { grid-template-columns: 1fr; } }
.bloco-contato { display: flex; flex-direction: column; gap: 22px; }
.bloco-contato__item { display: flex; gap: 16px; align-items: flex-start; }
.bloco-contato__icone {
  width: 44px; height: 44px; border-radius: 50%; background: var(--verde); color: var(--creme);
  display: flex; align-items: center; justify-content: center; flex: none;
}
.bloco-contato__icone svg { width: 21px; height: 21px; }
.bloco-contato__item h3 { font-size: 1rem; margin-bottom: 4px; }
.bloco-contato__item p, .bloco-contato__item a { color: var(--grafite-suave); font-size: 0.97rem; }
.bloco-contato__item a:hover { color: var(--madeira-escura); }
.horarios-tabela { width: 100%; border-collapse: collapse; font-size: 0.95rem; }
.horarios-tabela td { padding: 6px 0; border-bottom: 1px solid var(--creme-escuro); color: var(--grafite-suave); }
.horarios-tabela td:first-child { padding-right: 24px; white-space: nowrap; }
.horarios-tabela td:last-child { text-align: right; font-weight: 600; color: var(--grafite); }
.mapa-embed { border-radius: var(--raio); overflow: hidden; box-shadow: var(--sombra); border: none; width: 100%; height: 100%; min-height: 360px; }
.contato-ctas { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 24px; }

/* -------------------- Rodapé -------------------- */
.rodape { background: var(--verde-escuro); color: rgba(242,237,226,0.82); padding: 64px 0 28px; }
.rodape__grade { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 40px; margin-bottom: 40px; }
@media (max-width: 860px) { .rodape__grade { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .rodape__grade { grid-template-columns: 1fr; } }
.rodape__marca .logo-chip,
.menu-mobile__topo .logo-chip {
  display: inline-flex; background: var(--branco); border-radius: var(--raio-peq);
  padding: 8px 14px; line-height: 0;
}
.rodape__marca img { height: 56px; display: block; }
.rodape__marca { margin-bottom: 14px; }
.rodape__marca p.tagline { font-family: var(--fonte-titulo); color: var(--branco); font-size: 1.05rem; margin-bottom: 2px; }
.rodape__marca p.desde { font-family: var(--fonte-utilitaria); font-size: 0.8rem; letter-spacing: 0.06em; text-transform: uppercase; color: var(--madeira-clara); }
.rodape h4 { color: var(--branco); font-family: var(--fonte-utilitaria); font-size: 0.82rem; letter-spacing: 0.07em; text-transform: uppercase; margin-bottom: 16px; }
.rodape ul li { margin-bottom: 10px; }
.rodape a:hover { color: var(--branco); }
.rodape address p, .rodape p { font-size: 0.92rem; margin-bottom: 8px; }
.rodape__base { border-top: 1px solid rgba(242,237,226,0.14); padding-top: 24px; display: flex; justify-content: space-between; flex-wrap: wrap; gap: 10px; font-size: 0.82rem; color: rgba(242,237,226,0.55); }

/* -------------------- WhatsApp flutuante -------------------- */
.whatsapp-flutuante {
  position: fixed; right: 22px; bottom: 22px; z-index: 250;
  width: 60px; height: 60px; border-radius: 50%;
  background: var(--whatsapp); color: var(--branco);
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 6px 20px rgba(18,39,32,0.3);
  transition: transform var(--transicao), background var(--transicao);
}
.whatsapp-flutuante:hover { transform: scale(1.06); background: var(--whatsapp-escuro); }
.whatsapp-flutuante svg { width: 30px; height: 30px; }
@media (max-width: 620px) { .whatsapp-flutuante { right: 16px; bottom: 16px; width: 54px; height: 54px; } .whatsapp-flutuante svg { width: 27px; height: 27px; } }

/* -------------------- Utilidades de texto -------------------- */
.texto-centro { text-align: center; }
.somente-leitor {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden;
  clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}
.skip-link {
  position: absolute; left: -999px; top: 0; background: var(--verde); color: var(--branco);
  padding: 12px 18px; z-index: 999; border-radius: 0 0 6px 0;
}
.skip-link:focus { left: 0; }