/* Original Modilo palette, with the alternate typography and video placement. */
header.site-nav {
  background: rgba(10, 10, 14, .82);
  backdrop-filter: blur(22px) saturate(120%);
  -webkit-backdrop-filter: blur(22px) saturate(120%);
  border-bottom: 1px solid rgba(255,255,255,.09);
}
.site-nav .logo-mark img { filter: none; opacity: 1; }
nav.primary a { color: rgba(255,255,255,.72); }
nav.primary a:hover { color: #fff; }
.hero h1 { font-weight: 800; line-height: 1.06; letter-spacing: -.045em; }
.hero h1 .grad { font-style: normal; font-weight: inherit; }
.section-title, .final-cta h2 { font-weight: 800; letter-spacing: -.035em; }
.btn { border-radius: 999px; font-weight: 700; }
.hero-eyebrow { border-radius: 999px; padding: 8px 16px; font-weight: 600; }
.features-tab { border-radius: 999px; }
.promo-video { margin-top: 76px; margin-bottom: 0; }
.hero { padding-bottom: 72px; }
.promo-video-frame { border-color: rgba(255,255,255,.14); box-shadow: 0 18px 55px rgba(0,0,0,.2); }
.promo-video-heading, .promo-video-link { color: rgba(255,255,255,.6); }
.promo-video-link:hover { color: #fff; }
.section-eyebrow, .why-badge-tag, .calc-eyebrow, .enterprise-eyebrow, .promo-video-heading { font-weight: 600; letter-spacing: .09em; }
.features .feat-name, .how .step-title, .faq-item summary { font-weight: 700; }
@media (max-width: 600px) {
  .hero h1 { font-size: clamp(34px, 8.5vw, 48px); line-height: 1.1; }
  .hero .hero-actions .btn { white-space: normal; }
  .promo-video { margin-top: 44px; }
}