:root {
  color-scheme: light;
  --page-bg: #fafafa;
  --card-bg: #fafafa;
  --card-border: #dedede;
  --text-primary: #101010;
  --text-secondary: #6e747e;
  --hover-accent: #385e8c;
  --card-radius: 8px;
}
*, *::before, *::after { box-sizing: border-box; }
html { font-family: Arial, Helvetica, sans-serif; -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--page-bg); color: var(--text-primary); }
.page-container { max-width: 1280px; margin: 0 auto; padding: 29px 24px 60px; }
.article-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; align-items: stretch; }
.article-card { display: flex; flex-direction: column; min-width: 0; padding: 32px; border: 1px solid var(--card-border); border-radius: var(--card-radius); background: var(--card-bg); transition: border-color .18s ease; }
.article-card:hover { border-color: #a8b8ca; }
.article-card__meta { display: flex; justify-content: space-between; align-items: baseline; flex-wrap: wrap; gap: 6px 16px; color: var(--text-secondary); font-size: 14px; line-height: 1.5; }
.article-card__title { margin: 16px 0 14px; font-size: clamp(22px, 2vw, 28px); font-weight: 400; letter-spacing: -.055em; line-height: 1.04; overflow-wrap: anywhere; }
.article-card__title a { color: inherit; text-decoration: none; transition: color .18s ease; }
.article-card__title a:hover { color: var(--hover-accent); }
.article-card__title a:focus-visible { outline: 2px solid var(--hover-accent); outline-offset: 4px; border-radius: 2px; }
.article-card__excerpt { margin: 0; font-size: 18px; line-height: 1.5; overflow-wrap: anywhere; }
.article-card__author { display: flex; align-items: center; gap: 9px; margin-top: auto; padding-top: 22px; color: #5f6877; font-size: 14px; line-height: 1.4; }
.article-card__author img { flex: none; display: block; width: 24px; height: 24px; border-radius: 50%; }
.visually-hidden { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
@media (max-width: 991.98px) { .article-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 767.98px) { .page-container { padding: 20px 16px 40px; } .article-grid { grid-template-columns: 1fr; gap: 16px; } .article-card { padding: 26px; } .article-card__title { font-size: 26px; } .article-card__excerpt { font-size: 17px; } }
@media (prefers-reduced-motion: reduce) { .article-card, .article-card__title a { transition: none; } }