/* LIBRERE LLC — librere.com
   Shared stylesheet. System fonts only (no third-party font requests). */

:root{
  --ink:#1a1a1a;
  --muted:#5c5c5c;
  --faint:#8a8880;
  --paper:#faf9f6;
  --panel:#ffffff;
  --line:#dcdad4;
  --hair:#eae8e2;
  --focus:#1a1a1a;
  --accent:#7a5230;
}
@media (prefers-color-scheme: dark){
  :root{
    --ink:#eae7e0;
    --muted:#a8a59d;
    --faint:#75736c;
    --paper:#151412;
    --panel:#1b1a17;
    --line:#37352f;
    --hair:#2a2925;
    --focus:#eae7e0;
    --accent:#c99a68;
  }
}
:root[data-theme="dark"]{
  --ink:#eae7e0; --muted:#a8a59d; --faint:#75736c;
  --paper:#151412; --panel:#1b1a17; --line:#37352f; --hair:#2a2925;
  --focus:#eae7e0; --accent:#c99a68;
}
:root[data-theme="light"]{
  --ink:#1a1a1a; --muted:#5c5c5c; --faint:#8a8880;
  --paper:#faf9f6; --panel:#ffffff; --line:#dcdad4; --hair:#eae8e2;
  --focus:#1a1a1a; --accent:#7a5230;
}

*{ box-sizing:border-box }
html,body{ margin:0; padding:0 }
body{
  background:var(--paper);
  color:var(--ink);
  font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}

.wrap{ max-width:780px; margin:0 auto; padding:0 24px }

a{ color:var(--ink); text-decoration-color:var(--faint); text-underline-offset:3px }
a:hover{ text-decoration-color:var(--ink) }
a:focus-visible{ outline:2px solid var(--focus); outline-offset:3px; border-radius:2px }

/* ---------- site header ---------- */
.site-header{
  border-bottom:1px solid var(--line);
  padding:22px 0;
}
.site-header .wrap{
  display:flex; align-items:baseline; justify-content:space-between; flex-wrap:wrap; gap:10px 24px;
}
.wordmark{
  font-family: Georgia, "Iowan Old Style", "Palatino Linotype", "Times New Roman", serif;
  font-size:1.15rem;
  font-weight:600;
  letter-spacing:.04em;
  text-decoration:none;
  color:var(--ink);
}
.site-nav{ display:flex; gap:20px; flex-wrap:wrap }
.site-nav a{
  font-size:.82rem;
  letter-spacing:.05em;
  text-transform:uppercase;
  color:var(--muted);
  text-decoration:none;
}
.site-nav a:hover{ color:var(--ink) }

/* ---------- main content rhythm ---------- */
main{ padding:48px 0 64px }
main.doc{ max-width:none }

/* NOTE: sections are separated by <hr class="rule">, so `section + section` never
   matched — the hr breaks adjacency. Spacing lives on the rule itself, symmetric,
   so every band is spaced the same regardless of whether the last element in a
   section happens to carry a bottom margin. */
section > *:last-child{ margin-bottom:0 }

.eyebrow{
  font-size:.72rem;
  font-weight:600;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--muted);
  margin:0 0 10px;
}

h1{
  font-family: Georgia, "Iowan Old Style", "Palatino Linotype", "Times New Roman", serif;
  font-size:2rem;
  line-height:1.2;
  margin:0 0 14px;
}
h2{
  font-family: Georgia, "Iowan Old Style", "Palatino Linotype", "Times New Roman", serif;
  font-size:1.3rem;
  margin:0 0 14px;
}
h3{ font-size:1rem; margin:0 0 6px; }

p{ margin:0 0 16px; color:var(--ink) }
p.lede{ font-size:1.08rem; color:var(--muted); max-width:56ch }

hr.rule{ border:0; border-top:1px solid var(--hair); margin:44px 0 }

/* ---------- brand cards ---------- */
.brand-grid{
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  gap:1px;
  background:var(--line);
  border:1px solid var(--line);
  margin-top:24px;
}
.brand-card{
  background:var(--panel);
  padding:20px 22px;
  display:flex;
  flex-direction:column;
  gap:6px;
}
.brand-card .name{
  font-family: Georgia, "Iowan Old Style", "Palatino Linotype", "Times New Roman", serif;
  font-size:1.05rem;
  font-weight:600;
}
.brand-card .desc{ font-size:.9rem; color:var(--muted); margin:0 }
.brand-card .status{
  font-size:.7rem;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--faint);
  margin-top:auto;
  padding-top:8px;
}
.brand-card .status a{ color:var(--accent); text-decoration:none; font-weight:600 }
.brand-card .status a:hover{ text-decoration:underline }

@media (max-width:560px){
  .brand-grid{ grid-template-columns:1fr }
}

/* ---------- fields (entity/record style) ---------- */
.fields{
  display:flex;
  flex-direction:column;
  gap:22px;
  margin-top:8px;
}
.field{ display:flex; flex-direction:column; gap:4px }
.field .label{
  font-size:.68rem;
  font-weight:600;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--muted);
}
.field .value{ font-size:1rem }
.field.descriptor .value{ font-size:1.1rem; font-weight:600; letter-spacing:.06em }

/* ---------- policy documents ---------- */
.doc-meta{
  font-size:.82rem;
  color:var(--muted);
  margin-bottom:32px;
}
article.policy h2{ margin-top:0 }
article.policy section{ margin-top:36px }
article.policy ul{ padding-left:20px; color:var(--ink) }
article.policy li{ margin-bottom:8px }

/* ---------- footer ---------- */
.site-footer{
  border-top:1px solid var(--line);
  padding:28px 0 40px;
  font-size:.82rem;
  color:var(--muted);
}
.site-footer .wrap{
  display:flex;
  flex-direction:column;
  gap:14px;
}
.footer-links{ display:flex; gap:18px; flex-wrap:wrap }
.footer-links a{ color:var(--muted); text-decoration:none }
.footer-links a:hover{ color:var(--ink) }
.footer-note{ color:var(--faint); font-size:.78rem; max-width:62ch }

@media (max-width:560px){
  .wrap{ padding:0 18px }
  main{ padding:36px 0 48px }
  h1{ font-size:1.65rem }
  hr.rule{ margin:32px 0 }
}