/* Informativos (listagem do blog) */
:root { --gray-ui: #838383; --card-soft: #f4f4f4; }

/* Topo escuro sobre foto */
.blog-top { position: relative; height: 42.4rem; overflow: hidden; color: var(--white); background: var(--navy); }
.blog-top::before { content: ""; position: absolute; inset: 0; background: rgba(23, 49, 96, .8); z-index: 1; }
/* Arquivo provisório já vem com a cor aplicada: tirar esta classe quando entrar a foto original */
.blog-top--provisorio::before { display: none; }
.blog-top__bg { position: absolute; inset: 0; background: var(--navy) center/cover no-repeat; }
.js .blog-top__bg { transform: scale(1.06); transition: transform 2.6s var(--ease); }
.js.is-loaded .blog-top__bg { transform: scale(1); }
.blog-top__inner { position: relative; z-index: 2; height: 100%; display: flex; align-items: flex-end; padding-bottom: 3rem; }
.blog-top__title { font: 400 5.5rem/5.5rem var(--serif); text-transform: uppercase; max-width: 52rem; }

.blog-intro { font-size: 1.6rem; line-height: 2rem; margin-top: 3.4rem; }

/* Grade de 3 colunas (destaques e explore) */
.blog-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2.1rem; }

/* Card da Home em versão cinza, sem borda */
.news-card--soft { background: var(--card-soft); border: 0; padding: 1.5rem 1.3rem 3rem; }
.news-card--soft .news-card__body { padding: 2rem 3.3rem 0 3.6rem; }

/* Conteúdos em destaque */
.blog-featured { margin-top: 7.2rem; }
.blog-featured__title { font: 400 4.5rem/5.5rem var(--serif); color: var(--navy); text-transform: uppercase; padding: 2.7rem 0 0 6.2rem; max-width: 40.6rem; }

/* Explore por tema */
.blog-explore { margin-top: 11.1rem; }
.blog-explore__head { display: grid; grid-template-columns: 40.6rem 1fr; align-items: center; }
.blog-explore__title { font: 400 3rem/3.5rem var(--serif); color: var(--gray-ui); text-transform: uppercase; }
.blog-explore__result { font-size: 1.4rem; line-height: 2rem; color: var(--gray-ui); margin-top: 3rem; }
.blog-explore__result strong { font-weight: 700; }
.blog-explore__grid { margin-top: 3rem; }

/* Seletor de categoria */
.blog-select { position: relative; z-index: 5; }
.blog-select__button { width: 100%; height: 6rem; display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 0 1.4rem 0 2rem; background: var(--white); border: 1px solid var(--gray-ui); border-radius: 1.2rem; font: 400 1.4rem/2rem var(--sans); color: var(--gray-ui); cursor: pointer; text-align: left; transition: border-color .2s, color .2s; }
.blog-select__button:hover, .blog-select.is-open .blog-select__button { border-color: var(--navy); }
.blog-select.has-value .blog-select__label { color: var(--ink); }
.blog-select__chevron { width: 2rem; height: 2rem; flex: none; color: var(--ink); transition: transform .25s var(--ease); }
.blog-select.is-open .blog-select__chevron { transform: rotate(180deg); }
.blog-select__list { list-style: none; margin: 0; padding: 0.8rem 0; position: absolute; top: calc(100% + 0.6rem); left: 0; right: 0; background: var(--white); border: 1px solid var(--line); border-radius: 1.2rem; box-shadow: 0 1.2rem 3rem rgba(23, 49, 96, .10); opacity: 0; visibility: hidden; transform: translateY(-0.6rem); transition: opacity .2s, transform .2s, visibility .2s; }
.blog-select.is-open .blog-select__list { opacity: 1; visibility: visible; transform: none; }
.blog-select__list a { display: block; padding: 1.2rem 2rem; font-size: 1.4rem; line-height: 2rem; color: var(--ink); transition: background .15s, color .15s; }
.blog-select__list a:hover, .blog-select__list a:focus-visible, .blog-select__list a[aria-selected="true"] { background: #f4f6fa; color: var(--navy); outline: none; }

/* Blocos por tema (um por categoria) */
.topic { margin-top: 8.1rem; scroll-margin-top: 4rem; }
.topic + .topic { margin-top: 8.4rem; }
.topic:last-child { margin-bottom: 10.6rem; }
.topic__grid { display: grid; grid-template-columns: 1fr 67.7rem; gap: 2rem; }
.topic__aside { display: flex; flex-direction: column; justify-content: space-between; }
.topic__title { font: 400 3rem/3.5rem var(--serif); color: var(--ink); max-width: 30rem; }
.topic__desc { font-size: 1.4rem; line-height: 2rem; color: var(--gray-ui); max-width: 26.6rem; }
.topic__foot .btn { margin-top: 6.6rem; }
.btn--ghost { border-color: var(--gray-ui); color: var(--gray-ui); background: transparent; cursor: pointer; }
.btn--ghost:hover { border-color: var(--navy); background: var(--navy); color: var(--white); }
.topic__list { display: flex; flex-direction: column; gap: 1rem; }

/* Card horizontal */
.post-row { display: grid; grid-template-columns: 29rem 1fr; column-gap: 2.3rem; height: 18.6rem; }
.post-row__img { border-radius: 1.5rem; overflow: hidden; }
.post-row__img img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s var(--ease); }
.post-row:hover .post-row__img img { transform: scale(1.04); }
.post-row__body { display: flex; flex-direction: column; padding-top: 0.6rem; }
.post-row__title { font: 500 2rem/2rem var(--sans); color: var(--ink); min-height: 6.5rem; transition: color .2s; }
.post-row:hover .post-row__title { color: var(--navy); }
.post-row__excerpt { font-size: 1.4rem; line-height: 2rem; margin-top: 0.6rem; max-width: 34.6rem; }
.post-row__foot { display: flex; justify-content: space-between; align-items: center; margin-top: auto; margin-left: -0.3rem; font-size: 1.4rem; line-height: 2.2rem; }
.post-row .read-more { font-size: 1.5rem; }
.post-row .read-more img { width: 3rem; }
.post-row:hover .read-more img { transform: scaleY(-1) translateX(0.4rem); }

/* Rodapé começa direto, sem a chamada da Home */
main.blog + .site-footer { padding-top: 3.9rem; }

@media (prefers-reduced-motion: reduce) {
  .js .blog-top__bg { transform: none !important; transition: none !important; }
}

/* ---------- Responsivo ---------- */
@media (max-width: 1199px) {
  .blog-top { height: 36rem; }
  .blog-top__title { font-size: 4.6rem; line-height: 5rem; }
  .blog-grid { grid-template-columns: 1fr 1fr; }
  .blog-featured__title { grid-column: 1 / -1; padding: 0; }
  .blog-featured { margin-top: 5rem; }
  .blog-explore { margin-top: 8rem; }
  .blog-explore__head { grid-template-columns: 1fr; gap: 2rem; }
  .topic, .topic + .topic { margin-top: 7rem; }
  .topic:last-child { margin-bottom: 8rem; }
  .topic__grid { grid-template-columns: 1fr; gap: 0; }
  .topic__aside, .topic__foot { display: contents; }
  .topic__title { max-width: none; order: 1; }
  .topic__desc { max-width: 56rem; margin-top: 1.4rem; order: 2; }
  .topic__list { order: 3; margin-top: 3rem; }
  .topic__foot .btn { order: 4; margin-top: 3rem; justify-self: start; }
}

@media (max-width: 720px) {
  .blog-top { height: 30rem; }
  .blog-top__title { font-size: 3.4rem; line-height: 4rem; }
  .blog-top__inner { padding-bottom: 2.6rem; }
  .blog-intro { margin-top: 2.6rem; }
  .blog-grid { grid-template-columns: 1fr; }
  .blog-featured { margin-top: 4rem; }
  .blog-featured__title { font-size: 3.2rem; line-height: 4rem; }
  .blog-explore__title { font-size: 2.4rem; line-height: 3rem; }
  .news-card--soft { min-height: 0; }
  .news-card--soft .news-card__body { padding: 2rem 1.2rem 0; }
  .news-card--soft .news-card__foot { padding-top: 2.6rem; }
  .topic__title { font-size: 2.6rem; line-height: 3.2rem; }
  .topic__list { gap: 3rem; }
  .post-row { grid-template-columns: 1fr; height: auto; row-gap: 1.6rem; }
  .post-row__img { height: 20rem; }
  .post-row__body { padding-top: 0; }
  .post-row__title { min-height: 0; }
  .post-row__excerpt { margin-top: 1.2rem; max-width: none; }
  .post-row__foot { margin-top: 1.6rem; }
}