.artigos-header{
  max-width: var(--container); margin: 0 auto; padding: 4rem 1.5rem 2.5rem;
  text-align:center;
}
.artigos-header h1{ font-size: clamp(2rem, 4vw, 2.8rem); }
.artigos-header-sub{ max-width: 520px; margin: 0 auto; }

.article-list{
  max-width: 820px; margin: 0 auto; padding: 0 1.5rem 5rem;
  display:flex; flex-direction:column; gap: .9rem;
}

.article-row{
  display:flex; align-items:center; gap: 1.4rem;
  background: var(--cream); border: 1px solid var(--line);
  border-radius: var(--radius-md); padding: 1rem;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.article-row:hover{ transform: translateY(-2px); box-shadow: var(--shadow-card); border-color: transparent; }

.article-row-thumb{
  flex: 0 0 108px; width:108px; height:88px; border-radius: 14px;
  background-size: cover; background-position:center;
}
.article-row-content{ flex:1; min-width:0; }
.article-row-meta{
  font: 700 .68rem/1 var(--sans); letter-spacing:.06em; text-transform:uppercase; color: var(--magenta);
}
.article-row-content h2{
  font-size: 1.08rem; margin: .4em 0 .3em; line-height:1.3;
}
.article-row-content p{
  font-size: .88rem; margin:0; color: var(--ink-soft);
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow:hidden;
}
.article-row-arrow{
  flex: 0 0 auto; font-size: 1.3rem; color: var(--magenta); opacity:.5;
  transition: opacity .18s ease, transform .18s ease;
}
.article-row:hover .article-row-arrow{ opacity:1; transform: translateX(3px); }

@media (max-width: 620px){
  .article-row{ gap:1rem; }
  .article-row-thumb{ flex-basis:76px; width:76px; height:70px; }
  .article-row-content h2{ font-size: .98rem; }
  .article-row-content p{ display:none; }
  .article-row-arrow{ display:none; }
}