:root {
  --vp-c-brand: #646cff;
  --vp-c-brand-light: #747bff;
  --vp-c-brand-lighter: #9499ff;
  --vp-c-brand-dark: #535bf2;
  --vp-c-brand-darker: #454ce1;
}

.VPHero .container {
  background-image: radial-gradient(transparent 1px, var(--vp-c-bg) 1px);
  background-size: 50px 50px;
  backdrop-filter: blur(5px);
}

.VPHero .image-bg {
  opacity: 0.8;
  filter: blur(50px);
}

.VPFeatures .item {
  background-color: var(--vp-c-bg-soft);
  border-radius: 12px;
  padding: 24px;
  transition: all 0.3s ease;
}

.VPFeatures .item:hover {
  transform: translateY(-5px);
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
}

.VPFeatures .icon {
  font-size: 32px;
  margin-bottom: 16px;
}

.VPNav .VPNavBar {
  backdrop-filter: blur(10px);
}