.articles{padding:var(--space-section) 0;border-top:1px solid var(--color-border)}.articles__header{margin-bottom:var(--space-12);justify-content:space-between;align-items:flex-end;display:flex}.articles__grid{gap:var(--space-6);grid-template-columns:repeat(3,1fr);display:grid}.article-card{background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-6);gap:var(--space-4);transition:transform var(--duration-normal), box-shadow var(--duration-normal), border-color var(--duration-fast);cursor:pointer;flex-direction:column;display:flex}.article-card:hover{border-color:var(--color-border-light);transform:translateY(-4px);box-shadow:0 10px 30px #0000004d}.article-card__top{justify-content:space-between;align-items:center;display:flex}.article-card__category{font-size:var(--text-xs);color:var(--color-text-muted);text-transform:uppercase;letter-spacing:var(--tracking-wider);padding:var(--space-1) var(--space-3);border:1px solid var(--color-border);border-radius:var(--radius-full)}.article-card__date{font-size:var(--text-xs);color:var(--color-text-muted)}.article-card__title{font-size:var(--text-xl);font-weight:600;line-height:var(--leading-snug);transition:color var(--duration-fast)}.article-card:hover .article-card__title{color:var(--color-text-secondary)}.article-card__read-time{font-size:var(--text-xs);color:var(--color-text-muted)}.article-card__excerpt{font-size:var(--text-sm);color:var(--color-text-secondary);line-height:var(--leading-relaxed);flex:1}.article-card__author{align-items:center;gap:var(--space-3);padding-top:var(--space-4);border-top:1px solid var(--color-border);display:flex}.article-card__author-avatar{object-fit:cover;border-radius:50%;width:32px;height:32px}.article-card__author-name{font-size:var(--text-sm);font-weight:500}.article-card__author-role{font-size:var(--text-xs);color:var(--color-text-muted)}.article-card__brand{font-size:var(--text-xs);color:var(--color-text-muted);margin-left:auto;font-weight:700}@media (width<=1024px){.articles__grid{grid-template-columns:1fr 1fr}}@media (width<=768px){.articles__grid{grid-template-columns:1fr}}