:root{--primary-color: #6366f1;--primary-dark: #4f46e5;--secondary-color: #ec4899;--bg-dark: #0f0f1a;--bg-card: #1a1a2e;--bg-card-hover: #252542;--text-primary: #ffffff;--text-secondary: #a1a1aa;--text-muted: #71717a;--border-color: #2d2d4a;--shadow-color: rgba(99, 102, 241, .3);--gradient-primary: linear-gradient(135deg, #6366f1 0%, #ec4899 100%);--gradient-secondary: linear-gradient(135deg, #1a1a2e 0%, #0f0f1a 100%);--gradient-hero: linear-gradient(135deg, #0f0f1a 0%, #1a1a2e 50%, #1e1b4b 100%)}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:var(--bg-dark);color:var(--text-primary);min-height:100vh;line-height:1.6}a{color:inherit;text-decoration:none}button{font-family:inherit}.home-page{min-height:100vh;display:flex;flex-direction:column;background:var(--gradient-hero);position:relative;overflow:hidden}.home-page:before{content:"";position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:radial-gradient(circle at 30% 20%,rgba(99,102,241,.08) 0%,transparent 50%),radial-gradient(circle at 70% 80%,rgba(236,72,153,.08) 0%,transparent 50%);animation:backgroundPulse 15s ease-in-out infinite;pointer-events:none}@keyframes backgroundPulse{0%,to{transform:scale(1) rotate(0);opacity:1}50%{transform:scale(1.1) rotate(5deg);opacity:.8}}.particles{position:absolute;inset:0;overflow:hidden;pointer-events:none}.particle{position:absolute;width:4px;height:4px;background:var(--primary-color);border-radius:50%;opacity:.3;animation:float 20s infinite}.particle:nth-child(1){left:10%;top:20%;animation-delay:0s;animation-duration:25s}.particle:nth-child(2){left:20%;top:60%;animation-delay:2s;animation-duration:20s}.particle:nth-child(3){left:30%;top:10%;animation-delay:4s;animation-duration:28s}.particle:nth-child(4){left:40%;top:70%;animation-delay:1s;animation-duration:22s}.particle:nth-child(5){left:50%;top:30%;animation-delay:3s;animation-duration:26s}.particle:nth-child(6){left:60%;top:50%;animation-delay:5s;animation-duration:24s}.particle:nth-child(7){left:70%;top:15%;animation-delay:2.5s;animation-duration:20s}.particle:nth-child(8){left:80%;top:80%;animation-delay:4.5s;animation-duration:27s}.particle:nth-child(9){left:90%;top:40%;animation-delay:1.5s;animation-duration:23s}.particle:nth-child(10){left:15%;top:85%;animation-delay:3.5s;animation-duration:21s}@keyframes float{0%,to{transform:translateY(0) translate(0) rotate(0);opacity:.3}25%{transform:translateY(-30px) translate(20px) rotate(90deg);opacity:.5}50%{transform:translateY(-60px) translate(-10px) rotate(180deg);opacity:.3}75%{transform:translateY(-30px) translate(15px) rotate(270deg);opacity:.5}}.home-content{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2rem;position:relative;z-index:1}.hero-section{text-align:center;max-width:800px;animation:fadeInUp 1s ease-out}@keyframes fadeInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.hero-icon{margin-bottom:2rem;position:relative}.hero-icon .icon-wrapper{width:200px;height:200px;border-radius:24px;display:flex;align-items:center;justify-content:center;margin:0 auto;animation:iconFloat 6s ease-in-out infinite}@keyframes iconFloat{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.hero-icon .icon-wrapper svg{width:200px;height:200px;color:#fff}.hero-icon .icon-wrapper .hero-logo{width:200px;height:200px;object-fit:contain}.welcome-title{font-size:3.5rem;font-weight:800;margin-bottom:1rem;line-height:1.2;background:var(--gradient-primary);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.welcome-title .highlight{background:var(--gradient-primary);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.welcome-subtitle{font-size:1.25rem;color:var(--text-secondary);margin-bottom:.5rem;font-weight:400}.welcome-tagline{font-size:1rem;color:var(--text-muted);margin-bottom:3rem}.divider{width:100px;height:4px;background:var(--gradient-primary);border-radius:2px;margin:0 auto 2rem;opacity:0;animation:fadeIn 1s ease-out .5s forwards}@keyframes fadeIn{to{opacity:1}}.cta-section{display:flex;flex-direction:column;align-items:center;gap:1.5rem;opacity:0;animation:fadeInUp 1s ease-out .7s forwards}.cta-button{display:inline-flex;align-items:center;gap:.75rem;background:var(--gradient-primary);color:#fff;padding:1rem 2.5rem;border-radius:50px;font-size:1.1rem;font-weight:600;border:none;cursor:pointer;transition:all .3s ease;box-shadow:0 10px 30px var(--shadow-color)}.cta-button:hover{transform:translateY(-3px) scale(1.02);box-shadow:0 15px 40px var(--shadow-color)}.cta-button svg{width:24px;height:24px;transition:transform .3s ease}.cta-button:hover svg{transform:translate(5px)}.features-section{display:flex;justify-content:center;gap:2rem;margin-top:3rem;flex-wrap:wrap;opacity:0;animation:fadeInUp 1s ease-out .9s forwards}.feature-item{display:flex;align-items:center;gap:.5rem;color:var(--text-secondary);font-size:.9rem;padding:.75rem 1.25rem;background:#1a1a2e99;border-radius:50px;border:1px solid var(--border-color);transition:all .3s ease}.feature-item:hover{border-color:var(--primary-color);color:var(--text-primary);background:#6366f11a}.feature-item svg{width:20px;height:20px;color:var(--primary-color)}.home-footer{padding:2rem;text-align:center;position:relative;z-index:1}.footer-text{color:var(--text-muted);font-size:.85rem}.footer-text .brand{font-weight:600;color:var(--text-secondary)}@media(max-width:768px){.welcome-title{font-size:2.5rem}.welcome-subtitle{font-size:1.1rem}.welcome-tagline{font-size:.95rem}.hero-icon .icon-wrapper{width:80px;height:80px}.hero-icon .icon-wrapper svg{width:40px;height:40px}.hero-icon .icon-wrapper .hero-logo{width:40px;height:40px}.cta-button{padding:.875rem 2rem;font-size:1rem}.features-section{gap:1rem}.feature-item{font-size:.85rem;padding:.6rem 1rem}}@media(max-width:480px){.home-content{padding:1.5rem}.welcome-title{font-size:2rem}.hero-icon .icon-wrapper{width:70px;height:70px;border-radius:20px}.hero-icon .icon-wrapper svg{width:35px;height:35px}.hero-icon .icon-wrapper .hero-logo{width:35px;height:35px}.features-section{flex-direction:column;align-items:center}}.home-page.loaded .hero-section{animation:fadeInUp 1s ease-out}.home-page.loaded .cta-section{animation:fadeInUp 1s ease-out .5s forwards;opacity:1}.home-page.loaded .features-section{animation:fadeInUp 1s ease-out .7s forwards;opacity:1}
