/* Shared Deming Park identity. Keep these colors independent of page themes. */
:root body .site-header {
  color: #143b2b;
  background: #faf9f6;
  border-bottom: 1px solid #e8ece4;
  padding: 1rem 0;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

:root body .site-header .header-row {
  width: min(1240px, calc(100% - 5.5rem));
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 1rem 1.5rem;
}

:root body .site-header .brand {
  --forest: #143b2b;
  color: #143b2b;
  display: inline-flex;
  align-items: center;
  gap: .9rem;
  min-width: 0;
  max-width: 100%;
  flex: 0 1 auto;
  text-decoration: none;
  font-family: Georgia, 'Times New Roman', serif;
  line-height: 1.1;
}

:root body .site-header .brand-logo {
  display: block;
  flex: 0 0 72px;
  width: 72px;
  height: 72px;
  object-fit: contain;
}

:root body .site-header .brand-wordmark {
  display: block;
  min-width: 0;
}

:root body .site-header .brand-wordmark strong {
  display: block;
  margin: 0;
  font: 700 clamp(1.55rem, 2.9vw, 2rem)/1.1 Georgia, 'Times New Roman', serif;
  letter-spacing: .035em;
  overflow-wrap: anywhere;
}

:root body .site-header .brand-wordmark small {
  display: block;
  margin-top: .32rem;
  color: #34562a;
  font: 500 .88rem/1.35 Georgia, 'Times New Roman', serif;
  letter-spacing: .135em;
  overflow-wrap: anywhere;
}

:root body .site-header .nav {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: .35rem clamp(.7rem, 1.6vw, 1.65rem);
  min-width: 0;
  max-width: 100%;
  width: auto;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

:root body .site-header .nav a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  min-width: 44px;
  max-width: 100%;
  padding: .5rem 0;
  color: #143b2b;
  background: transparent;
  border-radius: 0;
  font-size: .875rem;
  line-height: 1.45;
  font-weight: 650;
  text-decoration: none;
  text-align: center;
  overflow-wrap: anywhere;
}

:root body .site-header .nav a:hover,
:root body .site-header .nav a[aria-current='page'] {
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: .45em;
}

:root body .site-header .nav .nav-visit {
  min-height: 52px;
  padding: .75rem 1.15rem;
  border: 1px solid #143b2b;
  border-radius: 3px;
  background: #143b2b;
  color: #fff;
}

:root body .site-header .nav .nav-visit:hover {
  background: #244d3a;
}

:root body .site-header .read-aloud-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 46px;
  width: 46px;
  min-width: 46px;
  height: 46px;
  min-height: 46px;
  padding: 10px;
  border: 1px solid #758e6e;
  border-radius: 50%;
  background: transparent;
  color: #143b2b;
}

:root body .site-header .read-aloud-toggle:hover,
:root body .site-header .read-aloud-toggle[aria-expanded='true'] {
  background: #143b2b;
  color: #fff;
}

:root body .site-header .read-aloud-toggle[data-reading-active='true']::after {
  background: #143b2b;
  border-color: #faf9f6;
}

:root body .site-header a:focus-visible,
:root body .site-header button:focus-visible {
  outline: 3px solid #a83b00;
  outline-offset: 4px;
}

@media (max-width: 1100px) {
  :root body .site-header .header-row { gap: .9rem 1rem; }
  :root body .site-header .brand { gap: .75rem; }
  :root body .site-header .brand-logo { flex-basis: 66px; width: 66px; height: 66px; }
  :root body .site-header .nav { column-gap: 1.1rem; }
  :root body .site-header .nav a { font-size: .82rem; }
  :root body .site-header .nav .nav-visit { padding-inline: 1rem; }
}

@media (max-width: 1000px) {
  :root body .site-header .header-row { width: calc(100% - 3rem); }
  :root body .site-header .nav { width: 100%; justify-content: flex-start; column-gap: 1.5rem; }
  :root body .site-header .nav a { font-size: .875rem; }
  :root body .site-header .brand-wordmark strong { font-size: 1.8rem; }
}

@media (max-width: 640px) {
  :root body .site-header { padding: .85rem 0; }
  :root body .site-header .header-row { width: calc(100% - 32px); gap: .75rem; }
  :root body .site-header .brand { gap: .65rem; }
  :root body .site-header .brand-logo { flex-basis: 56px; width: 56px; height: 56px; }
  :root body .site-header .brand-wordmark strong { font-size: 1.4rem; }
  :root body .site-header .brand-wordmark small { font-size: .72rem; letter-spacing: .105em; }
  :root body .site-header .nav { gap: .35rem 1.1rem; }
  :root body .site-header .nav a { font-size: .875rem; }
  :root body .site-header .nav .nav-visit { padding: .6rem .85rem; }
}

html[data-reading='contrast'] body .site-header,
html[data-reading='contrast'] body .site-header .brand,
html[data-reading='contrast'] body .site-header .brand-wordmark small,
html[data-reading='contrast'] body .site-header .nav a,
html[data-reading='contrast'] body .site-header .read-aloud-toggle {
  color: #000;
  background: #fff;
  border-color: #000;
}

html[data-reading='contrast'] body .site-header .nav .nav-visit,
html[data-reading='contrast'] body .site-header .read-aloud-toggle:hover,
html[data-reading='contrast'] body .site-header .read-aloud-toggle[aria-expanded='true'] {
  color: #fff;
  background: #000;
  border-color: #000;
}

@media (forced-colors: active) {
  :root body .site-header,
  :root body .site-header .brand,
  :root body .site-header .brand-wordmark small { background: Canvas; color: CanvasText; border-color: CanvasText; }
  :root body .site-header .nav a { color: LinkText; }
  :root body .site-header .nav .nav-visit,
  :root body .site-header .read-aloud-toggle { background: ButtonFace; color: ButtonText; border: 1px solid ButtonText; }
  :root body .site-header a:focus-visible,
  :root body .site-header button:focus-visible { outline-color: Highlight; }
}

@media print {
  :root body .site-header { background: #fff; color: #000; border: 0; }
  :root body .site-header .nav { display: none; }
}