/* "Nos solutions techniques" — scroll narrative (canvas)
   Scoped under #solStory so its tokens/classes never leak into the rest of the site. */
#solStory{
  --story-ink:#f5f7fb;--story-muted:rgba(226,232,240,.66);--story-edge:rgba(255,255,255,.14);
  position:relative;
}
.story-track{position:relative;height:440vh}
.story-stage{position:sticky;top:0;height:100vh;overflow:hidden;background:#000}
.story-canvas{position:absolute;inset:0;display:block;transition:filter .15s linear}
.story-layer{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:0 7vw;pointer-events:none;will-change:opacity,transform}
.story-title{font-family:'Montserrat',sans-serif;font-weight:700;font-size:clamp(2.1rem,6.2vw,4.6rem);line-height:1.02;letter-spacing:-.02em;max-width:16ch;color:var(--story-ink);text-wrap:balance;text-shadow:0 2px 46px rgba(0,0,0,.7)}
.story-sub{margin-top:1.5rem;max-width:44ch;font-family:'Open Sans',sans-serif;font-size:clamp(1rem,2.1vw,1.3rem);line-height:1.5;color:var(--story-muted);font-weight:400;text-shadow:0 1px 28px rgba(0,0,0,.85)}
.story-stats{margin-top:1.6rem;display:flex;align-items:center;justify-content:center;gap:2.25rem}
.story-stat-v{font-family:'Montserrat',sans-serif;font-weight:700;font-size:1.3rem;color:var(--story-ink)}
.story-stat-l{font-family:'Open Sans',sans-serif;font-size:.6875rem;letter-spacing:.04em;text-transform:uppercase;color:var(--story-muted)}
.story-tags{pointer-events:auto;margin-top:1rem;display:flex;flex-wrap:wrap;justify-content:center;gap:.5rem}
.story-tag{font-family:'Open Sans',sans-serif;font-size:.6875rem;font-weight:600;letter-spacing:.03em;text-transform:uppercase;padding:.3rem .75rem;border:1px solid var(--story-edge);border-radius:999px;color:var(--story-muted);background:rgba(255,255,255,.04)}
.story-rail{position:absolute;top:50%;right:clamp(16px,3vw,42px);transform:translateY(-50%);display:flex;flex-direction:column;gap:13px;z-index:5}
.story-rail .tick{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.22);transition:all .4s ease}
.story-rail .tick.on{background:var(--story-ink);box-shadow:0 0 14px rgba(255,255,255,.6);transform:scale(1.15)}
.story-hint{position:absolute;left:50%;bottom:38px;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:.6rem;z-index:5;font-family:'Open Sans',sans-serif;font-size:.7rem;letter-spacing:.28em;text-transform:uppercase;color:var(--story-muted);transition:opacity .5s}
.story-hint .mouse{width:22px;height:34px;border:1px solid var(--story-edge);border-radius:12px;position:relative}
.story-hint .mouse::after{content:"";position:absolute;left:50%;top:7px;width:3px;height:6px;border-radius:2px;background:var(--story-ink);transform:translateX(-50%);animation:storywheel 1.8s infinite}
@keyframes storywheel{0%{opacity:0;transform:translate(-50%,0)}30%{opacity:1}70%{opacity:1}100%{opacity:0;transform:translate(-50%,10px)}}
@media (max-width:640px){.story-title{max-width:13ch}.story-rail{right:12px;gap:10px}.story-stats{gap:1.4rem}.story-tags{display:none}}
@media (prefers-reduced-motion:reduce){.story-hint .mouse::after{animation:none}.story-canvas{transition:none}}