/* About, contact, privacy and developer pages. Same paper, ink and teal as
   landing.css, without the demo parts. */
@import url("https://fonts.googleapis.com/css2?family=Literata:opsz,wght@7..72,400..700&display=swap");
:root { color-scheme: light; --paper:#fcfcf9; --line:#e1e3dc; --ink:#17202e; --ink-2:#4a5465; --brand:#0e6b5f; --brand-hover:#0a564c; --on-brand:#fff; --sunk:#f2f3ee; --focus:#1f5fbf; }
@media (prefers-color-scheme: dark) { :root { color-scheme: dark; --paper:#12161d; --line:#283040; --ink:#e9edf3; --ink-2:#b8c0cc; --brand:#4fc3ae; --brand-hover:#74d4c2; --on-brand:#06201b; --sunk:#0e1117; --focus:#8ab4ff; } }
* { box-sizing:border-box; }
body { margin:0; background:var(--paper); color:var(--ink); font:17px/1.7 Literata,Georgia,"Times New Roman",serif; -webkit-font-smoothing:antialiased; }
.wrap { width:min(100% - 2rem, 46rem); margin:auto; }
header, footer { border-color:var(--line); border-style:solid; border-width:0 0 1px; }
nav { min-height:4rem; display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.brand { color:var(--ink); font:600 1.35rem/1 Literata,Georgia,serif; text-decoration:none; }
.brand span { color:inherit; }
a { color:var(--brand); text-underline-offset:.18em; } a:hover { color:var(--brand-hover); }
:focus-visible { outline:2px solid var(--focus); outline-offset:2px; border-radius:6px; }
.button { display:inline-flex; align-items:center; min-height:40px; border-radius:999px; padding:0 1rem; color:var(--on-brand); background:var(--brand); font-weight:600; text-decoration:none; white-space:nowrap; } .button:hover { color:var(--on-brand); background:var(--brand-hover); }
main { padding:4rem 0; }
h1, h2 { font-family:Literata,Georgia,serif; font-weight:500; letter-spacing:-.015em; text-wrap:balance; }
h1 { font-size:clamp(2.2rem,1.5rem + 3vw,3.5rem); line-height:1.05; margin:.3rem 0 1.2rem; } h2 { font-size:1.6rem; line-height:1.2; margin:2.8rem 0 .6rem; }
p, li { color:var(--ink-2); } strong { color:var(--ink); }
code { padding:.1em .35em; border-radius:6px; background:var(--sunk); font-size:.92em; }
footer { border-width:1px 0 0; padding:2rem 0 3rem; font-size:.92rem; color:var(--ink-2); background:var(--sunk); }
