/* A full-width white section, with the same content grid as the hero. */
.journey {
  width: 100%;
  margin: 0;
  padding: 110px 0 70px;
  background: #fff;
  color: #102e40;
}

.journey-inner {
  width: min(1512px, 100%);
  margin: 0 auto;
  padding: 0 64px;
}

.journey .eyebrow { color: #216579; }
.journey .small-line { background: #287f98; }
.journey h2 { color: #102e40; }
.journey .journey-layout {
  grid-template-columns: minmax(0, 46%) minmax(0, 54%);
  grid-template-rows: auto 1fr;
  margin-top: 24px;
}
.journey .journey-title {
  color: var(--blue);
  grid-column: 1;
  grid-row: 1;
  align-self: start;
  padding-right: 28px;
}
.journey .chapters {
  grid-column: 1;
  grid-row: 2;
  padding-top: 0;
}
.journey .journey-visual-track {
  grid-column: 2;
  grid-row: 1 / span 2;
  align-self: stretch;
  padding-top: 0;
}
.journey .chapter { padding-right: 28px; }
.journey .chapter:first-child { padding-top: 64px; justify-content: flex-start; }
.journey .chapter h3 { color: var(--ink); }
.journey .chapter > p { color: #475569; }
.journey .step-number,
.journey .chapter.active .step-number { color: var(--yellow); }
.journey .step-name { color: var(--blue); }
.journey .source-list { width: 100%; max-width: 440px; gap: 0; color: var(--ink); scroll-margin-top: 130px; }
.journey .source-list .icon { color: #217b93; }
.journey .source-item { border-bottom: 1px solid #dce6eb; }
.journey .source-item summary {
  display: flex;
  align-items: center;
  gap: 13px;
  min-height: 44px;
  padding: 12px 8px;
  border-radius: 6px;
  list-style: none;
  cursor: pointer;
  font-weight: 600;
  transition: background .2s, color .2s;
}
.journey .source-item summary::-webkit-details-marker { display: none; }
.journey .source-item summary:hover,
.journey .source-item[open] summary { color: #176b83; background: #f0f7fa; }
.journey .source-item summary .icon { flex: 0 0 auto; }
.journey .source-item summary .source-toggle { width: 14px; height: 14px; margin-left: auto; transition: transform .2s; }
.journey .source-item[open] .source-toggle { transform: rotate(45deg); }
.journey .source-item p { padding: 10px 8px 14px 40px; margin: 0; font-size: 12px; line-height: 1.75; color: #475569; }
.journey .source-copy { padding: 12px 8px 18px 40px; }
.journey .source-copy p { padding: 0; font-size: 13px; line-height: 1.85; }
.journey .source-copy p + p { margin-top: 14px; }
/* Coloured labels sit directly on the white section, without a badge. */
.journey .source-label {
  font-weight: 800;
  white-space: nowrap;
}
.journey .source-label-data { color: var(--blue); }
.journey .source-label-value { color: var(--yellow); }
.journey .source-formats { width: 100%; max-width: 440px; margin-top: 24px; }
.journey .format-heading { color: var(--ink); font-size: 12px; font-weight: 700; line-height: 1.6; }
.journey .source-formats .format-list { margin-top: 9px; }
.journey .format-list span {
  border-color: #cfdee6;
  color: #355669;
  background: #f5f9fb;
}
.journey .chapter > p.chapter-footnote { color: #475569; }
.journey .quality-example { color: #475569; max-width: 440px; }
.journey .quality-example > div { border-color: #dce6eb; }
.journey #fiabiliser > p + p { margin-top: 14px; }
.journey .quality-example > div > span:not(.quality-dot) { min-width: 0; }
.journey .quality-dot { background: var(--yellow); flex-shrink: 0; }
.journey .quality-dot.valid { background: #74cfa3; }
.journey .quality-example .icon { color: #74cfa3; flex-shrink: 0; }
.journey .quality-warning small { color: var(--yellow); white-space: nowrap; flex-shrink: 0; }
.journey .mini-metrics strong { color: var(--ink); }
.journey .mini-metrics .icon,
.journey .metric-symbol { color: #1c7a91; }
.journey .mini-metrics span:not(.metric-symbol) { color: #475569; }
.journey .chapter > p.choose-label { color: #475569; }
.journey .case-button {
  color: #285567;
  border-color: #c7d8e1;
  background: #fff;
  transition: background .2s, border-color .2s, color .2s;
}
.journey .case-button:hover { background: #f0f7fa; border-color: #6c9cac; }
.journey .case-button.active {
  color: #14586e;
  border-color: #1e748f;
  background: #eaf5f9;
}
.journey .analysis-panels {
  width: 100%;
  max-width: 440px;
  min-height: 210px;
  margin-top: 20px;
  padding-top: 18px;
  border-top: 1px solid #dce6eb;
}
.journey .analysis-panel p { color: #475569; font-size: 13px; line-height: 1.85; }
.journey .analysis-panel p + p { margin-top: 12px; }
.journey .analysis-panel:focus-visible { outline: 2px solid #176b83; outline-offset: 7px; border-radius: 2px; }
.analysis-panel[hidden], .carbon-scope-selector[hidden] { display: none; }
.journey .action-flow { width: 100%; max-width: 440px; color: var(--ink); }
.journey .action-flow li { align-items: flex-start; }
.journey .action-flow li > div { min-width: 0; }
.journey .action-flow h4 { font-size: 16px; font-weight: 700; line-height: 1.4; letter-spacing: 0; }
.journey .action-flow p { margin-top: 5px; color: #475569; font-size: 12px; line-height: 1.75; }
.journey .action-flow span {
  flex-shrink: 0;
  color: #216579;
  border-color: #ccdde5;
  background: #f4f9fb;
}
.journey .text-link,
.journey .text-link span { color: #185b73; }
.journey .chapter :is(a, button, summary):focus-visible {
  outline: 2px solid #176b83;
  outline-offset: 4px;
}

/* Match the petrol-green home while retaining a blue glow behind the 3D scene. */
.journey .story-world {
  color: #eef6fa;
  border-color: #2b5650;
  background:
    radial-gradient(ellipse 72% 62% at 50% 46%, rgba(68,162,190,.45) 0%, rgba(68,162,190,.16) 42%, rgba(68,162,190,0) 80%),
    linear-gradient(140deg, #0b3532 12%, #103d38 60%, #0b3532 100%);
}
.journey .story-visual-header .micro-label,
.journey .illustration-label,
.journey .story-controls { color: #9bb8bd; }
.journey .scene-steps a:not(.active) { color: #9dbbc0; border-color: #3c635e; }
.journey .scene-steps a:not(.active):hover { color: #fff; }
.journey .scene-insight {
  background: rgba(9,45,43,.96);
  border-color: #355c56;
  box-shadow: 0 7px 25px #061f1d55;
}
.journey .scene-insight p { color: #acc5ca; }
.journey .insight-icon { background: #184b46; }
.journey .insight-copy { flex: 1; min-width: 0; }
.carbon-scope-selector { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 13px; }
.scope-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 34px;
  padding: 6px 12px;
  border: 1px solid #466760;
  border-radius: 5px;
  background: transparent;
  color: #bed2d5;
  font-size: 11px;
  font-weight: 600;
  line-height: 1.5;
  transition: color .18s, border-color .18s, background .18s;
}
.scope-button[data-scope="1"] { --button-scope-color: #f6bb28; }
.scope-button[data-scope="2"] { --button-scope-color: #76cce0; }
.scope-button[data-scope="3"] { --button-scope-color: #9bddbc; }
.scope-button::before { content: ''; width: 5px; height: 5px; border-radius: 50%; background: var(--button-scope-color); opacity: .8; }
.scope-button:hover { background: #1b4c46; color: #fff; border-color: #7fa49b; }
.scope-button.active { color: var(--scope-color); border-color: var(--scope-color); background: rgba(var(--scope-rgb),.10); }
.scope-button.active::before { opacity: 1; }
.scope-button:focus-visible { outline: 2px solid var(--scope-color); outline-offset: 3px; }
.journey .story-world.is-carbon { min-height: min(600px, calc(100svh - 130px)); }
.journey .story-world.is-carbon :is(.world-canvas, .world-effects, .world-labels) { top: 116px; height: calc(100% - 278px); }
.journey .story-world.is-carbon .scene-insight { align-items: flex-start; }
.journey .story-world.is-carbon .insight-spark { display: none; }
.journey .story-world.is-carbon .insight-icon { color: var(--scope-color); }
.journey .story-world.is-carbon .scene-callout { display: none; }

@media (min-width: 1151px) {
  .journey-inner {
    width: min(2000px, 100%);
    padding-left: clamp(40px, 4vw, 88px);
    padding-right: clamp(24px, 3vw, 64px);
  }
  .journey h2 { font-size: clamp(40px, 4.2vw, 76px); }
  .journey .journey-layout { grid-template-columns: minmax(0, 40%) minmax(0, 60%); }
  .journey .chapter { padding-right: clamp(16px, 1.6vw, 32px); }
  .journey .chapter h3 {
    font-size: clamp(40px, 3.5vw, 70px);
    line-height: 1.14;
    letter-spacing: -.04em;
    margin-bottom: 24px;
  }
  .journey .chapter > p { max-width: 440px; font-size: 14px; }
  .journey .chapter-heading { gap: 18px; margin-bottom: 28px; }
  .journey .step-number { font-size: 14px; }
  .journey .step-name { font-size: 12px; }
  .journey .source-list { font-size: 13px; }
  .journey .source-list .icon { width: 19px; height: 19px; }
  .journey .format-list { gap: 8px; }
  .journey .format-list span { font-size: 11px; padding: 4px 9px; }
  .journey .chapter > p.chapter-footnote { font-size: 11px; }
  .journey .quality-example { font-size: 13px; }
  .journey .quality-example > div { padding: 15px 0; }
  .journey .quality-warning small { font-size: 11px; }
  .journey .mini-metrics { gap: 20px; }
  .journey .mini-metrics strong { font-size: 14px; }
  .journey .mini-metrics span:not(.metric-symbol) { font-size: 12px; }
  .journey .chapter > p.choose-label { font-size: 12px; }
  .journey .case-button { font-size: 12px; padding: 11px 14px; }
  .journey .analysis-panel p { font-size: 14px; }
  .journey .action-flow { font-size: 13px; gap: 20px; }
  .journey .action-flow h4 { font-size: 18px; }
  .journey .action-flow p { font-size: 13px; }
  .journey .action-flow span { font-size: 11px; width: 28px; height: 28px; }
  .journey .text-link { font-size: 14px; }
  .journey .story-world { max-height: 940px; }
  .journey .story-visual-header .micro-label { font-size: 10px; }
  .journey .scene-steps a { font-size: 11px; }
  .journey .scene-steps a > span:first-child { font-size: 10px; }
  .journey .scene-insight { min-height: 115px; }
  .journey .scene-insight h4 { font-size: 15px; }
  .journey .scene-insight p { font-size: 11px; max-width: 560px; }
  .journey .insight-eyebrow { font-size: 9px; }
  .journey .scene-callout { font-size: 11px; }
}

@media (min-width: 901px) and (max-width: 1150px) {
  .journey-inner { padding: 0 35px; }
  .journey .chapter h3 { font-size: clamp(34px, 3.3vw, 38px); }
  .journey .chapter > p { max-width: 360px; font-size: 13px; }
  .journey .source-list { font-size: 12px; }
  .journey .quality-example { font-size: 12px; }
  .journey .chapter > p.chapter-footnote { font-size: 11px; }
}

@media (min-width: 681px) and (max-width: 900px) {
  .journey { padding-top: 90px; }
  .journey-inner { padding: 0 26px; }
  .journey .journey-layout { grid-template-columns: minmax(0, 47%) minmax(0, 53%); }
  .journey .chapter { padding-right: 20px; }
  .journey .chapter h3 { font-size: clamp(27px, 3.8vw, 34px); }
  .journey .chapter > p { font-size: 12px; }
  .journey .source-list { font-size: 11px; }
  .journey .quality-example { font-size: 10px; }
  .journey .chapter > p.chapter-footnote { font-size: 10px; }
}

@media (max-width: 680px) {
  .journey { padding: 75px 0 45px; }
  .journey-inner { padding: 0 21px; }
  .journey .journey-title { order: 0; padding-right: 0; }
  .journey .journey-visual-track { order: 1; margin-top: 24px; padding-top: 8px; background: #fff; }
  .journey .chapters { order: 2; padding-top: 20px; }
  .journey .chapter { padding-left: 0; padding-right: 0; }
  .journey .chapter h3 { font-size: clamp(27px, 7.6vw, 34px); }
  .journey .chapter > p { font-size: 13px; }
  .journey .chapter > p.chapter-footnote { font-size: 10px; }
  .journey .action-flow p { font-size: 13px; }
  .journey .source-list { scroll-margin-top: 430px; }
  .journey .analysis-panels { min-height: 225px; margin-top: 18px; padding-top: 16px; }
  .journey .story-world.is-carbon { height: 449px; min-height: 0; }
  .journey .story-world.is-carbon :is(.world-canvas, .world-effects, .world-labels) { top: 68px; height: 245px; }
  .journey .story-world.is-carbon .scene-insight p { font-size: 9px; line-height: 1.5; }
  .carbon-scope-selector { gap: 6px; margin-top: 9px; }
  .scope-button { min-height: 30px; font-size: 10px; padding: 5px 10px; }
}

@media (prefers-reduced-motion: reduce) {
  .journey .case-button,
  .scope-button,
  .journey .source-item summary,
  .journey .source-item summary .source-toggle { transition: none; }
}