body { font-family: 'Inter', sans-serif; background: #f8f9ff; }
.hero { background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); color: white; min-height: 90vh; display: flex; align-items: center; }
.hero h1 { font-size: 3.5rem; font-weight: 800; }
.logo-card { transition: all 0.4s; cursor: pointer; }
.logo-card:hover { transform: translateY(-10px); box-shadow: 0 20px 40px rgba(0,0,0,0.15)!important; }
.overlay { position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,0.6); opacity: 0; transition: 0.4s; display: flex; align-items: center; justify-content: center; }
.logo-card:hover .overlay { opacity: 1; }
.btn-primary { background: #6366f1; border: none; border-radius: 12px; padding: 16px 32px; font-weight: 600; }
.btn-primary:hover { background: #4f46e5; transform: translateY(-2px); }
#generatorCard { background: white; border-radius: 20px; }