/* Blog — Rodrigo Machado Advocacia em Leilões
   Herda o sistema do site: branco predominante, Newsreader nos títulos e no corpo
   longo, Inter nos rótulos. Coluna estreita de propósito: texto jurídico dispersa
   quando a linha passa de ~70 caracteres. */

@font-face{font-family:'Newsreader';src:url('../identidade/web/fonts/Newsreader.woff2') format('woff2');font-weight:200 700;font-style:normal;font-display:swap}
@font-face{font-family:'Newsreader';src:url('../identidade/web/fonts/Newsreader-Italic.woff2') format('woff2');font-weight:200 700;font-style:italic;font-display:swap}
@font-face{font-family:'Inter';src:url('../identidade/web/fonts/Inter.woff2') format('woff2');font-weight:100 900;font-display:swap}

:root{
  --bone:#FFFFFF; --paper:#F8F8FA; --tinta:#23201D; --noite:#1C1A17;
  --grafite:#625E59; --linha:#E6E6E9; --vivo:#8C1111; --sombra:#5A0E0E;
  --serif:'Newsreader',Georgia,serif; --sans:'Inter',system-ui,sans-serif;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
/* trava de segurança: nenhuma imagem estoura a viewport, aconteça o que acontecer
   com o resto do CSS (foi o que quebrou o índice quando um cache antigo do CSS
   perdeu as regras de grid — a capa de 1200px empurrava a página inteira). */
img{display:block;max-width:100%;height:auto}
body{
  margin:0; background:var(--bone); color:var(--tinta);
  font-family:var(--serif); font-size:1.16rem; line-height:1.72;
  -webkit-font-smoothing:antialiased;
}

/* ===== topo ===== */
.topo{border-bottom:1px solid var(--linha);background:var(--bone)}
.topo-in{max-width:74rem;margin:0 auto;padding:1.15rem 1.5rem;display:flex;align-items:center;gap:.95rem}
.topo img{width:44px;height:44px}
.topo .nome{font-family:var(--serif);font-size:1.12rem;letter-spacing:.055em;color:var(--noite);text-decoration:none}
.topo .papel{font-family:var(--sans);font-size:.6rem;letter-spacing:.22em;text-transform:uppercase;color:var(--grafite);margin-top:.18rem}
.topo .voltar{margin-left:auto;font-family:var(--sans);font-size:.82rem;color:var(--vivo);text-decoration:none}
.topo .voltar:hover{text-decoration:underline}

/* ===== artigo ===== */
main{max-width:44rem;margin:0 auto;padding:3.6rem 1.5rem 1rem}
.trilha{font-family:var(--sans);font-size:.76rem;letter-spacing:.02em;color:var(--grafite);margin-bottom:1.6rem}
.trilha a{color:var(--grafite)}
h1{font-family:var(--serif);font-weight:400;font-size:clamp(2rem,5.2vw,2.9rem);line-height:1.16;letter-spacing:-.012em;color:var(--noite);margin:0 0 1.1rem}
.linha-fina{font-size:1.24rem;line-height:1.6;color:var(--grafite);margin:0 0 2.1rem}
.assinatura{font-family:var(--sans);font-size:.78rem;color:var(--grafite);border-top:1px solid var(--linha);border-bottom:1px solid var(--linha);padding:.85rem 0;margin-bottom:2.6rem}
.assinatura b{color:var(--tinta);font-weight:600}

h2{font-family:var(--serif);font-weight:500;font-size:1.62rem;line-height:1.25;color:var(--noite);margin:2.9rem 0 .9rem}
h3{font-family:var(--serif);font-weight:600;font-size:1.22rem;color:var(--noite);margin:2rem 0 .5rem}
p{margin:0 0 1.15rem}
strong{font-weight:600;color:var(--noite)}
em{font-style:italic}
a{color:var(--vivo)}
ul,ol{margin:0 0 1.3rem;padding-left:1.35rem}
li{margin-bottom:.55rem}

/* o bloco de lei: onde o dispositivo aparece com a distinção fina, nunca solto */
.lei{background:var(--paper);border-left:3px solid var(--vivo);padding:1.05rem 1.25rem;margin:1.8rem 0;font-size:1.02rem;line-height:1.62}
.lei .ref{font-family:var(--sans);font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--vivo);display:block;margin-bottom:.35rem}

/* a régua: o que fazer antes do lance */
.regua{border:1px solid var(--linha);padding:1.35rem 1.5rem;margin:2.2rem 0}
.regua h3{margin-top:0}

/* ===== fecho ===== */
.fecho{border-top:1px solid var(--linha);margin-top:3.2rem;padding-top:2rem}
.fecho p{font-size:1.1rem}
.cta{display:inline-block;font-family:var(--sans);font-size:.92rem;font-weight:500;background:var(--vivo);color:#fff;text-decoration:none;padding:.85rem 1.5rem;margin-top:.4rem}
.cta:hover{background:var(--sombra)}
.aviso{font-family:var(--sans);font-size:.78rem;line-height:1.6;color:var(--grafite);margin-top:1.8rem}

/* ===== leia também ===== */
.leia{background:var(--paper);margin-top:3rem;padding:1.6rem 1.5rem}
.leia h2{font-size:1.05rem;font-family:var(--sans);font-weight:600;letter-spacing:.02em;margin:0 0 .8rem}
.leia ul{list-style:none;padding:0;margin:0}
.leia li{margin-bottom:.6rem}
.leia a{font-family:var(--serif);font-size:1.05rem}

/* ===== capa do artigo ===== */
.capa-artigo{width:100%;height:auto;display:block;margin:0 0 2.4rem;border:1px solid var(--linha)}

/* ===== índice do blog ===== */
/* Abertura editorial: a lâmina de cera à esquerda ecoa a og-home e o cartão,
   e dá à página a presença que faltava quando era só texto empilhado. */
.capa-lista{border-bottom:1px solid var(--linha);background:var(--bone)}
.capa-lista-in{max-width:52rem;margin:0 auto;padding:4rem 1.5rem 3.2rem;position:relative}
.capa-lista-in::before{content:"";position:absolute;left:0;top:4rem;bottom:3.2rem;width:4px;
  background:linear-gradient(180deg,var(--vivo) 0%,var(--sombra) 100%)}
.capa-lista h1{font-size:clamp(2.4rem,6vw,3.4rem);margin:0 0 .9rem;padding-left:1.6rem}
.capa-lista .lamina{font-family:var(--serif);font-size:clamp(1.15rem,2.4vw,1.4rem);
  line-height:1.5;color:var(--tinta);max-width:36rem;margin:0;padding-left:1.6rem}
.capa-lista .lamina em{font-style:italic;color:var(--vivo)}

.lista{max-width:52rem;margin:0 auto;padding:2.6rem 1.5rem 1rem}
.item{border-bottom:1px solid var(--linha);padding:2.2rem 0;display:grid;
  grid-template-columns:15rem 1fr;gap:1.6rem;align-items:start}
.item:first-child{padding-top:.6rem}
.item .thumb{display:block}
.item .thumb img{width:100%;height:auto;display:block;border:1px solid var(--linha)}
.item .data{font-family:var(--sans);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--grafite);margin-bottom:.5rem}
.item .tit{font-family:var(--serif);font-size:1.42rem;line-height:1.25;color:var(--noite);text-decoration:none;display:block;margin-bottom:.5rem}
.item .tit:hover{color:var(--vivo)}
.item p{font-size:1.02rem;color:var(--grafite);margin:0}

/* fecho do índice: a página não termina no vazio */
.convite{max-width:52rem;margin:0 auto;padding:2.6rem 1.5rem 4rem}
.convite p{font-size:1.14rem;margin-bottom:1rem}

@media (max-width:720px){
  .item{grid-template-columns:1fr;gap:.9rem}
}

/* ===== rodapé ===== */
footer{border-top:1px solid var(--linha);margin-top:4rem;background:var(--paper)}
.rodape-in{max-width:74rem;margin:0 auto;padding:2.2rem 1.5rem;font-family:var(--sans);font-size:.82rem;color:var(--grafite);display:flex;flex-wrap:wrap;gap:.6rem 2rem}
.rodape-in a{color:var(--vivo)}

@media (max-width:640px){
  body{font-size:1.1rem}
  main{padding-top:2.4rem}
}
