/* Isolated Stats section. The single blue tile is an intentional palette exception. */
.j-site .jb-section{padding:76px var(--j-pad) 60px;background:#eeeef0;color:#171717;scroll-margin-top:90px}
.jb-heading{display:grid;grid-template-columns:1fr 2fr 1fr;align-items:end;gap:24px;margin-bottom:32px}.jb-kicker{align-self:start;display:flex;align-items:center;gap:12px}.jb-kicker .j-mark{width:22px;height:22px;background:#171717}.jb-meta,.jb-kicker,.jb-footnote{font:9px/1.5 'Courier New',monospace;letter-spacing:.035em}
.j-site .jb-heading h2{font-size:clamp(42px,5.2vw,80px);line-height:.96;font-weight:500;letter-spacing:-.06em;margin:0}.jb-heading h2>span{color:#707074}.j-site .jb-heading>p{font-size:13px;line-height:1.55;margin:0 0 3px;letter-spacing:-.02em}
.jb-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));grid-template-rows:repeat(3,224px);grid-template-areas:'system system system system system interface interface interface interface interface identity identity' 'services services services services process process process process process process identity identity' 'services services services services stack stack stack location location location identity identity';gap:10px}
.jb-tile{min-width:0;position:relative;overflow:hidden;margin:0;padding:26px;background:#fff;isolation:isolate}
.j-site .jb-tile h3{font-weight:500;letter-spacing:-.055em;line-height:1.05;margin:0}.j-site .jb-tile p{font-size:13px;line-height:1.5;letter-spacing:-.015em;margin:0}.jb-number-mask{display:block;overflow:hidden}.jb-number{display:block;font-weight:400;letter-spacing:-.085em;line-height:.9}
.jb-system{grid-area:system}.jb-system-main{display:flex;align-items:center;gap:25px;margin:16px 0 18px}.jb-system .jb-number{font-size:100px}.j-site .jb-system h3{font-size:36px}.jb-system-rule{display:flex;align-items:center;position:absolute;right:26px;bottom:28px;width:90px}.jb-system-rule i{width:7px;height:7px;background:#171717}.jb-system-rule span{height:1px;background:#777;flex:1}.j-site .jb-system p{font-size:12px;color:#59595f}
.jb-interface{grid-area:interface;padding:0;background:#d5d5d8}.jb-interface img{width:100%;height:100%;object-fit:cover;object-position:50% 60%;display:block;transform:scale(1.02);transition:transform .65s cubic-bezier(.2,.7,.2,1)}.jb-interface figcaption{position:absolute;left:0;bottom:0;right:0;padding:13px 20px;background:#fff;display:grid;grid-template-columns:1fr auto;gap:3px;color:#171717}.jb-interface figcaption>span:nth-child(2){grid-row:1/3;grid-column:2;font-size:17px;letter-spacing:-.04em;align-self:center}.jb-interface figcaption>.jb-meta{font-size:7px}.jb-image-index{position:absolute;top:16px;right:16px;background:#171717;color:#fff;font:9px/1 monospace;padding:8px}
.jb-services{grid-area:services;background:#1500ff;color:#fff;display:flex;flex-direction:column}.jb-services-top{display:flex;justify-content:space-between}.jb-services .jb-number-mask{margin:14px 0 8px}.jb-services .jb-number{font-size:clamp(140px,15vw,236px)}.j-site .jb-services h3{font-size:clamp(35px,3.6vw,58px);line-height:.93}.jb-services ul{list-style:none;padding:14px 0 0;margin:auto 0 0;border-top:1px solid #ffffff66;display:grid;grid-template-columns:1fr 1fr;gap:5px 12px;font-size:10px;line-height:1.5}
.jb-process{grid-area:process;background:#dadade;display:grid;grid-template-columns:1fr 1.12fr;gap:20px}.j-site .jb-process h3{font-size:36px;margin:23px 0 15px}.jb-process h3>span{color:#65656b}.j-site .jb-process p{font-size:11px}.jb-study{position:relative;min-width:0;height:155px;align-self:center}.jb-layout-study{position:absolute;top:-5px;left:0;width:64%;height:115px;padding:12px;border:1px solid #9d9da3;background:#f7f7f8;transform:rotate(-5deg)}.jb-layout-study>span,.jb-code-study>span{font:6px/1 monospace;display:block}.jb-study-lines{margin-top:13px}.jb-study-lines i{display:block;width:68%;height:5px;background:#44444a;margin-bottom:4px}.jb-study-lines i+i{width:45%}.jb-study-blocks{display:flex;gap:5px;margin-top:10px}.jb-study-blocks>i{flex:1;height:30px;border:1px solid #a0a0a7}.jb-study-baseline{margin-top:9px;height:1px;background:#a0a0a7}.jb-code-study{position:absolute;right:0;bottom:0;width:78%;padding:12px;background:#242427;color:white;transform:rotate(3deg)}.jb-code-study code{display:block;margin-top:12px;font:8px/1.6 monospace;color:#dedee3;white-space:nowrap}.jb-study-arrow{position:absolute;right:4px;top:0;font-size:26px}.jb-study-caption{position:absolute;bottom:12px;right:26px;font-size:6px;color:#55555b}
.jb-stack{grid-area:stack;background:#202023;color:#fff}.jb-stack>.jb-meta{color:#c2c2c7;font-size:8px}.j-site .jb-stack h3{font-size:clamp(20px,2vw,32px);display:flex;flex-direction:column;margin:20px 0 0}.jb-stack-plus{font-size:26px;line-height:1;color:#96969c;margin:2px 0}.jb-stack-base{position:absolute;bottom:22px;left:26px;right:26px;display:flex;justify-content:space-between;align-items:center;border-top:1px solid #77777c;padding-top:10px}.jb-stack-base>span:last-child{font-size:23px;line-height:1}
.jb-location{grid-area:location;background:#c8c8ce}.jb-location>.jb-meta{display:block;font-size:7px;max-width:145px}.j-site .jb-location h3{font-size:clamp(25px,2.5vw,40px);margin-top:20px}.jb-location h3>span:first-child{margin-left:12px}.jb-location h3>span:last-child{display:block;font-size:.66em;margin-top:8px;letter-spacing:-.045em}.jb-location-bottom{position:absolute;bottom:26px;left:26px;right:26px;display:flex;gap:8px;align-items:center;justify-content:space-between}.jb-location-bottom>.jb-meta{font-size:7px}.jb-location-point{width:9px;height:9px;background:#171717;border-radius:50%;flex-shrink:0}
.jb-identity{grid-area:identity;background:#171717;color:#fff;padding:24px 20px;display:flex;flex-direction:column}.jb-identity>.jb-meta{font-size:8px;color:#c2c2c7}.jb-identity img{position:absolute;width:170%;max-width:none;height:auto;left:-30%;top:48px;transform:rotate(-18deg);transition:transform .65s ease;z-index:-1}.j-site .jb-identity h3{writing-mode:vertical-rl;transform:rotate(180deg);font-size:clamp(50px,5.7vw,90px);line-height:1;letter-spacing:-.07em;margin: auto 0 18px;align-self:start}.jb-identity-bottom{display:flex;flex-direction:column;gap:22px;border-top:1px solid #636367;padding-top:15px}.jb-identity-bottom .jb-meta{font-size:7px;color:#c2c2c7}.jb-identity-bottom>.jb-meta:last-child{font-size:6px}
.jb-footnote{display:flex;justify-content:space-between;gap:20px;padding-top:18px;color:#616168;font-size:8px}
/* Finite, independently triggered reveal. Static content remains the default. */
@media(prefers-reduced-motion:no-preference){.jb-tile[data-jb-reveal]{opacity:0;transform:translateY(16px);transition:opacity .65s ease var(--jb-delay,0ms),transform .75s cubic-bezier(.2,.7,.2,1) var(--jb-delay,0ms)}.jb-tile[data-jb-reveal].is-visible{opacity:1;transform:none}.jb-tile[data-jb-reveal] .jb-number{transform:translateY(105%);transition:transform .9s cubic-bezier(.2,.7,.2,1) var(--jb-delay,0ms)}.jb-tile[data-jb-reveal].is-visible .jb-number{transform:none}}
@media(hover:hover) and (prefers-reduced-motion:no-preference){.jb-interface:hover img{transform:scale(1.05)}.jb-identity:hover img{transform:rotate(-15deg) scale(1.025)}}
@media(min-width:1700px){.jb-grid{grid-template-rows:repeat(3,255px)}.jb-system .jb-number{font-size:120px}.j-site .jb-system h3{font-size:43px}.jb-services .jb-number{font-size:255px}.jb-services ul{font-size:12px}.j-site .jb-process h3{font-size:44px}.jb-study{height:175px}.jb-code-study code{font-size:10px}}
@media(max-width:1100px) and (min-width:701px){.jb-heading{grid-template-columns:1fr 2fr}.jb-heading>p{display:none}.jb-grid{grid-template-columns:repeat(6,minmax(0,1fr));grid-template-rows:210px 240px 210px;grid-template-areas:'system system system interface interface interface' 'services services process process identity identity' 'services services stack stack location location'}.jb-tile{padding:20px}.jb-interface{padding:0}.jb-services .jb-number{font-size:clamp(100px,15vw,170px);margin-top:10px}.jb-services ul{grid-template-columns:1fr;font-size:10px}.jb-process{display:block}.j-site .jb-process h3{font-size:28px;margin:12px 0}.jb-study{position:absolute;width:45%;height:120px;right:10px;bottom:25px}.jb-process-copy{position:relative;z-index:1}.j-site .jb-process p{max-width:95px;font-size:10px}.jb-layout-study{width:80%;left:-10px}.jb-code-study{width:100%;padding:8px}.jb-code-study code{font-size:6px}.jb-study-caption{right:12px;font-size:5px}.jb-identity img{width:90%;left:45%;top:15px}.j-site .jb-identity h3{writing-mode:horizontal-tb;transform:none;font-size:38px;margin:65px 0 auto}.jb-identity-bottom{border:0;padding:0;gap:5px}.jb-identity-bottom>.jb-meta:first-child{display:none}.jb-system-main{gap:18px}.j-site .jb-system h3{font-size:30px}.jb-system-rule{display:none}.jb-interface figcaption{display:block}.jb-interface figcaption>span{display:block}.jb-interface figcaption>.jb-meta:last-child{display:none}.jb-stack-base,.jb-location-bottom{left:20px;right:20px}.j-site .jb-stack h3{font-size:27px}}
@media(max-width:700px){.j-site .jb-section{padding:50px var(--j-pad) 36px}.jb-heading{grid-template-columns:1fr;gap:20px;margin-bottom:24px}.jb-kicker{font-size:9px}.j-site .jb-heading h2{font-size:clamp(43px,11vw,70px)}.j-site .jb-heading>p{font-size:12px}.jb-heading>p br{display:none}.jb-grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:200px 195px 195px 215px 220px 210px;grid-template-areas:'system system' 'services identity' 'services identity' 'interface interface' 'process process' 'stack location';gap:8px}.jb-tile{padding:18px}.jb-interface{padding:0}.jb-system-main{margin:13px 0 12px;gap:25px}.jb-system .jb-number{font-size:88px}.j-site .jb-system h3{font-size:34px}.jb-system-rule{right:18px;bottom:22px;width:45px}.j-site .jb-system p{font-size:11px}.jb-services-top>.jb-meta:last-child{display:none}.jb-services .jb-number{font-size:clamp(94px,26vw,168px);margin-top:12px}.j-site .jb-services h3{font-size:clamp(26px,6.8vw,42px);line-height:.96}.jb-services ul{grid-template-columns:1fr;font-size:9px;gap:6px;padding-top:14px}.jb-services .jb-meta{font-size:8px}.jb-identity>.jb-meta{font-size:7px}.jb-identity img{top:25px;width:180%;left:-40%}.j-site .jb-identity h3{font-size:56px;margin:auto 0 15px}.jb-identity-bottom{gap:8px;padding-top:10px}.jb-identity-bottom>.jb-meta:first-child{display:none}.jb-identity-bottom>.jb-meta:last-child{font-size:6px}.jb-interface figcaption{padding:12px 14px}.jb-interface figcaption>span:nth-child(2){font-size:15px}.jb-interface figcaption>.jb-meta{font-size:6px}.jb-process{grid-template-columns:1fr 1fr;gap:10px}.j-site .jb-process h3{font-size:30px;margin:28px 0 17px}.jb-process .jb-meta{font-size:7px}.j-site .jb-process p{font-size:10px;max-width:95px}.jb-study{height:150px}.jb-code-study{width:108%;padding:9px;right:0}.jb-code-study code{font-size:6px}.jb-layout-study{width:85%;left:0;padding:9px;height:100px}.jb-study-blocks>i{height:24px}.jb-study-arrow{font-size:22px}.jb-process .jb-study-caption{font-size:5px;right:18px;bottom:12px}.jb-stack>.jb-meta{font-size:6px}.j-site .jb-stack h3{font-size:clamp(17px,4.6vw,28px);margin-top:26px}.jb-stack-base{left:18px;right:18px;bottom:18px}.jb-stack-base>.jb-meta{font-size:7px}.jb-location>.jb-meta{font-size:6px}.j-site .jb-location h3{font-size:28px;margin-top:32px}.jb-location h3>span:first-child{margin-left:4px;font-size:24px}.jb-location h3>span:last-child{font-size:15px;letter-spacing:-.04em}.jb-location-bottom{left:18px;right:18px;bottom:18px;align-items:end}.jb-location-bottom>.jb-meta{font-size:6px;max-width:76px}.jb-location-point{width:7px;height:7px}.jb-footnote{font-size:6px;gap:12px}.jb-footnote>span:last-child{text-align:right}}
@media(max-width:380px){.j-site .jb-services h3{font-size:22px}.jb-services,.jb-identity{padding:14px}.j-site .jb-identity h3{font-size:48px;line-height:1.2}.jb-services ul{font-size:8px}}
@media(max-width:700px){.jb-grid{grid-template-rows:390px 345px 410px 275px 240px}.jb-process a{bottom:12px}}
@media(max-width:700px){.jb-delivery-copy{width:56%}.jb-location h3>span{margin-left:.16em}.jb-location-arrow{display:none}}
@media(max-width:360px){.j-site .jb-delivery h3{font-size:28px}}
/* Give the portrait film a full-height feature tile, not a thumbnail. */
@media(min-width:1101px){
 .jb-grid{grid-template-areas:'overview overview identity services' 'pencil delivery motion services' 'pencil process motion location'}
 .jb-delivery{padding:26px}
 .jb-delivery-copy{width:100%}
 .j-site .jb-delivery h3{font-size:32px;margin:20px 0 16px}
 .j-site .jb-delivery p{max-width:55%;font-size:11px}
 .jb-delivery img{width:49%;height:65%;top:auto;bottom:-10px;right:-3%;object-position:bottom}
}
@media(min-width:701px) and (max-width:1100px){
 .jb-grid{grid-template-areas:'overview overview identity' 'pencil delivery delivery' 'motion services services' 'motion process location'}
}
@media(max-width:700px){
 .jb-grid{grid-template-rows:390px 365px 410px 320px auto 260px 210px;grid-template-areas:'overview overview' 'identity pencil' 'services services' 'delivery delivery' 'motion motion' 'process process' 'location location'}
 .jb-motion{aspect-ratio:1872/3344}
 .jb-motion-copy{padding:28px}
 .j-site .jb-motion h3{font-size:38px}
 .jb-motion-signature{left:28px;bottom:28px;font-size:70px}
 .jb-process-number>strong{font-size:65px}
 .jb-process-number>span{font-size:23px}
 .jb-process img{width:100px;height:125px;right:18px;bottom:40px}
 .j-site .jb-process p{font-size:12px;max-width:180px}
}
@media(prefers-reduced-motion:reduce){.jb-tile,.jb-tile *{transition:none!important;animation:none!important}}