.bb-pstack{--pstack-gap: clamp(1.75rem, 1rem + 2vw, 2.5rem);--pstack-cols: 1;display:flex;flex-wrap:wrap;justify-content:center;gap:var(--pstack-gap)}.bb-pstack__item{position:relative;flex:0 0 calc((100% - (var(--pstack-cols) - 1) * var(--pstack-gap)) / var(--pstack-cols));min-width:0}.bb-pstack__card{height:100%;transition:transform var(--dur-3) var(--ease-spring)}@media(min-width:640px){.bb-pstack{--pstack-cols: 2}}@media(min-width:1024px){.bb-pstack{--pstack-cols: 3}}.bb-pstack--n1{--pstack-cols: 1;max-width:40rem;margin-inline:auto}@media(min-width:640px){.bb-pstack--n2{--pstack-cols: 2;max-width:62rem;margin-inline:auto}}.bb-portfolio__grid{--grid-gap: clamp(1rem, .6rem + 1.5vw, 2rem);display:flex;flex-wrap:wrap;justify-content:center}.bb-portfolio__grid>*{flex:0 0 calc((100% - (var(--cols, 3) - 1) * var(--grid-gap)) / var(--cols, 3));min-width:0}@media(min-width:1280px)and (hover:hover)and (pointer:fine)and (prefers-reduced-motion:no-preference){body:not(.bb-motion-off):not(.bb-motion-reduced) .bb-pstack:not(.bb-pstack--n1):not(.bb-pstack--n2){display:grid;grid-template-columns:repeat(var(--n, 5),minmax(0,1fr));gap:1.5rem;padding-block:1.5rem 3rem}body:not(.bb-motion-off):not(.bb-motion-reduced) .bb-pstack:not(.bb-pstack--n1):not(.bb-pstack--n2) .bb-pstack__item{z-index:var(--z, 1);transform:translate3d(calc(var(--o, 0) * -56%),calc(var(--ao, 0) * 1.4rem),0) scale(calc(1.06 - var(--ao, 0) * .03));transition:transform var(--dur-4) var(--ease-spring)}body:not(.bb-motion-off):not(.bb-motion-reduced) .bb-pstack:not(.bb-pstack--n1):not(.bb-pstack--n2) .bb-pstack__item .bb-browser{rotate:calc(var(--o, 0) * 3.5deg);transition:rotate var(--dur-4) var(--ease-spring),transform var(--dur-3) var(--ease-spring),box-shadow var(--dur-3) var(--ease-spring)}body:not(.bb-motion-off):not(.bb-motion-reduced) .bb-pstack:not(.bb-pstack--n1):not(.bb-pstack--n2):hover .bb-pstack__item,body:not(.bb-motion-off):not(.bb-motion-reduced) .bb-pstack:not(.bb-pstack--n1):not(.bb-pstack--n2):focus-within .bb-pstack__item{transform:translate3d(0,calc(var(--ao, 0) * .75rem),0) scale(1)}body:not(.bb-motion-off):not(.bb-motion-reduced) .bb-pstack:not(.bb-pstack--n1):not(.bb-pstack--n2):hover .bb-pstack__item .bb-browser,body:not(.bb-motion-off):not(.bb-motion-reduced) .bb-pstack:not(.bb-pstack--n1):not(.bb-pstack--n2):focus-within .bb-pstack__item .bb-browser{rotate:calc(var(--o, 0) * 1.2deg)}body:not(.bb-motion-off):not(.bb-motion-reduced) .bb-pstack__item:hover{z-index:30}body:not(.bb-motion-off):not(.bb-motion-reduced) .bb-pstack__item:hover .bb-pstack__card{transform:translateY(-.75rem) scale(1.02)}body:not(.bb-motion-off):not(.bb-motion-reduced) .bb-pstack:not(.bb-pstack--n1):not(.bb-pstack--n2) .bb-portfolio-card__text{display:none}body:not(.bb-motion-off):not(.bb-motion-reduced) .bb-pstack:not(.bb-pstack--n1):not(.bb-pstack--n2) .bb-pstack__item:not(.is-center) .bb-portfolio-card__caption{opacity:0;transition:opacity var(--dur-3) var(--ease-out)}body:not(.bb-motion-off):not(.bb-motion-reduced) .bb-pstack:hover .bb-portfolio-card__caption,body:not(.bb-motion-off):not(.bb-motion-reduced) .bb-pstack:focus-within .bb-portfolio-card__caption{opacity:1}}@supports (animation-timeline: view()){@media(min-width:1280px)and (hover:hover)and (pointer:fine)and (prefers-reduced-motion:no-preference){body:not(.bb-motion-off):not(.bb-motion-reduced) .bb-pstack:not(.bb-pstack--n1):not(.bb-pstack--n2){view-timeline-name:--bb-pstack}body:not(.bb-motion-off):not(.bb-motion-reduced) .bb-pstack:not(.bb-pstack--n1):not(.bb-pstack--n2) .bb-pstack__item{animation-name:bb-pstack-fan;animation-duration:auto;animation-timing-function:var(--ease-out);animation-fill-mode:both;animation-timeline:--bb-pstack;animation-range:entry 20% cover 48%}body:not(.bb-motion-off):not(.bb-motion-reduced) .bb-pstack:not(.bb-pstack--n1):not(.bb-pstack--n2) .bb-pstack__item .bb-browser{animation-name:bb-pstack-tilt;animation-duration:auto;animation-timing-function:var(--ease-out);animation-fill-mode:both;animation-timeline:--bb-pstack;animation-range:entry 20% cover 48%}body:not(.bb-motion-off):not(.bb-motion-reduced) .bb-pstack:not(.bb-pstack--n1):not(.bb-pstack--n2) .bb-pstack__item:not(.is-center) .bb-portfolio-card__caption{animation-name:bb-pstack-caption;animation-duration:auto;animation-timing-function:var(--ease-out);animation-fill-mode:both;animation-timeline:--bb-pstack;animation-range:entry 35% cover 50%}}}@keyframes bb-pstack-fan{0%{transform:translate3d(calc(var(--o, 0) * -56%),calc(var(--ao, 0) * 1.4rem),0) scale(calc(1.06 - var(--ao, 0) * .03))}to{transform:translate3d(0,calc(var(--ao, 0) * .75rem),0) scale(1)}}@keyframes bb-pstack-tilt{0%{rotate:calc(var(--o, 0) * 3.5deg)}to{rotate:calc(var(--o, 0) * 1.2deg)}}@keyframes bb-pstack-caption{0%{opacity:0}to{opacity:1}}.bb-portfolio{--cv-h: 1100px;--cv-h-lg: 1280px}