aside#cookie-banner {
  position: absolute;
  z-index: 1000;
  bottom: 5rem;
  margin: auto;
  left: 0;
  right: 0;
  width: 50vw;
  max-width: 600px;
  background: color-mix(in srgb, var(--colors--primary), transparent 10%);
  box-shadow: var(--shadow);
  backdrop-filter: blur(0.5rem);
  border-radius: 0.25rem;
  padding: 2rem;
  color: white;
  transition: transform 0.5s, opacity 0.5s;
  
  &.--hidden {
    opacity: 0;
    transform: translateY(calc(100% + 5rem));
  }

  p {
    white-space: pre-line;
  }

  a {
    color: currentColor;
  }

  > section {
    display: flex;
    gap: 1rem;
    justify-content: end;
    margin: 2rem -2rem -2rem -2rem;
    background: var(--colors--area);
    padding: 2rem;

    button {
      background: var(--colors--primary);
      border-radius: 0.25rem;
      border: none;
      color: white;
      padding: 0.75rem 1.5rem;
      text-align: center;
      margin-top: 2rem;
      cursor: pointer;
      width: 100%;
      margin-top: unset;
    }
  }
}