:root{--primary:#4f46e5;--primary-dark:#4338ca;--bg-main:linear-gradient(135deg, #1e1b4b 0%, #312e81 100%);--text-main:#f1f5f9;--text-muted:#94a3b8;--card-bg:#ffffff0f;--border-glass:#ffffff1f}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--bg-main);color:var(--text-main);min-height:100vh;font-family:Inter,sans-serif;overflow-x:hidden}body.modal-open{overflow:hidden}.hero-branding{flex-direction:column;justify-content:center;align-items:center;gap:1.2rem;padding:3rem 2rem 1rem;animation:.8s fadeInDown;display:flex}@keyframes fadeInDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}.hero-logo{object-fit:cover;border:5px solid #ffffff40;border-radius:32px;width:160px;height:160px;transition:transform .3s;box-shadow:0 20px 50px #4f46e566,0 0 80px #7c3aed26}.hero-logo:hover{transform:scale(1.04)}.hero-brand-name{letter-spacing:-.02em;background:linear-gradient(135deg,#fff 0%,#c4b5fd 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:3rem;font-weight:800}.welcome-wrapper{flex-direction:column;justify-content:center;align-items:center;min-height:100vh;padding:2rem;display:flex}.hero-section{text-align:center;max-width:900px}.brand{justify-content:center;align-items:center;gap:1rem;margin-bottom:2rem;display:flex}.brand-logo{border-radius:12px;width:60px;height:60px}.brand h1{font-size:1.9rem;font-weight:700}.headline{margin-bottom:1.5rem;font-size:2.7rem;font-weight:800}.subtext{color:var(--text-muted);max-width:750px;margin-bottom:2.5rem;margin-left:auto;margin-right:auto;font-size:1.05rem;line-height:1.7}.primary-btn{background:linear-gradient(135deg, var(--primary), var(--primary-dark));text-align:center;color:#fff;cursor:pointer;border:none;border-radius:10px;min-width:180px;padding:1rem 2.5rem;font-size:1rem;font-weight:600;text-decoration:none;transition:all .25s;display:inline-block}.primary-btn:hover{transform:translateY(-3px);box-shadow:0 12px 30px #4f46e559}.cta-group{justify-content:center;align-items:center;gap:1.5rem;margin-top:1rem;display:flex}.modal-overlay{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);visibility:hidden;opacity:0;z-index:9999;background:#030712d9;justify-content:center;align-items:center;transition:all .3s;display:flex;position:fixed;inset:0}.modal-overlay.active{visibility:visible;opacity:1}.modal-box{border:1px solid var(--border-glass);background:#111827;border-radius:16px;width:95%;max-width:800px;padding:3rem;position:relative}.modal-close{color:var(--text-muted);cursor:pointer;background:0 0;border:none;font-size:1.4rem;position:absolute;top:1.2rem;right:1.2rem}.modal-header{text-align:center;margin-bottom:2.5rem}.modal-header h3{margin-bottom:.5rem;font-size:1.8rem}.modal-header p{color:var(--text-muted);font-size:.95rem}.role-grid{grid-template-columns:repeat(3,1fr);gap:1.5rem;display:grid}.role-card{background:var(--card-bg);text-align:center;cursor:pointer;border:1px solid #0000;border-radius:14px;padding:2rem;transition:all .25s}.role-card:hover{border-color:var(--primary);background:#ffffff14;transform:translateY(-4px)}.role-card h4{margin-bottom:.5rem;font-size:1.1rem;font-weight:600}.role-card span{color:var(--text-muted);font-size:.9rem}@media (width<=768px){.hero-logo{border-radius:28px;width:130px;height:130px}.hero-brand-name{font-size:2.4rem}.headline{font-size:2rem}.role-grid{grid-template-columns:1fr}.modal-box{padding:2rem}}