:root{--bg-dark:#0a0a0c;--bg-card:#151518;--bg-card-hover:#1c1c20;--text-primary:#ffffff;--text-secondary:#a0a0a5;--accent-red:#f93845;--accent-red-hover:#ff4d5a;--accent-cyan:#78e8d5;--border-color:rgba(255, 255, 255, 0.08);--glass-bg:rgba(21, 21, 24, 0.6);--glass-border:rgba(255, 255, 255, 0.05)}*{margin:0;padding:0;box-sizing:border-box}body{font-family:'Inter',sans-serif;background-color:var(--bg-dark);color:var(--text-primary);line-height:1.6;overflow-x:hidden}h1,h2,h3,h4{font-family:'Outfit',sans-serif}a{text-decoration:none;color:inherit}.gradient-text{background:linear-gradient(135deg,var(--accent-red),var(--accent-cyan));-webkit-background-clip:text;-webkit-text-fill-color:#fff0;background-clip:text}.navbar{display:flex;justify-content:space-between;align-items:center;padding:1.5rem 5%;position:fixed;top:0;width:100%;z-index:100;background:var(--glass-bg);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--glass-border)}.logo{display:flex;align-items:center;gap:.5rem;font-family:'Outfit',sans-serif;font-weight:900;font-size:1.5rem;letter-spacing:-.5px}.logo span{font-weight:400;color:var(--text-secondary)}.logo-icon{display:flex;align-items:center;justify-content:center}.custom-logo{width:44px;height:36px;display:block;filter:drop-shadow(0 2px 4px rgb(0 0 0 / .2))}.mockup-size{width:54px;height:45px;margin:0 auto}.nav-links{display:flex;gap:2rem}.nav-links a{color:var(--text-secondary);font-weight:600;font-size:.9rem;transition:color 0.3s ease}.nav-links a:hover{color:var(--text-primary)}.cta-button-small{background:var(--accent-red);color:#fff;padding:.6rem 1.2rem;border-radius:8px;font-weight:600;font-size:.9rem;transition:all 0.3s ease}.cta-button-small:hover{background:var(--accent-red-hover);transform:translateY(-2px);box-shadow:0 4px 15px rgb(249 56 69 / .3)}.hero{min-height:100vh;display:flex;align-items:center;justify-content:space-between;padding:8rem 5% 4rem;position:relative;overflow:hidden}.hero-content{flex:1;max-width:600px;z-index:10}.badge{display:inline-block;padding:.4rem 1rem;background:rgb(249 56 69 / .1);color:var(--accent-red);border:1px solid rgb(249 56 69 / .2);border-radius:20px;font-size:.85rem;font-weight:600;margin-bottom:1.5rem}.hero h1{font-size:4.5rem;line-height:1.1;margin-bottom:1.5rem;letter-spacing:-1px}.hero p{font-size:1.1rem;color:var(--text-secondary);margin-bottom:2.5rem;max-width:500px}.hero-buttons{display:flex;gap:1rem;margin-bottom:4rem}.cta-button{background:var(--accent-red);color:#fff;padding:1rem 2rem;border-radius:12px;font-weight:600;font-size:1rem;display:flex;align-items:center;gap:.5rem;transition:all 0.3s ease;box-shadow:0 8px 25px rgb(249 56 69 / .25)}.cta-button:hover{background:var(--accent-red-hover);transform:translateY(-3px);box-shadow:0 12px 30px rgb(249 56 69 / .4)}.cta-button-large{background:var(--accent-red);color:#fff;padding:1.2rem 3rem;border-radius:12px;font-weight:600;font-size:1.2rem;display:inline-flex;align-items:center;gap:.8rem;transition:all 0.3s ease;box-shadow:0 8px 25px rgb(249 56 69 / .25)}.cta-button-large:hover{background:var(--accent-red-hover);transform:translateY(-3px);box-shadow:0 12px 30px rgb(249 56 69 / .4)}.secondary-button{background:var(--bg-card);color:var(--text-primary);padding:1rem 2rem;border-radius:12px;font-weight:600;font-size:1rem;border:1px solid var(--border-color);transition:all 0.3s ease}.secondary-button:hover{background:var(--bg-card-hover);border-color:rgb(255 255 255 / .2)}.stats{display:flex;gap:3rem}.stat-item h3{font-size:2rem;color:var(--accent-cyan);margin-bottom:.2rem}.stat-item span{font-size:.85rem;color:var(--text-secondary);font-weight:600;text-transform:uppercase;letter-spacing:1px}.hero-visual{flex:1;position:relative;display:flex;justify-content:flex-end;align-items:center;z-index:5}.app-mockup{width:100%;max-width:650px;height:450px;background:var(--bg-card);border-radius:16px;border:1px solid var(--border-color);box-shadow:0 25px 50px rgb(0 0 0 / .5);display:flex;overflow:hidden;position:relative;z-index:10;transform:perspective(1000px) rotateY(-5deg) rotateX(5deg);transition:transform 0.5s ease}.app-mockup:hover{transform:perspective(1000px) rotateY(0deg) rotateX(0deg)}.mockup-sidebar{width:220px;background:#111113;border-right:1px solid var(--border-color);padding:1.5rem;display:flex;flex-direction:column;gap:1rem}.mockup-logo{color:var(--accent-cyan);font-size:2rem;margin-bottom:1rem;text-align:center}.mockup-menu-item{padding:.8rem 1rem;border-radius:8px;color:var(--text-secondary);font-size:.9rem;display:flex;align-items:center;gap:.8rem;transition:all 0.2s ease}.mockup-menu-item.active{background:rgb(255 255 255 / .05);color:var(--text-primary)}.mockup-content{flex:1;padding:2rem}.mockup-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem}.mockup-header h2{font-size:1.5rem}.status-badge{padding:.4rem .8rem;border-radius:20px;font-size:.8rem;font-weight:600}.optimization-good{background:rgb(120 232 213 / .1);color:var(--accent-cyan);border:1px solid rgb(120 232 213 / .2)}.mockup-cards{display:flex;flex-direction:column;gap:1rem}.mockup-card{background:#18181c;padding:1.5rem;border-radius:12px;border:1px solid var(--border-color)}.mockup-card span{display:block;margin-bottom:.8rem;font-size:.9rem;color:var(--text-secondary)}.progress-bar{width:100%;height:6px;background:rgb(255 255 255 / .1);border-radius:3px;overflow:hidden}.progress{height:100%;background:var(--accent-cyan);border-radius:3px}.mockup-card.highlight{background:linear-gradient(135deg,rgb(249 56 69 / .1),transparent);border-color:rgb(249 56 69 / .3);display:flex;align-items:center;gap:1rem}.mockup-card.highlight i{font-size:1.5rem;color:var(--accent-red)}.mockup-card.highlight span{margin:0;color:var(--text-primary);font-weight:600;font-size:1.1rem}.glow-effect{position:absolute;width:400px;height:400px;background:var(--accent-red);border-radius:50%;filter:blur(100px);opacity:.15;z-index:1;top:50%;left:50%;transform:translate(-50%,-50%)}.glow-effect.cyan{background:var(--accent-cyan);top:20%;left:80%;opacity:.1}.features-section{padding:6rem 5%;position:relative}.section-header{text-align:center;margin-bottom:4rem}.section-header h2{font-size:3rem;margin-bottom:1rem}.section-header p{color:var(--text-secondary);font-size:1.1rem}.features-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2rem}.feature-card{background:var(--bg-card);border:1px solid var(--border-color);padding:2.5rem 2rem;border-radius:16px;transition:all 0.3s ease;opacity:0;transform:translateY(30px)}.feature-card.visible{opacity:1;transform:translateY(0)}.feature-card:hover{transform:translateY(-5px);border-color:rgb(255 255 255 / .15);background:var(--bg-card-hover);box-shadow:0 10px 30px rgb(0 0 0 / .2)}.feature-icon{width:50px;height:50px;background:rgb(255 255 255 / .05);border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:1.5rem;color:var(--accent-cyan);margin-bottom:1.5rem}.feature-card h3{font-size:1.3rem;margin-bottom:1rem}.feature-card p{color:var(--text-secondary);font-size:.95rem}.tiers-section{padding:6rem 5%;position:relative;background:linear-gradient(180deg,var(--bg-dark) 0%,rgb(21 21 24 / .4) 100%)}.tiers-grid{display:flex;justify-content:center;gap:2rem;max-width:900px;margin:0 auto}.tier-card{flex:1;background:var(--bg-card);border:1px solid var(--border-color);border-radius:16px;padding:2.5rem;position:relative;transition:all 0.3s ease;display:flex;flex-direction:column}.tier-card:hover{transform:translateY(-5px);border-color:rgb(255 255 255 / .15);box-shadow:0 10px 30px rgb(0 0 0 / .2)}.tier-card.featured{background:linear-gradient(145deg,var(--bg-card),#1a1a1f);border-color:rgb(249 56 69 / .3);box-shadow:0 15px 35px rgb(249 56 69 / .1)}.tier-card.featured:hover{border-color:var(--accent-red);box-shadow:0 15px 35px rgb(249 56 69 / .2)}.featured-badge{position:absolute;top:-12px;left:50%;transform:translateX(-50%);background:var(--accent-red);color:#fff;padding:.4rem 1rem;border-radius:20px;font-size:.8rem;font-weight:600;letter-spacing:.5px;text-transform:uppercase;white-space:nowrap}.tier-header{margin-bottom:2rem;padding-bottom:2rem;border-bottom:1px solid var(--border-color)}.tier-header h3{font-size:1.5rem;color:var(--text-secondary);margin-bottom:.5rem}.tier-price{font-size:3rem;font-weight:800;color:var(--text-primary);font-family:'Outfit',sans-serif}.tier-price span{font-size:1rem;font-weight:400;color:var(--text-secondary)}.tier-features{list-style:none;margin-bottom:2.5rem;flex:1}.tier-features li{margin-bottom:1rem;display:flex;align-items:center;gap:.8rem;color:var(--text-secondary)}.tier-features li i{color:var(--accent-cyan);font-size:.9rem}.tier-btn{width:100%;text-align:center;justify-content:center}.community-section{padding:6rem 5%;text-align:center}.community-content{background:linear-gradient(180deg,var(--bg-card) 0%,transparent 100%);border:1px solid var(--border-color);border-radius:24px;padding:5rem 2rem;max-width:800px;margin:0 auto}.community-content h2{font-size:2.5rem;margin-bottom:1rem}.community-content p{color:var(--text-secondary);margin-bottom:2rem;font-size:1.1rem}.discord-button{background:#5865F2;color:#fff;padding:1rem 2.5rem;border-radius:12px;font-weight:600;font-size:1.1rem;display:inline-flex;align-items:center;gap:.8rem;transition:all 0.3s ease}.discord-button:hover{background:#4752C4;transform:translateY(-3px);box-shadow:0 10px 25px rgb(88 101 242 / .3)}footer{padding:3rem 5%;border-top:1px solid var(--border-color);background:#050506}.footer-content{display:flex;justify-content:space-between;align-items:center}.footer-logo{font-family:'Outfit',sans-serif;font-weight:900;font-size:1.2rem}.footer-logo span{font-weight:400;color:var(--text-secondary)}.copyright{color:var(--text-secondary);font-size:.9rem}.mobile-menu-btn{display:none;font-size:1.5rem;cursor:pointer;color:var(--text-primary);z-index:101}.mobile-only{display:none}@media (max-width:968px){.hero{flex-direction:column;text-align:center;padding-top:8rem}.hero-content{margin-bottom:4rem}.hero h1{font-size:3.5rem}.hero-buttons{justify-content:center}.stats{justify-content:center}.hero-visual{justify-content:center;width:100%}.nav-links{position:fixed;top:0;right:-100%;width:70%;height:100vh;background:var(--bg-dark);display:flex;flex-direction:column;align-items:center;justify-content:center;transition:right 0.3s ease;z-index:100;border-left:1px solid var(--border-color);box-shadow:-10px 0 30px rgb(0 0 0 / .5)}.nav-links.active{right:0}.nav-links a{font-size:1.2rem;margin:1rem 0}.mobile-menu-btn{display:block}.desktop-only{display:none}.mobile-only{display:block}.app-mockup{max-width:100%;transform:perspective(1000px) rotateY(0deg) rotateX(0deg)}}@media (max-width:768px){.hero h1{font-size:2.8rem}.hero-buttons{flex-direction:column}.stats{flex-wrap:wrap;gap:1.5rem}.tiers-grid{flex-direction:column}.app-mockup{flex-direction:column;height:auto}.mockup-sidebar{width:100%;border-right:none;border-bottom:1px solid var(--border-color);padding:1rem;flex-direction:row;overflow-x:auto;gap:.5rem}.mockup-sidebar::-webkit-scrollbar{height:4px}.mockup-sidebar::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:4px}.mockup-logo{display:none}.mockup-menu-item{white-space:nowrap;padding:.5rem .8rem}.mockup-content{padding:1.5rem}.mockup-header{flex-direction:column;gap:1rem;align-items:flex-start}}.benchmark-section{padding:6rem 5%;position:relative;background:linear-gradient(180deg,var(--bg-dark) 0%,rgb(21 21 24 / .4) 100%)}.benchmark-container{max-width:1000px;margin:0 auto;background:var(--bg-card);border:1px solid var(--border-color);border-radius:20px;padding:3rem;box-shadow:0 20px 40px rgb(0 0 0 / .4)}.benchmark-comparison{display:flex;justify-content:space-between;align-items:center;gap:2rem;margin-top:3rem}.benchmark-side{flex:1;padding:2rem;border-radius:16px;background:#111113;border:1px solid rgb(255 255 255 / .05)}.benchmark-side.before{opacity:.8}.benchmark-side.after{border-color:rgb(120 232 213 / .3);background:linear-gradient(180deg,#111113 0%,rgb(120 232 213 / .05) 100%);box-shadow:0 0 30px rgb(120 232 213 / .1);transform:scale(1.05)}.benchmark-side h3{text-align:center;font-size:1.5rem;margin-bottom:2rem;color:var(--text-secondary)}.benchmark-side.after h3{color:var(--accent-cyan);font-weight:800}.metric{margin-bottom:1.5rem}.metric-header{display:flex;justify-content:space-between;margin-bottom:.5rem;font-size:.95rem;color:var(--text-secondary)}.metric-value{font-weight:700;font-family:'Outfit',sans-serif;font-size:1.2rem}.benchmark-side.after .metric-value{color:#fff;text-shadow:0 0 10px rgb(120 232 213 / .5);font-size:1.4rem}.metric-bar-bg{width:100%;height:8px;background:rgb(255 255 255 / .1);border-radius:4px;overflow:hidden}.metric-bar-fill{height:100%;border-radius:4px;transition:width 1.5s cubic-bezier(.2,.8,.2,1)}.before .metric-bar-fill{background:var(--text-secondary)}.after .metric-bar-fill{background:var(--accent-cyan);box-shadow:0 0 10px var(--accent-cyan)}.vs-divider{display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:1.5rem;font-weight:900;color:var(--text-secondary);font-family:'Outfit',sans-serif}@media (max-width:768px){.benchmark-comparison{flex-direction:column}.benchmark-side.after{transform:scale(1)}}.benchmark-selector{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1.5rem;margin-bottom:2rem;padding:1.5rem;background:#111113;border-radius:12px;border:1px solid rgb(255 255 255 / .05)}.selector-group{display:flex;flex-direction:column;gap:.5rem}.selector-group label{font-size:.9rem;color:var(--text-secondary);font-weight:600;text-transform:uppercase;letter-spacing:.5px;margin-bottom:.2rem}.selector-group select{background:var(--bg-card);color:var(--text-primary);border:1px solid rgb(255 255 255 / .15);padding:1rem 1.5rem;border-radius:12px;font-family:'Inter',sans-serif;font-size:1rem;font-weight:500;outline:none;cursor:pointer;transition:all 0.3s ease;appearance:none;background-image:url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");background-repeat:no-repeat;background-position:right 1.2rem center;background-size:1.2em;box-shadow:0 4px 12px rgb(0 0 0 / .1)}.selector-group select:hover{background:var(--bg-card-hover);border-color:rgb(255 255 255 / .3);box-shadow:0 4px 15px rgb(0 0 0 / .2)}.selector-group select:focus{border-color:var(--accent-cyan);box-shadow:0 0 0 2px rgb(120 232 213 / .2)}
