/* Privacy and terms only. The shared system is in /styles.css.
   Two sections each: the light top, then the four points on white. */

/* A shorter top: these pages are short */
.legal-hero { padding-bottom: clamp(52px, 6vw, 88px); }
.legal-hero .lede { max-width: 34em; }

/* The four points: icon on the left, heading and words beside it, two by two on wider screens */
.legal-band { padding-block: clamp(56px, 6vw, 96px) clamp(72px, 8vw, 120px); }
.legal-grid { max-width: 1000px; margin-inline: auto; }
.legal-grid > .card {
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr);
  column-gap: 20px;
  align-content: start;
}
.legal-grid > .card > .tile { grid-row: span 2; margin: 0; }
.legal-grid h2 { margin: 10px 0 8px; font-size: var(--fs-h3); font-weight: 800; line-height: 1.12; letter-spacing: 0.01em; }
.legal-grid p { max-width: 34em; }
@media (max-width: 419px) {
  .legal-grid > .card { grid-template-columns: 40px minmax(0, 1fr); column-gap: 14px; }
  .legal-grid > .card > .tile { width: 40px; height: 40px; border-radius: 12px; }
  .legal-grid h2 { margin-top: 6px; }
}