/* Legal document pages - extends landing styles.css */

.legal-page .topbar{
  position: sticky;
  inset-block-start: 0;
  z-index: 20;
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

.legal-doc{
  padding-block: clamp(48px, 8vh, 96px) var(--s7);
}

.legal-meta{
  margin: var(--s2) 0 var(--s6);
  color: var(--fg-3);
  font-size: .9375rem;
}

.legal-section{
  margin-block-end: var(--s5);
  padding-block-end: var(--s4);
  border-block-end: 1px solid var(--line);
}

.legal-section:last-of-type{
  border-block-end: 0;
}

.legal-section h2{
  margin: 0 0 var(--s2);
  font-size: 1.125rem;
  font-weight: 800;
  color: var(--em-300);
}

.legal-section p,
.legal-section li{
  color: var(--fg-2);
  line-height: 1.95;
  max-width: 68ch;
}

.legal-section p + p{
  margin-block-start: var(--s2);
}

.legal-section ul{
  margin: var(--s2) 0;
  padding-inline-start: 1.25rem;
}

.legal-section li + li{
  margin-block-start: .35rem;
}

.legal-back{
  margin-block-start: var(--s6);
  color: var(--fg-3);
}

.legal-back a{
  color: var(--em-300);
  font-weight: 700;
}

.legal-back a:hover{
  text-decoration: underline;
}

.wrap--narrow{
  max-width: 760px;
  margin-inline: auto;
  padding-inline: clamp(20px, 5vw, 40px);
}

.h2--display{
  font-size: clamp(1.75rem, 4vw, 2.5rem);
}

@media (max-width:759px){
  .legal-doc{
    padding-block: clamp(32px, 6vh, 64px) var(--s6);
  }
  .legal-section h2{
    font-size: 1.0625rem;
  }
  .legal-section p,
  .legal-section li{
    font-size: .9375rem;
    max-width: none;
  }
  .wrap--narrow{
    padding-inline: max(clamp(16px, 4.5vw, 40px), env(safe-area-inset-left, 0px))
                    max(clamp(16px, 4.5vw, 40px), env(safe-area-inset-right, 0px));
  }
}

@media (max-width:399px){
  .h2--display{
    font-size: clamp(1.5rem, 8vw, 2rem);
  }
}