/* Blog no layout novo. Mosaico de fotos numa faixa azul-marinho (o estilo do blog antigo), com o título sempre
   visível; topo, texto dos artigos e caixas laterais nos tokens do site (--ink, --orange, --line, Manrope + DM Sans). */
.blog,.artigo{--b-faixa:#0d1830;--b-claro:#ff8a63}

/* topo da listagem */
.b-topo{padding-block:72px 36px}
.b-topo h1{font-family:var(--display);font-size:clamp(42px,6vw,88px);line-height:1;letter-spacing:-.04em;margin:0;text-wrap:balance}
.b-topo h1 i{font-family:Georgia,serif;font-weight:400;color:var(--orange)}
.b-topo-pe{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;margin-top:28px}
.b-topo-pe p{max-width:58ch;margin:0;color:var(--muted);font-size:17px;line-height:1.6}
.b-topo-pe span{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);white-space:nowrap}

/* filtros: texto com sublinhado, sem pílulas */
.b-filtros{border-block:1px solid var(--line);background:var(--paper);position:sticky;top:0;z-index:5}
.b-filtros .wrap{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none}
.b-filtros .wrap::-webkit-scrollbar{display:none}
.b-filtro{font:700 11px/1 var(--font);letter-spacing:.09em;text-transform:uppercase;color:var(--muted);background:none;border:0;border-bottom:2px solid transparent;padding:17px 14px 15px;cursor:pointer;white-space:nowrap}
.b-filtro:hover{color:var(--ink)}
.b-filtro[aria-pressed="true"]{color:var(--ink);border-bottom-color:var(--orange)}
.b-filtro:focus-visible{outline:2px solid var(--orange);outline-offset:-2px}

/* faixa escura e mosaico */
.b-faixa{background:var(--b-faixa);color:#fff;padding-block:8px 64px}
.b-grupo{padding-top:40px}
.b-grupo:first-child{padding-top:32px}
.b-sep{display:flex;align-items:center;gap:14px;margin:0 0 16px;font:700 11px/1 var(--font);letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.62)}
.b-sep::after{content:"";flex:1;height:1px;background:rgba(255,255,255,.14)}
.b-mosaico{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
.b-mosaico-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.b-card{position:relative;display:block;aspect-ratio:4/3;overflow:hidden;color:#fff;text-decoration:none;background:#1a2540}
.b-card.feat{grid-column:span 2;grid-row:span 2}
.b-card.largo{grid-column:1/-1;grid-row:auto;aspect-ratio:21/8}
.b-card.largo .b-tit{max-width:26ch}
.b-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.25,.46,.45,.94)}
.b-card::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(8,14,28,.92) 0%,rgba(8,14,28,.5) 42%,rgba(8,14,28,0) 72%)}
.b-card:hover img,.b-card:focus-visible img{transform:scale(1.05)}
.b-card:focus-visible{outline:2px solid var(--orange);outline-offset:2px}
.b-txt{position:absolute;left:18px;right:18px;bottom:16px;z-index:1;display:flex;flex-direction:column;gap:6px}
.b-cat{font:700 10.5px/1.2 var(--font);letter-spacing:.12em;text-transform:uppercase;color:var(--b-claro)}
.b-tit{font-family:var(--display);font-weight:650;font-size:16px;line-height:1.25;letter-spacing:-.01em;text-wrap:balance}
.b-card.feat .b-tit{font-size:clamp(22px,2.4vw,34px);line-height:1.12;letter-spacing:-.025em;max-width:22ch}
.b-card.feat .b-txt{left:28px;right:28px;bottom:26px}
.b-meta{font-size:12px;color:rgba(255,255,255,.72)}

/* ferramentas entre os grupos */
.b-ferr{padding-block:56px;background:var(--paper)}
.b-ferr-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px}
.b-ferr-grid a{display:flex;flex-direction:column;gap:10px;padding-top:18px;border-top:2px solid var(--ink);color:var(--ink);text-decoration:none}
.b-ferr-grid a:hover b{text-decoration:underline;text-decoration-color:var(--orange);text-underline-offset:4px}
.b-ferr-rot{font:700 11px/1 var(--font);letter-spacing:.12em;text-transform:uppercase;color:var(--orange)}
.b-ferr-grid b{font-family:var(--display);font-size:clamp(22px,2.2vw,30px);line-height:1.15;letter-spacing:-.02em;font-weight:700}
.b-ferr-grid span:last-child{color:var(--muted)}

/* artigo */
.a-topo{padding-block:48px 32px}
.a-trilha{font-size:13px;color:var(--muted);margin-bottom:28px}
.a-trilha a{color:var(--muted)}
.a-topo .eyebrow{color:var(--orange);margin-bottom:16px}
.a-topo h1{max-width:24ch;font-family:var(--display);font-size:clamp(32px,4.4vw,60px);line-height:1.05;letter-spacing:-.035em;margin:0;text-wrap:balance}
.a-meta{margin:22px 0 0;color:var(--muted);font-size:14px}
.a-foto{margin:0}
.a-foto img{display:block;width:100%;aspect-ratio:21/9;object-fit:cover;background:var(--soft)}
.a-layout{display:grid;grid-template-columns:minmax(0,700px) 300px;justify-content:space-between;gap:64px;padding-block:56px 80px}
.a-corpo{font-size:18px;line-height:1.75;color:#1d2a40;min-width:0}
.a-corpo>:first-child{margin-top:0}
.a-corpo p{margin:0 0 1.15em}
.a-corpo h2{font-family:var(--display);font-size:clamp(24px,2.4vw,30px);line-height:1.2;letter-spacing:-.02em;color:var(--ink);margin:2em 0 .6em;text-wrap:balance}
.a-corpo h3{font-family:var(--display);font-size:21px;line-height:1.3;color:var(--ink);margin:1.6em 0 .5em}
.a-corpo a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--orange);text-underline-offset:3px}
.a-corpo ul,.a-corpo ol{padding-left:1.3em;margin:0 0 1.2em}
.a-corpo li{margin-bottom:.45em}
.a-corpo strong{color:var(--ink)}
.a-corpo blockquote{margin:1.6em 0;padding:4px 0 4px 22px;border-left:3px solid var(--orange);font-size:20px;color:var(--ink)}
.a-corpo table{width:100%;border-collapse:collapse;font-size:15px;margin:1.4em 0;display:block;overflow-x:auto}
.a-corpo th,.a-corpo td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--line);vertical-align:top}
.a-corpo th{font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.a-corpo img{max-width:100%;height:auto}
.a-cta{display:flex;justify-content:space-between;align-items:center;gap:20px;margin:2em 0;padding:18px 0;border-block:1px solid var(--line)}
.a-cta p{margin:0;font-weight:600;color:var(--ink)}
.a-corpo .a-cta a{white-space:nowrap;font-weight:700;text-decoration:none;color:var(--orange)}
.a-lado-in{position:sticky;top:96px;display:flex;flex-direction:column;gap:28px}
.a-box{display:flex;flex-direction:column;gap:6px;padding-top:14px;border-top:2px solid var(--ink);color:var(--ink);text-decoration:none}
.a-box-rot{font:700 10.5px/1 var(--font);letter-spacing:.12em;text-transform:uppercase;color:var(--orange)}
.a-box b{font-family:var(--display);font-size:19px;line-height:1.2;letter-spacing:-.01em}
.a-box span:last-child{font-size:14px;color:var(--muted)}
.a-box:hover b{text-decoration:underline;text-decoration-color:var(--orange);text-underline-offset:3px}
.a-rel{padding-top:40px}

@media (max-width:980px){
  .b-mosaico{grid-template-columns:repeat(2,minmax(0,1fr))}
  .b-mosaico-3{grid-template-columns:repeat(2,minmax(0,1fr))}
  .a-layout{grid-template-columns:minmax(0,1fr);gap:48px}
  .a-lado-in{position:static;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
}
@media (max-width:640px){
  .b-topo{padding-block:44px 24px}
  .b-topo-pe{flex-direction:column;align-items:flex-start;gap:12px}
  .b-mosaico,.b-mosaico-3{grid-template-columns:minmax(0,1fr)}
  .b-card.feat{grid-column:auto;grid-row:auto}
  .b-card.largo{aspect-ratio:4/3}
  .b-card.feat .b-txt{left:18px;right:18px;bottom:16px}
  .b-ferr-grid{grid-template-columns:minmax(0,1fr)}
  .a-foto img{aspect-ratio:4/3}
  .a-foto .wrap{width:100%}
  .a-corpo{font-size:17px}
  .a-lado-in{grid-template-columns:minmax(0,1fr)}
  .a-cta{flex-direction:column;align-items:flex-start}
}
@media (prefers-reduced-motion:reduce){.b-card img{transition:none}}