/* =========================================================
   BLOG PÚBLICO — SSR
========================================================= */
.blog-page,
.blog-article-page { background: var(--color-bg); }

.blog-hero {
  padding: 158px 0 84px;
  background: radial-gradient(circle at 12% 0%, rgba(210,143,89,.18), transparent 32%), var(--color-bg);
}
.blog-hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(280px, .58fr);
  gap: 64px;
  align-items: end;
}
.blog-hero h1 {
  max-width: 840px;
  font-family: var(--font-title);
  font-size: clamp(4rem, 9vw, 8rem);
  font-weight: 500;
  line-height: .82;
  letter-spacing: -.045em;
}
.blog-hero p { max-width: 520px; color: var(--color-muted); }

.blog-list-section { padding: 82px 0 112px; background: var(--color-ice); }
.blog-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 22px; }
.blog-card { display: flex; min-height: 100%; flex-direction: column; background: var(--color-bg); }
.blog-card__image { display: block; overflow: hidden; aspect-ratio: 16/10; background: var(--color-bg-soft); }
.blog-card__image img { width: 100%; height: 100%; object-fit: cover; transition: transform .7s ease; }
.blog-card:hover .blog-card__image img { transform: scale(1.025); }
.blog-card__body { display: flex; flex: 1; flex-direction: column; padding: 26px; }
.blog-card__meta { color: var(--color-caramel); font-size: .66rem; letter-spacing: .13em; text-transform: uppercase; }
.blog-card h2 { margin-top: 11px; font-family: var(--font-title); font-size: clamp(2rem, 3vw, 2.75rem); font-weight: 500; line-height: .98; }
.blog-card p { margin-top: 14px; color: var(--color-muted); font-size: .84rem; }
.blog-card .text-link { margin-top: auto; padding-top: 24px; }
.blog-empty { max-width: 720px; margin: 0 auto; padding: 80px 0; text-align: center; }
.blog-empty h2 { font-family: var(--font-title); font-size: 3rem; font-weight: 500; }
.blog-empty p { margin-top: 12px; color: var(--color-muted); }

.blog-article-hero {
  padding: 148px 0 64px;
  background: radial-gradient(circle at 8% 0%, rgba(210,143,89,.16), transparent 32%), var(--color-bg);
}
.blog-article-heading { max-width: 980px; }
.blog-article-heading__meta { display: flex; flex-wrap: wrap; gap: 10px 18px; color: var(--color-caramel); font-size: .66rem; letter-spacing: .12em; text-transform: uppercase; }
.blog-article-heading h1 { margin-top: 18px; font-family: var(--font-title); font-size: clamp(3.8rem, 8vw, 7.7rem); font-weight: 500; line-height: .83; letter-spacing: -.045em; }
.blog-article-heading > p { max-width: 760px; margin-top: 28px; color: var(--color-muted); font-size: 1rem; }
.blog-article-cover { margin-top: 52px; overflow: hidden; background: var(--color-bg-soft); }
.blog-article-cover[data-type="wide"] { aspect-ratio: 16/9; }
.blog-article-cover[data-type="portrait"] { width: min(760px,100%); aspect-ratio: 4/5; }
.blog-article-cover[data-type="cinematic"] { aspect-ratio: 21/9; }
.blog-article-cover img { width: 100%; height: 100%; object-fit: cover; }

.blog-article-shell { padding: 86px 0 112px; background: var(--color-ice); }
.blog-article-layout { display: grid; grid-template-columns: minmax(0, .34fr) minmax(0, 1fr); gap: clamp(48px, 9vw, 120px); align-items: start; }
.blog-article-aside { position: sticky; top: 125px; padding-top: 15px; border-top: 1px solid rgba(89,55,29,.2); }
.blog-article-aside strong { display: block; font-family: var(--font-title); font-size: 1.45rem; font-weight: 500; }
.blog-article-aside p { margin-top: 10px; color: var(--color-muted); font-size: .74rem; }
.blog-article-content { max-width: 800px; }
.blog-answer-box { margin-bottom: 52px; padding: 25px 28px; border-left: 2px solid var(--color-caramel); background: rgba(223,222,221,.45); }
.blog-answer-box span { color: var(--color-caramel); font-size: .64rem; letter-spacing: .13em; text-transform: uppercase; }
.blog-answer-box p { margin-top: 8px; color: var(--color-text); font-family: var(--font-title); font-size: clamp(1.5rem, 2.8vw, 2.2rem); line-height: 1.15; }
.blog-content-block + .blog-content-block { margin-top: 28px; }
.blog-content-block h2 { margin-top: 58px; color: var(--color-text); font-family: var(--font-title); font-size: clamp(2.6rem, 5vw, 4.7rem); font-weight: 500; line-height: .95; }
.blog-content-block h3 { margin-top: 42px; color: var(--color-brown); font-family: var(--font-title); font-size: clamp(2rem, 3.4vw, 3rem); font-weight: 500; line-height: 1; }
.blog-content-block p { color: var(--color-muted); font-size: 1rem; line-height: 1.95; white-space: pre-line; }
.blog-content-block blockquote { margin: 46px 0; padding-left: 28px; border-left: 1px solid var(--color-caramel); color: var(--color-brown); font-family: var(--font-title); font-size: clamp(2rem, 4vw, 3.6rem); line-height: 1.05; }
.blog-content-block figure { margin: 48px 0; }
.blog-content-block figure img { width: 100%; height: auto; }
.blog-content-block figcaption { margin-top: 10px; color: var(--color-muted); font-size: .7rem; }
.blog-content-block--link a { display: inline-flex; margin: 18px 0; padding: 13px 20px; border: 1px solid rgba(89,55,29,.25); color: var(--color-brown); font-size: .72rem; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; }

.blog-faq { margin-top: 76px; padding-top: 46px; border-top: 1px solid rgba(89,55,29,.18); }
.blog-faq h2 { font-family: var(--font-title); font-size: clamp(2.8rem, 5vw, 4.5rem); font-weight: 500; }
.blog-faq details { padding: 20px 0; border-bottom: 1px solid rgba(89,55,29,.14); }
.blog-faq summary { cursor: pointer; color: var(--color-brown); font-family: var(--font-title); font-size: 1.55rem; }
.blog-faq details p { margin-top: 12px; color: var(--color-muted); }
.blog-article-cta { padding: 96px 0; background: var(--color-brown); color: var(--color-ice); text-align: center; }
.blog-article-cta h2 { max-width: 860px; margin-inline: auto; font-family: var(--font-title); font-size: clamp(3rem, 6vw, 6rem); font-weight: 500; line-height: .93; }
.blog-article-cta p { max-width: 620px; margin: 20px auto 30px; color: rgba(250,248,245,.72); }
.blog-article-cta .btn { background: var(--color-ice); color: var(--color-brown); }

@media (max-width: 980px) {
  .blog-grid { grid-template-columns: repeat(2, 1fr); }
  .blog-hero-grid { grid-template-columns: 1fr; gap: 24px; }
  .blog-article-layout { grid-template-columns: 1fr; gap: 35px; }
  .blog-article-aside { position: static; }
}
@media (max-width: 768px) {
  .blog-hero { padding: 118px 0 62px; }
  .blog-list-section { padding: 62px 0 78px; }
  .blog-grid { grid-template-columns: 1fr; }
  .blog-article-hero { padding: 116px 0 48px; }
  .blog-article-cover { margin-top: 34px; }
  .blog-article-cover[data-type="wide"], .blog-article-cover[data-type="cinematic"] { aspect-ratio: 4/5; }
  .blog-article-shell { padding: 60px 0 78px; }
  .blog-article-content { max-width: none; }
  .blog-content-block p { font-size: .94rem; line-height: 1.85; }
  .blog-content-block figure { margin: 36px -12px; }
  .blog-article-cta { padding: 72px 0; }
}
