:root{
    --green:#0D3324;--green-2:#164D38;--green-3:#1E6646;--green-4:#2D7A56;
    --gold:#C8973A;--gold-2:#E8B96A;
    --ink:#080F0C;--paper:#F2F5F0;--white:#FFFFFF;
    --muted:#6A7970;--line:rgba(12,20,15,.09);
    --disp:'Space Grotesk',system-ui,sans-serif;
    --sans:'Hanken Grotesk',system-ui,sans-serif;
  }
              [data-theme="afro"]{
    --green:#161109;--green-2:#173E2E;--green-3:#B5532A;--green-4:#2B241C;
    --gold:#A6781F;--gold-2:#C8973A;
    --ink:#161109;--paper:#F6F0E2;--white:#FAF6EE;
    --muted:#857A6A;--line:rgba(22,17,9,.1);
    --disp:'Bricolage Grotesque',system-ui,sans-serif;
  }
  [data-theme="afro"] .hero{background:radial-gradient(120% 120% at 85% -5%,#2B1A0E 0%,#161109 30%,var(--green) 60%,var(--ink) 100%)}
  [data-theme="afro"] .hero-glow{background:radial-gradient(circle,rgba(181,83,42,.28),transparent 62%)}
  [data-theme="afro"] .sec-head h2,[data-theme="afro"] .why-card h3,[data-theme="afro"] .del h3{font-weight:800}
  [data-theme="afro"] .eyebrow{border-radius:2px}
  [data-theme="afro"] .why-card,[data-theme="afro"] .del{border-radius:4px}

  *{margin:0;padding:0;box-sizing:border-box}
  html{scroll-behavior:smooth}
  body{font-family:var(--sans);background:var(--paper);color:var(--ink);line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
  a{color:inherit;text-decoration:none}
  .wrap{max-width:1160px;margin:0 auto;padding:0 44px}
  nav{position:fixed;inset:0 0 auto 0;z-index:100;transition:.5s}
  .nav-inner{display:flex;align-items:center;justify-content:space-between;padding:20px 44px;max-width:1248px;margin:0 auto}
  .logo{font-family:var(--disp);font-weight:700;font-size:21px;color:var(--white);letter-spacing:-.02em;display:flex;align-items:center;gap:9px}
  .logo .dot{width:7px;height:7px;border-radius:50%;background:var(--gold-2);animation:gp 2s ease-in-out infinite;box-shadow:0 0 10px 3px rgba(232,185,106,.5)}
  @keyframes gp{0%,100%{box-shadow:0 0 10px 3px rgba(232,185,106,.5)}50%{box-shadow:0 0 18px 5px rgba(232,185,106,.8)}}
  .logo b{color:var(--gold-2)}
  .nav-back{font-size:13.5px;font-weight:500;color:rgba(255,255,255,.65);display:flex;align-items:center;gap:7px;transition:color .3s}
  .nav-back:hover{color:var(--white)}
  .nav-cta{font-family:var(--disp);font-size:13.5px;font-weight:600;background:var(--gold-2);color:var(--ink);padding:11px 22px;border-radius:100px;transition:.35s}
  .nav-cta:hover{transform:translateY(-2px);box-shadow:0 12px 28px -8px rgba(232,185,106,.6)}
  .nav-right{display:flex;align-items:center;gap:10px}
  .nav-login{font-family:var(--disp);font-size:13.5px;font-weight:600;color:rgba(255,255,255,.85);border:1.5px solid rgba(255,255,255,.25);padding:10px 18px;border-radius:100px;display:inline-flex;align-items:center;gap:6px;transition:.35s;white-space:nowrap;text-decoration:none}
  .nav-login:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.5);color:#fff}
  @media(max-width:640px){.nav-login .nl-txt{display:none}}
  nav.scrolled{background:rgba(8,15,12,.9);backdrop-filter:blur(20px);border-bottom:1px solid rgba(255,255,255,.06)}
  .hero{position:relative;background:radial-gradient(120% 120% at 85% -5%,#2D1E00 0%,#1A3322 30%,var(--green) 60%,var(--ink) 100%);color:var(--white);padding:180px 0 110px;overflow:hidden;min-height:88vh;display:flex;align-items:center}
  .hero::before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.04) 1px,transparent 1px);background-size:36px 36px;mask-image:radial-gradient(70% 70% at 50% 50%,#000,transparent)}
  .hero-glow{position:absolute;width:640px;height:640px;border-radius:50%;right:-100px;top:-180px;background:radial-gradient(circle,rgba(200,151,58,.28),transparent 62%);filter:blur(14px);animation:gm 16s ease-in-out infinite;pointer-events:none}
  @keyframes gm{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(-30px,50px) scale(1.07)}}
  .hero-badge{display:inline-flex;align-items:center;gap:9px;background:rgba(232,185,106,.1);border:1px solid rgba(232,185,106,.25);backdrop-filter:blur(8px);padding:7px 16px;border-radius:100px;font-size:12.5px;color:rgba(255,255,255,.85);margin-bottom:26px;font-family:var(--disp);font-weight:600;letter-spacing:.04em;text-transform:uppercase;opacity:0;animation:up .7s .1s forwards}
  .hero-badge .bd{width:8px;height:8px;border-radius:50%;background:var(--gold-2);flex-shrink:0;box-shadow:0 0 8px rgba(232,185,106,.7)}
  .hero h1{font-family:var(--disp);font-weight:700;font-size:clamp(38px,5.4vw,76px);line-height:.97;letter-spacing:-.03em;max-width:16ch;opacity:0;animation:up .9s .2s forwards}
  .hero h1 .hl{color:var(--gold-2)}.hero h1 .ln{display:block}
  @keyframes up{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}
  .hero-sub{margin-top:28px;font-size:18.5px;color:rgba(255,255,255,.68);font-weight:300;max-width:50ch;line-height:1.72;opacity:0;animation:up .8s .5s forwards}
  .hero-actions{margin-top:38px;display:flex;gap:14px;flex-wrap:wrap;opacity:0;animation:up .8s .65s forwards}
  .btn{font-family:var(--disp);display:inline-flex;align-items:center;gap:9px;font-weight:600;font-size:15px;padding:15px 28px;border-radius:100px;transition:all .35s cubic-bezier(.4,0,.2,1)}
  .btn-gold{background:var(--gold-2);color:var(--ink);box-shadow:0 14px 36px -10px rgba(232,185,106,.6)}
  .btn-gold:hover{transform:translateY(-3px);box-shadow:0 22px 48px -12px rgba(232,185,106,.8)}
  .btn-out{border:1.5px solid rgba(255,255,255,.3);color:var(--white)}
  .btn-out:hover{background:rgba(255,255,255,.1)}
  .btn .a{transition:transform .35s}.btn:hover .a{transform:translateX(5px)}
  .hero-note{margin-top:28px;font-size:13.5px;color:rgba(255,255,255,.45);display:flex;align-items:center;gap:9px;opacity:0;animation:up .7s .8s forwards}
  .hero-note i{color:var(--gold-2);font-size:16px}
  .stats-bar{background:rgba(8,15,12,.96);padding:42px 0;border-bottom:1px solid rgba(255,255,255,.06)}
  .stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-left:1px solid rgba(255,255,255,.08)}
  .stat-item{padding:10px 36px;border-right:1px solid rgba(255,255,255,.08);text-align:center}
  .stat-item .n{font-family:var(--disp);font-weight:700;font-size:36px;color:var(--gold-2);letter-spacing:-.02em;line-height:1;display:block}
  .stat-item .l{font-size:13px;color:rgba(255,255,255,.5);margin-top:6px;max-width:18ch;margin-inline:auto;line-height:1.4}
  .pad{padding:110px 0}
  .reveal{opacity:0;transform:translateY(26px)}
  .eyebrow{display:inline-flex;align-items:center;gap:9px;font-size:11.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--green-3);background:rgba(45,122,86,.1);padding:6px 14px;border-radius:100px;border:1px solid rgba(45,122,86,.16)}
  .sec-head{max-width:720px;margin-bottom:60px}
  .sec-head h2{font-family:var(--disp);font-weight:700;font-size:clamp(30px,4vw,52px);line-height:1.04;letter-spacing:-.025em;margin-top:16px}
  .sec-head h2 .hl{color:var(--green-4)}
  .sec-head p{margin-top:16px;font-size:17px;color:var(--muted);line-height:1.7}
  .why{background:var(--white)}
  .why-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
  .why-card{background:var(--paper);border:1px solid var(--line);border-radius:22px;padding:36px 34px;transition:.4s cubic-bezier(.2,.8,.2,1)}
  .why-card:hover{transform:translateY(-6px);box-shadow:0 28px 56px -28px rgba(13,51,36,.18);border-color:rgba(45,122,86,.28)}
  .why-card.big{grid-column:span 2;background:linear-gradient(140deg,#3D2200,#1A3322);color:var(--white);display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:center}
  .why-card.big:hover{transform:translateY(-6px);box-shadow:0 36px 70px -28px rgba(13,51,36,.4)}
  .why-icon{font-size:34px;margin-bottom:18px;color:var(--green-3);line-height:1}
  .why-card.big .why-icon{color:rgba(255,255,255,.7)}
  .why-card h3{font-family:var(--disp);font-size:22px;font-weight:600;margin-bottom:12px;letter-spacing:-.015em}
  .why-card p{font-size:15px;color:var(--muted);line-height:1.68}
  .why-card.big p{color:rgba(255,255,255,.72)}
  .why-stat{text-align:right}
  .why-stat .n{font-family:var(--disp);font-weight:700;font-size:64px;color:var(--gold-2);letter-spacing:-.04em;line-height:1}
  .why-stat .l{font-size:14px;color:rgba(255,255,255,.58);max-width:22ch;margin-top:8px;line-height:1.5}
  .included{background:var(--paper)}
  .del-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
  .del{background:var(--white);border:1px solid var(--line);border-radius:20px;padding:32px 28px;transition:.4s cubic-bezier(.2,.8,.2,1)}
  .del:hover{transform:translateY(-5px);box-shadow:0 24px 50px -26px rgba(13,51,36,.16);border-color:rgba(200,151,58,.28)}
  .del-icon{width:52px;height:52px;border-radius:14px;background:rgba(45,122,86,.1);border:1px solid rgba(45,122,86,.16);display:flex;align-items:center;justify-content:center;font-size:24px;margin-bottom:18px;transition:.3s;color:var(--green-3)}
  .del:hover .del-icon{transform:scale(1.08);background:rgba(45,122,86,.18)}
  .del h3{font-family:var(--disp);font-size:18px;font-weight:600;margin-bottom:10px;letter-spacing:-.01em}
  .del p{font-size:14.5px;color:var(--muted);line-height:1.65;margin-bottom:14px}
  .del ul{padding:0;list-style:none;border-top:1px solid var(--line);padding-top:14px}
  .del ul li{font-size:13.5px;color:var(--muted);padding:5px 0;display:flex;align-items:center;gap:8px;border-bottom:1px solid var(--line)}
  .del ul li:last-child{border-bottom:none}
  .del ul li::before{content:"→";color:var(--gold);font-size:12px;flex-shrink:0}
  .process{background:linear-gradient(180deg,var(--green) 0%,#071B12 100%);color:var(--white);overflow:hidden;position:relative}
  .process::before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.03) 1px,transparent 1px);background-size:30px 30px}
  .process .sec-head h2{color:var(--white)}
  .process .sec-head h2 .hl{color:var(--gold-2)}
  .process .sec-head p{color:rgba(255,255,255,.55)}
  .process .eyebrow{color:rgba(194,240,216,.85);background:rgba(194,240,216,.1);border-color:rgba(194,240,216,.2)}
  .circuit-wrap{position:relative;margin-top:16px}
  .circuit-nodes{display:grid;grid-template-columns:1fr 80px 1fr 80px 1fr 80px 1fr;align-items:flex-start}
  .cstep{display:flex;flex-direction:column;align-items:center;text-align:center;padding:0 8px}
  .cnode{position:relative;width:68px;height:68px;border-radius:50%;border:1.5px solid rgba(232,185,106,.35);background:rgba(232,185,106,.08);display:flex;align-items:center;justify-content:center;font-family:var(--disp);font-weight:700;font-size:16px;color:var(--gold-2);margin-bottom:24px;z-index:2;backdrop-filter:blur(4px);transition:.4s}
  .cstep:hover .cnode{background:rgba(232,185,106,.2);border-color:var(--gold-2);transform:scale(1.1)}
  .cnode-ring{position:absolute;inset:-10px;border-radius:50%;border:1px solid rgba(232,185,106,.18);animation:cring 2.5s ease-in-out infinite}
  @keyframes cring{0%,100%{transform:scale(1);opacity:.6}50%{transform:scale(1.07);opacity:.15}}
  .cnode-active{background:rgba(232,185,106,.22);border-color:var(--gold-2);box-shadow:0 0 24px 6px rgba(232,185,106,.18)}
  .cstep h4{font-family:var(--disp);font-size:15.5px;font-weight:600;margin-bottom:8px}
  .cstep p{font-size:13px;color:rgba(255,255,255,.52);line-height:1.55;max-width:15ch}
  .cwire{display:flex;align-items:flex-start;padding-top:34px;position:relative;width:80px;flex-shrink:0}
  .cwire-line{position:absolute;top:34px;left:0;right:0;height:1.5px;background:rgba(232,185,106,.2)}
  .cwire-pulse{position:absolute;top:28px;height:4px;width:50px;border-radius:2px;background:linear-gradient(90deg,transparent,rgba(232,185,106,.95),transparent);filter:blur(1px);animation:fw-p 2.7s linear infinite;animation-delay:var(--d,0s)}
  @keyframes fw-p{0%{left:-50px;opacity:0}10%{opacity:1}90%{opacity:1}100%{left:calc(100% + 50px);opacity:0}}
  .circuit-return{position:relative;height:50px;margin-top:6px}
  .cr-corners::before,.cr-corners::after{content:"";position:absolute;bottom:0;width:1px;height:100%;background:linear-gradient(180deg,transparent,rgba(232,185,106,.25))}
  .cr-corners::before{left:calc(12.5% + 34px)}.cr-corners::after{right:calc(12.5% + 34px)}
  .cr-wire{position:absolute;bottom:0;height:1.5px;left:calc(12.5% + 34px);right:calc(12.5% + 34px);background:rgba(232,185,106,.14)}
  .cr-wire-label{position:absolute;bottom:10px;left:50%;transform:translateX(-50%);font-size:10px;font-family:var(--disp);font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:rgba(232,185,106,.33);white-space:nowrap}
  .cr-pulse{position:absolute;bottom:-1px;height:4px;width:50px;border-radius:2px;background:linear-gradient(270deg,transparent,rgba(232,185,106,.7),transparent);filter:blur(1px);animation:bw-p 2.7s linear infinite;animation-delay:var(--d,0s);right:-50px}
  @keyframes bw-p{0%{right:-50px;opacity:0}10%{opacity:1}90%{opacity:1}100%{right:calc(100% + 50px);opacity:0}}
  .faq{background:var(--paper)}
  .faq-list{max-width:840px;margin:0 auto}
  .faq-item{background:var(--white);border:1px solid var(--line);border-radius:14px;margin-bottom:12px;cursor:pointer;transition:.35s;overflow:hidden}
  .faq-item.open{border-color:var(--green-3)}
  .faq-q{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:20px 24px}
  .faq-q h4{font-family:var(--disp);font-size:17px;font-weight:600;letter-spacing:-.01em}
  .faq-tog{flex-shrink:0;width:30px;height:30px;border-radius:9px;background:var(--paper);display:flex;align-items:center;justify-content:center;font-size:18px;transition:.35s;color:var(--green-3)}
  .faq-item.open .faq-tog{background:var(--green-3);color:#fff;transform:rotate(45deg)}
  .faq-a{max-height:0;overflow:hidden;transition:max-height .4s ease,padding .4s ease;padding:0 24px;color:var(--muted);font-size:15px;line-height:1.72}
  .faq-item.open .faq-a{max-height:200px;padding:0 24px 22px}
  .endcta{background:radial-gradient(130% 130% at 50% 0%,var(--green-3),var(--green),#060E09);color:#fff;text-align:center;padding:120px 0;position:relative;overflow:hidden}
  .endcta::before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.04) 1px,transparent 1px);background-size:38px 38px}
  .endcta h2{position:relative;font-family:var(--disp);font-weight:700;font-size:clamp(34px,5vw,68px);line-height:1.04;letter-spacing:-.025em}
    .endcta h2 .hl{color:var(--gold-2)}
  .endcta p{position:relative;margin:20px auto 0;max-width:50ch;font-size:17.5px;color:rgba(255,255,255,.68);font-weight:300;line-height:1.7}
  .endcta .actions{position:relative;display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-top:36px}
  .endcta .note{position:relative;margin-top:18px;font-size:13px;color:rgba(255,255,255,.4)}
  footer{background:#050E09;color:rgba(255,255,255,.5);padding:44px 0 32px}
  .foot-inner{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:20px;border-top:1px solid rgba(255,255,255,.08);padding-top:28px;font-size:13px}
  .foot-inner .logo{font-size:19px;color:var(--white)}
  .foot-nav{display:flex;gap:24px;flex-wrap:wrap}
  .foot-nav a{transition:color .3s}.foot-nav a:hover{color:#fff}
  @media(max-width:900px){
    .nav-back{display:none}.stats-grid{grid-template-columns:repeat(2,1fr)}
    .why-grid,.del-grid{grid-template-columns:1fr}.why-card.big{grid-column:span 1;grid-template-columns:1fr}
    .circuit-nodes{grid-template-columns:1fr 50px 1fr 50px 1fr}.cstep:nth-child(7),.cwire:nth-child(6){display:none}
  }
  @media(max-width:640px){
    .wrap{padding:0 16px}
    .hero{padding:90px 0 48px}
    .pad{padding:52px 0}
    .nav-inner{padding:12px 16px}
    .nav-cta{display:none}
    .hero-actions{flex-direction:column;gap:9px}
    .hero-actions .btn{width:100%;justify-content:center;padding:15px 18px}
    .stats-grid{grid-template-columns:1fr 1fr}
    .circuit-nodes{grid-template-columns:1fr;gap:14px}
    .cwire{display:none}
    .cstep:nth-child(7){display:block}
    .cstep{text-align:center;padding:18px 14px}
    .cnode{margin:0 auto 12px}
  }
  @media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.reveal{opacity:1!important;transform:none!important}}