/* =========================================================================
   Notícias (noticias.asp) e Fotos (fotos.asp)
   Arquivo só de acréscimos: não altera nenhuma regra de style.css,
   paginas.css ou backgrounds.css. Reaproveita os tokens (--blue, --yellow,
   --f-title...), o cabeçalho, o menu, a busca, as redes e o rodapé de lá.
   ========================================================================= */

.lista-sec { padding: max(36px, calc(80 * var(--u))) 0 max(44px, calc(90 * var(--u))); }
.lista-wrap { position: relative; z-index: 2; width: min(1290px, 100% - 2 * var(--gutter)); margin-inline: auto; }

.lista-h { text-align: center; font-size: clamp(38px, 10vw, 110px); white-space: normal; line-height: .95; }
.lista-sub {
  margin-top: max(10px, calc(22 * var(--u)));
  text-align: center;
  font: 700 clamp(15px, 1.6vw, 22px) / 1.3 var(--f-list);
  letter-spacing: .02em;
  opacity: .9;
}

/* ---------- Notícias: grade de cards (mesmo visual do card da index) ---------- */
.lista-cards {
  display: grid; gap: clamp(18px, 2.4vw, 36px);
  grid-template-columns: 1fr;
  margin-top: clamp(26px, 4vw, 56px);
}
@media (min-width: 600px) { .lista-cards { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 960px) { .lista-cards { grid-template-columns: repeat(3, 1fr); } }
.lista-card > a {
  display: block; height: 100%;
  padding: clamp(8px, .8vw, 10px);
  background: var(--white); color: var(--ink);
  border-radius: clamp(22px, 2.6vw, 40px);
  text-decoration: none;
  transition: transform .35s var(--ease), box-shadow .35s;
}
.lista-card > a:hover, .lista-card > a:focus-visible { transform: translateY(-8px); box-shadow: 0 18px 34px rgb(0 0 60 / .35); }
.lista-card .news-img { border-radius: clamp(16px, 2vw, 32px) clamp(16px, 2vw, 32px) 8px 8px; }
.lista-card :hover > .news-img img, .lista-card a:focus-visible .news-img img { transform: scale(1.07); }
.lista-card .news-title {
  padding: 14px 10px 10px;
  font-size: clamp(16px, 1.45vw, 21px); line-height: 1.25;
  text-align: left; hyphens: manual;
}

/* ---------- Fotos: um álbum por notícia ---------- */
.lista-albuns { display: grid; gap: clamp(34px, 4.5vw, 70px); margin-top: clamp(26px, 4vw, 56px); }
.album-titulo { font: 400 clamp(20px, 2.2vw, 32px) / 1.15 var(--f-text); }
.album-titulo a { color: var(--white); text-decoration: none; background: linear-gradient(var(--yellow), var(--yellow)) 0 100% / 0 3px no-repeat; transition: background-size .35s var(--ease); }
.album-titulo a:hover, .album-titulo a:focus-visible { background-size: 100% 3px; }
.album-credito { margin-top: 6px; font: 600 clamp(13px, 1.1vw, 16px) / 1.3 var(--f-body, sans-serif); opacity: .85; }
.album-fotos {
  display: grid; gap: clamp(10px, 1.4vw, 20px);
  grid-template-columns: repeat(2, 1fr);
  margin-top: clamp(12px, 1.4vw, 20px);
}
@media (min-width: 600px) { .album-fotos { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 960px) { .album-fotos { grid-template-columns: repeat(4, 1fr); } }
.album-foto {
  position: relative; display: block; overflow: hidden;
  aspect-ratio: 4 / 3;
  border: clamp(4px, .5vw, 7px) solid var(--white);
  border-radius: clamp(14px, 1.6vw, 24px);
  background: rgb(255 255 255 / .15);
  cursor: zoom-in;
  transition: transform .3s var(--ease), box-shadow .3s;
}
.album-foto img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s var(--ease); }
/* Lupa que aparece ao passar o mouse */
.album-foto::after {
  content: ""; position: absolute; inset: auto 10px 10px auto;
  width: 38px; height: 38px; border-radius: 50%;
  background: var(--yellow) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='10' cy='10' r='6' fill='none' stroke='%231d1d1b' stroke-width='2.6'/%3E%3Cpath d='m14.5 14.5 5 5M10 7v6M7 10h6' stroke='%231d1d1b' stroke-width='2.6' stroke-linecap='round'/%3E%3C/svg%3E") center / 22px no-repeat;
  opacity: 0; transform: scale(.6);
  transition: opacity .25s, transform .3s var(--ease);
}
.album-foto:hover, .album-foto:focus-visible { transform: translateY(-4px) rotate(-1deg); box-shadow: 0 14px 26px rgb(0 0 60 / .4); }
.album-foto:hover img, .album-foto:focus-visible img { transform: scale(1.08); }
.album-foto:hover::after, .album-foto:focus-visible::after { opacity: 1; transform: none; }

/* ---------- Paginação (mesma marcação da versão ASP) ---------- */
#pages { margin-top: clamp(34px, 5vw, 70px); }
.pagination {
  display: flex; flex-wrap: wrap; justify-content: center; align-items: center;
  gap: clamp(6px, .8vw, 12px);
  margin: 0; padding: 0; list-style: none;
}
.pagination > li { margin: 0 !important; }
.pagination > li > a,
.pagination > li.current,
.pagination > li.nolink {
  display: inline-flex; align-items: center; justify-content: center; gap: .45em;
  min-width: clamp(42px, 4.2vw, 60px); height: clamp(42px, 4.2vw, 60px);
  padding: 0 .7em;
  background: var(--white); color: var(--blue);
  border-radius: 999px;
  box-shadow: 0 4px 0 rgb(0 0 60 / .25);
  font: clamp(17px, 1.7vw, 26px) / 1 var(--f-title);
  text-decoration: none;
  transition: transform .25s var(--ease), box-shadow .25s, background-color .2s;
}
.pagination > li > a:hover, .pagination > li > a:focus-visible {
  transform: translateY(-3px) scale(1.06) rotate(-2deg);
  box-shadow: 0 10px 20px rgb(0 0 60 / .35);
}
/* Página atual: a ASP usa "active" (com link "#") ou "current" (sem link) */
.pagination > li.active > a,
.pagination > li.current {
  background: var(--yellow); color: var(--ink);
  box-shadow: .12em .12em 0 var(--shadow-blue), .2em .2em 0 var(--white);
  transform: scale(1.12);
  pointer-events: none;
}
.pagination > li.nolink { opacity: .45; }
/* Anterior / Próxima */
.pagination > li:first-child:not(.active, .current) > a,
.pagination > li.Ava > a { padding-inline: 1em; background: var(--red); color: var(--white); box-shadow: 0 4px 0 rgb(80 0 0 / .45); }
.fa-long-arrow-left::before { content: "←"; font-style: normal; }
.fa-long-arrow-right::before { content: "→"; font-style: normal; }
.fa { font-style: normal; font-family: system-ui, sans-serif; }
.lista-contagem { margin-top: 14px; text-align: center; font: 700 14px / 1.3 var(--f-list); opacity: .8; }

/* ---------- Foto ampliada (só CSS: o link #fN abre, #aN fecha) ----------
   Cada foto do loop ASP leva o seu .lb-css logo depois da miniatura. */
.lb-css {
  position: fixed; inset: 0; z-index: 1;
  display: none; place-items: center;
  padding: 64px clamp(8px, 7vw, 110px) 20px;
  background: rgb(0 0 40 / .94); color: var(--white);
  overscroll-behavior: contain;
}
.lb-css:target { display: grid; animation: lb-abre .3s var(--ease); }
/* acima do cabeçalho fixo enquanto a foto está aberta, e sem rolar a página por trás */
.lista-wrap:has(.lb-css:target) { z-index: 70; }
html:has(.lb-css:target) { overflow: hidden; }
/* o transform da entrada (.reveal) prenderia a foto "fixed" dentro do álbum */
.js .album.reveal:has(.lb-css:target) { opacity: 1; transform: none; transition: none; }
.lb-css-fundo { position: absolute; inset: 0; cursor: zoom-out; }
.lb-css-foto { position: relative; display: grid; justify-items: center; gap: 12px; margin: 0; max-width: 100%; pointer-events: none; }
.lb-css-foto img {
  max-width: 100%; max-height: calc(100dvh - 150px); width: auto; height: auto;
  border: clamp(4px, .5vw, 8px) solid var(--white); border-radius: clamp(10px, 1.4vw, 20px);
  box-shadow: 0 24px 60px rgb(0 0 0 / .5);
  animation: lb-foto .45s var(--ease);
}
.lb-css-foto figcaption { text-align: center; font: 600 clamp(14px, 1.4vw, 19px) / 1.3 var(--f-body, sans-serif); }
.lb-css-fechar { position: absolute; top: 8px; right: var(--gutter); color: var(--white); }
.lb-css-nav {
  position: absolute; top: 50%; translate: 0 -50%;
  background: var(--yellow); color: var(--ink); border-radius: 50%;
  box-shadow: 0 8px 18px rgb(0 0 0 / .35);
}
.lb-css-nav:hover { background: var(--white); }
.lb-css-ant { left: clamp(6px, 2vw, 30px); }
.lb-css-prox { right: clamp(6px, 2vw, 30px); }
/* setas só dentro do mesmo álbum */
.album-fotos > li:first-child .lb-css-ant,
.album-fotos > li:last-child .lb-css-prox { display: none; }
@keyframes lb-abre { from { opacity: 0; } to { opacity: 1; } }
@keyframes lb-foto { from { opacity: 0; transform: scale(.94); } to { opacity: 1; transform: none; } }
@media (max-width: 599.98px) {
  .lb-css { padding-bottom: 70px; }
  .lb-css-nav { top: auto; bottom: 12px; translate: none; width: 44px; height: 44px; }
  .lb-css-foto img { max-height: calc(100dvh - 210px); }
}

/* Revelação escalonada dos cards e álbuns (usa o .reveal de style.css) */
.js .lista-card.reveal { transition-delay: calc(var(--i, 0) * 110ms); }

/* ---------- Notícia aberta (noticias_detalhes.asp) ---------- */
.noticia-grid { display: grid; gap: clamp(28px, 4vw, 56px); align-items: start; }
@media (min-width: 960px) { .noticia-grid { grid-template-columns: minmax(0, 1fr) minmax(280px, 360px); } }
.noticia {
  padding: clamp(18px, 3.2vw, 48px);
  background: var(--white); color: var(--ink);
  border-radius: clamp(22px, 2.6vw, 40px);
  box-shadow: 0 18px 40px rgb(0 0 60 / .3);
}
.noticia-voltar a { color: var(--red); font: 15px / 1.2 var(--f-list); letter-spacing: .03em; text-decoration: none; }
.noticia-voltar a:hover { text-decoration: underline; }
.noticia-h { margin-top: 14px; color: var(--blue); font: 400 clamp(26px, 3.3vw, 46px) / 1.08 var(--f-title); overflow-wrap: anywhere; }
.noticia-data { margin-top: 12px; color: #5a5a5a; font: 600 clamp(14px, 1.2vw, 16px) / 1.4 var(--f-body); }
.noticia-capa { margin: clamp(18px, 2.4vw, 30px) 0 0; }
.noticia-capa img { width: 100%; border-radius: clamp(14px, 1.6vw, 24px); }
.noticia-capa figcaption { margin-top: 8px; color: #5a5a5a; font: italic 600 14px / 1.4 var(--f-body); }
.noticia-texto { margin-top: clamp(18px, 2.4vw, 30px); font: 600 clamp(16px, 1.3vw, 19px) / 1.65 var(--f-body); overflow-wrap: anywhere; }
.noticia-texto > * + * { margin-top: 1em; }
.noticia-texto a { color: var(--blue); }
.noticia-texto ul, .noticia-texto ol { padding-left: 1.4em; list-style: disc; }
.noticia-texto ol { list-style: decimal; }
.noticia-texto img, .noticia-texto iframe { max-width: 100%; height: auto; }
.noticia-texto strong, .noticia-texto b { font-weight: 700; }
.noticia-arquivo { margin-top: 20px; }
.noticia-arquivo a, .noticia-compartilhar a {
  display: inline-flex; align-items: center; height: 44px; padding: 0 20px;
  border-radius: 999px; color: var(--white); text-decoration: none;
  font: 17px / 1 var(--f-title);
  box-shadow: 0 4px 0 rgb(0 0 0 / .2);
  transition: transform .25s var(--ease), box-shadow .25s;
}
.noticia-arquivo a { background: var(--red); }
.noticia-arquivo a:hover, .noticia-compartilhar a:hover { transform: translateY(-3px); box-shadow: 0 10px 18px rgb(0 0 0 / .25); }
.noticia-h2 { font: 400 clamp(24px, 2.4vw, 34px) / 1.1 var(--f-title); }
.noticia .noticia-h2 { margin-top: clamp(28px, 3.4vw, 44px); color: var(--blue); }
.noticia .album-credito { color: #5a5a5a; }
.noticia .album-foto { border-color: #ececf4; }
.noticia-compartilhar {
  display: flex; flex-wrap: wrap; align-items: center; gap: 10px;
  margin-top: clamp(28px, 3.4vw, 44px); padding-top: 20px;
  border-top: 2px solid #ececf4;
  font: 15px / 1 var(--f-list); letter-spacing: .03em;
}
.noticia-compartilhar span { margin-right: 6px; }
.share-fb { background: #1877f2; }
.share-x { background: #111; }
.share-zap { background: #25d366; }
.noticia-mais-lista { display: grid; gap: 18px; margin-top: 18px; }
@media (min-width: 600px) and (max-width: 959.98px) { .noticia-mais-lista { grid-template-columns: repeat(2, 1fr); } }
.noticia-mais-lista .news-title { font-size: clamp(15px, 1.2vw, 18px); }

/* ---------- Política de Privacidade (politica-de-privacidade.asp) ---------- */
.politica-wrap { width: min(980px, 100% - 2 * var(--gutter)); }
.politica { margin-top: clamp(26px, 4vw, 56px); }
.politica .noticia-h2:first-of-type { margin-top: clamp(22px, 2.6vw, 34px); }
.politica-data { margin-top: clamp(28px, 3.4vw, 44px); padding-top: 18px; border-top: 2px solid #ececf4; }