body[data-site=portfolio]{--paper:#f0f1eb;--ink:#1c283e;--line:#34446129}
.studio-hero{position:relative;min-height:100svh;overflow:clip;isolation:isolate;background:#d6e5f5}.studio-hero>.shell{padding-top:124px;padding-bottom:40px;min-height:100svh;display:flex;flex-direction:column;position:relative}.studio-eyebrow{display:flex;justify-content:space-between;font-size:10px;letter-spacing:.12em;direction:ltr;position:relative;z-index:2}.studio-hero h1{font-size:clamp(80px,15.2vw,230px);letter-spacing:-.075em;line-height:.98;direction:ltr;margin:22px 0 0;white-space:nowrap;position:relative;z-index:3;pointer-events:none}.studio-hero h1>span{color:#536d96}.studio-hero h1>i{font-size:19px;font-weight:400;font-style:normal;vertical-align:top;margin-left:15px;letter-spacing:0}.studio-floor{position:absolute;width:70vw;height:55vw;max-width:1080px;max-height:800px;top:32%;left:40%;transform:perspective(1600px) rotateX(calc(55deg - var(--studio-p,0) * 25deg)) rotateZ(calc(-20deg + var(--studio-p,0) * 24deg));transform-style:preserve-3d;direction:ltr}.studio-tile{position:absolute;display:block;width:28%;height:28%;border-radius:16%;box-shadow:inset 0 3px 2px #ffffffc9,inset 0 -7px 4px #24456444,0 25px 28px #344d7926;border:1px solid #fff9;background:#719cc7;transform:translateZ(calc(var(--i) * 8px + var(--studio-p,0) * (var(--i) - 4) * 18px));transition:background .2s}.tile-0,.tile-3,.tile-6{left:0}.tile-1,.tile-4,.tile-7{left:31%}.tile-2,.tile-5,.tile-8{left:62%}.tile-0,.tile-1,.tile-2{top:0}.tile-3,.tile-4,.tile-5{top:31%}.tile-6,.tile-7,.tile-8{top:62%}.tile-0,.tile-4{background:#e8f0f6}.tile-1,.tile-8{background:#9abae5}.tile-2{background:#c6d79b}.tile-3{background:#284da0}.tile-5{background:#acbdea}.tile-6{background:#96bcb9}.tile-7{background:#e4bb9f}.studio-mark{position:absolute;inset:32% 36% 35% 35%;display:flex;justify-content:center;align-items:center;transform:translateZ(110px);font-size:clamp(45px,6vw,110px);font-weight:800;letter-spacing:-.13em;line-height:1;color:#294272}.studio-mark span{position:absolute;right:-7px;top:8%;font-size:.35em;letter-spacing:0}.studio-caption{position:relative;z-index:4;margin-top:auto;display:flex;justify-content:space-between;align-items:end;gap:35px;padding-top:0}.studio-caption p{max-width:400px;font-size:clamp(18px,1.8vw,25px);line-height:1.45;letter-spacing:-.03em}.round-link{display:grid;place-items:center;width:66px;height:66px;border:1px solid #526c8a66;border-radius:50%;background:#dceafa66;backdrop-filter:blur(10px);flex-shrink:0}.round-link svg{width:25px;height:25px;transform:rotate(90deg)}
.portfolio-index{padding-top:70px;background:#f0f1eb}.index-heading{display:flex;justify-content:space-between;align-items:center;padding-bottom:35px}.index-heading h2{font-size:clamp(30px,4vw,52px)}.index-heading>span{font-size:12px;border:1px solid #aab2bb;border-radius:50%;width:35px;height:35px;display:grid;place-items:center}.app-portal{min-height:95svh;display:flex;align-items:end;position:relative;isolation:isolate;overflow:clip;color:#fff;background:#121321}.portal-background{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:65% 50%;z-index:-2;transform:scale(var(--portal-scale,1.03));transition:filter .4s}.app-portal:hover .portal-background{filter:saturate(1.15)}.portal-shade{position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,#101527e8,transparent 90%)}.app-portal-inner{padding-block:100px 60px}.app-portal .eyebrow{margin-bottom:16px}.app-portal h3{font-size:clamp(100px,19vw,285px);line-height:.9;letter-spacing:-.07em;direction:ltr;text-align:start;font-weight:700}.app-portal h3>span{font-size:.4em;display:inline-block;vertical-align:top;margin-left:35px;transition:transform .3s}.app-portal:hover h3>span{transform:translate(8px,-8px)}.portal-details{display:flex;gap:25px;align-items:center;border-top:1px solid #b4bccc55;padding-top:26px;margin-top:45px}.portal-details>img{width:50px;height:50px;border-radius:13px;flex-shrink:0}.portal-details>p{font-size:16px;max-width:460px;line-height:1.5;color:#dce3f4}.portal-cta{display:flex;gap:16px;align-items:center;margin-inline-start:auto;font-size:14px}.studio-about{position:relative;padding-block:clamp(85px,11vw,170px);isolation:isolate}.studio-about>p{font-size:clamp(30px,5.3vw,76px);line-height:1.15;letter-spacing:-.045em;font-weight:550;max-width:1150px}.studio-seal{display:flex;align-items:center;gap:14px;margin-top:44px}.studio-seal img{width:52px;height:52px;border-radius:15px;transform:rotate(-8deg)}.studio-seal span{font-size:10px;letter-spacing:.15em}
@supports(animation-timeline:view()){ @media(prefers-reduced-motion:no-preference){.studio-about>p{animation:statement-in linear both;animation-timeline:view();animation-range:entry 0% entry 75%}@keyframes statement-in{from{opacity:.2;transform:translateY(30px)}to{opacity:1;transform:none}}}}
@media(max-width:800px){.studio-hero>.shell{padding-top:140px}.studio-hero h1{font-size:14.8vw;margin-top:35px}.studio-hero h1>i{font-size:13px;margin-left:7px}.studio-floor{width:110vw;height:90vw;top:30%;left:5%}.studio-caption{padding-top:0}.studio-caption p{max-width:420px;font-size:19px}.studio-mark{font-size:70px}.app-portal{min-height:800px}.app-portal-inner{padding-block:60px 40px}.app-portal h3{font-size:25vw}.portal-details{flex-wrap:wrap;gap:16px;margin-top:30px}.portal-details>p{max-width:calc(100% - 70px);font-size:15px}.portal-cta{margin-inline-start:0;margin-top:12px;width:100%;justify-content:space-between}.studio-about>p{font-size:clamp(32px,6vw,50px)}.studio-about{padding-block:80px}.portal-background{object-position:65% 50%}}
@media(max-width:480px){.studio-hero h1{font-size:14.7vw}.studio-floor{top:34%;left:-4%;width:135vw;height:110vw}.studio-caption{padding-top:0;gap:22px}.studio-caption p{font-size:17px}.round-link{width:50px;height:50px}.studio-mark{font-size:70px}.app-portal{min-height:700px}.app-portal .eyebrow{font-size:10px}.app-portal h3>span{margin-left:20px}.studio-eyebrow{font-size:9px}.portfolio-index{padding-top:50px}}
@media(prefers-reduced-motion:reduce){.studio-floor{transform:perspective(1600px) rotateX(55deg) rotateZ(-20deg)}.studio-tile{transform:translateZ(calc(var(--i) * 8px))}.portal-background{transform:none}}