/* Página inicial (protótipo) — POP-home.md.
   Pixel perfect (R-FE-13): toda distância usa a escala de 8 px abaixo; todas as
   seções usam o mesmo contêiner e o mesmo espaçamento vertical. */
:root {
  --e-1: 8px;  --e-2: 16px; --e-3: 24px; --e-4: 32px; --e-5: 40px; --e-6: 48px;
  --e-7: 56px; --e-8: 64px; --e-9: 72px; --e-10: 80px; --e-12: 96px;
  --largura: 1200px;
  --calha: var(--e-6);
  --secao-y: var(--e-12);
  --vinho: #7a1020; --vinho-2: #95172b; --ouro: #fbbf0f; --creme: #fff8e6; --areia: #f3ead8;
  --tinta: #2a1a1c; --texto: #4f3f41; --suave: #8a7a7c; --linha: #f1e6dc;
}
@media (max-width: 899px) { :root { --calha: var(--e-3); --secao-y: var(--e-8); } }

section[id], footer[id] { scroll-margin-top: var(--e-8); } /* desconta a barra fixa */
.container { width: 100%; max-width: calc(var(--largura) + 2 * var(--calha)); margin-inline: auto; padding-inline: var(--calha); box-sizing: border-box; }

/* Cabeçalho de seção: rótulo → 16 → título → 24 → texto */
.secao-rotulo {
  display: inline-block;
  font: 700 12px/16px Roboto, sans-serif; letter-spacing: .14em; text-transform: uppercase;
  color: var(--vinho); background: var(--ouro); padding: var(--e-1) var(--e-2); border-radius: 999px;
}
.secao-titulo {
  font-family: "Cunia AMISCIM", Impact, sans-serif; font-weight: 400;
  font-size: clamp(32px, 4.2vw, 48px); line-height: 1.1; letter-spacing: .01em;
  color: var(--vinho); margin: var(--e-2) 0 var(--e-3);
}
.texto-corpo { color: var(--texto); font-size: 17px; line-height: 28px; margin: 0 0 var(--e-2); }
.btn-redondo {
  display: inline-flex; align-items: center; gap: var(--e-1);
  height: var(--e-7); padding: 0 var(--e-4); border-radius: 999px;
  background: var(--vinho); color: #fff; text-decoration: none;
  font: 700 15px/1 Roboto, sans-serif; letter-spacing: .02em;
  box-shadow: 0 8px 24px rgba(122, 16, 32, .25);
  transition: background .2s, transform .2s, box-shadow .2s;
}
.btn-redondo:hover { background: var(--vinho-2); transform: translateY(-2px); box-shadow: 0 12px 24px rgba(122, 16, 32, .3); }
.btn-redondo:focus-visible { outline: 3px solid var(--ouro); outline-offset: 3px; }
.btn-redondo svg { width: var(--e-3); height: var(--e-3); fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }

/* ============ Redes sociais ============ */
.redes { display: flex; gap: var(--e-1); margin: 0; padding: 0; list-style: none; }
.redes__link {
  display: grid; place-items: center; width: var(--e-5); height: var(--e-5); border-radius: 50%;
  color: var(--vinho); background: rgba(122, 16, 32, .08); transition: background .2s, color .2s, transform .2s;
}
.redes__link svg { width: 20px; height: 20px; }
.redes__link:hover { background: var(--vinho); color: #fff; transform: translateY(-2px); }
.redes__link:focus-visible { outline: 3px solid var(--vinho); outline-offset: 2px; }
.redes__link.is-pendente { opacity: .4; cursor: not-allowed; }
.redes__link.is-pendente:hover { background: rgba(122, 16, 32, .08); color: var(--vinho); transform: none; }
.redes--claras .redes__link { color: #fff; background: rgba(255, 255, 255, .12); }
.redes--claras .redes__link:hover { background: var(--ouro); color: var(--vinho); }
.redes--claras .redes__link.is-pendente:hover { background: rgba(255, 255, 255, .12); color: #fff; }

/* ============ Faixa de parceiros ============ */
.parceiros { --altura-logo: 56px; background: #fff; padding-block: var(--e-5); border-bottom: 1px solid var(--linha); }
.parceiros[hidden] { display: none; }
.parceiros__titulo {
  margin: 0 0 var(--e-3); text-align: center;
  font: 700 13px/16px Roboto, sans-serif; letter-spacing: .16em; text-transform: uppercase; color: var(--vinho);
}
.parceiros__janela {
  overflow: hidden;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
          mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
}
.parceiros__trilho { display: flex; width: max-content; will-change: transform; }
.parceiros__grupo {
  display: flex; align-items: center; flex: none;
  gap: calc(var(--altura-logo) * 1.1); padding: 0 calc(var(--altura-logo) * .55);
  margin: 0; list-style: none;
}
.parceiros__item a { display: block; border-radius: 6px; }
.parceiros__item a:focus-visible { outline: 3px solid var(--ouro); outline-offset: 4px; }
/* Mesma altura para todas; a largura segue a proporção de cada logo. */
.parceiros__item img { display: block; height: var(--altura-logo); width: auto; max-width: none; user-select: none; }
.parceiros.is-parada .parceiros__trilho { width: auto; justify-content: center; }
.parceiros.is-parada .parceiros__grupo { flex-wrap: wrap; justify-content: center; row-gap: var(--e-3); }
.parceiros.is-parada .parceiros__grupo[aria-hidden] { display: none; }

/* ============ Quem Somos + Palavra do Presidente (sem caixa) ============ */
.quem { position: relative; overflow: hidden; background: var(--creme); min-height: calc(100vh - var(--topo, 0px)); display: flex; align-items: center; padding-block: var(--secao-y); box-sizing: border-box; }
.quem__grade { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: var(--e-10); align-items: center; }
.quem__resumo .btn-redondo { margin-top: var(--e-2); }
.quem__presidente { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--e-5); align-items: center; }
.quem__foto { position: relative; margin: 0; }
.quem__foto img { width: 100%; aspect-ratio: 679 / 969; object-fit: cover; object-position: 50% 30%; max-height: calc(100vh - var(--topo, 0px) - var(--e-12)); display: block; border-radius: var(--e-3); }
.quem__foto::after { /* moldura dourada deslocada */
  content: ""; position: absolute; inset: var(--e-2) calc(-1 * var(--e-2)) calc(-1 * var(--e-2)) var(--e-2);
  border: 3px solid var(--ouro); border-radius: var(--e-3); z-index: -1;
}
.quem__foto { isolation: isolate; }
.quem__palavra { min-width: 0; }
.quem__palavra .secao-rotulo { margin-bottom: var(--e-2); }
.quem__janela {
  position: relative; height: 336px; overflow: hidden;
  -webkit-mask-image: linear-gradient(transparent, #000 var(--e-4), #000 calc(100% - var(--e-6)), transparent);
          mask-image: linear-gradient(transparent, #000 var(--e-4), #000 calc(100% - var(--e-6)), transparent);
}
.quem__texto { padding-block: var(--e-3) var(--e-6); will-change: transform; }
.quem__texto p { font-size: 17px; line-height: 28px; color: var(--tinta); margin: 0 0 var(--e-2); }
.quem__texto p:first-child::first-letter {
  float: left; font: 400 64px/56px "Cunia AMISCIM", Impact, sans-serif; color: var(--vinho); margin: var(--e-1) var(--e-1) 0 0;
}
.quem__assinatura { margin-top: var(--e-2); }
.quem__assinatura-arte { width: 288px; max-width: 100%; height: var(--e-10); }
.quem__assinatura-arte svg { width: 100%; height: 100%; display: block; }
.quem__assinatura-arte path { fill: var(--vinho); stroke: var(--vinho); stroke-width: .45; }
.quem__cargo { display: block; font: 700 13px/16px Roboto, sans-serif; letter-spacing: .08em; text-transform: uppercase; color: var(--vinho); margin-top: var(--e-1); }
.quem.is-estatica .quem__janela { height: auto; -webkit-mask-image: none; mask-image: none; }
@media (max-width: 1100px) { .quem__grade { gap: var(--e-6); } .quem__presidente { gap: var(--e-4); } }
@media (max-width: 899px) {
  .quem { min-height: 0; display: block; }
  .quem__grade { grid-template-columns: 1fr; }
  .quem__presidente { grid-template-columns: 1fr; }
  .quem__foto { max-width: 360px; }
  .quem__janela { height: auto; -webkit-mask-image: none; mask-image: none; }
}

/* ============ Agenda 2030 / ODS ============ */
.ods { background: #fff; padding-block: var(--secao-y); }
.ods__intro { max-width: 768px; margin: 0 auto var(--e-6); text-align: center; }
.ods__intro .texto-corpo { margin: 0; }
.ods__grade {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, .72fr);
  gap: var(--e-2); align-items: center;
}
.ods__grande {
  --cor: #E5243B;
  aspect-ratio: 1; border-radius: var(--e-3); overflow: hidden;
  background: var(--cor); color: #fff;
  transition: background-color .45s ease;
  box-shadow: 0 16px 40px rgba(0, 0, 0, .14);
}
.ods__grande.is-claro { color: #3a2a00; }
.ods__grande-conteudo { height: 100%; box-sizing: border-box; display: flex; flex-direction: column; justify-content: space-between; padding: var(--e-4); }
.ods__grande-topo { display: flex; justify-content: space-between; align-items: flex-start; }
.ods__grande-num { font: 700 clamp(56px, 7vw, 88px)/.85 Roboto, sans-serif; letter-spacing: -.02em; }
.ods__icone { width: clamp(72px, 9vw, 112px); height: auto; aspect-ratio: 1; fill: none; stroke: currentColor; stroke-width: 3.2; stroke-linecap: round; stroke-linejoin: round; }
.ods__rotulo { font: 700 12px/16px Roboto, sans-serif; letter-spacing: .14em; opacity: .85; }
.ods__texto h3 { font: 700 clamp(20px, 2.2vw, 28px)/1.15 Roboto, sans-serif; margin: var(--e-1) 0; text-transform: uppercase; }
.ods__texto p { font-size: 15px; line-height: 24px; margin: 0; }
.ods__minis { display: grid; grid-template-columns: repeat(4, 1fr); grid-template-rows: repeat(4, 1fr); gap: var(--e-1); aspect-ratio: 1; }
.ods__mini {
  --cor: #999;
  border: 0; border-radius: var(--e-1); cursor: pointer;
  background: var(--cor); color: #fff; overflow: hidden;
  display: flex; flex-direction: column; justify-content: space-between; align-items: flex-start;
  padding: var(--e-1);
  transition: box-shadow .2s, filter .2s;
}
.ods__mini.is-claro { color: #3a2a00; }
.ods__mini:hover { box-shadow: 0 8px 16px rgba(0, 0, 0, .2); filter: brightness(1.06); }
.ods__mini:focus-visible { outline: 3px solid var(--vinho); outline-offset: 2px; }
.ods__mini-num { font: 700 clamp(16px, 1.8vw, 22px)/1 Roboto, sans-serif; }
.ods__mini-icone { align-self: flex-end; width: 46%; height: auto; aspect-ratio: 1; fill: none; stroke: currentColor; stroke-width: 4; stroke-linecap: round; stroke-linejoin: round; }
.ods__selo { display: grid; place-items: center; }
.ods__selo img { width: 100%; max-width: 280px; height: auto; filter: drop-shadow(0 16px 32px rgba(122, 16, 32, .22)); }
.ods__agenda { max-width: 880px; margin: var(--e-6) auto 0; text-align: center; }
.ods__agenda h3 { font: 700 20px/28px Roboto, sans-serif; color: var(--vinho); margin: 0 0 var(--e-1); }
.ods__agenda .texto-corpo { margin: 0; }
@media (max-width: 1000px) {
  .ods__grade { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .ods__selo { grid-column: 1 / -1; }
  .ods__selo img { max-width: 200px; }
}
@media (max-width: 700px) {
  .ods__grade { grid-template-columns: 1fr; }
  .ods__grande { aspect-ratio: auto; min-height: 336px; }
  .ods__grande-conteudo { padding: var(--e-3); min-height: 336px; }
}

/* ============ Timeline (modelo Z.ai) ============ */
.timeline { position: relative; background: var(--creme); padding-block: var(--secao-y); overflow: hidden; }
.timeline > .container, .timeline > .tl__janela { position: relative; z-index: 1; }
/* Mandala do fundo: mesmas medidas da do Quem Somos; gira pelo deslocamento da faixa (timeline.js). */
.tl__fundo { position: absolute; inset: 0; z-index: 0; overflow: hidden; pointer-events: none; }
.tl__mandala { position: absolute; width: 150vh; height: 150vh; right: -60vh; bottom: -70vh; opacity: .7; will-change: transform; filter: drop-shadow(0 0 1px rgba(122, 16, 32, .08)); }
@media (max-width: 899px) { .tl__mandala { width: 120vw; height: 120vw; right: -50vw; bottom: -40vw; } }
.timeline__cabeca { text-align: center; margin-bottom: var(--e-6); }
.timeline__cabeca .secao-titulo { margin-bottom: var(--e-1); }
.timeline__sublinhado { width: var(--e-10); height: 3px; background: #FCB70B; margin: 0 auto var(--e-2); }
.timeline__dica { font: 400 14px/16px Roboto, sans-serif; color: #999; }
.tl__janela { overflow: hidden; cursor: grab; user-select: none; -webkit-user-select: none; touch-action: pan-y; }
.tl__janela.is-arrastando { cursor: grabbing; }
.tl__janela.is-arrastando a { pointer-events: none; }
.tl__trilho { display: flex; width: max-content; will-change: transform; }
.tl__grupo { display: flex; }
.tl__bloco { position: relative; flex: none; overflow: hidden; }
.tl__conteudo {
  position: absolute; left: 0; right: 0; box-sizing: border-box; padding: 10px;
  display: flex; flex-direction: column; align-items: center; gap: 4px;
}
.tl__conteudo--cima { justify-content: flex-end; }
.tl__conteudo--baixo { justify-content: flex-start; }
.tl__img {
  flex: none; border-radius: 25px; border: 1px solid var(--cor); overflow: hidden; display: grid; place-items: center;
  background: linear-gradient(135deg, #d0d0d0 0%, #a8a8a8 40%, #8a8a8a 100%);
}
.tl__img img { width: 100%; height: 100%; object-fit: cover; display: block; pointer-events: none; }
.tl__img img.tl__img--marca { object-fit: contain; padding: var(--e-1); box-sizing: border-box; background: var(--creme); }
.tl__img-vazia { width: 22px; height: 22px; fill: none; stroke: rgba(255, 255, 255, .5); stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.tl__nome {
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
  font: 400 14px/18px Roboto, sans-serif; color: #555; text-decoration: none;
}
.tl__nome:hover { color: var(--cor); text-decoration: underline; text-underline-offset: 2px; }
.tl__nome:focus-visible { outline: 2px solid var(--cor); outline-offset: 2px; border-radius: 2px; }
.tl__nome--destaque { font-weight: 700; font-size: 15px; text-align: center; max-width: 328px; }
.tl__cols { display: flex; gap: 8px; margin-top: 4px; justify-content: center; }
.tl__col { display: flex; flex-direction: column; gap: 5px; width: 160px; flex: none; }
.tl__banda {
  position: absolute; left: 0; right: 0; z-index: 5; background: var(--cor); border-radius: 25px;
  display: grid; place-items: center;
}
.tl__banda span { font: 800 clamp(21px, 2.2vw, 29px)/1 Roboto, sans-serif; color: #fff; letter-spacing: 1px; }
.tl__divisor { position: absolute; right: 0; width: 2px; background: #fff; z-index: 6; }

/* ============ Ciranda ============ */
.ciranda { position: relative; background: var(--areia); overflow: hidden; }
.ciranda__palco {
  position: relative; height: calc(100vh - var(--topo, 0px)); min-height: 560px; box-sizing: border-box;
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: var(--e-8);
}
.ciranda__arte { display: grid; place-items: center; height: 100%; }
.ciranda__arte svg { width: min(100%, calc(100vh - var(--topo, 0px) - var(--e-10))); height: auto; max-height: 100%; }
.ciranda__textos { position: relative; min-height: 336px; }
.ciranda__texto { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: center; }
.ciranda__texto .secao-rotulo { align-self: flex-start; }
.ciranda__texto .texto-corpo { max-width: 520px; margin: 0; }
.ciranda__selo { position: absolute; inset: 0; display: grid; place-items: center; pointer-events: none; }
.ciranda__selo img { width: clamp(200px, 28vw, 336px); height: auto; filter: drop-shadow(0 16px 40px rgba(122, 16, 32, .25)); }
.ciranda.is-estatica .ciranda__palco { height: auto; min-height: 0; padding-block: var(--secao-y); }
.ciranda.is-estatica .ciranda__texto { position: static; margin-bottom: var(--e-4); }
.ciranda.is-estatica .ciranda__selo { position: static; padding-bottom: var(--secao-y); }
@media (max-width: 899px) {
  .ciranda__palco { grid-template-columns: 1fr; grid-template-rows: auto 1fr; align-content: center; gap: var(--e-1); }
  .ciranda__arte { height: auto; }
  .ciranda__arte svg { width: min(78vw, 46vh); }
  .ciranda__textos { min-height: 304px; }
  .ciranda__texto { justify-content: flex-start; }
}

/* ============ Rodapé ============ */
.rodape { background: #5c0c18; color: rgba(255, 255, 255, .85); padding-top: var(--e-10); font-size: 15px; line-height: 24px; }
.rodape a { color: #fff; text-decoration: none; }
.rodape a:hover { color: var(--ouro); text-decoration: underline; text-underline-offset: 3px; }
.rodape a:focus-visible { outline: 2px solid var(--ouro); outline-offset: 2px; border-radius: 2px; }
.rodape__grade { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 2fr) minmax(0, 4fr) minmax(0, 2fr); gap: var(--e-6); padding-bottom: var(--e-8); }
.rodape__marca img { width: 224px; max-width: 100%; height: auto; display: block; filter: brightness(0) invert(1); }
.rodape__marca p { margin: var(--e-3) 0 var(--e-3); max-width: 336px; }
.rodape h2 { font: 700 13px/16px Roboto, sans-serif; letter-spacing: .14em; text-transform: uppercase; color: var(--ouro); margin: 0 0 var(--e-2); }
.rodape ul { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--e-1); }
.rodape ul.redes { display: flex; }
.rodape address { font-style: normal; display: grid; gap: var(--e-1); }
.rodape__presidente { display: grid; gap: 0; padding-bottom: var(--e-1); }
.rodape__presidente small { font: 700 12px/16px Roboto, sans-serif; letter-spacing: .12em; text-transform: uppercase; color: var(--ouro); }
.rodape__presidente strong { font-weight: 700; color: #fff; font-size: 16px; line-height: 24px; }
.rodape__selo img { width: 136px; height: auto; display: block; }
.rodape__base { border-top: 1px solid rgba(255, 255, 255, .14); padding-block: var(--e-3); font-size: 13px; line-height: 16px; color: rgba(255, 255, 255, .65); }
.rodape__base .container { display: flex; flex-wrap: wrap; gap: var(--e-2); justify-content: space-between; align-items: center; }
.rodape__base ul { display: flex; gap: var(--e-3); }
@media (max-width: 1000px) { .rodape__grade { grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px) { .rodape__grade { grid-template-columns: 1fr; gap: var(--e-5); } .rodape { padding-top: var(--e-8); } }

/* ============ Notícias (mosaico 4×3 por grupo) ============ */
.noticias { background: var(--creme); padding-block: var(--secao-y); }
.noticias__cabeca { text-align: center; margin-bottom: var(--e-6); }
.noticias__cabeca .texto-corpo { max-width: 640px; margin: 0 auto; }
.nt__grade {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); grid-template-rows: repeat(3, 208px);
  gap: var(--e-2);
}
.nt__cartao {
  position: relative; display: block; overflow: hidden; border-radius: var(--e-2);
  background: #3a2a2c; color: #fff; text-decoration: none; isolation: isolate;
  box-shadow: 0 8px 24px rgba(122, 16, 32, .1);
}
.nt__cartao img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .6s cubic-bezier(.2, .8, .2, 1); z-index: -2; }
.nt__cartao:hover img { transform: scale(1.06); }
.nt__veu { position: absolute; inset: 0; z-index: -1; background: linear-gradient(to top, rgba(40, 6, 12, .92) 0%, rgba(40, 6, 12, .55) 45%, rgba(40, 6, 12, 0) 75%); }
.nt__info { position: absolute; left: 0; right: 0; bottom: 0; padding: var(--e-2); display: flex; flex-direction: column; gap: var(--e-1); }
.nt__cartao--grande .nt__info { padding: var(--e-3); }
.nt__meta { display: flex; gap: var(--e-1); align-items: center; font: 700 12px/16px Roboto, sans-serif; letter-spacing: .08em; text-transform: uppercase; color: var(--ouro); }
.nt__selo { background: var(--ouro); color: var(--vinho); padding: 0 var(--e-1); border-radius: 999px; }
.nt__titulo { font: 700 16px/22px Roboto, sans-serif; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.nt__cartao--grande .nt__titulo { font-size: 24px; line-height: 32px; }
.nt__resumo { font-size: 15px; line-height: 24px; opacity: .88; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.nt__cartao:focus-visible { outline: 3px solid var(--ouro); outline-offset: 3px; }
.nt__palco { min-height: calc(3 * 208px + 2 * var(--e-2)); }
@media (max-width: 899px) { .nt__palco { min-height: calc(3 * 176px + 2 * var(--e-2)); } }
@media (max-width: 700px) { .nt__palco { min-height: 0; } }
.nt__controles { display: flex; justify-content: center; margin-top: var(--e-4); }
.nt__controles[hidden] { display: none; }
@media (max-width: 899px) { .nt__grade { grid-template-rows: repeat(3, 176px); } .nt__cartao--grande .nt__titulo { font-size: 20px; line-height: 28px; } }
@media (max-width: 700px) {
  .nt__grade { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: none; grid-auto-rows: 176px; }
  .nt__cartao { grid-column: auto !important; grid-row: auto !important; }
  .nt__cartao:first-child { grid-column: 1 / -1 !important; grid-row: span 2 !important; }
  .nt__resumo { display: none; }
}

/* ============ Portfólio (modelo Z.ai: container4) ============ */
.portfolio { background: #fff; padding-block: var(--secao-y); }
.portfolio__cabeca { text-align: center; margin-bottom: var(--e-5); }
.portfolio__cabeca .secao-titulo { margin-bottom: var(--e-1); }
.portfolio__sublinhado { width: var(--e-10); height: 3px; background: #FCB70B; margin: 0 auto var(--e-2); }
.portfolio__cabeca .texto-corpo { max-width: 640px; margin: 0 auto; }
.pf__filtros { display: grid; gap: var(--e-2); margin-bottom: var(--e-5); }
.pf__grupo { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: var(--e-1); }
.pf__grupo-titulo { font: 700 12px/16px Roboto, sans-serif; letter-spacing: .14em; text-transform: uppercase; color: var(--suave); margin-right: var(--e-1); }
.pf__filtro {
  display: inline-flex; align-items: center; gap: var(--e-1); height: var(--e-5); padding: 0 var(--e-2);
  border-radius: 999px; border: 2px solid #333; background: transparent; color: #333; cursor: pointer;
  font: 500 14px/1 Roboto, sans-serif; transition: background .3s, color .3s, border-color .3s;
}
.pf__filtro:hover:not(:disabled) { border-color: var(--vinho); color: var(--vinho); }
.pf__filtro.is-ativo { background: #731800; border-color: #731800; color: #fff; }
.pf__filtro:disabled { opacity: .35; cursor: not-allowed; }
.pf__filtro:focus-visible { outline: 3px solid var(--ouro); outline-offset: 2px; }
.pf__conta { font-size: 12px; opacity: .7; }
.pf__grade { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--e-2); }
.pf__cartao {
  position: relative; display: block; aspect-ratio: 1; overflow: hidden; border-radius: var(--e-1);
  background: linear-gradient(135deg, #FCB70B 0%, #731800 100%); color: #fff; text-decoration: none;
  box-shadow: 0 4px 12px rgba(0, 0, 0, .12); transition: box-shadow .3s; isolation: isolate;
}
.pf__cartao:hover { box-shadow: 0 12px 24px rgba(0, 0, 0, .2); }
.pf__cartao:focus-visible { outline: 3px solid var(--ouro); outline-offset: 3px; }
.pf__cartao img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -1; transition: transform .6s cubic-bezier(.2, .8, .2, 1); }
.pf__cartao:hover img { transform: scale(1.06); }
.pf__info {
  position: absolute; left: 0; right: 0; bottom: 0; padding: var(--e-2);
  display: flex; flex-direction: column; align-items: flex-start; gap: var(--e-1);
  background: linear-gradient(transparent, rgba(0, 0, 0, .75) 45%);
}
.pf__tag { padding: 2px var(--e-1); border-radius: 4px; font: 700 11px/16px Roboto, sans-serif; }
.pf__nome { font: 600 15px/20px Roboto, sans-serif; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.pf__meta { font-size: 12px; line-height: 16px; opacity: .8; }
.pf__vazio { grid-column: 1 / -1; text-align: center; color: var(--suave); padding: var(--e-6) 0; }
.pf__grade.is-entrando .pf__cartao { animation: pf-entra .5s cubic-bezier(.25, .46, .45, .94) var(--atraso, 0s) both; }
@keyframes pf-entra { from { opacity: 0; transform: translateY(24px) scale(.92); } to { opacity: 1; transform: none; } }
.pf__nav { display: flex; justify-content: center; align-items: center; gap: var(--e-2); margin-top: var(--e-4); }
.pf__seta {
  width: var(--e-5); height: var(--e-5); border-radius: 50%; border: 2px solid #731800;
  background: #731800; color: #fff; display: grid; place-items: center; cursor: pointer; transition: opacity .3s, background .3s;
}
.pf__seta svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }
.pf__seta:disabled { background: transparent; color: #731800; opacity: .4; cursor: default; }
.pf__seta:focus-visible, .pf__mais:focus-visible { outline: 3px solid var(--ouro); outline-offset: 2px; }
.pf__mais {
  display: inline-flex; align-items: center; height: var(--e-5); padding: 0 var(--e-3); border-radius: 999px;
  border: 2px solid #731800; background: #FCB70B; color: #731800; font: 600 14px/1 Roboto, sans-serif; text-decoration: none;
}
.pf__pontos { display: flex; justify-content: center; margin-top: var(--e-2); min-height: 10px; }
@media (max-width: 899px) { .pf__grade { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 520px) { .pf__grupo-titulo { width: 100%; text-align: center; margin: 0; } .pf__nome { font-size: 14px; line-height: 18px; } .pf__meta { display: none; } .pf__info { padding: var(--e-1); } }

/* Fundo do Quem Somos: mandala girando + fotos de projetos subindo (R-FE-10) */
.quem__fundo { position: absolute; inset: 0; z-index: 0; overflow: hidden; pointer-events: none; }
.quem__mandala {
  position: absolute; width: 150vh; height: 150vh; right: -60vh; bottom: -70vh;
  opacity: .7; will-change: transform;
  filter: drop-shadow(0 0 1px rgba(122, 16, 32, .08));
}
.quem__foto-fundo {
  position: absolute; top: 100%; aspect-ratio: 4 / 3; object-fit: cover;
  border-radius: var(--e-2); box-shadow: 0 16px 32px rgba(122, 16, 32, .18); will-change: transform;
}
@media (max-width: 899px) { .quem__mandala { width: 120vw; height: 120vw; right: -50vw; bottom: -40vw; } .quem__foto-fundo { display: none; } }
/* Legibilidade: halo creme nos textos enquanto as fotos passam por trás. */
.quem__resumo .texto-corpo, .quem__texto p { text-shadow: 0 0 4px var(--creme), 0 0 10px var(--creme), 0 0 18px var(--creme); }

.nt__fonte { color: #fff; opacity: .85; font-weight: 500; letter-spacing: .04em; }

/* Ciranda de fundo: mesma proporção da mandala de fundo, 70% de transparência (R-FE-8). */
.ciranda__fundo { position: absolute; inset: 0; z-index: 0; overflow: hidden; pointer-events: none; }
.ciranda__fundo-arte { position: absolute; width: 150vh; height: 150vh; right: -60vh; bottom: -70vh; opacity: .3; }
.ciranda__palco { z-index: 1; }
@media (max-width: 899px) { .ciranda__fundo-arte { width: 120vw; height: 120vw; right: -50vw; bottom: -40vw; } }
