/* BanaEats Public Landing — Bright Green & Yellow Theme */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&display=swap');

:root {
    --green:#8DC63F; --green-d:#6FA82E; --yellow:#F5D800; --yellow-d:#D4BB00;
    --dark:#1A1A1A; --gray:#6B7280; --light:#F8FAF4; --white:#fff;
    --radius:14px; --shadow:0 4px 24px rgba(141,198,63,.15);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:'Inter',sans-serif;background:#fff;color:var(--dark);line-height:1.6;overflow-x:hidden}
img{max-width:100%;height:auto} a{text-decoration:none;color:inherit}

.bl-container{width:100%;max-width:1200px;margin:0 auto;padding:0 24px}
.bl-section{padding:80px 0}
.bl-badge{display:inline-flex;align-items:center;gap:6px;background:rgba(141,198,63,.12);color:var(--green-d);font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:5px 14px;border-radius:100px;border:1.5px solid rgba(141,198,63,.3);margin-bottom:14px}
.bl-section-title{font-size:clamp(28px,4vw,42px);font-weight:800;line-height:1.2;color:var(--dark);margin-bottom:14px}
.bl-section-title span{color:var(--green)}
.bl-section-sub{font-size:16px;color:var(--gray);max-width:560px;margin:0 auto 48px}

/* Buttons */
.bl-btn{display:inline-flex;align-items:center;gap:8px;padding:13px 28px;border-radius:50px;font-size:15px;font-weight:700;cursor:pointer;border:2px solid transparent;transition:all .2s;white-space:nowrap}
.bl-btn-primary{background:var(--green);color:#fff;border-color:var(--green)}
.bl-btn-primary:hover{background:var(--green-d);border-color:var(--green-d);transform:translateY(-2px);box-shadow:0 8px 24px rgba(141,198,63,.35)}
.bl-btn-yellow{background:var(--yellow);color:var(--dark);border-color:var(--yellow)}
.bl-btn-yellow:hover{background:var(--yellow-d);transform:translateY(-2px);box-shadow:0 8px 24px rgba(245,216,0,.4)}
.bl-btn-outline{background:transparent;color:var(--green);border-color:var(--green)}
.bl-btn-outline:hover{background:var(--green);color:#fff;transform:translateY(-2px)}

/* Header */
.bl-header{position:sticky;top:0;z-index:999;background:#fff;border-bottom:2px solid rgba(141,198,63,.2);box-shadow:0 2px 16px rgba(0,0,0,.06)}
.bl-header-inner{display:flex;align-items:center;justify-content:space-between;height:68px;gap:24px}
.bl-logo img{height:42px;width:auto;object-fit:contain}
.bl-nav{display:flex;align-items:center;gap:4px;list-style:none}
.bl-nav li a{display:flex;align-items:center;gap:6px;padding:8px 14px;border-radius:50px;font-size:14px;font-weight:600;color:var(--dark);transition:background .15s,color .15s}
.bl-nav li a:hover,.bl-nav li a.active{background:rgba(141,198,63,.12);color:var(--green-d)}
.bl-header-actions{display:flex;align-items:center;gap:10px}
.bl-lang-wrap{position:relative}
.bl-lang-btn{display:flex;align-items:center;gap:6px;padding:7px 14px;border-radius:50px;font-size:13px;font-weight:600;color:var(--dark);border:1.5px solid #e5e7eb;background:#fff;cursor:pointer;transition:border-color .15s}
.bl-lang-btn:hover{border-color:var(--green)}
.bl-lang-dropdown{position:absolute;top:calc(100% + 8px);right:0;background:#fff;border-radius:12px;box-shadow:0 8px 32px rgba(0,0,0,.12);border:1px solid #f0f0f0;min-width:120px;overflow:hidden;display:none;z-index:100}
.bl-lang-wrap:hover .bl-lang-dropdown{display:block}
.bl-lang-dropdown a{display:block;padding:10px 16px;font-size:13px;font-weight:600;color:var(--dark);transition:background .15s}
.bl-lang-dropdown a:hover{background:rgba(141,198,63,.1);color:var(--green-d)}
.bl-lang-dropdown hr{border-color:#f0f0f0;margin:0}
.bl-join-wrap{position:relative}
.bl-join-dropdown{position:absolute;top:calc(100% + 8px);right:0;background:#fff;border-radius:12px;box-shadow:0 8px 32px rgba(0,0,0,.12);border:1px solid #f0f0f0;min-width:200px;overflow:hidden;display:none;z-index:100}
.bl-join-wrap:hover .bl-join-dropdown{display:block}
.bl-join-dropdown a{display:block;padding:12px 18px;font-size:14px;font-weight:600;color:var(--dark);transition:background .15s}
.bl-join-dropdown a:hover{background:rgba(141,198,63,.1);color:var(--green-d)}
.bl-nav-toggle{display:none;flex-direction:column;gap:5px;cursor:pointer;padding:6px;background:none;border:none}
.bl-nav-toggle span{display:block;width:24px;height:2.5px;background:var(--dark);border-radius:4px;transition:all .3s}

/* Hero */
.bl-hero{background:linear-gradient(135deg,#f0f9e8 0%,#fffde6 50%,#e8f5e0 100%);position:relative;overflow:hidden;padding:80px 0 60px}
.bl-hero::before{content:'';position:absolute;top:-120px;right:-120px;width:500px;height:500px;border-radius:50%;background:radial-gradient(circle,rgba(141,198,63,.2) 0%,transparent 70%);pointer-events:none}
.bl-hero::after{content:'';position:absolute;bottom:-80px;left:-80px;width:350px;height:350px;border-radius:50%;background:radial-gradient(circle,rgba(245,216,0,.25) 0%,transparent 70%);pointer-events:none}
.bl-hero-inner{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:48px;position:relative;z-index:1}
.bl-hero-tag{display:inline-flex;align-items:center;gap:8px;background:var(--yellow);color:var(--dark);font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;padding:6px 16px;border-radius:100px;margin-bottom:20px}
.bl-hero-title{font-size:clamp(34px,5vw,58px);font-weight:900;line-height:1.1;color:var(--dark);margin-bottom:10px}
.bl-hero-title .hl-green{color:var(--green)}
.bl-hero-title .hl-yellow{color:var(--dark);background:var(--yellow);padding:0 8px;border-radius:6px;display:inline-block}
.bl-hero-subtitle{font-size:18px;font-weight:600;color:var(--gray);margin-bottom:8px}
.bl-hero-tagline{font-size:15px;color:var(--gray);margin-bottom:32px;line-height:1.7}
.bl-hero-actions{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.bl-hero-stats{display:flex;gap:28px;margin-top:40px;flex-wrap:wrap}
.bl-hero-stat{display:flex;flex-direction:column}
.bl-hero-stat-num{font-size:26px;font-weight:900;color:var(--green);line-height:1}
.bl-hero-stat-label{font-size:12px;font-weight:600;color:var(--gray);text-transform:uppercase;letter-spacing:.05em;margin-top:2px}
.bl-hero-img-wrap{position:relative;display:flex;justify-content:center;align-items:center}
.bl-hero-img-wrap::before{content:'';position:absolute;width:85%;height:85%;border-radius:50%;background:radial-gradient(circle,rgba(141,198,63,.18) 0%,transparent 70%)}
.bl-hero-img-wrap img{position:relative;z-index:1;max-height:460px;object-fit:contain;filter:drop-shadow(0 20px 40px rgba(141,198,63,.2));animation:bl-float 4s ease-in-out infinite}
@keyframes bl-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-14px)}}
.bl-hero-float{position:absolute;z-index:2;background:#fff;border-radius:14px;padding:10px 16px;display:flex;align-items:center;gap:10px;box-shadow:0 8px 24px rgba(0,0,0,.1);font-size:13px;font-weight:700;color:var(--dark);white-space:nowrap}
.bl-hero-float .icon{width:36px;height:36px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:18px}
.bl-hero-float-1{top:12%;left:-10%}.bl-hero-float-1 .icon{background:rgba(141,198,63,.15);color:var(--green)}
.bl-hero-float-2{bottom:20%;right:-8%}.bl-hero-float-2 .icon{background:rgba(245,216,0,.2);color:#B89E00}
.bl-hero-float-3{top:55%;left:-12%}.bl-hero-float-3 .icon{background:rgba(141,198,63,.1);color:var(--green)}

/* About */
.bl-about{background:#fff}
.bl-about-inner{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:64px}
.bl-about-img-wrap{position:relative;border-radius:24px}
.bl-about-img-wrap img{width:100%;border-radius:24px;box-shadow:0 16px 48px rgba(141,198,63,.2)}
.bl-about-img-wrap::after{content:'';position:absolute;bottom:-16px;right:-16px;width:60%;height:60%;border-radius:20px;background:linear-gradient(135deg,rgba(141,198,63,.15),rgba(245,216,0,.15));z-index:-1}
.bl-about-text .bl-section-sub{margin:0 0 28px;text-align:left}

/* Zones */
.bl-zones{background:var(--light)}
.bl-zones-inner{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:64px}
.bl-zone-tags{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}
.bl-zone-tag{display:inline-flex;align-items:center;gap:6px;background:#fff;border:2px solid rgba(141,198,63,.3);color:var(--dark);font-size:13px;font-weight:600;padding:7px 16px;border-radius:50px;transition:all .2s}
.bl-zone-tag:hover{background:var(--green);color:#fff;border-color:var(--green);transform:translateY(-2px)}
.bl-zone-tag::before{content:'';width:8px;height:8px;border-radius:50%;background:var(--green);flex-shrink:0}

/* Features */
.bl-features{background:#fff}
.bl-features-header{text-align:center}
.bl-feature-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:24px;margin-top:48px}
.bl-feature-card{background:var(--light);border:2px solid transparent;border-radius:var(--radius);padding:32px 24px;text-align:center;transition:all .25s}
.bl-feature-card:hover{border-color:var(--green);background:#fff;box-shadow:var(--shadow);transform:translateY(-4px)}
.bl-feature-icon{width:72px;height:72px;border-radius:18px;background:linear-gradient(135deg,rgba(141,198,63,.15),rgba(245,216,0,.15));display:flex;align-items:center;justify-content:center;margin:0 auto 20px;overflow:hidden}
.bl-feature-icon img{width:44px;height:44px;object-fit:contain}
.bl-feature-title{font-size:16px;font-weight:700;color:var(--dark);margin-bottom:8px}
.bl-feature-desc{font-size:14px;color:var(--gray);line-height:1.6}

/* Services */
.bl-services{background:var(--light)}
.bl-services-header{text-align:center}
.bl-services-tabs{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-bottom:48px}
.bl-services-tab{display:flex;align-items:center;gap:8px;padding:11px 22px;border-radius:50px;font-size:14px;font-weight:700;color:var(--gray);background:#fff;border:2px solid #e5e7eb;cursor:pointer;transition:all .2s}
.bl-services-tab img{width:20px;height:20px;object-fit:contain}
.bl-services-tab.active,.bl-services-tab:hover{background:var(--green);color:#fff;border-color:var(--green)}
.bl-services-tab.active img,.bl-services-tab:hover img{filter:brightness(0) invert(1)}
.bl-services-pane{display:none}
.bl-services-pane.active{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center}
.bl-services-content h4{font-size:20px;font-weight:800;color:var(--dark);margin-bottom:8px;margin-top:24px;display:flex;align-items:center;gap:10px}
.bl-services-content h4::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--green);flex-shrink:0}
.bl-services-content h4:first-child{margin-top:0}
.bl-services-content p{font-size:15px;color:var(--gray);line-height:1.7;margin-bottom:8px}
.bl-services-img{display:flex;justify-content:center;align-items:center}
.bl-services-img img{max-height:340px;object-fit:contain}

/* Why Choose Us */
.bl-choose{background:#fff}
.bl-choose-header{text-align:center}
.bl-choose-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:20px;margin-top:48px}
.bl-choose-card{position:relative;border-radius:20px;overflow:hidden;aspect-ratio:3/4}
.bl-choose-card img{width:100%;height:100%;object-fit:cover;transition:transform .4s}
.bl-choose-card:hover img{transform:scale(1.06)}
.bl-choose-overlay{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(to top,rgba(26,26,26,.85) 0%,transparent 100%);padding:24px 18px 20px}
.bl-choose-overlay h4{font-size:16px;font-weight:800;color:#fff;display:flex;align-items:center;gap:8px}
.bl-choose-overlay h4::before{content:'';width:8px;height:8px;border-radius:50%;background:var(--yellow);flex-shrink:0}

/* Earn */
.bl-earn{background:linear-gradient(135deg,#f0f9e8 0%,#fffde6 100%)}
.bl-earn-inner{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:64px}
.bl-earn-text .bl-section-sub{margin:0 0 20px;text-align:left}
.bl-earn-img{text-align:center}
.bl-earn-img img{max-height:360px;object-fit:contain;filter:drop-shadow(0 16px 32px rgba(141,198,63,.2))}

/* Testimonials */
.bl-testimonials{background:var(--light)}
.bl-testimonials-header{text-align:center}
.bl-testimonials-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:24px;margin-top:48px}
.bl-testimonial-card{background:#fff;border-radius:var(--radius);padding:28px;border:2px solid transparent;transition:all .25s;box-shadow:0 2px 12px rgba(0,0,0,.05)}
.bl-testimonial-card:hover{border-color:rgba(141,198,63,.3);box-shadow:var(--shadow);transform:translateY(-3px)}
.bl-testimonial-quote{font-size:48px;font-weight:900;color:var(--green);line-height:1;margin-bottom:8px}
.bl-testimonial-text{font-size:15px;color:var(--gray);line-height:1.7;font-style:italic;margin-bottom:20px}
.bl-testimonial-author{display:flex;align-items:center;gap:12px}
.bl-testimonial-author img{width:48px;height:48px;border-radius:50%;object-fit:cover;border:3px solid rgba(141,198,63,.3);flex-shrink:0}
.bl-testimonial-name{font-size:15px;font-weight:700;color:var(--dark)}
.bl-testimonial-role{font-size:12px;color:var(--gray);font-weight:500}

/* Newsletter */
.bl-newsletter{background:var(--dark);padding:56px 0}
.bl-newsletter-inner{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:48px}
.bl-newsletter-title{font-size:28px;font-weight:800;color:#fff;margin-bottom:8px}
.bl-newsletter-sub{font-size:15px;color:rgba(255,255,255,.6)}
.bl-newsletter-form{display:flex;border-radius:50px;overflow:hidden;border:2px solid rgba(255,255,255,.1);background:rgba(255,255,255,.06)}
.bl-newsletter-form input{flex:1;background:transparent;border:none;outline:none;padding:14px 20px;color:#fff;font-size:14px}
.bl-newsletter-form input::placeholder{color:rgba(255,255,255,.4)}
.bl-newsletter-form button{background:var(--green);color:#fff;border:none;padding:14px 24px;font-size:14px;font-weight:700;cursor:pointer;transition:background .2s;white-space:nowrap}
.bl-newsletter-form button:hover{background:var(--green-d)}

/* Footer */
.bl-footer{background:#111;padding:56px 0 32px}
.bl-footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1.5fr;gap:40px;margin-bottom:48px}
.bl-footer-logo{margin-bottom:16px}
.bl-footer-logo img{height:38px;filter:brightness(0) invert(1)}
.bl-footer-desc{font-size:14px;color:rgba(255,255,255,.5);line-height:1.7;margin-bottom:20px}
.bl-footer-social{display:flex;gap:10px;margin-bottom:20px}
.bl-footer-social a{width:38px;height:38px;border-radius:10px;background:rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.6);font-size:16px;transition:all .2s}
.bl-footer-social a:hover{background:var(--green);color:#fff}
.bl-footer-app-btns{display:flex;gap:10px;flex-wrap:wrap}
.bl-footer-app-btns img{height:36px;opacity:.8;transition:opacity .2s}
.bl-footer-app-btns img:hover{opacity:1}
.bl-footer-heading{font-size:13px;font-weight:800;color:#fff;text-transform:uppercase;letter-spacing:.08em;margin-bottom:18px}
.bl-footer-links{list-style:none}
.bl-footer-links li{margin-bottom:10px}
.bl-footer-links a{font-size:14px;color:rgba(255,255,255,.5);transition:color .15s;display:flex;align-items:center;gap:8px}
.bl-footer-links a:hover{color:var(--green)}
.bl-footer-bottom{border-top:1px solid rgba(255,255,255,.08);padding-top:24px;text-align:center;font-size:13px;color:rgba(255,255,255,.35)}
.bl-footer-bottom span{color:var(--green);font-weight:700}

/* Preloader */
#bl-preloader{position:fixed;inset:0;z-index:9999;background:#fff;display:flex;align-items:center;justify-content:center;transition:opacity .4s}
#bl-preloader.hidden{opacity:0;pointer-events:none}
.bl-spinner{width:48px;height:48px;border-radius:50%;border:4px solid rgba(141,198,63,.2);border-top-color:var(--green);animation:bl-spin .8s linear infinite}
@keyframes bl-spin{to{transform:rotate(360deg)}}

/* Welcome Modal */
.bl-modal-overlay{position:fixed;inset:0;z-index:9000;background:rgba(0,0,0,.5);display:none;align-items:center;justify-content:center;padding:24px}
.bl-modal-box{background:#fff;border-radius:24px;padding:40px;max-width:420px;width:100%;position:relative}
.bl-modal-close{position:absolute;top:16px;right:16px;background:none;border:none;font-size:24px;cursor:pointer;color:var(--gray);line-height:1}

/* Responsive */
@media(max-width:1024px){
    .bl-hero-inner,.bl-about-inner,.bl-zones-inner,.bl-services-pane.active,.bl-earn-inner{grid-template-columns:1fr;gap:40px}
    .bl-hero-img-wrap{order:-1}
    .bl-hero-float{display:none}
    .bl-earn-img{order:-1}
    .bl-footer-grid{grid-template-columns:1fr 1fr;gap:32px}
    .bl-newsletter-inner{grid-template-columns:1fr;gap:24px}
}
@media(max-width:768px){
    .bl-nav{display:none;position:fixed;inset:68px 0 0 0;background:#fff;flex-direction:column;align-items:flex-start;padding:24px;gap:4px;z-index:998;overflow-y:auto}
    .bl-nav.open{display:flex}
    .bl-nav li a{width:100%;padding:12px 16px;border-radius:12px;font-size:16px}
    .bl-nav-toggle{display:flex}
    .bl-hero{padding:48px 0 40px}
    .bl-section{padding:56px 0}
    .bl-footer-grid{grid-template-columns:1fr}
    .bl-choose-grid{grid-template-columns:repeat(2,1fr)}
    .bl-testimonials-grid{grid-template-columns:1fr}
}
@media(max-width:480px){
    .bl-choose-grid{grid-template-columns:1fr}
    .bl-hero-stats{gap:20px}
    .bl-testimonials-grid{grid-template-columns:1fr}
}