/* ============================================================
   ADSN Projetos para Casa — folha de estilo única
   1. Tokens        2. Base        3. Utilitários
   4. Cabeçalho     5. Home        6. Cards e grades
   7. Catálogo      8. Projeto     9. Páginas de texto
   10. Rodapé       11. Responsivo
   ============================================================ */

/* ---------- 1. Tokens ---------- */
:root {
  --verde-900: #16301a;
  --verde-800: #1e4522;
  --verde-700: #2c6b2c;
  --verde-600: #3a8138;
  --verde-folha: #7ac143;
  --verde-brilho: #a4de6b;
  --verde-vale: #e9f3e0;

  --tinta: #17211a;
  --tinta-media: #4b574e;
  --tinta-clara: #737f77;

  --papel: #ffffff;
  --creme: #f8f7f1;
  --areia: #f0ece1;
  --borda: #e3ded0;
  --borda-forte: #cfc8b5;

  --ambar: #b96f22;
  --ambar-vale: #fbf1e2;
  --perigo: #9c3227;
  --perigo-vale: #fbeceb;

  --fonte-titulo: "Iowan Old Style", "Palatino Linotype", Palatino, "Book Antiqua", Georgia, serif;
  --fonte-texto: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

  --raio-p: 6px;
  --raio-m: 12px;
  --raio-g: 22px;
  --raio-xg: 34px;

  --sombra-baixa: 0 1px 2px rgba(22, 48, 26, .05), 0 2px 8px rgba(22, 48, 26, .04);
  --sombra-media: 0 2px 6px rgba(22, 48, 26, .06), 0 14px 32px -12px rgba(22, 48, 26, .18);
  --sombra-alta: 0 4px 12px rgba(22, 48, 26, .08), 0 32px 64px -24px rgba(22, 48, 26, .3);

  --envelope: 1220px;
  --topo-altura: 76px;
}

/* ---------- 2. Base ---------- */
*, *::before, *::after { box-sizing: border-box; }

html {
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
  scroll-padding-top: calc(var(--topo-altura) + 16px);
}

body {
  margin: 0;
  background: var(--creme);
  color: var(--tinta);
  font-family: var(--fonte-texto);
  font-size: 1.0625rem;
  line-height: 1.68;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

h1, h2, h3, h4 {
  font-family: var(--fonte-titulo);
  font-weight: 600;
  line-height: 1.14;
  letter-spacing: -.015em;
  margin: 0 0 .6em;
  color: var(--verde-900);
  text-wrap: balance;
}

h1 { font-size: clamp(2.1rem, 1.35rem + 3.1vw, 3.55rem); }
h2 { font-size: clamp(1.6rem, 1.2rem + 1.6vw, 2.3rem); }
h3 { font-size: clamp(1.12rem, 1rem + .5vw, 1.34rem); }

p { margin: 0 0 1.1em; }
p:last-child { margin-bottom: 0; }

a { color: var(--verde-700); text-decoration-thickness: 1px; text-underline-offset: .16em; }
a:hover { color: var(--verde-600); }

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

ul, ol { margin: 0 0 1.2em; padding-left: 1.3em; }
li { margin-bottom: .45em; }

table { border-collapse: collapse; width: 100%; }

button, input, select, textarea { font: inherit; color: inherit; }

:focus-visible {
  outline: 3px solid var(--verde-600);
  outline-offset: 2px;
  border-radius: 3px;
}

::selection { background: var(--verde-brilho); color: var(--verde-900); }

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

/* ---------- 3. Utilitários ---------- */
.envelope {
  width: min(100% - 2.5rem, var(--envelope));
  margin-inline: auto;
}

.oculto-visual {
  position: absolute;
  width: 1px; height: 1px;
  margin: -1px; padding: 0;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

.pular {
  position: absolute;
  left: 1rem; top: -4rem;
  z-index: 50;
  padding: .7rem 1.2rem;
  background: var(--verde-800);
  color: #fff;
  border-radius: 0 0 var(--raio-p) var(--raio-p);
  text-decoration: none;
  transition: top .18s ease;
}
.pular:focus { top: 0; color: #fff; }

.sobrescrito {
  font-family: var(--fonte-texto);
  font-size: .76rem;
  font-weight: 700;
  letter-spacing: .13em;
  text-transform: uppercase;
  color: var(--verde-600);
  margin-bottom: .9rem;
}
.sobrescrito a { color: inherit; text-decoration: none; border-bottom: 1px solid rgba(58, 129, 56, .35); }
.sobrescrito a:hover { border-bottom-color: currentColor; }
.sobrescrito--claro { color: var(--verde-brilho); }

.botao {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  padding: .82rem 1.5rem;
  border: 1px solid transparent;
  border-radius: 999px;
  font-size: .97rem;
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
  transition: transform .16s ease, box-shadow .2s ease, background-color .2s ease;
}
.botao--primario {
  background: linear-gradient(165deg, var(--verde-600), var(--verde-800));
  color: #fff;
  box-shadow: 0 1px 0 rgba(255, 255, 255, .22) inset, 0 10px 24px -12px rgba(28, 69, 34, .85);
}
.botao--primario:hover {
  color: #fff;
  transform: translateY(-1px);
  box-shadow: 0 1px 0 rgba(255, 255, 255, .28) inset, 0 16px 30px -12px rgba(28, 69, 34, .9);
}
.botao--claro {
  background: #fff;
  color: var(--verde-800);
}
.botao--claro:hover { color: var(--verde-900); transform: translateY(-1px); }
.botao--fantasma {
  background: transparent;
  border-color: var(--borda-forte);
  color: var(--tinta-media);
}
.botao--fantasma:hover { border-color: var(--verde-600); color: var(--verde-700); }

.titulo-bloco { max-width: 62ch; margin-bottom: 2.4rem; }
.titulo-bloco p { color: var(--tinta-media); margin-bottom: 0; }
.titulo-bloco--linha {
  max-width: none;
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: .8rem 1.5rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid var(--borda);
  margin-bottom: 1.9rem;
}
.titulo-bloco--linha h2 { margin: 0; }
.titulo-bloco--linha > a {
  font-size: .92rem;
  font-weight: 600;
  text-decoration: none;
  white-space: nowrap;
}
.titulo-bloco--linha > a::after { content: " →"; }
.titulo-bloco--linha > a:hover { text-decoration: underline; }

.lista-marcada { list-style: none; padding: 0; }
.lista-marcada li {
  position: relative;
  padding-left: 1.7rem;
  margin-bottom: .7rem;
}
.lista-marcada li::before {
  content: "";
  position: absolute;
  left: .2rem; top: .62em;
  width: .52rem; height: .52rem;
  border-radius: 2px;
  background: var(--verde-folha);
  transform: rotate(45deg);
}

/* ---------- 4. Cabeçalho ---------- */
.topo {
  position: sticky;
  top: 0;
  z-index: 40;
  background: rgba(248, 247, 241, .86);
  backdrop-filter: saturate(150%) blur(14px);
  border-bottom: 1px solid var(--borda);
}
.topo__interno {
  width: min(100% - 2.5rem, var(--envelope));
  margin-inline: auto;
  min-height: var(--topo-altura);
  display: flex;
  align-items: center;
  gap: 1.5rem;
}

.marca {
  display: flex;
  align-items: center;
  gap: .7rem;
  text-decoration: none;
  color: var(--verde-900);
  flex-shrink: 0;
}
.marca__icone {
  display: grid;
  place-items: center;
  width: 44px; height: 44px;
}
.marca__icone img { width: 44px; height: 44px; }
.marca__texto {
  display: grid;
  line-height: 1.06;
}
.marca__texto strong {
  font-family: var(--fonte-titulo);
  font-size: 1.36rem;
  letter-spacing: .01em;
}
.marca__texto span {
  font-size: .705rem;
  font-weight: 600;
  letter-spacing: .09em;
  text-transform: uppercase;
  color: var(--verde-600);
}

.menu-botao {
  display: none;
  margin-left: auto;
  align-items: center;
  gap: .55rem;
  padding: .5rem .9rem;
  background: var(--papel);
  border: 1px solid var(--borda-forte);
  border-radius: 999px;
  font-size: .88rem;
  font-weight: 600;
  cursor: pointer;
}
.menu-botao__barras {
  position: relative;
  width: 16px; height: 2px;
  background: var(--verde-800);
}
.menu-botao__barras::before,
.menu-botao__barras::after {
  content: "";
  position: absolute;
  left: 0;
  width: 16px; height: 2px;
  background: var(--verde-800);
}
.menu-botao__barras::before { top: -5px; }
.menu-botao__barras::after { top: 5px; }

.navegacao {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 1.7rem;
}
.navegacao ul {
  display: flex;
  align-items: center;
  gap: 1.35rem;
  list-style: none;
  margin: 0; padding: 0;
}
.navegacao li { margin: 0; }
.navegacao a {
  position: relative;
  display: block;
  padding: .35rem 0;
  font-size: .93rem;
  font-weight: 550;
  color: var(--tinta-media);
  text-decoration: none;
  white-space: nowrap;
}
.navegacao a::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: -.1rem;
  height: 2px;
  border-radius: 2px;
  background: var(--verde-folha);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .2s ease;
}
.navegacao a:hover { color: var(--verde-800); }
.navegacao a:hover::after,
.navegacao a[aria-current="page"]::after { transform: scaleX(1); }
.navegacao a[aria-current="page"] { color: var(--verde-800); }

.busca-topo label { display: none; }
.busca-topo__campo {
  display: flex;
  align-items: center;
  background: var(--papel);
  border: 1px solid var(--borda-forte);
  border-radius: 999px;
  overflow: hidden;
  transition: border-color .2s ease, box-shadow .2s ease;
}
.busca-topo__campo:focus-within {
  border-color: var(--verde-600);
  box-shadow: 0 0 0 3px rgba(58, 129, 56, .14);
}
.busca-topo input {
  width: 12rem;
  padding: .52rem .95rem;
  border: 0;
  background: transparent;
  font-size: .88rem;
}
.busca-topo input:focus-visible { outline: none; }
.busca-topo button {
  padding: .52rem 1rem;
  border: 0;
  background: var(--verde-vale);
  color: var(--verde-800);
  font-size: .82rem;
  font-weight: 650;
  cursor: pointer;
}
.busca-topo button:hover { background: var(--verde-brilho); }

/* Trilha de navegação */
.trilha { margin: 0 0 1.6rem; }
.trilha ol {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .25rem .55rem;
  list-style: none;
  margin: 0; padding: 0;
  font-size: .83rem;
}
.trilha li { margin: 0; display: flex; align-items: center; gap: .55rem; }
.trilha li + li::before {
  content: "/";
  color: var(--borda-forte);
}
.trilha a { color: var(--tinta-clara); text-decoration: none; }
.trilha a:hover { color: var(--verde-700); text-decoration: underline; }
.trilha [aria-current="page"] { color: var(--verde-800); font-weight: 600; }

/* ---------- 5. Home ---------- */
.abertura {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: clamp(2.6rem, 1.5rem + 4vw, 5.4rem) 0 clamp(3rem, 2rem + 4vw, 5rem);
  background: linear-gradient(178deg, #fdfdfa 0%, var(--creme) 42%, var(--areia) 100%);
}
.abertura__atmosfera { position: absolute; inset: 0; z-index: -1; }
.abertura__halo {
  position: absolute;
  border-radius: 50%;
  filter: blur(48px);
}
.abertura__halo--um {
  width: 46rem; height: 46rem;
  top: -22rem; right: -14rem;
  background: radial-gradient(circle, rgba(122, 193, 67, .32), rgba(122, 193, 67, 0) 68%);
}
.abertura__halo--dois {
  width: 34rem; height: 34rem;
  bottom: -18rem; left: -10rem;
  background: radial-gradient(circle, rgba(28, 69, 34, .18), rgba(28, 69, 34, 0) 70%);
}
.abertura__textura {
  position: absolute;
  inset: 0;
  opacity: .5;
  background-image:
    linear-gradient(rgba(28, 69, 34, .05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(28, 69, 34, .05) 1px, transparent 1px);
  background-size: 74px 74px;
  mask-image: radial-gradient(ellipse 70% 60% at 30% 20%, #000 10%, transparent 75%);
}

.abertura__grade {
  display: grid;
  grid-template-columns: minmax(0, 1.06fr) minmax(0, .94fr);
  gap: clamp(2rem, 1rem + 4vw, 4.5rem);
  align-items: center;
}
.abertura__texto h1 { margin-bottom: .8rem; }
.abertura__linha {
  font-size: 1.14rem;
  color: var(--tinta-media);
  max-width: 46ch;
  margin-bottom: 2rem;
}

.busca-grande { margin-bottom: 2rem; }
.busca-grande label {
  display: block;
  font-size: .82rem;
  font-weight: 650;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--tinta-clara);
  margin-bottom: .6rem;
}
.busca-grande__campo {
  display: flex;
  gap: .5rem;
  padding: .4rem;
  background: var(--papel);
  border: 1px solid var(--borda-forte);
  border-radius: 999px;
  box-shadow: var(--sombra-media);
  transition: border-color .2s ease, box-shadow .2s ease;
}
.busca-grande__campo:focus-within {
  border-color: var(--verde-600);
  box-shadow: var(--sombra-media), 0 0 0 4px rgba(58, 129, 56, .14);
}
.busca-grande input {
  flex: 1;
  min-width: 0;
  padding: .7rem 1.1rem;
  border: 0;
  background: transparent;
  font-size: 1rem;
}
.busca-grande input:focus-visible { outline: none; }
.busca-grande__dica {
  margin: .8rem 0 0;
  font-size: .88rem;
  color: var(--tinta-clara);
}

.numeros {
  display: flex;
  flex-wrap: wrap;
  gap: 2.4rem;
  margin: 0;
  padding-top: 1.6rem;
  border-top: 1px solid var(--borda);
}
.numeros div { display: grid; }
.numeros dt {
  order: 2;
  font-size: .76rem;
  font-weight: 650;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--tinta-clara);
}
.numeros dd {
  order: 1;
  margin: 0;
  font-family: var(--fonte-titulo);
  font-size: 2.5rem;
  line-height: 1;
  color: var(--verde-800);
}

.abertura__visual { position: relative; }
.abertura__cena {
  position: relative;
  margin: 0;
  border-radius: var(--raio-xg);
  overflow: hidden;
  box-shadow: var(--sombra-alta);
  transform: rotate(.6deg);
}
.abertura__cena img {
  width: 100%;
  aspect-ratio: 4 / 5;
  object-fit: cover;
}
.abertura__cena--vazia {
  aspect-ratio: 4 / 5;
  background:
    radial-gradient(120% 90% at 18% 12%, rgba(164, 222, 107, .5), transparent 60%),
    linear-gradient(150deg, var(--verde-700), var(--verde-900));
}

.ficha-flutuante {
  position: absolute;
  left: clamp(-2.5rem, -4vw, -1rem);
  bottom: 2.2rem;
  display: grid;
  gap: .3rem;
  width: min(19rem, 82%);
  padding: 1.15rem 1.35rem;
  background: rgba(255, 255, 255, .93);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(227, 222, 208, .9);
  border-radius: var(--raio-g);
  box-shadow: var(--sombra-alta);
  text-decoration: none;
  color: var(--tinta);
  transition: transform .22s ease, box-shadow .22s ease;
}
.ficha-flutuante:hover {
  transform: translateY(-3px);
  color: var(--tinta);
  box-shadow: var(--sombra-alta), 0 0 0 1px rgba(58, 129, 56, .3);
}
.ficha-flutuante__topo {
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--verde-600);
}
.ficha-flutuante strong {
  font-family: var(--fonte-titulo);
  font-size: 1.2rem;
  font-weight: 600;
  line-height: 1.2;
  color: var(--verde-900);
}
.ficha-flutuante__dados {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem .5rem;
  margin-top: .35rem;
  font-size: .76rem;
  color: var(--tinta-media);
}
.ficha-flutuante__dados span {
  padding: .16rem .55rem;
  background: var(--verde-vale);
  border-radius: 999px;
}

.etiqueta-flutuante {
  position: absolute;
  top: 1.6rem;
  right: -1rem;
  padding: .45rem 1rem;
  background: var(--verde-900);
  color: #fff;
  border-radius: 999px;
  font-size: .74rem;
  font-weight: 600;
  letter-spacing: .05em;
  box-shadow: var(--sombra-media);
  transform: rotate(2.5deg);
}

.organizacao { padding: clamp(3rem, 2rem + 3vw, 5rem) 0 0; }
.organizacao__grade {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 1.15rem;
}
.pilar {
  grid-column: span 2;
  padding: 1.7rem;
  background: var(--papel);
  border: 1px solid var(--borda);
  border-radius: var(--raio-g);
  box-shadow: var(--sombra-baixa);
}
.pilar h3 { margin-bottom: .55rem; }
.pilar p { color: var(--tinta-media); font-size: .96rem; }
.pilar--largo {
  grid-column: span 6;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 1.2rem 2.5rem;
  align-items: start;
  background:
    radial-gradient(120% 140% at 100% 0%, rgba(164, 222, 107, .22), transparent 58%),
    var(--papel);
}
.pilar--largo h3 { grid-column: 1 / -1; }
.pilar--destaque {
  grid-column: span 2;
  background: linear-gradient(160deg, var(--verde-800), var(--verde-900));
  border-color: transparent;
}
.pilar--destaque h3 { color: #fff; }
.pilar--destaque p { color: rgba(255, 255, 255, .82); }
.pilar--destaque a { color: var(--verde-brilho); }
.pilar__links {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  list-style: none;
  padding: 0;
  margin: 0;
}
.pilar__links li { margin: 0; }
.pilar__links a {
  display: block;
  padding: .34rem .85rem;
  background: var(--verde-vale);
  border-radius: 999px;
  font-size: .87rem;
  font-weight: 550;
  text-decoration: none;
}
.pilar__links a:hover { background: var(--verde-brilho); color: var(--verde-900); }
.pilar__links .pilar__mais { background: transparent; border: 1px dashed var(--borda-forte); }
.pilar__acao { margin-top: 1rem; margin-bottom: 0; font-weight: 600; font-size: .93rem; }
.pilar__acao a { text-decoration: none; }
.pilar__acao a::after { content: " →"; }
.pilar__acao a:hover { text-decoration: underline; }

.vitrine {
  margin: clamp(3.2rem, 2rem + 3vw, 5.5rem) 0;
  padding: clamp(2.4rem, 1.5rem + 3vw, 4rem) 0;
  background: linear-gradient(172deg, var(--areia), #f5f2e8);
  border-top: 1px solid var(--borda);
  border-bottom: 1px solid var(--borda);
}
.vitrine__grade {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
  gap: clamp(1.8rem, 1rem + 3vw, 3.6rem);
  align-items: center;
}
.vitrine__visual {
  position: relative;
  border-radius: var(--raio-xg);
  overflow: hidden;
  box-shadow: var(--sombra-alta);
  transform: rotate(-.7deg);
}
.vitrine__visual img { width: 100%; aspect-ratio: 5 / 4; object-fit: cover; }
.vitrine__ornamento {
  display: block;
  aspect-ratio: 5 / 4;
  background:
    radial-gradient(100% 80% at 15% 15%, rgba(164, 222, 107, .45), transparent 60%),
    linear-gradient(140deg, var(--verde-700), var(--verde-900));
}
.vitrine__texto h2 { margin-bottom: .7rem; }
.vitrine__texto h2 a { color: inherit; text-decoration: none; }
.vitrine__texto h2 a:hover { text-decoration: underline; text-decoration-color: var(--verde-folha); }
.vitrine__texto > p { color: var(--tinta-media); }
.vitrine__dados {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .1rem 1.5rem;
  list-style: none;
  margin: 1.5rem 0;
  padding: 1.1rem 0;
  border-top: 1px solid var(--borda-forte);
  border-bottom: 1px solid var(--borda-forte);
}
.vitrine__dados li {
  display: grid;
  gap: .1rem;
  margin: 0;
  padding: .4rem 0;
  min-width: 0;
  font-weight: 600;
  font-size: .97rem;
  overflow-wrap: break-word;
}
.vitrine__dados span {
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--tinta-clara);
}
.vitrine__acao { margin-top: 1.4rem; }

.mosaico-secao { padding-bottom: clamp(3rem, 2rem + 3vw, 5rem); }
.mosaico {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1rem;
}
.mosaico__item {
  position: relative;
  display: flex;
  align-items: flex-end;
  min-height: 11rem;
  padding: 1.15rem;
  border-radius: var(--raio-m);
  overflow: hidden;
  text-decoration: none;
  color: #fff;
  background: linear-gradient(150deg, var(--verde-700), var(--verde-900));
  box-shadow: var(--sombra-baixa);
  transition: transform .22s ease, box-shadow .22s ease;
}
.mosaico__item--grande { grid-column: span 2; min-height: 15rem; }
.mosaico__item img {
  position: absolute;
  inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform .5s cubic-bezier(.2, .7, .3, 1);
}
.mosaico__item::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(15, 32, 18, .88) 6%, rgba(15, 32, 18, .25) 52%, rgba(15, 32, 18, .05) 100%);
}
.mosaico__item:hover { transform: translateY(-3px); box-shadow: var(--sombra-media); color: #fff; }
.mosaico__item:hover img { transform: scale(1.05); }
.mosaico__conteudo {
  position: relative;
  z-index: 1;
  display: grid;
  gap: .15rem;
}
.mosaico__conteudo strong {
  font-family: var(--fonte-titulo);
  font-size: 1.28rem;
  font-weight: 600;
}
.mosaico__conteudo span {
  font-size: .79rem;
  color: rgba(255, 255, 255, .78);
}

.trilho { padding: clamp(2.4rem, 1.5rem + 2vw, 3.6rem) 0; }

.faixa-seguranca {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: clamp(3rem, 2rem + 3vw, 5rem) 0;
  background: linear-gradient(165deg, var(--verde-800) 0%, var(--verde-900) 62%, #0f2113 100%);
  color: rgba(255, 255, 255, .86);
}
.faixa-seguranca__atmosfera {
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    radial-gradient(50rem 32rem at 88% -10%, rgba(122, 193, 67, .28), transparent 62%),
    radial-gradient(34rem 26rem at 4% 108%, rgba(122, 193, 67, .14), transparent 66%);
}
.faixa-seguranca h2 { color: #fff; }
.faixa-seguranca__grade {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr);
  gap: clamp(1.8rem, 1rem + 3vw, 4rem);
  align-items: start;
}
.faixa-seguranca .lista-marcada {
  padding: 1.6rem;
  background: rgba(255, 255, 255, .06);
  border: 1px solid rgba(255, 255, 255, .12);
  border-radius: var(--raio-g);
  backdrop-filter: blur(6px);
}
.faixa-seguranca .lista-marcada li::before { background: var(--verde-brilho); }

.revisoes { padding: clamp(3rem, 2rem + 3vw, 5rem) 0; }
.revisoes__grade {
  display: grid;
  grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
  gap: clamp(1.8rem, 1rem + 3vw, 4rem);
  padding: clamp(1.8rem, 1rem + 2vw, 2.8rem);
  background: var(--papel);
  border: 1px solid var(--borda);
  border-radius: var(--raio-g);
  box-shadow: var(--sombra-baixa);
}
.revisoes__texto p { color: var(--tinta-media); font-size: .97rem; }
.revisoes__lista {
  list-style: none;
  margin: 0;
  padding: 0;
  counter-reset: rev;
}
.revisoes__lista li {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: .3rem 1rem;
  padding: .8rem 0;
  border-bottom: 1px dashed var(--borda);
  margin: 0;
}
.revisoes__lista li:last-child { border-bottom: 0; padding-bottom: 0; }
.revisoes__lista a { font-weight: 600; text-decoration: none; }
.revisoes__lista a:hover { text-decoration: underline; }
.revisoes__lista time { font-size: .82rem; color: var(--tinta-clara); }

/* ---------- 6. Cards e grades ---------- */
.grade-cards {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(15.5rem, 1fr));
  gap: 1.35rem;
}
.grade-cards--tres { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grade-cards--quatro { grid-template-columns: repeat(4, minmax(0, 1fr)); }

.card {
  display: flex;
  flex-direction: column;
  background: var(--papel);
  border: 1px solid var(--borda);
  border-radius: var(--raio-g);
  overflow: hidden;
  box-shadow: var(--sombra-baixa);
  transition: transform .2s ease, box-shadow .24s ease, border-color .24s ease;
}
.card:hover {
  transform: translateY(-3px);
  border-color: rgba(58, 129, 56, .4);
  box-shadow: var(--sombra-media);
}
.card__link {
  display: block;
  color: inherit;
  text-decoration: none;
}
.card__midia {
  position: relative;
  display: block;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background: linear-gradient(150deg, var(--verde-700), var(--verde-900));
}
.card__midia img {
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform .5s cubic-bezier(.2, .7, .3, 1);
}
.card:hover .card__midia img { transform: scale(1.04); }
.card__ornamento {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(90% 70% at 20% 18%, rgba(164, 222, 107, .42), transparent 62%),
    repeating-linear-gradient(115deg, rgba(255, 255, 255, .05) 0 12px, transparent 12px 26px);
}
.card__selo {
  position: absolute;
  left: .8rem; top: .8rem;
  padding: .22rem .68rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, .94);
  font-size: .71rem;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--verde-800);
  box-shadow: var(--sombra-baixa);
}
.card__selo.nivel--intermediario { color: var(--ambar); }
.card__selo.nivel--experiente { color: var(--perigo); }
.card__corpo { display: block; padding: 1.1rem 1.2rem .9rem; }
.card__titulo {
  font-size: 1.12rem;
  margin-bottom: .4rem;
}
.card:hover .card__titulo { color: var(--verde-700); }
.card__resumo {
  display: block;
  font-size: .9rem;
  line-height: 1.55;
  color: var(--tinta-media);
}
.card__dados {
  display: grid;
  /* Rotulos longos como "Reaproveitamento" nao cabem em tres colunas estreitas. */
  grid-template-columns: repeat(auto-fit, minmax(5.4rem, 1fr));
  gap: .55rem .9rem;
  list-style: none;
  margin: auto 0 0;
  padding: .85rem 1.2rem;
  border-top: 1px solid var(--borda);
  background: #fcfcf8;
}
.card__dados li {
  display: grid;
  gap: .05rem;
  margin: 0;
  min-width: 0;
  font-size: .79rem;
  font-weight: 600;
  line-height: 1.3;
  overflow-wrap: break-word;
  hyphens: auto;
}
.card__dados span {
  font-size: .64rem;
  font-weight: 700;
  letter-spacing: .09em;
  text-transform: uppercase;
  color: var(--tinta-clara);
}
.card__tag {
  margin: 0;
  padding: .5rem 1.2rem .7rem;
  background: #fcfcf8;
  font-size: .78rem;
  font-weight: 600;
  color: var(--ambar);
}
.card__tag--ok { color: var(--verde-600); }

/* Cabeça de seção usada em catálogo, categorias e 404 */
.cabeca-secao {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: clamp(1.8rem, 1rem + 2vw, 3rem) 0 clamp(2rem, 1.2rem + 2vw, 3.2rem);
  background: linear-gradient(178deg, #fdfdfa, var(--areia));
  border-bottom: 1px solid var(--borda);
}
.cabeca-secao__brilho {
  position: absolute;
  z-index: -1;
  top: -24rem; right: -12rem;
  width: 44rem; height: 44rem;
  border-radius: 50%;
  filter: blur(52px);
  background: radial-gradient(circle, rgba(122, 193, 67, .28), transparent 66%);
}
.cabeca-secao__grade {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 2.5rem;
  align-items: center;
}
.cabeca-secao--com-capa .cabeca-secao__grade {
  grid-template-columns: minmax(0, 1.35fr) minmax(0, .65fr);
}
.cabeca-secao__texto { max-width: 68ch; }
.cabeca-secao__texto h1 { margin-bottom: .8rem; }
.cabeca-secao__texto p { color: var(--tinta-media); }
.cabeca-secao__capa {
  margin: 0;
  border-radius: var(--raio-g);
  overflow: hidden;
  box-shadow: var(--sombra-media);
}
.cabeca-secao__capa img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }

/* Categorias */
.secao-categorias { display: grid; gap: clamp(2.6rem, 1.5rem + 3vw, 4.5rem); padding: clamp(2.6rem, 1.5rem + 3vw, 4.2rem) 0; }
.grade-categorias {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(16rem, 1fr));
  gap: 1.3rem;
}
/* Cinco recortes tematicos: colunas mais largas evitam um card sozinho na ultima linha. */
.grade-categorias--tema { grid-template-columns: repeat(auto-fill, minmax(21rem, 1fr)); }
.categoria-card {
  display: flex;
  flex-direction: column;
  background: var(--papel);
  border: 1px solid var(--borda);
  border-radius: var(--raio-g);
  overflow: hidden;
  box-shadow: var(--sombra-baixa);
  transition: transform .2s ease, box-shadow .24s ease;
}
.categoria-card:hover { transform: translateY(-3px); box-shadow: var(--sombra-media); }
.categoria-card > a { display: block; color: inherit; text-decoration: none; }
.categoria-card__midia {
  position: relative;
  display: block;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: linear-gradient(150deg, var(--verde-700), var(--verde-900));
}
.categoria-card__midia img { width: 100%; height: 100%; object-fit: cover; }
.categoria-card__corpo { display: block; padding: 1.15rem 1.25rem 1.25rem; }
.categoria-card__corpo h3 { margin-bottom: .3rem; }
.categoria-card__contagem {
  display: block;
  font-size: .74rem;
  font-weight: 700;
  letter-spacing: .09em;
  text-transform: uppercase;
  color: var(--verde-600);
  margin-bottom: .55rem;
}
.categoria-card__resumo { display: block; font-size: .91rem; color: var(--tinta-media); line-height: 1.55; }
.categoria-card__exemplos {
  margin: auto 0 0;
  padding: .8rem 1.25rem;
  border-top: 1px dashed var(--borda);
  font-size: .8rem;
  color: var(--tinta-clara);
}
.categoria-card--tema .categoria-card__midia { aspect-ratio: 21 / 9; }

.secao-categorias__atalhos {
  padding: clamp(1.6rem, 1rem + 2vw, 2.4rem);
  background: var(--verde-vale);
  border-radius: var(--raio-g);
}
.secao-categorias__atalhos h2 { font-size: 1.4rem; }
.secao-categorias__atalhos ul { list-style: none; padding: 0; margin: 0; display: grid; gap: .6rem; }
.secao-categorias__atalhos li { margin: 0; font-size: .96rem; color: var(--tinta-media); }
.secao-categorias__atalhos a { font-weight: 600; }

/* ---------- 7. Catálogo, filtros e paginação ---------- */
.catalogo {
  display: grid;
  grid-template-columns: 19rem minmax(0, 1fr);
  gap: clamp(1.6rem, 1rem + 2vw, 2.8rem);
  padding: clamp(2rem, 1.2rem + 2vw, 3.2rem) 0 clamp(3rem, 2rem + 3vw, 4.5rem);
  align-items: start;
}
.catalogo__lado { position: sticky; top: calc(var(--topo-altura) + 1.2rem); }

.filtros {
  display: grid;
  gap: 1.2rem;
  padding: 1.3rem;
  background: var(--papel);
  border: 1px solid var(--borda);
  border-radius: var(--raio-g);
  box-shadow: var(--sombra-baixa);
}
.filtros__topo { display: grid; gap: 1rem; }
.filtros label {
  display: block;
  font-size: .74rem;
  font-weight: 700;
  letter-spacing: .09em;
  text-transform: uppercase;
  color: var(--tinta-clara);
  margin-bottom: .4rem;
}
.filtros input[type="search"],
.filtros select {
  width: 100%;
  padding: .6rem .8rem;
  background: #fcfcf8;
  border: 1px solid var(--borda-forte);
  border-radius: var(--raio-p);
  font-size: .93rem;
}
.filtros input[type="search"]:focus,
.filtros select:focus {
  border-color: var(--verde-600);
  background: #fff;
}
.filtros__ajuda { margin: .45rem 0 0; font-size: .78rem; color: var(--tinta-clara); line-height: 1.45; }

.filtros__ativos {
  padding: .95rem 1rem;
  background: var(--verde-vale);
  border-radius: var(--raio-m);
}
.filtros__ativos h3 {
  font-family: var(--fonte-texto);
  font-size: .74rem;
  font-weight: 700;
  letter-spacing: .09em;
  text-transform: uppercase;
  color: var(--verde-700);
  margin-bottom: .6rem;
}
.filtros__ativos ul { list-style: none; margin: 0 0 .7rem; padding: 0; display: flex; flex-wrap: wrap; gap: .4rem; }
.filtros__ativos li { margin: 0; }
.filtros__ativos a {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  padding: .28rem .6rem;
  background: var(--papel);
  border: 1px solid rgba(58, 129, 56, .3);
  border-radius: 999px;
  font-size: .8rem;
  text-decoration: none;
  color: var(--verde-900);
}
.filtros__ativos a span { color: var(--tinta-clara); font-size: .74rem; }
.filtros__ativos a em { font-style: normal; font-weight: 700; color: var(--perigo); }
.filtros__ativos a:hover { border-color: var(--perigo); background: #fff; }
.filtros__limpar { font-size: .8rem; font-weight: 600; }

.filtros__grades { display: grid; gap: .2rem; }
.faceta {
  border-top: 1px solid var(--borda);
  padding: .2rem 0;
}
.faceta summary {
  display: flex;
  align-items: center;
  gap: .5rem;
  padding: .6rem .2rem;
  font-size: .88rem;
  font-weight: 650;
  color: var(--verde-900);
  cursor: pointer;
  list-style: none;
}
.faceta summary::-webkit-details-marker { display: none; }
.faceta summary::after {
  content: "+";
  margin-left: auto;
  font-size: 1.1rem;
  font-weight: 400;
  color: var(--tinta-clara);
}
.faceta[open] summary::after { content: "–"; }
.faceta__contador {
  display: inline-grid;
  place-items: center;
  min-width: 1.3rem;
  height: 1.3rem;
  padding: 0 .3rem;
  background: var(--verde-700);
  color: #fff;
  border-radius: 999px;
  font-size: .7rem;
}
.faceta ul { list-style: none; margin: 0 0 .7rem; padding: 0 .2rem; display: grid; gap: .1rem; }
.faceta li { margin: 0; display: flex; align-items: flex-start; gap: .5rem; }
.faceta input[type="checkbox"] {
  margin: .42rem 0 0;
  width: 1rem; height: 1rem;
  accent-color: var(--verde-700);
  flex-shrink: 0;
}
.faceta li label {
  display: flex;
  flex: 1;
  gap: .5rem;
  align-items: baseline;
  justify-content: space-between;
  margin: 0;
  padding: .25rem 0;
  font-size: .87rem;
  font-weight: 450;
  letter-spacing: 0;
  text-transform: none;
  color: var(--tinta);
  cursor: pointer;
}
.faceta li label:hover { color: var(--verde-700); }
.faceta__n { font-size: .74rem; color: var(--tinta-clara); font-variant-numeric: tabular-nums; }
.faceta--extensa ul { max-height: 15rem; overflow-y: auto; padding-right: .4rem; }

.filtros__acoes { display: flex; flex-wrap: wrap; gap: .6rem; }
/* A base larga faz os botoes empilharem na coluna estreita em vez de quebrar o rotulo. */
.filtros__acoes .botao { flex: 1 1 9rem; white-space: nowrap; }

.catalogo__resumo {
  margin-bottom: 1.4rem;
  padding-bottom: .9rem;
  border-bottom: 1px solid var(--borda);
  font-size: .93rem;
  color: var(--tinta-media);
}
.catalogo__resumo strong { color: var(--verde-900); }

.nota-custo {
  margin-top: 2rem;
  padding: .9rem 1.1rem;
  background: var(--areia);
  border-left: 3px solid var(--verde-folha);
  border-radius: 0 var(--raio-p) var(--raio-p) 0;
  font-size: .85rem;
  color: var(--tinta-media);
}

.vazio {
  padding: clamp(1.6rem, 1rem + 2vw, 2.6rem);
  background: var(--papel);
  border: 1px dashed var(--borda-forte);
  border-radius: var(--raio-g);
}
.vazio h2 { font-size: 1.5rem; }
.vazio h3 {
  font-family: var(--fonte-texto);
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--tinta-clara);
  margin: 1.7rem 0 .8rem;
}
.vazio p { color: var(--tinta-media); }
.vazio__sugestoes { list-style: none; padding: 0; margin: 0; display: grid; gap: .5rem; }
.vazio__sugestoes li { margin: 0; }
.vazio__sugestoes a {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 1rem;
  padding: .75rem 1rem;
  background: var(--verde-vale);
  border-radius: var(--raio-p);
  font-weight: 600;
  text-decoration: none;
}
.vazio__sugestoes a:hover { background: var(--verde-brilho); color: var(--verde-900); }
.vazio__sugestoes span { font-size: .8rem; font-weight: 500; color: var(--tinta-media); }
.vazio__atalhos {
  list-style: none;
  padding: 0;
  margin: 1.4rem 0 0;
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
}
.vazio__atalhos li { margin: 0; }
.vazio__atalhos a {
  display: block;
  padding: .45rem .95rem;
  border: 1px solid var(--borda-forte);
  border-radius: 999px;
  font-size: .88rem;
  text-decoration: none;
}
.vazio__atalhos a:hover { border-color: var(--verde-600); background: var(--papel); }

.paginacao {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  margin-top: 2.4rem;
}
.paginacao ol { display: flex; gap: .35rem; list-style: none; margin: 0; padding: 0; }
.paginacao li { margin: 0; }
.paginacao a, .paginacao span, .paginacao__salto {
  display: grid;
  place-items: center;
  min-width: 2.4rem;
  height: 2.4rem;
  padding: 0 .7rem;
  border: 1px solid var(--borda);
  border-radius: var(--raio-p);
  background: var(--papel);
  font-size: .9rem;
  text-decoration: none;
}
.paginacao a:hover { border-color: var(--verde-600); }
.paginacao [aria-current="page"] {
  background: var(--verde-800);
  border-color: var(--verde-800);
  color: #fff;
  font-weight: 650;
}
.paginacao__gap { border: 0; background: transparent; min-width: 1rem; color: var(--tinta-clara); }
.paginacao__salto { font-weight: 600; }

/* ---------- 8. Página de projeto ---------- */
.projeto__abertura {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: clamp(1.6rem, 1rem + 2vw, 2.6rem) 0 clamp(2.4rem, 1.5rem + 3vw, 4rem);
  background: linear-gradient(176deg, #fdfdfa, var(--areia) 70%, #efeadd);
  border-bottom: 1px solid var(--borda);
}
.projeto__atmosfera {
  position: absolute;
  z-index: -1;
  inset: 0;
  background:
    radial-gradient(38rem 28rem at 82% -8%, rgba(122, 193, 67, .3), transparent 62%),
    radial-gradient(26rem 22rem at 2% 100%, rgba(28, 69, 34, .1), transparent 66%);
}
.projeto__grade {
  display: grid;
  grid-template-columns: minmax(0, 1.02fr) minmax(0, .98fr);
  gap: clamp(1.8rem, 1rem + 3vw, 3.6rem);
  align-items: start;
}
.projeto__cabeca h1 { margin-bottom: .7rem; }
.projeto__resumo {
  font-size: 1.13rem;
  line-height: 1.62;
  color: var(--tinta-media);
  max-width: 48ch;
}

.ficha {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .1rem 1.6rem;
  list-style: none;
  margin: 1.8rem 0 1rem;
  padding: 0;
}
.ficha li {
  display: grid;
  gap: .12rem;
  margin: 0;
  padding: .8rem 0;
  border-top: 1px solid var(--borda-forte);
}
.ficha span {
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--tinta-clara);
}
.ficha strong { font-size: 1rem; color: var(--verde-900); }
.ficha strong.nivel--intermediario { color: var(--ambar); }
.ficha strong.nivel--experiente { color: var(--perigo); }
.ficha em {
  font-style: normal;
  font-size: .82rem;
  line-height: 1.45;
  color: var(--tinta-clara);
}
.projeto__nota-custo { font-size: .82rem; color: var(--tinta-clara); }

.projeto__visual { position: relative; }
.projeto__visual figure {
  margin: 0;
  border-radius: var(--raio-xg);
  overflow: hidden;
  box-shadow: var(--sombra-alta);
  transform: rotate(.5deg);
}
.projeto__visual img { width: 100%; aspect-ratio: 5 / 4; object-fit: cover; }
.projeto__ornamento {
  display: block;
  aspect-ratio: 5 / 4;
  border-radius: var(--raio-xg);
  box-shadow: var(--sombra-alta);
  background:
    radial-gradient(90% 70% at 20% 15%, rgba(164, 222, 107, .45), transparent 62%),
    repeating-linear-gradient(118deg, rgba(255, 255, 255, .06) 0 14px, transparent 14px 30px),
    linear-gradient(145deg, var(--verde-700), var(--verde-900));
}

.projeto__corpo {
  display: grid;
  grid-template-columns: 16.5rem minmax(0, 1fr);
  gap: clamp(1.8rem, 1rem + 3vw, 4rem);
  padding: clamp(2.2rem, 1.5rem + 2vw, 3.6rem) 0 1rem;
  align-items: start;
}

.sumario {
  position: sticky;
  top: calc(var(--topo-altura) + 1.2rem);
  padding: 1.3rem;
  background: var(--papel);
  border: 1px solid var(--borda);
  border-radius: var(--raio-g);
  box-shadow: var(--sombra-baixa);
}
.sumario h2 {
  font-family: var(--fonte-texto);
  font-size: .74rem;
  font-weight: 700;
  letter-spacing: .11em;
  text-transform: uppercase;
  color: var(--tinta-clara);
  margin-bottom: .8rem;
}
.sumario ol { list-style: none; margin: 0; padding: 0; counter-reset: sec; }
.sumario li { margin: 0; counter-increment: sec; }
.sumario a {
  display: flex;
  gap: .6rem;
  padding: .38rem 0;
  font-size: .89rem;
  text-decoration: none;
  color: var(--tinta-media);
}
.sumario a::before {
  content: counter(sec, decimal-leading-zero);
  font-size: .74rem;
  font-weight: 700;
  color: var(--verde-folha);
  padding-top: .1rem;
}
.sumario a:hover { color: var(--verde-700); }
.sumario__revisao {
  margin: 1.1rem 0 0;
  padding-top: 1rem;
  border-top: 1px solid var(--borda);
  font-size: .78rem;
  color: var(--tinta-clara);
}
.sumario__revisao time { font-weight: 600; color: var(--verde-800); }

.texto { max-width: 74ch; }
.texto > section { margin-bottom: 2.8rem; scroll-margin-top: calc(var(--topo-altura) + 1.4rem); }
.texto > section > h2 {
  padding-bottom: .5rem;
  border-bottom: 2px solid var(--verde-vale);
}
.texto p { color: var(--tinta-media); }
.texto > section > p:first-of-type { color: var(--tinta); }

.duas-colunas {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr));
  gap: 1.2rem;
}
.lista-caixa {
  padding: 1.3rem 1.4rem;
  background: var(--papel);
  border: 1px solid var(--borda);
  border-radius: var(--raio-m);
  box-shadow: var(--sombra-baixa);
}
.lista-caixa h3 {
  font-family: var(--fonte-texto);
  font-size: .76rem;
  font-weight: 700;
  letter-spacing: .11em;
  text-transform: uppercase;
  color: var(--verde-600);
  margin-bottom: .9rem;
}
.lista-caixa ul { list-style: none; margin: 0; padding: 0; }
.lista-caixa li {
  padding: .6rem 0;
  border-bottom: 1px dashed var(--borda);
  margin: 0;
}
.lista-caixa li:last-child { border-bottom: 0; padding-bottom: 0; }
.lista-caixa strong { display: block; font-size: .95rem; font-weight: 600; }
.lista-caixa span { display: block; margin-top: .15rem; font-size: .84rem; color: var(--tinta-clara); line-height: 1.5; }
.lista-caixa--ferramentas { background: #fcfcf8; }
.lista-caixa__nota { margin: 1rem 0 0; font-size: .8rem; color: var(--tinta-clara); }

.tabela-medidas, .tabela-alternativas {
  margin: 1.4rem 0;
  font-size: .92rem;
  background: var(--papel);
  border: 1px solid var(--borda);
  border-radius: var(--raio-m);
  overflow: hidden;
}
.tabela-medidas th, .tabela-medidas td,
.tabela-alternativas th, .tabela-alternativas td {
  padding: .7rem .95rem;
  text-align: left;
  vertical-align: top;
  border-bottom: 1px solid var(--borda);
}
.tabela-medidas thead th, .tabela-alternativas thead th {
  background: var(--verde-vale);
  font-size: .74rem;
  font-weight: 700;
  letter-spacing: .07em;
  text-transform: uppercase;
  color: var(--verde-800);
}
.tabela-medidas tbody th, .tabela-alternativas tbody th { font-weight: 600; color: var(--verde-900); }
.tabela-medidas td { font-variant-numeric: tabular-nums; }
.tabela-alternativas td { color: var(--tinta-media); }
.tabela-medidas tr:last-child th, .tabela-medidas tr:last-child td,
.tabela-alternativas tr:last-child th, .tabela-alternativas tr:last-child td { border-bottom: 0; }

.etapas { list-style: none; padding: 0; counter-reset: etapa; }
.etapas > li {
  position: relative;
  counter-increment: etapa;
  padding: 0 0 1.6rem 3.4rem;
  margin: 0;
  scroll-margin-top: calc(var(--topo-altura) + 1.4rem);
}
.etapas > li::before {
  content: counter(etapa);
  position: absolute;
  left: 0; top: .05rem;
  display: grid;
  place-items: center;
  width: 2.35rem; height: 2.35rem;
  border-radius: 50%;
  background: linear-gradient(160deg, var(--verde-600), var(--verde-800));
  color: #fff;
  font-family: var(--fonte-titulo);
  font-size: 1.1rem;
  box-shadow: 0 6px 14px -8px rgba(28, 69, 34, .9);
}
.etapas > li::after {
  content: "";
  position: absolute;
  left: 1.17rem; top: 2.7rem; bottom: .5rem;
  width: 1px;
  background: linear-gradient(var(--borda-forte), transparent);
}
.etapas > li:last-child { padding-bottom: 0; }
.etapas > li:last-child::after { display: none; }
.etapas h3 { margin-bottom: .4rem; padding-top: .2rem; }
.etapas__dica {
  margin-top: .7rem;
  padding: .7rem .95rem;
  background: var(--ambar-vale);
  border-left: 3px solid var(--ambar);
  border-radius: 0 var(--raio-p) var(--raio-p) 0;
  font-size: .89rem;
  color: #6d4715;
}

.aviso {
  padding: 1.4rem 1.5rem;
  border-radius: var(--raio-m);
  border: 1px solid var(--borda);
  background: var(--papel);
}
.aviso h2 {
  font-size: 1.24rem;
  padding: 0;
  border: 0;
  margin-bottom: .7rem;
}
.aviso ul { margin-bottom: 0; }
.aviso li { color: var(--tinta-media); }
.aviso__rodape { margin-top: 1rem; font-size: .87rem; }
.aviso--seguranca {
  background: var(--perigo-vale);
  border-color: rgba(156, 50, 39, .22);
}
.aviso--seguranca h2 { color: var(--perigo); }
.aviso--seguranca a { color: var(--perigo); }
.aviso--atencao {
  background: var(--ambar-vale);
  border-color: rgba(185, 111, 34, .25);
  margin-bottom: 2.8rem;
}
.aviso--atencao h2 { color: #8b4f13; font-size: 1.1rem; }
.aviso--aluguel {
  background: var(--verde-vale);
  border-color: rgba(58, 129, 56, .22);
}

.erros { margin: 1.3rem 0 0; }
.erros > div {
  padding: .95rem 0;
  border-bottom: 1px dashed var(--borda);
}
.erros > div:last-child { border-bottom: 0; }
.erros dt {
  font-weight: 650;
  color: var(--verde-900);
  margin-bottom: .25rem;
}
.erros dt::before {
  content: "✕";
  margin-right: .5rem;
  color: var(--perigo);
  font-weight: 400;
}
.erros dd { margin: 0 0 0 1.4rem; color: var(--tinta-media); font-size: .94rem; }

.projeto__rodape {
  margin-top: 2.4rem;
  padding: 1.2rem 1.4rem;
  background: var(--areia);
  border-radius: var(--raio-m);
  font-size: .9rem;
  color: var(--tinta-media);
}
.projeto__rodape time { font-weight: 600; color: var(--verde-800); }

/* ---------- 9. Páginas de texto ---------- */
.pagina {
  display: grid;
  grid-template-columns: 16.5rem minmax(0, 1fr);
  gap: clamp(1.8rem, 1rem + 3vw, 4rem);
  padding: clamp(2.2rem, 1.5rem + 2vw, 3.6rem) 0 clamp(3rem, 2rem + 3vw, 4.5rem);
  align-items: start;
}
.pagina--simples { grid-template-columns: minmax(0, 1fr); }
.pagina--simples .texto { margin-inline: auto; }

.texto--pagina > h2 {
  margin-top: 2.6rem;
  padding-bottom: .5rem;
  border-bottom: 2px solid var(--verde-vale);
}
.texto--pagina > h2:first-child { margin-top: 0; }
.texto--pagina > h3 { margin-top: 1.8rem; }
.texto--pagina li { color: var(--tinta-media); }
.texto--pagina > ul, .texto--pagina > ol { margin-bottom: 1.4rem; }

.destaque-texto {
  margin: 1.6rem 0;
  padding: 1.3rem 1.5rem;
  background: var(--verde-vale);
  border-radius: var(--raio-m);
}
.destaque-texto p:last-child { margin-bottom: 0; }
.destaque-texto h3 { margin-top: 0; }

.definicoes { margin: 1.4rem 0 2.4rem; }
.definicoes > div {
  padding: 1rem 0;
  border-bottom: 1px solid var(--borda);
  scroll-margin-top: calc(var(--topo-altura) + 1.4rem);
}
.definicoes > div:last-child { border-bottom: 0; }
.definicoes dt {
  font-family: var(--fonte-titulo);
  font-size: 1.12rem;
  font-weight: 600;
  color: var(--verde-900);
  margin-bottom: .3rem;
}
.definicoes dd { margin: 0; color: var(--tinta-media); }
.definicoes dd + dd { margin-top: .4rem; font-size: .88rem; color: var(--tinta-clara); }

.alfabeto {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  list-style: none;
  margin: 0 0 2rem;
  padding: 0;
}
.alfabeto li { margin: 0; }
.alfabeto a, .alfabeto span {
  display: grid;
  place-items: center;
  width: 2.1rem; height: 2.1rem;
  border: 1px solid var(--borda);
  border-radius: var(--raio-p);
  background: var(--papel);
  font-size: .85rem;
  font-weight: 650;
  text-decoration: none;
}
.alfabeto a:hover { border-color: var(--verde-600); background: var(--verde-vale); }
.alfabeto span { color: var(--borda-forte); background: transparent; }

.fontes-lista { list-style: none; padding: 0; }
.fontes-lista > li {
  padding: 1.05rem 0;
  border-bottom: 1px solid var(--borda);
  margin: 0;
}
.fontes-lista > li:last-child { border-bottom: 0; }
.fontes-lista strong { display: block; color: var(--verde-900); font-size: 1rem; }
.fontes-lista span { display: block; margin-top: .2rem; font-size: .9rem; color: var(--tinta-media); }
.fontes-lista em { font-style: normal; font-size: .8rem; color: var(--tinta-clara); }

/* Formulário de contato */
.formulario {
  display: grid;
  gap: 1.15rem;
  margin: 1.8rem 0 0;
  padding: clamp(1.4rem, 1rem + 1.5vw, 2rem);
  background: var(--papel);
  border: 1px solid var(--borda);
  border-radius: var(--raio-g);
  box-shadow: var(--sombra-baixa);
}
.campo { display: grid; gap: .35rem; }
.campo label {
  font-size: .8rem;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--tinta-clara);
}
.campo input, .campo select, .campo textarea {
  width: 100%;
  padding: .7rem .85rem;
  background: #fcfcf8;
  border: 1px solid var(--borda-forte);
  border-radius: var(--raio-p);
  font-size: .97rem;
}
.campo textarea { min-height: 10rem; resize: vertical; line-height: 1.6; }
.campo input:focus, .campo select:focus, .campo textarea:focus {
  border-color: var(--verde-600);
  background: #fff;
}
.campo__ajuda { font-size: .8rem; color: var(--tinta-clara); }
.campo__erro { font-size: .84rem; font-weight: 600; color: var(--perigo); }
.campo--invalido input, .campo--invalido select, .campo--invalido textarea {
  border-color: var(--perigo);
  background: var(--perigo-vale);
}
.campo--isca { position: absolute; left: -9999px; }
.formulario__acoes { display: flex; flex-wrap: wrap; gap: .8rem; align-items: center; }
.formulario__nota { margin: 0; font-size: .82rem; color: var(--tinta-clara); }

.mensagem {
  padding: 1.1rem 1.3rem;
  border-radius: var(--raio-m);
  font-size: .95rem;
}
.mensagem--ok {
  background: var(--verde-vale);
  border: 1px solid rgba(58, 129, 56, .3);
  color: var(--verde-900);
}
.mensagem--erro {
  background: var(--perigo-vale);
  border: 1px solid rgba(156, 50, 39, .25);
  color: var(--perigo);
}
.mensagem--aviso {
  background: var(--ambar-vale);
  border: 1px solid rgba(185, 111, 34, .25);
  color: #7a4712;
}

.contato-blocos {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
  gap: 1rem;
  margin: 1.8rem 0 0;
}
.contato-blocos article {
  padding: 1.2rem 1.3rem;
  background: var(--areia);
  border-radius: var(--raio-m);
}
.contato-blocos h3 { font-size: 1.02rem; margin-bottom: .35rem; }
.contato-blocos p { font-size: .9rem; color: var(--tinta-media); margin: 0; }

.pagina__lado {
  position: sticky;
  top: calc(var(--topo-altura) + 1.2rem);
  display: grid;
  gap: 1rem;
}
.pagina__indice {
  padding: 1.3rem;
  background: var(--papel);
  border: 1px solid var(--borda);
  border-radius: var(--raio-g);
  box-shadow: var(--sombra-baixa);
}
.pagina__indice h2 {
  font-family: var(--fonte-texto);
  font-size: .74rem;
  font-weight: 700;
  letter-spacing: .11em;
  text-transform: uppercase;
  color: var(--tinta-clara);
  margin-bottom: .7rem;
}
.pagina__indice ul { list-style: none; margin: 0; padding: 0; }
.pagina__indice li { margin: 0; }
.pagina__indice a {
  display: block;
  padding: .35rem 0;
  font-size: .89rem;
  color: var(--tinta-media);
  text-decoration: none;
}
.pagina__indice a:hover { color: var(--verde-700); }
.pagina__revisao {
  padding: 1rem 1.2rem;
  background: var(--areia);
  border-radius: var(--raio-m);
  font-size: .8rem;
  color: var(--tinta-clara);
}
.pagina__revisao time { display: block; font-weight: 650; color: var(--verde-800); }

/* ---------- 10. Rodapé ---------- */
.rodape {
  margin-top: clamp(2.5rem, 1.5rem + 3vw, 4rem);
  background: linear-gradient(180deg, var(--verde-900), #101f13);
  color: rgba(255, 255, 255, .74);
  font-size: .92rem;
}
.rodape__interno {
  width: min(100% - 2.5rem, var(--envelope));
  margin-inline: auto;
  display: grid;
  grid-template-columns: 1.5fr 1fr 1fr 1fr;
  gap: 2.4rem;
  padding: clamp(2.6rem, 2rem + 2vw, 4rem) 0 2.4rem;
}
.rodape__marca .marca__texto strong { color: #fff; font-size: 1.3rem; }
.rodape__marca .marca__texto span { color: var(--verde-brilho); }
.rodape__marca p { margin-top: 1rem; font-size: .89rem; line-height: 1.6; }
.rodape__revisao { font-size: .82rem; color: rgba(255, 255, 255, .55); }
.rodape__revisao time { color: var(--verde-brilho); }

.rodape__coluna h2 {
  font-family: var(--fonte-texto);
  font-size: .74rem;
  font-weight: 700;
  letter-spacing: .11em;
  text-transform: uppercase;
  color: var(--verde-brilho);
  margin-bottom: .9rem;
}
.rodape__coluna ul { list-style: none; margin: 0; padding: 0; }
.rodape__coluna li { margin-bottom: .45rem; }
.rodape a { color: rgba(255, 255, 255, .78); text-decoration: none; }
.rodape a:hover { color: #fff; text-decoration: underline; }

.rodape__base {
  border-top: 1px solid rgba(255, 255, 255, .12);
}
.rodape__base > * {
  width: min(100% - 2.5rem, var(--envelope));
  margin-inline: auto;
}
.rodape__base p {
  padding: 1.4rem 0 0;
  font-size: .82rem;
  line-height: 1.6;
  color: rgba(255, 255, 255, .55);
  max-width: 90ch;
}
.rodape__assinatura { padding-bottom: 2rem; }

/* ---------- 11. Responsivo ---------- */
@media (max-width: 1080px) {
  .abertura__grade,
  .vitrine__grade,
  .projeto__grade,
  .faixa-seguranca__grade,
  .revisoes__grade { grid-template-columns: minmax(0, 1fr); }
  .abertura__visual { max-width: 34rem; }
  /* Em coluna unica o card e a etiqueta sairiam para fora e seriam cortados pela abertura. */
  .ficha-flutuante { position: static; width: auto; margin-top: 1rem; }
  .etiqueta-flutuante { display: none; }
  .abertura__cena { transform: none; }
  .catalogo, .projeto__corpo, .pagina { grid-template-columns: minmax(0, 1fr); }
  .catalogo__lado, .sumario, .pagina__lado { position: static; }
  .catalogo__lado { order: -1; }
  .faceta--extensa ul { max-height: none; }
  .grade-cards--tres, .grade-cards--quatro { grid-template-columns: repeat(auto-fill, minmax(14.5rem, 1fr)); }
  .mosaico { grid-template-columns: repeat(3, 1fr); }
  .mosaico__item--grande { grid-column: span 1; min-height: 11rem; }
  .rodape__interno { grid-template-columns: 1fr 1fr; }
  .cabeca-secao--com-capa .cabeca-secao__grade { grid-template-columns: minmax(0, 1fr); }
  .cabeca-secao__capa { max-width: 26rem; }
}

@media (max-width: 860px) {
  .menu-botao { display: inline-flex; }
  .navegacao {
    display: none;
    position: absolute;
    left: 0; right: 0; top: 100%;
    flex-direction: column;
    align-items: stretch;
    gap: 1.2rem;
    padding: 1.3rem clamp(1.25rem, 4vw, 2rem) 1.7rem;
    background: var(--creme);
    border-bottom: 1px solid var(--borda);
    box-shadow: var(--sombra-media);
  }
  .navegacao[data-aberto="sim"] { display: flex; }
  .navegacao ul { flex-direction: column; align-items: stretch; gap: 0; }
  .navegacao li + li { border-top: 1px solid var(--borda); }
  .navegacao a { padding: .75rem 0; font-size: 1rem; }
  .navegacao a::after { display: none; }
  .busca-topo label {
    display: block;
    font-size: .74rem;
    font-weight: 700;
    letter-spacing: .09em;
    text-transform: uppercase;
    color: var(--tinta-clara);
    margin-bottom: .45rem;
  }
  .busca-topo input { width: 100%; }
  .topo { position: static; }
  html { scroll-padding-top: 1rem; }
  .sumario, .catalogo__lado { top: auto; }
  .organizacao__grade { grid-template-columns: minmax(0, 1fr); }
  .pilar, .pilar--largo, .pilar--destaque { grid-column: span 1; }
  .pilar--largo { grid-template-columns: minmax(0, 1fr); }
  .ficha { grid-template-columns: minmax(0, 1fr); }
  .vitrine__dados { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 640px) {
  body { font-size: 1.02rem; }
  .envelope, .topo__interno, .rodape__interno, .rodape__base > * { width: min(100% - 1.8rem, var(--envelope)); }
  .busca-grande__campo { flex-direction: column; border-radius: var(--raio-g); }
  .busca-grande input { text-align: center; }
  .numeros { gap: 1.4rem; }
  .numeros dd { font-size: 2rem; }
  .mosaico { grid-template-columns: repeat(2, 1fr); }
  .grade-cards, .grade-cards--tres, .grade-cards--quatro,
  .grade-categorias { grid-template-columns: minmax(0, 1fr); }
  .rodape__interno { grid-template-columns: minmax(0, 1fr); gap: 1.8rem; }
  .etapas > li { padding-left: 2.9rem; }
  .etapas > li::before { width: 2rem; height: 2rem; font-size: 1rem; }
  .etapas > li::after { left: 1rem; top: 2.3rem; }
  .card__dados { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .tabela-alternativas, .tabela-medidas { font-size: .86rem; }
  .tabela-alternativas th, .tabela-alternativas td { padding: .6rem .7rem; }
}

@media print {
  .topo, .rodape, .sumario, .filtros, .catalogo__lado, .paginacao, .trilho { display: none; }
  body { background: #fff; font-size: 11pt; }
  .projeto__abertura, .cabeca-secao { background: #fff; border: 0; }
  .texto { max-width: none; }
  a { text-decoration: none; color: inherit; }
}







/* ---------- 12. Ajustes finos ---------- */
.sumario a[aria-current] { color: var(--verde-800); font-weight: 650; }
.sumario a[aria-current]::before { color: var(--verde-700); }
.texto--pagina table { margin: 1.4rem 0; }
.pagina__indice a[aria-current] { color: var(--verde-800); font-weight: 650; }