/* EdifyKids programs journey (own code). Default = plain stacked cards (phones, reduced motion, no WebGL).
   .ek-j--3d (added by ek-journey.js on desktop) = pinned stage: the child on one side, the text on the other, driven by scroll. */
.ek-continuum.ek-journey{padding:100px 0 0;background:transparent}
.ek-jtrack{max-width:1180px;margin:0 auto;padding:0 20px 70px}
.ek-jcopy{display:grid;grid-template-columns:repeat(2,1fr);gap:26px;align-items:stretch}
.ek-jstick .ek-jcanvas,.ek-jdots,.ek-jbar{display:none}
.ek-jtxt{--c:var(--ek-orange);position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;padding:24px 22px 26px;border-radius:var(--ek-radius-lg,28px);background:rgba(255,255,255,.7);backdrop-filter:blur(16px) saturate(1.35);-webkit-backdrop-filter:blur(16px) saturate(1.35);border:1px solid rgba(255,255,255,.85);box-shadow:0 20px 44px rgba(31,42,68,.10),inset 0 1px 0 rgba(255,255,255,.95)}
.ek-jtxt--2{--c:var(--ek-blue)}.ek-jtxt--3{--c:var(--ek-green)}.ek-jtxt--4{--c:var(--ek-red)}
.ek-jtxt__n{position:absolute;left:16px;top:16px;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--c);color:#fff;font:700 20px var(--ek-font-head);box-shadow:0 8px 18px rgba(31,42,68,.2),inset 0 2px 0 rgba(255,255,255,.4)}
.ek-jflat{display:block;width:min(240px,70%);height:auto;margin:0 auto 10px}
.ek-jtxt h3{margin:0;font:700 clamp(28px,3vw,40px)/1.05 var(--ek-font-head);color:var(--c)}
.ek-jtxt__age{display:inline-block;margin:10px 0 12px;padding:6px 16px;border-radius:999px;background:var(--ek-sky);font:600 14px var(--ek-font-head);color:var(--ek-ink)}
.ek-jtxt p{margin:0 0 20px;font:600 17px/1.6 var(--ek-font-body);color:var(--ek-ink-soft);flex:1}
@media(max-width:700px){.ek-jcopy{grid-template-columns:1fr}.ek-continuum.ek-journey{padding-top:70px}}

/* ---- pinned 3D stage ---- */
.ek-j--3d .ek-jtrack{max-width:none;padding:0;height:440vh}
.ek-j--3d .ek-jstick{position:sticky;top:0;height:100vh;overflow:hidden}
.ek-j--3d .ek-jcanvas{display:block;position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.ek-j--3d .ek-jcopy{display:block;position:absolute;inset:0;pointer-events:none}
.ek-j--3d .ek-jflat{display:none}
.ek-j--3d .ek-jtxt{position:absolute;top:50%;width:min(450px,38vw);align-items:flex-start;text-align:left;padding:38px 38px 36px;opacity:0;visibility:hidden;will-change:transform,opacity}
.ek-j--3d .ek-jtxt[data-copy="l"]{left:max(28px,calc((100vw - 1240px)/2 + 28px))}
.ek-j--3d .ek-jtxt[data-copy="r"]{right:max(28px,calc((100vw - 1240px)/2 + 28px))}
.ek-j--3d .ek-jtxt__n{position:static;width:56px;height:56px;font-size:26px;margin-bottom:16px}
.ek-j--3d .ek-jtxt h3{font-size:clamp(34px,3.6vw,52px)}
.ek-j--3d .ek-jtxt p{font-size:18px;flex:none}
.ek-j--3d .ek-jdots{display:flex;position:absolute;left:50%;bottom:22px;transform:translateX(-50%);margin:0;padding:8px;list-style:none;gap:6px;border-radius:999px;background:rgba(255,255,255,.72);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid rgba(255,255,255,.85);box-shadow:0 12px 30px rgba(31,42,68,.14)}
.ek-jdot{border:0!important;outline:0;-webkit-appearance:none;appearance:none;display:flex;align-items:center;gap:8px;padding:8px 16px 8px 8px;border:0;border-radius:999px;background:transparent;cursor:pointer;font:600 15px var(--ek-font-head);color:var(--ek-ink-soft);transition:background .25s var(--ek-ease),color .25s var(--ek-ease)}
.ek-jdot b{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#e9eef7;color:var(--ek-ink);font:700 15px var(--ek-font-head);transition:background .25s,color .25s}
.ek-jdots li:nth-child(1){--c:var(--ek-orange)}.ek-jdots li:nth-child(2){--c:var(--ek-blue)}.ek-jdots li:nth-child(3){--c:var(--ek-green)}.ek-jdots li:nth-child(4){--c:var(--ek-red)}
.ek-jdot.is-on{background:#fff;color:var(--ek-ink);box-shadow:0 6px 14px rgba(31,42,68,.12)}.ek-jdot.is-on b{background:var(--c);color:#fff}
.ek-jdot:hover{background:rgba(255,255,255,.9)!important;color:var(--ek-ink)!important}.ek-jdot:not(.is-on){background:transparent!important}.ek-jdot.is-on{background:#fff!important}.ek-jdot:focus-visible{outline:3px solid var(--ek-blue);outline-offset:2px}
.ek-j--3d .ek-jbar{display:block;position:absolute;left:0;right:0;bottom:0;height:5px;transform-origin:0 50%;transform:scaleX(0);background:linear-gradient(90deg,var(--ek-orange),var(--ek-yellow,#FBC531),var(--ek-green),var(--ek-blue))}
@media(max-width:1100px){.ek-jdot span{display:none}.ek-jdot{padding:8px}}

.ek-jdots{display:none!important}

/* ---- intro section: gentle motion (photos float and breathe, the key word shimmers, the button shines) ---- */
.ek-intro .ek-blob--a{animation:ek-morph 14s ease-in-out infinite,ek-float-a 7s ease-in-out infinite;translate:0 var(--py,0px)}
.ek-intro .ek-blob--b{animation:ek-morph 11s ease-in-out infinite reverse,ek-float-b 6s ease-in-out infinite;translate:0 calc(var(--py,0px)*-.6)}
@keyframes ek-float-a{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-12px) rotate(.8deg)}}
@keyframes ek-float-b{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(14px) rotate(-1.2deg)}}
.ek-intro .ek-blob img{animation:ek-kb 16s ease-in-out infinite alternate}
@keyframes ek-kb{from{transform:scale(1)}to{transform:scale(1.07)}}
.ek-intro h2 em{background:linear-gradient(100deg,var(--ek-orange) 0 38%,#FFC15E 50%,var(--ek-orange) 62% 100%);background-size:260% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;animation:ek-shine-text 5.5s linear infinite}
@keyframes ek-shine-text{from{background-position:130% 0}to{background-position:-130% 0}}
.ek-intro .ek-btn{position:relative;overflow:hidden}
.ek-intro .ek-btn::after{content:"";position:absolute;top:0;left:-60%;width:40%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);transform:skewX(-20deg);animation:ek-btn-shine 4.5s ease-in-out infinite;pointer-events:none}
@keyframes ek-btn-shine{0%,60%{left:-60%}100%{left:130%}}
.ek-intro__art::before,.ek-intro__art::after{content:"";position:absolute;border-radius:50%;pointer-events:none;z-index:2}
.ek-intro__art::before{width:22px;height:22px;left:10%;top:2%;background:#FBC531;box-shadow:0 6px 14px rgba(251,197,49,.5);animation:ek-bob 5s ease-in-out infinite}
.ek-intro__art::after{width:30px;height:30px;right:1%;bottom:8%;background:#3AA7D8;box-shadow:0 6px 14px rgba(58,167,216,.5);animation:ek-bob 6.5s ease-in-out infinite reverse}
@media(prefers-reduced-motion:reduce){.ek-intro .ek-blob--a,.ek-intro .ek-blob--b,.ek-intro .ek-blob img,.ek-intro h2 em,.ek-intro .ek-btn::after,.ek-intro__art::before,.ek-intro__art::after{animation:none!important}}

/* ---- number cards: gentle motion (cards float in turn, icons bob with a soft pulse ring, a light sweep crosses each card) ---- */
.ek-count{overflow:hidden;animation:ek-card-float 6.5s ease-in-out infinite}
.ek-count:nth-child(2){animation-delay:-2.2s}.ek-count:nth-child(3){animation-delay:-4.4s}
@keyframes ek-card-float{0%,100%{translate:0 0}50%{translate:0 -9px}}
.ek-count--orange{--pulse:242,140,40}.ek-count--blue{--pulse:58,167,216}.ek-count--green{--pulse:80,155,50}
.ek-count__ico{animation:ek-ico-bob 4.2s ease-in-out infinite,ek-ico-ring 2.8s ease-out infinite}
.ek-count:nth-child(2) .ek-count__ico{animation-delay:-1.3s,-.9s}.ek-count:nth-child(3) .ek-count__ico{animation-delay:-2.6s,-1.8s}
@keyframes ek-ico-bob{0%,100%{transform:translateY(0) rotate(0)}30%{transform:translateY(-5px) rotate(-6deg)}70%{transform:translateY(-3px) rotate(6deg)}}
@keyframes ek-ico-ring{0%{box-shadow:0 0 0 0 rgba(var(--pulse),.42)}80%,100%{box-shadow:0 0 0 18px rgba(var(--pulse),0)}}
.ek-count::after{content:"";position:absolute;top:0;left:-70%;width:38%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.75),transparent);transform:skewX(-18deg);animation:ek-card-shine 8s ease-in-out infinite;pointer-events:none}
.ek-count:nth-child(2)::after{animation-delay:-2.7s}.ek-count:nth-child(3)::after{animation-delay:-5.4s}
@keyframes ek-card-shine{0%,55%{left:-70%}100%{left:140%}}
@media(prefers-reduced-motion:reduce){.ek-count,.ek-count__ico,.ek-count::after{animation:none!important}}

/* ---- phone / small tablet portrait: same pinned stage, child on top, text card at the bottom ---- */
.ek-j--3d.ek-j--m .ek-jtrack{height:420vh;height:420svh}
.ek-j--3d.ek-j--m .ek-jstick{height:100vh;height:100svh}
.ek-j--3d.ek-j--m .ek-jtxt,.ek-j--3d.ek-j--m .ek-jtxt[data-copy]{top:auto;bottom:26px;left:14px;right:14px;width:auto;padding:22px 22px 22px;align-items:flex-start;text-align:left;border-radius:26px}
.ek-j--3d.ek-j--m .ek-jtxt__n{width:42px;height:42px;font-size:20px;margin-bottom:10px}
.ek-j--3d.ek-j--m .ek-jtxt h3{font-size:clamp(28px,8.4vw,38px)}
.ek-j--3d.ek-j--m .ek-jtxt__age{margin:8px 0 8px;padding:5px 14px;font-size:13px}
.ek-j--3d.ek-j--m .ek-jtxt p{margin:0 0 14px;font-size:15px;line-height:1.5}
.ek-j--3d.ek-j--m .ek-jtxt .ek-btn,.ek-j--3d.ek-j--m .ek-jtxt a{font-size:14px}
.ek-j--3d.ek-j--m .ek-jdots{display:none!important}
.ek-j--3d.ek-j--m .ek-jbar{height:4px}

/* real kid clips: ek-journey.js draws the cut-out child (transparent background) on one canvas; the packed source videos stay hidden but alive */
.ek-jvid{display:none}
.ek-j--3d .ek-jvid{display:block;position:absolute;left:0;top:0;max-width:none;pointer-events:none;opacity:0;visibility:hidden;will-change:transform,opacity}
.ek-jsrc{position:absolute;left:0;top:0;width:2px;height:2px;opacity:.01;pointer-events:none;z-index:-1}
