:root{
  --ink:#0e091b;
  --muted:#666273;
  --line:#e8e5ed;
  --paper:#faf9fc;
  --card:#ffffff;
  --accent:#ff9ec6;
  --soft:#f1eef5;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:"DM Sans",system-ui,sans-serif;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
.nav{height:78px;display:flex;align-items:center;justify-content:space-between;padding:0 5vw;border-bottom:1px solid var(--line);background:rgba(250,249,252,.88);backdrop-filter:blur(14px);position:sticky;top:0;z-index:20}
.brand{display:flex;align-items:center;gap:10px;font-size:18px;font-weight:700;letter-spacing:-.03em}
.brand-mark{width:31px;height:31px;border-radius:10px;background:var(--accent);color:var(--ink);display:grid;place-items:center;font-weight:700}
.nav-links{display:flex;gap:34px;font-size:14px;color:#555}
.nav-links a:hover,.text-link:hover{opacity:.65}
.nav-cta{background:var(--ink);color:white;padding:12px 17px;border-radius:999px;font-size:13px;font-weight:600}
.hero{min-height:760px;max-width:1320px;margin:auto;padding:105px 5vw 80px;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:40px;overflow:hidden}
.eyebrow{font-size:11px;letter-spacing:.16em;font-weight:700;color:#72716d}
.eyebrow span{display:inline-block;width:7px;height:7px;background:var(--accent);border-radius:50%;margin-right:8px}
h1{font-size:clamp(54px,6.2vw,88px);line-height:.95;letter-spacing:-.065em;margin:24px 0 30px;font-weight:700}
h1 em{font-style:normal;color:#777}
.hero-text{max-width:530px;font-size:18px;line-height:1.6;color:var(--muted);margin:0 0 32px}
.hero-actions{display:flex;gap:12px}
.store-button{background:var(--ink);color:white;border-radius:13px;padding:11px 17px;display:flex;align-items:center;gap:10px;min-width:150px}
.store-button small{display:block;font-size:8px;color:#bbb}.store-button strong{display:block;font-size:13px;margin-top:1px}.store-icon{font-size:24px}.play-icon{font-size:18px}
.microcopy{font-size:11px;color:#8b8984;margin-top:14px}
.hero-visual{height:600px;position:relative;display:flex;align-items:center;justify-content:center}
.glow{position:absolute;width:440px;height:440px;border-radius:50%;background:var(--accent);filter:blur(90px);opacity:.42}
.phone{width:290px;height:590px;background:#0b0b0b;border:8px solid #111;border-radius:42px;box-shadow:0 40px 90px rgba(0,0,0,.2);position:relative;z-index:2;transform:rotate(3deg)}
.phone-back{position:absolute;transform:translate(-100px,22px) rotate(-10deg);opacity:.25;z-index:1}
.phone-screen{height:100%;border-radius:33px;background:#f8f8f5;padding:38px 18px 18px;overflow:hidden}
.dynamic-island{position:absolute;top:13px;left:50%;transform:translateX(-50%);width:92px;height:25px;border-radius:20px;background:#000;z-index:3}
.screen-top{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:15px}.screen-label{display:block;font-size:10px;color:#777}.screen-top strong{font-size:24px;letter-spacing:-.05em}.avatar{width:28px;height:28px;border-radius:50%;background:#222;color:#fff;display:grid;place-items:center;font-size:11px}
.search{font-size:9px;color:#8a8985;background:#f0edf4;border-radius:9px;padding:11px 9px;margin-bottom:12px}
.filter-row{display:flex;gap:6px;margin-bottom:14px}.filter{font-size:9px;padding:6px 10px;background:#e9e9e5;border-radius:99px}.filter.active{background:#151515;color:#fff}
.campaign{border-radius:16px;padding:16px;margin-bottom:10px}.hero-card{background:#161616;color:#fff}.light-card{background:#f3eaf0}.bank-row{display:flex;justify-content:space-between;font-size:8px;opacity:.7}.bank-row span{font-weight:700}.campaign h3{font-size:17px;line-height:1.05;letter-spacing:-.04em;margin:26px 0 24px}.campaign-foot{font-size:8px;opacity:.55;display:flex;justify-content:space-between}
.muted-screen{background:#f0efeb}.mini-status{height:8px;width:60px;background:#d5d4cf;border-radius:99px;margin-bottom:35px}.mini-title{font-weight:700;font-size:24px;margin-bottom:20px}.mini-card{height:160px;background:#d9d8d2;border-radius:18px;margin-bottom:12px}.mini-card.short{height:110px}
.logo-strip{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:28px 5vw;display:flex;align-items:center;justify-content:space-between;gap:30px;font-size:11px;color:#85827c}.logo-strip div{display:flex;gap:40px;align-items:center;color:#56534e;font-size:12px;letter-spacing:-.02em}
.section{max-width:1320px;margin:auto;padding:150px 5vw}.section-heading{max-width:680px}.section-heading h2,.calculator-copy h2,.final-cta h2{font-size:clamp(42px,5vw,68px);line-height:.98;letter-spacing:-.06em;margin:20px 0}.section-heading p{font-size:16px;line-height:1.65;color:var(--muted);max-width:520px}
.feature-grid{display:grid;grid-template-columns:1.2fr .9fr .9fr;gap:14px;margin-top:70px}.feature{min-height:490px;background:var(--card);border:1px solid var(--line);border-radius:24px;padding:28px;position:relative;overflow:hidden}.feature-large{background:#f9e8f0}.number{font-size:10px;color:#8c8a84;font-weight:700}.feature h3{font-size:31px;line-height:1;letter-spacing:-.05em;margin:60px 0 18px}.feature p{font-size:14px;line-height:1.6;color:var(--muted);max-width:310px}.floating-list{position:absolute;bottom:28px;left:28px;right:28px;background:white;border:1px solid #e4e4df;border-radius:17px;overflow:hidden;box-shadow:0 20px 50px rgba(0,0,0,.07)}.floating-list div{display:grid;grid-template-columns:34px 1fr auto;align-items:center;gap:9px;padding:12px;border-bottom:1px solid #eee}.floating-list div:last-child{border:0}.floating-list i{width:27px;height:27px;border-radius:8px;background:#f7e2ed;display:grid;place-items:center;font-style:normal;font-size:10px;font-weight:700}.floating-list span,.floating-list b{font-size:10px}.floating-list b{color:#00852a}.filter-demo{position:absolute;bottom:32px;left:28px;display:flex;gap:7px;flex-wrap:wrap}.filter-demo span{padding:8px 11px;border-radius:99px;background:#f0edf4;font-size:9px}.filter-demo .selected{background:#151515;color:white}.detail-demo{position:absolute;bottom:32px;left:28px;right:28px;border-top:1px solid var(--line);padding-top:15px;display:flex;justify-content:space-between;font-size:10px}.detail-demo strong{font-size:14px}
.calculator-section{background:#171717;color:white;display:grid;grid-template-columns:1fr 430px;gap:100px;align-items:center;padding:140px max(5vw,calc((100vw - 1180px)/2));}.calculator-section .eyebrow{color:#92928e}.calculator-copy p{color:#a5a5a0;line-height:1.65;max-width:480px}.text-link{display:inline-flex;gap:14px;margin-top:24px;font-size:14px;font-weight:600}.calculator-card{background:#f5f5f1;color:#151515;border-radius:25px;padding:26px;box-shadow:0 30px 70px rgba(0,0,0,.25)}.calc-head{display:flex;justify-content:space-between;font-size:12px;font-weight:700;margin-bottom:38px}.dots{letter-spacing:3px;color:#aaa}.calculator-card label{font-size:10px;color:#777}.amount{font-size:48px;font-weight:700;letter-spacing:-.06em;margin:7px 0 24px}.amount small{font-size:18px;letter-spacing:0}.calc-rule{height:1px;background:#ddd;margin-bottom:4px}.calc-row,.calc-result{display:flex;justify-content:space-between;padding:15px 0;font-size:11px}.calc-row strong{font-size:13px}.calc-result{border-top:1px solid #ddd;margin-top:5px;padding-top:19px}.calc-result strong{font-size:22px}
.steps{max-width:1320px;margin:auto;padding:150px 5vw}.centered{text-align:center;margin:auto}.centered p{margin-left:auto;margin-right:auto}.step-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin-top:80px;border-top:1px solid var(--line)}.step{padding:30px 35px 20px 0;border-right:1px solid var(--line);min-height:190px}.step:not(:first-child){padding-left:35px}.step:last-child{border:0}.step span{font-size:10px;color:#85827d}.step h3{font-size:25px;letter-spacing:-.04em;margin:42px 0 10px}.step p{font-size:13px;color:var(--muted);line-height:1.55}
.final-cta{max-width:1180px;margin:0 auto 90px;background:var(--accent);border-radius:32px;padding:70px;display:flex;align-items:end;justify-content:space-between;gap:40px}.final-cta .eyebrow{color:#4f5c20}.final-cta h2{font-size:55px;margin-bottom:18px}.final-cta p{margin:0;color:#4e582a}.dark-button{background:#151515;color:#fff;border-radius:999px;padding:15px 21px;font-size:13px;font-weight:600;white-space:nowrap}.dark-button span{margin-left:18px}
footer{border-top:1px solid var(--line);padding:35px 5vw;display:flex;align-items:center;justify-content:space-between;color:#85827c;font-size:11px}footer .brand{color:var(--ink);font-size:15px}footer .brand-mark{width:27px;height:27px;border-radius:8px;font-size:13px}footer div:last-child{display:flex;gap:22px}
@media(max-width:900px){.nav-links{display:none}.hero{grid-template-columns:1fr;padding-top:70px}.hero-visual{height:570px}.logo-strip{display:block}.logo-strip div{margin-top:20px;gap:18px;flex-wrap:wrap}.feature-grid{grid-template-columns:1fr}.feature{min-height:400px}.calculator-section{grid-template-columns:1fr;padding:90px 7vw;gap:45px}.steps{padding:100px 7vw}.final-cta{margin:0 5vw 60px;padding:45px 30px;display:block}.final-cta h2{font-size:42px}.dark-button{display:inline-block;margin-top:30px}footer{gap:20px;flex-wrap:wrap}}
@media(max-width:520px){.nav{padding:0 20px}.nav-cta{font-size:11px}.hero{padding-left:20px;padding-right:20px}.hero h1{font-size:51px}.hero-text{font-size:16px}.hero-actions{flex-direction:column;width:max-content}.hero-visual{height:500px}.phone{width:245px;height:500px}.phone-back{transform:translate(-70px,15px) rotate(-10deg)}.logo-strip{padding:25px 20px}.section{padding:100px 20px}.section-heading h2,.calculator-copy h2{font-size:45px}.calculator-section{padding:85px 20px}.calculator-card{padding:22px}.step-grid{grid-template-columns:1fr}.step,.step:not(:first-child){border-right:0;border-bottom:1px solid var(--line);padding:25px 0}.step h3{margin-top:25px}.final-cta{margin-left:20px;margin-right:20px}.final-cta h2{font-size:39px}footer{padding:28px 20px}}

/* Bonusops app brand assets */
.brand-logo{display:block;width:150px;height:auto;max-height:38px;object-fit:contain}
.brand-mark{background:var(--accent);color:var(--ink)}
@media(max-width:520px){.brand-logo{width:128px;max-height:32px}}