/* Базовая типографика и цвета, близкие к современным лендингам */
:root {
  --lm-bg: #0b0f19;
  --lm-bg-soft: #0f1422;
  --lm-text: #e9edf5;
  --lm-text-muted: #a7b0c0;
  --lm-primary: #635bff; /* фиолетовый, как в популярных SaaS лендингах */
  --lm-primary-600: #4f46e5;
  --lm-accent: #22d3ee; /* голубой акцент */
  --lm-card: #12172a;
  --lm-border: #27304a;
}

html, body {
  font-family: 'Inter', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
}

/* Тёмный раздел с градиентом под hero */
#hero {
  background: radial-gradient(1200px 600px at 20% -10%, rgba(99,91,255,0.25), transparent 60%),
              radial-gradient(1000px 500px at 100% 10%, rgba(34,211,238,0.20), transparent 60%),
              linear-gradient(180deg, var(--lm-bg) 0%, var(--lm-bg-soft) 100%);
  color: var(--lm-text);
}

#hero .lead { color: var(--lm-text-muted); }

#hero .btn-primary {
  background-color: var(--lm-primary);
  border-color: var(--lm-primary);
}

#hero .btn-primary:hover { background-color: var(--lm-primary-600); border-color: var(--lm-primary-600); }

#hero .btn-outline-secondary { color: var(--lm-text); border-color: var(--lm-border); }

#hero .btn-outline-secondary:hover { background-color: #1a2237; border-color: var(--lm-border); }

/* Карточки, блоки, разделительные контуры */
.border { border-color: var(--lm-border) !important; }

.bg-black { background-color: #0a0d18 !important; }

.bg-light { background-color: #f5f7fb !important; }

.bg-white { background-color: #ffffff !important; }

/* FAQ, Features секции — больше воздуха */
section { scroll-margin-top: 80px; }

section .text-muted { color: var(--lm-text-muted) !important; }

/* Тёмная демо-секция */
#demo { background: linear-gradient(180deg, #0a0d18 0%, #0d1220 100%); }

#demo .btn-primary { background-color: var(--lm-primary); border-color: var(--lm-primary); }

#demo .btn-primary:hover { background-color: var(--lm-primary-600); border-color: var(--lm-primary-600); }

#demo .btn-outline-light { --bs-btn-hover-bg: rgba(233,237,245,0.15); }

/* Заголовки чуть плотнее */
h1, h2, h3, .display-5 { letter-spacing: -0.02em; }

/* Навбар тёмный с лёгкой прозрачностью */
.navbar.bg-dark { background-color: rgba(10,13,24,0.9) !important; backdrop-filter: saturate(140%) blur(6px); }

/* Карточные блоки */
.rounded-3 { border-radius: 14px !important; }

.shadow-sm { box-shadow: 0 10px 30px rgba(9, 11, 18, 0.15) !important; }

/* Акцентные градиентные выделения (для бейджей/заголовков при необходимости) */
.gradient-text {
  background: linear-gradient(90deg, var(--lm-primary), var(--lm-accent));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

/* Адаптивные отступы секций */
@media (min-width: 992px) {
  #hero { padding-top: 4rem !important; padding-bottom: 4.5rem !important; }
}