:root {
  --ink: #080a0b;
  --paper: #eee4d3;
  --lime: #d78632;
  --cyan: #d9e7e6;
  --line: #bfb3a3;
  --muted: #655d53;
  --white: #fffaf0;
}

.top,
.hero,
.footer {
  background-color: #080a0b;
}

.top {
  background:
    radial-gradient(circle at 8% 120%, rgba(182, 95, 44, 0.25), transparent 28%),
    #080a0b;
  border-bottom-color: #efb94f;
}

.top .brand {
  position: relative;
}

.top .brand::before {
  position: absolute;
  top: 50%;
  left: 38px;
  width: 92px;
  height: 66px;
  background: radial-gradient(ellipse, rgba(239, 185, 79, 0.32), rgba(101, 147, 151, 0.15) 48%, transparent 72%);
  content: "";
  filter: blur(12px);
  transform: translate(-50%, -50%);
}

.course-logo {
  position: relative;
  width: 78px;
  height: 78px;
  background: transparent;
  border: 0;
  filter: drop-shadow(0 8px 9px rgba(0, 0, 0, 0.75)) drop-shadow(0 0 10px rgba(239, 185, 79, 0.18));
}

.hero::before {
  background:
    radial-gradient(circle at 78% 26%, rgba(239, 185, 79, 0.18), transparent 24%),
    linear-gradient(90deg, rgba(5, 6, 7, 0.98) 8%, rgba(31, 24, 18, 0.78) 60%, rgba(39, 20, 12, 0.14)),
    url('media/examples/crew-1280.webp') 70% center/cover;
}

.hero h1 em,
.example .eyebrow,
.calc-result b,
nav a[aria-current=page] .num,
.account-link {
  color: #efb94f;
}

.primary,
.badge-sticker,
.skip:focus {
  background: linear-gradient(112deg, #d9e7e6, #efb94f 58%, #b65f2c);
  color: #080a0b;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.28);
}

.primary.dark,
.account-buttons .primary,
.mailing-card .primary {
  background: #15191a;
  color: #fffaf0;
}

.orientation,
.registration-callout,
.example,
.lesson-visual,
.native-form-next,
.completion-survey,
.pitch-studio,
.budget-masthead {
  border-color: #b65f2c;
}

.registration-callout,
.standard,
.finish,
.quick-choice button,
.chapters button,
.option,
.native-form-next {
  background: #ece1cf;
}

.video-shell,
.visual-canvas,
.account-form,
.profile-form,
.mailing-card {
  box-shadow: 7px 8px 0 rgba(182, 95, 44, 0.28), 18px 20px 38px rgba(0, 0, 0, 0.1);
}

.sidebar nav a:hover,
.home-map a:hover {
  background: #e2d5c2;
}

.progress-track div {
  background: linear-gradient(90deg, #b65f2c, #efb94f);
}

:focus-visible {
  outline-color: #efb94f;
}