.site-body {
  font-family: system-ui, sans-serif;
  max-width: 800px;
  margin: 60px auto;
  padding: 24px;
}

.site-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 24px;
}
.site-nav, .site-footer div { display: flex; flex-wrap: wrap; gap: 1rem; }
.site-footer { margin: 5rem auto 2rem; border-top: 1px solid #d9dfe8; padding-top: 1.5rem; }

.content-page-body {
  white-space: pre-wrap;
}

.content-page { max-width: 1100px; margin: 3rem auto; }
.content-section { margin: 4rem 0; }
.content-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 1.5rem; }
.content-grid figure { margin: 0; }
.content-grid figcaption { color: #485566; margin-top: .4rem; font-size: .9rem; }
.content-card { padding: 1.25rem; border: 1px solid #d9dfe8; border-radius: 12px; }
.content-image { max-width: 100%; max-height: 320px; object-fit: contain; }
.content-card .content-image { max-height: 130px; }
.content-image-text { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 1.5rem; align-items: center; }
.site-header [hidden] { display: none !important; }

.member-account { max-width: 720px; margin: 3rem auto; }
.member-account h1 { margin-bottom: 1.5rem; }
.member-card { border: 1px solid #d9dfe8; border-radius: 12px; padding: 1.5rem; margin: 1.25rem 0; }
.member-card h2 { margin-top: 0; }
.member-form-row { display: flex; gap: .75rem; flex-wrap: wrap; margin-top: .5rem; }
.member-form-row input { flex: 1 1 16rem; min-height: 2.5rem; padding: .4rem .6rem; }
.member-account button, .member-button { font: inherit; padding: .55rem .85rem; border: 1px solid #354b65; border-radius: 6px; background: #fff; color: #1b3552; cursor: pointer; }
.member-button { display: inline-block; text-decoration: none; }
.member-account button:disabled { opacity: .55; cursor: default; }
.member-actions { display: flex; align-items: center; gap: 1.5rem; flex-wrap: wrap; margin-top: 1.5rem; }
