/* Jump.AFRICA Messenger marketing pages — v8 terminal theme */
:root{--j-bg:#F2F5F8;--j-panel:#FFFFFF;--j-panel2:#F6F9FB;--j-line:#D6DFE6;--j-line2:#C2CFD9;--j-row:#E7EDF2;--j-hover:#EEF5FA;--j-ink:#0E1A23;--j-body:#33424F;--j-mute:#506375;--j-blue:#0192D3;--j-yellow:#FDEC31;--j-hl:#0071A8;--j-link:#0071A8;--j-ok:#0F7B4B;--j-red:#C53030;--j-night:#0A131A;--j-mono:'IBM Plex Mono',ui-monospace,Menlo,monospace;--j-sans:'IBM Plex Sans',system-ui,sans-serif;--j-cond:'IBM Plex Sans Condensed','IBM Plex Sans',sans-serif;--j-logo:brightness(0) saturate(100%) invert(41%) sepia(39%) saturate(1567%) hue-rotate(162deg) brightness(101%) contrast(102%)}
[data-theme="dark"]{--j-bg:#0A131A;--j-panel:#0F1C26;--j-panel2:#132331;--j-line:#1F3241;--j-line2:#2A4254;--j-row:#16283A;--j-hover:#12212E;--j-ink:#E8EFF4;--j-body:#C3D2DD;--j-mute:#93A8B8;--j-hl:#FDEC31;--j-link:#0ABFE8;--j-ok:#3DD68C;--j-logo:none;color-scheme:dark}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;background:var(--j-bg);color:var(--j-ink);font:16px/1.6 var(--j-sans);-webkit-font-smoothing:antialiased}
a{color:var(--j-link)}img{max-width:100%}
.w{max-width:1180px;margin:0 auto;padding:0 20px}
.sr{position:absolute;left:-9999px}
/* top */
.top{position:sticky;top:0;z-index:50;background:color-mix(in srgb,var(--j-panel) 92%,transparent);backdrop-filter:blur(8px);border-bottom:1px solid var(--j-line)}
.top .w{display:flex;align-items:center;gap:18px;height:62px}
.logo img{height:26px;filter:var(--j-logo);display:block}
.logo-tag{font:600 10px var(--j-mono);letter-spacing:.12em;color:var(--j-hl);padding:2px 6px;border:1px solid var(--j-line2)}
.nav{display:flex;gap:2px;margin-left:12px}
.nav a{padding:8px 10px;font:500 12px var(--j-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--j-body);text-decoration:none}
.nav a:hover,.nav a.on{color:var(--j-ink);box-shadow:inset 0 -2px 0 var(--j-blue)}
.top-r{margin-left:auto;display:flex;gap:8px;align-items:center}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:40px;padding:0 18px;border:1px solid var(--j-line2);background:transparent;color:var(--j-ink);font:600 14px var(--j-sans);text-decoration:none;cursor:pointer;white-space:nowrap}
.btn:hover{border-color:var(--j-blue)}
.btn.p{background:var(--j-blue);border-color:var(--j-blue);color:#fff}.btn.p:hover{background:#0A84BE}
.btn.y{background:var(--j-yellow);border-color:var(--j-yellow);color:#0A131A}
.btn.big{display:inline-grid;grid-template-columns:auto 1fr;column-gap:12px;row-gap:2px;align-items:center;height:auto;padding:13px 22px 13px 18px;text-align:left}
.btn.big svg{grid-row:1/3;width:24px;height:24px}
.btn.big b{font-size:17px}.btn.big small{font:400 11.5px var(--j-mono);opacity:.85}
.btn svg{width:18px;height:18px}
.burger{display:none}
/* hero */
.hero{background:var(--j-night);color:#E8EFF4;position:relative;overflow:hidden}
.hero::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 80% 20%,rgba(1,146,211,.28),transparent 45%),repeating-linear-gradient(0deg,rgba(255,255,255,.025) 0 1px,transparent 1px 28px),repeating-linear-gradient(90deg,rgba(255,255,255,.025) 0 1px,transparent 1px 28px)}
.hero .w{position:relative;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:44px;align-items:center;padding-top:64px;padding-bottom:64px}
.kick{display:inline-flex;gap:8px;align-items:center;font:600 11px var(--j-mono);letter-spacing:.12em;color:var(--j-yellow);text-transform:uppercase}
.kick i{width:8px;height:8px;background:var(--j-yellow);display:inline-block}
.hero h1{margin:14px 0 16px;font:700 clamp(36px,5.2vw,60px)/1.02 var(--j-cond);letter-spacing:-.01em}
.hero h1 em{font-style:normal;color:var(--j-yellow)}
.hero .lede{font-size:18.5px;line-height:1.55;color:#C3D2DD;max-width:560px}
.hero .ctas{display:flex;gap:10px;flex-wrap:wrap;margin:26px 0 12px}
.hero .btn:not(.p):not(.y){color:#E8EFF4;border-color:#2A4254}
.hero .alt{font-size:13px;color:#93A8B8}.hero .alt a{color:#0ABFE8}
.trust{display:flex;gap:18px;flex-wrap:wrap;margin-top:22px;font:500 12px var(--j-mono);color:#93A8B8}
.trust span::before{content:"✓ ";color:#3DD68C}
/* app mock */
.mock{border:1px solid #2A4254;background:#0F1C26;box-shadow:0 40px 80px rgba(0,0,0,.45);font-size:12.5px}
.mock-bar{display:flex;gap:6px;align-items:center;padding:9px 12px;border-bottom:1px solid #1F3241;background:#132331}
.mock-bar i{width:10px;height:10px;border-radius:50%;background:#2A4254}.mock-bar span{margin-left:10px;font:500 11px var(--j-mono);color:#93A8B8}
.mock-ui{display:grid;grid-template-columns:150px 1fr;height:330px}
.mock-l{border-right:1px solid #1F3241;background:#0F1C26}
.mock-r{display:flex;gap:8px;align-items:center;padding:10px;border-bottom:1px solid #16283A;color:#E8EFF4}
.mock-r.on{background:#12212E;box-shadow:inset 3px 0 0 #0192D3}
.mock-r small{display:block;color:#93A8B8;font-size:10.5px}
.av{flex:none;display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:50%;background:#0192D3;color:#fff;font:600 10px var(--j-mono)}
.mock-c{display:flex;flex-direction:column;gap:8px;padding:14px;background:#0A131A}
.mock-sys{align-self:center;padding:4px 10px;background:#221E08;color:#F3E07A;font-size:10.5px}
.mb{max-width:78%;padding:7px 10px;border:1px solid #1F3241;background:#0F1C26;color:#E8EFF4}
.mb.me{align-self:flex-end;background:#0B5E86;border-color:transparent}
.mb.burn{border:1px dashed #e5484d;background:repeating-linear-gradient(45deg,rgba(229,72,77,.1) 0 8px,transparent 8px 16px)}
.mb small{display:block;text-align:right;font:400 9.5px var(--j-mono);opacity:.7}
/* sections */
.sec{padding:72px 0;border-bottom:1px solid var(--j-line)}
.sec.alt{background:var(--j-panel)}
.sec h2{margin:0 0 10px;font:700 clamp(28px,3.4vw,40px)/1.1 var(--j-cond)}
.sec .sub{max-width:720px;color:var(--j-body);font-size:17px;margin:0 0 32px}
.eyebrow{font:600 11px var(--j-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--j-hl);margin-bottom:8px}
.grid3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:var(--j-line);border:1px solid var(--j-line)}
.grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}
.f{padding:24px;background:var(--j-panel)}
.f .ic{display:inline-flex;width:40px;height:40px;align-items:center;justify-content:center;background:var(--j-yellow);color:#0A131A;margin-bottom:14px}
.f .ic svg{width:20px;height:20px}
.f h3{margin:0 0 6px;font:700 20px var(--j-cond)}
.f p{margin:0;color:var(--j-body);font-size:15px}
.f a{font-weight:600;font-size:14px}
.prose{max-width:760px}
.prose h2{margin-top:44px}.prose h3{font:700 21px var(--j-cond);margin:28px 0 6px}
.prose p,.prose li{color:var(--j-body);font-size:16.5px}
.prose ul{padding-left:20px}
.note{padding:14px 16px;border-left:3px solid var(--j-yellow);background:var(--j-panel2);color:var(--j-body);font-size:15px;margin:20px 0}
.note.ok{border-color:var(--j-ok)}
.ledger{border:1px solid var(--j-line);background:var(--j-panel)}
.ledger div{display:grid;grid-template-columns:minmax(0,1fr) 170px;gap:12px;padding:12px 16px;border-bottom:1px solid var(--j-row);font-size:15px}
.ledger div:last-child{border:0}
.ledger b{font:600 12px var(--j-mono);text-transform:uppercase;letter-spacing:.05em;text-align:right}
.ledger .no{color:var(--j-ok)}.ledger .yes{color:var(--j-red)}.ledger .mid{color:#B7791F}
.cmp{width:100%;border-collapse:collapse;background:var(--j-panel);border:1px solid var(--j-line);font-size:14.5px}
.cmp th,.cmp td{padding:12px 14px;border-bottom:1px solid var(--j-row);text-align:left;vertical-align:top}
.cmp thead th{font:600 11px var(--j-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--j-mute);background:var(--j-panel2)}
.cmp th.us,.cmp td.us{background:color-mix(in srgb,var(--j-blue) 8%,var(--j-panel));font-weight:600}
.cmp td small{display:block;color:var(--j-mute);font-size:12px;font-weight:400}
.y1{color:var(--j-ok);font-weight:700}.n1{color:var(--j-red);font-weight:700}
.steps{counter-reset:s;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.step{counter-increment:s;padding:20px;background:var(--j-panel);border:1px solid var(--j-line);border-top:3px solid var(--j-blue)}
.step::before{content:counter(s,decimal-leading-zero);display:block;font:600 12px var(--j-mono);color:var(--j-hl);margin-bottom:8px}
.step h3{margin:0 0 6px;font:700 18px var(--j-cond)}.step p{margin:0;font-size:14.5px;color:var(--j-body)}
.faq details{border-bottom:1px solid var(--j-line);padding:16px 0}
.faq summary{cursor:pointer;font:600 17px var(--j-sans);list-style:none;display:flex;justify-content:space-between;gap:16px}
.faq summary::after{content:"+";font:500 22px var(--j-mono);color:var(--j-hl)}
.faq details[open] summary::after{content:"–"}
.faq details p{margin:10px 0 0;color:var(--j-body)}
.band{background:var(--j-blue);color:#fff;padding:54px 0}
.band .w{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap}
.band h2{margin:0;font:700 clamp(26px,3vw,36px)/1.1 var(--j-cond)}
.band p{margin:6px 0 0;color:#D8F1FC}
.band .btn{background:#fff;color:#0A131A;border-color:#fff}.band .btn.y{background:var(--j-yellow);border-color:var(--j-yellow)}
.dl-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.dl{padding:22px;background:var(--j-panel);border:1px solid var(--j-line);display:flex;flex-direction:column;gap:10px}
.dl.rec{border-color:var(--j-blue);box-shadow:0 0 0 1px var(--j-blue)}
.dl h3{margin:0;font:700 20px var(--j-cond)}.dl .meta{font:400 12px var(--j-mono);color:var(--j-mute)}
.dl .btn{margin-top:auto}
.tag{display:inline-block;padding:1px 6px;font:600 10px var(--j-mono);letter-spacing:.08em;text-transform:uppercase;background:var(--j-yellow);color:#0A131A}
.crumbs{font:500 12px var(--j-mono);color:var(--j-mute);padding:18px 0 0}.crumbs a{color:var(--j-mute)}
.phero{background:var(--j-panel);border-bottom:1px solid var(--j-line);padding:40px 0 44px}
.phero h1{margin:10px 0 12px;font:700 clamp(32px,4.4vw,50px)/1.05 var(--j-cond)}
.phero .lede{font-size:18px;color:var(--j-body);max-width:720px;margin:0 0 22px}
.services{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.svc{display:block;padding:18px;background:var(--j-panel);border:1px solid var(--j-line);text-decoration:none;color:var(--j-ink)}
.svc:hover{border-color:var(--j-blue)}
.svc .k{display:inline-block;padding:1px 6px;background:var(--j-yellow);color:#0A131A;font:600 11px var(--j-mono);margin-bottom:8px}
.svc b{display:block;font:700 18px var(--j-cond)}.svc span{font-size:14px;color:var(--j-body)}
footer.ft{background:var(--j-night);color:#93A8B8;padding:44px 0 30px;font-size:14px}
.ft .cols{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:24px}
.ft h4{margin:0 0 10px;font:600 11px var(--j-mono);letter-spacing:.1em;text-transform:uppercase;color:#0ABFE8}
.ft a{display:block;color:#C3D2DD;text-decoration:none;padding:3px 0}.ft a:hover{color:#fff}
.ft img{height:24px;filter:none;opacity:.95}
.ft .legal{margin-top:28px;padding-top:16px;border-top:1px solid #1F3241;font-size:12.5px}
.sticky-dl{display:none}
@media (max-width:960px){
  .hero .w,.grid2{grid-template-columns:1fr}.grid3,.dl-cards{grid-template-columns:1fr}.steps,.services{grid-template-columns:1fr 1fr}
  .nav{display:none}.ft .cols{grid-template-columns:1fr 1fr}.mock-ui{grid-template-columns:110px 1fr}
  .cmp{display:block;overflow-x:auto}
}
@media (max-width:560px){.steps,.services{grid-template-columns:1fr}.top .btn:not(.p){display:none}.ledger div{grid-template-columns:1fr}.ledger b{text-align:left}}
