/* Style: Clean. Light, airy and calm: white cards, soft shadows, one blue accent and the panel's light theme. */
:root {
  --bg: #f7f8fb; --bg-2: #eef2f7; --surface: #ffffff; --surface-2: #f1f4f9;
  --line: rgba(15, 23, 42, .08); --line-strong: rgba(15, 23, 42, .16);
  --text: #0f172a; --muted: #566074; --accent: #2563eb; --accent-2: #0ea5e9; --accent-ink: #ffffff;
  --accent-glow: rgba(37, 99, 235, .24); --nav-bg: rgba(247, 248, 251, .84);
  --frame-bg: #ffffff; --frame-bar: #f3f5f9;
  --cta-bg: radial-gradient(700px 260px at 50% 0%, rgba(37, 99, 235, .10), transparent 70%), #ffffff;
  --radius: 16px; --btn-radius: 999px;
  --shadow: 0 1px 2px rgba(15, 23, 42, .05), 0 18px 48px rgba(15, 23, 42, .10);
  --head-weight: 800; --head-spacing: -.035em;
}
.s-clean .kicker { display: inline-flex; padding: 6px 12px; border-radius: 999px; background: rgba(37, 99, 235, .08);
  font: 700 13px/1.2 var(--font); letter-spacing: .02em; text-transform: none; }
.s-clean .hero-center .kicker, .s-clean .section-head .kicker { margin: 0 auto; }
.s-clean .section-head { display: flex; flex-direction: column; align-items: center; }
.s-clean .btn-ghost { background: #fff; box-shadow: 0 1px 2px rgba(15, 23, 42, .06); }
.s-clean .btn-ghost:hover { background: #fff; border-color: var(--accent); color: var(--accent); }
.s-clean .icon-btn:hover { background: rgba(15, 23, 42, .05); }
.s-clean .nav-links a:hover { background: rgba(15, 23, 42, .05); }
.s-clean .nav.open .nav-links { background: #fff; }

.s-clean .hero { padding-bottom: 40px; background: radial-gradient(1100px 520px at 50% -12%, rgba(37, 99, 235, .12), transparent 70%); }
.s-clean .hero h1 { max-width: 15ch; margin-inline: auto; }
.hero-shot { position: relative; max-width: 1060px; margin: 56px auto 0; }
.hero-shot .teaser { box-shadow: 0 2px 4px rgba(15, 23, 42, .04), 0 40px 90px rgba(15, 23, 42, .16); }
@media (max-width: 600px) { .hero-shot { margin-top: 36px; } }

.s-clean .strip { background: #fff; }
.s-clean .strip .wrap { font: 600 14px/1.4 var(--font); letter-spacing: 0; text-transform: none; }
.s-clean .frame, .s-clean .g-item, .s-clean .thumb { border-color: rgba(15, 23, 42, .1); }
.s-clean .tile, .s-clean .step, .s-clean .plan { box-shadow: 0 1px 2px rgba(15, 23, 42, .04), 0 8px 24px rgba(15, 23, 42, .05); }
.s-clean .tile .bi { display: inline-grid; place-items: center; width: 46px; height: 46px; border-radius: 12px; background: rgba(37, 99, 235, .08); font-size: 22px; }
.s-clean .tour { background: linear-gradient(180deg, transparent, var(--bg-2) 30%, var(--bg-2) 70%, transparent); }
.s-clean .tour-card { border: 0; }
.s-clean .play { box-shadow: 0 10px 30px rgba(37, 99, 235, .4); }
.s-clean .phone { background: #0f172a; border-color: #0f172a; }
.s-clean .plan.popular { box-shadow: 0 0 0 2px var(--accent), 0 24px 60px rgba(37, 99, 235, .16); border-color: transparent; }
.s-clean .faq .qa { border-color: rgba(15, 23, 42, .1); }
.s-clean .footer { background: #fff; }
.s-clean .modal::backdrop { background: rgba(15, 23, 42, .78); }

/* the nav bar and footer span the whole window */
.s-clean .nav > .wrap, .s-clean .footer > .wrap { max-width: none; padding-left: 32px; padding-right: 32px; }
.s-clean .nav { border-bottom-color: var(--line); background: rgba(255, 255, 255, .86); }
.s-clean .foot-notes { max-width: none; }
@media (max-width: 600px) { .s-clean .nav > .wrap, .s-clean .footer > .wrap { padding-left: 16px; padding-right: 16px; } }