/* Site do Condomínio Rio Doce · base visual (o acabamento de UX vem na próxima etapa) */
:root { --rio: #00758A; --rio-escuro: #0A4F5C; --rio-claro: #E0EFF2; --tinta: #3F3A3A; --suave: #6E6868; --nevoa: #F2F3F3; --linha: #E4E6E6; --raio: 14px; }
* { box-sizing: border-box; }
body { margin: 0; font-family: 'Public Sans', system-ui, sans-serif; color: var(--tinta); background: var(--nevoa); line-height: 1.55; }
h1, h2, h3, .marca b, .slide-texto b, .card b { font-family: 'Bricolage Grotesque', 'Public Sans', sans-serif; }
a { color: var(--rio); }
.btn { display: inline-block; background: var(--rio); color: #fff; border: 0; border-radius: 10px; padding: 10px 18px; font-weight: 700; text-decoration: none; cursor: pointer; font: inherit; font-weight: 700; }
.secundario { color: var(--suave); }

/* Cabeçalho */
.cab { background: #fff; border-bottom: 4px solid var(--rio); position: sticky; top: 0; z-index: 20; }
.cab-in { max-width: 1180px; margin: 0 auto; padding: 10px 20px; display: flex; align-items: center; gap: 20px; }
.marca { display: flex; align-items: center; gap: 10px; text-decoration: none; color: var(--tinta); }
.marca img { height: 46px; }
.marca span { display: flex; flex-direction: column; font-size: 13px; line-height: 1.1; text-transform: uppercase; letter-spacing: .04em; font-weight: 700; }
.marca b { font-size: 21px; letter-spacing: .02em; }
.menu { margin-left: auto; display: flex; gap: 4px; flex-wrap: wrap; align-items: center; }
.menu a { text-decoration: none; color: var(--tinta); font-weight: 600; font-size: 15px; padding: 8px 10px; border-radius: 8px; }
.menu a:hover { background: var(--rio-claro); color: var(--rio-escuro); }
.menu a.entrar { background: var(--rio); color: #fff; margin-left: 6px; }
.menu-btn { display: none; margin-left: auto; border: 0; background: none; font-size: 26px; cursor: pointer; }
@media (max-width: 860px) {
  .menu-btn { display: block; }
  .menu { display: none; position: absolute; left: 0; right: 0; top: 100%; background: #fff; flex-direction: column; align-items: stretch; padding: 10px 20px 16px; box-shadow: 0 10px 20px rgba(0,0,0,.08); }
  .menu-aberto .menu { display: flex; }
  .menu a.entrar { margin: 6px 0 0; text-align: center; }
}

.pagina { max-width: 1180px; margin: 0 auto; padding: 24px 20px 40px; }

/* Selos sobre as fotos */
.selos { display: flex; flex-wrap: wrap; gap: 5px; }
.selos span { color: #fff; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; padding: 3px 8px; border-radius: 5px; }
.selos .restrito { background: rgba(0,0,0,.6); }

/* Carrossel: foto 16:9 (652 × 367 na tela), do tamanho da arte, e o título embaixo, como nos cards */
.carrossel { position: relative; width: 100%; max-width: 652px; margin: 0 auto; border-radius: var(--raio); overflow: hidden; background: #fff; display: grid; }
.slide { grid-area: 1 / 1; opacity: 0; visibility: hidden; transition: opacity .7s, visibility .7s; text-decoration: none; color: var(--tinta); display: flex; flex-direction: column; }
.slide.ativo { opacity: 1; visibility: visible; z-index: 1; }
.slide-foto { display: block; width: 100%; aspect-ratio: 16 / 9; background: #2A2626 center / cover no-repeat; }
.slide-texto { display: flex; flex-direction: column; gap: 6px; padding: 14px 110px 16px 20px; }
.slide-texto b { font-size: clamp(18px, 2.4vw, 24px); line-height: 1.2; }
.slide-texto small { color: var(--suave); }
.setas { position: absolute; left: 0; right: 0; top: 0; aspect-ratio: 16 / 9; z-index: 2; pointer-events: none; }
.seta { position: absolute; top: 50%; transform: translateY(-50%); pointer-events: auto; width: 42px; height: 42px; border-radius: 50%; border: 0; background: rgba(255,255,255,.88); font-size: 28px; line-height: 1; cursor: pointer; box-shadow: 0 2px 8px rgba(0,0,0,.25); }
.seta.ant { left: 12px; } .seta.prox { right: 12px; }
.pontos { position: absolute; right: 20px; bottom: 22px; z-index: 2; display: flex; gap: 6px; }
.pontos button { width: 10px; height: 10px; border-radius: 50%; border: 0; background: #CFD3D3; cursor: pointer; padding: 0; }
.pontos button.ativo { background: var(--rio); }
.carrossel .vazio { color: var(--suave); display: flex; align-items: center; justify-content: center; aspect-ratio: 16 / 9; }

/* Seções e cards */
.secao { margin-top: 34px; }
.secao-cab { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; margin-bottom: 14px; border-bottom: 2px solid var(--linha); padding-bottom: 8px; }
.secao-cab h1, .secao-cab h2 { margin: 0; font-size: 26px; }
.secao-cab a { font-weight: 700; text-decoration: none; }
.cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 18px; }
.card { background: #fff; border-radius: var(--raio); overflow: hidden; text-decoration: none; color: inherit; display: flex; flex-direction: column; transition: transform .15s, box-shadow .15s; }
.card:hover { transform: translateY(-2px); box-shadow: 0 10px 24px rgba(0,0,0,.08); }
.card-foto { aspect-ratio: 16 / 9; background: #D9DCDC center / cover; position: relative; }
.card-foto .selos { position: absolute; left: 10px; bottom: 10px; right: 10px; }
.card-corpo { padding: 14px 16px 16px; display: flex; flex-direction: column; gap: 6px; flex: 1; }
.card-corpo b { font-size: 18px; line-height: 1.25; }
.card-corpo .resumo { color: var(--suave); font-size: 14px; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.card-corpo small { color: var(--suave); margin-top: auto; }

/* Card de conteúdo restrito (sem foto nem resumo) */
.card-restrito .card-foto { background: linear-gradient(135deg, #E4E6E6, #CFD3D3); display: flex; align-items: center; justify-content: center; }
.card-restrito .cadeado { font-size: 42px; opacity: .55; }
.card-restrito .card-corpo .resumo { font-style: italic; }

/* Filtros */
.filtros { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 18px; }
.filtros input, .filtros select { font: inherit; font-size: 14px; padding: 9px 10px; border: 1.5px solid var(--linha); border-radius: 10px; background: #fff; }
.filtros input[type=search] { flex: 1 1 200px; }
.etq-filtro { background: var(--rio-claro); color: var(--rio-escuro); border-radius: 20px; padding: 8px 12px; font-weight: 700; font-size: 14px; }
.etq-filtro a { text-decoration: none; margin-left: 4px; }
.paginas { display: flex; justify-content: center; gap: 18px; margin-top: 24px; align-items: center; }
.vazio { color: var(--suave); }
.aviso-pag { background: #fff; border-radius: var(--raio); padding: 30px; max-width: 640px; margin: 30px auto; text-align: center; }

/* Publicação */
.pub { background: #fff; border-radius: var(--raio); overflow: hidden; }
.aviso-gestor { background: #FFF1C2; color: #6A5000; padding: 10px 20px; font-weight: 600; }
/* Capa em 16:9, inteira (mesma proporção das artes), e o título logo abaixo */
.pub-cab { max-width: 960px; margin: 0 auto; padding: 24px 20px 0; }
.pub-capa { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 12px; background: #2A2626; }
.pub-cab-texto { max-width: 780px; margin: 0 auto; padding: 22px 0 0; display: flex; flex-direction: column; gap: 8px; }
.pub-cab-texto h1 { margin: 0; font-size: clamp(26px, 4vw, 40px); line-height: 1.15; }
.pub-cab-texto small { color: var(--suave); }
.pub-corpo { max-width: 780px; margin: 0 auto; padding: 28px 20px 36px; font-size: 17px; }
.pub-resumo { font-size: 20px; color: var(--suave); }
.pub-texto img { max-width: 100%; height: auto; border-radius: 10px; }
.pub-texto blockquote { margin: 16px 0; padding: 8px 18px; border-left: 4px solid var(--rio); background: var(--nevoa); border-radius: 0 8px 8px 0; }
.pub-texto hr { border: 0; border-top: 2px solid var(--linha); margin: 24px 0; }
.pub-texto h4 { font-size: 18px; margin: 18px 0 6px; }
.pub-texto table { border-collapse: collapse; width: 100%; }
.pub-texto td, .pub-texto th { border: 1px solid var(--linha); padding: 6px 8px; }
.pub-corpo h2 { font-size: 24px; margin-top: 30px; }

/* Antes e depois (arrastar) */
.antes-depois { margin: 0 0 22px; }
.ad { position: relative; aspect-ratio: 16 / 9; border-radius: 12px; overflow: hidden; user-select: none; }
.ad img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
.ad-antes { position: absolute; inset: 0; clip-path: inset(0 calc(100% - var(--pos)) 0 0); }
.ad input { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: ew-resize; margin: 0; }
.ad-linha { position: absolute; top: 0; bottom: 0; left: var(--pos); width: 3px; margin-left: -1.5px; background: #fff; box-shadow: 0 0 6px rgba(0,0,0,.5); pointer-events: none; }
.ad-linha::after { content: '⟷'; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 40px; height: 40px; border-radius: 50%; background: #fff; color: var(--tinta); display: flex; align-items: center; justify-content: center; font-weight: 700; box-shadow: 0 2px 8px rgba(0,0,0,.3); }
.ad-rot { position: absolute; top: 12px; color: #fff; font-weight: 800; font-size: 13px; letter-spacing: .08em; background: rgba(0,0,0,.55); padding: 3px 9px; border-radius: 5px; pointer-events: none; }
.ad-rot-a { left: 12px; } .ad-rot-d { right: 12px; }
.antes-depois figcaption { color: var(--suave); font-size: 14px; margin-top: 6px; }

/* Galeria e ampliação */
.galeria { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 8px; }
.galeria a { display: block; border-radius: 8px; overflow: hidden; }
.galeria img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; display: block; transition: transform .2s; }
.galeria a:hover img { transform: scale(1.04); }
.lightbox { position: fixed; inset: 0; background: rgba(0,0,0,.92); z-index: 50; display: flex; align-items: center; justify-content: center; flex-direction: column; }
.lightbox[hidden] { display: none; }
.lightbox img { max-width: 94vw; max-height: 84vh; border-radius: 6px; }
.lightbox p { color: #ddd; margin: 10px 0 0; }
.lightbox button { position: absolute; border: 0; background: rgba(255,255,255,.15); color: #fff; font-size: 34px; width: 52px; height: 52px; border-radius: 50%; cursor: pointer; }
.lb-fechar { top: 14px; right: 14px; } .lb-ant { left: 14px; top: 50%; } .lb-prox { right: 14px; top: 50%; }
.etiquetas { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 26px; }
.etiquetas a { background: var(--nevoa); border-radius: 20px; padding: 4px 12px; font-size: 14px; text-decoration: none; font-weight: 600; }

/* Rodapé */
.rod { background: #2A2626; color: #ddd; margin-top: 40px; }
.rod-in { max-width: 1180px; margin: 0 auto; padding: 26px 20px; display: flex; justify-content: space-between; gap: 20px; flex-wrap: wrap; font-size: 14px; }
.rod a { color: #fff; }

/* Início: carrossel à esquerda e caixa de entrada à direita */
.topo-home { display: grid; grid-template-columns: minmax(0, 652px) minmax(280px, 1fr); gap: 24px; align-items: stretch; }
.topo-home .carrossel { margin: 0; }
@media (max-width: 960px) { .topo-home { grid-template-columns: 1fr; } .topo-home .carrossel { margin: 0 auto; } }
.caixa-lateral { background: #fff; border-radius: var(--raio); padding: 22px 22px 18px; }
.caixa-lateral h2 { margin: 0 0 4px; font-size: 26px; }
.caixa-lateral .sub { color: var(--suave); font-size: 14px; margin: 4px 0 14px; }
.caixa-lateral hr { border: 0; border-top: 1.5px solid var(--linha); margin: 16px 0; }
.caixa-lateral .links { margin: 12px 0 0; font-size: 14px; }
.saudacao { border-top: 5px solid var(--rio); padding: 14px 20px; }
.saudacao h2 { font-size: 22px; }
.saudacao p { margin: 4px 0 0; color: var(--suave); font-size: 14px; }
.saudacao .papeis { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 6px; }
.saudacao .papeis span { background: var(--rio-claro); color: var(--rio-escuro); font-weight: 700; font-size: 11px; letter-spacing: .03em; padding: 3px 8px; border-radius: 5px; }
.campo { display: block; font-weight: 700; font-size: 14px; margin-bottom: 12px; }
.campo input { display: block; width: 100%; margin-top: 6px; font: inherit; font-weight: 400; font-size: 16px; padding: 11px 12px; border: 1.5px solid var(--linha); border-radius: 10px; background: #fff; }
.campo input:focus { outline: none; border-color: var(--rio); }
.check { display: flex; gap: 8px; align-items: center; font-size: 14px; margin: 4px 0 12px; }
.btn.largo { display: block; width: 100%; text-align: center; margin-top: 8px; padding: 12px; }
.btn.claro { background: #fff; color: var(--tinta); border: 1.5px solid var(--linha); }
.btn:disabled { opacity: .6; cursor: default; }
.aviso { border-radius: 10px; padding: 10px 13px; font-size: 14px; margin: 10px 0; }
.aviso.erro { background: #F8E1DA; color: #8B2A04; }
.aviso.ok, .aviso.info { background: var(--rio-claro); color: var(--rio-escuro); }
#toast { position: fixed; left: 50%; bottom: 24px; transform: translateX(-50%) translateY(20px); background: var(--tinta); color: #fff; padding: 12px 18px; border-radius: 10px; opacity: 0; transition: .25s; z-index: 60; pointer-events: none; }
#toast.visivel { opacity: 1; transform: translateX(-50%) translateY(0); }
#toast.erro { background: #8B2A04; }

/* Faixa do topo: "Vale relembrar" + tempo */
.faixa-home { display: grid; grid-template-columns: minmax(0, 652px) minmax(280px, 1fr); gap: 24px; margin: 0 0 20px; }
@media (max-width: 960px) { .faixa-home { grid-template-columns: 1fr; gap: 12px; } }
.faixa { background: #fff; border-radius: var(--raio); padding: 12px 18px; display: flex; align-items: center; gap: 14px; min-height: 70px; }
.relembrar { position: relative; overflow: hidden; display: block; padding: 0; }
.lembra { position: absolute; inset: 0; padding: 12px 18px; display: flex; flex-direction: column; justify-content: center; gap: 3px; text-decoration: none; color: var(--tinta);
  opacity: 0; transform: translateY(8px); transition: opacity .5s, transform .5s; pointer-events: none; }
.lembra.ativo { opacity: 1; transform: none; pointer-events: auto; }
.lembra small { color: var(--rio); font-size: 12px; text-transform: uppercase; letter-spacing: .04em; }
.lembra-titulo { display: flex; align-items: center; gap: 8px; min-width: 0; }
.lembra-titulo b { font-size: 16px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lembra-titulo i { flex: none; font-style: normal; color: #fff; font-weight: 700; font-size: 12px; padding: 2px 8px; border-radius: 5px; }
.lembra:hover b { color: var(--rio); }
.tempo { justify-content: space-between; flex-wrap: wrap; gap: 8px 16px; }
.tempo-hoje { display: flex; align-items: center; gap: 10px; }
.tempo-hoje .ic { font-size: 32px; line-height: 1; }
.tempo-hoje .graus { font-size: 24px; font-family: 'Bricolage Grotesque', sans-serif; }
.tempo-hoje small { color: var(--suave); }
.tempo-dias { display: flex; gap: 12px; font-size: 13px; color: var(--suave); }
.tempo-dias b { color: var(--tinta); }

/* Seções do início: cards menores sob o carrossel e nuvem de palavras à direita */
.home-secoes { display: grid; grid-template-columns: minmax(0, 652px) minmax(280px, 1fr); gap: 0 24px; align-items: start; }
@media (max-width: 960px) { .home-secoes { grid-template-columns: 1fr; } }
.cards-mini { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
@media (max-width: 560px) { .cards-mini { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.cards-mini .card-corpo { padding: 9px 11px 11px; gap: 3px; }
.cards-mini .card-corpo b { font-size: 14px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.cards-mini .card-corpo .resumo { display: none; }
.cards-mini .card-corpo small { font-size: 12px; }
.cards-mini .selos span { font-size: 9px; padding: 2px 5px; }
.cards-mini .card-foto .selos { left: 6px; bottom: 6px; right: 6px; }
.home-secoes .secao-cab h2 { font-size: 22px; }
.nuvem-caixa .secao-cab { border-bottom-color: transparent; }
.nuvem { background: #fff; border-radius: var(--raio); padding: 18px; line-height: 1.5; text-align: center; }
.nuvem a { display: inline-block; margin: 2px 6px; text-decoration: none; }
.nuvem a:hover { text-decoration: underline; }

.nuvem a.nuvem-ano { color: #fff; font-weight: 700; padding: 1px 9px; border-radius: 6px; text-decoration: none; }

/* Assuntos relacionados no fim da publicação */
.pub ~ .secao { max-width: 960px; margin-left: auto; margin-right: auto; }

/* Anúncios (Classificados) na coluna da direita: só para quem entrou */
/* A coluna da direita tem a mesma altura do carrossel: boas-vindas em cima, anúncios ocupando o resto */
.lateral { display: flex; flex-direction: column; gap: 16px; min-height: 0; }
.lateral .anuncios { flex: 1; display: flex; flex-direction: column; min-height: 0; padding: 14px 18px; }
.anuncios .anuncios-cab { margin-bottom: 8px; }
.anuncios .anuncios-rolo { flex: 1; min-height: 0; }
.anuncios .anuncio { display: flex; flex-direction: column; min-height: 0; }
.anuncios .anuncio-arte { flex: 1; min-height: 120px; max-height: 210px; display: flex; align-items: center; justify-content: center; margin-bottom: 6px; }
.anuncios .anuncio-arte img { width: 100%; height: 100%; object-fit: contain; }
.anuncios .anuncio .whats { margin-top: 2px; }
.anuncios .anuncios-nav { margin-top: 6px; }
.anuncios .anuncios-links { margin-top: 4px; }
@media (max-width: 960px) { .anuncios .anuncio-arte { max-height: none; } }
.anuncios-cab { display: flex; align-items: baseline; gap: 8px; margin-bottom: 10px; }
.anuncios-cab h2 { margin: 0; font-size: 22px; }
.anuncios-cab small { color: var(--suave); }
.anuncios-rolo { display: grid; }
.anuncio { grid-area: 1 / 1; opacity: 0; visibility: hidden; transition: opacity .5s, visibility .5s; }
.anuncio.ativo { opacity: 1; visibility: visible; }
.anuncio-arte { display: block; width: 100%; border: 0; padding: 0; background: var(--nevoa); border-radius: 10px; overflow: hidden; cursor: zoom-in; margin-bottom: 8px; }
.anuncio-arte img { display: block; width: 100%; height: auto; }
.anuncio .whats, .anuncio-card .whats { display: inline-block; margin-top: 6px; font-weight: 700; color: #1E8E3E; text-decoration: none; font-size: 14px; }
.anuncios-nav { display: flex; align-items: center; justify-content: center; gap: 10px; margin-top: 10px; }
.anuncios-nav button { border: 1.5px solid var(--linha); background: #fff; border-radius: 8px; width: 30px; height: 30px; cursor: pointer; font-size: 18px; line-height: 1; }
.pontos-a { display: flex; gap: 5px; }
.pontos-a i { width: 8px; height: 8px; border-radius: 50%; background: #CFD3D3; }
.pontos-a i.ativo { background: var(--rio); }
.anuncios-links { margin: 10px 0 0; font-size: 14px; text-align: center; }
.anuncios-grade { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 16px; }
.anuncio-card .anuncio-arte { border-radius: 0; margin: 0; }
.anuncio-card small { color: var(--suave); font-size: 12px; text-transform: uppercase; }
.anuncio-dlg { border: 0; border-radius: var(--raio); padding: 0; width: min(720px, calc(100vw - 24px)); }
.anuncio-dlg::backdrop { background: rgba(0,0,0,.6); }
.anuncio-dlg img { display: block; width: 100%; height: auto; }
.anuncio-dlg-corpo { padding: 16px 20px 20px; }
.anuncio-dlg-corpo h3 { margin: 4px 0 8px; font-size: 22px; }
.anuncio-dlg-corpo .descricao { white-space: pre-line; }
.anuncio-dlg-corpo small { color: var(--suave); text-transform: uppercase; font-size: 12px; }
.anuncio-dlg .fechar { position: absolute; top: 10px; right: 10px; width: 38px; height: 38px; border-radius: 50%; border: 0; background: rgba(255,255,255,.9); font-size: 24px; cursor: pointer; }
.anuncio-dlg .whats { background: #1E8E3E; }

/* Galerias: tipos de exibição */
.galeria-modulo { margin: 8px 0 24px; }
.galeria-gestor { background: #FFF1C2; color: #6A5000; border-radius: 8px; padding: 6px 10px; font-size: 13px; margin-bottom: 8px; display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.galeria-gestor select { font: inherit; padding: 3px 6px; border-radius: 6px; border: 1px solid #E0C46A; }
.galeria .gal-item a, .galeria .gal-item video { display: block; border-radius: 8px; overflow: hidden; }
.galeria .gal-item img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .2s; }
.galeria .gal-item a:hover img { transform: scale(1.03); }
.galeria .gal-item video { width: 100%; background: #000; }
.gal-leg { display: block; font-size: 13px; color: var(--suave); margin-top: 4px; }
.gal-video { display: flex !important; align-items: center; justify-content: center; aspect-ratio: 16 / 9; background: #111 center / cover; text-decoration: none; }
.gal-video span { width: 58px; height: 58px; border-radius: 50%; background: rgba(0,0,0,.65); color: #fff; font-size: 24px; display: flex; align-items: center; justify-content: center; }
/* Grade: miniaturas iguais 16:9 */
.gal-grade { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 8px; }
.gal-grade .gal-item img { aspect-ratio: 16 / 9; }
/* Mosaico vertical: colunas, proporção original */
.gal-mosaico { column-count: 3; column-gap: 8px; }
@media (max-width: 640px) { .gal-mosaico { column-count: 2; } }
.gal-mosaico .gal-item { break-inside: avoid; margin-bottom: 8px; }
.gal-mosaico .gal-item img { height: auto; }
/* Linhas justificadas: mesma altura por linha, sem corte */
.gal-justificada { display: flex; flex-wrap: wrap; gap: 6px; }
.gal-justificada::after { content: ''; flex-grow: 999; }
.gal-justificada .gal-item img { height: 180px; }
.gal-justificada .gal-item a { height: 180px; }
/* Destaque + grade: a primeira grande */
.gal-destaque { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.gal-destaque .gal-item img { aspect-ratio: 1 / 1; }
.gal-destaque .gal-item:first-child { grid-column: span 2; grid-row: span 2; }
@media (max-width: 640px) { .gal-destaque { grid-template-columns: repeat(2, 1fr); } }
/* Carrossel com miniaturas */
.gal-carrossel .gal-palco { position: relative; display: grid; background: #111; border-radius: 10px; overflow: hidden; }
.gal-slide { grid-area: 1 / 1; opacity: 0; visibility: hidden; transition: opacity .4s; display: flex; align-items: center; justify-content: center; aspect-ratio: 16 / 9; }
.gal-slide.ativo { opacity: 1; visibility: visible; }
.gal-slide a, .gal-slide img, .gal-slide video { width: 100%; height: 100%; object-fit: contain; display: block; }
.gal-palco > button { position: absolute; top: 50%; transform: translateY(-50%); z-index: 2; width: 40px; height: 40px; border-radius: 50%; border: 0; background: rgba(255,255,255,.88); font-size: 26px; cursor: pointer; }
.gal-ant { left: 10px; } .gal-prox { right: 10px; }
.gal-miniaturas { display: flex; gap: 6px; overflow-x: auto; padding: 8px 0; }
.gal-miniaturas button { flex: none; width: 88px; aspect-ratio: 16 / 9; border: 2px solid transparent; border-radius: 6px; background: #ddd center / cover; cursor: pointer; color: #fff; font-size: 18px; }
.gal-miniaturas button.ativo { border-color: var(--rio); }
.lb-video { width: min(94vw, 1100px); aspect-ratio: 16 / 9; }
.lb-video iframe { width: 100%; height: 100%; border: 0; border-radius: 6px; }
/* Sobrepõe a grade antiga (.galeria) nos outros tipos */
.galeria.gal-mosaico { display: block; }
.galeria.gal-justificada { display: flex; }
.galeria.gal-destaque { display: grid; grid-template-columns: repeat(4, 1fr); }
.galeria.gal-mosaico img, .galeria.gal-justificada img { aspect-ratio: auto; }
.galeria.gal-destaque img { aspect-ratio: 1 / 1; }

.galeria-restrita { background: var(--nevoa); border-radius: 10px; padding: 18px; text-align: center; color: var(--suave); font-weight: 600; margin: 10px 0; }

/* Séries */
.serie-bloco { max-width: 780px; margin: 0 auto 10px; background: #FFF8EC; border: 1.5px solid #F2D9B0; border-radius: var(--raio); padding: 18px 20px; }
.serie-cab { font-size: 16px; margin-bottom: 6px; }
.serie-cab a { color: #8B4A00; }
.serie-apres { color: var(--suave); margin: 4px 0 10px; }
.serie-lista { margin: 0 0 12px; padding-left: 26px; }
.serie-lista li { margin: 5px 0; }
.serie-lista li a { text-decoration: none; color: var(--tinta); }
.serie-lista li a:hover { color: var(--rio); text-decoration: underline; }
.serie-lista li.atual span { color: #B8650F; font-size: 13px; }
.serie-lista i, .lt-texto i { font-style: normal; color: #fff; font-weight: 700; font-size: 11px; padding: 1px 6px; border-radius: 4px; margin-left: 4px; }
.serie-nav { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.serie-nav .btn { font-size: 14px; padding: 8px 12px; }
.serie-tag { display: block; font-size: 12px; font-weight: 700; color: #8B4A00; }
.linha-tempo { list-style: none; padding: 0; margin: 20px 0; position: relative; }
.linha-tempo::before { content: ''; position: absolute; left: 17px; top: 0; bottom: 0; width: 3px; background: #E4E6E6; }
.linha-tempo li { position: relative; padding-left: 52px; margin-bottom: 16px; }
.lt-marca { position: absolute; left: 0; top: 14px; width: 36px; height: 36px; border-radius: 50%; color: #fff; font-weight: 700; display: flex; align-items: center; justify-content: center; border: 3px solid #fff; }
.lt-item { display: flex; gap: 14px; background: #fff; border-radius: var(--raio); padding: 10px; text-decoration: none; color: var(--tinta); }
.lt-item:hover { box-shadow: 0 8px 20px rgba(0,0,0,.07); }
.lt-foto { flex: none; width: 160px; aspect-ratio: 16 / 9; border-radius: 8px; background: #E4E6E6 center / cover; }
.lt-texto { display: flex; flex-direction: column; gap: 4px; }
.lt-texto small { color: var(--suave); }
.lt-texto b { font-size: 17px; }
.lt-texto span { color: var(--suave); font-size: 14px; }
@media (max-width: 560px) { .lt-foto { width: 96px; } }

/* Botão "Editar" (só para administração e para o editor autor) */
.card-envolve { position: relative; display: flex; }
.card-envolve > .card { flex: 1; }
.card-editar { position: absolute; top: 8px; right: 8px; z-index: 3; background: rgba(255,255,255,.95); color: var(--tinta); font-size: 12px; font-weight: 700; text-decoration: none; padding: 4px 9px; border-radius: 6px; box-shadow: 0 1px 4px rgba(0,0,0,.2); }
.card-editar:hover { background: var(--rio); color: #fff; }
.pub-editar { display: block; text-align: right; padding: 10px 20px 0; font-weight: 700; font-size: 14px; text-decoration: none; }
.slide-editar { float: right; font-size: 13px; font-weight: 700; text-decoration: none; }

/* Início: faixa "Vale relembrar" + tempo no topo, acima do logotipo e do menu */
.topo-faixa { max-width: 1180px; margin: 0 auto; padding: 14px 20px 10px; }
.topo-faixa .faixa-home { margin: 0; }

/* Cores por tipo de usuário (iguais em todo o site e no portal) */
.tp-proprietario { background: #E0EFF2 !important; color: #0A4F5C !important; }
.tp-morador { background: #DCEFD9 !important; color: #2C5A2E !important; }
.tp-admin { background: #D6E4F5 !important; color: #173E66 !important; }
.tp-admin-geral { background: #EDE7F6 !important; color: #4A3A78 !important; }
.tp-imobiliaria { background: #FCE6CC !important; color: #8A4600 !important; }
.tp-administradora { background: #EADFD6 !important; color: #5A3A22 !important; }
.tp-conselho { background: #F3D9DF !important; color: #7A1F35 !important; }

.menu-casa { display: inline-flex !important; align-items: center; }
/* Fim da publicação: convite para entrar (visitante) e "quem leu" (administração) */
.convite-entrar { max-width: 960px; margin: 20px auto 0; display: grid; grid-template-columns: 1fr minmax(280px, 380px); gap: 20px; align-items: center; background: var(--rio-claro); border-radius: var(--raio); padding: 20px; }
@media (max-width: 760px) { .convite-entrar { grid-template-columns: 1fr; } }
.convite-texto h2 { margin: 0 0 6px; color: var(--rio-escuro); }
.quem-leu { max-width: 960px; margin: 16px auto 0; background: #FFF1C2; color: #5A4300; border-radius: 10px; padding: 10px 14px; display: flex; gap: 10px; align-items: center; flex-wrap: wrap; font-size: 14px; }
.quem-leu .btn { padding: 5px 10px; font-size: 13px; }

.ranking { background: #fff; border-radius: var(--raio); padding: 14px 16px; margin-top: 14px; }
.ranking h3 { margin: 0 0 8px; font-size: 17px; }
.ranking ol { list-style: none; padding: 0; margin: 0; }
.ranking li { display: flex; gap: 6px; align-items: baseline; padding: 4px 0; border-bottom: 1px solid var(--nevoa); font-size: 14px; }
.ranking .pos { width: 26px; text-align: center; }
.ranking .qtd { margin-left: auto; font-weight: 700; color: var(--rio); }

/* TV do Condomínio no site */
.tv-grade { display: grid; grid-template-columns: minmax(0, 2fr) minmax(280px, 1fr); gap: 24px; align-items: start; }
@media (max-width: 960px) { .tv-grade { grid-template-columns: 1fr; } }
.tv-tela { aspect-ratio: 16 / 9; background: #111; border-radius: var(--raio); overflow: hidden; box-shadow: 0 10px 30px rgba(0,0,0,.15); }
.tv-tela iframe { width: 100%; height: 100%; border: 0; display: block; }
.tv-convite h2 { font-size: 22px; margin: 0 0 8px; }
.tv-convite p, .tv-convite li { color: var(--suave); font-size: 15px; }
.tv-convite ul { padding-left: 18px; margin: 8px 0 14px; }

/* Início mais limpo: imagem do carrossel encostada nas bordas, sem cantos sobrando em cima;
   menos espaço entre a imagem e as etiquetas; coluna da direita terminando junto com o carrossel */
.topo-home .carrossel { border-radius: 0 0 var(--raio) var(--raio); }
.topo-home .slide-foto { border-radius: 0; margin: 0; }
.slide-texto { padding: 8px 110px 10px 16px; gap: 3px; }
.slide-texto b { font-size: clamp(17px, 2.1vw, 22px); line-height: 1.2; }
.slide-texto small { font-size: 13px; }
.pontos { bottom: 14px; }
.lateral .anuncios { padding: 12px 16px 10px; }
.anuncios .anuncio-arte { max-height: none; min-height: 0; }
.anuncios .anuncios-links { margin: 6px 0 0; }