*,*:before,*:after{box-sizing:border-box;-webkit-font-smoothing:var(--font-smoothing-webkit);-moz-osx-font-smoothing:var(--font-smoothing-moz)}html{-webkit-text-size-adjust:100%;text-size-adjust:100%}body{margin:0;background:var(--color-bg);color:var(--color-text-primary);font-family:var(--font-sans);line-height:1.5;overflow-x:hidden}:root{--hero-indent: var(--content-indent)}.case-page{position:relative;width:100%;display:flex;flex-direction:column;align-items:center}.case-shader{position:absolute;top:0;bottom:0;left:50%;transform:translate(-50%);width:100vw;pointer-events:none;z-index:0;-webkit-mask-image:linear-gradient(to bottom,transparent 0,black 180px,black calc(100% - 600px),transparent 100%);mask-image:linear-gradient(to bottom,transparent 0,black 180px,black calc(100% - 600px),transparent 100%)}@media(min-width:810px){.case-shader{-webkit-mask-image:linear-gradient(to bottom,black 0,black calc(100% - 600px),transparent 100%);mask-image:linear-gradient(to bottom,black 0,black calc(100% - 600px),transparent 100%)}}.home-btn{position:fixed;top:var(--page-outer-padding);left:calc(max(var(--page-outer-padding),calc((100vw - var(--scrollbar-width, 0px)) / 2 - 640px)) + var(--hero-indent));z-index:100;isolation:isolate;background:none;box-shadow:none;transform-origin:center center;transform:translateY(0) scale(1);filter:blur(0px);will-change:transform,filter}.home-btn:before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;background:var(--btn-bg);box-shadow:var(--btn-shadow);mix-blend-mode:luminosity;transition:background var(--anim-interactive-duration) var(--anim-interactive-easing),box-shadow var(--anim-interactive-duration) var(--anim-interactive-easing)}.home-btn svg{mix-blend-mode:luminosity}.case-hero-area{position:relative;display:flex;flex-direction:column;align-items:center;gap:var(--space-16);padding:208px var(--page-outer-padding) var(--space-32);width:100%;max-width:calc(1280px + var(--page-outer-padding) * 2)}.case-hero{display:grid;grid-template-columns:1fr auto;grid-template-areas:"title   title" "company tags";align-items:baseline;column-gap:var(--space-8);row-gap:var(--space-8);width:100%;padding-inline:var(--hero-indent);position:relative;z-index:1}.case-company{grid-area:company;display:flex;align-items:center;gap:var(--space-6);min-width:0;mix-blend-mode:luminosity}.case-logo{flex-shrink:0;color:var(--color-fg-muted-alpha);mix-blend-mode:luminosity}.case-logo-wrap{display:flex;align-items:center;flex-shrink:0;padding-inline:2px}.case-company-text{font-family:var(--font-sans);font-size:var(--type-body);line-height:1.5;color:var(--color-fg-muted-alpha);flex:1 1 auto;mix-blend-mode:luminosity;text-align:left}.case-title{grid-area:title;font-family:var(--font-sans);font-size:40px;font-weight:var(--font-weight-semibold);line-height:1.3;text-transform:capitalize;text-align:left;text-wrap:balance;color:var(--color-fg-primary-alpha);mix-blend-mode:luminosity;margin:0}.case-tags{grid-area:tags;display:flex;align-items:center;gap:var(--space-6)}.case-tag{display:inline-flex;align-items:center;gap:6px;font-family:var(--font-sans);font-size:var(--type-body);line-height:1.5;color:var(--color-fg-muted-alpha);mix-blend-mode:luminosity}.case-mockup-wrap{width:100%;position:relative;z-index:1}.case-mockup-scroll{width:100%;display:flex;justify-content:center}[data-project=bella-duke] .case-mockup-wrap>.mockup--mobile{width:28%}[data-project=pikl-ds] .case-mockup-wrap .mockup,[data-project=pikl-ds] .case-mockup-wrap .mockup img{border-radius:0}.case-mockup-wrap>.mockup--mobile{box-shadow:var(--shadow-mockup);outline:1px solid var(--shadow-ring);outline-offset:0;right:0;bottom:0}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .case-mockup-wrap>.mockup--mobile{--shadow-ring: var(--shadow-ring-inverted)}}:root[data-theme=dark] .case-mockup-wrap>.mockup--mobile{--shadow-ring: var(--shadow-ring-inverted)}.case-mockup-wrap>.mockup--mobile:after{display:none}.case-content{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;--case-gap: var(--space-32);gap:var(--case-gap);width:100%;max-width:calc(1280px + var(--page-outer-padding) * 2);padding:var(--space-32) var(--page-outer-padding) var(--page-outer-padding)}.case-narrow{width:100%;max-width:600px}.case-roles{display:flex;flex-direction:column;gap:var(--space-12);padding:0 var(--space-6)}.case-role{display:flex;flex-direction:column;gap:var(--space-1)}.case-role-label{display:flex;align-items:center;gap:var(--space-2);font-family:var(--font-sans);font-size:var(--type-body);line-height:1.5;color:var(--color-text-secondary)}.case-role-label svg{flex-shrink:0;width:18px;height:18px;color:var(--color-icon-secondary)}.case-role-value{font-family:var(--font-sans);font-size:var(--type-body);line-height:1.5;color:var(--color-text-primary);margin:0}labelled-section{display:flex;flex-direction:column;gap:var(--ls-gap, var(--space-3));padding:var(--ls-padding, 0)}.ls-header{display:flex;align-items:center;gap:var(--space-2);padding:var(--ls-header-padding, 0)}.ls-icon{flex-shrink:0;width:18px;height:18px;color:var(--color-icon-secondary)}.ls-label{margin:0;font-family:var(--font-sans);color:var(--color-text-secondary)}.ls-body{display:contents}.case-car{display:flex;flex-direction:column;border-radius:var(--radius);overflow:clip;background:var(--color-bg-secondary);box-shadow:var(--shadow-with-ring)}.case-car:has(>labelled-section){border-radius:0;overflow:visible;background:transparent;box-shadow:none;gap:var(--space-6)}.case-car labelled-section,.case-next labelled-section,.case-cta labelled-section{--ls-gap: 0;--ls-header-padding: var(--space-4) var(--space-6);border-radius:var(--radius);box-shadow:var(--shadow-with-ring)}.case-car-body-card{display:flex;flex-direction:column;gap:var(--space-4);margin:0 var(--card-padding) var(--card-padding);padding:var(--space-5);border:1px solid var(--color-border-secondary-alpha);border-radius:calc(var(--radius) - var(--card-padding));background:var(--color-bg-secondary)}.case-car-row{display:flex;flex-direction:column;gap:var(--space-3);padding:var(--space-6)}.case-car-label{display:flex;align-items:center;gap:var(--space-2);font-family:var(--font-sans);font-size:var(--type-body);line-height:1.5;color:var(--color-text-secondary)}.case-car-label svg{flex-shrink:0;width:20px;height:20px;color:var(--color-icon-secondary)}.case-car-body{font-family:var(--font-sans);font-size:var(--type-body);line-height:1.5;color:var(--color-text-primary);margin:0}.case-car-results{display:flex;flex-direction:column;gap:var(--space-3)}.case-divider{width:100%;height:1px;background:var(--color-border-secondary-alpha);flex-shrink:0}.case-images{display:flex;flex-direction:column;gap:var(--case-gap);width:100%}.case-section-header{display:flex;padding:0 var(--space-6);width:100%}.case-section-label{font-family:var(--font-sans);color:var(--color-fg-muted-alpha)}.case-next{display:flex;flex-direction:column;gap:var(--space-4)}.case-next .next-card{align-self:stretch}.case-next labelled-section{--inner-radius: calc(var(--radius) - var(--card-padding))}.case-next labelled-section .next-card-wrap{--radius: var(--inner-radius);margin:0 var(--card-padding) var(--card-padding)}.case-next labelled-section .next-card{box-shadow:none}.case-cta{display:flex;flex-direction:column;gap:var(--space-4)}.case-cta-card{display:flex;flex-direction:column;gap:var(--space-4);margin:0 var(--card-padding) var(--card-padding);padding:var(--space-5);border:1px solid var(--color-border-secondary-alpha);border-radius:calc(var(--radius) - var(--card-padding));background:var(--color-bg-secondary)}.case-cta-text{display:flex;flex-direction:column;gap:var(--space-2)}.case-cta-title{font-family:var(--font-sans);color:var(--color-text-primary);margin:0}.case-cta-body{font-family:var(--font-sans);font-size:var(--type-body);line-height:1.5;color:var(--color-text-secondary);margin:0}.case-cta-btns{display:flex;align-items:center;gap:var(--space-4);margin-top:var(--space-1);container-type:inline-size}.case-footer{display:flex;padding:0 var(--space-6)}.case-shader{opacity:0;animation:hmShaderFadeIn .65s linear forwards}@keyframes hmShaderFadeIn{0%{opacity:0}to{opacity:1}}@media(prefers-reduced-motion:reduce){.case-shader{opacity:1;animation:none}}@media(min-width:810px)and (max-width:1199px){.case-title{font-size:32px}.case-hero{column-gap:var(--space-5);row-gap:var(--space-5)}.case-hero-area{gap:var(--space-12);padding-top:168px}.case-content{--case-gap: var(--space-24)}}@media(max-width:809px){.home-btn{left:max(var(--page-outer-padding),calc((100vw - var(--scrollbar-width, 0px)) / 2 - 640px))}.case-title{font-size:28px}.case-hero{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-5);max-width:600px;margin-inline:auto;padding-inline:0}.case-title{flex:1 1 100%}.case-company,.case-tags{display:contents}.case-company>*,.case-tags>*{opacity:var(--anim-enter-rest-opacity);transform:translateY(12px);filter:blur(10px)}.case-company.is-visible>*,.case-tags.is-visible>*{opacity:1;transform:none;filter:blur(0);animation:enter-rise-blur var(--anim-enter-duration) var(--anim-enter-easing) both;animation-delay:var(--enter-delay, 0ms)}.case-tags>*:nth-child(2){animation-delay:calc(var(--enter-delay, 0ms) + .1s)}.case-tags>*:nth-child(3){animation-delay:calc(var(--enter-delay, 0ms) + .2s)}.case-tags>*:nth-child(4){animation-delay:calc(var(--enter-delay, 0ms) + .3s)}.case-company-text{display:none}.case-hero-area{gap:var(--space-8);padding-top:var(--space-32);padding-bottom:var(--space-24)}.case-content{--case-gap: var(--space-16);padding-top:var(--space-16)}.image-container__media{overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}.image-container__media::-webkit-scrollbar{display:none}.image-container__media img{width:600px;max-width:none;height:auto}.image-container__media:has(>.thumb-wrap){display:flex;flex-direction:row;padding-inline-end:0}.image-container__media:has(>.thumb-wrap):after{content:"";flex:0 0 var(--card-padding);align-self:stretch}.case-roles{padding:0 var(--space-5);gap:var(--space-10)}.case-car-row{padding:var(--space-5);gap:var(--space-2)}.case-car labelled-section,.case-next labelled-section,.case-cta labelled-section{--ls-header-padding: var(--space-3) var(--space-5)}.case-car-body-card,.case-cta-card{padding:var(--space-4);gap:var(--space-3)}.case-cta-btns{flex-direction:column;align-items:stretch;gap:var(--space-3)}.case-cta-btns .btn-group{flex:0 0 auto}.case-section-header{padding:0 var(--space-5)}.case-next labelled-section,.case-cta labelled-section{--ls-header-padding: var(--space-4) var(--space-5)}.case-footer{padding:0 var(--space-5)}.case-mockup-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;justify-content:flex-start;width:calc(100% + (var(--page-outer-padding) * 2));margin-inline:calc(-1 * var(--page-outer-padding));padding-inline:var(--page-outer-padding);padding-block:var(--space-6);margin-block:calc(-1 * var(--space-6));scrollbar-width:none}.case-mockup-scroll::-webkit-scrollbar{display:none}.case-mockup-scroll>.mockup-group{width:600px;flex-shrink:0;max-width:none}.case-mockup-scroll>.mockup-group>.mockup{width:100%;max-width:none}.case-mockup-wrap>.mockup--mobile{width:149px;right:0;bottom:0}[data-project=bella-duke] .case-mockup-wrap>.mockup--mobile{width:156px}}@media(max-width:809px)and (prefers-reduced-motion:reduce){.case-company>*,.case-tags>*{opacity:1;transform:none;filter:none}}@media(min-width:662px)and (max-width:809px){.case-mockup-scroll{overflow-x:visible;justify-content:center;width:100%;margin-inline:0;padding-inline:0;padding-block:0;margin-block:0}.case-mockup-wrap>.mockup--mobile{right:calc(50% - 300px)}.image-container__media{overflow-x:visible}.image-container__media:has(>.thumb-wrap){display:block;padding-inline-end:var(--card-padding)}.image-container__media:has(>.thumb-wrap):after{content:none}.image-container__media img{width:100%;max-width:100%}}.screen-row-stack{display:none}@media(max-width:809px){.image-container--screen-row{display:none}.screen-row-stack{display:grid;grid-template-columns:1fr;gap:var(--case-gap);width:100%}.screen-row-stack .image-container__media,.screen-row-stack .image-container__media:has(>.thumb-wrap){display:block;overflow-x:visible;padding-inline-end:var(--card-padding)}.screen-row-stack .image-container__media:has(>.thumb-wrap):after{content:none}.screen-row-stack .image-container__media img{width:100%;max-width:560px;margin-inline:auto}}