.legal-hero {
  --top-gap: 20rem;
  width: 100%;
  padding: 30rem 27rem;
  position: relative;
  overflow-x: clip;
}

.legal-hero .legal-rings__wrap {
  pointer-events: none;
  opacity: .5;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  overflow: hidden;
  -webkit-mask-image: linear-gradient(#000 72%, #0000 98%);
  mask-image: linear-gradient(#000 72%, #0000 98%);
}

.legal-hero .legal-rings {
  aspect-ratio: 1;
  justify-content: center;
  align-items: center;
  width: 190rem;
  display: flex;
  position: absolute;
  top: 10rem;
  left: 50%;
  transform: translate(-50%);
}

.legal-hero .hero-lines {
  left: 0;
  top: var(--top-gap);
  pointer-events: none;
  width: 100vw;
  height: auto;
  position: absolute;
}

.legal-hero .legal-hero__container {
  z-index: 1;
  flex-direction: column;
  align-items: center;
  width: 100%;
  display: flex;
  position: relative;
}

.legal-hero .legal-hero__container .legal-hero__title {
  color: var(--black);
  letter-spacing: -3px;
  text-align: center;
  opacity: 0;
  visibility: hidden;
  font-size: max(34px, min(6.6rem + 4px, 140px));
  font-weight: 500;
  line-height: 100%;
}

.legal-hero .legal-hero__container .legal-hero__desc {
  width: 44rem;
  color: var(--gray-secondary);
  letter-spacing: -.18px;
  text-align: center;
  margin-top: 2rem;
  font-size: max(10px, min(1.3rem + 2px, 26px));
  font-weight: 500;
  line-height: 150%;
}

.legal {
  width: 100%;
  padding: 0 10rem 16rem;
  position: relative;
  overflow-x: clip;
}

.legal .legal-container {
  flex-direction: column;
  row-gap: 6rem;
  width: 100%;
  max-width: 132rem;
  margin: 0 auto;
  display: flex;
}

.legal .legal-container .legal-block {
  flex-direction: column;
  row-gap: 2rem;
  display: flex;
}

.legal .legal-container .legal-block .legal-block__title {
  color: var(--black);
  letter-spacing: -.8px;
  font-size: max(16px, min(2.6rem + 2px, 52px));
  font-weight: 700;
  line-height: 120%;
}

.legal .legal-container .legal-block .legal-block__subtitle {
  color: var(--black);
  letter-spacing: -.4px;
  margin-top: 1rem;
  font-size: max(13px, min(1.9rem + 2px, 38px));
  font-weight: 700;
  line-height: 130%;
}

.legal .legal-container .legal-block .legal-block__label {
  color: var(--gray-secondary);
  letter-spacing: -.18px;
  font-size: max(11px, min(1.5rem + 2px, 30px));
  font-weight: 500;
  line-height: 150%;
}

.legal .legal-container .legal-block .legal-block__label.is--dark, .legal .legal-container .legal-block .legal-block__text strong {
  color: var(--black);
  font-weight: 700;
}

.legal .legal-container .legal-block .legal-block__text {
  color: var(--gray-secondary);
  letter-spacing: -.18px;
  font-size: max(11px, min(1.5rem + 2px, 30px));
  font-weight: 500;
  line-height: 150%;
}

.legal .legal-container .legal-block .legal-block__text a {
  color: var(--black);
  text-underline-offset: .3rem;
  transition: color .4s var(--smooth-ease);
  text-decoration: underline;
}

.legal .legal-container .legal-block .legal-block__text a:hover {
  color: var(--blue);
}

.legal .legal-container .legal-block .legal-block__list {
  flex-direction: column;
  row-gap: .4rem;
  padding-left: 2.4rem;
  display: flex;
}

.legal .legal-container .legal-block .legal-block__list li {
  color: var(--gray-secondary);
  letter-spacing: -.18px;
  font-size: max(11px, min(1.5rem + 2px, 30px));
  font-weight: 500;
  line-height: 150%;
  position: relative;
}

.legal .legal-container .legal-block .legal-block__list li:before {
  content: "";
  background: var(--gray-secondary);
  border-radius: 100%;
  width: .6rem;
  height: .6rem;
  position: absolute;
  top: .9em;
  left: -1.6rem;
}

.legal .legal-container .legal-block .legal-block__label + .legal-block__list {
  margin-top: -1rem;
}

@media (orientation: portrait) {
  .legal-hero {
    --top-gap: 20rem;
    padding: 10rem 2.5rem;
  }

  .legal-hero .legal-rings__wrap {
    pointer-events: none;
    opacity: .5;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    overflow: hidden;
    -webkit-mask-image: linear-gradient(#000 72%, #0000 98%);
    mask-image: linear-gradient(#000 72%, #0000 98%);
  }

  .legal-hero .legal-rings {
    width: 80rem;
    top: 10rem;
  }

  .legal-hero .legal-hero__container .legal-hero__title {
    letter-spacing: -1.4px;
    font-size: 3.5rem;
  }

  .legal-hero .legal-hero__container .legal-hero__desc {
    width: 33rem;
    margin-top: 1rem;
    font-size: 1.2rem;
  }

  .legal {
    padding: 0 4rem 2.5rem;
  }

  .legal .legal-container {
    row-gap: 3rem;
    width: 100%;
    max-width: 38rem;
  }

  .legal .legal-container .legal-block {
    row-gap: 1rem;
  }

  .legal .legal-container .legal-block .legal-block__title {
    font-size: 1.4rem;
  }

  .legal .legal-container .legal-block .legal-block__subtitle {
    margin-top: .5rem;
    font-size: 1.2rem;
  }

  .legal .legal-container .legal-block .legal-block__label, .legal .legal-container .legal-block .legal-block__text {
    font-size: 1.2rem;
  }

  .legal .legal-container .legal-block .legal-block__list {
    padding-left: 1.5rem;
  }

  .legal .legal-container .legal-block .legal-block__list li {
    font-size: 1.2rem;
  }

  .legal .legal-container .legal-block .legal-block__list li:before {
    width: .4rem;
    height: .4rem;
    top: .7em;
    left: -1.2rem;
  }
}

[data-reveal] {
  opacity: 0;
  visibility: hidden;
}
