:root {
  --header-bg: hsl(232.5deg 30% 28%);
  --footer-bg: color-mix(in srgb, hsl(232.5deg 30% 28%) 15%, white);
}

.site-header-bar {
  background: var(--header-bg);
  padding: 1.25rem 2.5rem;
  margin: 0 !important;
}
.site-header-title,
.site-header-title a {
  font-family: var(--wp--preset--font-family--title);
  font-weight: 700;
  font-size: 2.75rem;
  color: #fff !important;
  text-decoration: none;
  line-height: 1;
}
.site-header-nav a {
  color: #fff !important;
  font-weight: 600;
  font-size: 1rem;
  text-decoration: none;
}

.site-footer-bar {
  background: var(--footer-bg);
  padding: 1.5rem 0;
  text-align: center;
}
.site-footer-bar p { margin: 0; font-size: 0.85rem; color: var(--wp--preset--color--contrast-2); }
.site-footer-bar a { color: var(--wp--preset--color--contrast); text-decoration: underline; }

/* Fix: TT5's default index/home template wraps content in <main> with a
   built-in top margin (var(--wp--preset--spacing--60)), which produced a
   visible gap directly under the navy header bar. Zero it sitewide so the
   header sits flush against whatever content follows (page templates can
   still opt back into spacing internally). */
.wp-site-blocks > main {
  margin-top: 0 !important;
}