/* Portal da Paróquia Nossa Senhora da Penha — identidade institucional clássica (azul, branco e dourado) */
/* Fontes hospedadas no próprio portal (sem chamadas a serviços externos) */
@font-face { font-family: 'Cormorant Garamond'; font-style: normal; font-weight: 500; font-display: swap; src: url('/static/fonts/cormorant-garamond-latin-500-normal.woff2') format('woff2'); }
@font-face { font-family: 'Cormorant Garamond'; font-style: normal; font-weight: 600; font-display: swap; src: url('/static/fonts/cormorant-garamond-latin-600-normal.woff2') format('woff2'); }
@font-face { font-family: 'Cormorant Garamond'; font-style: normal; font-weight: 700; font-display: swap; src: url('/static/fonts/cormorant-garamond-latin-700-normal.woff2') format('woff2'); }
@font-face { font-family: 'Cormorant Garamond'; font-style: italic; font-weight: 500; font-display: swap; src: url('/static/fonts/cormorant-garamond-latin-500-italic.woff2') format('woff2'); }
@font-face { font-family: 'Source Sans 3'; font-style: normal; font-weight: 400; font-display: swap; src: url('/static/fonts/source-sans-3-latin-400-normal.woff2') format('woff2'); }
@font-face { font-family: 'Source Sans 3'; font-style: normal; font-weight: 600; font-display: swap; src: url('/static/fonts/source-sans-3-latin-600-normal.woff2') format('woff2'); }
@font-face { font-family: 'Source Sans 3'; font-style: normal; font-weight: 700; font-display: swap; src: url('/static/fonts/source-sans-3-latin-700-normal.woff2') format('woff2'); }
:root {
  --azul: #173A65;
  --azul-escuro: #0F2848;
  --azul-claro: #E8EEF6;
  --dourado: #B79A58;
  --dourado-escuro: #8C7339;   /* dourado para texto sobre fundo claro (contraste AA) */
  --dourado-claro: #F1EADA;
  --marfim: #F7F5EF;
  --branco: #FFFFFF;
  --grafite: #202A36;
  --texto: #2B3542;
  --texto-suave: #5A6573;
  --linha: #E2DED3;
  --vermelho: #9B2C2C;
  --serif: 'Cormorant Garamond', 'Times New Roman', Georgia, serif;
  --sans: 'Source Sans 3', 'Segoe UI', system-ui, -apple-system, sans-serif;
  --raio: 4px;
  --largura: 1180px;
  --sombra: 0 1px 2px rgba(23, 58, 101, .06), 0 8px 24px -12px rgba(23, 58, 101, .18);
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: 90px; overflow-x: clip; }
body { overflow-x: clip; }
body {
  margin: 0; background: var(--branco); color: var(--texto);
  font: 400 1.0625rem/1.65 var(--sans);
  -webkit-font-smoothing: antialiased;
}
img { max-width: 100%; height: auto; display: block; }
a { color: var(--azul); text-underline-offset: .18em; text-decoration-thickness: 1px; }
a:hover { color: var(--azul-escuro); }
:focus-visible { outline: 3px solid var(--dourado); outline-offset: 2px; border-radius: 2px; }
h1, h2, h3, h4 { font-family: var(--serif); color: var(--azul); font-weight: 600; line-height: 1.15; margin: 0 0 .5em; letter-spacing: -.005em; }
h1 { font-size: clamp(2.1rem, 4.4vw, 3.3rem); }
h2 { font-size: clamp(1.7rem, 3vw, 2.35rem); }
h3 { font-size: 1.45rem; }
p { margin: 0 0 1em; }
.wrap { width: min(var(--largura), 100% - 32px); margin-inline: auto; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.skip { position: absolute; left: 16px; top: -60px; background: var(--azul); color: #fff; padding: 10px 16px; z-index: 100; }
.skip:focus { top: 10px; }

/* ---------- Cabeçalho: logotipo ao centro e menu dividido ---------- */
.cabecalho { background: var(--branco); position: relative; z-index: 40; border-bottom: 3px solid var(--dourado); box-shadow: 0 1px 0 var(--azul) inset; }
.cab-grade {
  display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  grid-template-areas: "info-e logo info-d" "nav-e logo nav-d";
  grid-template-rows: auto 1fr; column-gap: 26px; padding: 14px 0 12px;
}
.cab-info { margin: 0; display: flex; align-items: center; gap: 18px; font-size: .84rem; color: var(--texto-suave); min-width: 0; }
.cab-info svg { color: var(--dourado-escuro); flex-shrink: 0; }
.cab-info-esq { grid-area: info-e; gap: 7px; }
.cab-info-esq span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cab-info-dir { grid-area: info-d; justify-content: flex-end; flex-wrap: wrap; row-gap: 4px; }
.cab-info a { color: var(--texto-suave); text-decoration: none; display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.cab-info a:hover { color: var(--azul); }
.cab-busca { width: 32px; height: 32px; border: 1px solid var(--linha); border-radius: 50%; justify-content: center; color: var(--azul) !important; }
.cab-busca svg { width: 15px; height: 15px; color: var(--azul); }

.marca-central { grid-area: logo; align-self: center; display: block; padding: 0 4px; line-height: 0; }
.marca-central img { height: 118px; width: auto; display: block; }

.menu-lado { position: relative; align-self: end; padding-top: 22px; }
.menu-esq { grid-area: nav-e; }
.menu-dir { grid-area: nav-d; }
.menu-lado .arco { position: absolute; top: 0; left: 0; width: 100%; height: 26px; overflow: visible; }
.menu-lado .arco path { fill: none; stroke: var(--dourado); stroke-width: 1.4; vector-effect: non-scaling-stroke; }
.menu-lado ul { list-style: none; margin: 0; padding: 0; display: flex; gap: 2px; }
.menu-esq ul { justify-content: flex-end; }
.menu-dir ul { justify-content: flex-start; }
.menu-lado a {
  display: block; white-space: nowrap; padding: 8px 9px 6px; text-decoration: none;
  color: var(--azul); font: 700 .8rem var(--sans); letter-spacing: .07em; text-transform: uppercase;
  border-bottom: 2px solid transparent;
}
.menu-lado a:hover { color: var(--dourado-escuro); border-bottom-color: var(--dourado); }
.menu-lado a[aria-current="page"] { color: var(--azul-escuro); border-bottom-color: var(--azul); }

/* Elementos só do celular/tablet (escondidos no computador) */
.marca-movel, .menu-botao, .menu { display: none; }
.marca { align-items: center; text-decoration: none; min-width: 0; }
.logo-cab { height: 60px; width: auto; display: block; }
.menu-botao { flex-shrink: 0; margin-left: auto; background: none; border: 1px solid var(--linha); border-radius: var(--raio); padding: 9px 12px; font: 600 .95rem var(--sans); color: var(--azul); cursor: pointer; align-items: center; gap: 8px; }
.menu-contato { display: grid; gap: 10px; margin-top: 24px; font-size: .95rem; }
.menu-contato a { color: var(--texto-suave); text-decoration: none; display: flex; gap: 8px; align-items: center; }

@media (max-width: 1180px) {
  .cab-grade { display: flex; align-items: center; gap: 12px; padding: 10px 0; min-height: 80px; }
  .cab-info, .marca-central, .menu-lado { display: none; }
  .marca-movel { display: flex; }
  .menu-botao { display: inline-flex; }
  .menu { display: block; position: fixed; inset: 0 0 0 auto; width: min(340px, 88vw); background: var(--branco); box-shadow: -10px 0 40px rgba(0,0,0,.18); padding: 80px 20px 24px; transform: translateX(100%); visibility: hidden; transition: transform .25s ease, visibility 0s .25s; overflow-y: auto; margin: 0; z-index: 60; }
  .menu.aberto { transform: none; visibility: visible; transition: transform .25s ease; }
  .menu ul { list-style: none; margin: 0; padding: 0; }
  .menu ul a { display: block; padding: 13px 8px; border-bottom: 1px solid var(--linha); text-decoration: none; color: var(--azul); font: 700 .9rem var(--sans); letter-spacing: .06em; text-transform: uppercase; }
  .menu ul a[aria-current="page"] { color: var(--dourado-escuro); }
  .menu .fechar { position: absolute; top: 20px; right: 20px; display: inline-flex; }
}
@media (max-width: 560px) {
  .cab-grade { min-height: 70px; }
  .logo-cab { height: 52px; }
  .menu-botao { padding: 8px 10px; }
}

/* ---------- Hero ---------- */
.hero { position: relative; color: #fff; background: var(--azul) center/cover no-repeat; isolation: isolate; }
.hero::before { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(100deg, rgba(15,40,72,.94) 0%, rgba(23,58,101,.82) 48%, rgba(23,58,101,.35) 100%); }
.hero.sem-foto { background-image: radial-gradient(circle at 85% 30%, rgba(183,154,88,.28), transparent 45%), linear-gradient(135deg, var(--azul-escuro), var(--azul)); }
.hero.sem-foto::before { background: none; }
.hero { overflow: hidden; }
.hero-emblema { position: absolute; right: max(2vw, calc((100vw - var(--largura)) / 2 - 40px)); bottom: -6%; height: 112%; width: auto; opacity: .13; pointer-events: none; z-index: -1; }
@media (max-width: 760px) { .hero-emblema { height: 80%; right: -18%; opacity: .09; } }
.hero .wrap { padding: clamp(64px, 10vw, 128px) 0 clamp(72px, 10vw, 120px); }
.hero .sobre { font-size: .8rem; letter-spacing: .2em; text-transform: uppercase; color: var(--dourado); font-weight: 700; display: flex; align-items: center; gap: 12px; }
.hero .sobre::before { content: ''; width: 36px; height: 1px; background: var(--dourado); }
.hero h1 { color: #fff; max-width: 15ch; margin: 18px 0 18px; font-size: clamp(2.5rem, 6vw, 4.4rem); }
.hero p { font-size: clamp(1.08rem, 1.6vw, 1.25rem); max-width: 46ch; color: #E4EAF2; }
.hero .acoes { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 28px; }

.botao { display: inline-flex; align-items: center; gap: 8px; padding: 13px 22px; border-radius: var(--raio); font: 700 .95rem var(--sans); text-decoration: none; border: 1.5px solid transparent; cursor: pointer; letter-spacing: .01em; }
.botao.dourado { background: var(--dourado); color: var(--azul-escuro); }
.botao.dourado:hover { background: #C8AD6E; color: var(--azul-escuro); }
.botao.contorno { border-color: rgba(255,255,255,.6); color: #fff; }
.botao.contorno:hover { background: rgba(255,255,255,.1); color: #fff; }
.botao.azul { background: var(--azul); color: #fff; }
.botao.azul:hover { background: var(--azul-escuro); color: #fff; }
.botao.linha { border-color: var(--azul); color: var(--azul); }
.botao.linha:hover { background: var(--azul-claro); }

/* ---------- Acessos rápidos ---------- */
.rapidos { margin-top: -44px; position: relative; z-index: 2; }
.rapidos ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); background: var(--branco); box-shadow: var(--sombra); border-top: 3px solid var(--dourado); }
.rapidos li + li { border-left: 1px solid var(--linha); }
.rapidos a { display: flex; gap: 14px; align-items: center; padding: 22px 22px; text-decoration: none; color: var(--grafite); height: 100%; }
.rapidos a:hover { background: var(--marfim); }
.rapidos svg { width: 30px; height: 30px; color: var(--dourado-escuro); flex-shrink: 0; }
.rapidos strong { display: block; font: 600 1.25rem/1.1 var(--serif); color: var(--azul); }
.rapidos span { font-size: .88rem; color: var(--texto-suave); }
@media (max-width: 900px) { .rapidos ul { grid-template-columns: 1fr 1fr; } .rapidos li:nth-child(3) { border-left: 0; } .rapidos li:nth-child(n+3) { border-top: 1px solid var(--linha); } }
@media (max-width: 480px) { .rapidos a { padding: 16px 14px; gap: 10px; } .rapidos strong { font-size: 1.08rem; } .rapidos span { display: none; } .rapidos svg { width: 24px; height: 24px; } }

/* ---------- Seções ---------- */
.secao { padding: clamp(56px, 7vw, 92px) 0; }
.secao.marfim { background: var(--marfim); }
.secao.azul { background: var(--azul); color: #E4EAF2; }
.secao.azul h2, .secao.azul h3 { color: #fff; }
.titulo-secao { display: flex; justify-content: space-between; align-items: end; gap: 20px; margin-bottom: 32px; flex-wrap: wrap; }
.titulo-secao h2 { margin: 0; }
.rotulo { display: block; font: 700 .76rem var(--sans); letter-spacing: .2em; text-transform: uppercase; color: var(--dourado-escuro); margin-bottom: 8px; }
.secao.azul .rotulo { color: var(--dourado); }
.ver-mais { font-weight: 700; font-size: .95rem; text-decoration: none; white-space: nowrap; }
.ver-mais::after { content: ' →'; }

/* ---------- Avisos ---------- */
.avisos { border: 1px solid var(--dourado); background: var(--dourado-claro); padding: 18px 22px; display: grid; gap: 10px; }
.avisos h2 { font-size: 1.3rem; margin: 0; display: flex; gap: 10px; align-items: center; }
.avisos ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 8px; }
.avisos li { display: flex; gap: 10px; align-items: baseline; }
.avisos li::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: var(--dourado-escuro); flex-shrink: 0; transform: translateY(-2px); }
.avisos a { font-weight: 700; }

/* ---------- Notícias ---------- */
.grade-noticias { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; }
.grade-noticias .principal { grid-column: span 2; grid-row: span 2; }
.card { display: flex; flex-direction: column; background: var(--branco); text-decoration: none; color: inherit; }
.card .imagem { aspect-ratio: 16/10; background: var(--azul-claro); overflow: hidden; position: relative; }
.card .imagem img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }
.card:hover .imagem img { transform: scale(1.03); }
.card .imagem.vazia { display: grid; place-items: center; background: linear-gradient(135deg, var(--azul-claro), var(--marfim)); color: var(--dourado); }
.card .imagem.vazia svg { width: 44px; height: 44px; opacity: .7; }
.card .corpo { padding: 16px 2px 0; }
.card .meta { font-size: .8rem; text-transform: uppercase; letter-spacing: .1em; color: var(--dourado-escuro); font-weight: 700; display: flex; gap: 10px; flex-wrap: wrap; }
.card .meta time { color: var(--texto-suave); }
.card h3 { margin: 8px 0 8px; font-size: 1.4rem; }
.card:hover h3 { text-decoration: underline; text-decoration-color: var(--dourado); text-decoration-thickness: 1px; }
.card p { color: var(--texto-suave); font-size: .98rem; margin: 0; }
.grade-noticias .principal h3 { font-size: clamp(1.7rem, 2.6vw, 2.2rem); }
.grade-noticias .principal .imagem { aspect-ratio: 16/9.5; }
@media (max-width: 900px) { .grade-noticias { grid-template-columns: 1fr 1fr; } .grade-noticias .principal { grid-column: span 2; grid-row: auto; } }
@media (max-width: 600px) { .grade-noticias { grid-template-columns: 1fr; } .grade-noticias .principal { grid-column: auto; } }

/* ---------- Agenda ---------- */
.agenda-lista { list-style: none; margin: 0; padding: 0; display: grid; gap: 0; }
.agenda-lista li { display: grid; grid-template-columns: 76px 1fr; gap: 20px; padding: 18px 0; border-bottom: 1px solid var(--linha); align-items: start; }
.secao.azul .agenda-lista li { border-color: rgba(255,255,255,.16); }
.data-bloco { text-align: center; border: 1px solid var(--dourado); padding: 8px 4px 10px; line-height: 1; }
.data-bloco .mes { display: block; font: 700 .72rem var(--sans); letter-spacing: .14em; color: var(--dourado-escuro); }
.secao.azul .data-bloco .mes { color: var(--dourado); }
.data-bloco .dia { display: block; font: 600 2.1rem var(--serif); color: var(--azul); margin-top: 4px; }
.secao.azul .data-bloco .dia { color: #fff; }
.data-bloco .sem { display: block; font-size: .72rem; color: var(--texto-suave); margin-top: 4px; }
.secao.azul .data-bloco .sem { color: #B9C6D8; }
.evento h3 { font-size: 1.3rem; margin: 2px 0 6px; }
.evento .tipo { display: inline-block; font-size: .74rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; padding: 2px 8px; border-radius: 2px; background: var(--azul-claro); color: var(--azul); margin-right: 6px; }
.secao.azul .evento .tipo { background: rgba(255,255,255,.12); color: #fff; }
.evento .tipo.cancelado { background: #F8E1E1; color: var(--vermelho); }
.evento .info { font-size: .95rem; color: var(--texto-suave); display: flex; flex-wrap: wrap; gap: 4px 16px; }
.secao.azul .evento .info { color: #C6D2E2; }
.secao.azul a { color: #fff; }

.duas-colunas { display: grid; grid-template-columns: 1.4fr 1fr; gap: clamp(32px, 5vw, 72px); }
@media (max-width: 900px) { .duas-colunas { grid-template-columns: 1fr; } }

/* ---------- Horários ---------- */
.horarios-dia { border-top: 2px solid var(--azul); padding-top: 10px; margin-bottom: 28px; }
.horarios-dia h3 { font-size: 1.35rem; }
.tabela { width: 100%; border-collapse: collapse; font-size: .98rem; }
.tabela th, .tabela td { text-align: left; padding: 10px 12px 10px 0; border-bottom: 1px solid var(--linha); vertical-align: top; }
.tabela th { font-size: .78rem; text-transform: uppercase; letter-spacing: .08em; color: var(--texto-suave); font-weight: 700; }
.tabela .hora { font: 600 1.25rem var(--serif); color: var(--azul); white-space: nowrap; width: 80px; }
.resumo-horarios { list-style: none; padding: 0; margin: 0; display: grid; gap: 2px; }
.resumo-horarios li { display: flex; justify-content: space-between; gap: 16px; padding: 10px 0; border-bottom: 1px solid rgba(255,255,255,.16); }

/* ---------- Comunidades ---------- */
.setores { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--linha); border: 1px solid var(--linha); }
.setores a { background: var(--branco); padding: 24px 22px; text-decoration: none; color: inherit; display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.setores a:hover { background: var(--marfim); }
.setores strong { font: 600 1.45rem var(--serif); color: var(--azul); display: block; }
.setores span { font-size: .88rem; color: var(--texto-suave); }
.setores .seta { color: var(--dourado-escuro); font-size: 1.4rem; }
@media (max-width: 760px) { .setores { grid-template-columns: 1fr 1fr; } }
@media (max-width: 460px) { .setores { grid-template-columns: 1fr; } }

.filtros { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 28px; }
.filtros a { padding: 8px 16px; border: 1px solid var(--linha); border-radius: 999px; text-decoration: none; color: var(--grafite); font-weight: 600; font-size: .92rem; }
.filtros a:hover { border-color: var(--azul); }
.filtros a[aria-current="true"] { background: var(--azul); border-color: var(--azul); color: #fff; }

.lista-comunidades { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 18px; }
.comunidade-card { border: 1px solid var(--linha); text-decoration: none; color: inherit; display: flex; flex-direction: column; border-bottom: 3px solid var(--azul); background: var(--branco); overflow: hidden; }
.comunidade-card:hover { border-bottom-color: var(--dourado); box-shadow: var(--sombra); }
.comunidade-card img, .comunidade-card .sem-foto { width: 100%; aspect-ratio: 4/3; object-fit: cover; background: var(--azul-claro); transition: transform .4s ease; }
.comunidade-card:hover img { transform: scale(1.03); }
.comunidade-card .sem-foto { display: grid; place-items: center; color: var(--dourado); }
.comunidade-card .sem-foto svg { width: 40px; height: 40px; }
.comunidade-card .texto-card { display: block; padding: 16px 18px 18px; position: relative; background: var(--branco); }
.comunidade-card h3 { font-size: 1.35rem; margin-bottom: 2px; }
.vitrine { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 900px) { .vitrine { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px) { .vitrine { gap: 12px; } .vitrine .comunidade-card h3 { font-size: 1.12rem; } .vitrine .texto-card { padding: 10px 12px 12px; } }
.comunidade-card .setor { font-size: .78rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--dourado-escuro); }
.comunidade-card p { font-size: .94rem; color: var(--texto-suave); margin: 2px 0 0; }
.grupo-setor + .grupo-setor { margin-top: 48px; }
.titulo-setor { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; flex-wrap: wrap; border-top: 2px solid var(--azul); padding-top: 12px; margin-bottom: 20px; }
.titulo-setor h2 { margin: 0; font-size: 1.7rem; }
@media (max-width: 600px) {
  .lista-comunidades { grid-template-columns: 1fr 1fr; gap: 12px; }
  .lista-comunidades .texto-card { padding: 10px 12px 12px; }
  .lista-comunidades .comunidade-card h3 { font-size: 1.12rem; }
  .lista-comunidades .comunidade-card .setor { font-size: .68rem; letter-spacing: .06em; }
  .lista-comunidades .comunidade-card p { font-size: .85rem; }
  .titulo-setor h2 { font-size: 1.45rem; }
  .grupo-setor + .grupo-setor { margin-top: 36px; }
}

/* ---------- Páginas internas ---------- */
.cabeca-pagina { background: var(--marfim); border-bottom: 1px solid var(--linha); padding: clamp(40px, 6vw, 72px) 0 clamp(32px, 5vw, 52px); }
.cabeca-pagina h1 { margin: 6px 0 10px; }
.cabeca-pagina p { max-width: 62ch; color: var(--texto-suave); font-size: 1.12rem; margin: 0; }
.trilha { font-size: .88rem; color: var(--texto-suave); }
.trilha ol { list-style: none; display: flex; flex-wrap: wrap; gap: 6px; padding: 0; margin: 0; }
.trilha li + li::before { content: '/'; margin-right: 6px; color: var(--dourado); }
.trilha a { color: var(--texto-suave); }

.conteudo { padding: clamp(40px, 6vw, 72px) 0; }
.texto { max-width: 72ch; font-size: 1.1rem; }
.texto h2 { font-size: 1.9rem; margin-top: 1.4em; }
.texto h3 { margin-top: 1.3em; }
.texto blockquote { margin: 1.5em 0; padding: 4px 0 4px 24px; border-left: 3px solid var(--dourado); font: italic 500 1.35rem/1.45 var(--serif); color: var(--azul); }
.texto img { margin: 1.5em 0; }
.texto figure { margin: 1.5em 0; }
.texto figcaption { font-size: .9rem; color: var(--texto-suave); margin-top: 8px; }
.texto table { border-collapse: collapse; width: 100%; }
.texto td, .texto th { border: 1px solid var(--linha); padding: 8px 10px; }
.texto-projeto > p:first-child { font: 500 1.45rem/1.45 var(--serif); color: var(--azul); margin-top: 0; }
.fotos-projeto { margin-top: 56px; padding-top: 32px; border-top: 1px solid var(--linha); }

.com-lateral { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: clamp(32px, 5vw, 64px); align-items: start; }
@media (max-width: 960px) { .com-lateral { grid-template-columns: 1fr; } }
.lateral { display: grid; gap: 24px; }
.caixa { border: 1px solid var(--linha); padding: 22px; background: var(--branco); }
.caixa h2, .caixa h3 { font-size: 1.3rem; margin-bottom: 12px; }
.caixa ul { list-style: none; margin: 0; padding: 0; }
.caixa li { padding: 8px 0; border-bottom: 1px solid var(--linha); }
.caixa li:last-child { border-bottom: 0; }
.caixa.destaque { background: var(--azul); color: #E4EAF2; border: 0; }
.caixa.destaque h2, .caixa.destaque h3 { color: #fff; }
.caixa.destaque a { color: #fff; }

.noticia-capa { margin: 0 0 32px; }
.noticia-capa img { width: 100%; max-height: 560px; object-fit: cover; }
.foto-comunidade img { width: auto; max-width: 100%; max-height: 640px; object-fit: contain; background: var(--marfim); margin-inline: auto; }
.noticia-capa figcaption { font-size: .88rem; color: var(--texto-suave); margin-top: 8px; }
.noticia-meta { display: flex; gap: 14px; flex-wrap: wrap; font-size: .92rem; color: var(--texto-suave); margin-top: 6px; }
.galeria { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 10px; margin: 32px 0; }
.galeria img { aspect-ratio: 1; object-fit: cover; width: 100%; }
.compartilhar { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; margin-top: 36px; padding-top: 20px; border-top: 1px solid var(--linha); font-size: .95rem; }
.compartilhar a { padding: 6px 14px; border: 1px solid var(--linha); border-radius: 999px; text-decoration: none; font-weight: 600; }

.cards-paginas { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 18px; }
.cards-paginas a { display: block; padding: 24px; border: 1px solid var(--linha); text-decoration: none; color: inherit; background: var(--branco); }
.cards-paginas a:hover { border-color: var(--dourado); box-shadow: var(--sombra); }
.cards-paginas h3 { font-size: 1.4rem; margin-bottom: 6px; }
.cards-paginas p { font-size: .96rem; color: var(--texto-suave); margin: 0; }

.lista-docs { list-style: none; padding: 0; margin: 0; border-top: 1px solid var(--linha); }
.lista-docs li { display: flex; gap: 16px; align-items: center; justify-content: space-between; padding: 16px 0; border-bottom: 1px solid var(--linha); flex-wrap: wrap; }
.lista-docs .doc-titulo { font-weight: 700; color: var(--grafite); }
.lista-docs small { display: block; color: var(--texto-suave); }

.paginacao { display: flex; gap: 10px; justify-content: center; margin-top: 40px; }
.vazio { padding: 32px; text-align: center; border: 1px dashed var(--linha); color: var(--texto-suave); background: var(--marfim); }
.aviso-validacao { background: var(--dourado-claro); border-left: 3px solid var(--dourado); padding: 12px 16px; font-size: .95rem; margin-bottom: 24px; }

.form-busca { display: flex; gap: 8px; max-width: 640px; }
.form-busca input { flex: 1; padding: 13px 16px; border: 1.5px solid var(--linha); border-radius: var(--raio); font: inherit; }
.form-busca input:focus { border-color: var(--azul); outline: none; box-shadow: 0 0 0 3px var(--azul-claro); }
.resultado-busca { padding: 18px 0; border-bottom: 1px solid var(--linha); }
.resultado-busca .tipo-res { font-size: .76rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--dourado-escuro); }
.resultado-busca h3 { font-size: 1.3rem; margin: 4px 0; }

.catequese-faixa { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; background: var(--linha); }
.catequese-faixa > * { background: var(--branco); padding: clamp(28px, 4vw, 48px); }
@media (max-width: 760px) { .catequese-faixa { grid-template-columns: 1fr; } }

/* ---------- Rodapé ---------- */
.rodape { background: var(--azul-escuro); color: #C6D2E2; font-size: .95rem; }
.rodape .wrap { display: grid; grid-template-columns: 1.3fr 1fr 1fr 1fr; gap: 36px; padding: 60px 0 44px; }
.rodape h2 { color: #fff; font-size: 1.25rem; margin-bottom: 14px; }
.rodape a { color: #fff; text-decoration: none; }
.rodape a:hover { text-decoration: underline; }
.rodape ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.rodape .marca-rodape img { width: 230px; height: auto; margin-bottom: 14px; }
.rodape .marca-rodape span { color: var(--dourado); font-size: .78rem; letter-spacing: .14em; text-transform: uppercase; font-weight: 700; }
.rodape .linha-final { border-top: 1px solid rgba(255,255,255,.12); }
.rodape .linha-final .wrap { display: flex; justify-content: space-between; gap: 16px; padding: 18px 0; grid-template-columns: none; font-size: .86rem; flex-wrap: wrap; }
.rodape .pendente { color: #8FA2BB; font-style: italic; }
@media (max-width: 900px) { .rodape .wrap { grid-template-columns: 1fr 1fr; } }
@media (max-width: 520px) { .rodape .wrap { grid-template-columns: 1fr; } }

@media (prefers-reduced-motion: reduce) { * { transition: none !important; animation: none !important; } html { scroll-behavior: auto; } }
@media print { .topbar, .cabecalho, .rodape, .compartilhar, .menu-botao { display: none !important; } }

/* Pastorais e movimentos */
.intro-pastorais { margin-bottom: 48px; }
.grupo-pastorais { margin-bottom: 52px; }
.lista-pastorais img { object-position: top; }
.lista-pastorais .texto-card p { font-size: .92rem; }

.nota-horario { color: var(--texto-suave); font-size: .96rem; max-width: 70ch; margin-top: 14px; }
.hora-alt { display: block; font: 600 .82rem var(--sans); color: var(--texto-suave); }
.rodape .area-rodape { display: block; color: #C6D2E2; font-size: .86rem; margin-top: 4px; }

/* Clero */
.texto ul.galeria-clero { list-style: none; padding: 0; margin: 16px 0 36px; display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 20px; }
.galeria-clero li { margin: 0; text-align: center; font-size: .95rem; color: var(--texto-suave); }
.galeria-clero figure { margin: 0 0 12px; }
.galeria-clero img, .galeria-clero li:not(:has(img))::before { display: block; width: 100%; aspect-ratio: 235/277; object-fit: cover; background: var(--marfim); border-bottom: 3px solid var(--dourado); margin: 0 0 12px; }
.galeria-clero li:not(:has(img))::before { content: ''; background: var(--marfim) url('/static/marca/emblema-azul.webp') center 45% / 38% no-repeat; opacity: .9; }
.galeria-clero strong { display: block; font: 600 1.2rem/1.2 var(--serif); color: var(--azul); margin-bottom: 2px; }

/* Galeria de fotos */
.grade-albuns .card .imagem { aspect-ratio: 4/3; }
.card-album .contador { position: absolute; right: 10px; bottom: 10px; background: rgba(15,40,72,.85); color: #fff; font-size: .78rem; font-weight: 700; padding: 3px 9px; border-radius: 999px; }
.galeria-album { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 10px; }
.galeria-album a { display: block; overflow: hidden; background: var(--azul-claro); }
.galeria-album img { width: 100%; aspect-ratio: 1; object-fit: cover; transition: transform .35s ease; }
.galeria-album a:hover img { transform: scale(1.04); }
@media (max-width: 520px) { .galeria-album { grid-template-columns: repeat(2, 1fr); gap: 6px; } }
dialog.visor { border: 0; padding: 0; background: transparent; max-width: 100vw; max-height: 100vh; width: 100vw; height: 100vh; }
dialog.visor::backdrop { background: rgba(8, 18, 34, .94); }
.visor figure { margin: 0; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 56px 64px 24px; gap: 12px; }
.visor img { max-width: 100%; max-height: calc(100vh - 130px); object-fit: contain; box-shadow: 0 10px 40px rgba(0,0,0,.5); }
.visor figcaption { color: #DCE4EF; font-size: .95rem; text-align: center; min-height: 1.4em; }
.visor button { position: fixed; background: rgba(255,255,255,.12); color: #fff; border: 0; width: 48px; height: 48px; border-radius: 50%; font-size: 1.5rem; cursor: pointer; display: grid; place-items: center; }
.visor button:hover, .visor button:focus-visible { background: rgba(255,255,255,.25); }
.visor .fechar-visor { top: 14px; right: 14px; }
.visor .anterior { left: 14px; top: 50%; transform: translateY(-50%); }
.visor .proxima { right: 14px; top: 50%; transform: translateY(-50%); }
.visor .posicao { position: fixed; top: 24px; left: 24px; color: #B9C6D8; font-size: .9rem; }
@media (max-width: 600px) { .visor figure { padding: 60px 8px 16px; } .visor .anterior, .visor .proxima { top: auto; bottom: 16px; transform: none; } }

/* Carrossel da página inicial */
.carrossel { position: relative; background: var(--azul); }
.carrossel .slides { display: grid; }
.carrossel .slide { grid-area: 1 / 1; }
.carrossel .slide[hidden] { display: none; }
.carrossel.js .slide { display: block; opacity: 0; visibility: hidden; transition: opacity .7s ease, visibility 0s linear .7s; }
.carrossel.js .slide.ativo { opacity: 1; visibility: visible; transition: opacity .7s ease; z-index: 1; }
.hero .titulo-slide { color: #fff; max-width: 20ch; margin: 18px 0 18px; font-size: clamp(2.1rem, 4.6vw, 3.5rem); }
.carrossel .hero .wrap { padding-bottom: clamp(124px, 12vw, 150px); }
@media (max-width: 600px) { .carrossel .hero .wrap { padding-bottom: 128px; } .controles-carrossel { bottom: 62px; } }
.controles-carrossel { position: absolute; z-index: 3; left: 50%; transform: translateX(-50%); bottom: 62px; display: flex; align-items: center; gap: 10px; }
.controles-carrossel button { cursor: pointer; border: 0; }
.seta-carrossel, .pausar-carrossel { width: 38px; height: 38px; border-radius: 50%; background: rgba(255,255,255,.14); color: #fff; font-size: 1.3rem; line-height: 1; display: grid; place-items: center; }
.pausar-carrossel { font-size: .7rem; letter-spacing: -1px; }
.seta-carrossel:hover, .pausar-carrossel:hover { background: rgba(255,255,255,.28); }
.pontos { display: flex; gap: 8px; }
.pontos button { width: 10px; height: 10px; padding: 0; border-radius: 50%; background: rgba(255,255,255,.4); }
.pontos button[aria-selected="true"] { background: var(--dourado); width: 26px; border-radius: 6px; }
@media (max-width: 600px) { .controles-carrossel { bottom: 58px; } .seta-carrossel { display: none; } }
@media (prefers-reduced-motion: reduce) { .carrossel.js .slide { transition: none; } }

.clero-paroquia { max-width: none; }
.clero-paroquia h2 { font-size: 1.45rem; margin-top: 1.2em; }
.clero-paroquia ul.galeria-clero { grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); max-width: 1000px; }

/* Slide de boas-vindas com a imagem de Nossa Senhora da Penha */
.boas-vindas.sem-foto { background-image: radial-gradient(circle at 78% 35%, rgba(183,154,88,.22), transparent 42%), linear-gradient(135deg, var(--azul-escuro), var(--azul)); }
.hero-padroeira { position: absolute; z-index: -1; top: 0; bottom: 0; right: max(0px, calc((100vw - var(--largura)) / 2 - 20px)); width: min(46%, 520px); pointer-events: none; }
.hero-padroeira img {
  width: 100%; height: 100%; object-fit: cover; object-position: 50% 12%;
  -webkit-mask-image: linear-gradient(to right, transparent 0%, #000 34%, #000 82%, transparent 100%), linear-gradient(to bottom, #000 72%, transparent 100%);
  -webkit-mask-composite: source-in; mask-image: linear-gradient(to right, transparent 0%, #000 34%, #000 82%, transparent 100%), linear-gradient(to bottom, #000 72%, transparent 100%);
  mask-composite: intersect;
}
.boas-vindas .wrap { position: relative; }
.boas-vindas h1, .boas-vindas > .wrap > p, .boas-vindas .acoes { max-width: min(560px, 54%); }
.hero-citacao { margin: 34px 0 0; padding: 0 0 0 18px; border-left: 2px solid var(--dourado); max-width: min(560px, 54%); }
.hero-citacao p { margin: 0; font: italic 500 clamp(1.08rem, 1.5vw, 1.3rem)/1.5 var(--serif); color: #F1EADA; }
@media (max-width: 860px) {
  .hero-padroeira { width: 62%; right: -6%; opacity: .45; }
  .boas-vindas h1, .boas-vindas > .wrap > p, .boas-vindas .acoes, .hero-citacao { max-width: none; }
}
@media (max-width: 520px) { .hero-padroeira { width: 78%; right: -22%; opacity: .32; } }

/* ---------- Coral Vozes da Penha ---------- */
.selo-nota { display: inline-grid; place-items: center; width: 52px; height: 52px; border-radius: 50%; background: var(--dourado); color: var(--azul-escuro); box-shadow: 0 0 0 6px rgba(183,154,88,.25); flex-shrink: 0; }
.selo-nota svg { width: 26px; height: 26px; }
.selo-nota.grande { width: 68px; height: 68px; margin-bottom: 18px; }
.selo-nota.grande svg { width: 34px; height: 34px; }
.equalizador { display: inline-flex; align-items: flex-end; gap: 3px; height: 14px; vertical-align: -1px; margin: 0 6px; }
.equalizador i { display: block; width: 3px; height: 100%; background: currentColor; border-radius: 2px; transform-origin: bottom; animation: eq 1.1s ease-in-out infinite; }
.equalizador i:nth-child(2) { animation-delay: -.3s; } .equalizador i:nth-child(3) { animation-delay: -.6s; }
.equalizador i:nth-child(4) { animation-delay: -.15s; } .equalizador i:nth-child(5) { animation-delay: -.45s; }
@keyframes eq { 0%, 100% { transform: scaleY(.3); } 50% { transform: scaleY(1); } }

.destaque-coral { background: linear-gradient(120deg, var(--azul-escuro), var(--azul)); color: #E4EAF2; padding: clamp(48px, 6vw, 80px) 0; position: relative; overflow: hidden; }
.destaque-coral::after { content: ''; position: absolute; inset: auto -10% -60% auto; width: 520px; height: 520px; border-radius: 50%; background: radial-gradient(circle, rgba(183,154,88,.18), transparent 65%); pointer-events: none; }
.destaque-coral-grade { display: grid; grid-template-columns: 1.1fr 1fr; gap: clamp(28px, 5vw, 64px); align-items: center; }
.destaque-coral-foto { position: relative; display: block; border-radius: 6px; overflow: visible; }
.destaque-coral-foto img { width: 100%; aspect-ratio: 3/2; object-fit: cover; border-radius: 6px; box-shadow: 0 24px 50px -20px rgba(0,0,0,.6); border: 3px solid rgba(183,154,88,.6); transition: transform .4s ease; }
.destaque-coral-foto:hover img { transform: scale(1.015); }
.destaque-coral-foto .selo-nota { position: absolute; left: -18px; bottom: -18px; width: 72px; height: 72px; }
.destaque-coral-foto .selo-nota svg { width: 34px; height: 34px; }
.destaque-coral .rotulo { color: var(--dourado); display: flex; align-items: center; }
.destaque-coral .rotulo .equalizador { margin: 0 10px 0 0; }
.destaque-coral h2 { color: #fff; font-size: clamp(2rem, 3.6vw, 2.8rem); }
.destaque-coral p { font-size: 1.12rem; max-width: 44ch; }
.destaque-coral .acoes { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 22px; }
.destaque-coral .botao svg, .coral-capa .botao svg, .caixa-insta .botao svg { width: 15px; height: 15px; }
@media (max-width: 820px) { .destaque-coral-grade { grid-template-columns: 1fr; } .destaque-coral-foto .selo-nota { left: 12px; bottom: -22px; } }

.coral-capa { position: relative; color: #fff; background: var(--azul) center 35%/cover no-repeat; isolation: isolate; text-align: center; }
.coral-capa::before { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(15,40,72,.78), rgba(15,40,72,.88) 70%, rgba(15,40,72,.96)); }
.coral-capa .wrap { padding: clamp(40px, 6vw, 64px) 0 clamp(56px, 8vw, 96px); display: flex; flex-direction: column; align-items: center; }
.coral-capa .trilha { align-self: flex-start; margin-bottom: clamp(28px, 5vw, 56px); }
.trilha-clara, .trilha-clara a { color: #C6D2E2; }
.coral-capa .sobre { font-size: .8rem; letter-spacing: .2em; text-transform: uppercase; color: var(--dourado); font-weight: 700; display: inline-flex; align-items: center; }
.coral-capa h1 { color: #fff; margin: 14px 0 12px; font-size: clamp(2.6rem, 6.5vw, 4.6rem); }
.coral-capa p { max-width: 52ch; font-size: clamp(1.05rem, 1.6vw, 1.22rem); color: #E4EAF2; }
.coral-capa .acoes { margin-top: 22px; }
.texto-coral p:first-child::first-letter { float: left; font: 600 4.2rem/.8 var(--serif); color: var(--dourado-escuro); margin: 8px 10px 0 0; }
.caixa-insta { border-top: 3px solid var(--dourado); }
.galeria-coral { grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); }
.galeria-coral img { aspect-ratio: 3/2; }

.faixa-coral { display: flex; align-items: center; gap: 18px; padding: 18px 22px; margin: 0 0 44px; background: linear-gradient(120deg, var(--azul-escuro), var(--azul)); color: #fff; text-decoration: none; border-radius: 6px; border-left: 4px solid var(--dourado); }
.faixa-coral strong { display: block; font: 600 1.45rem/1.15 var(--serif); color: #fff; }
.faixa-coral small { display: block; color: #C6D2E2; font-size: .95rem; margin-top: 2px; }
.faixa-coral .equalizador { margin-left: auto; color: var(--dourado); height: 22px; }
.faixa-coral .equalizador i { width: 4px; }
.faixa-coral:hover { box-shadow: var(--sombra); color: #fff; }
.faixa-coral.compacta { margin: 0; padding: 14px 16px; gap: 12px; }
.faixa-coral.compacta .selo-nota { width: 42px; height: 42px; }
.faixa-coral.compacta strong { font-size: 1.15rem; }
@media (prefers-reduced-motion: reduce) { .equalizador i { animation: none; transform: scaleY(.7); } }

/* ---------- Dízimo e projetos sociais ---------- */
.cab-dizimo { background: var(--dourado); color: var(--azul-escuro) !important; font-weight: 700; padding: 5px 13px; border-radius: 999px; font-size: .8rem; letter-spacing: .02em; }
.cab-dizimo:hover { background: #C8AD6E; }
.menu ul a[href="/dizimo"] { color: var(--dourado-escuro); }

.dizimo-capa { background: linear-gradient(180deg, #FBF6EA, var(--marfim)); border-bottom: 1px solid var(--linha); }
.dizimo-capa-grade { display: grid; grid-template-columns: 1.15fr .85fr; gap: clamp(28px, 5vw, 64px); align-items: center; padding: clamp(36px, 5vw, 64px) 0; }
.dizimo-capa h1 { margin: 6px 0 18px; font-size: clamp(2.2rem, 4.6vw, 3.6rem); max-width: 18ch; }
.versiculo { margin: 0; padding: 4px 0 4px 20px; border-left: 3px solid var(--dourado); }
.versiculo p { margin: 0; font: italic 500 clamp(1.35rem, 2.2vw, 1.75rem)/1.35 var(--serif); color: #7A2A3A; }
.versiculo footer { margin-top: 6px; font-size: .88rem; letter-spacing: .12em; text-transform: uppercase; color: var(--dourado-escuro); font-weight: 700; }
.dizimo-arte { margin: 0; }
.dizimo-arte img { width: 100%; max-width: 440px; margin-left: auto; border-radius: 6px; box-shadow: 0 24px 50px -24px rgba(23,58,101,.45); border: 3px solid #fff; }
@media (max-width: 820px) { .dizimo-capa-grade { grid-template-columns: 1fr; } .dizimo-arte img { margin: 0 auto; max-width: 360px; } }
.texto-dizimo p:first-child::first-letter { float: left; font: 600 4.2rem/.8 var(--serif); color: #7A2A3A; margin: 8px 10px 0 0; }
.caixa-dizimo .botao { display: inline-flex; }

.faixa-dizimo { background: linear-gradient(120deg, #FBF6EA, var(--dourado-claro)); padding: clamp(44px, 6vw, 72px) 0; border-top: 1px solid var(--linha); }
.faixa-dizimo-grade { display: grid; grid-template-columns: 300px 1fr; gap: clamp(24px, 4vw, 56px); align-items: center; }
.faixa-dizimo img { width: 100%; border-radius: 6px; border: 3px solid #fff; box-shadow: 0 18px 40px -22px rgba(23,58,101,.5); }
.faixa-dizimo h2 { font-size: clamp(1.8rem, 3.2vw, 2.5rem); }
.faixa-dizimo p { max-width: 54ch; color: var(--texto); }
.faixa-dizimo .acoes { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 18px; }
@media (max-width: 700px) { .faixa-dizimo-grade { grid-template-columns: 1fr; } .faixa-dizimo img { max-width: 260px; } }

.faixa-ajudar { display: flex; align-items: center; justify-content: space-between; gap: 20px; flex-wrap: wrap; margin-top: 44px; padding: 22px 24px; background: var(--marfim); border-left: 4px solid var(--dourado); border-radius: 4px; }
.faixa-ajudar strong { display: block; font: 600 1.4rem var(--serif); color: var(--azul); }
.faixa-ajudar span { color: var(--texto-suave); }

/* Área da Pascom: acesso discreto ao painel, no rodapé */
.rodape .pascom-final { display: inline-flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.rodape .acesso-pascom { display: inline-flex; align-items: center; gap: 6px; padding: 5px 12px; border: 1px solid rgba(183,154,88,.55); border-radius: 999px; color: var(--dourado) !important; font-weight: 600; letter-spacing: .02em; }
.rodape .acesso-pascom:hover, .rodape .acesso-pascom:focus-visible { background: rgba(183,154,88,.14); text-decoration: none; }
.rodape .acesso-pascom svg { width: 14px; height: 14px; }
dialog.janela-acesso { border: 0; border-top: 4px solid var(--dourado); border-radius: var(--raio, 6px); padding: 0; width: min(400px, calc(100vw - 32px)); background: #fff; color: var(--texto, #1f2a37); box-shadow: 0 24px 60px rgba(8,18,34,.45); }
dialog.janela-acesso::backdrop { background: rgba(8, 18, 34, .72); }
.janela-form { position: relative; display: grid; gap: 6px; padding: 34px 28px 26px; text-align: left; }
.janela-form h2 { color: var(--azul); font-size: 1.7rem; margin: 4px 0 0; text-align: center; }
.janela-icone { justify-self: center; display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%; background: var(--azul-claro); color: var(--azul); }
.janela-icone svg { width: 22px; height: 22px; }
.janela-sub { margin: 0 0 14px; text-align: center; color: var(--texto-suave); font-size: .92rem; }
.janela-form label { font-weight: 600; font-size: .9rem; color: var(--azul-escuro); margin-top: 6px; }
.janela-form input { font: inherit; padding: 11px 12px; border: 1px solid var(--linha); border-radius: var(--raio, 6px); width: 100%; box-sizing: border-box; }
.janela-form input:focus { outline: 3px solid var(--dourado); outline-offset: 1px; border-color: var(--azul); }
.janela-entrar { margin-top: 16px; width: 100%; justify-content: center; cursor: pointer; border: 0; }
.janela-nota { margin: 12px 0 0; font-size: .82rem; color: var(--texto-suave); text-align: center; }
.janela-fechar { position: absolute; top: 10px; right: 10px; width: 36px; height: 36px; border: 0; border-radius: 50%; background: none; color: var(--texto-suave); cursor: pointer; display: grid; place-items: center; }
.janela-fechar:hover, .janela-fechar:focus-visible { background: var(--azul-claro); color: var(--azul); }
@media print { dialog.janela-acesso { display: none !important; } }
.rodape .autoria { color: #8FA2BB; font-size: .82rem; }

/* Coral no menu principal (mesma cor dos demais itens, com a nota musical) */
.menu-lado a.item-destaque, .menu ul a.item-destaque { display: inline-flex; align-items: center; gap: 5px; }
.menu ul a.item-destaque { display: flex; }
.menu-lado a.item-destaque svg, .menu ul a.item-destaque svg { width: 14px; height: 14px; flex-shrink: 0; }

/* Texto justificado em todo o conteúdo do site (parágrafos, listas e citações).
   A hifenização evita espaços largos entre palavras; a última linha fica alinhada à esquerda.
   Blocos que já são centralizados por desenho continuam centralizados. */
main :is(p, li, dd, blockquote) { text-align: justify; hyphens: auto; -webkit-hyphens: auto; }
.coral-capa :is(p, li), .vazio :is(p, li), .galeria-clero li, .data-bloco * { text-align: center; hyphens: manual; -webkit-hyphens: manual; }
main :is(.trilha, .menu, .acoes, nav) li { text-align: left; hyphens: manual; -webkit-hyphens: manual; }

/* Linha de contatos do cabeçalho: espaçamento menor para caber telefone, e-mail, redes, dízimo e busca numa linha só */
.cab-info-dir { gap: 12px; flex-wrap: nowrap; }
.cab-info-dir .cab-email span { display: none; }  /* e-mail como ícone (endereço aparece ao passar o mouse e no rodapé) */
.cab-info-dir .cab-busca { flex-shrink: 0; }

/* Fotos no corpo das notícias: fotos verticais não passam da altura da tela; proporção preservada */
.texto figure img { display: block; max-width: 100%; max-height: min(78vh, 760px); width: auto; height: auto; margin: 0 auto; }
.texto figure figcaption { text-align: center; }

/* Janela "Área da Pascom": segundo acesso (cadastro de ministros e catequistas) */
.janela-outro { display: grid; gap: 8px; margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--linha); text-align: center; }
.janela-outro > span { font: 700 .72rem var(--sans); letter-spacing: .12em; text-transform: uppercase; color: var(--dourado-escuro); }
.janela-outro .botao { justify-content: center; width: 100%; box-sizing: border-box; }
.janela-outro small { color: var(--texto-suave); font-size: .8rem; }

/* Abertura da página inicial: arte de Nossa Senhora da Penha com a Igreja Matriz (sem texto por cima) */
.visualmente-oculto { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.hero.abertura { background: #E9D2A4; }
.hero.abertura::before { display: none; }
.abertura picture { display: block; }
.abertura-img { display: block; width: 100%; height: clamp(300px, 56.25vw, 78vh); object-fit: cover; object-position: 50% 40%; }
@media (max-width: 760px) { .abertura-img { height: clamp(260px, 62vw, 460px); object-position: 22% 40%; } }
.carrossel .slide:not(.abertura) { min-height: 100%; }
.controles-carrossel { background: rgba(15,40,72,.55); padding: 6px 10px; border-radius: 999px; backdrop-filter: blur(2px); }

/* Mensagem de boas-vindas do pároco */
.saudacao { background: var(--branco); padding-top: clamp(72px, 9vw, 104px); }
.saudacao-grade { display: grid; grid-template-columns: minmax(220px, 1fr) minmax(0, 2fr); gap: clamp(28px, 5vw, 72px); align-items: start; }
.saudacao-lado { position: sticky; top: 24px; }
.saudacao-foto { margin: 0 0 24px; width: 100%; max-width: 300px; aspect-ratio: 4 / 5; border-radius: 14px; overflow: hidden; border: 3px solid var(--dourado); box-shadow: 0 0 0 6px var(--branco), 0 0 0 7px rgba(183,154,88,.45), 0 14px 32px rgba(15,40,72,.16); background: #f1eef4; }
.saudacao-foto picture { display: block; width: 100%; height: 100%; }
.saudacao-foto img { width: 100%; height: 100%; object-fit: cover; object-position: center top; display: block; }
.saudacao-lado h2 { margin: 10px 0 0; font-size: clamp(1.9rem, 3.2vw, 2.6rem); }
.saudacao-texto .texto { max-width: 66ch; }
.saudacao-texto .texto p:first-child { font: italic 500 1.3rem var(--serif); color: var(--azul); }
.saudacao .assinatura { margin: 8px 0 0; display: grid; gap: 2px; }
.saudacao .assinatura strong { font: 600 1.35rem var(--serif); color: var(--azul); }
.saudacao .assinatura span { font-size: .85rem; letter-spacing: .14em; text-transform: uppercase; color: var(--dourado-escuro); font-weight: 700; }
.saudacao-oracao { margin: 28px 0 0; padding: 4px 0 4px 20px; border-left: 3px solid var(--dourado); max-width: 62ch; }
.saudacao-oracao p { margin: 0; font: italic 500 1.15rem/1.55 var(--serif); color: var(--azul); text-align: left !important; hyphens: manual !important; }
.saudacao .acoes { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 28px; }
@media (max-width: 820px) {
  .saudacao-grade { grid-template-columns: 1fr; }
  .saudacao-lado { position: static; display: block; }
  .saudacao-foto { width: min(240px, 66%); max-width: none; margin: 0 0 24px; }
  .saudacao-lado h2 { font-size: 1.6rem; }
}
.hero.abertura { display: flex; flex-direction: column; }
.abertura picture { flex: 1; display: flex; }
.abertura-img { flex: 1; height: auto; min-height: clamp(300px, 56.25vw, 78vh); }
@media (max-width: 760px) { .abertura-img { min-height: clamp(260px, 62vw, 460px); } }
/* A arte cobre todo o slide, qualquer que seja a altura dos outros destaques do carrossel */
.hero.abertura { display: block; position: relative; min-height: clamp(300px, 56.25vw, 78vh); }
.abertura picture { position: absolute; inset: 0; display: block; }
.abertura-img { position: absolute; inset: 0; width: 100%; height: 100%; min-height: 0; object-fit: cover; object-position: 50% 35%; }
@media (max-width: 760px) { .hero.abertura { min-height: clamp(300px, 80vw, 520px); } .abertura-img { min-height: 0; object-position: 24% 30%; } }

/* Abertura em faixa (3:1) com texto na própria arte: a imagem aparece inteira, sem cortes.
   O fundo repete o azul da base da arte, para emendar com a altura dos demais destaques do carrossel. */
.hero.abertura { min-height: 0; background: #023D6E; display: block; }
.abertura picture { position: static; display: block; }
.abertura-img { position: static; inset: auto; width: 100%; height: auto; min-height: 0; aspect-ratio: 1600 / 533; object-fit: contain; }
@media (max-width: 760px) { .hero.abertura { min-height: 0; } .abertura-img { min-height: 0; } }

/* Faixa de abertura (fora do carrossel): sempre inteira, sem cortes */
.abertura-faixa { position: relative; background: #023D6E; line-height: 0; }
.abertura-faixa picture { display: block; }
.abertura-faixa .abertura-img { display: block; width: 100%; height: auto; aspect-ratio: 1600 / 533; }
.abertura-faixa + .rapidos { margin-top: 0; padding-top: 18px; background: #023D6E; }
.abertura-faixa + .rapidos ul { position: relative; top: 26px; }
.abertura-faixa + .carrossel .hero .wrap { padding-top: clamp(48px, 7vw, 88px); }

/* =====================================================================
   Página inicial — abertura renovada (nov/2026)
   Faixa de arte → faixa azul com acessos rápidos → boas-vindas → Em destaque
   ===================================================================== */
@keyframes surgir { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@keyframes revelar { from { opacity: 0; transform: scale(1.025); } to { opacity: 1; transform: none; } }
.abertura-faixa .abertura-img { animation: revelar 1.1s cubic-bezier(.2,.7,.2,1) both; }

/* Faixa azul que continua a base da arte */
.rapidos.rapidos-faixa { margin-top: 0; padding: 6px 0 clamp(44px, 6vw, 64px); background: linear-gradient(180deg, #023D6E 0%, var(--azul-escuro) 100%); position: relative; z-index: 1; }
.abertura-faixa + .rapidos.rapidos-faixa { padding-top: 6px; background: linear-gradient(180deg, #023D6E 0%, var(--azul-escuro) 100%); }
.rapidos-faixa .ornamento { display: flex; align-items: center; justify-content: center; gap: 14px; margin: 0 auto clamp(22px, 3vw, 32px); color: var(--dourado); }
.rapidos-faixa .ornamento i { display: block; width: min(120px, 22vw); height: 1px; background: linear-gradient(90deg, transparent, var(--dourado)); }
.rapidos-faixa .ornamento i:last-child { background: linear-gradient(90deg, var(--dourado), transparent); }
.rapidos-faixa .ornamento b { font-size: .9rem; font-weight: 400; }
.rapidos-faixa ul, .abertura-faixa + .rapidos-faixa ul { position: static; top: auto; display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; background: none; box-shadow: none; border: 0; }
.rapidos-faixa li + li { border: 0; }
.rapidos-faixa li { animation: surgir .7s cubic-bezier(.2,.7,.2,1) both; }
.rapidos-faixa li:nth-child(2) { animation-delay: .08s; } .rapidos-faixa li:nth-child(3) { animation-delay: .16s; } .rapidos-faixa li:nth-child(4) { animation-delay: .24s; }
.rapidos-faixa a { gap: 16px; padding: 20px 20px; border-radius: 14px; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.14); color: #fff; transition: background .25s ease, transform .25s ease, border-color .25s ease; }
.rapidos-faixa a:hover, .rapidos-faixa a:focus-visible { background: rgba(255,255,255,.12); border-color: rgba(183,154,88,.7); transform: translateY(-3px); }
.rapidos-faixa svg { width: 46px; height: 46px; padding: 11px; border-radius: 50%; color: var(--dourado); border: 1px solid rgba(183,154,88,.55); background: rgba(183,154,88,.08); box-sizing: border-box; }
.rapidos-faixa strong { color: #fff; font-size: 1.3rem; }
.rapidos-faixa span { color: #B9C7DA; text-align: left; }
@media (max-width: 900px) { .rapidos-faixa ul, .abertura-faixa + .rapidos-faixa ul { grid-template-columns: 1fr 1fr; gap: 10px; } .rapidos-faixa li:nth-child(n+3) { border-top: 0; } }
@media (max-width: 480px) { .rapidos-faixa a { padding: 14px 12px; gap: 10px; border-radius: 12px; } .rapidos-faixa svg { width: 38px; height: 38px; padding: 9px; } .rapidos-faixa strong { font-size: 1.05rem; } }

/* Boas-vindas logo depois da faixa azul */
.rapidos-faixa + .saudacao { padding-top: clamp(64px, 8vw, 96px); }

/* Em destaque — estilo editorial */
.destaques .titulo-secao { border-bottom: 1px solid var(--linha); padding-bottom: 18px; }
.destaques-grade { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr); gap: clamp(28px, 4vw, 56px); align-items: start; }
.destaque-principal { display: block; text-decoration: none; color: inherit; }
.destaque-foto { position: relative; aspect-ratio: 16 / 10; border-radius: 16px; overflow: hidden; background: var(--azul-claro); box-shadow: 0 18px 40px -18px rgba(15,40,72,.45); }
.destaque-foto::after { content: ''; position: absolute; inset: auto 0 0 0; height: 4px; background: var(--dourado); }
.destaque-foto img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .8s cubic-bezier(.2,.7,.2,1); }
.destaque-principal:hover .destaque-foto img { transform: scale(1.04); }
.destaque-vazio { display: grid; place-items: center; height: 100%; color: var(--dourado); font-size: 3rem; }
.destaque-texto { padding: 26px 4px 0; }
.destaque-meta { display: block; font: 700 .74rem var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--dourado-escuro); }
.destaque-texto h3 { margin: 12px 0 12px; font-size: clamp(1.7rem, 2.8vw, 2.35rem); line-height: 1.15; color: var(--azul); transition: color .2s; }
.destaque-principal:hover h3 { color: var(--azul-escuro); }
.destaque-texto p { margin: 0; color: var(--texto-suave); font-size: 1.05rem; max-width: 62ch; text-align: left !important; hyphens: manual !important; }
.destaque-ler { display: inline-flex; gap: 8px; margin-top: 18px; font: 700 .92rem var(--sans); color: var(--azul); border-bottom: 2px solid var(--dourado); padding-bottom: 3px; }
.destaque-principal:hover .destaque-ler span { transform: translateX(3px); }
.destaque-ler span { transition: transform .2s; }
.destaque-lista { list-style: none; margin: 0; padding: 0; display: grid; }
.destaque-lista li { text-align: left !important; }
.destaque-lista li + li { border-top: 1px solid var(--linha); }
.destaque-lista a { display: grid; grid-template-columns: 112px minmax(0, 1fr); gap: 18px; align-items: center; padding: 18px 0; text-decoration: none; color: inherit; }
.destaque-lista li:first-child a { padding-top: 0; }
.mini-foto { display: grid; place-items: center; aspect-ratio: 1; border-radius: 12px; overflow: hidden; background: var(--azul-claro); color: var(--dourado); font-size: 1.4rem; }
.mini-foto img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.destaque-lista a:hover .mini-foto img { transform: scale(1.06); }
.mini-texto strong { display: block; margin-top: 6px; font: 600 1.2rem/1.25 var(--serif); color: var(--azul); }
.destaque-lista a:hover strong { color: var(--azul-escuro); text-decoration: underline; text-decoration-color: var(--dourado); text-underline-offset: 4px; }
@media (max-width: 900px) { .destaques-grade { grid-template-columns: 1fr; } .destaque-lista { border-top: 1px solid var(--linha); padding-top: 18px; } }
@media (max-width: 480px) { .destaque-lista a { grid-template-columns: 84px minmax(0, 1fr); gap: 14px; } .mini-texto strong { font-size: 1.08rem; } }
@media (prefers-reduced-motion: reduce) { .abertura-faixa .abertura-img, .rapidos-faixa li { animation: none; } }
.saudacao { padding-bottom: clamp(40px, 5vw, 64px); }
.saudacao + .secao, .saudacao + .destaques { padding-top: clamp(24px, 3vw, 40px); }
/* Caixas laterais: textos curtos ficam alinhados à esquerda (justificar abre espaços largos) */
.lateral :is(p, li) { text-align: left; hyphens: manual; -webkit-hyphens: manual; }
