.case-shell{--hero-fg:#fff2d7;--hero-muted:#fff2d7c7;--hero-border:#fff2d747;color:var(--jl-ink);font-family:Inter,sans-serif}.case-shell[data-tone=ink]{--hero-fg:var(--jl-ink);--hero-muted:var(--jl-muted-ink);--hero-border:rgb(var(--jl-ink-rgb) / .2)}.case-shell main{overflow:clip}.case-hero{isolation:isolate;background:radial-gradient(ellipse at 77% 40%, color-mix(in srgb, var(--case-accent) 28%, transparent), transparent 54%), var(--case-base);min-height:min(850px,100svh - 76px);color:var(--hero-fg);border-bottom:7px solid var(--case-accent);grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);padding:clamp(60px,8vw,120px) clamp(24px,7.4vw,116px) 70px;display:grid;position:relative;overflow:hidden}.case-hero:before{z-index:-1;background:linear-gradient(90deg, var(--case-base), transparent 66%);content:"";pointer-events:none;position:absolute;inset:0}.case-hero:after{z-index:-1;aspect-ratio:1;border:1px solid var(--hero-border);content:"";pointer-events:none;border-radius:50%;width:min(75vw,900px);position:absolute;bottom:-45%;right:-13%;box-shadow:0 0 0 100px #ffffff06,0 0 0 205px #ffffff05}.case-headline{z-index:2;grid-area:1/1;align-self:center;max-width:760px;padding-block:50px;position:relative}.case-headline:before{background:var(--case-accent);content:"";width:54px;height:4px;margin-bottom:30px;display:block}.case-collection{color:var(--hero-fg);letter-spacing:.15em;text-transform:uppercase;margin-bottom:22px;font:700 .73rem/1.4 Inter,sans-serif}.case-headline h1{letter-spacing:-.025em;overflow-wrap:anywhere;text-transform:uppercase;text-wrap:balance;font:400 clamp(4rem,7vw,8rem)/.98 Anton,Impact,sans-serif}.case-lead{max-width:54ch;color:var(--hero-muted);margin-top:26px;font:400 clamp(1rem,1.3vw,1.2rem)/1.7 Inter,sans-serif}.case-core{flex-wrap:wrap;gap:8px;margin-top:26px;list-style:none;display:flex}.case-core li{border:1px solid var(--hero-border);color:var(--hero-fg);letter-spacing:.07em;text-transform:uppercase;border-radius:3px;padding:8px 10px;font:700 .62rem/1 Inter,sans-serif}.case-actions{flex-wrap:wrap;gap:10px;margin-top:32px;display:flex}.case-actions a{border:1px solid var(--hero-border);min-height:46px;color:var(--hero-fg);letter-spacing:.09em;text-transform:uppercase;border-radius:3px;justify-content:center;align-items:center;gap:12px;padding:0 17px;font:700 .67rem/1.2 Inter,sans-serif;text-decoration:none;transition:transform .18s,background-color .18s;display:inline-flex}.case-actions a:hover{background:#ffffff1f;transform:translateY(-2px)}.case-actions .action-primary{border-color:var(--case-accent);background:var(--case-accent);color:var(--case-accent-fg)}.case-art{z-index:1;pointer-events:none;grid-area:1/2;align-self:stretch;min-width:0;min-height:620px;position:relative}.case-product{z-index:0;aspect-ratio:1.55;border:1px solid var(--hero-border);background:var(--case-base);opacity:.55;border-radius:9px;width:min(98%,650px);position:absolute;top:16%;right:-4%;overflow:hidden;transform:rotate(-7deg);box-shadow:0 26px 70px #00000038}.case-product img{object-fit:cover;width:100%;height:100%}.case-shell[data-tone=ink] .case-product{border-color:rgb(var(--jl-ink-rgb) / .16);opacity:.8}.case-shell[data-project=formarpro] .case-product,.case-shell[data-project=gym-vancouver] .case-product{transform:rotate(5deg)}.case-shell[data-project=developer-os] .case-product,.case-shell[data-project=interest-pulse] .case-product{transform:rotate(-3deg)}.case-art .case-character{z-index:1;object-fit:contain;object-position:bottom center;filter:drop-shadow(0 22px 45px #00000026);width:min(100%,650px);height:calc(100% + 90px);position:absolute;bottom:-70px;right:-8%}.case-number{z-index:0;color:var(--hero-fg);opacity:.1;pointer-events:none;font:400 clamp(13rem,28vw,30rem)/1 Anton,Impact,sans-serif;position:absolute;bottom:-.18em;right:clamp(24px,7.4vw,116px)}.case-rail{background:#fff1d0;padding:0 clamp(24px,7.4vw,116px)}.case-rail ul{flex-wrap:wrap;justify-content:center;gap:14px clamp(18px,2vw,30px);width:min(100%,1450px);margin-inline:auto;padding:24px 0;list-style:none;display:flex}.case-rail a{color:var(--jl-ink);letter-spacing:.1em;text-transform:uppercase;white-space:nowrap;font:700 .66rem/1 Inter,sans-serif;text-decoration:none}.case-rail a:hover{color:var(--case-accent)}.case-section{color:var(--jl-ink);background:#fff5df;padding:clamp(72px,8vw,118px) clamp(24px,7.4vw,116px)}.case-section:nth-of-type(2n){background:#ffedcd}.case-section>*,.case-section .split{max-width:1450px;margin-inline:auto}.case-section h2{text-transform:uppercase;text-wrap:balance;font:400 clamp(3.1rem,5vw,5.6rem)/1 Anton,Impact,sans-serif}.case-section h3{text-transform:uppercase;font:400 clamp(1.7rem,2.7vw,2.6rem)/1.1 Anton,Impact,sans-serif}.case-section .lede,.case-section .section-note{max-width:64ch;color:var(--jl-muted-ink);margin-top:22px;font:400 clamp(1rem,1.25vw,1.18rem)/1.75 Inter,sans-serif}.case-section .split{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);align-items:center;gap:clamp(34px,5vw,76px);display:grid}.case-section .split.wide-first{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr)}.case-section .jl-panel{min-width:0}.case-block{border-left:3px solid var(--case-accent);padding-left:clamp(20px,3vw,42px)}.case-visual figure{margin:0}.case-visual .frame{border-radius:8px;overflow:hidden;box-shadow:0 22px 65px #00000024}.case-visual img{width:100%;height:auto}.case-visual figcaption{color:var(--jl-muted-ink);margin-top:12px;font:500 .75rem/1.5 Inter,sans-serif}.decisions ol{color:var(--jl-muted-ink);gap:18px;margin-top:24px;padding-left:24px;line-height:1.65;display:grid}.section-head{justify-content:space-between;align-items:end;gap:30px;margin-bottom:36px;display:flex}.section-head .section-note{max-width:40ch;margin:0}.architecture-flow,.module-list,.transformation-list,.technology-list,.repos,.counts{list-style:none}.architecture-flow,.module-list{grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:12px;display:grid}.architecture-flow li,.module-list li{border:1px solid rgb(var(--jl-ink-rgb) / .14);background:#ffffff7a;border-radius:6px;min-width:0;padding:24px}.architecture-flow .marks,.technology-list svg{width:26px;height:26px;fill:var(--case-accent);display:flex}.architecture-flow .node-copy,.module-list li{flex-direction:column;gap:9px;display:flex}.architecture-flow .node-copy{margin-top:24px}.architecture-flow .node-number,.architecture-flow .node-layer,.module-list li>span{color:var(--jl-red);letter-spacing:.1em;text-transform:uppercase;font:700 .68rem/1.3 Inter,sans-serif}.architecture-flow strong,.module-list strong{font-size:1.05rem}.architecture-flow p,.module-list p{color:var(--jl-muted-ink);font-size:.9rem;line-height:1.6}.transformation-list{gap:12px;display:grid}.transformation-list li{border:1px solid rgb(var(--jl-ink-rgb) / .14);background:#ffffff7a;border-radius:6px;grid-template-columns:1fr auto 1fr;align-items:center;gap:20px;padding:25px;display:grid}.transformation-list p{margin-top:8px;line-height:1.6}.transformation-list .jl-kicker{color:var(--jl-red);letter-spacing:.1em;text-transform:uppercase;font-size:.69rem;font-weight:700}.change-arrow{color:var(--case-accent);font-size:1.8rem}.technology-list{flex-wrap:wrap;gap:9px;display:flex}.technology-list li{border:1px solid rgb(var(--jl-ink-rgb) / .18);background:#ffffff73;border-radius:4px;align-items:center;gap:9px;padding:10px 13px;font-size:.77rem;font-weight:700;display:inline-flex}.technology-list svg{width:18px;height:18px}.technology-list .monogram,.architecture-flow .monogram{color:var(--case-accent);font-weight:800}.toolkit-title{margin:36px 0 14px}.marks-note,.log-note,.confidential{color:var(--jl-muted-ink);margin-top:24px;font-size:.73rem;line-height:1.6}.screenshots-heading{margin-bottom:36px}.screenshots-heading>p{letter-spacing:.1em;text-transform:uppercase;margin-bottom:12px;font-size:.7rem;font-weight:700}.screenshot-group+.screenshot-group{margin-top:64px}.screenshot-group h3{margin-bottom:24px}.screenshot-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;display:grid}.screenshot-grid figure{min-width:0}.screenshot-grid img{border-radius:12px;width:100%;height:auto;box-shadow:0 18px 42px #0000001f}@media (width>=1100px){.screenshot-grid figure:nth-last-child(2):nth-child(4n+1){grid-column:2}}.log-band .figures{grid-template-columns:repeat(3,minmax(0,1fr));gap:15px;display:grid}.figure{border-top:2px solid var(--case-accent);background:#ffffff80;flex-direction:column;gap:8px;padding:25px;display:flex}.figure strong{font:400 clamp(2.5rem,4vw,4.5rem)/1 Anton,Impact,sans-serif}.figure span,.counts span{letter-spacing:.1em;text-transform:uppercase;font-size:.66rem;font-weight:700}.pulse{margin-top:40px}.sparkline{width:100%;height:100px;fill:rgb(var(--jl-red-rgb) / .24)}.sparkline rect[data-peak]{fill:var(--case-accent)}.pulse figcaption{color:var(--jl-muted-ink);justify-content:space-between;gap:15px;font-size:.7rem;display:flex}.log-detail{grid-template-columns:1fr 1fr;gap:30px;margin-top:42px;display:grid}.repos li{border-bottom:1px solid rgb(var(--jl-ink-rgb) / .14);flex-wrap:wrap;justify-content:space-between;gap:8px 15px;padding:13px 0;font-size:.75rem;display:flex}.counts{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:16px;display:grid}.counts li{flex-direction:column;gap:7px;display:flex}.counts strong{font:400 2rem/1 Anton,Impact,sans-serif}.case-section.outcome-band{background:var(--jl-red);color:#fff1d0}.case-section.outcome-band .lede,.case-section.outcome-band .confidential{color:#fff1d0cc}.outcome-band .case-actions a{color:#fff1d0;border-color:#fff1d059}.outcome-band .case-actions .action-primary{color:var(--case-accent-fg);border-color:var(--case-accent)}.case-more{background:#ffdfac;grid-template-columns:1fr auto 1fr;gap:20px;padding:34px clamp(24px,7.4vw,116px);display:grid}.more-link{min-width:0;color:var(--jl-ink);flex-direction:column;gap:9px;text-decoration:none;display:flex}.more-link span{letter-spacing:.1em;text-transform:uppercase;font-size:.68rem;font-weight:700}.more-link strong{overflow-wrap:anywhere;text-transform:uppercase;font:400 clamp(1.2rem,2vw,2rem)/1.1 Anton,Impact,sans-serif}.more-link.next{text-align:right}.case-shell a:focus-visible{outline:2px solid var(--case-accent);outline-offset:4px}@media (width<=800px){.case-hero{grid-template-columns:minmax(0,1fr);min-height:0;padding:55px 24px 0}.case-headline{grid-area:1/1;padding:20px 0 0}.case-headline h1{font-size:clamp(3.6rem,11vw,5.6rem)}.case-art{grid-area:2/1;height:clamp(420px,65vw,620px);min-height:0}.case-art .case-character{width:min(100%,580px);height:100%;bottom:0;right:50%;transform:translate(50%)}.case-number{opacity:.75;font-size:1.35rem;top:20px;bottom:auto;right:24px}.case-product{opacity:.35;width:82%;top:9%;right:4%}.case-shell[data-tone=ink] .case-product{opacity:.5}.screenshot-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.case-section .split,.case-section .split.wide-first,.log-detail{grid-template-columns:minmax(0,1fr)}.section-head{flex-direction:column;align-items:start}}@media (width<=550px){.case-headline h1{font-size:clamp(3.1rem,12vw,4.6rem)}.case-lead{font-size:.96rem}.case-core li{font-size:.55rem}.case-art{height:410px}.screenshot-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.case-section{padding:70px 24px}.case-section h2{font-size:clamp(2.8rem,11vw,4rem)}.transformation-list li{grid-template-columns:minmax(0,1fr)}.change-arrow{transform:rotate(90deg)}.log-band .figures{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.figure{padding:16px 10px}.figure strong{font-size:2rem}.pulse figcaption{flex-wrap:wrap}.case-more{grid-template-columns:1fr 1fr}.case-more .home{grid-area:2/1/auto/-1}}@media (prefers-reduced-motion:reduce){.case-actions a{transition:none}}
