/* KamiVerify — /privacy, /contact, /about
   Loaded AFTER kv_faq_bw.css, which already carries the shell: tokens, the
   bar, buttons, the closing band and the footer. Only the prose and the few
   pieces those three pages need are here, so the shell stays in one file. */

.lead{font-size:clamp(1rem,1.5vw,1.125rem);color:var(--muted-fg);max-width:60ch;margin-top:1rem}
.updated{font-family:var(--mono);font-size:.75rem;color:var(--muted-fg);margin-top:1.25rem}

/* two columns on a wide screen: sticky contents, then the prose */
.doc{display:grid;grid-template-columns:1fr;gap:2rem;padding-block:clamp(2rem,4vw,3rem)}
@media (min-width:900px){.doc{grid-template-columns:210px minmax(0,1fr);gap:3rem}}
.toc{align-self:start}
@media (min-width:900px){.toc{position:sticky;top:5rem}}
.toc strong{display:block;font-size:.6875rem;text-transform:uppercase;letter-spacing:.1em;
  font-weight:700;color:var(--muted-fg);font-family:var(--mono);margin-bottom:.75rem}
.toc a{display:block;padding:.375rem 0;font-size:.875rem;color:var(--muted-fg);line-height:1.4}
.toc a:hover{color:var(--fg)}

.prose{min-width:0}
.prose section{padding-bottom:2rem;margin-bottom:2rem;border-bottom:1px solid var(--border)}
.prose section:last-child{padding-bottom:0;margin-bottom:0;border-bottom:0}
.prose h2{font-size:clamp(1.25rem,2.4vw,1.5rem);margin-bottom:.75rem}
.prose h3{font-size:1rem;margin:1.25rem 0 .375rem;font-weight:650;letter-spacing:-.01em}
.prose p{color:var(--muted-fg);max-width:70ch;margin-bottom:.75rem;line-height:1.65}
.prose p:last-child{margin-bottom:0}
.prose b{color:var(--fg);font-weight:600}
.prose ul{margin:.5rem 0 .75rem;padding-left:1.125rem;color:var(--muted-fg);max-width:70ch}
.prose li{margin-bottom:.375rem;line-height:1.6}
.prose li::marker{color:var(--border)}

/* a plain table for "what we collect and why" */
.dtl{width:100%;border-collapse:collapse;font-size:.875rem;margin:.75rem 0;
  border:1px solid var(--border);border-radius:var(--radius);overflow:hidden}
.dtlwrap{overflow-x:auto}
.dtl th{text-align:left;padding:.625rem .875rem;background:var(--muted);color:var(--muted-fg);
  font-size:.6875rem;text-transform:uppercase;letter-spacing:.07em;font-weight:700;
  font-family:var(--mono);white-space:nowrap}
.dtl td{padding:.75rem .875rem;border-top:1px solid var(--border);color:var(--muted-fg);
  vertical-align:top;line-height:1.55}
.dtl td:first-child{color:var(--fg);font-weight:600;white-space:nowrap}

/* the note that says a lawyer should read this */
.note{border:1px solid var(--border);border-left:3px solid var(--fg);border-radius:0 var(--radius) var(--radius) 0;
  background:var(--muted);padding:.875rem 1rem;margin:1rem 0;font-size:.875rem;
  color:var(--muted-fg);line-height:1.6;max-width:70ch}
.note b{color:var(--fg)}

/* contact cards */
.ways{display:grid;gap:.875rem;grid-template-columns:1fr;margin-top:1.5rem}
@media (min-width:720px){.ways{grid-template-columns:repeat(2,1fr)}}
.way{border:1px solid var(--border);border-radius:var(--radius);background:var(--card);
  padding:1.125rem 1.25rem;display:flex;flex-direction:column;gap:.375rem}
.way .k{font-size:.6875rem;text-transform:uppercase;letter-spacing:.09em;font-weight:700;
  color:var(--muted-fg);font-family:var(--mono)}
.way .v{font-size:1.0625rem;font-weight:650;letter-spacing:-.02em}
.way p{font-size:.875rem;color:var(--muted-fg);margin:0;line-height:1.55}
.way .btn{align-self:flex-start;margin-top:.625rem}
.way.wide{grid-column:1/-1}

/* the "what we are not" strip on /about */
.nots{display:grid;gap:.75rem;grid-template-columns:1fr;margin-top:1rem}
@media (min-width:720px){.nots{grid-template-columns:repeat(3,1fr)}}
.not{border:1px solid var(--border);border-radius:var(--radius);padding:.875rem 1rem;background:var(--card)}
.not b{display:block;font-size:.9375rem;margin-bottom:.25rem}
.not span{font-size:.8125rem;color:var(--muted-fg);line-height:1.5;display:block}

/* the numbers strip on /about */
.figs{display:grid;grid-template-columns:repeat(2,1fr);border-top:1px solid var(--border);
  border-bottom:1px solid var(--border)}
@media (min-width:720px){.figs{grid-template-columns:repeat(4,1fr)}}
.fig{padding:1.25rem var(--pad);border-right:1px solid var(--border)}
.fig:last-child{border-right:0}
.fig .n{font-family:var(--mono);font-size:1.5rem;font-weight:700;letter-spacing:-.04em;line-height:1.1;
  font-variant-numeric:tabular-nums}
.fig .l{font-size:.75rem;color:var(--muted-fg);margin-top:.25rem}
@media (max-width:719px){
  .fig{padding-inline:1.25rem;border-bottom:1px solid var(--border)}
  .fig:nth-child(2n){border-right:0}
  .fig:nth-last-child(-n+2){border-bottom:0}
}