.home-hero{position:relative;overflow:hidden;padding:145px 0 0;background:radial-gradient(circle at 82% 40%,rgba(37,99,235,.15),transparent 32%),linear-gradient(180deg,#06111e,#071322)}
.home-hero-layout{position:relative;z-index:1;display:grid;grid-template-columns:1.05fr .95fr;gap:54px;align-items:center;padding-bottom:45px}
.home-hero-copy{position:relative;z-index:1;animation:home-arrive .7s cubic-bezier(.2,.75,.25,1) both}
.home-hero-copy h1{font-family:'Space Grotesk';font-size:clamp(43px,5.6vw,68px);line-height:1.02;letter-spacing:-3px}
.home-hero-copy h1 em{color:var(--brand2);font-style:normal}
.home-hero-copy>p{max-width:620px;margin:21px 0 25px;color:var(--muted);font-size:16px}
.home-hero-actions{display:flex;flex-wrap:wrap;gap:11px}
.home-proof{display:flex;align-items:center;gap:11px;margin-top:32px;color:var(--soft);font-size:11px;line-height:1.5}
.home-proof-mark{display:grid;width:38px;height:38px;place-items:center;border:1px solid rgba(56,189,248,.25);border-radius:12px;background:rgba(56,189,248,.07);color:var(--brand2);font-family:'Space Grotesk';font-weight:800}
.home-portrait-wrap{position:relative;width:100%;max-width:480px;margin:0 auto;padding:20px;animation:home-arrive .8s cubic-bezier(.2,.75,.25,1) .12s both}
.home-portrait-frame{position:relative;z-index:1;overflow:hidden;border:1px solid #284762;border-radius:26px;background:linear-gradient(145deg,#0b2137,#07121e);box-shadow:var(--shadow);transform:rotate(2deg)}
.home-portrait-frame img{display:block;width:100%;aspect-ratio:4/4.7;object-fit:cover;object-position:center 30%;border-radius:22px}
.home-code-card{position:absolute;z-index:2;bottom:-3px;left:-8px;width:min(250px,76%);overflow:hidden;border:1px solid #29415b;border-radius:12px;background:rgba(6,16,29,.97);box-shadow:0 18px 42px rgba(0,0,0,.36)}
.home-code-toolbar{display:flex;height:31px;align-items:center;gap:9px;padding:0 10px;border-bottom:1px solid #1b3046;background:#0b1928}
.home-code-toolbar>span{display:flex;gap:4px}
.home-code-toolbar i{width:6px;height:6px;border-radius:50%;background:#42576b}
.home-code-toolbar i:first-child{background:#38bdf8}
.home-code-toolbar small{color:#a9b9ca;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:8px}
.home-code-toolbar b{margin-left:auto;color:#6e859c;font-size:7px;letter-spacing:.8px}
.home-code-snippet{display:grid;grid-template-columns:19px minmax(0,1fr);gap:5px 8px;align-items:center;padding:11px 10px 12px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:9px;line-height:1.6}
.home-code-number{color:#536980;text-align:right}
.home-code-snippet code{overflow:hidden;color:#d9e4ef;font:inherit;white-space:nowrap}
.home-code-typing{display:inline-block;width:30ch;max-width:0;overflow:hidden;border-right:1px solid var(--brand2);vertical-align:bottom;animation:home-code-type 1.8s steps(30,end) .45s forwards,home-code-caret .75s step-end 2.25s 4}
.home-code-muted{color:#38bdf8}
.home-code-value{color:#8bd49c}
.home-code-snippet code:nth-of-type(2){animation:home-code-reveal .4s ease 2.4s both}
.home-portrait-caption{position:absolute;z-index:2;right:-6px;bottom:47px;display:flex;align-items:center;gap:11px;padding:13px 16px;border:1px solid #29415b;border-radius:13px;background:rgba(9,23,39,.96);box-shadow:0 16px 40px rgba(0,0,0,.28)}
.home-portrait-caption strong,.home-portrait-caption small{display:block}
.home-portrait-caption strong{color:#eaf1f8;font-size:11px}
.home-portrait-caption small{margin-top:3px;color:var(--soft);font-size:9px}
.home-caption-dot{width:9px;height:9px;border-radius:50%;background:var(--brand2);box-shadow:0 0 14px var(--brand2)}
.home-orbit{position:absolute;border:1px solid rgba(56,189,248,.18);border-radius:50%}
.home-orbit-one{inset:4px 0 0}
.home-orbit-two{inset:-12px 12px 12px -12px;border-color:rgba(37,99,235,.18)}
.home-work-link:hover,.home-heading-link:hover,.home-final-actions>a:last-child:hover{color:var(--brand2)}
.home-trust-strip{position:relative;z-index:1;display:grid;grid-template-columns:1.15fr repeat(3,1fr) 1.2fr;align-items:center;gap:17px;padding:22px 0;border-top:1px solid rgba(255,255,255,.1)}
.home-trust-intro{color:#a7b7c9;font-size:10px;font-weight:700;line-height:1.45}
.home-trust-strip>div{padding-left:18px;border-left:1px solid rgba(255,255,255,.11)}
.home-trust-strip>div strong,.home-trust-strip>div span{display:block}
.home-trust-strip>div strong{font-family:'Space Grotesk';font-size:19px;line-height:1.2}
.home-trust-strip>div span{margin-top:3px;color:var(--soft);font-size:9px}
.home-trust-strip>a{justify-self:end;color:var(--brand2);font-size:10px;font-weight:800}
.home-apps-section{padding:56px 0 61px;border-bottom:1px solid rgba(255,255,255,.05);background:linear-gradient(180deg,rgba(8,22,37,.7),rgba(6,16,29,.35))}
.home-apps-heading{max-width:650px;margin:0 auto 32px;text-align:center}
.home-apps-heading .eyebrow{justify-content:center;margin-bottom:8px}
.home-apps-heading h2{font-family:'Space Grotesk';font-size:clamp(29px,3.5vw,39px);line-height:1.1;letter-spacing:-1.5px}
.home-apps-heading>p{margin-top:8px;color:var(--muted);font-size:12px}
.home-app-groups{display:grid;grid-template-columns:.8fr 1.2fr;gap:35px}
.home-app-group h3{margin-bottom:14px;color:#9db0c4;font-size:9px;font-weight:800;letter-spacing:1px;text-align:center;text-transform:uppercase}
.home-app-grid{display:grid;gap:10px;list-style:none}
.home-app-grid-local{grid-template-columns:repeat(4,minmax(0,1fr))}
.home-app-grid-global{grid-template-columns:repeat(6,minmax(0,1fr))}
.home-app-tile{display:flex;min-width:0;min-height:105px;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:12px 7px;border:1px solid rgba(255,255,255,.07);border-radius:14px;background:rgba(12,26,43,.67);color:#dce6f0;text-align:center;transition:transform .18s,border-color .18s,background .18s}
.home-app-tile:hover{transform:translateY(-3px);border-color:rgba(56,189,248,.34);background:rgba(16,35,58,.9)}
.home-app-tile>span:last-child{font-size:9px;font-weight:700;line-height:1.3}
.home-app-icon{display:grid;width:45px;height:45px;place-items:center;border:1px solid rgba(255,255,255,.13);border-radius:13px;background:#112238;color:#fff}
.home-app-icon svg{display:block;width:27px;height:27px}
.home-app-capitec{background:#f1f5f9;color:#ec6b22}
.home-app-checkers{background:#16833d;color:#fff}
.home-app-takealot{background:#fff;color:#ed6828}
.home-app-takealot span{font-family:'Space Grotesk';font-size:32px;font-weight:700;line-height:1}
.home-app-mrd{background:#e83442;color:#fff}
.home-app-whatsapp{background:#20c66b;color:#fff}
.home-app-youtube{background:#fce8e8;color:#f20c0c}
.home-app-instagram{background:linear-gradient(135deg,#7353d6,#d94387 60%,#f2a14a);color:#fff}
.home-app-tiktok{background:#101114;color:#fff}
.home-app-uber{background:#f4f6f9;color:#101318}
.home-app-uber span{font-family:'Space Grotesk';font-size:28px;font-weight:700;line-height:1}
.home-app-spotify{background:#101d18;color:#1ed760}
.home-apps-note{margin-top:19px;color:#687c92;font-size:8px;text-align:center}
.home-section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:30px;margin-bottom:32px}
.home-section-heading h2,.home-process-intro h2,.home-final-cta h2{margin-top:3px;font-family:'Space Grotesk';font-size:clamp(33px,4.2vw,49px);line-height:1.06;letter-spacing:-2.1px}
.home-section-heading>p{max-width:360px;color:var(--muted);font-size:12px}
.home-services-section{padding-top:80px;padding-bottom:80px}
.home-services-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.home-service-card{position:relative;display:flex;min-height:255px;flex-direction:column;align-items:flex-start;padding:23px;border:1px solid var(--line);border-radius:17px;background:linear-gradient(145deg,#0e1d2e,#0a1624);transition:transform .2s,border-color .2s}
.home-service-card:hover{transform:translateY(-4px);border-color:rgba(56,189,248,.45)}
.home-service-number{color:var(--soft);font-size:8px;font-weight:800;letter-spacing:1.1px}
.home-service-icon{display:grid;width:39px;height:39px;place-items:center;margin:20px 0 15px;border:1px solid rgba(56,189,248,.19);border-radius:11px;background:rgba(37,99,235,.09);color:var(--brand2);font-family:'Space Grotesk';font-size:14px;font-weight:700}
.home-service-card h3,.home-project-copy h3,.home-process-list h3{font-family:'Space Grotesk'}
.home-service-card h3{font-size:18px;letter-spacing:-.35px}
.home-service-card>p{margin-top:7px;color:var(--muted);font-size:11px;line-height:1.7}
.home-card-link{display:inline-flex;align-items:center;gap:7px;margin-top:auto;padding-top:17px;color:var(--brand2);font-size:10px;font-weight:800}
.home-card-link b{font-size:14px;transition:transform .18s}
.home-card-link:hover{color:#fff}
.home-card-link:hover b{transform:translateX(3px)}
.home-services-all,.home-heading-link{display:inline-flex;align-items:center;gap:8px;color:var(--brand2);font-size:11px;font-weight:800}
.home-services-all{margin-top:20px}
.home-work-section{padding-top:76px;padding-bottom:80px}
.home-work-section.alt,.home-faq-section.alt{background:rgba(8,22,37,.72);border-block:1px solid #142b42}
.home-section-heading .eyebrow,.home-final-cta .eyebrow{margin-bottom:8px}
.home-work-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}
.home-project-card{overflow:hidden;border:1px solid var(--line);border-radius:17px;background:linear-gradient(180deg,#0d1b2c,#091522);transition:transform .2s,border-color .2s}
.home-project-card:hover{transform:translateY(-4px);border-color:rgba(56,189,248,.38)}
.home-project-image{display:block;overflow:hidden;background:#081522}
.home-project-image img{width:100%;height:210px;object-fit:cover;transition:transform .35s}
.home-project-card:hover .home-project-image img{transform:scale(1.035)}
.home-project-copy{padding:18px 19px 20px}
.home-project-meta{display:flex;justify-content:space-between;gap:10px;color:var(--soft);font-size:8px;font-weight:800;letter-spacing:.8px}
.home-project-meta span:first-child{color:var(--brand2)}
.home-project-copy h3{margin-top:13px;font-size:20px}
.home-project-copy>p{min-height:57px;margin-top:6px;color:var(--muted);font-size:10px;line-height:1.7}
.home-project-copy .home-card-link{padding-top:13px}
.home-process-section{padding-top:83px;padding-bottom:82px}
.home-process-section>.container{display:grid;grid-template-columns:.75fr 1.25fr;gap:75px;align-items:start}
.home-process-intro{position:sticky;top:110px}
.home-process-intro h2{font-size:clamp(36px,4.3vw,52px)}
.home-process-intro>p{max-width:340px;margin:15px 0 20px;color:var(--muted);font-size:12px;line-height:1.8}
.home-process-intro .btn{font-size:11px}
.home-process-list{border-top:1px solid var(--line)}
.home-process-list article{display:grid;grid-template-columns:36px 1fr 36px;gap:15px;align-items:center;padding:22px 0;border-bottom:1px solid var(--line)}
.home-process-list article>span:first-child{align-self:start;padding-top:4px;color:var(--brand2);font-family:'Space Grotesk';font-size:11px;font-weight:700}
.home-process-list h3{font-size:17px}
.home-process-list p{max-width:490px;margin-top:5px;color:var(--muted);font-size:10px;line-height:1.7}
.home-process-symbol{display:grid;width:34px;height:34px;place-items:center;border:1px solid var(--line);border-radius:10px;color:#8ba2ba;font-family:'Space Grotesk';font-size:13px}
.home-faq-section{padding-top:76px;padding-bottom:78px}
.home-faq-layout{display:grid;grid-template-columns:.8fr 1.2fr;gap:70px;align-items:start}
.home-faq-intro{position:sticky;top:110px}
.home-faq-intro h2{font-family:'Space Grotesk';font-size:clamp(36px,4.6vw,52px);line-height:1.04;letter-spacing:-2px}
.home-faq-intro h2 em{color:var(--brand2);font-style:normal}
.home-faq-intro>p{max-width:370px;margin:15px 0 19px;color:var(--muted);font-size:12px}
.home-faq-list{display:grid;gap:9px}
.home-faq-item{overflow:hidden;border:1px solid var(--line);border-radius:13px;background:linear-gradient(180deg,#0d1b2c,#0a1625)}
.home-faq-item summary{display:grid;grid-template-columns:34px 1fr 25px;align-items:center;gap:12px;padding:17px 18px;list-style:none;cursor:pointer}
.home-faq-item summary::-webkit-details-marker{display:none}
.home-faq-index{color:var(--brand2);font-size:9px;font-weight:800}
.home-faq-question{font-size:12px;font-weight:700}
.home-faq-toggle{position:relative;width:22px;height:22px;border:1px solid #30465e;border-radius:7px}
.home-faq-toggle:before,.home-faq-toggle:after{position:absolute;top:50%;left:50%;width:9px;height:1px;content:"";background:#a9bdd2;transform:translate(-50%,-50%)}
.home-faq-toggle:after{transform:translate(-50%,-50%) rotate(90deg);transition:transform .18s}
.home-faq-item[open] .home-faq-toggle:after{transform:translate(-50%,-50%)}
.home-faq-answer{padding:0 18px 17px 64px}
.home-faq-answer p{color:var(--muted);font-size:10px;line-height:1.75}
.home-final-section{padding-top:65px;padding-bottom:76px}
.home-final-cta{display:flex;align-items:center;justify-content:space-between;gap:36px;padding:clamp(25px,4vw,43px);border:1px solid rgba(56,189,248,.21);border-radius:20px;background:radial-gradient(circle at 88% 10%,rgba(37,99,235,.17),transparent 32%),linear-gradient(145deg,#0e2238,#091522)}
.home-final-cta>div:first-child{max-width:670px}
.home-final-cta h2{font-size:clamp(31px,4.1vw,46px)}
.home-final-cta>div:first-child>p{max-width:570px;margin-top:11px;color:var(--muted);font-size:12px}
.home-final-actions{display:flex;min-width:max-content;flex-direction:column;align-items:flex-start;gap:13px}
.home-final-actions .btn{font-size:11px}
.home-final-actions>a:last-child{color:#a9bdd1;font-size:10px;font-weight:800}
@keyframes home-arrive{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
@keyframes home-code-type{to{max-width:30ch}}
@keyframes home-code-caret{50%{border-color:transparent}}
@keyframes home-code-reveal{from{opacity:0}to{opacity:1}}
@media(max-width:950px){.home-hero-layout{grid-template-columns:1fr .8fr;gap:40px}.home-hero-copy h1{font-size:clamp(46px,6.5vw,64px)}.home-trust-strip{grid-template-columns:1fr repeat(2,1fr) 1.1fr}.home-trust-strip>div:nth-of-type(3){display:none}.home-process-section>.container{gap:40px}.home-faq-layout{gap:38px}}
@media(max-width:850px){.home-app-groups{grid-template-columns:1fr;gap:24px}.home-app-grid-global{grid-template-columns:repeat(6,minmax(0,1fr))}}
@media(max-width:700px){.home-hero{padding-top:116px}.home-hero-layout{grid-template-columns:1fr;gap:33px;padding-bottom:42px}.home-hero-copy h1{max-width:570px;font-size:clamp(44px,11vw,60px);letter-spacing:-2.7px}.home-hero-copy>p{font-size:14px}.home-hero-assurance{margin-top:25px}.home-hero-visual{max-width:490px;justify-self:center}.home-visual-image img{height:260px}.home-floating-proof{top:85px;left:-8px}.home-trust-strip{grid-template-columns:repeat(3,1fr);gap:14px;padding:17px 0}.home-trust-intro{grid-column:1/-1}.home-trust-strip>div{padding-left:10px}.home-trust-strip>div strong{font-size:17px}.home-trust-strip>div span{font-size:8px}.home-trust-strip>div:nth-of-type(3){display:block}.home-trust-strip>a{grid-column:1/-1;justify-self:start}.home-services-section,.home-process-section,.home-faq-section{padding-top:60px;padding-bottom:60px}.home-section-heading{align-items:flex-start;flex-direction:column;gap:12px;margin-bottom:23px}.home-section-heading h2,.home-process-intro h2{font-size:36px;letter-spacing:-1.5px}.home-section-heading>p{font-size:11px}.home-services-grid{grid-template-columns:1fr}.home-service-card{min-height:215px;padding:20px}.home-service-icon{margin:14px 0 10px}.home-work-section{padding-top:60px;padding-bottom:62px}.home-work-grid{grid-template-columns:1fr}.home-project-image img{height:230px}.home-project-copy>p{min-height:unset}.home-heading-link{padding-top:3px}.home-process-section>.container{grid-template-columns:1fr;gap:27px}.home-process-intro{position:static}.home-process-intro>p{max-width:470px}.home-process-list article{grid-template-columns:27px 1fr 32px;gap:10px;padding:18px 0}.home-process-list h3{font-size:15px}.home-faq-layout{grid-template-columns:1fr;gap:23px}.home-faq-intro{position:static}.home-faq-intro h2{font-size:38px}.home-final-section{padding-top:45px;padding-bottom:55px}.home-final-cta{align-items:flex-start;flex-direction:column;gap:22px;padding:23px}.home-final-cta h2{font-size:34px}.home-final-actions{min-width:0;width:100%}.home-final-actions .btn{width:100%}}
@media(max-width:620px){.home-apps-section{padding:45px 0}.home-apps-heading{margin-bottom:23px}.home-apps-heading h2{font-size:30px}.home-apps-heading>p{font-size:11px}.home-app-group h3{text-align:left}.home-app-grid-local{grid-template-columns:repeat(2,minmax(0,1fr))}.home-app-grid-global{grid-template-columns:repeat(3,minmax(0,1fr))}.home-app-tile{min-height:94px}.home-app-icon{width:41px;height:41px}.home-app-icon svg{width:25px;height:25px}.home-apps-note{max-width:340px;margin-inline:auto;line-height:1.6}}
@media(max-width:900px){.home-hero-layout{grid-template-columns:1fr;gap:30px;padding-bottom:36px}.home-hero-copy{max-width:720px}.home-portrait-wrap{max-width:430px}}
@media(max-width:620px){.home-hero{padding:116px 0 0}.home-hero-layout{gap:24px;padding-bottom:32px}.home-hero-copy h1{font-size:44px;letter-spacing:-2px}.home-hero-copy>p{font-size:14px}.home-portrait-wrap{padding:14px}.home-portrait-caption{right:-5px;bottom:35px}}
@media(max-width:620px){.home-portrait-caption{position:relative;right:auto;bottom:auto;width:max-content;max-width:100%;margin:-54px 0 0 auto}.home-code-card{position:relative;bottom:auto;left:auto;width:min(290px,100%);margin:12px auto 0}.home-code-snippet{font-size:8px}}
@media(prefers-reduced-motion:reduce){.home-hero-copy,.home-portrait-wrap{animation:none}.home-code-typing{max-width:30ch;border-right:0;animation:none}.home-code-snippet code:nth-of-type(2){opacity:1;animation:none}.home-service-card,.home-project-card,.home-project-image img,.home-card-link b,.home-faq-toggle:after{transition:none}}
