/* A connected reading path, scoped to its three participating pages. */
.journey-page {
  --journey-rail: max(clamp(22px, 5vw, 80px), calc((100vw - 1280px) / 2));
  overflow-wrap: break-word;
}

.journey-page .journey-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  min-height: 82px;
  padding: 14px var(--journey-rail);
  border-bottom: 1px solid var(--line);
}
.journey-page .journey-brand {
  display: inline-flex;
  align-items: center;
  min-height: 48px;
  color: var(--ink);
  font: 600 1.15rem/1.25 var(--font-display);
  letter-spacing: -.025em;
}
.journey-page .journey-site-nav { display: flex; flex-wrap: wrap; gap: 8px 32px; }
.journey-page .journey-site-nav a {
  display: inline-flex;
  align-items: center;
  min-height: 48px;
  font-size: .875rem;
  font-weight: 600;
  color: var(--ink-soft);
}
.journey-page .journey-site-nav a:hover { text-decoration: underline; text-underline-offset: 5px; }
.journey-page .journey-trail {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px 32px;
  margin: 0 var(--journey-rail);
  padding: 14px 0;
  border-bottom: 1px solid var(--line);
}
.journey-page .journey-trail p { margin: 0; font-size: .8125rem; font-weight: 600; }
.journey-page .journey-trail p > span { margin-left: 14px; font-weight: 400; color: var(--muted); }
.journey-page .journey-trail ol { display: flex; gap: 10px 24px; list-style: none; margin: 0; padding: 0; }
.journey-page .journey-trail li { margin: 0; }
.journey-page .journey-trail a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 48px;
  border-bottom: 2px solid transparent;
  font-size: .8125rem;
  color: var(--muted);
}
.journey-page .journey-trail a[aria-current="page"] { color: var(--ink); border-color: var(--gold); font-weight: 600; }
.journey-page .journey-trail a:hover { color: var(--ink); border-color: var(--line-strong); }
.journey-page .journey-kicker {
  margin: 0;
  color: var(--gold);
  font: 700 .75rem/1.5 var(--font-body);
  letter-spacing: .1em;
  text-transform: uppercase;
}
.journey-page .journey-actions { display: flex; flex-wrap: wrap; gap: 20px 30px; align-items: center; margin-top: 30px; }
.journey-page .journey-action,
.journey-page .journey-text-link {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  min-height: 48px;
  font-size: .875rem;
  font-weight: 600;
  text-underline-offset: 5px;
}
.journey-page .journey-action-primary { padding: 13px 20px; background: var(--night); color: var(--cream); border: 1px solid var(--night); }
.journey-page .journey-action-primary:visited { color: var(--cream); }
.journey-page .journey-action-primary:hover { background: var(--ink-soft); }
.journey-page .journey-text-link { border-bottom: 1px solid currentColor; color: var(--ink-soft); }
.journey-page .journey-text-link:hover { color: var(--clay); }
.journey-page .journey-note { font-size: .8125rem; line-height: 1.65; color: var(--muted); }
.journey-page .journey-opening {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 290px;
  align-items: center;
  gap: 60px;
  padding: 68px var(--journey-rail) 72px;
}
.journey-page .journey-opening h1 {
  max-width: 850px;
  margin: 22px 0 0;
  font-size: clamp(3.4rem, 5.7vw, 5.7rem);
  line-height: 1.01;
  letter-spacing: -.045em;
  text-wrap: balance;
}
.journey-page .journey-lead { max-width: 610px; margin: 24px 0 0; font-size: 1.125rem; line-height: 1.7; color: var(--ink-soft); }
.journey-page .journey-signature { width: 290px; margin: 0; }
.journey-page .journey-feature { padding: 0 var(--journey-rail) 64px; background: var(--night); color: var(--cream); }
.journey-page .journey-feature .journey-trail { margin: 0; border-color: var(--kg-color-rule-on-night); padding-block: 18px; }
.journey-page .journey-feature .journey-trail a,
.journey-page .journey-feature .journey-trail p > span { color: var(--kg-color-on-night-soft); }
.journey-page .journey-feature .journey-trail a[aria-current="page"] { color: var(--cream); border-color: var(--kg-color-on-night-accent); }
.journey-page .journey-feature .journey-trail a:hover { color: var(--cream); border-color: var(--cream); }
.journey-page .journey-feature .journey-kicker { color: var(--kg-color-on-night-accent); }
.journey-page .journey-feature-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 70px; padding-top: 54px; }
.journey-page .journey-feature h2 { margin: 18px 0 24px; color: var(--cream); font-size: clamp(2.6rem, 4.3vw, 4rem); line-height: 1.05; letter-spacing: -.04em; }
.journey-page .journey-feature-intro { max-width: 440px; color: var(--kg-color-on-night-soft); font-size: 1.125rem; line-height: 1.7; }
.journey-page .journey-path { list-style: none; padding: 0; margin: 0; }
.journey-page .journey-path li { display: grid; grid-template-columns: 28px 1fr; gap: 20px; padding: 26px 0; border-bottom: 1px solid var(--kg-color-rule-on-night); }
.journey-page .journey-path li:first-child { padding-top: 0; }
.journey-page .journey-path li:last-child { padding-bottom: 0; border-bottom: 0; }
.journey-page .journey-path-number { color: var(--kg-color-on-night-accent); font: 1.35rem var(--font-display); white-space: nowrap; }
.journey-page .journey-path h3 { margin: 9px 0 6px; font-size: 1.65rem; line-height: 1.2; letter-spacing: -.02em; color: var(--cream); }
.journey-page .journey-path h3 a { display: inline-block; min-height: 48px; padding-block: 6px; }
.journey-page .journey-path h3 a:hover { text-decoration: underline; text-underline-offset: 5px; }
.journey-page .journey-path p:not(.journey-kicker) { color: var(--kg-color-on-night-soft); line-height: 1.65; margin: 0; }
.journey-page .journey-path p.journey-note { margin-top: 10px; }
.journey-page .journey-feature a:focus-visible { outline-color: var(--kg-color-on-night-accent); }
.journey-page .journey-folio,
.journey-page .journey-onward { padding: 66px var(--journey-rail); }
.journey-page .journey-section-intro { max-width: 710px; margin-bottom: 34px; }
.journey-page .journey-section-intro h2 { margin: 16px 0; font-size: clamp(2rem, 3.1vw, 3rem); line-height: 1.1; letter-spacing: -.03em; }
.journey-page .journey-section-intro > p:not(.journey-kicker) { margin: 0; color: var(--ink-soft); line-height: 1.7; }
.journey-page .journey-shelf { display: grid; grid-template-columns: 140px minmax(0, 1fr) minmax(200px, 300px); align-items: start; gap: 38px; border-top: 1px solid var(--line-strong); padding: 30px 0; }
.journey-page .journey-shelf h3 { margin: 0 0 8px; font-size: 2rem; line-height: 1.1; letter-spacing: -.025em; }
.journey-page .journey-shelf h3 a { display: inline-flex; align-items: center; gap: 16px; min-height: 48px; }
.journey-page .journey-shelf p:not(.journey-kicker) { margin: 0; color: var(--ink-soft); line-height: 1.7; max-width: 520px; }
.journey-page .journey-shelf > .journey-text-link { justify-self: start; margin-top: 2px; }
.journey-page .journey-project-links { padding: 0; margin: 15px 0 0; list-style: none; }
.journey-page .journey-project-links a { display: inline-flex; align-items: center; min-height: 44px; padding-block: 8px; font-size: .875rem; text-decoration: underline; text-underline-offset: 4px; }
.journey-page .journey-margins { display: grid; grid-template-columns: 1fr 1fr; gap: 70px; padding: 48px var(--journey-rail); border-top: 1px solid var(--line); background: var(--wash); }
.journey-page .journey-margins h2 { max-width: 400px; margin: 14px 0 0; font-size: 2.3rem; line-height: 1.15; }
.journey-page .journey-margins nav { display: grid; grid-template-columns: 1fr; gap: 10px; }
.journey-page .journey-margins nav a { display: flex; justify-content: space-between; align-items: center; gap: 16px; min-height: 48px; border-bottom: 1px solid var(--line); padding: 8px 0; font-size: .9375rem; }
.journey-page .journey-reading-note { display: flex; justify-content: space-between; align-items: center; gap: 32px; padding: 16px var(--journey-rail) 0; }
.journey-page .journey-reading-note p { max-width: 600px; margin: 0; color: var(--muted); font-size: .8125rem; line-height: 1.65; }
.journey-page .journey-reading-note .journey-text-link { flex-shrink: 0; font-size: .8125rem; }
.journey-page.journey-essay .essay-hero { min-height: 0; padding-block: 64px; }
.journey-page .journey-companion { display: grid; grid-template-columns: 1fr 1fr; gap: 70px; padding: 64px var(--journey-rail); background: #e2e7df; border-top: 1px solid var(--line); }
.journey-page .journey-companion h2 { max-width: 580px; margin: 18px 0 0; font-size: clamp(2.3rem, 3.6vw, 3.5rem); line-height: 1.08; letter-spacing: -.035em; }
.journey-page .journey-companion > div > p:not(.journey-kicker):not(.journey-note) { margin: 0; font-size: 1.125rem; line-height: 1.7; }
.journey-page .journey-companion .journey-action { margin-block: 24px 16px; }
.journey-page .journey-companion .journey-note { margin: 0; }
.journey-page .journey-onward { background: var(--wash); }
.journey-page .journey-onward-links { display: grid; grid-template-columns: 1fr 1fr; gap: 50px; margin: 10px 0 30px; }
.journey-page .journey-onward-links article { padding-top: 24px; border-top: 1px solid var(--line-strong); }
.journey-page .journey-onward-links h3 { max-width: 500px; margin: 14px 0 16px; font-size: 1.9rem; line-height: 1.2; letter-spacing: -.025em; }
.journey-page .journey-onward-links h3 a { display: inline-block; min-height: 48px; padding-block: 4px; color: var(--ink); }
.journey-page .journey-onward-links h3 a:hover { text-decoration: underline; text-underline-offset: 5px; }
.journey-page .journey-onward-links p:not(.journey-kicker) { max-width: 510px; margin: 0; line-height: 1.7; color: var(--ink-soft); }

@media (max-width: 1000px) {
  .journey-page .journey-opening { grid-template-columns: minmax(0, 1fr) 230px; gap: 30px; }
  .journey-page .journey-signature { width: 230px; }
  .journey-page .journey-shelf { grid-template-columns: 100px minmax(0, 1fr); gap: 20px; }
  .journey-page .journey-shelf > .journey-text-link { grid-column: 2; }
  .journey-page .journey-feature-grid,
  .journey-page .journey-companion { gap: 40px; }
}

@media (max-width: 700px) {
  .journey-page .journey-header { display: block; padding-block: 8px; }
  .journey-page .journey-site-nav { justify-content: space-between; gap: 6px 22px; }
  .journey-page .journey-site-nav a { font-size: .8125rem; }
  .journey-page .journey-trail { display: block; padding-block: 12px 4px; }
  .journey-page .journey-trail ol { justify-content: space-between; gap: 10px; margin-top: 8px; }
  .journey-page .journey-trail a { gap: 5px; font-size: .75rem; }
  .journey-page .journey-opening { grid-template-columns: 1fr; gap: 32px; padding-block: 38px 40px; }
  .journey-page .journey-opening h1 { font-size: clamp(2.65rem, 10.8vw, 4.5rem); margin-top: 20px; }
  .journey-page .journey-lead { font-size: 1rem; margin-top: 22px; }
  .journey-page .journey-actions { align-items: flex-start; gap: 14px 24px; margin-top: 26px; }
  .journey-page .journey-signature { width: 240px; justify-self: center; }
  .journey-page .journey-feature { padding-bottom: 38px; }
  .journey-page .journey-feature .journey-trail { padding-block: 18px 6px; }
  .journey-page .journey-feature-grid { grid-template-columns: 1fr; padding-top: 34px; gap: 34px; }
  .journey-page .journey-feature h2 { font-size: 2.7rem; }
  .journey-page .journey-feature-intro { font-size: 1rem; margin-bottom: 0; }
  .journey-page .journey-path { border-top: 1px solid var(--kg-color-rule-on-night); }
  .journey-page .journey-path li,
  .journey-page .journey-path li:first-child { padding-top: 25px; gap: 12px; grid-template-columns: 28px 1fr; }
  .journey-page .journey-path h3 { font-size: 1.6rem; }
  .journey-page .journey-folio,
  .journey-page .journey-onward { padding-block: 42px; }
  .journey-page .journey-shelf { grid-template-columns: 1fr; gap: 12px; padding-block: 25px; }
  .journey-page .journey-shelf > .journey-text-link { grid-column: auto; margin-top: 8px; }
  .journey-page .journey-margins,
  .journey-page .journey-companion { grid-template-columns: 1fr; gap: 28px; padding-block: 40px; }
  .journey-page .journey-reading-note { display: block; padding-top: 14px; }
  .journey-page .journey-reading-note .journey-text-link { margin-top: 8px; }
  .journey-page.journey-essay .essay-hero { padding-block: 40px; }
  .journey-page .journey-onward-links { grid-template-columns: 1fr; gap: 32px; }
  .journey-page .journey-onward-links h3 { font-size: 1.7rem; }
}
