/* ===================================================
   DESIGN SYSTEM  (shared by all public pages)
   =================================================== */
:root {
  --ink:      #07152B;
  --ink-2:    #0c1f3a;
  --glass:    rgba(255,255,255,0.045);
  --glass-b:  rgba(255,255,255,0.09);
  --glass-b2: rgba(255,255,255,0.06);
  --cyan:     #2D9CDB;
  --cyan-d:   #1e7bb0;
  --teal:     #38D9A9;
  --teal-d:   #2bb893;
  --amber:    #F5A623;
  --amber-d:  #d4861a;
  --rose:     #FF6B6B;
  --purple:   #A78BFA;
  --text:     #EEF3FF;
  --text-2:   rgba(200,215,240,0.72);
  --text-3:   rgba(155,180,220,0.48);
  --glow-c:   0 0 22px rgba(45,156,219,0.32);
  --glow-t:   0 0 22px rgba(56,217,169,0.28);
  --glow-a:   0 0 22px rgba(245,166,35,0.28);
  --r-sm: 16px; --r-md: 22px; --r-lg: 28px; --r-xl: 36px;
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  font-family:'Inter',sans-serif;
  background:var(--ink);
  color:var(--text);
  overflow-x:hidden;
  line-height:1.55;
}
body::before{
  content:'';position:fixed;inset:0;pointer-events:none;z-index:0;
  background:
    radial-gradient(ellipse 70% 55% at 15% 18%, rgba(45,156,219,0.13) 0%, transparent 65%),
    radial-gradient(ellipse 55% 40% at 82% 82%, rgba(56,217,169,0.09) 0%, transparent 55%),
    radial-gradient(ellipse 40% 30% at 55% 50%, rgba(245,166,35,0.04) 0%, transparent 50%);
  animation:ambientPulse 18s ease-in-out infinite alternate;
}
@keyframes ambientPulse{0%{opacity:.55}100%{opacity:1}}

/* SHAPES */
.bg-shapes{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden;}
.bg-shape{position:absolute;border-radius:50%;animation:bsFloat 28s infinite ease-in-out;}
.bs1{width:520px;height:520px;top:-160px;right:-120px;background:radial-gradient(circle,rgba(45,156,219,0.07),transparent 70%);animation-delay:0s;}
.bs2{width:380px;height:380px;bottom:-100px;left:-80px;background:radial-gradient(circle,rgba(56,217,169,0.06),transparent 70%);animation-delay:-8s;}
.bs3{width:260px;height:260px;top:42%;left:12%;background:radial-gradient(circle,rgba(245,166,35,0.05),transparent 70%);animation-delay:-15s;}
@keyframes bsFloat{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-50px) scale(1.06)}}

/* LOADER */
.loader-wrap{position:fixed;inset:0;background:var(--ink);display:flex;align-items:center;justify-content:center;z-index:9999;transition:opacity .6s,visibility .6s;}
.loader-wrap.hide{opacity:0;visibility:hidden;}
.loader-ring{width:52px;height:52px;position:relative;}
.loader-ring::before,.loader-ring::after{content:'';position:absolute;border-radius:50%;border:2px solid transparent;animation:lSpin 1.4s linear infinite;}
.loader-ring::before{inset:0;border-top-color:var(--cyan);animation-duration:1.4s;}
.loader-ring::after{inset:8px;border-top-color:var(--teal);animation-duration:1s;}
@keyframes lSpin{to{transform:rotate(360deg)}}
/* Floating logo splash (transparent-bg logo floats over a soft glow) */
.loader-stage{position:relative;display:flex;align-items:center;justify-content:center;width:160px;height:160px;}
.loader-stage::before{content:'';position:absolute;width:150px;height:150px;border-radius:50%;background:radial-gradient(circle,rgba(45,156,219,.28),transparent 68%);filter:blur(6px);animation:loaderGlow 2.4s ease-in-out infinite;}
.loader-logo{width:104px;height:auto;max-height:104px;object-fit:contain;position:relative;z-index:2;animation:logoFloat 2.6s ease-in-out infinite;filter:drop-shadow(0 12px 26px rgba(45,156,219,.45));}
.loader-dots{position:absolute;bottom:-2px;display:flex;gap:6px;}
.loader-dots span{width:7px;height:7px;border-radius:50%;background:var(--teal);opacity:.4;animation:loaderDot 1.4s ease-in-out infinite;}
.loader-dots span:nth-child(2){animation-delay:.18s;}
.loader-dots span:nth-child(3){animation-delay:.36s;}
@keyframes logoFloat{0%,100%{transform:translateY(0) scale(1);}50%{transform:translateY(-14px) scale(1.04);}}
@keyframes loaderGlow{0%,100%{opacity:.5;transform:scale(.92);}50%{opacity:1;transform:scale(1.08);}}
@keyframes loaderDot{0%,100%{opacity:.3;transform:translateY(0);}50%{opacity:1;transform:translateY(-5px);}}

/* CONTAINER */
.wrap{max-width:1300px;margin:0 auto;padding:0 24px;position:relative;z-index:2;}

/* HEADER */
.site-header{
  position:fixed;top:0;left:0;right:0;z-index:1000;
  background:rgba(7,21,43,0.82);backdrop-filter:blur(24px);
  border-bottom:1px solid var(--glass-b2);
  transition:all .3s;
}
.site-header.scrolled{background:rgba(7,21,43,0.96);box-shadow:0 8px 32px rgba(0,0,0,.22);}
.hdr-inner{display:flex;align-items:center;justify-content:space-between;height:68px;gap:16px;}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none;flex-shrink:0;}
.logo-img{height:46px;width:auto;object-fit:contain;}
.logo-icon{width:38px;height:38px;background:linear-gradient(135deg,rgba(45,156,219,.2),rgba(56,217,.09));border:1px solid rgba(45,156,219,.3);border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:18px;color:var(--cyan);}
.logo-text{font-family:'Space Grotesk',sans-serif;font-size:17px;font-weight:700;background:linear-gradient(90deg,#fff,rgba(160,210,255,.85));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
.nav-desk{display:none;align-items:center;gap:4px;}
@media(min-width:900px){.nav-desk{display:flex;}}
.nav-desk a{padding:7px 15px;color:var(--text-2);text-decoration:none;font-size:13px;font-weight:500;border-radius:40px;transition:all .25s;background:rgba(255,255,255,.025);border:1px solid transparent;}
.nav-desk a:hover{color:var(--teal);background:rgba(56,217,169,.09);border-color:rgba(56,217,169,.25);transform:translateY(-1px);}
.nav-desk a.active{color:var(--teal);background:rgba(56,217,169,.1);border-color:rgba(56,217,169,.3);}
.nav-desk a.link-updates{background:rgba(56,217,169,.08);border-color:rgba(56,217,169,.25);color:var(--teal);}
.hdr-btns{display:flex;align-items:center;gap:10px;}
.btn-login{display:none;align-items:center;gap:7px;padding:7px 18px;background:transparent;border:1px solid var(--glass-b);border-radius:30px;color:var(--text-2);text-decoration:none;font-size:13px;font-weight:500;transition:all .2s;}
@media(min-width:480px){.btn-login{display:inline-flex;}}
.btn-login:hover{border-color:var(--cyan);color:var(--cyan);}
.btn-start{display:inline-flex;align-items:center;gap:7px;padding:8px 20px;background:linear-gradient(135deg,var(--teal),var(--teal-d));border:none;border-radius:30px;color:#07152B;text-decoration:none;font-size:13px;font-weight:700;transition:all .2s;box-shadow:var(--glow-t);}
.btn-start:hover{transform:translateY(-2px);box-shadow:0 6px 22px rgba(56,217,169,.42);}
.menu-btn{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:5px;width:40px;height:40px;background:var(--glass);border:1px solid var(--glass-b2);border-radius:11px;cursor:pointer;}
@media(min-width:900px){.menu-btn{display:none;}}
.menu-btn span{width:18px;height:2px;background:var(--text);border-radius:2px;transition:all .3s;}
.menu-btn.open span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.menu-btn.open span:nth-child(2){opacity:0;}
.menu-btn.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

/* DRAWER */
.drawer-bg{position:fixed;inset:0;background:rgba(0,0,0,.65);backdrop-filter:blur(10px);z-index:1040;opacity:0;visibility:hidden;transition:all .3s;}
.drawer-bg.open{opacity:1;visibility:visible;}
.drawer{position:fixed;top:0;right:0;bottom:0;width:min(310px,88vw);background:rgba(6,18,38,.98);backdrop-filter:blur(30px);border-left:1px solid var(--glass-b2);z-index:1050;transform:translateX(102%);transition:transform .35s cubic-bezier(.4,0,.2,1);padding:84px 20px 28px;display:flex;flex-direction:column;gap:6px;}
.drawer.open{transform:translateX(0);}
.drawer a{display:flex;align-items:center;gap:12px;padding:13px 15px;color:var(--text-2);text-decoration:none;font-size:14px;font-weight:500;border-radius:13px;transition:all .2s;}
.drawer a i{width:22px;color:var(--cyan);font-size:14px;}
.drawer a:hover{background:rgba(45,156,219,.09);color:var(--cyan);}
.drawer-sep{height:1px;background:var(--glass-b2);margin:10px 0;}
.drawer-footer{margin-top:16px;display:flex;flex-direction:column;gap:10px;}
.dbtn{display:flex;align-items:center;justify-content:center;gap:8px;padding:13px;border-radius:13px;text-decoration:none;font-weight:600;font-size:14px;}
.dbtn-out{background:transparent;border:1px solid var(--glass-b);color:var(--text);}
.dbtn-fill{background:linear-gradient(135deg,var(--teal),var(--teal-d));color:#07152B;}

/* HERO */
.hero{padding:80px 0 56px;position:relative;}
@media(min-width:768px){.hero{padding:100px 0 72px;}}
.hero-grid{display:flex;flex-direction:column;gap:44px;}
@media(min-width:960px){.hero-grid{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:56px;}}
.hero-eyebrow{display:inline-flex;align-items:center;gap:8px;background:rgba(56,217,169,.1);border:1px solid rgba(56,217,169,.22);border-radius:40px;padding:5px 14px;font-size:11px;font-weight:600;color:var(--teal);margin-bottom:14px;}
.hero-h1{font-family:'Space Grotesk',sans-serif;font-size:clamp(34px,5vw,52px);font-weight:800;line-height:1.15;margin-bottom:16px;}
.hero-h1 .line-cyan{color:var(--cyan);}
.hero-h1 .line-teal{color:var(--teal);}
.hero-sub{font-size:15px;color:var(--text-2);margin-bottom:28px;max-width:490px;line-height:1.6;}
.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:32px;}
.btn-hero-primary{display:inline-flex;align-items:center;gap:8px;padding:13px 26px;background:linear-gradient(135deg,var(--teal),var(--teal-d));border:none;border-radius:40px;color:#07152B;text-decoration:none;font-weight:700;font-size:14px;transition:all .2s;box-shadow:var(--glow-t);}
.btn-hero-primary:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(56,217,169,.42);}
.btn-hero-sec{display:inline-flex;align-items:center;gap:8px;padding:12px 24px;background:transparent;border:1.5px solid var(--glass-b);border-radius:40px;color:var(--text);text-decoration:none;font-weight:600;font-size:14px;transition:all .2s;}
.btn-hero-sec:hover{border-color:var(--cyan);color:var(--cyan);background:rgba(45,156,219,.05);}
.hero-trust{display:flex;align-items:center;gap:14px;flex-wrap:wrap;}
.avatars{display:flex;}
.av{width:34px;height:34px;background:linear-gradient(135deg,var(--cyan),var(--teal));border:2px solid var(--ink);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;margin-left:-7px;}
.av:first-child{margin-left:0;}
.trust-txt{font-size:12px;color:var(--text-2);}
.trust-txt strong{color:var(--teal);}

/* CURRENCY BADGE */
.currency-badge{
  display:inline-flex;align-items:center;gap:6px;
  background:rgba(245,166,35,.1);border:1px solid rgba(245,166,35,.25);
  border-radius:30px;padding:4px 12px;font-size:11px;font-weight:600;color:var(--amber);
  cursor:pointer;user-select:none;transition:all .2s;margin-bottom:18px;
}
.currency-badge:hover{background:rgba(245,166,35,.18);}

/* INVOICE CARD VISUAL */
.hero-visual{position:relative;}
.inv-card{
  background:linear-gradient(145deg,rgba(255,255,255,0.07),rgba(255,255,255,0.025));
  backdrop-filter:blur(22px);
  border:1px solid var(--glass-b);
  border-radius:var(--r-lg);
  padding:26px;
  box-shadow:0 20px 60px rgba(0,0,0,.3);
  animation:heroFloat 6s ease-in-out infinite;
}
@keyframes heroFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}
.inv-hdr{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px;flex-wrap:wrap;gap:8px;}
.inv-brand{font-family:'Space Grotesk',sans-serif;font-weight:800;font-size:15px;background:linear-gradient(90deg,#fff,var(--cyan));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
.inv-status{background:rgba(56,217,169,.14);border:1px solid rgba(56,217,169,.3);padding:3px 10px;border-radius:30px;font-size:10px;font-weight:700;color:var(--teal);}
.inv-row{display:flex;justify-content:space-between;padding:9px 0;border-bottom:1px solid rgba(255,255,255,.045);font-size:12px;}
.inv-lbl{color:var(--text-3);}
.inv-val{font-weight:600;}
.inv-total{margin-top:14px;padding:14px 18px;background:rgba(45,156,219,.08);border:1px solid rgba(45,156,219,.12);border-radius:14px;display:flex;justify-content:space-between;align-items:center;}
.inv-total-lbl{font-size:12px;color:var(--text-2);}
.inv-total-amt{font-family:'Space Grotesk',sans-serif;font-size:22px;font-weight:800;color:var(--teal);}
.inv-chip{position:absolute;background:linear-gradient(145deg,rgba(255,255,255,.09),rgba(255,255,255,.035));backdrop-filter:blur(20px);border:1px solid var(--glass-b);border-radius:14px;padding:10px 14px;min-width:108px;}
.chip-top{top:-14px;right:-14px;}
.chip-bot{bottom:-14px;left:-14px;}
.chip-val{font-family:'Space Grotesk',sans-serif;font-size:17px;font-weight:800;color:var(--teal);}
.chip-lbl{font-size:9px;color:var(--text-3);margin-top:3px;}
/* Mini sparkline inside chip */
.chip-spark{margin-top:6px;}

/* STATS BAR */
.stats-bar{background:linear-gradient(145deg,rgba(255,255,255,.028),rgba(255,255,255,.01));border-top:1px solid var(--glass-b2);border-bottom:1px solid var(--glass-b2);padding:36px 0;}
.stats-row{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;text-align:center;}
@media(min-width:768px){.stats-row{grid-template-columns:repeat(5,1fr);}}
.stat-box{}
.stat-n{font-family:'Space Grotesk',sans-serif;font-size:26px;font-weight:800;background:linear-gradient(135deg,var(--cyan),var(--teal));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
.stat-l{font-size:10px;color:var(--text-3);margin-top:5px;text-transform:uppercase;letter-spacing:.6px;}

/* PHONES SECTION */
.phones-sec{padding:64px 0;overflow:hidden;}
.phones-wrap{display:flex;justify-content:center;align-items:flex-end;gap:16px;flex-wrap:wrap;margin-top:44px;}
.phone{position:relative;width:200px;flex-shrink:0;transition:transform .3s;}
.phone:hover{transform:translateY(-6px);}
.phone.center{width:220px;transform:translateY(-12px);}
.phone.center:hover{transform:translateY(-18px);}
.ph-shell{
  width:100%;height:440px;
  background:linear-gradient(160deg,#0a1b2c,#020910);
  border-radius:var(--r-xl);
  border:1.5px solid rgba(45,156,219,.28);
  box-shadow:0 24px 48px rgba(0,0,0,.5);
  overflow:hidden;position:relative;
}
.phone.center .ph-shell{height:480px;border-color:rgba(56,217,169,.35);box-shadow:0 28px 55px rgba(0,0,0,.55),0 0 0 1px rgba(56,217,169,.1);}
.ph-notch{position:absolute;top:8px;left:50%;transform:translateX(-50%);width:100px;height:20px;background:#020910;border-radius:0 0 14px 14px;z-index:3;}
.ph-screen{padding:32px 10px 10px;height:100%;display:flex;flex-direction:column;background:linear-gradient(160deg,rgba(45,156,219,.04),rgba(56,217,169,.015));}
.ph-topbar{display:flex;justify-content:space-between;align-items:center;padding-bottom:9px;border-bottom:1px solid rgba(255,255,255,.07);margin-bottom:10px;}
.ph-topbar .ph-title{font-size:11px;font-weight:700;}
.ph-topbar i{font-size:13px;color:var(--teal);}
.ph-mini-stats{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-bottom:10px;}
.ph-ms{background:rgba(255,255,255,.04);border-radius:10px;padding:8px;text-align:center;}
.ph-ms-v{display:block;font-size:11px;font-weight:700;color:var(--teal);}
.ph-ms-l{font-size:7.5px;color:var(--text-3);}
.ph-graph{background:rgba(255,255,255,.03);border-radius:10px;padding:8px;margin-bottom:9px;height:54px;display:flex;align-items:flex-end;justify-content:space-around;gap:3px;}
.ph-bar{border-radius:3px 3px 0 0;background:linear-gradient(180deg,var(--teal),var(--cyan));flex:1;transition:height .4s;}
.ph-bar.dim{opacity:.35;}
.ph-donut-wrap{display:flex;align-items:center;justify-content:space-around;margin-bottom:9px;}
.ph-list{flex:1;display:flex;flex-direction:column;gap:5px;}
.ph-item{display:flex;justify-content:space-between;align-items:center;padding:7px 9px;background:rgba(255,255,255,.03);border-radius:9px;font-size:9px;}
.ph-item i{color:var(--teal);margin-right:4px;font-size:9px;}
.ph-item span{font-weight:700;color:var(--teal);}
.ph-nav{display:flex;justify-content:space-around;padding-top:8px;margin-top:auto;border-top:1px solid rgba(255,255,255,.06);}
.ph-nav i{font-size:14px;color:var(--text-3);}
.ph-nav i.on{color:var(--teal);}
.ph-home-btn{position:absolute;bottom:6px;left:50%;transform:translateX(-50%);width:90px;height:3px;background:rgba(255,255,255,.28);border-radius:2px;}
.ph-glow{position:absolute;inset:0;background:radial-gradient(circle at 50% 50%,rgba(45,156,219,.12),transparent 70%);border-radius:var(--r-xl);opacity:0;transition:opacity .3s;}
.phone:hover .ph-glow{opacity:1;}
.ph-label{text-align:center;margin-top:12px;font-size:11px;font-weight:600;color:var(--text-2);}
.ph-label i{color:var(--teal);margin-right:5px;font-size:10px;}
/* Mini donut SVG */
.ph-donut{overflow:visible;}

@media(max-width:640px){
  .phones-wrap{gap:8px;}
  .phone{width:calc(50% - 4px);max-width:165px;}
  .phone.center{width:calc(50% - 4px);max-width:165px;transform:none;}
  .phone.center:hover{transform:translateY(-5px);}
  .ph-shell{height:340px;}
  .phone.center .ph-shell{height:360px;}
  .ph-topbar .ph-title{font-size:9px;}
  .ph-item{font-size:8px;padding:5px 7px;}
  .ph-nav i{font-size:11px;}
  .ph-graph{height:42px;}
  .phones-sec{padding:40px 0;}
}

/* SECTION BASE */
.sec{padding:64px 0;}
.sec.first{padding-top:112px;}
.sec-hdr{text-align:center;margin-bottom:44px;}
.sec-eye{display:inline-block;background:rgba(45,156,219,.1);border:1px solid rgba(45,156,219,.22);border-radius:30px;padding:4px 13px;font-size:10px;font-weight:600;color:var(--cyan);margin-bottom:12px;text-transform:uppercase;letter-spacing:.5px;}
.sec-title{font-family:'Space Grotesk',sans-serif;font-size:clamp(26px,4vw,38px);font-weight:800;margin-bottom:12px;}
.sec-sub{font-size:14px;color:var(--text-2);max-width:540px;margin:0 auto;line-height:1.6;}

/* FEATURES */
.feat-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;}
@media(min-width:768px){.feat-grid{gap:18px;}}
@media(min-width:1050px){.feat-grid{grid-template-columns:repeat(3,1fr);}}
.feat-card{
  background:linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.015));
  backdrop-filter:blur(12px);
  border:1px solid var(--glass-b2);
  border-radius:var(--r-md);
  padding:22px;
  transition:all .3s;
  position:relative;overflow:hidden;
}
.feat-card::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,var(--cyan),var(--teal));opacity:0;transition:opacity .3s;}
.feat-card:hover{transform:translateY(-3px);border-color:rgba(45,156,219,.38);}
.feat-card:hover::before{opacity:1;}
.feat-ico{width:46px;height:46px;background:linear-gradient(135deg,rgba(45,156,219,.14),rgba(56,217,169,.07));border:1px solid rgba(45,156,219,.18);border-radius:13px;display:flex;align-items:center;justify-content:center;font-size:20px;margin-bottom:14px;}
.feat-card h3{font-family:'Space Grotesk',sans-serif;font-size:15px;font-weight:700;margin-bottom:7px;}
.feat-card p{font-size:12px;color:var(--text-2);line-height:1.55;margin-bottom:10px;}
.feat-list{list-style:none;margin-bottom:10px;}
.feat-list li{font-size:11px;color:var(--text-2);display:flex;align-items:center;gap:6px;padding:3px 0;}
.feat-list li i{color:var(--teal);font-size:9px;width:12px;}
.feat-tag{font-size:10px;font-weight:600;color:var(--teal);display:inline-flex;align-items:center;gap:4px;}

/* HOW IT WORKS */
.how-grid{display:flex;flex-direction:column;gap:44px;}
@media(min-width:960px){.how-grid{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:56px;}}
.steps{display:flex;flex-direction:column;gap:18px;}
.step{display:flex;gap:14px;align-items:flex-start;}
.step-num{width:40px;height:40px;background:linear-gradient(135deg,var(--cyan),var(--cyan-d));border-radius:12px;display:flex;align-items:center;justify-content:center;font-family:'Space Grotesk',sans-serif;font-size:17px;font-weight:800;flex-shrink:0;}
.step-body h4{font-size:15px;font-weight:700;margin-bottom:4px;}
.step-body p{font-size:12px;color:var(--text-2);line-height:1.55;}
.dash-mock{
  background:linear-gradient(145deg,rgba(255,255,255,.065),rgba(255,255,255,.02));
  backdrop-filter:blur(22px);border:1px solid var(--glass-b);
  border-radius:var(--r-lg);padding:22px;
}
.dm-topbar{display:flex;align-items:center;gap:7px;margin-bottom:16px;padding-bottom:10px;border-bottom:1px solid var(--glass-b2);}
.dm-dot{width:8px;height:8px;border-radius:50%;}
.dm-dot.r{background:#ff5f5f;}.dm-dot.y{background:#ffd93d;}.dm-dot.g{background:#6bcb77;}
.dm-caption{font-size:10px;color:var(--text-3);margin-left:7px;}
.dm-kpi{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin-bottom:14px;}
.dm-kpi-box{background:rgba(255,255,255,.04);border-radius:11px;padding:10px;text-align:center;}
.dm-kpi-v{font-family:'Space Grotesk',sans-serif;font-size:15px;font-weight:800;color:var(--teal);}
.dm-kpi-l{font-size:8px;color:var(--text-3);margin-top:3px;}
.dm-bar{height:2px;background:rgba(255,255,255,.07);border-radius:2px;margin-top:5px;overflow:hidden;}
.dm-bar-fill{height:100%;border-radius:2px;background:linear-gradient(90deg,var(--cyan),var(--teal));}
/* Revenue mini-chart in dashboard */
.dm-chart{height:64px;background:rgba(255,255,255,.03);border-radius:12px;margin-bottom:12px;display:flex;align-items:flex-end;gap:5px;padding:8px 12px;}
.dm-chart-bar{border-radius:3px 3px 0 0;background:linear-gradient(180deg,var(--teal),var(--cyan));flex:1;min-width:0;}
.dm-rows{display:flex;flex-direction:column;gap:6px;}
.dm-row{display:flex;align-items:center;justify-content:space-between;background:rgba(255,255,255,.03);border-radius:10px;padding:8px 12px;flex-wrap:wrap;gap:5px;}
.dm-row-info .dm-ref{font-size:11px;font-weight:600;}
.dm-row-info .dm-cli{font-size:9px;color:var(--text-3);margin-top:2px;}
.dm-amt{font-weight:700;font-size:12px;}
.badge{padding:2px 8px;border-radius:20px;font-size:8px;font-weight:700;}
.badge-paid{background:rgba(56,217,169,.14);color:var(--teal);}
.badge-pend{background:rgba(245,166,35,.12);color:var(--amber);}

/* PRICING */
.price-grid{display:grid;grid-template-columns:1fr;gap:18px;}
@media(min-width:640px){.price-grid{grid-template-columns:repeat(2,1fr);}}
@media(min-width:1020px){.price-grid{grid-template-columns:repeat(3,1fr);}}
.price-card{
  background:linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.015));
  backdrop-filter:blur(12px);
  border:1px solid var(--glass-b2);
  border-radius:var(--r-lg);
  padding:28px;
  transition:all .3s;
  position:relative;
}
.price-card:hover{transform:translateY(-3px);border-color:rgba(45,156,219,.35);}
.price-card.pop{border-color:var(--cyan);box-shadow:0 0 0 1px rgba(45,156,219,.28),0 20px 50px rgba(0,0,0,.25);}
.pop-badge{position:absolute;top:-10px;left:50%;transform:translateX(-50%);background:linear-gradient(135deg,var(--cyan),var(--teal));padding:3px 14px;border-radius:30px;font-size:10px;font-weight:700;color:#07152B;white-space:nowrap;}
.plan-name{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:1px;color:var(--cyan);margin-bottom:9px;}
.plan-price{display:flex;align-items:baseline;gap:3px;margin-bottom:5px;}
.plan-cur{font-size:13px;color:var(--text-2);}
.plan-amt{font-family:'Space Grotesk',sans-serif;font-size:38px;font-weight:800;}
.plan-per{font-size:11px;color:var(--text-3);}
.plan-usd{font-size:11px;color:var(--text-3);margin-bottom:12px;}
.plan-desc{font-size:12px;color:var(--text-2);margin:10px 0 16px;line-height:1.5;}
.plan-feats{list-style:none;margin:0 0 20px;}
.plan-feats li{display:flex;align-items:center;gap:8px;padding:5px 0;font-size:12px;color:var(--text-2);}
.plan-feats li i{width:16px;color:var(--teal);font-size:10px;}
.plan-btn{display:flex;align-items:center;justify-content:center;gap:8px;padding:12px;border-radius:40px;text-decoration:none;font-weight:600;font-size:13px;transition:all .2s;}
.plan-btn-fill{background:linear-gradient(135deg,var(--cyan),var(--cyan-d));color:white;}
.plan-btn-fill:hover{transform:translateY(-2px);box-shadow:var(--glow-c);}
.plan-btn-out{background:transparent;border:1.5px solid var(--glass-b);color:var(--text);}
.plan-btn-out:hover{border-color:var(--cyan);color:var(--cyan);}

/* TESTIMONIALS */
.testi-grid{display:grid;grid-template-columns:1fr;gap:18px;}
@media(min-width:640px){.testi-grid{grid-template-columns:repeat(2,1fr);}}
@media(min-width:1020px){.testi-grid{grid-template-columns:repeat(3,1fr);}}
.testi-card{background:linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.015));backdrop-filter:blur(12px);border:1px solid var(--glass-b2);border-radius:var(--r-md);padding:24px;transition:all .3s;}
.testi-card:hover{border-color:rgba(56,217,169,.28);transform:translateY(-2px);}
.testi-stars{color:var(--amber);font-size:12px;margin-bottom:10px;letter-spacing:2px;}
.testi-q{font-size:28px;color:var(--teal);opacity:.3;line-height:1;margin-bottom:6px;}
.testi-txt{font-size:13px;color:var(--text-2);line-height:1.65;margin-bottom:16px;font-style:italic;}
.testi-author{display:flex;align-items:center;gap:10px;}
.testi-av{width:36px;height:36px;background:linear-gradient(135deg,var(--cyan),var(--teal));border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:12px;}
.testi-name{font-weight:700;font-size:13px;}
.testi-role{font-size:10px;color:var(--text-3);margin-top:2px;}
/* Rating bar */
.rating-bar{display:flex;align-items:center;gap:8px;margin-top:8px;}
.rb-label{font-size:9px;color:var(--text-3);width:60px;}
.rb-track{flex:1;height:3px;background:rgba(255,255,255,.07);border-radius:2px;overflow:hidden;}
.rb-fill{height:100%;border-radius:2px;background:linear-gradient(90deg,var(--amber),var(--teal));}
.rb-val{font-size:9px;color:var(--text-2);width:24px;text-align:right;}

/* FAQ */
.faq-wrap{max-width:760px;margin:0 auto;display:flex;flex-direction:column;gap:12px;}
.faq-item{background:linear-gradient(145deg,rgba(255,255,255,.05),rgba(255,255,255,.015));border:1px solid var(--glass-b2);border-radius:var(--r-md);overflow:hidden;transition:border-color .25s;}
.faq-item[open]{border-color:rgba(45,156,219,.34);}
.faq-item summary{list-style:none;cursor:pointer;padding:18px 20px;font-size:14px;font-weight:600;display:flex;align-items:center;justify-content:space-between;gap:12px;}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-item summary i{color:var(--cyan);font-size:13px;transition:transform .25s;flex-shrink:0;}
.faq-item[open] summary i{transform:rotate(180deg);}
.faq-item .faq-a{padding:0 20px 18px;font-size:13px;color:var(--text-2);line-height:1.65;}

/* CTA */
.cta-sec{background:linear-gradient(135deg,rgba(45,156,219,.1),rgba(56,217,169,.055));border-top:1px solid var(--glass-b2);border-bottom:1px solid var(--glass-b2);padding:64px 0;text-align:center;}
.cta-title{font-family:'Space Grotesk',sans-serif;font-size:clamp(26px,4vw,38px);font-weight:800;margin-bottom:12px;}
.cta-sub{font-size:14px;color:var(--text-2);margin-bottom:28px;max-width:500px;margin-left:auto;margin-right:auto;}
.cta-btns{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;}
/* Floating trusted badges */
.cta-badges{display:flex;justify-content:center;flex-wrap:wrap;gap:12px;margin-top:28px;}
.trust-badge{display:inline-flex;align-items:center;gap:7px;padding:6px 14px;background:rgba(255,255,255,.04);border:1px solid var(--glass-b2);border-radius:30px;font-size:11px;color:var(--text-2);}
.trust-badge i{color:var(--teal);}

/* FOOTER */
.footer{padding:52px 0 24px;border-top:1px solid var(--glass-b2);}
.foot-grid{display:grid;grid-template-columns:1fr;gap:32px;margin-bottom:32px;}
@media(min-width:640px){.foot-grid{grid-template-columns:repeat(2,1fr);}}
@media(min-width:960px){.foot-grid{grid-template-columns:2fr 1fr 1fr 1.5fr;}}
.foot-brand p{font-size:12px;color:var(--text-3);line-height:1.6;max-width:250px;margin-top:10px;}
.socials{display:flex;gap:9px;margin-top:16px;}
.soc{width:30px;height:30px;background:rgba(255,255,255,.05);border:1px solid var(--glass-b2);border-radius:8px;display:flex;align-items:center;justify-content:center;color:var(--text-2);text-decoration:none;font-size:12px;transition:all .2s;}
.soc:hover{background:rgba(45,156,219,.14);color:var(--cyan);}
.foot-col h4{font-size:12px;font-weight:700;margin-bottom:14px;text-transform:uppercase;letter-spacing:.5px;color:var(--text-2);}
.foot-col a{display:block;color:var(--text-3);text-decoration:none;font-size:12px;margin-bottom:9px;transition:color .2s;}
.foot-col a:hover{color:var(--cyan);}
.foot-col p{font-size:12px;color:var(--text-3);margin-bottom:7px;display:flex;align-items:center;gap:8px;}
.foot-col i{color:var(--cyan);width:16px;}
/* WE ACCEPT strip */
.pay-strip{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:14px 22px;padding:22px 0;border-top:1px solid var(--glass-b2);margin-top:8px;}
.pay-strip-label,.pay-strip-by{font-size:11px;color:var(--text-3);display:inline-flex;align-items:center;gap:7px;}
.pay-strip-label i,.pay-strip-by i{color:var(--teal);}
.pay-logos{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:14px;}
.pay-logos i{font-size:34px;color:var(--text-2);transition:color .2s,transform .2s;}
.pay-logos i:hover{color:var(--cyan);transform:translateY(-2px);}
.pay-pill{font-size:11px;font-weight:600;color:var(--text-2);background:rgba(255,255,255,.05);border:1px solid var(--glass-b2);border-radius:30px;padding:6px 13px;}
@media(max-width:560px){.pay-logos i{font-size:28px;}.pay-strip{gap:10px 14px;}}
.foot-bottom{text-align:center;padding-top:22px;border-top:1px solid var(--glass-b2);font-size:11px;color:var(--text-3);}
.foot-bottom a{color:var(--text-3);text-decoration:none;margin:0 6px;}
.foot-bottom a:hover{color:var(--cyan);}
.btn-updates{display:inline-flex;align-items:center;gap:8px;padding:9px 20px;background:linear-gradient(135deg,#2ecc71,#27ae60);border:none;border-radius:40px;color:white;text-decoration:none;font-weight:600;font-size:12px;transition:all .3s;margin-top:22px;}
.btn-updates:hover{transform:translateY(-2px);}
.updates-center{text-align:center;}

/* PWA */
.pwa-btn{position:fixed;bottom:20px;right:20px;background:linear-gradient(135deg,var(--teal),var(--teal-d));border:none;border-radius:50px;padding:10px 20px;color:#07152B;font-weight:700;font-size:12px;display:none;align-items:center;gap:8px;cursor:pointer;z-index:900;box-shadow:var(--glow-t);}
.pwa-btn.show{display:flex;}

/* REVEAL */
.reveal{opacity:0;transform:translateY(22px);transition:opacity .5s cubic-bezier(.4,0,.2,1),transform .5s cubic-bezier(.4,0,.2,1);}
.reveal.in{opacity:1;transform:translateY(0);}
.rd1{transition-delay:.08s;}.rd2{transition-delay:.16s;}.rd3{transition-delay:.24s;}.rd4{transition-delay:.32s;}

/* ===================================================
   SADC / REGIONAL SECTIONS (added in Phase 2)
   =================================================== */
.coverage{padding:54px 0;border-top:1px solid var(--glass-b2);border-bottom:1px solid var(--glass-b2);background:linear-gradient(145deg,rgba(45,156,219,.05),rgba(56,217,169,.03));}
.country-pills{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:26px;}
.country-pill{display:inline-flex;align-items:center;gap:8px;padding:8px 16px;background:rgba(255,255,255,.04);border:1px solid var(--glass-b2);border-radius:30px;font-size:13px;font-weight:600;color:var(--text-2);transition:all .2s;}
.country-pill:hover{border-color:rgba(56,217,169,.4);color:var(--teal);transform:translateY(-2px);}
.country-pill .flag{font-size:16px;line-height:1;}
.badge-new{display:inline-flex;align-items:center;gap:5px;background:rgba(56,217,169,.16);border:1px solid rgba(56,217,169,.34);color:var(--teal);font-size:9px;font-weight:800;text-transform:uppercase;letter-spacing:.6px;padding:2px 8px;border-radius:20px;margin-left:6px;vertical-align:middle;}
.badge-soon{display:inline-flex;align-items:center;gap:5px;background:rgba(245,166,35,.14);border:1px solid rgba(245,166,35,.32);color:var(--amber);font-size:9px;font-weight:800;text-transform:uppercase;letter-spacing:.6px;padding:2px 8px;border-radius:20px;margin-left:6px;vertical-align:middle;}
.feat-card.is-soon{opacity:.92;}
.feat-card.is-soon .feat-ico{background:linear-gradient(135deg,rgba(245,166,35,.14),rgba(245,166,35,.05));border-color:rgba(245,166,35,.22);}
/* Roadmap */
.roadmap{max-width:880px;margin:36px auto 0;display:grid;grid-template-columns:1fr;gap:12px;}
@media(min-width:760px){.roadmap{grid-template-columns:1fr 1fr;}}
.road-item{display:flex;gap:13px;align-items:flex-start;background:linear-gradient(145deg,rgba(255,255,255,.05),rgba(255,255,255,.015));border:1px solid var(--glass-b2);border-radius:var(--r-md);padding:16px 18px;}
.road-item .ri-ico{font-size:18px;color:var(--amber);margin-top:2px;width:24px;flex-shrink:0;text-align:center;}
.road-item h4{font-size:14px;font-weight:700;margin-bottom:3px;}
.road-item p{font-size:12px;color:var(--text-2);line-height:1.5;}
/* Contact */
.contact-grid{display:grid;grid-template-columns:1fr;gap:18px;max-width:960px;margin:0 auto;}
@media(min-width:820px){.contact-grid{grid-template-columns:repeat(3,1fr);}}
.contact-card{background:linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.015));border:1px solid var(--glass-b2);border-radius:var(--r-md);padding:28px;text-align:center;transition:all .3s;}
.contact-card:hover{transform:translateY(-3px);border-color:rgba(45,156,219,.35);}
.contact-card .ci{width:54px;height:54px;margin:0 auto 14px;border-radius:14px;background:linear-gradient(135deg,rgba(45,156,219,.16),rgba(56,217,169,.08));border:1px solid rgba(45,156,219,.2);display:flex;align-items:center;justify-content:center;font-size:22px;color:var(--cyan);}
.contact-card h3{font-size:15px;font-weight:700;margin-bottom:6px;}
.contact-card p{font-size:13px;color:var(--text-2);margin-bottom:4px;}
.contact-card a{color:var(--teal);text-decoration:none;font-weight:600;font-size:13px;}
.contact-card a:hover{text-decoration:underline;}

/* MISC */
@media(max-width:480px){
  .wrap{padding:0 14px;}
  .hero-actions{flex-direction:column;}
  .hero-actions a{text-align:center;justify-content:center;}
  .inv-chip{display:none;}
}
@media(max-width:899px){.nav-desk{display:none !important;}}

/* Scrollbar */
::-webkit-scrollbar{width:5px;}
::-webkit-scrollbar-track{background:var(--ink);}
::-webkit-scrollbar-thumb{background:rgba(45,156,219,.3);border-radius:4px;}
