/* Prose pages (about, contact, privacy).
   Built from the same tokens as site.css — nothing new is introduced here, so
   these pages read as part of the same drawing rather than a bolted-on section. */

.prose{
  margin-top:clamp(2rem,4vw,3.25rem);
  max-width:68ch;
  font-size:clamp(1rem,.97rem + .18vw,1.0625rem);
  line-height:1.62;
  letter-spacing:-.011em;
}
.prose > * + *{margin-top:1.15rem}

.prose h1.h2{margin:0 0 .35rem;max-width:18ch}
.prose__lead{color:var(--dim-2);max-width:56ch}
.prose__h{margin-top:clamp(2.5rem,4.5vw,3.5rem)}
.prose h2.h3{max-width:24ch}

.prose p{margin-block:0}
.prose strong{font-weight:600}
.prose code{
  font-family:var(--mono);font-size:.875em;
  background:rgba(32,30,29,.07);padding:.15em .4em;
}

.prose a{color:var(--accent-deep);text-decoration:none;box-shadow:inset 0 -1px 0 currentColor}
.prose a:hover,.prose a:focus-visible{color:var(--ink);box-shadow:inset 0 -2px 0 var(--accent)}

.prose__list{margin-block:0;padding-left:1.15rem}
.prose__list li + li{margin-top:.6rem}
.prose__list li::marker{color:var(--accent)}
ol.prose__list li::marker{font-family:var(--mono);font-size:.8em;color:var(--dim-2)}

.prose__rule{margin-block:clamp(2.5rem,5vw,3.5rem)}

/* Tables can exceed the measure on a phone, so they scroll in their own box
   rather than pushing the page sideways. */
.prose__scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
.prose__table{border-collapse:collapse;width:100%;min-width:34rem;font-size:.9375rem}
.prose__table th,.prose__table td{
  text-align:left;vertical-align:top;padding:.7rem .85rem .7rem 0;
  border-bottom:1px solid var(--line-l);
}
.prose__table th{
  font-family:var(--mono);font-size:.6875rem;font-weight:600;
  text-transform:uppercase;letter-spacing:.07em;
  border-bottom:var(--rule) solid var(--ink);
}

@media (prefers-reduced-motion:reduce){
  .prose a{transition:none}
}

/* Fenced code. Scrolls in its own box so a long curl command cannot widen the
   page on a phone. */
.prose__pre{
  margin:0;padding:1rem 1.1rem;overflow-x:auto;-webkit-overflow-scrolling:touch;
  background:var(--pitch);color:var(--ground);
  font-family:var(--mono);font-size:.8125rem;line-height:1.6;
  letter-spacing:0;tab-size:2;
}
.prose__pre code{background:none;padding:0;font-size:inherit;color:inherit}
.prose__pre[data-lang]::before{
  content:attr(data-lang);display:block;margin-bottom:.6rem;
  font-size:.625rem;font-weight:600;text-transform:uppercase;letter-spacing:.1em;
  color:var(--dim);
}