/* unwd.net — discipline pages
   Ink #0D0D0D · paper #EBE6DC · signal #E6431D. Same hooks as the splash and
   the gallery, so overriding the custom properties restyles all three. */

:root {
  --unwd-ink:    #0D0D0D;
  --unwd-paper:  #EBE6DC;
  --unwd-signal: #E6431D;
  --unwd-rule:   rgba(13, 13, 13, .14);
  --unwd-quiet:  rgba(13, 13, 13, .52);
  --unwd-font:   var(--font-sans, "Archivo", "Helvetica Neue", Helvetica, sans-serif);
}

* { box-sizing: border-box; }
body {
  margin: 0;
  background: var(--unwd-paper);
  color: var(--unwd-ink);
  font-family: var(--unwd-font);
  -webkit-font-smoothing: antialiased;
}
.d-wrap { max-width: 1600px; margin: 0 auto; padding: clamp(20px, 4vw, 64px); }

/* -------------------------------------------------------------------- nav */
.d-nav {
  display: flex; gap: clamp(16px, 3vw, 36px); align-items: baseline;
  padding-bottom: clamp(28px, 5vw, 64px);
}
.d-nav a {
  color: var(--unwd-quiet); text-decoration: none;
  font-size: .62rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .18em;
}
.d-nav a:hover { color: var(--unwd-ink); }
.d-nav__mark {
  color: var(--unwd-ink) !important; font-size: .8rem; letter-spacing: .24em;
  margin-right: auto;
}

/* ------------------------------------------------------------------- head */
.d-head { margin-bottom: clamp(24px, 4vw, 48px); }
.d-head__eyebrow {
  margin: 0 0 clamp(16px, 3vh, 32px);
  font-size: .62rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .18em;
  color: var(--unwd-quiet);
}
.d-head__title {
  margin: 0;
  font-size: clamp(2.6rem, 8vw, 6rem);
  line-height: .94; letter-spacing: -.025em; font-weight: 800;
}
.d-head__title::after {
  content: ""; display: block; width: 64px; height: 8px;
  background: var(--unwd-signal); margin-top: .34em;
}
.d-head__blurb {
  max-width: 56ch; margin: clamp(20px, 3vh, 32px) 0 0;
  font-size: clamp(.95rem, 1.6vw, 1.1rem); line-height: 1.6;
  color: rgba(13, 13, 13, .74);
}

/* ------------------------------------------------------------------- hero */
.d-hero {
  height: clamp(220px, 38vh, 460px);
  margin-bottom: clamp(32px, 5vw, 72px);
  background: #0D0D0D center / cover no-repeat;
  filter: grayscale(1) contrast(1.12);
}

/* ------------------------------------------------------------------- body */
.d-body { margin-bottom: clamp(48px, 7vw, 96px); }

/* the gallery renders on a paper ground here, so soften the dark-panel hooks */
.d-body .unwd-video-card__title { color: var(--unwd-ink); }
.d-body .unwd-video-card__meta,
.d-body .unwd-video-empty { color: var(--unwd-quiet); }
.d-body .unwd-video-card__flag { border-color: var(--unwd-rule); }

.d-stub {
  padding: clamp(28px, 5vw, 56px);
  border: 1px solid var(--unwd-rule);
  max-width: 62ch;
}
.d-stub__label {
  margin: 0 0 .8em;
  font-size: .62rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .18em;
  color: var(--unwd-signal);
}
.d-stub p { margin: 0 0 1em; line-height: 1.6; color: rgba(13, 13, 13, .74); }
.d-stub a {
  color: var(--unwd-ink); text-decoration: none;
  border-bottom: 2px solid var(--unwd-signal); padding-bottom: .1em;
  font-weight: 700;
}

/* ------------------------------------------------------------------- rail */
.d-rail { border-top: 1px solid var(--unwd-rule); padding-top: clamp(20px, 3vw, 36px); }
.d-rail__eyebrow {
  margin: 0 0 clamp(12px, 2vh, 24px);
  font-size: .62rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .18em;
  color: var(--unwd-quiet);
}
.d-rail__list { list-style: none; margin: 0; padding: 0; }
.d-rail__item { border-bottom: 1px solid var(--unwd-rule); }
.d-rail__link {
  display: flex; align-items: baseline; gap: 18px;
  padding: 7px 0; text-decoration: none; color: inherit;
}
.d-rail__num {
  width: 2em;
  font-size: .62rem; font-weight: 700; letter-spacing: .18em;
  color: var(--unwd-quiet);
}
.d-rail__label {
  font-size: clamp(1.4rem, 3.6vw, 3rem); line-height: 1.04;
  letter-spacing: -.02em; font-weight: 730;
  opacity: .3;
  transition: opacity .28s cubic-bezier(.22, 1, .36, 1), color .28s;
}
.d-rail__link:hover .d-rail__label,
.d-rail__link:focus-visible .d-rail__label { opacity: 1; }
.d-rail__item--current .d-rail__label { opacity: 1; color: var(--unwd-signal); }
.d-rail__link:focus-visible { outline: 2px solid var(--unwd-signal); outline-offset: 3px; }

/* ------------------------------------------------------------------- foot */
.d-foot {
  padding-top: 24px; border-top: 1px solid var(--unwd-rule);
  font-size: .6rem; text-transform: uppercase; letter-spacing: .18em;
  color: var(--unwd-quiet);
}

@media (prefers-reduced-motion: reduce) {
  .d-rail__label { transition: none; }
}