/* ====== Página de notícia/artigo ====== */
.post-hero { background: var(--papel); padding-block: clamp(24px,4vw,48px); }
.post-hero .container { max-width: 820px; }
.post-hero__meta { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; flex-wrap: wrap; }
.post-hero__date { font-size: .88rem; color: var(--text-muted); font-weight: 600; }
.post-hero h1 { font-family: var(--font-serif); font-weight: 600; font-size: clamp(1.8rem,1.4rem + 1.6vw,2.6rem); line-height: 1.15; color: var(--text-strong); text-wrap: balance; }
.post-hero__capa { margin-top: 28px; border-radius: var(--radius-xl); overflow: hidden; box-shadow: var(--shadow-lg); }
.post-hero__capa img { width: 100%; aspect-ratio: 16/9; object-fit: cover; }

.post-body { background: var(--surface-card); padding-block: clamp(24px,4vw,48px); }
.post-body .container { max-width: 820px; }
.post-body__texto { font-size: 1.08rem; line-height: 1.75; color: var(--text-body); white-space: pre-line; }
/* O conteúdo vindo do editor TinyMCE já vem em tags <p>. Herdar o
   white-space: pre-line (usado pelas páginas estáticas com texto solto,
   sem tags <p>) duplicaria o espaçamento entre parágrafos: a quebra de
   linha entre as tags viraria uma linha em branco, somada à margem que
   cada <p> já tem. */
.post-body__texto--html { white-space: normal; }
.post-body__texto p { margin-bottom: 1.2em; }
.post-body__texto h2, .post-body__texto h3, .post-body__texto h4 { font-family: var(--font-serif); font-weight: 600; color: var(--text-strong); line-height: 1.3; margin: 1.4em 0 .6em; }
.post-body__texto h2 { font-size: 1.5rem; }
.post-body__texto h3 { font-size: 1.25rem; }
.post-body__texto h4 { font-size: 1.1rem; }
.post-body__texto ul, .post-body__texto ol { margin: 0 0 1.2em 1.4em; }
.post-body__texto li { margin-bottom: .4em; }
.post-body__texto a { color: var(--azul-600); text-decoration: underline; }
.post-body__texto a:hover { color: var(--azul-700); }
.post-body__texto blockquote { border-left: 3px solid var(--azul-300); padding-left: 1em; margin: 1.4em 0; color: var(--text-muted); font-style: italic; }
.post-body__texto img { max-width: 100%; height: auto; border-radius: var(--radius-md); margin: 1.2em 0; }
.post-body__texto .prog-flyer { white-space: normal; }
.post-body__texto .prog-flyer img { margin: 0; }

.post-video { transition: box-shadow .2s; }
.post-video img { margin: 0; border-radius: 0; }
.post-video .post-video__play { transition: background .2s, transform .2s; }
.post-video:hover .post-video__play { background: rgba(0,0,0,.8); transform: translate(-50%,-50%) scale(1.08); }

.post-galeria { margin-top: 40px; display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 14px; }
.post-galeria img { width: 100%; aspect-ratio: 4/3; object-fit: cover; border-radius: var(--radius-md); transition: opacity .2s, transform .2s; }
.post-galeria img:hover { opacity: .88; transform: scale(1.02); }

.post-comentarios { background: var(--pedra-100); padding-block: clamp(24px,4vw,48px); }
.post-comentarios .container { max-width: 820px; }
.post-comentarios h2 { font-family: var(--font-serif); font-weight: 600; font-size: 1.4rem; color: var(--text-strong); margin-bottom: 24px; }

.comentario-form { background: var(--surface-card); border: 1px solid var(--border-soft); border-radius: var(--radius-lg); padding: 20px; margin-bottom: 28px; box-shadow: var(--shadow-xs); }
.comentario-cta { background: var(--surface-card); border: 1px solid var(--border-soft); border-radius: var(--radius-lg); padding: 24px; margin-bottom: 28px; text-align: center; }
.comentario-cta p { color: var(--text-muted); margin-bottom: 14px; }
.comentario-cta__actions { display: flex; justify-content: center; gap: 12px; flex-wrap: wrap; }

.comentario-item { background: var(--surface-card); border: 1px solid var(--border-soft); border-radius: var(--radius-lg); padding: 18px 20px; margin-bottom: 14px; box-shadow: var(--shadow-xs); }
.comentario-item__head { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; }
.comentario-item__autor { font-weight: 700; color: var(--text-strong); font-size: .94rem; }
.comentario-item__data { font-size: .8rem; color: var(--text-muted); }
.comentario-item__corpo { font-size: .96rem; line-height: 1.55; color: var(--text-body); }
.comentario-vazio { color: var(--text-muted); font-size: .95rem; }
