html {
  height: 100%;
  line-height: 1.15;
  -webkit-text-size-adjust: 100%;
}

body {
  margin: 0;
  min-height: 100%;
  overflow-x: hidden;
}

img {
  border-style: none;
  height: auto;
  max-width: 100%;
}

header .branding img {
  height: 3rem;
  max-height: 3rem;
  max-width: 6.563rem;
  object-fit: cover;
}

.hsl-hero {
  min-height: clamp(15rem, 32vw, 30rem);
  overflow: hidden;
}

.hsl-hero picture,
.hsl-hero img {
  display: block;
  min-height: inherit;
  width: 100%;
}

.hsl-banner-content {
  overflow: hidden;
}

.hsl-banner-content picture,
.hsl-banner-content img {
  display: block;
  height: 100%;
  width: 100%;
}

@media (max-width: 767px) {
  .hsl-hero {
    min-height: 26rem;
  }
}

:not(.loaded).hsl-hero,
:not(.loaded).hsl-hero > .container {
  animation: none !important;
  background: transparent !important;
  background-image: none !important;
  height: auto !important;
  min-height: 0 !important;
  text-indent: 0 !important;
}

:not(.loaded).hsl-hero > .container::before {
  content: none !important;
}
