*{box-sizing:border-box}

body{
  margin:0;
  background:#ebebeb;
  color:#111;
  font-family:'Open Sans', Arial, sans-serif;
}

.site-header{
  background:#6a9993;
  position:sticky;
  top:0;
  z-index:1000;
  box-shadow:0 2px 10px rgba(0,0,0,.08);
}

.nav-wrap{
  max-width:1200px;
  margin:auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:18px 22px;
}

.logo-wrap{
  display:flex;
  align-items:center;
  gap:14px;
}

.logo-wrap img{
  width:58px;
  height:auto;
}

.logo-wrap h2{
  margin:0;
  font-weight:500;
  color:#193234;
  font-size:24px;
}

.nav-links{
  display:flex;
  gap:28px;
}

.nav-links a{
  text-decoration:none;
  color:#193234;
  font-weight:600;
  transition:.2s ease;
}

.nav-links a:hover{
  opacity:.75;
}

main{
  min-height:70vh;
}

.site-footer{
  background:#6a9993;
  padding:40px 20px;
  text-align:center;
  color:#193234;
  margin-top:60px;
}

.site-footer img{
  width:40px;
  margin:10px;
}

.site-footer a{
  color:#193234;
  text-decoration:none;
  font-weight:600;
}

@media(max-width:768px){
  .nav-wrap{
    flex-direction:column;
    gap:16px;
  }

  .nav-links{
    flex-wrap:wrap;
    justify-content:center;
    gap:16px;
  }

  .logo-wrap h2{
    font-size:20px;
    text-align:center;
  }
}