
.sj-story-demo{margin:38px 0 32px}
.sj-story-composition{display:grid;grid-template-columns:1.05fr 1fr;gap:48px;align-items:center}
.sj-story-motion{position:relative;height:330px;isolation:isolate}
.sj-story-demo[data-preparation="loading"] .sj-story-motion{visibility:hidden}
.sj-story-demo.is-text-only .sj-story-composition{grid-template-columns:1fr}
.sj-story-demo[data-preparation="fallback"] .sj-story-motion img{transition:none;will-change:auto}
.sj-story-motion img{position:absolute;display:block;object-fit:cover;transition:width .65s cubic-bezier(.22,.61,.36,1),height .65s cubic-bezier(.22,.61,.36,1),left .65s cubic-bezier(.22,.61,.36,1),top .65s cubic-bezier(.22,.61,.36,1),transform .65s cubic-bezier(.22,.61,.36,1),opacity .4s,border-radius .65s;will-change:transform}
.sj-story-claire,.sj-story-lelia{width:220px;height:270px;left:50%;top:20px;transform:translateX(-50%);border-radius:140px 140px 6px 6px;object-position:center 35%;z-index:2}
.sj-story-motion .sj-story-lelia{opacity:0;transform:translateX(-35%) scale(.94)}
.sj-story-motion .sj-story-meeting{width:100%;height:auto;aspect-ratio:4/3;left:0;top:15px;border-radius:4px;opacity:0;transform:translateY(18px) scale(.92);z-index:1;object-fit:contain}
.sj-story-demo[data-scene="1"] .sj-story-claire{width:88px;height:88px;left:16%;top:220px;border-radius:50%;border:4px solid var(--cream)}
.sj-story-demo[data-scene="1"] .sj-story-lelia{opacity:1;left:59%;transform:translateX(-50%)}
.sj-story-demo[data-scene="2"] .sj-story-meeting{opacity:1;transform:none}
.sj-story-demo[data-scene="2"] .sj-story-claire,.sj-story-demo[data-scene="2"] .sj-story-lelia{width:74px;height:74px;top:245px;border-radius:50%;border:4px solid var(--cream);opacity:1;transform:translateX(-50%)}
.sj-story-demo[data-scene="2"] .sj-story-claire{left:20%}.sj-story-demo[data-scene="2"] .sj-story-lelia{left:36%}
.sj-story-texts{display:grid}
.sj-story-actions{grid-area:2/1;margin-top:12px}
.sj-story-actions[hidden]{display:none}

.intros-journey .sj-story-toggle{font-size:12px;border:0;border-bottom:1px solid currentColor;padding:10px 0;min-height:44px;min-width:44px;background:none;color:var(--muted);cursor:pointer}
.intros-journey .sj-story-toggle:hover{color:var(--ink)}
.intros-journey .sj-story-toggle:disabled{opacity:.5;cursor:default}
.sj-story-text{grid-area:1/1;visibility:hidden;opacity:0;transform:translateY(12px);transition:opacity .3s,transform .45s cubic-bezier(.22,.61,.36,1),visibility .3s;padding:12px 0}
.sj-story-text.is-current{visibility:visible;opacity:1;transform:none;transition-delay:.08s}
.sj-story-text h3{font-size:clamp(25px,2.5vw,34px);font-weight:500;line-height:1.15;letter-spacing:-.025em;margin:0 0 20px}
.sj-story-text p{font-size:17px;line-height:1.65;color:var(--muted);margin:0;max-width:41ch}
.is-reduced .sj-story-texts{gap:24px}.is-reduced .sj-story-text{grid-area:auto;padding:0}
.sj-story-numbers{border-top:1px solid var(--line);margin-top:26px;padding-top:22px}
.sj-story-numbers h3{font-size:13px;font-weight:400;color:var(--muted);margin:0 0 20px}
.sj-story-numbers .sj-stats{grid-template-columns:repeat(3,minmax(0,1fr));margin:0}
.sj-story-numbers .sj-stat{display:block;border-bottom:0;padding:0 24px;border-left:1px solid var(--line)}
.sj-story-numbers .sj-stat:first-child{padding-left:0;border-left:0}
.sj-story-numbers .sj-stat:last-child{padding-right:0}
.sj-story-numbers .sj-stat strong{font-size:36px;margin:0 0 6px;letter-spacing:-.04em}
.sj-story-numbers .sj-stat span{font-size:12px;line-height:1.5}

@media(max-width:760px){
 .sj-story-demo{margin:26px 0}.sj-story-composition{grid-template-columns:1fr;gap:20px;align-content:start}.sj-story-motion{height:260px;max-width:350px;width:100%;margin:auto}
 .sj-story-claire,.sj-story-lelia{width:180px;height:220px;top:10px}
 .sj-story-demo[data-scene="1"] .sj-story-claire{width:68px;height:68px;top:180px;left:15%}
 .sj-story-demo[data-scene="2"] .sj-story-claire,.sj-story-demo[data-scene="2"] .sj-story-lelia{width:60px;height:60px;top:195px}
 .sj-story-motion .sj-story-meeting{top:0;height:235px;aspect-ratio:auto;object-fit:cover}
 .sj-story-text{padding:0}.sj-story-text h3{font-size:26px;margin:0 0 12px}.sj-story-text p{font-size:15px;line-height:1.6;max-width:none}
 .sj-story-numbers{margin-top:20px;padding-top:20px}.sj-story-numbers .sj-stat{padding:0 10px}.sj-story-numbers .sj-stat strong{font-size:28px}.sj-story-numbers .sj-stat span{font-size:10px}
}
@media(prefers-reduced-motion:reduce){.sj-story-text,.sj-story-motion img{transition:none;will-change:auto}}
