.section-nav {
  overflow-x: auto;
  padding: var(--space-2) 0;
  background: rgba(255, 250, 242, .94);
  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;
}

.page-banner {
  padding: var(--space-7) 0 var(--space-8);
  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);
}

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

.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 {
  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);
}

.hub-section,
.detail-intro-section,
.focus-section,
.process-section,
.query-main {
  padding: var(--space-section) 0;
}

.hub-intro-grid,
.detail-intro-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(340px, .85fr);
  align-items: start;
  gap: var(--space-8);
}

.detail-intro-single {
  grid-template-columns: minmax(0, 900px);
}

.hub-copy h2,
.detail-copy h2,
.focus-section h2,
.process-section h2,
.query-panel h2 {
  margin: 0;
  color: var(--lacquer-deep);
  font-size: var(--fs-title);
  font-weight: var(--fw-bold);
  line-height: var(--lh-tight);
}

.hub-copy .section-deck,
.detail-copy .section-deck,
.focus-section .section-deck,
.process-section .section-deck {
  margin-bottom: var(--space-5);
}

.hub-copy p:not(.section-deck),
.detail-copy p:not(.section-deck),
.query-panel p {
  margin: 0 0 var(--space-4);
  color: var(--muted);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
}

.hub-copy p:last-child,
.detail-copy p:last-child,
.query-panel p:last-child { margin-bottom: 0; }

.hub-visual {
  position: relative;
  height: 360px;
  margin: 0;
  overflow: hidden;
  background: rgba(75, 55, 99, .08);
  box-shadow: var(--shadow);
}

.hub-visual img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.hub-visual figcaption {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  padding: var(--space-3) var(--space-4);
  background: rgba(255, 250, 242, .92);
  color: var(--ink);
  font-size: var(--fs-meta);
}

.directory-wrap { margin-top: var(--space-8); }

.directory-wrap > h2 {
  margin: 0 0 var(--space-5);
  color: var(--lacquer-deep);
  font-size: var(--fs-title);
  font-weight: var(--fw-bold);
}

.directory-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-top: 1px solid var(--indigo);
}

.directory-grid a {
  min-height: 190px;
  padding: var(--space-5);
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  transition: background .2s ease, transform .2s ease;
}

.directory-grid a:nth-child(3n) { border-right: 0; }

.group-about .directory-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.group-about .directory-grid a:nth-child(3n) { border-right: 1px solid var(--line); }
.group-about .directory-grid a:nth-child(2n) { border-right: 0; }

.directory-grid a:hover,
.directory-grid a:focus-visible {
  background: var(--paper);
  transform: translateY(-4px);
}

.directory-grid strong {
  display: block;
  margin-bottom: var(--space-2);
  color: var(--indigo);
  font-size: var(--fs-heading-small);
  font-weight: var(--fw-bold);
  line-height: var(--lh-heading);
}

.directory-grid span {
  color: var(--muted);
  font-size: var(--fs-support);
  line-height: var(--lh-support);
}

.working-band,
.process-section {
  background: rgba(75, 55, 99, .065);
}

.working-band { padding: var(--space-8) 0; }

.working-band h2 {
  margin: 0 0 var(--space-5);
  color: var(--lacquer-deep);
  font-size: var(--fs-title);
  font-weight: var(--fw-bold);
}

.process-list {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: 0;
  padding: 0;
  border-top: 1px solid var(--indigo);
  list-style: none;
  counter-reset: process;
}

.process-list li {
  padding: var(--space-5);
  border-right: 1px solid var(--line);
  counter-increment: process;
}

.process-list li:last-child { border-right: 0; }

.process-list li::before {
  display: block;
  margin-bottom: var(--space-3);
  color: var(--lacquer);
  content: "0" counter(process);
  font-size: var(--fs-heading-small);
  font-weight: var(--fw-heavy);
  font-variant-numeric: tabular-nums;
}

.process-list strong {
  display: block;
  color: var(--ink);
  font-size: var(--fs-heading-small);
  font-weight: var(--fw-bold);
}

.process-list span {
  display: block;
  margin-top: var(--space-2);
  color: var(--muted);
  font-size: var(--fs-support);
  line-height: var(--lh-support);
}

.detail-note {
  padding: var(--space-6);
  background: var(--paper);
  box-shadow: var(--shadow);
}

.detail-note strong {
  display: block;
  margin-bottom: var(--space-2);
  color: var(--indigo);
  font-size: var(--fs-heading-small);
  font-weight: var(--fw-bold);
}

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

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

.focus-row {
  display: grid;
  grid-template-columns: minmax(240px, 360px) minmax(0, 1fr);
  gap: var(--space-7);
  padding: var(--space-5) 0;
  border-bottom: 1px solid var(--line);
}

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

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

.related-pages {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
  margin-top: var(--space-7);
  padding-top: var(--space-5);
  border-top: 1px solid var(--line);
}

.related-pages a {
  color: var(--lacquer);
  font-size: var(--fs-support);
  font-weight: var(--fw-bold);
}

.related-pages a:hover,
.related-pages a:focus-visible { text-decoration: underline; text-underline-offset: 4px; }

.query-panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: var(--space-8);
  padding: var(--space-7);
  background: var(--paper);
  box-shadow: var(--shadow);
}

.query-panel .btn { white-space: nowrap; }

@media (max-width: 1000px) {
  .hub-intro-grid,
  .detail-intro-grid { grid-template-columns: 1fr; }
  .hub-visual { height: 420px; }
  .directory-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .directory-grid a:nth-child(3n) { border-right: 1px solid var(--line); }
  .directory-grid a:nth-child(2n) { border-right: 0; }
}

@media (max-width: 760px) {
  .page-banner { padding: var(--space-6) 0 var(--space-7); }
  .hub-section,
  .detail-intro-section,
  .focus-section,
  .process-section,
  .query-main { padding: var(--space-8) 0; }
  .hub-visual {
    height: 320px;
  }
  .directory-grid { grid-template-columns: 1fr; }
  .directory-grid a,
  .directory-grid a:nth-child(2n),
  .directory-grid a:nth-child(3n) { min-height: auto; border-right: 0; }
  .process-list { grid-template-columns: 1fr 1fr; }
  .process-list li:nth-child(2) { border-right: 0; }
  .process-list li:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
  .focus-row { grid-template-columns: 1fr; gap: var(--space-2); }
  .query-panel { grid-template-columns: 1fr; padding: var(--space-5); }
  .query-panel .btn { justify-self: start; }
}

@media (max-width: 480px) {
  .hub-visual { height: 260px; }
  .process-list { grid-template-columns: 1fr; }
  .process-list li,
  .process-list li:nth-child(2) { border-right: 0; border-bottom: 1px solid var(--line); }
  .process-list li:last-child { border-bottom: 0; }
}