/* Scroll reading system: orientation stays, content advances.
 * All copy is visible by default. Enhancement adds focus, never gates access.
 * The only pinned chapters are the challenges and the implementation approach.
 */
.story-nav{display:flex;gap:var(--space-lg);margin-top:var(--space-xl);max-width:440px}
.story-nav a{position:relative;display:flex;align-items:center;flex:1;min-width:0;min-height:52px;padding-top:var(--space-xs);font-family:var(--font-display);font-weight:500;font-size:var(--text-small);white-space:nowrap}
.story-nav a::before,.story-nav a::after{content:'';position:absolute;inset:0 0 auto;height:2px;background:var(--color-rule)}
.story-nav a::after{background:var(--color-accent);transform:scaleX(0);transform-origin:left;transition:transform var(--dur-story) var(--ease-out)}
.story-nav a[aria-current="step"]{font-weight:700;color:var(--color-accent)}
.story-nav a[aria-current="step"]::after,.story-nav a.is-complete::after{transform:scaleX(1)}
.story-nav a:active{text-decoration:underline;text-underline-offset:4px}
[data-story-step]{position:relative;scroll-margin-top:var(--space-lg)}
.story-enhanced [data-story-step]::after{content:'';position:absolute;inset:auto 0 -1px;height:2px;background:var(--color-accent);transform:scaleX(0);transform-origin:left;transition:transform var(--dur-story) var(--ease-out)}
.story-enhanced [data-story-step][data-current]::after{transform:scaleX(1)}
.story-enhanced [data-story-step][data-current] h3{color:var(--color-accent)}
.story-enhanced .challenge-list article{display:flex;align-items:center;min-height:240px;padding-block:var(--space-xl)}
.story-enhanced .challenge-list article:first-child{padding-top:var(--space-md)}
.story-enhanced .challenge-list h3{font-size:clamp(1.5rem,1.2rem + 1.2vw,2.25rem);line-height:1.2;max-width:24ch}
.story-enhanced .challenge-list p{margin-top:var(--space-lg)}
.story-enhanced .approach-steps li{align-content:center;min-height:216px}
.story-enhanced .approach-steps li::after{inset:-1px 0 auto}
.story-enhanced .approach-steps li[data-current] .step-number{font-weight:800}
.approach-status{display:none}
.story-enhanced .approach-status{display:grid;grid-template-columns:64px minmax(0,1fr);align-items:baseline;gap:var(--space-sm);padding-top:var(--space-lg);margin-top:var(--space-lg);border-top:var(--rule) solid var(--color-rule);font-family:var(--font-display);font-weight:600;color:var(--color-accent);line-height:1.4;min-height:72px}
.approach-status-count{font-size:var(--text-small);font-variant-numeric:tabular-nums;white-space:nowrap}
.approach-status-title{font-size:var(--text-body)}
.approach-intro>p{margin-top:var(--space-lg);color:var(--color-ink-2)}
.story-enhanced .service-row::after{inset:-1px 0 auto}
.desktop-nav a[aria-current="location"],.mobile-panel nav a[aria-current="location"]{text-decoration:underline;text-underline-offset:6px;color:var(--color-accent)}
.course-feature{position:relative}
.course-feature::before{content:'';position:absolute;inset:-1px auto auto 0;width:100%;height:2px;background:var(--color-accent);transform:scaleX(0);transform-origin:left}
.story-enhanced .course-feature.is-read::before{transform:scaleX(1);transition:transform var(--dur-story) var(--ease-out)}
@media(hover:hover){.story-nav a:hover{color:var(--color-accent);text-decoration:underline;text-underline-offset:4px}}
@media(min-width:62rem) and (min-height:650px) and (prefers-reduced-motion:no-preference){
  .story-enhanced .challenge{align-items:start;gap:var(--space-5xl)}
  .story-enhanced .challenge .section-intro{position:sticky;top:var(--story-top);align-self:start;padding-block:var(--space-lg)}
  .story-enhanced .challenge-list{padding-top:0}
  .story-enhanced .challenge-list article{min-height:clamp(320px,44svh,480px);padding-block:var(--space-2xl)}
  .story-enhanced .challenge-list article:first-child{padding-top:var(--space-2xl)}
  .story-enhanced .challenge-list p{font-size:var(--text-lead)}
  .story-enhanced .approach{align-items:start}
  .story-enhanced .approach-photo{position:sticky;top:var(--story-top);align-self:start;height:auto;max-height:none}
  .story-enhanced .approach-photo img{height:clamp(300px,calc(100svh - 420px),500px);aspect-ratio:auto;object-position:43% center}
  .story-enhanced .approach-copy{padding-bottom:clamp(160px,22svh,240px)}
  .story-enhanced .approach-steps li{min-height:clamp(240px,34svh,360px);padding-block:var(--space-xl)}
  .story-enhanced .approach-steps h3{font-size:var(--text-h3)}
  .story-enhanced .approach-steps p{margin-top:var(--space-sm)}
}
@media(max-width:61.999rem){
  .story-enhanced .approach-status{display:none}
}
@media(prefers-reduced-motion:reduce){
  .story-nav a::after,.story-enhanced [data-story-step]::after,.course-feature::before{transition:none!important}
  .story-enhanced .challenge-list article,.story-enhanced .approach-steps li{min-height:0;padding-block:var(--space-lg)}
  .story-enhanced .approach-status{display:none}
}
@media print{
  .story-enhanced .challenge .section-intro,.story-enhanced .approach-photo{position:static}
  .story-enhanced .challenge-list article,.story-enhanced .approach-steps li{min-height:0}
  .story-nav,.approach-status{display:none!important}
}