/* static/css/policy.css */
:root{
  --bg:#0f0f10;
  --card:#161618;
  --text:#e9e9ea;
  --muted:#9aa0a6;
  --brand:#ff8a65; /* peach-ish accent; tweak to your palette */
  --border:#232327;
}

@media (prefers-color-scheme: light){
  :root{
    --bg:#ffffff;
    --card:#f8f9fb;
    --text:#1a1b1e;
    --muted:#5f6b7a;
    --border:#e6e8ef;
  }
}

.policy-wrap{
  background:var(--bg);
  color:var(--text);
  min-height:60vh;
  padding: 120px 0 60px; /* space for fixed header if any */
}

.policy-hero{
  text-align:center;
  margin-bottom: 28px;
}
.policy-hero .eyebrow{
  color:var(--muted);
  font-size:.85rem;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.policy-hero h1{
  margin:.25rem 0 0;
  letter-spacing:.02em;
}

.policy-card{
  background:var(--card);
  border:1px solid var(--border);
  border-radius:16px;
  padding:24px;
}

.policy-toc{
  background:transparent;
  border:1px dashed var(--border);
  border-radius:14px;
  padding:16px;
  margin-bottom:18px;
}
.policy-toc a{
  color:var(--muted);
  text-decoration:none;
}
.policy-toc a:hover{ color:var(--text); }

.policy h2, .policy h3{
  scroll-margin-top: 92px; /* so anchor links don't hide under header */
}
.policy h2{ margin-top: 26px; }
.policy h3{ margin-top: 22px; }

.policy a{
  color:var(--brand);
  text-decoration: none;
}
.policy a:hover{ text-decoration: underline; }

.policy ul, .policy ol{
  padding-left: 1.25rem;
}

.policy .muted{
  color:var(--muted);
}

.divider{
  height:1px; background:var(--border); margin: 14px 0;
}