:root{
  --kapesa-blue:#0b0b8f;
  --kapesa-blue-dark:#07075f;
  --kapesa-gold:#f59e0b;
  --kapesa-ink:#171a22;
  --kapesa-muted:#626978;
  --kapesa-bg:#f5f7fb;
  --kapesa-white:#ffffff;
  --kapesa-border:#e4e8f0;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--kapesa-ink);background:var(--kapesa-bg)}
a{text-decoration:none}
.public-nav{background:rgba(11,11,143,.97);backdrop-filter:blur(12px);box-shadow:0 8px 24px rgba(7,7,95,.15)}
.brand-mark{width:42px;height:42px;border-radius:13px;display:grid;place-items:center;background:var(--kapesa-gold);color:var(--kapesa-blue-dark);font-weight:900;font-size:1.35rem;box-shadow:0 8px 18px rgba(245,158,11,.25)}
.brand-title{font-weight:800;color:#fff;line-height:1}.brand-subtitle{font-size:.7rem;color:rgba(255,255,255,.72);letter-spacing:.06em;text-transform:uppercase}
.navbar-toggler{border-color:rgba(255,255,255,.25)}.navbar-toggler:focus{box-shadow:none}.navbar-toggler-icon{filter:brightness(0) invert(1)}
.public-nav .nav-link{color:rgba(255,255,255,.85);font-weight:600}.public-nav .nav-link:hover{color:#fff}
.btn-kapesa{background:var(--kapesa-gold);border:1px solid var(--kapesa-gold);color:#17110a;font-weight:800;border-radius:12px;padding:.78rem 1.2rem;box-shadow:0 10px 24px rgba(245,158,11,.22)}
.btn-kapesa:hover{background:#e58f00;border-color:#e58f00;color:#17110a;transform:translateY(-1px)}
.btn-kapesa-outline{border:1px solid rgba(255,255,255,.5);color:#fff;font-weight:700;border-radius:12px;padding:.78rem 1.2rem}.btn-kapesa-outline:hover{background:#fff;color:var(--kapesa-blue)}
.hero{position:relative;overflow:hidden;background:linear-gradient(135deg,var(--kapesa-blue-dark),var(--kapesa-blue) 60%,#2020b8);color:#fff;padding:7.5rem 0 5rem}
.hero:before,.hero:after{content:"";position:absolute;border-radius:50%;filter:blur(2px);opacity:.16;background:#fff}.hero:before{width:360px;height:360px;right:-130px;top:-150px}.hero:after{width:220px;height:220px;left:-100px;bottom:-90px}
.hero-badge{display:inline-flex;align-items:center;gap:.55rem;padding:.48rem .78rem;border-radius:999px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.18);font-size:.86rem;font-weight:700}
.hero h1{font-size:clamp(2.5rem,7vw,4.9rem);line-height:1.02;font-weight:900;letter-spacing:-.045em;max-width:760px}.hero .lead{font-size:clamp(1.05rem,2vw,1.3rem);line-height:1.65;color:rgba(255,255,255,.83);max-width:660px}
.trust-row{display:flex;flex-wrap:wrap;gap:1.1rem;color:rgba(255,255,255,.78);font-size:.9rem}.trust-row span{display:flex;align-items:center;gap:.4rem}
.app-preview{position:relative;max-width:480px;margin:auto}.phone-shell{background:#111827;border:8px solid #202535;border-radius:34px;padding:14px;box-shadow:0 34px 60px rgba(0,0,0,.34);transform:rotate(1.5deg)}
.app-screen{background:#f6f7fb;border-radius:22px;overflow:hidden;min-height:525px}.preview-top{background:var(--kapesa-blue);color:#fff;padding:1rem}.preview-card{background:#fff;border-radius:16px;padding:1rem;box-shadow:0 8px 22px rgba(32,42,74,.08)}.metric-value{font-size:1.55rem;font-weight:900}.mini-bar{height:7px;border-radius:999px;background:#e6e9f1;overflow:hidden}.mini-bar span{display:block;height:100%;background:var(--kapesa-gold);border-radius:inherit}
.floating-note{position:absolute;background:#fff;color:var(--kapesa-ink);padding:.8rem 1rem;border-radius:14px;box-shadow:0 16px 35px rgba(0,0,0,.2);font-weight:800;font-size:.88rem}.note-one{left:-28px;top:96px}.note-two{right:-22px;bottom:70px}
.section-pad{padding:5rem 0}.section-eyebrow{color:var(--kapesa-blue);font-weight:900;letter-spacing:.1em;text-transform:uppercase;font-size:.78rem}.section-title{font-size:clamp(2rem,4vw,3rem);font-weight:900;letter-spacing:-.035em}.section-copy{color:var(--kapesa-muted);font-size:1.06rem;line-height:1.75}
.feature-card{height:100%;background:#fff;border:1px solid var(--kapesa-border);border-radius:20px;padding:1.55rem;transition:.2s ease;box-shadow:0 10px 32px rgba(22,30,54,.05)}.feature-card:hover{transform:translateY(-5px);box-shadow:0 18px 40px rgba(22,30,54,.1)}
.feature-icon{width:50px;height:50px;border-radius:15px;display:grid;place-items:center;background:rgba(11,11,143,.08);color:var(--kapesa-blue);font-size:1.35rem;margin-bottom:1rem}.feature-card h3{font-size:1.15rem;font-weight:850}.feature-card p{color:var(--kapesa-muted);margin:0;line-height:1.65}
.why-band{background:#fff}.why-item{display:flex;gap:1rem}.why-number{flex:0 0 42px;height:42px;border-radius:13px;display:grid;place-items:center;background:var(--kapesa-gold);font-weight:900;color:#291b00}.why-item h3{font-size:1.08rem;font-weight:850}.why-item p{color:var(--kapesa-muted)}
.cta-card{background:linear-gradient(135deg,var(--kapesa-blue-dark),var(--kapesa-blue));color:#fff;border-radius:28px;padding:clamp(2rem,5vw,4rem);box-shadow:0 22px 55px rgba(11,11,143,.22)}
.site-footer{background:#171a22;color:#fff;padding:2.5rem 0}.site-footer a{color:#cbd1dc}.site-footer a:hover{color:#fff}.footer-note{color:#9ba3b2}
.login-page{min-height:100vh;background:linear-gradient(145deg,#eff2fb,#fff 55%,#f7f8fb)}
.login-brand-panel{background:linear-gradient(145deg,var(--kapesa-blue-dark),var(--kapesa-blue));color:#fff;min-height:100vh;padding:3rem;display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden}.login-brand-panel:after{content:"";position:absolute;width:380px;height:380px;border-radius:50%;background:rgba(255,255,255,.08);right:-150px;bottom:-140px}.login-card{width:min(470px,92vw);border:0;border-radius:24px;box-shadow:0 20px 55px rgba(34,43,72,.12);padding:clamp(1.7rem,5vw,2.7rem)}
.form-control{min-height:54px;border-radius:12px;border-color:#dce1ea;padding:.8rem 1rem}.form-control:focus{border-color:var(--kapesa-blue);box-shadow:0 0 0 .22rem rgba(11,11,143,.1)}.login-submit{min-height:54px;border-radius:12px;background:var(--kapesa-blue);border-color:var(--kapesa-blue);font-weight:800}.login-submit:hover{background:var(--kapesa-blue-dark);border-color:var(--kapesa-blue-dark)}
@media(max-width:991.98px){.hero{padding-top:6.5rem}.app-preview{margin-top:3rem}.note-one{left:0}.note-two{right:0}.login-brand-panel{min-height:auto;padding:1.3rem}.login-brand-copy{display:none}}
@media(max-width:575.98px){.hero{padding-bottom:3.5rem}.hero h1{font-size:2.8rem}.hero-actions .btn{width:100%}.section-pad{padding:3.7rem 0}.phone-shell{border-width:6px;border-radius:28px}.app-screen{min-height:480px}.floating-note{font-size:.76rem}.note-one{top:80px}.site-footer{text-align:center}}