body{margin:0;font-family:Arial,sans-serif;color:#2f2f2f}
header{position:absolute;width:100%;z-index:5}
.nav{display:flex;justify-content:space-between;align-items:center;padding:20px 5%;background:rgba(0,0,0,.2)}
.logo{height:70px}
nav a{color:#fff;text-decoration:none;margin-left:20px}
.hero{height:100vh;background:linear-gradient(rgba(15,76,129,.55),rgba(15,76,129,.55)),url('https://images.unsplash.com/photo-1507525428034-b723cf961d3e?auto=format&fit=crop&w=1600&q=80') center/cover}
.overlay{height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;color:#fff;text-align:center;padding:20px}
h1{font-size:3.2rem;margin:0}
h2{font-weight:300}
.btn{background:#c8a25a;color:#fff;padding:14px 28px;text-decoration:none;border-radius:30px;margin-top:20px}
.content{padding:70px 10%;background:#f5f9fc}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:20px}
.cards div{background:#fff;padding:25px;border-radius:12px;box-shadow:0 5px 15px rgba(0,0,0,.08)}
footer{background:#0f4c81;color:#fff;text-align:center;padding:25px}
@media(max-width:700px){.nav{flex-direction:column}.logo{height:55px}nav{margin-top:10px}nav a{display:inline-block;margin:5px 8px}h1{font-size:2.2rem}}