/* The legal pages (app/content/layouts/legal.html.erb): a readable column of
   text in the landing's cream and ink. */
body.noodl-legal {
  margin: 0;
  background: var(--noodl-palettes-landing-cream);
  color: var(--noodl-palettes-landing-body);
  font: 400 16.5px/1.65 "Avenir Next", var(--noodl-fonts-landing-stack);
  -webkit-font-smoothing: antialiased;
}

.legal-top {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
  gap: 14px 24px;
  max-width: 760px;
  margin: 0 auto;
  padding: 22px 16px 0;
}
.legal-brand img { display: block; width: 96px; height: auto; }

.legal-tabs { display: flex; flex-wrap: wrap; gap: 6px; }
.legal-tabs a {
  padding: 6px 12px;
  border-radius: var(--noodl-radii-pill);
  color: var(--noodl-palettes-landing-muted);
  font-size: 14.5px; font-weight: 600;
  text-decoration: none;
}
.legal-tabs a:hover { background: var(--noodl-palettes-landing-beige); color: var(--noodl-palettes-landing-green); }
.legal-tabs a[aria-current="page"] {
  background: var(--noodl-palettes-landing-card);
  box-shadow: inset 0 0 0 1.5px var(--noodl-palettes-landing-card-line);
  color: var(--noodl-palettes-landing-green);
}

.legal-page {
  max-width: 760px;
  margin: 0 auto;
  padding: 40px 16px 72px;
}
.legal-page h1 {
  margin: 0;
  color: var(--noodl-palettes-landing-green);
  font: 700 clamp(32px, 6vw, 44px)/1.1 "Avenir Next", var(--noodl-fonts-landing-stack);
  letter-spacing: -.02em;
}
.legal-updated { margin: 10px 0 0; color: var(--noodl-palettes-landing-muted); font-size: 14px; }

.legal-body { margin-top: 28px; }
.legal-body h2 {
  margin: 36px 0 8px;
  color: var(--noodl-palettes-landing-green);
  font-size: 21px; line-height: 1.3; letter-spacing: -.01em;
}
.legal-body h3 { margin: 22px 0 4px; color: var(--noodl-palettes-landing-green); font-size: 17px; }
.legal-body p, .legal-body ul { margin: 0 0 14px; }
.legal-body ul { padding-left: 22px; }
.legal-body li { margin-bottom: 6px; }
.legal-body strong { color: var(--noodl-palettes-landing-green); }
.legal-body a {
  color: var(--noodl-palettes-landing-orange-action);
  text-decoration: underline; text-underline-offset: 3px;
}

/* The one-glance summary at the top of each policy. */
.legal-body .legal-summary {
  margin: 0 0 8px;
  padding: 16px 18px;
  border: 1.5px solid var(--noodl-palettes-landing-card-line);
  border-radius: var(--noodl-radii-md);
  background: var(--noodl-palettes-landing-card);
}
.legal-body .legal-summary p:last-child, .legal-body .legal-summary ul:last-child { margin-bottom: 0; }