body {
  font-family: switzer;
}
em {
  font-family: Eiko Italic;
}

header {
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  width: 100vw;
  height: 100vh;
  filter: brightness(0.8);
}
header .text {
  text-align: center;
  padding-top: 170px;
}
header .text h1 {
  font-size: 53px;
  color: #fff;
}

nav .offcanvas a {
  text-decoration: none;
}

.benefit-card {
  transition:
    transform 0.3s ease,
    box-shadow 0.3s ease;
  border-radius: 1rem;
}
.col .card {
  height: 22em;
}
.benefit-card:hover {
  transform: translateY(-10px);
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
}

@media (max-width: 768px) {
  .benefit-card:hover {
    transform: none;
    box-shadow: none;
  }
}