/* Estilos do site. Mobile-first: o básico vale para o celular e cada faixa maior recompõe o que precisa. */

/* ---------- Base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: calc(var(--altura-cabecalho) + var(--esp-4)); }
body {
  margin: 0;
  background: var(--fundo);
  color: var(--texto);
  font-family: var(--fonte-texto);
  font-size: var(--fs-base);
  line-height: var(--lh-texto);
  overflow-wrap: break-word;
  min-height: 100vh; min-height: 100dvh;
  display: flex; flex-direction: column;
}
main { flex: 1 0 auto; }
img, svg { max-width: 100%; }
img { height: auto; display: block; }
h1, h2, h3 { line-height: var(--lh-titulo); margin: 0 0 var(--esp-3); font-weight: 500; }
p { margin: 0 0 var(--esp-4); }
ul { margin: 0; padding: 0; list-style: none; }
a { color: var(--link); text-underline-offset: 0.25em; }
a:hover { text-decoration-thickness: 2px; }
address { font-style: normal; }
main:focus { outline: none; }

:focus-visible { outline: 3px solid var(--foco); outline-offset: 3px; border-radius: 2px; }
.escuro { --foco: var(--areia); --link: var(--areia); }

.so-leitor {
  position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden;
  clip-path: inset(50%); white-space: nowrap; border: 0;
}
.pular {
  position: absolute; left: var(--esp-4); top: -4rem; z-index: 100;
  background: var(--navy); color: var(--white); padding: var(--esp-3) var(--esp-4);
  border-radius: var(--raio); font-weight: 600;
}
.pular:focus { top: var(--esp-2); outline-color: var(--areia); }

/* Sem JavaScript, o que só existe com JavaScript fica escondido */
html:not(.js) .so-js { display: none !important; }

[data-contraste="alto"] a { text-decoration: underline; }

.conteiner { width: 100%; max-width: var(--conteiner-max); margin-inline: auto; padding-inline: var(--gutter); }
.secao { padding-block: var(--secao-y); }
.titulo-pagina { font-family: var(--fonte-editorial); font-size: var(--fs-secao); font-weight: 600; } /* título de página: mesmo tamanho e peso dos de seção (22 a 26 px), decisão da Poliana em 12/11/2026 */
section[id] { scroll-margin-top: calc(var(--altura-cabecalho) + var(--esp-4)); } /* âncoras não ficam atrás do cabeçalho fixo */
.titulo-secao { font-family: var(--fonte-editorial); font-size: var(--fs-secao); font-weight: 600; } /* títulos de seção: EB Garamond 26 px, peso 600 (decisão de 11/11/2026) */
.rotulo { color: var(--detalhe); font-size: 0.9375rem; font-weight: 600; margin-bottom: var(--esp-1); } /* 15 px, peso 600 */

/* ---------- Faixa do topo (cinza claro) ---------- */
.faixa { position: relative; background: var(--cinza-suave); color: var(--texto); font-size: var(--fs-pequeno); z-index: 40; }
[data-contraste="alto"] .faixa { border-bottom: 1px solid #000; }
.faixa__interno { display: flex; align-items: center; justify-content: space-between; gap: var(--esp-3); min-height: 3rem; }
.faixa a { color: inherit; text-decoration: none; }
.faixa__cultos { display: flex; flex-wrap: wrap; gap: 0 var(--esp-5); flex: 1; min-width: 0; }
.faixa__culto a { display: inline-block; padding-block: var(--esp-2); }
.faixa__culto a:hover .faixa__titulo { text-decoration: underline; }
.faixa__culto { position: relative; }
.faixa__culto[hidden] { display: none; }
.faixa__cultos.lado-a-lado .faixa__culto + .faixa__culto::before { content: ""; position: absolute; left: calc(var(--esp-5) / -2); top: 50%; width: 1px; height: 1.25rem; transform: translateY(-50%); background: rgb(23 43 70 / 0.35); }
[data-contraste="alto"] .faixa__cultos.lado-a-lado .faixa__culto + .faixa__culto::before { background: #000; }
.faixa__quando { color: var(--blue); font-weight: 500; }
.faixa__quando--agora { color: var(--white); background: var(--blue); padding: 0 var(--esp-2); border-radius: 999px; }
.faixa__sep { margin-inline: var(--esp-1); color: var(--texto-suave); }
.faixa__titulo--curto { display: none; }
.faixa__unidade { font-weight: 600; }
.faixa__acoes { display: flex; align-items: center; gap: var(--esp-1); position: relative; }
.faixa-fade { animation: faixa-entra 0.4s ease; }
.faixa__cultos:not(:has([hidden])) .faixa-fade { animation: none; }
@keyframes faixa-entra { from { opacity: 0; } to { opacity: 1; } }

/* No celular, a faixa mostra o nome curto e as redes sociais saem */
@media (max-width: 47.99rem) {
  .faixa__titulo--longo { display: none; }
  .faixa__titulo--curto { display: inline; }
  .faixa .redes { display: none; }
  .faixa__cultos { gap: 0; }
}

/* Controles de acessibilidade: texto simples, sem caixa; o estado aparece como ✓ e fundo suave */
.faixa__abrir, .controle {
  min-height: var(--alvo); padding: 0 var(--esp-3);
  background: transparent; color: var(--texto); font: inherit; font-weight: 400;
  border: 0; border-radius: var(--raio); cursor: pointer;
}
.faixa__abrir { text-decoration: underline; text-underline-offset: 0.25em; text-decoration-thickness: 1px; margin-block: var(--esp-1); }
.faixa__abrir::after { content: ""; display: inline-block; width: 0.45em; height: 0.45em; margin: -0.2em 0 0 0.5em; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(45deg); vertical-align: middle; transition: transform 0.15s; }
.faixa__abrir[aria-expanded="true"]::after { transform: rotate(-135deg); margin-top: 0.1em; }
.faixa__abrir:hover, .controle:hover { background: rgb(23 43 70 / 0.08); }
.faixa__abrir[aria-expanded="true"], .controle[aria-pressed="true"] { background: rgb(23 43 70 / 0.12); }
.controle[aria-pressed="true"]::before { content: "✓ "; }
.controles { display: none; }
.faixa__abrir[aria-expanded="true"] + .controles {
  display: flex; flex-direction: column; gap: 0;
  position: absolute; right: 0; top: calc(100% + var(--esp-1)); width: min(16rem, calc(100vw - 2 * var(--gutter)));
  background: var(--white); padding: var(--esp-2); border: 1px solid var(--linha); border-radius: var(--raio);
  box-shadow: 0 8px 24px rgb(23 43 70 / 0.15);
}
.faixa__abrir[aria-expanded="true"] + .controles .controle { text-align: left; }

@media (min-width: 70rem) {
  .faixa__abrir { display: none; }
  .controles, .faixa__abrir[aria-expanded] + .controles { display: flex; flex-direction: row; position: static; width: auto; padding: 0; border: 0; box-shadow: none; background: none; gap: 0; }
  .controle { padding: 0 var(--esp-2); font-size: var(--fs-pequeno); margin-block: var(--esp-1); }
}

/* Redes: ícones oficiais coloridos */
.redes { display: flex; gap: 0; }
.redes a { display: inline-flex; align-items: center; justify-content: center; width: var(--alvo); height: var(--alvo); }
.redes svg, .redes img { width: 1.25rem; height: 1.25rem; }
.redes a:hover { opacity: 0.8; }

/* ---------- Cabeçalho ---------- */
.cabecalho { position: sticky; top: 0; z-index: 30; background: var(--superficie); border-bottom: 1px solid var(--linha); transition: box-shadow 0.2s; }
.cabecalho.compacto { box-shadow: var(--sombra); }
.cabecalho__interno { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--esp-2) var(--esp-4); min-height: var(--altura-cabecalho); padding-block: var(--esp-2); }
.cabecalho__logo { display: block; flex: none; }
.cabecalho__logo img { width: clamp(11rem, 58vw, 15rem); height: auto; } /* celular e tablet (menu recolhido): maior em 13/11/2026 (era 10 a 12rem; em 390 px: 179 > 203 > 226 px); 240 px no tablet e 256 px no computador, sem degrau entre eles */
@media (min-width: 75rem) { .cabecalho__logo img { width: 16rem; } } /* era 17rem; menor para dar respiro ao menu de oito itens (12/11/2026) */
.cabecalho__acoes { display: flex; align-items: center; gap: var(--esp-2); }


.menu__botao {
  min-height: var(--alvo); padding: 0 var(--esp-4);
  background: var(--navy); color: var(--white); font: inherit; font-weight: 500;
  border: 0; border-radius: var(--raio); cursor: pointer;
}
[data-contraste="alto"] .menu__botao { background: #000; }

/* Menu em lista simples. Sem JavaScript fica sempre aberto; com JavaScript abre pelo botão */
.menu { order: 3; flex-basis: 100%; }
.menu__lista { display: flex; flex-direction: column; padding-bottom: var(--esp-3); }
.menu a { display: flex; align-items: center; min-height: var(--alvo); padding: 0 var(--esp-2); color: var(--texto); text-decoration: none; font-weight: 400; border-top: 1px solid var(--linha); }
.menu a:hover { color: var(--detalhe); text-decoration: none; } /* hover: só a troca de cor */
.menu a[aria-current="page"] { font-weight: 600; } /* página atual: só o negrito (o peso já diferencia sem depender de cor) */
.js .menu { display: none; }
.js .menu.aberto { display: block; }

/* Menu aberto no computador. Com "texto maior" os oito itens só cabem em uma linha a partir de 90rem; antes disso o menu fica atrás do botão Menu */
@media (min-width: 75rem) {
  html:not([data-texto="grande"]) .cabecalho__acoes { display: none; } /* só abriga o botão Menu, que não existe no computador */
  html:not([data-texto="grande"]) .menu__botao { display: none; }
  html:not([data-texto="grande"]) .menu, html.js:not([data-texto="grande"]) .menu { display: block; order: 0; flex: 1; flex-basis: auto; }
  html:not([data-texto="grande"]) .menu__lista { flex-direction: row; justify-content: flex-end; padding: 0; gap: 0; }
  html:not([data-texto="grande"]) .menu a { border: 0; padding: 0 0.625rem; font-size: 0.9375rem; white-space: nowrap; border-radius: 0; }
}
@media (min-width: 90rem) {
  html[data-texto="grande"] .cabecalho__acoes { display: none; } /* só abriga o botão Menu, que não existe no computador */
  html[data-texto="grande"] .menu__botao { display: none; }
  html[data-texto="grande"] .menu, html.js[data-texto="grande"] .menu { display: block; order: 0; flex: 1; flex-basis: auto; }
  html[data-texto="grande"] .menu__lista { flex-direction: row; justify-content: flex-end; padding: 0; gap: 0; }
  html[data-texto="grande"] .menu a { border: 0; padding: 0 0.625rem; font-size: 0.9375rem; white-space: nowrap; border-radius: 0; }
}

/* ---------- Rodapé ---------- */
.rodape { background: var(--fundo-escuro); color: var(--sobre-escuro); font-size: 0.875rem; line-height: 1.45; } /* 14 px: o mínimo do projeto */
.rodape a { color: var(--sobre-escuro); text-decoration: none; }
.rodape a:hover { color: var(--areia); text-decoration: none; }
.rodape__interno { display: grid; gap: var(--esp-5) var(--esp-6); padding-block: 2.5rem; }
.rodape__marca { display: flex; flex-direction: column; align-items: center; text-align: center; }
.rodape__logo { display: block; width: 14rem; max-width: 100%; aspect-ratio: 14 / 9.7; overflow: hidden; border-radius: 0.5rem; } /* link para a página inicial; a caixa do link abraça só o logo visível (o arquivo oficial tem margem vazia em cima e embaixo, escondida aqui sem mexer no logo), e o contorno de foco fica justo */
.rodape__logo img { display: block; width: 100%; height: auto; margin-top: -10.7%; }
.rodape__slogan { margin: 0 0 var(--esp-1); position: relative; font-family: var(--fonte-editorial); font-style: italic; font-weight: 500; font-size: 1.125rem; color: var(--areia); }
.rodape__titulo { font-family: var(--fonte-editorial); font-size: 1.1875rem; color: var(--detalhe-escuro); font-weight: 500; margin-bottom: var(--esp-2); } /* 19 px, alinha com o slogan */
.rodape__lista { display: grid; gap: 0; }
.rodape__lista a { display: inline-flex; align-items: center; min-height: 1.625rem; }
@media (pointer: coarse) { .rodape__lista a, .rodape__legais a { min-height: var(--alvo); } }
.rodape__lista--enderecos { gap: var(--esp-3); max-width: 19rem; }
.rodape__lista--enderecos address { color: var(--sobre-escuro-suave); margin-block: 0.125rem; }
.rodape__lista--enderecos strong { font-weight: 400; } /* Sede/Leste: o destaque vem da cor (branco), não do peso */
.rodape__acao { gap: var(--esp-2); color: var(--areia) !important; font-weight: 400; }
.rodape__acao .seta { flex: none; transition: transform 0.15s; }
.rodape__acao:hover { text-decoration: none !important; }
.rodape__acao:hover .seta { transform: translateX(3px); }
@media (prefers-reduced-motion: reduce) { .rodape__acao .seta { transition: none; } }
.redes--rodape { justify-content: center; gap: var(--esp-2); }
.redes--rodape svg, .redes--rodape img { width: 1.625rem; height: 1.625rem; }
.rodape__base { border-top: 1px solid rgb(255 255 255 / 0.2); }
.rodape__base-interno { display: flex; flex-direction: column; gap: var(--esp-2); padding-block: var(--esp-4); font-size: var(--fs-pequeno); }
.rodape__legais { display: flex; flex-wrap: wrap; gap: 0 var(--esp-5); }
.rodape__legais a { display: inline-flex; align-items: center; min-height: 2rem; }
.rodape__credito { margin: 0; color: var(--sobre-escuro-suave); }

@media (min-width: 40rem) {
  .rodape__interno { grid-template-columns: repeat(2, 1fr); }
  .rodape__marca { grid-column: 1 / -1; }
}
@media (min-width: 64rem) {
  .rodape__interno { grid-template-columns: repeat(4, auto); justify-content: space-between; align-items: start; }
  .rodape__marca { grid-column: auto; }
  .rodape__base-interno { flex-direction: row; justify-content: space-between; align-items: center; }
  .rodape__legais { display: contents; } /* os 3 links e o crédito viram 4 itens distribuídos por igual */
}


/* ---------- Componentes ---------- */
.botao {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--esp-2);
  min-height: var(--alvo); padding: 0 var(--esp-5);
  background: var(--navy); color: var(--white); font: inherit; font-weight: 500; text-decoration: none;
  border: 1px solid var(--navy); border-radius: var(--raio); cursor: pointer;
}
.botao:hover { background: var(--blue); border-color: var(--blue); }
.botao--secundario { background: transparent; color: var(--navy); border-color: var(--navy); }
.botao--secundario:hover { background: var(--navy); color: var(--white); }
.escuro .botao { background: var(--white); color: var(--blue); border-color: var(--white); } /* sobre fundo escuro: botão branco com texto azul (7,3:1), leve */
.escuro .botao:hover { background: var(--cinza-suave); border-color: var(--cinza-suave); } /* texto azul sobre #ECEFF3: 6,4:1 */
.escuro .botao--secundario { background: transparent; color: var(--white); border-color: rgb(255 255 255 / 0.7); }
.escuro .botao--secundario:hover { background: var(--white); color: var(--navy); }

.campo { margin-bottom: var(--esp-4); }
.campo label { display: block; font-weight: 600; margin-bottom: var(--esp-1); }
.campo__dica { display: block; font-size: var(--fs-pequeno); color: var(--texto-suave); margin-bottom: var(--esp-1); }
.campo input, .campo textarea, .campo select {
  width: 100%; min-height: var(--alvo); padding: var(--esp-2) var(--esp-3);
  font: inherit; color: var(--texto); background: var(--campo-fundo);
  border: 0; border-bottom: 2px solid var(--campo-linha); border-radius: 0;
}
[data-contraste="alto"] .campo input, [data-contraste="alto"] .campo textarea, [data-contraste="alto"] .campo select { border: 2px solid var(--campo-linha); }
.campo input:focus-visible, .campo textarea:focus-visible, .campo select:focus-visible { background: var(--white); outline-offset: 2px; }
.campo textarea { min-height: 7rem; resize: vertical; }
.campo--erro input, .campo--erro textarea { border-bottom-color: #9B1C1C; box-shadow: inset 4px 0 0 #9B1C1C; }
.campo__erro { display: block; margin-top: var(--esp-1); color: #9B1C1C; font-weight: 600; font-size: var(--fs-pequeno); }
[data-contraste="alto"] .campo__erro, [data-contraste="alto"] .campo--erro input { color: #7A0000; border-color: #7A0000; }
.status { padding: var(--esp-3) var(--esp-4); border-left: 2px solid var(--detalhe); background: var(--campo-fundo); }
.armadilha { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }

.cartao { background: var(--superficie); border: 1px solid var(--linha); border-radius: var(--raio); padding: var(--esp-5); }
.secao--branca .cartao { background: var(--off-white); }
.secao--alt .cartao { background: var(--white); }
.cartao h3 { font-size: 1.125rem; }

/* Unidade: ponto colorido mais o nome, nunca só a cor */
.unidade { display: inline-flex; align-items: center; gap: var(--esp-2); font-weight: 600; }
.unidade::before { content: ""; width: 0.625rem; height: 0.625rem; border-radius: 50%; background: var(--cor-sede); flex: none; }
.unidade--leste::before { background: var(--cor-leste); border-radius: 2px; transform: rotate(45deg); }

/* Página de estilos */
.guia h2 { font-size: var(--fs-secao); margin-top: var(--esp-7); padding-bottom: var(--esp-2); border-bottom: 1px solid var(--linha); }
.guia__grade { display: grid; gap: var(--esp-4); grid-template-columns: repeat(auto-fill, minmax(11rem, 1fr)); }
.amostra { border: 1px solid var(--linha); border-radius: var(--raio); overflow: hidden; font-size: var(--fs-pequeno); background: var(--superficie); }
.amostra__cor { height: 4.5rem; }
.amostra__texto { padding: var(--esp-2) var(--esp-3); }
.guia__linha { display: flex; flex-wrap: wrap; gap: var(--esp-3); align-items: center; margin-block: var(--esp-4); }
.guia__escuro { background: var(--fundo-escuro); color: var(--white); padding: var(--esp-5); border-radius: var(--raio); }
.hero-amostra { font-family: var(--fonte-editorial); font-style: italic; font-weight: 500; font-size: var(--fs-hero); line-height: 1.1; }
.guia .espaco { display: inline-block; height: 1rem; background: var(--detalhe); vertical-align: middle; }

/* ---------- Movimento ---------- */
[data-animacao="pausada"] *, [data-animacao="pausada"] *::before, [data-animacao="pausada"] *::after {
  animation: none !important; transition: none !important; scroll-behavior: auto !important;
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}

/* ---------- Seções da página ---------- */
.secao--alt { background: var(--off-white); }
.secao--branca { background: var(--white); }
.secao--escura { background: var(--fundo-escuro); color: var(--sobre-escuro); }
.secao__intro { max-width: 44rem; margin-bottom: var(--esp-5); }
.secao__acao { margin: var(--esp-5) 0 0; }
.versiculo { margin: var(--esp-5) 0; padding-left: var(--esp-4); border-left: 1px solid var(--detalhe); }
.versiculo blockquote { margin: 0; font-family: var(--fonte-editorial); font-style: italic; font-weight: 500; font-size: 1.25rem; line-height: 1.4; }
.versiculo blockquote p { margin: 0; }
.versiculo figcaption { margin-top: var(--esp-2); color: var(--detalhe); font-size: var(--fs-pequeno); font-weight: 500; }
.escuro .versiculo { border-color: var(--areia); }
/* Post-it de versículo (fundo amarelo clássico): mesma tipografia do .versiculo, só muda a moldura (retângulo reto, levemente inclinado, com sombra) */
.versiculo--postit { position: relative; box-sizing: border-box; width: 100%; max-width: 22rem; margin: var(--esp-2) auto; padding: var(--esp-6) var(--esp-5) var(--esp-5); border: 1px solid #DDD6C8; border-top: 3px double var(--gold); border-radius: 2px; background: #FFFFFF; color: #2B2B2B; box-shadow: 0 1px 2px rgb(23 43 70 / 0.08), 0 10px 24px rgb(23 43 70 / 0.12); }
/* Cartão de versículo no estilo de página de Bíblia: fundo branco, texto em EB Garamond reto (sem itálico), referência na mesma fonte e cor do texto. Texto #2B2B2B sobre branco: 14,5:1. */
.versiculo--postit blockquote { font-style: normal; font-weight: 400; font-size: 1.3rem; line-height: 1.55; color: #2B2B2B; }
.versiculo--postit figcaption { margin-top: var(--esp-3); font-family: var(--fonte-editorial); font-size: 1.05rem; font-weight: 400; color: #2B2B2B; text-align: right; }
[data-contraste="alto"] .versiculo--postit { border: 2px solid #000; box-shadow: none; color: #000; }
[data-contraste="alto"] .versiculo--postit blockquote, [data-contraste="alto"] .versiculo--postit figcaption { color: #000; }
.escuro .versiculo figcaption, .escuro .rotulo { color: var(--detalhe-escuro); }

/* ---------- 1. Hero (fundo branco; tamanhos do modelo antigo do Codex) ---------- */
.hero { --hero-avail: calc(100svh - 7.5rem); --hero-h: clamp(24rem, var(--hero-avail), 42rem); --foco: var(--white); --link: var(--white); position: relative; background: var(--fundo-escuro); color: var(--sobre-escuro); }
.hero__slides { display: block; }
.slide__interno { display: grid; gap: var(--esp-5); align-content: center; min-height: var(--hero-h); padding-block: var(--esp-6); }
.js .slide__interno { padding-bottom: 4.25rem; } /* espaço dos controles */
.slide[hidden] { display: none; }
.slide + .slide { border-top: 1px solid rgb(255 255 255 / 0.2); }
.js .slide + .slide { border-top: 0; }
.js .slide:not([hidden]) { animation: faixa-entra 0.5s ease; }

@media (min-width: 75rem) { .hero { --hero-avail: calc(100svh - 8.5rem); } } /* cabeçalho de 85 px no computador */
/* Boas-vindas: título grande em Garamond itálico (43–68 px no celular; 56–104 px a partir de 850 px) */
.slide__titulo { margin: 0 0 var(--esp-3); font-family: var(--fonte-editorial); font-style: italic; font-weight: 500; font-size: clamp(2.7rem, min(10vw, 10dvh), 4.25rem); line-height: 1.02; letter-spacing: -0.02em; }
.slide__titulo--video { font-family: var(--fonte-texto); font-style: normal; font-size: var(--fs-pagina); font-weight: 500; letter-spacing: 0; }
.slide__unidade { margin: 0 0 var(--esp-2); color: var(--sobre-escuro-suave); font-size: var(--fs-pequeno); font-weight: 500; letter-spacing: 0.04em; }
.slide__lead { max-width: 36rem; font-size: 1.0625rem; margin-bottom: var(--esp-4); }
.slide__texto { max-width: 42rem; }
.slide__texto .versiculo { margin-block: var(--esp-4); }
.hero .versiculo { border-left-color: rgb(255 255 255 / 0.6); }
.hero .versiculo figcaption { color: var(--sobre-escuro-suave); }
/* Botões do hero: brancos sobre o navy (sem areia) */
.hero .botao { background: var(--white); color: var(--navy); border-color: var(--white); }
.hero .botao:hover { background: var(--sobre-escuro-suave); border-color: var(--sobre-escuro-suave); }
.hero .botao--secundario { background: transparent; color: var(--white); border-color: rgb(255 255 255 / 0.7); }
.hero .botao--secundario:hover { background: var(--white); color: var(--navy); border-color: var(--white); }
.slide__texto .versiculo blockquote { font-size: 1.25rem; line-height: 1.35; }
.slide__botoes { display: flex; flex-wrap: wrap; gap: var(--esp-3); }
@media (min-width: 53.125rem) {
  .slide__titulo { font-size: clamp(3.5rem, min(6vw, calc(var(--hero-avail) * 0.145)), 6.5rem); }
  .slide__lead { font-size: clamp(1.0625rem, 1.25vw, 1.1875rem); }
  .slide__texto .versiculo blockquote { font-size: clamp(1.25rem, 1.45vw, 1.375rem); }
  .versiculo figcaption { font-size: var(--fs-pequeno); }
}

/* Espaço reservado para foto (provisório e visível para quem revisa; some quando a foto entra) */
.reserva-foto { display: flex; align-items: center; justify-content: center; text-align: center; padding: var(--esp-4); border: 1px dashed var(--texto-suave); color: var(--texto-suave); font-size: var(--fs-pequeno); background: repeating-linear-gradient(135deg, rgb(49 90 120 / 0.06) 0 0.75rem, transparent 0.75rem 1.5rem); }
.reserva-foto--escura { border-color: rgb(255 255 255 / 0.45); color: var(--sobre-escuro-suave); background: repeating-linear-gradient(135deg, rgb(255 255 255 / 0.05) 0 0.75rem, transparent 0.75rem 1.5rem); }
.reserva-foto span { max-width: 16rem; }
.slide__reserva { display: none; }

/* Agenda semanal: título enorme, dia e horário pequenos, nome do culto maior (hierarquia do protótipo "Proposta") */
.slide__titulo--agenda { margin: 0 0 var(--esp-3); font-weight: 500; line-height: 1; }
.slide__t1 { display: block; font-size: clamp(1.75rem, 3.1vw, 3.5rem); font-weight: 700; letter-spacing: -0.02em; text-transform: uppercase; line-height: 1.05; }
.slide__t2 { display: block; font-size: clamp(1.5rem, 2.7vw, 3rem); font-weight: 500; letter-spacing: -0.01em; text-transform: capitalize; line-height: 1.1; }
.slide__unidade-nome { display: block; margin-top: var(--esp-1); font-family: var(--fonte-editorial); font-style: italic; font-weight: 500; font-size: clamp(3.25rem, 7.2vw, 7rem); line-height: 0.9; letter-spacing: -0.02em; }
.slide__periodo { margin: var(--esp-3) 0 var(--esp-4); color: var(--sobre-escuro-suave); font-size: var(--fs-pequeno); }
.slide__cabeca { min-width: 0; }

.agenda { container-type: inline-size; margin: 0; padding: 0; list-style: none; --nome: 1.125rem; --linha-y: 0.4rem; }
.agenda--compacta { --nome: 1.0625rem; --linha-y: 0.25rem; }
.agenda--cortada { --nome: 1rem; --linha-y: 0.15rem; }
.agenda__dia { display: grid; grid-template-columns: 5.25rem minmax(0, 1fr); padding-block: 0.25rem; border-top: 1px solid rgb(255 255 255 / 0.25); }
.agenda__dia:last-child { border-bottom: 1px solid rgb(255 255 255 / 0.25); }
.agenda__rotulo { padding: calc(var(--linha-y) + 0.1rem) 0 0 var(--esp-2); line-height: 1.2; font-size: var(--fs-pequeno); color: var(--sobre-escuro-suave); font-variant-numeric: tabular-nums; }
.agenda__rotulo strong { display: block; font-size: 0.875rem; font-weight: 600; color: var(--sobre-escuro); letter-spacing: -0.01em; }
.agenda__cultos { margin: 0; padding: 0; list-style: none; }
.agenda__culto { display: grid; grid-template-columns: 3.25rem minmax(0, 1fr); gap: var(--esp-3); align-items: baseline; padding: var(--linha-y) var(--esp-2); }
.agenda__hora { font-size: 0.875rem; font-weight: 600; font-variant-numeric: tabular-nums; color: var(--sobre-escuro-suave); }
.agenda__nome { font-size: var(--nome); font-weight: 500; line-height: 1.3; }
.agenda__dia--passado .agenda__rotulo, .agenda__dia--passado .agenda__nome, .agenda__dia--passado .agenda__hora { color: #9FB2C8; font-weight: 400; }
.agenda__dia--passado .agenda__rotulo strong { color: #9FB2C8; font-weight: 600; }
.agenda__dia--hoje { background: rgb(255 255 255 / 0.09); box-shadow: inset 2px 0 0 var(--white); }
.t-curto { display: none; }
@container (max-width: 30rem) { .t-longo { display: none; } .t-curto { display: inline; } }

.agenda--celular { display: block; --nome: 1.0625rem; }
.agenda--normal, .agenda--compacta, .agenda--cortada { display: none; }
@media (min-width: 48rem) {
  .agenda--celular { display: none; }
  .agenda--normal, .agenda--compacta, .agenda--cortada { display: block; }
  .slide--agenda .slide__interno { grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); gap: clamp(1.5rem, 4vw, 4rem); align-items: center; }
  .slide--boas-vindas .slide__interno { grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: clamp(1.5rem, 4vw, 4rem); align-items: center; }
  .slide__reserva { display: flex; align-self: stretch; min-height: 14rem; }
}
/* Boas-vindas: no celular, sem versículo */
@media (max-width: 47.99rem) { .slide__texto .versiculo { display: none; } .slide__lead { font-size: 1rem; } }
/* Notebooks de pouca altura: o slide inteiro precisa caber em 554 px */
@media (max-height: 40rem) and (min-width: 48rem) {
  .hero { --hero-h: var(--hero-avail); }
  .slide__interno { padding-block: var(--esp-4); }
  .js .slide__interno { padding-bottom: 3.5rem; }
  .slide__lead { margin-bottom: var(--esp-3); font-size: 1rem; }
  .slide__texto .versiculo { margin-block: var(--esp-3); }
  .slide__texto .versiculo blockquote { font-size: 1.125rem; }
  .slide__periodo { margin-bottom: var(--esp-3); }
  .agenda { --linha-y: 0.2rem; --nome: 1.0625rem; }
  .slide__t1 { font-size: clamp(1.5rem, 2.6vw, 2.5rem); }
  .slide__t2 { font-size: clamp(1.25rem, 2.2vw, 2.25rem); }
  .slide__unidade-nome { font-size: clamp(3rem, 5.6vw, 5rem); }
}

/* Controles: só ícones, sem contorno; a pausa vem primeiro */
.hero__controles { position: absolute; z-index: 5; left: 0; right: 0; bottom: var(--esp-2); display: flex; align-items: center; justify-content: center; gap: var(--esp-1); }
.hero__pausa, .hero__seta { display: inline-flex; align-items: center; justify-content: center; width: var(--alvo); height: var(--alvo); padding: 0; background: transparent; color: var(--sobre-escuro); border: 0; border-radius: 50%; cursor: pointer; }
.hero__pausa:hover, .hero__seta:hover { background: rgb(255 255 255 / 0.14); }
.hero__pausa [hidden] { display: none; }
.hero__pontos { display: flex; }
/* Bolinhas como no protótipo aprovado: círculo vazio; o ativo se alonga e se preenche */
.hero__ponto { display: inline-flex; align-items: center; justify-content: center; width: 1.9rem; height: var(--alvo); padding: 0; background: none; border: 0; color: var(--sobre-escuro); cursor: pointer; }
.hero__ponto span { width: 8px; height: 8px; border: 1px solid currentColor; border-radius: 10px; transition: width 0.2s; }
.hero__ponto[aria-current="true"] span { width: 19px; background: currentColor; }

/* ---------- 2. Próximos Cultos e Eventos ---------- */
.proximos__topo { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: var(--esp-3) var(--esp-5); margin-bottom: var(--esp-5); }
.proximos__topo .titulo-secao { margin: 0; }
.filtros { display: flex; gap: var(--esp-1); }
.filtro { min-height: var(--alvo); padding: 0 var(--esp-4); background: transparent; color: var(--texto); font: inherit; border: 1px solid var(--controle-borda); border-radius: var(--raio); cursor: pointer; }
.filtro:hover { background: var(--campo-fundo); }
.filtro[aria-pressed="true"] { background: var(--navy); color: var(--white); border-color: var(--navy); }
.filtro[aria-pressed="true"]::before { content: "✓ "; }
.proximos__painel[hidden] { display: none; }
.proximos__vazio { padding: var(--esp-5); background: var(--campo-fundo); }
.proximos__lista { min-width: 0; }
.proximos__cartaz { display: none; }
.proximos__acao { margin: var(--esp-5) 0 0; }
.proximos__acao--canto { display: none; } /* só no computador/tablet; no celular o botão vem no fim da lista */

/* Controle junto ao cartaz (como no protótipo): pausa, anterior, bolinhas, próximo */
.cartaz-ctrl { display: flex; align-items: center; justify-content: center; gap: 0; width: 100%; max-width: 17rem; margin-top: var(--esp-1); color: var(--texto); }
.cartaz-ctrl__botao { display: inline-flex; align-items: center; justify-content: center; width: var(--alvo); height: var(--alvo); padding: 0; background: transparent; color: inherit; border: 0; border-radius: 50%; cursor: pointer; }
.cartaz-ctrl__botao:hover { background: var(--cinza-suave); }
.cartaz-ctrl__botao [hidden] { display: none; }
.cartaz-ctrl__pontos { display: flex; margin: 0; padding: 0; list-style: none; }
.cartaz-ctrl__ponto { display: inline-flex; align-items: center; justify-content: center; width: 1.5rem; height: var(--alvo); padding: 0; background: none; border: 0; color: inherit; cursor: pointer; }
.cartaz-ctrl__ponto span { width: 7px; height: 7px; border: 1px solid currentColor; border-radius: 10px; transition: width 0.2s; }
.cartaz-ctrl__ponto[aria-current="true"] span { width: 17px; background: currentColor; }
.dias { display: grid; gap: 0; margin: 0; padding: 0; list-style: none; }
.dia { display: grid; grid-template-columns: 5.5rem minmax(0, 1fr); gap: 0 var(--esp-3); padding-block: var(--esp-1); border-top: 1px solid var(--linha); }
.dia:last-child { border-bottom: 1px solid var(--linha); }
.dia__rotulo { margin: var(--esp-3) 0 0; font-size: 0.875rem; font-weight: 600; line-height: 1.2; letter-spacing: -0.01em; }
.dia--hoje .dia__rotulo { color: var(--blue); }
.dia__data { display: block; font-size: var(--fs-pequeno); font-weight: 400; color: var(--texto-suave); font-variant-numeric: tabular-nums; }
.dia__cultos { grid-column: 2; }
.dia__extra { grid-column: 2; margin: 0 0 var(--esp-2); padding-left: var(--esp-3); font-size: var(--fs-pequeno); color: var(--texto-suave); }
.culto-item { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: var(--esp-2); }
.culto { display: grid; grid-template-columns: 3.25rem minmax(0, 1fr); gap: 0 var(--esp-3); width: 100%; min-height: var(--alvo); padding: var(--esp-2) var(--esp-3); text-align: left; background: transparent; color: inherit; font: inherit; border: 0; border-left: 2px solid transparent; border-radius: 0; cursor: pointer; }
.culto:hover { background: var(--cinza-suave); }
.culto[aria-pressed="true"] { background: var(--white); border-left-color: var(--blue); }
.culto[aria-pressed="true"] .culto__nome { font-weight: 600; }
.culto__hora { font-size: 0.875rem; font-weight: 600; font-variant-numeric: tabular-nums; color: var(--blue); }
.culto__nome { min-width: 0; font-size: 1.0625rem; font-weight: 500; line-height: 1.3; }
.culto .unidade { grid-column: 2; font-size: var(--fs-pequeno); color: var(--texto-suave); font-weight: 500; }
.culto__agora { display: inline-block; padding: 0 var(--esp-2); background: var(--blue); color: var(--white); font-size: var(--fs-pequeno); font-weight: 500; border-radius: 999px; }
.unidade--leste::before { background: var(--cor-leste); }

/* Cartaz: sempre 4:5 (formato do Instagram), sem cortar nem distorcer.
   Com arte: <img> 800 × 1000 dentro do botão de zoom. Sem arte: cartão montado pelo sistema, na mesma moldura. */
.cartaz { margin: 0; }
.cartaz__moldura { aspect-ratio: 4 / 5; width: 100%; max-width: 17rem; }
.zoom { position: relative; display: block; width: 100%; height: 100%; padding: 0; background: var(--navy); border: 0; cursor: zoom-in; }
.zoom img { display: block; width: 100%; height: 100%; object-fit: contain; }
.zoom__icone { position: absolute; right: var(--esp-2); bottom: var(--esp-2); display: grid; place-items: center; width: 2.25rem; height: 2.25rem; background: var(--navy); color: var(--white); border-radius: var(--raio); }
.cartaz__dados { max-width: 17rem; margin-top: var(--esp-3); }
.cartaz__dados h3 { font-size: 1rem; margin-bottom: var(--esp-1); }
.cartaz__dados p { margin: 0 0 var(--esp-1); font-size: var(--fs-pequeno); }
.cartaz__versiculo { font-family: var(--fonte-editorial); font-style: italic; }

.cartao-culto { display: flex; flex-direction: column; gap: var(--esp-2); justify-content: flex-end; width: 100%; height: 100%; padding: var(--esp-5); color: var(--white); background: var(--cor-sede); }
.cartao-culto--leste { background: var(--cor-leste); }
.cartao-culto a { color: inherit; }
.cartao-culto p { margin: 0; }
.cartao-culto__unidade { font-size: var(--fs-pequeno); font-weight: 500; }
.cartao-culto__nome { margin: 0; font-size: 1.375rem; }
.cartao-culto__quando { font-weight: 500; }
.cartao-culto__endereco { font-size: var(--fs-pequeno); }
.cartaz-item[hidden] { display: none; }

/* Miniatura do cartaz na linha do culto (celular) */
.miniatura { display: block; width: 2.25rem; height: 2.8125rem; margin-right: var(--esp-2); padding: 0; background: var(--navy); border: 1px solid var(--linha); cursor: zoom-in; }
.miniatura img { display: block; width: 100%; height: 100%; object-fit: cover; }

/* Janela de zoom do cartaz (<dialog>: Esc fecha e o foco volta ao botão que abriu) */
.zoom-dialogo { border: 0; padding: 0; background: transparent; max-width: min(92vw, 36rem); max-height: 94vh; overflow: visible; color: var(--white); }
.zoom-dialogo::backdrop { background: rgb(14 24 38 / 0.85); }
.zoom-dialogo img { display: block; max-width: 100%; max-height: 80vh; margin: auto; background: var(--navy); }
.zoom-dialogo__fechar { display: block; margin: var(--esp-3) auto 0; min-height: var(--alvo); padding: 0 var(--esp-5); background: var(--white); color: var(--navy); font: inherit; border: 0; border-radius: var(--raio); cursor: pointer; }
.zoom-dialogo__fechar:focus-visible { outline-color: var(--areia); }

@media (min-width: 48rem) {
  /* Tablet: cartaz e controle numa coluna (o controle fica sempre colado ao cartaz); a lista ocupa o resto; botão em linha própria, à direita */
  .proximos__painel { display: grid; grid-template-columns: minmax(0, 17rem) minmax(0, 1fr); grid-template-rows: auto 1fr auto; grid-template-areas: "cartaz lista" "ctrl lista" "acao acao"; gap: var(--esp-1) var(--esp-6); align-items: start; }
  .proximos__painel[hidden] { display: none; }
  .proximos__cartaz { display: block; grid-area: cartaz; position: static; }
  .proximos__lista { grid-area: lista; }
  .cartaz-ctrl { grid-area: ctrl; margin-top: 0; }
  .proximos__acao--canto { grid-area: acao; display: block; justify-self: end; margin: var(--esp-3) 0 0; }
  .proximos__acao--fim { display: none; }
  .culto { grid-template-columns: 3.25rem minmax(0, 1fr) auto; }
  .culto .unidade { grid-column: 3; }
  .miniatura { display: none; }
}
/* Computador: controle e botão na mesma linha, o botão no canto direito */
@media (min-width: 72rem) {
  .proximos__painel { grid-template-rows: auto auto; grid-template-areas: "cartaz lista" "ctrl acao"; }
  .proximos__acao--canto { align-self: center; margin: 0; }
}

/* ---------- 3. Onde estamos ---------- */
.onde__cartoes { display: grid; gap: var(--esp-4); grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 1fr)); margin-block: var(--esp-4); }
.onde__cartao { display: flex; flex-direction: column; gap: var(--esp-2); align-items: flex-start; }
.onde__cartao h3 { margin: 0; font-size: 1.125rem; }
.onde__cartao address { color: var(--texto-suave); font-size: 0.9375rem; }
/* Alinhamento: os quatro blocos de cada cartão (nome, endereço, próximo culto, rotas) ocupam as mesmas linhas da grade,
   então "Próximo culto" começa na mesma altura nos dois cartões, mesmo que um endereço quebre em duas linhas e o outro não */
@supports (grid-template-rows: subgrid) {
  .onde__cartao { display: grid; grid-row: span 4; grid-template-rows: subgrid; row-gap: var(--esp-2); align-items: start; justify-items: start; }
  .onde__cartao > h3 { grid-row: 1; }
  .onde__cartao > address { grid-row: 2; }
  .onde__cartao > .onde__proximo { grid-row: 3; }
  .onde__cartao > .onde__rotas { grid-row: 4; }
}
@supports not (grid-template-rows: subgrid) { .onde__cartao address { min-height: 3rem; } } /* reserva 2 linhas de endereço em navegadores antigos */

/* "Próximo culto": destaque leve. Rótulo pequeno; dia e horário em azul e o nome do culto em navy, ambos em peso médio/normal */
.onde__proximo { margin: var(--esp-2) 0 0; display: grid; gap: 0.125rem; }
.onde__proximo-rotulo { color: var(--texto-suave); font-size: var(--fs-pequeno); font-weight: 400; }
.onde__proximo-valor { font-size: 1.125rem; font-weight: 400; line-height: 1.35; }
.onde__proximo-quando { color: var(--blue); font-weight: 500; }

/* Como chegar: duas opções lado a lado, cada uma com o ícone oficial do aplicativo (traz cor ao cartão) */
.onde__rotas { margin-top: var(--esp-2); }
.onde__rotas-rotulo { margin: 0 0 var(--esp-1); color: var(--texto-suave); font-size: var(--fs-pequeno); }
.onde__rotas-lista { display: flex; flex-wrap: wrap; gap: var(--esp-2); margin: 0; padding: 0; list-style: none; }
.onde__rota { gap: var(--esp-2); padding-inline: var(--esp-4); border-color: var(--linha); background: var(--white); color: var(--texto); font-weight: 500; }
.onde__rota:hover { background: var(--off-white); color: var(--texto); border-color: var(--blue); }
.onde__rota img { flex: none; height: 1.25rem; width: auto; }
.onde__rota .onde__icone-waze { height: 1.5rem; } /* ícone do Waze: quadrado azul com o balão branco de contorno preto, como o aplicativo */
[data-contraste="alto"] .onde__rota { border-color: #000; }
.onde__rodape { margin: 0; }
.onde__sep { margin-inline: var(--esp-2); }

/* ---------- 4. Conheça ---------- */
.conheca__grade { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--esp-6); }
.conheca__texto { max-width: 42rem; }
/* Moldura das fotos: bloco azul sólido (o mesmo azul do cartão da Sede) deslocado atrás da foto, como uma projeção,
   e cantos suavemente arredondados. Onde a foto fica à esquerda, o bloco é espelhado (alternância imagem-texto). */
:root { --desloc: 0.75rem; } /* deslocamento do bloco azul atrás da foto (a legenda usa o mesmo valor) */
.moldura-foto { position: relative; isolation: isolate; }
.moldura-foto::before { content: ""; position: absolute; inset: 0; z-index: -1; transform: translate(var(--desloc), var(--desloc)); background: var(--blue); border-radius: 0.625rem; }
.moldura-foto > img { display: block; }
.moldura-foto > img, .moldura-foto > .reserva-foto { border-radius: 0.625rem; }
.moldura-foto > .reserva-foto { background-color: var(--off-white); }
.moldura-foto--espelhada::before { transform: translate(calc(-1 * var(--desloc)), var(--desloc)); }
.moldura-foto--escura > .reserva-foto { background-color: var(--fundo-escuro); }
@media (min-width: 56rem) { :root { --desloc: 1.25rem; } }
.conheca__foto { margin: 0; width: 100%; max-width: 22rem; } /* a foto acompanha a altura do texto ao lado */
.conheca__foto img { width: 100%; height: auto; aspect-ratio: 5 / 4; object-fit: cover; object-position: center top; } /* foto recortada da cintura para cima (5:4) */ /* pastores da cintura para cima */
.conheca__foto .reserva-foto { aspect-ratio: 5 / 4; }
.conheca__foto figcaption { margin-top: calc(var(--esp-2) + var(--desloc)); font-size: var(--fs-pequeno); color: var(--texto-suave); }
@media (min-width: 56rem) { .conheca__grade--foto { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); align-items: start; gap: var(--esp-8); } .conheca__foto { justify-self: end; } }
/* Notebooks de pouca altura (1326 × 554): a seção precisa caber na área útil, abaixo do cabeçalho fixo */
/* Notebook de pouca altura (1326 × 554): com o respiro padrão de 72 px, o conteúdo precisa de até ~325 px; foto menor e versículo mais junto */
@media (max-height: 40rem) and (min-width: 56rem) { .conheca__foto { max-width: 19rem; } .conheca__texto { max-width: none; } .conheca .versiculo { margin-block: var(--esp-3); } }

/* ---------- 5. Ministérios ---------- */
.ministerios__grade { display: grid; gap: var(--esp-4); grid-template-columns: 1fr; }
@media (min-width: 36rem) { .ministerios__grade { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 52rem) { .ministerios__grade { grid-template-columns: repeat(3, 1fr); } }
.ministerios .ministerio { background: var(--navy); color: var(--white); border: 0; border-top: 3px solid var(--areia); border-radius: 0.375rem; box-shadow: 0 8px 20px rgb(23 43 70 / 0.18); } /* cartões azul-escuros, todos iguais (provisório) */
.ministerios .ministerio h3 { margin-bottom: var(--esp-2); font-family: var(--fonte-editorial); font-size: 1.375rem; font-weight: 500; color: var(--areia); }
.ministerio p:last-child { margin-bottom: 0; }
.ministerio__quando { margin: var(--esp-3) 0 0; font-size: 0.9375rem; font-weight: 600; color: var(--areia); }
.ministerios__nota { margin: var(--esp-5) 0 0; max-width: 46rem; }

/* ---------- A Igreja: liderança (foto à esquerda: a foto alterna de lado a cada bloco com foto) ---------- */
.lideranca__grade { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--esp-6); }
.lideranca__nome { margin: var(--esp-3) 0 var(--esp-1); font-family: var(--fonte-texto); font-size: 1.125rem; font-weight: 600; }
.lideranca__texto p { margin: 0 0 var(--esp-3); }
.lideranca__foto { margin: 0; width: 100%; max-width: 24rem; }
.lideranca__foto img { width: 100%; height: auto; aspect-ratio: 5 / 4; object-fit: cover; object-position: center top; }
@media (min-width: 56rem) { .lideranca__grade { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); align-items: center; gap: var(--esp-8); } .lideranca__foto { order: -1; } }

/* ---------- A Igreja: história e missão/visão/valores ---------- */
.historia__grade { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--esp-5); }
.historia__texto { max-width: 42rem; }
.historia__versiculo { margin: 0; align-self: center; }
@media (min-width: 56rem) { .historia__grade { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--esp-8); } .historia__versiculo { justify-self: start; } }
.mvv__grade { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--esp-5); margin-top: var(--esp-5); }
.mvv__grade .bloco h3 { font-size: 1.125rem; }
.mvv__valores { display: grid; gap: var(--esp-1); margin: 0; padding: 0; list-style: none; }
@media (min-width: 56rem) { .mvv__grade { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--esp-6); } }

/* ---------- Endereços: unidades em linhas compactas e um mapa só, na altura toda ---------- */
html.js .sem-js { display: none !important; }
.enderecos__grade { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--esp-5); }
.enderecos__lista { margin: 0; padding: 0; list-style: none; }
.unidade-item { padding: var(--esp-3) 0 var(--esp-3) var(--esp-4); border-top: 1px solid var(--linha); border-left: 3px solid transparent; }
.unidade-item:first-child { border-top: 0; padding-top: var(--esp-1); }
.unidade-item--ativo { border-left-color: var(--detalhe); } /* unidade que o mapa está mostrando */
.unidade-item__nome { margin: 0 0 var(--esp-1); font-size: 1.25rem; }
.unidade-item__nome button { display: inline-flex; align-items: center; min-height: var(--alvo); padding: 0; border: 0; background: none; color: inherit; font: inherit; cursor: pointer; text-align: left; }
.unidade-item__nome button:hover { color: var(--detalhe); }
.unidade-item__nome button[aria-pressed="true"]::after { content: " ✓"; white-space: pre; font-size: var(--fs-pequeno); color: var(--texto-suave); }
.unidade-item address { margin: 0 0 var(--esp-1); font-style: normal; }
.unidade-item__linha { margin: 0 0 var(--esp-1); }
.unidade-item__rotas { margin: var(--esp-1) 0 0; font-size: var(--fs-pequeno); }
.unidade--mocambique::before { background: var(--navy); border-radius: 0; } /* cor da unidade PENDENTE; quadrado para não depender só de cor */
.acao-seta { display: inline-flex; align-items: center; gap: var(--esp-2); min-height: 2rem; color: var(--blue); font-weight: 500; text-decoration: none; }
.acao-seta:hover { color: var(--detalhe); }
.acao-seta .seta { flex: none; transition: transform 0.15s; }
.acao-seta:hover .seta { transform: translateX(3px); }
@media (prefers-reduced-motion: reduce) { .acao-seta .seta { transition: none; } }
html[data-animacao="pausada"] .acao-seta .seta { transition: none; }
.enderecos__mapa { order: -1; }
.mapa { position: relative; width: 100%; aspect-ratio: 16 / 10; border-radius: 0.625rem; overflow: hidden; background: var(--cinza-suave); }
.mapa iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.mapa__rotas { position: absolute; left: var(--esp-3); bottom: var(--esp-3); z-index: 1; display: flex; flex-wrap: wrap; gap: var(--esp-1) var(--esp-3); align-items: center; margin: 0; padding: var(--esp-2) var(--esp-3); border-radius: 0.375rem; background: var(--white); box-shadow: 0 1px 4px rgb(23 43 70 / 0.25); font-size: var(--fs-pequeno); }
.mapa__rotas[hidden] { display: none; }
.mapa__rotas-rotulo { color: var(--texto-suave); }
html:not(.js) .enderecos__mapa { order: 0; }
@media (min-width: 56rem) {
  .enderecos__grade { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--esp-6); align-items: stretch; }
  .enderecos__mapa, html:not(.js) .enderecos__mapa { order: 0; display: flex; }
  .enderecos__mapa .mapa { aspect-ratio: auto; min-height: 20rem; height: auto; flex: 1; } /* acompanha a altura toda da lista */
}

/* ---------- Cultos e Eventos: agenda da semana por unidade ---------- */
.filtro[aria-current="page"] { background: var(--navy); color: var(--white); border-color: var(--navy); }
.filtro[aria-current="page"]::before { content: "✓ "; white-space: pre; }
a.filtro { display: inline-flex; align-items: center; text-decoration: none; }
.agenda-controles { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: var(--esp-3) var(--esp-5); margin-bottom: var(--esp-5); }
.agenda-controles .titulo-secao { margin: 0; }
.pagina-topo .agenda-filtros { margin-top: var(--esp-4); }
.pagina-topo__atalho { margin: var(--esp-3) 0 0; }
.agenda-filtros { margin: 0; padding: 0; list-style: none; flex-wrap: wrap; }
.agenda-semana-nav { display: flex; flex-wrap: wrap; align-items: center; gap: var(--esp-1) var(--esp-5); }
.agenda-semana-nav__periodo { margin: 0; }
.agenda-colunas { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--esp-6); }
.agenda-colunas--uma { max-width: 44rem; }
/* A agenda é uma seção azul-escura (secao--escura): nomes das unidades em Garamond itálico, horários e dia atual em areia */
.agenda-pagina .titulo-secao, .agenda-semana-nav__periodo { color: var(--white); }
.agenda-pagina .acao-seta { color: var(--areia); }
.agenda-pagina .acao-seta:hover { color: var(--white); }
.agenda-unidade__nome { margin: 0 0 var(--esp-3); font-family: var(--fonte-editorial); font-style: italic; font-weight: 500; font-size: 1.625rem; line-height: 1.2; }
.agenda-unidade__nome .unidade { color: var(--areia); }
.agenda-unidade__nome .unidade::before, .agenda-unidade__nome .unidade--leste::before { background: var(--areia); } /* a forma (círculo ou losango) distingue as unidades */
.agenda-vazia { margin: 0; color: var(--sobre-escuro-suave); }
.semana { margin: 0; padding: 0; list-style: none; border-top: 1px solid rgb(255 255 255 / 0.25); }
.semana__dia { display: grid; grid-template-columns: 5.5rem minmax(0, 1fr); gap: 0 var(--esp-3); padding: var(--esp-2) 0; border-bottom: 1px solid rgb(255 255 255 / 0.15); }
.semana__rotulo { margin: 0; font-size: 0.875rem; font-weight: 600; line-height: 1.3; color: var(--white); }
.semana__data { display: block; font-weight: 400; color: var(--sobre-escuro-suave); font-variant-numeric: tabular-nums; }
.semana__dia--hoje .semana__rotulo { color: var(--areia); }
.semana__dia--hoje { background: rgb(255 255 255 / 0.09); box-shadow: inset 3px 0 0 var(--areia); padding-left: var(--esp-3); margin-left: calc(-1 * var(--esp-3)); }
.semana__dia--passado .semana__culto, .semana__dia--passado .semana__hora { color: rgb(255 255 255 / 0.7); } /* dia que já passou: esmaecido, ainda com contraste de 7:1 */
.semana__cultos { margin: 0; padding: 0; list-style: none; display: grid; gap: var(--esp-1); }
.semana__culto { display: grid; grid-template-columns: 3.5rem minmax(0, 1fr); gap: var(--esp-2); font-size: 1.0625rem; color: var(--white); }
.semana__hora { font-weight: 600; font-variant-numeric: tabular-nums; color: var(--areia); }
[data-contraste="alto"] .semana__dia--passado .semana__culto, [data-contraste="alto"] .semana__dia--passado .semana__hora { color: var(--white); }
@media (min-width: 56rem) { .agenda-colunas { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--esp-8); } .agenda-colunas--uma { grid-template-columns: minmax(0, 1fr); } }

/* Próximos eventos: cartazes verticais (4:5) em grade; os dados do evento sempre também em texto */
.eventos__grade { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--esp-5) var(--esp-4); margin: var(--esp-5) 0 0; padding: 0; list-style: none; }
.evento__cartaz { margin: 0; aspect-ratio: 4 / 5; width: 100%; }
.evento__cartaz .zoom, .evento__cartaz .cartao-culto { height: 100%; border-radius: 0.375rem; overflow: hidden; }
.evento__dados { margin-top: var(--esp-3); }
.evento__titulo { margin: 0 0 var(--esp-1); font-family: var(--fonte-texto); font-size: 1.0625rem; font-weight: 600; line-height: 1.3; }
.evento__dados p { margin: 0 0 var(--esp-1); }
.evento__quando { font-weight: 500; }
.evento__unidade, .evento__descricao { font-size: var(--fs-pequeno); color: var(--texto-suave); }
@media (min-width: 40rem) { .eventos__grade { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--esp-6) var(--esp-5); } }
@media (min-width: 64rem) { .eventos__grade { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

/* ---------- Foto de abertura das páginas (lateral em A Igreja, faixa larga em Missões) ---------- */
.foto-abertura { margin: 0; overflow: hidden; border-radius: 0.625rem; background: var(--cinza-suave); }
.foto-abertura img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: var(--foto-foco, 50% 50%); }
.foto-abertura .reserva-foto { height: 100%; min-height: 100%; }
.foto-abertura--lateral { aspect-ratio: 16 / 10; width: 100%; }
.foto-abertura--faixa { aspect-ratio: 16 / 9; width: 100%; }
@media (min-width: 40rem) { .foto-abertura--faixa { aspect-ratio: 21 / 9; } }
.pagina-topo--foto .conteiner { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--esp-5); align-items: center; }
@media (min-width: 56rem) { .pagina-topo--foto .conteiner { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--esp-8); } .pagina-topo--foto .foto-abertura { max-height: 18rem; } }

/* ---------- Missões ---------- */
.missoes-pagina__faixa { margin-top: var(--esp-5); }
.mocambique__grade { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--esp-5); }
.mocambique__texto { max-width: 42rem; }
.mocambique__onde { margin: 0; padding-left: var(--esp-4); border-left: 1px solid var(--areia); align-self: start; }
.mocambique__onde-rotulo { margin: 0 0 var(--esp-1); color: var(--areia); font-size: 0.9375rem; font-weight: 600; }
.mocambique__onde address { font-style: normal; max-width: 28rem; }
.mocambique__onde-nota { margin: var(--esp-2) 0 0; font-size: var(--fs-pequeno); color: var(--sobre-escuro-suave); }
@media (min-width: 56rem) { .mocambique__grade { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--esp-8); } }
.participe__contato { margin: 0 0 var(--esp-4); }
.participe__cultos { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--linha); max-width: 40rem; }
.participe__cultos .horarios__linha { display: grid; grid-template-columns: 8rem 4.25rem minmax(0, 1fr); gap: 0 var(--esp-3); padding: var(--esp-2) 0; border-bottom: 1px solid var(--linha); }
.participe__cultos .horarios__hora { font-weight: 600; font-variant-numeric: tabular-nums; }

/* ---------- Texto e foto lado a lado (a foto alterna de lado a cada bloco com foto) ---------- */
.texto-foto { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--esp-6); align-items: center; }
.texto-foto__texto { max-width: 42rem; }
.texto-foto + .texto-foto { margin-top: var(--esp-8); } /* dois blocos na mesma seção */
.texto-foto__foto { min-width: 0; }
.foto-secao { margin: 0; width: 100%; max-width: 26rem; }
.foto-secao img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; object-position: var(--foto-foco, 50% 50%); }
.foto-secao .reserva-foto { aspect-ratio: 3 / 2; }
@media (min-width: 56rem) {
  .texto-foto--direita { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--esp-8); }
  .texto-foto--esquerda { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--esp-8); }
  .texto-foto--esquerda .texto-foto__foto { order: -1; }
  .texto-foto--direita .texto-foto__foto { justify-self: end; }
}

/* ---------- Assistência e Capelania: fé e obras, como doar, versículos em cartão ---------- */
.fe-obras__grade { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--esp-6); align-items: center; }
.fe-obras__texto { max-width: 42rem; }
@media (min-width: 56rem) { .fe-obras__grade--postit { grid-template-columns: minmax(0, 1fr) 21rem; gap: var(--esp-8); } }
.doar__colunas { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--esp-5); margin-top: var(--esp-5); }
.doar__colunas h3 { margin: 0 0 var(--esp-2); font-family: var(--fonte-texto); font-size: 1rem; font-weight: 600; color: var(--areia); }
.doar__colunas p { margin: 0 0 var(--esp-2); }
.doar__data { font-size: var(--fs-pequeno); color: var(--sobre-escuro-suave); }
@media (min-width: 56rem) { .doar__colunas { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--esp-7); } }
.ref-biblica { color: var(--blue); text-decoration: underline; text-decoration-style: dotted; text-underline-offset: 0.2em; cursor: pointer; }
.ref-biblica:hover { color: var(--detalhe); }
.versiculo-dialogo { border: 0; padding: var(--esp-5); background: transparent; max-width: min(92vw, 24rem); max-height: 90vh; overflow: visible; color: var(--navy); }
.versiculo-dialogo::backdrop { background: rgb(14 24 38 / 0.6); }
.versiculo-dialogo .versiculo--postit { margin: 0 auto var(--esp-3); max-height: 70vh; overflow: auto; }
.versiculos-citados { padding-block: var(--esp-6); background: var(--off-white); }
.versiculos-citados__titulo { font-size: 1.125rem; margin-bottom: var(--esp-3); }
.versiculos-citados__lista { margin: 0; padding: 0; list-style: none; display: grid; gap: var(--esp-4); max-width: 46rem; }
.versiculos-citados blockquote { margin: 0; font-family: var(--fonte-editorial); font-style: italic; font-weight: 500; font-size: 1.125rem; line-height: 1.4; }
.versiculos-citados blockquote p { margin: 0; }
.versiculos-citados__ref { margin: var(--esp-1) 0 0; font-size: var(--fs-pequeno); color: var(--texto-suave); font-weight: 500; }

/* ---------- Páginas internas: topo e índice ---------- */
.pagina-topo { padding-bottom: var(--esp-5); } /* a seção seguinte já tem o respiro padrão no topo */
.pagina-topo .secao__intro { margin-bottom: 0; }
.indice { margin-top: var(--esp-5); }
.indice__titulo { margin: 0 0 var(--esp-2); font-family: var(--fonte-texto); font-size: 0.9375rem; font-weight: 600; color: var(--detalhe); }
.indice__lista { display: flex; flex-wrap: wrap; gap: 0 var(--esp-5); }
.indice__lista a { display: inline-flex; align-items: center; min-height: var(--alvo); text-decoration: none; color: var(--texto); }
.indice__lista a:hover { color: var(--detalhe); }

/* ---------- 6. Assistência e Capelania ---------- */
.assistencia__grade { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--esp-6); align-items: center; }
.assistencia .secao__intro { margin-bottom: var(--esp-5); }
/* Dois blocos empilhados, discretos: só um filete dourado à esquerda, sem fundo de cartão e com texto compacto */
.assistencia__blocos { display: grid; gap: var(--esp-4); max-width: 42rem; }
.bloco { padding-left: var(--esp-4); border-left: 2px solid var(--detalhe); }
.bloco h3 { font-size: 1.0625rem; margin-bottom: var(--esp-1); }
.bloco p { margin: 0; }
.assistencia .secao__acao { margin-top: var(--esp-5); }
@media (min-width: 56rem) { .assistencia__grade { grid-template-columns: minmax(0, 1fr) 21rem; gap: var(--esp-8); } }

/* ---------- 7. Missões ---------- */
.missoes__grade { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--esp-6); }
.missoes__bloco { max-width: 40rem; }
.missoes__texto { font-size: 1.0625rem; margin-bottom: var(--esp-5); }
.missoes__foto { margin: 0; width: 100%; max-width: 34rem; }
.missoes__foto .reserva-foto { aspect-ratio: 4 / 3; }
.missoes__foto img { width: 100%; height: auto; aspect-ratio: 16 / 10; object-fit: cover; object-position: 45% 40%; } /* foto larga recortada em 16:10, mantendo as crianças ao centro, o homem ao fundo e a mulher de azul */
@media (min-width: 56rem) { .missoes__grade { grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); align-items: center; gap: var(--esp-8); } .missoes__foto { order: -1; } } /* alterna: foto à esquerda */

/* ---------- 8. AD Morumbi Online ---------- */
.online__titulo { margin: 0; }
.online__corpo { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--esp-5); }
.online__texto { min-width: 0; display: flex; flex-direction: column; justify-content: space-between; gap: var(--esp-4); }
.online__texto .secao__intro { margin: 0; }
.online__texto .secao__acao { margin: 0; }
/* Bloco de vídeos: o mais recente (grande) e os dois seguintes. Título e data ficam SOBRE a miniatura, em faixa escura */
.online__videos { display: grid; grid-template-columns: 1fr 1fr; gap: var(--esp-3); margin: 0; padding: 0; list-style: none; }
.online__videos > li:first-child { grid-column: 1 / -1; }
.video__capa { position: relative; display: block; aspect-ratio: 16 / 9; overflow: hidden; border-radius: 0.625rem; background-color: var(--navy); color: var(--white); text-decoration: none; }
.video__capa img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform 0.25s; } /* corta as faixas pretas da miniatura 4:3 do YouTube */
a.video__capa:hover img { transform: scale(1.03); }
.video__texto { position: absolute; inset: auto 0 0 0; display: grid; gap: 0.125rem; padding: var(--esp-6) var(--esp-3) var(--esp-3); background: linear-gradient(to top, rgb(23 43 70 / 0.92) 0%, rgb(23 43 70 / 0.86) 55%, transparent 100%); }
.video__rotulo { font-size: var(--fs-pequeno); color: var(--sobre-escuro-suave); }
.video__titulo { font-weight: 500; line-height: 1.25; font-size: 0.9375rem; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.video--destaque .video__titulo { font-size: 1.25rem; }
.video__data { display: flex; align-items: center; gap: var(--esp-2); font-size: var(--fs-pequeno); color: var(--sobre-escuro-suave); }
.video__data::before { content: ""; flex: none; border-style: solid; border-width: 0.3125rem 0 0.3125rem 0.5rem; border-color: transparent transparent transparent var(--white); } /* triângulo de "play" */
a.video__capa:hover .video__titulo { text-decoration: underline; text-underline-offset: 0.2em; }
/* Espaço reservado (canal ainda sem vídeos): caixa tracejada padrão do projeto */
.video__capa.reserva-foto { display: flex; background-color: var(--off-white); color: var(--texto-suave); }
@media (min-width: 56rem) {
  /* Rótulo, título, texto e botão na coluna estreita; vídeos à direita, na mesma altura. O bloco de vídeos (grande 2/3 e dois menores 1/3, na mesma
     altura) define a altura da seção (471 px no notebook); o botão alinha com a base dos vídeos */
  .online__corpo { grid-template-columns: minmax(0, 16.25rem) minmax(0, 1fr); gap: var(--esp-6); align-items: stretch; } /* coluna do texto de 260 px; o resto é dos vídeos */
  .video--destaque .video__capa { aspect-ratio: 16 / 10; } /* um pouco mais alto que 16:9 (recorte leve da miniatura): dá altura à seção sem abrir espaço vazio */
  .online__videos { grid-template-columns: 2fr 1fr; grid-template-rows: 1fr 1fr; align-self: start; }
  .online__videos > li:nth-child(1) { grid-column: 1; grid-row: 1 / 3; }
  .online__videos > li:nth-child(2) { grid-column: 2; grid-row: 1; }
  .online__videos > li:nth-child(3) { grid-column: 2; grid-row: 2; }
  .video--lateral .video__capa { aspect-ratio: auto; height: 100%; } /* os menores ocupam a altura das duas linhas, sem estourar */
  .video--lateral .video__texto { padding-top: var(--esp-5); }
}/* ---------- 9. Contribua ---------- */
.contribua__grade { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--esp-6); align-items: center; }
.contribua__interno > p { max-width: 46rem; }
@media (min-width: 56rem) { .contribua__grade { grid-template-columns: minmax(0, 1fr) 21rem; gap: var(--esp-8); } }

/* ---------- 10. Pedido de oração ---------- */
.oracao__grade { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--esp-6); }
.oracao__form { max-width: 36rem; }
/* Formulário enxuto: campos com fundo claro (#F5F7FA, mais leve que o padrão) e uma linha fina só embaixo, em azul (a linha é o que
   identifica o campo, contraste maior que 3:1); sem contorno e sem cantos arredondados. No foco o fundo fica branco e a linha engrossa;
   no alto contraste valem as bordas cheias de 2 px */
.oracao__form .campo { margin-bottom: var(--esp-4); }
.oracao__form .campo label { font-weight: 500; font-size: 0.9375rem; color: var(--texto-suave); }
.oracao__form .campo input, .oracao__form .campo textarea { background: #F2F2F2; border: 0; border-bottom: 1px solid var(--campo-linha); border-radius: 0; padding-inline: var(--esp-3); }
.oracao__form .campo textarea { min-height: 6rem; }
.oracao__form .campo input:focus-visible, .oracao__form .campo textarea:focus-visible { background: var(--white); border-bottom-width: 2px; }
.oracao__form .campo--erro input, .oracao__form .campo--erro textarea { border-bottom-color: #9B1C1C; }
[data-contraste="alto"] .oracao__form .campo input, [data-contraste="alto"] .oracao__form .campo textarea { border: 2px solid var(--campo-linha); }
.oracao__envio { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--esp-3) var(--esp-5); } /* link à esquerda e botão à direita, alinhados às bordas dos campos, como no formulário de solicitações (13/11/2026) */
.oracao__privacidade { font-size: var(--fs-pequeno); }
@media (min-width: 40rem) { .oracao__linha { display: grid; grid-template-columns: 1fr 1fr; gap: var(--esp-5); } }
@media (min-width: 56rem) { .oracao__grade { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--esp-8); align-items: start; } }

/* ===== Proposta B da página Assistência e Capelania (rodada 52): faixa de versículo, foto até a borda e blocos em duas colunas ===== */
.faixa-versiculo { padding-block: var(--esp-6); background: var(--white); border-block: 1px solid rgb(23 43 70 / 0.12); }
.faixa-versiculo__grade { display: grid; gap: var(--esp-3); margin: 0 auto; }
.faixa-versiculo blockquote { margin: 0; max-width: 50rem; font-family: var(--fonte-editorial); font-style: italic; font-weight: 500; font-size: 1.25rem; line-height: 1.45; }
.faixa-versiculo blockquote p { margin: 0; }
.faixa-versiculo figcaption { font-family: var(--fonte-editorial); font-size: 1.05rem; color: var(--blue); }
.faixa-versiculo--escura { background: var(--fundo-escuro); color: var(--sobre-escuro); border-color: transparent; }
.faixa-versiculo--escura figcaption { color: var(--areia); }
@media (min-width: 56rem) {
  .faixa-versiculo blockquote { font-size: 1.375rem; }
  .faixa-versiculo__grade { grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: var(--esp-6); }
  .faixa-versiculo figcaption { padding-left: var(--esp-5); border-left: 1px solid currentColor; }
}
[data-contraste="alto"] .faixa-versiculo, [data-contraste="alto"] .faixa-versiculo--escura { background: #000; color: #fff; border-block: 2px solid #fff; }
[data-contraste="alto"] .faixa-versiculo figcaption, [data-contraste="alto"] .faixa-versiculo--escura figcaption { color: #fff; }

.bloco-borda { --recuo: max(var(--gutter), calc((100% - var(--conteiner-max)) / 2 + var(--gutter))); display: grid; gap: var(--esp-6); padding-inline: 0; overflow-x: clip; }
.bloco-borda__texto { padding-inline: var(--gutter); max-width: 42rem; }
.bloco-borda__foto { margin: 0; min-width: 0; }
.bloco-borda__foto img, .bloco-borda__foto .reserva-foto { display: block; width: 100%; aspect-ratio: 3 / 2; height: auto; object-fit: cover; object-position: var(--foto-foco, 50% 50%); }
.bloco-borda + .bloco-borda { padding-top: 0; }
@media (min-width: 56rem) {
  .bloco-borda { gap: var(--esp-8); align-items: center; }
  .bloco-borda__texto { padding-inline: 0; }
  .bloco-borda--foto-direita { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); padding-left: var(--recuo); }
  .bloco-borda--foto-esquerda { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); padding-right: var(--recuo); }
  .bloco-borda--foto-esquerda .bloco-borda__foto { order: -1; }
}

.duas-colunas { display: grid; gap: var(--esp-6); }
.duas-colunas > * { min-width: 0; }
@media (min-width: 56rem) { .duas-colunas { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--esp-8); align-items: start; } }
.cartao-chamada { padding: var(--esp-6); border-radius: 0.625rem; background: var(--fundo-escuro); color: var(--sobre-escuro); }
.cartao-chamada .titulo-secao { color: var(--sobre-escuro); }
[data-contraste="alto"] .cartao-chamada { background: #000; border: 2px solid #fff; }
.faixa-versiculo__texto > * + * { margin-top: var(--esp-3); }
.faixa-versiculo__texto p { margin-bottom: 0; }
.chamada-centro { max-width: 46rem; text-align: center; }
.chamada-centro .secao__acao { display: flex; justify-content: center; }
.chamada-esq { max-width: 50rem; }
.faixa-versiculo blockquote p { text-wrap: pretty; }

/* Cartões de contribuição (página Contribua): um só layout, dois cartões iguais */
.dois-cartoes { display: grid; gap: var(--esp-5); margin-top: var(--esp-5); }
@media (min-width: 48rem) { .dois-cartoes { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--esp-6); } }
.cartao-contribuir { display: flex; flex-direction: column; padding: var(--esp-6); border: 1px solid rgb(23 43 70 / 0.14); border-radius: 0.625rem; background: var(--white); }
.cartao-contribuir h3 { margin: 0 0 var(--esp-3); font-family: var(--fonte-editorial); font-weight: 500; font-size: 1.1875rem; }
.cartao-contribuir > p { margin: 0; }
.cartao-contribuir .secao__acao { margin-top: auto; padding-top: var(--esp-5); }
.cartao-contribuir .botao { width: 100%; justify-content: center; text-align: center; }
.cartoes-nota { margin: var(--esp-5) 0 0; }

/* ===== Secretaria (proposta de 12/11/2026; disposição da Poliana e ritmo mais folgado em 13/11/2026) ===== */
.secretaria { padding-block: var(--esp-7); }
.secretaria__alto { margin-bottom: var(--esp-6); }
.secretaria__alto .rotulo { margin-bottom: var(--esp-2); }
.secretaria__alto .titulo-secao { margin: 0 0 var(--esp-4); }
.secretaria__alto p:last-child { margin-bottom: 0; }
.secretaria__form { display: grid; gap: var(--esp-6); }
.secretaria__form > * { min-width: 0; }
@media (min-width: 56rem) {
  /* colunas iguais: a coluna das opções precisa de largura para que cada uma caiba em uma linha só */
  .secretaria__form { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-areas: "esq campos" ". envio"; gap: var(--esp-5) var(--esp-8); align-items: stretch; }
  .secretaria__esq { grid-area: esq; }
  .secretaria__campos { grid-area: campos; }
  .secretaria__envio { grid-area: envio; }
}
.secretaria__nota { margin: 0 0 var(--esp-5); }
.secretaria__campos { display: flex; flex-direction: column; }
.secretaria__campos .campo { margin-bottom: var(--esp-4); }
.secretaria__campos .campo--mensagem { flex: 1 1 auto; display: flex; flex-direction: column; margin-bottom: 0; }
.secretaria__campos .campo--mensagem textarea { flex: 1 1 auto; min-height: 6rem; }
.secretaria__dupla { display: grid; gap: 0; }
@media (min-width: 40rem) { .secretaria__dupla { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 var(--esp-4); } }
.secretaria__envio { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--esp-4) var(--esp-5); }
.secretaria__envio .caixa { flex: 1 1 16rem; font-size: 0.9375rem; }
.secretaria__envio .botao { flex: none; }
.tipos { margin: 0; padding: 0; border: 0; min-width: 0; }
.tipos legend { padding: 0; margin-bottom: var(--esp-3); font-weight: 600; }
.tipos__grade { display: grid; gap: var(--esp-2); }
.tipos--painel .tipos__grade { gap: 0; padding: var(--esp-2); border: 1px solid rgb(23 43 70 / 0.22); border-radius: 0.5rem; background: var(--white); }
@media (min-width: 40rem) { .tipos--painel .tipos__grade { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.tipo { display: flex; align-items: center; gap: var(--esp-3); min-height: var(--alvo); padding: 0 var(--esp-3); border: 0; border-radius: 0.375rem; background: transparent; cursor: pointer; font-size: 0.9375rem; line-height: 1.25; }
.tipo input { flex: none; width: 1.125rem; height: 1.125rem; margin: 0; accent-color: var(--navy); }
.tipo:hover { background: rgb(23 43 70 / 0.05); }
.tipo:has(input:checked) { background: rgb(23 43 70 / 0.1); font-weight: 600; }
.tipo:has(input:focus-visible) { outline: 3px solid var(--navy); outline-offset: -3px; }
[data-contraste="alto"] .tipos--painel .tipos__grade { border: 2px solid #000; }
[data-contraste="alto"] .tipo:has(input:checked) { background: #000; color: #fff; }
.campo .caixa, .caixa { display: flex; align-items: flex-start; gap: var(--esp-3); font-weight: 400; cursor: pointer; }
.caixa input { flex: none; width: 1.25rem; height: 1.25rem; margin: 0.15rem 0 0; accent-color: var(--navy); }

/* Secretaria, rodada 75: textos no alto; consentimento e botão em uma linha de largura total */
.secretaria { padding-block: var(--secao-y); } /* respiro padrão de toda seção (rodada 76: tinha sido reduzido por engano) */
.secretaria__alto { margin-bottom: var(--esp-4); }
.secretaria__alto .rotulo { margin-bottom: var(--esp-1); }
.secretaria__alto .titulo-secao { margin: 0 0 var(--esp-3); }
.secretaria__alto p:not(:last-child) { margin-bottom: var(--esp-2); }
.secretaria__form { gap: var(--esp-3); }
.secretaria__campos .campo--mensagem textarea { min-height: 4.5rem; }
@media (min-width: 56rem) {
  .secretaria__form { grid-template-areas: "esq campos" "envio envio"; }
  .secretaria__envio { justify-content: space-between; }
  .secretaria__envio .caixa { flex: 0 1 auto; }
}

/* Secretaria, rodada 75 (ajuste): a lista estica até a base da caixa de texto, e o bloco de textos fica mais enxuto */
.secretaria__alto .titulo-secao { margin-bottom: var(--esp-2); }
.secretaria__alto p:not(:last-child) { margin-bottom: var(--esp-1); }
@media (min-width: 56rem) {
  .secretaria__esq { display: flex; flex-direction: column; }
  .secretaria__esq .tipos { flex: 1 1 auto; display: flex; flex-direction: column; }
  .secretaria__esq .tipos__grade { flex: 1 1 auto; grid-auto-rows: 1fr; align-content: stretch; }
}

/* Secretaria, rodada 75 (acerto fino): base da lista = base da caixa de texto; opções sem quebra em 3 colunas */
.secretaria__campos .campo.campo--mensagem { margin-bottom: 0; }

/* Secretaria, rodada 76: com o respiro padrão e só um texto no alto, há folga para espaçar melhor os blocos */
.secretaria__alto { margin-bottom: var(--esp-5); }
.secretaria__alto .rotulo { margin-bottom: var(--esp-1); }
.secretaria__alto .titulo-secao { margin-bottom: var(--esp-3); }
.secretaria__form { gap: var(--esp-4); }
.secretaria__campos .campo { margin-bottom: var(--esp-4); }
.secretaria__campos .campo.campo--mensagem { margin-bottom: 0; }
.secretaria__campos .campo--mensagem textarea { min-height: 5rem; }

/* Secretaria, rodada 77 (opção de 2 colunas escolhida): mais respiro entre o texto, a lista, o formulário e o botão */
.secretaria__alto { margin-bottom: var(--esp-6); }
.secretaria__form { row-gap: var(--esp-5); }

/* Secretaria, rodada 79: só nos campos do formulário de solicitações, fundo branco (mais claro que a seção); o resto do site fica como estava */
.secretaria__campos .campo input, .secretaria__campos .campo textarea { background: var(--white); }

/* Secretaria: aviso e erros (rodada 81) */
.secretaria__aviso { margin: 0 0 var(--esp-4); }
.secretaria__envio .secretaria__erro-consentimento { flex-basis: 100%; order: 3; margin-top: 0; }
.secretaria .tipos.campo--erro .tipos__grade { border-color: #9B1C1C; }
.secretaria .tipos .campo__erro { margin: 0 0 var(--esp-2); }
.secretaria .tipos.campo--erro .tipo input { box-shadow: none; border-bottom-color: inherit; } /* a faixa vermelha de erro é dos campos de texto, não dos botões de rádio */

/* Página Privacidade (rascunho de 13/11/2026): coluna de leitura e destaque dos pontos pendentes */
.leitura__coluna > * { max-width: 46rem; } /* o contêiner mantém o alinhamento do site; só o texto tem coluna de leitura (antes a regra zerava as margens do contêiner e o texto fugia para a esquerda em telas largas) */
.leitura h3 { margin: var(--esp-5) 0 var(--esp-2); font-family: var(--fonte-editorial); font-weight: 500; font-size: 1.1875rem; }
.leitura ul { margin: 0 0 var(--esp-4); padding-left: 1.25rem; list-style: disc; }
.leitura li { margin-bottom: var(--esp-2); }
.leitura kbd { padding: 0.0625rem 0.375rem; border: 1px solid var(--linha); border-bottom-width: 2px; border-radius: 0.25rem; background: var(--white); font: inherit; font-size: 0.9375rem; font-weight: 600; white-space: nowrap; }
.resumo { padding-left: 0 !important; list-style: none !important; }
.resumo li { padding: var(--esp-3) var(--esp-4); background: var(--white); border-left: 3px solid var(--detalhe); }
mark.pendente { background: #FFF3B0; color: #3B2F00; padding: 0 0.25rem; border-radius: 0.125rem; font-weight: 500; } /* só aparece em ambiente local: página em revisão */
[data-contraste="alto"] mark.pendente { background: #FFFF00; color: #000; border: 1px solid #000; }

.rodape__email { overflow-wrap: anywhere; } /* e-mail longo nunca estoura a coluna do rodapé */

.rodape__logo + .rodape__slogan { margin-top: 0.25rem; margin-bottom: var(--esp-2); } /* distâncias medidas em pixels visíveis: logo > slogan = slogan > ícones = 18 px (era 31 e 14) */

/* ===== Ministérios no celular: simulação de 13/11/2026, acordeões em seção única (só abaixo de 52rem) ===== */
.proposta__legenda { padding-block: var(--esp-3); background: var(--navy); color: var(--white); }
.proposta__legenda strong { font-weight: 600; font-size: 0.9375rem; }
@media (max-width: 51.99rem) {
  .ministerios__grade { gap: var(--esp-3); }
  /* o título vira um botão (feito pelo JavaScript); o corpo abre e fecha */
  .ministerios[data-modo^="acordeao"] .ministerio__titulo { margin: 0; }
  .ministerios[data-modo^="acordeao"] .ministerio__titulo button {
    display: flex; align-items: center; justify-content: space-between; gap: var(--esp-3); width: 100%; min-height: var(--alvo); padding: 0;
    background: none; border: 0; color: inherit; font: inherit; text-align: left; cursor: pointer;
  }
  .ministerios[data-modo^="acordeao"] .ministerio__titulo button::after { /* seta que indica que abre; acompanha a cor do nome */
    content: ""; flex: none; width: 0.5rem; height: 0.5rem; margin-right: 0.25rem; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor;
    transform: rotate(45deg); transition: transform 0.2s;
  }
  .ministerios[data-modo^="acordeao"] .ministerio__titulo button[aria-expanded="true"]::after { transform: rotate(-135deg); }
  .ministerios[data-modo^="acordeao"] .ministerio__titulo button:focus-visible { outline: 3px solid currentColor; outline-offset: 2px; }
  /* A) cartões separados (versão anterior, só para comparar) */
  .ministerios[data-modo="acordeao"] .ministerio { padding: var(--esp-1) var(--esp-4); }
  .ministerios[data-modo="acordeao"] .ministerio__corpo { padding-bottom: var(--esp-3); }
  /* B) painel azul-escuro único, com fios finos entre as linhas */
  .ministerios[data-modo="acordeao-painel"] .ministerios__grade { gap: 0; background: var(--navy); border-top: 3px solid var(--areia); border-radius: 0.375rem; box-shadow: 0 8px 20px rgb(23 43 70 / 0.18); }
  .ministerios[data-modo="acordeao-painel"] .ministerio { background: none; border: 0; border-radius: 0; box-shadow: none; padding: 0 var(--esp-4); }
  .ministerios[data-modo="acordeao-painel"] .ministerio + .ministerio { border-top: 1px solid rgb(237 224 200 / 0.3); }
  .ministerios[data-modo="acordeao-painel"] .ministerio__corpo { padding-bottom: var(--esp-4); }
  /* C) lista clara, sem fundo: só fios e setas */
  .ministerios[data-modo="acordeao-linhas"] .ministerios__grade { gap: 0; border-top: 2px solid var(--navy); border-bottom: 1px solid rgb(23 43 70 / 0.25); }
  .ministerios[data-modo="acordeao-linhas"] .ministerio { background: none; color: var(--texto); border: 0; border-radius: 0; box-shadow: none; padding: 0; }
  .ministerios[data-modo="acordeao-linhas"] .ministerio + .ministerio { border-top: 1px solid rgb(23 43 70 / 0.25); }
  .ministerios[data-modo="acordeao-linhas"] .ministerio h3 { color: var(--navy); }
  .ministerios[data-modo="acordeao-linhas"] .ministerio__corpo { padding-bottom: var(--esp-4); }
  .ministerios[data-modo="acordeao-linhas"] .ministerio__quando { color: var(--detalhe); }
}
@media (prefers-reduced-motion: reduce) { .ministerios[data-modo^="acordeao"] .ministerio__titulo button::after { transition: none; } }

/* ===== Ministérios no computador: simulação de 13/11/2026, cartões claros com faixa lateral (só ≥ 52rem) ===== */
@media (min-width: 52rem) {
  .ministerios[data-faixa] { --faixa-cor: var(--blue); }
  .ministerios[data-faixa="claro"] { --faixa-cor: #6B9AC0; } /* azul claro, só decorativo (3:1 sobre o branco) */
  .ministerios[data-faixa] .ministerio { background: var(--off-white); color: var(--texto); border: 1px solid var(--linha); border-left: 5px solid var(--faixa-cor); border-radius: 0.375rem; box-shadow: none; }
  .ministerios[data-faixa] .ministerio h3 { color: var(--navy); }
  .ministerios[data-faixa] .ministerio__quando { color: var(--detalhe); }
}