.legal-hero {
  min-height: 72svh;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding-bottom: 74px;
}

.legal-hero .eyebrow {
  margin-bottom: 38px;
  color: #77777e;
  font-size: var(--type-label);
  font-weight: 600;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.legal-hero h1 {
  max-width: 1020px;
  margin: 0;
  font-size: var(--type-page-title);
  font-weight: 600;
  letter-spacing: var(--type-title-tracking);
  line-height: var(--type-title-leading);
}

.legal-hero h1 em {
  display: block;
  padding-left: .7em;
  font-family: Baskervville, serif;
  font-weight: 400;
}

.legal-meta {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 54px;
  padding-top: 16px;
  border-top: 1px solid #29292e;
  color: #77777e;
  font-size: var(--type-caption);
}

.legal-layout {
  display: grid;
  grid-template-columns: minmax(210px, .36fr) minmax(0, 1fr);
  gap: 8vw;
  padding-top: 90px;
  padding-bottom: 150px;
  border-top: 1px solid #29292e;
}

.legal-index {
  display: block;
  position: sticky;
  top: 115px;
  align-self: start;
  min-width: 0;
}

.legal-index > span {
  display: block;
  margin-bottom: 28px;
  color: #66666d;
  font-size: var(--type-label);
  font-weight: 600;
  letter-spacing: .13em;
  text-transform: uppercase;
}

.legal-index a {
  display: grid;
  grid-template-columns: 30px 1fr;
  gap: 10px;
  padding: 9px 0;
  color: #77777e;
  font-size: var(--type-caption);
  transition: color .2s ease;
}

.legal-index a::after { bottom: 2px; }

.legal-content {
  min-width: 0;
}

.legal-index a:hover,
.legal-index a:focus-visible { color: #fff; outline: none; }
.legal-index a i { font-style: normal; color: #44444a; }

.legal-intro {
  max-width: 820px;
  margin-bottom: 88px;
  font-size: var(--type-lead);
  font-weight: 500;
  letter-spacing: -.035em;
  line-height: 1.18;
}

.legal-section {
  scroll-margin-top: 120px;
  display: grid;
  grid-template-columns: minmax(120px, .28fr) 1fr;
  gap: 5vw;
  padding: 45px 0 52px;
  border-top: 1px solid #2a2a30;
}

.legal-section > h2 {
  margin: 0;
  color: #8d8d94;
  font-size: var(--type-label);
  font-weight: 600;
  line-height: 1.4;
  text-transform: uppercase;
  letter-spacing: .08em;
}

.legal-copy { max-width: 720px; }
.legal-copy h3 { margin: 0 0 13px; font-size: var(--type-card-title); font-weight: 600; }
.legal-copy h3:not(:first-child) { margin-top: 34px; }
.legal-copy p,
.legal-copy li {
  color: #aaaab0;
  font-size: var(--type-body);
  line-height: 1.72;
}

.legal-copy p + p { margin-top: 15px; }
.legal-copy ul { margin: 16px 0; }
.legal-copy li { position: relative; padding-left: 20px; }
.legal-copy li::before { content: '—'; position: absolute; left: 0; color: #5f5f66; }
.legal-copy a { color: #fff; text-decoration: underline; text-underline-offset: 3px; }
.legal-copy address { color: #fff; font-style: normal; font-size: var(--type-body); line-height: 1.65; }

.legal-note {
  margin-top: 30px;
  padding: 24px;
  border: 1px solid #303036;
  color: #88888f;
  font-size: var(--type-small);
  line-height: 1.6;
}

@media (max-width: 760px) {
  .legal-hero { min-height: 550px; padding-bottom: 48px; }
  .legal-hero h1 { font-size: var(--type-page-title); }
  .legal-hero h1 em { padding-left: .2em; }
  .legal-meta { align-items: flex-start; gap: 25px; }
  .legal-layout { grid-template-columns: 1fr; gap: 55px; padding-top: 55px; padding-bottom: 90px; }
  .legal-index { position: static; display: grid; grid-template-columns: 1fr 1fr; column-gap: 18px; }
  .legal-index > span { grid-column: 1 / -1; }
  .legal-section { grid-template-columns: 1fr; gap: 24px; padding: 38px 0 44px; }
  .legal-intro { margin-bottom: 60px; }
}