:root {
  --hc-accent: #FFF302;
  --parsons-bg: #101010;
  --text-main: #f0f0f0;
  --text-mid: #aaaaaa;
}

body   { background: var(--parsons-bg); }
header { background: var(--parsons-bg); }

.hc-nav                    { background: var(--parsons-bg); }
.case-sidebar .sidebar-box { background: var(--parsons-bg); }
.tools-panel .tools-box    { background: var(--parsons-bg); }

.hc-tldr .hc-body  { color: var(--hc-accent); }
.hc-ext-link       { color: var(--hc-accent); text-decoration: none; margin-block-start: 0; }
.hc-ext-link:hover { text-decoration: none; }

.fellowship-location {
  color: var(--hc-accent);
  font-size: var(--text-sm);
  text-align: center;
  margin-block-end: 0;
}
.hc-nav-btn.active { color: var(--hc-accent); }
.hc-subheading     { color: var(--hc-accent); }

/* slide panels away when footer is visible */
.panels-hidden .case-sidebar,
.panels-hidden .tools-panel,
.panels-hidden .hc-nav {
  transform: translateY(120%);
  transition: transform 0.4s ease;
}

.case-sidebar,
.tools-panel,
.hc-nav {
  transition: transform 0.4s ease;
}

.fellowship-reel {
  display: flex;
  gap: calc(var(--space-xl) * 3);
  justify-content: center;
  align-items: center;
  block-size: calc(100vh - var(--header-h));
  padding-block: var(--space-xl);
  padding-inline: 4%;
  overflow: hidden;
  inline-size: 100vw;
  margin-inline-start: calc(50% - 50vw);
  box-sizing: border-box;
}

.fellowship-video {
  block-size: 100%;
  inline-size: auto;
  display: block;
  border-radius: 0;
}

.fellowship-side {
  block-size: 100%;
  flex: 0 0 auto;
  aspect-ratio: 9 / 16;
  border-radius: 0;
  overflow: hidden;
}

.fs-showcase {
  display: flex;
  flex-direction: column;
  gap: var(--space-lg);
  inline-size: 92vw;
  margin-inline-start: calc(50% - 46vw);
  margin-block-start: var(--space-xl);
}

.fs-full {
  inline-size: 100%;
  display: block;
}

.fs-full:last-child {
  filter: saturate(1.4) brightness(0.8);
}

.fs-row {
  display: flex;
  gap: var(--space-lg);
  block-size: 40vw;
}

.fs-portrait {
  block-size: 100%;
  inline-size: auto;
  display: block;
  flex: 0 0 auto;
  filter: saturate(1.4) brightness(0.8);
}

.fs-fill {
  flex: 1;
  min-inline-size: 0;
  block-size: 100%;
  object-fit: cover;
  display: block;
}

.fs-fill:last-child {
  flex: 0 0 18vw;
}

.fellowship-side-img {
  inline-size: 100%;
  block-size: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
  transform: scale(1.3);
  transform-origin: center;
}