/* ====================================================================================
   Extras globais CMC — pop-up de campanha + dica das abas de horarios
   ==================================================================================== */

/* --- Pop-up de campanha (janela na entrada do site) --- */
.cmc-popup { position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 999990; background: rgba(20, 26, 40, .78); display: flex; align-items: center; justify-content: center; padding: 20px; opacity: 0; transition: opacity .25s ease; }
.cmc-popup.aberto { opacity: 1; }
.cmc-popup-caixa { position: relative; background: #fff; border-radius: 14px; max-width: 480px; width: 100%; max-height: 86vh; overflow-y: auto; box-shadow: 0 24px 60px rgba(0, 0, 0, .35); transform: translateY(14px); transition: transform .25s ease; }
.cmc-popup.aberto .cmc-popup-caixa { transform: translateY(0); }
.cmc-popup-img { width: 100%; display: block; border-radius: 14px 14px 0 0; }
.cmc-popup-corpo { padding: 26px 28px 28px; text-align: center; }
.cmc-popup-corpo h3 { margin: 0 0 10px; font-size: 24px; line-height: 1.3; color: #1e2637; }
.cmc-popup-texto { color: #5a6170; font-size: 15px; line-height: 1.6; }
.cmc-popup-texto p { margin: 0 0 10px; }
.cmc-popup-texto p:last-child { margin-bottom: 0; }
.cmc-popup-btn { display: inline-block; margin-top: 18px; background: #f4b41a; color: #1e2637; font-weight: 700; font-size: 13px; text-transform: uppercase; letter-spacing: .5px; padding: 12px 30px; border-radius: 30px; transition: all .25s ease; }
.cmc-popup-btn:hover, .cmc-popup-btn:focus { background: #1e2637; color: #fff; text-decoration: none; }
.cmc-popup-fechar { position: absolute; top: 12px; right: 12px; width: 36px; height: 36px; border: 0; border-radius: 50%; background: rgba(30, 38, 55, .85); color: #fff; font-size: 15px; cursor: pointer; display: flex; align-items: center; justify-content: center; transition: background .2s ease; z-index: 2; }
.cmc-popup-fechar:hover { background: #f4b41a; color: #1e2637; }
/* Modo "so imagem": a arte da campanha e o proprio pop-up */
.cmc-popup-so-imagem .cmc-popup-caixa { background: none; box-shadow: none; overflow: visible; width: auto; max-width: none; display: flex; align-items: center; justify-content: center; }
.cmc-popup-so-imagem .cmc-popup-img { max-width: min(560px, 92vw); max-height: 84vh; width: auto; height: auto; border-radius: 14px; box-shadow: 0 24px 60px rgba(0, 0, 0, .45); }
.cmc-popup-so-imagem a { display: block; line-height: 0; }
@media (max-width: 767px) {
    .cmc-popup { padding: 14px; }
    .cmc-popup-corpo { padding: 20px 18px 24px; }
    .cmc-popup-corpo h3 { font-size: 20px; }
}

/* --- Quadros de horario (faixa verde): indicar que abrem os horarios completos --- */
.cmc-hor-quadro { transition: transform .2s ease, box-shadow .2s ease; }
.cmc-hor-quadro:hover { transform: translateY(-2px); box-shadow: 0 8px 18px rgba(0, 0, 0, .18); }
.cmc-hor-mais { display: block; margin-top: 7px; padding-top: 6px; border-top: 1px dashed rgba(255, 255, 255, .45); font-size: 10.5px; font-weight: 700; letter-spacing: .8px; text-transform: uppercase; opacity: .95; }
/* o tema posiciona <i> dos .ttm-btn em absoluto — aqui o icone fica na propria linha */
.cmc-hor-quadro .cmc-hor-mais .fa { position: static; display: inline; margin: 0 4px 0 0; font-size: 11px; line-height: 1; }
.cmc-hor-quadro:hover .cmc-hor-mais { color: #f4b41a; }

/* --- Abas de atividades: deixar claro que as modalidades sao clicaveis --- */
.cmc-abas-dica { text-align: center; color: #6e6e6e; font-size: 15px; margin: -46px 0 34px; }
.cmc-abas-dica .fa { color: #2f9544; margin-right: 6px; }
.ttm-tab-style-vertical ul.tabs .tab a { cursor: pointer; position: relative; }
.ttm-tab-style-vertical ul.tabs .tab a:after { content: "\f105"; font-family: FontAwesome; position: absolute; right: 18px; top: 50%; transform: translateY(-50%); opacity: .55; }
.ttm-tab-style-vertical ul.tabs .tab.active a:after { content: "\f107"; opacity: 1; }
@media (max-width: 767px) { .cmc-abas-dica { margin-top: -30px; } }

/* --- Home: "Últimas notícias sobre o nosso Círculo" (as 3 matérias mais recentes) ---
   Cartão na mesma linguagem dos cartões de matéria de /revistas/ (.cmc-mat-card):
   canto arredondado, sombra leve, foto 16:10 recortada que dá um zoom no hover e o
   cartão inteiro sobe. Só imagem, data e título — e o "Saiba mais" é um link com
   seta, não mais um bloco verde. O CSS é próprio (e não o do revista.css) porque
   aquele ficheiro tem 34 KB e não é carregado na home só por causa desta secção.
   A coluna .content-area do tema já é flex: é ela que alinha os três lado a lado. */
.cmc-home-noticia { display: flex; margin-bottom: 30px; }
.cmc-home-card { display: flex; flex-direction: column; width: 100%; background: #fff; border-radius: 10px; overflow: hidden; box-shadow: 0 4px 18px rgba(30, 38, 55, .10); transition: transform .25s ease, box-shadow .25s ease; }
.cmc-home-card:hover { transform: translateY(-4px); box-shadow: 0 12px 28px rgba(30, 38, 55, .16); }
.cmc-home-card-foto { position: relative; display: block; padding-top: 62.5%; background: #e9ebf0; overflow: hidden; }
.cmc-home-card-foto img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }
.cmc-home-card:hover .cmc-home-card-foto img { transform: scale(1.04); }
.cmc-home-card-vazia { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; font-size: 44px; color: #c3c8d4; }
/* flex + margin-top:auto no link = os tres cartoes acabam alinhados mesmo com
   titulos de uma ou duas linhas */
.cmc-home-card-info { flex: 1; display: flex; flex-direction: column; gap: 10px; padding: 18px 20px 20px; text-align: left; }
.cmc-home-card-data { font-size: 12px; font-weight: 600; letter-spacing: .7px; text-transform: uppercase; color: #8a90a0; }
.cmc-home-card-titulo { margin: 0; font-size: 18px; font-weight: 700; line-height: 1.35; color: #1e2637; }
.cmc-home-card-titulo a { color: inherit; }
.cmc-home-card-titulo a:hover { color: #2f9544; text-decoration: none; }
.cmc-home-card-ler { align-self: flex-start; margin-top: auto; padding-top: 10px; color: #2f9544; font-size: 13px; font-weight: 600; letter-spacing: .5px; text-transform: uppercase; }
.cmc-home-card-ler .fa { margin-left: 5px; transition: transform .2s ease; }
.cmc-home-card-ler:hover { color: #1e2637; text-decoration: none; }
.cmc-home-card-ler:hover .fa { transform: translateX(3px); }

/* --- Vídeo no banner da home (Slider Revolution) ---
   Fica na mesma moldura da imagem: cobre o slide inteiro com o mesmo recorte
   (object-fit:cover) e entra ENTRE o fundo do slider (rs-sbg-wrap, z-index 0) e
   o véu escuro (.banner-opacity, também z-index 0 mas depois no DOM) — por isso
   o z-index aqui é 0 e não 1: com 1 o vídeo passaria à frente do véu e dos textos.
   No telemóvel toca na mesma, com o ficheiro leve (ver sliders.php). */
.cmc-slide-video { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 0; overflow: hidden; pointer-events: none; }
.cmc-slide-video video { display: block; width: 100%; height: 100%; object-fit: cover; }

/* --- Menu do topo: espaco para rotulos mais longos ---
   O menu e uma caixa que flutua a direita, entre o logotipo e os dois botoes
   verdes (que tem largura fixa). Com o padding original (0 15px) sobravam
   apenas 11px ate ao logotipo: bastava um rotulo um pouco maior — "Revistas/
   Notícia" — para a barra nao caber e o menu cair para uma segunda linha.
   Com 0 10px o menu fica MAIS estreito do que era antes mesmo com o rotulo
   novo (682px vs 695px) e a folga sobe para 24px. Vale so no menu horizontal
   (>=1200px); abaixo disso entra o menu de hamburguer, que nao usa este padding. */
@media only screen and (min-width: 1200px) {
    #site-header-menu #site-navigation .menu ul > li > a { padding: 0 10px; }
}
