.brand { gap: 12px; }
.brand-name {
  color: var(--blue);
  font-family: "Arial Black", Impact, Arial, sans-serif;
  font-size: 1.7rem;
  font-weight: 900;
  line-height: 1;
  letter-spacing: -.02em;
  text-shadow: 2px 2px 0 #c8d6e8;
  transform: none;
}
.brand-number {
  padding: 5px 11px 4px;
  border-radius: 7px;
  font-size: 1.15rem;
  letter-spacing: .05em;
  box-shadow: 0 4px 0 #9e1420;
}
.hero-copy { text-align: center; }
.hero-copy .lead { margin-left: auto; margin-right: auto; }
.hero-copy .actions { justify-content: center; }
.hero h1 { margin-top: 5px; text-align: center; }
.hero h1 em {
  display: block;
  position: relative;
  color: white;
  font-family: "Arial Black", Impact, Arial, sans-serif;
  font-size: clamp(3.4rem, 7.2vw, 7rem);
  font-weight: 900;
  font-style: normal;
  letter-spacing: -.045em;
  text-transform: uppercase;
  text-shadow: 5px 5px 0 #061a3d, 0 14px 30px #0006;
  transform: none;
}
.hero h1 em::after {
  display: none;
}
.hero h1 span {
  width: fit-content;
  margin: .08em auto 0;
  padding: .02em .13em .06em;
  color: white;
  background: linear-gradient(135deg, #ef3546, #b80f20);
  border-radius: .1em;
  letter-spacing: -.055em;
  text-shadow: 0 .035em 0 #720814;
  box-shadow: .07em .07em 0 #fff, 0 .16em .35em #0004;
  transform: none;
}
@media (max-width: 520px) {
  .brand-name { font-size: 2rem; }
  .hero h1 em { font-size: .82em; }
}