.footer {
  background: url('../images/footer.jpg') center / cover no-repeat var(--color-dark);
  display: grid;
  height: 40vw;
  margin-top: -0.1em;
  position: relative;
}

.footer:before {
  background: url('../images/noise-dark.png') center / 20%;
  content: '';
  inset: 0;
  position: absolute;
}

.footer__legal {
  background: var(--color-pink);
  bottom: 0;
  display: grid;
  padding: var(--space-medium) var(--space-large);
  position: absolute;
  width: 100%;
}

.footer__legal p {
  font-size: 90%;
  font-weight: 800;
  margin-bottom: -0.425em;
  margin-top: -0.3125em;
  text-transform: uppercase;
}



@media(min-width: 64em) {

  .footer__legal {
    padding-inline: var(--space-xxx-large);
  }

}