/* anyflo-legal.css
 * Where: Page Settings → Inside <head>  (legal pages)
 * Targets: .legal_component / .legal_toc / .legal_richtext in Webflow; .legal_toc-link is created by anyflo-legal.js
 */
.legal_component {
  display: grid;
  grid-template-columns: 19rem 1fr;
  column-gap: 5rem;
  align-items: start;
  padding-top: 6rem;
  padding-bottom: 2rem;
}
.legal_toc {
  position: sticky;
  top: 7rem;
  display: flex;
  flex-direction: column;
  row-gap: 0.75rem;
}
.legal_toc-link {
  color: inherit;
  text-decoration: none;
  opacity: 0.55;
  transition: opacity 0.2s ease;
}
@media (hover: hover) and (pointer: fine) {
  .legal_toc-link:hover { opacity: 1; }
}
/* the terms text is one Rich Text: h2 = section, p = clause, ul = (a)…(z) sub-points.
   Sizes follow the site's heading-style-h5 / text-size-medium */
.legal_richtext h2 {
  margin: 4rem 0 1rem;
  font-family: Outfit, sans-serif;
  font-size: 2rem;
  line-height: 1.12;
  font-weight: 500;
  letter-spacing: -0.023em;
  scroll-margin-top: 7rem;
}
.legal_richtext h2:first-child { margin-top: 0; }
.legal_richtext p,
.legal_richtext li {
  margin: 0 0 1rem;
  font-family: Inter, sans-serif;
  font-size: 1.0625rem;
  line-height: 1.41;
  letter-spacing: -0.012em;
}
.legal_richtext ul {
  margin: 0 0 1rem;
  padding-left: 3.5rem;
  list-style: none;
}
.legal_richtext a {
  color: inherit;
  text-decoration: underline;
}

@media screen and (max-width: 479px) {
  .legal_component {
    grid-template-columns: 1fr;
    row-gap: 3rem;
    padding-top: 4rem;
    padding-bottom: 2rem;
  }
  .legal_toc { position: static; }
  .legal_richtext ul { padding-left: 1.5rem; }
}
