/* IOLTAwise: white page, oxblood binding, bank-green check marks. System humanist + Palatino-style serif. */
:root {
  --page: #ffffff;
  --vellum: #f1f3f4;
  --vellum-line: #d7dbdd;
  --ink: #1f1d21;
  --copy: #3f3b42;
  --soft: #635d66;
  --oxblood: #6d2233;
  --oxblood-deep: #4f1824;
  --agree: #2e6b4f;
  --hair: #868089;
  --heading: "Palatino Linotype", Palatino, "Book Antiqua", "URW Palladio L", "P052", Georgia, serif;
  --body: Candara, Optima, "Segoe UI", "Gill Sans", "Noto Sans", "DejaVu Sans", sans-serif;
}
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body { margin: 0; background: var(--page); color: var(--copy); font: 400 1.0625rem/1.65 var(--body); }
@media (min-width: 48em) { body { font-size: 1.15rem; } }

.wrap { max-width: 64rem; margin: 0 auto; padding: 0 1.1rem; }
@media (min-width: 48em) { .wrap { padding: 0 2rem; } }

h1, h2, h3 { font-family: var(--heading); color: var(--ink); line-height: 1.18; font-weight: 700; text-wrap: balance; }
h1 { font-size: clamp(2rem, 4.8vw, 2.75rem); margin: 0.2rem 0 0.7rem; }
h2 { font-size: 1.6rem; margin: 2.6rem 0 0.6rem; }
h3 { font-size: 1.25rem; margin: 1.8rem 0 0.4rem; }
p, ul, ol { margin: 0 0 1.05rem; }

a { color: var(--oxblood); text-decoration-thickness: 1px; text-underline-offset: 0.2em; }
a:hover { color: var(--oxblood-deep); text-decoration-thickness: 2px; }
:focus-visible { outline: 3px solid var(--oxblood); outline-offset: 3px; }

.skiplink { position: absolute; left: 1rem; top: -4rem; background: var(--ink); color: #fff; padding: 0.7rem 1rem; z-index: 3; }
.skiplink:focus { top: 0.6rem; }

/* Banner: an oxblood spine across the top */
.banner { border-top: 8px solid var(--oxblood); border-bottom: 1px solid var(--vellum-line); }
.banner-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0 1.6rem; padding-top: 0.4rem; padding-bottom: 0.4rem; }
.nameplate { font: 700 1.55rem/1 var(--heading); text-decoration: none; display: inline-flex; align-items: baseline; min-height: 48px; padding-top: 0.75rem; }
.nameplate-iolta { color: var(--ink); letter-spacing: 0.06em; }
.nameplate-wise { color: var(--oxblood); font-style: italic; margin-left: 0.05em; }
.banner-nav { display: flex; flex-wrap: wrap; gap: 0 1.3rem; }
.banner-nav a { display: inline-flex; align-items: center; min-height: 44px; color: var(--ink); text-decoration: none; }
.banner-nav a:hover { color: var(--oxblood); text-decoration: underline; }

main.wrap { padding-top: 2.4rem; }

/* Home: three balances that must agree */
.intro { max-width: 40rem; }
.intro .lead { font-size: 1.2rem; }
.three-way { margin: 2rem 0 1rem; }
.three-way-title { font: 700 1.2rem var(--heading); color: var(--ink); margin: 0 0 0.8rem; }
.columns { display: grid; gap: 1rem; }
@media (min-width: 50em) { .columns { grid-template-columns: repeat(3, 1fr); } }
.column { border: 1px solid var(--vellum-line); border-top: 4px solid var(--ink); padding: 0.9rem 1rem 0.5rem; }
.column h3 { font-size: 1.05rem; margin: 0 0 0.5rem; }
.column table { width: 100%; border-collapse: collapse; font-size: 0.97rem; font-variant-numeric: tabular-nums; }
.column td { padding: 0.3rem 0; border-bottom: 1px solid var(--vellum-line); }
.column td.amt { text-align: right; white-space: nowrap; padding-left: 0.6rem; }
.column tr.total td { font-weight: 700; color: var(--ink); border-bottom: 0; border-top: 2px solid var(--ink); }
.agree { display: flex; align-items: center; gap: 0.6rem; margin: 0.9rem 0 0.4rem; font-weight: 700; color: var(--agree); }
.agree::before { content: ""; width: 1.4rem; height: 1.4rem; border-radius: 50%; background: var(--agree); flex: none; }
.three-way .fine { font-size: 0.97rem; color: var(--soft); max-width: 36rem; }

.shelves { display: grid; gap: 0 2.5rem; }
@media (min-width: 48em) { .shelves { grid-template-columns: 1fr 1fr; } }
.shelf ul { list-style: none; margin: 0 0 1.4rem; padding: 0; }
.shelf li { border-bottom: 1px solid var(--vellum-line); }
.shelf a { display: inline-flex; align-items: center; min-height: 48px; }
.kind { font-size: 0.9rem; color: var(--soft); }
main > p { max-width: 40rem; }

/* Library pages */
.folio { max-width: 39rem; }
.queue-flag { background: var(--oxblood); color: #fff; padding: 0.6rem 0.9rem; font-weight: 700; }
.path { font-size: 0.97rem; color: var(--soft); margin: 0; }
.path a { display: inline-block; padding: 0.68rem 0; }
.reviewed { font-size: 0.97rem; color: var(--soft); max-width: 34rem; }
.holding { border: 1px solid var(--vellum-line); border-left: 6px solid var(--oxblood); padding: 0.9rem 1.1rem 0.2rem; margin: 1.3rem 0 1.5rem; }
.holding-title { font: 700 1.08rem var(--heading); color: var(--ink); margin: 0 0 0.3rem; }
.outline { background: var(--vellum); padding: 0.8rem 1.1rem 0.5rem; margin: 0 0 1.8rem; font-size: 0.97rem; }
.outline-title { font: 700 1rem var(--heading); color: var(--ink); margin: 0; }
.outline ol { margin: 0; padding-left: 1.3rem; }
.outline a { display: inline-block; padding: 0.62rem 0; }
.ledger { width: 100%; border-collapse: collapse; font-size: 0.97rem; font-variant-numeric: tabular-nums; margin-bottom: 1.1rem; }
.ledger th, .ledger td { text-align: left; padding: 0.45rem 0.55rem; border-bottom: 1px solid var(--vellum-line); }
.ledger thead th { background: var(--vellum); color: var(--ink); border-bottom: 2px solid var(--ink); }
.ledger .amt { text-align: right; white-space: nowrap; }
.table-scroll { overflow-x: auto; }
.matter { border: 1px dashed var(--hair); padding: 0.9rem 1.1rem 0.3rem; margin: 1.6rem 0; }
.matter-title { font: 700 1.05rem var(--heading); color: var(--ink); margin: 0 0 0.3rem; }
.pitfalls { border-top: 3px solid var(--oxblood); padding-top: 0.6rem; margin: 2rem 0; }
.pitfalls-title { font: 700 1.1rem var(--heading); color: var(--ink); margin: 0 0 0.3rem; }
.authorities { font-size: 0.97rem; max-width: 36rem; }
.authorities li { margin-bottom: 0.4rem; }
.authorities a { display: inline-block; padding: 0.62rem 0; }
.caveat { margin-top: 2.6rem; background: var(--vellum); padding: 0.9rem 1.1rem 0.1rem; font-size: 0.97rem; }

/* Worksheets */
.sheet-form { border: 1px solid var(--vellum-line); padding: 1rem 1.2rem; margin: 1.4rem 0; }
.sheet-form label { display: block; font-weight: 700; color: var(--ink); margin: 0.85rem 0 0.25rem; }
.sheet-form .hint { display: block; font-size: 0.97rem; color: var(--soft); }
.sheet-form input { font: inherit; font-size: 1rem; min-height: 44px; width: 100%; max-width: 15rem; padding: 0.4rem 0.6rem; border: 1px solid var(--hair); border-radius: 2px; color: var(--ink); background: #fff; }
.sheet-form button { display: block; font: 700 1rem var(--body); min-height: 48px; margin-top: 1rem; padding: 0 1.3rem; border: 2px solid var(--oxblood); background: var(--oxblood); color: #fff; border-radius: 2px; cursor: pointer; }
.sheet-form button:hover { background: var(--oxblood-deep); }
.sheet-form output { display: block; margin-top: 1rem; font-size: 1.1rem; color: var(--ink); }

/* Fixed pages */
.notice { max-width: 39rem; }
.notice .effective { color: var(--soft); font-size: 0.97rem; }

.baseline { margin-top: 5rem; border-top: 8px solid var(--oxblood); background: var(--vellum); }
.baseline .wrap { padding-top: 1.8rem; padding-bottom: 2rem; }
.baseline p:first-child { max-width: 40rem; }
.baseline-links { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: 0 1.4rem; }
.baseline-links a { display: inline-flex; align-items: center; min-height: 44px; }
.baseline-small { margin: 0; font-size: 0.97rem; color: var(--soft); }
.visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
@media (prefers-reduced-motion: reduce) { * { transition: none !important; scroll-behavior: auto !important; } }
.caveat { max-width: 36rem; }
