/* =========================================================================
   BRASIS — Estratégia, Inteligência e Negócios · folha de estilos do site
   Sistema: rota Cobogó. Uma única família (Archivo variável), usada em larguras
   contrastantes: títulos expandidos, numerais condensados, texto em largura normal.
   Grelha de 12 colunas, fios em bronze, padrão Cobogó só na abertura e um canto
   Cobogó por página (na faixa de contato).
   ========================================================================= */

@font-face {
  font-family: "Archivo";
  src: url("../fonts/archivo-var.woff2") format("woff2-variations"), url("../fonts/archivo-var.woff2") format("woff2");
  font-weight: 100 900;
  font-stretch: 62% 125%;
  font-style: normal;
  font-display: swap;
}

:root {
  /* Cor */
  --mata: #173D32;
  --mata-profundo: #1D4639;
  --mata-noite: #10291F;
  --off: #F4F0E6;
  --areia: #D9CBB4;
  --areia-clara: #EBE3D4;
  --grafite: #252925;
  --grafite-suave: #4B514A;
  --folha: #52745B;
  --bronze: #AD8B58;
  --bronze-claro: #C9A46B;
  --bronze-esc: #8A6A3C;
  --fio-claro: rgba(37, 41, 37, .14);
  --fio-escuro: rgba(244, 240, 230, .16);

  /* Tipo */
  --f: "Archivo", Arial, "Helvetica Neue", sans-serif;
  --larg-display: 118%;
  --larg-titulo: 110%;
  --larg-marca: 114%;
  --larg-numeral: 64%;
  --larg-dado: 86%;

  /* Espaço */
  --max: 1320px;
  --gutter: clamp(16px, 4.4vw, 56px);
  --col-gap: clamp(16px, 2vw, 32px);
  --faixa: clamp(72px, 10vw, 148px);
  --altura-cab: 76px;
  --ease: cubic-bezier(.22, .7, .2, 1);

  color-scheme: light;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: calc(var(--altura-cab) + 16px); }
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }
body {
  margin: 0;
  background: var(--off);
  color: var(--grafite);
  font-family: var(--f);
  font-size: 17.5px;
  line-height: 1.62;
  font-kerning: normal;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
img, svg { max-width: 100%; }
img { display: block; height: auto; }
a { color: inherit; text-underline-offset: .2em; text-decoration-thickness: 1px; }
h1, h2, h3, h4 { margin: 0; font-weight: 500; text-wrap: balance; }
p, ul, ol, figure, blockquote { margin: 0; }
ul[class], ol[class] { list-style: none; padding: 0; }
button { font: inherit; color: inherit; }
:focus-visible { outline: 2px solid var(--bronze); outline-offset: 3px; }
[hidden] { display: none !important; }
::selection { background: var(--bronze); color: var(--mata-noite); }

.pular {
  position: absolute; left: 16px; top: -60px; z-index: 300;
  background: var(--bronze); color: var(--mata-noite); padding: 10px 16px; font-weight: 600; text-decoration: none;
}
.pular:focus { top: calc(env(safe-area-inset-top, 0px) + 12px); }
main:focus { outline: none; }

/* ---------- Estrutura ---------- */
.moldura {
  width: 100%;
  max-width: var(--max);
  margin-inline: auto;
  padding-left: max(var(--gutter), env(safe-area-inset-left, 0px));
  padding-right: max(var(--gutter), env(safe-area-inset-right, 0px));
}
.grade { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); }
.grade > * { min-width: 0; }
.faixa { padding-block: var(--faixa); }
.faixa--areia { background: var(--areia-clara); }
.faixa--mata { background: var(--mata); color: var(--off); }
.faixa--noite { background: var(--mata-noite); color: var(--off); }

/* ---------- Tipografia ---------- */
.rotulo {
  display: inline-flex; align-items: center; gap: 12px;
  font-size: 12px; font-weight: 600; letter-spacing: .17em; text-transform: uppercase; line-height: 1.3;
  color: var(--bronze-esc); margin: 0;
}
.rotulo::before { content: ""; width: 26px; height: 1px; background: currentColor; flex: none; }
.rotulo--sem-fio::before { display: none; }
.faixa--mata .rotulo, .faixa--noite .rotulo, .escuro .rotulo { color: var(--bronze); }

.display {
  font-stretch: var(--larg-display);
  font-weight: 340;
  font-size: clamp(2.65rem, 7.4vw, 6.4rem);
  line-height: .98;
  letter-spacing: -.022em;
}
.titulo-secao {
  font-stretch: var(--larg-titulo);
  font-weight: 380;
  font-size: clamp(2rem, 4.4vw, 3.6rem);
  line-height: 1.04;
  letter-spacing: -.016em;
}
.titulo-medio {
  font-stretch: var(--larg-titulo);
  font-weight: 420;
  font-size: clamp(1.5rem, 2.6vw, 2.15rem);
  line-height: 1.12;
  letter-spacing: -.01em;
}
.lead { font-size: clamp(1.1rem, 1.55vw, 1.32rem); line-height: 1.55; max-width: 36em; }
.texto-suave { color: var(--grafite-suave); }
.faixa--mata .texto-suave, .faixa--noite .texto-suave, .escuro .texto-suave { color: rgba(244, 240, 230, .74); }
.numeral {
  font-stretch: var(--larg-numeral);
  font-weight: 220;
  line-height: .78;
  letter-spacing: -.02em;
  font-variant-numeric: tabular-nums lining-nums;
}

/* ---------- Botões e links ---------- */
.botao {
  --b-fundo: var(--mata); --b-texto: var(--off); --b-borda: var(--mata);
  display: inline-flex; align-items: center; justify-content: center; gap: 12px;
  min-height: 50px; padding: 0 24px;
  background: var(--b-fundo); color: var(--b-texto); border: 1px solid var(--b-borda); border-radius: 0;
  font: 600 14.5px/1.1 var(--f); letter-spacing: .03em; text-decoration: none; cursor: pointer;
  transition: background-color .3s var(--ease), color .3s var(--ease), border-color .3s var(--ease);
}
.botao::after { content: "→"; font-weight: 400; transition: transform .35s var(--ease); }
.botao:hover::after { transform: translateX(4px); }
.botao--sem-seta::after { display: none; }
.botao:hover { --b-fundo: var(--mata-noite); --b-borda: var(--mata-noite); }
.botao--bronze { --b-fundo: var(--bronze); --b-texto: var(--mata-noite); --b-borda: var(--bronze); }
.botao--bronze:hover { --b-fundo: var(--bronze-claro); --b-borda: var(--bronze-claro); }
.botao--vazado-claro { --b-fundo: transparent; --b-texto: var(--off); --b-borda: rgba(244, 240, 230, .42); }
.botao--vazado-claro:hover { --b-fundo: var(--off); --b-texto: var(--mata); --b-borda: var(--off); }
.botao--vazado { --b-fundo: transparent; --b-texto: var(--mata); --b-borda: var(--mata); }
.botao--vazado:hover { --b-fundo: var(--mata); --b-texto: var(--off); }
.botao--compacto { min-height: 42px; padding: 0 18px; font-size: 13.5px; }
.botao--compacto::after { display: none; }
.acoes { display: flex; flex-wrap: wrap; gap: 12px; }

.link-seta {
  display: inline-flex; align-items: center; gap: 10px;
  font-weight: 600; font-size: 14.5px; letter-spacing: .02em; text-decoration: none;
  color: var(--mata); border-bottom: 1px solid currentColor; padding-bottom: 3px;
}
.link-seta::after { content: "→"; font-weight: 400; transition: transform .35s var(--ease); }
.link-seta:hover::after { transform: translateX(4px); }
.faixa--mata .link-seta, .faixa--noite .link-seta, .escuro .link-seta { color: var(--off); }

/* ---------- Marca ---------- */
.simbolo { display: block; fill: currentColor; flex: none; }
.marca { display: inline-flex; align-items: center; gap: 12px; text-decoration: none; color: var(--off); }
.marca__simbolo { width: 28px; height: 28px; }
.marca__nome { font-stretch: var(--larg-marca); font-weight: 500; letter-spacing: .16em; font-size: 18px; line-height: 1; margin-right: -.16em; }
.lockup { display: flex; flex-direction: column; gap: 8px; }
.lockup__nome { display: block; width: max-content; font-stretch: var(--larg-marca); font-weight: 500; letter-spacing: .16em; font-size: 34px; line-height: .9; }
.lockup__desc { display: block; width: max-content; font-weight: 500; font-size: 10px; line-height: 1; text-transform: uppercase; white-space: nowrap; color: var(--bronze); }

/* ---------- Cabeçalho ---------- */
.cabecalho {
  position: fixed; inset: 0 0 auto; z-index: 60;
  padding-top: env(safe-area-inset-top, 0px);
  color: var(--off);
  transition: background-color .4s var(--ease), box-shadow .4s var(--ease), transform .4s var(--ease);
}
.cabecalho--rolado, .menu-aberto .cabecalho { background: rgba(16, 41, 31, .96); box-shadow: 0 1px 0 rgba(173, 139, 88, .28); }
@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
  .cabecalho--rolado { background: rgba(16, 41, 31, .86); -webkit-backdrop-filter: blur(14px) saturate(1.1); backdrop-filter: blur(14px) saturate(1.1); }
}
.cabecalho__barra { display: flex; align-items: center; justify-content: space-between; gap: 24px; height: var(--altura-cab); }
.nav { display: flex; align-items: center; gap: clamp(18px, 2.2vw, 34px); }
.nav__lista { display: flex; gap: clamp(16px, 2vw, 30px); }
.nav__link {
  position: relative; display: inline-block; padding-block: 8px;
  font-size: 14.5px; font-weight: 450; letter-spacing: .01em; text-decoration: none; color: rgba(244, 240, 230, .82);
  transition: color .25s var(--ease);
}
.nav__link::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 2px; height: 1px; background: var(--bronze);
  transform: scaleX(0); transform-origin: left; transition: transform .4s var(--ease);
}
.nav__link:hover, .nav__link[aria-current] { color: var(--off); }
.nav__link:hover::after, .nav__link[aria-current]::after { transform: scaleX(1); }
.nav__contato[aria-current] { --b-fundo: var(--off); --b-borda: var(--off); }

.menu-botao {
  display: none; align-items: center; gap: 12px; min-height: 44px; padding: 0 2px 0 12px;
  background: none; border: 0; color: var(--off); cursor: pointer;
  font-size: 13px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase;
}
.menu-botao__icone { position: relative; width: 26px; height: 12px; }
.menu-botao__icone i { position: absolute; left: 0; right: 0; height: 1.5px; background: currentColor; transition: transform .35s var(--ease), top .35s var(--ease); }
.menu-botao__icone i:first-child { top: 1px; }
.menu-botao__icone i:last-child { top: 9px; }
.menu-botao[aria-expanded="true"] .menu-botao__icone i:first-child { top: 5px; transform: rotate(45deg); }
.menu-botao[aria-expanded="true"] .menu-botao__icone i:last-child { top: 5px; transform: rotate(-45deg); }

.menu-movel {
  position: fixed; inset: 0; z-index: -1; overflow-y: auto;
  background: var(--mata-noite);
  padding-top: calc(env(safe-area-inset-top, 0px) + var(--altura-cab) + 24px);
  padding-bottom: calc(env(safe-area-inset-bottom, 0px) + 40px);
}
.menu-movel__nav ul { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--fio-escuro); }
.menu-movel__nav li { border-bottom: 1px solid var(--fio-escuro); }
.menu-movel__nav ul a {
  display: flex; justify-content: space-between; align-items: center; padding: 16px 0;
  font-stretch: var(--larg-titulo); font-size: clamp(1.45rem, 6vw, 2rem); font-weight: 380; text-decoration: none; color: var(--off);
}
.menu-movel__nav ul a::after { content: "→"; color: var(--bronze); font-size: .8em; }
.menu-movel__nav ul a[aria-current] { color: var(--bronze-claro); }
.menu-movel__canais { display: flex; flex-direction: column; gap: 10px; margin-top: 32px; font-size: 15px; }
.menu-movel__canais a { color: var(--areia); text-decoration: none; word-break: break-word; }
.menu-aberto, .menu-aberto body { overflow: hidden; }

@media (max-width: 1080px) {
  .nav { display: none; }
  .menu-botao { display: inline-flex; }
}

/* ---------- Abertura ---------- */
.abertura, .abertura__pular { display: none; }
.abertura-ativa .abertura {
  display: grid; place-items: center;
  position: fixed; inset: 0; z-index: 200;
  background: radial-gradient(120% 90% at 50% 45%, var(--mata) 0%, var(--mata-noite) 78%);
  color: var(--off); cursor: pointer;
  animation: abertura-seguranca .8s ease 9s forwards; /* se o script falhar, a página aparece */
  transition: clip-path 1s cubic-bezier(.76, 0, .24, 1), opacity .6s ease;
  clip-path: inset(0 0 0 0);
}
.abertura-ativa .abertura__pular {
  display: inline-flex; position: fixed; z-index: 201;
  right: max(var(--gutter), env(safe-area-inset-right, 0px)); bottom: calc(env(safe-area-inset-bottom, 0px) + 28px);
  min-height: 44px; align-items: center; padding: 0 18px;
  background: transparent; color: var(--areia); border: 1px solid rgba(217, 203, 180, .35); cursor: pointer;
  font-size: 12px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase;
  animation: abertura-seguranca .8s ease 9s forwards;
}
.abertura-ativa .abertura__pular:hover { color: var(--off); border-color: var(--off); }
.abertura-rodando body { overflow: hidden; }
.abertura.saindo { clip-path: inset(0 0 100% 0); }
.abertura.saindo ~ .abertura__pular, .abertura-fim .abertura__pular { opacity: 0; pointer-events: none; transition: opacity .3s; }
@keyframes abertura-seguranca { to { opacity: 0; visibility: hidden; pointer-events: none; } }

.abertura__palco { display: flex; flex-direction: column; align-items: center; gap: clamp(8px, 2vh, 20px); width: min(76vmin, 560px); }
.abertura__svg { width: 100%; height: auto; overflow: visible; }
.ab-guia { fill: none; stroke: var(--bronze); stroke-width: .6; opacity: .9; }
.ab-guia--circ { stroke-dasharray: 2 3; stroke-width: .5; }
.ab-mapa { fill: var(--off); fill-opacity: 0; stroke: var(--bronze-claro); stroke-width: 1.1; stroke-linejoin: round; }
.ab-pecas { opacity: 1; }
.ab-peca { opacity: 0; transform-box: fill-box; transform-origin: center; }
.ab-peca__forma, .ab-peca__resto { fill: var(--off); }
.abertura__assinatura { display: flex; flex-direction: column; align-items: center; gap: 12px; opacity: 0; transform: translateY(10px); transition: opacity .9s var(--ease), transform .9s var(--ease); }
.abertura__nome {
  font-stretch: var(--larg-marca); font-weight: 500; font-size: clamp(28px, 5.4vmin, 46px); line-height: 1;
  letter-spacing: .5em; margin-right: -.5em; transition: letter-spacing 1.4s var(--ease), margin-right 1.4s var(--ease);
}
.abertura__desc { font-size: clamp(9.5px, 1.5vmin, 12px); font-weight: 500; letter-spacing: .34em; margin-right: -.34em; text-transform: uppercase; color: var(--bronze); opacity: 0; transition: opacity .9s var(--ease) .45s; }
.abertura.assinar .abertura__assinatura { opacity: 1; transform: none; }
.abertura.assinar .abertura__nome { letter-spacing: .16em; margin-right: -.16em; }
.abertura.assinar .abertura__desc { opacity: 1; }
.abertura.abreviada .abertura__assinatura, .abertura.abreviada .abertura__nome, .abertura.abreviada .abertura__desc { transition-duration: .5s; transition-delay: 0s; }

/* ---------- Abertura da home (primeira dobra) ---------- */
.hero {
  position: relative; isolation: isolate; overflow: hidden;
  background: var(--mata-noite); color: var(--off);
  min-height: clamp(640px, 94svh, 980px);
  display: flex; flex-direction: column; justify-content: flex-end;
  padding-top: calc(env(safe-area-inset-top, 0px) + var(--altura-cab) + 48px);
}
/* Luz atravessando o cobogó: módulos tom sobre tom + luz quente mascarada pelo padrão */
.hero__fundo { position: absolute; inset: 0; z-index: -1; }
.hero__fundo::before, .hero__fundo::after {
  content: ""; position: absolute; inset: -10%;
  --cobogo: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 27 27'%3E%3Cpath d='M12.5 12.5H0A12.5 12.5 0 0 1 12.5 0ZM13.5 0H26A12.5 12.5 0 0 1 13.5 12.5ZM12.5 26H0A12.5 12.5 0 0 1 12.5 13.5ZM13.5 13.5H26A12.5 12.5 0 0 1 13.5 26Z'/%3E%3C/svg%3E");
  -webkit-mask-image: var(--cobogo); mask-image: var(--cobogo);
  -webkit-mask-size: var(--tile, 168px) var(--tile, 168px); mask-size: var(--tile, 168px) var(--tile, 168px);
}
.hero__fundo::before { background: linear-gradient(135deg, var(--mata-profundo), var(--mata) 60%); }
.hero__fundo::after {
  background: radial-gradient(38% 46% at 50% 50%, rgba(201, 164, 107, .5), rgba(201, 164, 107, .14) 45%, transparent 70%);
  background-size: 140% 140%;
  background-position: 70% 30%;
  animation: luz-cobogo 38s ease-in-out infinite alternate;
  mix-blend-mode: screen;
}
/* Com foto ou vídeo: tratamento cromático da marca e o padrão recolhido */
.hero__fundo--foto { background: var(--mata); }
.hero__fundo--foto::before, .hero__fundo--foto::after { display: none; }
.hero__midia { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: grayscale(1) contrast(1.08) brightness(.9); mix-blend-mode: luminosity; opacity: .62; }
@media (prefers-reduced-motion: no-preference) { img.hero__midia { animation: deriva 40s ease-in-out infinite alternate; } }
@keyframes deriva { from { transform: scale(1.04) translate(0, 0); } to { transform: scale(1.1) translate(-1.5%, -1%); } }
@keyframes luz-cobogo { 0% { background-position: 92% 18%; } 100% { background-position: 46% 64%; } }
.hero__veu {
  position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background:
    linear-gradient(90deg, rgba(16, 41, 31, .95) 0%, rgba(16, 41, 31, .78) 34%, rgba(16, 41, 31, .2) 70%, rgba(16, 41, 31, .35) 100%),
    linear-gradient(0deg, rgba(16, 41, 31, .96) 0%, transparent 42%);
}
.hero__conteudo { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); padding-bottom: clamp(48px, 7vw, 88px); }
.hero__conteudo > * { grid-column: 1 / span 10; min-width: 0; }
.hero__titulo { margin-top: 28px; max-width: 13ch; }
.hero__sub { margin-top: 30px; max-width: 34em; color: var(--areia); grid-column: 1 / span 6; }
.hero .acoes { margin-top: 40px; }
.hero__sumario { border-top: 1px solid var(--fio-escuro); }
.hero__sumario ol, .radar-lista ol { list-style: none; margin: 0; padding: 0; }
.hero__sumario ol { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.hero__sumario li { min-width: 0; border-left: 1px solid var(--fio-escuro); }
.hero__sumario li:first-child { border-left: 0; }
.hero__sumario a {
  display: flex; align-items: baseline; gap: 14px; height: 100%;
  padding: 20px clamp(12px, 1.6vw, 24px) calc(22px + env(safe-area-inset-bottom, 0px));
  text-decoration: none; color: rgba(244, 240, 230, .78); font-size: 14.5px; line-height: 1.35;
  transition: color .3s var(--ease), background-color .3s var(--ease);
}
.hero__sumario li:first-child a { padding-left: 0; }
.hero__sumario a:hover { color: var(--off); background: rgba(244, 240, 230, .04); }
.hero__sumario b { font-stretch: var(--larg-dado); font-weight: 500; color: var(--bronze); font-size: 13px; letter-spacing: .08em; font-variant-numeric: tabular-nums; }
@media (max-width: 900px) {
  .hero__conteudo > *, .hero__sub { grid-column: 1 / -1; }
  .hero__sumario ol { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hero__sumario li:nth-child(3) { border-left: 0; }
  .hero__sumario li:nth-child(n+3) { border-top: 1px solid var(--fio-escuro); }
  .hero__sumario li:nth-child(3) a { padding-left: 0; }
  .hero__sumario a { padding-bottom: 20px; }
}
@media (max-width: 520px) {
  .hero { min-height: auto; }
  .hero__sumario ol { grid-template-columns: 1fr; }
  .hero__sumario li { border-left: 0; border-top: 1px solid var(--fio-escuro); }
  .hero__sumario li:first-child { border-top: 0; }
  .hero__sumario a { padding: 15px 0; }
}

/* Revelação tipográfica da frase após a abertura */
.hero__titulo .p { display: inline-block; }
@media (prefers-reduced-motion: no-preference) {
  .abertura-ativa .hero__titulo .p, .abertura-ativa .hero__sub, .abertura-ativa .hero .acoes, .abertura-ativa .hero__rotulo { opacity: 0; transform: translateY(.45em); }
  .abertura-fim .hero__titulo .p, .abertura-fim .hero__sub, .abertura-fim .hero .acoes, .abertura-fim .hero__rotulo {
    opacity: 1; transform: none; transition: opacity 1s var(--ease), transform 1.1s var(--ease);
    transition-delay: calc(.35s + var(--i, 0) * 70ms);
  }
}

/* ---------- Cabeça de seção ---------- */
.cab-secao { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); row-gap: 22px; margin-bottom: clamp(48px, 6vw, 88px); }
.cab-secao > * { min-width: 0; }
.cab-secao .rotulo { grid-column: 1 / -1; }
.cab-secao h2 { grid-column: 1 / span 7; }
.cab-secao .lead { grid-column: 8 / -1; align-self: end; }
@media (max-width: 900px) { .cab-secao h2, .cab-secao .lead { grid-column: 1 / -1; } }

/* ---------- Manifesto ---------- */
.atuacao-home > .faixa { padding-top: clamp(16px, 3vw, 40px); }
.manifesto__texto { grid-column: 1 / span 6; display: flex; flex-direction: column; gap: 26px; align-self: center; }
.manifesto__texto .titulo-secao { max-width: 12ch; }
.manifesto__desenho { grid-column: 8 / -1; }
.manifesto__legenda { margin-top: 14px; font-size: 13px; color: var(--grafite-suave); display: flex; justify-content: space-between; gap: 16px; border-top: 1px solid var(--fio-claro); padding-top: 12px; }
.manifesto__legenda span:last-child { font-stretch: var(--larg-dado); letter-spacing: .06em; }
@media (max-width: 900px) {
  .manifesto__texto, .manifesto__desenho { grid-column: 1 / -1; }
  .manifesto__desenho { margin-top: 48px; max-width: 520px; }
}
.conceito { margin-top: 10px; padding: 22px 0 0; border-top: 1px solid var(--bronze-esc); font-stretch: 104%; font-size: 1.12rem; font-weight: 500; color: var(--mata); }

/* ---------- Ilustrações ---------- */
.ilustracao { display: block; width: 100%; height: auto; overflow: visible;
  --il-linha: rgba(37, 41, 37, .62); --il-fina: rgba(37, 41, 37, .3); --il-grade: rgba(37, 41, 37, .07);
  --il-destaque: var(--bronze-esc); --il-plano: var(--off); --il-forte: var(--mata); --il-texto: rgba(37, 41, 37, .58); }
.escuro .ilustracao, .faixa--mata .ilustracao, .faixa--noite .ilustracao {
  --il-linha: rgba(244, 240, 230, .7); --il-fina: rgba(244, 240, 230, .32); --il-grade: rgba(244, 240, 230, .07);
  --il-destaque: var(--bronze); --il-plano: var(--mata-profundo); --il-forte: var(--off); --il-texto: rgba(244, 240, 230, .6); }
.il-grade { fill: none; stroke: var(--il-grade); stroke-width: 1; }
.il-linha { fill: none; stroke: var(--il-linha); stroke-width: 1.4; stroke-linejoin: round; stroke-linecap: round; }
.il-linha-fina { fill: none; stroke: var(--il-fina); stroke-width: 1; }
.il-tracejado { fill: none; stroke: var(--il-fina); stroke-width: 1; stroke-dasharray: 3 5; }
.il-destaque { fill: none; stroke: var(--il-destaque); stroke-width: 2.2; stroke-linecap: round; }
.il-plano { fill: var(--il-plano); }
.il-plano-forte { fill: var(--il-forte); }
.il-plano-destaque { fill: var(--il-destaque); }
.il-anel { fill: none; stroke: var(--il-fina); stroke-width: 1; stroke-dasharray: 2 4; }
.il-no { fill: var(--il-plano); stroke: var(--il-linha); stroke-width: 1.2; }
.il-no-destaque { fill: var(--il-destaque); }
.il-ponto { fill: var(--il-forte); }
.il-texto { fill: var(--il-texto); font: 600 10px/1 var(--f); letter-spacing: .14em; }
.il-texto-destaque { fill: var(--il-destaque); }
.il-quartos { fill: none; stroke: var(--il-destaque); stroke-width: 1.2; stroke-dasharray: 3 3; }
.il-brasil .il-plano { fill: var(--areia-clara); }
.il-brasil .il-linha { stroke-width: 1.1; }

/* Desenho que se traça ao entrar na tela */
@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    .tracar .il-linha, .tracar .il-destaque { stroke-dasharray: 1400; animation: tracar linear both; animation-timeline: view(); animation-range: entry 10% cover 45%; }
  }
}
@keyframes tracar { from { stroke-dashoffset: 1400; } to { stroke-dashoffset: 0; } }

/* Revelação suave de blocos ao rolar (sem esconder conteúdo onde não há suporte) */
@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    [data-revelar] { animation: revelar linear both; animation-timeline: view(); animation-range: entry 0% entry 55%; }
    [data-revelar="foto"] { animation-name: revelar-foto; }
  }
}
@keyframes revelar { from { opacity: 0; transform: translateY(28px); } to { opacity: 1; transform: none; } }
@keyframes revelar-foto { from { clip-path: inset(0 0 22% 0); transform: translateY(24px); } to { clip-path: inset(0 0 0 0); transform: none; } }

/* ---------- Pilares ---------- */
.pilar { position: relative; padding-block: clamp(64px, 8vw, 120px); border-top: 1px solid var(--fio-claro); }
.pilar.escuro { background: var(--mata); color: var(--off); border-top: 0; }
.pilar.areia { background: var(--areia-clara); border-top: 0; }
.pilar__visual { grid-column: 1 / span 6; align-self: start; position: sticky; top: calc(var(--altura-cab) + 32px); }
.pilar__corpo { grid-column: 8 / -1; display: flex; flex-direction: column; gap: 22px; }
.pilar--direita .pilar__visual { grid-column: 7 / -1; grid-row: 1; }
.pilar--direita .pilar__corpo { grid-column: 1 / span 5; grid-row: 1; }
.painel { position: relative; aspect-ratio: 4 / 3; max-width: 100%; background: var(--areia-clara); padding: clamp(14px, 3vw, 36px); display: grid; place-items: center; overflow: hidden; }
.areia .painel { background: var(--off); }
.escuro .painel { background: var(--mata-profundo); }
.painel .ilustracao { max-height: 100%; }
.painel__foto { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.painel__legenda { margin-top: 12px; display: flex; justify-content: space-between; gap: 16px; font-size: 12.5px; color: var(--grafite-suave); }
.escuro .painel__legenda { color: rgba(244, 240, 230, .6); }
.pilar__num { font-size: clamp(5.5rem, 13vw, 11.5rem); color: var(--bronze); opacity: .9; margin-bottom: -6px; }
.pilar__nome { font-stretch: var(--larg-titulo); font-weight: 400; font-size: clamp(1.9rem, 3.6vw, 3rem); line-height: 1.06; letter-spacing: -.014em; }
.pilar__nome a { text-decoration: none; }
.pilar__nome a:hover { text-decoration: underline; text-decoration-color: var(--bronze); }
.pilar__chamada { font-size: 1.12rem; line-height: 1.5; }
@media (max-width: 900px) {
  .pilar__visual, .pilar--direita .pilar__visual { grid-column: 1 / -1; grid-row: 2; position: static; margin-top: 40px; }
  .pilar__corpo, .pilar--direita .pilar__corpo { grid-column: 1 / -1; grid-row: 1; }
}

.servicos { counter-reset: s; border-top: 1px solid var(--fio-claro); margin-top: 8px; }
.escuro .servicos { border-color: var(--fio-escuro); }
.servico { border-bottom: 1px solid var(--fio-claro); counter-increment: s; }
.escuro .servico { border-color: var(--fio-escuro); }
.servico summary {
  list-style: none; cursor: pointer; display: grid; grid-template-columns: 34px 1fr 24px; align-items: baseline; gap: 10px;
  padding: 17px 0; font-weight: 560; font-size: 1.04rem; line-height: 1.35;
}
.servico summary::-webkit-details-marker { display: none; }
.servico summary::before { content: counter(s, decimal-leading-zero); font-stretch: var(--larg-dado); font-weight: 500; font-size: 12.5px; letter-spacing: .06em; color: var(--bronze-esc); font-variant-numeric: tabular-nums; }
.escuro .servico summary::before { color: var(--bronze); }
.servico__mais { position: relative; width: 14px; height: 14px; align-self: center; justify-self: end; }
.servico__mais::before, .servico__mais::after { content: ""; position: absolute; left: 0; right: 0; top: 50%; height: 1.5px; margin-top: -.75px; background: currentColor; transition: transform .35s var(--ease); }
.servico__mais::after { transform: rotate(90deg); }
.servico[open] .servico__mais::after { transform: rotate(0); }
.servico summary:hover { color: var(--mata); }
.escuro .servico summary:hover { color: var(--bronze-claro); }
.servico__conteudo { padding: 0 0 22px 44px; display: flex; flex-direction: column; gap: 14px; }
.servico__conteudo p { color: var(--grafite-suave); font-size: 16px; max-width: 38em; }
.escuro .servico__conteudo p { color: rgba(244, 240, 230, .76); }
.servico__conteudo .link-seta { font-size: 13.5px; align-self: flex-start; }
@media (prefers-reduced-motion: no-preference) {
  .servico[open] .servico__conteudo { animation: abrir .45s var(--ease); }
}
@keyframes abrir { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }

/* ---------- Método ---------- */
.passos { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--col-gap); position: relative; counter-reset: p; }
.passos::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 1px; background: var(--bronze-esc); transform-origin: left; }
@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    .passos::before { animation: linha linear both; animation-timeline: view(); animation-range: entry 20% cover 50%; }
  }
}
@keyframes linha { from { transform: scaleX(0); } to { transform: scaleX(1); } }
.passo { counter-increment: p; padding-top: 26px; display: flex; flex-direction: column; gap: 12px; min-width: 0; position: relative; }
.passo::before { content: ""; position: absolute; top: -4px; left: 0; width: 9px; height: 9px; background: var(--bronze); border-radius: 50%; }
.passo__num { font-size: 4.2rem; color: var(--bronze-esc); }
.passo__num::before { content: counter(p); }
.passo h3 { font-stretch: var(--larg-titulo); font-weight: 500; font-size: 1.32rem; color: var(--mata); }
.passo p { color: var(--grafite-suave); font-size: 16px; }
.faixa--mata .passo h3, .escuro .passo h3 { color: var(--off); }
.faixa--mata .passo p, .escuro .passo p { color: rgba(244, 240, 230, .76); }
.faixa--mata .passos::before { background: var(--bronze); }
.faixa--mata .passo__num { color: var(--bronze); }
.principios { display: flex; flex-wrap: wrap; gap: 10px 12px; margin-top: clamp(40px, 5vw, 64px); }
.principios li { border: 1px solid var(--fio-claro); padding: 9px 16px; font-size: 13.5px; font-weight: 550; letter-spacing: .02em; }
.faixa--mata .principios li { border-color: var(--fio-escuro); }
@media (max-width: 900px) { .passos { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 44px; } }
@media (max-width: 560px) {
  .passos { grid-template-columns: 1fr; padding-left: 24px; }
  .passos::before { top: 0; bottom: 0; left: 0; right: auto; width: 1px; height: auto; transform-origin: top; animation: none; }
  .passo { padding-top: 0; }
  .passo::before { top: 6px; left: -28px; }
  .passo__num { font-size: 3rem; }
}

/* ---------- Cards editoriais ---------- */
.editorial { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: clamp(32px, 3.4vw, 48px) var(--col-gap); }
.editorial > * { min-width: 0; }
.editorial__destaque { grid-column: 1 / span 7; grid-row: span 2; }
.editorial__lateral { grid-column: 8 / -1; }
@media (max-width: 900px) { .editorial__destaque, .editorial__lateral { grid-column: 1 / -1; grid-row: auto; } }
.cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(36px, 4vw, 56px) var(--col-gap); }
.cards > * { min-width: 0; }
@media (max-width: 960px) { .cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .cards { grid-template-columns: 1fr; } }

.card { position: relative; display: flex; flex-direction: column; gap: 14px; }
.card__capa { position: relative; aspect-ratio: 16 / 10; max-width: 100%; overflow: hidden; background: var(--mata); }
.card__capa svg, .card__capa img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform 1.1s var(--ease); }
.card:hover .card__capa svg, .card:hover .card__capa img { transform: scale(1.035); }
.card__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; font-size: 12.5px; color: var(--grafite-suave); }
.card__categoria { font-weight: 600; letter-spacing: .12em; text-transform: uppercase; font-size: 11.5px; color: var(--bronze-esc); }
.card__data { font-stretch: var(--larg-dado); font-variant-numeric: tabular-nums; letter-spacing: .03em; }
.card__titulo { font-stretch: 106%; font-weight: 500; font-size: 1.32rem; line-height: 1.22; letter-spacing: -.005em; }
.card__titulo a { text-decoration: none; }
.card__titulo a::after { content: ""; position: absolute; inset: 0; z-index: 1; }
.card__titulo a:hover { text-decoration: underline; text-decoration-color: var(--bronze); }
.card__resumo { color: var(--grafite-suave); font-size: 15.5px; line-height: 1.55; }
.card--destaque .card__titulo { font-stretch: var(--larg-titulo); font-weight: 400; font-size: clamp(1.7rem, 3vw, 2.5rem); line-height: 1.1; letter-spacing: -.012em; }
.card--destaque .card__resumo { font-size: 1.05rem; max-width: 36em; }
.card--linha { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); gap: 20px; align-items: start; padding-bottom: 32px; border-bottom: 1px solid var(--fio-claro); }
.card--linha:last-child { border-bottom: 0; padding-bottom: 0; }
.card--linha .card__texto { display: flex; flex-direction: column; gap: 10px; }
.card--linha .card__titulo { font-size: 1.12rem; }
.card--linha .card__resumo { display: none; }
@media (max-width: 520px) { .card--linha { grid-template-columns: 1fr; } .card--linha .card__resumo { display: block; } }
.selo-exemplo {
  position: absolute; top: 12px; left: 12px; z-index: 2;
  background: var(--off); color: var(--mata-noite); padding: 5px 10px;
  font-size: 10.5px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase;
}
.aviso-exemplo { display: flex; gap: 14px; align-items: flex-start; padding: 16px 20px; background: rgba(173, 139, 88, .14); border-left: 2px solid var(--bronze-esc); font-size: 14.5px; color: var(--grafite); }
.aviso-exemplo b { font-weight: 700; letter-spacing: .1em; text-transform: uppercase; font-size: 11.5px; color: var(--bronze-esc); white-space: nowrap; padding-top: 2px; }

.filtros { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: clamp(40px, 5vw, 64px); }
.filtros button {
  min-height: 40px; padding: 0 16px; background: transparent; border: 1px solid var(--fio-claro); cursor: pointer;
  font-size: 13.5px; font-weight: 550; color: var(--grafite); transition: background-color .25s, border-color .25s, color .25s;
}
.filtros button:hover { border-color: var(--mata); }
.filtros button[aria-pressed="true"] { background: var(--mata); border-color: var(--mata); color: var(--off); }
.vazio { padding: clamp(32px, 5vw, 56px); background: var(--areia-clara); display: flex; flex-direction: column; gap: 14px; align-items: flex-start; }
.vazio h3 { font-stretch: var(--larg-titulo); font-weight: 450; font-size: 1.4rem; }
.vazio p { color: var(--grafite-suave); max-width: 40em; }

/* ---------- Radar (bloco escuro) ---------- */
.radar-servico { grid-column: 1 / span 5; display: flex; flex-direction: column; gap: 20px; }
.radar-lista { grid-column: 7 / -1; }
.radar-lista ol { border-top: 1px solid var(--fio-escuro); counter-reset: r; }
.radar-lista li { border-bottom: 1px solid var(--fio-escuro); }
.radar-lista a { display: grid; grid-template-columns: 96px 1fr; gap: 20px; padding: 20px 0; text-decoration: none; color: var(--off); }
.radar-lista a:hover .radar-lista__titulo { text-decoration: underline; text-decoration-color: var(--bronze); }
.radar-lista__data { font-stretch: var(--larg-dado); font-size: 13px; letter-spacing: .05em; color: var(--bronze); font-variant-numeric: tabular-nums; padding-top: 3px; }
.radar-lista__titulo { font-stretch: 106%; font-weight: 500; font-size: 1.12rem; line-height: 1.3; }
.radar-lista__cat { display: block; font-size: 12.5px; color: rgba(244, 240, 230, .6); margin-top: 6px; }
.radar-lista__selo { display: inline-block; margin-left: 8px; padding: 2px 7px; font-size: 10px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; background: rgba(244, 240, 230, .12); color: var(--areia); vertical-align: 2px; }
@media (max-width: 900px) { .radar-servico, .radar-lista { grid-column: 1 / -1; } .radar-lista { margin-top: 48px; } }
@media (max-width: 480px) { .radar-lista a { grid-template-columns: 1fr; gap: 6px; } }

/* ---------- Projetos ---------- */
.tipos-projeto { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); border-top: 1px solid var(--fio-claro); }
.tipos-projeto li { padding: 20px 18px 20px 0; border-right: 1px solid var(--fio-claro); min-width: 0; }
.tipos-projeto li + li { padding-left: 18px; }
.tipos-projeto li:last-child { border-right: 0; }
.tipos-projeto b { display: block; font-stretch: var(--larg-titulo); font-weight: 500; font-size: 1.06rem; color: var(--mata); }
.tipos-projeto span { display: block; margin-top: 6px; font-size: 14px; color: var(--grafite-suave); line-height: 1.45; }
@media (max-width: 900px) {
  .tipos-projeto { grid-template-columns: 1fr 1fr; }
  .tipos-projeto li, .tipos-projeto li + li { padding: 18px 0; border-right: 0; border-bottom: 1px solid var(--fio-claro); }
  .tipos-projeto li:nth-child(odd) { padding-right: 16px; }
  .tipos-projeto li:nth-child(even) { padding-left: 16px; border-left: 1px solid var(--fio-claro); }
}
@media (max-width: 480px) { .tipos-projeto { grid-template-columns: 1fr; } .tipos-projeto li:nth-child(n) { padding: 16px 0; border-left: 0; } }

/* ---------- Convite / contato (canto Cobogó) ---------- */
.convite { position: relative; overflow: hidden; background: var(--mata); color: var(--off); padding-block: clamp(80px, 11vw, 160px); }
.convite__canto { position: absolute; right: 0; bottom: 0; width: clamp(160px, 26vw, 360px); height: auto; max-width: 60%; pointer-events: none; }
.convite .moldura { position: relative; }
.convite__titulo { grid-column: 1 / span 8; }
.convite__texto { grid-column: 1 / span 6; margin-top: 26px; color: var(--areia); }
.canais { grid-column: 1 / span 8; margin-top: clamp(40px, 5vw, 64px); border-top: 1px solid var(--fio-escuro); }
.canal { display: grid; grid-template-columns: 140px minmax(0, 1fr) auto; align-items: center; gap: 16px; padding: 20px 0; border-bottom: 1px solid var(--fio-escuro); text-decoration: none; color: var(--off); transition: padding .4s var(--ease); }
.canal:hover { padding-left: 10px; }
.canal__tipo { font-size: 12px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--bronze); }
.canal__valor { font-stretch: 106%; font-size: clamp(1.1rem, 2.4vw, 1.6rem); font-weight: 450; word-break: break-word; }
.canal__seta { color: var(--bronze); font-size: 1.2rem; transition: transform .35s var(--ease); }
.canal:hover .canal__seta { transform: translateX(4px); }
@media (max-width: 900px) { .convite__titulo, .convite__texto, .canais { grid-column: 1 / -1; } }
@media (max-width: 560px) { .canal { grid-template-columns: 1fr auto; } .canal__tipo { grid-column: 1 / -1; } }

/* ---------- Topo de página interna ---------- */
.topo-pagina {
  position: relative; overflow: hidden;
  background: var(--mata-noite); color: var(--off);
  padding-top: calc(env(safe-area-inset-top, 0px) + var(--altura-cab) + clamp(56px, 9vw, 120px));
  padding-bottom: clamp(56px, 8vw, 104px);
}
.topo-pagina::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: linear-gradient(90deg, var(--bronze), transparent 70%); opacity: .6; }
.topo-pagina .grade { row-gap: 26px; }
.topo-pagina .rotulo { grid-column: 1 / -1; color: var(--bronze); }
.topo-pagina h1 { grid-column: 1 / span 10; font-stretch: var(--larg-display); font-weight: 340; font-size: clamp(2.4rem, 6vw, 5.2rem); line-height: 1; letter-spacing: -.02em; }
.topo-pagina .lead { grid-column: 1 / span 7; color: var(--areia); }
.topo-pagina__num { position: absolute; right: max(var(--gutter), env(safe-area-inset-right, 0px)); bottom: -.08em; font-size: clamp(9rem, 26vw, 22rem); color: var(--bronze); opacity: .22; pointer-events: none; }
.trilha { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 8px; font-size: 13px; color: rgba(244, 240, 230, .62); }
.trilha a { color: rgba(244, 240, 230, .82); text-decoration: none; }
.trilha a:hover { color: var(--off); text-decoration: underline; }
.trilha span[aria-hidden] { color: var(--bronze); }
@media (max-width: 900px) { .topo-pagina h1, .topo-pagina .lead { grid-column: 1 / -1; } }

/* ---------- Quem somos ---------- */
.tripe { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--col-gap); }
.tripe > div { border-top: 1px solid var(--bronze-esc); padding-top: 22px; display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.tripe h3 { font-stretch: var(--larg-display); font-weight: 380; font-size: clamp(1.6rem, 2.8vw, 2.3rem); color: var(--mata); }
.tripe p { color: var(--grafite-suave); }
@media (max-width: 860px) { .tripe { grid-template-columns: 1fr; row-gap: 36px; } }
.valores { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--col-gap); }
.valores li { border-top: 1px solid var(--bronze); padding-top: 18px; display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.valores b { font-stretch: var(--larg-titulo); font-weight: 500; font-size: 1.15rem; }
.valores span { font-size: 15px; line-height: 1.5; color: rgba(244, 240, 230, .74); }
@media (max-width: 1000px) { .valores { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 36px; } }
@media (max-width: 520px) { .valores { grid-template-columns: 1fr; } }
.bloco-texto { grid-column: 1 / span 6; display: flex; flex-direction: column; gap: 20px; font-size: 1.06rem; }
.bloco-texto p { color: var(--grafite-suave); }
.bloco-texto p:first-child, .bloco-texto .rotulo + p { color: var(--grafite); font-size: 1.22rem; line-height: 1.5; }
.bloco-figura { grid-column: 8 / -1; }
@media (max-width: 900px) { .bloco-texto, .bloco-figura { grid-column: 1 / -1; } .bloco-figura { margin-top: 40px; } }

/* ---------- Atuação (página da frente) ---------- */
.servicos-detalhe { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--col-gap); counter-reset: s; }
.servicos-detalhe > li { counter-increment: s; border-top: 1px solid var(--bronze-esc); padding: 24px 0 8px; display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.servicos-detalhe > li::before { content: counter(s, decimal-leading-zero); font-stretch: var(--larg-dado); font-weight: 500; font-size: 13px; letter-spacing: .06em; color: var(--bronze-esc); }
.servicos-detalhe h3 { font-stretch: var(--larg-titulo); font-weight: 450; font-size: 1.5rem; line-height: 1.15; color: var(--mata); }
.servicos-detalhe p { color: var(--grafite-suave); }
.servicos-detalhe .acoes-texto { display: flex; flex-wrap: wrap; gap: 10px 22px; margin-top: 6px; }
@media (max-width: 760px) { .servicos-detalhe { grid-template-columns: 1fr; row-gap: 20px; } }
.outras-frentes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid var(--fio-claro); }
.outras-frentes a { display: flex; flex-direction: column; gap: 10px; padding: 26px 22px 26px 0; text-decoration: none; border-right: 1px solid var(--fio-claro); min-width: 0; }
.outras-frentes li + li a { padding-left: 22px; }
.outras-frentes li:last-child a { border-right: 0; }
.outras-frentes .numeral { font-size: 3.6rem; color: var(--bronze-esc); }
.outras-frentes b { font-stretch: var(--larg-titulo); font-weight: 450; font-size: 1.2rem; line-height: 1.2; }
.outras-frentes a:hover b { text-decoration: underline; text-decoration-color: var(--bronze); }
@media (max-width: 760px) {
  .outras-frentes { grid-template-columns: 1fr; }
  .outras-frentes a, .outras-frentes li + li a { padding: 20px 0; border-right: 0; border-bottom: 1px solid var(--fio-claro); }
}
.frentes-indice { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(48px, 6vw, 80px) var(--col-gap); }
.frente-card { display: flex; flex-direction: column; gap: 18px; min-width: 0; }
.frente-card .painel { aspect-ratio: 16 / 10; }
.frente-card__topo { display: flex; align-items: flex-end; gap: 18px; }
.frente-card .numeral { font-size: clamp(4.4rem, 8vw, 6.6rem); color: var(--bronze-esc); }
.frente-card h2 { font-stretch: var(--larg-titulo); font-weight: 420; font-size: clamp(1.5rem, 2.4vw, 2rem); line-height: 1.1; padding-bottom: 6px; }
.frente-card h2 a { text-decoration: none; }
.frente-card h2 a:hover { text-decoration: underline; text-decoration-color: var(--bronze); }
.frente-card ul { border-top: 1px solid var(--fio-claro); }
.frente-card li { padding: 11px 0; border-bottom: 1px solid var(--fio-claro); font-weight: 520; font-size: 15.5px; }
@media (max-width: 860px) { .frentes-indice { grid-template-columns: 1fr; } }

/* ---------- Artigo ---------- */
.progresso { position: fixed; left: 0; right: 0; top: 0; height: 2px; z-index: 70; background: var(--bronze); transform: scaleX(0); transform-origin: left; }
.artigo-topo h1 { grid-column: 1 / span 10; font-stretch: var(--larg-titulo); font-weight: 380; font-size: clamp(2.1rem, 4.8vw, 4rem); line-height: 1.05; letter-spacing: -.016em; }
.artigo-topo .lead { grid-column: 1 / span 8; }
.artigo-meta { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 8px 22px; font-size: 13.5px; color: rgba(244, 240, 230, .72); }
.artigo-meta strong { color: var(--off); font-weight: 600; }
.artigo-capa { margin-top: calc(-1 * clamp(28px, 4vw, 56px)); position: relative; z-index: 1; }
.artigo-capa .card__capa { aspect-ratio: 21 / 9; }
@media (max-width: 700px) { .artigo-capa .card__capa { aspect-ratio: 16 / 10; } }
.artigo-corpo { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); }
.artigo-corpo > * { min-width: 0; }
.artigo-lateral { grid-column: 1 / span 3; display: flex; flex-direction: column; gap: 22px; font-size: 14px; }
.artigo-lateral__fixo { position: sticky; top: calc(var(--altura-cab) + 32px); display: flex; flex-direction: column; gap: 22px; }
.prosa { grid-column: 4 / span 7; }
@media (max-width: 960px) { .artigo-lateral { grid-column: 1 / -1; order: 2; margin-top: 48px; } .artigo-lateral__fixo { position: static; } .prosa { grid-column: 1 / -1; } }
.prosa { font-size: 1.09rem; line-height: 1.72; }
.prosa > * + * { margin-top: 1.1em; }
.prosa h2 { margin-top: 2em; font-stretch: var(--larg-titulo); font-weight: 450; font-size: 1.62rem; line-height: 1.2; color: var(--mata); }
.prosa h3 { margin-top: 1.7em; font-weight: 600; font-size: 1.18rem; }
.prosa ul, .prosa ol { padding-left: 1.2em; }
.prosa li + li { margin-top: .45em; }
.prosa li::marker { color: var(--bronze-esc); }
.prosa blockquote { margin-block: 1.8em; padding: 6px 0 6px 26px; border-left: 2px solid var(--bronze); font-stretch: 106%; font-size: 1.36rem; line-height: 1.4; font-weight: 400; color: var(--mata); }
.prosa a { color: var(--mata); text-decoration-color: var(--bronze); }
.prosa strong { font-weight: 650; }
.prosa hr { border: 0; border-top: 1px solid var(--fio-claro); margin-block: 2.2em; }
.referencias { margin-top: 2.6em; padding-top: 24px; border-top: 1px solid var(--fio-claro); }
.referencias h2 { margin: 0 0 14px; font-size: 12px; font-weight: 600; letter-spacing: .17em; text-transform: uppercase; color: var(--bronze-esc); font-stretch: 100%; }
.referencias ol { padding-left: 1.2em; font-size: 15px; color: var(--grafite-suave); }
.referencias li + li { margin-top: 8px; }
.compartilhar { display: flex; flex-direction: column; gap: 10px; }
.compartilhar__links { display: flex; flex-wrap: wrap; gap: 8px; }
.compartilhar a, .compartilhar button {
  min-height: 38px; display: inline-flex; align-items: center; padding: 0 12px; border: 1px solid var(--fio-claro); background: transparent;
  font-size: 13px; font-weight: 550; text-decoration: none; cursor: pointer; color: var(--grafite);
}
.compartilhar a:hover, .compartilhar button:hover { border-color: var(--mata); color: var(--mata); }
.compartilhar [data-copiado] { font-size: 12.5px; color: var(--folha); font-weight: 600; }
.lateral-bloco { border-top: 1px solid var(--fio-claro); padding-top: 14px; display: flex; flex-direction: column; gap: 6px; }
.lateral-bloco .rotulo::before { display: none; }

/* ---------- Formulário ---------- */
.formulario { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px var(--col-gap); }
.campo { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.campo--largo { grid-column: 1 / -1; }
.campo label { font-size: 13px; font-weight: 600; letter-spacing: .04em; }
.campo input, .campo textarea, .campo select {
  width: 100%; min-height: 50px; padding: 12px 14px; border: 1px solid rgba(37, 41, 37, .28); border-radius: 0; background: #FBF9F4;
  font: 400 16px/1.4 var(--f); color: var(--grafite);
}
.campo textarea { min-height: 160px; resize: vertical; }
.campo input:focus, .campo textarea:focus { outline: 2px solid var(--bronze); outline-offset: 0; border-color: var(--bronze-esc); }
.campo__erro { font-size: 13px; color: #9B3B2B; }
.formulario__oculto { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.formulario__rodape { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; gap: 14px 24px; }
.formulario__nota { font-size: 13.5px; color: var(--grafite-suave); }
.formulario__status { grid-column: 1 / -1; padding: 14px 18px; font-size: 15px; }
.formulario__status--ok { background: rgba(82, 116, 91, .14); border-left: 2px solid var(--folha); }
.formulario__status--erro { background: rgba(155, 59, 43, .1); border-left: 2px solid #9B3B2B; }
@media (max-width: 640px) { .formulario { grid-template-columns: 1fr; } }

/* ---------- Contato (página) ---------- */
.contato-canais { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--col-gap); }
.contato-canal { border-top: 1px solid var(--bronze-esc); padding-top: 22px; display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.contato-canal h2 { font-size: 12px; font-weight: 600; letter-spacing: .17em; text-transform: uppercase; color: var(--bronze-esc); }
.contato-canal__valor { font-stretch: 106%; font-size: clamp(1.15rem, 1.9vw, 1.45rem); font-weight: 480; color: var(--mata); word-break: break-word; user-select: all; }
.contato-canal p { color: var(--grafite-suave); font-size: 15px; }
.contato-canal .acoes-texto { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 18px; margin-top: auto; padding-top: 6px; }
.copiar { background: none; border: 0; padding: 0; font-size: 13.5px; font-weight: 600; color: var(--grafite-suave); text-decoration: underline; text-underline-offset: .25em; cursor: pointer; }
.copiar:hover { color: var(--mata); }
[data-copiado] { font-size: 12.5px; color: var(--folha); font-weight: 600; }
@media (max-width: 900px) { .contato-canais { grid-template-columns: 1fr; row-gap: 36px; } }

/* ---------- Texto legal ---------- */
.texto-legal { grid-column: 3 / span 8; }
@media (max-width: 900px) { .texto-legal { grid-column: 1 / -1; } }

/* ---------- WhatsApp flutuante ---------- */
.whatsapp {
  position: fixed; z-index: 55;
  right: max(18px, calc(env(safe-area-inset-right, 0px) + 14px));
  bottom: max(18px, calc(env(safe-area-inset-bottom, 0px) + 14px));
  display: inline-flex; align-items: center; gap: 0;
  height: 58px; padding: 0 17px; border-radius: 29px;
  background: var(--mata); color: var(--off); text-decoration: none;
  box-shadow: 0 0 0 1px rgba(173, 139, 88, .55), 0 10px 28px rgba(16, 41, 31, .28);
  transition: background-color .3s var(--ease), box-shadow .3s var(--ease), gap .45s var(--ease);
}
.whatsapp__icone { width: 24px; height: 24px; fill: currentColor; flex: none; }
.whatsapp__rotulo { max-width: 0; overflow: hidden; white-space: nowrap; font-size: 14px; font-weight: 600; letter-spacing: .02em; transition: max-width .5s var(--ease), opacity .3s; opacity: 0; }
.whatsapp:hover, .whatsapp:focus-visible { background: var(--mata-noite); box-shadow: 0 0 0 1px var(--bronze), 0 12px 32px rgba(16, 41, 31, .34); }
@media (hover: hover) and (min-width: 900px) {
  .whatsapp:hover .whatsapp__rotulo, .whatsapp:focus-visible .whatsapp__rotulo { max-width: 180px; opacity: 1; }
  .whatsapp:hover, .whatsapp:focus-visible { gap: 12px; }
}
.abertura-rodando .whatsapp, .menu-aberto .whatsapp { opacity: 0; pointer-events: none; }
@media (max-width: 600px) { .whatsapp { height: 54px; padding: 0 15px; } }

/* ---------- Rodapé ---------- */
.rodape { background: var(--mata-noite); color: var(--areia); padding-top: clamp(64px, 8vw, 104px); padding-bottom: calc(env(safe-area-inset-bottom, 0px) + 96px); font-size: 14.5px; }
.rodape__topo { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 32px; padding-bottom: 48px; border-bottom: 1px solid rgba(217, 203, 180, .16); }
.rodape__assinatura { display: flex; align-items: center; gap: 18px; color: var(--off); }
.rodape__simbolo { width: 58px; height: 58px; }
.rodape__frase { font-stretch: var(--larg-titulo); font-weight: 380; font-size: clamp(1.3rem, 2.4vw, 1.9rem); color: var(--off); max-width: 18ch; line-height: 1.15; }
.rodape__colunas { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 36px var(--col-gap); padding-block: 48px; }
.rodape__colunas > * { min-width: 0; }
.rodape__colunas .rotulo { color: var(--bronze); margin-bottom: 18px; }
.rodape__colunas .rotulo::before { display: none; }
.rodape__colunas ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.rodape a { color: var(--areia); text-decoration: none; word-break: break-word; }
.rodape a:hover { color: var(--off); text-decoration: underline; text-decoration-color: var(--bronze); }
.rodape__base { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px 24px; padding-top: 22px; border-top: 1px solid rgba(217, 203, 180, .16); font-size: 13px; color: rgba(217, 203, 180, .7); }
@media (max-width: 860px) { .rodape__colunas { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 480px) { .rodape__colunas { grid-template-columns: 1fr; } }

/* ---------- Página 404 ---------- */
.nao-encontrada { min-height: 70svh; display: flex; align-items: flex-end; }

/* ---------- Movimento reduzido ---------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; }
  .hero__fundo::after { animation: none; }
}
@media print {
  .cabecalho, .whatsapp, .abertura, .abertura__pular, .convite__canto { display: none !important; }
}