:root {
  --description: #c8c8c8;
  --hero-gradient: linear-gradient(135deg, #a78bfa 0%, #e2e8f0 100%);
}

/* ── Page title ── */
.page-title {
  margin: 48px 0 32px;
  background: var(--hero-gradient);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* ── Project list ── */
.project-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.project-item {
  margin-bottom: 32px;
}

.project-item__title {
  font-family: Roboto-Light;
  font-size: 1.35em;
}

.project-item__image {
  display: block;
  margin: 8px 0;
  border: 1px solid var(--description);
}

.project-item__description {
  margin: 4px 0 0;
  color: var(--description);
  line-height: 1.6;
}

/* ── Article ── */
.article {
  margin-top: 48px;
  line-height: 1.8;
}

.article__heading {
  font-family: Roboto-Black;
  font-size: 1.75em;
  line-height: 1.3;
  margin: 0 0 24px;
}

.article h3 {
  font-family: Roboto-Medium;
  margin: 40px 0 12px;
}

.article p {
  color: var(--description);
  margin: 0 0 16px;
}

.article strong {
  color: #ffffff;
}

.article em {
  font-style: italic;
}

.article code {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: 0.9em;
  background: rgba(255, 255, 255, 0.08);
  padding: 2px 6px;
  border-radius: 4px;
}