.site-support-links {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: .75rem 1.5rem;
  padding: 1.5rem 1rem calc(1.5rem + env(safe-area-inset-bottom));
  background: #f2efe7;
  border-top: 1px solid #d6d0c5;
  color: #243447;
  font: 500 .9rem/1.7 system-ui, sans-serif;
}
.site-support-links a { color: #243447; text-decoration: underline; text-underline-offset: .2em; }
.site-support-links a:hover { color: #8a4700; }
.site-support-links a:focus-visible, .info-page a:focus-visible { outline: 3px solid #b45309; outline-offset: 4px; }
.info-page { margin: 0; background: #f7f5ef; color: #243447; font: 1rem/1.85 system-ui, sans-serif; }
.info-header { padding: 1rem max(1.25rem, calc((100% - 780px) / 2)); background: #243447; }
.info-header a { color: #fff; font-weight: 700; text-decoration: none; }
.info-main { max-width: 780px; margin: 0 auto; padding: 2.5rem 1.25rem 3.5rem; overflow-wrap: anywhere; }
.info-main h1 { font-size: clamp(1.8rem, 6vw, 2.5rem); line-height: 1.4; }
.info-main h2 { margin-top: 2rem; font-size: 1.2rem; }
.info-main a { color: #794200; text-underline-offset: .2em; }
.info-main .info-meta { color: #536173; font-size: .9rem; }
.info-main .info-callout { border-left: 4px solid #b45309; background: #fff; padding: 1rem 1.25rem; }
@media (max-width: 768px) {
  .site-support-links { padding-bottom: calc(6rem + env(safe-area-inset-bottom)); }
  .info-page .site-support-links { padding-bottom: calc(1.5rem + env(safe-area-inset-bottom)); }
}
