:root {
  --cms-blue: #0b5ed7;
  --cms-navy: #0b1635;
  --cms-sky: #eef6ff;
  --cms-green: #108a45;
  --cms-gold: #f7b500;
  --cms-ink: #14213d;
  --cms-muted: #5f6b7a;
  --cms-card: #ffffff;
  --cms-border: rgba(15, 23, 42, .1);
  --cms-shadow: 0 1rem 2.75rem rgba(15, 23, 42, .12);
  --cms-radius: 1.25rem;
}

html { scroll-behavior: smooth; }
body {
  color: var(--cms-ink);
  background: #f8fafc;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  text-rendering: optimizeLegibility;
}

img, video { max-width: 100%; height: auto; }
a { text-underline-offset: .18em; }
.skip-link {
  position: fixed;
  top: .75rem;
  left: .75rem;
  z-index: 2000;
  background: #fff;
  color: var(--cms-navy);
  padding: .65rem .9rem;
  border-radius: .5rem;
  box-shadow: var(--cms-shadow);
}

.site-header {
  position: sticky;
  top: 0;
  z-index: 1030;
  background: #fff;
}
.top-strip {
  background: linear-gradient(90deg, var(--cms-navy), #133b85);
  color: #fff;
}
.top-strip a { color: #fff; text-decoration: none; font-weight: 700; }
.top-strip a:hover { text-decoration: underline; }
.site-alert {
  background: #fff8e6;
  color: #3b2f05;
}
.navbar { padding-top: .85rem; padding-bottom: .85rem; }
.navbar .nav-link { font-weight: 650; color: #273449; }
.navbar .nav-link:hover, .navbar .nav-link:focus { color: var(--cms-blue); }
.dropdown-menu {
  border: 1px solid var(--cms-border);
  border-radius: 1rem;
  padding: .6rem;
  box-shadow: 0 1rem 2rem rgba(15, 23, 42, .12);
}
.dropdown-item { border-radius: .65rem; padding: .55rem .75rem; font-weight: 560; }
.dropdown-item:hover, .dropdown-item:focus { background: var(--cms-sky); color: var(--cms-blue); }

.brand-mark {
  width: 2.6rem;
  height: 2.6rem;
  border-radius: .85rem;
  display: inline-grid;
  place-items: center;
  background: linear-gradient(135deg, #0b5ed7, #0b1635);
  color: #fff;
  font-weight: 900;
  letter-spacing: -.04em;
  box-shadow: 0 .65rem 1rem rgba(11, 94, 215, .25);
  flex: 0 0 auto;
}
.brand-copy { line-height: 1.05; display: grid; color: var(--cms-navy); }
.brand-copy small { color: var(--cms-muted); font-size: .78rem; font-weight: 700; letter-spacing: .02em; }

.btn { border-radius: 999px; font-weight: 750; }
.btn-primary { background: var(--cms-blue); border-color: var(--cms-blue); }
.btn-success, .btn-clover { background: var(--cms-green); border-color: var(--cms-green); color: #fff; }
.btn-apply { background: #d62737; border-color: #d62737; color: #fff; }
.btn-zero { background: #d97806; border-color: #d97806; color: #fff; }
.btn-quote { background: var(--cms-blue); border-color: var(--cms-blue); color: #fff; }
.btn-clover:hover, .btn-apply:hover, .btn-zero:hover, .btn-quote:hover { color: #fff; filter: brightness(.92); }

#main-content { min-height: 55vh; }
.hero-modern {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at top right, rgba(13, 110, 253, .22), transparent 32rem),
    radial-gradient(circle at bottom left, rgba(16, 138, 69, .18), transparent 26rem),
    linear-gradient(135deg, #ffffff 0%, #f0f7ff 52%, #ffffff 100%);
}
.hero-modern:before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: linear-gradient(rgba(11, 22, 53, .04) 1px, transparent 1px), linear-gradient(90deg, rgba(11, 22, 53, .04) 1px, transparent 1px);
  background-size: 34px 34px;
  mask-image: linear-gradient(to bottom, rgba(0,0,0,.75), transparent);
  pointer-events: none;
}
.hero-modern > .container { position: relative; }
.eyebrow {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  padding: .45rem .75rem;
  border-radius: 999px;
  background: rgba(13, 110, 253, .1);
  color: var(--cms-blue);
  font-weight: 800;
  font-size: .86rem;
}
.hero-title {
  font-weight: 900;
  letter-spacing: -.055em;
  color: var(--cms-navy);
}
.hero-lead { color: #334155; font-size: clamp(1.05rem, 1.6vw, 1.25rem); }
.hero-panel {
  border: 1px solid rgba(255,255,255,.8);
  border-radius: 1.5rem;
  background: rgba(255,255,255,.84);
  backdrop-filter: blur(16px);
  box-shadow: var(--cms-shadow);
}
.hero-stat {
  border: 1px solid var(--cms-border);
  border-radius: 1rem;
  padding: 1rem;
  background: #fff;
}
.hero-stat strong { display: block; font-size: 1.5rem; color: var(--cms-navy); }
.hero-stat span { color: var(--cms-muted); font-size: .88rem; }

.section-title { color: var(--cms-navy); font-weight: 900; letter-spacing: -.035em; }
.section-kicker { color: var(--cms-blue); font-weight: 850; text-transform: uppercase; letter-spacing: .08em; font-size: .82rem; }
.cms-card {
  border: 1px solid var(--cms-border);
  border-radius: var(--cms-radius);
  background: #fff;
  box-shadow: 0 .65rem 1.75rem rgba(15, 23, 42, .06);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.cms-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 1rem 2.25rem rgba(15, 23, 42, .1);
  border-color: rgba(13, 110, 253, .25);
}
.icon-badge {
  width: 3rem;
  height: 3rem;
  border-radius: 1rem;
  display: inline-grid;
  place-items: center;
  color: var(--cms-blue);
  background: var(--cms-sky);
  font-size: 1.35rem;
}
.check-list { list-style: none; padding-left: 0; margin-bottom: 0; }
.check-list li { position: relative; padding-left: 1.85rem; margin-bottom: .7rem; }
.check-list li:before {
  content: "✓";
  position: absolute;
  left: 0;
  top: 0;
  width: 1.3rem;
  height: 1.3rem;
  border-radius: 50%;
  display: inline-grid;
  place-items: center;
  background: rgba(16, 138, 69, .12);
  color: var(--cms-green);
  font-weight: 900;
  font-size: .8rem;
}

.savings-calculator {
  background: linear-gradient(135deg, #0b1635, #0f3a7a);
  color: #fff;
  border-radius: 1.5rem;
  box-shadow: var(--cms-shadow);
}
.savings-calculator .form-control, .savings-calculator .form-select {
  border: 0;
  min-height: 3rem;
}
.calculator-result {
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 1rem;
  padding: 1rem;
}
.calculator-result strong { font-size: clamp(1.75rem, 5vw, 2.75rem); }

.hero-video, .merchant-video-frame video {
  border-radius: 1.25rem;
  box-shadow: var(--cms-shadow);
}
.card, .alert, .form-control, .form-select { border-radius: .95rem; }
.form-control:focus, .form-select:focus {
  border-color: rgba(13, 110, 253, .45);
  box-shadow: 0 0 0 .25rem rgba(13, 110, 253, .13);
}
.table { --bs-table-hover-bg: #f2f7ff; }

.site-footer {
  background: linear-gradient(135deg, #0b1635, #071022);
  color: #fff;
}
.footer-links li + li { margin-top: .55rem; }
.footer-links a, .footer-legal a { color: rgba(255,255,255,.72); text-decoration: none; }
.footer-links a:hover, .footer-legal a:hover { color: #fff; text-decoration: underline; }
.floating-cta {
  position: fixed;
  right: 1rem;
  bottom: 1rem;
  z-index: 1020;
  display: flex;
  gap: .5rem;
  flex-wrap: wrap;
  justify-content: flex-end;
}
.floating-cta .btn { box-shadow: 0 .75rem 1.5rem rgba(15, 23, 42, .18); }

@media (max-width: 991.98px) {
  .site-header { position: static; }
  .hero-title { letter-spacing: -.035em; }
  .floating-cta {
    left: .75rem;
    right: .75rem;
    bottom: .75rem;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
  }
  .floating-cta .btn { padding-left: .4rem; padding-right: .4rem; }
  body { padding-bottom: 4.5rem; }
}

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