.case,.case *,.case :before,.case :after{box-sizing:content-box}.case{--o5:#5eead4;background:var(--bg);color:var(--fg);line-height:normal;position:relative;overflow-x:clip}.case img{object-fit:cover;object-position:top;width:100%;height:100%;display:block}.case .k{letter-spacing:.14em;color:var(--acc);text-transform:uppercase;font:600 11px JetBrains Mono}.case .bw{background:#fff;border-radius:12px;overflow:hidden;box-shadow:0 50px 100px -30px #000c,0 0 0 1px #ffffff1a}.case .bw .bar{background:#eef3f4;align-items:center;gap:6px;height:26px;padding:0 10px;display:flex}.case .bw .bar i{background:#d3dcde;border-radius:50%;width:8px;height:8px}.case .bw .bar span{color:#4b5b60;white-space:nowrap;background:#fff;border-radius:7px;flex:1;max-width:260px;height:15px;margin-left:10px;padding-left:9px;font:500 9px/15px JetBrains Mono;overflow:hidden}.case .scr{aspect-ratio:1442/802;background:#fff;position:relative;overflow:hidden}.case .scr img{clip-path:inset(100% 0 0);transition:clip-path .8s cubic-bezier(.7,0,.2,1);position:absolute;inset:0}.case .scr img.show{clip-path:inset(0);z-index:2}.case .scr img.prev{clip-path:inset(0);z-index:1}.case .phs{height:100%;position:relative}.case .ph{aspect-ratio:388/842;background:#000;border:6px solid #0a1a1f;border-radius:30px;height:100%;position:absolute;top:0;overflow:hidden;box-shadow:0 40px 80px -20px #000c}.case .ph img{clip-path:inset(100% 0 0);transition:clip-path .8s cubic-bezier(.7,0,.2,1);position:absolute;inset:0}.case .ph img.show{clip-path:inset(0);z-index:2}.case .ph img.prev{clip-path:inset(0);z-index:1}.case .appshot{flex-direction:column;justify-content:center;align-items:center;height:100%;min-height:100%;display:flex;position:relative}.case .appshot .awin{background:#111;border-radius:12px;position:relative;overflow:hidden;box-shadow:0 50px 100px -30px #000c,0 0 0 1px #ffffff1f}.case .appshot .awin img{clip-path:none;width:100%;height:auto}.case .appshot .abar{background:#2a2d33;align-items:center;gap:7px;height:28px;padding:0 12px;display:flex}.case .appshot .abar i{background:#ff5f57;border-radius:50%;width:11px;height:11px}.case .appshot .abar i:nth-child(2){background:#febc2e}.case .appshot .abar i:nth-child(3){background:#28c840}.case .appshot .abar span{text-align:center;color:#9aa3ad;flex:1;margin-right:46px;font:500 11px JetBrains Mono}.case .appshot.term .awin{background:#1b1d22;width:100%;max-width:960px}.case .appshot.deskpop{height:auto;min-height:0;padding:0 2%;display:block}.case .deskpop .desk{background:radial-gradient(60% 70% at 20% 20%,#38bdf8,#0000 60%),radial-gradient(60% 70% at 85% 90%,#2563eb,#0000 60%),linear-gradient(135deg,#0ea5e9,#1d4ed8);border-radius:16px;height:500px;position:relative;overflow:hidden;box-shadow:0 50px 100px -30px #000c,0 0 0 1px #ffffff26}.case .deskpop .mb{-webkit-backdrop-filter:blur(18px);color:#fff;background:#0b1a2e99;align-items:center;gap:14px;height:30px;padding:0 14px;font:600 12px -apple-system,Anuphan,sans-serif;display:flex}.case .deskpop .mb .ap{opacity:.9;background:#fff;border-radius:3px;width:12px;height:14px}.case .deskpop .mb .mi{opacity:.85;font-weight:500}.case .deskpop .mb .sp{flex:1}.case .deskpop .mb .bari{clip-path:none;border-radius:5px;width:auto;height:24px;display:block;box-shadow:0 0 0 1px #ffffff40,0 0 0 4px #ffffff1a}.case .deskpop .mb .sys{gap:9px;display:flex}.case .deskpop .mb .sys i{background:#fffc;border-radius:3px;width:14px;height:10px}.case .deskpop .mb .sys i:nth-child(2){width:18px}.case .deskpop .mb .clk{font-weight:500}.case .deskpop .pov{width:330px;position:absolute;top:40px;right:234px;transform:translate(50%)}.case .deskpop .pov:before{content:"";background:#232323;border-radius:2px;width:13px;height:13px;position:absolute;top:-6px;left:50%;transform:translate(-50%)rotate(45deg)}.case .deskpop .pov img{clip-path:none;border-radius:14px;width:100%;height:auto;box-shadow:0 40px 80px -24px #000d,0 0 0 1px #ffffff2e;-webkit-mask-image:linear-gradient(#000 82%,#0000);mask-image:linear-gradient(#000 82%,#0000)}.case .hero{isolation:isolate;text-align:center;background:var(--hbg);min-height:760px;color:var(--hfg);padding:104px 40px 0;position:relative;overflow:hidden}.case .hero:before{content:"";background:radial-gradient(closest-side, var(--hglow), transparent);z-index:-1;width:1100px;height:520px;position:absolute;top:300px;left:50%;transform:translate(-50%)}.case .hero:after{content:"";z-index:-1;pointer-events:none;opacity:.08;mix-blend-mode:overlay;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");position:absolute;inset:0}.case .hero .intro{max-width:760px;margin:0 auto}.case .hero h1{letter-spacing:-.06em;margin:10px 0;font:700 84px/.9 Space Grotesk,Anuphan}.case .hero h1 span{color:var(--acc-t,var(--brand))}.case .hero .tag{max-width:620px;margin:0 auto 10px;font:600 21px/1.45 Anuphan}.case .hero .intro>p{color:var(--hmut);max-width:430px;margin:0 auto 22px;font-size:15px;line-height:1.75}.case .visits{flex-direction:column;align-items:stretch;gap:12px;max-width:100%;display:inline-flex}.case .visit{background:color-mix(in srgb, var(--hfg) 8%, transparent);box-shadow:inset 0 0 0 1px var(--hline), 0 18px 40px -18px color-mix(in srgb, var(--brand) 70%, transparent);border-radius:16px;justify-content:space-between;align-items:stretch;text-decoration:none;transition:transform .25s,box-shadow .25s;display:inline-flex;overflow:hidden}.case .visit:hover{box-shadow:inset 0 0 0 1px var(--brand), 0 24px 50px -16px color-mix(in srgb, var(--brand) 85%, transparent);transform:translateY(-3px)}.case .visit:focus-visible{outline:2px solid var(--brand);outline-offset:3px}.case .visit .u{color:var(--hfg);align-items:center;gap:10px;padding:0 18px;font:500 14px JetBrains Mono;display:flex}.case .visit .live{background:#22c55e;border-radius:50%;flex:0 0 8px;width:8px;height:8px;animation:1.8s infinite case-live;box-shadow:0 0 #22c55e88}@keyframes case-live{70%{box-shadow:0 0 0 8px #22c55e00}to{box-shadow:0 0 #22c55e00}}.case .visit .u small{box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--hfg) 28%, transparent);color:var(--hfg);border-radius:6px;padding:2px 7px;font:600 10px Anuphan}.case .visit .g{background:var(--btn-bg);min-width:170px;color:var(--btn-fg);justify-content:center;align-items:center;gap:10px;padding:14px 18px 14px 20px;font:700 14px Anuphan;display:flex}.case .visit .g i{background:color-mix(in srgb, var(--btn-fg) 20%, transparent);border-radius:50%;justify-content:center;align-items:center;width:24px;height:24px;font-style:normal;display:inline-flex;position:relative;overflow:hidden}.case .visit .g i b{transition:transform .35s cubic-bezier(.6,0,.2,1)}.case .visit .g i b+b{position:absolute;transform:translate(-160%,160%)}.case .visit:hover .g i b:first-child{transform:translate(160%,-160%)}.case .visit:hover .g i b+b{transform:none}.case .studio{max-width:1000px;height:430px;margin:34px auto 0;transition:transform .6s cubic-bezier(.2,.8,.2,1);position:relative}.case .studio .floor{background:radial-gradient(closest-side,#0009,#0000);border-radius:50%;height:40px;position:absolute;bottom:6px;left:8%;right:8%}.case .laptop{width:640px;animation:1s cubic-bezier(.2,.9,.2,1) both case-up;position:absolute;bottom:28px;left:50%;transform:translate(-50%)}.case .laptop .lid{background:#0b0f12;border-radius:18px 18px 4px 4px;padding:14px 14px 18px;box-shadow:inset 0 0 0 2px #2a3338}.case .laptop .lid .scr{border-radius:4px}.case .laptop .base{background:linear-gradient(#cfd6d9,#8f9a9e);border-radius:0 0 18px 18px;height:16px;margin:0 -46px;position:relative}.case .laptop .base:before{content:"";background:#a9b3b6;border-radius:0 0 8px 8px;width:120px;height:7px;position:absolute;top:0;left:50%;transform:translate(-50%)}.case .win2{z-index:2;width:360px;animation:1s cubic-bezier(.2,.9,.2,1) .25s both case-up;position:absolute;bottom:120px;right:2%;transform:rotate(3deg)}.case .win3{z-index:2;width:300px;animation:1s cubic-bezier(.2,.9,.2,1) .4s both case-up;position:absolute;bottom:150px;left:1%;transform:rotate(-4deg)}.case .win2 .scr img,.case .win3 .scr img{clip-path:none}@keyframes case-up{0%{opacity:0;translate:0 60px}}.case .studio .phs{width:560px;height:420px;margin:0 auto}.case .studio:has(.phs){height:500px}.case .studio .appshot{height:430px;animation:1s cubic-bezier(.2,.9,.2,1) both case-up}.case .studio:has(.deskpop),.case .studio .appshot.deskpop{height:auto}.case .hero .roleline{border-top:1px solid var(--hline);color:var(--hmut);flex-wrap:wrap;justify-content:center;gap:26px;margin-top:10px;padding:18px 0 26px;font-size:13px;display:flex;position:relative}.case .hero .roleline b{color:var(--hfg);margin-top:2px;font:600 14px Anuphan;display:block}.case .hero .fx{z-index:-1;pointer-events:none;position:absolute;inset:0;overflow:hidden}.case .hero .fx svg{width:100%;max-width:none;height:100%;position:absolute;inset:0}.case .fx .route{fill:none;stroke:var(--brand);stroke-width:2.5px;stroke-linecap:round;stroke-dasharray:2 12;opacity:.45}.case .fx .draw{fill:none;stroke:var(--brand);stroke-width:2.5px;stroke-linecap:round;opacity:.55;stroke-dasharray:1400;stroke-dashoffset:1400px;animation:7s ease-in-out infinite case-drawr}@keyframes case-drawr{50%{stroke-dashoffset:0}to{stroke-dashoffset:-1400px}}.case .fx .pin{fill:var(--brand);transform-box:fill-box;transform-origin:50% 100%;animation:3.5s ease-in-out infinite case-pin}@keyframes case-pin{0%,to{opacity:.4;transform:scale(.6)}50%{opacity:.9;transform:scale(1.1)}}.case .fx .grid,.case .fx .grid2{background-image:radial-gradient(currentColor 1.6px,#0000 1.8px);background-size:22px 22px;position:absolute;inset:-2%}.case .fx .grid{color:#ffffff1a}.case .fx .grid2{color:var(--brand);animation:4.5s cubic-bezier(.6,0,.4,1) infinite case-scanm;-webkit-mask:linear-gradient(#0000 0%,#000 48% 52%,#0000 100%) 0 0/100% 40% no-repeat;mask:linear-gradient(#0000 0%,#000 48% 52%,#0000 100%) 0 0/100% 40% no-repeat}@keyframes case-scanm{0%{-webkit-mask-position:0 -60%;mask-position:0 -60%}to{-webkit-mask-position:0 170%;mask-position:0 170%}}.case .fx .beam{background:linear-gradient(90deg, transparent, var(--brand), transparent);height:2px;box-shadow:0 0 24px 4px color-mix(in srgb, var(--brand) 60%, transparent);animation:4.5s cubic-bezier(.6,0,.4,1) infinite case-beam;position:absolute;top:30%;left:0;right:0}@keyframes case-beam{0%{top:-5%}to{top:105%}}.case .fx .coin{border:2px solid color-mix(in srgb, var(--brand) 70%, #fff);background:color-mix(in srgb, var(--brand) 30%, transparent);opacity:.5;border-radius:50%;animation:linear infinite case-rise2;position:absolute;bottom:-40px}@keyframes case-rise2{to{opacity:0;transform:translateY(-900px)rotate(200deg)}}.case .fx .spark{fill:none;stroke:var(--brand);stroke-width:3px;stroke-linejoin:round;stroke-dasharray:1600;stroke-dashoffset:1600px;opacity:.6;animation:8s ease-in-out infinite case-drawr}.case .fxq .lim{stroke:#ffffff40;stroke-dasharray:6 8;stroke-width:1.5px;vector-effect:non-scaling-stroke}.case .fxq .lt{color:#ffffff70;font:500 12px/1 JetBrains Mono,monospace;position:absolute;bottom:88.1579%;right:1%}.case .fxq .ln{fill:none;stroke:#7dd3fc;stroke-opacity:.55;stroke-width:2px;vector-effect:non-scaling-stroke}.case .fxq .ar{transform-box:view-box;transform-origin:50% 100%;animation:7s ease-in-out infinite alternate case-qrise}@keyframes case-qrise{0%{transform:scaleY(.84)}to{transform:scaleY(1)}}.case .fxt{color:var(--brand);-webkit-mask-composite:source-in;font:500 13px/2.1 JetBrains Mono,monospace;-webkit-mask-image:linear-gradient(#0000,#000 15% 75%,#0000),linear-gradient(90deg,#000 0 24%,#0000 36% 64%,#000 76%);mask-image:linear-gradient(#0000,#000 15% 75%,#0000),linear-gradient(90deg,#000 0 24%,#0000 36% 64%,#000 76%);-webkit-mask-position:0 0,0 0;mask-position:0 0,0 0;-webkit-mask-size:auto,auto;mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;mask-repeat:repeat,repeat;-webkit-mask-clip:border-box,border-box;mask-clip:border-box,border-box;-webkit-mask-origin:border-box,border-box;mask-origin:border-box,border-box;mask-composite:intersect;mask-mode:match-source,match-source}.case .fxt .tc{white-space:nowrap;opacity:.16;animation:linear infinite case-tscroll;position:absolute;top:0}.case .fxt .tc i{font-style:normal;display:block}.case .fxt .tc i:before{content:attr(data-t)}.case .fxt .tc i:nth-child(3n){opacity:.45}@keyframes case-tscroll{0%{transform:translateY(0)}to{transform:translateY(-50%)}}.case .fxt .scan{background:repeating-linear-gradient(#0000 0 3px,#0000002e 3px 4px);position:absolute;inset:0}.case .nums{grid-template-columns:repeat(var(--n,3), 1fr);background:#fff;border-bottom:1px solid #062a330d;display:grid}.case .nums>div{border-right:1px solid #062a330d;padding:30px 40px}.case .nums b{letter-spacing:-.05em;font:700 54px/1 Space Grotesk;display:block}.case .nums b em{color:var(--acc);font-style:normal}.case .nums span{color:var(--mut);font-size:13px}.case .story{background:var(--bg);grid-template-columns:1.25fr 1fr;gap:40px;padding:0 40px;display:grid}.case .story .stk{align-items:center;height:600px;display:flex;position:sticky;top:70px}.case .story .stk .wrap{width:100%}.case .story .phs{height:540px}.case .story .appshot{height:560px}.case .story .appshot.term .awin{max-width:100%}.case .story .steps{padding:160px 0 200px}.case .step{border-left:3px solid #062a3314;min-height:360px;padding-left:22px;transition:border-color .5s;position:relative}.case .story.js .step.on{border-left-color:var(--acc)}.case .step .no{color:var(--acc);font:700 14px JetBrains Mono;transition:color .5s}.case .step h3{letter-spacing:-.04em;margin:8px 0 12px;font:700 34px/1.1 Space Grotesk,Anuphan;transition:color .5s}@media (width>=821px){.case .story.js .step:not(.on) .no,.case .story.js .step:not(.on) h3{color:var(--mut)}}.case .step p{color:var(--mut);margin:0;font-size:16px;line-height:1.75}.case .arch{color:#fff;background:radial-gradient(90% 70% at 50% 0%, color-mix(in srgb, var(--brand) 32%, #0b3b4a) 0%, color-mix(in srgb, var(--brand) 12%, #08303b) 55%, #072832 100%);padding:60px 40px;position:relative;overflow:hidden}.case .arch>*{position:relative}.case .arch{--brand-t:color-mix(in srgb, var(--brand) 30%, #fff)}.case .arch .k{color:var(--brand-t)}.case .arch h2{letter-spacing:-.04em;color:#fff;margin:10px 0 6px;font:700 40px Space Grotesk,Anuphan}.case .arch>p{color:#cfe3e1;max-width:560px;line-height:1.7}.case .arch svg{width:100%;height:auto;display:block}@keyframes case-dash{to{stroke-dashoffset:-28px}}.case .iso{grid-template-columns:1.2fr 1fr;align-items:center;gap:20px;margin-top:20px;display:grid}.case .iso svg{overflow:visible}.case .iso .face{fill:#ffffff10;stroke:#e6f4f2;stroke-width:1px;transition:all .4s}.case .iso .side{fill:#ffffff06;stroke:#e6f4f288;stroke-width:1px}.case .iso .box{fill:#ffffff24;stroke:#fffc;stroke-width:.8px}.case .iso .lv{cursor:pointer;transition:transform .5s cubic-bezier(.2,.9,.2,1)}.case .iso .lv.on{transform:translateY(-14px)}.case .iso .lv.on .face{fill:#0b3b4a;stroke:var(--o5)}.case .iso .lv.on .box{fill:var(--brand);stroke:#fff}.case .iso .fig{fill:#fffa;letter-spacing:.12em;font:500 10px JetBrains Mono}.case .iso .beam{stroke:var(--acc);stroke-width:2px;stroke-dasharray:3 7;animation:1s linear infinite case-dash}.case .legend{gap:8px;display:grid}.case .legend>div{cursor:pointer;text-align:left;background:#ffffff0a;border:1px solid #ffffff26;border-radius:14px;grid-template-columns:54px 1fr;gap:10px;padding:14px 16px;transition:all .3s;display:grid}.case .legend>div.on{border-color:var(--brand);background:#ffffff12}.case .legend span{color:var(--brand-t);letter-spacing:.1em;padding-top:3px;font:600 10px JetBrains Mono}.case .legend b{color:#fff;font:700 16px Space Grotesk;display:block}.case .legend small{color:#d3e6e4;font:500 11px JetBrains Mono}.case .flowd .nd rect{fill:#ffffff12;stroke:#ffffff40;transition:all .4s}.case .flowd .nd.on rect{stroke:var(--brand);fill:#0f4436;filter:drop-shadow(0 0 14px color-mix(in srgb, var(--brand) 60%, transparent))}.case .flowd .nd text{fill:#fff;font:700 14px Space Grotesk,Anuphan}.case .flowd .nd .s{fill:#d3e6e4;font:500 10.5px JetBrains Mono}.case .flowd .p{fill:none;stroke:color-mix(in srgb, var(--brand) 55%, #ffffff40);stroke-width:2px}.case .flowd .p.on{stroke:var(--brand);stroke-dasharray:6 6;animation:.8s linear infinite case-dash}.case .flowd .steps{grid-template-columns:repeat(var(--n,4), 1fr);gap:10px;margin-top:16px;display:grid}.case .flowd .steps div{color:#cfe3e1;border-top:2px solid #fff3;padding-top:10px;font-size:13px;line-height:1.5;transition:all .4s}.case .flowd .steps div.on{border-color:var(--brand);color:#fff}.case .flowd .steps b{color:var(--brand-t);margin-bottom:4px;font:700 12px JetBrains Mono;display:block}.case .vault{grid-template-columns:1.1fr 1fr;align-items:center;gap:30px;margin-top:16px;display:grid}.case .vault .ring{fill:none;stroke:#fff5}.case .vault .ring.d{stroke-dasharray:4 7;stroke:#5eead488;transform-origin:300px 260px;animation:40s linear infinite case-spin}@keyframes case-spin{to{transform:rotate(360deg)}}.case .vault .rl{fill:#e6f4f2;letter-spacing:.12em;font:600 10px JetBrains Mono}.case .vault .band{fill:none;stroke-width:34px;opacity:.3;transition:opacity .4s}.case .vault .band.on{opacity:.8}.case .vault .core{fill:var(--brand)}.case .vault .ext rect{fill:#ffffff14;stroke:#fff5}.case .vault .ext text{fill:#fff;font:600 12px Space Grotesk}.case .vault .in{stroke:#5eead4;stroke-width:2px;fill:none;stroke-dasharray:5 6;animation:1s linear infinite case-dash}.case .vault .out{stroke:#0d9488;stroke-width:2px;fill:none;stroke-dasharray:3 5}.case .vault .x{stroke:#0d9488;stroke-width:3px}.case .tstack{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;margin-top:34px;display:grid}.case .tgrp{background:#ffffff10;border:1px solid #ffffff26;border-radius:20px;padding:16px 16px 12px}.case .tgrp h3{letter-spacing:.16em;color:var(--brand-t);text-transform:uppercase;justify-content:space-between;margin:0 0 12px;font:600 10px JetBrains Mono;display:flex}.case .tgrp h3 em{color:#ffffffd9;font-style:normal}.case .tech{border-radius:12px;align-items:center;gap:12px;padding:8px;transition:background .25s,transform .25s;display:flex}.case .tech:hover{background:#ffffff0d;transform:translate(3px)}.case .tech .ic{background:color-mix(in srgb, var(--c) 45%, #0b2a35);border-radius:11px;flex:0 0 38px;justify-content:center;align-items:center;width:38px;height:38px;display:flex;box-shadow:inset 0 0 0 1px #ffffff40}.case .tech .ic img{object-fit:contain;filter:invert();width:20px;height:20px}.case .tech .ic b{color:#fff;font:700 12px Space Grotesk}.case .tech .ic img+b,.case .tech .ic.noi img{display:none}.case .tech .ic.noi img+b{display:inline}.case .tech .nm{color:#fff;font:600 14px/1.1 Space Grotesk}.case .tech .ds{color:#d3e6e4;margin-top:2px;font:500 11px Anuphan}.case .nx2{background:var(--bg);padding:56px 40px 30px}.case .nxcard{background:var(--nb);max-width:100%;min-height:340px;color:var(--nfg);border-radius:30px;grid-template-columns:1fr 1.05fr;align-items:center;gap:20px;padding:0 0 0 48px;text-decoration:none;transition:transform .5s cubic-bezier(.2,.8,.2,1);display:grid;position:relative;overflow:hidden;box-shadow:0 30px 70px -30px #062a3366}.case .nxcard:hover{transform:translateY(-6px)}.case .nxcard:focus-visible{outline:3px solid var(--acc);outline-offset:4px}.case .nxcard:before{content:"";background:var(--nbrand);filter:blur(100px);opacity:.35;border-radius:50%;width:420px;height:420px;position:absolute;top:-80px;right:-80px}.case .nxt{position:relative}.case .nxk{letter-spacing:.14em;color:inherit;opacity:.8;text-transform:uppercase;font:600 11px JetBrains Mono}.case .nxn{letter-spacing:-.06em;align-items:center;gap:18px;margin:12px 0 10px;font:700 76px/1 Space Grotesk;display:flex}.case .nxn span{background:var(--nbrand);color:#fff;border-radius:50%;flex:0 0 58px;justify-content:center;align-items:center;width:58px;height:58px;font-size:28px;transition:transform .45s cubic-bezier(.3,1.4,.5,1);display:inline-flex}.case .nxcard:hover .nxn span{transform:translate(10px)rotate(-45deg)}.case .nxq{color:var(--nmut);max-width:380px;font:500 16px/1.6 Anuphan}.case .nxbar{background:color-mix(in srgb, var(--nfg) 15%, transparent);border-radius:3px;width:200px;height:3px;margin-top:22px;overflow:hidden}.case .nxbar i{background:var(--nbrand);height:100%;display:block}.case .nxp{height:340px;position:relative;overflow:hidden}.case .nxp .bw{width:640px;transition:transform .7s cubic-bezier(.2,.8,.2,1);position:absolute;top:56px;left:4%;transform:rotate(-3deg)}.case .nxp .bw .scr img{clip-path:none}.case .nxcard:hover .nxp .bw{transform:rotate(0)translate(-16px,-18px)}.case .nxp .pp{gap:18px;display:flex;position:absolute;inset:30px 0 0 10%}.case .nxp .ph1{aspect-ratio:388/842;border:5px solid #0a1a1f;border-radius:24px;flex:0 0 170px;width:170px;transition:transform .7s cubic-bezier(.2,.8,.2,1),translate .7s cubic-bezier(.2,.8,.2,1);overflow:hidden;box-shadow:0 30px 60px -20px #000c}.case .nxcard:hover .nxp .ph1{translate:0 -16px}.case .nxp .appshot{width:100%;height:300px}.case .nxp .deskpop{height:auto}.case .nxfoot{justify-content:space-between;margin-top:20px;font:600 13px Anuphan;display:flex}.case .nxfoot a{color:var(--mut);border-radius:10px;padding:8px 12px;text-decoration:none;transition:all .2s}.case .nxfoot a:hover{color:var(--fg);background:#062a330d}:root[data-theme=dark] .case .nums,:root[data-theme=dark] .case .story,:root[data-theme=dark] .case .nx2{--acc:#38bdf8}:root[data-theme=dark] .case .nums{background:#0b1d30;border-bottom-color:#ffffff14}:root[data-theme=dark] .case .nums>div{border-right-color:#ffffff14}:root[data-theme=dark] .case .step{border-left-color:#ffffff1f}:root[data-theme=dark] .case .story.js .step.on{border-left-color:var(--acc)}:root[data-theme=dark] .case .nxcard{box-shadow:0 30px 70px -30px #000c,0 0 0 1px #ffffff14}:root[data-theme=dark] .case .nxfoot a:hover{background:#ffffff12}@media (width<=820px){.case .hero,.case .nums,.case .story,.case .arch,.case .nx2{padding-left:16px;padding-right:16px}.case .hero{min-height:0}.case .hero h1{font-size:64px}.case .hero .tag{font-size:19px}.case .intro{padding:0 4px}.case .visit{flex-wrap:wrap;max-width:100%}.case .visit .u{padding:12px 18px}.case .visit .g{flex:1}.case .laptop,.case .phs,.case .studio .bw{zoom:.55}.case .studio{height:300px}.case .win2,.case .win3{display:none}.case .studio .appshot{height:300px}.case .deskpop .desk{height:420px}.case .deskpop .mb .mi,.case .deskpop .mb .clk,.case .deskpop .mb b{display:none}.case .deskpop .pov{width:260px;right:50%}.case .nums{grid-template-columns:1fr 1fr}.case .nums>div{padding:18px 16px}.case .nums b{font-size:34px}.case .story{grid-template-columns:1fr;gap:0}.case .story .stk{height:auto;padding:36px 0 0;position:relative;top:auto}.case .story .phs{zoom:1;height:300px}.case .story .appshot{height:auto}.case .story .deskpop .desk{height:360px}.case .story .steps{padding:30px 0 50px}.case .step{min-height:0;margin-bottom:28px}.case .step h3{font-size:26px}.case .arch h2{font-size:30px}.case .iso,.case .vault{grid-template-columns:1fr}.case .flowd{overflow-x:auto}.case .flowd svg{min-width:600px}.case .flowd .steps{grid-template-columns:1fr 1fr}.case .nxcard{grid-template-columns:1fr;min-height:0;padding:32px 0 0 24px}.case .nxn{font-size:52px}.case .nxp{height:220px}.case .nxp .bw{zoom:.55}.case .fxt .tc:nth-child(n+3){display:none}.case .fxt .tc:nth-child(2){left:52%!important}}@media (prefers-reduced-motion:reduce){.case *,.case :before,.case :after{animation:none!important}.case .studio,.case .scr img,.case .ph img,.case .iso .lv,.case .visit,.case .nxcard,.case .nxp .bw,.case .nxp .ph1,.case .tech,.case .visit .g i b{transition:none}.case .fx .mover{display:none}}
