:root {
  color-scheme: light;
  font-synthesis: none;
}

html {
  scroll-padding-top: 84px;
}

body {
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

:where(a, button, input, select, textarea, summary):focus-visible {
  outline: 3px solid color-mix(in srgb, var(--primary, #0757c7) 28%, transparent);
  outline-offset: 3px;
}

.nav {
  box-shadow: 0 8px 24px rgba(16, 32, 51, .04);
}

.nav a:not(.brand) {
  position: relative;
  font-weight: 600 !important;
}

.nav a:not(.brand)::after {
  position: absolute;
  right: 0;
  bottom: -8px;
  left: 0;
  height: 2px;
  background: var(--primary, #0757c7);
  content: '';
  opacity: 0;
  transform: scaleX(.65);
  transition: opacity .16s ease, transform .16s ease;
}

.nav a:not(.brand):hover::after {
  opacity: 1;
  transform: scaleX(1);
}

.hero h1 {
  max-width: 18ch;
  text-wrap: balance;
  letter-spacing: 0 !important;
}

.hero p,
.section-title,
.split > div:first-child {
  text-wrap: pretty;
}

.btn {
  min-height: 48px !important;
  border: 1px solid transparent;
  border-radius: 8px !important;
  padding-right: 22px !important;
  padding-left: 22px !important;
  font-weight: 700 !important;
  box-shadow: 0 10px 24px color-mix(in srgb, var(--primary, #0757c7) 20%, transparent);
  transition: transform .16s ease, box-shadow .16s ease, filter .16s ease;
}

.btn:hover {
  filter: brightness(1.06);
  transform: translateY(-2px);
  box-shadow: 0 14px 30px color-mix(in srgb, var(--primary, #0757c7) 26%, transparent);
}

.hero-card,
.card,
.showcase article,
.price-grid article,
.proof-grid div,
.steps li,
details {
  border-radius: 8px !important;
  box-shadow: 0 10px 28px rgba(16, 32, 51, .07) !important;
  transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.card:hover,
.showcase article:hover,
.price-grid article:hover,
.proof-grid div:hover,
.steps li:hover {
  border-color: color-mix(in srgb, var(--primary, #0757c7) 35%, var(--line, #d8e1ec));
  box-shadow: 0 16px 34px rgba(16, 32, 51, .1) !important;
  transform: translateY(-3px);
}

.hero-card img,
.feature-panel img,
.showcase img {
  transition: transform .45s cubic-bezier(.2,.8,.2,1), filter .3s ease;
}

.hero-card:hover img,
.feature-panel:hover img,
.showcase article:hover img {
  transform: scale(1.025);
}

.section-title span,
.eyebrow,
.card > span {
  letter-spacing: 0 !important;
}

details summary {
  cursor: pointer;
  font-weight: 650;
}

details summary::marker {
  color: var(--primary, #0757c7);
}

@media (max-width: 900px) {
  .nav .wrap {height: 64px;}
  .hero {padding-top: 60px !important; padding-bottom: 64px !important;}
  .section, .proof {padding-top: 56px !important; padding-bottom: 56px !important;}
  .hero h1 {font-size: clamp(36px, 11vw, 54px) !important;}
  .cta-grid .btn {width: 100%;}
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }
}