/* One panoramic section: title and timeline travel together, then release down. */
.journey-section{--journey-gutter:max(6vw,calc((100vw - 1480px)/2));--journey-progress:0;position:relative;border-block:1px solid #c4ddf126}
/* A pinned chapter fills the space below the menu, including on anchor arrival. */
.journey-section{scroll-margin-top:-20px}
.journey-pin{padding:70px 0 40px}
.journey-viewport{width:100%}
.journey-panorama{padding-inline:var(--journey-gutter)}
.journey-intro{margin-bottom:45px}
.journey-intro .section-label{margin:0 0 20px;font-size:.75rem}
.journey-status{display:inline-block;padding:7px 12px;border:1px solid #bdd6eb3d;border-radius:100px;font-size:.6875rem;letter-spacing:.1em;color:#c0cbd7}
#experience .journey-intro h2{font-size:clamp(2.7rem,4.4vw,4.6rem);letter-spacing:-.06em;line-height:1.05;margin:30px 0 24px;max-width:none}
.journey-intro>p:not(.section-label){max-width:350px;font-size:.9375rem;color:#b4c1cc;line-height:1.8}
.journey-intro-cue{display:none;align-items:center;gap:22px;font-size:.6875rem;letter-spacing:.11em;color:#a4bed1;margin-top:38px}
.journey-intro-cue>span{font-size:1.7rem;font-weight:300;color:#deefff;letter-spacing:0}
.journey-track{padding:0;margin:0;list-style:none;display:grid;gap:24px}
.journey-chapter{position:relative;min-width:0;padding-top:28px}
.journey-chapter::before{content:"";position:absolute;top:5px;left:0;right:0;height:1px;background:#bcdaf046}
.journey-chapter:last-child::before{content:none}
.journey-node{position:absolute;left:1px;top:0;width:11px;height:11px;border-radius:50%;background:#1b2730;border:1px solid #cee7f7;box-shadow:0 0 16px #b9ddff33;z-index:1}
.journey-card{position:relative;display:flex;flex-direction:column;justify-content:space-between;gap:24px;min-height:355px;height:100%;padding:30px;border:1px solid #b4d3ed36;border-radius:20px;background:linear-gradient(145deg,#c1e2fa12,#0a10182b 68%);overflow:hidden;transition:border-color .45s,background .45s}
.journey-card::before{content:"";position:absolute;pointer-events:none;inset:0;background:radial-gradient(ellipse at 0 0,#bbdcff19,transparent 65%);opacity:0;transition:opacity .5s}
.journey-card-top{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;min-height:60px}
.journey-phase{font-size:.75rem;letter-spacing:.12em;line-height:1.6;color:#cee4f6;white-space:nowrap}
.journey-number{font-family:var(--display);font-size:4.6rem;line-height:.8;font-weight:300;letter-spacing:-.085em;color:#c6dbea42;transition:color .5s}
.journey-card h3{font-family:var(--display);font-size:clamp(1.85rem,2.55vw,2.85rem);line-height:1.12;letter-spacing:-.055em;margin-bottom:17px}
.journey-card-copy>p{font-size:1rem;color:#bbc4cf;line-height:1.75;max-width:360px}
.journey-takeaway{border-top:1px solid #bad9ef2e;padding-top:17px;font-size:.8125rem;color:#9caebf;line-height:1.5}
.journey-footer{margin-inline:var(--journey-gutter);display:flex;align-items:center;justify-content:space-between;gap:30px;margin-top:24px;min-height:26px}
.journey-progress{display:none;align-items:center;gap:14px;font-family:var(--display);font-size:.8125rem;color:#d9eaf6;font-variant-numeric:tabular-nums}
.journey-total{color:#91a3b5}
.journey-progress-line{height:1px;width:clamp(90px,16vw,240px);background:#c3dff232;position:relative}
.journey-progress-line>span{position:absolute;inset:0;background:#d9edff;box-shadow:0 0 10px #d9edff80;transform:scaleX(var(--journey-progress));transform-origin:left}
.journey-scroll-hint{display:none;align-items:center;gap:15px;font-size:.8125rem;color:#a8bac9}
.journey-scroll-arrow{font-size:1.1rem;color:#d0e5f5;transition:transform .35s}
.journey-skip{margin-left:auto;display:inline-flex;align-items:center;gap:15px;font-size:.8125rem;color:#bfcedb;padding-block:8px;transition:color .25s}
.journey-skip:hover{color:#fff}
.journey-section.is-horizontal .journey-pin{position:sticky;top:var(--journey-top,86px);height:var(--journey-height);padding-block:clamp(20px,5svh,60px) 24px;display:flex;flex-direction:column}
.is-horizontal .journey-viewport{flex:1;min-height:0;overflow:hidden}
.is-horizontal .journey-panorama{display:flex;align-items:center;gap:clamp(40px,5vw,90px);width:max-content;height:100%;will-change:transform}
.is-horizontal .journey-intro{flex:0 0 clamp(370px,40vw,630px);width:clamp(370px,40vw,630px);margin:0}
.is-horizontal .journey-intro-cue{display:flex}
.is-horizontal .journey-track{display:flex;gap:28px;width:max-content;height:min(100%,560px)}
.is-horizontal .journey-chapter{flex:0 0 clamp(330px,34vw,490px);width:clamp(330px,34vw,490px);height:100%}
.is-horizontal .journey-card{min-height:0}
.is-horizontal .journey-chapter::before{right:-28px}
.is-horizontal .journey-chapter[data-current="true"] .journey-card{border-color:#ceeaff8c;background:linear-gradient(145deg,#c1e2fa1c,#0a10183d 68%)}
.is-horizontal .journey-chapter[data-current="true"] .journey-card::before{opacity:1}
.is-horizontal .journey-chapter[data-current="true"] .journey-number{color:#d7eaff7a}
.is-horizontal .journey-chapter[data-current="true"] .journey-node{background:#eff8ff;box-shadow:0 0 10px #cde8ff,0 0 28px #cde8ff73}
.is-horizontal .journey-chapter[data-passed="true"] .journey-node{background:#b1cadc}
.is-horizontal .journey-progress,.is-horizontal .journey-scroll-hint{display:flex}
.is-horizontal.is-complete .journey-scroll-arrow{transform:rotate(45deg)}
@media(min-width:1000px){.journey-section:not(.is-horizontal) .journey-track{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-height:750px){
  .journey-section.is-horizontal .journey-pin{padding-block:20px 18px}
  #experience.is-horizontal .journey-intro h2{font-size:clamp(2.5rem,4vw,3.6rem);margin-block:24px 20px}
  .is-horizontal .journey-intro .section-label{margin-bottom:12px}
  .is-horizontal .journey-intro-cue{margin-top:20px}
  .is-horizontal .journey-card{padding:24px;gap:18px}
  .is-horizontal .journey-card-top{min-height:38px}
  .is-horizontal .journey-number{font-size:3.2rem}
  .is-horizontal .journey-card h3{font-size:2rem;margin-bottom:12px}
  .is-horizontal .journey-card-copy>p{font-size:.9375rem;line-height:1.65}
  .is-horizontal .journey-takeaway{padding-top:12px}
  .is-horizontal .journey-footer{margin-top:18px}
}
@media(max-width:760px){
  .journey-section{--journey-gutter:6vw}
  .journey-pin{padding-block:55px 30px}
  .journey-intro .section-label{font-size:.6875rem;letter-spacing:.07em;gap:0}
  .journey-intro .section-label::before{display:none}
  .journey-status{font-size:.625rem;letter-spacing:.06em;padding:6px 9px}
  #experience .journey-intro h2{font-size:2.7rem;line-height:1.06;margin-block:28px 20px}
  .journey-intro>p:not(.section-label){font-size:.875rem;max-width:290px}
  .journey-intro-cue{font-size:.625rem;gap:17px;margin-top:28px}
  .is-horizontal .journey-panorama{gap:28px}
  .is-horizontal .journey-intro{flex-basis:82vw;width:82vw}
  .is-horizontal .journey-track{gap:16px;height:min(100%,480px)}
  .is-horizontal .journey-chapter{flex-basis:82vw;width:82vw}
  .is-horizontal .journey-chapter::before{right:-16px}
  .journey-card{padding:24px;gap:20px;border-radius:17px;min-height:340px}
  .journey-card-top{min-height:40px}
  .journey-number{font-size:3.6rem}
  .journey-phase{font-size:.6875rem}
  .journey-card h3{font-size:2rem;margin-bottom:16px}
  .journey-card-copy>p{font-size:.9375rem;line-height:1.75}
  .journey-takeaway{font-size:.75rem;padding-top:15px}
  .journey-footer{gap:20px;margin-top:20px}
  .journey-progress{gap:10px;font-size:.75rem}
  .journey-progress-line{width:58px}
  .journey-skip{font-size:.75rem;gap:8px}
  .is-horizontal .journey-scroll-hint{display:none}
}
@media(max-height:580px){
  .journey-section.is-horizontal .journey-pin{padding-block:14px}
  #experience.is-horizontal .journey-intro h2{font-size:2.3rem;margin-block:18px 14px}
  .is-horizontal .journey-intro .section-label{font-size:.625rem;margin-bottom:10px}
  .is-horizontal .journey-intro>p:not(.section-label){font-size:.8125rem;line-height:1.65}
  .is-horizontal .journey-status{font-size:.5625rem;padding:5px 9px}
  .is-horizontal .journey-intro-cue{margin-top:16px;font-size:.5625rem}
  .is-horizontal .journey-card{padding:20px;gap:14px}
  .is-horizontal .journey-card-top{min-height:28px}
  .is-horizontal .journey-number{font-size:2.6rem}
  .is-horizontal .journey-card h3{font-size:1.7rem;margin-bottom:12px}
  .is-horizontal .journey-card-copy>p{font-size:.875rem;line-height:1.6}
  .is-horizontal .journey-takeaway{font-size:.6875rem;padding-top:11px}
  .is-horizontal .journey-footer{margin-top:14px}
}

/* Native scroll remains primary; these controls also work by touch or keyboard. */
.journey-controls{display:none;gap:8px;flex-shrink:0}
.is-horizontal .journey-controls{display:flex}
.journey-controls button{display:grid;place-items:center;width:44px;height:44px;padding:0;border:1px solid #c4deef42;border-radius:50%;background:transparent;color:#dcecf8;font:inherit;font-size:1.15rem;transition:background .2s,border-color .2s,color .2s}
.journey-controls button:hover:not(:disabled){border-color:#d2e9faa0;background:#c4dff017}
.journey-controls button:disabled{opacity:.3;cursor:default}
.journey-skip{min-height:44px}
.journey-card h3{letter-spacing:-.035em}
.journey-number{font-variant-numeric:tabular-nums}
@media(max-width:760px){
 .journey-footer{gap:12px;flex-wrap:wrap}
 .journey-progress{margin-right:auto}
 .journey-progress-line{width:36px}
 .journey-skip{margin-left:0}
 .journey-controls{gap:6px}
 .journey-controls button{width:40px;height:44px}
 .journey-card-copy>p{line-height:1.8}
}
.journey-footer{display:grid;grid-template-columns:1fr auto 1fr;align-items:center}
.journey-progress{justify-self:start}
.is-horizontal .journey-scroll-hint{display:none}
.journey-controls{justify-self:center}
.journey-skip{justify-self:end;margin-left:0}
.journey-section:not(.is-horizontal) .journey-skip{grid-column:1/-1}
@media(max-width:380px){.journey-progress-line{display:none}}

/* The rail slides beneath a light fixed to the horizontal viewport's center. */
.is-horizontal .journey-viewport{position:relative}
.is-horizontal .journey-track{position:relative;height:min(calc(100% - 24px),560px)}
.is-horizontal .journey-track::before{content:"";position:absolute;z-index:2;pointer-events:none;left:var(--journey-rail-start,6.5px);top:5px;width:var(--journey-rail-length,0px);height:1px;background:linear-gradient(90deg,#aecde2aa,#ecf8ff);box-shadow:0 0 8px #b9e0ff80;transform:scaleX(var(--journey-rail-progress,0));transform-origin:left center}
.is-horizontal .journey-viewport::after{content:"";position:absolute;z-index:3;pointer-events:none;left:50%;top:var(--journey-rail-y,0px);width:10px;height:10px;border-radius:50%;background:#fff;box-shadow:0 0 0 4px #d7efff22,0 0 12px 4px #d5edffc0,0 0 30px 8px #b0d7ff38;transform:translate(-50%,-50%);opacity:var(--journey-beam-visible,0);transition:opacity .15s}
.is-horizontal .journey-chapter:is([data-current],[data-passed]) .journey-node{background:#1b2730;box-shadow:none}
.is-horizontal .journey-chapter[data-reached="true"] .journey-node{background:#cde4f4;border-color:#e5f4ff;box-shadow:0 0 10px #cde8ff40}
@media(max-width:760px){.is-horizontal .journey-track{height:min(calc(100% - 24px),480px)}}
