:root{--work-blue:var(--blue);--work-cobalt:#3941ff;--work-deep:var(--navy);--work-white:var(--paper);--work-silver:var(--ice)}.work-top-frame{inset:var(--edge);box-shadow:0 0 0 100vmax var(--paper);z-index:90;pointer-events:none;border-radius:18px;position:fixed}@media (max-width:760px){.work-top-frame{border-radius:12px}}.work-page{background:var(--navy);color:var(--paper);min-height:100svh;margin:var(--edge);isolation:isolate;border-radius:18px;position:relative;overflow:clip}.work-page:before{content:"";pointer-events:none;background:var(--grain-image,none) 0 0 / 256px 256px repeat,radial-gradient(ellipse 64% 22% at 54% 0%,#2830a052,transparent 80%),radial-gradient(ellipse 46% 22% at 2% 70%,#151cfb1d,transparent 85%);opacity:.17;position:absolute;inset:0}.work-collection{display:flow-root;position:relative}.work-page>*{position:relative}.work-case{isolation:isolate;position:relative}.work-case>.case-shell{z-index:1;position:relative}.work-page>.work-cursor-trail,.work-case>.work-cursor-trail{inset:var(--edge);width:calc(100% - var(--edge) * 2);height:calc(100% - var(--edge) * 2);z-index:0;pointer-events:none;position:fixed}@media (hover:none),(pointer:coarse),(prefers-reduced-motion:reduce){.work-page>.work-cursor-trail,.work-case>.work-cursor-trail{display:none}}.work-page a:focus-visible,.work-page button:focus-visible{outline:3px solid var(--work-white);outline-offset:5px}.work-skip{z-index:80;background:var(--work-white);color:var(--work-deep);padding:12px 16px;position:absolute;top:10px;left:100px;transform:translateY(-160%)}.work-skip:focus{transform:none}.work-header{top:var(--edge);z-index:50;background:linear-gradient(#151cfbf0 0%,#151cfbb0 70%,#151cfb00 100%);border-bottom:1px solid #ffffff0f;justify-content:space-between;align-items:center;height:64px;padding-inline:clamp(18px,1.8vw,24px);display:flex;position:sticky}.work-brand{flex-shrink:0;align-items:center;width:32px;height:28px;display:flex}.work-brand img{filter:brightness(0)invert();width:100%;height:auto}.work-wall-intro{justify-content:space-between;align-items:flex-end;gap:8vw;max-width:1540px;min-height:430px;margin:0 auto;padding:88px clamp(24px,4vw,80px) 82px;display:flex}.work-kicker,.work-wall-label,.work-count,.work-panel-index,.work-panel-year,.work-wall-end,.work-footer{letter-spacing:.075em;font-size:11px;font-weight:600}.work-wall-intro h1{letter-spacing:-.08em;margin-top:45px;font-size:clamp(78px,9vw,148px);font-weight:500;line-height:.88}.work-period{color:var(--work-silver)}.work-wall-intro p{letter-spacing:-.025em;width:min(350px,30vw);padding-bottom:4px;font-size:clamp(18px,1.4vw,23px);line-height:1.42}.work-wall-intro em{color:var(--work-silver);font-style:normal}.work-wall-controls{z-index:35;width:calc(100% - clamp(48px,8vw,160px));max-width:1380px;min-height:72px;color:var(--navy);-webkit-backdrop-filter:blur(22px);background:#e8eaffed;border:1px solid #fff5;border-radius:14px;grid-template-columns:1fr auto 1fr;align-items:center;gap:15px;margin:0 auto 90px;padding:11px 15px;scroll-margin-top:128px;display:grid;position:sticky;top:116px;box-shadow:0 16px 45px #080a2040}.work-wall-label span{margin-left:8px;font-size:16px}.work-count{text-align:right;white-space:nowrap}.work-filter{background:#080a2012;border:1px solid #080a201c;border-radius:100px;gap:4px;padding:5px;display:flex}.work-filter button{white-space:nowrap;border-radius:100px;padding:11px 17px;font-size:13px;transition:background .2s,color .2s}.work-filter button[aria-pressed=true]{background:var(--work-blue);color:var(--work-white)}.work-filter button:hover:not([aria-pressed=true]){background:#080a2014}.work-filter sup{vertical-align:top;margin-left:6px;font-size:9px}.work-wall-grid{grid-template-columns:repeat(12,minmax(0,1fr));align-items:start;gap:clamp(105px,9vw,170px) clamp(38px,3.6vw,72px);max-width:1540px;min-height:460px;margin:0 auto;padding:0 clamp(24px,4vw,80px) 10px;display:grid}.work-panel{perspective:1200px;min-width:0;position:relative}.work-slot-0{--rz:-1deg;grid-column:span 7}.work-slot-1{--rz:1.2deg;grid-column:span 5;padding-top:56px}.work-slot-2{--rz:-.8deg;grid-column:span 4;padding-top:12px}.work-slot-3{--rz:.7deg;grid-column:span 8;padding-top:32px}.work-slot-4,.work-slot-5{--rz:.6deg;grid-column:span 6}.work-slot-5{--rz:-.8deg;padding-top:48px}.work-panel-link{display:block;position:relative}.work-panel-depth{transform:perspective(1200px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) rotateZ(var(--rz)) translateY(0);transform-style:preserve-3d;filter:drop-shadow(8px 12px #06083ba8)drop-shadow(0 22px 36px #080d4d55);transition:transform .27s cubic-bezier(.2,.8,.2,1),filter .27s}.work-panel-link:hover .work-panel-depth,.work-panel-link:focus-visible .work-panel-depth{transform:perspective(1200px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) rotateZ(0) translateY(-8px) scale(1.015);filter:drop-shadow(9px 15px #06083bd0)drop-shadow(0 32px 42px #080d4d88)}.work-panel-face{aspect-ratio:16/10;background:#dae1fc;border-radius:10px;overflow:hidden}.work-slot-1 .work-panel-face,.work-slot-2 .work-panel-face{aspect-ratio:4/3}.work-panel-caption{grid-template-columns:1fr auto;column-gap:16px;padding:22px 4px 0;display:grid;position:relative}.work-panel-index,.work-panel-year{color:#dce0ff}.work-panel-caption strong{letter-spacing:-.06em;grid-column:1/-1;margin-top:15px;font-size:clamp(28px,2.9vw,48px);font-weight:500;line-height:1}.work-panel-scope{color:#d4daff;grid-column:1/-1;margin-top:10px;font-size:14px}.work-panel-status{letter-spacing:.05em;border:1px solid #dce0ff9c;border-radius:30px;grid-column:1/-1;justify-self:start;margin-top:16px;padding:7px 10px;font-size:10px;font-weight:600}.work-panel-cue{opacity:0;font-size:12px;transition:opacity .2s,transform .2s;position:absolute;bottom:7px;right:3px;transform:translateY(4px)}.work-panel-link:hover .work-panel-cue,.work-panel-link:focus-visible .work-panel-cue{opacity:1;transform:none}.work-panel-link:hover .work-panel-arrow,.work-panel-link:focus-visible .work-panel-arrow{opacity:0}.work-empty{grid-column:1/-1;min-height:300px;padding:80px 0;font-size:clamp(25px,4vw,54px)}.work-empty button{border-bottom:2px solid;margin-top:25px;font-size:18px;display:block}.work-panel-arrow{font-size:32px;transition:transform .2s;position:absolute;bottom:0;right:4px}.work-panel-link:hover .work-panel-arrow,.work-panel-link:focus-visible .work-panel-arrow{transform:translate(5px,-5px)}.work-wall-grid[data-count="1"] .work-panel{--rz:0deg;grid-column:3/span 8;padding-top:0}.work-wall-grid[data-count="2"] .work-panel{--rz:0deg;grid-column:span 6;padding-top:0}.work-wall-grid[data-count="3"] .work-panel:last-child{grid-column:3/span 8;padding-top:0}.work-wall-end{max-width:1540px;color:var(--work-silver);justify-content:space-between;margin:auto;padding:90px clamp(24px,4vw,80px) 155px;display:flex}.work-outro{min-height:auto;color:var(--work-white);isolation:isolate;background:linear-gradient(#080a2066 0%,#0d1432cc 100%);border-top:1px solid #ffffff14;flex-direction:column;gap:28px;margin-top:auto;padding:36px clamp(20px,2.4vw,36px) 24px;display:flex;position:relative;overflow:hidden}.work-outro:before{content:"";z-index:-1;pointer-events:none;background:var(--grain-image,none) 0 0/256px 256px repeat;opacity:.3;position:absolute;inset:0}.work-outro-top,.work-outro-bottom{justify-content:space-between;align-items:center;gap:20px;font-size:11px;display:flex}.work-outro-top{letter-spacing:.045em;opacity:.72;font-weight:600}.work-available{align-items:center;gap:9px;display:flex}.work-available i{background:var(--lime);border-radius:50%;width:7px;height:7px;display:block;box-shadow:0 0 0 4px #c7ff4526}.work-outro-title{letter-spacing:-.03em;width:max-content;max-width:100%;color:var(--paper);cursor:default;-webkit-user-select:none;user-select:none;align-items:center;gap:10px;font-size:clamp(26px,2.6vw,38px);font-weight:500;line-height:1.1;text-decoration:none;display:inline-flex}.work-outro-bottom{color:#f7f7f287;border-top:1px solid #ffffff0f;padding-top:20px;font-size:12px}.work-outro-bottom div{gap:24px;display:flex}.work-outro-bottom a{color:#f7f7f287;text-decoration:none;transition:color .2s}.work-outro-bottom a:hover{color:var(--paper)}.visual-archive{background:var(--navy)}.visual-archive>img{object-fit:contain;width:100%;height:100%;display:block}.visual-community{background:radial-gradient(ellipse at 100% 0%,#6067ff,transparent 70%),var(--blue);color:var(--paper);flex-direction:column;justify-content:space-between;padding:clamp(18px,3vw,48px);display:flex}.visual-community-kicker,.visual-community-role{font-size:clamp(9px,.8vw,14px);line-height:1.5}.visual-community strong{letter-spacing:-.05em;overflow-wrap:anywhere;max-width:90%;font-size:clamp(28px,4vw,70px);font-weight:400;line-height:1}.visual-community.visual-compact strong{font-size:clamp(22px,2.8vw,44px)}.project-visual{isolation:isolate;width:100%;height:100%;min-height:220px;position:relative;overflow:hidden}.visual-no,.visual-disclaimer{z-index:10;letter-spacing:.1em;font-size:clamp(8px,.65vw,11px);font-weight:600;position:absolute}.visual-no{top:5%;left:4%}.visual-disclaimer{bottom:5%;right:4%}.visual-satujiwa{color:#fff8ea;background:linear-gradient(135deg,#fead81,#c96257 55%,#8d354e)}.visual-satujiwa:before{content:"";background:linear-gradient(90deg,#4c244332,#0000 60%),repeating-linear-gradient(90deg,#ffffff07 0 1px,#0000 1px 80px);position:absolute;inset:0}.visual-satujiwa-scene{position:absolute;inset:0}.visual-satujiwa-sun{aspect-ratio:1;filter:blur(1px);background:#ffcba7;border-radius:50%;width:53%;position:absolute;top:-45%;left:24%}.visual-satujiwa-building{background:#642e41;position:absolute;bottom:-4%;box-shadow:-15px 0 #f7b1944d}.building-one{width:20%;height:43%;left:52%}.building-two{width:13%;height:63%;left:71%}.visual-satujiwa-building:after{content:"";opacity:.65;background:repeating-linear-gradient(90deg,#0000 0 24%,#ffca9d 24% 33%,#0000 33% 48%);position:absolute;inset:12%}.visual-satujiwa-brand{letter-spacing:-.08em;font-size:clamp(34px,5vw,100px);font-weight:500;line-height:1;position:absolute;top:35%;left:7%}.visual-satujiwa-brand span{color:#ffe0c8}.visual-satujiwa-caption{letter-spacing:.1em;font-size:clamp(9px,1.15vw,19px);line-height:1.25;position:absolute;bottom:8%;left:7%}.visual-nero{color:#eff4e7;background:#141821}.visual-nero:before{content:"";aspect-ratio:1;filter:blur(90px);opacity:.28;background:#9bb7a1;border-radius:50%;width:85%;position:absolute;top:-30%;left:22%}.visual-nero-scene{background:#232d30;border:1px solid #8ca59b60;border-radius:10px;padding:5%;position:absolute;inset:11% 9%;transform:rotate(-5deg);box-shadow:15px 20px #050d10a8}.visual-nero-top{letter-spacing:.1em;border-bottom:1px solid #a9c3af55;justify-content:space-between;padding-bottom:4%;font-size:clamp(8px,.9vw,16px);display:flex}.visual-nero-chart{color:#20332a;background:#dce8cd;border-radius:8px;width:55%;height:50%;margin-top:5%;padding:5%;position:relative;overflow:hidden}.visual-nero-chart span{font-size:clamp(8px,.8vw,15px)}.visual-nero-chart strong{letter-spacing:-.08em;font-size:clamp(34px,5vw,95px);font-weight:500;line-height:1;display:block}.visual-nero-chart i{aspect-ratio:1;border:2px solid #3e8162;border-radius:50%;width:65%;position:absolute;top:20%;right:-12%;box-shadow:0 0 0 18px #3e816233,0 0 0 36px #3e81621a}.visual-nero-bottom{gap:8%;height:58%;display:grid;position:absolute;top:24%;left:63%;right:5%}.visual-nero-bottom div{border-bottom:1px solid #dce8cd66;justify-content:space-between;align-items:baseline;display:flex}.visual-nero-bottom span{letter-spacing:.06em;font-size:clamp(6px,.6vw,11px)}.visual-nero-bottom strong{font-size:clamp(14px,2vw,36px);font-weight:400}.visual-pastiplus{color:#173c30;background:#daf3c8}.visual-pastiplus:before{content:"";aspect-ratio:1;background:#98dd9c;border-radius:50%;width:70%;position:absolute;top:20%;left:-15%}.visual-pastiplus-scene{position:absolute;inset:0}.visual-phone{border-radius:10% 10% 0 0/7% 7% 0 0;width:36%;height:100%;position:absolute;overflow:hidden;box-shadow:0 0 0 3px #28483a,15px 22px 38px #26533a4a}.phone-back{color:#d5efb8;letter-spacing:-.07em;background:#1a513e;padding:8%;font-size:clamp(22px,3vw,62px);font-weight:700;top:26%;left:20%;transform:rotate(-17deg)}.phone-back span span{color:#a8d989}.phone-circles{aspect-ratio:1;border:1px solid #bff0ad88;border-radius:50%;width:130%;position:absolute;top:45%;left:-30%;box-shadow:0 0 0 32px #bff0ad14,0 0 0 64px #bff0ad14}.phone-front{background:#f8f9ee;padding:5%;top:13%;left:49%;transform:rotate(8deg)}.phone-bar{justify-content:space-between;font-size:clamp(6px,.55vw,11px);display:flex}.phone-hello{margin-top:22%;font-size:clamp(13px,1.8vw,35px);font-weight:600;display:block}.phone-balance{background:#d8efca;border-radius:8px;margin-top:11%;padding:9%;font-size:clamp(7px,.8vw,16px);display:block}.phone-balance strong{font-size:clamp(12px,1.5vw,30px)}.phone-actions{justify-content:space-between;margin-top:12%;display:flex}.phone-actions i{aspect-ratio:1;background:#d8efca;border-radius:50%;place-items:center;width:24%;font-size:clamp(10px,1.2vw,25px);font-style:normal;display:grid}.phone-row{background:#e1e8d9;border-radius:6px;height:8%;margin-top:10%}.phone-row.short{width:72%;margin-top:5%}.visual-identity{color:#174c54;background:#f4e9d9}.visual-identity:before{content:"";background:#ddbb8c;width:66%;height:160%;position:absolute;top:-29%;left:26%;transform:rotate(-31deg)}.visual-identity-scene{border:1px solid #174c5466;flex-direction:column;justify-content:center;align-items:center;display:flex;position:absolute;inset:7%}.identity-small{letter-spacing:.2em;font-size:clamp(7px,.7vw,13px);position:absolute;top:7%;left:5%}.identity-mark{letter-spacing:-.2em;font-family:Georgia,serif;font-size:clamp(140px,21vw,400px);line-height:1;transform:rotate(-8deg)translate(-8%)}.identity-mark span{color:#f6ede1;vertical-align:top;letter-spacing:0;font-size:.5em}.identity-name{letter-spacing:-.06em;font-size:clamp(28px,4vw,80px);font-weight:600;position:absolute;bottom:10%;right:5%}.identity-lines{gap:5px;display:flex;position:absolute;bottom:10%;left:5%}.identity-lines i{background:#174c54;width:3px;height:35px;display:block;transform:rotate(30deg)}@media (max-width:1099px){.work-wall-intro{min-height:410px}.work-wall-controls{grid-template-columns:1fr auto}.work-wall-label{display:none}.work-wall-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:105px 30px}.work-panel,.work-wall-grid[data-count="1"] .work-panel,.work-wall-grid[data-count="2"] .work-panel,.work-wall-grid[data-count="3"] .work-panel:last-child{--rz:0deg;grid-column:auto;padding-top:0}.work-wall-grid[data-count="1"] .work-panel{grid-column:1/-1;justify-self:center;width:min(680px,100%)}.work-panel-face,.work-slot-1 .work-panel-face,.work-slot-2 .work-panel-face{aspect-ratio:4/3}}@media (max-width:850px){.work-page{border-radius:12px}.work-header{height:56px;padding-inline:18px}.work-brand{width:34px}.work-wall-intro{min-height:360px;padding:90px 24px 55px;display:block}.work-wall-intro h1{margin-top:32px;font-size:clamp(88px,22vw,135px)}.work-wall-intro p{width:100%;max-width:400px;margin-top:30px;font-size:18px}.work-wall-controls{border-radius:12px;grid-template-columns:1fr auto;width:calc(100% - 28px);min-height:58px;margin:0 auto 52px;padding:8px;top:92px}.work-filter{background:0 0;border:0;min-width:0;padding:0}.work-filter button{padding:10px 9px;font-size:11px}.work-filter sup{margin-left:2px;font-size:7px}.work-count{letter-spacing:0;font-size:8px}.work-wall-grid{min-height:0;padding:0 24px;display:block}.work-panel,.work-wall-grid[data-count="1"] .work-panel{width:100%;margin-bottom:70px}.work-panel-depth{filter:drop-shadow(5px 7px #06083ba8)}.work-panel-face,.work-slot-1 .work-panel-face,.work-slot-2 .work-panel-face{aspect-ratio:4/3}.work-panel-caption{padding-top:18px}.work-panel-caption strong{font-size:38px}.work-panel-scope{font-size:12px}.work-wall-end{padding:10px 24px 90px;font-size:8px}.work-outro{gap:20px;min-height:auto;padding:28px 18px 20px}.work-outro-title{white-space:normal;font-size:clamp(22px,5.5vw,28px)}.work-outro-top,.work-outro-bottom{font-size:10px}.work-outro-bottom{flex-wrap:wrap;gap:12px}.work-outro-bottom div{order:3;gap:16px;width:100%}}@media (max-width:390px){.work-filter button{padding:9px 6px;font-size:10px}.work-count{font-size:7px}}@media (prefers-reduced-motion:reduce){.work-page *,.work-page :before,.work-page :after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}.work-panel-depth,.work-panel-link:hover .work-panel-depth{transform:none}}::view-transition-group(*){animation-duration:.65s;animation-timing-function:cubic-bezier(.2,.8,.2,1)}::view-transition-old(root){animation-duration:.4s}::view-transition-new(root){animation-duration:.4s}@media (max-width:850px){.work-filter button{padding:10px 12px;font-size:12px}.work-filter sup{display:none}.work-count{font-size:9px}}@media (max-width:390px){.work-filter button{padding:9px 8px;font-size:11px}.work-count{font-size:8px}}.work-nojs-filter{background:var(--navy);color:var(--paper);gap:20px;padding:15px clamp(24px,4vw,80px);display:flex}.work-nojs-filter a{text-underline-offset:4px;text-decoration:underline}.work-wall-grid.motion-enabled .work-panel-motion:not(.is-revealed){opacity:1}.work-panel-motion{transform-origin:50% 45%}@keyframes work-arrive{0%{opacity:0;transform:translateY(22px)}to{opacity:1;transform:translateY(0)}}.work-wall-intro h1{animation:.6s cubic-bezier(.2,.8,.2,1) 50ms both work-arrive}.work-wall-intro p{animation:.5s cubic-bezier(.2,.8,.2,1) .15s both work-arrive}.work-wall-controls{animation:.5s cubic-bezier(.2,.8,.2,1) .22s both work-arrive}@media (prefers-reduced-motion:reduce){.work-wall-intro h1,.work-wall-intro p,.work-wall-controls{animation:none}.work-wall-grid.motion-enabled .work-panel-motion:not(.is-revealed){opacity:1}}
