@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700;800;900&display=swap');

/* Sparkle Signal Scan™ landing page (2026). Scoped under .ss. Clean, spacious
   premium layout in the brand palette, with a subtle radar/signal motif in the
   hero. Defensive resets guard against Bricks globals. */
.ss{--coral:#FB4A2C;--cyan:#10B7EF;--ink:#0E1822;--cream:#FCF4DE;--mut:#54627a;--line:#e7ecf2;font-family:'Poppins',sans-serif;color:var(--ink);line-height:1.5}
.ss *{box-sizing:border-box}
.ss p{margin:0}.ss ul{list-style:none;margin:0;padding:0}
.ss .sec{padding:60px 40px;margin:0}
.ss .sec.cream{background:var(--cream)}
.ss .sec.ink{background:var(--ink)}
.ss .in{max-width:1000px;margin:0 auto}
.ss .eye{display:inline-flex;align-items:center;gap:9px;font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--coral);margin:0 0 14px}
.ss .eye:before{content:"";width:24px;height:3px;border-radius:2px;background:var(--coral)}
.ss h2{font-size:clamp(24px,3.2vw,31px);font-weight:800;letter-spacing:-.03em;line-height:1.1;margin:0 0 14px;color:var(--ink)}
.ss .lead{font-size:16px;color:var(--mut);line-height:1.64;max-width:640px;margin:0 0 12px}
.ss a.pill,.ss button.pill{display:inline-block;border-radius:999px;font-weight:600;padding:15px 32px;font-size:14.5px;text-decoration:none;cursor:pointer;background:var(--coral);color:#fff;border:0;margin-top:20px;font-family:'Poppins',sans-serif;transition:transform .15s}
.ss a.pill:hover{transform:translateY(-2px)}
.ss .sec.ink h2{color:#fff}.ss .sec.ink .lead{color:#aebfd2}.ss .sec.ink .eye{color:var(--cyan)}.ss .sec.ink .eye:before{background:var(--cyan)}

/* Hero with radar motif */
.ss-hero{position:relative;overflow:hidden;background:linear-gradient(135deg,#16345f 0%,#0e2444 100%);padding:74px 40px}
.ss-hero .in{position:relative;z-index:2}
.ss-hero .radar{position:absolute;right:-80px;top:50%;transform:translateY(-50%);width:520px;height:520px;z-index:1;opacity:.5;pointer-events:none}
.ss-hero .eye{color:var(--cyan)}.ss-hero .eye:before{background:var(--cyan)}
.ss-hero h1{font-size:clamp(34px,4.8vw,48px);font-weight:900;letter-spacing:-.035em;line-height:1.05;margin:0 0 16px;color:#fff;max-width:660px}
.ss-hero .lead{color:#dbe6f2;max-width:600px}
.ss-hero .lead+.lead{margin-top:10px}

/* Question list */
.ss-q{margin-top:18px}
.ss-q li{position:relative;padding:13px 0 13px 30px;font-size:15.5px;color:var(--ink);border-top:1px solid var(--line);line-height:1.45}
.ss-q li:first-child{border-top:0}
.ss-q li:before{content:"";position:absolute;left:0;top:20px;width:14px;height:14px;border-radius:50%;border:3px solid var(--cyan)}

/* Chips */
.ss .chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.ss .chips span{font-size:12.5px;font-weight:500;color:#3a4757;background:#fff;border:1px solid var(--line);border-radius:999px;padding:8px 14px}
.ss .sec.cream .chips span{background:#fff}

/* How it works steps */
.ss-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:32px}
.ss-step{background:#ffffff09;border:1px solid #ffffff1f;border-radius:14px;padding:24px}
.ss-step .n{width:38px;height:38px;border-radius:50%;background:var(--cyan);color:#0e2444;font-weight:800;display:flex;align-items:center;justify-content:center;font-size:16px;margin-bottom:14px}
.ss-step h4{color:#fff;font-size:16.5px;font-weight:800;margin:0 0 7px;letter-spacing:-.01em}
.ss-step p{color:#aebfd2;font-size:13.5px;line-height:1.55;margin:0}

/* Pull quote */
.ss-quote{font-size:clamp(20px,2.6vw,26px);font-weight:800;letter-spacing:-.02em;line-height:1.28;color:var(--ink);max-width:700px;margin:28px 0 0}
.ss-quote .a{color:var(--coral)}.ss-quote .b{color:var(--cyan)}

/* Important note */
.ss-note{border:1px solid #f3d6cf;background:#fdf4f1;border-left:4px solid var(--coral);border-radius:14px;padding:24px 26px;margin-top:6px}
.ss-note .lead{margin:0}
.ss-note .lead+.lead{margin-top:10px}

/* Form section */
.ss-formwrap{max-width:620px;margin:30px auto 0;background:#fff;border:1px solid var(--line);border-radius:18px;padding:34px 32px;box-shadow:0 24px 50px -28px rgba(8,18,28,.4)}
.ss-form .in{text-align:center}
.ss-form .lead{margin-left:auto;margin-right:auto}

@media(max-width:680px){.ss-steps{grid-template-columns:1fr}.ss .sec,.ss-hero{padding-left:24px;padding-right:24px}.ss .sec{padding-top:46px;padding-bottom:46px}.ss-hero .radar{display:none}.ss-formwrap{padding:26px 20px}}