body {

  font-family: 'Poppins', sans-serif;

  margin: 0;

  padding: 0;

  background-color: #f4f8fb;

  color: #333;

}



.container {

  width: 90%;

  max-width: 1200px;

  margin: 0 auto;

}



header {

  background-color: #004d99;

  color: white;

  padding: 20px 0;

  text-align: center;

}



.logo {

  width: 100px;

  height: auto;

  display: block;

  margin: 0 auto 10px;

}



h1 {

  font-size: 28px;

  margin: 10px 0 5px;

}



.slogan {

  font-style: italic;

  font-size: 16px;

}



nav ul {

  list-style: none;

  padding: 0;

  margin: 20px 0 0;

  display: flex;

  justify-content: center;

  gap: 20px;

  flex-wrap: wrap;

}



nav a {

  color: white;

  text-decoration: none;

  font-weight: 600;

}



main {

  padding: 40px 20px;

}



.hero {

  background: url('https://images.unsplash.com/photo-1599785209707-28c18baee93e?auto=format&fit=crop&w=1350&q=80') no-repeat center center/cover;

  color: white;

  padding: 80px 20px;

  text-align: center;

}



.hero h2 {

  font-size: 36px;

  margin-bottom: 10px;

}



.hero .subtitle {

  font-size: 22px;

  margin-bottom: 20px;

}



.btn {

  background-color: #0073e6;

  color: white;

  padding: 12px 25px;

  text-decoration: none;

  font-weight: bold;

  border-radius: 5px;

  display: inline-block;

  margin-top: 15px;

}



footer {

  background-color: #002e5a;

  color: white;

  text-align: center;

  padding: 20px 0;

  margin-top: 30px;

}



.social-icons a {

  color: white;

  margin: 0 10px;

  text-decoration: none;

}



ul {

  padding-left: 20px;

}



form input, form textarea {

  width: 100%;

  padding: 12px;

  margin: 10px 0;

  border: 1px solid #ccc;

  border-radius: 5px;

}



form button {

  background-color: #004d99;

  color: white;

  padding: 10px 20px;

  border: none;

  border-radius: 5px;

  cursor: pointer;

}