.office-main { padding: clamp(1.5rem, 5vw, 3.5rem); }
.office-intro { display: grid; grid-template-columns: 1fr auto; gap: 2rem; align-items: start; padding-bottom: 1.5rem; border-bottom: 4px double var(--ink); }
.office-intro h1 { max-width: 760px; margin: .25rem 0 .8rem; font-size: clamp(2rem, 5vw, 3.4rem); line-height: 1.04; }
.office-intro p { max-width: 720px; line-height: 1.55; }
.office-code { padding: .65rem; color: #fff; background: var(--department-green); font: 700 .6rem/1.45 var(--sans); letter-spacing: .08em; text-transform: uppercase; }
.service-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; margin: 1.5rem 0; }
.service-card { position: relative; display: flex; flex-direction: column; min-height: 190px; padding: 1.2rem; color: var(--ink); border: 1px solid var(--rule); background: color-mix(in srgb, var(--paper) 82%, white); text-decoration: none; }
.service-card::before { content: attr(data-form); color: var(--official-red); font: 800 .58rem/1 var(--sans); letter-spacing: .1em; text-transform: uppercase; }
.service-card h2 { margin: .75rem 0 .45rem; font-size: 1.35rem; }
.service-card p { margin: 0 0 1rem; line-height: 1.45; }
.service-card .enter { margin-top: auto; font: 800 .62rem/1 var(--sans); letter-spacing: .08em; text-transform: uppercase; }
.service-card:hover { color: var(--ink); border-color: var(--official-red); box-shadow: inset 5px 0 0 var(--official-red); }

.service-panel { margin-top: 1.5rem; }
.service-form { display: grid; gap: 1rem; max-width: 760px; padding: clamp(1rem, 4vw, 2rem); border: 1px solid var(--rule); background: rgba(255,255,255,.3); }
.field { display: grid; gap: .35rem; }
.field > span, .fieldset-title { font: 800 .66rem/1.3 var(--sans); letter-spacing: .07em; text-transform: uppercase; }
.field small { color: #625e50; font-size: .68rem; }
.field input, .field textarea, .field select { width: 100%; padding: .7rem .75rem; color: var(--ink); border: 1px solid #726c58; border-radius: 0; background: #fffef7; font: 1rem/1.35 var(--serif); }
.field textarea { min-height: 110px; resize: vertical; }
.field input:focus, .field textarea:focus, .field select:focus { outline: 3px solid color-mix(in srgb, var(--department-green) 60%, white); outline-offset: 2px; }
.choice-group { display: grid; gap: .55rem; padding: .9rem; border: 1px dotted var(--rule); }
.choice-group label { display: grid; grid-template-columns: auto 1fr; gap: .55rem; align-items: start; line-height: 1.35; }
.choice-group input { margin-top: .15rem; }
.form-actions { display: flex; flex-wrap: wrap; gap: .65rem; align-items: center; }
.office-button { padding: .65rem .85rem; color: white; border: 2px outset #688073; border-radius: 0; background: var(--department-green); cursor: pointer; font: 800 .67rem/1 var(--sans); letter-spacing: .07em; text-transform: uppercase; }
.office-button.secondary { color: var(--ink); background: var(--paper-deep); border-color: var(--rule); }
.office-button:active { border-style: inset; }
.form-status { min-height: 1.2em; margin: 0; color: var(--official-red); font-weight: bold; }

.official-document { position: relative; max-width: 820px; margin: 2rem auto 0; padding: clamp(1.2rem, 5vw, 3rem); border: 1px solid #6d6754; background: #fffef7; box-shadow: 4px 5px 0 rgba(50,45,35,.14); }
.official-document[hidden] { display: none; }
.official-document::before { position: absolute; inset: .45rem; pointer-events: none; content: ""; border: 1px solid #b6ad91; }
.document-letterhead { display: grid; grid-template-columns: 70px 1fr; gap: 1rem; align-items: center; padding-bottom: 1rem; border-bottom: 3px double var(--ink); }
.document-letterhead img { width: 66px; }
.document-letterhead p { margin: .15rem 0; }
.document-department { font-size: 1.1rem; font-weight: bold; }
.document-meta { display: grid; grid-template-columns: repeat(2, 1fr); gap: .4rem 1rem; margin: 1rem 0; padding: .7rem; background: #eeeadb; font: .68rem/1.35 "Courier New", monospace; }
.document-title { margin: 1.4rem 0 .8rem; font-size: clamp(1.5rem, 4vw, 2.2rem); text-align: center; text-transform: uppercase; }
.document-body { line-height: 1.65; }
.document-request { padding: .75rem 1rem; border-left: 4px solid var(--rule); background: #f3f0e7; font-style: italic; overflow-wrap: anywhere; }
.document-disposition { margin: 1.25rem 0; padding: .85rem; color: var(--official-red); border: 3px double currentColor; font: 900 clamp(1rem, 3vw, 1.35rem)/1.2 var(--sans); letter-spacing: .05em; text-align: center; text-transform: uppercase; transform: rotate(-.4deg); }
.document-signature { width: min(320px, 80%); margin: 2rem 0 .5rem auto; border-top: 1px solid var(--ink); padding-top: .35rem; font-style: italic; }
.document-controls { display: flex; justify-content: center; flex-wrap: wrap; gap: .65rem; margin-top: 1rem; }
.privacy-note { max-width: 760px; margin: 1rem 0; color: #5d594c; font-size: .72rem; }
.clerk-note { color: #38507a; font: italic .76rem/1.2 "Comic Sans MS", cursive; transform: rotate(-2deg); opacity: .72; }

.forms-index { list-style: none; margin: 1.5rem 0; padding: 0; }
.forms-index li { display: grid; grid-template-columns: 100px 1fr auto; gap: 1rem; align-items: center; padding: 1rem .4rem; border-bottom: 1px dotted var(--rule); }
.forms-index .form-id { color: var(--official-red); font: 900 .72rem/1 var(--sans); }
.forms-index h2 { margin: 0 0 .25rem; font-size: 1.15rem; }
.forms-index p { margin: 0; font-size: .85rem; }

.org-complex { margin: 2rem auto; max-width: 920px; font-family: var(--sans); text-align: center; }
.org-level { display: grid; gap: 1rem; margin-top: 2rem; position: relative; }
.org-level.one { grid-template-columns: minmax(220px, 360px); justify-content: center; }
.org-level.two { grid-template-columns: repeat(3, 1fr); }
.org-level.three { grid-template-columns: repeat(4, 1fr); }
.org-level:not(.one)::before { position: absolute; top: -2rem; left: 50%; width: 1px; height: 1rem; content: ""; background: var(--rule); }
.org-level:not(.one)::after { position: absolute; top: -1rem; height: 1px; content: ""; background: var(--rule); }
.org-level.two::after { left: calc(16.6667% - .3333rem); width: calc(66.6667% + .6667rem); }
.org-level.three::after { left: calc(12.5% - .375rem); width: calc(75% + .75rem); }
.org-position { position: relative; padding: .8rem .55rem; border: 1px solid #595445; background: #fffef7; font-size: .76rem; }
.org-level:not(.one) .org-position::before { position: absolute; top: -1rem; left: 50%; width: 1px; height: 1rem; content: ""; background: var(--rule); }
.org-position strong { display: block; margin-bottom: .25rem; }
.org-position small { color: #665f4e; }
.org-position.director { color: white; border-width: 3px; background: var(--department-green); }
.org-footnote { margin-top: 1.5rem; font-size: .75rem; font-style: italic; }

.budget-table { width: 100%; margin: 1.5rem 0; border-collapse: collapse; }
.budget-table th, .budget-table td { padding: .7rem; border-bottom: 1px solid var(--rule); text-align: left; }
.budget-table th:last-child, .budget-table td:last-child { text-align: right; font-family: "Courier New", monospace; }
.budget-table tfoot { font-weight: bold; border-top: 3px double var(--ink); }
.official-statement { padding: 1rem; border: 1px solid var(--rule); background: var(--paper-deep); font-size: 1.05rem; font-style: italic; text-align: center; }

@media (max-width: 700px) {
  .office-intro { grid-template-columns: 1fr; }
  .service-grid { grid-template-columns: 1fr; }
  .forms-index li { grid-template-columns: 1fr; gap: .35rem; }
  .org-level.two, .org-level.three { grid-template-columns: 1fr; margin-top: 1rem; }
  .org-level:not(.one)::before, .org-level:not(.one)::after { display: none; }
  .org-level:not(.one) .org-position::before { top: -1rem; height: 1rem; }
  .document-meta { grid-template-columns: 1fr; }
}

@media (max-width: 430px) {
  .document-letterhead { grid-template-columns: 52px 1fr; }
  .document-letterhead img { width: 50px; }
}

@page { size: Letter portrait; margin: .45in; }

@media print {
  html, body { min-height: 0; background: white; }
  body.printing * { visibility: hidden !important; }
  body.printing .official-document, body.printing .official-document * { visibility: visible !important; }
  body.printing .official-document { position: absolute; inset: 0 0 auto; width: auto; max-width: none; margin: 0; padding: .3in .4in; border: 0; box-shadow: none; break-inside: avoid; }
  body.printing .document-controls { display: none; }
}
