/* VintHunter — Black × Gold Luxe Edition */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&family=Outfit:wght@400;500;600;700;800;900&family=Space+Grotesk:wght@400;500;600;700&display=swap');

:root {
    /* Midnight × Gold */
    --bg-deep: #050608;
    --bg-card: rgba(12, 13, 18, 0.55);
    --bg-accent: #07080c;
    --accent: #e2b340;
    --accent-dim: #c9982e;
    --accent-glow: rgba(226, 179, 64, 0.15);
    --accent-glow-strong: rgba(226, 179, 64, 0.35);
    --accent-secondary: #c084fc;
    --accent-ice: #38bdf8;
    --text-primary: #f4f4f5;
    --text-secondary: #a1a1aa;
    --text-muted: #52525b;
    --border-subtle: rgba(255,255,255,0.06);
    --border-gold: rgba(226,179,64,0.15);
    --gold-gradient: linear-gradient(135deg, #f5d782, #e2b340, #c9982e);
    --success: #34d399;
    --warning: #fbbf24;
    --danger: #f87171;
    --transition: all 0.5s cubic-bezier(0.22,1,0.36,1);
    --glass-blur: blur(24px);
}

*{margin:0;padding:0;box-sizing:border-box;}

body{font-family:'Inter',system-ui,sans-serif;background:var(--bg-deep);color:var(--text-primary);line-height:1.6;overflow-x:hidden;}
h1,h2,h3,.font-heading{font-family:'Outfit',sans-serif;font-weight:800;letter-spacing:-0.04em;}
.container{max-width:1280px;margin:0 auto;padding:0 2rem;}

/* ══════════════════════════════════════
   ANIMATED BACKGROUND — GOLD MESH
   ══════════════════════════════════════ */
.bg-mesh{position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none;}
.bg-mesh .orb{position:absolute;border-radius:50%;filter:blur(130px);animation:orbFloat 20s ease-in-out infinite;}
.bg-mesh .orb-1{width:600px;height:600px;background:radial-gradient(circle,rgba(226,179,64,.12),transparent 70%);top:-12%;left:-8%;opacity:.5;animation-duration:28s;}
.bg-mesh .orb-2{width:450px;height:450px;background:radial-gradient(circle,rgba(192,132,252,.08),transparent 70%);bottom:-18%;right:-6%;opacity:.4;animation-duration:32s;animation-delay:-6s;}
.bg-mesh .orb-3{width:350px;height:350px;background:radial-gradient(circle,rgba(226,179,64,.07),transparent 70%);top:45%;left:55%;opacity:.3;animation-duration:24s;animation-delay:-12s;}
@keyframes orbFloat{0%,100%{transform:translate(0,0) scale(1);}25%{transform:translate(50px,-35px) scale(1.08);}50%{transform:translate(-25px,45px) scale(.94);}75%{transform:translate(35px,18px) scale(1.05);}}

.bg-mesh .grid-overlay{position:absolute;inset:0;background-image:linear-gradient(rgba(226,179,64,.012) 1px,transparent 1px),linear-gradient(90deg,rgba(226,179,64,.012) 1px,transparent 1px);background-size:70px 70px;animation:gridDrift 40s linear infinite;}
@keyframes gridDrift{0%{transform:translate(0,0);}100%{transform:translate(70px,70px);}}

.bg-mesh .particle{position:absolute;width:2px;height:2px;background:var(--accent);border-radius:50%;opacity:0;animation:particleFloat 9s ease-in-out infinite;}
.bg-mesh .particle:nth-child(5){left:10%;top:22%;animation-delay:0s;}
.bg-mesh .particle:nth-child(6){left:32%;top:58%;animation-delay:-2s;}
.bg-mesh .particle:nth-child(7){left:55%;top:15%;animation-delay:-4.5s;}
.bg-mesh .particle:nth-child(8){left:78%;top:42%;animation-delay:-1.5s;}
.bg-mesh .particle:nth-child(9){left:90%;top:68%;animation-delay:-6s;}
.bg-mesh .particle:nth-child(10){left:18%;top:82%;animation-delay:-3.5s;}
@keyframes particleFloat{0%,100%{opacity:0;transform:translateY(0) scale(1);}20%{opacity:.55;}50%{opacity:.2;transform:translateY(-70px) scale(1.5);}80%{opacity:.45;}}

/* Shimmer line */
.bg-mesh::after{content:'';position:absolute;top:0;left:-100%;width:50%;height:1px;background:linear-gradient(90deg,transparent,rgba(226,179,64,.3),transparent);animation:scanline 8s linear infinite;}
@keyframes scanline{0%{left:-50%;}100%{left:150%;}}

/* ══════════════════════════════════════
   GLASS
   ══════════════════════════════════════ */
.glass{background:var(--bg-card);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);border:1px solid var(--border-subtle);border-radius:16px;box-shadow:0 4px 30px rgba(0,0,0,.35);}

/* ══════════════════════════════════════
   TEXT EFFECTS
   ══════════════════════════════════════ */
.text-gradient{background:linear-gradient(135deg,#fff 10%,var(--accent) 90%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;}
.text-gold{background:var(--gold-gradient);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;position:relative;}
.text-shimmer{background:linear-gradient(90deg,#f5d782 0%,#fff 40%,#e2b340 60%,#f5d782 100%);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:textShimmer 4s linear infinite;}
@keyframes textShimmer{0%{background-position:200% 0;}100%{background-position:-200% 0;}}

/* ══════════════════════════════════════
   BUTTONS
   ══════════════════════════════════════ */
.cta-btn{display:inline-flex;align-items:center;justify-content:center;padding:.95rem 2.5rem;background:var(--gold-gradient);color:#000 !important;text-decoration:none;font-weight:800;font-size:.85rem;border-radius:12px;transition:var(--transition);text-transform:uppercase;letter-spacing:.1em;border:none;cursor:pointer;position:relative;overflow:hidden;}
.cta-btn::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,transparent,rgba(255,255,255,.25),transparent);transform:translateX(-100%);transition:transform .6s ease;}
.cta-btn:hover::before{transform:translateX(100%);}
.cta-btn:hover{transform:translateY(-3px);box-shadow:0 15px 40px var(--accent-glow-strong);color:#000 !important;}
.cta-btn-outline{background:transparent;border:1.5px solid var(--border-gold);color:var(--accent) !important;}
.cta-btn-outline:hover{background:rgba(226,179,64,.04);border-color:var(--accent);box-shadow:0 10px 30px var(--accent-glow);color:#fff !important;}
.cta-btn-large{padding:1.3rem 4rem;font-size:1.05rem;border-radius:14px;}

/* ══════════════════════════════════════
   HEADER
   ══════════════════════════════════════ */
header{padding:1rem 0;position:fixed;width:100%;top:0;z-index:3000;background:rgba(5,6,8,.75);backdrop-filter:blur(20px);border-bottom:1px solid var(--border-subtle);}
.nav-container{display:flex;justify-content:space-between;align-items:center;}
.nav-links{display:flex;gap:1.5rem;align-items:center;}
.nav-links a{color:var(--text-secondary);text-decoration:none;font-weight:600;font-size:.85rem;transition:color .3s;}
.nav-links a:hover{color:#fff;}

/* ══════════════════════════════════════
   HERO 100VH
   ══════════════════════════════════════ */
.hero-full{min-height:100vh;display:flex;align-items:center;position:relative;z-index:1;padding-top:70px;}
.hero-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:3.5rem;align-items:center;width:100%;}
.hero-content h1{font-size:clamp(2.5rem,4.5vw,4rem);line-height:1.05;margin-bottom:1.2rem;}
.hero-content p{font-size:1.05rem;color:var(--text-secondary);max-width:500px;margin-bottom:2rem;line-height:1.7;}
.hero-content .subtitle{font-size:1.3rem;color:var(--accent);font-weight:700;margin-bottom:.5rem;font-family:'Outfit',sans-serif;}

/* Stats Row */
.stats-row{display:flex;gap:2.5rem;margin-top:2rem;}
.stat-value{font-size:1.5rem;font-weight:900;font-family:'Space Grotesk',monospace;}
.stat-label{font-size:.6rem;color:var(--text-muted);text-transform:uppercase;font-weight:700;letter-spacing:.08em;margin-top:2px;}

/* ══════════════════════════════════════
   LIVE FEED CARD
   ══════════════════════════════════════ */
.live-feed-card{width:100%;max-width:400px;padding:1.25rem;position:relative;overflow:hidden;border-color:var(--border-gold) !important;}
.live-feed-card::before{content:'';position:absolute;top:0;left:0;width:100%;height:3px;background:linear-gradient(90deg,var(--accent),var(--accent-secondary),var(--accent));background-size:200% 100%;animation:shimmerBar 3s linear infinite;}
@keyframes shimmerBar{0%{background-position:200% 0;}100%{background-position:-200% 0;}}
.feed-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem;}
.feed-status{display:flex;align-items:center;gap:7px;font-size:.65rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--accent);}
.feed-status .dot{width:6px;height:6px;background:var(--accent);border-radius:50%;animation:pulse 1.5s ease-in-out infinite;}
@keyframes pulse{0%,100%{opacity:1;box-shadow:0 0 0 0 rgba(226,179,64,.5);}50%{opacity:.7;box-shadow:0 0 0 6px rgba(226,179,64,0);}}
.feed-item{display:flex;gap:.85rem;padding:.85rem;border-radius:10px;border:1px solid var(--border-subtle);margin-bottom:.6rem;background:rgba(255,255,255,.015);transition:var(--transition);animation:feedSlide .5s ease forwards;opacity:0;}
.feed-item:nth-child(1){animation-delay:.3s;}.feed-item:nth-child(2){animation-delay:.5s;}.feed-item:nth-child(3){animation-delay:.7s;}.feed-item:nth-child(4){animation-delay:.9s;}
@keyframes feedSlide{from{opacity:0;transform:translateX(15px);}to{opacity:1;transform:translateX(0);}}
.feed-item:hover{border-color:var(--accent);background:rgba(226,179,64,.03);}
.feed-item-img{width:48px;height:48px;border-radius:8px;object-fit:cover;border:1px solid var(--border-subtle);flex-shrink:0;}
.feed-item-info{flex:1;min-width:0;}
.feed-item-name{font-weight:700;font-size:.8rem;margin-bottom:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.feed-item-meta{font-size:.68rem;color:var(--text-muted);font-weight:500;}
.profit-badge{display:inline-block;padding:3px 9px;border-radius:6px;font-size:.72rem;font-weight:800;background:rgba(226,179,64,.1);color:var(--accent);font-family:'Space Grotesk',monospace;border:1px solid rgba(226,179,64,.15);}
.feed-item-time{font-size:.6rem;color:var(--text-muted);margin-top:3px;text-align:right;}

/* Badge System */
.badge-neon{background:var(--gold-gradient);color:#000 !important;padding:6px 14px;border-radius:8px;font-size:.7rem;font-weight:900;text-transform:uppercase;letter-spacing:.05em;}
.badge-outline{border:1px solid var(--accent-dim);color:var(--accent);background:rgba(226,179,64,.04);padding:6px 14px;border-radius:8px;font-size:.7rem;font-weight:900;text-transform:uppercase;}

/* ══════════════════════════════════════
   SECTIONS
   ══════════════════════════════════════ */
.section{padding:5rem 0;position:relative;z-index:1;}
.section-heading{text-align:center;margin-bottom:3.5rem;}
.section-heading h2{font-size:clamp(1.8rem,3.5vw,2.8rem);margin-bottom:.8rem;line-height:1.1;}
.section-heading p{color:var(--text-secondary);font-size:1rem;max-width:500px;margin:0 auto;}

/* Money Cards */
.money-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1.5rem;}
.money-card{padding:1.5rem;text-align:center;transition:var(--transition);position:relative;overflow:hidden;}
.money-card::after{content:'';position:absolute;inset:0;background:radial-gradient(circle at 50% 0%,rgba(226,179,64,.04),transparent 70%);opacity:0;transition:var(--transition);pointer-events:none;}
.money-card:hover{transform:translateY(-6px);border-color:var(--accent);}.money-card:hover::after{opacity:1;}
.money-card-img{width:100%;aspect-ratio:1;border-radius:12px;object-fit:cover;margin-bottom:1rem;border:1px solid var(--border-subtle);}
.money-card h3{font-size:1.1rem;margin-bottom:.5rem;}
.money-prices{display:flex;justify-content:center;gap:1.5rem;margin:.75rem 0;font-size:.85rem;}
.money-prices .buy{color:var(--text-muted);}.money-prices .sell{color:var(--accent);font-weight:700;}
.money-profit{font-size:1.3rem;font-weight:900;color:var(--accent);font-family:'Space Grotesk',monospace;}

/* Stats */
.stats-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;}
.stat-card{padding:2.5rem 1.5rem;text-align:center;position:relative;overflow:hidden;}
.stat-card::before{content:'';position:absolute;top:0;left:50%;transform:translateX(-50%);width:40px;height:3px;background:var(--gold-gradient);border-radius:2px;}
.stat-card .big-number{font-size:2.8rem;font-weight:900;font-family:'Space Grotesk',monospace;margin-bottom:.3rem;}
.stat-card .stat-desc{font-size:.85rem;color:var(--text-secondary);font-weight:500;}

/* Steps */
.steps-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem;}
.step-card{padding:2rem 1.5rem;text-align:center;position:relative;overflow:hidden;transition:var(--transition);}
.step-card:hover{border-color:var(--border-gold);transform:translateY(-4px);}
.step-number{font-size:2.5rem;font-weight:900;opacity:.15;font-family:'Space Grotesk',monospace;margin-bottom:.5rem;}
.step-card h3{font-size:1rem;margin-bottom:.5rem;}
.step-card p{font-size:.8rem;color:var(--text-secondary);}
.step-card i{font-size:1.8rem;color:var(--accent);margin-bottom:1rem;}

/* Product Cards */
.product-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:2rem;}
.product-card{padding:1.25rem;transition:var(--transition);position:relative;overflow:hidden;}
.product-card:hover{border-color:var(--accent);transform:translateY(-6px);box-shadow:0 15px 40px rgba(226,179,64,.06);}
.product-card::after{content:'';position:absolute;top:0;left:0;width:100%;height:100%;background:radial-gradient(circle at top right,rgba(226,179,64,.04),transparent 70%);opacity:0;transition:var(--transition);pointer-events:none;}
.product-card:hover::after{opacity:1;}
.product-img-container{width:100%;aspect-ratio:4/5;border-radius:12px;overflow:hidden;margin-bottom:1rem;border:1px solid var(--border-subtle);background:#07080c;}
.product-img{width:100%;height:100%;object-fit:cover;transition:var(--transition);opacity:.9;}
.product-card:hover .product-img{transform:scale(1.06);opacity:1;}
.profit-details{display:grid;grid-template-columns:1fr 1fr;gap:.75rem;margin:1rem 0;padding:1rem 0;border-top:1px solid var(--border-subtle);}
.profit-item span{font-size:.65rem;color:var(--text-muted);text-transform:uppercase;font-weight:700;display:block;margin-bottom:2px;}
.profit-item b{font-size:1.1rem;font-family:'Space Grotesk',monospace;color:#fff;}

/* Premium */
.premium-box{padding:4rem 2rem;position:relative;overflow:hidden;text-align:center;border-color:var(--border-gold) !important;}
.premium-box::before{content:'';position:absolute;top:0;left:0;width:100%;height:3px;background:var(--gold-gradient);}
.premium-box .orb-glow{position:absolute;border-radius:50%;filter:blur(120px);pointer-events:none;}
.premium-features{display:flex;justify-content:center;gap:3rem;margin:2rem 0 2.5rem;flex-wrap:wrap;}
.premium-feature{display:flex;align-items:center;gap:.6rem;font-size:.9rem;font-weight:600;}
.premium-feature i{color:var(--accent);font-size:1rem;}

/* FAQ */
.faq-grid{max-width:700px;margin:0 auto;display:flex;flex-direction:column;gap:1rem;}
.faq-item{padding:1.5rem;cursor:pointer;transition:var(--transition);}
.faq-item:hover{border-color:var(--border-gold);}
.faq-question{font-weight:700;font-size:.95rem;display:flex;justify-content:space-between;align-items:center;}
.faq-question i{color:var(--text-muted);transition:transform .3s;}
.faq-answer{max-height:0;overflow:hidden;transition:max-height .4s ease,padding .4s ease;color:var(--text-secondary);font-size:.85rem;line-height:1.7;}
.faq-item.open .faq-answer{max-height:200px;padding-top:1rem;}
.faq-item.open .faq-question i{transform:rotate(180deg);}

/* CTA Section */
.section-cta{padding:5rem 0;text-align:center;position:relative;z-index:1;}
.cta-box{padding:4rem 2rem;position:relative;overflow:hidden;border-color:var(--border-gold) !important;}
.cta-box::before{content:'';position:absolute;top:-100px;left:-100px;width:300px;height:300px;background:var(--accent);filter:blur(160px);opacity:.05;pointer-events:none;}
.cta-box::after{content:'';position:absolute;bottom:-80px;right:-80px;width:250px;height:250px;background:var(--accent-secondary);filter:blur(140px);opacity:.04;pointer-events:none;}

/* Footer */
.site-footer{padding:2.5rem 0;border-top:1px solid var(--border-subtle);color:var(--text-muted);text-align:center;position:relative;z-index:1;}

/* ══════════════════════════════════════
   PRICING
   ══════════════════════════════════════ */
.pricing-hero{display:flex;flex-direction:column;justify-content:center;position:relative;z-index:1;padding:100px 0 40px;min-height:calc(100vh - 70px);}
.pricing-cards-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1.75rem;max-width:900px;width:100%;margin:0 auto;}
@media (max-width:768px){.pricing-cards-grid{grid-template-columns:1fr;gap:1.5rem;}}
.pricing-card{width:100%;padding:1.5rem 1.75rem;text-align:left;position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;border-radius:20px;transition:transform 0.4s cubic-bezier(0.2,0.8,0.2,1),box-shadow 0.4s ease;}
.pricing-card:hover{transform:translateY(-6px);}
.pricing-card.trial-card{border:2px solid var(--accent) !important;box-shadow:0 0 60px var(--accent-glow-strong),0 4px 30px rgba(0,0,0,.5);background:rgba(12,13,18,0.75);}
.pricing-card.trial-card:hover{box-shadow:0 0 80px var(--accent),0 10px 40px rgba(0,0,0,.7);}
.pricing-card.trial-card::before{content:'';position:absolute;top:0;left:0;width:100%;height:4px;background:var(--gold-gradient);}
.pricing-card.direct-card{border:1px solid rgba(255,255,255,0.08) !important;box-shadow:0 4px 30px rgba(0,0,0,.3);background:rgba(12,13,18,0.45);}
.pricing-card.direct-card:hover{border-color:var(--accent) !important;box-shadow:0 0 40px var(--accent-glow),0 10px 40px rgba(0,0,0,.5);}
.pricing-card .plan-name{font-size:1.05rem;text-transform:uppercase;letter-spacing:.15em;font-weight:800;}
.pricing-card .plan-price{font-size:3rem;font-weight:900;font-family:'Space Grotesk',monospace;margin:0;line-height:1;}
.features-list{margin:1.25rem 0;display:flex;flex-direction:column;gap:.6rem;}
.features-list li{display:flex;align-items:center;gap:.65rem;font-size:.85rem;font-weight:500;color:var(--text-secondary);list-style:none;}
.features-list li i{color:var(--accent);font-size:.8rem;flex-shrink:0;}

/* ══════════════════════════════════════
   ANIMATIONS
   ══════════════════════════════════════ */
.animate-reveal{animation:reveal .8s cubic-bezier(.22,1,.36,1) forwards;opacity:0;}
@keyframes reveal{from{opacity:0;transform:translateY(20px);}to{opacity:1;transform:translateY(0);}}
.delay-1{animation-delay:.15s;}.delay-2{animation-delay:.3s;}.delay-3{animation-delay:.45s;}.delay-4{animation-delay:.6s;}
.skeleton{background:linear-gradient(90deg,#07080c 25%,#0f1118 50%,#07080c 75%);background-size:200% 100%;animation:skLoad 2s infinite ease-in-out;}
@keyframes skLoad{0%{background-position:200% 0;}100%{background-position:-200% 0;}}

/* ══════════════════════════════════════
   DASHBOARD
   ══════════════════════════════════════ */
.sidebar{width:240px;height:100vh;position:fixed;left:0;top:0;background:var(--bg-accent);border-right:1px solid var(--border-subtle);padding:1.5rem 1.25rem;display:flex;flex-direction:column;z-index:100;overflow:hidden;}
.nav-item{display:flex;align-items:center;gap:0.8rem;padding:.65rem 1rem;color:var(--text-secondary);text-decoration:none;border-radius:10px;margin-bottom:.2rem;font-weight:600;font-size:.8rem;transition:var(--transition);border:1px solid transparent;position:relative;z-index:20;pointer-events:auto !important;}
.nav-item i{font-size:0.9rem;opacity:.6;}.nav-item:hover{background:rgba(255,255,255,.03);color:#fff;transform:translateX(4px);}
.nav-item.active{background:rgba(226,179,64,.06);color:var(--accent);border-color:rgba(226,179,64,.1);}.nav-item.active i{opacity:1;}
.dashboard-main{margin-left:260px;padding:2.5rem 3rem;width:calc(100% - 260px);overflow-x:hidden;}
.kpi-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.25rem;margin-bottom:3rem;}
.kpi-card{padding:1.25rem;position:relative;overflow:hidden;}
.kpi-value{font-size:2.4rem;font-weight:900;font-family:'Space Grotesk',monospace;margin:.5rem 0;letter-spacing:-.03em;}
.kpi-trend{font-size:.8rem;display:flex;align-items:center;gap:5px;font-weight:700;}.trend-up{color:var(--success);}
.mobile-close-btn { display: none; }
.mobile-topbar { display: none; }

/* Responsive Utilities */
.show-mobile { display: none !important; }
.hide-mobile { display: block !important; }

.charts-grid-layout {
    display: grid;
    grid-template-columns: 1.8fr 1.2fr;
    gap: 1.5rem;
    margin-bottom: 3rem;
}

@media (max-width: 768px) {
    .show-mobile { display: block !important; }
    .hide-mobile { display: none !important; }
    
    .charts-grid-layout {
        grid-template-columns: 1fr !important;
    }
}

::-webkit-scrollbar{width:6px;}::-webkit-scrollbar-track{background:var(--bg-deep);}::-webkit-scrollbar-thumb{background:var(--border-subtle);border-radius:10px;}

.header-content-settings { display: flex; align-items: center; gap: 15px; }
.settings-icon-box {
    width: 50px;
    height: 50px;
    border-radius: 14px;
    background: rgba(255,255,255,0.05);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    border: 1px solid var(--border-subtle);
    color: var(--accent);
}
@media (max-width: 768px) {
    .header-content-settings { gap: 10px; }
    .settings-icon-box { width: 40px; height: 40px; font-size: 1.1rem; }
}

@media (max-width: 768px) {
    .legal-content { padding: 1.5rem !important; margin: 4rem 1rem !important; }
    .legal-content h1 { font-size: 1.8rem !important; }
}

/* ══════════════════════════════════════
   DASHBOARD REFINEMENTS
   ══════════════════════════════════════ */
.dashboard-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    margin-bottom: 5rem;
    padding: 0;
    position: relative;
    z-index: 10;
}
.dashboard-title { font-size: clamp(2rem, 5vw, 3.5rem); line-height: 1; }
.dashboard-subtitle { color: var(--text-secondary); font-size: clamp(0.9rem, 2vw, 1.1rem); margin-top: 0.5rem; }
.header-status { text-align: right; }
.sync-text { font-size: 0.9rem; color: var(--text-muted); margin-bottom: 0.75rem; font-weight: 600; }
.status-badge { padding: 0.75rem 1.25rem; display: inline-flex; align-items: center; gap: 10px; border-radius: 14px; }

.feed-header-main {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 3rem;
}
.feed-title { font-size: clamp(1.5rem, 4vw, 2.5rem); line-height: 1; margin-bottom: 0.5rem; }
.feed-subtitle { color: var(--text-secondary); font-size: 0.9rem; }
.feed-actions { display: flex; gap: 1rem; }

.sort-dropdown {
    appearance: none;
    padding: 0.85rem 2.5rem 0.85rem 1.2rem;
    color: #fff;
    background: rgba(20,20,20,0.6);
    font-weight: 600;
    border-radius: 12px;
    cursor: pointer;
    font-size: 0.85rem;
    background-image: url('data:image/svg+xml;utf8,<svg fill=%22white%22 height=%2220%22 viewBox=%220 0 24 24%22 width=%2220%22 xmlns=%22http://www.w3.org/2000/svg%22><path d=%22M7 10l5 5 5-5z%22/></svg>');
    background-repeat: no-repeat;
    background-position: right 10px center;
}

.refresh-btn {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    border-radius: 12px;
    background: rgba(20,20,20,0.6);
    transition: 0.3s;
}

@media (max-width: 992px) {
    .dashboard-header, .feed-header-main {
        flex-direction: column;
        align-items: flex-start;
        gap: 1.5rem;
    }
    .header-status { text-align: left; }
    .feed-actions { width: 100%; }
    .sort-dropdown { flex: 1; }
}

/* ══════════════════════════════════════
   RESPONSIVE SYSTEM — MOBILE FIRST APPROACH
   ══════════════════════════════════════ */

/* Global Responsive Fixes */
html, body {
    overflow-x: hidden;
    width: 100%;
}

.menu-toggle {
    display: none;
    background: none;
    border: none;
    color: #fff;
    font-size: 1.5rem;
    cursor: pointer;
    padding: 5px;
    z-index: 1001;
    transition: var(--transition);
}
.menu-toggle:hover { color: var(--accent); }

@media (max-width: 1024px) {
    .dashboard-main {
        margin-left: 240px;
        width: calc(100% - 240px);
        padding: 2.5rem 1.5rem;
    }
}

@media (max-width: 992px) {
    .container { padding: 0 1.25rem; }
    
    .hero-grid {
        grid-template-columns: 1fr;
        text-align: center;
        gap: 2.5rem;
    }
    .hero-content h1 { font-size: clamp(2rem, 8vw, 3rem); }
    .hero-content p { margin: 0 auto 2rem; }
    .stats-row { justify-content: center; gap: 2rem; }
    
    .hero-visual {
        order: -1;
        display: flex;
        justify-content: center;
    }
    
    .steps-grid { grid-template-columns: repeat(2, 1fr); }
    .premium-features { gap: 1.5rem; }

    /* Dashboard Headers */
    .dashboard-header, .feed-header-main {
        flex-direction: column;
        align-items: flex-start;
        gap: 1.5rem;
        margin-bottom: 4rem;
    }
    .header-status { text-align: left; width: 100%; }
    .feed-actions { width: 100%; display: flex; gap: 10px; }
    .sort-dropdown { flex: 1; min-width: 0; }
}

@media (max-width: 768px) {
    /* Navbar Mobile */
    .nav-overlay {
        position: fixed;
        inset: 0;
        background: rgba(0,0,0,0.5);
        z-index: 2000; /* Strictly below header (3000) and topbar (4000) */
        opacity: 0;
        pointer-events: none;
        transition: opacity 0.3s ease;
    }
    .nav-overlay.active {
        opacity: 1;
        pointer-events: auto;
    }

    .menu-toggle { 
        display: block; 
        z-index: 3500; 
    }
    
    .nav-links {
        position: fixed;
        top: 0;
        right: 0;
        width: 300px;
        max-width: 85%;
        height: 100vh;
        background: #0f1016; /* Clean solid dark */
        flex-direction: column;
        justify-content: flex-start;
        padding: 6rem 1.5rem 2rem;
        transform: translateX(101%); /* Out of screen */
        transition: transform 0.4s cubic-bezier(0.22, 1, 0.36, 1);
        box-shadow: -10px 0 50px rgba(0,0,0,0.5);
        z-index: 10010; /* Irrelevant if inside header, but good for safety */
        border-left: 2px solid var(--accent);
    }
    
    .nav-links.active { transform: translateX(0); }

    /* Close button inside mobile menu - HIGH VISIBILITY */
    .menu-close {
        display: flex;
        position: absolute;
        top: 1.5rem;
        right: 1.5rem;
        background: var(--accent); /* Solid Gold Background */
        color: #000 !important; /* Black X */
        width: 48px;
        height: 48px;
        border-radius: 50%;
        align-items: center;
        justify-content: center;
        font-size: 1.4rem;
        cursor: pointer;
        transition: var(--transition);
        z-index: 2100; /* Above the menu itself */
        box-shadow: 0 4px 15px rgba(226, 179, 64, 0.4);
        border: none;
    }
    .menu-close:hover { transform: rotate(90deg) scale(1.1); box-shadow: 0 4px 25px var(--accent); }

    .nav-links > a { 
        font-size: 1.1rem; 
        width: 100%; 
        text-align: left; 
        padding: 1rem; 
        border-bottom: 1px solid rgba(255,255,255,0.05);
        color: rgba(255,255,255,0.9) !important;
        font-weight: 600;
        display: block;
        text-decoration: none;
        transition: 0.2s;
    }
    .nav-links > a:active { background: rgba(226, 179, 64, 0.1); color: var(--accent) !important; }
    .nav-links .cta-btn { width: 100%; margin-top: 1rem; padding: 1.2rem; }

    /* Sections */
    .section { padding: 4rem 0; }
    .section-heading { margin-bottom: 2.5rem; }
    
    .money-grid, .stats-grid, .steps-grid, .product-grid, .kpi-grid, #charts-section {
        grid-template-columns: 1fr;
        gap: 1.25rem;
    }
    
    .money-card-img { aspect-ratio: 16/9; }
    .stat-card { padding: 2rem 1.25rem; }
    .stat-card .big-number { font-size: 2.2rem; }
    
    /* Buttons */
    .cta-btn { width: 100%; min-height: 50px; font-size: .8rem; }
    .cta-btn-large { padding: 1.2rem 2rem; font-size: .95rem; }
    
    /* Premium Box */
    .premium-box, .cta-box { padding: 3rem 1.5rem; }
    .premium-features { flex-direction: column; align-items: center; gap: 1rem; }

    /* Dashboard Mobile Adjustments */
    .mobile-topbar {
        display: flex !important;
        height: 64px;
        justify-content: space-between;
        align-items: center;
        padding: 0 1.25rem;
        background: rgba(5, 6, 8, 0.95);
        backdrop-filter: blur(20px);
        border-bottom: 1px solid var(--border-subtle);
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        z-index: 4000;
    }
    
    .sidebar {
        width: 280px;
        height: 100vh;
        position: fixed;
        top: 0;
        left: 0;
        transform: translateX(-101%);
        padding: 1.5rem 1.25rem;
        flex-direction: column;
        z-index: 5000; /* Above topbar (4000) and overlay (2000) */
        background: #0f1016;
        transition: transform 0.4s cubic-bezier(0.22, 1, 0.36, 1);
        box-shadow: 10px 0 50px rgba(0,0,0,0.5);
        border-right: 2px solid var(--accent);
    }
    .sidebar.active { transform: translateX(0); }
    .mobile-close-btn { display: block; }
    
    .dashboard-main {
        margin-left: 0;
        width: 100%;
        padding: calc(64px + 2rem) 1.25rem 3rem 1.25rem; /* Space for fixed mobile topbar */
    }

    .kpi-grid { grid-template-columns: repeat(2, 1fr); }
    .kpi-card { padding: 1rem; }
    .kpi-value { font-size: 1.7rem; }
    
    .dashboard-header { margin-bottom: 2rem; }
    .dashboard-title { font-size: 2rem; }

    /* Pricing */
    .pricing-hero { padding: 100px 1.25rem 4rem; min-height: auto; }
    .pricing-card { padding: 2.5rem 1.5rem; }
    .pricing-card .plan-price { font-size: 3rem; }
}

@media (max-width: 480px) {
    .kpi-grid { grid-template-columns: 1fr; }
    .hero-content h1 { font-size: 1.8rem; }
    .section-heading h2 { font-size: 1.5rem; }
    .stats-row { flex-direction: column; align-items: center; gap: 1.5rem; }
    .nav-item { font-size: 0.85rem; padding: 0.8rem 1rem; }
}