@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Outfit:wght@400;500;600;700;800&display=swap";
:root{--font-heading:"Outfit", -apple-system, sans-serif;--font-body:"Inter", -apple-system, sans-serif;--bg-space:220 25% 6%;--bg-card:220 25% 10%;--border-card:220 25% 16%;--accent-cyan:185 100% 50%;--accent-purple:275 100% 65%;--accent-green:140 100% 55%;--accent-rose:335 100% 60%;--gradient-neon:linear-gradient(135deg, hsl(var(--accent-cyan)), hsl(var(--accent-purple)));--gradient-glow:linear-gradient(135deg, hsla(var(--accent-cyan) / .15), hsla(var(--accent-purple) / .15));--gradient-dark:linear-gradient(180deg, #0f1319, #08090d);--text-white:0 0% 100%;--text-primary:215 20% 90%;--text-muted:215 16% 62%;--transition-smooth:.25s cubic-bezier(.4, 0, .2, 1);--transition-bounce:.4s cubic-bezier(.175, .885, .32, 1.275)}*,:before,:after{box-sizing:border-box;margin:0;padding:0}body{background:var(--gradient-dark);color:hsl(var(--text-primary));font-family:var(--font-body);-webkit-font-smoothing:antialiased;background-attachment:fixed;min-block-size:100dvb;line-height:1.6;overflow-x:clip}h1,h2,h3,h4,h5,h6{font-family:var(--font-heading);color:hsl(var(--text-white));letter-spacing:-.02em;font-weight:700}::-webkit-scrollbar{block-size:8px;inline-size:8px}::-webkit-scrollbar-track{background:hsl(var(--bg-space))}::-webkit-scrollbar-thumb{background:hsl(var(--border-card));border-radius:4px}::-webkit-scrollbar-thumb:hover{background:hsl(var(--accent-purple) / .5)}.glass-container{background:hsla(var(--bg-card) / .45);-webkit-backdrop-filter:blur(16px)saturate(120%);backdrop-filter:blur(16px)saturate(120%);border:1px solid hsla(var(--text-white) / .06);transition:border var(--transition-smooth), transform var(--transition-smooth);border-radius:16px;padding:2rem;box-shadow:0 8px 32px #0000005e}.glass-container:hover{border-color:hsla(var(--accent-cyan) / .2)}.glass-card{background:hsla(var(--bg-card) / .7);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid hsla(var(--text-white) / .05);transition:transform var(--transition-bounce), border-color var(--transition-smooth), box-shadow var(--transition-smooth);border-radius:12px;padding:1.5rem}.glass-card:hover{border-color:hsla(var(--accent-purple) / .3);box-shadow:0 12px 24px -10px hsla(var(--accent-purple) / .2);transform:translateY(-4px)}.flex-row{align-items:safe center;gap:1rem;display:flex}.grid-cols-2{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:2rem;display:grid}.grid-dashboard{grid-template-columns:280px 1fr;min-block-size:100dvb;display:grid}@media (max-width:960px){.grid-dashboard{grid-template-rows:auto 1fr;grid-template-columns:1fr}}.form-group{flex-direction:column;gap:.5rem;margin-block-end:1.25rem;display:flex}.form-label{font-family:var(--font-heading);text-transform:uppercase;letter-spacing:.05em;color:hsl(var(--text-muted));font-size:.85rem;font-weight:600}.glass-input{background:hsla(var(--bg-space) / .5);border:1px solid hsla(var(--text-white) / .1);color:hsl(var(--text-white));font-family:var(--font-body);transition:border-color var(--transition-smooth), box-shadow var(--transition-smooth);border-radius:8px;outline:none;padding:.8rem 1rem;font-size:.95rem}.glass-input:focus{border-color:hsl(var(--accent-cyan));box-shadow:0 0 12px hsla(var(--accent-cyan) / .15)}.btn-primary{background:var(--gradient-neon);color:hsl(var(--text-white));font-family:var(--font-heading);cursor:pointer;transition:opacity var(--transition-smooth), transform var(--transition-bounce), box-shadow var(--transition-smooth);box-shadow:0 4px 15px hsla(var(--accent-purple) / .3);border:none;border-radius:8px;justify-content:center;align-items:center;gap:.5rem;padding:.8rem 1.8rem;font-size:1rem;font-weight:600;display:inline-flex}.btn-primary:hover{box-shadow:0 6px 20px hsla(var(--accent-cyan) / .4);transform:scale(1.02)}.btn-primary:active{transform:scale(.98)}.btn-secondary{background:hsla(var(--text-white) / .05);border:1px solid hsla(var(--text-white) / .1);color:hsl(var(--text-white));font-family:var(--font-heading);cursor:pointer;transition:background var(--transition-smooth), border-color var(--transition-smooth);border-radius:8px;justify-content:center;align-items:center;gap:.5rem;padding:.8rem 1.8rem;font-size:1rem;font-weight:500;display:inline-flex}.btn-secondary:hover{background:hsla(var(--text-white) / .1);border-color:hsla(var(--text-white) / .2)}.badge{font-family:var(--font-heading);text-transform:uppercase;letter-spacing:.05em;border-radius:20px;align-items:center;padding:.25rem .6rem;font-size:.75rem;font-weight:600;display:inline-flex}.badge-free{background:hsla(var(--text-muted) / .15);color:hsl(var(--text-muted))}.badge-pro{background:hsla(var(--accent-purple) / .15);color:hsl(var(--accent-purple));border:1px solid hsla(var(--accent-purple) / .3)}.badge-agency{background:hsla(var(--accent-cyan) / .15);color:hsl(var(--accent-cyan));border:1px solid hsla(var(--accent-cyan) / .3)}.tab-list{border-block-end:1px solid hsla(var(--text-white) / .08);gap:.5rem;margin-block-end:1.5rem;padding-block-end:.5rem;display:flex}.tab-btn{color:hsl(var(--text-muted));font-family:var(--font-heading);cursor:pointer;transition:color var(--transition-smooth), border-color var(--transition-smooth);background:0 0;border:none;padding:.5rem 1rem;font-size:.95rem;font-weight:500;position:relative}.tab-btn:hover{color:hsl(var(--text-white))}.tab-btn.active{color:hsl(var(--accent-cyan))}.tab-btn.active:after{content:"";background:hsl(var(--accent-cyan));block-size:2px;inline-size:100%;box-shadow:0 0 8px hsl(var(--accent-cyan));border-radius:2px;position:absolute;bottom:-.5rem;left:0}.container{inline-size:min(100% - 2rem,1200px);margin-inline:auto}.header{border-block-end:1px solid hsla(var(--text-white) / .05);margin-block-end:3rem;padding-block:1.5rem}.footer{text-align:center;color:hsl(var(--text-muted));border-block-start:1px solid hsla(var(--text-white) / .05);margin-block-start:5rem;padding-block:3rem;font-size:.85rem}.neon-text-glow{background:var(--gradient-neon);-webkit-text-fill-color:transparent;filter:drop-shadow(0 2px 8px hsla(var(--accent-cyan) / .3));-webkit-background-clip:text}@keyframes spin{to{transform:rotate(360deg)}}
