/* ==========================================================================
   CHALK — legal / prose pages (privacy-policy, terms-of-service)
   Depends on styles.css (tokens + components). Do not edit styles.css.
   ========================================================================== */

.legal{
  background:var(--black);
  /* clear the fixed navbar */
  padding-top:clamp(7.5rem,12vw,10rem);
  padding-bottom:clamp(4rem,8vw,7rem);
}
.legal__inner{max-width:800px;margin-inline:auto}

/* --- Title block --------------------------------------------------------- */
.legal h1{
  font-size:clamp(2.6rem,7vw,4.5rem);
  line-height:.92;
  margin-bottom:1rem;
}
.legal__updated{
  font-family:var(--font-ui);
  color:var(--ink-60);
  font-size:.95rem;
  margin-bottom:2.75rem;
  padding-bottom:2.25rem;
  border-bottom:1px solid var(--hairline);
}
.legal__updated em{font-family:var(--font-accent);font-style:italic}

/* --- Headings ------------------------------------------------------------ */
.legal h2{
  font-size:clamp(1.45rem,2.8vw,2rem);
  line-height:1.1;
  margin-top:3.25rem;
  margin-bottom:1.25rem;
  color:var(--ink);
}
.legal h3{
  font-size:clamp(1.15rem,2vw,1.5rem);
  line-height:1.15;
  margin-top:2.5rem;
  margin-bottom:1rem;
  color:var(--ink);
}

/* --- Body prose ---------------------------------------------------------- */
.legal p,
.legal li{
  font-family:var(--font-ui);
  font-weight:400;
  font-size:18px;
  line-height:1.75;
  color:var(--ink-60);
}
.legal p{margin-bottom:1.5rem}
.legal strong,.legal b{color:var(--ink);font-weight:600}

/* --- Lists (styles.css strips list markers; re-enable them here) --------- */
.legal ul{
  list-style:disc;
  margin:0 0 1.75rem;
  padding-left:1.4rem;
}
.legal li{margin-bottom:.65rem}
.legal li::marker{color:var(--purple)}

/* --- Links --------------------------------------------------------------- */
.legal a{
  color:var(--ink);
  text-decoration:underline;
  text-underline-offset:3px;
  text-decoration-color:var(--hairline-strong);
  transition:color .2s var(--ease-out),text-decoration-color .2s var(--ease-out);
}
.legal a:hover{color:var(--amber);text-decoration-color:var(--amber)}
