* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html,
body {
  font-family: "Darker Grotesque", sans-serif;
  font-optical-sizing: auto;
  font-weight: 300;
  font-style: normal;
  height: 100%;
}
html,
body {
  color-scheme: light;
  background-color: #fff;
  color: #46484d;
}

@media (prefers-color-scheme: dark) {
  html,
  body {
    color-scheme: dark;
    background-color: #46484d;
    color: #fff;
  }
}

header {
  display: flex;
  justify-content: center;
  padding-top: 10%;
}

.brand-header {
  font-size: min(10vw, 120px);
}

.brand-header span {
  color: #ff5e5e;
}