/* =======================================================================
   Remodelação moderna — Portal Dom Bosco
   Cabeçalho compacto (barra fina + header branco sticky + nav horizontal).
   Usa classes dbm-* para não conflitar com o design antigo (.l-top/.l-navbar).
   ======================================================================= */

/* Site é claro por design: impede o "modo escuro forçado" do navegador
   (Chrome Auto Dark Mode / extensões) de escurecer/desbotar as cores. */
:root { color-scheme: light; }

/* ---- Ícones de fonte (Font Awesome): nunca itálico, peso correto ----
   O <i> é itálico por padrão e nenhuma classe u-icon__* normaliza; o glifo
   herdava italic (entortado) e, quando herdava bold, era engrossado
   sinteticamente (parecia mais escuro). */
[class*="u-icon__"], [class*="u-icon__"]::before { font-style:normal !important; }
.u-icon__brands::before { font-weight:400 !important; }
.u-icon__free::before { font-weight:900 !important; }

/* ---- Links sem sublinhado (bootstrap/tema antigo sublinhavam) ---- */
a, a:hover, a:focus { text-decoration:none !important; }

/* ---- Barra de topo fina ---- */
.dbm-topbar { background:#0A2E63; color:#fff; font-size:.82rem; font-weight:500; }
.dbm-topbar a { color:rgba(255,255,255,.92); text-decoration:none; transition:color .2s ease; }
.dbm-topbar a:hover { color:#fff; }
.dbm-topbar__inner { display:flex; align-items:center; justify-content:space-between; min-height:42px; gap:1rem; }
.dbm-topbar__contact { display:flex; align-items:center; gap:1.6rem; margin:0; }
.dbm-topbar__contact a { display:inline-flex; align-items:center; gap:.5rem; white-space:nowrap; }
/* blindagem: garante contato legível mesmo com CSS legado/visited por cima */
.dbm-topbar__contact a, .dbm-topbar__contact a:visited, .dbm-topbar__contact a:active, .dbm-topbar__contact a span { color:#fff !important; }
.dbm-topbar__contact a:hover, .dbm-topbar__contact a:hover span { color:#BFD7FF !important; }
.dbm-topbar__contact i::before { font-size:.92rem; opacity:1; color:#9CC2FF !important; }
.dbm-topbar__social { display:flex; align-items:center; gap:.5rem; list-style:none; margin:0; padding:0; }
.dbm-topbar__social a { width:30px; height:30px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; background:rgba(255,255,255,.16); transition:background .2s ease, transform .2s ease; }
.dbm-topbar__social a i::before { font-size:14px; color:#fff; }
.dbm-topbar__social a:hover { background:#C12811; transform:translateY(-1px); }
@media (max-width:767px){ .dbm-topbar__inner{ justify-content:center; min-height:36px; } .dbm-topbar__social{ display:none; } .dbm-topbar__contact{ gap:1rem; font-size:.72rem; } }

/* ---- Header branco sticky compacto ---- */
.dbm-header { position:sticky; top:0; z-index:1030; background:#fff; border-bottom:1px solid rgba(0,0,0,.06); transition:box-shadow .3s ease; }
.dbm-header.is-stuck { box-shadow:0 8px 28px rgba(11,33,57,.10); }
.dbm-header__logo img { max-height:66px; width:auto; display:block; }
.dbm-nav { min-height:66px; }

/* nav horizontal com sublinhado animado */
.dbm-nav__menu { display:flex; align-items:center; gap:.1rem; list-style:none; margin:0; padding:0; }
.dbm-nav__menu li { margin:0; }
.dbm-nav__menu a, .dbm-nav__menu .nav-link {
	position:relative; display:block; padding:.55rem .9rem; font-size:.82rem; font-weight:600;
	letter-spacing:.015em; text-transform:uppercase; color:#0A2E63 !important; text-decoration:none;
	background:none !important; transition:color .2s ease;
}
.dbm-nav__menu a::before, .dbm-nav__menu .nav-link::before {
	content:''; position:absolute; left:.9rem; right:.9rem; bottom:.3rem; height:2px;
	background:#C12811 !important; background-image:none !important; width:auto !important;
	border-radius:0 !important; transform:scaleX(0); transform-origin:left center; transition:transform .28s ease; opacity:1; visibility:visible;
}
.dbm-nav__menu a::after, .dbm-nav__menu .nav-link::after { display:none !important; }
.dbm-nav__menu a:hover, .dbm-nav__menu .nav-link:hover { color:#0B4DAD !important; }
.dbm-nav__menu a:hover::before, .dbm-nav__menu .nav-link:hover::before { transform:scaleX(1); }
.dbm-nav__menu .current-menu-item > a, .dbm-nav__menu .current_page_item > a, .dbm-nav__menu .current-menu-parent > a { color:#0B4DAD !important; }
.dbm-nav__menu .current-menu-item > a::before, .dbm-nav__menu .current_page_item > a::before { transform:scaleX(1); }

/* hamburguer moderno */
.dbm-nav__toggler { padding:6px 4px; border:0; background:none; outline:none; }
.dbm-nav__toggler span { display:block; width:26px; height:2px; margin:5px 0; border-radius:2px; background:#0A2E63; transition:all .25s ease; }

@media (max-width:1199px){
	.dbm-nav__menu{ flex-direction:column; align-items:stretch; width:100%; padding:.5rem 0 .75rem; }
	.dbm-nav__menu a, .dbm-nav__menu .nav-link{ padding:.7rem .25rem; }
	.dbm-nav__menu a::before, .dbm-nav__menu .nav-link::before{ left:.25rem; right:auto; width:26px !important; }
}

/* garante o menu visível no desktop e o hamburguer só no mobile */
@media (min-width:1200px){
	.dbm-header .navbar-collapse { display:flex !important; align-items:center; }
	.dbm-nav__toggler { display:none !important; }
	/* editorias centralizadas entre a logo e a busca */
	.dbm-nav__areas { flex:1 1 auto; justify-content:center; }
}
@media (max-width:1199px){
	.dbm-header .navbar-collapse { background:#fff; border-top:1px solid rgba(0,0,0,.06); }
}

/* botão de busca */
.dbm-search { flex:0 0 auto; width:40px; height:40px; border:0; border-radius:50%; background:rgba(11,77,173,.08); color:#0B4DAD; display:inline-flex; align-items:center; justify-content:center; transition:background .2s ease,color .2s ease; cursor:pointer; }
.dbm-search:hover { background:#0B4DAD; color:#fff; }
.dbm-search svg { width:17px; height:17px; fill:currentColor; }
@media (max-width:1199px){ .dbm-search{ margin-top:.4rem; } }

/* ===== Página Faça sua Doação (Obras Sociais) ===== */
.dbm-donate { --pc:#dd3333; }
.dbm-dhero { position:relative; overflow:hidden; color:#fff; padding:3.4rem 0 3.8rem; background:linear-gradient(135deg,#b81f1f 0%,var(--pc,#dd3333) 55%,#ef5b5b 100%); }
.dbm-dhero::after { content:""; position:absolute; right:-90px; top:-90px; width:340px; height:340px; border-radius:50%; background:rgba(255,255,255,.09); }
.dbm-dhero::before { content:""; position:absolute; left:-70px; bottom:-120px; width:280px; height:280px; border-radius:50%; background:rgba(255,255,255,.07); }
.dbm-dhero .container { position:relative; z-index:1; max-width:820px; }
/* blindagem de contraste no hero vermelho (títulos/negritos não podem escurecer) */
.dbm-dhero h1, .dbm-dhero__k, .dbm-dhero strong, .dbm-dhero .dbm-dhero__bc b { color:#fff !important; }
.dbm-dhero p { color:rgba(255,255,255,.96) !important; }
.dbm-dhero__bc, .dbm-dhero__bc a { color:rgba(255,255,255,.9) !important; }
.dbm-dhero__bc { font-size:.82rem; margin-bottom:1.1rem; color:rgba(255,255,255,.85); }
.dbm-dhero__bc a { color:rgba(255,255,255,.85); text-decoration:none; }
.dbm-dhero__bc a:hover { color:#fff; text-decoration:underline; }
.dbm-dhero__bc span { margin:0 .45rem; opacity:.7; }
.dbm-dhero__k { display:inline-block; font-size:.72rem; font-weight:800; letter-spacing:.16em; text-transform:uppercase; background:rgba(255,255,255,.16); padding:.35rem .8rem; border-radius:100px; margin-bottom:1rem; }
.dbm-dhero h1 { font-size:2.6rem; font-weight:900; line-height:1.08; margin:0 0 .9rem; letter-spacing:-.02em; }
.dbm-dhero p { font-size:1.1rem; line-height:1.6; max-width:640px; margin:0 0 1.7rem; color:rgba(255,255,255,.95); }
.dbm-dhero__cta { display:flex; flex-wrap:wrap; gap:.8rem; }
.dbm-dhero__cta .dbm-btn { display:inline-flex; align-items:center; gap:.5rem; }
.dbm-dhero__cta .dbm-btn svg { width:18px; height:18px; }
.dbm-dhero .dbm-btn--light:hover { background:#12233f !important; color:#fff !important; }
.dbm-dwrap { padding:3rem 0 3.5rem; }

.dbm-dgrid { display:grid; grid-template-columns:1.15fr 1fr; gap:1.5rem; align-items:start; }
.dbm-dcard { position:relative; background:#fff; border:1px solid #e7ebf1; border-radius:18px; padding:1.7rem 1.8rem; box-shadow:0 10px 30px rgba(15,30,60,.06); }
.dbm-dcard--pix { border-color:rgba(221,51,51,.28); box-shadow:0 14px 36px rgba(221,51,51,.12); }
.dbm-dcard__tag { position:absolute; top:1.3rem; right:1.4rem; font-size:.68rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:#fff; background:var(--pc,#dd3333); padding:.28rem .7rem; border-radius:100px; }
.dbm-dcard h3 { font-size:1.3rem; font-weight:800; color:#12294A; margin:0 0 1.2rem; }
.dbm-pixmark { color:var(--pc,#dd3333); }
.dbm-pix { display:flex; gap:1.4rem; align-items:flex-start; }
.dbm-pix__qr { flex:0 0 auto; text-align:center; }
.dbm-pix__qr img { width:170px; height:170px; display:block; border:1px solid #eef1f5; border-radius:14px; padding:8px; background:#fff; }
.dbm-pix__qr span { display:block; font-size:.74rem; color:#7b8698; margin-top:.5rem; max-width:170px; }
.dbm-pix__data { flex:1 1 auto; min-width:0; }
.dbm-copyrow { display:flex; align-items:center; justify-content:space-between; gap:.8rem; padding:.7rem 0; border-bottom:1px dashed #e7ebf1; }
.dbm-copyrow:first-child { padding-top:0; }
.dbm-copyrow__lbl { display:block; font-size:.72rem; font-weight:700; letter-spacing:.05em; text-transform:uppercase; color:#8a94a6; }
.dbm-copyrow__val { display:block; font-size:1.05rem; font-weight:800; color:#12294A; word-break:break-all; }
.dbm-copyrow__val--mono { font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:.9rem; font-weight:600; letter-spacing:.02em; }
.dbm-copy { flex:0 0 auto; display:inline-flex; align-items:center; gap:.4rem; border:1.5px solid var(--pc,#dd3333); background:#fff; color:var(--pc,#dd3333); font-weight:700; font-size:.82rem; padding:.4rem .8rem; border-radius:100px; cursor:pointer; transition:background .18s ease, color .18s ease; }
.dbm-copy svg { width:15px; height:15px; }
.dbm-copy:hover { background:var(--pc,#dd3333); color:#fff; }
.dbm-copy.is-done { background:#1e8e4e; border-color:#1e8e4e; color:#fff; }
.dbm-pix__titular { font-size:.86rem; color:#5b6779; margin:1rem 0 0; }
.dbm-bank { list-style:none; margin:0; padding:0; }
.dbm-bank li { display:flex; align-items:baseline; justify-content:space-between; gap:1rem; padding:.72rem 0; border-bottom:1px solid #eef1f5; }
.dbm-bank li:last-child { border-bottom:none; }
.dbm-bank span { font-size:.82rem; color:#8a94a6; font-weight:600; }
.dbm-bank b { font-size:1.02rem; color:#12294A; font-weight:800; text-align:right; }
.dbm-bank b em { font-style:normal; color:#7b8698; font-weight:600; }
.dbm-dcard__note { font-size:.85rem; color:#7b8698; margin:1.1rem 0 0; line-height:1.5; }

.dbm-donline { display:flex; align-items:center; justify-content:space-between; gap:1.5rem; flex-wrap:wrap; margin:2.4rem 0; padding:1.9rem 2.1rem; border-radius:18px; background:linear-gradient(120deg,#12294A,#1e3a63); color:#fff; }
.dbm-donline__txt h2 { font-size:1.35rem; font-weight:800; margin:0 0 .3rem; color:#fff !important; }
.dbm-donline__txt p { margin:0; color:rgba(255,255,255,.85) !important; font-size:.96rem; max-width:520px; }
.dbm-donline .dbm-btn { display:inline-flex; align-items:center; gap:.5rem; flex:0 0 auto; }
.dbm-donline .dbm-btn svg { width:17px; height:17px; }
.dbm-donline .dbm-btn--light:hover { background:var(--pc,#dd3333) !important; color:#fff !important; }

.dbm-dimpact { margin-top:2.6rem; }
.dbm-dimpact__lead { font-size:1.05rem; color:#43506a; line-height:1.65; max-width:720px; margin:0 0 1.3rem; }
.dbm-drecibo { margin-top:2.4rem; padding-top:1.6rem; border-top:1px solid #eef1f5; font-size:.95rem; color:#5b6779; }
.dbm-drecibo a { color:var(--pc,#dd3333); font-weight:700; }

@media (max-width:820px){
	.dbm-dgrid { grid-template-columns:1fr; }
	.dbm-dhero h1 { font-size:2rem; }
	.dbm-pix { flex-direction:column; align-items:center; text-align:center; }
	.dbm-pix__data { width:100%; }
	.dbm-donline { flex-direction:column; align-items:flex-start; }
}

/* equipes/comissões: cards de pessoas (foto redonda + nome + função) */
.dbm-comissao { margin-top:2.6rem; }
.dbm-team { display:grid; grid-template-columns:repeat(auto-fill,minmax(160px,1fr)); gap:1.4rem 1rem; margin-top:1.4rem; }
.dbm-team__card { display:flex; flex-direction:column; align-items:center; text-align:center; }
.dbm-team__foto { width:112px; height:112px; border-radius:50%; background-size:cover; background-position:center; box-shadow:0 0 0 3px #fff, 0 0 0 5px rgba(11,77,173,.18), 0 10px 22px rgba(15,30,60,.14); margin-bottom:.75rem; }
.dbm-team__nome { font-weight:800; font-size:.95rem; color:#12233f; line-height:1.3; }
.dbm-team__cargo { font-size:.8rem; color:#5b6779; margin-top:.15rem; line-height:1.35; }
.dbm-team__card--coord { grid-column:1 / -1; }
.dbm-team__card--coord .dbm-team__foto { width:136px; height:136px; box-shadow:0 0 0 3px #fff, 0 0 0 6px rgba(226,58,46,.35), 0 12px 26px rgba(15,30,60,.18); }
.dbm-team__card--coord .dbm-team__cargo { color:#E23A2E; font-weight:700; }

/* botão Doar (CTA de doação, presente nas duas versões do cabeçalho) */
.dbm-doar { flex:0 0 auto; display:inline-flex; align-items:center; gap:.42rem; height:40px; padding:0 1.1rem; border-radius:999px; background:#E23A2E; color:#fff; font-weight:800; font-size:.92rem; line-height:1; text-decoration:none; box-shadow:0 4px 12px rgba(226,58,46,.28); transition:background .2s ease,transform .2s ease,box-shadow .2s ease; white-space:nowrap; }
.dbm-doar:hover, .dbm-doar:focus { background:#c62f24; color:#fff; transform:translateY(-2px); box-shadow:0 6px 16px rgba(226,58,46,.36); }
.dbm-doar, .dbm-doar:link, .dbm-doar:visited, .dbm-doar span { color:#fff !important; }
.dbm-doar svg { width:16px; height:16px; color:#fff !important; }
@media (max-width:1199px){ .dbm-doar{ height:36px; padding:0 .95rem; font-size:.86rem; margin-top:.4rem; } }
/* variante mobile: Doar sempre visível ao lado do hambúrguer (fora do menu sanfonado) */
.dbm-doar--m { display:none; }
@media (max-width:1199px){
	.dbm-doar--m { display:inline-flex; margin:0 .55rem 0 auto; }
	#dbm-main-nav .dbm-doar { display:none; }
}
/* botão Canal de Escuta, ao lado do Doar.
   Mesma forma do Doar; o laranja é escuro de propósito: branco sobre ele passa de 4,5:1 */
.dbm-escuta { flex:0 0 auto; display:inline-flex; align-items:center; gap:.42rem; height:40px; padding:0 1.1rem; border-radius:999px; background:#C2410C; color:#fff; font-weight:800; font-size:.92rem; line-height:1; text-decoration:none; box-shadow:0 4px 12px rgba(194,65,12,.26); transition:background .2s ease,transform .2s ease,box-shadow .2s ease; white-space:nowrap; }
.dbm-escuta:hover, .dbm-escuta:focus { background:#9A3412; color:#fff; transform:translateY(-2px); box-shadow:0 6px 16px rgba(194,65,12,.34); }
.dbm-escuta, .dbm-escuta:link, .dbm-escuta:visited, .dbm-escuta span { color:#fff !important; }
.dbm-escuta svg { width:16px; height:16px; color:#fff !important; }
@media (max-width:1199px){ .dbm-escuta{ height:36px; padding:0 .95rem; font-size:.86rem; margin-top:.4rem; } }
/* no topo da home, abaixo de 992px, só o ícone: com o texto a linha passava por cima do logo */
@media (max-width:991px){
	.dbm-hhome .dbm-escuta { width:36px; padding:0; justify-content:center; }
	.dbm-hhome .dbm-escuta span { display:none; }
}
/* os ícones do Doar e do Canal de Escuta saíam cinza: uma regra antiga pinta todo elemento
   de #5B5B5B, e o <path> com fill="currentColor" pegava esse cinza, não o branco do botão */
.dbm-doar svg path, .dbm-escuta svg path, .dbm-tab__doar svg path { fill:#fff; }
/* abaixo de 1200px a barra de baixo já tem o Doar; o topo da home faz como as páginas internas */
@media (max-width:1199.98px){ .dbm-hhome .dbm-doar { display:none; } }
/* nas páginas internas o menu já tem as seis áreas e o Doar: no computador o Canal de Escuta
   fica só no ícone (com texto a busca saía da tela a 1200px); no menu recolhido, com texto */
@media (min-width:1200px){
	#dbm-main-nav .dbm-escuta { width:40px; padding:0; justify-content:center; }
	#dbm-main-nav .dbm-escuta span { display:none; }
}

/* barra de busca revelável */
.dbm-searchbar { max-height:0; overflow:hidden; background:#fff; border-bottom:1px solid rgba(0,0,0,.06); transition:max-height .32s ease; }
.dbm-searchbar.is-open { max-height:100px; }
.dbm-searchbar form { display:flex; gap:.5rem; padding:1rem 0; }
.dbm-searchbar input { flex:1 1 auto; border:1px solid #ccc; border-radius:8px; padding:.65rem 1rem; font-size:.95rem; outline:none; }
.dbm-searchbar input:focus { border-color:#0B4DAD; }
.dbm-searchbar button { border:0; background:#0B4DAD; color:#fff; border-radius:8px; padding:0 1.4rem; font-weight:600; cursor:pointer; }

/* ---- Header da HOME: logo centralizada + "Portal", sem menu ---- */
.dbm-hhome__row { position:relative; display:flex; align-items:center; justify-content:center; min-height:90px; }
.dbm-hhome__logo { display:inline-flex; }
.dbm-hhome__logo img { max-height:64px; width:auto; display:block; transition:max-height .3s ease; }
.dbm-hhome__actions { position:absolute; right:0; top:50%; transform:translateY(-50%); display:flex; align-items:center; gap:.7rem; }
.dbm-hhome__social { display:flex; align-items:center; gap:.4rem; list-style:none; margin:0; padding:0; }
.dbm-hhome__social a { width:34px; height:34px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; background:#0B4DAD; color:#fff; transition:background .2s ease,color .2s ease,transform .2s ease; }
.dbm-hhome__social a:hover { background:#E23A2E; color:#fff; transform:translateY(-2px); }
.dbm-hhome__social a i::before { font-size:15px; color:#fff; }
.dbm-hhome .dbm-search { position:static; transform:none; }
.dbm-hhome__label { text-align:center; font-size:.72rem; font-weight:800; letter-spacing:.34em; text-transform:uppercase; color:#0B4DAD; padding-bottom:.75rem; margin-top:-.35rem; }
.dbm-hhome__label::before, .dbm-hhome__label::after { content:""; display:inline-block; width:26px; height:2px; background:#E23A2E; vertical-align:middle; margin:0 .8em; border-radius:2px; opacity:.85; }
.dbm-hhome.is-stuck .dbm-hhome__logo img { max-height:46px; }
.dbm-hhome.is-stuck .dbm-hhome__row { min-height:66px; }
.dbm-hhome.is-stuck .dbm-hhome__label { padding-bottom:.5rem; font-size:.66rem; }
/* no computador, com Doar e Canal de Escuta lado a lado, o grupo da direita fica mais justo:
   com os tamanhos de antes sobravam só 7px entre ele e o logo centralizado */
@media (min-width:1200px){
	.dbm-hhome__actions { gap:.5rem; }
	.dbm-hhome .dbm-doar, .dbm-hhome .dbm-escuta { padding:0 .9rem; }
	.dbm-hhome__social { gap:.3rem; }
	.dbm-hhome__social a { width:32px; height:32px; }
}
.dbm-topbar--bare { height:8px; }

/* =========================================================================
   Carrossel: uma peca so, para o banner do topo e para as unidades
   -------------------------------------------------------------------------
   O QUE ESTAS REGRAS SUSTENTAM, e por que elas sao assim.

   Sem JavaScript a raiz nunca ganha `is-car`, e e nesse estado que o bloco tem
   de continuar servindo: a trilha vira GRADE, com todos os itens na tela, e o
   `overflow:hidden` que o Swiper traz e desligado. O que estava aqui antes fazia
   o contrario, e era o defeito: `.dbm-banner__slide { flex:0 0 100% }` dentro de
   um `overflow:hidden` mostrava o primeiro banner e escondia os outros para
   quem estivesse sem script, sem nenhum jeito de chegar neles.

   As tres regras `:not(.is-car)` ganham do CSS do Swiper por especificidade
   (tres seletores contra um), sem `!important`: nesse momento a biblioteca ainda
   nao escreveu estilo nenhum no elemento, entao nao ha o que disputar.
   ========================================================================= */

.dbm-car { position:relative; }

.dbm-car:not(.is-car) .swiper-container { overflow:visible; }
.dbm-car:not(.is-car) .swiper-wrapper { display:grid; grid-template-columns:repeat(auto-fill, minmax(min(100%, 280px), 1fr)); gap:18px; transform:none; }
.dbm-car:not(.is-car) .swiper-slide { width:auto; height:auto; }

/* E A VOLTA, que faltava e que quase passou. A trilha das unidades e o mesmo
   `<ul class="dbm-pres-lista">` da grade, e `.dbm-pres-lista { display:grid }`
   mora neste arquivo, DEPOIS do `.swiper-wrapper { display:flex }` do
   `main.css`. Empate de especificidade (uma classe contra uma classe) decide
   pela ordem de carga, entao a grade continuava valendo depois de o carrossel
   iniciar: as nove unidades apareciam empilhadas em tres linhas, e as seis que
   o script marcava como fora de vista estavam na tela, com `inert` e
   `aria-hidden` por cima. Ou seja, seis cartoes visiveis e inalcancaveis pelo
   teclado, que e o pior dos dois mundos.

   A medida por JavaScript nao pegou isso, porque ela perguntava ao Swiper qual
   era o item ativo, e o Swiper respondia certo: quem estava errado era o
   desenho. Foi a fotografia que denunciou.

   `gap:0` pelo mesmo motivo, e este cobrava o preco na hora: o `gap:18px` da
   grade continuava valendo sobre a trilha em flex, somando-se aos 18px que o
   proprio Swiper poe como margem em cada item. O espaco virava 36, a conta de
   largura da biblioteca (feita com 18) deixava de fechar, e o terceiro cartao
   saia cortado 36px pela janela do bloco. Quem espaca no carrossel e o Swiper,
   sozinho. */
.dbm-car.is-car .swiper-wrapper { display:flex; gap:0; }

/* O banner e uma imagem por linha, tambem quando vira lista. */
.dbm-car--largo:not(.is-car) .swiper-wrapper { grid-template-columns:1fr; gap:10px; }

/* Aro de foco POR DENTRO: o `overflow:hidden` do carrossel corta o que passa da
   borda, e um aro desenhado para fora sumiria justamente no primeiro e no
   ultimo cartao visiveis. Por dentro ele aparece inteiro em todos. */
.dbm-car.is-car .swiper-slide :focus-visible { outline:3px solid #1b9aaa; outline-offset:-3px; }

/* O carrossel inteiro tambem recebe foco, e por isso tem aro proprio. Ele nao e
   parada de Tab (`tabindex="-1"`, posto pelo script): e o pouso de ultimo
   recurso do foco quando a barra de controles some debaixo dele, num giro de
   tela em que todos os itens passam a caber. Sem aro, esse pouso seria um foco
   invisivel, que e o defeito que ele foi criado para evitar. */
.dbm-car.is-car:focus-visible { outline:3px solid #1b9aaa; outline-offset:4px; }

.dbm-car__ctrl { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:8px; margin-top:16px; }
.dbm-car__ctrl[hidden] { display:none; }

.dbm-car__btn { display:inline-flex; align-items:center; justify-content:center; width:44px; height:44px; min-width:44px; padding:0; border:1px solid rgba(11,33,57,.16); border-radius:50%; background:#fff; color:#0A2E63; cursor:pointer; transition:background .2s ease, color .2s ease, border-color .2s ease; }
.dbm-car__btn svg { width:24px; height:24px; }
.dbm-car__btn:hover:not([disabled]) { background:#0B4DAD; border-color:#0B4DAD; color:#fff; }
.dbm-car__btn:focus-visible { outline:3px solid #1b9aaa; outline-offset:2px; }
.dbm-car__btn[disabled] { opacity:.38; cursor:default; }
.dbm-car__btn[hidden] { display:none; }

/* O alvo tem 44px; o pontinho desenhado dentro dele tem 11. Alvo de dedo nao e
   o tamanho do desenho. */
.dbm-car__dots { display:flex; align-items:center; gap:2px; }
.dbm-car__dot { display:inline-flex; align-items:center; justify-content:center; width:44px; height:44px; padding:0; border:0; background:none; cursor:pointer; }
.dbm-car__dot::before { content:""; width:11px; height:11px; border-radius:50%; background:rgba(11,33,57,.28); transition:width .25s ease, background .25s ease; }
.dbm-car__dot:hover::before { background:rgba(11,33,57,.5); }
.dbm-car__dot[aria-current]::before { width:30px; border-radius:6px; background:#0B4DAD; }
.dbm-car__dot:focus-visible { outline:3px solid #1b9aaa; outline-offset:-4px; border-radius:8px; }

.dbm-car__status { margin:0 0 0 6px; font-size:.9rem; font-weight:700; color:#52606d; }

/* ---- Banner do topo ---- */
.dbm-banner { position:relative; width:100%; margin:0 0 2.4rem; background:#0A2E63; }
.dbm-banner .swiper-slide a, .dbm-banner .swiper-slide img { display:block; width:100%; }
.dbm-banner .swiper-slide img { height:auto; }

/* AMARELO, E COM `.is-car` NO SELETOR PARA VALER. O amarelo importa porque o aro
   fica sobre a arte que o cliente subiu, e o contraste de qualquer outra cor
   depende dessa arte, que ninguem conhece de antemao. Escrito sem o `.is-car`
   (tres classes e um elemento) esta regra PERDIA para o aro geral do carrossel
   (`.dbm-car.is-car .swiper-slide :focus-visible`, quatro classes) e era codigo
   morto: medido chegando ao link por teclado de verdade, o aro que saia era o
   #1b9aaa. E a mesma armadilha de contagem de classes ja documentada no aro das
   unidades, repetida aqui e nao medida deste lado. */
.dbm-banner .swiper-slide a:focus-visible,
.dbm-banner.is-car .swiper-slide a:focus-visible { outline:3px solid #ffe600; outline-offset:-4px; }

/* Os controles ficam ABAIXO da arte, sobre o azul da casa, e nao por cima da
   imagem. Sobreposto, o contraste do botao depende da foto que o cliente subir,
   e isso nao da para garantir de antemao; aqui e branco sobre #0A2E63 sempre. */
.dbm-banner .dbm-car__ctrl { margin:0; padding:10px 12px; }
.dbm-banner .dbm-car__btn { background:rgba(255,255,255,.92); border-color:transparent; color:#0A2E63; }
.dbm-banner .dbm-car__btn:hover:not([disabled]) { background:#fff; color:#0B4DAD; }
.dbm-banner .dbm-car__btn:focus-visible { outline:3px solid #ffe600; outline-offset:2px; }
.dbm-banner .dbm-car__dot::before { background:rgba(255,255,255,.5); }
.dbm-banner .dbm-car__dot:hover::before { background:rgba(255,255,255,.8); }
.dbm-banner .dbm-car__dot[aria-current]::before { background:#fff; }
.dbm-banner .dbm-car__dot:focus-visible { outline:3px solid #ffe600; }
.dbm-banner .dbm-car__status { color:rgba(255,255,255,.9); }

@media (max-width:768px){
	.dbm-banner { margin-bottom:1.6rem; }
}

/* ---- Editorias na home (tiles com ícone grande da área) ---- */
.dbm-edshort { padding-top:2.4rem; }
.dbm-eds { display:flex; flex-wrap:wrap; justify-content:center; gap:1.5rem 2.2rem; }
.dbm-ed { display:flex; flex-direction:column; align-items:center; gap:.6rem; width:130px; text-decoration:none; }
.dbm-ed__ic { display:flex; align-items:center; justify-content:center; }
.dbm-ed__ic img { width:100px; height:100px; object-fit:contain; filter:drop-shadow(0 12px 24px rgba(11,33,57,.22)); transition:transform .25s ease, filter .25s ease; }
.dbm-ed:hover .dbm-ed__ic img { transform:translateY(-5px) scale(1.06); filter:drop-shadow(0 18px 32px rgba(11,33,57,.30)); }
.dbm-ed__lbl { font-size:.84rem; font-weight:800; letter-spacing:.03em; text-transform:uppercase; color:#0A2E63; text-align:center; line-height:1.2; }
.dbm-ed:hover .dbm-ed__lbl { color:var(--c,#0B4DAD); }
.dbm-ed__chev { width:14px; height:14px; color:#b8c0d0; margin-top:-.2rem; transition:color .2s ease; }
.dbm-ed:hover .dbm-ed__chev { color:var(--c,#0B4DAD); }
@media (max-width:640px){
	.dbm-eds { gap:1.1rem 1.4rem; }
	.dbm-ed { width:98px; }
	.dbm-ed__ic img { width:78px; height:78px; }
	.dbm-ed__lbl { font-size:.72rem; }
}
/* arranjo de celular (logo à esquerda) até 767px: entre 641 e 767 o grupo da direita já cobria o logo centralizado */
@media (max-width:767px){
	.dbm-hhome__row { min-height:70px; justify-content:space-between; }
	.dbm-hhome__logo img { max-height:46px; }
	.dbm-hhome__actions { position:static; transform:none; gap:.45rem; }
	.dbm-hhome__social a { width:30px; height:30px; }
	.dbm-hhome__social a i::before { font-size:13px; }
	.dbm-hhome .dbm-search { width:36px; height:36px; }
	.dbm-hhome__label { font-size:.62rem; letter-spacing:.22em; }
	.dbm-hhome__label::before, .dbm-hhome__label::after { width:16px; margin:0 .5em; }
}
@media (max-width:400px){ .dbm-hhome__logo img { max-height:40px; } }

/* =======================================================================
   HOME REPAGINADA
   ======================================================================= */
.dbm-modern-top { background:#f5f7fc; }
.dbm-home .l-banner { margin:0; }
.dbm-home .l-banner img { width:100%; }

/* cabeçalho de seção */
.dbm-sec-head { text-align:center; max-width:640px; margin:0 auto 2.4rem; }
.dbm-sec-head__kicker { display:inline-block; font-size:.72rem; font-weight:700; letter-spacing:.15em; text-transform:uppercase; color:#C12811; margin-bottom:.5rem; }
.dbm-sec-head__title { font-size:2rem; font-weight:800; color:#0A2E63; margin:0; line-height:1.1; }
.dbm-sec-head__title::after { content:''; display:block; width:54px; height:4px; border-radius:3px; background:#C12811; margin:.85rem auto 0; }

/* editorias — cards verticais com o ícone real da área */
.dbm-editorias { padding:3.6rem 0 1.4rem; }
.dbm-editorias__grid { display:grid; grid-template-columns:repeat(6,1fr); gap:1rem; }
@media (max-width:1199px){ .dbm-editorias__grid{ grid-template-columns:repeat(3,1fr); } }
@media (max-width:575px){ .dbm-editorias__grid{ grid-template-columns:repeat(2,1fr); } }
.dbm-ed-card { display:flex; flex-direction:column; align-items:center; text-align:center; gap:.7rem; padding:1.7rem 1rem 1.4rem; background:#fff; border-radius:18px; text-decoration:none; box-shadow:0 6px 22px rgba(11,33,57,.06); border:1px solid rgba(11,33,57,.05); transition:transform .25s ease, box-shadow .25s ease; }
.dbm-ed-card:hover { transform:translateY(-6px); box-shadow:0 18px 38px rgba(11,33,57,.13); }
.dbm-ed-card__icon { width:92px; height:92px; border-radius:50%; background:#fff; border:3px solid var(--ed,#0B4DAD); display:flex; align-items:center; justify-content:center; box-shadow:0 10px 22px rgba(11,33,57,.08); transition:transform .25s ease, box-shadow .25s ease; }
.dbm-ed-card__icon img { width:54px; height:54px; object-fit:contain; }
.dbm-ed-card:hover .dbm-ed-card__icon { transform:scale(1.05); box-shadow:0 14px 28px rgba(11,33,57,.16); }
.dbm-ed-card__name { font-weight:700; color:#0A2E63; font-size:1rem; line-height:1.2; }
.dbm-ed-card__count { font-size:.7rem; color:#fff; font-weight:700; background:var(--ed,#0B4DAD); border-radius:100px; padding:.2rem .7rem; letter-spacing:.02em; }

/* selo de editoria */
.dbm-pill { display:inline-block; width:max-content; padding:.28rem .8rem; border-radius:100px; background:var(--ed,#0B4DAD); color:#fff !important; font-size:.68rem; font-weight:700; letter-spacing:.05em; text-transform:uppercase; }
.dbm-pill--sm { font-size:.62rem; padding:.22rem .6rem; }

/* notícias magazine */
.dbm-news { padding:3.6rem 0 4.8rem; }
.dbm-news__layout { display:grid; grid-template-columns:1.15fr 1fr; gap:1.5rem; align-items:start; }
@media (max-width:991px){ .dbm-news__layout{ grid-template-columns:1fr; } }
.dbm-news__feat { display:flex; flex-direction:column; background:#fff; border-radius:20px; overflow:hidden; text-decoration:none; box-shadow:0 10px 30px rgba(11,33,57,.08); transition:transform .25s ease, box-shadow .25s ease; }
.dbm-news__feat:hover { transform:translateY(-4px); box-shadow:0 20px 44px rgba(11,33,57,.14); }
.dbm-news__feat-img { display:block; height:340px; background:#dfe5f0 center/cover no-repeat; }
.dbm-news__feat-body { display:flex; flex-direction:column; gap:.55rem; padding:1.6rem; }
.dbm-news__feat-title { font-size:1.5rem; font-weight:800; color:#0A2E63; line-height:1.2; }
.dbm-news__feat-exc { color:#5B5B5B; font-size:.95rem; }
.dbm-news__date { font-size:.8rem; color:#8a93a6; font-weight:600; }
.dbm-news__grid { display:flex; flex-direction:column; gap:1.1rem; }
.dbm-news__card { display:flex; gap:1rem; background:#fff; border-radius:16px; overflow:hidden; text-decoration:none; box-shadow:0 6px 22px rgba(11,33,57,.06); transition:transform .25s ease, box-shadow .25s ease; }
.dbm-news__card:hover { transform:translateY(-3px); box-shadow:0 14px 32px rgba(11,33,57,.12); }
.dbm-news__card-img { flex:0 0 130px; align-self:stretch; min-height:120px; background:#dfe5f0 center/cover no-repeat; }
.dbm-news__card-body { display:flex; flex-direction:column; gap:.35rem; padding:.9rem 1rem .9rem 0; }
.dbm-news__card-title { font-size:.98rem; font-weight:700; color:#0A2E63; line-height:1.25; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.dbm-news__more { text-align:center; margin-top:2.6rem; }
.dbm-btn { display:inline-block; padding:.85rem 2.1rem; border-radius:100px; background:#0B4DAD; color:#fff !important; font-weight:700; text-decoration:none; letter-spacing:.02em; transition:background .2s ease, transform .2s ease; }
.dbm-btn:hover { background:#0A2E63; transform:translateY(-2px); }

/* =======================================================================
   MODERNIZAÇÃO DAS SEÇÕES ORIGINAIS (escopo .dbm-home)
   ======================================================================= */

/* ritmo vertical + fundo alternado */
.dbm-home > .l-shortcut,
.dbm-home > .l-most-read,
.dbm-home > .l-videos,
.dbm-home > .l-blogs,
.dbm-home > .l-calendar,
.dbm-home > .l-mvv,
.dbm-home > .l-links,
.dbm-home > .l-contact { margin:0 !important; padding:3rem 0 !important; }
.dbm-home > .l-videos, .dbm-home > .l-calendar, .dbm-home > .l-contact { background:#f5f7fc; }

/* títulos de seção — tira a caixa vermelha e o "//", vira título limpo com barra */
.dbm-home .c-title, .dbm-home .c-title__small {
	background:transparent !important; color:#0A2E63 !important;
	padding:0 !important; margin-bottom:.4rem !important;
	font-weight:800 !important; font-size:1.7rem !important; line-height:1.15 !important;
	display:inline-block !important; text-transform:none !important;
}
.dbm-home .c-title *, .dbm-home .c-title__small * { color:#0A2E63 !important; }
.dbm-home .c-title > span:first-child, .dbm-home .c-title__small > span:first-child { display:none !important; }
.dbm-home .c-title::after, .dbm-home .c-title__small::after {
	content:''; display:block; width:48px; height:4px; border-radius:3px; background:#C12811; margin-top:.55rem;
}
.dbm-home .c-text-pattern { color:#5B5B5B !important; font-size:1rem !important; }

/* remove bordas/linhas vermelhas datadas */
.dbm-home .u-border-top-2.u-border-color-secondary { border-top:0 !important; }
.dbm-home .l-most-read__title-line::before,
.dbm-home .l-videos, .dbm-home .l-blogs, .dbm-home .l-contact { border-top:0 !important; }

/* cards de vídeo */
.dbm-home .l-videos .card { background:#fff !important; border-radius:16px !important; overflow:hidden; box-shadow:0 8px 24px rgba(11,33,57,.08); transition:transform .25s ease, box-shadow .25s ease; height:100%; }
.dbm-home .l-videos .card:hover { transform:translateY(-4px); box-shadow:0 16px 34px rgba(11,33,57,.14); }
.dbm-home .l-videos__card-title { padding:1rem 1.1rem !important; font-size:1rem !important; color:#0A2E63 !important; text-align:left !important; }

/* mais lidas — vira cards */
.dbm-home .l-most-read__post-link { display:block; height:100%; background:#fff; border-radius:16px; padding:1.4rem 1.5rem; box-shadow:0 6px 20px rgba(11,33,57,.06); transition:transform .25s ease, box-shadow .25s ease; }
.dbm-home .l-most-read__post-link:hover { transform:translateY(-4px); box-shadow:0 14px 30px rgba(11,33,57,.12); }
.dbm-home .l-most-read__post-link::before { display:none !important; }
.dbm-home .l-most-read__post-title { font-size:1.02rem !important; }

/* blogs */
.dbm-home .l-blogs__card-img, .dbm-home .l-blogs .card { border-radius:16px !important; overflow:hidden; }

/* MVV */
.dbm-home .l-mvv__title * { color:#0A2E63 !important; }
.dbm-home .l-mvv img { border-radius:16px; }

/* calendário */
.dbm-home .l-calendar__date, .dbm-home .l-calendar__title { color:#0B4DAD !important; }

/* contato */
.dbm-home .l-contact iframe { width:100% !important; border:0 !important; border-radius:16px; box-shadow:0 8px 24px rgba(11,33,57,.08); }
.dbm-home .l-contact input[type="text"], .dbm-home .l-contact input[type="email"] { border:1px solid #d5dbe8 !important; border-radius:12px !important; padding:.9rem 1rem !important; }

/* botões → pill azul */
.dbm-home .l-calendar__btn, .dbm-home .l-blogs__btn-more-content, .dbm-home .l-contact__btn-submit, .dbm-home .l-shortcut__link {
	border-radius:100px !important; border:0 !important; background:#0B4DAD !important; color:#fff !important; font-weight:700 !important; transition:background .2s ease, transform .2s ease;
}
.dbm-home .l-calendar__btn:hover, .dbm-home .l-blogs__btn-more-content:hover, .dbm-home .l-contact__btn-submit:hover { background:#0A2E63 !important; color:#fff !important; transform:translateY(-2px); }

/* =======================================================================
   PORTAL DE NOTÍCIAS — layout moderno arredondado
   ======================================================================= */
.dbm-home { background:#f4f6fb; }
.dbm-sec { padding:3rem 0; }
.dbm-head { margin:0 0 1.8rem; }
.dbm-head__k { display:block; font-size:.72rem; font-weight:700; letter-spacing:.15em; text-transform:uppercase; color:#E23A2E; margin-bottom:.35rem; }
.dbm-head h2 { font-size:1.9rem; font-weight:800; color:#12294A; letter-spacing:-.01em; margin:0; }

/* nav rápida de editorias (chips) */
.dbm-ednav { background:#fff; border-bottom:1px solid #e9edf6; }
.dbm-ednav__row { display:flex; gap:.6rem; overflow-x:auto; padding:.9rem 0; scrollbar-width:none; }
.dbm-ednav__row::-webkit-scrollbar { display:none; }
.dbm-chip { display:inline-flex; align-items:center; gap:.5rem; flex:0 0 auto; padding:.45rem 1rem .45rem .5rem; border-radius:999px; background:#f4f6fb; border:1px solid #e9edf6; text-decoration:none; transition:all .2s ease; }
.dbm-chip img { width:30px; height:30px; object-fit:contain; }
.dbm-chip span { font-weight:700; font-size:.85rem; color:#12294A; white-space:nowrap; }
.dbm-chip:hover { background:var(--c,#0B4DAD); border-color:var(--c,#0B4DAD); transform:translateY(-2px); }
.dbm-chip:hover span { color:#fff; }

/* selo de editoria */
.dbm-pill { display:inline-block; width:max-content; padding:.24rem .7rem; border-radius:999px; background:var(--c,#0B4DAD); color:#fff !important; font-size:.64rem; font-weight:700; letter-spacing:.05em; text-transform:uppercase; }

/* card de notícia (base) */
.dbm-card { display:flex; text-decoration:none; background:#fff; border-radius:20px; overflow:hidden; box-shadow:0 12px 30px rgba(18,41,74,.07); transition:transform .25s ease, box-shadow .25s ease; }
.dbm-card:hover { transform:translateY(-5px); box-shadow:0 22px 46px rgba(18,41,74,.14); }
.dbm-card__img { background:#dfe5f0 center/cover no-repeat; display:block; }
.dbm-card__body { display:flex; flex-direction:column; gap:.5rem; padding:1rem 1.1rem 1.15rem; }
.dbm-card__title { font-weight:700; color:#12294A; line-height:1.28; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.dbm-card__date { font-size:.76rem; color:#667089; font-weight:600; margin-top:auto; }

/* destaques magazine */
.dbm-mag { display:grid; grid-template-columns:1.2fr .8fr; gap:1.4rem; align-items:start; }
.dbm-card--feat { flex-direction:column; }
.dbm-card--feat .dbm-card__img { height:360px; }
.dbm-card--feat .dbm-card__body { padding:1.4rem 1.5rem 1.6rem; }
.dbm-card--feat .dbm-card__title { font-size:1.55rem; font-weight:800; }
.dbm-mag__side { display:flex; flex-direction:column; gap:1rem; }
.dbm-card--row { flex-direction:row; }
.dbm-card--row .dbm-card__img { flex:0 0 118px; align-self:stretch; min-height:112px; }
.dbm-card--row .dbm-card__title { font-size:.95rem; }

/* variante sm (grades de notícias, juventude, leia também) */
.dbm-card--sm { flex-direction:column; }
.dbm-card--sm .dbm-card__img { height:170px; }
.dbm-card--sm .dbm-card__title { font-size:.95rem; }
@media (max-width:820px){ .dbm-mag { grid-template-columns:1fr; } }

/* notícias por editoria */
.dbm-ednews { padding:2.6rem 0; }
.dbm-ednews:nth-of-type(even) { background:#fff; }
.dbm-ednews__head { display:flex; align-items:center; gap:.85rem; margin-bottom:1.4rem; }
.dbm-ednews__icon { width:56px; height:56px; border-radius:50%; background:#fff; border:2px solid var(--c,#0B4DAD); display:grid; place-items:center; flex:0 0 auto; box-shadow:0 8px 18px rgba(18,41,74,.08); }
.dbm-ednews__icon img { width:32px; height:32px; object-fit:contain; }
.dbm-ednews__head h2 { font-size:1.5rem; font-weight:800; color:#12294A; margin:0; }
.dbm-ednews__all { margin-left:auto; font-weight:700; font-size:.85rem; color:var(--c,#0B4DAD); white-space:nowrap; text-decoration:none; }
.dbm-ednews__all:hover { text-decoration:underline; }
.dbm-ednews__grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1.1rem; }
.dbm-ednews__grid .dbm-card { flex-direction:column; }
.dbm-ednews__grid .dbm-card__img { height:150px; }
.dbm-ednews__grid .dbm-card__title { font-size:.95rem; }
@media (max-width:900px){ .dbm-ednews__grid { grid-template-columns:repeat(2,1fr); } }
@media (max-width:520px){ .dbm-ednews__grid { grid-template-columns:1fr; } }

/* =======================================================================
   MODERNIZAÇÃO TOTAL DAS SEÇÕES ORIGINAIS (escopo .dbm-home)
   ======================================================================= */
.dbm-home > .l-shortcut, .dbm-home > .l-most-read, .dbm-home > .l-videos, .dbm-home > .l-blogs,
.dbm-home > .l-calendar, .dbm-home > .l-mvv, .dbm-home > .l-links, .dbm-home > .l-contact,
.dbm-home > .l-illustration { margin:0 !important; padding:3.2rem 0 !important; }
.dbm-home > .l-videos, .dbm-home > .l-blogs, .dbm-home > .l-calendar, .dbm-home > .l-links { background:#fff; }

/* títulos: sem caixa vermelha, navy + barra fina */
.dbm-home .c-title, .dbm-home .c-title__small { background:transparent !important; color:#12294A !important; padding:0 !important; margin:0 0 .55rem !important; font-weight:800 !important; font-size:1.8rem !important; line-height:1.1 !important; display:inline-block !important; text-transform:none !important; letter-spacing:-.01em; }
.dbm-home .c-title *, .dbm-home .c-title__small * { color:#12294A !important; }
.dbm-home .c-title > span:first-child, .dbm-home .c-title__small > span:first-child { display:none !important; }
.dbm-home .c-title::after, .dbm-home .c-title__small::after { content:""; display:block; width:46px; height:4px; border-radius:3px; background:#E23A2E; margin-top:.55rem; }
.dbm-home .c-text-pattern { color:#667089 !important; font-size:1rem !important; }

/* remove bordas/linhas vermelhas */
.dbm-home .u-border-top-2 { border-top:0 !important; }
.dbm-home .l-most-read__title-line::before { display:none !important; }

/* imagens arredondadas em geral */
.dbm-home .card-img, .dbm-home .card-img img, .dbm-home .l-blogs__card-img img, .dbm-home .l-illustration img,
.dbm-home .js-swiper-banner-materials img, .dbm-home .l-videos iframe, .dbm-home .l-videos__card-video, .dbm-home .l-mvv img { border-radius:18px !important; }

/* cards de blog e vídeo */
.dbm-home .l-blogs .card, .dbm-home .l-videos .card { background:#fff !important; border-radius:20px !important; box-shadow:0 12px 30px rgba(18,41,74,.07); overflow:hidden; transition:transform .25s ease, box-shadow .25s ease; }
.dbm-home .l-blogs .card:hover, .dbm-home .l-videos .card:hover { transform:translateY(-6px); box-shadow:0 22px 44px rgba(18,41,74,.14); }
.dbm-home .l-blogs .card-body, .dbm-home .l-videos .card-body { padding:1rem 1.2rem 1.2rem !important; }
.dbm-home .l-blogs__card-title { font-size:1.05rem !important; color:#12294A !important; }
.dbm-home .l-blogs__card-text { color:#667089 !important; font-size:.86rem !important; }
.dbm-home .l-blogs__card-text .u-color-folk-secondary { color:#E23A2E !important; }
.dbm-home .l-videos__card-title { font-size:1rem !important; color:#12294A !important; text-align:left !important; padding:0 !important; }

/* botões → pill */
.dbm-home .l-blogs__read-more { background:#EAF1FC !important; color:#0B4DAD !important; border-radius:999px !important; padding:.62rem 1.3rem !important; font-size:.85rem; }
.dbm-home .l-blogs__read-more:hover { background:#0B4DAD !important; color:#fff !important; }
.dbm-home .l-blogs__btn-more-content, .dbm-home .l-calendar__btn, .dbm-home .l-contact__btn-submit { border-radius:999px !important; border:0 !important; background:#0B4DAD !important; color:#fff !important; font-weight:700 !important; }
.dbm-home .l-blogs__btn-more-content:hover, .dbm-home .l-calendar__btn:hover, .dbm-home .l-contact__btn-submit:hover { background:#0A2E63 !important; color:#fff !important; transform:translateY(-2px); }

/* atalhos (Links de Categorias) → pills com contorno colorido */
.dbm-home .l-shortcut ul { display:flex !important; flex-wrap:wrap; gap:.7rem; justify-content:center; }
.dbm-home .l-shortcut__item { border-width:2px !important; border-style:solid !important; border-radius:999px !important; background:#fff; padding:0 !important; margin:0 !important; box-shadow:0 6px 16px rgba(18,41,74,.05); transition:transform .2s ease, box-shadow .2s ease; }
.dbm-home .l-shortcut__item:hover { transform:translateY(-3px); box-shadow:0 12px 24px rgba(18,41,74,.13); }
.dbm-home .l-shortcut__link { display:block; padding:.55rem 1.4rem !important; }

/* mais lidas (Destaques da Juventude) → cards */
.dbm-home .l-most-read { background:#fff; }
.dbm-home .l-most-read__post-link { display:block; height:100%; background:#f4f6fb; border-radius:18px; padding:1.4rem 1.5rem; transition:transform .25s ease, box-shadow .25s ease; }
.dbm-home .l-most-read__post-link:hover { transform:translateY(-4px); box-shadow:0 14px 30px rgba(18,41,74,.12); background:#fff; }
.dbm-home .l-most-read__post-link::before { display:none !important; }
.dbm-home .l-most-read__post-title { font-size:1.02rem !important; }

/* links úteis → logos grayscale→cor */
.dbm-home .l-links img { max-height:54px; width:auto; filter:grayscale(1); opacity:.65; transition:filter .25s ease, opacity .25s ease, transform .25s ease; margin:.6rem 1rem; }
.dbm-home .l-links img:hover { filter:none; opacity:1; transform:translateY(-3px); }

/* banners promocionais / materiais → arredondados */
.dbm-home .l-illustration img { border-radius:20px !important; box-shadow:0 12px 30px rgba(18,41,74,.08); width:100%; object-fit:cover; }
.dbm-home .js-swiper-banner-materials img { border-radius:20px !important; }

/* MVV */
.dbm-home .l-mvv__title * { color:#12294A !important; }

/* contato / presença salesiana */
.dbm-home .l-contact { background:#f4f6fb; }
.dbm-home .l-contact iframe { width:100% !important; border:0 !important; border-radius:20px !important; box-shadow:0 12px 30px rgba(18,41,74,.08); }
.dbm-home .l-contact input[type="text"], .dbm-home .l-contact input[type="email"] { border:1px solid #d5dbe8 !important; border-radius:14px !important; padding:.9rem 1.1rem !important; }

/* outras notícias / últimas de paróquia */
.dbm-home .l-other-posts { padding:3.2rem 0 !important; }
.dbm-home .l-other-posts__col-border { border-bottom:1px solid #e9edf6 !important; }
.dbm-home .l-other-posts__post-tag { border-radius:999px !important; }
.dbm-home .l-other-posts__post-title { color:#12294A !important; }

/* Calendário / Agenda (reconstruído) */
/* ==========================================================================
   Calendário do mês, na home.

   Grade cronológica em vez de duas colunas por categoria. A grade e o
   `auto-fill` sao o conserto do vao: com 18 itens em tres colunas sobram no
   maximo dois buracos na ultima fila, e nao os 700px que a coluna curta
   deixava. O equilibrio passa a ser garantido pelo layout, e nao pela sorte de
   as categorias terem o mesmo tamanho.
   ========================================================================== */
.dbm-cal { padding:3.2rem 0; background:#fff; }
.dbm-cal__topo { display:flex; align-items:baseline; justify-content:space-between; gap:1rem; flex-wrap:wrap; margin:.2rem 0 .9rem; }
.dbm-cal__mes { margin:0; font-size:1.5rem; font-weight:800; color:#0B4DAD; letter-spacing:-.01em; }
.dbm-cal__mes span { color:#8792a8; font-weight:700; }
.dbm-cal__resumo { margin:0; font-size:.86rem; color:#5b6780; }

.dbm-cal__legenda { list-style:none; margin:0 0 1.3rem; padding:0; display:flex; gap:.4rem .9rem; flex-wrap:wrap; }
.dbm-cal__legenda li { display:inline-flex; align-items:center; gap:.4rem; font-size:.76rem; font-weight:700; color:#4a5670; }
.dbm-cal__legenda li::before { content:""; width:9px; height:9px; border-radius:3px; background:var(--c,#0B4DAD); }

/* `minmax(0,1fr)` e nao `1fr`: nome longo de confrade sem o minmax empurra a
   coluna e estoura a grade na horizontal. Ja aconteceu na pagina dos padres. */
.dbm-cal__grade { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(auto-fill,minmax(min(100%,310px),1fr)); gap:.7rem; }
.dbm-cal__item { display:flex; align-items:center; gap:.85rem; min-width:0; background:#f6f8fc; border:1px solid rgba(11,33,57,.06); border-left:4px solid var(--c,#0B4DAD); border-radius:14px; padding:.7rem .9rem; transition:transform .18s ease, box-shadow .18s ease, background .18s ease; }
.dbm-cal__item:hover { transform:translateY(-2px); background:#fff; box-shadow:0 10px 24px rgba(18,41,74,.10); }

.dbm-cal__dia { flex:0 0 auto; width:46px; display:flex; flex-direction:column; align-items:center; line-height:1; }
.dbm-cal__dia b { font-size:1.35rem; font-weight:800; color:#12294A; font-variant-numeric:tabular-nums; }
.dbm-cal__dia small { margin-top:.15rem; font-size:.66rem; font-weight:700; text-transform:uppercase; letter-spacing:.06em; color:#8792a8; }

.dbm-cal__txt { min-width:0; display:flex; flex-direction:column; gap:.25rem; }
.dbm-cal__tag { align-self:flex-start; background:var(--c,#0B4DAD); color:#fff; font-size:.65rem; font-weight:800; text-transform:uppercase; letter-spacing:.05em; padding:.15rem .45rem; border-radius:5px; }
.dbm-cal__nome { font-size:.9rem; font-weight:600; color:#12294A; line-height:1.3; overflow-wrap:anywhere; }

/* O que ja passou apaga, e nao desaparece: a pessoa que abre a home no dia 28
   ainda quer ver a memoria do dia 2. Fica em 62% de opacidade, que mantem o
   texto legivel, e nao em cinza cravado, que apagaria a cor da etiqueta. */
.dbm-cal__item.is-passado { background:#fafbfd; opacity:.62; }
.dbm-cal__item.is-passado:hover { opacity:1; }

.dbm-cal__item.is-hoje { background:#fff; border-color:rgba(11,77,173,.35); box-shadow:0 0 0 2px rgba(11,77,173,.18); }
.dbm-cal__hoje { margin-left:auto; flex:0 0 auto; align-self:flex-start; background:#E23A2E; color:#fff; font-size:.63rem; font-weight:800; text-transform:uppercase; letter-spacing:.06em; padding:.15rem .4rem; border-radius:5px; }

.dbm-cal__vazio { color:#667089; padding:1rem 0; margin:0; }
.dbm-cal__btns { display:flex; gap:.8rem; margin-top:1.5rem; flex-wrap:wrap; }

@media (max-width:520px){
	.dbm-cal { padding:2.4rem 0; }
	.dbm-cal__grade { gap:.55rem; }
	.dbm-cal__item { padding:.6rem .75rem; gap:.7rem; }
	.dbm-cal__dia { width:40px; }
	.dbm-cal__dia b { font-size:1.2rem; }
}

/* Quem pede menos movimento nao ganha o levantar no hover. */
@media (prefers-reduced-motion:reduce){
	.dbm-cal__item { transition:none; }
	.dbm-cal__item:hover { transform:none; }
}

.dbm-agenda { padding:3.2rem 0; background:#fff; }
.dbm-agenda__month { font-size:1.5rem; font-weight:800; color:#0B4DAD; letter-spacing:-.01em; margin:.2rem 0 1.4rem; }
.dbm-agenda__grid { display:grid; grid-template-columns:repeat(2,1fr); gap:.9rem; }
.dbm-agenda__cols { display:grid; grid-template-columns:1fr 1fr; gap:2.2rem; }
@media (max-width:720px){ .dbm-agenda__cols { grid-template-columns:1fr; gap:1.6rem; } }
.dbm-agenda__coltitle { font-size:1.1rem; font-weight:800; color:#0B4DAD; margin:0 0 1rem; padding-bottom:.6rem; border-bottom:2px solid #EAF1FC; }
.dbm-agenda__list { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:.7rem; }
.dbm-agenda__item { display:flex; align-items:center; gap:1rem; background:#f4f6fb; border-radius:16px; padding:.9rem 1.1rem; transition:transform .2s ease, box-shadow .2s ease; }
.dbm-agenda__item:hover { transform:translateY(-3px); box-shadow:0 12px 26px rgba(18,41,74,.10); background:#fff; }
.dbm-agenda__day { flex:0 0 auto; width:54px; height:54px; border-radius:14px; background:#0B4DAD; color:#fff; display:grid; place-items:center; font-weight:800; font-size:1.35rem; }
.dbm-agenda__title { font-weight:600; color:#12294A; line-height:1.3; }
.dbm-agenda__empty { color:#667089; padding:1rem 0; }
.dbm-agenda__btns { display:flex; gap:.8rem; margin-top:1.6rem; flex-wrap:wrap; }
.dbm-btn--ghost { background:#EAF1FC !important; color:#0B4DAD !important; }
.dbm-btn--ghost:hover { background:#0B4DAD !important; color:#fff !important; }
@media (max-width:640px){ .dbm-agenda__grid { grid-template-columns:1fr; } }

/* Destaques da Juventude */
.dbm-youth { background:#f4f6fb; }
.dbm-youth__grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.2rem; }
.dbm-youth__grid .dbm-card { flex-direction:column; }
.dbm-youth__grid .dbm-card__img { height:190px; }
@media (max-width:820px){ .dbm-youth__grid { grid-template-columns:1fr; } }

/* Vídeos (canal do YouTube) */
.dbm-videos { background:#fff; }
.dbm-vidrow { display:flex; align-items:center; gap:.7rem; }
.dbm-vidtrack { display:flex; gap:1rem; overflow-x:auto; scroll-snap-type:x mandatory; padding:.4rem; flex:1; scrollbar-width:none; }
.dbm-vidtrack::-webkit-scrollbar { display:none; }
.dbm-vid { flex:0 0 300px; scroll-snap-align:start; text-decoration:none; }
@media (max-width:820px){ .dbm-vid { flex-basis:80%; } }
.dbm-vid__thumb { display:block; position:relative; height:180px; border-radius:18px; background:#12294A center/cover no-repeat; overflow:hidden; }
.dbm-vid__thumb::after { content:""; position:absolute; inset:0; background:rgba(10,37,64,.10); transition:background .25s ease; }
.dbm-vid:hover .dbm-vid__thumb::after { background:rgba(10,37,64,.30); }
.dbm-vid__play { position:absolute; z-index:2; left:50%; top:50%; transform:translate(-50%,-50%); width:58px; height:58px; border-radius:50%; background:#E23A2E; display:grid; place-items:center; box-shadow:0 10px 24px rgba(226,58,46,.42); transition:transform .25s ease; }
.dbm-vid:hover .dbm-vid__play { transform:translate(-50%,-50%) scale(1.1); }
.dbm-vid__title { display:block; margin-top:.7rem; font-weight:700; color:#12294A; font-size:.95rem; line-height:1.3; }
.dbm-vidnav { flex:0 0 auto; width:46px; height:46px; border-radius:50%; border:0; background:#EAF1FC; color:#0B4DAD; font-size:1.7rem; line-height:1; cursor:pointer; display:grid; place-items:center; transition:background .2s ease, color .2s ease, transform .2s ease; }
.dbm-vidnav:hover { background:#0B4DAD; color:#fff; transform:scale(1.07); }
@media (max-width:640px){ .dbm-vidnav { display:none; } }

/* MVV compacto (3 colunas) */
.dbm-mvv { background:#f4f6fb; }
.dbm-mvv__grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.4rem; }
.dbm-mvv__card { background:#fff; border-radius:20px; overflow:hidden; box-shadow:0 12px 30px rgba(18,41,74,.07); text-align:center; transition:transform .25s ease, box-shadow .25s ease; }
.dbm-mvv__card:hover { transform:translateY(-6px); box-shadow:0 20px 42px rgba(18,41,74,.13); }
.dbm-mvv__img { display:block; height:168px; background:#12294A center/cover no-repeat; }
.dbm-mvv__body { padding:1.3rem 1.5rem 1.6rem; }
.dbm-mvv__title { font-size:1.2rem; font-weight:800; color:#0B4DAD; margin:0 0 .5rem; }
.dbm-mvv__text { color:#667089; font-size:.92rem; margin:0; line-height:1.55; }
@media (max-width:820px){ .dbm-mvv__grid { grid-template-columns:1fr; } }

/* banner do topo — largura total (usa o espaço todo) */
.dbm-home > .l-banner { margin:0 !important; padding:0 !important; }
.dbm-home .l-banner .container, .dbm-home .l-banner .container-fluid { max-width:100% !important; padding:0 !important; }
.dbm-home .l-banner .swiper-slide img, .dbm-home .l-banner img { width:100%; height:auto; max-height:none; object-fit:cover; display:block; }
.dbm-home .dbm-sec:first-of-type { padding-top:2.4rem; }

/* banner de materiais (e-book) — menor e centralizado */
.dbm-home .js-swiper-banner-materials { max-width:920px; margin:2.4rem auto; border-radius:22px; overflow:hidden; box-shadow:0 16px 40px rgba(18,41,74,.12); }
.dbm-home .js-swiper-banner-materials img { border-radius:22px !important; width:100%; }

/* Links de Categorias — barra horizontal (rolagem numa linha só) */
.dbm-home .l-shortcut ul { display:flex !important; flex-wrap:nowrap; gap:.7rem; justify-content:flex-start; overflow-x:auto; padding:.4rem 2px 1rem; scrollbar-width:none; }
.dbm-home .l-shortcut ul::-webkit-scrollbar { display:none; }
.dbm-home .l-shortcut__item { flex:0 0 auto; }

/* animação de entrada (scroll reveal) */
.dbm-reveal { opacity:0; transform:translateY(26px); transition:opacity .7s cubic-bezier(.22,.61,.36,1), transform .7s cubic-bezier(.22,.61,.36,1); }
.dbm-reveal.is-in { opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce){ .dbm-reveal { opacity:1 !important; transform:none !important; transition:none !important; } }

/* micro-interação: zoom sutil na imagem do card no hover */
.dbm-card__img { transition:transform .55s ease; }
.dbm-card:hover .dbm-card__img { transform:scale(1.07); }

/* faixa de números / impacto (contagem animada) */
.dbm-stats { padding:1rem 0 3rem; }
.dbm-stats__band { position:relative; overflow:hidden; background:#0A2540; border-radius:28px; display:grid; grid-template-columns:repeat(4,1fr); gap:1.5rem; padding:2.6rem 2rem; }
.dbm-stats__band::before { content:""; position:absolute; width:300px; height:300px; right:-90px; top:-130px; border-radius:50%; background:rgba(37,99,201,.28); }
.dbm-stat { position:relative; text-align:center; }
.dbm-stat b { display:block; font-size:3rem; font-weight:800; color:#fff; letter-spacing:-.02em; line-height:1; font-variant-numeric:tabular-nums; }
.dbm-stat span { color:#7FB0F2; font-size:.9rem; font-weight:600; }
@media (max-width:640px){ .dbm-stats__band { grid-template-columns:repeat(2,1fr); gap:1.8rem; } .dbm-stat b { font-size:2.4rem; } }

/* botão voltar ao topo */
.dbm-top { position:fixed; right:22px; bottom:22px; z-index:60; width:50px; height:50px; border:0; border-radius:50%; background:#0B4DAD; box-shadow:0 12px 28px rgba(11,77,173,.42); cursor:pointer; display:grid; place-items:center; opacity:0; visibility:hidden; transform:translateY(14px); transition:opacity .3s ease, transform .3s ease, background .2s ease; }
.dbm-top.is-show { opacity:1; visibility:visible; transform:none; }
.dbm-top:hover { background:#0A2E63; }

/* header encolhe ao rolar */
.dbm-header__logo img, .dbm-nav { transition:all .3s ease; }
.dbm-header.is-stuck .dbm-header__logo img { max-height:48px; }
.dbm-header.is-stuck .dbm-nav { min-height:54px; }

/* MVV — faixa identidade navy com ícones */
.dbm-mvv2 { padding:3rem 0; background:#f4f6fb; }
.dbm-mvv2__band { position:relative; overflow:hidden; background:#0A2540; border-radius:28px; padding:3rem 3rem 3.4rem; }
.dbm-mvv2__band::before { content:""; position:absolute; width:360px; height:360px; right:-110px; top:-150px; border-radius:50%; background:rgba(37,99,201,.30); }
.dbm-mvv2__band::after { content:""; position:absolute; width:260px; height:260px; left:-100px; bottom:-140px; border-radius:50%; background:rgba(226,58,46,.16); }
.dbm-mvv2__head { position:relative; text-align:center; margin-bottom:2.4rem; }
.dbm-mvv2__k { display:block; font-size:.72rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:#7FB0F2; margin-bottom:.4rem; }
.dbm-mvv2__head h2 { color:#fff; font-size:1.9rem; font-weight:800; letter-spacing:-.01em; margin:0; }
.dbm-mvv2__grid { position:relative; display:grid; grid-template-columns:repeat(3,1fr); gap:2.2rem; }
.dbm-mvv2__item { text-align:center; }
.dbm-mvv2__ic { width:74px; height:74px; border-radius:22px; display:inline-grid; place-items:center; margin-bottom:1.1rem; box-shadow:0 12px 26px rgba(0,0,0,.25); }
.dbm-mvv2__ic svg { width:38px; height:38px; stroke:#fff; fill:none; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.dbm-mvv2__item h3 { color:#fff; font-size:1.15rem; font-weight:800; margin:0 0 .55rem; }
.dbm-mvv2__item p { color:#B7C7DE; font-size:.9rem; margin:0; line-height:1.55; }
@media (max-width:820px){ .dbm-mvv2__grid { grid-template-columns:1fr; gap:1.8rem; } .dbm-mvv2__band { padding:2.2rem 1.6rem 2.6rem; } }

/* MVV — imagem alternada + card horizontal na frente */
.dbm-mvv3 { padding:3.4rem 0; background:#f4f6fb; }
.dbm-mvv3__rows { display:flex; flex-direction:column; gap:2.6rem; }
.dbm-mvv3__row { position:relative; display:grid; grid-template-columns:1.15fr .85fr; align-items:center; }
.dbm-mvv3__img { height:320px; border-radius:24px; background:#12294A center/cover no-repeat; box-shadow:0 16px 40px rgba(18,41,74,.14); }
.dbm-mvv3__card { position:relative; z-index:2; background:#fff; border-radius:22px; box-shadow:0 20px 48px rgba(18,41,74,.16); padding:2rem 2.2rem; margin-left:-90px; border-top:5px solid var(--c,#0B4DAD); }
.dbm-mvv3__ic { width:60px; height:60px; border-radius:18px; background:var(--c,#0B4DAD); display:grid; place-items:center; margin-bottom:1rem; }
.dbm-mvv3__ic svg { width:32px; height:32px; stroke:#fff; fill:none; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.dbm-mvv3__card h3 { font-size:1.4rem; font-weight:800; color:#12294A; margin:0 0 .5rem; }
.dbm-mvv3__card p { color:#667089; font-size:.95rem; margin:0; line-height:1.6; }
.dbm-mvv3__rows > .dbm-mvv3__row:nth-child(even) .dbm-mvv3__img { order:2; }
.dbm-mvv3__rows > .dbm-mvv3__row:nth-child(even) .dbm-mvv3__card { order:1; margin-left:0; margin-right:-90px; }
@media (max-width:820px){
	.dbm-mvv3__row { display:block; }
	.dbm-mvv3__img { height:210px; }
	.dbm-mvv3__card, .dbm-mvv3__rows > .dbm-mvv3__row:nth-child(even) .dbm-mvv3__card { margin:-40px 1.1rem 0 !important; }
}

/* =======================================================================
   RODAPÉ MODERNO
   ======================================================================= */
.dbm-footer { position:relative; margin-top:4rem; background:linear-gradient(180deg,#0A2E63 0%,#071F45 100%); color:rgba(255,255,255,.78); font-size:.9rem; }
.dbm-footer::before { content:""; position:absolute; top:0; left:0; right:0; height:5px; background:linear-gradient(90deg,#E23A2E 0%,#0B4DAD 30%,#14A6A0 55%,#3cc443 78%,#E23A2E 100%); }
.dbm-footer a { color:rgba(255,255,255,.78); text-decoration:none; transition:color .2s ease; }
.dbm-footer a:hover { color:#fff; }

.dbm-footer__grid { display:grid; grid-template-columns:1.35fr 1fr 1fr 1.25fr; gap:2.6rem; padding:3.4rem 0 2.8rem; }

.dbm-footer__logoplate { display:inline-block; background:#fff; border-radius:14px; padding:.8rem 1.2rem; box-shadow:0 10px 28px rgba(0,0,0,.25); }
.dbm-footer__logoplate img { display:block; max-height:52px; width:auto; }
.dbm-footer__about { margin:1.15rem 0 1.2rem; line-height:1.65; color:rgba(255,255,255,.7); max-width:34ch; }
.dbm-footer__social { display:flex; gap:.5rem; list-style:none; margin:0; padding:0; }
.dbm-footer__social a { width:38px; height:38px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; background:rgba(255,255,255,.1); transition:background .2s ease, transform .2s ease; }
.dbm-footer__social a:hover { background:#E23A2E; transform:translateY(-2px); }
.dbm-footer__social a i::before { font-size:16px; color:#fff; }

.dbm-footer__title { color:#fff; font-size:.78rem; font-weight:800; letter-spacing:.2em; text-transform:uppercase; margin:0 0 1.15rem; }
.dbm-footer__title::after { content:""; display:block; width:28px; height:3px; border-radius:2px; background:#E23A2E; margin-top:.55rem; }

.dbm-footer__list { list-style:none; margin:0; padding:0; }
.dbm-footer__list li { margin:0; }
.dbm-footer__list a { display:inline-block; padding:.26rem 0; color:rgba(255,255,255,.72); }
.dbm-footer__list a::before { content:"\203A"; margin-right:.5em; color:#E23A2E; font-weight:800; }
.dbm-footer__list a:hover { color:#fff; transform:translateX(3px); }
.dbm-footer__list a { transition:color .2s ease, transform .2s ease; }

.dbm-footer__crow { display:flex; align-items:flex-start; gap:.65rem; margin-bottom:.9rem; line-height:1.6; }
.dbm-footer__crow svg { flex:0 0 auto; width:17px; height:17px; margin-top:.2rem; color:#7FB2FF; }
.dbm-footer__crow, .dbm-footer__crow a, .dbm-footer__addr, .dbm-footer__addr p, .dbm-footer__addr span { color:rgba(255,255,255,.82) !important; }
.dbm-footer__crow a:hover { color:#fff !important; }
.dbm-footer__addr p { margin:0; }
.dbm-footer__old { display:inline-block; margin-top:.4rem; font-size:.8rem; padding:.4rem .95rem; border:1px solid rgba(255,255,255,.25); border-radius:999px; transition:border-color .2s ease, background .2s ease; }
.dbm-footer__old:hover { border-color:#fff; background:rgba(255,255,255,.08); }

.dbm-footer__bottom { border-top:1px solid rgba(255,255,255,.09); padding:1.15rem 0; }
.dbm-footer__bottominner { display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap; }
.dbm-footer__bottominner p { margin:0; font-size:.76rem; letter-spacing:.02em; color:rgba(255,255,255,.5); }
.dbm-footer__erwise img { height:24px; width:auto; display:block; opacity:.75; transition:opacity .2s ease; }
.dbm-footer__erwise:hover img { opacity:1; }

@media (max-width:1080px){
	.dbm-footer__grid { grid-template-columns:1fr 1fr; gap:2.2rem; padding:2.8rem 0 2.2rem; }
	.dbm-footer__brand { grid-column:1 / -1; }
}
@media (max-width:600px){
	.dbm-footer { margin-top:2.6rem; }
	.dbm-footer__grid { grid-template-columns:1fr; gap:1.9rem; }
	.dbm-footer__bottominner { justify-content:center; text-align:center; }
}

/* =======================================================================
   PAGINA DE NOTICIAS + SINGLE (dbm)
   ======================================================================= */

/* ---- Hero / banner de pagina ---- */
.dbm-phero { position:relative; overflow:hidden; background:linear-gradient(130deg,#0A2E63 0%,#0B4DAD 62%,var(--c,#0B4DAD) 135%); color:#fff; padding:2.9rem 0 2.6rem; }
.dbm-phero::before { content:""; position:absolute; right:-120px; top:-160px; width:440px; height:440px; border-radius:50%; background:radial-gradient(circle,rgba(255,255,255,.10),transparent 65%); }
.dbm-phero::after { content:""; position:absolute; left:-90px; bottom:-200px; width:340px; height:340px; border-radius:50%; background:radial-gradient(circle,rgba(255,255,255,.06),transparent 65%); }
.dbm-phero .container { position:relative; z-index:1; }
.dbm-phero__bc { font-size:.78rem; color:rgba(255,255,255,.62); display:flex; align-items:center; gap:.5em; flex-wrap:wrap; }
.dbm-phero__bc a { color:rgba(255,255,255,.78); }
.dbm-phero__bc a:hover { color:#fff; }
.dbm-phero__bc b { color:#fff; font-weight:700; }
.dbm-phero h1 { font-size:clamp(1.9rem,4vw,2.7rem); font-weight:900; margin:.45rem 0 .3rem; color:#fff; }
.dbm-phero__sub { margin:0; color:rgba(255,255,255,.72); font-size:.92rem; }

/* ---- Layout com sidebar ---- */
.dbm-lay { display:grid; grid-template-columns:minmax(0,1fr) 330px; gap:2.2rem; align-items:start; padding:2.3rem 0 3rem; }
.dbm-side { position:sticky; top:105px; display:flex; flex-direction:column; gap:1.3rem; }
.dbm-widget { background:#fff; border:1px solid rgba(11,33,57,.08); border-radius:16px; padding:1.25rem 1.35rem; box-shadow:0 10px 30px rgba(11,33,57,.06); }
.dbm-widget__title { font-size:.74rem; font-weight:800; letter-spacing:.18em; text-transform:uppercase; color:#0A2E63; margin:0 0 .95rem; }
.dbm-widget__title::after { content:""; display:block; width:26px; height:3px; border-radius:2px; background:#E23A2E; margin-top:.45rem; }

/* busca da sidebar */
.dbm-ssearch { display:flex; gap:.5rem; }
.dbm-ssearch input { flex:1 1 auto; min-width:0; border:1px solid rgba(11,33,57,.16); border-radius:10px; padding:.55rem .85rem; font-size:.88rem; outline:none; }
.dbm-ssearch input:focus { border-color:#0B4DAD; }
.dbm-ssearch button { flex:0 0 auto; width:40px; height:40px; border:0; border-radius:10px; background:#0B4DAD; color:#fff; display:inline-flex; align-items:center; justify-content:center; cursor:pointer; transition:background .2s ease; }
.dbm-ssearch button:hover { background:#E23A2E; }
.dbm-ssearch button svg { width:15px; height:15px; fill:currentColor; }

/* categorias da sidebar */
.dbm-scats { list-style:none; margin:0; padding:0; }
.dbm-scats a { display:flex; align-items:center; gap:.6rem; padding:.48rem .6rem; border-radius:10px; color:#33415a; font-weight:600; font-size:.88rem; transition:background .18s ease,color .18s ease; }
.dbm-scats__dot { flex:0 0 auto; width:10px; height:10px; border-radius:50%; background:var(--c,#0B4DAD); }
.dbm-scats b { margin-left:auto; font-weight:700; font-size:.72rem; color:#8a94a6; }
.dbm-scats a:hover { background:rgba(11,77,173,.07); color:#0B4DAD; }
.dbm-scats a.is-active { background:var(--c,#0B4DAD); color:#fff; }
.dbm-scats a.is-active .dbm-scats__dot { background:#fff; }
.dbm-scats a.is-active b { color:rgba(255,255,255,.8); }

/* recentes da sidebar */
.dbm-srecent { list-style:none; margin:0; padding:0; }
.dbm-srecent li + li { margin-top:.85rem; padding-top:.85rem; border-top:1px solid rgba(11,33,57,.07); }
.dbm-srecent a { display:flex; gap:.75rem; align-items:flex-start; }
.dbm-srecent__thumb { flex:0 0 auto; width:60px; height:60px; border-radius:10px; background-size:cover; background-position:center; background-color:#e8edf5; }
.dbm-srecent__title { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; font-size:.84rem; font-weight:700; color:#16233c; line-height:1.35; transition:color .18s ease; }
.dbm-srecent a:hover .dbm-srecent__title { color:#0B4DAD; }
.dbm-srecent__date { display:block; margin-top:.25rem; font-size:.72rem; color:#8a94a6; }

/* promo da sidebar */
.dbm-spromo { padding:0; overflow:hidden; }
.dbm-spromo img { display:block; width:100%; height:auto; }

/* ---- Destaque (ultima noticia, largura total) ---- */
.dbm-feat { margin-top:2.3rem; }
.dbm-feat__card { display:grid; grid-template-columns:1.25fr 1fr; background:#fff; border-radius:22px; overflow:hidden; box-shadow:0 20px 50px rgba(11,33,57,.12); }
.dbm-feat__img { display:block; min-height:430px; background-size:cover; background-position:center; background-color:#e8edf5; transition:transform .5s ease; }
.dbm-feat__card:hover .dbm-feat__img { transform:scale(1.035); }
.dbm-feat__body { display:flex; flex-direction:column; justify-content:center; gap:.85rem; padding:2.6rem 2.8rem; }
.dbm-feat__tags { display:flex; gap:.45rem; flex-wrap:wrap; }
.dbm-pill--hot { background:#E23A2E !important; }
.dbm-feat__title { font-size:clamp(1.5rem,2.4vw,2.05rem); font-weight:800; line-height:1.22; color:#16233c; transition:color .2s ease; }
.dbm-feat__card:hover .dbm-feat__title { color:var(--c,#0B4DAD); }
.dbm-feat__exc { color:#5b6779; line-height:1.75; font-size:1rem; }
.dbm-feat__meta { display:flex; align-items:center; gap:1.1rem; color:#8a94a6; font-size:.84rem; margin-top:.35rem; }
.dbm-feat__more { color:var(--c,#0B4DAD); font-weight:700; }

/* ---- Grade de noticias ---- */
.dbm-ngrid { display:grid; grid-template-columns:repeat(2,1fr); gap:1.2rem; margin-top:1.7rem; }
.dbm-lay__main > .dbm-ngrid:first-child { margin-top:0; }

/* ---- Paginacao ---- */
.dbm-pag { display:flex; justify-content:center; align-items:center; gap:.45rem; margin-top:2.4rem; flex-wrap:wrap; }
.dbm-pag a, .dbm-pag__cur, .dbm-pag__gap { min-width:40px; height:40px; padding:0 .55rem; border-radius:12px; display:inline-flex; align-items:center; justify-content:center; font-weight:700; font-size:.9rem; }
.dbm-pag a { background:#fff; border:1px solid rgba(11,33,57,.14); color:#33415a; transition:border-color .18s ease,color .18s ease,transform .18s ease,box-shadow .18s ease; }
.dbm-pag a:hover { border-color:#0B4DAD; color:#0B4DAD; transform:translateY(-2px); box-shadow:0 8px 18px rgba(11,33,57,.10); }
.dbm-pag__cur { background:#0B4DAD; color:#fff; box-shadow:0 8px 20px rgba(11,77,173,.30); }
.dbm-pag__gap { color:#8a94a6; border:0; min-width:auto; }
.dbm-pag__nav { font-size:1.25rem; }

/* vazio */
.dbm-empty { text-align:center; padding:3rem 0; color:#5b6779; }
.dbm-empty p { margin-bottom:1.2rem; }

/* ---- Cabecalho da materia (single) ---- */
.dbm-ahead { padding:2.2rem 0 0; max-width:900px; }
/* AQUI MORAVA A `.dbm-bc`, A TRILHA PROPRIA DO SINGLE DE MATERIA.
   Ela nao tem mais um consumidor: `grep -rn "dbm-bc" --include=*.php` no tema
   volta vazio desde que o single passou a usar a trilha compartilhada. Eram
   quatro regras orfas, uma delas com o `!important` que a casa evita. Quem
   desenha a trilha agora e o bloco `.dbm-trilha`, no fim deste arquivo. */
.dbm-ahead__title { font-size:clamp(1.55rem,3.4vw,2.25rem); font-weight:900; color:#16233c; line-height:1.22; margin:.6rem 0 .85rem; }
.dbm-ahead__meta { display:flex; align-items:center; gap:1.3rem; flex-wrap:wrap; color:#8a94a6; font-size:.85rem; }
.dbm-ahead__meta span { display:inline-flex; align-items:center; gap:.45rem; }
.dbm-ahead__meta svg { width:15px; height:15px; color:#0B4DAD; }

/* ---- Conteudo do artigo ---- */
.dbm-singlepage .dbm-lay { padding-top:1.7rem; }
.dbm-article__cover { display:block; width:100%; height:auto; max-height:540px; object-fit:cover; border-radius:18px; margin-bottom:1.7rem; }
.dbm-article__content p { font-size:1.04rem; line-height:1.85; color:#2b3445; margin-bottom:1.15rem; }
.dbm-article__content h2, .dbm-article__content h3, .dbm-article__content h4 { color:#0A2E63; font-weight:800; margin:1.7em 0 .6em; line-height:1.3; }
.dbm-article__content a { color:#0B4DAD; font-weight:600; }
.dbm-article__content a:hover { color:#E23A2E; }
.dbm-article__content img { max-width:100%; height:auto; border-radius:14px; cursor:zoom-in; }
.dbm-article__content iframe { max-width:100%; border-radius:14px; }
.dbm-article__content blockquote { border-left:4px solid #E23A2E; margin:1.5rem 0; padding:.4rem 0 .4rem 1.25rem; color:#5b6779; font-style:italic; }
.dbm-article__content ul, .dbm-article__content ol { color:#2b3445; line-height:1.8; margin-bottom:1.15rem; padding-left:1.4rem; }

/* ---- CTA WhatsApp ---- */
.dbm-wpp { display:flex; align-items:center; gap:1.1rem; background:#ECFAF2; border:1px solid #C4EBD4; border-radius:16px; padding:1.2rem 1.4rem; margin:2.2rem 0 0; }
.dbm-wpp > svg { flex:0 0 auto; width:42px; height:42px; color:#25D366; }
.dbm-wpp__txt b { display:block; color:#14532D; font-size:.98rem; line-height:1.35; }
.dbm-wpp__txt span { display:block; margin-top:.2rem; color:#3F6F52; font-size:.85rem; }
.dbm-wpp__btn { flex:0 0 auto; margin-left:auto; background:#25D366; color:#fff !important; border-radius:999px; padding:.68rem 1.35rem; font-weight:700; font-size:.88rem; white-space:nowrap; transition:background .2s ease,transform .2s ease; }
.dbm-wpp__btn:hover { background:#1DA851; transform:translateY(-2px); }
/* grupo do WhatsApp na home, no lugar do antigo "receba nossos conteúdos" (coluna estreita: empilhado) */
.dbm-wpp--home { flex-direction:column; align-items:center; text-align:center; gap:.8rem; margin:1.4rem 0 0; padding:1.6rem 1.4rem; }
.dbm-wpp--home .dbm-wpp__txt b { font-size:1.05rem; }
.dbm-wpp--home .dbm-wpp__btn { margin-left:0; }

/* ---- Navegacao anterior/proxima ---- */
.dbm-pn { display:grid; grid-template-columns:1fr 1fr; gap:1rem; margin-top:1.6rem; }
.dbm-pn__item { display:block; background:#fff; border:1px solid rgba(11,33,57,.10); border-radius:14px; padding:.95rem 1.15rem; transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease; }
.dbm-pn__item:hover { border-color:#0B4DAD; box-shadow:0 10px 24px rgba(11,33,57,.10); transform:translateY(-2px); }
.dbm-pn__item small { display:block; font-size:.68rem; font-weight:800; letter-spacing:.14em; text-transform:uppercase; color:#8a94a6; margin-bottom:.3rem; }
.dbm-pn__item span { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; font-size:.88rem; font-weight:700; color:#16233c; line-height:1.35; }
.dbm-pn__item--next { text-align:right; }

/* ---- Leia tambem ---- */
.dbm-read { padding:0 0 3.2rem; }
.dbm-read__grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.2rem; }

/* ---- Responsivo ---- */
@media (max-width:1080px){
	.dbm-lay { grid-template-columns:minmax(0,1fr) 300px; gap:1.7rem; }
}
@media (max-width:960px){
	.dbm-lay { grid-template-columns:1fr; }
	.dbm-side { position:static; }
	.dbm-feat__card { grid-template-columns:1fr; }
	.dbm-feat__img { min-height:230px; }
	.dbm-feat__body { padding:1.5rem 1.4rem; }
	.dbm-read__grid { grid-template-columns:repeat(2,1fr); }
}
@media (max-width:640px){
	.dbm-phero { padding:2.1rem 0 1.9rem; }
	.dbm-ngrid { grid-template-columns:1fr; }
	.dbm-read__grid { grid-template-columns:1fr; }
	.dbm-wpp { flex-wrap:wrap; }
	.dbm-wpp__btn { margin-left:0; }
	.dbm-pn { grid-template-columns:1fr; }
	.dbm-pag a, .dbm-pag__cur { min-width:36px; height:36px; }
}

/* =======================================================================
   LIGHTBOX / MODAL DE GALERIA (.l-modal-gallery)
   O tema nunca portou o CSS deste modal: o scaffold ficava visivel no
   rodape e o clique nas imagens travava o scroll sem mostrar nada.
   ======================================================================= */
.l-modal-gallery { position:fixed; inset:0; z-index:99999; display:none; }
.l-modal-gallery.is-active { display:block; }
.l-modal-gallery__overlay { position:absolute; inset:0; background:rgba(6,14,29,.9); cursor:pointer; }
.l-modal-gallery__container { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:min(92vw,1040px); }
.l-modal-gallery .swiper-container { overflow:hidden; }
.l-modal-gallery .swiper-slide { position:relative; display:flex; align-items:center; justify-content:center; }
.l-modal-gallery__image { display:block; max-width:100%; max-height:82vh; margin:0 auto; border-radius:12px; box-shadow:0 30px 80px rgba(0,0,0,.5); }
.l-modal-gallery__button-close { position:absolute; top:22px; right:26px; z-index:5; width:46px; height:46px; border-radius:50%; background:rgba(255,255,255,.14); color:#fff; font-weight:700; font-size:1.05rem; line-height:1; display:flex; align-items:center; justify-content:center; cursor:pointer; transition:background .2s ease; user-select:none; }
.l-modal-gallery__button-close:hover { background:#E23A2E; }
.l-modal-gallery__download { position:absolute; top:12px; right:12px; z-index:4; width:42px; height:42px; border-radius:50%; background:rgba(6,14,29,.65); display:flex; align-items:center; justify-content:center; cursor:pointer; transition:background .2s ease; }
.l-modal-gallery__download:hover { background:#0B4DAD; }
.l-modal-gallery__download svg { width:16px; height:16px; fill:#fff; }
.l-modal-gallery .swiper-button-prev, .l-modal-gallery .swiper-button-next { color:#fff; }
.l-modal-gallery .swiper-button-prev { left:-6px; }
.l-modal-gallery .swiper-button-next { right:-6px; }
@media (max-width:640px){
	.l-modal-gallery__container { width:94vw; }
	.l-modal-gallery__button-close { top:12px; right:12px; width:40px; height:40px; }
	.l-modal-gallery .swiper-button-prev, .l-modal-gallery .swiper-button-next { display:none; }
}

/* =======================================================================
   AGENDA + BLOG + E-BOOKS + COMEMORACOES (dbm)
   ======================================================================= */

/* ---- Agenda: cards de evento ---- */
.dbm-evwrap { padding:2.4rem 0 3.2rem; }
.dbm-evwrap section + section { margin-top:2.8rem; }
.dbm-evgrid { display:grid; grid-template-columns:repeat(2,1fr); gap:1.1rem; }

/* Cabecalho de mes dos proximos eventos. Fica pegajoso no topo para quem esta
   rolando uma lista longa nao perder de vista em que mes esta. O `top` acompanha
   a altura do cabecalho fixo do site, senao ele encosta debaixo dele. */
.dbm-evmes { position:sticky; top:96px; z-index:2; margin:1.8rem 0 .8rem; padding:.35rem 0; background:#f5f7fb; font-size:.82rem; font-weight:800; letter-spacing:.14em; text-transform:uppercase; color:#0B4DAD; }
.dbm-evmes:first-child { margin-top:0; }
.dbm-evmes span { color:#8792a8; letter-spacing:.08em; }
.dbm-evgrid + .dbm-evmes { margin-top:2rem; }
@media (max-width:860px){
	.dbm-evmes { top:0; }
}
.dbm-ev { display:flex; gap:1rem; align-items:center; background:#fff; border:1px solid rgba(11,33,57,.08); border-radius:16px; padding:1rem 1.15rem; box-shadow:0 10px 26px rgba(11,33,57,.06); transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease; }
.dbm-ev:hover { transform:translateY(-3px); border-color:#0B4DAD; box-shadow:0 18px 40px rgba(11,33,57,.12); }
.dbm-ev__date { flex:0 0 auto; width:72px; border-radius:12px; background:linear-gradient(160deg,#0B4DAD,#0A2E63); color:#fff; text-align:center; padding:.55rem .25rem .5rem; }
/* `color:#fff` repetido nos filhos, e nao herdado do pai.
   A primeira linha do main.css tem `*{color:#5B5B5B}`, e declaracao universal VENCE
   heranca: o pai manda branco, o filho recebe cinza direto. Medido: o numero do dia
   e a sigla do mes saiam em rgb(91,91,91) sobre o azul #0b4dad, contraste de cerca
   de 1.6 para 1, no elemento mais visivel do cartao de evento. O `small` escapava
   porque tinha cor propria. */
.dbm-ev__date b { display:block; font-size:1.45rem; font-weight:800; line-height:1; color:#fff; }
.dbm-ev__date span { display:block; font-size:.7rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; margin-top:.15rem; color:#fff; }
.dbm-ev__date small { display:block; font-size:.62rem; color:rgba(255,255,255,.65); margin-top:.1rem; }
.dbm-ev__body { min-width:0; }
.dbm-ev__title { display:block; font-weight:700; color:#16233c; line-height:1.35; font-size:.95rem; }
.dbm-ev:hover .dbm-ev__title { color:#0B4DAD; }
.dbm-ev__meta { display:flex; flex-wrap:wrap; gap:.35rem 1rem; margin-top:.4rem; font-size:.76rem; color:#8a94a6; }
.dbm-ev__meta span { display:inline-flex; align-items:center; gap:.35rem; }
.dbm-ev__meta svg { width:13px; height:13px; color:#0B4DAD; flex:0 0 auto; }
.dbm-ev__city { background:rgba(11,77,173,.08); color:#0B4DAD !important; font-weight:700; border-radius:999px; padding:.1rem .6rem; }
.dbm-empty--tight { padding:1.6rem 0; text-align:left; }

/* ---- Blog: grade 3 colunas ---- */
.dbm-bwrap { padding:2.2rem 0 3.2rem; }
.dbm-bgrid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.2rem; }

/* ---- E-books: vitrine de capas ---- */
.dbm-ebwrap { padding:2.4rem 0 3.4rem; }
.dbm-ebgrid { display:grid; grid-template-columns:repeat(4,1fr); gap:1.4rem; }
.dbm-ebook { display:flex; flex-direction:column; background:#fff; border-radius:18px; overflow:hidden; box-shadow:0 12px 30px rgba(18,41,74,.08); transition:transform .25s ease, box-shadow .25s ease; }
.dbm-ebook:hover { transform:translateY(-5px); box-shadow:0 22px 48px rgba(18,41,74,.15); }
.dbm-ebook__cover { display:block; aspect-ratio:3/4; background:#e8edf5 center/cover no-repeat; transition:transform .5s ease; }
.dbm-ebook:hover .dbm-ebook__cover { transform:scale(1.04); }
.dbm-ebook__body { display:flex; flex-direction:column; gap:.7rem; padding:1rem 1.1rem 1.2rem; margin-top:auto; background:#fff; position:relative; }
.dbm-ebook__title { font-weight:700; color:#16233c; font-size:.92rem; line-height:1.35; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.dbm-ebook__btn { display:inline-flex; align-items:center; justify-content:center; gap:.45rem; background:#0B4DAD; color:#fff !important; border-radius:999px; padding:.55rem 1rem; font-weight:700; font-size:.82rem; transition:background .2s ease; }
.dbm-ebook__btn:hover { background:#E23A2E; }
.dbm-ebook__btn svg { width:14px; height:14px; }

/* ---- Comemoracoes: meses + tipos + itens ---- */
.dbm-memwrap { padding:2.4rem 0 3.2rem; }
.dbm-months { display:flex; flex-wrap:wrap; gap:.4rem; justify-content:center; }
.dbm-months a { min-width:58px; text-align:center; padding:.5rem .7rem; border-radius:12px; background:#fff; border:1px solid rgba(11,33,57,.12); color:#33415a; font-weight:700; font-size:.82rem; text-transform:uppercase; letter-spacing:.04em; transition:border-color .18s ease, color .18s ease, background .18s ease, transform .18s ease; }
.dbm-months a:hover { border-color:#0B4DAD; color:#0B4DAD; transform:translateY(-2px); }
.dbm-months a.is-active { background:#0B4DAD; border-color:#0B4DAD; color:#fff; box-shadow:0 8px 20px rgba(11,77,173,.28); }
.dbm-fpills { display:flex; flex-wrap:wrap; gap:.45rem; justify-content:center; margin-top:1.1rem; }
.dbm-fpill { padding:.42rem 1rem; border-radius:999px; border:2px solid var(--c,#0B4DAD); color:var(--c,#0B4DAD); background:#fff; font-weight:700; font-size:.8rem; transition:background .18s ease, color .18s ease, transform .18s ease; }
.dbm-fpill:hover { transform:translateY(-2px); }
.dbm-fpill.is-active { background:var(--c,#0B4DAD); color:#fff; }
.dbm-memmonth { text-align:center; margin:2rem 0 1.4rem; font-size:1.5rem; font-weight:800; color:#0A2E63; }
.dbm-memgrid { display:grid; grid-template-columns:repeat(2,1fr); gap:.9rem; }
.dbm-mem { display:flex; gap:.9rem; align-items:center; background:#fff; border:1px solid rgba(11,33,57,.08); border-left:4px solid var(--c,#0B4DAD); border-radius:14px; padding:.85rem 1rem; box-shadow:0 8px 22px rgba(11,33,57,.05); }
.dbm-mem__day { flex:0 0 auto; width:56px; text-align:center; border-radius:10px; background:rgba(11,77,173,.06); padding:.45rem .2rem; }
.dbm-mem__day b { display:block; font-size:1.2rem; font-weight:800; color:#0A2E63; line-height:1; }
.dbm-mem__day span { display:block; font-size:.62rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:#8a94a6; margin-top:.15rem; }
.dbm-mem__body { min-width:0; }
.dbm-mem__title { display:block; font-weight:700; color:#16233c; font-size:.92rem; line-height:1.35; }
.dbm-mem__meta { display:flex; align-items:center; gap:.6rem; margin-top:.35rem; font-size:.75rem; color:#8a94a6; font-weight:600; }
.dbm-mem__pill { background:var(--c,#0B4DAD); color:#fff; border-radius:999px; padding:.12rem .65rem; font-size:.68rem; font-weight:700; letter-spacing:.04em; text-transform:uppercase; }

/* ---- Responsivo ---- */
@media (max-width:1080px){
	.dbm-ebgrid { grid-template-columns:repeat(3,1fr); }
}
@media (max-width:900px){
	.dbm-evgrid, .dbm-memgrid { grid-template-columns:1fr; }
	.dbm-bgrid { grid-template-columns:repeat(2,1fr); }
	.dbm-ebgrid { grid-template-columns:repeat(2,1fr); }
}
@media (max-width:560px){
	.dbm-bgrid { grid-template-columns:1fr; }
	.dbm-ebgrid { grid-template-columns:repeat(2,1fr); gap:.9rem; }
	.dbm-months a { min-width:48px; padding:.42rem .5rem; font-size:.74rem; }
	.dbm-ev { flex-direction:row; }
}

/* =======================================================================
   MENU DE AREAS (icones da home + dropdown estilo copiosa)
   ======================================================================= */
.dbm-nav__areas { display:flex; align-items:stretch; gap:.6rem; list-style:none; margin:0; padding:0; }
.dbm-area__top { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.3rem; min-width:104px; padding:.5rem .45rem .45rem; border-radius:12px; text-align:center; transition:background .2s ease; }
.dbm-area__top:hover { background:rgba(11,77,173,.05); }
.dbm-area__ic { display:flex; align-items:center; justify-content:center; }
.dbm-area__ic img { width:56px; height:56px; object-fit:contain; display:block; filter:drop-shadow(0 5px 12px rgba(11,33,57,.2)); transition:transform .22s ease, filter .22s ease; }
.dbm-area__top:hover .dbm-area__ic img { transform:translateY(-3px) scale(1.06); filter:drop-shadow(0 10px 18px rgba(11,33,57,.28)); }
.dbm-area__label { font-size:.68rem; font-weight:800; letter-spacing:.03em; text-transform:uppercase; color:#0A2E63; line-height:1.15; white-space:normal; }
.dbm-area__top:hover .dbm-area__label { color:var(--c,#0B4DAD); }
.dbm-area__chev { width:11px; height:11px; color:#8a94a6; margin-top:-2px; transition:transform .25s ease, color .25s ease; }
/* em tela grande o cabeçalho ganha largura: com seis editorias, o Doar, o Canal
   de Escuta e a busca em 1140px, os botões das áreas ficavam colados */
@media (min-width:1400px){
	.dbm-header .container { max-width:1320px; }
	.dbm-nav__areas { gap:1.1rem; }
}
.dbm-area--sub:hover .dbm-area__chev, .dbm-area--sub:focus-within .dbm-area__chev { transform:rotate(180deg); color:var(--c,#0B4DAD); }

/* mega menu (painel aberto completo, largura do header) */
.dbm-nav { position:relative; }
.dbm-mega { position:absolute; top:100%; left:0; right:0; padding-top:10px; opacity:0; visibility:hidden; transform:translateY(8px); transition:opacity .24s ease, transform .24s ease, visibility .24s ease; z-index:1050; }
.dbm-area--sub:hover .dbm-mega, .dbm-area--sub:focus-within .dbm-mega { opacity:1; visibility:visible; transform:translateY(0); }
.dbm-mega__panel { display:grid; grid-template-columns:300px minmax(0,1.4fr) minmax(0,.8fr); gap:2.2rem; background:#fff; border:1px solid rgba(11,33,57,.06); border-radius:20px; box-shadow:0 34px 80px rgba(11,33,57,.22); padding:1.8rem 2rem; }
.dbm-mega__panel--simple { grid-template-columns:300px minmax(0,1fr); }
.dbm-mega__info { border-right:1px solid rgba(11,33,57,.08); padding-right:2rem; }
.dbm-mega__ic { display:inline-flex; align-items:center; justify-content:center; width:58px; height:58px; border-radius:16px; background:#fff; border:2px solid var(--c,#0B4DAD); margin-bottom:.8rem; }
.dbm-mega__ic img { width:32px; height:32px; object-fit:contain; }
.dbm-mega__info b { display:block; font-size:1.1rem; font-weight:800; color:#0A2E63; }
.dbm-mega__info p { margin:.5rem 0 .95rem; font-size:.84rem; line-height:1.6; color:#5b6779; }
.dbm-mega__site { display:inline-flex; align-items:center; gap:.45rem; padding:.5rem 1.05rem; border-radius:999px; border:2px solid var(--c,#0B4DAD); color:var(--c,#0B4DAD); font-size:.8rem; font-weight:700; transition:background .2s ease, color .2s ease; }
.dbm-mega__site:hover { background:var(--c,#0B4DAD); color:#fff; }
.dbm-mega__site svg { width:12px; height:12px; }
.dbm-mega__col h4 { font-size:.72rem; font-weight:800; letter-spacing:.18em; text-transform:uppercase; color:#0A2E63; margin:0 0 .8rem; }
.dbm-mega__col h4::after { content:""; display:block; width:24px; height:3px; border-radius:2px; background:var(--c,#E23A2E); margin-top:.4rem; }
.dbm-mega__links { display:flex; flex-direction:column; gap:.1rem; }
.dbm-mega__links--2col { display:grid; grid-template-columns:repeat(2,1fr); gap:.1rem .9rem; }
.dbm-mega__links a { display:flex; align-items:center; gap:.45rem; padding:.5rem .6rem; border-radius:9px; font-size:.86rem; font-weight:600; color:#33415a; transition:background .16s ease, color .16s ease; }
.dbm-mega__links a::before { content:"\203A"; font-weight:800; color:var(--c,#0B4DAD); font-size:1.05em; line-height:1; }
.dbm-mega__links a:hover { background:rgba(11,77,173,.06); color:var(--c,#0B4DAD); }
.dbm-mega__all { color:var(--c,#0B4DAD) !important; font-weight:700 !important; }

/* header shrink: encolhe os icones tambem */
.dbm-header.is-stuck .dbm-area__ic img { width:42px; height:42px; }
.dbm-header.is-stuck .dbm-area__top { padding-top:.4rem; padding-bottom:.35rem; }

/* mobile / collapse (< 1200px): ACORDEÃO por área (toque abre só o submenu daquela área) */
@media (max-width:1199.98px){
	.dbm-nav__areas { flex-direction:column; align-items:stretch; gap:0; padding:.25rem 0 .5rem; }
	.dbm-area { border-bottom:1px solid rgba(11,33,57,.07); }
	.dbm-area:last-child { border-bottom:0; }
	.dbm-area__top { flex-direction:row; justify-content:flex-start; gap:.8rem; padding:.9rem .4rem; }
	.dbm-area__top:hover { background:transparent; }
	.dbm-area__ic { flex:0 0 auto; }
	.dbm-area__ic img { width:38px; height:38px; }
	.dbm-area__top:hover .dbm-area__ic img { transform:none; filter:drop-shadow(0 5px 12px rgba(11,33,57,.2)); }
	.dbm-area__label { font-size:.95rem; text-align:left; flex:1 1 auto; color:#12294A; white-space:normal; }
	.dbm-area__chev { display:block; width:17px; height:17px; color:#98a2b3; margin:0; flex:0 0 auto; transition:transform .25s ease, color .25s ease; }
	.dbm-area.is-open .dbm-area__chev { transform:rotate(180deg); color:var(--c,#0B4DAD); }
	.dbm-area.is-open .dbm-area__label { color:var(--c,#0B4DAD); }

	/* mega = painel inline fechado por padrão; abre com .is-open na área */
	.dbm-mega { position:static; transform:none; opacity:1; visibility:visible; padding:0; z-index:auto; max-height:0; overflow:hidden; transition:max-height .32s ease; }
	.dbm-area.is-open .dbm-mega { max-height:1200px; }
	.dbm-mega__panel, .dbm-mega__panel--simple { display:block; grid-template-columns:none; box-shadow:none; border:0; border-radius:0; padding:0 0 .8rem 3.1rem; }
	.dbm-mega__info { display:block; border:0; padding:0; margin:0; }
	.dbm-mega__ic, .dbm-mega__info b, .dbm-mega__info p { display:none; }
	.dbm-mega__site { display:inline-flex; margin:.1rem 0 .6rem; padding:.42rem .95rem; font-size:.78rem; }
	.dbm-mega__col { margin-top:.2rem; }
	.dbm-mega__col h4 { display:block; font-size:.64rem; letter-spacing:.14em; color:#98a2b3; margin:.55rem 0 .2rem; }
	.dbm-mega__col h4::after { display:none; }
	.dbm-mega__links, .dbm-mega__links--2col { display:flex; flex-direction:column; gap:0; }
	.dbm-mega__links a { padding:.55rem .5rem; font-size:.9rem; }

	/* hambúrguer vira "X" quando aberto */
	.dbm-nav__toggler.is-x span:nth-child(1) { transform:translateY(7px) rotate(45deg); }
	.dbm-nav__toggler.is-x span:nth-child(2) { opacity:0; }
	.dbm-nav__toggler.is-x span:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }
}

/* =======================================================================
   BOTTOM NAV "estilo app" (só mobile) + bottom sheet de Editorias
   ======================================================================= */
.dbm-tabbar { display:none; }
.dbm-sheet { display:none; }
@media (max-width:1199.98px){
	body { padding-bottom: calc(62px + env(safe-area-inset-bottom, 0px)); }

	.dbm-tabbar { display:flex; position:fixed; left:0; right:0; bottom:0; z-index:1200; background:#fff; border-top:1px solid rgba(11,33,57,.08); box-shadow:0 -4px 22px rgba(11,33,57,.12); justify-content:space-around; align-items:flex-end; padding-bottom:env(safe-area-inset-bottom, 0px); }
	.dbm-tab { flex:1 1 0; display:flex; flex-direction:column; align-items:center; gap:3px; padding:8px 2px 9px; color:#8a94a6; font-size:.6rem; font-weight:700; letter-spacing:.01em; text-decoration:none; background:none; border:0; cursor:pointer; -webkit-tap-highlight-color:transparent; }
	.dbm-tab svg { width:22px; height:22px; display:block; }
	.dbm-tab span { line-height:1; }
	.dbm-tab.is-active { color:#0B4DAD; }
	.dbm-tab--doar { color:#E23A2E; }
	.dbm-tab__doar { display:flex; align-items:center; justify-content:center; width:54px; height:54px; margin-top:-24px; margin-bottom:2px; border-radius:50%; background:#E23A2E; color:#fff; box-shadow:0 8px 20px rgba(226,58,46,.42); border:4px solid #fff; }
	.dbm-tab__doar svg { width:24px; height:24px; }

	/* Doar do topo é redundante com a barra de baixo -> esconde no mobile */
	.dbm-doar--m { display:none !important; }

	/* bottom sheet (Editorias) */
	.dbm-sheet { display:block; position:fixed; inset:0; z-index:1300; }
	.dbm-sheet[hidden] { display:none; }
	.dbm-sheet__overlay { position:absolute; inset:0; background:rgba(6,14,29,.5); opacity:0; transition:opacity .3s ease; }
	.dbm-sheet.is-open .dbm-sheet__overlay { opacity:1; }
	.dbm-sheet__panel { position:absolute; left:0; right:0; bottom:0; background:#fff; border-radius:22px 22px 0 0; padding:10px 18px calc(22px + env(safe-area-inset-bottom, 0px)); transform:translateY(100%); transition:transform .34s cubic-bezier(.22,1,.36,1); max-height:84vh; overflow:auto; }
	.dbm-sheet.is-open .dbm-sheet__panel { transform:translateY(0); }
	.dbm-sheet__handle { width:42px; height:4px; border-radius:4px; background:#d7dde5; margin:4px auto 12px; }
	.dbm-sheet__head { display:flex; align-items:center; justify-content:space-between; margin-bottom:12px; }
	.dbm-sheet__head b { font-size:1.12rem; color:#12294A; }
	.dbm-sheet__x { border:0; background:#eef1f5; width:32px; height:32px; border-radius:50%; color:#5b6779; font-size:15px; line-height:1; cursor:pointer; }
	.dbm-sheet__grid { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
	.dbm-sheet__area { display:flex; flex-direction:column; align-items:center; gap:8px; padding:15px 6px; border-radius:15px; background:#f6f8fb; border:1px solid #eef1f5; text-decoration:none; color:#12294A; font-size:.72rem; font-weight:700; text-align:center; line-height:1.2; transition:background .18s ease, transform .18s ease; }
	.dbm-sheet__area:active { transform:scale(.96); background:#eef2f8; }
	.dbm-sheet__ic img { width:42px; height:42px; object-fit:contain; filter:drop-shadow(0 4px 9px rgba(11,33,57,.18)); }
	.dbm-sheet__links { display:flex; flex-wrap:wrap; gap:8px; margin-top:16px; }
	.dbm-sheet__links a { flex:1 1 42%; text-align:center; padding:12px; border-radius:12px; border:1px solid #e7ebf1; color:#33415a; font-weight:700; font-size:.84rem; text-decoration:none; }
}

/* =======================================================================
   MIGRACAO INSPETORIA (pagina generica, salesianos, hub)
   ======================================================================= */

/* separador no dropdown do menu (paginas x noticias/blog/site) */
.dbm-area__sep { display:block; height:1px; margin:.4rem .5rem; background:rgba(11,33,57,.09); }

/* pagina generica dbm-page */
.dbm-pagebody { max-width:880px; margin:0 auto; padding:2.4rem 0 3.2rem; }
.dbm-psec { margin-top:2.2rem; }
.dbm-psec:first-child { margin-top:0; }
.dbm-psec__title { color:#0A2E63; font-weight:800; font-size:1.35rem; margin:0 0 .8rem; padding-bottom:.5rem; border-bottom:3px solid #E23A2E; display:inline-block; }
.dbm-pagebody img { max-width:100%; height:auto; border-radius:14px; }
.dbm-pagebody table { max-width:100%; }

/* grade de salesianos */
.dbm-padreswrap { padding:2.4rem 0 3.4rem; }
.dbm-padresgrid { display:grid; grid-template-columns:repeat(4,1fr); gap:1.3rem; }
.dbm-padre { background:#fff; border-radius:18px; overflow:hidden; box-shadow:0 12px 30px rgba(18,41,74,.08); transition:transform .25s ease, box-shadow .25s ease; }
.dbm-padre:hover { transform:translateY(-5px); box-shadow:0 22px 48px rgba(18,41,74,.15); }
.dbm-padre__foto { display:block; aspect-ratio:1/1; background:#e8edf5 center/cover no-repeat; background-position:center 22%; }
.dbm-padre__body { display:block; padding:1rem 1.1rem 1.15rem; }
.dbm-padre__nome { display:block; font-weight:800; color:#16233c; font-size:.95rem; line-height:1.3; }
.dbm-padre__completo { display:block; margin-top:.25rem; font-size:.78rem; color:#5b6779; line-height:1.4; }
.dbm-padre__nasc { display:inline-flex; align-items:center; gap:.4rem; margin-top:.55rem; font-size:.75rem; font-weight:700; color:#0B4DAD; background:rgba(11,77,173,.07); border-radius:999px; padding:.25rem .7rem; }
.dbm-padre__nasc svg { width:12px; height:12px; }

/* hub da area */
.dbm-hubwrap { padding:2.4rem 0 3.2rem; }
.dbm-hubwrap section + section { margin-top:2.8rem; }
.dbm-hubgrid { display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; }
.dbm-hublink { display:flex; align-items:center; justify-content:space-between; gap:.8rem; background:#fff; border:1px solid rgba(11,33,57,.09); border-radius:14px; padding:1.05rem 1.2rem; font-weight:700; color:#16233c; font-size:.92rem; transition:transform .2s ease, border-color .2s ease, box-shadow .2s ease, color .2s ease; }
.dbm-hublink__arrow { color:#E23A2E; font-weight:800; transition:transform .2s ease; }
.dbm-hublink:hover { transform:translateY(-3px); border-color:#0B4DAD; color:#0B4DAD; box-shadow:0 14px 30px rgba(11,33,57,.10); }
.dbm-hublink:hover .dbm-hublink__arrow { transform:translateX(4px); }
.dbm-hubnews { display:grid; grid-template-columns:repeat(4,1fr); gap:1.1rem; }

@media (max-width:1080px){
	.dbm-padresgrid, .dbm-hubnews { grid-template-columns:repeat(3,1fr); }
	.dbm-hubgrid { grid-template-columns:repeat(2,1fr); }
}
@media (max-width:760px){
	.dbm-padresgrid, .dbm-hubnews { grid-template-columns:repeat(2,1fr); }
}
@media (max-width:520px){
	.dbm-padresgrid { grid-template-columns:1fr 1fr; gap:.8rem; }
	.dbm-hubgrid, .dbm-hubnews { grid-template-columns:1fr; }
	.dbm-padre__completo { display:none; }
}

/* =======================================================================
   INSPETORIA FASE 2 (equipes, presenca salesiana, hub MVV)
   ======================================================================= */

/* equipes */
.dbm-teamswrap { padding:2.4rem 0 3.4rem; }
.dbm-teamsgrid { display:grid; grid-template-columns:repeat(2,1fr); gap:1.3rem; align-items:start; }
.dbm-equipe { background:#fff; border:1px solid rgba(11,33,57,.08); border-radius:18px; overflow:hidden; box-shadow:0 12px 30px rgba(18,41,74,.07); transition:transform .22s ease, box-shadow .22s ease; }
.dbm-equipe:hover { transform:translateY(-3px); box-shadow:0 20px 44px rgba(18,41,74,.13); }
.dbm-equipe__head { display:flex; align-items:center; justify-content:space-between; gap:.8rem; padding:1.1rem 1.3rem; background:linear-gradient(135deg,#0A2E63,#0B4DAD); }
.dbm-equipe__nome { margin:0; font-size:1.02rem; font-weight:800; color:#fff; line-height:1.3; }
.dbm-equipe__sigla { flex:0 0 auto; background:rgba(255,255,255,.16); color:#fff; font-size:.68rem; font-weight:800; letter-spacing:.06em; border-radius:999px; padding:.3rem .75rem; white-space:nowrap; }
.dbm-equipe__body { padding:1.1rem 1.3rem 1.25rem; }
.dbm-equipe__body ul { list-style:none; margin:0; padding:0; }
.dbm-equipe__body li { position:relative; padding:.45rem 0 .45rem 1.5rem; color:#33415a; font-size:.92rem; line-height:1.45; border-bottom:1px solid rgba(11,33,57,.06); }
.dbm-equipe__body li:last-child { border-bottom:0; }
.dbm-equipe__body li::before { content:""; position:absolute; left:.15rem; top:.95rem; width:8px; height:8px; border-radius:50%; background:#1e8ccc; }

/* presenca salesiana */
.dbm-preswrap { padding:2.4rem 0 3.4rem; }
.dbm-presintro { max-width:820px; margin:0 auto; text-align:center; }
.dbm-presintro p { font-size:1.08rem; }
.dbm-presstats { margin:1.8rem 0 2rem; }
.dbm-presmap { border-radius:20px; overflow:hidden; box-shadow:0 20px 50px rgba(11,33,57,.14); border:1px solid rgba(11,33,57,.08); }
.dbm-presmap iframe { display:block; width:100%; height:540px; border:0; }
/*
 * As trinta linhas de `.dbm-onde*` saíram daqui em 2026-08-13, junto com o
 * template `content-onde-map.php` que era a última lista de unidades cravada em
 * arquivo. A home e a página da Comunicação passaram a desenhar o mesmo mapa das
 * outras telas, lendo o cadastro. CSS de peça que não existe mais não é
 * inofensivo: ele é a próxima pessoa achando que a peça ainda está no ar e
 * recriando a duplicata.
 *
 * A APARÊNCIA daquele mapa não se perdeu: as mesmas declarações foram copiadas
 * para `.dbm-mapa*`, no fim deste arquivo, com os mesmos tamanhos, as mesmas cores
 * de pino e o mesmo painel de cidades. O que mudou foi de onde vêm os dados, e
 * isso o visitante não tem de perceber.
 *
 * `.leaflet-popup-content` fica: o balão do mapa novo é o mesmo balão do Leaflet.
 */
.leaflet-popup-content { margin:.9rem 1.1rem; font-family:inherit; }
.dbm-preswrap .dbm-more { display:flex; gap:.7rem; justify-content:center; margin-top:1.8rem; }

/* hub: espacamento do MVV */
.dbm-hubwrap .dbm-mvv3 { padding:0; }
.dbm-hubwrap .dbm-mvv3 + section { margin-top:2.8rem; }

@media (max-width:860px){
	.dbm-teamsgrid { grid-template-columns:1fr; }
}

/* ---- Hub Inspetoria (fase 3: espelho da home do ar) ---- */
.dbm-phero--slim { padding:1.9rem 0 1.7rem; }

/* Faixa dos hubs de editoria: so a trilha, sem o nome da pagina.
   O cliente pediu para tirar o nome porque o banner logo abaixo ja diz onde a
   pessoa esta, e o nome repetia. O <h1> continua no HTML com .screen-reader-text:
   sumir com ele deixaria a pagina sem h1, o que e regressao de leitor de tela e de
   busca, nao simplificacao.
   A altura encolhe porque sobrou uma linha de texto: manter o vao de titulo daria
   uma tarja colorida grossa e vazia, com cara de defeito. */
.dbm-phero--sotrilha { padding:1.1rem 0 .95rem; }
/* A trilha aqui e `.dbm-trilha`, e nao `.dbm-phero__bc`: quem escreve a faixa dos
   hubs chama `dbm_trilha_html()`, que tem marcacao propria. Mirar a classe errada
   passa no lint e nao muda nada na tela, que e o pior tipo de regra morta. */
.dbm-phero--sotrilha .dbm-trilha { font-size:.82rem; }
@media (max-width:860px){
	.dbm-phero--sotrilha { padding:.9rem 0 .8rem; }
}
.dbm-hubpage .dbm-banner { margin-bottom:0; }
.dbm-ainsp { display:grid; grid-template-columns:repeat(3,1fr); gap:1.2rem; }
.dbm-ainsp__card { display:block; border-radius:18px; overflow:hidden; box-shadow:0 12px 30px rgba(18,41,74,.10); transition:transform .25s ease, box-shadow .25s ease; }
.dbm-ainsp__card img { display:block; width:100%; height:auto; transition:transform .5s ease; }
.dbm-ainsp__card:hover { transform:translateY(-5px); box-shadow:0 22px 48px rgba(18,41,74,.18); }
.dbm-ainsp__card:hover img { transform:scale(1.04); }
.dbm-hubblog { display:grid; grid-template-columns:repeat(3,1fr); gap:1.1rem; }
.dbm-hubcta__band { display:flex; align-items:center; justify-content:space-between; gap:1.4rem; flex-wrap:wrap; background:linear-gradient(130deg,#0A2E63,#0B4DAD); border-radius:20px; padding:1.9rem 2.2rem; color:#fff; }
.dbm-hubcta__txt b { display:block; font-size:1.15rem; font-weight:800; color:#fff !important; }
.dbm-hubcta__txt span { display:block; margin-top:.25rem; color:rgba(255,255,255,.82) !important; font-size:.92rem; }
.dbm-hubcta__btns { display:flex; gap:.7rem; flex-wrap:wrap; }
.dbm-btn--light { background:#fff !important; color:#0B4DAD !important; }
.dbm-btn--light:hover { background:#E23A2E !important; color:#fff !important; }
.dbm-btn--outline { background:transparent !important; color:#fff !important; border:2px solid rgba(255,255,255,.5) !important; }
.dbm-btn--outline:hover { border-color:#fff !important; background:rgba(255,255,255,.1) !important; }
@media (max-width:860px){
	.dbm-ainsp { grid-template-columns:1fr; }
	.dbm-hubblog { grid-template-columns:1fr; }
	.dbm-hubcta__band { padding:1.5rem 1.4rem; }
}

/* ---- Hub Obras Sociais: cards das 5 obras ---- */
.dbm-obras { display:grid; grid-template-columns:repeat(5,1fr); gap:1rem; margin-top:1.6rem; }
.dbm-obra { display:flex; flex-direction:column; background:#fff; border-radius:16px; overflow:hidden; box-shadow:0 12px 30px rgba(18,41,74,.08); transition:transform .25s ease, box-shadow .25s ease; }
.dbm-obra:hover { transform:translateY(-5px); box-shadow:0 22px 46px rgba(18,41,74,.15); }
.dbm-obra__img { display:block; height:130px; background:#e8edf5 center/cover no-repeat; transition:transform .5s ease; }
.dbm-obra:hover .dbm-obra__img { transform:scale(1.05); }
.dbm-obra__body { display:block; padding:.85rem .95rem 1rem; }
.dbm-obra__nome { display:block; font-weight:700; color:#16233c; font-size:.82rem; line-height:1.3; }
.dbm-obra:hover .dbm-obra__nome { color:#dd3333; }
.dbm-obra__cidade { display:block; margin-top:.3rem; font-size:.72rem; font-weight:700; color:#8a94a6; text-transform:uppercase; letter-spacing:.05em; }
@media (max-width:1080px){ .dbm-obras { grid-template-columns:repeat(3,1fr); } }
@media (max-width:640px){ .dbm-obras { grid-template-columns:repeat(2,1fr); } }

/* ---- Vocacional: santidade salesiana ---- */
.dbm-santos { display:grid; grid-template-columns:repeat(5,1fr); gap:1rem; }
.dbm-santo { display:flex; flex-direction:column; align-items:center; text-align:center; gap:.6rem; padding:1.1rem .8rem; background:#fff; border-radius:16px; box-shadow:0 10px 26px rgba(18,41,74,.07); transition:transform .22s ease, box-shadow .22s ease; }
.dbm-santo:hover { transform:translateY(-4px); box-shadow:0 18px 40px rgba(18,41,74,.14); }
.dbm-santo__foto { width:96px; height:96px; border-radius:50%; background:#e8edf5 center/cover no-repeat; background-position:center 20%; border:3px solid #0ba3e0; }
.dbm-santo__nome { font-weight:700; color:#16233c; font-size:.86rem; line-height:1.3; }
.dbm-santo:hover .dbm-santo__nome { color:#0ba3e0; }

.dbm-santoswrap { padding:0 0 3.2rem; }
.dbm-santosgrid { display:grid; grid-template-columns:repeat(2,1fr); gap:1.3rem; }
.dbm-santocard { display:flex; gap:1.1rem; background:#fff; border:1px solid rgba(11,33,57,.08); border-radius:18px; padding:1.2rem 1.3rem; box-shadow:0 12px 30px rgba(18,41,74,.07); transition:transform .22s ease, box-shadow .22s ease; }
.dbm-santocard:hover { transform:translateY(-3px); box-shadow:0 20px 44px rgba(18,41,74,.13); }
.dbm-santocard__foto { flex:0 0 auto; width:110px; height:110px; border-radius:50%; background:#e8edf5 center/cover no-repeat; background-position:center 20%; border:3px solid #0ba3e0; }
.dbm-santocard__nome { margin:0 0 .45rem; font-size:1.05rem; font-weight:800; color:#0A2E63; }
.dbm-santocard__bio { margin:0 0 .55rem; font-size:.88rem; line-height:1.6; color:#5b6779; }
.dbm-santocard__mais { font-weight:700; font-size:.84rem; color:#0ba3e0; }
.dbm-santocard__mais:hover { color:#E23A2E; }
@media (max-width:1080px){ .dbm-santos { grid-template-columns:repeat(3,1fr); } }
@media (max-width:860px){ .dbm-santosgrid { grid-template-columns:1fr; } }
@media (max-width:640px){ .dbm-santos { grid-template-columns:repeat(2,1fr); } .dbm-santocard { flex-direction:column; align-items:center; text-align:center; } }

/* ---- Hub Ensino: cards das escolas com foto ---- */
.dbm-escolas { display:grid; grid-template-columns:repeat(4,1fr); gap:1.3rem; margin-top:1.6rem; }
.dbm-escola { display:flex; flex-direction:column; background:#fff; border-radius:18px; overflow:hidden; box-shadow:0 12px 30px rgba(18,41,74,.09); transition:transform .25s ease, box-shadow .25s ease; }
.dbm-escola:hover { transform:translateY(-5px); box-shadow:0 24px 50px rgba(18,41,74,.16); }
.dbm-escola__img { position:relative; display:block; height:158px; background:#e8edf5 center/cover no-repeat; }
.dbm-escola__img::after { content:""; position:absolute; inset:0; background:linear-gradient(to top, rgba(6,14,29,.5), transparent 55%); }
.dbm-escola__city { position:absolute; z-index:1; left:12px; bottom:12px; display:inline-flex; align-items:center; gap:.35rem; background:rgba(255,255,255,.95); color:#1e73be; font-size:.72rem; font-weight:800; padding:.28rem .7rem; border-radius:999px; }
.dbm-escola__city svg { width:12px; height:12px; }
.dbm-escola__body { display:flex; flex-direction:column; gap:.45rem; padding:1rem 1.15rem 1.2rem; }
.dbm-escola__nome { font-weight:800; color:#16233c; font-size:.95rem; line-height:1.3; }
.dbm-escola:hover .dbm-escola__nome { color:#1e73be; }
.dbm-escola__more { display:inline-flex; align-items:center; gap:.35rem; font-weight:700; font-size:.82rem; color:#1e73be; }
.dbm-escola__more svg { width:13px; height:13px; }
@media (max-width:1080px){ .dbm-escolas { grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px){ .dbm-escolas { grid-template-columns:1fr; } }

/* ---- Hub Paroquias: carrossel com destaque ---- */
.dbm-parcar { margin-top:1.7rem; }
.dbm-parcar__stage { display:flex; align-items:center; gap:1rem; }
.dbm-parcar__viewport { flex:1 1 auto; min-width:0; overflow:hidden; border-radius:22px; }
.dbm-parcar__track { display:flex; transition:transform .5s cubic-bezier(.4,0,.2,1); }
.dbm-parcar__slide { flex:0 0 100%; min-width:100%; display:grid; grid-template-columns:1.15fr 1fr; background:#fff; box-shadow:0 20px 50px rgba(11,33,57,.12); }
.dbm-parcar__photo { display:block; min-height:360px; background:#e8edf5 center/cover no-repeat; cursor:pointer; }
.dbm-parcar__info { display:flex; flex-direction:column; justify-content:center; gap:.7rem; padding:2.2rem 2.5rem; }
.dbm-parcar__city { display:inline-flex; align-items:center; gap:.35rem; align-self:flex-start; background:rgba(11,33,57,.07); color:var(--pc,#53468a); font-size:.74rem; font-weight:800; padding:.28rem .8rem; border-radius:999px; }
.dbm-parcar__city svg { width:13px; height:13px; }
.dbm-parcar__nome { font-size:clamp(1.35rem,2.2vw,1.7rem); font-weight:800; color:#16233c; line-height:1.24; margin:0; }
.dbm-parcar__row { display:flex; align-items:flex-start; gap:.5rem; margin:0; font-size:.92rem; color:#5b6779; line-height:1.5; }
.dbm-parcar__row svg { flex:0 0 auto; width:14px; height:14px; margin-top:.25rem; color:var(--pc,#53468a); }
.dbm-parcar__info .dbm-btn { align-self:flex-start; margin-top:.55rem; }
.dbm-parcar__nav { flex:0 0 auto; width:50px; height:50px; border:0; border-radius:50%; background:#fff; color:var(--pc,#53468a); box-shadow:0 10px 26px rgba(11,33,57,.16); cursor:pointer; display:inline-flex; align-items:center; justify-content:center; transition:background .2s ease, color .2s ease, transform .2s ease; }
.dbm-parcar__nav:hover { background:var(--pc,#53468a); color:#fff; transform:scale(1.06); }
.dbm-parcar__nav svg { width:22px; height:22px; }
.dbm-parcar__thumbs { display:flex; gap:.6rem; justify-content:center; overflow-x:auto; padding:1.1rem .2rem .2rem; scrollbar-width:thin; }
.dbm-parcar__thumbs::-webkit-scrollbar { height:6px; }
.dbm-parcar__thumbs::-webkit-scrollbar-thumb { background:rgba(11,33,57,.2); border-radius:3px; }
.dbm-parcar__thumb { flex:0 0 auto; width:78px; height:56px; border:2px solid transparent; border-radius:11px; background:#e8edf5 center/cover no-repeat; cursor:pointer; opacity:.55; transition:opacity .2s ease, border-color .2s ease, transform .2s ease; }
.dbm-parcar__thumb:hover { opacity:.85; }
.dbm-parcar__thumb.is-active { opacity:1; border-color:var(--pc,#53468a); transform:translateY(-2px); }
@media (max-width:820px){
	.dbm-parcar__slide { grid-template-columns:1fr; }
	.dbm-parcar__photo { min-height:210px; }
	.dbm-parcar__info { padding:1.6rem 1.5rem; }
	.dbm-parcar__nav { width:40px; height:40px; }
	.dbm-parcar__nav svg { width:18px; height:18px; }
}

/* ---- Modal de paróquia ---- */
.dbm-pmodal { display:none; position:fixed; inset:0; z-index:100000; align-items:center; justify-content:center; padding:1.5rem; }
.dbm-pmodal:not([hidden]) { display:flex; }
.dbm-pmodal__overlay { position:absolute; inset:0; background:rgba(6,14,29,.72); cursor:pointer; }
.dbm-pmodal__box { position:relative; z-index:1; width:min(880px,100%); max-height:90vh; overflow:auto; background:#fff; border-radius:22px; box-shadow:0 40px 90px rgba(0,0,0,.5); display:grid; grid-template-columns:1.05fr 1fr; animation:dbm-pmodal-in .3s ease; }
@keyframes dbm-pmodal-in { from { opacity:0; transform:translateY(14px) scale(.985); } to { opacity:1; transform:none; } }
.dbm-pmodal__photo { min-height:340px; background:#e8edf5 center/cover no-repeat; }
.dbm-pmodal__body { padding:2.3rem 2.4rem; }
.dbm-pmodal__close { position:absolute; top:14px; right:14px; z-index:2; width:42px; height:42px; border:0; border-radius:50%; background:rgba(255,255,255,.92); color:#0A2E63; cursor:pointer; display:flex; align-items:center; justify-content:center; box-shadow:0 4px 14px rgba(0,0,0,.22); transition:background .2s ease, color .2s ease; }
.dbm-pmodal__close:hover { background:#E23A2E; color:#fff; }
.dbm-pmodal__close svg { width:20px; height:20px; }
.dbm-pmodal__city { display:inline-flex; align-items:center; gap:.35rem; background:rgba(11,33,57,.07); color:var(--pc,#53468a); font-size:.74rem; font-weight:800; padding:.28rem .8rem; border-radius:999px; margin-bottom:.8rem; }
.dbm-pmodal__body h2 { margin:0 0 1.4rem; font-size:1.45rem; font-weight:800; color:#16233c; line-height:1.24; }
.dbm-pmodal__row { display:flex; gap:.85rem; align-items:flex-start; margin-bottom:1.1rem; font-size:.94rem; color:#33415a; line-height:1.55; }
.dbm-pmodal__row svg { flex:0 0 auto; width:20px; height:20px; margin-top:.15rem; color:var(--pc,#53468a); }
.dbm-pmodal__row b { display:block; font-size:.7rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; color:#8a94a6; margin-bottom:.15rem; }
.dbm-pmodal__row a { color:var(--pc,#53468a); font-weight:600; }
.dbm-pmodal__row a:hover { color:#E23A2E; }
.dbm-pmodal .dbm-btn { margin-top:.7rem; }
@media (max-width:720px){
	.dbm-pmodal { padding:.8rem; }
	.dbm-pmodal__box { grid-template-columns:1fr; }
	.dbm-pmodal__photo { min-height:190px; }
	.dbm-pmodal__body { padding:1.7rem 1.5rem; }
}

/* ---- Detalhe da paróquia ---- */
.dbm-parishhero { position:relative; overflow:hidden; padding:3.2rem 0 2.8rem; color:#fff; background:#0A2E63; }
.dbm-parishhero::before { content:""; position:absolute; inset:0; background:var(--bg) center/cover no-repeat; opacity:.32; }
.dbm-parishhero::after { content:""; position:absolute; inset:0; background:linear-gradient(120deg, rgba(10,46,99,.92), rgba(83,70,138,.78)); }
.dbm-parishhero .container { position:relative; z-index:1; }
.dbm-parishhero .dbm-phero__bc { color:rgba(255,255,255,.7); }
.dbm-parishhero .dbm-phero__bc a { color:rgba(255,255,255,.82); }
.dbm-parishhero .dbm-phero__bc a:hover { color:#fff; }
.dbm-parishhero .dbm-phero__bc b { color:#fff; }
.dbm-parishhero__city { display:inline-flex; align-items:center; gap:.4rem; margin:.7rem 0 .3rem; padding:.32rem .85rem; background:rgba(255,255,255,.16); border-radius:999px; font-size:.8rem; font-weight:700; }
.dbm-parishhero__city svg { width:14px; height:14px; }
.dbm-parishhero h1 { margin:.3rem 0 0; font-size:clamp(1.7rem,3.4vw,2.5rem); font-weight:900; color:#fff; }

.dbm-parishwrap { padding:2.4rem 0 3.4rem; }
.dbm-parishcard { display:grid; grid-template-columns:1.1fr 1fr; gap:0; background:#fff; border-radius:20px; overflow:hidden; box-shadow:0 20px 50px rgba(11,33,57,.12); }
.dbm-parishcard__photo { min-height:360px; background:#e8edf5 center/cover no-repeat; }
.dbm-parishcard__info { padding:2.2rem 2.4rem; }
.dbm-parishcard__info h2 { margin:0 0 1.4rem; font-size:1.3rem; font-weight:800; color:#0A2E63; }
.dbm-parishcard__row { display:flex; gap:.9rem; margin-bottom:1.15rem; }
.dbm-parishcard__ic { flex:0 0 auto; width:40px; height:40px; border-radius:11px; background:rgba(83,70,138,.1); color:#53468a; display:flex; align-items:center; justify-content:center; }
.dbm-parishcard__ic svg { width:19px; height:19px; }
.dbm-parishcard__row > span:last-child { font-size:.94rem; color:#33415a; line-height:1.55; }
.dbm-parishcard__row b { display:block; font-size:.72rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; color:#8a94a6; margin-bottom:.15rem; }
.dbm-parishcard__row a { color:#53468a; font-weight:600; }
.dbm-parishcard__row a:hover { color:#E23A2E; }
.dbm-parishcard__btns { display:flex; gap:.7rem; flex-wrap:wrap; margin-top:1.6rem; }
@media (max-width:820px){
	.dbm-parishcard { grid-template-columns:1fr; }
	.dbm-parishcard__photo { min-height:220px; }
	.dbm-parishcard__info { padding:1.7rem 1.5rem; }
}

/* ---- Filtro de paróquias por estado (mapas brancos sobre faixa roxa) ---- */
.dbm-ufbar { display:flex; align-items:flex-end; justify-content:center; gap:1.4rem; flex-wrap:wrap; background:var(--pc,#53468a); border-radius:18px; padding:1.3rem 1.6rem; margin-top:1.6rem; }
.dbm-uf { display:flex; flex-direction:column; align-items:center; gap:.5rem; background:none; border:0; cursor:pointer; padding:.35rem .55rem; border-radius:12px; transition:background .2s ease; }
.dbm-uf:hover { background:rgba(255,255,255,.08); }
.dbm-uf.is-active { background:rgba(255,255,255,.12); }
.dbm-uf__map { display:flex; align-items:flex-end; justify-content:center; height:60px; }
.dbm-uf__map img { height:54px; width:auto; display:block; opacity:.42; transition:opacity .22s ease, transform .22s ease; }
.dbm-uf:first-child .dbm-uf__map img { height:60px; }
.dbm-uf:hover .dbm-uf__map img { opacity:.8; }
.dbm-uf.is-active .dbm-uf__map img { opacity:1; transform:translateY(-2px); }
.dbm-uf__lbl { font-size:.72rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:rgba(255,255,255,.55); }
.dbm-uf:hover .dbm-uf__lbl { color:rgba(255,255,255,.85); }
.dbm-uf.is-active .dbm-uf__lbl { color:#fff; }
.dbm-parcar__stage.is-solo .dbm-parcar__nav { display:none; }
@media (max-width:560px){
	.dbm-ufbar { gap:.7rem; padding:1rem; }
	.dbm-uf__map { height:48px; }
	.dbm-uf__map img { height:42px; }
	.dbm-uf:first-child .dbm-uf__map img { height:48px; }
}


/* =========================================================================
   Ajustes de acessibilidade
   -------------------------------------------------------------------------
   Mesmo painel das escolas e das obras sociais, para quem usa mais de um site
   da rede nao ter de reaprender. Fica preso na borda esquerda, do lado oposto
   ao botao do VLibras.

   As cores vem escritas, e nao por variavel: este tema nao tem a mesma folha
   de variaveis dos outros dois.
   ========================================================================= */

/* ------------------------------------------------------- Tamanho da letra */

/* Este tema e escrito quase todo em rem: das 283 declaracoes de tamanho de
   texto, 278 usam rem ou em. Por isso mexer na raiz aumenta texto, espacamento
   e botao junto, sem quebrar alinhamento. */
html[data-fonte="1"] {
  font-size: 112.5%;
}

html[data-fonte="2"] {
  font-size: 125%;
}

html[data-fonte="-1"] {
  font-size: 93.75%;
}

/* ---------------------------------------------------------- Alto contraste */

/* Preto e amarelo, o par de maior contraste e o mais usado em site publico
   brasileiro.

   Nas escolas e nas obras isto se resolve reescrevendo as variaveis de cor do
   tema, e tudo que as usa acompanha. Aqui nao da: o portal tem dez variaveis, e
   nenhuma delas e um sistema de cor. Entao a regra e por forca bruta, apagando
   fundo de tudo e pintando texto e borda por cima. E mais grosseiro, e e o que
   funciona num tema que nao foi desenhado para isto. */
html[data-contraste="alto"],
html[data-contraste="alto"] body {
  background: #000 !important;
  color: #fff !important;
}

html[data-contraste="alto"] *:not(svg):not(path) {
  background-color: transparent !important;
  background-image: none !important;
  border-color: #ffe600 !important;
  color: #fff !important;
  box-shadow: none !important;
  text-shadow: none !important;
}

/* O LINK SAIA BRANCO, E NAO AMARELO, EM TODO O PORTAL.

   A regra de forca bruta logo acima tem especificidade (0,1,3), porque os dois
   `:not()` contam como seletor de tipo cada um. A regra do link tinha (0,1,2), e
   perdia: `!important` nao desempata `!important`, quem desempata e a
   especificidade. Medido no navegador com o alto contraste ligado: `color` de
   rgb(255,255,255) no link do rodape e no da trilha, quando o combinado era o
   amarelo #ffe600, que e justamente o que distingue link de texto nesse modo.

   Os mesmos dois `:not()` repetidos aqui empatam a conta, e como esta regra vem
   depois no arquivo, ela vence. */
html[data-contraste="alto"] a:not(svg):not(path),
html[data-contraste="alto"] a *:not(svg):not(path) {
  color: #ffe600 !important;
  text-decoration: underline !important;
}

html[data-contraste="alto"] button,
html[data-contraste="alto"] .btn,
html[data-contraste="alto"] input[type="submit"] {
  border: 2px solid #ffe600 !important;
  color: #ffe600 !important;
}

html[data-contraste="alto"] input,
html[data-contraste="alto"] select,
html[data-contraste="alto"] textarea {
  background: #000 !important;
  border: 1px solid #ffe600 !important;
  color: #fff !important;
}

/* Foto vira escala de cinza: colorida sobre preto ela some, e o contorno e o
   que interessa para quem esta com o contraste ligado. */
html[data-contraste="alto"] img {
  filter: grayscale(1) contrast(1.3);
}

/* O proprio painel se pinta sozinho, senao ele desaparece junto com o resto. */
html[data-contraste="alto"] .a11y-abrir,
html[data-contraste="alto"] .a11y-painel {
  background: #000 !important;
  border: 2px solid #ffe600 !important;
}

html[data-contraste="alto"] .a11y-abrir svg,
html[data-contraste="alto"] .a11y-abrir path {
  fill: #ffe600 !important;
}

/* =======================================================================
   Fale conosco: formulario proprio + bloco de contato da editoria.
   O tema nao tinha estilo de formulario porque nao tinha formulario: o
   desenho vinha do Contact Form 7, que sumiu do disco. A cor de cada area
   entra pela variavel --c, do mesmo jeito que os cards e os hubs.
   ======================================================================= */

.dbm-contatopage { display:grid; grid-template-columns:minmax(0,1fr) 340px; gap:2.6rem; align-items:start; }
@media (max-width:900px){ .dbm-contatopage{ grid-template-columns:1fr; gap:2rem; } }

/* ---- Formulario ---- */
.dbm-form { margin-top:1.4rem; }
.dbm-form__linha { display:grid; grid-template-columns:1fr 1fr; gap:0 1rem; }
@media (max-width:640px){ .dbm-form__linha{ grid-template-columns:1fr; } }
.dbm-form__campo { margin:0 0 1.1rem; }
.dbm-form__campo label { display:block; font-size:.82rem; font-weight:700; color:#12294A; margin-bottom:.35rem; }
.dbm-form__campo label span { color:#C12811; }
.dbm-form__campo input,
.dbm-form__campo select,
.dbm-form__campo textarea {
	width:100%; padding:.7rem .9rem; font-size:.95rem; color:#16233c;
	background:#fff; border:1px solid #d7deeb; border-radius:10px;
	transition:border-color .2s ease, box-shadow .2s ease;
}
.dbm-form__campo textarea { resize:vertical; min-height:150px; }
.dbm-form__campo input:focus,
.dbm-form__campo select:focus,
.dbm-form__campo textarea:focus {
	outline:none; border-color:var(--c,#0B4DAD); box-shadow:0 0 0 3px rgba(11,77,173,.14);
}

/* O campo-isca precisa existir no HTML e nao pode aparecer para ninguem.
   `display:none` seria o obvio e e justamente o que o robo bom procura para
   pular; fora da tela ele preenche, que e o que se quer. */
.dbm-form__isca { position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }

.dbm-form__lgpd { font-size:.78rem; line-height:1.6; color:#5b6779; background:#f4f6fb; border-left:3px solid var(--c,#0B4DAD); border-radius:0 8px 8px 0; padding:.85rem 1rem; margin:0 0 1.2rem; }
.dbm-form__lgpd a { color:#0B4DAD; font-weight:600; text-decoration:underline !important; }

.dbm-form__envio { margin:0; }
.dbm-form__envio .dbm-btn { border:0; cursor:pointer; }

.dbm-form__recado { font-size:.9rem; font-weight:600; border-radius:10px; padding:.85rem 1.1rem; margin:0 0 1.4rem; }
.dbm-form__recado--ok { background:#e6f4ea; color:#0a7c2f; border:1px solid #b7e0c4; }
.dbm-form__recado--erro { background:#fdecec; color:#b32d2e; border:1px solid #f2c2c2; }

/* ---- Bloco de contato ---- */
.dbm-contato { background:#fff; border:1px solid rgba(11,33,57,.08); border-top:4px solid var(--c,#0B4DAD); border-radius:16px; padding:1.5rem 1.4rem; box-shadow:0 12px 30px rgba(18,41,74,.07); }
.dbm-contato__titulo { font-size:1.05rem; font-weight:800; color:#12294A; margin:0 0 .9rem; }
.dbm-contato__resp { font-size:.86rem; color:#5b6779; margin:0 0 1rem; }
.dbm-contato__lista { margin:0; }
.dbm-contato__lista dt { font-size:.7rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--c,#0B4DAD); margin-top:1rem; }
.dbm-contato__lista dt:first-child { margin-top:0; }
.dbm-contato__lista dd { margin:.25rem 0 0; font-size:.9rem; line-height:1.5; color:#16233c; }
.dbm-contato__lista dd a { color:#16233c; }
.dbm-contato__lista dd a:hover { color:var(--c,#0B4DAD); }
.dbm-contato__zap { margin:1.3rem 0 0; }
.dbm-contato__zap .dbm-btn { width:100%; text-align:center; }
.dbm-contato__rotulo { font-size:.7rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:#8a94a6; margin:1.5rem 0 .5rem; }
.dbm-contato__redes { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:.45rem; }
.dbm-contato__redes a { display:flex; align-items:center; gap:.6rem; font-size:.88rem; font-weight:600; color:#16233c; }
.dbm-contato__redes a:hover { color:var(--c,#0B4DAD); }
.dbm-contato__redes i::before { font-size:1rem; color:var(--c,#0B4DAD); }

/* ---- Atalhos para as outras areas, so na pagina raiz ---- */
.dbm-contato__outras { margin-top:1.4rem; }
.dbm-contato__outras ul { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:.45rem; }
.dbm-contato__outras a { display:block; padding:.6rem .9rem; background:#fff; border:1px solid rgba(11,33,57,.09); border-left:4px solid var(--c,#0B4DAD); border-radius:10px; font-size:.88rem; font-weight:700; color:#16233c; transition:transform .2s ease, box-shadow .2s ease; }
.dbm-contato__outras a:hover { transform:translateX(3px); box-shadow:0 8px 20px rgba(18,41,74,.09); color:var(--c,#0B4DAD); }
.dbm-contato__outras-nota { margin:1.2rem 0 0; font-size:.85rem; font-weight:600; }
.dbm-contato__outras-nota a { color:#0B4DAD; }

/* ---- Organograma: o aviso estourava a tela no celular ----
   A pagina guarda o proprio CSS no conteudo. La, `.org-help` tem `width:100%`
   e a media query de celular acrescenta `margin-left:20px` e `margin-right:20px`
   sem trocar a largura, entao o bloco media 100% + 40px. Medido a 390px:
   `document.scrollWidth` = 410 contra `clientWidth` = 390, e a pagina inteira
   andava 20px para o lado. Era o unico estouro horizontal do site.
   O diagrama em si nao tem culpa: ele fica num `.org-viewport` com
   `overflow-x:auto` e se comporta.
   `width:auto` deixa o bloco ocupar o que sobra depois das margens.
   O `body` na frente nao e enfeite: a regra a vencer e
   `#organograma-inspetorial .org-help { width:100% }`, escrita numa tag <style>
   dentro do proprio conteudo da pagina. Ela tem a mesma especificidade que a
   nossa e o navegador le o <style> do corpo depois desta folha, entao empate
   significa que a do conteudo ganha. O `body` desempata sem precisar de !important. */
body #organograma-inspetorial .org-help,
body #organograma-inspetorial .org-toolbar { width:auto; max-width:100%; }

/* =======================================================================
   CABECALHO DE PAGINA INTERNA (template-parts/cabecalho-pagina.php)
   Faixa com trilha + titulo, reaproveitando o .dbm-phero que os hubs ja usam.
   So entra aqui o que a faixa acrescenta: a camada de foto e a trilha em
   lista ordenada. Bloco no fim do arquivo de proposito, para nao disputar
   linha com as outras frentes que mexem no meio desta folha.
   ======================================================================= */

/* ---- Faixa com foto ----
   A foto e uma camada propria, e nao um background do .dbm-phero: o ::before e
   o ::after da faixa ja estao ocupados pelos dois circulos de luz, e sobrescrever
   os dois exigiria zerar top/right/width/height/border-radius de cada um. */
.dbm-phero__foto { position:absolute; inset:0; background-image:var(--foto); background-size:cover; background-position:center; opacity:.42; }
/* Veu por cima da foto, para o titulo branco nao depender da arte que subirem.
   Medido na faixa de /inspetoria/quem-somos/ com a arte da producao: o ponto
   mais claro do fundo fica em #345981, ou 7,26:1 contra o branco. Sem o veu,
   uma foto clara derruba o mesmo ponto para perto de 2:1. */
.dbm-phero__foto::after { content:""; position:absolute; inset:0; background:linear-gradient(115deg,rgba(8,29,62,.86),rgba(8,29,62,.62)); }
.dbm-phero--foto { background:linear-gradient(130deg,#081D3E 0%,#0A2E63 62%,var(--c,#0B4DAD) 140%); }

/* ---- Trilha ----
   Base pensada para fundo claro (e o caso do single de noticia); dentro da
   faixa, as regras de .dbm-phero abaixo trocam so as cores. */
.dbm-trilha { font-size:.78rem; color:#8a94a6; }
.dbm-trilha ol { list-style:none; margin:0; padding:0; }
.dbm-trilha li { display:inline; }
/* Mesma armadilha do `*{color:#5B5B5B}`: sobre a faixa escura o separador ficava a
   1.95 para 1 e praticamente desaparecia. E decorativo (aria-hidden), entao nao e
   falha de norma, mas a trilha sem separador visivel vira uma fila de palavras. */
.dbm-trilha__sep { padding:0 .12em; color:rgba(255,255,255,.55); }
.dbm-trilha a { display:inline-block; padding:.34rem .16rem; border-radius:6px; color:#5b6779; font-weight:600; }
.dbm-trilha a:hover { color:#0B4DAD; }
/* O tema nao tinha uma regra de foco sequer: quem navega por teclado nao
   enxergava onde estava. `currentColor` serve tanto no claro quanto no escuro.
   O par :focus + :focus-visible e de proposito: o anel aparece para quem chega
   pelo teclado e some para quem chegou de clique, e em navegador antigo, que
   nao entende :focus-visible, sobra o anel em vez de sobrar nada. */
.dbm-trilha a:focus { outline:2px solid currentColor; outline-offset:2px; }
.dbm-trilha a:focus:not(:focus-visible) { outline:none; }
.dbm-trilha__atual { display:inline; color:#5b6779; font-weight:700; }

/* .72 e nao os .62 da copia antiga do hero: medido sobre a faixa, .62 dava
   5,04:1 no texto e caia perto de 3:1 na ponta clara do gradiente. */
.dbm-phero .dbm-trilha { color:rgba(255,255,255,.72); }
.dbm-phero .dbm-trilha a { color:rgba(255,255,255,.82); }
.dbm-phero .dbm-trilha a:hover { color:#fff; }
.dbm-phero .dbm-trilha__atual { color:#fff; }

/* Degrau da editoria (so em materia), com a cor da area. Depois das regras da
   faixa de proposito: mesma especificidade, entao quem vem por ultimo vence. */
.dbm-trilha a.dbm-trilha__ed { color:var(--c,#0B4DAD); }

/* O titulo e o proprio <h1> da faixa; o `.entry-title` do content-page nao
   entra mais na mesma pagina, senao seriam dois <h1>. */
.dbm-phero h1 { overflow-wrap:anywhere; }

@media (max-width:640px){
	/* 44px de area de toque no celular. So nos links: o degrau atual nao clica.
	   Medido a 390px: com .72rem dava 42px de altura, dois a menos que a regra. */
	.dbm-trilha a { padding:.8rem .3rem; }
}

/* =======================================================================
   ESTADO VAZIO E PAGINA 404
   Serve tres telas com a mesma cara: pagina publicada sem conteudo
   (template-parts/content-notitle.php), busca sem resultado
   (template-parts/content-none.php) e endereco que nao existe (404.php).
   Antes disso, o "nada encontrado" da busca era um ERRO 404 em corpo grande
   dentro de uma resposta HTTP 200, e a 404 nao tinha faixa nem trilha.
   ======================================================================= */

.dbm-vazio {
	max-width: 640px;
	margin: 2.4rem auto 3rem;
	padding: 2rem 1.6rem;
	background: #f6f9fc;
	border: 1px solid rgba(11,33,57,.1);
	border-radius: 18px;
	text-align: center;
	color: #33415a;
	line-height: 1.6;
}

.dbm-vazio__titulo { margin: 0 0 .6rem; font-size: 1.15rem; font-weight: 800; color: #12233f; }
.dbm-vazio p { margin: 0 0 .9rem; }
.dbm-vazio p:last-child { margin-bottom: 0; }

/* O formulario de busca do nucleo entra aqui dentro sem classe nossa; estas
   duas regras sao o suficiente para ele nao sair desalinhado. */
.dbm-vazio form { display: flex; gap: .5rem; justify-content: center; flex-wrap: wrap; margin: 0 0 1.2rem; }
.dbm-vazio form input[type="search"] { flex: 1 1 220px; min-height: 44px; padding: .5rem .9rem; border: 1px solid #cfd8e6; border-radius: 10px; }
.dbm-vazio form input[type="submit"] { min-height: 44px; padding: .5rem 1.4rem; border: 0; border-radius: 10px; background: #0B4DAD; color: #fff; font-weight: 700; cursor: pointer; }

.dbm-404 { padding: 3rem 0 4rem; text-align: center; }
/* O numero e enfeite: o titulo da tela e o <h1> da faixa, e este 404 vai com
   aria-hidden para o leitor de tela nao anunciar "quatro zero quatro" depois
   de ja ter lido "Pagina nao encontrada". */
.dbm-404__numero { margin: 0; font-size: clamp(3.4rem, 12vw, 6rem); font-weight: 900; line-height: 1; color: #dfe7f2; letter-spacing: .04em; }
.dbm-404__texto { max-width: 52ch; margin: .6rem auto 1.6rem; color: #33415a; line-height: 1.6; }
.dbm-404 form { display: flex; gap: .5rem; justify-content: center; flex-wrap: wrap; max-width: 460px; margin: 0 auto 1.6rem; }
.dbm-404 form input[type="search"] { flex: 1 1 200px; min-height: 44px; padding: .5rem .9rem; border: 1px solid #cfd8e6; border-radius: 10px; }
.dbm-404 form input[type="submit"] { min-height: 44px; padding: .5rem 1.4rem; border: 0; border-radius: 10px; background: #0B4DAD; color: #fff; font-weight: 700; cursor: pointer; }
/* 44px de alvo tambem nos dois botoes de saida, e eles empilham no celular. */
.dbm-404__saidas { display: flex; gap: .7rem; justify-content: center; flex-wrap: wrap; }

/* =======================================================================
   WIDGET DE ACESSIBILIDADE (template-parts/acessibilidade.php)

   O bloco existia no HTML de TODA pagina do portal e nao tinha uma linha de
   estilo: era um botao nu e um painel solto, empilhados no fim do rodape.
   Enquanto o `dbm_icone()` devolvia so o atributo `d`, a coisa aparecia como
   uma faixa de 1280x54 px com "M12 2a2 2 0 110 4 2 2 0 010-4zm9 5.5c0 ..."
   escrito por extenso; com o icone consertado, virou um botao de 40x31, abaixo
   dos 44 de alvo e no lugar errado da tela.

   Fica em cima do lado esquerdo de proposito: o VLibras, quando ligado, mora
   no canto direito, e dois botoes flutuantes no mesmo canto se cobrem.
   ======================================================================= */

.a11y { position:fixed; left:16px; bottom:16px; z-index:1200; display:flex; flex-direction:column; align-items:flex-start; gap:.6rem; }

.a11y-abrir { display:inline-flex; align-items:center; justify-content:center; width:48px; height:48px; padding:0; border:0; border-radius:999px; background:#0A2E63; color:#fff; cursor:pointer; box-shadow:0 8px 20px rgba(10,46,99,.32); transition:background .18s ease, transform .18s ease; }
.a11y-abrir:hover { background:#0B4DAD; transform:translateY(-2px); }
.a11y-abrir:focus-visible { outline:3px solid #ffe600; outline-offset:2px; }
.a11y-abrir svg { width:26px; height:26px; }

/* O painel sobe a partir do botao. `order:-1` para ele aparecer ACIMA no
   empilhamento sem precisar de posicionamento absoluto, que teria de ser
   recalculado quando o painel muda de altura. */
.a11y-painel { order:-1; width:250px; padding:1rem; border-radius:16px; background:#fff; border:1px solid rgba(11,33,57,.12); box-shadow:0 18px 44px rgba(15,30,60,.22); }
.a11y-titulo { margin:0 0 .7rem; font-size:.95rem; font-weight:800; color:#0A2E63; }
.a11y-linha { display:flex; align-items:center; justify-content:space-between; gap:.6rem; margin-bottom:.6rem; }
.a11y-rotulo { font-size:.85rem; color:#33415a; }
.a11y-par { display:inline-flex; gap:.35rem; }

/* 44px de alvo em todos os controles do painel, inclusive nos dois quadradinhos
   de A- e A+, que sao os menores. */
.a11y-botao { display:inline-flex; align-items:center; justify-content:center; gap:.45rem; min-width:44px; min-height:44px; padding:.4rem .8rem; border:1px solid #cfd8e6; border-radius:10px; background:#f6f9fc; color:#12233f; font-weight:700; font-size:.88rem; line-height:1; text-decoration:none; cursor:pointer; }
.a11y-botao:hover { background:#eaf1fa; color:#0B4DAD; }
.a11y-botao:focus-visible { outline:3px solid #0B4DAD; outline-offset:2px; }
.a11y-botao--largo { width:100%; margin-top:.45rem; }
.a11y-botao[aria-pressed="true"] { background:#0A2E63; border-color:#0A2E63; color:#fff; }
.a11y-botao svg { width:17px; height:17px; }

@media (max-width:640px) {
	/* No celular o painel nao pode ter largura fixa maior que a tela menos as
	   duas margens: a 320px, os 250px + 16px de cada lado ja estouravam. */
	.a11y-painel { width:min(250px, calc(100vw - 44px)); }

	/* A `.dbm-tabbar` mora fixa no rodape do celular e mede 63px. Medido: com o
	   botao a 16px do fundo, ele caia por cima do primeiro item da barra, o
	   "Inicio". Os 63 da barra mais 12 de respiro tiram um do caminho do outro. */
	.a11y { bottom:75px; }
}

@media print {
	.a11y { display:none; }
}

/* =========================================================================
   Presenca Salesiana
   -------------------------------------------------------------------------
   Bloco proprio, no fim do arquivo, para nao disputar linha com o resto.
   ========================================================================= */

.dbm-pres-area { padding: clamp(24px, 4vw, 48px) 0; }

.dbm-pres-filtros {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 14px 18px;
  align-items: end;
  margin-bottom: 22px;
  padding: 18px;
  border: 1px solid #e4e7eb;
  border-radius: 14px;
  background: #f5f7fa;
}

.dbm-pres-campo { margin: 0; }
.dbm-pres-campo--busca { grid-column: 1 / -1; }

.dbm-pres-campo label {
  display: block;
  margin-bottom: 5px;
  font-size: .9rem;
  font-weight: 700;
  color: #0d3b66;
}

/* 44px de altura minima: no celular o alvo de toque precisa caber o dedo. */
.dbm-pres-campo input,
.dbm-pres-campo select {
  width: 100%;
  min-height: 44px;
  padding: 9px 12px;
  border: 1px solid #cfd6de;
  border-radius: 10px;
  background: #fff;
  font-size: 1rem;
  color: #1f2933;
}

.dbm-pres-campo input:focus-visible,
.dbm-pres-campo select:focus-visible {
  outline: 2px solid #1b9aaa;
  outline-offset: 2px;
}

.dbm-pres-acoes {
  display: flex;
  align-items: center;
  gap: 14px;
  margin: 0;
}

/* Alvo de 44px: "Limpar" e o e-mail do cartao sao dedo, nao so mouse. O texto
   continua do tamanho que era; o que cresce e a area de toque em volta dele. */
.dbm-pres-limpar {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  font-size: .92rem;
  text-decoration: underline;
}

.dbm-pres-contador {
  margin: 0 0 16px;
  font-weight: 700;
  color: #52606d;
}

.dbm-pres-lista {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 1fr));
  gap: 18px;
  margin: 0;
  padding: 0;
  list-style: none;
}

/* O cartao nao tem respiro proprio: a foto encosta na borda e quem afasta o
   texto e o `.dbm-pres-corpo` la embaixo. Este bloco ja teve um `padding: 18px`
   aqui e um `padding: 0` mais adiante no mesmo arquivo, no mesmo nivel de
   seletor; o segundo sempre ganhava e o primeiro era codigo morto que so servia
   para quem lesse acreditar em outra medida. */
.dbm-pres-item {
  display: flex;
  flex-direction: column;
  gap: 0;
  min-width: 0;
  padding: 0;
  overflow: hidden;
  border: 1px solid #e4e7eb;
  border-radius: 14px;
  background: #fff;
}

.dbm-pres-item[hidden] { display: none; }

.dbm-pres-selo {
  align-self: flex-start;
  padding: 3px 10px;
  border-radius: 999px;
  background: #0d3b66;
  color: #fff;
  font-size: .74rem;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.dbm-pres-nome {
  margin: 6px 0 0;
  font-size: 1.06rem;
  line-height: 1.3;
  color: #0d3b66;
}

.dbm-pres-local { margin: 0; font-weight: 700; color: #1f2933; }

.dbm-pres-dado {
  margin: 0;
  font-size: .93rem;
  color: #52606d;
  word-break: break-word;
}

/* O e-mail do cartao media 18px de altura, que e alvo de mira, nao de dedo. */
.dbm-pres-dado a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
}

.dbm-pres-vazio {
  padding: 22px;
  border: 1px dashed #cfd6de;
  border-radius: 14px;
  background: #f5f7fa;
  color: #52606d;
}

.dbm-pres-vazio[hidden] { display: none; }

/* =========================================================================
   Presenca Salesiana: o bloco reaproveitavel e o mapa
   -------------------------------------------------------------------------
   O mesmo cartao serve a pagina do mapa e aos seis hubs. Antes eram tres
   carrosseis quase iguais, cada um com o proprio script copiado, e o cartao
   do hub das Paroquias saia sem foto e sem cidade porque lia meta vazia.
   ========================================================================= */

/* A peca NAO carrega .dbm-pres-area: o padding de pagina dela quebraria o
   ritmo do hub, onde quem espaca e o `section + section`. */
.dbm-unis { min-width: 0; }
.dbm-unis .dbm-pres-contador { margin: 0 0 16px; }

.dbm-unis--vazia .dbm-pres-vazio { margin: 0; }

.dbm-pres-foto {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  background-color: #eef1f5;
  background-size: cover;
  background-position: center;
}

.dbm-pres-corpo {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
  padding: 18px;
}

.dbm-pres-selo { background: var(--uc, #0d3b66); }

/* 44px de alvo: no celular o link do cartao precisa caber o dedo. */
.dbm-pres-link {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .4rem;
  min-height: 44px;
  font-weight: 700;
  color: var(--uc, #0d3b66);
}

.dbm-pres-link:focus-visible {
  outline: 2px solid #1b9aaa;
  outline-offset: 2px;
}

.dbm-pres-fora { font-size: .8rem; font-weight: 400; color: #52606d; }

/* ---------------------------------------------------------------- mapa -- */

/* Estas medidas sao as do mapa que existia na home antes do cadastro unico, e
   sao as mesmas de proposito: trocou a fonte do dado, nao a cara da tela. */
.dbm-mapa { margin: 0 0 22px; }
.dbm-mapa[hidden],
.dbm-mapa__mapwrap[hidden],
.dbm-mapa__tela[hidden],
.dbm-mapa__painel[hidden],
.dbm-mapa__cidade[hidden],
.dbm-mapa__contagem[hidden],
.dbm-mapa__nota[hidden],
.dbm-mapa__legenda-item[hidden],
.dbm-mapa__lugar-li[hidden] { display: none; }

.dbm-mapa__mapwrap { margin-bottom: 1.5rem; }

/* A tela chega escondida do servidor e so o script mostra: sem JavaScript nao ha
   mapa nenhum, e nao sobra caixa cinza ocupando meia tela. */
.dbm-mapa__tela {
  position: relative;
  z-index: 0;
  height: 500px;
  border-radius: 16px;
  overflow: hidden;
  background: #e8edf5;
  box-shadow: 0 14px 34px rgba(11, 33, 57, .12);
}

.dbm-mapa--solo .dbm-mapa__tela { height: 420px; }

/* -- legenda: a cor do pino dita em palavra, e a precisao junto dela -- */

.dbm-mapa__legenda {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem 1.2rem;
  list-style: none;
  margin: .9rem 0 0;
  padding: 0;
}

.dbm-mapa__legenda-item {
  display: flex;
  align-items: center;
  gap: .45rem;
  font-size: .82rem;
  font-weight: 700;
  color: #33415a;
}

.dbm-mapa__legenda-dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  flex: none;
  border: 2px solid #fff;
  box-shadow: 0 0 0 1px rgba(11, 33, 57, .15);
}

/*
 * A bolinha da legenda do aproximado desenha o proprio pino: circulo vazado e
 * tracejado. Quadrado de cor ao lado da frase "pino tracejado" obrigaria o
 * visitante a acreditar na frase; assim ele reconhece a forma no mapa.
 */
.dbm-mapa__legenda-item--aprox { font-weight: 600; color: #52606d; }
.dbm-mapa__legenda-dot--aprox {
  width: 14px;
  height: 14px;
  background: #fff;
  border: 2px dashed #52606d;
  box-shadow: none;
}

/* -- indice por cidade -- */

.dbm-mapa__painel {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: .9rem;
  align-items: start;
  margin-top: 1.2rem;
}

.dbm-mapa__cidade {
  border: 1px solid #e7e1d8;
  border-radius: 12px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 6px 18px rgba(11, 33, 57, .05);
}

/*
 * O `!important` da cor e antigo e continua necessario: o Bootstrap do tema
 * pinta `button` por conta propria e ganharia da regra do componente. Ele fica
 * aqui, e nao no HTML, para uma unica linha resolver o cabecalho nos dois
 * estados, `<p>` sem script e `<button>` com script.
 */
.dbm-mapa__cidade-head {
  box-sizing: border-box;
  width: 100%;
  min-height: 44px;
  display: flex;
  align-items: center;
  gap: .6rem;
  margin: 0;
  padding: .8rem 1rem;
  border: 0;
  border-radius: 0;
  background: #0A2E63 !important;
  color: #fff !important;
  font-weight: 700;
  font-size: .92rem;
  text-align: left;
}

button.dbm-mapa__cidade-head { cursor: pointer; transition: background .2s ease; }
button.dbm-mapa__cidade-head:hover,
button.dbm-mapa__cidade-head[aria-expanded="true"] { background: #0B4DAD !important; }
button.dbm-mapa__cidade-head:focus-visible { outline: 3px solid #1b9aaa; outline-offset: -3px; }

.dbm-mapa__cidade-nome { flex: 1 1 auto; min-width: 0; color: #fff !important; }

.dbm-mapa__cidade-n {
  flex: 0 0 auto;
  min-width: 24px;
  height: 24px;
  padding: 0 .4rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, .22);
  color: #fff !important;
  font-size: .74rem;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.dbm-mapa__cidade-corpo { padding: .5rem .6rem .6rem; }
.dbm-mapa__lugares { list-style: none; margin: 0; padding: 0; }

.dbm-mapa__lugar-li {
  display: flex;
  align-items: center;
  gap: .4rem;
}

.dbm-mapa__lugar {
  flex: 1 1 auto;
  min-width: 0;
  min-height: 44px;
  display: flex;
  align-items: center;
  gap: .55rem;
  text-align: left;
  padding: .45rem .5rem;
  border-radius: 9px;
  color: #16233c;
  text-decoration: none;
  transition: background .15s ease;
}

a.dbm-mapa__lugar:hover { background: #f1ece4; text-decoration: none; }
a.dbm-mapa__lugar:focus-visible { outline: 3px solid #1b9aaa; outline-offset: 2px; }

.dbm-mapa__lugar-dot {
  flex: none;
  width: 11px;
  height: 11px;
  border-radius: 50%;
  background: var(--dot, #0B4DAD);
}

.dbm-mapa__lugar-txt { font-size: .9rem; font-weight: 600; line-height: 1.3; }

.dbm-mapa__lugar-txt small {
  display: block;
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: .03em;
  text-transform: uppercase;
  color: #8a94a6;
  margin-top: .1rem;
}

/* Onde a posicao e do municipio, a linha diz. Onde e da porta, nao diz nada. */
.dbm-mapa__lugar-aprox { color: #8a4b00; text-transform: none; letter-spacing: 0; }

.dbm-mapa__lugar-ir {
  flex: none;
  min-height: 44px;
  padding: 0 .7rem;
  border: 1px solid #cfd8e3;
  border-radius: 9px;
  background: #fff;
  color: #0B4DAD;
  font-size: .74rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .03em;
  cursor: pointer;
}

.dbm-mapa__lugar-ir:hover { background: #eef3fb; }
.dbm-mapa__lugar-ir:focus-visible { outline: 3px solid #1b9aaa; outline-offset: 2px; }

.dbm-mapa__contagem,
.dbm-mapa__fora,
.dbm-mapa__nota {
  margin: 10px 0 0;
  font-size: .86rem;
  color: #52606d;
}

.dbm-mapa__contagem { font-weight: 700; color: #1f2933; }
.dbm-mapa__fora { color: #8a4b00; }

/* Alvo de 44px: este link é a alternativa em texto de quem não usa o mapa. */
.dbm-mapa__lista-link { margin: 10px 0 0; }
.dbm-mapa__lista-link a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 4px 0;
  font-weight: 700;
  color: #0B4DAD;
}

/*
 * O pino aproximado nao pode contar so com a cor: quem nao distingue cor ficaria
 * sem a informacao mais importante do mapa, que e "isto aqui nao e a porta". O
 * tracejado e a falta de ponta fazem esse trabalho, a legenda nomeia a forma e o
 * balao repete em palavra. Sao tres canais para o mesmo recado, e nenhum deles e
 * a cor.
 */
/* A caixa do marcador tem 44px de lado, o desenho continua com o tamanho de
   sempre (28x40 o de porta, 26x26 o aproximado) e a folga em volta e
   transparente. E o alvo de toque que faltava: o pino aproximado era um alvo de
   26px, menor do que o dedo de qualquer pessoa. Aumentar o desenho resolveria o
   toque e encobriria os vizinhos; aumentar so a area de toque nao muda nada do
   que se ve.

   O alinhamento e o que faz a ponta continuar caindo na coordenada certa: o de
   porta encosta no topo da caixa, e o `iconAnchor` do script aponta para a ponta
   dele; o aproximado fica centrado nos dois eixos, e o centro do circulo cai no
   ponto. */
.dbm-mapa__pino {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  background: none;
  border: 0;
}

.dbm-mapa__pino--aprox { align-items: center; }

/* Pino navegavel pelo teclado tem de aparecer quando recebe o foco. */
.leaflet-marker-icon:focus-visible {
  outline: 3px solid #1b9aaa;
  outline-offset: 3px;
}

.dbm-mapa__pop { min-width: 190px; }

.dbm-mapa__pop-selo {
  display: inline-block;
  color: #fff;
  font-size: .64rem;
  font-weight: 800;
  letter-spacing: .05em;
  text-transform: uppercase;
  padding: .2rem .6rem;
  border-radius: 999px;
}

.dbm-mapa__pop-titulo {
  display: block;
  margin: .5rem 0 .15rem;
  font-size: .96rem;
  color: #16233c;
  line-height: 1.3;
}

.dbm-mapa__pop-sub { display: block; font-size: .82rem; color: #3d4a5c; }
.dbm-mapa__pop-cidade { display: block; font-size: .82rem; color: #5b6779; }

.dbm-mapa__pop-nota {
  display: block;
  margin-top: .4rem;
  font-size: .78rem;
  line-height: 1.4;
  color: #8a4b00;
}

.dbm-mapa__pop-link {
  display: inline-block;
  margin-top: .5rem;
  font-weight: 700;
  color: #0B4DAD;
}

@media (max-width: 900px) {
  .dbm-mapa__tela,
  .dbm-mapa--solo .dbm-mapa__tela { height: 400px; }
}

/* =========================================================================
   Texto so para leitor de tela
   -------------------------------------------------------------------------
   A classe `screen-reader-text` ja era usada em oito lugares deste tema (o
   titulo da home, o "Pular para o conteudo" do cabecalho, o organograma) e NAO
   estava definida em CSS nenhum do tema. Ela funcionava emprestada da folha de
   blocos do proprio WordPress, que e enfileirada por padrao no site. Emprestado
   e o problema: no dia em que alguem desligar `wp-block-library` (e desligar essa
   folha e uma das primeiras coisas que se faz para deixar um site leve), oito
   textos escritos para serem so ouvidos aparecem escritos na tela, entre eles o
   nome do site em cima do banner da home. A regra e a mesma do WordPress, e
   passa a morar aqui.
   ========================================================================= */

.screen-reader-text {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  border: 0;
  clip: rect(1px, 1px, 1px, 1px);
  clip-path: inset(50%);
  word-wrap: normal !important;
}

/* O que e so ouvido tem de voltar a ser visto quando recebe o foco: o
   "Pular para o conteudo" e um link, e link que ninguem enxerga ao chegar nele
   e um link que ninguem usa. */
.screen-reader-text:focus {
  z-index: 100000;
  top: 8px;
  left: 8px;
  width: auto;
  height: auto;
  padding: 12px 18px;
  clip: auto;
  clip-path: none;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 6px 18px rgba(11, 33, 57, .28);
  color: #0A2E63;
  font-weight: 700;
  text-decoration: none;
}

/* =========================================================================
   O aro de foco que o tema tinha apagado
   -------------------------------------------------------------------------
   A PRIMEIRA LINHA do `main.css` traz `a:focus, input:focus, button:focus
   { border:0; outline:none }`. Isso apaga o aro de foco do site INTEIRO: medido
   com 55 paradas de Tab na pagina de Paroquias, os links do menu, os cartoes de
   noticia e os botoes saem todos com `outline-style: none`, e quem navega por
   teclado nao tem como saber onde esta. Os blocos deste arquivo desenham o
   proprio aro e por isso escapavam, o que mascarava o tamanho do problema.

   A volta e por `:focus-visible`, e nao por `:focus`: assim o aro aparece para
   quem chega pelo teclado e nao aparece no clique de mouse, que e o motivo pelo
   qual alguem apagou o aro um dia. Empate de especificidade com a regra do
   `main.css` (uma classe nenhuma, um elemento e uma pseudoclasse dos dois
   lados), e este arquivo carrega depois, entao ganha sem `!important`.
   ========================================================================= */

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible,
[tabindex]:focus-visible {
  outline: 3px solid #1b9aaa;
  outline-offset: 2px;
}

/* =========================================================================
   As unidades em carrossel
   -------------------------------------------------------------------------
   O CARTAO DO SLIDE MOSTRA MENOS, e e escolha. Na grade ele tem ate sete linhas
   (tipo, nome, cidade, endereco, telefone, e-mail e link); dentro de um slide de
   cerca de 290px isso vira parede de texto e as fotos deixam de alinhar. O slide
   fica com o que identifica a casa: a foto, o tipo, o nome, a cidade e o link.
   Endereco, telefone e e-mail continuam inteiros na pagina da Presenca
   Salesiana, que e para onde o botao logo abaixo leva.
   ========================================================================= */

.dbm-unis--slide .dbm-pres-lista { margin: 0; padding: 0; list-style: none; }

/* AS FOTOS TEM DE COMECAR NA MESMA ALTURA, e nao comecavam. O `main.css` traz
   `.swiper-slide { display:flex; justify-content:center; align-items:center }`,
   e o cartao da unidade e o proprio slide: `.dbm-pres-item` declara
   `flex-direction: column` mas nao declarava alinhamento, entao o `center` da
   biblioteca continuava valendo. Em coluna, `justify-content:center` centraliza
   na VERTICAL: como todos os slides herdam a altura do mais alto, todo cartao de
   nome curto ganhava uma faixa branca em cima e outra embaixo. Medido em
   /ensino/ a 1280: a foto do cartao mais alto comecava a 1px do topo e as outras
   oito a 12px, com os selos de tipo em alturas diferentes. A 390 sobrava um
   cartao alinhado e oito tortos. */
.dbm-pres-item.swiper-slide { align-items: stretch; justify-content: flex-start; }

/* No slide o cartao inteiro e clicavel, como era no site antigo. O `::after` do
   link cobre o cartao; o link continua sendo um so, entao nao ha link dentro de
   link nem alvo duplicado para quem usa leitor de tela. */
.dbm-unis--slide .dbm-pres-item { position: relative; height: auto; }
.dbm-unis--slide .dbm-pres-link::after { content: ""; position: absolute; inset: 0; }

/* Um aro so, e no que de fato se clica: o cartao. O aro do proprio link seria um
   retangulo fino em volta de duas palavras, dentro de um cartao inteiro que
   reage ao clique.

   O SELETOR E LONGO DE PROPOSITO. Escrito curto (`.dbm-unis--slide
   .dbm-pres-link:focus-visible`) ele PERDIA para a regra geral de aro do
   carrossel (`.dbm-car.is-car .swiper-slide :focus-visible`, que conta quatro
   classes contra tres), e o resultado eram dois aros concentricos: um fino em
   volta do texto do link e outro em volta do cartao. Medido com Tab de verdade,
   nao suposto. */
.dbm-unis--slide .is-car .swiper-slide .dbm-pres-link:focus-visible { outline: none; }
.dbm-unis--slide .dbm-pres-item:focus-within { outline: 3px solid #1b9aaa; outline-offset: -3px; }

.dbm-unis--slide .dbm-pres-corpo { padding: 16px 18px 18px; }
.dbm-unis--slide .dbm-pres-link { min-height: 0; margin-top: 6px; }
.dbm-unis .dbm-car { margin-bottom: 6px; }

/* Sem foto, uma capa que nao parece defeito.
   -------------------------------------------------------------------------
   Doze das vinte e cinco unidades nao tem foto, e nenhuma das sete paroquias
   tem. Na grade o cartao sem foto simplesmente nao desenhava a faixa, e lia bem
   porque cada linha da grade tem sua propria altura. Lado a lado num carrossel,
   "tres com foto e um sem" le como imagem que nao carregou.

   A capa NAO inventa imagem: e a cor do tipo da unidade, que e a mesma do pino
   dela no mapa, com o nome do tipo escrito por cima. O texto e decorativo aqui
   (`aria-hidden`) porque o mesmo tipo esta logo abaixo, no selo. */
.dbm-pres-foto--capa {
  display: flex;
  align-items: center;
  padding: 14px 18px;
  background-image: linear-gradient(135deg, var(--cc, #0d3b66) 0 58%, rgba(255, 255, 255, .13) 58%);
}

/* Grande e translucido, para ler como arte da capa e nao como um segundo selo:
   o selo do tipo vem logo abaixo, em pilula, e dois rotulos iguais do mesmo
   tamanho a tres centimetros um do outro leem como repeticao por engano. */
.dbm-pres-capa__txt {
  font-size: clamp(1.3rem, 3.4vw, 1.9rem);
  font-weight: 800;
  letter-spacing: .08em;
  line-height: 1.1;
  text-transform: uppercase;
  color: rgba(255, 255, 255, .62);
}