*{box-sizing:border-box;margin:0;padding:0;font-family:system-ui,sans-serif}body{color:#111827;background:#f8fafc}#nav-bar{background:#fff;justify-content:space-between;align-items:center;padding:18px 10%;display:flex;position:sticky;top:0;box-shadow:0 4px 10px #0000000a}#heading h1 span{color:#2563eb}.btn-primary{color:#fff;cursor:pointer;background:#2563eb;border:none;border-radius:999px;padding:12px 28px;font-weight:600}.btn-outline{color:#2563eb;cursor:pointer;background:#fff;border:2px solid #2563eb;border-radius:999px;padding:10px 24px;font-weight:600}#hero-outer{width:fit-content;margin:auto}#hero{grid-template-columns:1fr 1fr;align-items:center;gap:50px;padding:80px 10%;display:grid}#hero-text h1{margin-bottom:16px;font-size:2.8rem}#hero-text p{color:#374151;max-width:480px;margin-bottom:26px}#hero-image img{width:100%;max-width:420px;margin-left:auto}#features-intro{text-align:center;padding:40px 10%}#features{grid-template-columns:repeat(3,1fr);gap:30px;padding:0 10% 80px;display:grid}.feature-card{background:#fff;border-radius:16px;padding:30px;box-shadow:0 10px 20px #0000000d}#cta{text-align:center;background:#e0f2fe;border-radius:18px;margin:0 10% 80px;padding:60px 40px}.cta-buttons{justify-content:center;gap:16px;margin-top:20px;display:flex}footer{text-align:center;color:#6b7280;padding:20px}.alert-backdrop{z-index:9999;background:#00000073;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.alert-box{text-align:center;background:#fff;border-radius:14px;flex-direction:column;width:350px;padding:25px;animation:.25s ease-out pop;display:flex;box-shadow:0 10px 40px #0000004d}.alert-box input{border:none;border-bottom:2px solid #2563eb;outline:none;margin:10px 0;padding:10px;font-size:20px}.alert-box h3{color:#2563eb;margin-bottom:10px}.alert-box p{margin-bottom:20px;font-size:15px}.alert-box button{margin:5px 0}@keyframes pop{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}@media (max-width:900px){#hero{text-align:center;grid-template-columns:1fr}#hero-image img{margin:40px auto 0}#features{grid-template-columns:repeat(2,1fr)}}@media (max-width:500px){#nav-bar #heading h1{font-size:1.3rem;position:relative;right:10px}#nav-bar img{position:relative;right:10px}#features{grid-template-columns:1fr}#hero-text h1{font-size:2rem}}