/* Page styles for privacy (owner: see CONTRIBUTING.md). Shared tokens live in /assets/site.css.
   Reading page (DESIGN_SYSTEM.md rule 2): warm white, 65ch measure, no motion. */

.privacy-head { padding-block: clamp(3rem, 1.5rem + 5vw, 6rem) clamp(2rem, 1rem + 3vw, 3.5rem);
  border-bottom: 1px solid var(--rule); }
.privacy-head h1 { max-width: 14ch; margin-bottom: 0.4em; }
.privacy-head .draft-note { margin-bottom: 1.5rem; }
.privacy-date { font-weight: 650; color: var(--navy); margin-bottom: 0.75rem; }
.privacy-intro { color: var(--slate); }

.privacy-layout { display: grid; gap: 2.5rem; padding-block: clamp(2.5rem, 1.5rem + 3vw, 4.5rem) var(--section); }

/* Contents: a plain ruled list; sticky beside the text on wide screens. */
.privacy-toc-title { font-weight: 700; color: var(--navy); margin-bottom: 0.5rem; }
.privacy-toc ul { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--rule); }
.privacy-toc li { position: relative; max-width: none; border-bottom: 1px solid var(--rule); }
.privacy-toc li::before { content: ""; position: absolute; top: -1px; left: 0; width: 1.5rem; height: 2px; background: var(--teal); }
.privacy-toc a { display: block; padding: 0.7rem 0; font-size: var(--step-0); font-weight: 600; text-decoration: none; }
.privacy-toc a:hover { text-decoration: underline; text-decoration-color: var(--teal); }

.privacy-text { max-width: 65ch; min-width: 0; }
.privacy-text section { padding-top: 2.25rem; margin-top: 2.25rem; border-top: 1px solid var(--rule); scroll-margin-top: 6rem; }
.privacy-text section:first-child { padding-top: 0; margin-top: 0; border-top: 0; }
.privacy-text h2 { font-size: var(--step-3); line-height: 1.1; margin-bottom: 0.75em; }

/* Stored items: a ruled list, each line marked with a small teal ring. */
#stored-fields { list-style: none; margin: 0 0 1.5rem; padding: 0; border-bottom: 1px solid var(--rule); }
#stored-fields li { position: relative; padding: 0.65rem 0 0.65rem 1.5rem; border-top: 1px solid var(--rule); }
#stored-fields li::before { content: ""; position: absolute; left: 0; top: 1.3rem; width: 0.55rem; height: 0.55rem;
  border-radius: 50%; border: 2px solid var(--teal); }

.privacy-list { padding-left: 1.25rem; }
.privacy-list li { margin-bottom: 0.5rem; }

.privacy-callout { background: var(--mint); color: var(--navy); padding: 1rem 1.25rem; border-left: 4px solid var(--teal);
  border-radius: 0 var(--radius-small) var(--radius-small) 0; }

@media (min-width: 64rem) {
  .privacy-layout { grid-template-columns: 15rem minmax(0, 65ch); gap: 4rem; }
  .privacy-toc { position: sticky; top: 6rem; align-self: start; }
}