:root{
    --primary:#6366f1;--primary-light:#818cf8;--secondary:#f472b6;
    --dark:#020617;--surface:#0f172a;--light:#f8fafc;--gray:#94a3b8;
    --glass:rgba(255,255,255,.04);--glass-border:rgba(255,255,255,.08);--glass-strong:rgba(255,255,255,.07);
    --radius:20px;--ease:cubic-bezier(.4,0,.2,1)
}
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:'Plus Jakarta Sans',sans-serif;background:var(--dark);color:var(--light);line-height:1.6;overflow-x:hidden;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
h1,h2,h3,h4{font-family:'Space Grotesk',sans-serif}

/* Background */
.bg-orbs{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none}
.orb{position:absolute;border-radius:50%;filter:blur(130px);animation:orbDrift 25s infinite ease-in-out}
.orb-1{width:750px;height:750px;background:var(--primary);top:-25%;right:-15%;opacity:.12}
.orb-2{width:550px;height:550px;background:var(--secondary);bottom:-20%;left:-12%;opacity:.1;animation-delay:-9s}
.orb-3{width:400px;height:400px;background:#06b6d4;top:45%;left:35%;opacity:.06;animation-delay:-16s}
.grid-overlay{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.02) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.02) 1px,transparent 1px);background-size:60px 60px;mask-image:radial-gradient(ellipse at center,black 20%,transparent 70%)}
@keyframes orbDrift{0%,100%{transform:translate(0,0) scale(1)}25%{transform:translate(40px,-60px) scale(1.08)}50%{transform:translate(-30px,50px) scale(.94)}75%{transform:translate(20px,-30px) scale(1.04)}}

/* Header */
header{position:fixed;top:0;left:0;width:100%;z-index:100;padding:1.4rem 5%;backdrop-filter:blur(24px);background:rgba(2,6,23,.5);border-bottom:1px solid var(--glass-border);transition:all .5s var(--ease)}
header.scrolled{padding:1rem 5%;background:rgba(2,6,23,.92)}
nav{max-width:1400px;margin:0 auto;display:flex;justify-content:center}
.logo{display:flex;align-items:center;gap:.6rem;cursor:pointer;text-decoration:none}
.logo-icon{font-size:1.5rem}
.logo-text{font-size:1.8rem;font-weight:700;letter-spacing:-1px;background:linear-gradient(135deg,#fff 30%,var(--primary-light));-webkit-background-clip:text;-webkit-text-fill-color:transparent}

main{max-width:1400px;margin:0 auto;padding:0 5%}

/* Reveal Animations */
[data-reveal]{opacity:0;transform:translateY(50px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
[data-reveal].revealed{opacity:1;transform:translateY(0)}

/* Hero */
#hero{display:grid;grid-template-columns:1.15fr 1fr;align-items:center;gap:5rem;padding:9rem 0 7rem;min-height:100vh}
.badge-pill{display:inline-flex;align-items:center;gap:.6rem;background:var(--glass-strong);border:1px solid var(--glass-border);backdrop-filter:blur(12px);padding:.55rem 1.4rem;border-radius:50px;font-size:.82rem;color:var(--gray);margin-bottom:2.2rem;font-weight:500}
.pulse-dot{width:8px;height:8px;background:#22c55e;border-radius:50%;box-shadow:0 0 8px #22c55e;animation:pulse 2s infinite}
@keyframes pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.4;transform:scale(1.6)}}

.hero-content h1{font-size:clamp(2.6rem,5.2vw,4.8rem);line-height:1.06;margin-bottom:2rem;font-weight:700;letter-spacing:-2px;color:#fff}
.gradient-text{background:linear-gradient(135deg,#818cf8,#c084fc,#f472b6,#fb923c);background-size:300% 300%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;animation:gradMove 6s ease infinite}
@keyframes gradMove{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}

.hero-content p{font-size:clamp(.95rem,1.2vw,1.2rem);color:var(--gray);margin-bottom:2.8rem;max-width:530px;line-height:1.75;letter-spacing:.01em}

.hero-btns{display:flex;gap:1rem;margin-bottom:2.8rem;flex-wrap:wrap}
.btn-primary{display:inline-flex;align-items:center;gap:.5rem;background:var(--primary);color:#fff;padding:1.05rem 2.4rem;border-radius:14px;font-size:1rem;font-weight:700;text-decoration:none;transition:all .4s var(--ease);box-shadow:0 8px 30px -8px rgba(99,102,241,.45);border:1px solid rgba(255,255,255,.08)}
.btn-primary:hover{background:var(--primary-light);transform:translateY(-4px);box-shadow:0 18px 40px -8px rgba(99,102,241,.55)}
.btn-primary svg{transition:transform .4s var(--ease)}.btn-primary:hover svg{transform:translateX(5px)}
.btn-secondary{display:inline-flex;align-items:center;background:var(--glass-strong);backdrop-filter:blur(14px);border:1px solid var(--glass-border);color:#fff;padding:1.05rem 2.4rem;border-radius:14px;font-size:1rem;font-weight:600;text-decoration:none;transition:all .4s var(--ease)}
.btn-secondary:hover{background:rgba(255,255,255,.1);transform:translateY(-4px);border-color:rgba(255,255,255,.18)}

.app-downloads{display:flex;gap:1rem;margin-bottom:3.5rem}
.app-btn{background:rgba(0,0,0,.5);border-radius:12px;padding:3px;border:1px solid var(--glass-border);transition:all .4s var(--ease);display:flex;backdrop-filter:blur(10px)}
.app-btn img{height:46px;display:block}
.app-btn:hover{transform:translateY(-4px);border-color:var(--primary);box-shadow:0 8px 24px -6px rgba(99,102,241,.25)}

.trust-row{display:flex;align-items:center;gap:2.5rem}
.trust-item{display:flex;flex-direction:column}
.trust-item strong{font-family:'Space Grotesk',sans-serif;font-size:1.6rem;font-weight:700;background:linear-gradient(135deg,#fff,var(--primary-light));-webkit-background-clip:text;-webkit-text-fill-color:transparent}
.trust-item span{font-size:.78rem;color:var(--gray);font-weight:500;letter-spacing:.5px;text-transform:uppercase}
.trust-divider{width:1px;height:40px;background:linear-gradient(to bottom,transparent,var(--glass-border),transparent)}

/* Hero Image */
.hero-visual{display:flex;justify-content:flex-end}
.hero-img-wrapper{position:relative;perspective:1200px}
#hero-img{width:100%;max-width:600px;aspect-ratio:4/5;object-fit:cover;border-radius:36px;box-shadow:0 50px 100px -25px rgba(0,0,0,.6);border:1px solid var(--glass-border);transition:transform .6s var(--ease)}

.floating-card{position:absolute;display:flex;align-items:center;gap:.7rem;background:rgba(15,23,42,.65);backdrop-filter:blur(24px);border:1px solid var(--glass-border);padding:.75rem 1.2rem;border-radius:16px;box-shadow:0 12px 30px -8px rgba(0,0,0,.5);z-index:5}
.float-card-1{top:14%;left:-50px;animation:floatY 6s ease-in-out infinite}
.float-card-2{bottom:18%;right:-40px;animation:floatY 6s ease-in-out infinite 3s}
@keyframes floatY{0%,100%{transform:translateY(0)}50%{transform:translateY(-16px)}}
.fc-icon{font-size:1.5rem}.floating-card strong{font-size:.88rem;display:block;color:#fff}.floating-card small{font-size:.72rem;color:var(--gray)}

/* Section Headers */
.section-label{display:flex;align-items:center;justify-content:center;gap:1rem;margin-bottom:1.5rem}
.label-line{width:40px;height:1px;background:var(--glass-border)}
.label-text{font-size:.78rem;text-transform:uppercase;letter-spacing:4px;color:var(--gray);font-weight:600}
.section-title{text-align:center;font-size:clamp(1.8rem,3.5vw,3rem);font-weight:700;letter-spacing:-1.5px;margin-bottom:1rem;color:#fff}
.section-subtitle{text-align:center;font-size:1.05rem;color:var(--gray);max-width:520px;margin:0 auto 4rem;line-height:1.65}

/* What We Offer */
#services-strip{padding:5rem 0 6rem}
.offer-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem}
.offer-card{position:relative;border-radius:24px;overflow:hidden;height:380px;border:1px solid var(--glass-border);cursor:pointer;transition:all .5s var(--ease)}
.offer-card img{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease),filter .5s var(--ease);filter:brightness(.7)}
.offer-card:hover img{transform:scale(1.08);filter:brightness(.5)}
.offer-card:hover{transform:translateY(-8px);box-shadow:0 24px 50px -12px rgba(99,102,241,.2);border-color:var(--primary)}
.offer-glass{position:absolute;bottom:0;left:0;right:0;padding:1.8rem;background:linear-gradient(to top,rgba(2,6,23,.95) 0%,rgba(2,6,23,.4) 70%,transparent 100%);transition:all .5s var(--ease)}
.offer-card:hover .offer-glass{background:linear-gradient(to top,rgba(2,6,23,.98) 10%,rgba(2,6,23,.6) 80%,transparent 100%)}
.offer-emoji{font-size:1.8rem;display:block;margin-bottom:.8rem}
.offer-glass h3{font-size:1.25rem;font-weight:700;margin-bottom:.4rem;color:#fff;letter-spacing:-.3px}
.offer-glass p{font-size:.88rem;color:rgba(255,255,255,.7);line-height:1.5;max-height:0;overflow:hidden;opacity:0;transition:all .5s var(--ease)}
.offer-card:hover .offer-glass p{max-height:60px;opacity:1;margin-top:.3rem}

/* Partners */
#partners{padding:5rem 0 6rem}
.partners-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:2rem}
.partner-card{height:420px;border-radius:28px;position:relative;overflow:hidden;display:flex;align-items:flex-end;padding:2.5rem;cursor:pointer;transition:all .55s var(--ease);border:1px solid var(--glass-border)}
.dealer-card{background:url('https://images.unsplash.com/photo-1556742044-3c52d6e88c62?auto=format&fit=crop&q=80&w=1000') center/cover}
.restaurant-card{background:url('https://images.unsplash.com/photo-1517248135467-4c7edcad34c4?auto=format&fit=crop&q=80&w=1000') center/cover}
.sell-card{background:url('https://images.unsplash.com/photo-1556740738-b6a63e27c4df?auto=format&fit=crop&q=80&w=1000') center/cover}
.service-card{background:url('https://images.unsplash.com/photo-1621905252507-b35492cc74b4?auto=format&fit=crop&q=80&w=1000') center/cover}
.card-overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(2,6,23,.95) 0%,rgba(2,6,23,.3) 55%,transparent);transition:all .55s var(--ease)}
.partner-card:hover{transform:translateY(-12px);box-shadow:0 30px 60px -15px rgba(99,102,241,.25)}
.partner-card:hover .card-overlay{background:linear-gradient(to top,rgba(99,102,241,.75) 0%,rgba(2,6,23,.15) 55%,transparent)}
.card-badge{position:absolute;top:1.5rem;right:1.5rem;background:var(--glass-strong);backdrop-filter:blur(14px);border:1px solid var(--glass-border);padding:.35rem 1rem;border-radius:50px;font-size:.72rem;font-weight:700;color:#fff;z-index:3;text-transform:uppercase;letter-spacing:1.5px}
.card-icon-circle{width:46px;height:46px;background:var(--glass-strong);backdrop-filter:blur(12px);border:1px solid var(--glass-border);border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:1.3rem;margin-bottom:1.2rem}
.card-content{position:relative;z-index:2}
.card-content h3{font-size:2rem;font-weight:700;margin-bottom:.6rem;color:#fff;letter-spacing:-.5px}
.card-content p{font-size:.95rem;color:rgba(255,255,255,.85);margin-bottom:2rem;max-width:340px;line-height:1.55}
.btn-partner{display:inline-flex;align-items:center;gap:.5rem;padding:.85rem 2rem;background:rgba(255,255,255,.12);backdrop-filter:blur(14px);border:1px solid rgba(255,255,255,.18);color:#fff;text-decoration:none;border-radius:14px;font-weight:700;font-size:.92rem;transition:all .4s var(--ease)}
.btn-partner:hover{background:#fff;color:#000;transform:scale(1.05)}
.btn-partner svg{transition:all .3s var(--ease)}.btn-partner:hover svg{transform:translateX(4px);stroke:#000}

/* How It Works */
#how-it-works{padding:5rem 0 7rem}
.steps-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem}
.step-card{position:relative;background:var(--glass);border:1px solid var(--glass-border);border-radius:24px;overflow:hidden;padding:0;transition:all .5s var(--ease);cursor:pointer}
.step-card:hover{transform:translateY(-10px);border-color:rgba(99,102,241,.3);box-shadow:0 20px 50px -12px rgba(99,102,241,.15)}
.step-num{position:absolute;top:1.2rem;left:1.2rem;font-family:'Space Grotesk',sans-serif;font-size:3.5rem;font-weight:700;color:rgba(255,255,255,.06);z-index:2;line-height:1;letter-spacing:-2px}
.step-card img{width:100%;height:220px;object-fit:cover;transition:transform .6s var(--ease);filter:brightness(.75)}
.step-card:hover img{transform:scale(1.06);filter:brightness(.6)}
.step-card h4{padding:1.5rem 1.5rem .5rem;font-size:1.15rem;font-weight:700;color:#fff;letter-spacing:-.3px}
.step-card p{padding:0 1.5rem 2rem;font-size:.9rem;color:var(--gray);line-height:1.55}

/* Contact CTA */
#contact-cta{padding:5rem 0 6rem}
.cta-box{background:var(--glass-strong);backdrop-filter:blur(24px);border:1px solid var(--glass-border);border-radius:32px;padding:4rem;text-align:center;position:relative;overflow:hidden}
.cta-box::before{content:'';position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:conic-gradient(from 180deg,transparent,rgba(99,102,241,.06),transparent 40%);animation:ctaSpin 8s linear infinite}
@keyframes ctaSpin{to{transform:rotate(360deg)}}
.cta-box h2{font-family:'Space Grotesk',sans-serif;font-size:clamp(1.8rem,3vw,2.8rem);font-weight:700;letter-spacing:-1px;margin-bottom:1rem;color:#fff;position:relative;z-index:1}
.cta-box>p{font-size:1.05rem;color:var(--gray);max-width:550px;margin:0 auto 3rem;line-height:1.65;position:relative;z-index:1}
.cta-channels{display:flex;gap:1.5rem;justify-content:center;flex-wrap:wrap;position:relative;z-index:1}
.cta-link{display:inline-flex;align-items:center;gap:.7rem;padding:1rem 2.2rem;border-radius:16px;font-size:1rem;font-weight:700;text-decoration:none;transition:all .4s var(--ease);border:1px solid var(--glass-border)}
.cta-link.whatsapp{background:rgba(37,211,102,.12);color:#25d366;border-color:rgba(37,211,102,.2)}
.cta-link.whatsapp:hover{background:#25d366;color:#fff;transform:translateY(-4px);box-shadow:0 12px 30px -8px rgba(37,211,102,.4)}
.cta-link.email{background:rgba(99,102,241,.1);color:var(--primary-light);border-color:rgba(99,102,241,.2)}
.cta-link.email:hover{background:var(--primary);color:#fff;transform:translateY(-4px);box-shadow:0 12px 30px -8px rgba(99,102,241,.4)}
.cta-link.call{background:rgba(251,146,60,.1);color:#fb923c;border-color:rgba(251,146,60,.2)}
.cta-link.call:hover{background:#fb923c;color:#fff;transform:translateY(-4px);box-shadow:0 12px 30px -8px rgba(251,146,60,.4)}
.cta-link svg{flex-shrink:0}

/* Footer */
#site-footer{border-top:1px solid var(--glass-border);background:var(--glass);backdrop-filter:blur(24px);margin-top:2rem}
.footer-inner{max-width:1400px;margin:0 auto;padding:4.5rem 5% 3rem;display:grid;grid-template-columns:1.5fr 2fr;gap:4rem;align-items:start}
.footer-brand p{color:var(--gray);max-width:320px;margin-top:1rem;font-size:.92rem;line-height:1.65}
.footer-apps{margin-top:1.5rem}
.footer-apps .app-btn img{height:38px}
.footer-links-group{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem}
.footer-col h4{font-family:'Space Grotesk',sans-serif;font-weight:700;margin-bottom:1.2rem;font-size:.82rem;text-transform:uppercase;letter-spacing:2px;color:var(--gray)}
.footer-col a{display:block;color:rgba(255,255,255,.55);text-decoration:none;margin-bottom:.7rem;font-size:.92rem;transition:all .3s var(--ease)}
.footer-col a:hover{color:#fff;transform:translateX(5px)}
.footer-bottom{max-width:1400px;margin:0 auto;padding:1.5rem 5%;border-top:1px solid var(--glass-border);text-align:center;color:var(--gray);font-size:.82rem}

/* Scrollbar */
::-webkit-scrollbar{width:5px}::-webkit-scrollbar-track{background:var(--dark)}::-webkit-scrollbar-thumb{background:#1e293b;border-radius:10px}::-webkit-scrollbar-thumb:hover{background:#334155}

/* Responsive */
@media(max-width:1024px){
    #hero{grid-template-columns:1fr;gap:3rem;padding:7.5rem 0 4rem;text-align:center}
    .hero-content{order:2}.hero-visual{order:1;display:flex;justify-content:center}
    .hero-content p{margin:0 auto 2.5rem}
    .hero-btns,.app-downloads,.trust-row{justify-content:center}
    .btn-primary,.btn-secondary{width:100%;max-width:260px;justify-content:center}
    .floating-card{display:none}
    .offer-grid{grid-template-columns:repeat(2,1fr)}
    .partners-grid{grid-template-columns:1fr}
    .steps-grid{grid-template-columns:1fr}
    .footer-inner{grid-template-columns:1fr}
    .footer-links-group{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:640px){
    header{padding:1rem 1.2rem}
    .logo-text{font-size:1.4rem}
    #hero{padding:6rem 0 3rem;gap:2rem}
    .hero-content h1{font-size:2.4rem;letter-spacing:-1.5px}
    .hero-content p{font-size:.95rem;margin-bottom:2rem}
    .hero-btns{flex-direction:column;align-items:center;gap:.8rem;margin-bottom:2rem}
    .app-downloads{gap:.8rem}.app-btn img{height:40px}
    .trust-row{gap:1.2rem;flex-wrap:wrap}.trust-item strong{font-size:1.2rem}
    #hero-img{border-radius:24px;max-width:92%}
    .offer-grid{grid-template-columns:1fr}.offer-card{height:300px}
    .section-title{font-size:1.7rem}
    .partner-card{height:320px;padding:1.8rem}.card-content h3{font-size:1.5rem}
    .step-card img{height:180px}
    .footer-links-group{grid-template-columns:1fr 1fr}
    .footer-brand{text-align:center}.footer-brand p{margin:1rem auto 0}
    .footer-apps{justify-content:center}
    .cta-box{padding:2.5rem 1.5rem;border-radius:24px}
    .cta-box h2{font-size:1.6rem}
    .cta-channels{flex-direction:column;align-items:center}
    .cta-link{width:100%;max-width:280px;justify-content:center}
}