/* Ajustes pontuais do feedback; mantém as regras de doação existentes. */
#numeros .section-head--split > div:last-child { align-self: end; }
#numeros .section-head--split > div:last-child .section-intro { margin-bottom: 0 !important; }
#antes-depois .before-after-static {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 34px 42px;
}
#antes-depois .before-after-static figure { overflow: visible; position: relative; display: flex; flex-direction: column; border-radius: 12px; container-type: inline-size; }
/* Árvore de referência, em fração da foto: centro (x, y) e diâmetro (d, sobre a largura).
   A foto de 2022 é 4:3 e aparece em 16:9 alinhada pelo topo, por isso o y dela é 0,160 x 4/3. */
#antes-depois .before-after-static figure:nth-child(1) { grid-area: 1 / 1; --tree-x: .082; --tree-y: .213; --tree-d: .23; }
#antes-depois .before-after-static figure:nth-child(2) { grid-area: 1 / 2; --tree-x: .353; --tree-y: .268; --tree-d: .15; }
#antes-depois .before-after-static figure:nth-child(3) { grid-area: 2 / 2; --tree-x: .287; --tree-y: .258; --tree-d: .155; }
#antes-depois .before-after-static figure:nth-child(4) { grid-area: 2 / 1; --tree-x: .326; --tree-y: .375; --tree-d: .145; }
#antes-depois .before-after-static img {
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  object-position: center top;
  border-radius: 0 0 12px 12px;
}
#antes-depois .before-after-static figcaption {
  order: -1;
  width: 100%;
  height: 54px;
  min-height: 54px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  padding: 10px 16px;
  border-radius: 12px 12px 0 0;
  background: var(--white);
  color: var(--bjf-green);
}
#antes-depois .before-after-static figcaption::after {
  content: "Árvore de referência";
  margin-left: auto;
  color: var(--muted);
  font-size: .72rem;
  font-weight: 600;
}
#antes-depois .before-after-static figure::before {
  content: "";
  position: absolute;
  z-index: 2;
  /* 54px = faixa do ano; 56.25cqw = altura da foto 16:9 */
  --d: calc(100cqw * var(--tree-d));
  --top: calc(54px + 56.25cqw * var(--tree-y) - var(--d) / 2);
  --left: calc(100cqw * var(--tree-x) - var(--d) / 2);
  top: var(--top);
  left: var(--left);
  width: var(--d);
  height: var(--d);
  /* o círculo folgado pode passar da borda da foto: corta no limite dela */
  clip-path: inset(
    max(0px, 54px - var(--top))
    max(0px, var(--left) + var(--d) - 100cqw)
    max(0px, var(--top) + var(--d) - 54px - 56.25cqw)
    max(0px, 0px - var(--left))
  );
  border: 3px dotted #00523c;
  border-radius: 50%;
  background: rgba(0,82,60,.24);
  pointer-events: none;
}
#antes-depois .before-after-static figure:nth-child(2)::after {
  content: "";
  position: absolute;
  width: 0;
  height: 34px;
  bottom: -34px;
  left: 50%;
  border-left: 3px dotted #00523c;
}
#antes-depois .before-after-static figure:nth-child(1)::after,
#antes-depois .before-after-static figure:nth-child(3)::after {
  content: "";
  position: absolute;
  width: 42px;
  right: -42px;
  top: 50%;
  border-top: 3px dotted #00523c;
}
#antes-depois .before-after-static figure:nth-child(3)::after {
  right: auto;
  left: -42px;
}

#sobre .about-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  grid-template-areas: "video heading" "text actions";
  gap: 22px 32px;
  align-items: start;
}
#sobre .about-layout > .about-layout__media {
  grid-area: video;
  min-width: 0;
}
#sobre .about-layout__media > .eyebrow { margin: 0 0 12px; }
#sobre .about-layout__media > .video-box {
  width: 100%;
  height: auto;
  min-height: 0;
  aspect-ratio: 16 / 9;
  border: 0;
}
#sobre .video-box > img {
  object-fit: cover !important;
}
#sobre .about-copy { min-width: 0; width: 100%; }
#sobre .about-copy h2 { max-width: none; width: 100%; }
#sobre .about-layout__heading { grid-area: heading; align-self: start; }
#sobre .about-layout__heading h2 { margin: 0; }
#sobre .about-video-link { display: none; }
#sobre .about-layout > .section-intro { grid-area: text; margin: 0; }
#sobre .about-layout__actions { grid-area: actions; align-self: start; }
#sobre .about-layout__actions .about-cta { margin: 0; }

#processo .journey-stage__image {
  overflow: hidden;
  aspect-ratio: auto;
  height: auto;
  max-height: 520px;
  width: 100%;
  min-height: 0;
  align-self: stretch;
  border: 0;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}
/* Enquadramento das fotos do ciclo (out/2026). */
#processo #jpanel-1 .journey-stage__image { background-position: 50% 35%; }
#processo #jpanel-2 .journey-stage__image { background-position: 72% 50%; }
#processo #jpanel-3 .journey-stage__image { background-position: 60% 60%; }
#processo #jpanel-4 .journey-stage__image { background-position: 50% 45%; }
#processo .journey-panel:has(.journey-step[data-step="01"][aria-expanded="true"]) .journey-stage__image { background-position: 50% 35%; }
#processo .journey-panel:has(.journey-step[data-step="02"][aria-expanded="true"]) .journey-stage__image { background-position: 58% 50%; }
#processo .journey-panel:has(.journey-step[data-step="03"][aria-expanded="true"]) .journey-stage__image { background-position: 45% 30%; }
#processo .journey-panel:has(.journey-step[data-step="04"][aria-expanded="true"]) .journey-stage__image { background-position: 55% 62%; }
#processo .journey-panel:has(.journey-step[data-step="05"][aria-expanded="true"]) .journey-stage__image { background-position: 72% 50%; }
#processo .journey-panel:has(.journey-step[data-step="06"][aria-expanded="true"]) .journey-stage__image { background-position: 50% 50%; }
#processo .journey-panel:has(.journey-step[data-step="07"][aria-expanded="true"]) .journey-stage__image { background-position: 50% 70%; }
#processo .journey-panel:has(.journey-step[data-step="08"][aria-expanded="true"]) .journey-stage__image { background-position: 42% 50%; }
#processo .journey-panel:has(.journey-step[data-step="09"][aria-expanded="true"]) .journey-stage__image { background-position: 50% 75%; }
#processo .journey-panel:has(.journey-step[data-step="10"][aria-expanded="true"]) .journey-stage__image { background-position: 55% 50%; }
#processo .journey-panel:has(.journey-step[data-step="11"][aria-expanded="true"]) .journey-stage__image { background-position: 45% 40%; }
#processo .journey-panel:has(.journey-step[data-step="12"][aria-expanded="true"]) .journey-stage__image { background-position: 55% 50%; }
#processo .journey-panel:has(.journey-step[data-step="13"][aria-expanded="true"]) .journey-stage__image { background-position: 12% 70%; }
#processo .journey-panel:has(.journey-step[data-step="14"][aria-expanded="true"]) .journey-stage__image { background-position: 60% 60%; }
#processo .journey-panel:has(.journey-step[data-step="15"][aria-expanded="true"]) .journey-stage__image { background-position: 50% 55%; }
#processo .journey-panel:has(.journey-step[data-step="16"][aria-expanded="true"]) .journey-stage__image { background-position: 50% 45%; }
#processo .journey-panel:has(.journey-step[data-step="17"][aria-expanded="true"]) .journey-stage__image { background-position: 50% 50%; }
#processo .journey-panels { min-height: 0; }
#processo .journey-station__node,
#processo .journey-station.is-active .journey-station__node {
  background: var(--paper);
  background-image: none;
  color: var(--bjf-green);
}
#processo .journey-station__node svg { width: 27px; height: 27px; }
#processo .journey-station.is-active .journey-station__node { border-color: var(--bjf-green); }
#processo .journey-step { grid-template-columns: 30px minmax(0, 1fr); }
#processo .journey-step__detail {
  display: block;
  grid-column: 1 / -1;
  width: auto;
  height: auto;
  min-width: 0;
  padding-top: 8px;
  border-top: 1px solid var(--line);
  border-right: 0;
  border-bottom: 0;
  border-left: 0;
  border-radius: 0;
  background: none;
  color: var(--muted);
  font-size: .85rem;
  font-weight: 400;
  line-height: 1.45;
  overflow-wrap: break-word;
}
#processo .journey-stepbox { display: none !important; }
#processo .journey-stepbox {
  position: static !important;
  inset: auto !important;
  display: block;
  grid-column: 1 / -1;
  width: 100%;
  margin: 4px 0 10px;
  padding: 16px 18px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--paper-soft);
}
#processo .journey-stepbox[hidden] { display: none !important; }
#processo .journey-stepbox__num { display: none; }
#processo .journey-stepbox__close { top: 8px !important; right: 8px !important; }
#processo .journey-stepbox__body { padding-right: 22px; }
#processo .journey-support {
  margin-top: 20px;
  padding: 18px 22px !important;
  gap: 16px !important;
  align-items: center !important;
}
#processo .journey-support > div:last-child {
  padding: 12px 20px !important;
}

#mapa .google-map-frame.feedback-map--google {
  min-height: 600px;
  height: auto;
  background: #d1e9df;
}
#mapa .google-map-panel { display: flex; flex-direction: column; min-width: 0; }
#mapa .google-map-frame.feedback-map--google { flex: 1; }
#mapa .mapa-legenda { display: none; }
#mapa .feedback-map--google iframe {
  opacity: 1;
  filter: none;
}
#mapa .google-map-info { min-height: 600px; }
#mapa .feedback-map__guide {
  position: absolute;
  z-index: 2;
  left: 16px;
  bottom: 16px;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 5px 11px;
  border-radius: 12px;
  background: rgba(24,49,44,.95);
  color: white;
  font-size: .78rem;
  font-weight: 750;
  pointer-events: none;
}
#mapa .feedback-map__guide svg { width: 24px; height: 50px; }
#mapa .feedback-map__guide small { font-size: .68rem; font-weight: 400; }
#mapa .feedback-map__inset {
  position: absolute;
  z-index: 2;
  right: 14px;
  top: 14px;
  width: 150px;
  height: 122px;
  object-fit: contain;
  border: 2px solid #fff;
  border-radius: 10px;
  background: #d5ebe3;
  box-shadow: 0 3px 14px rgba(0,0,0,.22);
  pointer-events: none;
}
#mapa .feedback-map--route iframe,
#mapa .feedback-map--route .feedback-map__guide,
#mapa .feedback-map--route .feedback-map__inset { display: none; }
#mapa .feedback-map__route {
  position: absolute;
  inset: 0;
  overflow: hidden;
  background: #dce8dc;
  cursor: grab;
  touch-action: none;
}
#mapa .feedback-map__route:active { cursor: grabbing; }
#mapa .feedback-map__route[hidden] { display: none; }
#mapa .feedback-map__tiles,
#mapa .feedback-map__lines,
#mapa .feedback-map__markers { position: absolute; inset: 0; }
#mapa .feedback-map__tiles img { position: absolute; width: 256px; height: 256px; max-width: none; pointer-events: none; }
#mapa .feedback-map__tiles::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0,82,60,.26);
  pointer-events: none;
}
#mapa .feedback-map__lines { width: 100%; height: 100%; pointer-events: none; }
#mapa .feedback-map__markers { pointer-events: none; }
#mapa .feedback-map__marker {
  position: absolute;
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  padding: 0;
  transform: translate(-50%, -50%);
  border: 2px solid #00523c;
  border-radius: 50%;
  background: #ffdf50;
  color: #18312c;
  font-size: .7rem;
  font-weight: 800;
  box-shadow: 0 2px 6px rgba(0,0,0,.35);
  cursor: pointer;
  pointer-events: auto;
}
#mapa .feedback-map__marker.is-active { outline: 3px solid #fff; }
#mapa .feedback-map__marker--cluster {
  width: 56px;
  height: 36px;
  border-radius: 18px;
  white-space: nowrap;
}
#mapa .feedback-map__switch {
  position: absolute;
  z-index: 5;
  top: 12px;
  left: 12px;
  display: flex;
  gap: 3px;
  padding: 4px;
  border-radius: 10px;
  background: rgba(255,255,255,.96);
  box-shadow: 0 2px 10px rgba(0,0,0,.2);
}
#mapa .feedback-map__switch button,
#mapa .feedback-map__controls button {
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: #18312c;
  cursor: pointer;
  font-weight: 700;
}
#mapa .feedback-map__switch button { padding: 8px 11px; font-size: .79rem; }
#mapa .feedback-map__switch button[aria-pressed="true"] { background: #00523c; color: #fff; }
#mapa .feedback-map__controls {
  position: absolute;
  z-index: 4;
  right: 12px;
  top: 70px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
#mapa .feedback-map__controls button {
  min-width: 38px;
  min-height: 38px;
  background: #fff;
  box-shadow: 0 2px 8px rgba(0,0,0,.22);
}
#mapa .feedback-map__attribution {
  position: absolute;
  z-index: 4;
  right: 0;
  bottom: 0;
  padding: 3px 6px;
  background: rgba(255,255,255,.9);
  color: #18312c;
  font-size: .68rem;
}
#mapa .feedback-map__attribution a { color: #00523c; }
#mapa .feedback-map__note {
  position: absolute;
  z-index: 4;
  left: 12px;
  top: 64px;
  max-width: min(430px, 70%);
  padding: 9px 12px;
  border-radius: 9px;
  background: rgba(24,49,44,.95);
  color: #fff;
  font-size: .76rem;
  line-height: 1.35;
  pointer-events: none;
}
#mapa .feedback-map__switch button:focus-visible,
#mapa .feedback-map__controls button:focus-visible,
#mapa .feedback-map__marker:focus-visible { outline: 3px solid #ffdf50; outline-offset: 2px; }
#mapa .location-option-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  margin-bottom: 8px;
}
#mapa .location-option-row .location-option { width: 100%; margin: 0; }
#mapa .location-media-link {
  color: #d6f3d9;
  font-size: .78rem;
  font-weight: 700;
  white-space: nowrap;
  text-underline-offset: 3px;
}
#mapa .immersive__phase { display: none; }
#mapa .immersive__grid.feedback-city-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}
#mapa .feedback-city {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 18px;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 22px;
  background: rgba(255,255,255,.05);
}
#mapa .feedback-city__image {
  width: 100%;
  height: 245px;
  display: block;
  object-fit: cover;
  border-radius: 14px;
}
#mapa .feedback-city__copy h4 { margin: 0 0 10px; font-size: 1.4rem; }
#mapa .feedback-city__copy p { color: #d1d9d3; }
#mapa .feedback-city__copy a { margin-top: 6px; }
#mapa .feedback-city__copy a {
  display: inline-flex;
  min-height: 46px;
  align-items: center;
  padding: 10px 17px;
  border-radius: 8px;
  background: #ffdf50;
  color: #18312c;
  font-weight: 800;
  text-decoration: none;
}
#mapa .feedback-city__copy a:focus-visible,
#mapa .location-media-link:focus-visible { outline: 3px solid #ffdf50; outline-offset: 3px; }
@media (max-width: 900px) {
  #numeros .section-head--split > div:last-child { align-self: start; }
  #processo .journey-stage__image { height: auto; max-height: none; aspect-ratio: 3 / 4; align-self: start; }
  #sobre .about-layout {
    grid-template-columns: 1fr;
    grid-template-areas: "heading" "video" "text" "actions";
  }
  #mapa .google-map-frame.feedback-map--google,
  #mapa .google-map-info { min-height: 480px; height: 480px; }
}
@media (max-width: 600px) {
#antes-depois .before-after-static figcaption::after { font-size: .67rem; }
#antes-depois .before-after-static { grid-template-columns: 1fr; }
#antes-depois .before-after-static figure:nth-child(n) { grid-area: auto; }
#antes-depois .before-after-static figure:nth-child(n)::after {
  content: "";
  position: absolute;
  width: 0;
  height: 34px;
  top: auto;
  bottom: -34px;
  left: 50%;
  right: auto;
  border-top: 0;
  border-left: 3px dotted #00523c;
}
#antes-depois .before-after-static figure:last-child::after { display: none; }
#mapa .immersive__grid.feedback-city-grid { grid-template-columns: 1fr; }
#mapa .google-map-frame.feedback-map--google,
#mapa .google-map-info { min-height: 420px; height: auto; }
#mapa .google-map-frame.feedback-map--google { height: 420px; }
  #mapa .feedback-city__image { height: 220px; }
  #mapa .feedback-map__switch button { padding: 7px 8px; font-size: .72rem; }
  #mapa .feedback-map__note { max-width: 75%; font-size: .68rem; }
  #mapa .feedback-map__attribution { bottom: 92px; }
  #mapa .location-option-row { grid-template-columns: minmax(0, 1fr) auto; gap: 5px; }
  #mapa .location-media-link { font-size: .7rem; }
  #processo .journey-support { flex-direction: column !important; padding: 22px !important; }
}

/* Galeria das localidades: estilos restritos ao pop-up, sem alterar os cards. */
.city-gallery {
  width: min(920px, calc(100vw - 32px));
  max-width: none;
  max-height: calc(100dvh - 32px);
  padding: 24px;
  border: 1px solid #83c996;
  border-radius: 20px;
  background: #0f221e;
  color: #fff;
  box-sizing: border-box;
  overflow: auto;
}
.city-gallery::backdrop { background: rgba(0, 0, 0, .8); }
.city-gallery__header { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 16px; }
.city-gallery__header h2 { margin: 0; color: #fff; font: inherit; font-size: clamp(1.1rem, 3vw, 1.5rem); font-weight: 700; }
.city-gallery button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  border: 1px solid #83c996;
  border-radius: 50%;
  background: transparent;
  color: #fff;
  font: inherit;
  font-size: 1.4rem;
  cursor: pointer;
}
.city-gallery button:hover { background: #ffdf50; border-color: #ffdf50; color: #0f221e; }
.city-gallery button:focus-visible { outline: 3px solid #ffdf50; outline-offset: 3px; }
.city-gallery__media { display: flex; align-items: center; justify-content: center; height: min(54dvh, 520px); min-height: 160px; background: #000; border-radius: 10px; overflow: hidden; }
.city-gallery__media img, .city-gallery__media video { display: block; width: 100%; height: 100%; object-fit: contain; }
.city-gallery__caption { margin: 14px 0; text-align: center; color: #d1d9d3; }
.city-gallery__controls { display: flex; justify-content: center; align-items: center; gap: 24px; }
.city-gallery__error { padding: 24px; text-align: center; }
@media (max-width: 600px) {
  .city-gallery { padding: 16px; width: calc(100vw - 20px); max-height: calc(100dvh - 20px); border-radius: 14px; }
  .city-gallery__caption { font-size: .9rem; }
}
/* Período de referência dos números de impacto (out/2026). */
#numeros .stats-note {
  margin: 18px 0 0;
  color: var(--muted);
  font-size: .85rem;
  text-align: center;
}