@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');

body {
  font-family: 'Inter', sans-serif;
}

.gradient-text {
  background: linear-gradient(135deg, oklch(45% 0.25 260), oklch(50% 0.22 200));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.hero-glow {
  background: radial-gradient(ellipse at 50% 0%, oklch(85% 0.08 250 / 0.4), transparent 70%);
}

.feature-icon {
  width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
  font-size: 22px;
}

.featured-card {
  border-color: oklch(55% 0.2 260 / 0.4) !important;
  background: linear-gradient(135deg, oklch(95% 0.03 260 / 0.5), oklch(98% 0.01 260 / 0.3)) !important;
}

.hero-screenshot {
  border-radius: 12px;
  box-shadow: 0 20px 60px -15px rgba(0, 0, 0, 0.15), 0 0 0 1px rgba(0, 0, 0, 0.05);
}