/* privacy.css — page-specific layout (shared theme in components.css) */

ul, ol { padding-left: 20px; }
li { margin: 8px 0; }

.policy-main { padding: 36px 0 64px; }
.policy-hero { display: grid; gap: 20px; align-items: start; }
.policy-hero h1 { margin: 0 0 8px; font-size: clamp(32px,4.6vw,44px); }
.policy-date { margin: 0; color: var(--muted); }

.policy-layout { display: grid; gap: 22px; margin-top: 28px; }
.policy-nav { position: sticky; top: 80px; align-self: start; }
.policy-nav h2 { margin: 0 0 12px; font-size: 18px; }
.policy-nav a { display: block; padding: 6px 0; color: var(--ink); }
.policy-nav a:hover { color: var(--indigo); }

.section-card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 22px; box-shadow: var(--shadow-sm); }
.section-card h2 { margin: 0 0 12px; }
.section-card h3 { margin: 18px 0 8px; }
.section-card h4 { margin: 14px 0 6px; }

@media (min-width: 960px) {
  .policy-hero { grid-template-columns: 1.5fr 1fr; }
  .policy-layout { grid-template-columns: 240px 1fr; }
}
@media (max-width: 960px) {
  .policy-nav { position: static; }
  .policy-main { padding: 22px 0 40px; }
  .section-card { padding: 18px; }
}