/* ---------- ОБЩИЕ КОМПОНЕНТЫ ---------- */
.dar-gradient-text {
  background: var(--dar-gradient-text);
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
}
.dar-glass {
  background: var(--dar-bg-glass);
  backdrop-filter: blur(var(--dar-blur-md));
  border: 1px solid var(--dar-border-subtle);
  border-radius: var(--dar-radius-xl);
}
.dar-btn-primary {
  display: inline-flex;
  align-items: center;
  gap: var(--dar-space-sm);
  background: var(--dar-btn-primary-bg);
  border: 1px solid var(--dar-border-accent);
  border-radius: var(--dar-radius-full);
  padding: var(--dar-space-sm) var(--dar-space-lg);
  font-weight: 500;
  font-size: var(--dar-text-nav);
  color: var(--dar-text-primary);
  text-decoration: none;
  transition: var(--dar-transition-fast);
}
.dar-btn-primary:hover {
  border-color: var(--dar-btn-primary-hover-border);
  background: var(--dar-btn-primary-hover-bg);
  box-shadow: var(--dar-glow-cyan);
}
.dar-btn-ghost {
  display: inline-flex;
  padding: var(--dar-space-sm) var(--dar-space-lg);
  border-radius: var(--dar-radius-full);
  background: var(--dar-bg-ghost);
  border: 1px solid var(--dar-border-subtle);
  color: var(--dar-text-secondary);
  text-decoration: none;
  transition: var(--dar-transition-fast);
}
.dar-btn-ghost:hover {
  background: var(--dar-bg-active-subtle);
  border-color: rgba(255, 255, 255, 0.25);
  color: var(--dar-text-primary);
}

/* фоновая сетка */
.dar-mesh-bg {
  background: var(--dar-bg-base);
  background-image: radial-gradient(circle at 15% 30%, var(--dar-mesh-dot-cyan) 2%, transparent 2.5%),
                    radial-gradient(circle at 75% 70%, var(--dar-mesh-dot-purple) 1.8%, transparent 2.2%);
  background-size: 48px 48px, 68px 68px;
}

/* ---------- ФОНОВЫЕ РАЗМЫТЫЕ ПЯТНА ---------- */
.bg-blobs {
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
}
.bg-blob {
  position: absolute;
  border-radius: 50%;
  filter: blur(var(--dar-blur-xl));
  opacity: var(--dar-blob-opacity);
}
.blob-1 {
  left: var(--dar-blob-1-left);
  top: var(--dar-blob-1-top);
  width: var(--dar-blob-1-size);
  height: var(--dar-blob-1-size);
  background: var(--dar-accent-cyan);
}
.blob-2 {
  right: var(--dar-blob-2-right);
  top: var(--dar-blob-2-top);
  width: var(--dar-blob-2-size);
  height: var(--dar-blob-2-size);
  background: var(--dar-accent-purple);
  opacity: 0.1;
  filter: blur(var(--dar-blur-2xl));
}
.blob-3 {
  left: var(--dar-blob-3-left);
  bottom: var(--dar-blob-3-bottom);
  width: var(--dar-blob-3-size);
  height: var(--dar-blob-3-size);
  background: var(--dar-accent-pink);
  opacity: 0.08;
  filter: blur(var(--dar-blur-lg));
}