/* ============================================================
   Legal documents — privacy, terms.
   Plain and readable: one column, generous leading, a quiet
   contents list that sticks beside the text on wide screens.
   ============================================================ */

.doc-hero{padding-top:clamp(7rem,10vw,9rem);padding-bottom:clamp(2rem,4vw,3rem)}
.doc-hero h1{font-family:var(--d);font-weight:400;letter-spacing:-.025em;line-height:1;
  font-size:clamp(2.6rem,6vw,4.6rem);color:var(--ink);margin-top:1rem}
.doc-meta{margin-top:1.4rem;display:flex;flex-wrap:wrap;gap:.6rem 1.6rem;
  font-family:var(--m,ui-monospace),ui-monospace,monospace;font-size:.76rem;letter-spacing:.05em;text-transform:uppercase;color:var(--faint)}
.doc-lead{margin-top:1.6rem;font-size:clamp(1.1rem,1.5vw,1.28rem);line-height:1.65;color:var(--soft);max-width:52ch}

.doc-wrap{display:grid;grid-template-columns:15rem 1fr;gap:clamp(2rem,5vw,5rem);align-items:start;
  padding-bottom:clamp(4rem,8vw,7rem)}
@media(max-width:900px){.doc-wrap{grid-template-columns:1fr}}
.doc-toc{position:sticky;top:6.5rem}
@media(max-width:900px){.doc-toc{position:static;padding-bottom:1.5rem;border-bottom:1px solid var(--line)}}
.doc-toc span{display:block;font-family:var(--m,ui-monospace),ui-monospace,monospace;font-size:.72rem;letter-spacing:.08em;
  text-transform:uppercase;color:var(--faint);margin-bottom:.8rem}
.doc-toc a{display:block;padding:.42rem 0;font-size:.95rem;color:var(--soft);line-height:1.35;transition:color .2s}
.doc-toc a:hover{color:var(--ink)}

.doc-body{max-width:66ch}
.doc-body section{padding-top:clamp(2.2rem,4vw,3.2rem);scroll-margin-top:6rem}
.doc-body section:first-child{padding-top:0}
.doc-body h2{font-family:var(--d);font-weight:400;letter-spacing:-.02em;line-height:1.05;
  font-size:clamp(1.7rem,2.8vw,2.3rem);color:var(--ink)}
.doc-body h3{margin-top:1.6rem;font-family:var(--s);font-weight:700;font-size:1.05rem;letter-spacing:-.01em;color:var(--ink)}
.doc-body p{margin-top:1rem;font-size:1.06rem;line-height:1.7;color:var(--soft)}
.doc-body p b,.doc-body li b{color:var(--ink);font-weight:600}
.doc-body a{color:var(--accent-text);border-bottom:1px solid color-mix(in srgb,var(--accent-text) 35%,transparent)}
.doc-body ul{margin-top:1rem;padding-left:0;list-style:none}
.doc-body li{position:relative;padding-left:1.4rem;margin-top:.6rem;font-size:1.06rem;line-height:1.65;color:var(--soft)}
.doc-body li::before{content:'';position:absolute;left:.3rem;top:.72em;width:5px;height:5px;border-radius:50%;background:var(--accent-text)}

/* the little table used for "what we collect" */
.doc-table{margin-top:1.2rem;border-top:1px solid var(--line)}
.doc-table div{display:grid;grid-template-columns:12rem 1fr;gap:.4rem 1.5rem;padding:.9rem 0;border-bottom:1px solid var(--line)}
@media(max-width:620px){.doc-table div{grid-template-columns:1fr}}
.doc-table b{font-family:var(--s);font-size:.98rem;font-weight:600;color:var(--ink)}
.doc-table span{font-size:1rem;line-height:1.55;color:var(--soft)}

/* anything the company still has to confirm is marked, not guessed */
.doc-fill{background:color-mix(in srgb,var(--amber,#E37F3E) 18%,transparent);border-bottom:1px dashed var(--amber,#E37F3E);
  padding:0 .25em;border-radius:3px;color:var(--ink);font-style:normal}
.doc-note{margin-top:clamp(2.5rem,5vw,3.5rem);padding:1.2rem 1.4rem;border-radius:16px;border:1px dashed var(--line);
  font-size:1rem;line-height:1.6;color:var(--faint);font-style:italic}
