body{margin:0;font-family:-apple-system;background:#f7f9fc;}
.nav{background:white;border-bottom:1px solid #eee;padding:10px;}
.nav-inner{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;}
.logo{font-weight:600;}
.nav a{margin-left:15px;text-decoration:none;color:#333;}
.hero{text-align:center;padding:60px 20px;background:linear-gradient(#4facfe,#00f2fe);color:white;}
.section{padding:40px 20px;}
.grid{display:flex;gap:20px;}
.card{background:white;padding:20px;border-radius:16px;margin-bottom:15px;box-shadow:0 5px 20px rgba(0,0,0,0.05);flex:1;}
.btn{display:inline-block;padding:12px 20px;border-radius:10px;background:#0070f3;color:white;text-decoration:none;}
.center{text-align:center;}
input{width:100%;padding:14px;margin:10px 0;border-radius:10px;border:1px solid #ddd;}
button{width:100%;padding:14px;border:none;border-radius:10px;background:#0070f3;color:white;}
.screen-center{display:flex;align-items:center;justify-content:center;height:100vh;}
.bottom-nav{position:fixed;bottom:0;width:100%;display:flex;justify-content:space-around;background:white;padding:10px;border-top:1px solid #eee;}

@media(max-width:768px){
  .grid{flex-direction:column;}
  .nav-inner{flex-direction:column;align-items:flex-start;}
  .nav a{margin:10px 0;}
}