.story{padding-top:0;margin-top:76px}
.story-heading{max-width:780px;margin:0 auto;text-align:center}
.story h2{font-size:clamp(34px,4.9vw,51px);font-weight:600;letter-spacing:-.045em;line-height:1.12;margin:0 0 24px;text-wrap:balance}
.story-lead{font-size:19px;line-height:1.65;color:#536158;max-width:620px;margin:0 auto;text-wrap:pretty}
.flow-scene{margin:38px -16px 0;position:relative}
.deck-help{text-align:center;font-size:13px;color:#647167;margin:0 0 28px}
.deck-track{position:relative;height:472px;isolation:isolate;overflow:clip}
.deck-card{position:absolute;left:50%;top:0;width:min(340px,calc(100% - 56px));min-height:350px;background:white;border:1px solid #dce5d9;border-radius:22px;padding:29px 30px;box-shadow:0 22px 38px -23px #1a442c42,0 3px 8px -4px #1a442c12;transform-origin:50% 35%;transition:transform 440ms cubic-bezier(.23,1,.32,1),opacity 300ms ease-out;cursor:pointer}
.deck-card[data-position=left]{z-index:1;transform:translate(calc(-50% - 76px),3px) rotate(-7deg) scale(.87)}
.deck-card[data-position=right]{z-index:2;transform:translate(calc(-50% + 76px),20px) rotate(7deg) scale(.87)}
.deck-card[data-position=front]{z-index:3;transform:translate(-50%,94px) rotate(0) scale(1)}
.card-pick{position:absolute;inset:0;width:100%;height:100%;border:0;background:transparent;border-radius:inherit;cursor:pointer;color:inherit}
.card-pick:focus-visible{outline:3px solid #246b45;outline-offset:-5px}
.source-label{font-size:13px;color:#536158;display:flex;align-items:center;gap:9px;margin:0 0 24px}
.source-label svg{width:18px;height:18px;stroke:#246b45;fill:none;stroke-width:1.5}
.source-title,.result-title{font-size:32px;line-height:1.12;font-weight:600;letter-spacing:-.035em;margin:0 0 24px;color:#246b45}
.source-lines{font-size:16px;line-height:1.7;color:#536158;margin:0}
.result-title em{font-weight:550}.result-foot{border-top:1px solid #e3e9e0;margin:22px 0 0;padding-top:17px;color:#536158;font-size:16px;line-height:1.6}
.deck-controls{display:flex;align-items:center;justify-content:center;gap:22px;margin:0 0 28px}
.deck-arrow{width:46px;height:46px;border:1px solid #dce5d9;border-radius:50%;background:#fafbf8;color:#246b45;cursor:pointer;display:grid;place-items:center;transition:transform 160ms cubic-bezier(.23,1,.32,1)}
.deck-arrow:active{transform:scale(.96)}.deck-arrow:disabled{opacity:.35;cursor:default}.deck-arrow svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6}
.deck-dots{display:flex;gap:2px}.deck-dot{border:0;background:transparent;cursor:pointer;width:32px;height:44px;display:grid;place-items:center;padding:0}.deck-dot::before{content:"";width:7px;height:7px;border-radius:50%;background:#c8d5c9}.deck-dot[aria-current=true]::before{background:#246b45;width:18px;border-radius:5px}
.flow-route{display:flex;justify-content:center;align-items:center;gap:20px;font-size:16px;font-weight:500;color:#246b45}.route-arrow{color:#9aab9d;font-weight:400}
.flow-summary{max-width:560px;margin:28px auto 0;text-align:center;font-size:18px;line-height:1.6;color:#536158;text-wrap:pretty}
.motion-paused .deck-card{transition:none}
@media(max-width:600px){.story{padding-top:0;margin-top:56px}.story h2{font-size:35px;line-height:1.13}.story-lead{font-size:18px;line-height:1.6}.flow-scene{margin:28px -12px 0}.deck-track{height:492px}.deck-card{min-height:370px;padding:24px 22px;border-radius:19px}.deck-card[data-position=left]{transform:translate(calc(-50% - 36px),3px) rotate(-7deg) scale(.87)}.deck-card[data-position=right]{transform:translate(calc(-50% + 36px),20px) rotate(7deg) scale(.87)}.source-title,.result-title{font-size:28px}.source-label{font-size:12px}.flow-route{gap:12px;font-size:14px}.flow-summary{font-size:17px;margin-top:24px}}
@media(prefers-reduced-motion:reduce){.deck-card,.deck-arrow{transition:none}}
.card-pick{touch-action:pan-y;cursor:grab}.deck-card.is-dragging{transition:none}.is-dragging .card-pick{cursor:grabbing}
.deck-card.drag-hint{animation:card-invitation 4400ms linear infinite}
@keyframes card-invitation{0%,18%{translate:0 0;rotate:0deg;animation-timing-function:cubic-bezier(.45,0,.55,1)}38%,46%{translate:-24px 0;rotate:-1deg;animation-timing-function:cubic-bezier(.45,0,.55,1)}67%,100%{translate:0 0;rotate:0deg}}
@media(prefers-reduced-motion:reduce){.deck-card.drag-hint{animation:none}}
.motion-paused .deck-card.drag-hint{animation:none}

/* The connected labels make the reading order visible before the visitor touches the stack. */
.deck-dots{display:flex;align-items:center;justify-content:center;gap:12px;max-width:540px;margin:0 auto 25px;padding:0 8px}.deck-dot{position:relative;width:auto;min-width:0;flex:1;height:auto;min-height:78px;padding:8px 3px;display:flex;flex-direction:column;justify-content:center;gap:9px;font:inherit;color:#647167;transition:color 180ms ease-out}.deck-dot>span{font-size:13px;line-height:1.35;font-weight:450;text-align:center}.deck-dot::before{width:7px;height:7px;border-radius:50%;background:#c8d5c9}.deck-dot[aria-current=true]::before{width:7px;border-radius:50%;background:#246b45;box-shadow:0 0 0 5px #e2ebdd}.deck-dot[aria-current=true]{color:#246b45}.deck-dot[aria-current=true]>span{font-weight:600}.deck-dot[data-state=complete]::before{background:#246b45}.deck-connector{width:27px;height:16px;flex-shrink:0;fill:none;stroke:#b5c5b2;stroke-width:1.2}.deck-controls{gap:16px;margin-top:4px}.deck-help{margin-bottom:22px}
@media(max-width:600px){.deck-dots{gap:7px;margin-bottom:18px;padding:0 5px}.deck-dot>span{font-size:12px}.deck-connector{width:22px}.deck-dot{min-height:74px}}

/* Let the cards carry the story; keep one quiet navigation beneath them. */
.flow-scene{margin-top:52px}.deck-controls{display:block;margin:18px 0 0}.deck-controls .deck-dots{margin:0 auto;padding:0 4px;max-width:520px}.deck-controls .deck-dot{min-height:64px}.flow-summary{margin-top:38px;max-width:540px}
@media(max-width:600px){.flow-scene{margin-top:42px}.deck-controls{margin-top:16px}.flow-summary{margin-top:32px}.deck-controls .deck-dot{min-height:64px}}
/* One entrance target avoids restarting a long transition on every scroll event. */
@media(prefers-reduced-motion:no-preference){
.deck-arriving .deck-card:not([data-position=front]){transition:transform 820ms cubic-bezier(.22,1,.36,1)}
.deck-arriving .deck-card[data-position=right]{transition-delay:65ms}
}
.keyboard-selection .deck-card{transition:none}
/* Keep the fuller copy readable inside the existing stack on narrow phones. */
@media(max-width:360px){.source-title,.result-title{font-size:24px;line-height:1.14;margin-bottom:20px}.source-lines,.result-foot{font-size:15px;line-height:1.6}.source-label{margin-bottom:20px}.result-foot{margin-top:18px;padding-top:15px}}
