/* JMS 3D Pro: the same system as jms2d_overview.css, dark-first. */
.j2-pro{background:#0b0b0d;color:#f5f5f7}
.j2-pro .j2-scene{background:#0b0b0d;color:#f5f5f7}
.j2-pro .j2-scene.j2-light{background:#fff;color:#1d1d1f}
.j2-pro .j2-scene.j2-tint{background:#f5f5f7;color:#1d1d1f}
.j2-pro .j2-scene.j2-deep{background:#000}
.j2-pro .j2-scene:not(.j2-light):not(.j2-tint) .j2-sub,.j2-pro .j2-scene:not(.j2-light):not(.j2-tint) .j2-cap{color:#a1a1a6}
.j2-pro .j2-scene:not(.j2-light):not(.j2-tint) a{color:#d69ccd}
.j2-pro .j2-scene:not(.j2-light):not(.j2-tint) .j2-big>div,.j2-pro .j2-scene:not(.j2-light):not(.j2-tint) .j2-big>div:last-child{border-color:rgba(245,245,247,.16)}
.j2-pro .j2-scene:not(.j2-light):not(.j2-tint) .j2-big p,.j2-pro .j2-scene:not(.j2-light):not(.j2-tint) .j2-feats p,.j2-pro .j2-scene:not(.j2-light):not(.j2-tint) .j2-cols p{color:#a1a1a6}
.j2-pro .j2-scene:not(.j2-light):not(.j2-tint) .j2-feats>div{border-color:rgba(245,245,247,.16)}
.j2-pro .j2-num{color:#c983bf}
.j2-pro .j2-scene:not(.j2-light):not(.j2-tint) .j2-cols h3{color:#f5f5f7}
.j2-pro .j2-lnav-dark,.j2-pro.j2-lnav-dark{background:rgba(11,11,13,.82);border-bottom-color:#26262b}
.j2-pro .j2-lnav-dark .j2-name,.j2-pro .j2-lnav-dark nav a,.j2-pro.j2-lnav-dark .j2-name,.j2-pro.j2-lnav-dark nav a{color:#f5f5f7}
.j2-pro .j2-lnav-dark nav a:hover,.j2-pro.j2-lnav-dark nav a:hover{color:#d69ccd}

/* hero: the screen explodes and reassembles */
.jp-hero{position:relative;overflow:hidden;background:#07050c;color:#f5f5f7;padding:clamp(56px,8vh,96px) 0 clamp(40px,5vw,72px)}
.jp-hero::before{content:"";position:absolute;inset:0;background:radial-gradient(55% 45% at 50% 62%,rgba(119,33,108,.5),transparent 70%);pointer-events:none}
.jp-hero-copy{position:relative;z-index:2;text-align:center}
.jp-hero .j2-name{font-size:1.05rem;font-weight:600;color:#c983bf;margin-bottom:.7rem}
.jp-hero h1{font-size:clamp(2.8rem,7vw,5.6rem);line-height:.98;font-weight:700!important;color:#fff;letter-spacing:-.03em;margin:0 auto;max-width:14ch}
.jp-hero .j2-sub{margin:1.2rem auto 1.5rem;color:#c9c9ce;max-width:38ch;font-size:clamp(1.05rem,1.5vw,1.35rem)}
.jp-hero .j2-links{justify-content:center}
.jp-hero .j2-links a{color:#d69ccd}
.jp-stage{position:relative;z-index:1;height:clamp(300px,42vw,620px);margin-top:clamp(28px,4vw,56px)}
.jp-stage img{position:absolute;left:50%;top:50%;height:100%;width:auto;max-width:none;transform:translate(-50%,-50%);filter:drop-shadow(0 30px 60px rgba(0,0,0,.6));will-change:opacity,transform}
.jp-stage .jp-exploded{opacity:0;transform:translate(-50%,-50%) scale(1.06)}
.jp-stage .jp-whole{opacity:1}
/* the screen loads whole and comes apart as you scroll (see the page script) */
}
.jp-stage-cap{position:relative;z-index:2;text-align:center;font-size:.85rem;color:#a1a1a6;margin:1rem 0 0}
@media (max-width:760px){.jp-stage{height:auto;aspect-ratio:1121/789;max-width:560px;margin-inline:auto}.jp-stage img{height:auto;width:100%;max-width:100%}.jp-stage .jp-whole{width:84%}}

/* renders gallery: dark cards */
.j2-pro .j2-card{background:#151518;color:#f5f5f7;box-shadow:none;border:1px solid #232327}
.j2-pro .j2-card-sub{color:#a1a1a6}
.j2-pro .j2-card-name{color:#c983bf}
.j2-pro .j2-gal-dots{background:rgba(255,255,255,.08)}
.j2-pro .j2-gal-dots button{background:rgba(255,255,255,.35)}
.j2-pro .j2-gal-dots button[aria-selected="true"]{background:rgba(255,255,255,.75)}
.j2-pro .j2-gal-play{background:rgba(255,255,255,.08);color:#f5f5f7}
.j2-pro .j2-card-fig img{filter:drop-shadow(0 16px 30px rgba(0,0,0,.5))}

/* two-up: image beside copy */
.jp-two{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,4vw,64px);align-items:center;margin-top:clamp(36px,5vw,64px)}
.jp-two+.jp-two{margin-top:clamp(56px,8vw,112px)}
.jp-two.jp-flip>.jp-fig{order:2}
.jp-fig{display:flex;align-items:center;justify-content:center;min-height:280px}
.jp-fig img{max-width:100%;max-height:min(520px,60vw);width:auto;height:auto;filter:drop-shadow(0 20px 40px rgba(0,0,0,.5))}
.jp-fig.jp-sheet img{filter:none;border-radius:12px;box-shadow:0 20px 50px rgba(0,0,0,.45)}
.jp-copy h3{font-size:clamp(1.6rem,3vw,2.4rem);line-height:1.1;letter-spacing:-.02em;font-weight:700!important;margin-bottom:.8rem}
.jp-copy p{color:#a1a1a6;font-size:1.05rem;line-height:1.5;margin:0 0 .8rem;max-width:44ch}
.jp-copy .j2-kicker{color:#c983bf;font-weight:600;font-size:.95rem;margin:0 0 .5rem}
@media (max-width:820px){.jp-two{grid-template-columns:1fr}.jp-two.jp-flip>.jp-fig{order:0}.jp-fig{min-height:0}.jp-copy p{max-width:none}}

/* machine scene */
.jp-machines{display:flex;flex-wrap:wrap;gap:.8rem 2rem;justify-content:center;margin:1.4rem 0 0;padding:0;list-style:none;color:#a1a1a6;font-size:.95rem}
.jp-machines li{display:flex;align-items:center;gap:.5rem}
.jp-machines li::before{content:"";width:6px;height:6px;border-radius:50%;background:#c983bf}
.jp-quote{max-width:760px;margin:clamp(36px,5vw,64px) auto 0;text-align:center}
.jp-quote blockquote{margin:0;font-size:clamp(1.15rem,1.9vw,1.5rem);line-height:1.4;font-weight:500;color:#f5f5f7}
.jp-quote figcaption{margin-top:1rem;color:#a1a1a6;font-size:.95rem}

/* comparison */
.jp-compare{display:table;margin:clamp(36px,5vw,64px) auto 0;max-width:900px;width:100%;border-collapse:collapse;border:0;font-size:1rem;background:transparent}
.jp-compare th,.jp-compare td{padding:.85rem .6rem;border:0;border-top:1px solid rgba(29,29,31,.14);text-align:center;vertical-align:middle;background:transparent}
.jp-compare td:not(:first-child){width:22%}
.jp-compare th{font-weight:600}
.jp-compare th:first-child,.jp-compare td:first-child{text-align:left;color:var(--j2-text-2,#6e6e73)}
.jp-compare thead th{border-top:0;border-bottom:2px solid rgba(29,29,31,.2);font-size:1.05rem;color:#1d1d1f}
.jp-compare tbody tr:last-child td{border-bottom:1px solid rgba(29,29,31,.14)}
.jp-compare td.y::before{content:"";display:inline-block;width:10px;height:6px;border-left:2.2px solid var(--j2-purple,#77216c);border-bottom:2.2px solid var(--j2-purple,#77216c);transform:rotate(-45deg);margin-bottom:3px}
.jp-compare td.n{color:#b8b8bf}
.jp-compare td.n::before{content:"\2013"}
.jp-compare td small{display:block;color:#6e6e73;font-size:.8rem;margin-top:.15rem}
.jp-compare-note{text-align:center;color:#6e6e73;font-size:.9rem;margin:1.2rem auto 0;max-width:60ch}
@media (max-width:560px){.jp-compare{font-size:.9rem}.jp-compare th,.jp-compare td{padding:.7rem .3rem}}

/* specs on dark */
.j2-pro .j2-spec{background:#151518;border:1px solid #232327;color:#f5f5f7}
.j2-pro .j2-spec dt{color:#a1a1a6}.j2-pro .j2-spec dd{color:#f5f5f7}
.j2-pro .j2-spec dt,.j2-pro .j2-spec dd{border-color:rgba(245,245,247,.12)}
.j2-pro .j2-spec-notes{color:#a1a1a6}
.j2-pro .j2-specs.jp-three{grid-template-columns:repeat(3,1fr)}
@media (max-width:900px){.j2-pro .j2-specs.jp-three{grid-template-columns:1fr}}

/* cloud grid on light */
.j2-pro .j2-scene.j2-light .j2-feats>div{border-color:rgba(29,29,31,.16)}
.j2-pro .j2-scene.j2-light .j2-feats p{color:#6e6e73}
.jp-cloud-link{display:inline-block;margin-top:clamp(24px,3vw,40px);font-weight:500}
.jp-cloud-link::after{content:" \203A"}