:root{color-scheme:dark;--bg:#0a0c0a;--surface:#111410;--green:#b4f745;--text:#f3f4ed;--muted:#999d92;--line:#2a2e25;--font:'Helvetica Neue',Helvetica,sans-serif;--radius:14px}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font);font-size:15px;line-height:1.6;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font:inherit}h1,h2,h3,p{margin:0}button,a{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible{outline:2px solid var(--green);outline-offset:5px}.wrap{max-width:1200px;margin-inline:auto;padding-inline:40px}.green{color:var(--green)}.icon{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}.sprite{position:absolute;width:0;height:0;overflow:hidden}.skip-link{position:absolute;top:-80px;left:20px;z-index:10;background:var(--green);color:var(--bg);padding:12px}.skip-link:focus{top:10px}.announcement{background:var(--green);color:var(--bg);padding:9px 20px;text-align:center;font-size:10px;font-weight:800;letter-spacing:1.4px;display:flex;align-items:center;justify-content:center;gap:16px}.status-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:currentColor;flex-shrink:0}.announcement-divider{opacity:.4}.header{height:104px;display:flex;align-items:center;justify-content:space-between;gap:25px}.brand{display:flex;align-items:center;gap:11px;font-size:15px;font-weight:850;line-height:1.05;letter-spacing:1.4px}.brand-icon{font-size:42px;letter-spacing:-5px;font-weight:900;line-height:1;padding-right:5px}.brand-icon span{color:var(--green)}.brand-sub{display:block;font-size:10px;letter-spacing:5.8px;margin-top:6px;color:var(--green)}nav{display:flex;gap:32px;font-size:12px;color:#b7bbae}nav a:hover,.phone-link:hover{color:var(--green)}.button{display:inline-flex;justify-content:center;align-items:center;gap:30px;border:1px solid var(--green);border-radius:7px;background:var(--green);color:var(--bg);padding:15px 23px;font-weight:750;font-size:13px;transition:transform .2s,background .2s}.button:hover{background:#c8ff73;transform:translateY(-2px)}.button>span{font-size:21px;line-height:1}.button-small{padding:10px 17px;gap:18px;font-size:12px}.hero{display:grid;grid-template-columns:1.15fr 1fr;align-items:center;min-height:580px;padding-top:25px;padding-bottom:65px;gap:35px}.eyebrow{font-family:var(--font);font-size:10px;font-weight:700;letter-spacing:1.9px;color:var(--green);display:flex;gap:9px;align-items:center}.hero h1{font-size:clamp(50px,5.7vw,78px);line-height:1.05;font-weight:800;letter-spacing:-4.5px;margin:24px 0}.outline-word{color:transparent;-webkit-text-stroke:1px #d5d9cd}.hero h1>.green{display:block}.hero-description{color:var(--muted);max-width:430px;font-size:14px;line-height:1.9}.hero-actions{display:flex;align-items:center;gap:27px;margin-top:30px}.phone-link{display:flex;align-items:center;gap:9px;font-size:13px;font-weight:600}.phone-link .icon{width:16px}.hero-note{display:flex;align-items:center;gap:9px;font-size:10px;color:var(--muted);margin-top:22px}.hero-note .icon{color:var(--green);width:14px;height:14px}.hero-note>span{padding:0 4px}.hero-art{position:relative;height:470px;display:grid;place-items:center;background:radial-gradient(ellipse at center,#b4f7100d 0%,transparent 65%)}.orbit{border:1px solid #b4f74518;position:absolute;width:380px;height:380px;border-radius:50%;transform:rotate(-28deg) scaleY(.72)}.orbit-two{width:450px;height:450px;transform:rotate(35deg) scaleY(.8)}.art-cross{position:absolute;color:#515f3a;font-size:24px;font-weight:200}.cross-one{top:70px;right:40px}.cross-two{bottom:100px;left:10px}.floating-label{position:absolute;font-size:8px;letter-spacing:2px;display:flex;align-items:center;gap:7px;color:var(--green)}.label-top{top:16px;right:50px}.data-phone{height:386px;width:216px;border:5px solid #30372a;border-radius:32px;background:#13180e;transform:rotate(10deg);position:relative;box-shadow:12px 20px 0 #050704;outline:1px solid #535b47;overflow:hidden}.phone-camera{position:absolute;top:8px;left:50%;transform:translateX(-50%);width:60px;height:14px;background:#050704;border-radius:20px}.phone-status{display:flex;justify-content:space-between;padding:11px 17px;font-size:8px}.phone-content{padding:15px 18px}.phone-logo{font-size:44px;font-weight:900;letter-spacing:-5px;line-height:1;margin-bottom:19px}.phone-logo span{color:var(--green)}.phone-kicker{font-size:6px;letter-spacing:1.5px;color:var(--muted)}.phone-title{font-size:26px;line-height:1.14;font-weight:750;letter-spacing:-1px;margin-top:9px}.phone-title span{color:var(--green)}.signal{height:94px;display:flex;align-items:flex-end;gap:7px;margin-top:12px}.signal i{display:block;flex:1;border-radius:5px 5px 0 0;background:var(--green);height:25%}.signal i:nth-child(2){height:42%;background:#a6e63b}.signal i:nth-child(3){height:61%;background:#94d030}.signal i:nth-child(4){height:80%;background:#86bd2b}.signal i:nth-child(5){height:100%;background:#75a823}.phone-networks{display:flex;justify-content:space-between;font-size:8px;margin-top:17px;align-items:center}.phone-networks b:first-child{border:1px solid currentColor;border-radius:50%;padding:1px 4px}.phone-bottom{display:flex;justify-content:space-between;border-top:1px solid #38412d;font-size:6px;letter-spacing:1px;padding-top:10px;margin-top:14px;color:var(--muted)}.delivery-tag{position:absolute;bottom:33px;left:8px;display:flex;align-items:center;gap:12px;border:1px solid #3b4531;background:#192014;padding:15px 19px;border-radius:10px;transform:rotate(-5deg)}.tag-icon{color:var(--green);background:#26351b;display:grid;place-items:center;width:35px;height:35px;border-radius:50%}.delivery-tag strong,.delivery-tag div>span{display:block;font-size:11px}.delivery-tag div>span{font-size:9px;color:var(--muted)}.delivery-tag>.green{margin-left:12px}.art-caption{position:absolute;bottom:0;right:10px;font-size:7px;letter-spacing:2px;color:#69725e}.network-strip{border-block:1px solid var(--line);background:#10120e}.network-inner{min-height:100px;display:flex;align-items:center;justify-content:space-between;gap:35px}.network-inner>span:first-child{font-size:9px;letter-spacing:1.2px;line-height:1.8;color:var(--muted)}.network-inner strong{font-weight:700;color:var(--text)}.network-logo{font-size:30px;font-weight:750;color:#dadcd4;letter-spacing:-1.5px}.mtn-logo{border:2px solid currentColor;border-radius:50%;line-height:1.2;padding:2px 13px;font-style:italic;font-size:25px}.vodacom-logo{font-size:26px;letter-spacing:-1px}.vodacom-logo>span{font-size:32px;vertical-align:-2px}.telkom-logo{font-weight:800}.telkom-logo>span{color:var(--green)}.strip-note{font-size:10px;color:var(--muted);line-height:1.8}.bundles{padding-top:85px;padding-bottom:75px}.section-top{display:flex;justify-content:space-between;align-items:end;gap:25px}h2{font-size:39px;line-height:1.15;letter-spacing:-1.7px;font-weight:750}.section-top h2{margin-top:14px}.section-top>p{color:var(--muted);font-size:12px;line-height:1.8}.filter-bar{margin-top:34px;margin-bottom:23px;display:flex;align-items:center;justify-content:space-between;gap:16px}.filters{display:flex;gap:6px;padding:5px;border:1px solid var(--line);border-radius:8px;background:#10130e}.filters[hidden]{display:none}.filter{padding:8px 16px;border:0;border-radius:5px;background:transparent;color:var(--muted);font-size:11px;cursor:pointer}.filter.active{background:var(--green);color:var(--bg);font-weight:700}.filter:hover:not(.active){color:var(--text);background:#24291e}.price-note{font-size:10px;color:var(--muted)}.network-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;align-items:start}.network-card{padding:25px;border:1px solid var(--line);background:var(--surface);border-radius:var(--radius);border-top:3px solid var(--network-color)}.network-card[hidden]{display:none}.network-card.mtn{--network-color:#ffce38}.network-card.vodacom{--network-color:#fc5d5d}.network-card.telkom{--network-color:#53bbed}.card-heading{display:flex;align-items:center;justify-content:space-between;gap:10px}.card-heading h3{font-size:23px;letter-spacing:-.8px;color:var(--network-color)}.network-badge{font-size:7px;letter-spacing:1px;color:var(--muted);padding:4px 7px;border:1px solid var(--line);border-radius:4px}.card-intro{font-size:10px;color:var(--muted);margin-top:5px;margin-bottom:20px}.bundle-row{display:flex;justify-content:space-between;align-items:center;padding:18px 0;border-top:1px solid var(--line);gap:12px}.bundle-row strong{font-size:23px;letter-spacing:-.8px;line-height:1.2}.bundle-row small{display:block;font-size:9px;color:var(--muted);margin-top:4px}.bundle-price{font-size:23px;font-weight:700;display:flex;align-items:center;gap:15px;letter-spacing:-.8px}.row-arrow{display:grid;place-items:center;border:1px solid #353a2e;width:26px;height:26px;border-radius:50%;color:var(--muted);font-size:15px}.bundle-row:hover strong,.bundle-row:hover .bundle-price{color:var(--green)}.bundle-row:hover .row-arrow{background:var(--green);color:var(--bg);border-color:var(--green)}.network-order{display:flex;align-items:center;justify-content:space-between;border:1px solid #39432e;border-radius:5px;color:var(--green);font-size:10px;font-weight:650;padding:11px 12px;margin-top:15px;gap:8px}.network-order .icon{width:16px;height:16px}.network-order:hover{background:#202b15}.bundle-help{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:7px;font-size:11px;color:var(--muted);margin-top:26px}.bundle-help .icon{width:15px}.bundle-help a{color:var(--green)}.why-section{background:#10130f;border-block:1px solid var(--line);padding:72px 0}.why-layout{display:grid;grid-template-columns:1fr 1.1fr;gap:85px}.why-layout h2{margin-top:17px}.why-description{font-size:12px;color:var(--muted);max-width:290px;margin-top:20px;line-height:1.9}.text-link{display:inline-flex;align-items:center;gap:22px;font-size:11px;color:var(--green);font-weight:650}.why-layout .text-link{margin-top:25px}.benefits article{display:flex;align-items:start;gap:18px;padding:22px 0;border-bottom:1px solid var(--line)}.benefits article:first-child{padding-top:0}.benefits article:last-child{border-bottom:0;padding-bottom:0}.benefit-number{font-size:9px;color:var(--green);padding-top:5px}.benefits h3{font-size:16px;letter-spacing:-.3px}.benefits p{font-size:11px;line-height:1.9;color:var(--muted);max-width:315px;margin-top:7px}.benefits .icon{color:var(--green);margin-left:auto;width:25px;height:25px}.how{padding-top:65px;padding-bottom:70px}.how-grid{display:grid;grid-template-columns:1.25fr 1fr 1fr 1fr;gap:38px;margin-top:23px}.how h2{font-size:31px}.how-grid>div>span{color:var(--green);font-size:9px;letter-spacing:1.4px}.how h3{font-size:14px;margin-top:12px;letter-spacing:-.3px}.how p:not(.eyebrow){font-size:11px;color:var(--muted);margin-top:6px}.contact{padding-bottom:70px}.contact-panel{background:var(--green);border-radius:15px;color:var(--bg);padding:43px 46px;display:flex;justify-content:space-between;align-items:center;position:relative;overflow:hidden;gap:30px}.contact-panel .eyebrow{color:#354918;font-size:9px}.contact-panel h2{font-size:43px;letter-spacing:-1.8px;margin-top:14px}.contact-panel h2>span{color:#5a7b27}.contact-panel p:not(.eyebrow){font-size:12px;margin-top:13px;color:#354918}.button-dark{color:var(--green);background:var(--bg);border-color:var(--bg);gap:15px;white-space:nowrap}.button-dark:hover{background:#242e18}.contact-action{text-align:center}.contact-phone{display:block;color:#263417;font-size:14px;font-weight:650;margin-top:15px}footer{padding-bottom:25px}.footer-top{display:flex;align-items:center;justify-content:space-between;gap:25px;padding-bottom:33px}.footer-top p{font-size:11px}.footer-top p>span{font-size:9px;color:var(--muted)}.footer-bottom{border-top:1px solid var(--line);padding-top:19px;display:flex;justify-content:space-between;gap:20px;color:#737a69;font-size:8px}.mobile-order{display:none}
@media(min-width:850px){.hero-copy{animation:enter .65s both}.hero-art{animation:enter .8s .12s both}@keyframes enter{from{opacity:0;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}}
@media(min-width:1100px){.network-card{min-height:439px;display:flex;flex-direction:column}.bundle-rows{flex:1}.network-card.mtn{min-height:528px}.network-cards{align-items:stretch}.network-card.vodacom,.network-card.telkom{min-height:528px}.network-card.vodacom .bundle-row,.network-card.telkom .bundle-row{padding-block:28px}}
@media(max-width:950px){.wrap{padding-inline:28px}.header nav{gap:20px}.hero{gap:0}.hero h1{font-size:61px}.hero-art{transform:scale(.9);transform-origin:center}.hero-actions{gap:15px;flex-wrap:wrap}.network-card{padding:19px}.network-badge{font-size:6px}.bundle-price{gap:9px}.why-layout{gap:40px}.how-grid{gap:22px}.contact-panel{padding:35px}.contact-panel h2{font-size:36px}}
@media(max-width:700px){.wrap{padding-inline:22px}.announcement{font-size:7px;letter-spacing:.8px;gap:7px;padding:9px 10px}.announcement .status-dot{width:4px;height:4px}.announcement-divider{display:none}.header{height:86px}.header nav{display:none}.brand{font-size:13px}.brand-icon{font-size:36px}.brand-sub{font-size:8px;letter-spacing:5.3px}.button-small{padding:9px 12px;font-size:10px;gap:12px}.hero{grid-template-columns:1fr;padding-top:26px;padding-bottom:30px;gap:10px}.hero h1{font-size:clamp(54px,12vw,78px);letter-spacing:-3px;max-width:560px;margin-top:21px}.hero-description{font-size:13px;max-width:440px}.eyebrow{font-size:8px;letter-spacing:1.5px}.hero-actions{gap:22px;margin-top:24px}.button{padding:14px 18px;font-size:12px;gap:20px}.button-small{padding:9px 12px;font-size:10px;gap:12px}.phone-link{font-size:12px}.hero-note{font-size:9px}.hero-art{height:390px;transform:scale(.88);margin-block:-6px;max-width:420px;width:100%;justify-self:center}.label-top{right:5px;top:0}.delivery-tag{bottom:-2px;left:5px}.art-caption{bottom:-23px}.network-inner{min-height:88px;gap:15px;flex-wrap:wrap;justify-content:space-between}.network-inner>span:first-child{font-size:7px;letter-spacing:.4px}.network-logo{font-size:22px}.mtn-logo{font-size:18px;padding:1px 9px}.vodacom-logo{font-size:19px}.vodacom-logo>span{font-size:23px}.strip-note{display:none}.bundles{padding-top:53px;padding-bottom:45px}.section-top{display:block}.section-top h2{font-size:33px;margin-top:11px;letter-spacing:-1.4px}.section-top>p{margin-top:15px;font-size:11px}.section-top>p br{display:none}.filter-bar{align-items:start;flex-direction:column;margin-top:24px;gap:13px}.filters{width:100%;justify-content:space-between}.filter{padding:8px 13px;font-size:10px}.price-note{font-size:9px}.network-cards{grid-template-columns:1fr;gap:18px}.network-card{padding:23px}.network-badge{font-size:8px}.card-heading h3{font-size:26px}.card-intro{font-size:11px}.bundle-row{padding:17px 0}.bundle-price{gap:24px}.bundle-row strong,.bundle-price{font-size:25px}.bundle-row small{font-size:10px}.network-order{padding:13px;font-size:12px}.bundle-help{font-size:10px;margin-top:23px}.why-section{padding:45px 0}.why-layout{grid-template-columns:1fr;gap:35px}.why-layout h2{font-size:35px}.why-description{max-width:360px}.benefits h3{font-size:15px}.benefits p{font-size:11px}.how{padding-top:45px;padding-bottom:45px}.how-grid{grid-template-columns:1fr;gap:26px}.how h2{font-size:33px}.how-grid>div{border-top:1px solid var(--line);padding-top:20px}.how-grid>div>span{font-size:9px}.how h3{margin-top:7px;font-size:16px}.how p:not(.eyebrow){font-size:12px}.contact{padding-bottom:45px}.contact-panel{padding:29px 24px;display:block}.contact-panel h2{font-size:35px}.contact-panel p:not(.eyebrow){font-size:11px}.contact-action{margin-top:25px}.contact-action .button{width:100%;justify-content:space-between}.contact-phone{font-size:13px}.footer-top{flex-wrap:wrap;align-items:start;gap:24px}.footer-top p{order:3;width:100%;font-size:11px}.footer-top p>span{font-size:10px}.footer-top>.text-link{font-size:10px}.footer-bottom{flex-direction:column;gap:8px;font-size:9px}footer{padding-bottom:95px}.mobile-order{display:flex;align-items:center;justify-content:center;gap:13px;position:fixed;bottom:15px;left:20px;right:20px;background:var(--green);color:var(--bg);border:1px solid #d0ff87;border-radius:8px;padding:14px;font-weight:750;font-size:13px;z-index:5;box-shadow:0 5px 30px #05070480}.mobile-order>span{margin-left:auto}.mobile-order .icon{margin-right:auto}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}
/* Keep decorative orbits inside the illustration at narrow screen widths. */
@media(max-width:700px){.hero-art{clip-path:inset(-35px 0 -40px)}}
