:root {
  --red: #6d28d9;
  --red-soft: #8c43f5;
  --blue: #2f6fbf;
  --blue-2: #4a84c6;
  --blue-soft: #eef2f7;
  --ink: #1c1817;
  --muted: #746964;
  --quiet: #b9aea8;
  --line: rgba(101, 72, 61, .12);
  --glass: rgba(255, 253, 250, .86);
  --shadow: 0 26px 80px rgba(83, 52, 42, .14);
  --radius: 22px;
}

body {
  color: var(--ink);
  background:
    radial-gradient(circle at 12% 8%, rgba(47, 111, 191, .09), transparent 32rem),
    radial-gradient(circle at 88% 3%, rgba(255, 145, 105, .16), transparent 34rem),
    linear-gradient(180deg, #fffaf6 0%, #fbf8f5 52%, #fffdfb 100%);
}

body::before {
  background-image:
    linear-gradient(rgba(112, 78, 57, .035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(112, 78, 57, .035) 1px, transparent 1px);
  background-size: 48px 48px;
  mask-image: linear-gradient(to bottom, #000, transparent 72%);
}

.stage {
  border-color: rgba(151, 86, 65, .13);
  background: rgba(255, 253, 250, .95);
}

.stage::before {
  background:
    linear-gradient(115deg, rgba(255, 255, 255, .98), rgba(255, 249, 244, .92)),
    repeating-linear-gradient(135deg, rgba(203, 91, 58, .04) 0 1px, transparent 1px 34px);
}

.stage::after {
  border-color: rgba(132, 81, 65, .09);
  box-shadow:
    -180px 220px 0 -8px rgba(47, 111, 191, .04),
    -40px 510px 0 -18px rgba(203, 91, 58, .04);
}

.staffi-logo {
  display: block;
  flex: 0 0 auto;
  width: 50px;
  height: 50px;
  object-fit: contain;
}

.brand-title {
  color: var(--ink);
}

.eyebrow::before,
.accent-line {
  background: linear-gradient(90deg, var(--blue), var(--purple, #6d28d9));
}

.nav-button.primary,
.back-link,
.topic-card.is-default,
.feature-item.is-active {
  border-color: rgba(109, 40, 217, .34);
}

.nav-button.primary {
  background: linear-gradient(135deg, #6d28d9, #8c43f5);
  box-shadow: 0 14px 34px rgba(109, 40, 217, .24);
}

.feature-item.is-active {
  box-shadow: 0 18px 38px rgba(64, 31, 107, .12);
}

.feature-price strong,
.accent,
.metric,
.slide-number {
  color: #6d28d9;
}

@media (max-height: 760px) {
  .staffi-logo {
    width: 42px;
    height: 42px;
  }
}