/* The privacy policy and the terms (templates/legal/). Plain CSS, loaded only on those pages: long text needs list
   bullets and line spacing that app.css (built by Tailwind from the other templates) does not include. Colours are
   Tailwind's slate and indigo, as on the rest of the site. */
.legal {
  max-width: 48rem;
  margin: 0 auto;
  padding: 2.5rem 1rem 3rem;
  color: #cbd5e1;               /* slate-300 */
  line-height: 1.7;
}
.legal h1 {
  font-size: 1.875rem;
  line-height: 2.25rem;
  font-weight: 700;
  letter-spacing: -0.025em;
  color: #f1f5f9;               /* slate-100 */
}
.legal .legal-effective {
  margin-top: 0.5rem;
  font-size: 0.875rem;
  color: #94a3b8;               /* slate-400 */
}
.legal h2 {
  margin-top: 2.5rem;
  font-size: 1.25rem;
  line-height: 1.75rem;
  font-weight: 600;
  color: #f1f5f9;
}
.legal h3 {
  margin-top: 1.5rem;
  font-size: 1rem;
  font-weight: 600;
  color: #e2e8f0;               /* slate-200 */
}
.legal p { margin-top: 0.75rem; }
.legal ul {
  margin-top: 0.75rem;
  padding-left: 1.25rem;
  list-style: disc;
}
.legal li { margin-top: 0.375rem; }
.legal li::marker { color: #64748b; }   /* slate-500 */
.legal strong { font-weight: 600; color: #f1f5f9; }
.legal a { color: #818cf8; text-decoration: underline; text-underline-offset: 2px; }   /* indigo-400 */
.legal a:hover { color: #a5b4fc; }                                                    /* indigo-300 */
.legal .legal-summary {
  margin-top: 1.5rem;
  padding: 1.25rem;
  border: 1px solid #1e293b;    /* slate-800 */
  border-radius: 0.75rem;
  background: #0f172a;          /* slate-900 */
}
.legal .legal-summary h2 { margin-top: 0; font-size: 1rem; }
.legal .legal-table { overflow-x: auto; }
.legal table {
  width: 100%;
  margin-top: 0.75rem;
  border-collapse: collapse;
  font-size: 0.875rem;
}
.legal th, .legal td {
  padding: 0.5rem 0.75rem 0.5rem 0;
  border-bottom: 1px solid #1e293b;
  text-align: left;
  vertical-align: top;
}
.legal th { font-weight: 600; color: #e2e8f0; }
