/* ============================================================
   Stevanin Arquitetura — Blog — estilos específicos
   Carregar DEPOIS de ../assets/site.css. Herda tokens de cor/tipo.
   Elemento de assinatura: "régua de luz" (gradiente terracota→
   transparente), substitui hairlines por um degradê que evoca o
   próprio objeto de trabalho do José: luz raspando uma superfície.
   ============================================================ */

.light-rule{
  height:2px;
  width:100%;
  background:linear-gradient(to right, var(--terra) 0%, rgba(141,43,0,0.35) 38%, rgba(141,43,0,0) 100%);
}

/* ---------- listagem: post em destaque (reaproveita .pdetail-hero do site.css,
   mesmo tratamento de hero das páginas de projeto — evita "parecer outro site") ---------- */
.blog-kicker{font-family:var(--label);font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:var(--terra-soft);}
.blog-featured-dek{font-family:var(--sans);font-weight:300;font-size:15.5px;line-height:1.75;color:var(--cream-soft);margin-top:22px;max-width:560px;position:relative;z-index:2;}
.blog-featured-dek .light-rule{margin-bottom:22px;max-width:220px;}

/* ---------- barra simples de voltar (topo do blog: só isso, sem nav do site) ---------- */
.blog-topbar{position:fixed;top:0;left:0;right:0;z-index:800;display:flex;justify-content:space-between;align-items:center;padding:20px 6vw;background:linear-gradient(to bottom, rgba(27,25,22,.85), rgba(27,25,22,0));}
.blog-topbar-back{font-family:var(--label);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--cream-soft);text-decoration:none;display:inline-flex;align-items:center;gap:8px;}
.blog-topbar-back:hover{color:var(--cream);}

/* ---------- layout de 2 colunas: lista + sidebar (padrão editorial) ---------- */
.blog-layout{max-width:1140px;margin:0 auto;padding:12vh 6vw 16vh;display:grid;grid-template-columns:1fr 260px;gap:6vw;align-items:start;}
.blog-main{min-width:0;}
.blog-sidebar{position:sticky;top:110px;display:flex;flex-direction:column;gap:6vh;}
.blog-sidebar-block-label{font-family:var(--label);font-size:10px;letter-spacing:.25em;text-transform:uppercase;color:var(--terra-soft);margin-bottom:16px;padding-bottom:12px;border-bottom:1px solid rgba(238,229,213,.15);}
.blog-sidebar-block a{display:block;font-family:var(--sans);font-weight:300;font-size:13.5px;line-height:1.5;color:var(--cream-soft);text-decoration:none;transition:color .25s ease;padding:10px 0;border-bottom:1px solid rgba(238,229,213,.08);}
.blog-sidebar-block a:last-child{border-bottom:none;}
.blog-sidebar-block a:hover,.blog-sidebar-block a.active{color:var(--cream);}
.blog-sidebar-block a.active{color:var(--terra-soft);}
.blog-sidebar-rank{font-family:var(--label);font-size:10px;color:var(--terra-soft);margin-right:8px;}
@media (max-width:900px){
  .blog-layout{grid-template-columns:1fr;}
  .blog-sidebar{position:static;flex-direction:row;flex-wrap:wrap;gap:8vw;order:2;margin-top:4vh;padding-top:4vh;border-top:1px solid rgba(238,229,213,.12);}
  .blog-sidebar-block{flex:1 1 200px;}
}

/* ---------- listagem editorial (sem cards) ---------- */
.blog-list{max-width:880px;margin:0 auto;padding:12vh 6vw 16vh;}
.blog-intro{font-family:var(--display);font-weight:300;font-style:italic;font-size:clamp(17px,2vw,22px);line-height:1.6;color:var(--cream-soft);max-width:620px;margin-bottom:8vh;}
.blog-entry{display:flex;gap:5vw;align-items:flex-start;padding:5vh 0;text-decoration:none;color:inherit;}
.blog-entry-text{flex:1 1 auto;}
.blog-entry-thumb{flex:0 0 180px;width:180px;aspect-ratio:4/3;background-size:cover;background-position:center;filter:saturate(.9) brightness(.92);transition:transform .8s cubic-bezier(.16,.84,.44,1), filter .4s ease;}
.blog-entry:hover .blog-entry-thumb{transform:scale(1.04);filter:saturate(1) brightness(1);}
.blog-entry-kicker{font-family:var(--label);font-size:10.5px;letter-spacing:.28em;text-transform:uppercase;color:var(--terra-soft);}
.blog-entry-title{font-family:var(--display);font-weight:300;font-size:clamp(20px,2.4vw,28px);line-height:1.25;margin-top:10px;color:var(--cream);transition:color .3s ease;}
.blog-entry:hover .blog-entry-title{color:var(--cream-soft);}
.blog-entry-dek{font-family:var(--sans);font-weight:300;font-size:14px;line-height:1.65;color:var(--cream-soft);opacity:.8;margin-top:10px;max-width:520px;}
.blog-entry-meta{font-family:var(--label);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--cream-soft);opacity:.55;margin-top:14px;}
.blog-entry-sep{margin:0;}
@media (max-width:700px){
  .blog-entry{flex-direction:column-reverse;gap:18px;}
  .blog-entry-thumb{width:100%;flex-basis:auto;aspect-ratio:16/9;}
}

/* ---------- artigo ---------- */
.article-body{max-width:680px;margin:0 auto;padding:12vh 6vw 4vh;position:relative;}
.article-body p{font-family:var(--sans);font-weight:300;font-size:16px;line-height:1.85;color:var(--cream-soft);margin-top:22px;}
.article-body p:first-of-type{font-size:18px;color:var(--cream);}
.article-body h2{font-family:var(--display);font-weight:300;font-size:clamp(22px,2.8vw,30px);color:var(--cream);margin-top:56px;line-height:1.3;}
.article-body h2 .light-rule{max-width:64px;margin-top:14px;margin-bottom:26px;}
.article-body ul{margin-top:20px;padding-left:0;list-style:none;}
.article-body li{font-family:var(--sans);font-weight:300;font-size:16px;line-height:1.8;color:var(--cream-soft);padding-left:26px;position:relative;margin-top:14px;}
.article-body li::before{content:'';position:absolute;left:0;top:11px;width:14px;height:1px;background:var(--terra-soft);}

.article-figure{max-width:1040px;margin:9vh auto;padding:0 5vw;}
.article-figure img{width:100%;aspect-ratio:16/10;object-fit:cover;filter:saturate(.92);border-radius:2px;}
.article-figure figcaption{font-family:var(--label);font-size:11px;letter-spacing:.1em;color:var(--cream-soft);opacity:.6;margin-top:14px;text-align:center;}

.article-quote{max-width:640px;margin:8vh auto;padding:0 6vw;text-align:center;}
.article-quote p{font-family:var(--display);font-weight:300;font-style:italic;font-size:clamp(19px,2.4vw,26px);line-height:1.55;color:var(--cream);}
.article-quote .light-rule{max-width:64px;margin:24px auto 0;}

.article-meta-top{max-width:680px;margin:0 auto;padding:0 6vw;display:flex;gap:24px;flex-wrap:wrap;font-family:var(--label);font-size:11px;letter-spacing:.15em;text-transform:uppercase;color:var(--cream-soft);opacity:.65;}

.related-section{padding:14vh 6vw;background:var(--bg-alt);}
.related-list{max-width:760px;margin:8vh auto 0;}
.related-item{border-bottom:1px solid rgba(238,229,213,.15);}
.related-link{display:block;padding:24px 0;text-decoration:none;}
.related-kicker{font-family:var(--label);font-size:10.5px;letter-spacing:.25em;text-transform:uppercase;color:var(--terra-soft);}
.related-title{font-family:var(--display);font-weight:300;font-size:clamp(17px,2vw,22px);color:var(--cream);margin-top:8px;transition:color .3s ease;}
.related-link:hover .related-title{color:var(--cream-soft);}

/* ---------- assinatura do autor (fim de cada post, antes do closing) ---------- */
.article-author{max-width:680px;margin:10vh auto 0;padding:5vh 24px 0;box-sizing:border-box;border-top:1px solid rgba(238,229,213,.15);display:flex;align-items:center;gap:22px;}
.article-author-photo{width:64px;height:64px;border-radius:50%;background-size:cover;background-position:center 15%;flex-shrink:0;filter:grayscale(.1);}
.article-author-name{font-family:var(--display);font-weight:300;font-size:18px;color:var(--cream);}
.article-author-role{font-family:var(--label);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--terra-soft);margin-top:4px;}
@media (max-width:480px){
  .article-author{flex-direction:column;text-align:center;gap:14px;padding:5vh 28px 0;}
}

/* ---------- links internos contextuais no corpo do texto ---------- */
.article-body p a,.article-body a.inline-link{color:var(--terra-soft);text-decoration:underline;text-decoration-color:rgba(141,43,0,.4);text-underline-offset:3px;transition:color .25s ease;}
.article-body p a:hover,.article-body a.inline-link:hover{color:var(--cream);}