*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; padding: 0; background: #150F22; color: #F3F0F8; font-family: 'Inter', system-ui, sans-serif; -webkit-font-smoothing: antialiased; scroll-behavior: smooth; }
a { color: inherit; text-decoration: none; }
a:hover { color: #7EE7C7; }
input[type=range] { -webkit-appearance: none; appearance: none; height: 8px; border-radius: 100px; outline: none; }
input[type=range]::-webkit-slider-thumb { -webkit-appearance: none; width: 24px; height: 24px; border-radius: 50%; background: #fff; border: 3px solid #8A5FC7; cursor: pointer; box-shadow: 0 4px 14px rgba(0,0,0,0.4); }
input[type=range]::-moz-range-thumb { width: 24px; height: 24px; border-radius: 50%; background: #fff; border: 3px solid #8A5FC7; cursor: pointer; }
::selection { background: rgba(138,95,199,0.4); }
@keyframes sfMarquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@keyframes sfFade { from { opacity:0; transform:translateY(10px);} to { opacity:1; transform:none;} }
@media (prefers-reduced-motion: reduce) { [style*="sfMarquee"] { animation: none !important; } }
@media (max-width: 860px) {
  nav.sfNav { padding: 14px 20px !important; top: 38px !important; }
  .sfNavLinks { display: none !important; }
  .sfEsealSteps { grid-template-columns: 1fr !important; }
  .sfEsealSteps > div:nth-child(2), .sfEsealSteps > div:nth-child(4) { display: none !important; }
  section, .sfCookie { padding-left: 20px !important; padding-right: 20px !important; }
  section > div { max-width: 100% !important; }
  .sfHero > div { padding-left: 20px !important; padding-right: 20px !important; }
  .sfH1 { font-size: 34px !important; }
  .sfHeroP { font-size: 16px !important; max-width: 100% !important; }
  .sfH2 { font-size: 30px !important; }
  .sfPanelTitle { font-size: 27px !important; }
  .sfChooserGrid, .sfWhyGrid, .sfStepsGrid, .sfSecGrid, .sfCalcGrid { grid-template-columns: 1fr !important; }
  .sfBenefitGrid { grid-template-columns: none !important; grid-auto-flow: column !important; grid-auto-columns: 82% !important; overflow-x: auto !important; scroll-snap-type: x mandatory !important; }
  .sfBenefitGrid > div { scroll-snap-align: start; border-left: none !important; border-right: 1px solid rgba(255,255,255,0.08) !important; }
  .sfBenefitGrid > div:last-child { border-right: none !important; }
  .sfSecSticky { position: static !important; }
  .sfStepsText { padding: 28px !important; }
  .sfStepsTabs { justify-content: flex-start !important; overflow-x: auto !important; flex-wrap: nowrap !important; padding-bottom: 4px; }
  .sfStepsTabs button { flex-shrink: 0; }
  .sfCtaBtns { flex-direction: column !important; align-items: stretch !important; gap: 14px !important; }
  .sfCtaBtns a { font-size: 14px !important; padding: 16px 20px !important; white-space: normal !important; text-align: center; justify-content: center; }
  .sfFooterRow { flex-direction: column !important; align-items: stretch !important; text-align: center !important; }
  .sfFooterRow > div { justify-content: center !important; }
  .sfCookie { left: 12px !important; right: 12px !important; bottom: 12px !important; flex-direction: column !important; align-items: stretch !important; }
}
