.jigsaw-case{--jd-paper:#f4f1e9;--jd-ink:#191b21;--jd-navy:#26263b;--jd-gold:#ffe032;background:var(--jd-paper);color:var(--jd-ink)}
.jigsaw-case h1,.jigsaw-case h2,.jigsaw-case h3{font-family:var(--display);font-weight:400}
.jigsaw-case img{height:auto}
.jigsaw-case figure{margin:0}.jd-shell{width:min(1480px,calc(100% - 80px));margin-inline:auto}.jd-kicker{font-size:11px;letter-spacing:.12em;text-transform:uppercase;line-height:1.5;margin:0}.jd-section{padding-block:clamp(85px,9vw,145px)}
.jd-hero{position:relative;overflow:hidden;background:#27273b;color:#f7f2e9}.jd-hero__meta{display:flex;justify-content:space-between;gap:20px;padding-block:26px;border-bottom:1px solid #ffffff26;font-size:11px;letter-spacing:.08em;text-transform:uppercase}.jd-hero__grid{display:grid;grid-template-columns:1fr 1fr;align-items:center;min-height:750px;gap:40px}.jd-hero__copy{padding-block:65px;position:relative;z-index:2}.jd-hero h1{font-size:clamp(68px,7.5vw,124px);line-height:.94;letter-spacing:-.03em;margin:27px 0 32px}.jd-hero__lead{font-size:18px;line-height:1.55;max-width:480px;color:#d1cedd;margin:0 0 34px}.jd-play-link{display:inline-flex;align-items:center;justify-content:space-between;gap:52px;background:var(--jd-gold);color:#202034;padding:17px 25px;border-radius:4px;font-size:16px;font-weight:500;text-decoration:none;transition:background .2s}.jd-play-link:hover{background:#ffeb7c}.jd-play-link:focus-visible{outline:3px solid #fff;outline-offset:5px}.jd-play-link span{font-size:24px;line-height:1}.jd-hero__art{position:relative;height:660px;isolation:isolate}.jd-hero__art:before{content:"";position:absolute;z-index:-1;inset:15% -30%;background:radial-gradient(ellipse,#69618370,transparent 65%)}.jd-hero__logo{position:relative;z-index:3;width:72%;max-width:430px;margin:0 auto -40px}.jd-hero__screens{height:480px;position:relative;margin-top:0}.jd-device{position:absolute;width:47%;height:100%;overflow:hidden;border:7px solid #11121a;border-radius:27px;background:#222335;box-shadow:0 25px 50px #0006}.jd-device img{width:100%;height:100%;object-fit:cover;object-position:top}.jd-device--back{left:2%;top:24px;transform:rotate(-10deg)}.jd-device--front{right:3%;transform:rotate(9deg)}.jd-hero__medal{position:absolute;z-index:4;bottom:7%;left:28%;width:34%;filter:drop-shadow(0 20px 18px #0007)}.jd-hero__bottom{display:flex;justify-content:space-between;border-top:1px solid #ffffff26;padding-block:23px;font-size:12px;color:#c0bccb}.jd-hero__bottom a{color:inherit;text-decoration:none}
.jd-index{display:grid;grid-template-columns:repeat(5,1fr);border-bottom:1px solid #191b212e;background:var(--jd-paper)}.jd-index a{display:flex;justify-content:space-between;gap:10px;align-items:center;padding:25px 30px;color:inherit;text-decoration:none;font-size:15px;border-right:1px solid #191b212e}.jd-index a:last-child{border:0}.jd-index span{font-size:10px;color:#787778}.jd-index a:is(:hover, :focus-visible){background:#e7e4df}
.jd-heading{display:grid;grid-template-columns:1fr 3fr;gap:45px;margin-bottom:65px}.jd-heading>.jd-kicker{padding-top:10px}.jd-heading h2{font-size:clamp(52px,6.4vw,96px);line-height:.96;letter-spacing:-.025em;margin:0 0 35px;text-wrap:balance}.jd-prose{max-width:760px;font-size:20px;line-height:1.5;margin:0}.jd-prose p{margin:0 0 22px}.jd-facts{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid #191b212e;border-bottom:1px solid #191b212e}.jd-facts>div{padding:28px 30px 35px;border-right:1px solid #191b212e}.jd-facts>div:first-child{padding-left:0}.jd-facts>div:last-child{border:0}.jd-facts span{display:block;font-size:12px;color:#69686b;margin-bottom:35px}.jd-facts strong{font:400 clamp(30px,3.3vw,48px)/1.03 var(--display)}
.jd-interface{background:#e1ddd7;padding-block:110px}.jd-screen-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(25px,5vw,90px);padding-inline:40px}.jd-screen-frame{background:#141520;padding:8px;border-radius:27px;box-shadow:0 20px 30px #27273321;overflow:hidden;aspect-ratio:780/1440}.jd-screen-frame img{width:100%;height:100%;object-fit:cover;object-position:top}.jd-screen-grid figcaption{font-size:14px;line-height:1.5;color:#535258;padding-top:25px}.jd-screen-grid figcaption span{display:block;color:#181921;font-size:11px;text-transform:uppercase;letter-spacing:.06em;margin-bottom:9px}
.jd-screen-frame{aspect-ratio:780/1235}
.jd-play{background:#f4f1e9}.jd-demo-note{max-width:900px;font-size:13px;line-height:1.6;color:#656269;margin:24px 0 0}.jd-loading{padding:70px 30px;border:1px solid #ccc7bd}
.jd-details{background:#26263b;color:#f3eff7}.jd-details .jd-prose{color:#c6c1d4}.jd-detail-grid{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid #ffffff30;border-left:1px solid #ffffff30}.jd-detail{border-right:1px solid #ffffff30;border-bottom:1px solid #ffffff30;padding:25px}.jd-detail>div{height:300px;display:flex;align-items:center;justify-content:center;gap:25px}.jd-detail figcaption{font-size:12px;color:#c6c1d4;padding-top:18px}.jd-detail--logo img{width:85%;max-width:400px}.jd-detail--reward img{height:78%;width:auto}.jd-detail--controls img{width:17%;height:auto;max-height:110px;object-fit:contain}.jd-detail--vector img{width:25%;height:190px;object-fit:contain}
.jd-flow__figure{background:#e6e6e6}.jd-flow__figure>a{display:block;padding:25px}.jd-flow__figure img{width:100%;height:auto}.jd-flow__figure figcaption{border-top:1px solid #191b212e;padding:22px;display:flex;justify-content:space-between;gap:20px;font-size:12px}.jd-flow__figure figcaption a{color:inherit;text-underline-offset:4px}.jd-next{display:flex;justify-content:space-between;align-items:center;gap:30px;border-top:1px solid #191b212e;padding-block:50px}.jd-next>a{color:inherit;text-decoration:none}.jd-next small{display:block;font-size:11px;margin-bottom:12px}.jd-next strong{font:400 clamp(36px,4vw,60px)/1 var(--display)}.jd-contact{background:#11121a}.jd-contact h2{font-size:clamp(52px,6vw,88px)}
@media(min-width:1600px){.jd-hero__grid{min-height:840px}.jd-hero__art{height:740px}.jd-hero__screens{height:540px}}
@media(max-width:1000px){.jd-shell{width:calc(100% - 48px)}.jd-hero__grid{gap:20px;min-height:650px}.jd-hero__art{height:540px}.jd-hero__screens{height:400px}.jd-hero h1{font-size:70px}.jd-hero__lead{font-size:16px}.jd-hero__logo{margin-bottom:-20px}.jd-heading{grid-template-columns:1fr 3fr;gap:25px}.jd-index a{padding:21px 18px;font-size:13px}.jd-screen-grid{padding-inline:0;gap:25px}.jd-screen-frame{border-radius:20px;padding:5px}.jd-detail>div{height:240px}.jd-prose{font-size:18px}}
@media(max-width:700px){.jd-shell{width:calc(100% - 36px)}.jd-hero__meta{font-size:9px;padding-block:22px;align-items:flex-start}.jd-hero__meta span{max-width:55%}.jd-hero__meta span:last-child{text-align:right}.jd-hero__grid{grid-template-columns:1fr;gap:0}.jd-hero__copy{padding-block:44px 30px}.jd-hero h1{font-size:clamp(58px,13vw,82px);margin-block:20px 24px}.jd-hero__lead{font-size:16px;max-width:480px}.jd-hero__art{width:min(460px,100%);margin-inline:auto;height:540px}.jd-hero__logo{width:67%;margin-bottom:-25px}.jd-hero__screens{height:385px;width:90%;margin:auto}.jd-hero__medal{bottom:8%;width:30%}.jd-device{border-width:5px;border-radius:21px}.jd-hero__bottom{font-size:10px}.jd-index{display:flex;overflow:auto}.jd-index a{min-width:max-content;gap:14px;padding:21px 18px}.jd-heading{grid-template-columns:1fr;gap:24px;margin-bottom:40px}.jd-heading h2{font-size:clamp(49px,12vw,72px);margin-bottom:25px}.jd-heading>.jd-kicker{padding:0}.jd-prose{font-size:17px}.jd-facts{grid-template-columns:1fr}.jd-facts>div,.jd-facts>div:first-child{padding:22px 0;display:grid;grid-template-columns:1fr 1.3fr;border-right:0;border-bottom:1px solid #191b212e;gap:15px}.jd-facts span{margin:5px 0 0}.jd-facts strong{font-size:32px}.jd-interface{padding-block:80px}.jd-screen-grid{grid-template-columns:1fr;gap:45px;max-width:330px}.jd-screen-grid figure{display:grid;grid-template-columns:1fr;gap:0}.jd-screen-frame{border-radius:23px}.jd-screen-grid figcaption{padding-top:20px}.jd-detail-grid{grid-template-columns:1fr}.jd-detail{padding:20px}.jd-detail>div{height:230px}.jd-detail figcaption{font-size:11px}.jd-flow__figure>a{padding:10px}.jd-flow__figure figcaption{flex-direction:column;padding:16px;gap:10px}.jd-next{padding-block:35px;gap:22px}.jd-next>a:first-child{font-size:13px}.jd-next strong{font-size:36px}.jd-contact h2{font-size:54px}}
@media(prefers-reduced-motion:reduce){.jigsaw-case *{scroll-behavior:auto!important;animation:none!important;transition:none!important}}
