@charset "UTF-8";

/* Shared public theme. Page styles may refine it; admin screens stay separate. */
.public-body {
  --bg: #f8f7f3;
  --line: #e4e7e2;
  --muted: #576c76;
  --radius: 8px;
}
:where(.public-body) .site-header {
  height: 80px;
  padding-inline: max(24px, calc((100% - 1280px) / 2));
}
.public-body .site-header nav a { display: inline-flex; align-items: center; min-height: 44px; }
:where(.public-body) .public-main { max-width: 1328px; padding: 0 24px 56px; }
:where(.public-body) .site-footer { max-width: 1328px; }
:where(.public-body) .button { border-radius: 5px; }
:where(.public-body) .button:not(.primary) { border-color: #c4d0d1; }
:where(.public-body) .button:not(.primary):hover { background: #f3f7f5; }
:where(.public-body) .badge { border-radius: 4px; }
:where(.public-body) .notice { background: #fff; border-color: var(--line); }

.about { max-width: none; margin: 36px 0 0; padding: 0; min-width: 0; }
.about-heading { margin-bottom: 32px; }
.about-heading h1 { font-size: clamp(1.65rem, 2.8vw, 2.25rem); }
.about-heading > p:last-child { max-width: 62rem; margin-bottom: 0; }
.about .eyebrow { color: var(--teal-dark); }
.about p { line-height: 1.9; overflow-wrap: anywhere; }
.about-section {
  display: grid;
  grid-template-columns: 216px minmax(0, 1fr);
  gap: 24px 32px;
  padding: 28px 32px;
  margin-bottom: 16px;
}
.about-section h2 { margin: 0; line-height: 1.8; }
.about-section > div { min-width: 0; max-width: 58rem; }
.about-section p:last-child { margin-bottom: 0; }
.about-section h3 { margin: 28px 0 12px; }
.about-section a:not(.button) { text-decoration: underline; text-underline-offset: 3px; }
.about-actions { margin-top: 32px; }
.about-actions .button { padding-inline: 28px; }

:where(.public-body) .breadcrumb { flex-wrap: wrap; margin: 28px 0; }
:where(.public-body) .detail-heading h1 { max-width: 1100px; }
:where(.public-body) .detail-section { padding: 30px 32px; }
:where(.public-body) .detail-section h2 { border: 0; padding: 0; }
:where(.public-body) .detail-layout > div { min-width: 0; }
:where(.public-body) .detail-heading, :where(.public-body) .detail-section { overflow-wrap: anywhere; }
:where(.public-body) .public-main > .empty.panel { margin-top: 36px; padding: 48px 32px; }

@media (max-width: 780px) {
  :where(.public-body) .site-header { height: auto; min-height: 80px; padding: 14px 20px; gap: 8px 20px; }
  :where(.public-body) .public-main { padding: 0 18px 40px; }
  .about { margin-top: 28px; }
  .about-heading { margin-bottom: 28px; }
  .about p { font-size: .94rem; }
  .about-section { grid-template-columns: minmax(0, 1fr); gap: 14px; padding: 24px; }
  .about-section h2 { font-size: 1.125rem; }
  .about-section h3 { margin-top: 24px; }
  .about-actions { margin-top: 28px; }
  :where(.public-body) .detail-section { padding: 24px; }
  :where(.public-body) .public-main > .empty.panel { margin-top: 28px; padding: 36px 24px; }
}

@media (max-width: 440px) {
  :where(.public-body) .site-header { padding: 14px 16px 8px; }
  :where(.public-body) .site-header nav { gap: 24px; }
  :where(.public-body) .public-main { padding: 0 16px 36px; }
  .about { margin-top: 24px; }
  .about-heading h1 { font-size: 1.55rem; }
  .about p { font-size: .875rem; }
  .about-section { padding: 20px; }
  :where(.public-body) .detail-section, :where(.public-body) .apply-panel { padding: 20px; }
  :where(.public-body) .public-main > .empty.panel { margin-top: 24px; padding: 32px 20px; }
}
