/* Sunfile (newsinohio.com) v1 design system. Paper, ink and marigold; Literata for letters and headings,
   Schibsted Grotesk for the interface. Designed for this product only (SPEC 3); nothing here comes from a sibling kit. */

@font-face { font-family: "Literata"; src: url("/assets/fonts/literata-latin-var.woff2") format("woff2"); font-weight: 300 800; font-style: normal; font-display: swap; }
@font-face { font-family: "Literata"; src: url("/assets/fonts/literata-latin-var-italic.woff2") format("woff2"); font-weight: 300 800; font-style: italic; font-display: swap; }
@font-face { font-family: "Schibsted Grotesk"; src: url("/assets/fonts/schibsted-latin-var.woff2") format("woff2"); font-weight: 400 900; font-style: normal; font-display: swap; }

:root {
  --paper: #FBF6EC;
  --paper-2: #F4ECDB;
  --paper-3: #EADFC7;
  --sheet: #FFFDF8;
  --ink: #1C2640;
  --ink-2: #3D4763;
  --ink-3: #5F6780;
  --rule: #DCCFB2;
  --sun: #F2B33D;
  --sun-2: #F7CF7A;
  --sun-deep: #8A5A00;
  --clay: #B9502F;
  --clay-bg: #F8E3D8;
  --sage: #3F7356;
  --sage-bg: #E1EEE3;
  --sky: #DCE6F2;
  --serif: "Literata", Georgia, "Times New Roman", serif;
  --sans: "Schibsted Grotesk", "Segoe UI", system-ui, -apple-system, sans-serif;
  --r: 14px;
  --r-sm: 8px;
  --shadow: 0 1px 0 rgba(28, 38, 64, .06), 0 10px 30px -12px rgba(28, 38, 64, .22);
  --wrap: 1180px;
}

*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--paper); color: var(--ink); font: 400 1.0625rem/1.6 var(--sans); }
img, svg { max-width: 100%; height: auto; }
a { color: var(--ink); text-decoration-color: var(--sun); text-decoration-thickness: 2px; text-underline-offset: 3px; }
a:hover { text-decoration-color: var(--ink); }
:focus-visible { outline: 3px solid var(--sun); outline-offset: 2px; border-radius: 4px; }
h1, h2, h3 { font-family: var(--serif); font-weight: 600; line-height: 1.12; letter-spacing: -0.015em; margin: 0 0 .5em; }
h1 { font-size: clamp(2.3rem, 5.2vw, 4.25rem); }
h2 { font-size: clamp(1.65rem, 3vw, 2.4rem); }
h3 { font-size: 1.3rem; }
p { margin: 0 0 1em; }
.wrap { max-width: var(--wrap); margin: 0 auto; padding: 0 24px; }
.skip { position: absolute; left: -999px; top: 8px; background: var(--ink); color: var(--paper); padding: 8px 14px; z-index: 9; }
.skip:focus { left: 8px; }
.eyebrow { font: 700 .78rem/1.2 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--sun-deep); margin: 0 0 14px; }
.lead { font-size: 1.22rem; color: var(--ink-2); max-width: 36em; }
.muted { color: var(--ink-3); }
.small { font-size: .9rem; }
.serif { font-family: var(--serif); }
.nowrap { white-space: nowrap; }

/* ---------- header ---------- */
.top { border-bottom: 1px solid var(--rule); background: var(--paper); }
.top__in { display: flex; align-items: center; gap: 28px; min-height: 76px; }
.brand { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; color: var(--ink); }
.brand__sun { width: 40px; height: 40px; flex: none; }
.brand__name { font: 650 1.6rem/1 var(--serif); letter-spacing: -0.02em; }
.brand__name em { font-style: italic; font-weight: 500; color: var(--sun-deep); }
.nav { display: flex; gap: 4px 22px; flex-wrap: wrap; margin-left: auto; align-items: center; }
.nav a { font-weight: 600; font-size: .98rem; text-decoration: none; color: var(--ink-2); padding: 6px 0; border-bottom: 2px solid transparent; }
.nav a:hover { color: var(--ink); border-bottom-color: var(--sun-2); }
.nav a[aria-current="page"] { color: var(--ink); border-bottom-color: var(--sun); }
.nav .nav__cta { background: var(--ink); color: var(--paper); padding: 9px 16px; border-radius: 999px; border: 0; }
.nav .nav__cta:hover, .nav .nav__cta[aria-current="page"] { background: #2B3758; color: #fff; border-bottom: 0; }
.ribbon { background: var(--ink); color: #EDE6D6; font-size: .9rem; }
.ribbon__in { display: flex; gap: 8px 22px; flex-wrap: wrap; padding: 9px 24px; align-items: baseline; }
.ribbon strong { color: var(--sun-2); font-weight: 700; }
.ribbon a { color: #fff; text-decoration-color: var(--sun); }

/* ---------- buttons ---------- */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; padding: 0 22px; border-radius: 999px;
  font: 700 1rem/1 var(--sans); text-decoration: none; cursor: pointer; border: 2px solid var(--ink); background: transparent; color: var(--ink); }
.btn:hover { background: var(--paper-2); }
.btn--sun { background: var(--sun); border-color: var(--sun); color: var(--ink); }
.btn--sun:hover { background: #E9A51F; border-color: #E9A51F; }
.btn--ink { background: var(--ink); color: var(--paper); }
.btn--ink:hover { background: #2B3758; }
.btn--quiet { border-color: var(--rule); font-weight: 600; }
.btn--danger { border-color: var(--clay); color: var(--clay); }
.btn--danger:hover { background: var(--clay-bg); }
.btn--sm { min-height: 38px; padding: 0 16px; font-size: .92rem; }
.btns { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }

/* ---------- hero (home) ---------- */
.hero { position: relative; overflow: hidden; background: radial-gradient(120% 90% at 82% 8%, #FCE6B3 0%, rgba(252, 230, 179, 0) 58%), var(--paper); }
.hero__in { display: grid; grid-template-columns: 1.08fr .92fr; gap: 48px; align-items: center; padding-top: 72px; padding-bottom: 80px; }
.hero h1 { margin-bottom: .35em; }
.hero h1 em { font-weight: 450; color: var(--ink-2); display: block; }
.hero__note { margin-top: 22px; color: var(--ink-3); font-size: .95rem; }
.hero__art { position: relative; }
.hero__art svg { display: block; width: 100%; filter: drop-shadow(0 24px 40px rgba(28, 38, 64, .16)); }

/* ---------- section scaffolding ---------- */
.band { padding: 88px 0; }
.band--tint { background: var(--paper-2); border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule); }
.band--sheet { background: var(--sheet); border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule); }
.band__head { max-width: 760px; margin-bottom: 44px; }
.band__head p { color: var(--ink-2); font-size: 1.12rem; }

/* ---------- the tracker (FedEx-style ladder) ---------- */
.track { background: var(--sheet); border: 1px solid var(--rule); border-radius: var(--r); box-shadow: var(--shadow); padding: 28px 32px; }
.track__top { display: flex; justify-content: space-between; gap: 24px; align-items: flex-start; flex-wrap: wrap; margin-bottom: 26px; }
.track__office { font: 600 1.35rem/1.25 var(--serif); margin: 4px 0 6px; }
.track__meta { color: var(--ink-3); font-size: .95rem; margin: 0; }
.track__count { text-align: right; }
.track__n { font: 600 3.4rem/1 var(--serif); letter-spacing: -0.03em; display: block; }
.track__nl { font-size: .9rem; color: var(--ink-3); font-weight: 600; }
.tag { display: inline-block; font: 700 .72rem/1 var(--sans); letter-spacing: .12em; text-transform: uppercase; padding: 6px 9px; border-radius: 5px; background: var(--paper-3); color: var(--ink-2); }
.tag--sun { background: #FBE3AE; color: var(--sun-deep); }
.tag--clay { background: var(--clay-bg); color: var(--clay); }
.tag--sage { background: var(--sage-bg); color: var(--sage); }
.ladder { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); position: relative; counter-reset: step; }
.ladder::before { content: ""; position: absolute; left: 12.5%; right: 12.5%; top: 15px; height: 4px; background: var(--paper-3); border-radius: 2px; }
.ladder li { position: relative; text-align: center; padding-top: 44px; font-size: .92rem; color: var(--ink-3); font-weight: 600; }
.ladder li::before { counter-increment: step; content: counter(step); position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 34px; height: 34px; border-radius: 50%;
  background: var(--sheet); border: 3px solid var(--paper-3); display: grid; place-items: center; font: 700 .9rem/28px var(--sans); color: var(--ink-3); z-index: 1; }
.ladder li.is-done { color: var(--ink); }
.ladder li.is-done::before { content: "\2713"; background: var(--sun); border-color: var(--sun); color: var(--ink); }
.ladder li.is-now { color: var(--ink); }
.ladder li.is-now::before { border-color: var(--ink); color: var(--ink); background: #FFF6DF; }
.ladder li.is-end::before { content: "\2715"; background: var(--clay); border-color: var(--clay); color: #fff; }
.ladder li.is-filled::before { content: "\2713"; background: var(--sage); border-color: var(--sage); color: #fff; }
.ladder li small { display: block; font-weight: 500; color: var(--ink-3); font-size: .82rem; margin-top: 2px; }
.ladder[data-reach="2"]::after, .ladder[data-reach="3"]::after, .ladder[data-reach="4"]::after { content: ""; position: absolute; left: 12.5%; top: 15px; height: 4px; background: var(--sun); border-radius: 2px; }
.ladder[data-reach="2"]::after { width: 25%; }
.ladder[data-reach="3"]::after { width: 50%; }
.ladder[data-reach="4"]::after { width: 75%; }
.track__foot { display: flex; flex-wrap: wrap; gap: 10px 26px; margin-top: 26px; padding-top: 18px; border-top: 1px dashed var(--rule); font-size: .95rem; }
.track__foot b { font-weight: 700; }
.is-overdue { color: var(--clay); }

/* ---------- statute lines ---------- */
.laws { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, 1fr); gap: 0 56px; counter-reset: law; }
.laws li { counter-increment: law; display: grid; grid-template-columns: 56px 1fr; gap: 6px 14px; padding: 22px 0; border-top: 1px solid var(--rule); }
.laws li::before { content: counter(law); font: 500 2.1rem/1 var(--serif); color: var(--sun-deep); grid-row: span 2; }
.laws p { margin: 0; font-size: 1.05rem; }
.laws strong { font-family: var(--serif); font-weight: 600; font-size: 1.15rem; display: block; margin-bottom: 4px; }
.cite { display: inline-block; font: 700 .76rem/1 var(--sans); letter-spacing: .04em; text-decoration: none; color: var(--ink); background: var(--sky); border-radius: 5px; padding: 5px 8px; margin-top: 8px; white-space: nowrap; }
.laws li .cite { grid-column: 2; justify-self: start; align-self: start; }
.cite:hover { background: #C8D7EA; }
blockquote.q { margin: 10px 0 0; padding: 0 0 0 16px; border-left: 3px solid var(--sun); font: italic 400 1.02rem/1.55 var(--serif); color: var(--ink-2); }

/* ---------- folder cards (manila tabs) ---------- */
.folders { display: grid; grid-template-columns: repeat(3, 1fr); gap: 34px 26px; }
.folder { position: relative; background: #F6E3B9; border-radius: 0 var(--r) var(--r) var(--r); padding: 28px 26px 26px; margin-top: 22px; }
.folder::before { content: attr(data-tab); position: absolute; top: -26px; left: 0; height: 27px; padding: 0 18px; background: #F6E3B9; border-radius: 10px 10px 0 0;
  font: 700 .74rem/27px var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--sun-deep); }
.folder--blue, .folder--blue::before { background: #DCE6F2; }
.folder--blue::before { color: #2C4A72; }
.folder--sage, .folder--sage::before { background: #DDEBDF; }
.folder--sage::before { color: var(--sage); }
.folder h3 { margin-bottom: .4em; }
.folder p:last-child { margin-bottom: 0; }

/* ---------- pricing ---------- */
.plans { display: grid; grid-template-columns: 1fr 1fr; gap: 26px; max-width: 920px; }
.plan { background: var(--sheet); border: 1px solid var(--rule); border-radius: var(--r); padding: 30px 30px 26px; display: flex; flex-direction: column; }
.plan--pass { border: 2px solid var(--ink); box-shadow: var(--shadow); position: relative; }
.plan__name { font: 600 1.45rem/1.2 var(--serif); margin: 0 0 6px; }
.plan__price { font: 600 3rem/1 var(--serif); letter-spacing: -0.03em; margin: 12px 0 2px; }
.plan__price span { font: 600 1rem/1 var(--sans); letter-spacing: 0; color: var(--ink-3); }
.plan__alt { color: var(--ink-2); font-weight: 600; margin: 0 0 16px; }
.plan ul { list-style: none; padding: 0; margin: 0 0 20px; }
.plan li { padding: 7px 0 7px 28px; position: relative; border-top: 1px solid var(--paper-3); }
.plan li::before { content: ""; position: absolute; left: 4px; top: 15px; width: 12px; height: 7px; border-left: 2.5px solid var(--sage); border-bottom: 2.5px solid var(--sage); transform: rotate(-45deg); }
.plan__foot { margin-top: auto; font-size: .92rem; color: var(--ink-3); }
.preview { display: flex; gap: 14px; align-items: flex-start; background: #FFF4D9; border: 1px solid #EBCB84; border-radius: var(--r-sm); padding: 14px 18px; margin: 22px 0 0; max-width: 920px; }
.preview svg { flex: none; width: 26px; height: 26px; margin-top: 2px; }
.preview p { margin: 0; }
.pricenote { display: flex; flex-wrap: wrap; gap: 6px 14px; align-items: baseline; background: #FFF4D9; border-left: 4px solid var(--sun); padding: 12px 16px; border-radius: 0 var(--r-sm) var(--r-sm) 0; font-size: .95rem; margin: 0 0 24px; }
.pricenote a { font-weight: 700; }

/* ---------- forms ---------- */
.formgrid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px 22px; }
.field { display: flex; flex-direction: column; gap: 6px; }
.field--full { grid-column: 1 / -1; }
.field label, .field legend { font-weight: 700; font-size: .98rem; }
.field .hint { font-size: .88rem; color: var(--ink-3); margin: 0; }
input[type=text], input[type=date], input[type=number], select, textarea {
  font: 400 1.02rem/1.4 var(--sans); color: var(--ink); background: #fff; border: 1.5px solid #CDBF9F; border-radius: var(--r-sm); padding: 11px 13px; width: 100%; }
textarea { min-height: 130px; resize: vertical; font-family: var(--serif); font-size: 1.05rem; line-height: 1.55; }
input:focus, select:focus, textarea:focus { border-color: var(--ink); outline: 3px solid rgba(242, 179, 61, .5); outline-offset: 0; }
fieldset { border: 0; padding: 0; margin: 0; }
.choices { display: flex; flex-wrap: wrap; gap: 10px; }
.choice { display: inline-flex; align-items: center; gap: 8px; background: #fff; border: 1.5px solid #CDBF9F; border-radius: 999px; padding: 9px 15px; font-weight: 600; font-size: .95rem; cursor: pointer; }
.choice input { accent-color: var(--ink); margin: 0; }
.check { display: flex; gap: 10px; align-items: flex-start; font-weight: 500; }
.check input { margin-top: 5px; accent-color: var(--ink); width: 18px; height: 18px; }
.err { color: var(--clay); font-weight: 700; font-size: .92rem; margin: 0; }
.alert { background: var(--clay-bg); border: 1px solid #E3B7A5; color: #7A2E16; border-radius: var(--r-sm); padding: 12px 16px; margin: 0 0 20px; font-weight: 600; }
.ok { background: var(--sage-bg); border: 1px solid #B9D3BF; color: #24503A; border-radius: var(--r-sm); padding: 14px 18px; margin: 0 0 22px; }
.panel { background: var(--sheet); border: 1px solid var(--rule); border-radius: var(--r); padding: 30px; box-shadow: var(--shadow); }
.panel--flat { box-shadow: none; }

/* ---------- writer page ---------- */
.pagehead { padding: 56px 0 34px; border-bottom: 1px solid var(--rule); background: linear-gradient(180deg, #FCEFD0 0%, var(--paper) 100%); }
.pagehead h1 { font-size: clamp(2rem, 4vw, 3.1rem); max-width: 18em; }
.pagehead .lead { margin-bottom: 0; }
.split { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 44px; align-items: start; padding-top: 44px; padding-bottom: 80px; }
.aside { position: sticky; top: 20px; }
.aside h2 { font-size: 1.35rem; }
.tips { list-style: none; padding: 0; margin: 0; }
.tips li { padding: 12px 0; border-top: 1px solid var(--rule); font-size: .97rem; }
.tips li b { display: block; font-family: var(--serif); font-size: 1.05rem; margin-bottom: 2px; }

/* ---------- the letter sheet (Pages-style document on a desk) ---------- */
.desk { background: #E9E0CC; border-radius: var(--r); padding: 36px; }
.sheet { background: var(--sheet); max-width: 720px; margin: 0 auto; padding: 64px 72px; box-shadow: 0 2px 0 rgba(0, 0, 0, .04), 0 30px 60px -28px rgba(28, 38, 64, .45); border-radius: 3px;
  font: 400 1.08rem/1.65 var(--serif); white-space: pre-wrap; overflow-wrap: anywhere; color: #1A1F2E; }
.sheet__tools { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; margin: 0 0 22px; }
.copied { font-weight: 700; color: var(--sage); min-width: 6em; }

/* ---------- request file ---------- */
.filehead { padding: 44px 0 28px; border-bottom: 1px solid var(--rule); background: var(--paper-2); }
.filehead__row { display: flex; justify-content: space-between; align-items: flex-end; gap: 22px; flex-wrap: wrap; }
.filehead h1 { font-size: clamp(1.9rem, 3.6vw, 2.8rem); margin-bottom: .2em; }
.linkbox { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; background: #fff; border: 1.5px dashed #C9B68A; border-radius: var(--r-sm); padding: 12px 14px; margin: 18px 0 0; }
.linkbox code { font: 600 .98rem/1.3 ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace; overflow-wrap: anywhere; flex: 1 1 260px; }
.stats { display: flex; gap: 30px; flex-wrap: wrap; }
.stat b { display: block; font: 600 2.2rem/1 var(--serif); }
.stat span { font-size: .85rem; color: var(--ink-3); font-weight: 600; }
.reqlist { display: grid; gap: 18px; margin: 0 0 32px; padding: 0; list-style: none; }
.req { background: var(--sheet); border: 1px solid var(--rule); border-left: 6px solid var(--sun); border-radius: var(--r-sm); padding: 20px 22px; display: grid; grid-template-columns: 1fr auto; gap: 8px 22px; align-items: center; }
.req--closed { border-left-color: var(--paper-3); }
.req--filled { border-left-color: var(--sage); }
.req--denied { border-left-color: var(--clay); }
.req--overdue { border-left-color: var(--clay); }
.req h3 { margin: 0; font-size: 1.2rem; }
.req h3 a { text-decoration: none; }
.req h3 a:hover { text-decoration: underline; text-decoration-color: var(--sun); }
.req__what { margin: 4px 0 0; color: var(--ink-2); font-size: .97rem; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.req__meta { display: flex; flex-wrap: wrap; gap: 6px 16px; font-size: .9rem; color: var(--ink-3); margin-top: 8px; align-items: center; }
.req__n { text-align: right; }
.req__n b { display: block; font: 600 2.3rem/1 var(--serif); }
.req__n span { font-size: .8rem; font-weight: 600; color: var(--ink-3); }
.cols { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr); gap: 40px; align-items: start; padding-top: 40px; padding-bottom: 80px; }
.box { background: var(--sheet); border: 1px solid var(--rule); border-radius: var(--r); padding: 24px; margin-bottom: 24px; }
.box h2 { font-size: 1.35rem; }
.empty { margin-bottom: 32px; text-align: center; padding: 44px 24px; border: 2px dashed var(--rule); border-radius: var(--r); color: var(--ink-2); }
.records { font: 400 1.05rem/1.6 var(--serif); white-space: pre-wrap; overflow-wrap: anywhere; background: #FFFBF1; border: 1px solid var(--paper-3); border-radius: var(--r-sm); padding: 16px 18px; margin: 0 0 6px; }
.log { list-style: none; margin: 0; padding: 0; position: relative; }
.log::before { content: ""; position: absolute; left: 7px; top: 8px; bottom: 8px; width: 2px; background: var(--paper-3); }
.log li { position: relative; padding: 0 0 18px 30px; }
.log li::before { content: ""; position: absolute; left: 1px; top: 7px; width: 14px; height: 14px; border-radius: 50%; background: var(--sheet); border: 3px solid var(--sun); }
.log li.log--sent::before { background: var(--ink); border-color: var(--ink); }
.log li.log--received::before { background: var(--sage); border-color: var(--sage); }
.log li.log--denied::before, .log li.log--withdrawn::before { background: var(--clay); border-color: var(--clay); }
.log__date { font-weight: 700; font-size: .92rem; }
.log__what { display: block; font-family: var(--serif); font-size: 1.05rem; }
.log__note { display: block; color: var(--ink-2); font-size: .95rem; white-space: pre-wrap; overflow-wrap: anywhere; }
.log form { display: inline; }
.linkbtn { background: none; border: 0; padding: 0; color: var(--ink-3); font: 600 .85rem var(--sans); text-decoration: underline; cursor: pointer; }
.letters { display: grid; gap: 10px; }
.letters a { display: flex; justify-content: space-between; gap: 12px; align-items: center; padding: 14px 16px; border: 1.5px solid var(--rule); border-radius: var(--r-sm); text-decoration: none; background: #fff; font-weight: 700; }
.letters a:hover { border-color: var(--ink); }
.letters a span { font-weight: 500; color: var(--ink-3); font-size: .88rem; }
details.more { border-top: 1px solid var(--rule); padding-top: 14px; margin-top: 14px; }
details.more summary { cursor: pointer; font-weight: 700; }
details.more[open] summary { margin-bottom: 14px; }
.danger { border: 1px solid #E3B7A5; background: #FFF8F4; }
.crumbs { font-size: .92rem; margin: 0 0 10px; color: var(--ink-3); }
.crumbs a { font-weight: 600; }

/* ---------- prose pages ---------- */
.prose { max-width: 760px; padding-top: 44px; padding-bottom: 80px; }
.prose h2 { margin-top: 1.6em; }
.prose li { margin-bottom: .5em; }
.steps { counter-reset: s; list-style: none; padding: 0; margin: 0; }
.steps > li { counter-increment: s; position: relative; padding: 0 0 26px 64px; }
.steps > li::before { content: counter(s); position: absolute; left: 0; top: 0; width: 44px; height: 44px; border-radius: 50%; background: var(--sun); display: grid; place-items: center; font: 600 1.2rem/44px var(--serif); text-align: center; }
.steps h3 { margin: 6px 0 6px; }
.notlist { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 12px 30px; }
.notlist li { padding-left: 28px; position: relative; }
.notlist li::before { content: "\2715"; position: absolute; left: 0; top: 0; color: var(--clay); font-weight: 700; }
.msg { padding: 80px 0 110px; max-width: 720px; }

/* ---------- footer ---------- */
.foot { background: var(--paper-2); border-top: 1px solid var(--rule); padding: 56px 0 26px; font-size: .95rem; }
.foot__grid { display: grid; grid-template-columns: 1.6fr 1fr 1fr; gap: 36px; }
.foot__brand { display: inline-flex; align-items: center; gap: 8px; font: 650 1.3rem/1 var(--serif); margin: 0 0 12px; }
.foot__brand svg { width: 30px; height: 30px; }
.foot__ind { color: var(--ink-2); max-width: 34em; }
.foot__h { font-weight: 800; font-size: .78rem; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-3); margin: 0 0 10px; }
.foot__col a { display: block; padding: 4px 0; text-decoration: none; color: var(--ink); }
.foot__col a:hover { text-decoration: underline; }
.foot__base { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; border-top: 1px solid var(--rule); margin-top: 40px; padding-top: 18px; color: var(--ink-3); font-size: .9rem; }
.foot__base a { color: var(--ink); font-weight: 700; }

/* ---------- responsive ---------- */
@media (max-width: 980px) {
  .hero__in, .split, .cols { grid-template-columns: 1fr; }
  .hero__in { padding-top: 44px; padding-bottom: 56px; gap: 30px; }
  .hero__art { max-width: 520px; }
  .aside { position: static; }
  .folders { grid-template-columns: 1fr; }
  .laws { grid-template-columns: 1fr; }
  .foot__grid { grid-template-columns: 1fr 1fr; }
  .foot__grid > :first-child { grid-column: 1 / -1; }
}
@media (max-width: 720px) {
  body { font-size: 1rem; }
  .wrap { padding-left: 18px; padding-right: 18px; }
  .top__in { flex-wrap: wrap; gap: 6px 18px; padding-top: 14px; padding-bottom: 10px; min-height: 0; }
  .nav { margin-left: 0; width: 100%; gap: 2px 16px; }
  .nav a { font-size: .93rem; }
  .nav .nav__cta { padding: 7px 13px; }
  .band { padding: 60px 0; }
  .formgrid { grid-template-columns: 1fr; }
  .plans { grid-template-columns: 1fr; }
  .notlist { grid-template-columns: 1fr; }
  .track { padding: 22px 18px; }
  .track__count { text-align: left; }
  .ladder li { font-size: .74rem; padding-left: 3px; padding-right: 3px; line-height: 1.25; hyphens: auto; }
  .ladder li small { display: none; }
  .desk { padding: 14px; border-radius: var(--r-sm); }
  .sheet { padding: 28px 22px; font-size: 1rem; }
  .req { grid-template-columns: 1fr; }
  .req__n { text-align: left; display: flex; gap: 8px; align-items: baseline; }
  .req__n b { display: inline; font-size: 1.6rem; }
  .panel { padding: 20px; }
  .foot__grid { grid-template-columns: 1fr; }
  .laws li { grid-template-columns: 40px 1fr; }
}

/* ---------- print: letters and the log print clean ---------- */
@media print {
  @page { margin: 18mm; }
  body { background: #fff; font-size: 11pt; }
  .top, .ribbon, .foot, .no-print, .sheet__tools, .aside, .btns, .pricenote, .crumbs, form { display: none !important; }
  .desk { background: none; padding: 0; }
  .sheet { box-shadow: none; padding: 0; max-width: none; font-size: 11.5pt; }
  .split, .cols { display: block; padding: 0; }
  .filehead, .pagehead { background: none; padding: 0 0 10pt; }
  .req, .box { break-inside: avoid; box-shadow: none; }
  a { text-decoration: none; color: #000; }
}

/* v1.1.0: AdEngine banner (adengine.us). One labelled slot between the main content and the footer, on the public reading
   pages only (the controllers opt in). The label and the reserved height are on the <ins>, so when tag.js (or ae-size.js)
   hides a slot it cannot fill, the label and the space go with it. 110px = 16px label + 4px gap + 90px banner; 270px on
   phones (300x250). The prose pages end with their own bottom padding and the footer has no top margin, so the spacing is
   below the <ins> (plus a top margin after the home page's closing sheet band), and it disappears with a hidden slot.
   display stays in this file and is never !important: tag.js hides a slot with style.display='none'. */
.ae-slot { padding: 0 24px; }
.ae-slot ins.adengine { display: block; max-width: 728px; min-height: 110px; margin: 0 auto 56px; text-align: center; text-decoration: none; }
.ae-slot ins.adengine::before { content: "Advertisement"; display: block; margin-bottom: 4px; font: 700 11px/16px var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--ink-3); }
.ae-slot ins.adengine a { display: inline-block; vertical-align: top; }
main:has(> .band--sheet:last-child) + .ae-slot ins.adengine, main:has(> .band--tint:last-child) + .ae-slot ins.adengine { margin-top: 48px; }
.ae-slot:has(> ins.adengine[style*="none"]) { display: none; }
@media (max-width: 767px) { .ae-slot { padding: 0 18px; } .ae-slot ins.adengine { max-width: 300px; min-height: 270px; margin-bottom: 44px; } }
@media print { .ae-slot { display: none; } }