/* terms-conditions.html: page-specific additions (tokens from site.css only) */

/* "On this page" index beside the legal prose */
.legal-index { position: sticky; top: calc(var(--header-h-compact) + var(--s-6)); }
.legal-index ol { list-style: none; margin: var(--s-4) 0 0; padding: 0; border-top: 1px solid var(--rule); }
.legal-index li { border-bottom: 1px solid var(--rule); }
.legal-index ol a {
  display: grid; grid-template-columns: 2.25rem 1fr; gap: 0.75rem; align-items: baseline;
  padding: 0.6rem 0; font-size: var(--fs-small); color: var(--ink-soft); text-decoration: none;
  transition: color var(--dur-fast);
}
.legal-index ol a:hover { color: var(--ink); }
.legal-index ol a .num { font-family: var(--font-heading); font-style: italic; font-size: 0.9rem; color: var(--accent-text); }

/* legal prose: numbered clauses */
.legal-prose h2 { font-size: var(--fs-h3); max-width: 28ch; }
.legal-prose h2 .num { display: block; font-family: var(--font-heading); font-style: italic; font-size: 0.95rem; letter-spacing: 0.04em; color: var(--accent-text); margin-bottom: var(--s-3); }
.legal-prose > .lead { margin-bottom: var(--s-8); }
.legal-prose h2:first-child { margin-top: 0; }
.legal-prose h2 { scroll-margin-top: calc(var(--header-h-compact) + var(--s-6)); }

@media (max-width: 900px) {
  /* At narrow widths the hero spec stacks under the link row; give its top rule room to breathe */
  .page--terms .page-hero__side > .spec { margin-top: var(--s-6); }
  /* prose first; the ten-row index is dropped on mobile and only the "See also" line closes the section */
  .page--terms .split--wide-text .split__text { order: 1; }
  .page--terms .split--wide-text .split__media { order: 2; }
  .legal-index .eyebrow, .legal-index ol { display: none; }
  .legal-index { position: static; margin-top: var(--s-6); }
}