/* ===== hero ===== */
#hero {
  position: relative;
  min-height: 100svh;
  display: flex;
  align-items: center;
  overflow: hidden;
  isolation: isolate;
}
#hero .hero__sky {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: -2;
  pointer-events: none;
  display: block;
}
/* vignette + readability veil over the canvas */
#hero .hero__veil {
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    radial-gradient(120% 90% at 30% 40%, rgba(4,6,13,0.72) 0%, rgba(4,6,13,0.35) 42%, transparent 75%),
    radial-gradient(1000px 520px at 82% 8%, rgba(58,84,144,0.16), transparent 60%),
    linear-gradient(180deg, rgba(4,6,13,0.55) 0%, transparent 26%, transparent 62%, var(--space-900) 100%);
}
#hero .hero__inner {
  position: relative;
  padding-block: clamp(6rem, 14vh, 9rem);
  max-width: 960px;
}
#hero .hero__eyebrow {
  margin: 0;
}
#hero .hero__kicker {
  margin: 1.4rem 0 0.5rem;
  font-family: var(--font-mono);
  font-size: clamp(0.9rem, 1.4vw, 1.05rem);
  letter-spacing: 0.02em;
  color: var(--text-dim);
}
#hero .hero__title {
  font-size: var(--fs-hero);
  font-weight: 600;
  letter-spacing: -0.025em;
  line-height: 1.04;
  color: var(--text);
  margin: 0.2rem 0 0;
  /* reserve height so rotation doesn't reflow the page */
  min-height: calc(var(--fs-hero) * 2.15);
  display: flex;
  align-items: flex-start;
}
#hero .hero__title-rotator {
  display: inline-block;
  position: relative;
  background: linear-gradient(118deg, var(--gold-bright) 0%, var(--gold) 44%, var(--blue) 118%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
  transition: opacity 0.55s var(--ease), transform 0.55s var(--ease), filter 0.55s var(--ease);
  will-change: opacity, transform;
}
#hero .hero__title-rotator.is-out {
  opacity: 0;
  transform: translateY(-0.35em);
  filter: blur(6px);
}
#hero .hero__title-rotator.is-in {
  opacity: 0;
  transform: translateY(0.42em);
  filter: blur(6px);
}
#hero .hero__lead {
  max-width: 640px;
  margin: 1.6rem 0 0;
  color: var(--text-dim);
}
#hero .hero__cta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-top: 2.2rem;
}
#hero .hero__cta .btn svg { width: 17px; height: 17px; }

/* scroll cue */
#hero .hero__scroll {
  position: absolute;
  left: 50%;
  bottom: clamp(1.2rem, 3.5vh, 2.4rem);
  transform: translateX(-50%);
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
  color: var(--text-faint);
  z-index: 1;
  transition: color 0.25s var(--ease);
}
#hero .hero__scroll:hover { color: var(--gold); }
#hero .hero__scroll-label {
  font-family: var(--font-mono);
  font-size: 0.64rem;
  letter-spacing: 0.32em;
  text-transform: uppercase;
}
#hero .hero__scroll-chevron {
  display: grid;
  place-items: center;
  width: 30px;
  height: 30px;
}
#hero .hero__scroll-chevron svg {
  width: 22px;
  height: 22px;
  animation: heroChevron 2.1s var(--ease) infinite;
}
@keyframes heroChevron {
  0%, 100% { transform: translateY(-3px); opacity: 0.45; }
  50%      { transform: translateY(3px);  opacity: 1; }
}

@media (max-width: 560px) {
  #hero .hero__title { min-height: calc(var(--fs-hero) * 3.1); }
  #hero .hero__cta .btn { flex: 1 1 auto; justify-content: center; }
}

@media (prefers-reduced-motion: reduce) {
  #hero .hero__title-rotator { transition: none; }
  #hero .hero__scroll-chevron svg { animation: none; }
}

/* ===== journey ===== */
/* ===== Journey through cosmic time — scoped to #journey ===== */
@property --jm-a { syntax: '<color>'; inherits: false; initial-value: #ff7a45; }
@property --jm-b { syntax: '<color>'; inherits: false; initial-value: #5c1608; }
@property --jm-gold { syntax: '<number>'; inherits: false; initial-value: 0; }

#journey .journey-scrolly {
  display: grid;
  grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
  gap: clamp(1.6rem, 4vw, 3.4rem);
  align-items: start;
}

/* ---- Sticky visual panel ---- */
#journey .journey-visual { position: relative; min-width: 0; }
#journey .journey-sticky {
  position: sticky;
  top: clamp(74px, 12vh, 100px);
  height: min(72vh, 560px);
  border-radius: var(--radius);
  border: 1px solid var(--border);
  overflow: hidden;
  box-shadow: var(--shadow);
  background: linear-gradient(165deg, var(--jm-a) 0%, var(--jm-b) 82%);
  transition: --jm-a .9s var(--ease), --jm-b .9s var(--ease), --jm-gold .9s var(--ease);
  isolation: isolate;
}
#journey .journey-sticky::after {
  content: "";
  position: absolute; inset: 0;
  border-radius: inherit;
  pointer-events: none;
  background: radial-gradient(95% 65% at 50% 108%, var(--gold-glow), transparent 70%);
  opacity: var(--jm-gold);
  z-index: 2;
}
#journey .journey-canvas {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  z-index: 1;
  display: block;
}

/* ---- Readout ---- */
#journey .journey-readout {
  position: absolute;
  left: clamp(1.2rem, 3vw, 2rem);
  right: clamp(2.6rem, 5vw, 3.4rem);
  bottom: clamp(1.2rem, 3vw, 1.9rem);
  z-index: 3;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  text-shadow: 0 2px 20px rgba(4, 6, 13, 0.65);
}
#journey .journey-readout.anim { animation: jFade .55s var(--ease); }
@keyframes jFade {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: none; }
}
#journey .journey-cap {
  font-family: var(--font-mono);
  font-size: 0.66rem;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--gold-bright);
}
#journey .journey-z {
  font-family: var(--font-mono);
  font-weight: 700;
  font-size: clamp(2.4rem, 7vw, 4rem);
  line-height: 0.95;
  color: var(--star);
  letter-spacing: -0.01em;
}
#journey .journey-age-row {
  display: flex;
  align-items: baseline;
  gap: 0.55rem;
  flex-wrap: wrap;
  margin-top: 0.15rem;
}
#journey .journey-age-label {
  font-family: var(--font-mono);
  font-size: 0.62rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--text-dim);
}
#journey .journey-age {
  font-family: var(--font-mono);
  font-size: 1.05rem;
  color: var(--gold);
}
#journey .journey-title {
  font-family: var(--font-display);
  font-weight: 600;
  font-size: clamp(1.1rem, 2.4vw, 1.5rem);
  color: var(--text);
  letter-spacing: -0.01em;
  margin-top: 0.35rem;
}

/* ---- Progress rail ---- */
#journey .journey-progress {
  position: absolute;
  top: clamp(1.2rem, 3vw, 1.9rem);
  bottom: clamp(1.2rem, 3vw, 1.9rem);
  right: clamp(1rem, 2.4vw, 1.5rem);
  z-index: 3;
  margin: 0; padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  gap: 0.4rem;
}
#journey .journey-progress::before {
  content: "";
  position: absolute;
  top: 5px; bottom: 5px; left: 50%;
  width: 1px;
  transform: translateX(-50%);
  background: linear-gradient(180deg, transparent, rgba(255,255,255,0.22), transparent);
}
#journey .journey-progress__dot {
  position: relative;
  width: 11px; height: 11px;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,0.4);
  background: rgba(4,6,13,0.55);
  transition: background .35s var(--ease), border-color .35s var(--ease),
              box-shadow .35s var(--ease), transform .35s var(--ease);
}
#journey .journey-progress__dot .journey-progress__label {
  position: absolute; width: 1px; height: 1px; overflow: hidden;
  clip: rect(0 0 0 0); white-space: nowrap;
}
#journey .journey-progress__dot.is-done {
  background: var(--gold-deep);
  border-color: var(--gold-deep);
}
#journey .journey-progress__dot.is-active {
  background: var(--gold-bright);
  border-color: var(--gold-bright);
  transform: scale(1.5);
  box-shadow: 0 0 0 4px rgba(232,184,75,0.18), 0 0 14px 2px var(--gold-glow);
}

/* ---- Right column step cards ---- */
#journey .journey-steps {
  display: flex;
  flex-direction: column;
  min-width: 0;
}
#journey .journey-step {
  min-height: clamp(320px, 62vh, 540px);
  display: flex;
  align-items: center;
  outline: none;
}
#journey .journey-step:first-child { padding-top: clamp(0.5rem, 4vh, 2.5rem); }
#journey .journey-step:last-child  { min-height: clamp(300px, 48vh, 440px); }

#journey .journey-step__card {
  width: 100%;
  background: var(--card);
  border: 1px solid var(--border-soft);
  border-left: 2px solid var(--border-soft);
  border-radius: var(--radius);
  padding: clamp(1.4rem, 2.5vw, 2rem);
  opacity: 0.42;
  filter: saturate(0.7);
  transition: opacity .5s var(--ease), filter .5s var(--ease),
              border-color .5s var(--ease), background .5s var(--ease),
              box-shadow .5s var(--ease), transform .5s var(--ease);
}
#journey .journey-step.is-active .journey-step__card {
  opacity: 1;
  filter: none;
  background: var(--card-hover);
  border-color: var(--border);
  border-left-color: var(--gold);
  box-shadow: var(--shadow-gold);
}
#journey .journey-step:focus-visible .journey-step__card {
  outline: 2px solid var(--gold);
  outline-offset: 4px;
}
#journey .journey-step__meta {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  flex-wrap: wrap;
  margin-bottom: 0.9rem;
}
#journey .journey-step__num {
  font-family: var(--font-mono);
  font-size: 0.72rem;
  color: var(--text-faint);
  letter-spacing: 0.15em;
}
#journey .journey-step__z,
#journey .journey-step__age {
  font-family: var(--font-mono);
  font-size: 0.68rem;
  letter-spacing: 0.04em;
  padding: 0.24rem 0.6rem;
  border-radius: 100px;
  border: 1px solid rgba(109,143,214,0.22);
  background: rgba(109,143,214,0.10);
  color: var(--blue);
}
#journey .journey-step.is-active .journey-step__z {
  color: var(--gold);
  border-color: rgba(232,184,75,0.28);
  background: rgba(232,184,75,0.10);
}
#journey .journey-step__card h3 { color: var(--text); margin-bottom: 0.6rem; }
#journey .journey-step__card p { color: var(--text-dim); font-size: var(--fs-body); }

/* ---- Mobile: single column, sticky header readout ---- */
@media (max-width: 820px) {
  #journey .journey-scrolly {
    display: block;
  }
  #journey .journey-visual { margin-bottom: 0.5rem; }
  #journey .journey-canvas { display: none; }
  #journey .journey-sticky {
    position: sticky;
    top: 58px;
    height: auto;
    padding: 0.85rem 1rem 1rem;
    box-shadow: 0 12px 30px -14px rgba(0,0,0,0.7);
  }
  #journey .journey-readout {
    position: static;
    left: auto; right: auto; bottom: auto;
    display: grid;
    grid-template-columns: auto 1fr;
    grid-template-areas:
      "cap   title"
      "z     title"
      "age   title";
    align-items: center;
    column-gap: 1rem;
    row-gap: 0.1rem;
  }
  #journey .journey-cap { grid-area: cap; }
  #journey .journey-z {
    grid-area: z;
    font-size: clamp(1.8rem, 9vw, 2.6rem);
  }
  #journey .journey-age-row { grid-area: age; margin-top: 0.1rem; }
  #journey .journey-title {
    grid-area: title;
    margin-top: 0;
    align-self: center;
    text-align: right;
    font-size: clamp(1rem, 4.4vw, 1.3rem);
  }
  #journey .journey-progress {
    position: static;
    top: auto; bottom: auto; right: auto;
    flex-direction: row;
    justify-content: space-between;
    margin-top: 0.9rem;
    padding-top: 0.2rem;
  }
  #journey .journey-progress::before {
    top: 50%; bottom: auto; left: 5px; right: 5px;
    width: auto; height: 1px;
    transform: translateY(-50%);
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.22), transparent);
  }
  #journey .journey-progress__dot.is-active { transform: scale(1.45); }
  #journey .journey-step {
    min-height: 0;
    padding: 0.6rem 0;
  }
  #journey .journey-step:first-child { padding-top: 1.1rem; }
  /* on mobile every card stays legible; active gets the gold accent */
  #journey .journey-step__card { opacity: 1; filter: none; }
  #journey .journey-step:not(.is-active) .journey-step__card { opacity: 0.72; }
}

@media (prefers-reduced-motion: reduce) {
  #journey .journey-sticky,
  #journey .journey-sticky::after,
  #journey .journey-step__card,
  #journey .journey-progress__dot { transition: none !important; }
  #journey .journey-readout.anim { animation: none !important; }
}

/* ===== timeline ===== */
/* ===== Discovery timeline — scoped under #discoveries ===== */
#discoveries .tl { position: relative; }
#discoveries .tl__desktop { display: block; }
#discoveries .tl__mobile { display: none; }

/* ---- Legend ---- */
#discoveries .tl__legend {
  display: flex; gap: 1.4rem; justify-content: flex-end; flex-wrap: wrap;
  margin-bottom: 0.6rem;
  font-family: var(--font-mono); font-size: 0.66rem; letter-spacing: 0.1em;
  text-transform: uppercase; color: var(--text-faint);
}
#discoveries .tl__lg { display: inline-flex; align-items: center; gap: 0.5rem; }
#discoveries .tl__lg::before {
  content: ""; width: 11px; height: 11px; border-radius: 50%; background: transparent;
}
#discoveries .tl__lg--first::before { border: 2px solid var(--gold); }
#discoveries .tl__lg--co::before { border: 2px solid var(--blue-deep); }

/* ---- Track ---- */
#discoveries .tl__viewport { position: relative; }
#discoveries .tl__track-wrap {
  overflow-x: auto; overflow-y: hidden;
  padding: 2px 2px 14px; margin: 0 -2px;
  scrollbar-width: thin; scrollbar-color: #23304e transparent;
  scroll-behavior: smooth;
}
@media (prefers-reduced-motion: reduce) {
  #discoveries .tl__track-wrap { scroll-behavior: auto; }
}
#discoveries .tl__track-wrap::-webkit-scrollbar { height: 8px; }
#discoveries .tl__track-wrap::-webkit-scrollbar-thumb { background: #23304e; border-radius: 10px; }

#discoveries .tl__track {
  position: relative; display: flex; align-items: flex-start; min-width: 100%;
}
#discoveries .tl__track::before {
  content: ""; position: absolute; left: 0; right: 0; top: 38px; height: 2px;
  background: linear-gradient(90deg, var(--border-soft), var(--border), var(--border-soft));
}
#discoveries .tl__progress {
  position: absolute; left: 0; top: 38px; height: 2px; width: 0;
  background: linear-gradient(90deg, var(--gold-deep), var(--gold) 60%, var(--gold-bright));
  box-shadow: 0 0 12px var(--gold-glow);
  transition: width 0.55s var(--ease);
  pointer-events: none; z-index: 0;
}
@media (prefers-reduced-motion: reduce) { #discoveries .tl__progress { transition: none; } }

#discoveries .tl__node {
  position: relative; flex: 1 0 92px; min-width: 92px;
  display: flex; flex-direction: column; align-items: center; gap: 0.55rem;
  padding: 32px 6px 8px; background: none; border: 0; color: inherit;
  -webkit-tap-highlight-color: transparent;
}
#discoveries .tl__year {
  position: absolute; top: 6px; left: 50%; transform: translateX(-50%);
  font-family: var(--font-mono); font-size: 0.72rem; letter-spacing: 0.06em;
  color: var(--text-faint); white-space: nowrap;
}
#discoveries .tl__dot {
  width: 14px; height: 14px; border-radius: 50%; position: relative; z-index: 1;
  background: var(--space-600); border: 2px solid var(--blue-deep);
  transition: transform 0.3s var(--ease), background 0.3s, border-color 0.3s, box-shadow 0.3s;
}
#discoveries .tl__node--first .tl__dot { border-color: var(--gold); }
#discoveries .tl__node:hover .tl__dot { transform: scale(1.28); }
#discoveries .tl__node:hover .tl__year { color: var(--text-dim); }

#discoveries .tl__node[aria-selected="true"] .tl__dot {
  transform: scale(1.5);
  background: var(--gold); border-color: var(--gold-bright);
  box-shadow: 0 0 0 4px rgba(232,184,75,0.14), 0 0 16px var(--gold-glow);
}
#discoveries .tl__node--co[aria-selected="true"] .tl__dot {
  background: var(--blue); border-color: var(--star);
  box-shadow: 0 0 0 4px rgba(109,143,214,0.16), 0 0 15px rgba(109,143,214,0.45);
}
#discoveries .tl__node[aria-selected="true"] .tl__year { color: var(--text); }

/* live pulse only while on-screen and not hidden */
#discoveries.tl-inview:not(.tl-hidden) .tl__node[aria-selected="true"] .tl__dot {
  animation: tlpulse 2.6s var(--ease) infinite;
}
@keyframes tlpulse { 0%,100% { transform: scale(1.5); } 50% { transform: scale(1.66); } }

/* ---- Detail panel ---- */
#discoveries .tl__panel {
  margin-top: 1.4rem; min-height: 288px;
  background: var(--card); border: 1px solid var(--border-soft); border-radius: var(--radius);
  padding: clamp(1.4rem, 2.5vw, 2.1rem);
  box-shadow: var(--shadow);
}
#discoveries .tl__panelhead {
  display: flex; align-items: center; justify-content: space-between; gap: 1rem;
  margin-bottom: 0.4rem;
}
#discoveries .tl__count {
  font-family: var(--font-mono); font-size: 0.78rem; letter-spacing: 0.08em; color: var(--text-faint);
}
#discoveries .tl__nav { display: flex; gap: 0.5rem; }
#discoveries .tl__navbtn {
  width: 42px; height: 42px; border-radius: 50%; display: grid; place-items: center;
  background: rgba(255,255,255,0.04); border: 1px solid var(--border); color: var(--text);
  transition: transform 0.2s var(--ease), border-color 0.2s, color 0.2s, background 0.2s;
}
#discoveries .tl__navbtn:hover:not(:disabled) {
  border-color: var(--gold); color: var(--gold); transform: translateY(-2px);
  background: rgba(232,184,75,0.06);
}
#discoveries .tl__navbtn:disabled { opacity: 0.32; cursor: not-allowed; }
#discoveries .tl__navbtn svg { width: 20px; height: 20px; }

/* shared detail block (desktop panel + mobile card) */
#discoveries .tl__detail { animation: tlfade 0.45s var(--ease) both; }
@keyframes tlfade { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }

#discoveries .tl__badges {
  display: flex; flex-wrap: wrap; align-items: center; gap: 0.55rem; margin: 0.4rem 0 0.9rem;
}
#discoveries .tl__role { text-transform: uppercase; }
#discoveries .tl__journal {
  font-family: var(--font-mono); font-size: 0.72rem; letter-spacing: 0.02em;
  color: var(--text-dim); background: rgba(255,255,255,0.04);
  border: 1px solid var(--border); border-radius: 100px; padding: 0.28rem 0.66rem;
}
#discoveries .tl__journal--gold {
  color: var(--gold-bright); font-weight: 600;
  background: linear-gradient(135deg, rgba(232,184,75,0.16), rgba(200,145,47,0.07));
  border-color: rgba(232,184,75,0.42); box-shadow: 0 0 16px -7px var(--gold-glow);
}
#discoveries .tl__z {
  font-family: var(--font-mono); font-size: 0.72rem; letter-spacing: 0.03em;
  color: var(--cyan); background: rgba(127,214,232,0.08);
  border: 1px solid rgba(127,214,232,0.26); border-radius: 100px; padding: 0.28rem 0.66rem;
}
#discoveries .tl__title { margin: 0.2rem 0 0.6rem; color: var(--text); max-width: 60ch; }
#discoveries .tl__authors {
  font-family: var(--font-mono); font-size: 0.8rem; color: var(--text-dim);
  line-height: 1.5; margin-bottom: 0.9rem;
}
#discoveries .tl__tags { display: flex; flex-wrap: wrap; gap: 0.45rem; margin-bottom: 0.9rem; }
#discoveries .tl__blurb { max-width: 66ch; margin-bottom: 1.3rem; }
#discoveries .tl__link svg { width: 16px; height: 16px; }

/* ---- Mobile accordion ---- */
#discoveries .tl__mobile { position: relative; padding-left: 22px; }
#discoveries .tl__mobile::before {
  content: ""; position: absolute; left: 7px; top: 8px; bottom: 8px; width: 2px;
  background: linear-gradient(180deg, var(--gold), var(--gold-deep) 35%, var(--border-soft));
}
#discoveries .tl__item { position: relative; margin-bottom: 0.7rem; }
#discoveries .tl__mhead {
  position: relative; width: 100%; display: flex; align-items: center; gap: 0.7rem;
  text-align: left; background: var(--card); border: 1px solid var(--border-soft);
  border-radius: var(--radius-sm); padding: 0.85rem 0.95rem; color: var(--text);
  transition: border-color 0.25s, background 0.25s;
}
#discoveries .tl__item--first .tl__mhead { border-color: rgba(232,184,75,0.2); }
#discoveries .tl__item.is-open .tl__mhead {
  border-color: var(--gold); background: var(--card-hover);
}
#discoveries .tl__mdot {
  position: absolute; left: -21px; top: 50%; transform: translateY(-50%);
  width: 13px; height: 13px; border-radius: 50%; z-index: 1;
  background: var(--space-700); border: 2px solid var(--blue-deep);
  transition: background 0.25s, box-shadow 0.25s, border-color 0.25s;
}
#discoveries .tl__item--first .tl__mdot { border-color: var(--gold); background: var(--gold-deep); }
#discoveries .tl__item.is-open .tl__mdot {
  background: var(--gold); border-color: var(--gold-bright); box-shadow: 0 0 12px var(--gold-glow);
}
#discoveries .tl__myear {
  flex: 0 0 auto; font-family: var(--font-mono); font-size: 0.78rem; color: var(--gold);
}
#discoveries .tl__mtitle {
  flex: 1 1 auto; font-size: 0.88rem; line-height: 1.35; color: var(--text);
}
#discoveries .tl__mchev {
  flex: 0 0 auto; display: inline-flex; color: var(--text-faint);
  transition: transform 0.3s var(--ease), color 0.25s;
}
#discoveries .tl__item.is-open .tl__mchev { transform: rotate(180deg); color: var(--gold); }
#discoveries .tl__mchev svg { width: 16px; height: 16px; }

#discoveries .tl__mpanel {
  display: grid; grid-template-rows: 0fr;
  transition: grid-template-rows 0.35s var(--ease);
}
#discoveries .tl__item.is-open .tl__mpanel { grid-template-rows: 1fr; }
#discoveries .tl__mpanel-in { overflow: hidden; }
#discoveries .tl__item.is-open .tl__mpanel-in { padding: 1rem 0.3rem 0.3rem; }
@media (prefers-reduced-motion: reduce) {
  #discoveries .tl__mpanel { transition: none; }
}

/* ---- Breakpoint swap ---- */
@media (max-width: 760px) {
  #discoveries .tl__desktop { display: none; }
  #discoveries .tl__mobile { display: block; }
}

/* ===== publications ===== */
#publications .pub-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;}

/* ---- stats banner ---- */
#publications .pub-stats{margin-bottom:clamp(2rem,5vw,3rem);}
#publications .pub-stats .stat__value{font-variant-numeric:tabular-nums;letter-spacing:-0.01em;}

/* ---- controls ---- */
#publications .pub-controls{display:flex;flex-direction:column;gap:1.1rem;margin-bottom:1.4rem;}
#publications .pub-controls__top{display:flex;gap:0.8rem;flex-wrap:wrap;align-items:center;}
#publications .pub-search{position:relative;flex:1 1 240px;min-width:0;}
#publications .pub-search svg{position:absolute;left:0.95rem;top:50%;transform:translateY(-50%);width:16px;height:16px;color:var(--text-faint);pointer-events:none;}
#publications .pub-search input{width:100%;padding:0.72rem 1rem 0.72rem 2.5rem;border-radius:100px;background:var(--space-800);border:1px solid var(--border);color:var(--text);font-family:var(--font-body);font-size:0.92rem;transition:border-color .2s var(--ease),box-shadow .2s var(--ease);}
#publications .pub-search input::placeholder{color:var(--text-faint);}
#publications .pub-search input:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px var(--gold-glow);}
#publications .pub-search input::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none;}

#publications .pub-sort{display:inline-flex;background:var(--space-800);border:1px solid var(--border);border-radius:100px;padding:3px;gap:2px;}
#publications .pub-sort button{border:0;background:transparent;color:var(--text-dim);font-family:var(--font-mono);font-size:0.72rem;letter-spacing:0.06em;text-transform:uppercase;padding:0.42rem 0.9rem;border-radius:100px;transition:background .2s var(--ease),color .2s var(--ease);}
#publications .pub-sort button:hover{color:var(--text);}
#publications .pub-sort button[aria-pressed="true"]{background:rgba(232,184,75,0.14);color:var(--gold);}

#publications .pub-chips{display:flex;flex-wrap:wrap;gap:0.5rem;}
#publications .pub-chip{font-family:var(--font-mono);font-size:0.7rem;letter-spacing:0.04em;padding:0.36rem 0.78rem;border-radius:100px;cursor:pointer;color:var(--text-dim);background:rgba(255,255,255,0.03);border:1px solid var(--border-soft);transition:color .2s var(--ease),background .2s var(--ease),border-color .2s var(--ease);}
#publications .pub-chip:hover{color:var(--text);border-color:var(--border);background:rgba(255,255,255,0.06);}
#publications .pub-chip[aria-pressed="true"]{color:var(--space-900);background:linear-gradient(135deg,var(--gold-bright),var(--gold-deep));border-color:transparent;font-weight:700;box-shadow:0 6px 16px -8px var(--gold-glow);}

/* ---- meta / count ---- */
#publications .pub-meta{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:0.6rem;margin:0.2rem 0 1.4rem;}
#publications .pub-count{font-family:var(--font-mono);font-size:0.76rem;letter-spacing:0.1em;text-transform:uppercase;color:var(--text-faint);}
#publications .pub-count b{color:var(--gold);font-weight:400;}

/* ---- list / cards ---- */
#publications .pub-list{display:grid;grid-template-columns:1fr;gap:clamp(1rem,2vw,1.4rem);}
@media (min-width:720px){#publications .pub-list{grid-template-columns:repeat(2,minmax(0,1fr));}}

#publications .pub-card{background:var(--card);border:1px solid var(--border-soft);border-radius:var(--radius);padding:clamp(1.3rem,2.2vw,1.7rem);display:flex;flex-direction:column;gap:0.7rem;transition:transform .3s var(--ease),border-color .3s,background .3s,box-shadow .3s;animation:pub-in .5s var(--ease) both;animation-delay:calc(var(--i,0) * 55ms);}
#publications .pub-card:hover{transform:translateY(-4px);border-color:var(--border);background:var(--card-hover);box-shadow:var(--shadow);}
@keyframes pub-in{from{opacity:0;transform:translateY(14px);}to{opacity:1;transform:none;}}

#publications .pub-card__top{display:flex;align-items:center;gap:0.6rem;flex-wrap:wrap;}
#publications .pub-year{font-family:var(--font-mono);font-size:0.82rem;color:var(--gold);letter-spacing:0.05em;}
#publications .pub-journal{font-family:var(--font-mono);font-size:0.67rem;letter-spacing:0.02em;color:var(--text-dim);padding:0.22rem 0.55rem;border-radius:6px;background:rgba(255,255,255,0.04);border:1px solid var(--border-soft);}
#publications .pub-journal--feature{color:var(--gold-bright);background:rgba(232,184,75,0.12);border-color:rgba(232,184,75,0.3);}
#publications .pub-card h3{font-size:1.06rem;line-height:1.32;color:var(--text);overflow-wrap:anywhere;}
#publications .pub-authors{font-size:0.85rem;color:var(--text-dim);overflow-wrap:anywhere;}
#publications .pub-card__foot{display:flex;align-items:center;gap:0.45rem;flex-wrap:wrap;margin-top:auto;padding-top:0.5rem;}
#publications .pub-role{text-transform:none;}
#publications .pub-view{margin-left:auto;display:inline-flex;align-items:center;gap:0.35rem;font-family:var(--font-mono);font-size:0.72rem;letter-spacing:0.06em;text-transform:uppercase;color:var(--gold);padding:0.3rem 0.15rem;}
#publications .pub-view:hover{color:var(--gold-bright);}
#publications .pub-view svg{width:13px;height:13px;transition:transform .2s var(--ease);}
#publications .pub-view:hover svg{transform:translate(2px,-2px);}

/* ---- empty ---- */
#publications .pub-empty{text-align:center;padding:3rem 1.2rem;border:1px dashed var(--border);border-radius:var(--radius);color:var(--text-dim);}
#publications .pub-empty strong{display:block;margin-bottom:0.3rem;color:var(--text);font-family:var(--font-display);font-size:1.1rem;}
#publications .pub-empty span{font-size:0.9rem;}

/* ---- cta ---- */
#publications .pub-cta{margin-top:clamp(2rem,4vw,2.8rem);display:flex;flex-direction:column;align-items:center;text-align:center;gap:0.85rem;}
#publications .pub-cta .btn svg{width:16px;height:16px;}
#publications .pub-note{font-size:0.85rem;color:var(--text-faint);max-width:540px;}

@media (prefers-reduced-motion:reduce){
  #publications .pub-card{animation:none !important;}
  #publications .pub-view:hover svg{transform:none;}
}

/* ===== worldmap ===== */
/* ===== #capacity — capacity-building world map ===== */
#capacity .cap-stat{
  font-family:var(--font-mono);
  font-size:.82rem;
  line-height:1.7;
  letter-spacing:.01em;
  color:var(--text-dim);
  background:linear-gradient(90deg, rgba(232,184,75,0.08), rgba(232,184,75,0.02) 60%, transparent);
  border:1px solid var(--border-soft);
  border-left:2px solid var(--gold);
  border-radius:var(--radius-sm);
  padding:.9rem 1.1rem;
  margin:0 0 2.4rem;
}
#capacity .cap-stat::before{
  content:"◇";
  color:var(--gold);
  margin-right:.55rem;
}

#capacity .cap-layout{
  display:grid;
  grid-template-columns:minmax(0,1.7fr) minmax(0,1fr);
  gap:clamp(1.2rem,3vw,2.2rem);
  align-items:start;
}

/* ---- map ---- */
#capacity .cap-mapwrap{ margin:0; min-width:0; }
#capacity .cap-map{
  position:relative;
  width:100%;
  aspect-ratio:2 / 1;
  border:1px solid var(--border-soft);
  border-radius:var(--radius);
  overflow:hidden;
  background:
    radial-gradient(120% 90% at 50% 120%, rgba(58,84,144,0.16), transparent 60%),
    radial-gradient(90% 120% at 50% -20%, rgba(232,184,75,0.05), transparent 55%),
    var(--space-850);
  box-shadow:inset 0 0 60px -20px rgba(0,0,0,0.9);
}
#capacity .cap-canvas{
  position:absolute; inset:0;
  width:100%; height:100%;
  display:block;
}

/* ---- pins ---- */
#capacity .cap-pins{ position:absolute; inset:0; pointer-events:none; }
#capacity .cap-pin{
  position:absolute;
  width:30px; height:30px;
  transform:translate(-50%,-50%);
  background:none; border:0; padding:0;
  pointer-events:auto;
  border-radius:50%;
  z-index:2;
}
#capacity .cap-pin::before{ /* the dot */
  content:"";
  position:absolute; left:50%; top:50%;
  width:11px; height:11px; margin:-5.5px 0 0 -5.5px;
  border-radius:50%;
  background:radial-gradient(circle at 35% 30%, var(--gold-bright), var(--gold) 55%, var(--gold-deep));
  box-shadow:0 0 0 1px rgba(4,6,13,0.7), 0 0 10px 1px var(--gold-glow);
  transition:width .2s var(--ease), height .2s var(--ease), margin .2s var(--ease), box-shadow .2s var(--ease);
}
#capacity .cap-pin::after{ /* pulse ring */
  content:"";
  position:absolute; left:50%; top:50%;
  width:11px; height:11px;
  border-radius:50%;
  border:1px solid var(--gold);
  transform:translate(-50%,-50%) scale(1);
  opacity:0;
  animation:cap-pulse 2.8s var(--ease) infinite;
}
#capacity .cap-pin--home::before{
  background:radial-gradient(circle at 35% 30%, #fff, var(--gold-bright) 45%, var(--gold-deep));
}
#capacity .cap-pin[style]{ /* stagger pulses slightly by nth */ }
#capacity .cap-pin:nth-of-type(2)::after{ animation-delay:.4s; }
#capacity .cap-pin:nth-of-type(3)::after{ animation-delay:.8s; }
#capacity .cap-pin:nth-of-type(4)::after{ animation-delay:1.2s; }
#capacity .cap-pin:nth-of-type(5)::after{ animation-delay:1.6s; }
#capacity .cap-pin:nth-of-type(6)::after{ animation-delay:2s; }
#capacity .cap-pin:hover::before,
#capacity .cap-pin.is-active::before{
  width:15px; height:15px; margin:-7.5px 0 0 -7.5px;
  box-shadow:0 0 0 1px rgba(4,6,13,0.7), 0 0 16px 3px var(--gold-glow);
}
#capacity .cap-pin.is-active::after{ animation:none; opacity:.9; transform:translate(-50%,-50%) scale(2.1); }

@keyframes cap-pulse{
  0%{ transform:translate(-50%,-50%) scale(1); opacity:.55; }
  70%{ opacity:0; }
  100%{ transform:translate(-50%,-50%) scale(3.4); opacity:0; }
}

/* ---- popover ---- */
#capacity .cap-pop{
  position:absolute; left:0; top:0;
  width:min(240px, 74%);
  z-index:5;
  pointer-events:none;
  background:rgba(8,11,22,0.94);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  box-shadow:var(--shadow);
  padding:.75rem .85rem .8rem;
  opacity:0;
  visibility:hidden;
  transform:translateY(4px);
  transition:opacity .18s var(--ease), transform .18s var(--ease), visibility .18s;
}
#capacity .cap-pop.is-open{ opacity:1; visibility:visible; transform:none; }
#capacity .cap-pop__top{ display:flex; align-items:baseline; justify-content:space-between; gap:.5rem; }
#capacity .cap-pop__city{ font-family:var(--font-display); font-weight:600; font-size:1rem; color:var(--text); letter-spacing:-.01em; }
#capacity .cap-pop__yr{
  font-family:var(--font-mono); font-size:.66rem; letter-spacing:.04em;
  color:var(--gold); background:rgba(232,184,75,0.10); border:1px solid rgba(232,184,75,0.28);
  padding:.15rem .45rem; border-radius:100px; white-space:nowrap; flex:0 0 auto;
}
#capacity .cap-pop__country{ font-size:.78rem; color:var(--text-faint); margin-top:.05rem; }
#capacity .cap-pop__role{
  font-family:var(--font-mono); font-size:.68rem; letter-spacing:.06em; text-transform:uppercase;
  color:var(--cyan); margin-top:.5rem;
}
#capacity .cap-pop__event{ font-size:.82rem; color:var(--text-dim); margin-top:.3rem; line-height:1.5; }

/* ---- legend ---- */
#capacity .cap-legend{
  display:flex; align-items:center; gap:.5rem;
  font-family:var(--font-mono); font-size:.68rem; letter-spacing:.02em;
  color:var(--text-faint); margin-top:.85rem;
}
#capacity .cap-legend__pin{
  width:9px; height:9px; border-radius:50%; flex:0 0 auto;
  background:var(--gold); box-shadow:0 0 8px 1px var(--gold-glow);
}

/* ---- list ---- */
#capacity .cap-listwrap{ min-width:0; }
#capacity .cap-listhead{
  font-family:var(--font-mono); font-size:.72rem; font-weight:400;
  letter-spacing:.24em; text-transform:uppercase; color:var(--text-faint);
  margin:0 0 1rem;
}
#capacity .cap-list{ display:flex; flex-direction:column; gap:.5rem; }
#capacity .cap-item{
  display:flex; align-items:flex-start; gap:.7rem; width:100%; text-align:left;
  background:var(--card); border:1px solid var(--border-soft);
  border-radius:var(--radius-sm); padding:.7rem .85rem;
  color:var(--text); transition:border-color .25s var(--ease), background .25s var(--ease), transform .25s var(--ease);
}
#capacity .cap-item:hover{ background:var(--card-hover); border-color:var(--border); transform:translateX(2px); }
#capacity .cap-item.is-active{ border-color:rgba(232,184,75,0.5); background:rgba(232,184,75,0.06); }
#capacity .cap-item__dot{
  width:9px; height:9px; margin-top:.5rem; border-radius:50%; flex:0 0 auto;
  background:var(--blue-deep); border:1px solid var(--blue);
  transition:background .25s, box-shadow .25s;
}
#capacity .cap-item:hover .cap-item__dot,
#capacity .cap-item.is-active .cap-item__dot{
  background:var(--gold); border-color:var(--gold-bright); box-shadow:0 0 8px 1px var(--gold-glow);
}
#capacity .cap-item__body{ min-width:0; }
#capacity .cap-item__city{ font-family:var(--font-display); font-weight:600; font-size:.98rem; letter-spacing:-.01em; }
#capacity .cap-item__city em{ font-style:normal; color:var(--text-faint); font-weight:400; }
#capacity .cap-item__meta{
  display:block; font-family:var(--font-mono); font-size:.7rem; letter-spacing:.03em;
  color:var(--text-dim); margin-top:.25rem;
}
#capacity .cap-item__meta b{ color:var(--gold); font-weight:400; }

/* ---- responsive ---- */
@media (max-width:820px){
  #capacity .cap-layout{ grid-template-columns:1fr; }
  #capacity .cap-listhead{ margin-top:.4rem; }
}
@media (min-width:821px){
  /* keep list scannable alongside a taller map */
  #capacity .cap-list{ max-height:none; }
}

@media (prefers-reduced-motion:reduce){
  #capacity .cap-pin::after{ animation:none; opacity:0; }
}
#capacity.is-reduced .cap-pin::after{ animation:none; opacity:0; }
#capacity.is-reduced .cap-pop{ transition:none; }

/* comfortable touch targets for publications controls on small screens */
@media (max-width:560px){
  #publications .pub-chip,
  #publications .pub-sort button{ min-height:40px; display:inline-flex; align-items:center; }
}
