/* Five short scenes share the existing pause, visibility and keyboard controller. */
.sj-section{position:relative;gap:clamp(32px,5vw,76px)}
.sj-anchor{position:absolute;inset:0 auto auto 0;width:1px;height:1px;pointer-events:none}
.sj-demo{--sj-duration:1400ms;--sj-progress:0%;min-width:0;background:var(--edu-night);border-color:var(--edu-border)}
.sj-demo[data-active-slide="1"]{--sj-progress:25%}.sj-demo[data-active-slide="2"]{--sj-progress:50%}.sj-demo[data-active-slide="3"]{--sj-progress:75%}.sj-demo[data-active-slide="4"]{--sj-progress:100%}
.sj-top{padding:8px 18px;font-size:12px}.sj-top>span{display:flex;align-items:center;gap:8px}.sj-top .edu-dot{width:6px;height:6px}
.sj-tabs{position:relative;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));padding:22px 18px 14px;isolation:isolate}
.sj-track{position:absolute;inset:40px 12% auto;height:1px;background:var(--edu-border);z-index:-1}
.sj-track>i{display:block;background:var(--edu-lime);height:100%;width:var(--sj-progress);transition:width 260ms var(--edu-ease)}
.sj-step{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:9px;min-width:0;min-height:64px;padding:0 1px;border:0;background:transparent;color:var(--edu-muted);font-family:inherit;font-size:10px;font-weight:500;cursor:pointer}
.sj-step-number{display:grid;place-items:center;width:38px;height:38px;border:1px solid var(--edu-border);border-radius:50%;background:var(--edu-night);color:var(--edu-muted);font-size:11px;transition:background 180ms,color 180ms,transform 220ms var(--edu-ease),border-color 180ms}
.sj-step[aria-selected=true]{color:var(--edu-ink)}.sj-step[aria-selected=true] .sj-step-number{background:var(--edu-lime);border-color:var(--edu-lime-edge);color:var(--edu-on-accent);transform:scale(1.1);box-shadow:0 0 24px var(--edu-lime-soft)}
.sj-step:focus-visible{outline:2px solid var(--edu-focus);outline-offset:3px;border-radius:10px}.sj-panel:focus-visible{outline:2px solid var(--edu-focus);outline-offset:-2px}
.sj-scenes{min-width:0}.sj-panel[hidden]{display:none!important}
.sj-art{position:relative;isolation:isolate;container-type:inline-size;height:270px;overflow:hidden;background:radial-gradient(ellipse at 50% 75%,#D1FB0011,transparent 65%)}
.sj-art:before{content:'';position:absolute;inset:0;z-index:-1;background-image:radial-gradient(#ffffff1a .6px,transparent .7px);background-size:17px 17px;mask-image:linear-gradient(transparent,#000 25%,#000 70%,transparent)}
.sj-art-index{position:absolute;right:20px;top:5px;color:#ffffff06;font-size:150px;font-weight:600;line-height:1;letter-spacing:-.1em;z-index:-1}
.sj-object{border:1px solid var(--edu-border);box-shadow:0 12px 24px #0003;background:var(--edu-card)}
.sj-detail{padding:18px 24px 12px;min-height:149px;border-top:1px solid var(--edu-line);background:#ffffff02}
.sj-detail .edu-label{display:block;color:var(--edu-lime-ink);font-size:9px;margin-bottom:9px;letter-spacing:.08em}
.sj-detail h3{font-size:23px;line-height:1.15;letter-spacing:-.035em;margin:0 0 8px}
.sj-detail p{font-size:13px;line-height:1.5;color:var(--edu-muted);margin:0;max-width:44ch}
.sj-note{font-size:11px;line-height:1.5;color:var(--edu-muted);background:#ffffff02;margin:0;padding:0 24px 18px}
.sj-mini-label{font-size:8px;letter-spacing:.13em;color:var(--edu-muted)}
.sj-chip{display:flex;align-items:center;justify-content:center;gap:8px;background:var(--edu-lime);color:var(--edu-on-accent);font-size:11px;font-weight:550;border-radius:7px;padding:11px 14px;box-shadow:0 8px 30px #0005}
.sj-chip svg{width:17px;height:17px}

/* 01: enter, click, confirmation. */
.sj-apply-card{position:absolute;top:17px;left:50%;width:250px;padding:20px;border-radius:14px;transform:translateX(-50%) rotate(-3deg);animation:sj-apply-in 400ms var(--edu-ease) both}
.sj-apply-title{font-size:25px;line-height:1.1;letter-spacing:-.04em;margin:12px 0 18px}
.sj-input-line{display:flex;align-items:center;gap:7px;font-size:10px;border:1px solid var(--edu-border);border-radius:5px;padding:8px;color:var(--edu-muted)}.sj-input-line i{width:5px;height:5px;background:var(--edu-lime);border-radius:50%}
.sj-apply-button{display:flex;justify-content:space-between;align-items:center;font-size:11px;font-weight:550;background:var(--edu-lime);color:var(--edu-on-accent);padding:10px;border-radius:5px;margin-top:8px;animation:sj-button-click 1400ms ease both}
.sj-pointer{position:absolute;top:178px;left:64%;width:22px;height:28px;transform:rotate(-12deg);animation:sj-point-click 1400ms var(--edu-ease) both}.sj-pointer svg{display:block;width:100%;height:100%}
.sj-click-ring{position:absolute;top:176px;left:calc(64% - 12px);width:32px;height:32px;border:1px solid var(--edu-lime-edge);border-radius:50%;opacity:0;animation:sj-click 1400ms ease both}
.sj-apply-confirm{position:absolute;left:50%;bottom:13px;transform:translateX(-50%) rotate(2deg);white-space:nowrap;animation:sj-confirm 1400ms var(--edu-ease) both}

/* 02: the school connects knowledge with execution. */
.sj-school-core{position:absolute;top:38px;left:50%;width:103px;height:113px;transform:translateX(-50%);border-radius:18px;background:var(--edu-lime);color:var(--edu-on-accent);display:flex;align-items:center;justify-content:center;flex-direction:column;gap:12px;animation:sj-core 450ms var(--edu-ease) both}.sj-school-core svg{width:38px;height:38px}.sj-school-core span{font-size:12px;font-weight:700;letter-spacing:.03em}
.sj-school-rays{position:absolute;top:95px;left:50%;width:1px;height:1px}.sj-school-rays i{position:absolute;top:0;left:0;width:150px;height:1px;transform-origin:left;background:linear-gradient(var(--edu-lime),transparent)}.sj-school-rays i:nth-child(1){transform:rotate(25deg)}.sj-school-rays i:nth-child(2){transform:rotate(155deg)}.sj-school-rays i:nth-child(3){transform:rotate(-25deg)}.sj-school-rays i:nth-child(4){transform:rotate(205deg)}
.sj-learning-card{position:absolute;top:151px;display:flex;align-items:center;gap:10px;border-radius:10px;padding:15px 14px;animation:sj-card-enter 600ms var(--edu-ease) both}.sj-learning-one{left:9%;transform:rotate(-6deg);animation-delay:110ms}.sj-learning-two{right:6%;top:156px;transform:rotate(5deg);animation-delay:250ms}.sj-learning-card small{display:block;font-size:7px;color:var(--edu-muted);letter-spacing:.05em}.sj-learning-card strong{display:block;font-size:14px;font-weight:550;margin-top:4px;letter-spacing:-.035em}.sj-mini-play{color:var(--edu-lime-ink);font-size:25px}.sj-school-topics{position:absolute;left:0;right:0;bottom:11px;display:flex;justify-content:center;gap:16px;font-size:9px;color:var(--edu-muted)}.sj-school-topics span{animation:sj-tag-enter 600ms 400ms var(--edu-ease) both}.sj-school-topics span:nth-child(2){animation-delay:500ms}.sj-school-topics span:nth-child(3){animation-delay:600ms}

/* 03: offer, message and audience snap into place. */
.sj-build-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;padding:43px 23px 0}.sj-build-card{position:relative;border-radius:10px;padding:16px 13px;min-height:161px;animation:sj-build-in 480ms var(--edu-ease) both}.sj-build-one{transform:rotate(-5deg);animation-delay:0ms}.sj-build-two{z-index:1;transform:translateY(-10px);animation-delay:170ms}.sj-build-three{transform:rotate(5deg);animation-delay:340ms}.sj-build-icon{font-size:23px;letter-spacing:-.06em;color:var(--edu-lime-ink);display:block;height:38px}.sj-build-card small{font-size:6px;letter-spacing:.04em;color:var(--edu-muted);white-space:nowrap;display:block}.sj-build-card strong{font-size:13px;display:block;letter-spacing:-.04em;white-space:nowrap;margin-top:7px}.sj-copy-line{height:3px;width:90%;background:#ffffff24;margin-top:13px;border-radius:2px;transform-origin:left;animation:sj-line-in 350ms 500ms var(--edu-ease) both}.sj-line-short{width:65%;margin-top:6px;animation-delay:650ms}.sj-build-done{position:absolute;right:8px;top:-10px;display:grid;place-items:center;background:var(--edu-lime);color:var(--edu-on-accent);width:21px;height:21px;border-radius:50%;animation:sj-check-in 400ms 800ms var(--edu-ease) both}.sj-build-done svg{width:14px;height:14px}.sj-build-caption{position:absolute;bottom:18px;left:50%;transform:translateX(-50%);font-size:10px;white-space:nowrap;background:var(--edu-surface);border:1px solid var(--edu-border);color:var(--edu-ink);animation:sj-caption-in 350ms 850ms var(--edu-ease) both}

/* 04: the offer reaches a customer, then returns actionable feedback. */
.sj-sales-flow{display:flex;align-items:center;padding:27px 36px 19px;gap:8px}.sj-offer-pill,.sj-client-pill{display:flex;align-items:center;gap:15px;font-size:12px;border-radius:8px;padding:13px 14px;white-space:nowrap;animation:sj-tag-enter 450ms var(--edu-ease) both}.sj-offer-pill span,.sj-client-pill span{font-size:18px;color:var(--edu-lime-ink)}.sj-sales-route{flex:1;position:relative;height:1px;background:var(--edu-border);min-width:20px;overflow:hidden}.sj-sales-route i{position:absolute;width:30%;height:100%;background:var(--edu-lime);animation:sj-deliver 700ms linear infinite}.sj-sales-route i:nth-child(2){animation-delay:200ms}.sj-sales-route i:nth-child(3){animation-delay:400ms}.sj-client-pill{animation-delay:200ms}
.sj-sale-ticket{display:flex;gap:13px;align-items:center;border-radius:10px;padding:16px 18px;width:78%;margin:0 auto 12px;animation:sj-ticket-in 400ms var(--edu-ease) both}.sj-sale-one{animation-delay:300ms;transform:rotate(-2deg)}.sj-sale-two{animation-delay:650ms;transform:translateX(12px) rotate(2deg)}.sj-ticket-check{display:grid;place-items:center;flex-shrink:0;width:30px;height:30px;border-radius:50%;background:var(--edu-lime-soft);color:var(--edu-lime-ink)}.sj-ticket-check svg{width:18px;height:18px}.sj-sale-ticket small{display:block;font-size:7px;color:var(--edu-muted);letter-spacing:.07em}.sj-sale-ticket strong{display:block;font-size:14px;font-weight:500;letter-spacing:-.03em;margin-top:5px}.sj-ticket-wave{font-size:22px;color:var(--edu-lime-ink);margin-left:auto}

/* 05: a clearly illustrative growth path, with no invented revenue figures. */
.sj-scale-caption{position:absolute;top:18px;left:25px;z-index:1}.sj-scale-caption small{font-size:7px;letter-spacing:.08em;color:var(--edu-muted)}.sj-scale-caption strong{display:block;font-weight:500;font-size:25px;line-height:1.05;letter-spacing:-.045em;margin-top:10px}.sj-scale-caption em{font-style:normal;color:var(--edu-lime-ink);font-size:18px}.sj-scale-chart{position:absolute;bottom:32px;left:5%;width:90%;height:190px}.sj-chart-grid{stroke:#ffffff09;stroke-width:1}.sj-chart-area{fill:#D1FB000a;transform-origin:bottom;animation:sj-area-in 1s var(--edu-ease) both}.sj-chart-line{stroke:var(--edu-lime-ink);stroke-width:3;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:0;animation:sj-chart-draw 1100ms var(--edu-ease) both}.sj-chart-point{fill:var(--edu-lime-ink);stroke:var(--edu-night);stroke-width:4;transform-box:fill-box;transform-origin:center;animation:sj-check-in 350ms 900ms var(--edu-ease) both}.sj-scale-tags{position:absolute;left:25px;right:25px;bottom:9px;display:flex;justify-content:space-between;gap:10px;border-top:1px solid var(--edu-line);padding-top:10px;color:var(--edu-muted);font-size:10px}.sj-scale-tags span:last-child{color:var(--edu-lime-ink)}

@keyframes sj-apply-in{from{translate:0 35px;rotate:8deg;scale:.87}to{translate:0 0;rotate:0deg;scale:1}}
@keyframes sj-button-click{0%,40%,64%,100%{scale:1}48%,55%{scale:.95}}
@keyframes sj-point-click{0%{translate:65px 55px;opacity:0}20%{opacity:1}42%{translate:0 0;scale:1}52%{scale:.8}62%,100%{translate:0 0;scale:1}}
@keyframes sj-click{0%,45%{opacity:0;scale:.5}52%{opacity:1}82%,100%{opacity:0;scale:2}}
@keyframes sj-confirm{0%,57%{translate:0 22px;opacity:0;scale:.8}85%,100%{translate:0 0;opacity:1;scale:1}}
@keyframes sj-core{from{scale:.65;rotate:-18deg}to{scale:1;rotate:0deg}}
@keyframes sj-card-enter{from{translate:0 35px;scale:.8}to{translate:0 0;scale:1}}
@keyframes sj-tag-enter{from{translate:0 12px;opacity:.4}to{translate:0 0;opacity:1}}
@keyframes sj-build-in{from{translate:0 60px;rotate:12deg;scale:.8}to{translate:0 0;rotate:0deg;scale:1}}
@keyframes sj-line-in{from{scale:0 1}to{scale:1 1}}
@keyframes sj-check-in{from{scale:0}to{scale:1}}
@keyframes sj-caption-in{from{translate:0 12px;opacity:0}to{translate:0 0;opacity:1}}
@keyframes sj-deliver{from{translate:-100% 0}to{translate:440% 0}}
@keyframes sj-ticket-in{from{translate:45px 12px;opacity:.1;scale:.9}to{translate:0 0;opacity:1;scale:1}}
@keyframes sj-chart-draw{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@keyframes sj-area-in{from{scale:1 .15;opacity:0}to{scale:1 1;opacity:1}}

/* Paused/manual and motion-reduced scenes show the complete illustration. */
.sj-demo[data-motion-running=false] .sj-art *{animation:none!important}
.sj-demo:not([data-motion-ready]) .sj-tabs{display:none}
.sj-demo:not([data-motion-ready]) .sj-panel{border-bottom:1px solid var(--edu-line)}
@media(hover:hover) and (pointer:fine){.sj-step:hover .sj-step-number{border-color:var(--edu-lime-edge);color:var(--edu-lime-ink)}.sj-step[aria-selected=true]:hover .sj-step-number{color:var(--edu-on-accent)}}
@media(max-width:1050px){.sj-section{grid-template-columns:1fr 1.2fr;gap:32px}.sj-build-grid{gap:7px;padding-inline:17px}.sj-build-card{padding-inline:9px}.sj-learning-one{left:5%}.sj-learning-two{right:4%}.sj-sales-flow{padding-inline:24px}.sj-offer-pill,.sj-client-pill{padding:12px 10px;gap:8px}}
@media(max-width:760px){.sj-section{grid-template-columns:1fr;gap:28px}.sj-demo{width:100%;max-width:590px;margin-inline:auto}.sj-section .edu-journey-copy h2{font-size:clamp(35px,7vw,45px)}.sj-section .edu-journey-copy p{max-width:540px}.sj-art{height:260px}.sj-section .edu-button{font-size:13px}.sj-detail{min-height:137px}}
@media(max-width:400px){.sj-top{padding-inline:13px;font-size:11px}.sj-tabs{padding:18px 10px 9px}.sj-track{top:36px}.sj-step{font-size:8px;gap:8px;min-height:61px}.sj-step-number{width:36px;height:36px;font-size:10px}.sj-art{height:238px}.sj-art-index{font-size:130px}.sj-apply-card{width:220px;padding:16px;top:9px}.sj-apply-title{font-size:22px;margin:9px 0 13px}.sj-pointer{top:155px}.sj-click-ring{top:153px}.sj-apply-confirm{bottom:8px;font-size:10px;padding:9px 12px}.sj-school-core{top:21px;width:89px;height:103px}.sj-school-rays{top:77px}.sj-learning-card{top:134px;padding:12px 10px;gap:7px}.sj-learning-two{top:144px}.sj-learning-one{left:4%}.sj-learning-card strong{font-size:12px}.sj-learning-card small{font-size:6px}.sj-school-topics{gap:10px;font-size:8px}.sj-build-grid{padding-top:34px;padding-inline:14px;gap:6px}.sj-build-card{min-height:142px;padding:14px 8px}.sj-build-card strong{font-size:11px}.sj-build-card small{font-size:5px}.sj-build-caption{bottom:18px;font-size:8px;padding:9px 10px}.sj-sales-flow{padding:22px 19px 16px;gap:6px}.sj-offer-pill,.sj-client-pill{font-size:10px;padding:10px;gap:8px}.sj-sale-ticket{padding:14px 12px;gap:9px;width:82%}.sj-sale-ticket strong{font-size:12px}.sj-scale-caption{left:20px;top:12px}.sj-scale-caption strong{font-size:23px}.sj-scale-caption em{font-size:16px}.sj-scale-chart{height:172px}.sj-detail{padding:16px 18px 10px;min-height:149px}.sj-detail h3{font-size:21px}.sj-detail p{font-size:12px;line-height:1.5}.sj-detail .edu-label{font-size:8px}.sj-note{padding:0 18px 16px;font-size:10px}}
@media(prefers-reduced-motion:reduce){.sj-demo *,.sj-demo *:before,.sj-demo *:after{animation:none!important;transition:none!important}.sj-step[aria-selected=true] .sj-step-number{transform:none}.sj-pointer,.sj-click-ring{display:none}}