/* Bandeiras dos Estados — folha de estilo
   Paleta: o cerne do pau-brasil (a árvore que deu nome ao país), o fio de ouro
   das franjas de cetim e o algodão cru do tecido. As cores fortes ficam com as bandeiras. */
:root {
  --breu: #24090a;        /* cerne do pau-brasil */
  --breu-2: #34100e;
  --pau: #7a1d14;         /* pau-brasil vivo */
  --ouro: #dcb54e;        /* fio da franja */
  --ouro-claro: #f2d98a;
  --algodao: #f3f1ec;
  --linho: #e6e1d6;
  --tinta: #22140f;
  --tinta-suave: #5e4f48;
  --mata: #17663a;        /* verde da marca Bandeira1 */
  --mata-escura: #0e4a29;
  --linha-clara: rgba(34, 20, 15, .14);
  --linha-escura: rgba(242, 217, 138, .2);

  --f-display: "Gloock", "Didot", Georgia, serif;
  --f-texto: "Schibsted Grotesk", system-ui, sans-serif;
  --f-dado: "Spline Sans Mono", ui-monospace, monospace;

  --u: 1px;
  --gutter: clamp(calc(16 * var(--u)), 4vw, calc(64 * var(--u)));
  --largura: calc(1320 * var(--u));
  --ease: cubic-bezier(.2, .7, .1, 1);
  --ease-mola: cubic-bezier(.34, 1.4, .5, 1);
}
/* Telas 2K/4K: tudo cresce na mesma proporção a partir de 1720px */
@media (min-width: 1720px) { :root { --u: calc(100vw / 1720); } }

*, *::before, *::after { box-sizing: border-box; }
html { font-size: calc(16 * var(--u)); overflow-x: clip; scroll-behavior: smooth; -webkit-text-size-adjust: 100%; scroll-padding-top: calc(96 * var(--u)); }
body {
  margin: 0; background: var(--algodao); color: var(--tinta);
  font-family: var(--f-texto); font-size: clamp(calc(16 * var(--u)), 1.05vw, calc(18 * var(--u)));
  line-height: 1.6; overflow-x: hidden; -webkit-font-smoothing: antialiased;
}
img { max-width: 100%; display: block; height: auto; }
a { color: inherit; }
h1, h2, h3 { margin: 0; font-weight: 400; }
p { margin: 0 0 1em; }
ul, ol { margin: 0; padding: 0; list-style: none; }
figure { margin: 0; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.pular { position: absolute; left: 12px; top: -200px; z-index: 100; background: var(--ouro); color: var(--breu); padding: 10px 14px; font-weight: 700; }
.pular:focus { top: 12px; }
:focus-visible { outline: 2px solid var(--ouro); outline-offset: 3px; }
::selection { background: var(--ouro); color: var(--breu); }

/* ---------- Tipografia ---------- */
.sobrelinha {
  font-family: var(--f-dado); font-size: .76rem; font-weight: 500; letter-spacing: .16em; text-transform: uppercase;
  color: var(--ouro); display: flex; align-items: center; gap: .8em; margin-bottom: 1.3rem;
}
.sobrelinha::before { content: ""; width: calc(30 * var(--u)); height: 0; border-top: 2px dashed currentColor; }
.sobrelinha--pau { color: var(--pau); }
.titulo {
  font-family: var(--f-display); font-size: clamp(2.3rem, 5vw, 4.5rem); line-height: 1.02; letter-spacing: -.012em;
  margin-bottom: 1.5rem; text-wrap: balance;
}
.titulo em, .hero__titulo em, .estado-hero__titulo em { font-style: normal; color: var(--ouro); }
.secao--clara .titulo em { color: var(--pau); }

/* Letreiro: palavras sobem de dentro de uma máscara, uma de cada vez */
[data-letreiro] .pal { display: inline-block; overflow: hidden; vertical-align: bottom; padding-bottom: .08em; margin-bottom: -.08em; }
[data-letreiro] .pal > span { display: inline-block; transform: translateY(105%); transition: transform 1s var(--ease); transition-delay: calc(var(--i) * 70ms); }
[data-letreiro].is-visivel .pal > span { transform: none; }

/* Revelar ao rolar */
[data-revela] { opacity: 0; transform: translateY(calc(26 * var(--u))); transition: opacity .9s var(--ease), transform .9s var(--ease); transition-delay: var(--atraso, 0ms); }
[data-revela].is-visivel { opacity: 1; transform: none; }

/* ---------- Botões ---------- */
.btn {
  --fundo: transparent; --cor: currentColor; --enche: var(--ouro); --enche-cor: var(--breu);
  position: relative; isolation: isolate; overflow: hidden;
  display: inline-flex; align-items: center; justify-content: center; gap: .7em;
  padding: 1.05em 1.6em; border-radius: 999px; border: 1.5px solid transparent;
  background: var(--fundo); color: var(--cor); text-decoration: none; cursor: pointer;
  font: 700 .95rem/1 var(--f-texto); letter-spacing: .01em;
  transition: color .45s var(--ease), border-color .45s var(--ease), transform .45s var(--ease-mola), box-shadow .45s var(--ease);
}
.btn::before {
  content: ""; position: absolute; inset: -2px; z-index: -1; border-radius: inherit; background: var(--enche);
  transform: translateY(102%); transition: transform .55s var(--ease);
}
.btn:hover::before, .btn:focus-visible::before { transform: none; }
.btn:hover, .btn:focus-visible { color: var(--enche-cor); transform: translateY(-2px); }
.btn:active { transform: translateY(0) scale(.98); }
.btn span { position: relative; }
.btn .seta, .btn svg { width: 1.15em; height: 1.15em; flex: none; }
.seta { fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.btn .seta { transition: transform .45s var(--ease-mola); }
.btn:hover .seta { transform: translateX(5px); }
.btn--ouro { --fundo: var(--ouro); --cor: var(--breu); --enche: var(--algodao); border-color: var(--ouro); box-shadow: 0 10px 30px -14px rgba(220, 181, 78, .8); }
.btn--ouro:hover { box-shadow: 0 16px 34px -12px rgba(220, 181, 78, .9); }
.btn--linha { --cor: var(--algodao); border-color: rgba(243, 241, 236, .45); --enche: var(--algodao); }
.btn--mata { --fundo: var(--mata); --cor: #fff; --enche: var(--mata-escura); --enche-cor: #fff; border-color: var(--mata); }
.btn--mata svg { fill: currentColor; }
.btn--pequeno { padding: .8em 1.2em; font-size: .85rem; }
.btn--grande { padding: 1.2em 2em; font-size: 1.02rem; width: 100%; }

/* ---------- Topo ---------- */
.topo { position: fixed; inset: 0 0 auto; z-index: 50; padding: calc(12 * var(--u)) var(--gutter) 0; pointer-events: none; }
.topo__barra {
  pointer-events: auto; max-width: calc(var(--largura) + 64 * var(--u)); margin: 0 auto;
  display: flex; align-items: center; gap: calc(24 * var(--u));
  padding: calc(10 * var(--u)) calc(12 * var(--u)) calc(10 * var(--u)) calc(22 * var(--u));
  background: rgba(243, 241, 236, .94); backdrop-filter: blur(14px) saturate(1.3); -webkit-backdrop-filter: blur(14px) saturate(1.3);
  border-radius: 999px; box-shadow: 0 10px 40px -18px rgba(36, 9, 10, .6);
  transition: transform .5s var(--ease), box-shadow .5s var(--ease);
}
.topo.is-escondido .topo__barra { transform: translateY(calc(-130% - 12px)); }
.marca { display: flex; align-items: center; gap: calc(12 * var(--u)); text-decoration: none; margin-right: auto; }
.marca img { height: calc(38 * var(--u)); width: auto; transition: transform .5s var(--ease-mola); }
.marca:hover img { transform: rotate(-3deg) scale(1.04); }
.marca__nome { font: 700 .66rem/1.15 var(--f-dado); letter-spacing: .12em; text-transform: uppercase; color: var(--pau); padding-left: calc(12 * var(--u)); border-left: 2px dashed var(--linha-clara); }
.menu { display: flex; gap: calc(4 * var(--u)); }
.menu a {
  position: relative; text-decoration: none; font-weight: 600; font-size: .9rem; padding: .5em .8em; border-radius: 999px;
  transition: background .3s, color .3s;
}
.menu a::after { content: ""; position: absolute; left: .8em; right: .8em; bottom: .3em; height: 2px; background: var(--pau); transform: scaleX(0); transform-origin: right; transition: transform .45s var(--ease); }
.menu a:hover::after { transform: scaleX(1); transform-origin: left; }
.menu a:hover { color: var(--pau); }
.menu-botao { display: none; width: 44px; height: 44px; border: 0; border-radius: 50%; background: var(--breu); cursor: pointer; position: relative; }
.menu-botao i { position: absolute; left: 13px; right: 13px; height: 2px; background: var(--algodao); transition: transform .4s var(--ease); }
.menu-botao i:first-of-type { top: 18px; } .menu-botao i:last-of-type { top: 25px; }
.menu-botao[aria-expanded="true"] i:first-of-type { transform: translateY(3.5px) rotate(45deg); }
.menu-botao[aria-expanded="true"] i:last-of-type { transform: translateY(-3.5px) rotate(-45deg); }
.menu-movel { pointer-events: auto; margin: 8px auto 0; max-width: 520px; background: var(--algodao); border-radius: 24px; padding: 12px; box-shadow: 0 20px 50px -20px rgba(36, 9, 10, .6); display: grid; }
.menu-movel[hidden] { display: none; }
.menu-movel a { padding: 14px 16px; text-decoration: none; font-weight: 600; border-radius: 14px; }
.menu-movel a:hover { background: var(--linho); }
@media (max-width: 1180px) { .menu { display: none; } .menu-botao { display: block; } }
@media (max-width: 560px) { .topo__cta { display: none; } .marca__nome { display: none; } }

/* ---------- Seções ---------- */
.secao { padding: clamp(calc(80 * var(--u)), 10vw, calc(150 * var(--u))) var(--gutter); }
.secao > * { max-width: var(--largura); margin-left: auto; margin-right: auto; }
.secao__cabeca { margin-bottom: clamp(calc(36 * var(--u)), 5vw, calc(64 * var(--u))); max-width: var(--largura); }
.secao__cabeca .titulo { max-width: 16ch; }
.secao__intro { max-width: 56ch; color: var(--tinta-suave); font-size: 1.08em; }

/* ---------- Hero (início) ---------- */
.hero {
  position: relative; min-height: max(100svh, calc(760 * var(--u))); background: var(--breu); color: var(--algodao);
  display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); align-items: center; gap: calc(24 * var(--u));
  padding: calc(120 * var(--u)) var(--gutter) calc(60 * var(--u)); overflow: hidden; isolation: isolate;
}
.hero::before { /* fibra do cerne: anéis suaves de madeira */
  content: ""; position: absolute; inset: -20%; z-index: -1; opacity: .5;
  background:
    radial-gradient(ellipse 60% 50% at 70% 50%, rgba(122, 29, 20, .55), transparent 70%),
    repeating-radial-gradient(ellipse 140% 90% at 85% 55%, transparent 0 calc(22 * var(--u)), rgba(242, 217, 138, .035) calc(22 * var(--u)) calc(23 * var(--u)));
}
.hero__texto { max-width: calc(600 * var(--u)); justify-self: end; width: 100%; position: relative; z-index: 2; }
.hero__titulo { font-family: var(--f-display); font-size: clamp(3rem, 6.2vw, 6.6rem); line-height: .95; letter-spacing: -.02em; margin-bottom: 1.6rem; }
.hero__titulo em { display: inline-block; }
.hero__lead { font-size: 1.12em; color: rgba(243, 241, 236, .82); max-width: 40ch; }
.hero__acoes { display: flex; flex-wrap: wrap; gap: calc(12 * var(--u)); margin: 2rem 0 2.6rem; }
.hero__legenda {
  display: grid; gap: .1rem; text-decoration: none; padding: 1rem 0 0; border-top: 2px dashed var(--linha-escura); max-width: 26rem;
}
.hero__legenda-rot { font: 500 .7rem/1 var(--f-dado); letter-spacing: .16em; text-transform: uppercase; color: var(--ouro); }
.hero__legenda-nome { font: 2.2rem/1.1 var(--f-display); transition: opacity .3s, transform .4s var(--ease); }
.hero__legenda-dado { font-size: .9rem; color: rgba(243, 241, 236, .65); }
.hero__legenda.is-trocando .hero__legenda-nome { opacity: 0; transform: translateY(8px); }
.hero__mapa { position: relative; width: 100%; max-width: calc(860 * var(--u)); justify-self: start; }
.hero__mapa .mapa { max-height: calc(100svh - 150 * var(--u)); min-height: 300px; }

/* Mapa-mosaico: cada estado vestido com a sua bandeira, costurado com fio de ouro */
.mapa { width: 100%; height: auto; overflow: visible; }
.mapa .uf path {
  stroke: var(--ouro); stroke-width: .9; stroke-dasharray: 2.4 1.6; stroke-linejoin: round; paint-order: stroke;
  transform-box: fill-box; transform-origin: center;
  transition: transform .5s var(--ease-mola), filter .5s var(--ease), opacity .6s var(--ease);
}
.mapa .uf { outline: none; cursor: pointer; }
.hero .mapa .mapa__estados { filter: url(#ondula-br); }
.hero .mapa .uf path { opacity: 0; transform: translateY(-14px) scale(.9); }
.hero .mapa.is-montado .uf path { opacity: 1; transform: none; transition-delay: calc(var(--ordem, 0) * 45ms); }
.hero .mapa.is-montado.is-pronto .uf path { transition-delay: 0ms; }
.mapa .uf.is-destaque path, .mapa .uf:hover path, .mapa .uf:focus-visible path {
  transform: translateY(-6px) scale(1.07); filter: drop-shadow(0 10px 14px rgba(0, 0, 0, .55)); stroke-dasharray: none; stroke-width: 1.4;
}
.hero .mapa.is-montado .uf.is-destaque path, .hero .mapa.is-montado .uf:hover path { transform: translateY(-6px) scale(1.07); }
.mapa__brilho { pointer-events: none; }
.mapa__brilho rect { mix-blend-mode: soft-light; animation: brilho 8s var(--ease) infinite; }
@keyframes brilho { 0% { transform: translateX(0); } 65%, 100% { transform: translateX(1500px); } }

/* ---------- Faixa de nomes ---------- */
.faixa { background: var(--ouro); color: var(--breu); overflow: hidden; padding: calc(14 * var(--u)) 0; border-block: 2px dashed rgba(36, 9, 10, .35); }
.faixa__trilho { display: flex; width: max-content; animation: faixa 80s linear infinite; }
.faixa:hover .faixa__trilho { animation-play-state: paused; }
.faixa span { display: inline-flex; align-items: center; gap: .7em; padding: 0 1.6em; font: 500 .82rem/1 var(--f-dado); letter-spacing: .14em; text-transform: uppercase; white-space: nowrap; }
.faixa img { width: calc(36 * var(--u)); height: calc(25 * var(--u)); object-fit: cover; border-radius: 2px; box-shadow: 0 1px 3px rgba(0, 0, 0, .3); }
@keyframes faixa { to { transform: translateX(-50%); } }

/* ---------- Galeria ---------- */
.filtros { display: flex; flex-wrap: wrap; gap: calc(8 * var(--u)); margin-bottom: calc(40 * var(--u)); }
.filtro {
  font: 600 .92rem/1 var(--f-texto); color: var(--tinta); background: transparent; border: 1.5px solid var(--linha-clara);
  padding: .8em 1.15em; border-radius: 999px; cursor: pointer; transition: background .35s, color .35s, border-color .35s, transform .35s var(--ease-mola);
}
.filtro sup { font: 500 .66rem var(--f-dado); color: var(--pau); margin-left: .2em; transition: color .35s; }
.filtro:hover { border-color: var(--pau); transform: translateY(-2px); }
.filtro.is-ativo { background: var(--breu); color: var(--algodao); border-color: var(--breu); }
.filtro.is-ativo sup { color: var(--ouro); }
.grade { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(calc(14 * var(--u)), 2vw, calc(28 * var(--u))); }
.cartao { transition: opacity .5s var(--ease), transform .5s var(--ease); }
.cartao.is-oculto { display: none; }
.cartao a { display: grid; text-decoration: none; padding: calc(10 * var(--u)) calc(10 * var(--u)) calc(18 * var(--u)); border-radius: calc(18 * var(--u)); background: #fff; position: relative; height: 100%; transition: transform .55s var(--ease-mola), box-shadow .55s var(--ease); }
.cartao a::after { content: ""; position: absolute; inset: calc(5 * var(--u)); border: 1.5px dashed var(--ouro); border-radius: calc(14 * var(--u)); opacity: 0; transform: scale(.97); transition: opacity .4s, transform .5s var(--ease); pointer-events: none; }
.cartao a:hover, .cartao a:focus-visible { transform: translateY(-8px) rotate(-.6deg); box-shadow: 0 30px 50px -28px rgba(36, 9, 10, .55); }
.cartao a:hover::after, .cartao a:focus-visible::after { opacity: 1; transform: none; }
.cartao__foto { position: relative; aspect-ratio: 1; overflow: hidden; border-radius: calc(12 * var(--u)); margin-bottom: calc(10 * var(--u)); }
.cartao__foto img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; transition: opacity .6s var(--ease), transform 1s var(--ease); }
.cartao__reta { opacity: 0; object-fit: cover !important; transform: scale(1.15); }
.cartao a:hover .cartao__vento { opacity: 0; transform: scale(.92) rotate(2deg); }
.cartao a:hover .cartao__reta { opacity: 1; transform: none; }
.cartao__uf { font: 500 .7rem/1 var(--f-dado); letter-spacing: .14em; text-transform: uppercase; color: var(--pau); padding: 0 calc(8 * var(--u)); }
.cartao__nome { font: clamp(1.35rem, 1.9vw, 1.8rem)/1.08 var(--f-display); padding: .35rem calc(8 * var(--u)) .3rem; }
.cartao__dado { font-size: .85rem; color: var(--tinta-suave); padding: 0 calc(8 * var(--u)); }
.cartao__ver { display: inline-flex; align-items: center; gap: .4em; margin-top: .7rem; padding: 0 calc(8 * var(--u)); font-weight: 700; font-size: .85rem; color: var(--mata); }
.cartao__ver .seta { width: 1.1em; height: 1.1em; transition: transform .45s var(--ease-mola); }
.cartao a:hover .cartao__ver .seta { transform: translateX(6px); }
@media (max-width: 1100px) { .grade { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 700px) { .grade { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* ---------- História (linha do tempo) ---------- */
.historia { background: var(--breu); color: var(--algodao); position: relative; overflow: hidden; }
.historia .secao__intro { color: rgba(243, 241, 236, .72); }
.tempo { position: relative; display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: calc(20 * var(--u)); padding-top: calc(40 * var(--u)); }
.tempo::before { content: ""; position: absolute; top: calc(9 * var(--u)); left: 0; right: 0; border-top: 2px dashed var(--ouro); transform: scaleX(var(--progresso, 0)); transform-origin: left; transition: transform 2.4s var(--ease); }
.tempo.is-visivel::before { --progresso: 1; }
.marco { position: relative; }
.marco::before { content: ""; position: absolute; top: calc(-38 * var(--u)); left: 0; width: calc(16 * var(--u)); height: calc(16 * var(--u)); border-radius: 50%; background: var(--breu); border: 2px solid var(--ouro); transition: background .4s; }
.marco:hover::before { background: var(--ouro); }
.marco__ano { display: block; font: clamp(2rem, 3vw, 3rem)/1 var(--f-display); color: var(--ouro); margin-bottom: .5rem; }
.marco h3 { font-weight: 700; font-size: 1rem; margin-bottom: .4rem; }
.marco p { font-size: .9rem; color: rgba(243, 241, 236, .7); }
.tempo .marco:nth-child(2) .marco__ano { color: #ff8a6a; }
@media (max-width: 1100px) {
  .tempo { grid-template-columns: 1fr; gap: calc(30 * var(--u)); padding: 0 0 0 calc(36 * var(--u)); }
  .tempo::before { top: 0; bottom: 0; left: calc(7 * var(--u)); right: auto; border-top: 0; border-left: 2px dashed var(--ouro); transform: scaleY(var(--progresso, 0)); transform-origin: top; }
  .marco::before { top: calc(6 * var(--u)); left: calc(-36 * var(--u)); }
}

/* ---------- Lemas ---------- */
.lemas { background: var(--algodao); }
.lemas__lista { border-top: 2px dashed var(--linha-clara); }
.lema a { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 22rem); gap: calc(30 * var(--u)); align-items: center; padding: clamp(calc(18 * var(--u)), 2.4vw, calc(30 * var(--u))) 0; border-bottom: 2px dashed var(--linha-clara); text-decoration: none; position: relative; }
.lema__frase { font: clamp(1.9rem, 5.6vw, 5.4rem)/1 var(--f-display); letter-spacing: -.01em; color: var(--breu); transition: color .4s, transform .6s var(--ease); transform-origin: left; }
.lema a:hover .lema__frase { color: var(--pau); transform: translateX(calc(14 * var(--u))); }
.lema__info { display: flex; gap: calc(14 * var(--u)); align-items: center; font-size: .9rem; color: var(--tinta-suave); }
.lema__info img { width: calc(72 * var(--u)); height: auto; border-radius: 3px; box-shadow: 0 6px 14px -6px rgba(0, 0, 0, .4); transition: transform .6s var(--ease-mola); flex: none; }
.lema a:hover .lema__info img { transform: rotate(-6deg) scale(1.15); }
.lema__info b { display: block; color: var(--tinta); font-weight: 700; }
.lema__frase .pal > span { transition-duration: .8s; }
@media (max-width: 800px) { .lema a { grid-template-columns: 1fr; gap: calc(12 * var(--u)); } }

/* ---------- Comprar ---------- */
.comprar { background: var(--breu); color: var(--algodao); }
.comprar .secao__intro { color: rgba(243, 241, 236, .72); }
.linhas { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(calc(18 * var(--u)), 3vw, calc(40 * var(--u))); }
.linha { background: var(--breu-2); border-radius: calc(26 * var(--u)); overflow: hidden; display: grid; grid-template-rows: auto 1fr; border: 1px solid var(--linha-escura); transition: transform .6s var(--ease), border-color .5s; }
.linha:hover { transform: translateY(-6px); border-color: var(--ouro); }
.linha__fotos { display: grid; grid-template-columns: 2fr 1fr; grid-template-rows: 1fr 1fr; gap: 4px; aspect-ratio: 3 / 2; background: #fff; }
.linha__fotos img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--ease); }
.linha__fotos img:first-child { grid-row: span 2; }
.linha__fotos--estampada img { object-fit: contain; background: #fff; }
.linha:hover .linha__fotos img { transform: scale(1.05); }
.linha__texto { padding: clamp(calc(22 * var(--u)), 3vw, calc(40 * var(--u))); }
.linha__texto h3 { font: clamp(1.8rem, 2.6vw, 2.6rem)/1.05 var(--f-display); color: var(--ouro-claro); margin-bottom: .8rem; }
.linha__texto p { color: rgba(243, 241, 236, .78); max-width: 44ch; }
.linha__acoes { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 1.4rem; }
@media (max-width: 900px) { .linhas { grid-template-columns: 1fr; } }

/* ---------- Protocolo ---------- */
.protocolo__grade { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(calc(30 * var(--u)), 6vw, calc(90 * var(--u))); align-items: center; }
.regras { display: grid; gap: calc(14 * var(--u)); counter-reset: r; }
.regras li { padding: calc(16 * var(--u)) 0 calc(16 * var(--u)) calc(28 * var(--u)); border-top: 2px dashed var(--linha-clara); position: relative; color: var(--tinta-suave); }
.regras li::before { content: ""; position: absolute; left: 0; top: calc(26 * var(--u)); width: calc(10 * var(--u)); height: calc(10 * var(--u)); background: var(--pau); transform: rotate(45deg); }
.regras b { color: var(--tinta); }
.mastros { color: var(--tinta); }
.mastros svg { width: 100%; height: auto; overflow: visible; }
.mastros { padding-right: calc(30 * var(--u)); }
.mastros rect[width="5"] { fill: var(--tinta); }
.mastros__chao { stroke: var(--tinta); stroke-width: 2; stroke-dasharray: 5 4; }
.mastros text { font: 28px var(--f-display); fill: var(--tinta-suave); }
.mastro__pano { transform: translateY(220px); transition: transform 1.6s var(--ease); }
.mastros.is-visivel .mastro--brasil .mastro__pano { transform: none; transition-delay: .2s; }
.mastros.is-visivel .mastro--estado .mastro__pano { transform: none; transition-delay: 1s; }
.mastros.is-visivel .mastro--municipio .mastro__pano { transform: none; transition-delay: 1.5s; }
.mastros.is-visivel .mastro__pano > * { animation: tremula 3.2s ease-in-out 3s infinite; transform-box: fill-box; transform-origin: left center; }
@keyframes tremula { 50% { transform: skewY(2deg) scaleX(.97); } }
.mastros figcaption { display: grid; grid-template-columns: repeat(3, 1fr); text-align: center; font: 500 .74rem/1 var(--f-dado); letter-spacing: .14em; text-transform: uppercase; margin-top: 1rem; color: var(--pau); }
@media (max-width: 900px) { .protocolo__grade { grid-template-columns: 1fr; } }

/* ---------- Dúvidas ---------- */
.duvidas { background: var(--linho); }
.duvidas__lista { max-width: calc(940 * var(--u)); margin-left: 0; }
.duvida { border-top: 2px dashed var(--linha-clara); }
.duvida:last-child { border-bottom: 2px dashed var(--linha-clara); }
.duvida summary { list-style: none; display: flex; justify-content: space-between; gap: 1rem; align-items: center; cursor: pointer; padding: 1.3rem 0; font: clamp(1.15rem, 1.6vw, 1.5rem)/1.25 var(--f-display); transition: color .3s; }
.duvida summary::-webkit-details-marker { display: none; }
.duvida summary:hover { color: var(--pau); }
.duvida summary i { flex: none; width: calc(30 * var(--u)); height: calc(30 * var(--u)); border-radius: 50%; border: 1.5px solid currentColor; position: relative; transition: transform .5s var(--ease-mola), background .3s; }
.duvida summary i::before, .duvida summary i::after { content: ""; position: absolute; left: 50%; top: 50%; width: 40%; height: 1.5px; background: currentColor; transform: translate(-50%, -50%); }
.duvida summary i::after { transform: translate(-50%, -50%) rotate(90deg); }
.duvida[open] summary i { transform: rotate(135deg); background: var(--ouro); }
.duvida div { overflow: hidden; }
.duvida p { color: var(--tinta-suave); max-width: 70ch; padding-bottom: 1.3rem; animation: abre .5s var(--ease); }
@keyframes abre { from { opacity: 0; transform: translateY(-8px); } }

/* ---------- Orçamento ---------- */
.orcamento { background: var(--breu); color: var(--algodao); display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(calc(30 * var(--u)), 6vw, calc(90 * var(--u))); align-items: start; }
.orcamento > * { margin: 0; max-width: none; }
.orcamento { padding-left: max(var(--gutter), calc((100vw - var(--largura)) / 2)); padding-right: max(var(--gutter), calc((100vw - var(--largura)) / 2)); }
.orcamento__texto p { color: rgba(243, 241, 236, .75); }
.orcamento__contato { display: grid; gap: .3rem; margin-top: 2rem; }
.orcamento__contato span { font: 500 .72rem/1 var(--f-dado); letter-spacing: .16em; text-transform: uppercase; color: var(--ouro); }
.orcamento__contato a { font: clamp(1.8rem, 3vw, 2.6rem)/1 var(--f-display); text-decoration: none; color: var(--algodao); background: linear-gradient(var(--ouro), var(--ouro)) 0 100% / 0 2px no-repeat; transition: background-size .6s var(--ease); justify-self: start; }
.orcamento__contato a:hover { background-size: 100% 2px; }
.form { display: grid; gap: calc(22 * var(--u)); background: var(--breu-2); border: 1px solid var(--linha-escura); border-radius: calc(26 * var(--u)); padding: clamp(calc(20 * var(--u)), 3vw, calc(40 * var(--u))); }
.form fieldset { border: 0; padding: 0; margin: 0; }
.form legend, .campo > span { font: 500 .72rem/1 var(--f-dado); letter-spacing: .16em; text-transform: uppercase; color: var(--ouro); margin-bottom: .8rem; display: block; }
.uf-grade { display: grid; grid-template-columns: repeat(9, minmax(0, 1fr)); gap: 6px; }
.uf-chip input, .opcao input { position: absolute; opacity: 0; pointer-events: none; }
.uf-chip span { display: grid; place-items: center; height: calc(42 * var(--u)); min-height: 38px; border-radius: 10px; border: 1.5px solid var(--linha-escura); font: 500 .82rem var(--f-dado); cursor: pointer; transition: background .3s, color .3s, transform .35s var(--ease-mola), border-color .3s; }
.uf-chip span:hover { border-color: var(--ouro); transform: translateY(-2px); }
.uf-chip input:checked + span { background: var(--ouro); color: var(--breu); border-color: var(--ouro); transform: scale(1.06); }
.uf-chip input:focus-visible + span, .opcao input:focus-visible + span { outline: 2px solid var(--ouro); outline-offset: 2px; }
.form__linha { display: flex; flex-wrap: wrap; gap: 8px; }
.form__linha legend { width: 100%; }
.opcao span { display: inline-block; padding: .75em 1.1em; border-radius: 999px; border: 1.5px solid var(--linha-escura); cursor: pointer; font-weight: 600; font-size: .92rem; transition: background .3s, color .3s, border-color .3s; }
.opcao input:checked + span { background: var(--algodao); color: var(--breu); border-color: var(--algodao); }
.form__duo { display: grid; grid-template-columns: 2fr 1fr; gap: calc(16 * var(--u)); }
.campo input { width: 100%; font: inherit; color: var(--algodao); background: transparent; border: 0; border-bottom: 2px dashed var(--linha-escura); padding: .6em 0; transition: border-color .3s; }
.campo input::placeholder { color: rgba(243, 241, 236, .35); }
.campo input:focus { outline: none; border-bottom: 2px solid var(--ouro); }
.form__aviso { min-height: 1.4em; margin: 0; font-size: .9rem; color: var(--ouro-claro); }
@media (max-width: 1000px) { .orcamento { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .uf-grade { grid-template-columns: repeat(5, minmax(0, 1fr)); } .form__duo { grid-template-columns: 1fr; } }

/* ---------- Rodapé ---------- */
.rodape { background: #170605; color: rgba(243, 241, 236, .75); padding: calc(70 * var(--u)) var(--gutter) calc(40 * var(--u)); font-size: .92rem; }
.rodape > * { max-width: var(--largura); margin-left: auto; margin-right: auto; }
.rodape__topo { display: flex; flex-wrap: wrap; align-items: center; gap: calc(24 * var(--u)) calc(40 * var(--u)); padding-bottom: calc(40 * var(--u)); border-bottom: 2px dashed var(--linha-escura); }
.rodape__marca { background: var(--algodao); border-radius: 999px; padding: calc(10 * var(--u)) calc(22 * var(--u)); }
.rodape__marca img { height: calc(40 * var(--u)); width: auto; }
.rodape__topo p { margin: 0; max-width: 46ch; flex: 1; }
.rodape__whats { display: inline-flex; align-items: center; gap: .6em; color: var(--ouro-claro); text-decoration: none; font-weight: 700; }
.rodape__whats svg { width: 1.6em; height: 1.6em; fill: currentColor; }
.rodape__estados { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: calc(24 * var(--u)); padding: calc(40 * var(--u)) 0; }
.rodape__estados h3 { font: 500 .72rem/1 var(--f-dado); letter-spacing: .16em; text-transform: uppercase; color: var(--ouro); margin-bottom: 1rem; }
.rodape__estados li { margin-bottom: .35rem; }
.rodape a { transition: color .3s; }
.rodape__estados a { text-decoration: none; }
.rodape a:hover { color: var(--ouro-claro); }
.rodape__base { border-top: 2px dashed var(--linha-escura); padding-top: calc(24 * var(--u)); font-size: .82rem; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 1rem; }
.rodape__base p { margin: 0; }
@media (max-width: 900px) { .rodape__estados { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

.whats-flutuante {
  position: fixed; right: calc(20 * var(--u)); bottom: calc(20 * var(--u)); z-index: 40; width: calc(60 * var(--u)); height: calc(60 * var(--u)); min-width: 54px; min-height: 54px;
  border-radius: 50%; background: #25d366; display: grid; place-items: center; box-shadow: 0 12px 30px -10px rgba(0, 0, 0, .5);
  transition: transform .5s var(--ease-mola); animation: chama 6s ease-in-out 4s infinite;
}
.whats-flutuante svg { width: 56%; height: 56%; fill: #fff; }
.whats-flutuante:hover { transform: scale(1.1) rotate(-8deg); }
@keyframes chama { 0%, 90%, 100% { transform: none; } 93% { transform: scale(1.12) rotate(-8deg); } 96% { transform: scale(1.05) rotate(6deg); } }

/* ---------- Página do estado ---------- */
.estado-hero {
  background: var(--breu); color: var(--algodao); position: relative; overflow: hidden; isolation: isolate;
  display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); grid-template-areas: "texto palco" "ficha ficha"; gap: calc(30 * var(--u)) calc(50 * var(--u));
  padding: calc(130 * var(--u)) max(var(--gutter), calc((100vw - var(--largura)) / 2)) calc(50 * var(--u));
  min-height: max(92svh, calc(700 * var(--u)));
}
.estado-hero::before { content: ""; position: absolute; inset: -20%; z-index: -1; opacity: .5; background: radial-gradient(ellipse 50% 50% at 75% 45%, rgba(122, 29, 20, .6), transparent 70%), repeating-radial-gradient(ellipse 140% 90% at 85% 45%, transparent 0 calc(22 * var(--u)), rgba(242, 217, 138, .035) calc(22 * var(--u)) calc(23 * var(--u))); }
.estado-hero__texto { grid-area: texto; align-self: center; }
.trilha { display: flex; flex-wrap: wrap; gap: .5em; font: 500 .74rem/1.4 var(--f-dado); letter-spacing: .08em; color: rgba(243, 241, 236, .55); margin-bottom: 2rem; }
.trilha a { text-decoration: none; } .trilha a:hover { color: var(--ouro); }
.trilha [aria-current] { color: var(--algodao); }
.estado-hero__titulo { font-family: var(--f-display); font-size: clamp(2.8rem, 5.6vw, 5.8rem); line-height: .96; letter-spacing: -.02em; margin-bottom: 1.5rem; }
.estado-hero__lead { color: rgba(243, 241, 236, .82); font-size: 1.1em; max-width: 46ch; }
.estado-hero__palco { grid-area: palco; position: relative; align-self: center; aspect-ratio: 1.55; width: 100%; margin-bottom: calc(40 * var(--u)); }
.estado-hero__mastro { position: absolute; left: 0; top: -6%; bottom: -14%; width: calc(9 * var(--u)); min-width: 6px; border-radius: 6px; background: linear-gradient(90deg, #6d6a64, #e9e6df 40%, #8b8780); box-shadow: 4px 0 12px rgba(0, 0, 0, .4); }
.estado-hero__mastro::before { content: ""; position: absolute; left: 50%; top: calc(-14 * var(--u)); width: calc(20 * var(--u)); height: calc(20 * var(--u)); border-radius: 50%; transform: translateX(-50%); background: radial-gradient(circle at 35% 35%, #fff3c4, var(--ouro) 50%, #8a6a1c); }
.estado-hero__foto { position: absolute; left: 1.4%; top: 2%; width: 86%; height: auto; border-radius: 2px; box-shadow: 0 30px 60px -30px rgba(0, 0, 0, .8); transition: opacity .8s; }
.estado-hero__tecido { position: absolute; left: 0; top: -8%; width: 112%; height: 145%; opacity: 0; transition: opacity 1s; pointer-events: none; }
.estado-hero__palco.is-vivo .estado-hero__tecido { opacity: 1; }
.estado-hero__palco.is-vivo .estado-hero__foto { opacity: 0; }
.estado-hero__dica { position: absolute; left: calc(26 * var(--u)); bottom: -13%; margin: 0; font: 500 .7rem/1 var(--f-dado); letter-spacing: .14em; text-transform: uppercase; color: rgba(243, 241, 236, .45); opacity: 0; transition: opacity 1s 1.5s; }
.estado-hero__palco.is-vivo .estado-hero__dica { opacity: 1; }
.ficha { grid-area: ficha; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); margin: calc(30 * var(--u)) 0 0; border-top: 2px dashed var(--linha-escura); }
.ficha div { padding: calc(18 * var(--u)) calc(16 * var(--u)) 0 0; }
.ficha dt { font: 500 .68rem/1 var(--f-dado); letter-spacing: .16em; text-transform: uppercase; color: var(--ouro); margin-bottom: .5rem; }
.ficha dd { margin: 0; font-weight: 600; text-transform: none; }
.ficha div:nth-child(2) dd { text-transform: capitalize; }
@media (max-width: 900px) {
  .estado-hero { grid-template-columns: 1fr; grid-template-areas: "texto" "palco" "ficha"; min-height: 0; }
  .estado-hero__palco { margin: calc(20 * var(--u)) 0 calc(30 * var(--u)) calc(6 * var(--u)); }
  .ficha { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.significado__grade { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: clamp(calc(30 * var(--u)), 6vw, calc(90 * var(--u))); align-items: start; }
.significado__foto { position: sticky; top: calc(110 * var(--u)); background: #fff; border-radius: calc(26 * var(--u)); padding: calc(20 * var(--u)); box-shadow: 0 30px 60px -40px rgba(36, 9, 10, .5); }
.elementos { display: grid; }
.elementos li { padding: calc(20 * var(--u)) 0; border-top: 2px dashed var(--linha-clara); display: grid; grid-template-columns: minmax(0, 14rem) minmax(0, 1fr); gap: calc(24 * var(--u)); }
.elementos h3 { font: clamp(1.25rem, 1.7vw, 1.6rem)/1.15 var(--f-display); color: var(--pau); }
.elementos p { margin: 0; color: var(--tinta-suave); }
@media (max-width: 900px) { .significado__grade { grid-template-columns: 1fr; } .significado__foto { position: static; max-width: 480px; } .elementos li { grid-template-columns: 1fr; gap: .4rem; } }

.estado-historia { background: var(--breu); color: var(--algodao); }
.estado-historia__grade { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: clamp(calc(30 * var(--u)), 6vw, calc(90 * var(--u))); align-items: center; }
.estado-historia p { color: rgba(243, 241, 236, .8); font-size: 1.08em; max-width: 58ch; }
.estado-historia__mapa figcaption { font: 500 .72rem/1.4 var(--f-dado); letter-spacing: .12em; text-transform: uppercase; color: var(--ouro); margin-top: 1rem; text-align: center; }
.mapa--local .uf path { fill: rgba(243, 241, 236, .08); stroke: rgba(242, 217, 138, .35); stroke-width: .7; }
.mapa--local .uf:hover path { fill: rgba(243, 241, 236, .2); transform: none; filter: none; stroke-dasharray: 2.4 1.6; }
.mapa--local .uf--ativo path { stroke: var(--ouro); stroke-width: 1.4; stroke-dasharray: none; filter: drop-shadow(0 0 14px rgba(220, 181, 78, .55)); animation: pulsa 3s ease-in-out infinite; }
.mapa--local .uf--ativo:hover path { fill: revert-layer; }
@keyframes pulsa { 50% { filter: drop-shadow(0 0 4px rgba(220, 181, 78, .2)); } }
@media (max-width: 900px) { .estado-historia__grade { grid-template-columns: 1fr; } .estado-historia__mapa { max-width: 460px; } }

.detalhes__grade { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(calc(10 * var(--u)), 1.6vw, calc(22 * var(--u))); }
.detalhes figure { border-radius: calc(20 * var(--u)); overflow: hidden; background: #fff; position: relative; aspect-ratio: 1.45; }
.detalhes figure img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.4s var(--ease); }
.detalhes figure:nth-child(-n+2) img { object-fit: contain; padding: calc(18 * var(--u)); }
.detalhes figure:hover img { transform: scale(1.06); }
.detalhes figcaption { position: absolute; left: calc(14 * var(--u)); bottom: calc(14 * var(--u)); background: rgba(36, 9, 10, .82); color: var(--algodao); font: 500 .68rem/1 var(--f-dado); letter-spacing: .14em; text-transform: uppercase; padding: .7em 1em; border-radius: 999px; transform: translateY(8px); opacity: 0; transition: opacity .4s, transform .5s var(--ease); }
.detalhes figure:hover figcaption { opacity: 1; transform: none; }
@media (hover: none) { .detalhes figcaption { opacity: 1; transform: none; } }
@media (max-width: 640px) { .detalhes__grade { grid-template-columns: 1fr; } }

.ofertas { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(calc(16 * var(--u)), 3vw, calc(40 * var(--u))); }
.oferta { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); background: var(--breu-2); border: 1px solid var(--linha-escura); border-radius: calc(26 * var(--u)); overflow: hidden; transition: transform .6s var(--ease), border-color .5s; }
.oferta:hover { transform: translateY(-6px); border-color: var(--ouro); }
.oferta img { width: 100%; height: 100%; object-fit: cover; background: #fff; }
.oferta .oferta__cetim { object-fit: contain; padding: calc(10 * var(--u)); }
.oferta > div { padding: clamp(calc(20 * var(--u)), 2.6vw, calc(34 * var(--u))); display: grid; align-content: center; gap: .6rem; justify-items: start; }
.oferta h3 { font: clamp(1.6rem, 2.2vw, 2.2rem)/1.05 var(--f-display); color: var(--ouro-claro); }
.oferta p { color: rgba(243, 241, 236, .75); margin-bottom: .6rem; }
.comprar__whats { margin-top: calc(34 * var(--u)); color: rgba(243, 241, 236, .75); }
.comprar__whats a { color: var(--ouro-claro); font-weight: 700; }
@media (max-width: 1000px) { .ofertas { grid-template-columns: 1fr; } }
@media (max-width: 520px) { .oferta { grid-template-columns: 1fr; } .oferta img { aspect-ratio: 1.4; } }

.galeria--vizinhos .grade { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 1100px) { .galeria--vizinhos .grade { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 700px) { .galeria--vizinhos .grade { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.vizinhas { display: grid; grid-template-columns: 1fr auto 1fr; gap: 1rem; align-items: center; margin-top: calc(50 * var(--u)); padding-top: calc(26 * var(--u)); border-top: 2px dashed var(--linha-clara); }
.vizinhas a { text-decoration: none; font: clamp(1.1rem, 1.6vw, 1.5rem)/1.2 var(--f-display); transition: color .3s, transform .4s var(--ease); }
.vizinhas a small { display: block; font: 500 .68rem/1 var(--f-dado); letter-spacing: .16em; text-transform: uppercase; color: var(--pau); margin-bottom: .4rem; }
.vizinhas a[rel="next"] { text-align: right; }
.vizinhas a[rel="prev"]:hover { transform: translateX(-6px); color: var(--pau); }
.vizinhas a[rel="next"]:hover { transform: translateX(6px); color: var(--pau); }
.vizinhas__todas { font: 700 .85rem/1 var(--f-texto) !important; padding: .9em 1.3em; border: 1.5px solid var(--linha-clara); border-radius: 999px; }
@media (max-width: 640px) { .vizinhas { grid-template-columns: 1fr 1fr; } .vizinhas__todas { grid-column: span 2; order: 3; justify-self: center; } }

.nao-achei { padding-top: calc(160 * var(--u)); }
.nao-achei__lista { display: flex; flex-wrap: wrap; gap: 8px; }
.nao-achei__lista a { display: inline-block; padding: .6em 1em; border: 1.5px solid var(--linha-clara); border-radius: 999px; text-decoration: none; }

/* ---------- Responsivo do hero ---------- */
@media (max-width: 1000px) {
  .hero { grid-template-columns: 1fr; padding-top: calc(110 * var(--u)); min-height: 0; }
  .hero__texto { justify-self: start; max-width: 640px; }
  .hero__mapa { justify-self: center; max-width: 640px; margin-top: 10px; }
  .hero__legenda { display: none; }
}

/* ---------- Movimento reduzido ---------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition-duration: .01ms !important; transition-delay: 0ms !important; scroll-behavior: auto !important; }
  [data-revela] { opacity: 1; transform: none; }
  [data-letreiro] .pal > span { transform: none; }
  .hero .mapa .uf path { opacity: 1; transform: none; }
  .hero .mapa .mapa__estados { filter: none; }
  .mastro__pano { transform: none; }
}

/* Ajustes finos */
@media (hover: none), (max-width: 700px) { .estado-hero__dica { display: none; } }
@media (max-width: 700px) {
  .rodape__topo { flex-direction: column; align-items: flex-start; }
  .rodape__estados { grid-template-columns: 1fr 1fr; }
}