:root {
  --vp-c-brand-1: #3b7dd8;
  --vp-c-brand-2: #5a95e5;
  --vp-c-brand-3: #2a5fa8;
  --vp-c-brand-soft: rgba(59, 125, 216, 0.14);
  --vp-home-hero-name-color: #2a5fa8;
}

.dark {
  --vp-c-brand-1: #6ba3e8;
  --vp-c-brand-2: #89b8f0;
  --vp-c-brand-3: #5a95e5;
  --vp-c-brand-soft: rgba(107, 163, 232, 0.16);
  --vp-home-hero-name-color: #89b8f0;
}

.VPHero .image-src,
.screenshot {
  border-radius: 12px;
}

.VPFooter .footer-built-with {
  display: block;
  margin-top: 12px;
}

.screenshot-grid {
  display: grid;
  gap: 1.5rem;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  margin: 2rem 0;
}

.screenshot-card {
  display: block;
  text-decoration: none;
}

.screenshot-card span {
  display: block;
  margin-top: 0.75rem;
  color: var(--vp-c-text-2);
  font-size: 0.95rem;
}