:root{
  --bg:#050807;
  --panel:#111715;
  --panel2:#151c19;
  --green:#67e22f;
  --green2:#39b82b;
  --green-soft:#b9ff8f;
  --text:#f7fbf8;
  --muted:#a4b0aa;
  --line:rgba(255,255,255,.09);
  --light:#f3f5f3;
  --darktext:#121a16;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,sans-serif;background:var(--bg);color:var(--text);overflow-x:hidden}
a{text-decoration:none;color:inherit}
img{max-width:100%}
button,input{font:inherit}
.container{width:min(1180px,calc(100% - 36px));margin:auto}
.site-header{position:sticky;top:0;z-index:100;background:rgba(5,8,7,.86);backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}
.nav{height:78px;display:flex;align-items:center;justify-content:space-between;gap:28px}
.brand img{width:188px;display:block}
.nav-links{display:flex;gap:28px;align-items:center;font-size:13px;font-weight:600}
.nav-links a{position:relative;padding:29px 0;color:#d8dfdb}
.nav-links a:hover,.nav-links a.active{color:white}
.nav-links a.active:after{content:"";position:absolute;height:2px;background:var(--green);left:0;right:0;bottom:18px}
.nav-btn{padding:12px 18px!important}
.menu-toggle{display:none;background:none;border:0;cursor:pointer}
.menu-toggle span{display:block;width:24px;height:2px;background:white;margin:5px}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;border-radius:7px;padding:14px 24px;font-weight:800;border:1px solid transparent;transition:.25s;cursor:pointer}
.btn:hover{transform:translateY(-2px)}
.btn-green{background:linear-gradient(135deg,var(--green),#49ca27);color:#092009;box-shadow:0 10px 30px rgba(103,226,47,.22)}
.btn-outline{border-color:#70d13e;color:white;background:transparent}
.btn-outline:hover{background:rgba(103,226,47,.09)}
.hero{min-height:760px;position:relative;overflow:hidden;background:
radial-gradient(circle at 79% 48%,rgba(37,147,126,.20),transparent 28%),
radial-gradient(circle at 45% 8%,rgba(103,226,47,.08),transparent 22%),
linear-gradient(180deg,#030504,#070b09)}
.hero:after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(3,5,4,.88),transparent 25%);pointer-events:none}
.hero-grid{display:grid;grid-template-columns:.95fr 1.05fr;align-items:center;min-height:680px;position:relative;z-index:2}
.eyebrow,.section-label{font-size:11px;letter-spacing:.14em;font-weight:800;color:var(--green)}
.hero-copy{padding-top:20px}
.hero h1{font:800 clamp(48px,6vw,82px)/1.03 Manrope,sans-serif;letter-spacing:-.05em;margin:16px 0 22px}
.hero h1 span,.earn-copy h2 span,.cta-box h2 span{color:var(--green)}
.hero-copy>p{font-size:18px;color:#c3cbc7;line-height:1.7;max-width:570px;margin-bottom:32px}
.hero-actions{display:flex;gap:14px}
.coin{border:1px solid #6d7a74;border-radius:50%;width:24px;height:24px;display:grid;place-items:center}
.hero-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin-top:56px}
.hero-stats div{display:flex;flex-direction:column;gap:5px}
.hero-stats strong{font-size:18px}
.hero-stats span{font-size:10px;color:#aab4af}
.hero-visual{height:620px;position:relative}
.platform{position:absolute;width:520px;height:120px;right:20px;bottom:98px;border-radius:50%;background:radial-gradient(ellipse at center,rgba(103,226,47,.48),rgba(103,226,47,.08) 46%,transparent 68%);border:2px solid rgba(103,226,47,.65);box-shadow:0 0 55px rgba(103,226,47,.25)}
.truck{position:absolute;right:18px;top:160px;width:570px;height:280px;filter:drop-shadow(0 25px 30px rgba(0,0,0,.55));transform:rotate(-1deg)}
.truck-box{position:absolute;right:80px;top:20px;width:370px;height:190px;background:linear-gradient(145deg,#3f9c2c,#1f5f20);border-radius:22px 18px 12px 14px;border:4px solid #78d84a;box-shadow:inset -25px -25px 45px rgba(0,0,0,.28);display:flex;flex-direction:column;align-items:center;justify-content:center}
.truck-box:after{content:"";position:absolute;right:-45px;top:8px;width:80px;height:180px;border:10px solid #456746;border-left:0;border-radius:0 18px 18px 0}
.truck-logo{font:800 30px Manrope;letter-spacing:.04em}
.truck-box small{font-size:9px;color:#d9efcc}
.truck-leaf{font-size:42px;margin-top:15px}
.truck-cabin{position:absolute;left:20px;top:80px;width:170px;height:150px;background:linear-gradient(145deg,#2e5830,#12291e);border-radius:18px 28px 12px 12px;border:3px solid #607d62}
.windshield{position:absolute;left:30px;top:17px;width:112px;height:58px;background:linear-gradient(145deg,#0f2932,#274955);border-radius:9px;transform:skew(-9deg)}
.headlight{position:absolute;left:10px;bottom:22px;width:48px;height:16px;border-radius:8px;background:#fff6bc;box-shadow:0 0 18px #fff1a8}
.wheel{position:absolute;bottom:4px;width:84px;height:84px;border-radius:50%;background:#151a17;border:15px solid #303832;box-shadow:inset 0 0 0 5px #818b83}
.wheel:after{content:"";position:absolute;inset:18px;border-radius:50%;background:#111}
.wheel-a{left:75px}.wheel-b{right:210px}.wheel-c{right:72px}
.impact-chip,.watch-impact{position:absolute;bottom:68px;background:rgba(20,29,25,.84);border:1px solid var(--line);backdrop-filter:blur(12px);border-radius:16px;z-index:4}
.impact-chip{left:90px;padding:14px 18px;display:flex;gap:12px;align-items:center}
.chip-icon{width:44px;height:44px;border-radius:50%;background:rgba(103,226,47,.12);display:grid;place-items:center}
.impact-chip div{display:flex;flex-direction:column}
.impact-chip small,.impact-chip em{font-size:10px;color:#abb8b1;font-style:normal}
.impact-chip strong{font-size:18px;margin:3px 0}
.watch-impact{right:20px;padding:12px 18px;display:flex;align-items:center;gap:12px}
.play{width:44px;height:44px;border-radius:50%;background:white;color:#111;display:grid;place-items:center}
.watch-impact div{display:flex;flex-direction:column}.watch-impact small{color:#95a29c;font-size:9px;margin-top:3px}
.glow{position:absolute;border-radius:50%;filter:blur(70px)}.g1{width:300px;height:300px;background:rgba(49,200,100,.16);right:5%;top:18%}.g2{width:160px;height:160px;background:rgba(102,226,47,.18);left:42%;top:20%}

.how-section{background:linear-gradient(#090d0b,#080b09);padding:0 0 58px}
.dark-panel{background:linear-gradient(145deg,#111715,#181f1c);border:1px solid var(--line);border-radius:24px;padding:34px;position:relative;overflow:hidden}
.panel-heading{display:flex;justify-content:space-between;align-items:flex-start}
.panel-heading h2{font:800 30px Manrope;margin:7px 0 0}
.steps{display:grid;grid-template-columns:1fr auto 1fr auto 1fr auto 1fr;align-items:center;gap:18px;margin-top:42px;padding-right:170px}
.steps article{text-align:center}
.step-no{color:var(--green);font-weight:800}
.step-icon{width:56px;height:56px;margin:13px auto;border-radius:50%;background:rgba(103,226,47,.08);border:1px solid rgba(103,226,47,.18);display:grid;place-items:center;font-size:24px}
.steps h3{font-size:14px;margin:0 0 8px}.steps p{font-size:11px;color:#b0bbb5;line-height:1.55;margin:0}
.arrow{color:#9aa69f}
.phone-preview{border:7px solid #101612;border-radius:34px;background:#f7faf7;box-shadow:0 22px 40px rgba(0,0,0,.35);position:relative;overflow:hidden}
.phone-notch{width:80px;height:18px;background:#101612;border-radius:0 0 12px 12px;margin:auto;position:relative;z-index:2}
.small-phone{position:absolute;right:40px;top:-4px;width:180px;height:285px;transform:rotate(-7deg)}
.map{height:185px;background:
linear-gradient(90deg,transparent 49%,#dce4dc 50%,transparent 51%),
linear-gradient(0deg,transparent 49%,#dce4dc 50%,transparent 51%),
#e8eee8;background-size:44px 44px;position:relative}
.route{position:absolute;width:100px;height:75px;border-left:4px solid #57d931;border-bottom:4px solid #57d931;border-radius:0 0 0 30px;left:38px;top:45px;transform:rotate(-15deg)}
.pin{position:absolute;color:#3ec527}.p1{left:36px;top:42px}.p2{right:28px;bottom:34px}
.driver-card{display:flex;gap:8px;align-items:center;padding:10px;color:#152019}
.driver-card>span{width:32px;height:32px;background:#d9eadb;border-radius:50%;display:grid;place-items:center;font-size:10px;font-weight:800}
.driver-card div{display:flex;flex-direction:column}.driver-card strong{font-size:9px}.driver-card small{font-size:7px;color:#6c776f}

.section-light{background:#f6f8f5;color:var(--darktext);padding:70px 0}
.section-title h2{font:800 40px Manrope;margin:9px 0}.section-title p{color:#657169}.center{text-align:center}
.section-label.green{color:#38a622}
.service-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:40px}
.service-card{background:white;border-radius:17px;padding:24px;box-shadow:0 16px 45px rgba(27,52,36,.08);min-height:290px}
.service-art{height:120px;position:relative;display:grid;place-items:center}
.green-bin .bin-body,.blue-bin .bin-body{width:74px;height:92px;border-radius:8px 8px 14px 14px;display:grid;place-items:center;font-size:30px;color:white}
.green-bin .bin-body{background:#2f9b3b}.blue-bin .bin-body{background:#2275ba}
.bin-lid{position:absolute;top:9px;width:86px;height:12px;border-radius:4px;background:#173a23}
.service-card h3{font-size:17px;margin:10px 0}.service-card p{font-size:12px;color:#6f7c74;line-height:1.55}.service-card a{font-size:12px;font-weight:800;color:#269b32}
.ewaste-art .monitor{width:75px;height:55px;background:#202b27;border:8px solid #59635f;position:absolute;left:34px;top:23px}.ewaste-art .cpu{width:30px;height:70px;background:#38433f;position:absolute;right:38px;top:36px}.phone-mini{width:18px;height:34px;background:#111;position:absolute;left:25px;bottom:18px}
.bulk-art .chair-seat{width:92px;height:42px;background:#a47b4d;border-radius:12px;position:absolute;bottom:27px}.bulk-art .chair-back{width:78px;height:68px;background:#b58b5a;border-radius:14px;position:absolute;top:20px}

.earn-section{position:relative;padding:80px 0;background:
radial-gradient(circle at 55% 45%,rgba(69,201,44,.16),transparent 26%),
linear-gradient(140deg,#06100b,#030705);overflow:hidden}
.earn-grid{display:grid;grid-template-columns:.8fr 1fr .9fr;align-items:center;gap:38px}
.earn-copy h2{font:800 52px/1.05 Manrope;margin:14px 0 22px}.earn-copy p{color:#bbc5bf;line-height:1.65;margin-bottom:26px}
.earn-phone-wrap{position:relative;display:flex;justify-content:center}
.earn-phone{width:270px;height:510px;transform:rotate(-1deg)}
.earn-screen{background:linear-gradient(#145c2b,#f4faf4 38%);height:100%;padding:22px 14px;color:#172018}
.earn-screen>small{display:block;color:white}.earn-screen>strong{display:block;font-size:30px;color:white;margin-top:7px}.earn-screen>span{color:#d2f0d5;font-size:9px}
.earn-boxes{display:grid;grid-template-columns:1fr 1fr;background:white;border-radius:12px;margin-top:24px;overflow:hidden}.earn-boxes div{padding:14px;border-right:1px solid #e5e9e5}.earn-boxes div:last-child{border-right:0}.earn-boxes strong{display:block;font-size:15px}.earn-boxes small{font-size:8px;color:#6a746c}
.earn-screen label{display:block;font-size:9px;font-weight:800;margin:18px 0 7px}.referral-link{background:#ecf1ec;border-radius:8px;padding:8px;display:flex;justify-content:space-between;align-items:center;font-size:8px}.referral-link button{background:#245d31;color:white;border:0;border-radius:6px;padding:6px 8px;font-size:8px;cursor:pointer}
.share-icons{display:flex;gap:14px}.share-icons span{width:34px;height:34px;border-radius:50%;background:#e1ece3;display:grid;place-items:center;font-size:9px;font-weight:800}
.coin-float{position:absolute;width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle,#ffd96b,#c88d00);color:#805300;font-weight:800;box-shadow:0 0 24px rgba(255,205,61,.45)}.c1{left:8%;top:30px}.c2{right:4%;top:140px}.c3{left:4%;bottom:90px}
.earn-benefits{display:flex;flex-direction:column;gap:20px}.earn-benefits article{display:flex;gap:14px}.earn-benefits article>span{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:rgba(103,226,47,.1);color:var(--green);font-weight:800}.earn-benefits h3,.earn-benefits strong{color:var(--green)}.earn-benefits p{font-size:11px;color:#b6c0ba;margin:4px 0 0;line-height:1.5}

.impact-app{padding:80px 0;background:linear-gradient(140deg,#15201b,#0d1310)}
.split-grid{display:grid;grid-template-columns:1fr .8fr 1fr;gap:42px;align-items:center}
.impact-block h2,.app-block h2{font:800 34px Manrope;margin:10px 0}.impact-block p{color:#aeb9b2;line-height:1.6}
.impact-numbers{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin:24px 0}.impact-numbers div{border:1px solid rgba(255,255,255,.14);border-radius:9px;padding:14px}.impact-numbers strong{display:block;color:var(--green)}.impact-numbers span{font-size:9px;color:#bac4be}
.earth-wrap{display:flex;justify-content:center}.earth{width:280px;height:280px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#76d87e 0 10%,#2e8a53 11% 20%,#17624f 21% 32%,#0d3c45 33% 100%);box-shadow:0 0 80px rgba(69,205,92,.25);position:relative;overflow:hidden}.earth:before,.earth:after{content:"";position:absolute;background:#3ca34f;border-radius:50% 40% 60% 30%}.earth:before{width:130px;height:90px;left:10px;top:110px;transform:rotate(22deg)}.earth:after{width:110px;height:75px;right:4px;top:36px;transform:rotate(-20deg)}.earth span{position:absolute;inset:0;background:repeating-radial-gradient(circle at 40% 40%,rgba(255,255,255,.06) 0 2px,transparent 3px 8px)}
.app-block ul{list-style:none;padding:0}.app-block li{margin:12px 0;color:#d3dcd6;font-size:13px}.app-block li:before{content:"✓";color:var(--green);font-weight:800;margin-right:10px}
.store-buttons{display:flex;gap:10px;margin-top:22px}.store-buttons a{border:1px solid rgba(255,255,255,.25);border-radius:7px;padding:8px 12px;display:flex;align-items:center;gap:8px;background:#030504}.store-buttons small{font-size:7px;display:block}.store-buttons strong{font-size:13px}

.section-dark{background:#0b100e;padding:70px 0}.review-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:32px}.review-grid blockquote{margin:0;padding:24px;background:#161d1a;border:1px solid var(--line);border-radius:13px}.stars{color:var(--green);letter-spacing:.13em}.review-grid p{color:#d8dfdb;font-size:13px;line-height:1.65}.review-grid footer{display:flex;gap:10px;align-items:center}.review-grid footer>span{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:#23342b;font-size:10px;font-weight:800}.review-grid footer div{display:flex;flex-direction:column}.review-grid footer small{font-size:9px;color:#91a097}

.cta-section{padding:0 0 70px;background:#0b100e}.cta-box{background:linear-gradient(135deg,#17201c,#0d120f);border:1px solid var(--line);border-radius:17px;padding:34px 42px;display:flex;align-items:center;justify-content:space-between;overflow:hidden}.cta-box h2{font:800 38px Manrope;margin:6px 0}.cta-box p{color:#abb7b0}.cta-box form{display:flex;background:white;border-radius:7px;overflow:hidden;max-width:500px}.cta-box input{border:0;outline:0;padding:15px;width:310px}.cta-box form .btn{border-radius:0}.cta-box small{display:block;color:#89968f;margin-top:8px}
.mascot{position:relative;width:240px;height:180px;margin-right:20px}.mascot-body{position:absolute;right:20px;bottom:8px;width:130px;height:120px;border-radius:14px 14px 26px 26px;background:linear-gradient(#48bd34,#1c8d27);border:4px solid #66dc45}.mascot-lid{position:absolute;right:10px;top:38px;width:150px;height:18px;background:#67d83f;border-radius:6px;z-index:2}.eye{position:absolute;top:30px;width:19px;height:25px;background:white;border-radius:50%}.e1{left:31px}.e2{right:31px}.eye:after{content:"";position:absolute;width:8px;height:10px;background:#172017;border-radius:50%;left:6px;top:8px}.smile{position:absolute;left:46px;top:66px;width:38px;height:20px;border-bottom:4px solid white;border-radius:0 0 30px 30px}.mascot-body strong{position:absolute;bottom:10px;left:48px;font-size:28px}.mascot-arm{position:absolute;font-size:38px}.mascot-arm.left{left:14px;top:72px;transform:rotate(-15deg)}.mascot-arm.right{right:-10px;top:76px}

.site-footer{background:#050807;padding:60px 0 20px;border-top:1px solid var(--line)}.footer-grid{display:grid;grid-template-columns:1.7fr repeat(4,1fr);gap:34px}.footer-brand img{width:180px}.footer-brand p{font-size:12px;color:#97a49d;line-height:1.6;max-width:280px}.socials{display:flex;gap:8px}.socials a{width:28px;height:28px;border-radius:50%;background:#171e1b;display:grid;place-items:center;font-size:11px}.footer-grid>div:not(:first-child){display:flex;flex-direction:column;gap:10px}.footer-grid strong{font-size:12px;margin-bottom:5px}.footer-grid a{font-size:11px;color:#9eaaa4}.vertical{flex-direction:column;margin-top:0}.vertical a{width:150px}.footer-bottom{border-top:1px solid var(--line);margin-top:42px;padding-top:18px;display:flex;justify-content:space-between;color:#75837c;font-size:10px}
.chat-button{position:fixed;right:22px;bottom:20px;background:var(--green);color:#0f2611;border-radius:999px;padding:12px 17px;font-size:12px;font-weight:800;z-index:99;box-shadow:0 12px 30px rgba(103,226,47,.28)}

@media(max-width:1050px){
  .nav-links{display:none;position:absolute;left:18px;right:18px;top:78px;background:#101613;border:1px solid var(--line);border-radius:14px;padding:18px;flex-direction:column;align-items:flex-start}
  .nav-links.open{display:flex}.nav-links a{padding:8px 0}.nav-links a.active:after{bottom:0}
  .menu-toggle{display:block}.nav-btn{display:none}
  .hero-grid,.earn-grid,.split-grid{grid-template-columns:1fr}
  .hero-copy{text-align:center;padding-top:70px}.hero-copy>p{margin-left:auto;margin-right:auto}.hero-actions{justify-content:center}.hero-stats{max-width:650px;margin-left:auto;margin-right:auto}
  .hero-visual{height:560px}.truck{left:50%;transform:translateX(-50%);right:auto}.platform{left:50%;transform:translateX(-50%)}
  .steps{padding-right:0}.small-phone{display:none}
  .service-cards{grid-template-columns:repeat(2,1fr)}
  .earn-copy{text-align:center}.earn-copy p{max-width:600px;margin-left:auto;margin-right:auto}.earn-benefits{display:grid;grid-template-columns:repeat(2,1fr)}
  .earth-wrap{order:3}.app-block{text-align:center}.app-block ul{display:inline-block;text-align:left}.store-buttons{justify-content:center}
  .footer-grid{grid-template-columns:repeat(3,1fr)}.footer-brand{grid-column:1/-1}
}
@media(max-width:700px){
  .container{width:min(100% - 24px,1180px)}.hero{min-height:auto}.hero h1{font-size:45px}.hero-stats{grid-template-columns:repeat(2,1fr)}
  .hero-visual{height:430px;transform:scale(.78);margin-left:-65px;margin-right:-65px}.truck{top:100px}.impact-chip{left:65px}.watch-impact{right:55px}
  .dark-panel{padding:24px 18px}.steps{grid-template-columns:1fr 1fr}.steps .arrow{display:none}
  .service-cards,.review-grid,.earn-benefits{grid-template-columns:1fr}
  .earn-copy h2{font-size:42px}.earn-phone{width:250px}
  .impact-numbers{grid-template-columns:1fr 1fr}.earth{width:230px;height:230px}
  .cta-box{padding:30px 22px;flex-direction:column;text-align:center}.cta-box form{flex-direction:column;background:transparent;width:100%}.cta-box input{width:100%;border-radius:7px;margin-bottom:10px}.cta-box form .btn{border-radius:7px}.mascot{margin-top:10px}
  .footer-grid{grid-template-columns:1fr 1fr}.footer-brand{grid-column:1/-1}.footer-bottom{flex-direction:column;gap:8px}
}