body {
  margin: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #50414f;
  font-family: "Dongle", sans-serif;
  font-weight: 400;
  line-height: 1em;
  min-height: 100vh;
  background:
    linear-gradient(
      to bottom,
      rgba(255, 255, 255, 0.3),
      rgba(255, 255, 255, 0)
    ),
    linear-gradient(to bottom, #c790c4, #735472);
}
main {
  padding: 20px;
  text-align: center;
  font-size: clamp(1.5rem, 2vw, 3rem);
}
.logo {
  width: clamp(200px, 20vw, 320px);
}
.social-links {
  display: flex;
  justify-content: center;
  gap: 1rem;
}
.social {
  height: 1.75rem;
  fill: currentColor;
}
.social {
  color: #3e3e3e;
}
.social:hover {
  color: #5e6a51;
}
.light {
  font-weight: 300;
}
.divider {
  margin: 1rem auto;
  width: clamp(200px, 20vw, 320px);
  height: 2px;
  background: linear-gradient(90deg, transparent, currentColor, transparent);
  opacity: 0.4;
}
.social {
  transition:
    transform 0.2s ease,
    color 0.2s ease;
}

.social:hover {
  transform: translateY(-2px);
}