.about-banner {
  padding: var(--space-7) 0 0;
  background:
    radial-gradient(circle at 86% 14%, rgba(75, 55, 99, .11), transparent 30%),
    linear-gradient(112deg, rgba(156, 63, 53, .10), transparent 46%),
    var(--paper);
}

.breadcrumb {
  margin: 0 0 var(--space-5);
  color: var(--muted);
  font-size: var(--fs-meta);
  font-weight: var(--fw-medium);
  line-height: var(--lh-support);
}

.breadcrumb a {
  color: var(--lacquer);
  font-weight: var(--fw-semibold);
}

.banner-grid {
  padding-bottom: var(--space-7);
}

.about-detail-page .about-banner { padding-top: var(--space-6); }
.about-detail-page .banner-grid { padding-bottom: var(--space-6); }

.about-detail-page .profile-section,
.about-detail-page .purpose-section,
.about-detail-page .governance-section,
.about-detail-page .charter-page-section {
  padding-top: var(--space-7);
}

.page-title {
  margin: 0;
  color: var(--lacquer-deep);
  font-size: var(--fs-title);
  font-weight: var(--fw-bold);
  line-height: var(--lh-tight);
}

.page-deck {
  max-width: none;
  margin: var(--space-3) 0 0;
  color: var(--ink);
  font-size: var(--fs-heading-small);
  font-weight: var(--fw-medium);
  line-height: var(--lh-deck);
}

.section-nav {
  overflow-x: auto;
  padding: 10px 0;
  background: rgba(255, 250, 242, .92);
  box-shadow: 0 12px 30px rgba(76, 43, 40, .06);
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.section-nav::-webkit-scrollbar {
  display: none;
}

.section-nav-inner {
  display: flex;
  min-width: max-content;
  align-items: center;
  gap: var(--space-2);
}

.section-nav a {
  display: inline-flex;
  min-height: var(--control-height-compact);
  align-items: center;
  padding: 0 var(--space-5);
  border-radius: var(--button-radius);
  color: var(--ink);
  font-size: var(--fs-support);
  font-weight: var(--fw-semibold);
  transition: background .2s ease, color .2s ease;
}

.section-nav a:hover,
.section-nav a:focus-visible {
  background: rgba(156, 63, 53, .12);
  color: var(--lacquer-deep);
}

.section-nav a[aria-current="location"] {
  background: var(--lacquer);
  color: #fff;
}

#profile,
#history,
#purpose,
#governance,
#committees,
#charter {
  scroll-margin-top: 150px;
}

.profile-section {
  padding: var(--space-section) 0;
}

.profile-intro {
  max-width: none;
}

.profile-intro-head {
  display: block;
}

.profile-name {
  margin: var(--space-2) 0 0;
  color: var(--lacquer-deep);
}

.profile-lead {
  margin: 0 0 var(--space-4);
  color: var(--ink);
  font-size: var(--fs-body);
  font-weight: var(--fw-medium);
  line-height: var(--lh-body);
}

.profile-narrative {
  margin-top: var(--space-6);
}

.profile-narrative p,
.origin-copy p,
.status-copy p {
  margin: 0 0 var(--space-4);
  color: var(--muted);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
}

.profile-narrative p:last-child,
.origin-copy p:last-child,
.status-copy p:last-child {
  margin-bottom: 0;
}

.origin-feature {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(360px, .95fr);
  align-items: center;
  gap: 70px;
  margin-top: var(--space-8);
}

.origin-copy h2,
.status-section h2 {
  margin: 0 0 var(--space-3);
  color: var(--lacquer-deep);
  font-size: var(--fs-title);
  font-weight: var(--fw-bold);
  line-height: var(--lh-tight);
}

.origin-figure {
  height: 480px;
  margin: 0;
  overflow: hidden;
  background: rgba(156, 63, 53, .07);
}

.origin-figure img {
  object-position: 52% 50%;
}

.status-section {
  max-width: none;
  margin-top: var(--space-8);
  padding-top: var(--space-7);
  border-top: 1px solid var(--line);
}

.status-copy {
  max-width: none;
}

.history-section {
  margin-top: var(--space-8);
  padding: var(--space-7);
  background: var(--paper);
}

.history-head {
  max-width: 900px;
}

.history-head > p {
  margin: var(--space-4) 0 0;
  color: var(--muted);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
}

.history-timeline {
  position: relative;
  margin-top: var(--space-7);
}

.history-timeline::before {
  position: absolute;
  top: 10px;
  bottom: 12px;
  left: 178px;
  width: 1px;
  background: rgba(75, 55, 99, .18);
  content: "";
}

.history-entry {
  position: relative;
  display: grid;
  grid-template-columns: 154px minmax(0, 1fr);
  align-items: start;
  gap: 64px;
  padding: 0 0 var(--space-7);
}

.history-entry:last-child {
  padding-bottom: 0;
}

.history-entry time,
.history-entry h3 {
  margin: 0;
  font-size: var(--fs-heading-small);
  line-height: var(--lh-heading);
}

.history-entry time {
  position: relative;
  color: var(--lacquer);
  font-weight: var(--fw-heavy);
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.history-entry time::after {
  position: absolute;
  top: 6px;
  right: -31px;
  width: 9px;
  height: 9px;
  border: 3px solid var(--paper);
  border-radius: 50%;
  background: var(--lacquer);
  box-sizing: content-box;
  content: "";
}

.history-entry h3 {
  color: var(--indigo);
  font-weight: var(--fw-bold);
}

.history-entry p {
  margin: var(--space-3) 0 0;
  color: var(--muted);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
}

.purpose-section {
  padding: 100px 0;
  background: var(--paper);
}

.purpose-head {
  display: block;
}

.purpose-overview {
  margin-top: var(--space-6);
}

.purpose-overview p {
  margin: 0 0 var(--space-4);
  color: var(--muted);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
}

.purpose-overview p:last-child {
  margin-bottom: 0;
}

.direction-list {
  margin-top: var(--space-7);
  border-top: 1px solid var(--line);
}

.direction-list article {
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr);
  align-items: start;
  gap: var(--space-8);
  padding: var(--space-5) 0;
  border-bottom: 1px solid var(--line);
}

.direction-heading {
  display: grid;
  grid-template-columns: 26px minmax(0, 1fr);
  align-items: baseline;
  gap: var(--gap-number-label);
  margin: 0;
}

.direction-number {
  display: block;
  margin: 0;
  color: var(--lacquer);
  font-size: var(--fs-heading-small);
  font-weight: var(--fw-heavy);
  line-height: var(--lh-heading);
  font-variant-numeric: tabular-nums;
}

.direction-list h3 {
  margin: 0;
  color: var(--lacquer-deep);
  font-size: var(--fs-heading-small);
  font-weight: var(--fw-bold);
  line-height: var(--lh-heading);
}

.direction-list p {
  margin: 0;
  color: var(--muted);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
}

.direction-list article.direction-visual {
  grid-template-columns: 220px minmax(0, 1fr) minmax(300px, .72fr);
  align-items: start;
  column-gap: var(--space-7);
  padding: var(--space-7) 0;
}

.direction-visual .direction-heading {
  grid-column: 1;
  grid-row: 1;
}

.direction-visual > p {
  grid-column: 2;
  grid-row: 1;
}

.direction-media {
  height: 260px;
  grid-column: 3;
  grid-row: 1;
  margin: 0;
  overflow: hidden;
  background: rgba(75, 55, 99, .06);
}

.direction-culture img {
  filter: brightness(1.08) saturate(.94);
  object-position: 48% 58%;
}

.direction-sport img {
  object-position: 54% 52%;
}

.direction-art img {
  object-position: 50% 38%;
}

.direction-reverse .direction-media { grid-column: 2; }
.direction-reverse > p { grid-column: 3; }

.responsibility-band {
  margin-top: var(--space-8);
  padding: var(--space-7) var(--space-8);
  background: rgba(156, 63, 53, .055);
}

.responsibility-intro h3 {
  margin: 0;
  color: var(--lacquer-deep);
  font-size: var(--fs-heading-small);
  font-weight: var(--fw-bold);
  line-height: var(--lh-heading);
}

.responsibility-deck {
  margin: var(--space-2) 0 0;
  color: var(--muted);
  font-size: var(--fs-body);
  font-weight: var(--fw-medium);
  line-height: var(--lh-body);
}

.responsibility-list {
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: var(--space-7);
  row-gap: 0;
  margin-top: var(--space-6);
}

.responsibility-list article {
  padding: var(--space-5) 0;
  border-top: 1px solid rgba(75, 55, 99, .12);
}

.responsibility-list strong,
.responsibility-list span {
  display: block;
}

.responsibility-list strong {
  color: var(--indigo);
  font-size: var(--fs-heading-small);
  font-weight: var(--fw-bold);
  line-height: var(--lh-heading);
}

.responsibility-list span {
  margin-top: var(--space-1);
  color: var(--muted);
  font-size: var(--fs-body);
  font-weight: var(--fw-regular);
  line-height: var(--lh-body);
}

.governance-section {
  padding: 100px 0;
  background: var(--ivory);
}

.governance-head {
  display: block;
}

.governance-head > p {
  margin: var(--space-5) 0 0;
  color: var(--muted);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
}

.governance-head > .section-deck {
  margin-top: var(--space-2);
  color: var(--ink);
  font-size: var(--fs-heading-small);
  font-weight: var(--fw-medium);
  line-height: var(--lh-heading);
}

.org-tree {
  --tree-line: rgba(75, 55, 99, .30);
  margin-top: var(--space-7);
  padding: var(--space-7);
  background: rgba(255, 250, 242, .78);
  color: var(--ink);
}

.org-tree .tree-node {
  position: relative;
  min-width: 0;
  padding: var(--space-5);
  background: #fffaf2;
  box-shadow: 0 14px 34px rgba(76, 43, 40, .055);
}

.org-tree span {
  display: block;
  margin-bottom: var(--space-2);
  color: var(--lacquer);
  font-size: var(--fs-meta);
  font-weight: var(--fw-bold);
}

.org-tree h3 {
  margin: 0;
  color: var(--indigo);
  font-size: var(--fs-heading-small);
  font-weight: var(--fw-bold);
  line-height: var(--lh-heading);
}

.org-tree p {
  margin: var(--space-2) 0 0;
  color: var(--muted);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
}

.tree-root {
  max-width: 580px;
  margin: 0 auto;
  background: rgba(156, 63, 53, .09) !important;
  text-align: center;
}

.tree-root h3 {
  font-size: var(--fs-title);
}

.tree-split {
  position: relative;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 48px;
  row-gap: 42px;
  margin-top: 64px;
}

.tree-split::before,
.tree-split::after,
.tree-council::before,
.tree-standing::before,
.tree-supervision::before,
.tree-row::before,
.tree-row::after,
.tree-row > .tree-node::before {
  position: absolute;
  background: var(--tree-line);
  content: "";
}

.tree-split::before {
  top: -32px;
  right: 25%;
  left: 25%;
  height: 1px;
}

.tree-split::after {
  top: -64px;
  left: 50%;
  width: 1px;
  height: 32px;
}

.tree-main-branch {
  display: contents;
}

.tree-council {
  grid-column: 1;
  grid-row: 1;
}

.tree-standing {
  grid-column: 1;
  grid-row: 2;
}

.tree-leadership {
  grid-column: 1;
  grid-row: 3;
}

.tree-operations {
  grid-column: 1;
  grid-row: 4;
}

.tree-council::before,
.tree-supervision::before {
  top: -32px;
  left: 50%;
  width: 1px;
  height: 32px;
}

.tree-standing {
  width: min(72%, 680px);
  margin: 0 auto;
  background: rgba(75, 55, 99, .07) !important;
  box-shadow: none !important;
  text-align: center;
}

.tree-standing::before {
  top: -42px;
  left: 50%;
  width: 1px;
  height: 42px;
}

.tree-row {
  position: relative;
  display: grid;
  gap: var(--space-5);
}

.tree-row::before {
  top: -42px;
  left: 50%;
  width: 1px;
  height: 21px;
}

.tree-row::after {
  top: -21px;
  height: 1px;
}

.tree-row > .tree-node::before {
  top: -21px;
  left: 50%;
  width: 1px;
  height: 21px;
}

.tree-leadership {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.tree-leadership::after {
  right: 16.666%;
  left: 16.666%;
}

.tree-leadership .tree-node {
  background: rgba(75, 55, 99, .045);
  box-shadow: none;
}

.tree-operations {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.tree-operations::after {
  right: 25%;
  left: 25%;
}

.tree-operations .tree-node {
  background: rgba(156, 63, 53, .055);
  box-shadow: none;
}

.tree-supervision {
  grid-column: 2;
  grid-row: 1;
}

.function-section {
  margin-top: var(--space-8);
  padding: var(--space-7) 0;
  border-top: 1px solid var(--line);
}

.function-intro { max-width: none; }

.function-intro h3 {
  margin: 0;
  color: var(--lacquer-deep);
  font-size: var(--fs-heading-small);
  font-weight: var(--fw-bold);
  line-height: var(--lh-heading);
}

.function-intro p {
  margin: var(--space-3) 0 0;
  color: var(--muted);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
}

.function-list {
  margin: var(--space-6) 0 0;
}

.function-list > div {
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr);
  gap: var(--space-6);
  padding: var(--space-5) 0;
  border-top: 1px solid var(--line);
}

.function-list > div:first-child {
  padding-top: 0;
  border-top: 0;
}

.function-list dt {
  color: var(--indigo);
  font-size: var(--fs-heading-small);
  font-weight: var(--fw-bold);
  line-height: var(--lh-heading);
}

.function-list dd {
  margin: 0;
  color: var(--muted);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
}

.committee-section {
  display: grid;
  grid-template-columns: minmax(320px, 440px) minmax(0, 1fr);
  align-items: start;
  gap: 70px;
  margin-top: var(--space-section);
}

.committee-intro > p:last-child {
  margin: var(--space-5) 0 0;
  color: var(--muted);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
}

.committee-points {
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: var(--space-7);
  row-gap: var(--space-6);
  margin: 0;
}

.committee-points div:last-child {
  grid-column: 1 / -1;
  max-width: none;
}

.committee-points dt {
  display: flex;
  align-items: baseline;
  gap: var(--gap-number-label);
  color: var(--lacquer-deep);
  font-size: var(--fs-heading-small);
  font-weight: var(--fw-bold);
  line-height: var(--lh-heading);
}

.committee-points dt span {
  display: inline-block;
  width: 26px;
  flex: 0 0 26px;
  margin: 0;
  color: var(--lacquer);
  font-size: var(--fs-heading-small);
  font-weight: var(--fw-heavy);
  font-variant-numeric: tabular-nums;
}

.committee-points dd {
  margin: var(--space-2) 0 0;
  color: var(--muted);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
}

.charter-section {
  margin-top: var(--space-section);
  padding: var(--space-7);
  background: var(--paper);
}

.charter-head { max-width: none; }

.charter-page-section {
  padding: var(--space-section) 0;
}

.charter-page-section .charter-section { margin-top: 0; }

.charter-head > p:last-child {
  margin: var(--space-5) 0 0;
  color: var(--muted);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
}

.charter-accordion {
  min-width: 0;
  margin-top: var(--space-6);
}

.charter-chapter {
  border-top: 1px solid var(--line);
}

.charter-chapter:last-child {
  border-bottom: 1px solid var(--line);
}

.charter-chapter h3 {
  margin: 0;
}

.charter-chapter button {
  display: grid;
  width: 100%;
  min-height: 72px;
  grid-template-columns: minmax(0, 1fr) max-content;
  align-items: center;
  gap: var(--space-5);
  padding: var(--space-4) 0;
  border: 0;
  background: transparent;
  color: inherit;
  cursor: pointer;
  font-family: var(--sans);
  font-size: var(--fs-support);
  font-weight: var(--fw-regular);
  line-height: var(--lh-nav);
  text-align: left;
}

.charter-chapter button:focus-visible {
  outline: 2px solid var(--lacquer);
  outline-offset: 4px;
}

.charter-heading {
  display: grid;
  grid-template-columns: max-content minmax(0, 1fr) max-content;
  align-items: baseline;
  gap: var(--gap-number-label);
  min-width: 0;
}

.charter-heading > span,
.charter-heading > strong {
  font-size: var(--fs-heading-small);
  line-height: var(--lh-heading);
}

.charter-heading > span {
  color: var(--lacquer);
  font-weight: var(--fw-heavy);
  white-space: nowrap;
}

.charter-heading > strong {
  color: var(--indigo);
  font-weight: var(--fw-bold);
}

.charter-heading > small {
  color: var(--muted);
  font-size: var(--fs-meta);
  font-weight: var(--fw-semibold);
  line-height: var(--lh-support);
  white-space: nowrap;
}

.charter-state {
  color: var(--lacquer);
  font-size: var(--fs-support);
  font-weight: var(--fw-bold);
  line-height: var(--lh-nav);
}

.charter-panel {
  padding: 0 0 var(--space-6);
}

.charter-panel[hidden] {
  display: none;
}

.charter-panel p {
  display: grid;
  grid-template-columns: 74px minmax(0, 1fr);
  gap: var(--space-4);
  margin: 0;
  padding: var(--space-3) 0;
  color: var(--muted);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
}

.charter-panel p + p {
  border-top: 1px solid rgba(75, 55, 99, .10);
}

.charter-panel strong {
  color: var(--lacquer-deep);
  font-size: var(--fs-body);
  font-weight: var(--fw-bold);
  line-height: var(--lh-body);
  white-space: nowrap;
}

@media (max-width: 1080px) {
  .origin-feature {
    grid-template-columns: 1fr;
    gap: var(--space-7);
  }

  .origin-figure {
    height: 500px;
  }

  .history-head {
    grid-template-columns: 1fr;
    align-items: start;
    gap: var(--space-5);
  }

  .committee-section {
    grid-template-columns: 1fr;
    gap: var(--space-7);
  }

  .direction-list article.direction-visual {
    grid-template-columns: 220px minmax(0, 1fr);
    align-items: start;
  }

  .direction-visual .direction-heading {
    grid-column: 1;
    grid-row: 1 / span 2;
  }

  .direction-visual > p,
  .direction-reverse > p {
    grid-column: 2;
    grid-row: 1;
  }

  .direction-visual .direction-media,
  .direction-reverse .direction-media {
    height: 260px;
    grid-column: 2;
    grid-row: 2;
    margin-top: var(--space-4);
  }
}

@media (max-width: 760px) {
  #profile,
  #history,
  #purpose,
  #governance,
  #committees,
  #charter {
    scroll-margin-top: 94px;
  }

  .about-banner {
    padding-top: var(--space-6);
  }

  .banner-grid {
    padding-bottom: var(--space-6);
  }

  .profile-section,
  .purpose-section,
  .governance-section {
    padding: 70px 0;
  }

  .responsibility-list,
  .tree-split,
  .tree-row,
  .committee-points {
    grid-template-columns: 1fr;
  }

  .history-section {
    padding: var(--space-6);
  }

  .history-timeline::before {
    left: 6px;
  }

  .history-entry {
    grid-template-columns: 1fr;
    gap: var(--space-2);
    padding: 0 0 var(--space-7) 36px;
  }

  .history-entry time {
    text-align: left;
  }

  .history-entry time::after {
    right: auto;
    left: -36px;
  }

  .origin-figure {
    height: 360px;
  }

  .function-list > div {
    grid-template-columns: 1fr;
    gap: var(--space-2);
  }

  .direction-list article {
    grid-template-columns: 1fr;
    gap: var(--space-3);
  }

  .direction-list article.direction-visual {
    grid-template-columns: 1fr;
  }

  .direction-visual .direction-heading,
  .direction-visual > p,
  .direction-visual .direction-media,
  .direction-reverse .direction-media,
  .direction-reverse > p {
    grid-column: auto;
    grid-row: auto;
  }

  .direction-visual .direction-media,
  .direction-reverse .direction-media {
    width: 100%;
    height: 260px;
    margin-top: var(--space-3);
  }

  .direction-reverse > p {
    margin-top: 0;
  }

  .responsibility-band,
  .charter-section {
    padding: var(--space-6);
  }

  .org-tree {
    padding: var(--space-6);
  }

  .tree-split {
    gap: var(--space-5);
    margin-top: var(--space-5);
  }

  .tree-council,
  .tree-standing,
  .tree-leadership,
  .tree-operations,
  .tree-supervision {
    grid-column: 1;
    grid-row: auto;
  }

  .tree-council {
    order: 1;
  }

  .tree-standing {
    order: 2;
  }

  .tree-leadership {
    order: 3;
  }

  .tree-operations {
    order: 4;
  }

  .tree-supervision {
    order: 5;
  }

  .tree-main-branch,
  .tree-row {
    gap: var(--space-5);
  }

  .tree-standing {
    width: 100%;
    text-align: left;
  }

  .tree-split::before,
  .tree-split::after,
  .tree-council::before,
  .tree-standing::before,
  .tree-supervision::before,
  .tree-row::before,
  .tree-row::after,
  .tree-row > .tree-node::before {
    display: none;
  }

  .committee-points div:last-child {
    grid-column: auto;
    max-width: none;
  }

  .charter-heading {
    grid-template-columns: max-content minmax(0, 1fr);
  }

  .charter-heading > small {
    grid-column: 2;
  }

  .charter-panel p {
    grid-template-columns: 1fr;
    gap: var(--space-1);
  }
}

@media (max-width: 520px) {
  .origin-figure {
    height: 260px;
  }

  .direction-visual .direction-media,
  .direction-reverse .direction-media {
    height: 240px;
  }

  .responsibility-band,
  .history-section,
  .charter-section,
  .org-tree,
  .org-tree .tree-node {
    padding: var(--space-5);
  }

  .charter-chapter button {
    min-height: 76px;
    gap: var(--space-3);
  }
}