*{margin:0;padding:0;box-sizing:border-box}body{font-family:Inter,Segoe UI,sans-serif;background:linear-gradient(135deg,#0f172a,#111827);color:#e5e7eb;line-height:1.6}.navbar{position:sticky;top:0;width:100%;padding:20px 60px;display:flex;justify-content:space-between;align-items:center;background:#0f172acc;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid rgba(255,255,255,.05);z-index:100}.logo{font-size:22px;font-weight:600;color:#38bdf8}.nav-links{display:flex;gap:45px;align-items:center}.nav-links a{text-decoration:none;color:#cbd5e1;font-weight:500;font-size:15px;transition:all .3s ease;position:relative}.nav-links a:after{content:"";position:absolute;left:0;bottom:-6px;width:0%;height:2px;background:#38bdf8;transition:.3s ease}.nav-links a:hover:after{width:100%}.nav-links a:hover{color:#38bdf8}.hero{height:80vh;display:flex;justify-content:center;align-items:center;text-align:center;padding:0 40px}.hero h1{font-size:48px;margin-bottom:20px}.hero p{max-width:700px;margin:auto;font-size:18px;color:#94a3b8}.hero button{margin-top:30px;padding:14px 28px;border:none;border-radius:30px;background:linear-gradient(90deg,#38bdf8,#6366f1);color:#fff;font-weight:600;cursor:pointer;transition:.3s}.hero button:hover{transform:scale(1.05);box-shadow:0 10px 25px #38bdf84d}.section{min-height:100vh;display:flex;justify-content:center;align-items:flex-start;padding-top:120px;padding-left:20px;padding-right:20px}.section h2{margin-bottom:20px;font-size:32px}.section p{margin-bottom:20px;color:#9ca3af}.card{max-width:900px;background:#1e293b;padding:35px;border-radius:12px;box-shadow:0 10px 30px #0006;line-height:1.8;font-size:16px}.card h2{font-size:30px;margin-bottom:20px;color:#38bdf8;text-align:center}.card:hover{transform:translateY(-5px)}input,select{width:100%;padding:16px;margin-bottom:20px;border-radius:14px;border:1px solid rgba(255,255,255,.15);background:#ffffff0f;color:#fff;font-size:15px;transition:all .3s ease}input::placeholder{color:#fff9}input:focus,select:focus{outline:none;border:1px solid #38bdf8;box-shadow:0 0 15px #38bdf84d;background:#ffffff14}select option{color:#000}button.primary{width:100%;padding:14px;border-radius:12px;border:none;background:linear-gradient(90deg,#38bdf8,#6366f1);color:#fff;font-weight:600;cursor:pointer;transition:.3s}button.primary:hover{transform:scale(1.02);box-shadow:0 10px 25px #6366f14d}.result{margin-top:20px;padding:20px;border-radius:12px;font-size:16px}.result.low{background:#064e3b}.result.average{background:#78350f}.result.high{background:#7f1d1d}.loadingBox{text-align:center;margin-top:20px;color:#fff}.spinner{width:40px;height:40px;border:4px solid #ccc;border-top:4px solid #00bfff;border-radius:50%;animation:spin 1s linear infinite;margin:auto}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.result{margin-top:20px;padding:20px;border-radius:10px;transition:.3s}.result.low{border-left:6px solid #00ff88;background:#00ff8814}.result.moderate{border-left:6px solid #ffa500;background:#ffa50014}.result.high{border-left:6px solid #ff3b3b;background:#ff3b3b14}.result{margin-top:20px;padding:20px;border-radius:12px;color:#fff;transition:.3s}.result.low{background:#00ff782e;border:2px solid #00ff88}.result.moderate{background:#ffa5002e;border:2px solid #ffa500}.result.high{background:#ff00002e;border:2px solid #ff3b3b}
