/* ===== RESET & BASE ===== */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
:root{
  --bg:#06060f;--bg2:#0c0c1d;--bg3:#12122a;--bg4:#1a1a3a;
  --text:#e2e2f0;--text-muted:#8888a8;--text-dim:#55557a;
  --accent:#6c5ce7;--accent2:#a855f7;--accent3:#c084fc;
  --gradient:linear-gradient(135deg,#6c5ce7,#a855f7,#c084fc);
  --success:#22c55e;--danger:#ef4444;
  --card:#0e0e20;--card-border:#1e1e3a;
  --radius:12px;--radius-lg:20px;
  --font:'Inter',system-ui,-apple-system,sans-serif;
}
html{scroll-behavior:smooth;scroll-padding-top:80px}
body{font-family:var(--font);background:var(--bg);color:var(--text);line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.container{max-width:1200px;margin:0 auto;padding:0 24px}

/* ===== NAVBAR ===== */
.navbar{position:fixed;top:0;left:0;right:0;z-index:100;padding:16px 0;transition:all .3s}
.navbar.scrolled{background:rgba(6,6,15,.92);backdrop-filter:blur(20px);border-bottom:1px solid var(--card-border)}
.nav-container{display:flex;align-items:center;justify-content:space-between}
.logo{display:flex;align-items:center;gap:10px;font-weight:700;font-size:20px}
.logo-icon{width:36px;height:36px;border-radius:10px;object-fit:contain}
.nav-links{display:flex;list-style:none;gap:32px}
.nav-links a{font-size:14px;font-weight:500;color:var(--text-muted);transition:color .2s}
.nav-links a:hover{color:#fff}
.nav-actions{display:flex;gap:12px;align-items:center}
.mobile-menu{display:none;background:none;border:none;cursor:pointer;flex-direction:column;gap:5px;padding:4px}
.mobile-menu span{display:block;width:22px;height:2px;background:var(--text);border-radius:2px;transition:all .3s}

/* ===== BUTTONS ===== */
.btn{display:inline-flex;align-items:center;gap:8px;padding:10px 22px;border-radius:10px;font-size:14px;font-weight:600;cursor:pointer;border:none;transition:all .25s;font-family:var(--font)}
.btn-primary{background:var(--gradient);color:#fff;box-shadow:0 4px 20px rgba(108,92,231,.3)}
.btn-primary:hover{box-shadow:0 6px 30px rgba(108,92,231,.5);transform:translateY(-1px)}
.btn-outline{background:transparent;color:var(--text);border:1.5px solid var(--card-border)}
.btn-outline:hover{border-color:var(--accent);color:#fff}
.btn-ghost{background:transparent;color:var(--text-muted);padding:10px 16px}
.btn-ghost:hover{color:#fff}
.btn-lg{padding:14px 32px;font-size:16px;border-radius:12px}
.btn-block{width:100%;justify-content:center}

/* ===== HERO ===== */
.hero{position:relative;padding:160px 0 100px;overflow:hidden}
.hero-bg-glow{position:absolute;top:-200px;left:50%;transform:translateX(-50%);width:800px;height:600px;background:radial-gradient(ellipse,rgba(108,92,231,.15),transparent 70%);pointer-events:none}
.hero-container{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}
.hero-badge{display:inline-flex;align-items:center;gap:8px;padding:8px 16px;border-radius:100px;background:var(--bg3);border:1px solid var(--card-border);font-size:13px;color:var(--text-muted);margin-bottom:24px}
.hero h1{font-size:52px;font-weight:800;line-height:1.15;letter-spacing:-.02em;margin-bottom:20px}
.gradient-text{background:var(--gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.hero-desc{font-size:17px;color:var(--text-muted);line-height:1.7;margin-bottom:32px;max-width:520px}
.hero-cta{display:flex;gap:16px;margin-bottom:28px}
.hero-platforms{display:flex;align-items:center;gap:16px;margin-bottom:32px}
.hero-platforms-label{font-size:13px;color:var(--text-dim);font-weight:500;white-space:nowrap;text-transform:uppercase;letter-spacing:1px}
.hero-platforms-icons{display:flex;gap:10px;align-items:center}
.hero-platform-item{width:40px;height:40px;border-radius:10px;background:var(--bg3);border:1px solid var(--card-border);display:flex;align-items:center;justify-content:center;transition:all .3s;cursor:default}
.hero-platform-item:hover{border-color:var(--accent);transform:translateY(-2px);box-shadow:0 8px 20px rgba(108,92,231,.15)}
.hero-platform-item img{width:22px;height:22px;object-fit:contain}
.hero-platform-item svg{width:20px;height:20px;color:var(--text-muted)}
.hero-stats{display:flex;gap:32px;align-items:center}
.stat{display:flex;flex-direction:column}
.stat-num{font-size:28px;font-weight:800;color:#fff}
.stat-label{font-size:13px;color:var(--text-muted)}
.stat-divider{width:1px;height:40px;background:var(--card-border)}

/* ===== APP SHOWCASE ===== */
.app-showcase{border-radius:var(--radius-lg);overflow:hidden;box-shadow:0 40px 80px rgba(0,0,0,.4),0 0 100px rgba(108,92,231,.12);transition:transform .4s ease,box-shadow .4s ease}
.app-showcase:hover{transform:translateY(-6px) scale(1.02);box-shadow:0 50px 100px rgba(0,0,0,.5),0 0 120px rgba(108,92,231,.2)}
.app-showcase img{width:100%;height:auto;display:block}

/* ===== BRANDS ===== */
.brands{padding:60px 0;border-top:1px solid var(--card-border);border-bottom:1px solid var(--card-border)}
.brands-label{text-align:center;font-size:13px;color:var(--text-dim);text-transform:uppercase;letter-spacing:2px;margin-bottom:24px}
.marquee{overflow:hidden;position:relative;mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}
.marquee-track{display:flex;gap:48px;animation:marquee 30s linear infinite;width:max-content}
.marquee-item{display:flex;align-items:center;gap:10px;padding:10px 20px;border-radius:12px;background:var(--bg3);border:1px solid var(--card-border);white-space:nowrap;transition:all .3s}
.marquee-item:hover{border-color:var(--brand,var(--accent));box-shadow:0 0 20px rgba(108,92,231,.15)}
.marquee-item svg{color:var(--brand,var(--text-muted));flex-shrink:0}
.marquee-item span{font-size:15px;font-weight:600;color:var(--text-muted)}
@keyframes marquee{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}

/* ===== SECTIONS COMMON ===== */
.section-header{text-align:center;margin-bottom:64px}
.section-tag{display:inline-block;padding:6px 14px;border-radius:100px;background:rgba(108,92,231,.1);border:1px solid rgba(108,92,231,.2);color:var(--accent3);font-size:13px;font-weight:600;margin-bottom:16px}
.section-header h2{font-size:40px;font-weight:800;line-height:1.2;margin-bottom:16px}
.section-header p{font-size:16px;color:var(--text-muted);max-width:560px;margin:0 auto}

/* ===== FEATURES ===== */
.features{padding:120px 0}
.features-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.feature-card{background:var(--card);border:1px solid var(--card-border);border-radius:var(--radius-lg);padding:32px;transition:all .3s}
.feature-card:hover{border-color:var(--accent);transform:translateY(-4px);box-shadow:0 20px 40px rgba(108,92,231,.1)}
.feature-icon{width:48px;height:48px;border-radius:12px;background:rgba(108,92,231,.1);display:flex;align-items:center;justify-content:center;margin-bottom:20px;color:var(--accent3)}
.feature-card h3{font-size:18px;font-weight:700;margin-bottom:10px}
.feature-card p{font-size:14px;color:var(--text-muted);line-height:1.7}

/* ===== AUTOMATION ===== */
.automation{padding:120px 0;background:var(--bg2)}
.auto-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}
.auto-content h2{font-size:40px;font-weight:800;line-height:1.2;margin-bottom:20px}
.auto-content>p{color:var(--text-muted);margin-bottom:32px;line-height:1.7}
.auto-list{list-style:none;display:flex;flex-direction:column;gap:16px;margin-bottom:36px}
.auto-list li{display:flex;align-items:center;gap:12px;font-size:15px;font-weight:500}
.script-card{background:var(--card);border:1px solid var(--card-border);border-radius:var(--radius-lg);padding:24px;box-shadow:0 20px 60px rgba(0,0,0,.3)}
.script-header{display:flex;align-items:center;gap:14px;margin-bottom:24px}
.script-icon{width:40px;height:40px;border-radius:10px;background:rgba(239,68,68,.15);color:#ef4444;display:flex;align-items:center;justify-content:center;font-size:16px}
.script-name{font-weight:700;font-size:16px}
.script-platform{font-size:12px;color:var(--text-muted)}
.script-badge{margin-left:auto;padding:4px 12px;border-radius:100px;background:rgba(34,197,94,.1);color:var(--success);font-size:12px;font-weight:600}
.script-steps{display:flex;flex-direction:column;gap:12px}
.script-step{padding:12px 16px;border-radius:10px;background:var(--bg3);font-size:13px;color:var(--text-muted);border-left:3px solid var(--card-border);transition:all .3s}
.script-step.done{border-left-color:var(--success);color:var(--text)}
.script-step.active{border-left-color:var(--accent);color:#fff;background:var(--bg4);box-shadow:0 0 20px rgba(108,92,231,.1)}

/* ===== PRICING ===== */
.pricing{padding:120px 0}
.period-toggle{display:flex;justify-content:center;gap:8px;margin-bottom:48px;flex-wrap:wrap}
.period-btn{padding:10px 20px;border-radius:10px;border:1px solid var(--card-border);background:transparent;color:var(--text-muted);cursor:pointer;font-size:13px;font-weight:600;font-family:var(--font);transition:all .2s}
.period-btn:hover{border-color:var(--accent)}
.period-btn.active{background:var(--accent);color:#fff;border-color:var(--accent)}
.discount{color:var(--success);font-size:11px}
.period-btn.active .discount{color:#bef7d1}
.pricing-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:16px}
.price-card{background:var(--card);border:1px solid var(--card-border);border-radius:var(--radius-lg);padding:28px 24px;text-align:center;position:relative;transition:all .3s}
.price-card:hover{border-color:var(--accent);transform:translateY(-4px)}
.price-card.popular{border-color:var(--accent);background:linear-gradient(180deg,rgba(108,92,231,.08),var(--card));box-shadow:0 0 40px rgba(108,92,231,.15)}
.popular-badge{position:absolute;top:-12px;left:50%;transform:translateX(-50%);padding:4px 16px;border-radius:100px;background:var(--gradient);color:#fff;font-size:11px;font-weight:700;white-space:nowrap}
.price-name{font-size:18px;font-weight:700;margin-bottom:12px}
.price-amount{font-size:42px;font-weight:800;margin-bottom:4px}
.price-period{font-size:16px;font-weight:400;color:var(--text-muted)}
.price-profiles{font-size:14px;color:var(--accent3);font-weight:600;margin-bottom:24px}
.price-features{list-style:none;display:flex;flex-direction:column;gap:10px;margin-bottom:28px;text-align:left}
.price-features li{font-size:13px;padding-left:24px;position:relative;color:var(--text-muted)}
.price-features li.yes::before{content:'';position:absolute;left:0;top:4px;width:14px;height:14px;border-radius:50%;background:rgba(34,197,94,.15)}
.price-features li.yes::after{content:'';position:absolute;left:4px;top:7px;width:6px;height:3px;border-left:2px solid var(--success);border-bottom:2px solid var(--success);transform:rotate(-45deg)}
.price-features li.no{opacity:.4}
.price-features li.no::before{content:'';position:absolute;left:0;top:4px;width:14px;height:14px;border-radius:50%;background:rgba(255,255,255,.05)}

/* ===== FAQ ===== */
.faq{padding:120px 0;background:var(--bg2)}
.faq-list{max-width:720px;margin:0 auto;display:flex;flex-direction:column;gap:8px}
.faq-item{border:1px solid var(--card-border);border-radius:var(--radius);overflow:hidden;background:var(--card)}
.faq-q{width:100%;display:flex;justify-content:space-between;align-items:center;padding:20px 24px;background:none;border:none;color:var(--text);font-size:15px;font-weight:600;cursor:pointer;text-align:left;font-family:var(--font)}
.faq-q svg{transition:transform .3s;flex-shrink:0;color:var(--text-muted)}
.faq-item.open .faq-q svg{transform:rotate(180deg)}
.faq-a{max-height:0;overflow:hidden;transition:max-height .3s ease}
.faq-item.open .faq-a{max-height:200px}
.faq-a p{padding:0 24px 20px;font-size:14px;color:var(--text-muted);line-height:1.7}

/* ===== CTA ===== */
.cta-section{padding:120px 0}
.cta-box{text-align:center;padding:80px 40px;border-radius:24px;background:linear-gradient(135deg,rgba(108,92,231,.1),rgba(168,85,247,.08));border:1px solid rgba(108,92,231,.2);position:relative;overflow:hidden}
.cta-box::before{content:'';position:absolute;top:-100px;right:-100px;width:300px;height:300px;background:radial-gradient(circle,rgba(108,92,231,.15),transparent);pointer-events:none}
.cta-box h2{font-size:36px;font-weight:800;margin-bottom:16px}
.cta-box p{color:var(--text-muted);margin-bottom:32px;font-size:16px}

/* ===== PLATFORM PAGES ===== */
.platform-hero{padding:140px 0 80px;position:relative;overflow:hidden}
.platform-hero-glow{position:absolute;top:-200px;left:50%;transform:translateX(-50%);width:800px;height:800px;background:radial-gradient(circle,rgba(83,252,24,.08),transparent 70%);pointer-events:none}
.platform-hero-grid{display:grid;grid-template-columns:1.2fr 1fr;align-items:center;gap:60px}
.platform-hero-content h1{font-size:clamp(36px,5vw,56px);font-weight:800;line-height:1.1;margin-bottom:24px}
.platform-hero-content p{color:var(--text-muted);font-size:18px;line-height:1.7;margin-bottom:36px}
.platform-badge{display:inline-flex;align-items:center;gap:10px;padding:8px 16px;border-radius:40px;background:rgba(83,252,24,.08);border:1px solid rgba(83,252,24,.2);margin-bottom:24px}
.platform-badge span{font-weight:600;font-size:14px;color:#53FC18}
.platform-badge img{border-radius:6px}
.platform-hero-actions{display:flex;gap:16px;flex-wrap:wrap}
.platform-hero-visual{display:flex;align-items:center;justify-content:center}
.platform-icon-large{width:220px;height:220px;border-radius:40px;background:rgba(83,252,24,.06);border:2px solid rgba(83,252,24,.15);display:flex;align-items:center;justify-content:center;box-shadow:0 40px 80px rgba(83,252,24,.1);animation:platformFloat 4s ease-in-out infinite}
.platform-icon-large img{border-radius:24px}
@keyframes platformFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}
@media(max-width:768px){
.platform-hero-grid{grid-template-columns:1fr;text-align:center}
.platform-hero-visual{order:-1}
.platform-icon-large{width:140px;height:140px;border-radius:28px}
.platform-icon-large img{width:80px;height:80px}
.platform-hero-actions{justify-content:center}
.platform-badge{margin:0 auto 24px}
}

/* ===== FOOTER ===== */
.footer{padding:80px 0 40px;border-top:1px solid var(--card-border)}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:48px;margin-bottom:48px}
.footer-brand p{color:var(--text-muted);font-size:14px;margin-top:16px;line-height:1.7}
.footer-links h4{font-weight:700;font-size:14px;margin-bottom:16px;color:var(--text)}
.footer-links a{display:block;font-size:13px;color:var(--text-muted);margin-bottom:10px;transition:color .2s}
.footer-links a:hover{color:var(--accent3)}
.footer-bottom{display:flex;justify-content:space-between;align-items:center;padding-top:32px;border-top:1px solid var(--card-border);font-size:13px;color:var(--text-dim)}
.footer-social{display:flex;gap:16px}
.footer-social a{color:var(--text-muted);transition:color .2s}
.footer-social a:hover{color:var(--accent3)}

/* ===== RESPONSIVE ===== */
@media(max-width:1024px){
  .hero-container{grid-template-columns:1fr;text-align:center}
  .hero-desc{margin:0 auto 32px}
  .hero-cta{justify-content:center}
  .hero-stats{justify-content:center}
  .hero-visual{max-width:600px;margin:0 auto}
  .features-grid{grid-template-columns:repeat(2,1fr)}
  .auto-grid{grid-template-columns:1fr}
  .auto-content{text-align:center}
  .auto-list{align-items:center}
  .pricing-grid{grid-template-columns:repeat(3,1fr)}
  .footer-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:768px){
  .nav-links,.nav-actions{display:none}
  .mobile-menu{display:flex}
  .hero{padding:120px 0 60px}
  .hero h1{font-size:36px}
  .section-header h2{font-size:30px}
  .features-grid{grid-template-columns:1fr}
  .pricing-grid{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr}
  .footer-bottom{flex-direction:column;gap:16px;text-align:center}
  .hero-container{grid-template-columns:1fr}
  .hero-visual{display:block;max-width:100%}
  .hero-platforms{flex-wrap:wrap;gap:12px}
  .hero-platforms-label{font-size:11px}
  .hero-platform-item{width:36px;height:36px}
  .hero-platform-item img{width:18px;height:18px}
  .hero-platform-item svg{width:16px;height:16px}
  .hero-stats{flex-direction:column;gap:16px}
  .stat-divider{width:40px;height:1px}
  .period-toggle{flex-wrap:wrap}
  .cta-box{padding:48px 24px}
  .cta-box h2{font-size:28px}
}
@media(max-width:480px){
  .hero h1{font-size:28px}
  .pricing-grid{gap:12px}
  .brands-list{gap:24px}
}

/* ===== ABOUT PAGE ===== */
.about-hero{padding:160px 0 80px;text-align:center;position:relative;overflow:hidden}
.about-hero::before{content:'';position:absolute;top:-200px;left:50%;transform:translateX(-50%);width:800px;height:600px;background:radial-gradient(ellipse,rgba(108,92,231,.15),transparent 70%);pointer-events:none}
.about-hero .badge{display:inline-block;padding:8px 20px;border-radius:100px;background:rgba(108,92,231,.1);border:1px solid rgba(108,92,231,.2);color:var(--accent3);font-size:13px;font-weight:600;margin-bottom:20px}
.about-hero h1{font-size:52px;font-weight:800;line-height:1.15;letter-spacing:-.02em;margin-bottom:20px}
.about-hero-text{font-size:17px;color:var(--text-muted);line-height:1.7;max-width:640px;margin:0 auto}

.about-story{padding:100px 0;background:var(--bg2)}
.about-story-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:60px;align-items:center}
.about-story-content h2{font-size:36px;font-weight:800;line-height:1.2;margin-bottom:24px}
.about-story-content p{color:var(--text-muted);line-height:1.8;margin-bottom:16px;font-size:15px}
.about-story-visual{display:flex;justify-content:center}
.about-story-card{background:var(--card);border:1px solid var(--card-border);border-radius:var(--radius-lg);padding:48px;text-align:center;box-shadow:0 20px 60px rgba(0,0,0,.3)}
.about-story-card h3{font-size:22px;font-weight:800;margin-bottom:8px}
.about-story-card p{color:var(--text-muted);font-size:14px}

.about-milestones{padding:100px 0}
.about-milestones .section-title,.about-values .section-title{text-align:center;font-size:36px;font-weight:800;margin-bottom:60px}
.timeline{position:relative;max-width:700px;margin:0 auto;padding-left:40px}
.timeline::before{content:'';position:absolute;left:15px;top:0;bottom:0;width:2px;background:linear-gradient(to bottom,var(--accent),var(--accent2),var(--accent3))}
.timeline-item{position:relative;margin-bottom:48px}
.timeline-item:last-child{margin-bottom:0}
.timeline-year{position:absolute;left:-40px;width:50px;height:50px;border-radius:50%;background:var(--bg3);border:2px solid var(--accent);display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:800;color:var(--accent3);z-index:1}
.timeline-content{background:var(--card);border:1px solid var(--card-border);border-radius:var(--radius);padding:28px;margin-left:30px;transition:all .3s}
.timeline-content:hover{border-color:var(--accent);transform:translateX(4px)}
.timeline-content h3{font-size:18px;font-weight:700;margin-bottom:12px}
.timeline-content ul{list-style:none;display:flex;flex-direction:column;gap:8px}
.timeline-content li{font-size:14px;color:var(--text-muted);padding-left:20px;position:relative;line-height:1.6}
.timeline-content li::before{content:'';position:absolute;left:0;top:8px;width:8px;height:8px;border-radius:50%;background:rgba(108,92,231,.3);border:2px solid var(--accent)}

.about-values{padding:100px 0;background:var(--bg2)}
.values-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.value-card{background:var(--card);border:1px solid var(--card-border);border-radius:var(--radius-lg);padding:32px;text-align:center;transition:all .3s}
.value-card:hover{border-color:var(--accent);transform:translateY(-4px);box-shadow:0 20px 40px rgba(108,92,231,.1)}
.value-icon{width:56px;height:56px;border-radius:14px;background:rgba(108,92,231,.1);display:flex;align-items:center;justify-content:center;margin:0 auto 20px;color:var(--accent3)}
.value-card h3{font-size:18px;font-weight:700;margin-bottom:10px}
.value-card p{font-size:14px;color:var(--text-muted);line-height:1.7}

@media(max-width:1024px){
  .about-story-grid{grid-template-columns:1fr}
  .about-story-visual{order:-1}
  .values-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:768px){
  .about-hero{padding:120px 0 60px}
  .about-hero h1{font-size:36px}
  .about-milestones .section-title,.about-values .section-title{font-size:30px}
  .values-grid{grid-template-columns:1fr}
  .timeline{padding-left:30px}
  .timeline-year{width:40px;height:40px;left:-30px;font-size:11px}
  .timeline-content{margin-left:24px;padding:20px}
}
@media(max-width:480px){
  .about-hero h1{font-size:28px}
}

/* ===== BLOG PAGE ===== */
.blog-hero{padding:160px 0 60px;text-align:center;position:relative;overflow:hidden}
.blog-hero::before{content:'';position:absolute;top:-200px;left:50%;transform:translateX(-50%);width:800px;height:600px;background:radial-gradient(ellipse,rgba(108,92,231,.15),transparent 70%);pointer-events:none}
.blog-hero .badge{display:inline-block;padding:8px 20px;border-radius:100px;background:rgba(108,92,231,.1);border:1px solid rgba(108,92,231,.2);color:var(--accent3);font-size:13px;font-weight:600;margin-bottom:20px}
.blog-hero h1{font-size:52px;font-weight:800;line-height:1.15;letter-spacing:-.02em;margin-bottom:20px}
.blog-hero-text{font-size:17px;color:var(--text-muted);line-height:1.7;max-width:640px;margin:0 auto}

.blog-filters{padding:32px 0 0}
.blog-filter-bar{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}
.blog-filter-btn{padding:8px 20px;border-radius:100px;border:1px solid var(--card-border);background:transparent;color:var(--text-muted);cursor:pointer;font-size:13px;font-weight:600;font-family:var(--font);transition:all .2s}
.blog-filter-btn:hover{border-color:var(--accent);color:#fff}
.blog-filter-btn.active{background:var(--accent);color:#fff;border-color:var(--accent)}

.blog-posts{padding:48px 0 0}
.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.blog-card{background:var(--card);border:1px solid var(--card-border);border-radius:var(--radius-lg);overflow:hidden;transition:all .3s;cursor:pointer}
.blog-card:hover{border-color:var(--accent);transform:translateY(-4px);box-shadow:0 20px 40px rgba(108,92,231,.1)}
.blog-card-img{height:180px;display:flex;align-items:center;justify-content:center;position:relative}
.blog-card-body{padding:24px}
.blog-card-category{display:inline-block;padding:4px 12px;border-radius:100px;background:rgba(108,92,231,.1);color:var(--accent3);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;margin-bottom:12px}
.blog-card-title{font-size:17px;font-weight:700;line-height:1.4;margin-bottom:10px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.blog-card-excerpt{font-size:14px;color:var(--text-muted);line-height:1.6;margin-bottom:16px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.blog-card-meta{display:flex;justify-content:space-between;align-items:center;font-size:12px;color:var(--text-dim)}
.blog-card-author{font-weight:600}
.blog-card-time{display:flex;align-items:center;gap:4px}

@media(max-width:1024px){
  .blog-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:768px){
  .blog-hero{padding:120px 0 40px}
  .blog-hero h1{font-size:36px}
  .blog-grid{grid-template-columns:1fr}
  .blog-filter-bar{justify-content:flex-start;overflow-x:auto;flex-wrap:nowrap;padding-bottom:8px}
  .blog-filter-btn{white-space:nowrap;flex-shrink:0}
}
@media(max-width:480px){
  .blog-hero h1{font-size:28px}
}

/* ===== GUIDES PAGE ===== */
.guides-hero{padding:160px 0 60px;text-align:center;position:relative;overflow:hidden}
.guides-hero::before{content:'';position:absolute;top:-200px;left:50%;transform:translateX(-50%);width:800px;height:600px;background:radial-gradient(ellipse,rgba(108,92,231,.15),transparent 70%);pointer-events:none}
.guides-hero .badge{display:inline-block;padding:8px 20px;border-radius:100px;background:rgba(108,92,231,.1);border:1px solid rgba(108,92,231,.2);color:var(--accent3);font-size:13px;font-weight:600;margin-bottom:20px}
.guides-hero h1{font-size:52px;font-weight:800;line-height:1.15;letter-spacing:-.02em;margin-bottom:20px}
.guides-hero-text{font-size:17px;color:var(--text-muted);line-height:1.7;max-width:640px;margin:0 auto}

.guides-section{padding:60px 0 0}
.guide-category{margin-bottom:48px}
.guide-category-header{display:flex;align-items:center;gap:14px;margin-bottom:20px}
.guide-category-icon{width:44px;height:44px;border-radius:12px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.guide-category-header h2{font-size:22px;font-weight:800}
.guide-list{display:flex;flex-direction:column;gap:8px}
.guide-item{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 24px;background:var(--card);border:1px solid var(--card-border);border-radius:var(--radius);transition:all .2s;text-decoration:none;color:inherit}
.guide-item:hover{border-color:var(--accent);transform:translateX(4px);background:var(--bg3)}
.guide-item:hover svg{color:var(--accent3)}
.guide-item svg{color:var(--text-dim);flex-shrink:0;transition:color .2s}
.guide-item-info h3{font-size:15px;font-weight:700;margin-bottom:4px}
.guide-item-info p{font-size:13px;color:var(--text-muted);line-height:1.5}

@media(max-width:768px){
  .guides-hero{padding:120px 0 40px}
  .guides-hero h1{font-size:36px}
  .guide-item{padding:14px 16px}
  .guide-item-info h3{font-size:14px}
}
@media(max-width:480px){
  .guides-hero h1{font-size:28px}
}

/* ===== FAQ PAGE ===== */
.faq-page-hero{padding:160px 0 60px;text-align:center;position:relative;overflow:hidden}
.faq-page-hero::before{content:'';position:absolute;top:-200px;left:50%;transform:translateX(-50%);width:800px;height:600px;background:radial-gradient(ellipse,rgba(108,92,231,.15),transparent 70%);pointer-events:none}
.faq-page-hero .badge{display:inline-block;padding:8px 20px;border-radius:100px;background:rgba(108,92,231,.1);border:1px solid rgba(108,92,231,.2);color:var(--accent3);font-size:13px;font-weight:600;margin-bottom:20px}
.faq-page-hero h1{font-size:52px;font-weight:800;line-height:1.15;letter-spacing:-.02em;margin-bottom:20px}
.faq-page-hero-text{font-size:17px;color:var(--text-muted);line-height:1.7;max-width:640px;margin:0 auto}

.faq-page-section{padding:60px 0 0}
.faq-page-category{margin-bottom:48px}
.faq-page-category-header{display:flex;align-items:center;gap:14px;margin-bottom:20px}
.faq-page-category-icon{width:44px;height:44px;border-radius:12px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.faq-page-category-header h2{font-size:22px;font-weight:800}

.faq-page-contact{padding:60px 0 0}
.faq-contact-box{text-align:center;padding:48px 32px;background:var(--card);border:1px solid var(--card-border);border-radius:var(--radius-lg);max-width:520px;margin:0 auto}
.faq-contact-box svg{margin-bottom:16px}
.faq-contact-box h3{font-size:20px;font-weight:800;margin-bottom:8px}
.faq-contact-box p{font-size:14px;color:var(--text-muted);margin-bottom:24px;line-height:1.6}

@media(max-width:768px){
  .faq-page-hero{padding:120px 0 40px}
  .faq-page-hero h1{font-size:36px}
  .faq-contact-box{padding:32px 20px}
}
@media(max-width:480px){
  .faq-page-hero h1{font-size:28px}
}

/* ===== PRICING PAGE ===== */
.pricing-page-hero{padding:160px 0 40px;text-align:center;position:relative;overflow:hidden}
.pricing-page-hero::before{content:'';position:absolute;top:-200px;left:50%;transform:translateX(-50%);width:800px;height:600px;background:radial-gradient(ellipse,rgba(108,92,231,.15),transparent 70%);pointer-events:none}
.pricing-page-hero .badge{display:inline-block;padding:8px 20px;border-radius:100px;background:rgba(108,92,231,.1);border:1px solid rgba(108,92,231,.2);color:var(--accent3);font-size:13px;font-weight:600;margin-bottom:20px}
.pricing-page-hero h1{font-size:52px;font-weight:800;line-height:1.15;letter-spacing:-.02em;margin-bottom:20px}
.pricing-page-hero-text{font-size:17px;color:var(--text-muted);line-height:1.7;max-width:640px;margin:0 auto}

.comparison-section{padding:80px 0}
.comparison-title{text-align:center;font-size:36px;font-weight:800;margin-bottom:48px}
.comparison-table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.comparison-table{width:100%;border-collapse:collapse;min-width:700px}
.comparison-table th,.comparison-table td{padding:14px 16px;text-align:center;font-size:14px;border-bottom:1px solid var(--card-border)}
.comparison-table th{font-weight:700;font-size:13px;text-transform:uppercase;letter-spacing:.5px;color:var(--text-muted);padding:16px;background:var(--bg2);position:sticky;top:0}
.comparison-table th.highlight{color:var(--accent3)}
.comparison-table td:first-child{text-align:left;font-weight:600;color:var(--text)}
.comparison-table td.highlight{background:rgba(108,92,231,.03)}
.comparison-table .category-row td{font-weight:800;font-size:12px;text-transform:uppercase;letter-spacing:1px;color:var(--accent3);background:var(--bg3);padding:10px 16px;border-bottom:1px solid var(--card-border)}
.comparison-table .check{color:var(--success);font-size:16px;font-weight:700}
.comparison-table .cross{color:var(--text-dim);font-size:16px}
.comparison-table tbody tr:hover{background:rgba(108,92,231,.02)}

.payment-methods-section{padding:0 0 40px}
.payment-methods-box{text-align:center;padding:40px 32px;background:var(--card);border:1px solid var(--card-border);border-radius:var(--radius-lg);max-width:600px;margin:0 auto}
.payment-methods-box h3{font-size:18px;font-weight:800;margin-bottom:8px}
.payment-methods-box p{font-size:14px;color:var(--text-muted);margin-bottom:20px}
.payment-crypto-icons{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
.crypto-badge{padding:6px 14px;border-radius:8px;background:var(--bg3);border:1px solid var(--card-border);font-size:13px;font-weight:700;color:var(--text-muted)}

@media(max-width:768px){
  .pricing-page-hero{padding:120px 0 20px}
  .pricing-page-hero h1{font-size:36px}
  .comparison-title{font-size:30px}
  .payment-methods-box{padding:28px 20px}
}
@media(max-width:480px){
  .pricing-page-hero h1{font-size:28px}
}

/* ===== AUTH MODAL ===== */
.auth-overlay{display:none;position:fixed;inset:0;z-index:200;background:rgba(0,0,0,.7);backdrop-filter:blur(8px);align-items:center;justify-content:center}
.auth-overlay.active{display:flex}
.auth-modal{background:var(--bg2);border:1px solid var(--card-border);border-radius:var(--radius-lg);padding:36px;width:calc(100% - 32px);max-width:420px;position:relative;max-height:90vh;overflow-y:auto}
.auth-close{position:absolute;top:14px;right:16px;background:none;border:none;color:var(--text-muted);font-size:24px;cursor:pointer;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:8px;transition:all .2s}
.auth-close:hover{background:var(--bg3);color:#fff}

/* Auth Tabs */
.auth-tabs{display:flex;gap:4px;margin-bottom:24px;background:var(--bg);border-radius:10px;padding:4px}
.auth-tab{flex:1;padding:10px;border:none;border-radius:8px;background:transparent;color:var(--text-muted);font-weight:600;font-size:14px;cursor:pointer;font-family:var(--font);transition:all .2s}
.auth-tab.active{background:var(--accent);color:#fff}
.auth-tab:hover:not(.active){color:#fff}

/* Form Elements */
.auth-form .form-group{margin-bottom:16px}
.auth-form label{display:block;font-size:13px;font-weight:600;margin-bottom:6px;color:var(--text-muted)}
.auth-form input{width:100%;padding:12px 14px;border-radius:10px;border:1px solid var(--card-border);background:var(--bg);color:var(--text);font-size:14px;font-family:var(--font);outline:none;transition:border-color .2s}
.auth-form input:focus{border-color:var(--accent)}
.auth-form input::placeholder{color:var(--text-dim)}

/* Error / Success */
.auth-error{background:rgba(239,68,68,.1);border:1px solid rgba(239,68,68,.3);color:#ef4444;padding:10px 14px;border-radius:8px;font-size:13px;margin-bottom:16px;display:none}
.auth-error.show{display:block}
.auth-success{background:rgba(34,197,94,.1);border:1px solid rgba(34,197,94,.3);color:#22c55e;padding:10px 14px;border-radius:8px;font-size:13px;margin-bottom:16px;display:none}
.auth-success.show{display:block}

/* Forgot Password */
.auth-forgot-row{display:flex;justify-content:flex-end;margin-bottom:16px}
.auth-forgot-row button{background:none;border:none;color:var(--accent3);font-size:13px;cursor:pointer;font-family:var(--font)}
.auth-forgot-row button:hover{text-decoration:underline}

/* Divider */
.auth-divider{display:flex;align-items:center;gap:16px;margin:20px 0;color:var(--text-dim);font-size:12px}
.auth-divider::before,.auth-divider::after{content:'';flex:1;height:1px;background:var(--card-border)}

/* Google Button */
.auth-google-btn{width:100%;padding:12px;border-radius:10px;border:1px solid var(--card-border);background:var(--bg);color:var(--text);font-size:14px;font-weight:500;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:10px;font-family:var(--font);transition:all .2s}
.auth-google-btn:hover{border-color:var(--accent);background:var(--bg3)}

/* Back Link */
.auth-back-link{display:flex;align-items:center;gap:6px;background:none;border:none;color:var(--text-muted);font-size:13px;cursor:pointer;margin-top:16px;font-family:var(--font)}
.auth-back-link:hover{color:var(--accent3)}

/* OTP Verify */
.verify-header{text-align:center;margin-bottom:24px}
.verify-header svg{margin:0 auto 12px}
.verify-header h3{font-size:20px;font-weight:700;margin-bottom:8px}
.verify-header p{color:var(--text-muted);font-size:14px;line-height:1.5}
.verify-header strong{color:#fff}
.verify-code-inputs{display:flex;gap:8px;justify-content:center;margin-bottom:24px}
.verify-code-input{width:48px;height:56px;text-align:center;font-size:24px;font-weight:700;border-radius:10px;border:1px solid var(--card-border);background:var(--bg);color:#fff;outline:none;font-family:var(--font);transition:border-color .2s}
.verify-code-input:focus{border-color:var(--accent)}
.verify-timer-row{text-align:center;margin-top:16px;font-size:13px;color:var(--text-muted)}
.verify-timer-row strong{color:var(--accent3)}
.auth-resend-btn{background:none;border:none;color:var(--accent3);font-size:13px;font-weight:600;cursor:pointer;font-family:var(--font)}
.auth-resend-btn:hover{text-decoration:underline}

/* User Info in Navbar */
.user-info{position:relative;display:flex;align-items:center}
.user-avatar{width:36px;height:36px;border-radius:50%;background:var(--accent);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:15px;color:#fff;overflow:hidden;flex-shrink:0;cursor:pointer;transition:box-shadow .2s;border:2px solid transparent}
.user-avatar:hover,.user-info.open .user-avatar{border-color:var(--accent);box-shadow:0 0 0 3px rgba(66,133,244,.25)}
.user-dropdown{display:none;position:absolute;top:calc(100% + 8px);right:0;width:240px;background:var(--bg2);border:1px solid var(--card-border);border-radius:var(--radius);padding:8px;box-shadow:0 8px 32px rgba(0,0,0,.4);z-index:100}
.user-info.open .user-dropdown{display:block}
.user-dropdown-header{display:flex;align-items:center;gap:12px;padding:10px 12px}
.user-dropdown-avatar{width:40px;height:40px;border-radius:50%;background:var(--accent);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:16px;color:#fff;overflow:hidden;flex-shrink:0}
.user-dropdown-email{font-size:13px;color:var(--text-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0}
.user-dropdown-divider{height:1px;background:var(--card-border);margin:4px 0}
.user-dropdown-item{display:flex;align-items:center;gap:10px;width:100%;padding:10px 12px;border:none;background:none;color:var(--text);font-size:14px;font-family:var(--font);cursor:pointer;border-radius:8px;transition:background .15s;text-decoration:none}
.user-dropdown-item:hover{background:var(--bg3)}
.user-dropdown-item svg{color:var(--text-muted);flex-shrink:0}
.user-dropdown-logout{color:#ef4444}
.user-dropdown-logout svg{color:#ef4444}

/* Mobile-only nav item */
.mobile-only{display:none}
@media(max-width:768px){
  .mobile-only{display:block}
  .verify-code-input{width:40px;height:48px;font-size:20px}
  .auth-modal{padding:28px 20px}
}

/* ===== PAYMENT MODAL ===== */
.payment-overlay{display:none;position:fixed;inset:0;z-index:200;background:rgba(0,0,0,.7);backdrop-filter:blur(8px);align-items:center;justify-content:center}
.payment-overlay.active{display:flex}
.payment-modal{background:var(--bg2);border:1px solid var(--card-border);border-radius:var(--radius-lg);padding:36px;width:calc(100% - 32px);max-width:460px;position:relative}
.payment-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px}
.payment-header h3{font-size:20px;font-weight:700}
.payment-summary{text-align:center;padding:24px;background:var(--bg3);border-radius:var(--radius);border:1px solid var(--card-border);margin-bottom:24px}
.payment-plan-name{font-size:22px;font-weight:800;margin-bottom:4px}
.payment-plan-detail{font-size:13px;color:var(--text-muted);margin-bottom:16px}
.payment-price{font-size:36px;font-weight:800}
.payment-price span{font-size:16px;font-weight:400;color:var(--text-muted)}
.payment-total{font-size:14px;color:var(--accent3);font-weight:600;margin-top:8px}
.payment-status-area{text-align:center;padding:16px 0}
.payment-spinner{width:32px;height:32px;border:3px solid var(--card-border);border-top-color:var(--accent);border-radius:50%;animation:spin 1s linear infinite;margin:0 auto 12px}
@keyframes spin{to{transform:rotate(360deg)}}
.payment-status-area p{font-size:14px;color:var(--text-muted);margin-bottom:8px}
.payment-open-btn{margin-bottom:24px;font-size:15px;padding:14px 24px}
.payment-waiting{margin-top:4px}
.payment-hint{font-size:12px;color:var(--text-dim);line-height:1.6;margin-top:8px}
.payment-error-msg{background:rgba(239,68,68,.1);border:1px solid rgba(239,68,68,.3);color:#ef4444;padding:14px;border-radius:8px;font-size:14px}
.payment-success{display:flex;flex-direction:column;align-items:center;gap:12px}
.payment-success h3{font-size:20px;font-weight:700;color:#22c55e}
.payment-success p{font-size:14px;color:var(--text-muted)}
.payment-success strong{color:#fff}
.payment-success .btn{margin-top:8px}
.btn-disabled{opacity:.5;pointer-events:none}
@media(max-width:768px){
  .payment-modal{padding:28px 20px}
}

/* ===== SETTINGS MODAL ===== */
.settings-overlay{display:none;position:fixed;inset:0;z-index:200;background:rgba(0,0,0,.7);backdrop-filter:blur(8px);align-items:center;justify-content:center}
.settings-overlay.active{display:flex}
.settings-modal{background:var(--bg2);border:1px solid var(--card-border);border-radius:var(--radius-lg);padding:36px;width:calc(100% - 32px);max-width:520px;position:relative;max-height:90vh;overflow-y:auto}
.settings-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:28px}
.settings-title{display:flex;align-items:center;gap:10px;font-size:16px;font-weight:800;letter-spacing:1.5px;color:#fff}
.settings-title svg{color:var(--text-muted)}
.settings-field{margin-bottom:16px}
.settings-label{display:block;font-size:11px;font-weight:700;letter-spacing:1px;color:var(--accent);margin-bottom:6px}
.settings-input{width:100%;padding:12px 14px;background:var(--bg);border:1px solid var(--card-border);border-radius:8px;color:#fff;font-size:14px;font-family:var(--font);outline:none;transition:border-color .2s;box-sizing:border-box}
.settings-input:focus{border-color:var(--accent)}
.settings-input[readonly]{color:var(--text-muted);cursor:default}
.settings-name-row{display:flex;gap:12px;align-items:flex-end}
.settings-name-input{flex:1}
.settings-save-btn{height:44px;padding:0 24px;font-size:14px;white-space:nowrap}
.settings-plan-row{display:flex;align-items:center;gap:12px;padding:12px 14px;background:var(--bg);border:1px solid var(--card-border);border-radius:8px;font-size:14px;color:#fff;font-weight:600}
.settings-upgrade-btn{display:inline-flex;align-items:center;gap:6px;padding:6px 14px;background:var(--accent);color:#fff;font-size:12px;font-weight:600;border-radius:6px;text-decoration:none;transition:opacity .2s}
.settings-upgrade-btn:hover{opacity:.85}
.settings-divider{height:1px;background:var(--card-border);margin:24px 0}
.settings-section-title{font-size:13px;font-weight:800;letter-spacing:1px;color:#fff;margin-bottom:6px}
.settings-section-desc{font-size:12px;color:var(--text-muted);margin-bottom:16px}
.settings-change-btn{padding:10px 28px;font-size:14px}
.settings-msg{margin-top:16px;padding:10px 14px;border-radius:8px;font-size:13px;display:none}
.settings-msg.error{display:block;background:rgba(239,68,68,.1);border:1px solid rgba(239,68,68,.3);color:#ef4444}
.settings-msg.success{display:block;background:rgba(34,197,94,.1);border:1px solid rgba(34,197,94,.3);color:#22c55e}
@media(max-width:768px){
  .settings-modal{padding:28px 20px}
}

/* ===== FEATURES PAGE ===== */
.features-page-hero{position:relative;padding:160px 0 80px;text-align:center;overflow:hidden}
.features-hero-glow{position:absolute;top:-200px;left:50%;transform:translateX(-50%);width:800px;height:600px;background:radial-gradient(ellipse,rgba(108,92,231,.15),transparent 70%);pointer-events:none}
.features-page-hero .section-tag{margin-bottom:16px}
.features-page-hero h1{font-size:48px;font-weight:800;line-height:1.15;margin-bottom:20px}
.features-page-hero p{font-size:17px;color:var(--text-muted);max-width:600px;margin:0 auto;line-height:1.7}

/* Scores */
.features-scores{padding:40px 0 80px}
.scores-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.score-card{text-align:center;padding:32px 20px;background:var(--card);border:1px solid var(--card-border);border-radius:var(--radius-lg);transition:border-color .3s}
.score-card:hover{border-color:var(--accent)}
.score-icon{display:inline-flex;align-items:center;justify-content:center;width:56px;height:56px;border-radius:16px;background:rgba(108,92,231,.1);color:var(--accent);margin-bottom:16px}
.score-value{font-size:28px;font-weight:800;color:#fff;margin-bottom:4px}
.score-label{font-size:14px;color:var(--text-muted)}

/* Core features grid */
.features-core{padding:80px 0}
.features-page-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:48px}
.feature-page-card{padding:32px;background:var(--card);border:1px solid var(--card-border);border-radius:var(--radius-lg);transition:all .3s}
.feature-page-card:hover{border-color:var(--accent);transform:translateY(-4px);box-shadow:0 20px 40px rgba(0,0,0,.3)}
.feature-page-icon{display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:14px;background:rgba(108,92,231,.1);color:var(--icon-color,var(--accent));margin-bottom:20px}
.feature-page-card h3{font-size:18px;font-weight:700;margin-bottom:10px;color:#fff}
.feature-page-card p{font-size:14px;color:var(--text-muted);line-height:1.7}

/* Feature detail sections */
.feature-detail{padding:80px 0}
.feature-detail.alt{background:var(--bg2)}
.feature-detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}
.feature-detail-grid.reverse{direction:rtl}
.feature-detail-grid.reverse > *{direction:ltr}
.feature-detail-content .section-tag{margin-bottom:16px}
.feature-detail-content h2{font-size:36px;font-weight:800;line-height:1.2;margin-bottom:16px}
.feature-detail-content > p{font-size:16px;color:var(--text-muted);line-height:1.7;margin-bottom:24px}
.feature-detail-list{list-style:none;display:flex;flex-direction:column;gap:14px}
.feature-detail-list li{display:flex;align-items:center;gap:12px;font-size:15px;color:var(--text)}

/* Browser showcase */
.browser-showcase{background:var(--card);border:1px solid var(--card-border);border-radius:var(--radius-lg);padding:32px;display:flex;flex-direction:column;gap:16px}
.browser-item{display:flex;align-items:center;gap:16px;padding:14px 18px;border-radius:12px;background:var(--bg);border:1px solid var(--card-border);transition:all .3s;cursor:default}
.browser-item.active{border-color:var(--accent);background:rgba(108,92,231,.08)}
.browser-item:hover{border-color:var(--accent)}
.browser-icon-circle{width:44px;height:44px;border-radius:12px;display:flex;align-items:center;justify-content:center;overflow:hidden;flex-shrink:0}
.browser-icon-circle img{width:32px;height:32px;object-fit:contain}
.browser-item span{font-size:15px;font-weight:600;color:#fff}

/* Proxy showcase */
.proxy-showcase{background:var(--card);border:1px solid var(--card-border);border-radius:var(--radius-lg);padding:24px;display:flex;flex-direction:column;gap:12px}
.proxy-card-item{display:flex;align-items:center;gap:14px;padding:14px 16px;background:var(--bg);border:1px solid var(--card-border);border-radius:10px}
.proxy-protocol{padding:4px 12px;border-radius:6px;font-size:11px;font-weight:700;background:rgba(108,92,231,.15);color:var(--accent);letter-spacing:.5px}
.proxy-protocol.socks5{background:rgba(34,197,94,.15);color:#22c55e}
.proxy-protocol.socks4{background:rgba(245,158,11,.15);color:#f59e0b}
.proxy-info{display:flex;align-items:center;gap:10px;flex:1;font-size:14px;color:var(--text)}
.proxy-flag{font-size:18px}
.proxy-status{margin-left:auto;font-size:12px;font-weight:600;padding:3px 10px;border-radius:20px}
.proxy-status.online{color:#22c55e;background:rgba(34,197,94,.1)}
.proxy-status.checking{color:#f59e0b;background:rgba(245,158,11,.1)}

/* Batch showcase */
.batch-showcase{background:var(--card);border:1px solid var(--card-border);border-radius:var(--radius-lg);padding:24px;overflow:hidden}
.batch-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}
.batch-title{font-size:15px;font-weight:700;color:#fff}
.batch-count{font-size:13px;color:var(--accent)}
.batch-progress{height:6px;background:var(--bg3);border-radius:3px;margin-bottom:20px;overflow:hidden}
.batch-bar{height:100%;background:var(--gradient);border-radius:3px;transition:width .5s}
.batch-items{display:flex;flex-direction:column;gap:8px}
.batch-item{display:flex;align-items:center;gap:12px;padding:10px 14px;background:var(--bg);border:1px solid var(--card-border);border-radius:8px;font-size:13px;color:var(--text)}
.batch-item.done{opacity:.6}
.batch-item.active{border-color:var(--accent)}
.batch-dot{width:8px;height:8px;border-radius:50%;background:var(--card-border)}
.batch-dot.done{background:var(--success)}
.batch-dot.active{background:var(--accent);box-shadow:0 0 8px rgba(108,92,231,.5)}
.batch-tag{margin-left:auto;font-size:11px;color:var(--text-muted);background:var(--bg3);padding:2px 8px;border-radius:4px}
.batch-os-icon{width:18px;height:18px;object-fit:contain;flex-shrink:0;border-radius:3px}

/* Automation showcase */
.auto-showcase{background:var(--card);border:1px solid var(--card-border);border-radius:var(--radius-lg);padding:24px;display:flex;flex-direction:column;gap:10px}
.auto-script-row{display:flex;align-items:center;gap:14px;padding:14px 16px;background:var(--bg);border:1px solid var(--card-border);border-radius:10px;transition:border-color .3s}
.auto-script-row:hover{border-color:var(--accent)}
.auto-script-row.running{border-color:var(--success);background:rgba(34,197,94,.04)}
.auto-script-icon{width:32px;height:32px;border-radius:8px;background:rgba(108,92,231,.15);color:var(--accent);display:flex;align-items:center;justify-content:center;font-size:12px}
.auto-script-icon.running{background:rgba(34,197,94,.15);color:#22c55e}
.auto-script-logo{width:36px;height:36px;border-radius:10px;object-fit:contain;flex-shrink:0}
.auto-script-info{flex:1}
.auto-script-name{font-size:14px;font-weight:600;color:#fff}
.auto-script-plat{font-size:12px;color:var(--text-muted)}
.auto-script-badge{padding:3px 10px;border-radius:20px;font-size:11px;font-weight:600}
.auto-script-badge.ready{color:var(--accent);background:rgba(108,92,231,.1)}
.auto-script-badge.running{color:#22c55e;background:rgba(34,197,94,.1)}
.auto-script-badge.custom{color:#f59e0b;background:rgba(245,158,11,.1)}

/* More features */
.features-more{padding:80px 0}
.features-more-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:48px}
.feature-more-item{padding:24px;background:var(--card);border:1px solid var(--card-border);border-radius:var(--radius);transition:all .3s}
.feature-more-item:hover{border-color:var(--accent);transform:translateY(-2px)}
.feature-more-icon{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:10px;background:rgba(108,92,231,.1);color:var(--accent);margin-bottom:14px}
.feature-more-item h4{font-size:15px;font-weight:700;color:#fff;margin-bottom:8px}
.feature-more-item p{font-size:13px;color:var(--text-muted);line-height:1.6}

/* Features page responsive */
@media(max-width:1024px){
  .scores-grid{grid-template-columns:repeat(2,1fr)}
  .features-page-grid{grid-template-columns:repeat(2,1fr)}
  .feature-detail-grid,.feature-detail-grid.reverse{grid-template-columns:1fr;direction:ltr}
  .feature-detail-grid.reverse > *{direction:ltr}
  .features-more-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:768px){
  .features-page-hero{padding:130px 0 60px}
  .features-page-hero h1{font-size:32px}
  .scores-grid{grid-template-columns:1fr 1fr;gap:16px}
  .score-card{padding:24px 16px}
  .score-value{font-size:22px}
  .features-page-grid{grid-template-columns:1fr}
  .feature-detail-content h2{font-size:28px}
  .features-more-grid{grid-template-columns:1fr}
}

/* ===== AUTOMATION PAGE ===== */
.auto-page-hero{position:relative;padding:160px 0 80px;text-align:center;overflow:hidden}
.auto-hero-glow{position:absolute;top:-200px;left:50%;transform:translateX(-50%);width:800px;height:600px;background:radial-gradient(ellipse,rgba(108,92,231,.12),transparent 70%);pointer-events:none}
.auto-page-hero h1{font-size:52px;font-weight:800;line-height:1.1;margin-bottom:20px}
.auto-page-hero p{font-size:18px;color:var(--text-muted);max-width:600px;margin:0 auto 40px}

.auto-hero-stats{display:flex;align-items:center;justify-content:center;gap:32px;margin-top:40px}
.auto-hero-stat{display:flex;flex-direction:column;align-items:center;gap:4px}
.auto-hero-stat-num{font-size:36px;font-weight:800;background:var(--gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.auto-hero-stat-label{font-size:14px;color:var(--text-muted);font-weight:500}
.auto-hero-stat-divider{width:1px;height:48px;background:var(--card-border)}

/* Supported Platforms Grid */
.auto-platforms{padding:80px 0}
.auto-platforms-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:48px}
.auto-platform-card{background:var(--card);border:1px solid var(--card-border);border-radius:var(--radius-lg);padding:32px;text-align:center;transition:all .3s}
.auto-platform-card:hover{border-color:var(--accent);transform:translateY(-4px)}
.auto-platform-card img{width:48px;height:48px;object-fit:contain;margin:0 auto 16px;border-radius:10px}
.auto-platform-card h3{font-size:18px;font-weight:700;color:#fff;margin-bottom:8px}
.auto-platform-card > p{font-size:13px;color:var(--text-muted);margin-bottom:16px;line-height:1.5}
.auto-platform-scripts{display:flex;flex-wrap:wrap;justify-content:center;gap:8px}
.auto-platform-scripts span{padding:4px 12px;border-radius:20px;font-size:12px;font-weight:500;color:var(--accent);background:rgba(108,92,231,.1);border:1px solid rgba(108,92,231,.15)}

/* Methods Section */
.auto-methods{padding:80px 0}
.auto-method-block{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center;margin-top:64px}
.auto-method-block.reverse{direction:rtl}
.auto-method-block.reverse > *{direction:ltr}
.auto-method-number{font-size:48px;font-weight:800;background:var(--gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:12px;line-height:1}
.auto-method-content h3{font-size:28px;font-weight:700;color:#fff;margin-bottom:16px}
.auto-method-content p{font-size:15px;color:var(--text-muted);line-height:1.7;margin-bottom:24px}
.auto-method-block + .auto-method-block{margin-top:100px}

/* Ready Scripts Demo Card */
.script-card-demo{background:var(--card);border:1px solid var(--card-border);border-radius:var(--radius-lg);padding:24px;overflow:hidden}
.script-demo-header{display:flex;align-items:center;gap:12px;margin-bottom:20px}
.script-demo-header > div{flex:1}
.script-demo-name{font-size:15px;font-weight:700;color:#fff}
.script-demo-plat{font-size:12px;color:var(--text-muted)}
.script-demo-steps{display:flex;flex-direction:column;gap:10px;margin-bottom:20px}
.script-demo-step{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--text-muted);padding:8px 12px;border-radius:8px;background:var(--bg)}
.script-demo-step.done{color:var(--success)}
.script-demo-step.active{color:var(--accent);background:rgba(108,92,231,.06);border:1px solid rgba(108,92,231,.15)}
.script-demo-params{display:flex;flex-direction:column;gap:8px;padding:16px;background:var(--bg);border-radius:var(--radius);border:1px solid var(--card-border)}
.script-demo-param{display:flex;justify-content:space-between;align-items:center;font-size:13px}
.script-demo-param-label{color:var(--text-muted);font-weight:500}
.script-demo-param-value{color:var(--accent);font-weight:600}

/* Parameterized Demo */
.params-demo{background:var(--card);border:1px solid var(--card-border);border-radius:var(--radius-lg);overflow:hidden}
.params-demo-header{padding:16px 20px;font-size:14px;font-weight:700;color:#fff;border-bottom:1px solid var(--card-border);background:var(--bg3)}
.params-demo-rows{padding:8px}
.params-demo-row{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-radius:8px;transition:background .2s}
.params-demo-row:hover{background:var(--bg)}
.params-label{font-family:'Fira Code','SF Mono',monospace;font-size:13px;color:var(--accent);font-weight:500}
.params-value{font-size:13px;color:var(--text-muted)}

/* Code Demo */
.code-demo{background:var(--card);border:1px solid var(--card-border);border-radius:var(--radius-lg);overflow:hidden}
.code-demo-bar{display:flex;align-items:center;gap:8px;padding:12px 16px;background:var(--bg3);border-bottom:1px solid var(--card-border)}
.code-dot{width:10px;height:10px;border-radius:50%}
.code-dot.red{background:#ef4444}
.code-dot.yellow{background:#f59e0b}
.code-dot.green{background:#22c55e}
.code-demo-title{margin-left:12px;font-size:12px;color:var(--text-muted);font-weight:500}
.code-demo-body{padding:20px;margin:0;font-family:'Fira Code','SF Mono',monospace;font-size:13px;line-height:1.8;color:var(--text);overflow-x:auto}
.code-demo-body code{font-family:inherit}
.code-kw{color:#c084fc}
.code-fn{color:#6c5ce7}
.code-str{color:#22c55e}
.code-cm{color:var(--text-dim);font-style:italic}

/* Multi-Profile Execution */
.auto-multi{padding:80px 0}
.auto-multi-grid{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
.auto-multi-content h2{font-size:36px;font-weight:800;line-height:1.15;margin-bottom:20px}
.auto-multi-content p{font-size:15px;color:var(--text-muted);line-height:1.7;margin-bottom:24px}

.multi-demo{background:var(--card);border:1px solid var(--card-border);border-radius:var(--radius-lg);padding:16px;display:flex;flex-direction:column;gap:8px}
.multi-demo-row{display:flex;align-items:center;gap:12px;padding:12px 16px;background:var(--bg);border:1px solid var(--card-border);border-radius:10px;font-size:13px;transition:all .3s}
.multi-demo-row.running{border-color:rgba(34,197,94,.3);background:rgba(34,197,94,.03)}
.multi-demo-row.done{opacity:.6}
.multi-demo-row.queued{opacity:.7}
.multi-demo-name{font-weight:600;color:#fff;min-width:120px}
.multi-demo-script{flex:1;color:var(--text-muted)}
.multi-demo-status{padding:3px 10px;border-radius:20px;font-size:11px;font-weight:600}
.multi-demo-status.running{color:#22c55e;background:rgba(34,197,94,.1)}
.multi-demo-status.done{color:var(--text-muted);background:var(--bg3)}
.multi-demo-status.queued{color:#f59e0b;background:rgba(245,158,11,.1)}

/* Automation page responsive */
@media(max-width:1024px){
  .auto-platforms-grid{grid-template-columns:repeat(2,1fr)}
  .auto-method-block,.auto-method-block.reverse{grid-template-columns:1fr;direction:ltr}
  .auto-method-block.reverse > *{direction:ltr}
  .auto-multi-grid{grid-template-columns:1fr}
}
@media(max-width:768px){
  .auto-page-hero{padding:130px 0 60px}
  .auto-page-hero h1{font-size:32px}
  .auto-hero-stats{flex-direction:column;gap:16px}
  .auto-hero-stat-divider{width:48px;height:1px}
  .auto-hero-stat-num{font-size:28px}
  .auto-platforms-grid{grid-template-columns:1fr}
  .auto-method-number{font-size:36px}
  .auto-method-content h3{font-size:22px}
  .auto-multi-content h2{font-size:28px}
  .multi-demo-row{flex-wrap:wrap;gap:8px}
  .multi-demo-name{min-width:auto}
  .multi-demo-script{min-width:100%;order:3}
}

/* ===== LEGAL PAGES ===== */
.legal-hero{padding:160px 0 60px;text-align:center;position:relative;overflow:hidden}
.legal-hero::before{content:'';position:absolute;top:-200px;left:50%;transform:translateX(-50%);width:800px;height:600px;background:radial-gradient(ellipse,rgba(108,92,231,.15),transparent 70%);pointer-events:none}
.legal-hero .badge{display:inline-block;padding:8px 20px;border-radius:100px;background:rgba(108,92,231,.1);border:1px solid rgba(108,92,231,.2);color:var(--accent3);font-size:13px;font-weight:600;margin-bottom:20px}
.legal-hero h1{font-size:52px;font-weight:800;line-height:1.15;letter-spacing:-.02em;margin-bottom:16px}
.legal-hero-text{font-size:15px;color:var(--text-muted)}

.legal-content{padding:60px 0 100px}
.legal-body{max-width:760px;margin:0 auto}
.legal-section{margin-bottom:48px}
.legal-section h2{font-size:22px;font-weight:800;color:#fff;margin-bottom:16px;padding-bottom:12px;border-bottom:1px solid var(--card-border)}
.legal-section h3{font-size:17px;font-weight:700;color:var(--accent3);margin:20px 0 10px}
.legal-section p{font-size:15px;color:var(--text-muted);line-height:1.8;margin-bottom:12px}
.legal-section ul,.legal-section ol{list-style:none;display:flex;flex-direction:column;gap:8px;margin-bottom:16px;padding-left:0}
.legal-section li{font-size:14px;color:var(--text-muted);line-height:1.7;padding-left:24px;position:relative}
.legal-section ul li::before{content:'';position:absolute;left:0;top:8px;width:8px;height:8px;border-radius:50%;background:rgba(108,92,231,.3);border:2px solid var(--accent)}
.legal-section ol{counter-reset:legal-counter}
.legal-section ol li{counter-increment:legal-counter}
.legal-section ol li::before{content:counter(legal-counter);position:absolute;left:0;top:0;width:20px;height:20px;border-radius:50%;background:rgba(108,92,231,.1);color:var(--accent);font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center}
.legal-section li strong{color:var(--text)}

@media(max-width:768px){
  .legal-hero{padding:120px 0 40px}
  .legal-hero h1{font-size:36px}
  .legal-section h2{font-size:20px}
}
@media(max-width:480px){
  .legal-hero h1{font-size:28px}
}

