/* Terms and privacy. Long-form prose in a house built for game boards, so the
   only new thing here is a comfortable measure and headings that break the
   page up. Everything else comes from style.css. */

.legal {
  max-width: 68ch;
  font-size: 14px;
  line-height: 1.75;
  color: var(--parchment-2);
}

.legal__lede {
  color: var(--parchment);
  font-size: 15px;
}

.legal h2 {
  font-family: 'Fraunces', Georgia, serif;
  font-variation-settings: 'SOFT' 50, 'opsz' 40, 'wght' 600;
  font-weight: 600;
  font-size: 1.35rem;
  letter-spacing: -.01em;
  color: var(--parchment);
  margin: 2.6em 0 .6em;
}

.legal h2:first-of-type { margin-top: 1.8em; }

.legal h3 {
  font-size: 11px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--brass);
  margin: 2em 0 .5em;
}

.legal p, .legal ul { margin: 0 0 1em; }
.legal ul { padding-left: 1.2em; }
.legal li { margin-bottom: .4em; }

.legal a { color: var(--brass); text-underline-offset: 3px; }
.legal a:hover { color: var(--parchment); }

.legal strong { color: var(--parchment); font-weight: 600; }

/* The date the wording last moved, so a reader can tell at a glance whether
   they are looking at what they agreed to. */
.legal__stamp {
  font-size: 10px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--parchment-3);
  margin-bottom: 2.4em;
}

/* A short standing-out block for the two or three things a buyer actually
   needs to know, so the answer is not buried in a clause. */
.legal__note {
  border-left: 2px solid var(--brass-2);
  background: rgba(199, 154, 69, .05);
  padding: 14px 18px;
  margin: 1.4em 0 1.6em;
}
.legal__note p:last-child { margin-bottom: 0; }

/* ------------------------------------------------------------- footer -- */

.footlinks {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 18px;
  font-size: 10px;
  letter-spacing: .18em;
  text-transform: uppercase;
}
.footlinks a { color: var(--parchment-3); text-decoration: none; }
.footlinks a:hover { color: var(--brass); text-decoration: underline; }