.page-hero {
  display: grid;
  gap: var(--space-6);
  max-width: 46rem;
  padding-top: clamp(2rem, 1rem + 2vw, 3rem);
}

.page-hero__meta {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
  color: var(--color-text-soft);
  font-size: var(--text-sm);
}

.timeline {
  display: grid;
  gap: var(--space-5);
}

.timeline__item {
  display: grid;
  gap: var(--space-3);
  padding-left: 1.25rem;
  border-left: 2px solid rgba(36, 107, 255, 0.22);
}

.timeline__year {
  color: var(--color-primary);
  font-size: var(--text-sm);
  font-weight: 700;
}