.story{margin:32px 0 44px;padding:clamp(22px,4vw,44px);background:transparent;color:#14243c;border-radius:0;padding-left:0;padding-right:0;overflow:visible;position:relative}
.story h2{font-size:clamp(28px,4.2vw,46px);line-height:1.1;margin:0 0 12px;color:#14243c}
.story-lead{max-width:50ch;color:#52627a;font-size:17px;margin:0 0 28px}
.story-stage{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(20px,4vw,48px);align-items:center}
.story-visual{position:relative;aspect-ratio:4/3.3}
.story-frame{position:absolute;inset:0 0 0 0;border-radius:36px;overflow:hidden;background:#e8eef5;box-shadow:0 30px 60px -24px #14243c66;transform:rotate(-1.2deg)}
.story-frame img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.12) translateX(2%);transition:opacity .9s ease,transform 7s ease-out}
.story-frame img.on{opacity:1;transform:scale(1) translateX(0)}
.story-chip{position:absolute;left:18px;bottom:18px;background:#fff;color:#11263e;font-weight:700;font-size:13px;padding:9px 16px;border-radius:999px;box-shadow:0 8px 20px #0004;z-index:2;transition:opacity .4s}
.story-peek{position:absolute;right:-14px;bottom:-22px;width:34%;aspect-ratio:1;border-radius:50%;overflow:hidden;border:6px solid #fff;box-shadow:0 18px 36px #14243c44;z-index:3;animation:story-float 5s ease-in-out infinite;cursor:pointer;padding:0;background:#0b1828}
.story-peek img{width:100%;height:100%;object-fit:cover;display:block;transition:opacity .5s}
.story-dot{position:absolute;left:-12px;top:14%;width:56px;height:56px;border-radius:50%;background:#c8243a;opacity:.9;z-index:3;animation:story-float 6s ease-in-out -2s infinite}
@keyframes story-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}
.story-steps{display:grid;gap:10px;list-style:none;margin:0;padding:0}
.story-step{display:block;width:100%;text-align:left;font:inherit;color:inherit;background:#fff;border:1px solid #14243c1a;border-radius:22px;padding:16px 20px;cursor:pointer;position:relative;overflow:hidden;transition:background .35s,transform .35s,border-color .35s}
.story-step:hover{border-color:#14243c40}
.story-step:focus-visible{outline:3px solid #fff;outline-offset:2px}
.story-step h3{margin:0;font-size:19px;color:#14243c}
.story-step p{margin:0;color:#52627a;font-size:15px;line-height:1.55;max-height:0;opacity:0;overflow:hidden;transition:max-height .5s ease,opacity .5s ease,margin .5s}
.story-step[aria-selected="true"]{background:#14243c;color:#fff;transform:translateX(6px);border-color:#14243c}
.story-step[aria-selected="true"] h3{color:#fff}
.story-step[aria-selected="true"] p{max-height:200px;opacity:1;margin-top:8px;color:#d3deec}
.story-bar{position:absolute;left:0;bottom:0;height:4px;width:0;background:#c8243a}
.story-step[aria-selected="true"] .story-bar{animation:story-fill var(--dur,6500ms) linear forwards}
.story.paused .story-bar{animation-play-state:paused}
@keyframes story-fill{to{width:100%}}
.story-roadmap{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:36px}
.story-roadmap article{border-radius:26px;padding:22px 26px}
.story-roadmap .now{background:#fff;border:1px solid #14243c1a}
.story-roadmap .next{background:#14243c;color:#fff}
.story-roadmap .tag{display:inline-block;font-size:12px;font-weight:700;letter-spacing:.04em;margin-bottom:10px;padding:4px 12px;border-radius:999px;background:#14243c12}
.story-roadmap .next .tag{background:#ffffff1f;color:#fff}
.story-roadmap h3{margin:0 0 6px;font-size:20px}
.story-roadmap p{margin:0;font-size:15px}
.story-roadmap .now p{color:#52627a}.story-roadmap .next p{color:#d3deec}
.story-code{display:block;margin-top:14px;padding:12px 16px;border-radius:16px;background:#ffffff14;border:1px dashed #ffffff66;font-size:13px}
.story-code b{display:block;font-size:16px;letter-spacing:.12em;margin-top:2px}
.story-note{color:#6b7b90;font-size:13px;margin:18px 0 0}
.story-bottom{display:flex;gap:20px;align-items:center;justify-content:space-between;flex-wrap:wrap;margin-top:22px;padding-top:22px;border-top:1px solid #14243c1a}
.story-bottom strong{display:block;font-size:18px}.story-bottom p{margin:4px 0 0;color:#52627a;font-size:14px;max-width:60ch}
.story-bottom button{border-radius:999px;padding:14px 26px;font-weight:700}
.story-reveal{opacity:0;transform:translateY(28px) scale(.97);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.7,.2,1)}
.story-reveal.in{opacity:1;transform:none}
.story-roadmap article:nth-child(2){transition-delay:.15s}
.story-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
@media(max-width:860px){.story-stage{grid-template-columns:1fr}.story-visual{aspect-ratio:4/3;margin-bottom:26px}.story-roadmap{grid-template-columns:1fr}.story-peek{right:-6px;width:30%}.story-dot{left:-6px}.story{border-radius:26px}}
@media(prefers-reduced-motion:reduce){.story-frame img,.story-reveal,.story-step{transition:none}.story-peek,.story-dot{animation:none}.story-reveal{opacity:1;transform:none}.story-step[aria-selected="true"] .story-bar{animation:none;width:100%}}
.story .story-peek{border-radius:50%!important;padding:0!important;min-height:0!important;min-width:0!important;height:auto!important;display:block}
.story .story-peek img{border-radius:50%}
.story .story-step{min-height:0!important}
html body .story button.story-peek{border-radius:50%!important;clip-path:circle(50%);box-shadow:none;background:#11263e!important}

.story .story-peek{background:#fff!important}html body .story button.story-peek{background:#fff!important}

.story-duo{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1.15fr);gap:16px;align-items:stretch;margin-top:40px}
.story-duo article{border-radius:28px;padding:26px 28px}
.story-duo h3{margin:12px 0 16px;font-size:22px;line-height:1.25;color:inherit}
.duo-now{background:#fff;border:1px solid #14243c1a;box-shadow:0 18px 40px -28px #14243c66}
.duo-next{background:#eef3f8;border:2px dashed #14243c40}
.duo-badge{display:inline-block;font-size:13px;font-weight:700;padding:5px 13px;border-radius:999px}
.duo-badge.now{background:#e4f5ec;color:#0b6a43}.duo-badge.soon{background:#fff1da;color:#8a5200}
.duo-list,.duo-steps{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.duo-list li,.duo-steps li{display:flex;gap:14px;align-items:flex-start;font-size:16px;line-height:1.45}
.duo-list i{flex:none;width:28px;height:28px;border-radius:50%;background:#0f7b4e;color:#fff;font-style:normal;font-weight:800;display:grid;place-items:center;font-size:14px}
.duo-steps b{flex:none;width:30px;height:30px;border-radius:50%;background:#14243c;color:#fff;display:grid;place-items:center;font-size:14px}
.duo-steps strong{display:block;font-size:16px}.duo-steps span{display:block;color:#52627a;font-size:14.5px;margin-top:2px}
.duo-foot{margin:18px 0 0;padding-top:14px;border-top:1px solid #14243c14;color:#52627a;font-size:14px}
.duo-arrow{align-self:center;width:44px;height:44px;border-radius:50%;background:#c8243a;color:#fff;display:grid;place-items:center;font-size:20px;font-weight:700;box-shadow:0 10px 24px -8px #c8243a99}
.story-duo article:nth-of-type(2){transition-delay:.2s}
@media(max-width:860px){.story-duo{grid-template-columns:1fr}.duo-arrow{justify-self:center;transform:rotate(90deg)}}

.story-need{margin-top:22px;padding:26px 28px;border-radius:28px;background:#14243c;color:#fff;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:26px;align-items:center}
.story-need h3{margin:0 0 8px;font-size:22px;line-height:1.25;color:#fff}
.story-need p{margin:0;color:#d3deec;font-size:15px;line-height:1.6}
.need-chain{list-style:none;margin:0;padding:0;display:grid;gap:10px;position:relative}
.need-chain li{background:#ffffff14;border:1px solid #ffffff26;border-radius:18px;padding:11px 16px;position:relative}
.need-chain li:not(:last-child)::after{content:"↓";position:absolute;left:50%;bottom:-17px;transform:translateX(-50%);width:22px;height:22px;border-radius:50%;background:#c8243a;color:#fff;font-size:13px;display:grid;place-items:center;z-index:1}
.need-chain b{display:block;font-size:16px}.need-chain span{display:block;font-size:13.5px;color:#b9c8dc}
.need-chain li:last-child{background:#fff}.need-chain li:last-child b{color:#14243c}.need-chain li:last-child span{color:#52627a}
@media(max-width:860px){.story-need{grid-template-columns:1fr;padding:22px}}

/* v5 : encadré clair, intégré à la page */
.story-need{background:transparent;color:#14243c;border-radius:0;padding:34px 0 6px;margin-top:30px;border-top:1px solid #14243c1a;grid-template-columns:1fr;gap:22px;text-align:center;justify-items:center}
.story-need h3{color:#14243c;font-size:clamp(22px,2.8vw,30px);max-width:26ch}
.story-need p{color:#52627a;max-width:62ch;margin:0 auto}
.need-chain{grid-auto-flow:column;grid-auto-columns:1fr;gap:34px;width:100%;max-width:880px}
.need-chain li{background:#fff;border:1px solid #14243c1a;box-shadow:0 14px 30px -22px #14243c66;border-radius:22px;padding:16px 18px}
.need-chain b{color:#14243c}.need-chain span{color:#52627a}
.need-chain li:last-child{background:#14243c;border-color:#14243c}.need-chain li:last-child b{color:#fff}.need-chain li:last-child span{color:#cfdaea}
.need-chain li:not(:last-child)::after{content:"→";left:auto;right:-30px;bottom:auto;top:50%;transform:translateY(-50%);width:26px;height:26px;font-size:14px}
@media(max-width:860px){.need-chain{grid-auto-flow:row;gap:26px;max-width:420px}.need-chain li:not(:last-child)::after{content:"↓";right:auto;left:50%;top:auto;bottom:-26px;transform:translateX(-50%)}}
.story-need h3{margin:0 auto 8px;text-align:center;max-width:30ch;width:100%}.story-need .need-copy{width:100%;text-align:center}

.how-steps li{padding:0!important;overflow:hidden;border-radius:26px!important;gap:0!important}
.how-steps .how-img{width:100%;height:auto;display:block;aspect-ratio:8/5;object-fit:cover}
.how-steps li strong,.how-steps li span{padding:0 20px}.how-steps li strong{margin-top:16px}.how-steps li span{padding-bottom:22px;margin-top:6px}
.how-steps li::before{position:absolute;margin:14px 0 0 14px;z-index:1;box-shadow:0 6px 14px -6px #14243c88}.how-steps li{position:relative}

/* galerie photos */
.gallery{max-width:1040px;margin:64px auto 8px;padding:0 4px}
.gallery h2{text-align:center;margin:0 0 8px}.gal-lead{text-align:center;color:#52627a;margin:0 auto 28px;max-width:54ch}
.gal-grid{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:230px;gap:16px}
.gal-grid figure{margin:0;position:relative;border-radius:28px;overflow:hidden;background:#dfe7f0;box-shadow:0 18px 36px -26px #14243c88}
.gal-grid img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.gal-grid figure:hover img{transform:scale(1.05)}
.gal-grid figcaption{position:absolute;left:12px;bottom:12px;max-width:calc(100% - 24px);background:#fff;color:#14243c;font-weight:700;font-size:13px;padding:8px 14px;border-radius:999px;box-shadow:0 8px 20px #14243c33}
.g-phone{grid-row:span 2}.g-qr{grid-row:span 2}.g-lake{grid-column:span 2}
.gal-reveal{opacity:0;transform:translateY(28px) scale(.97);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.7,.2,1)}
.gal-reveal.in{opacity:1;transform:none}
.gal-grid .gal-reveal:nth-child(2){transition-delay:.1s}.gal-grid .gal-reveal:nth-child(3){transition-delay:.2s}.gal-grid .gal-reveal:nth-child(4){transition-delay:.3s}.gal-grid .gal-reveal:nth-child(5){transition-delay:.4s}
@media(max-width:760px){.gal-grid{grid-template-columns:1fr 1fr;grid-auto-rows:190px}.g-lake{grid-column:span 2}.g-laptop{grid-column:span 2}.g-phone,.g-qr{grid-row:span 2}.gal-grid figcaption{font-size:12px;padding:6px 11px}}
@media(prefers-reduced-motion:reduce){.gal-reveal{opacity:1;transform:none;transition:none}.gal-grid img{transition:none}}
/* photos dans les pages */
.verify-photo{width:100%;max-width:340px;height:auto;aspect-ratio:249/231;object-fit:cover;border-radius:30px;display:block;margin:0 auto;box-shadow:0 24px 50px -28px #14243c99}
.page-head.has-img{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:24px 36px;align-items:center}
.page-head.has-img>.home-pill,.page-head.has-img>h1,.page-head.has-img>p{grid-column:1}
.page-head .head-photo{grid-column:2;grid-row:1/span 3;width:100%;max-width:420px;height:auto;border-radius:30px;box-shadow:0 24px 50px -28px #14243c99;justify-self:end}
.page-head .head-photo.phone{max-width:300px}
@media(max-width:760px){.page-head.has-img{grid-template-columns:1fr}.page-head .head-photo{grid-column:1;grid-row:auto;max-width:100%;justify-self:stretch}}
@media(max-width:760px){.gal-grid{grid-auto-flow:dense}.g-phone{order:1}.g-qr{order:2}.g-lake{order:3}.g-laptop{order:4}.g-card{order:5;grid-column:span 2}.g-phone,.g-qr{grid-row:span 2}}
.verify-illustration>img.verify-photo{height:100%;width:auto;max-width:100%;padding:0;mix-blend-mode:normal;margin:0 auto;display:block;object-fit:cover;border-radius:0;box-shadow:none;aspect-ratio:auto}
.page-head.has-img{max-width:1100px;margin:28px auto 12px;padding:0;text-align:left}
.page-head.has-img>.home-pill{justify-self:start}
.page-head.has-img h1{text-align:left;margin:12px 0 4px}
.page-head.has-img p{text-align:left;margin:0;max-width:56ch}
.page-head.has-img .head-photo{max-width:380px}.page-head.has-img .head-photo.phone{max-width:260px}

.story-duo.two{grid-template-columns:1fr 1fr}.duo-list.no i{background:#8a5200}
@media(max-width:860px){.story-duo.two{grid-template-columns:1fr}}

/* galerie v2 : tuiles sans texte intégré + carte passeport traduisible */
.gal-grid{grid-template-columns:repeat(4,1fr);grid-auto-rows:230px}
.g-lake{grid-column:1/span 2;grid-row:1}.g-card{grid-column:3;grid-row:1/span 2}.g-sun{grid-column:4;grid-row:1}
.g-row{grid-column:1/span 2;grid-row:2}.g-road{grid-column:4;grid-row:2}
.g-phone,.g-qr{grid-row:auto}
.g-card{background:linear-gradient(160deg,#e9f0f9,#cfdff1)}
.pass-card{height:100%;padding:16px 16px 52px;display:flex;flex-direction:column;gap:8px;color:#14243c}
.pass-top{display:flex;gap:10px;align-items:center}.pass-top b{display:block;font-size:13px;letter-spacing:.03em}.pass-top span{font-size:12px;color:#52627a}
.gal-grid .pass-card .pass-scooter{height:auto;width:100%;aspect-ratio:1100/733;object-fit:contain;background:#fff;border-radius:16px;padding:6px}
.pass-card dl{margin:0;display:grid;gap:5px;background:#fff;border-radius:16px;padding:10px 12px}
.pass-card dl div{display:flex;justify-content:space-between;gap:8px;font-size:12.5px;border-bottom:1px solid #14243c14;padding-bottom:4px}.pass-card dl div:last-child{border:0;padding:0}
.pass-card dt{color:#52627a}.pass-card dd{margin:0;font-weight:700}.pass-ok{background:#e4f5ec;color:#0b6a43;border-radius:999px;padding:1px 9px}
.pass-foot{display:flex;align-items:center;gap:10px;font-size:12.5px;font-weight:600;margin-top:auto}.pass-foot svg{background:#fff;padding:4px;border-radius:10px;flex:none}
@media(max-width:760px){.gal-grid{grid-template-columns:1fr 1fr;grid-auto-rows:170px}.g-lake{grid-column:1/span 2;grid-row:auto}.g-card{grid-column:1/span 2;grid-row:auto;height:auto}.g-sun,.g-road{grid-column:auto;grid-row:auto}.g-row{grid-column:1/span 2;grid-row:auto}.pass-card{padding-bottom:18px}.g-card{grid-row:span 3}.gal-grid{grid-auto-flow:dense}}
.gal-grid .pass-top img{width:30px;height:35px;flex:none;object-fit:contain;transition:none}
.g-card:hover img{transform:none}
@media(max-width:760px){.g-lake{order:1}.g-card{order:2;grid-row:auto;height:auto}.g-row{order:3}.g-sun{order:4}.g-road{order:5}.gal-grid{grid-auto-flow:row}.gal-grid .pass-card .pass-scooter{max-height:150px}}
@media(max-width:760px){.gal-grid{grid-auto-rows:minmax(170px,auto)}.g-card .pass-card{height:auto}.gal-grid figure:not(.g-card) img{position:absolute;inset:0}}
@media(max-width:760px){.g-card .pass-card{padding-bottom:62px}}

/* galerie v3 : images adaptées à chaque langue (public/images/photos/<langue>/) */
.gal-grid.g3{grid-template-columns:repeat(4,1fr);grid-auto-rows:230px}
.g3 .g3-phone{grid-column:1;grid-row:1/span 2}.g3 .g3-lake{grid-column:2/span 2;grid-row:1}.g3 .g3-qr{grid-column:4;grid-row:1/span 2}
.g3 .g3-laptop{grid-column:2;grid-row:2}.g3 .g3-card{grid-column:3;grid-row:2}
.g3 .g3-feat{grid-column:1;grid-row:3}.g3 .g3-strip{grid-column:2/span 2;grid-row:3}.g3 .g3-sun{grid-column:4;grid-row:3}
@media(max-width:760px){.gal-grid.g3{grid-template-columns:1fr 1fr;grid-auto-rows:minmax(170px,auto);grid-auto-flow:row}
.g3 .g3-phone{grid-column:1;grid-row:span 2;order:1}.g3 .g3-qr{grid-column:2;grid-row:span 2;order:2}
.g3 .g3-lake,.g3 .g3-laptop,.g3 .g3-card,.g3 .g3-feat,.g3 .g3-strip{grid-column:1/span 2;grid-row:auto}
.g3 .g3-lake{order:3}.g3 .g3-laptop{order:4}.g3 .g3-card{order:5}.g3 .g3-feat{order:6}.g3 .g3-strip{order:7}.g3 .g3-sun{grid-column:1/span 2;grid-row:auto;order:8}
.gal-grid.g3 figure img{position:absolute;inset:0}}
.g3 .g3-phone figcaption,.g3 .g3-qr figcaption,.g3 .g3-laptop figcaption,.g3 .g3-card figcaption,.g3 .g3-feat figcaption,.g3 .g3-strip figcaption{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);padding:0;box-shadow:none}
.g3 .g3-feat{background:#fff}.g3 .g3-feat img{object-fit:contain}
.g3 .g3-phone img{object-position:center top}
.gal-banner{margin:0 0 14px;border-radius:22px;overflow:hidden}.gal-banner img{display:block;width:100%;height:auto}

/* v12 : accueil recomposé */
.steps3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:28px}
.step3{background:#fff;border:1px solid #14243c14;border-radius:26px;padding:20px 20px 24px;box-shadow:0 18px 40px -28px #14243c66;display:flex;flex-direction:column}
.step3-ph{height:290px;border-radius:18px;background:linear-gradient(160deg,#e6eefa,#f8fbff);display:flex;align-items:flex-end;justify-content:center;overflow:hidden}
.step3-ph img{height:100%;width:auto;max-width:100%;object-fit:contain;object-position:bottom}
.step3-n{width:34px;height:34px;border-radius:50%;background:#14243c;color:#fff;display:grid;place-items:center;font-weight:700;margin:18px 0 8px}
html body .story .step3 h3{margin:0 0 6px;font-size:20px;line-height:1.25;color:#14243c}
html body .story .step3 p{margin:0;color:#52627a;font-size:15px;line-height:1.6}
.duo-img{display:block;width:calc(100% + 56px);margin:-28px -28px 18px;height:190px;object-fit:cover;border-radius:24px 24px 0 0}
.duo-now{overflow:hidden}
.story-need .need-img{width:100%;max-width:560px;height:190px;object-fit:cover;border-radius:22px;order:3}
.strip3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:18px}
.strip3 figure{margin:0;border-radius:24px;overflow:hidden;height:230px}
.strip3 img{width:100%;height:100%;object-fit:cover;display:block}
.gallery>h2{text-align:center}
@media(max-width:860px){.steps3{grid-template-columns:1fr}.step3-ph{height:250px}.strip3{grid-template-columns:1fr}.strip3 figure{height:190px}}
