:root {
  --ink: #08090b;
  --paper: #f3f3f1;
  --lime: #dc0915;
  --muted: #a8adb5;
  --line: #2b2e34;
}

.top {
  background: #fff;
  border-bottom-color: #15171a24;
  color: #101216;
}

.nav {
  height: 136px;
}

.brand {
  display: block;
  width: 280px;
  height: 108px;
  margin-right: auto;
  overflow: hidden;
  background: #fff;
}

.brand img {
  display: block;
  width: 280px;
  height: auto;
  mix-blend-mode: multiply;
}

.top .links {
  gap: 16px;
  font-size: 1rem;
  font-weight: 800;
  letter-spacing: .035em;
}

.brand-light {
  display: block;
  width: 245px;
  max-width: 100%;
  margin-bottom: 18px;
}

.brand-light img {
  display: block;
  width: 100%;
  height: auto;
}

.brand-promise {
  min-height: 46px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 22px;
  border-top: 1px solid #15171a1a;
  color: #101216;
}

.brand-promise p {
  margin: 0;
  font-size: .88rem;
  font-weight: 900;
  letter-spacing: .3em;
  line-height: 1;
  text-transform: uppercase;
}

.brand-promise span {
  width: 48px;
  height: 3px;
  background: #dc0915;
}

.top .menu {
  color: #101216;
}

.top .links.open {
  background: #fff;
  color: #101216;
  border-bottom: 1px solid #15171a24;
  box-shadow: 0 16px 28px #00000018;
}

.cta,
.btn {
  border-color: #dc0915;
  background: #dc0915;
  color: #fff;
}

.cta:hover,
.btn:hover {
  background: #f11723;
  border-color: #f11723;
}

.btn.alt {
  background: #08090b40;
  color: #fff;
  border-color: #ffffff66;
}

.hero {
  min-height: 610px;
  align-items: center;
  padding: 64px 0 72px;
  background: radial-gradient(circle at 82% 18%, rgba(220, 9, 21, .16), transparent 31%), linear-gradient(135deg, #050608 0%, #0d1110 58%, #151a17 100%);
}

.eyebrow { color: #ff3440; }
.eyebrow::before { background: #dc0915; }
.num { color: #ff3440; }
.light .num { color: #a80711; }

.feature-copy {
  background: linear-gradient(145deg, #d70914 0%, #a9050e 100%);
  color: #fff;
}

.feature-copy li { border-bottom-color: #ffffff38; }
.feature-copy .eyebrow,
.feature-copy .btn.alt { color: #fff !important; }
.feature-copy .eyebrow::before { background: #fff; }
.feature-copy .btn.alt {
  border-color: #fff !important;
  background: transparent !important;
}

.stat b { color: #ff3440; }

.band {
  background: linear-gradient(90deg, #b90711, #e10b18);
  color: #fff;
}

.band .btn.alt {
  color: #fff !important;
  border-color: #fff !important;
  background: transparent !important;
}

.quote { border-left-color: #dc0915; }

.field input:focus,
.field select:focus,
.field textarea:focus {
  outline: 2px solid #dc0915;
  outline-offset: 1px;
}

@media (max-width: 980px) {
  .links.open { top: 182px; }
}

@media (max-width: 620px) {
  .nav { height: 106px; }
  .brand { width: 190px; height: 76px; }
  .brand img { width: 190px; }
  .links.open { top: 148px; }
  .brand-promise { min-height: 42px; gap: 14px; }
  .brand-promise p { font-size: .72rem; letter-spacing: .22em; }
  .brand-promise span { width: 26px; height: 3px; }
  .hero { min-height: 540px; padding: 54px 0 58px; }
}
