/* ============================================
   INFO PAGES — About / Constitution / Officers
   (page-header is shared from styles.css)
   ============================================ */
.pages-section {
  padding: 0 0 clamp(56px, 7vw, 96px);
  position: relative;
  z-index: 2;
}

/* ---------- Prose (About / History) ---------- */
.page-prose { max-width: 820px; }
.page-prose h2 {
  font-family: var(--font-display);
  font-weight: 800;
  text-transform: uppercase;
  font-size: clamp(22px, 2.6vw, 30px);
  color: var(--ink);
  margin: 36px 0 12px;
}
.page-prose h3 {
  font-family: var(--font-condensed);
  font-weight: 700;
  font-style: italic;
  font-size: 15px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--red);
  margin: 0 0 6px;
}
.page-prose p { margin-bottom: 18px; line-height: 1.7; }
.page-prose em { font-style: italic; }
.page-prose figure { margin: 28px 0; }
.page-prose figure img {
  max-width: 360px;
  width: 100%;
  display: block;
  border: 1px solid var(--rule-strong);
  background: var(--paper-pure);
}
.page-prose figcaption,
.page-prose .centerRed {
  font-family: var(--font-condensed);
  font-weight: 600;
  font-size: 12px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--ink-mute);
  margin-top: 8px;
}
/* History page (.hisImg = <p> with an <img> + caption) */
.page-prose .hisImg { margin: 26px 0; }
.page-prose .hisImg img,
.page-prose img {
  max-width: 360px;
  width: 100%;
  display: block;
  border: 1px solid var(--rule-strong);
  background: var(--paper-pure);
  margin-bottom: 8px;
}

/* ---------- Constitution (old .art* markup) ---------- */
.constitution { max-width: 840px; }
.constitution .c-sub {
  font-family: var(--font-condensed);
  font-weight: 700;
  font-style: italic;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-size: 13px;
  color: var(--red);
  margin: 32px 0 18px;
}
.constitution .c-article {
  font-family: var(--font-display);
  font-weight: 800;
  text-transform: uppercase;
  font-size: clamp(19px, 2.3vw, 26px);
  color: var(--ink);
  margin: 38px 0 14px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--ink);
}
.constitution .c-clause {
  display: grid;
  grid-template-columns: 52px 1fr;
  gap: 14px;
  margin-bottom: 12px;
  align-items: start;
}
.constitution .c-num {
  font-family: var(--font-mono);
  font-weight: 700;
  font-size: 13px;
  color: var(--red);
  line-height: 1.6;
}
/* Wider label column for clauses keyed by name (regions, engine grades). */
.constitution .c-clause--wide {
  grid-template-columns: 168px 1fr;
}
.constitution .c-clause--wide .c-num {
  white-space: nowrap;
}
.constitution .c-txt {
  font-size: 15px;
  line-height: 1.6;
  color: var(--ink-soft);
}

/* Appendix tables (e.g. Appendix B abbreviations) — give them room to breathe. */
.constitution table {
  width: 100%;
  border-collapse: collapse;
  margin: 8px 0 28px;
}
.constitution caption {
  caption-side: top;
  text-align: left;
  font-family: var(--font-display);
  font-weight: 800;
  text-transform: uppercase;
  font-size: clamp(19px, 2.3vw, 26px);
  color: var(--ink);
  margin: 38px 0 16px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--ink);
}
.constitution td {
  padding: 8px 22px 8px 0;
  font-size: 14px;
  line-height: 1.5;
  color: var(--ink-soft);
  vertical-align: top;
  border-bottom: 1px solid var(--rule-light);
}
.constitution td:nth-child(odd) {
  font-family: var(--font-mono);
  font-weight: 700;
  color: var(--red);
  white-space: nowrap;
  padding-right: 10px;
}

/* ---------- Officers directory (role / name / email cards) ---------- */
.off-heading {
  font-family: var(--font-display);
  font-weight: 800;
  text-transform: uppercase;
  font-size: clamp(15px, 1.8vw, 20px);
  letter-spacing: 0.06em;
  color: var(--ink);
  margin: 40px 0 16px;
  padding-bottom: 8px;
  border-bottom: 2px solid var(--ink);
}
.off-heading:first-child { margin-top: 0; }

.officers {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}
.officers .off-card {
  background: var(--paper-warm);
  border: 1px solid var(--rule-strong);
  padding: 20px 22px;
  display: flex;
  flex-direction: column;
}
.officers .off-role {
  font-family: var(--font-condensed);
  font-weight: 700;
  font-style: italic;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 12px;
  color: var(--red);
  margin-bottom: 8px;
}
.officers .off-name {
  font-family: var(--font-display);
  font-weight: 800;
  font-size: 21px;
  line-height: 1.05;
  color: var(--ink);
  margin-bottom: 8px;
}
.officers .off-email {
  font-family: var(--font-condensed);
  font-size: 13px;
  margin-top: auto;
  word-break: break-word;
}
.officers .off-email a { color: var(--red); }
.officers .off-card--open { opacity: 0.55; }
.officers .off-card--open .off-name { font-style: italic; }

@media (max-width: 880px) {
  .officers { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px) {
  .officers { grid-template-columns: 1fr; }
}