/* Product story: oversized chapter numbers and layered, interactive windows. */
.product-story{background:#0d100c;padding:100px 0 80px;border-block:1px solid var(--line);overflow:clip}
.story-intro{display:flex;justify-content:space-between;align-items:flex-end;gap:60px;margin-bottom:52px}
.story-intro h2{font-size:clamp(48px,6vw,90px)}
.story-intro>p{max-width:340px;font-size:17px;color:var(--muted);margin:0 0 6px}
.chapter-nav{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-block:1px solid #3b4730;margin-bottom:15px}
.chapter-nav a{display:flex;align-items:center;gap:16px;padding:23px 20px;color:#a3ae96;font-size:14px;transition:background .2s,color .2s}
.chapter-nav a+a{border-left:1px solid #293222}.chapter-nav a span{font-family:monospace;color:#738363;font-size:12px}.chapter-nav i{font-style:normal;margin-left:auto}.chapter-nav a:hover,.chapter-nav a[aria-current=true]{color:var(--lime);background:#cbff5907}.chapter-nav a[aria-current=true] span{color:var(--lime)}
.product-scene{display:grid;grid-template-columns:100px minmax(220px,.7fr) minmax(0,1.3fr);gap:32px;align-items:center;position:relative;min-height:570px;padding:65px 0;border-bottom:1px solid #ffffff0a;scroll-margin-top:40px}
.scene-rail{align-self:stretch;position:relative;padding-top:32px}.scene-rail:after{content:'';position:absolute;left:24px;top:165px;bottom:-65px;width:1px;background:linear-gradient(#6e87434d,#34412622)}.scene-04 .scene-rail:after{display:none}
.scene-number{display:block;font-family:var(--display);font-weight:500;font-size:75px;line-height:1;letter-spacing:-7px;color:#e4edd9}.scene-label{display:block;font-size:12px;text-transform:uppercase;letter-spacing:1.5px;margin-top:21px;color:#b4cc98}
.scene-copy{align-self:center;padding-bottom:20px;position:relative;z-index:3}.scene-copy h3{font-size:clamp(28px,2.5vw,40px);line-height:1.17;margin:0 0 24px;letter-spacing:-1.3px}.scene-copy h3 em{font-family:Georgia,serif;font-weight:400;color:var(--lime)}.scene-copy>p{font-size:16px;color:#a0ad93;max-width:355px;margin:0}.scene-takeaway{display:flex;gap:12px;align-items:baseline;color:#c2d2af;border-top:1px solid #46593666;padding-top:20px;margin-top:28px;font-size:14px;line-height:1.5}.scene-takeaway>span{color:var(--lime);font-size:20px}
.scene-stage{position:relative;height:430px;isolation:isolate;perspective:1600px;--pointer-x:0px;--pointer-y:0px}
.scene-stage:before{content:'';position:absolute;inset:0 -8%;background:radial-gradient(ellipse at 55% 55%,#9ac74412,transparent 65%);pointer-events:none;z-index:-1}.stage-coordinate{position:absolute;top:-24px;right:0;font-family:monospace;font-size:12px;letter-spacing:2px;color:#596d49}.stage-footer{position:absolute;bottom:-22px;right:0;font-size:12px;letter-spacing:1px;color:#69795c}
.scene-stage .scene-window{position:absolute;display:block;margin:0;padding:0;border:1px solid #5a6d434f;border-radius:10px;background:#10120f;box-shadow:0 24px 65px #0008,0 2px 4px #0008;overflow:hidden;text-align:left;line-height:normal;transform:translate(var(--pointer-x),var(--pointer-y)) rotate(var(--angle,0deg));transition:transform .55s cubic-bezier(.2,.8,.2,1),box-shadow .35s,border-color .35s,filter .35s;will-change:transform}
.scene-stage .scene-window img{display:block;width:100%;height:auto;max-height:none;object-fit:contain;filter:none;transition:none}
.scene-stage .scene-chrome{position:static;display:flex;align-items:center;justify-content:space-between;gap:12px;transform:none;background:#171c14;color:#bbc6b0;border:0;border-radius:0;box-shadow:none;padding:11px 13px;font-size:12px;line-height:1.2;font-weight:400;white-space:nowrap;max-width:100%;}
.scene-chrome>span:nth-child(2){overflow:hidden;text-overflow:ellipsis}.scene-chrome .chrome-dots{font-size:9px;letter-spacing:3px;color:#4c5841;flex-shrink:0}.scene-chrome>span:last-child{color:#96ad7b;flex-shrink:0}
.scene-stage .scene-open{position:absolute;bottom:12px;right:12px;left:auto;transform:translateY(8px);opacity:0;transition:opacity .2s,transform .2s;background:var(--lime);color:#18220e;padding:10px 15px;font-size:12px;box-shadow:0 4px 20px #0007;border-radius:30px;line-height:1.4;white-space:nowrap}
.scene-stage .scene-window:hover,.scene-stage .scene-window:focus-visible{transform:translateY(-10px) rotate(0deg) scale(1.045);border-color:#c9ff5999;box-shadow:0 30px 90px #000b,0 0 35px #cbff5910;z-index:8}.scene-window:hover .scene-open,.scene-window:focus-visible .scene-open{opacity:1;transform:translateY(0)}
.scene-stage .screen-main{width:83%;right:0;top:10px;--angle:2deg;z-index:1}.scene-stage .screen-detail{width:52%;left:-12px;bottom:8px;--angle:-5deg;z-index:2}
.scene-01 .screen-main{width:72%;right:3%;top:8px}.scene-01 .screen-detail{width:61%;left:0;bottom:12px}
.scene-02 .screen-main{width:89%;right:-4%;top:20px;--angle:-2deg}.scene-02 .screen-detail{width:48%;bottom:12px;left:0;--angle:4deg}
.scene-03 .screen-main{width:92%;top:45px;right:0;--angle:2deg}.scene-03 .screen-detail{width:62%;left:4%;top:-3px;bottom:auto;--angle:-4deg;z-index:3}.scene-03 .screen-extra{width:89%;left:-3%;bottom:5px;--angle:-3deg;z-index:2}
.scene-04 .screen-main{width:80%;right:2%;top:0;--angle:-2deg;max-height:335px}.scene-04 .screen-detail{width:55%;left:-6%;bottom:0;--angle:-5deg;max-height:220px}.scene-04 .screen-extra{width:53%;right:-6%;bottom:5px;--angle:5deg;z-index:3;max-height:240px}
.product-story .development{margin-top:60px}.product-story .development h3{font-size:30px}
@media(prefers-reduced-motion:no-preference){.product-scene.scene-arrived .scene-window{animation:window-enter .85s cubic-bezier(.2,.8,.2,1) both}.product-scene.scene-arrived .screen-detail{animation-delay:.1s}.product-scene.scene-arrived .screen-extra{animation-delay:.18s}@keyframes window-enter{from{opacity:0;translate:0 30px}to{opacity:1;translate:0 0}}}
@media(min-width:1500px){.scene-stage{height:490px}.product-scene{min-height:650px}.scene-04 .screen-main{max-height:390px}.scene-04 .screen-extra{max-height:290px}.scene-04 .screen-detail{max-height:260px}}
@media(max-width:1050px){.product-scene{grid-template-columns:66px minmax(190px,.8fr) minmax(0,1.2fr);gap:20px;min-height:530px}.scene-number{font-size:60px}.scene-label{font-size:12px;letter-spacing:0}.scene-stage{height:350px}.scene-copy h3{font-size:29px}.scene-copy>p{font-size:15px}.scene-chrome .chrome-dots{display:none}.scene-stage .scene-chrome{gap:6px;padding:9px;font-size:12px}.scene-04 .screen-main{max-height:270px}.scene-04 .screen-detail{max-height:160px}.scene-04 .screen-extra{max-height:180px}}
@media(max-width:760px){.product-story{padding:65px 0}.story-intro{display:block;margin-bottom:30px}.story-intro h2{font-size:54px}.story-intro>p{margin-top:25px;font-size:16px}.chapter-nav{grid-template-columns:1fr 1fr;margin-bottom:12px}.chapter-nav a{padding:14px 10px;gap:9px;font-size:13px}.chapter-nav a:nth-child(3){border-left:0;border-top:1px solid #293222}.chapter-nav a:nth-child(4){border-top:1px solid #293222}.product-scene{grid-template-columns:56px minmax(0,1fr);gap:24px 18px;min-height:0;padding:40px 0 55px}.scene-rail{padding-top:0}.scene-rail:after{left:20px;top:100px;bottom:0}.scene-number{font-size:52px;letter-spacing:-5px}.scene-label{writing-mode:vertical-rl;font-size:12px;letter-spacing:1.5px;margin-left:14px;margin-top:18px}.scene-copy{padding:0}.scene-copy h3{font-size:30px;margin-bottom:17px}.scene-copy>p{font-size:16px}.scene-takeaway{font-size:14px;margin-top:20px;padding-top:15px}.scene-stage{grid-column:1/-1;height:370px;margin:15px 8px 0;max-width:480px;width:calc(100% - 16px);justify-self:center}.stage-coordinate{display:none}.stage-footer{font-size:10px;bottom:-17px}.scene-stage .screen-main{right:0}.scene-stage .screen-detail{left:0}.scene-01 .screen-main{width:73%}.scene-02 .screen-main{width:94%}.scene-02 .screen-detail{width:54%;bottom:0}.scene-03 .scene-stage{height:280px}.scene-03 .screen-main{width:96%;top:42px}.scene-03 .screen-detail{width:67%;left:0;top:-5px}.scene-03 .screen-extra{width:95%;left:0;bottom:4px}.scene-04 .scene-stage{height:330px}.scene-04 .screen-main{width:89%;max-height:260px}.scene-04 .screen-detail{width:57%;left:-2%;max-height:160px}.scene-04 .screen-extra{width:56%;right:-2%;max-height:170px}.scene-stage .scene-chrome{font-size:12px;padding:8px}.scene-stage .scene-open{opacity:1;transform:none;padding:7px 11px;font-size:12px;bottom:8px;right:8px}.product-story .development{gap:25px;margin-top:35px}.scene-window:hover{z-index:8}}
@media(max-width:390px){.scene-stage{height:310px}.scene-03 .scene-stage{height:250px}.scene-04 .scene-stage{height:290px}.scene-copy h3{font-size:26px}}
@media(prefers-reduced-motion:reduce){.scene-stage .scene-window{transition:none;transform:rotate(var(--angle,0deg));will-change:auto}.scene-stage .scene-window:hover,.scene-stage .scene-window:focus-visible{transform:none}}