/* Privacy page: the policy as one long sheet of paper on the desk. */
.doc { max-width: 860px; }
.doc .updated { margin-top: 10px; font-size: 14px; font-weight: 600; color: var(--ink-soft); }
.doc section { margin-top: 40px; }
.doc section > p, .doc section > ul { margin-top: 12px; }
.doc p, .doc li { max-width: 68ch; }
.doc ul { padding-left: 22px; display: grid; gap: 8px; }
.doc a { text-decoration-color: var(--gold); text-decoration-thickness: 2px; }

/* The three promises, ticked in gold like a checklist */
.privacy-facts { list-style: none; margin-top: 30px; padding: 0 !important; display: grid; gap: 0 !important; border-top: 1.5px solid var(--rule); }
.privacy-facts li { position: relative; padding: 14px 0 14px 40px; border-bottom: 1.5px solid var(--rule); font-size: 18px; }
.privacy-facts li::before { content: ""; position: absolute; left: 6px; top: 20px; width: 9px; height: 17px; border-right: 3.5px solid var(--gold); border-bottom: 3.5px solid var(--gold); transform: rotate(40deg); }
.privacy-facts strong { font-family: var(--display); font-weight: 700; }

/* The fine print folds open */
.policy-details details { border-bottom: 1.5px solid var(--rule); }
.policy-details details:first-of-type { margin-top: 14px; border-top: 1.5px solid var(--rule); }
.policy-details summary { position: relative; padding: 16px 36px 16px 0; list-style: none; font: 700 20px/1.3 var(--display); cursor: pointer; }
.policy-details summary::-webkit-details-marker { display: none; }
.policy-details summary::after { content: "+"; position: absolute; right: 4px; top: 12px; font: 700 26px/1 var(--display); color: var(--gold-ink); transition: transform 220ms cubic-bezier(0.23, 1, 0.32, 1); }
.policy-details details[open] summary::after { transform: rotate(45deg); }
.policy-details summary:hover { text-decoration: underline; text-decoration-color: var(--gold); text-underline-offset: 4px; }
.policy-detail-body { display: grid; gap: 12px; padding: 0 0 20px; color: var(--ink); }
.policy-detail-body p, .policy-detail-body li { font-size: 16px; }

.policy-contact { padding-top: 26px; border-top: 1.5px solid var(--rule); }
.policy-contact a { font: 700 26px/1.2 var(--display); }
.policy-contact .small { font-size: 14px; color: var(--ink-soft); }

/* The three promises get a highlighter sweep as they scroll into view */
.privacy-facts strong { background: linear-gradient(transparent 34%, rgba(232, 190, 90, 0.42) 34% 96%, transparent 96%) no-repeat 0 0 / 100% 100%; }
@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    .privacy-facts strong { background-size: 0% 100%; animation: highlight linear both; animation-timeline: view(); animation-range: entry 30% cover 40%; }
    @keyframes highlight { to { background-size: 100% 100%; } }
  }
}