/* Two continuous editorial scenes. Motion changes only transform/opacity. */
.editorial-scene{position:relative;height:300svh;margin:40px 0 80px;--scene-p:0}
.editorial-scene .story-stage{height:100svh;min-height:640px;position:sticky;top:0;overflow:hidden;isolation:isolate}
.service-story{color:#f7f8ff;background:#08132c}
.service-story .story-stage{background:radial-gradient(ellipse at 77% 49%,#17386c 0%,#101e3f 28%,#08132c 63%)}
.story-top,.story-bottom{position:absolute;left:4.4%;right:4.4%;display:flex;justify-content:space-between;align-items:center;z-index:5}
.story-top{top:5.5svh;align-items:start}.story-top>p:last-child{font-size:12px;line-height:1.6;opacity:.6}.story-top .eyebrow{font-size:10px;letter-spacing:.15em}
.story-bottom{bottom:5svh;gap:30px}.story-nav{display:flex;gap:28px}.story-nav button{padding:12px 0;background:none;color:inherit;opacity:.42;font-size:10px;letter-spacing:.06em;border-top:1px solid currentColor;min-width:100px;text-align:left;transition:opacity .2s}.story-nav button span{margin-left:10px;font-size:12px;letter-spacing:0}.story-nav button[aria-pressed=true]{opacity:1}.story-nav button:focus-visible,.story-link:focus-visible{outline:2px solid currentColor;outline-offset:6px}.story-scroll{font-size:10px;opacity:.5}
.story-copy{position:absolute;left:4.4%;top:25%;width:48%;z-index:3}.story-panel{position:absolute;inset:0 auto auto 0;width:100%;opacity:0;visibility:hidden;transform:translateY(18px);transition:opacity .35s,transform .5s,visibility .35s}.story-panel.is-active{opacity:1;visibility:visible;transform:none}.story-kicker{display:block;font-size:10px;letter-spacing:.15em;margin-bottom:24px;color:#9facd1}.story-copy h3{font-size:clamp(56px,7.3vw,118px);font-weight:500;line-height:.99;letter-spacing:-.065em;margin-bottom:30px}.story-copy h3 em{font-style:normal;color:#a9c5ff}.story-copy p{font-size:15px;line-height:1.65;color:#c4cce1}.story-detail{display:block;font-size:10px;color:#7f90b2;margin-top:16px}.story-link{display:flex;align-items:center;gap:36px;color:inherit;border-bottom:1px solid #ffffff40;padding:14px 0;background:none;font-size:13px;margin-top:27px}.story-link span{font-size:24px}
.service-art{position:absolute;right:0;top:15%;width:55%;height:70%;pointer-events:none;perspective:1400px}.art-orbit{position:absolute;left:9%;top:3%;width:85%;aspect-ratio:1;border:1px solid #8fbeff16;border-radius:50%;transform:rotateX(50deg) rotateZ(-20deg)}.orbit-inner{left:20%;top:16%;width:62%;border-color:#8fbeff25}.art-coordinate{position:absolute;right:10%;top:4%;font-size:8px;letter-spacing:.2em;color:#889ec4}.web-composition,.dialog-composition,.system-composition{position:absolute;inset:0;transition:opacity .45s,transform .65s;opacity:0;transform:translateY(30px) scale(.94)}
[data-step="0"] .web-composition,[data-step="1"] .dialog-composition,[data-step="2"] .system-composition{opacity:1;transform:none}.site-sheet{position:absolute;width:73%;height:53%;left:12%;top:26%;border:1px solid #b8d4ff65;border-radius:9px;overflow:hidden;box-shadow:0 22px 40px #0005;background:#e7f2f4;transform:rotateY(-18deg) rotateX(8deg) rotateZ(-7deg);transition:transform .6s}.site-sheet img{width:100%;height:100%;object-fit:cover;object-position:top}.sheet-back{left:25%;top:10%;transform:rotateY(-22deg) rotateX(8deg) rotateZ(10deg);opacity:.55}.sheet-middle{left:19%;top:18%;transform:rotateY(-20deg) rotateX(8deg) rotateZ(1deg);opacity:.8}.sheet-front{transform:translateY(calc(var(--scene-p) * -15px)) rotateY(-18deg) rotateX(8deg) rotateZ(-7deg)}.sheet-toolbar{display:flex;gap:4px;align-items:center;height:22px;padding:0 10px;background:#fff;color:#213638}.sheet-toolbar i{width:3px;height:3px;background:#889fa3;border-radius:50%}.sheet-toolbar span{font-size:6px;letter-spacing:.15em;margin:auto}.sheet-front img{height:calc(100% - 22px)}.visual-caption{position:absolute;bottom:5%;left:12%;font-size:10px;color:#91a4c6;letter-spacing:.02em}
.dialog-orb{position:absolute;left:27%;top:15%;width:48%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 28% 20%,#efffff 0%,#8db8eb 10%,#254685 36%,#08132c 63%,#6983bc 82%,#dae4ff 96%);box-shadow:inset 0 0 30px #accbff44,0 20px 70px #020d2370;border:1px solid #bfe4ff88;display:grid;place-items:center}.dialog-orb span{font-size:80px;color:#c4dcff;opacity:.7}.floating-message{position:absolute;padding:20px 25px;font-size:clamp(12px,1.4vw,23px);line-height:1.4;letter-spacing:-.03em;box-shadow:0 15px 50px #020a2040}.message-one{left:3%;top:30%;background:#f5f7ff;color:#172546;border-radius:24px 24px 24px 3px;transform:rotate(-7deg)}.message-two{right:5%;top:58%;background:#4264ff;color:white;border-radius:24px 24px 3px 24px;transform:rotate(5deg)}
.system-composition svg{width:100%;height:100%;color:#88b6fc66}.system-center{position:absolute;left:42%;top:35%;font-size:100px;line-height:1;letter-spacing:-.07em;color:#d3e5ff;text-shadow:0 0 45px #7eacff66}.system-center span{display:block;font-size:14px;letter-spacing:.15em;text-align:center}.system-point{position:absolute;border:1px solid #d3e4ff66;border-radius:50%;width:80px;height:80px;display:grid;place-items:center;font-size:10px;letter-spacing:.15em;background:#122341}.point-site{left:9%;top:23%}.point-ai{right:12%;top:29%}.point-client{left:43%;bottom:10%}
.making-story{background:#eceef4;color:#1c2340;height:290svh}.making-story .story-stage{background:radial-gradient(ellipse at 46% 72%,#d4dffa 0%,#eceef4 52%)}.making-story h2{position:absolute;top:15%;left:4.4%;font-size:clamp(45px,6.5vw,104px);line-height:1.05;letter-spacing:-.06em;font-weight:500;z-index:3}.making-story h2 em{font-style:normal;color:#3d55ff}.making-number{position:absolute;left:4.4%;bottom:20%;font-size:clamp(100px,17vw,265px);line-height:.8;letter-spacing:-.085em;color:#3d55ff;font-weight:400}.making-number i{font-size:13px;letter-spacing:0;font-style:normal;margin-left:14px;color:#7f8aa5}.making-copy{position:absolute;right:4.4%;width:27%;top:40%;z-index:3}.making-copy .story-kicker{color:#607096;margin-bottom:23px}.making-copy h3{font-size:clamp(24px,2.7vw,43px);letter-spacing:-.045em;line-height:1.13;margin-bottom:20px}.making-copy p{font-size:13px;line-height:1.7;color:#65718d;max-width:330px}.making-output{font-size:9px;letter-spacing:.03em;color:#7b89a7;display:block;margin-top:28px;padding-top:16px;border-top:1px solid #b6c2db}.making-output b{display:block;font-size:16px;font-weight:500;letter-spacing:-.02em;color:#3545ab;margin-top:7px}.making-copy .story-link{margin-top:12px;border-color:#aebcda}.making-story .story-nav{color:#3d55ff}
.making-art{position:absolute;left:22%;top:32%;width:46%;height:52%;perspective:1100px}.making-floor{position:absolute;width:85%;height:35%;left:8%;bottom:0;border:1px solid #bfcae4;border-radius:50%;transform:rotateX(65deg)}.making-axis{position:absolute;height:1px;width:100%;background:#cbd3e3;top:62%;transform:rotate(-28deg)}.axis-two{transform:rotate(28deg)}.making-object{position:absolute;left:25%;top:7%;width:52%;height:72%;transform-style:preserve-3d;transform:rotateY(-20deg) rotateX(9deg) rotateZ(-9deg);transition:transform .8s}.blueprint{position:absolute;inset:0;border:1px solid #8eabed;background:linear-gradient(140deg,#fff9,#b7c9ff50);border-radius:8px;transition:transform .8s,background .8s,opacity .6s;box-shadow:0 20px 35px #244b9915}.blueprint-back{transform:translate(-30px,-16px);opacity:.6}.blueprint-middle{transform:translate(26px,14px);opacity:.6}.blueprint-front{background:repeating-linear-gradient(0deg,transparent 0 25px,#adc0eb55 26px 27px),repeating-linear-gradient(90deg,#f4f7ff99 0 25px,#adc0eb55 26px 27px)}.blueprint-bar{height:24px;border-bottom:1px solid #a9bce7;display:flex;gap:5px;align-items:center;padding-left:12px}.blueprint-bar i{height:4px;width:4px;background:#879ece;border-radius:50%}.blueprint-label{position:absolute;top:18%;left:12%;font-size:7px;letter-spacing:.16em;color:#5a77b7}.blueprint strong{position:absolute;left:12%;top:33%;font-size:clamp(32px,4.5vw,70px);line-height:1;letter-spacing:-.06em;font-weight:500;color:transparent;-webkit-text-stroke:1px #718ecb;transition:color .5s}.blueprint-line{position:absolute;left:12%;width:30%;height:1px;background:#7299e6;bottom:18%}.blueprint-dot{position:absolute;right:12%;bottom:14%;height:38px;width:38px;border-radius:50%;border:1px solid #92abe0;display:grid;place-items:center;color:#3d55ff;font-size:22px}.making-caption{position:absolute;bottom:0;left:0;right:0;text-align:center;font-size:8px;letter-spacing:.15em;color:#7c8eb4}.making-caption>span{display:none}[data-step="0"] .caption-draft,[data-step="1"] .caption-build,[data-step="2"] .caption-live{display:block}
.making-story[data-step="1"] .blueprint-back{transform:translate(-65px,-28px) rotate(-15deg)}.making-story[data-step="1"] .blueprint-middle{transform:translate(65px,24px) rotate(15deg)}.making-story[data-step="1"] .blueprint-front{background:#e7edff}.making-story[data-step="1"] .blueprint strong{color:#3d55ff;-webkit-text-stroke:0}.making-story[data-step="2"] .making-object{transform:rotateY(0) rotateX(0) rotateZ(0) translateY(-10px)}.making-story[data-step="2"] .blueprint-back,.making-story[data-step="2"] .blueprint-middle{transform:none;opacity:0}.making-story[data-step="2"] .blueprint-front{background:#3d55ff;border-color:#3d55ff;box-shadow:0 30px 55px #3455ff33}.making-story[data-step="2"] .blueprint strong{color:white;-webkit-text-stroke:0}.making-story[data-step="2"] .blueprint-label,.making-story[data-step="2"] .blueprint-dot{color:#fff}.making-story[data-step="2"] .blueprint-dot{background:white;color:#3d55ff}.making-story[data-step="2"] .blueprint-line{background:white}
@media(max-width:1000px) and (min-width:761px){.story-copy h3{font-size:65px}.story-copy p{font-size:13px}.making-number{font-size:145px}.making-copy{width:29%}.making-art{left:19%;width:49%}.story-nav{gap:16px}.story-nav button{min-width:90px}}
@media(max-width:760px){.editorial-scene{height:280svh;margin:20px 0 45px}.editorial-scene .story-stage{min-height:640px}.story-top,.story-bottom{left:24px;right:24px}.story-top{top:27px}.story-top .eyebrow{font-size:8px}.story-top>p:last-child{font-size:9px;max-width:125px}.story-bottom{bottom:24px}.story-scroll{display:none}.story-nav{width:100%;justify-content:space-between;gap:12px}.story-nav button{min-width:0;flex:1;font-size:9px}.story-nav button span{font-size:10px;margin-left:7px}.story-copy{top:13%;left:24px;right:24px;width:auto}.story-kicker{font-size:8px;margin-bottom:14px}.story-copy h3{font-size:clamp(42px,12vw,60px);margin-bottom:17px;line-height:.99}.story-copy h3 br{display:none}.story-copy h3 em{display:block}.story-copy p{font-size:12px;line-height:1.5}.story-detail{font-size:8px;margin-top:10px}.story-link{font-size:11px;margin-top:8px;padding:10px 0;gap:25px}.service-art{top:43%;right:0;width:100%;height:45%}.art-coordinate{display:none}.site-sheet{width:68%;left:12%;height:59%}.sheet-middle{left:18%;top:18%}.sheet-back{left:24%;top:10%}.visual-caption{font-size:8px;bottom:0;left:12%}.art-orbit{width:80%;left:10%;top:0}.orbit-inner{width:60%;left:20%;top:10%}.dialog-orb{width:43%;left:30%;top:7%}.dialog-orb span{font-size:60px}.floating-message{padding:15px 18px;font-size:14px}.message-one{left:7%;top:25%}.message-two{right:7%;top:57%}.system-center{font-size:80px;left:43%;top:29%}.system-point{width:59px;height:59px;font-size:8px}.point-site{left:12%;top:19%}.point-ai{right:10%;top:23%}.point-client{left:45%;bottom:7%}.making-story h2{top:12%;left:24px;right:24px;font-size:clamp(35px,10vw,48px);line-height:1.02}.making-story h2 em{display:block}.making-art{top:26%;left:15%;width:75%;height:31%}.making-number{left:24px;top:30%;bottom:auto;font-size:64px;z-index:3}.making-number i{display:block;font-size:8px;letter-spacing:.1em;margin:12px 0 0 5px}.making-object{height:78%;left:30%;width:51%}.blueprint strong{font-size:38px}.blueprint-label{font-size:6px}.blueprint-dot{width:28px;height:28px;font-size:18px}.making-copy{top:61%;left:24px;right:24px;width:auto}.making-copy .story-kicker{font-size:8px;margin-bottom:10px}.making-copy h3{font-size:25px;line-height:1.08;margin-bottom:10px}.making-copy h3 br{display:none}.making-copy p{font-size:11px;line-height:1.5;max-width:100%}.making-output{margin-top:12px;padding-top:9px;font-size:8px;display:flex;align-items:center;justify-content:space-between}.making-output b{font-size:12px;margin:0}.making-copy .story-link{font-size:10px;padding:7px 0;margin-top:3px}.making-caption{font-size:6px}.blueprint-bar{height:18px}}
@media(max-height:720px) and (max-width:760px){.story-copy{top:12%}.story-copy h3{font-size:40px}.story-copy p{font-size:11px}.story-detail{display:none}.service-art{top:46%;height:39%}.making-story h2{font-size:35px}.making-copy{top:59%}.making-copy h3{font-size:21px}.making-copy p{font-size:10px}.making-output{margin-top:8px;padding-top:7px}.making-copy .story-kicker{margin-bottom:7px}.story-bottom{bottom:15px}.making-art{top:26%;height:29%}}
@media(prefers-reduced-motion:reduce){.editorial-scene{height:auto}.editorial-scene .story-stage{position:relative;height:auto;min-height:0;padding:100px 24px 40px}.story-top{top:24px}.story-copy,.making-copy{position:relative;inset:auto;width:100%}.story-panel{position:relative;inset:auto;opacity:1;visibility:visible;transform:none;margin-bottom:45px;transition:none}.service-art,.making-art,.making-number,.story-bottom{display:none}.making-story h2{position:relative;inset:auto;font-size:45px;margin-bottom:40px}.story-copy h3{font-size:48px}.making-copy h3{font-size:28px}}

@media(max-width:360px){.blueprint strong{font-size:32px}}