.filter-list{display:none}@media (min-width:768px){.filter-list{justify-content:flex-start;align-items:center;gap:1.5625rem;margin-bottom:1.875rem;padding-left:.3125rem;display:flex}}.filter-select-box{margin-bottom:1.5625rem;position:relative}@media (min-width:768px){.filter-select-box{display:none}}.select-icon{transition:var(--transition-1);align-items:center;display:flex}.select-icon svg{width:1em;height:1em}.filter-select{width:100%;font-size:var(--fs-6);font-weight:var(--fw-300);color:var(--light-gray);background:var(--eerie-black-2);border:1px solid var(--jet);border-radius:.875rem;justify-content:space-between;align-items:center;padding:.75rem 1rem;display:flex}.filter-select.active .select-icon{transform:rotate(.5turn)}.select-list{z-index:2;visibility:hidden;pointer-events:none;background:var(--eerie-black-2);border:1px solid var(--jet);opacity:0;border-radius:.875rem;width:100%;padding:.375rem;transition:all .15s ease-in-out;position:absolute;top:calc(100% + .375rem);left:0}.filter-select.active+.select-list,.select-list.active{visibility:visible;pointer-events:all;opacity:1}.select-item button{width:100%;font-size:var(--fs-6);font-weight:var(--fw-300);color:var(--light-gray);text-transform:capitalize;background:var(--eerie-black-2);transition:var(--transition-1);border-radius:.5rem;padding:.5rem .625rem}.select-item button:hover{background:#323234}.project-list{column-count:1;column-gap:1.875rem;margin:0 0 .625rem;padding:0;list-style:none}@media (min-width:768px){.project-list{column-count:2}}@media (min-width:1024px){.project-list{column-count:3}}@keyframes scale-up{0%{transform:scale(.5)}to{transform:scale(1)}}.project-img{box-sizing:border-box;background:var(--jet);border-radius:1rem;width:100%;margin-bottom:.9375rem;padding:.5rem}@media (min-width:580px){.project-img{border-radius:1rem}}.project-img-media{background:#19191a;border-radius:.75rem;width:100%;height:12.5rem;position:relative;overflow:hidden}@media (min-width:450px){.project-img-media{height:auto}}.project-img-media:before{z-index:1;content:"";transition:var(--transition-1);background:0 0;position:absolute;top:0;left:0}.project-img-media:before,.project-img-media img{width:100%;height:100%}.project-img-media img{object-fit:contain;filter:grayscale();transition:var(--transition-1),filter .28s ease;display:block}@media (min-width:450px){.project-img-media img{height:auto}}.project-item-icon-box{--scale:.8;z-index:1;color:var(--orange-yellow-crayola);background:var(--jet);opacity:0;transform:translate(-50%,-50%) scale(var(--scale));transition:var(--transition-1);border-radius:.75rem;justify-content:center;align-items:center;padding:1.125rem;font-size:1.25rem;display:flex;position:absolute;top:50%;left:50%}.project-item-icon-box svg{width:1em;height:1em}.project-item{box-sizing:border-box;vertical-align:top;break-inside:avoid-column;width:100%;margin:0 0 1.875rem;display:none}.project-item.active{animation:.25s forwards scale-up;display:inline-block}.project-item>.project-item-trigger{text-align:left;cursor:pointer;background:0 0;border:none;width:100%;padding:0}:is(.project-item>.project-item-trigger:focus-visible,.project-item>.project-item-trigger:hover) .project-img-media:before{background:#00000080}:is(.project-item>.project-item-trigger:focus-visible,.project-item>.project-item-trigger:hover) .project-img-media img{filter:grayscale(0)}:is(.project-item>.project-item-trigger:focus-visible,.project-item>.project-item-trigger:hover) .project-item-icon-box{--scale:1;opacity:1}.project-category,.project-title{margin-left:.625rem}.project-title{font-size:var(--fs-5);font-weight:var(--fw-400);color:var(--white-2);line-height:1.3}.project-category{font-size:var(--fs-6);font-weight:var(--fw-300);color:var(--light-gray-70)}@media (min-width:768px){.filter-item button{font-size:var(--fs-5);color:var(--light-gray);transition:var(--transition-1)}.filter-item button:hover{color:var(--light-gray-70)}.filter-item button.active{color:var(--orange-yellow-crayola)}}.project-expand-root{z-index:100;pointer-events:none;position:fixed;inset:0}.project-expand-backdrop{z-index:0;pointer-events:auto;cursor:pointer;appearance:none;background:#00000094;border:none;padding:0;position:fixed;inset:0}.project-expand-shell{z-index:1;pointer-events:none;position:fixed;inset:0}.project-expand-scroll{z-index:1;pointer-events:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;flex-direction:column;display:flex;position:fixed;inset:0;overflow:hidden auto}.project-expand-banner{z-index:2;box-sizing:border-box;pointer-events:auto;background:var(--eerie-black-2);flex-shrink:0;position:relative;overflow:hidden}.project-expand-banner-animate{transition:margin .45s cubic-bezier(.4,0,.2,1),width .45s cubic-bezier(.4,0,.2,1),height .45s cubic-bezier(.4,0,.2,1),border-radius .35s}.project-expand-banner-media{position:absolute;inset:0}.project-expand-banner-bg{position:absolute;inset:0;overflow:hidden}.project-expand-blur-img{object-fit:cover;filter:blur(2rem)saturate(1.1);opacity:.92;transform:scale(1.12)}.project-expand-banner-fg{z-index:1;position:absolute;inset:0}.project-expand-contain-img{object-fit:contain;object-position:center center}.project-expand-banner-scrim{z-index:2;pointer-events:none;background:linear-gradient(0deg,#000000b8 0,#0000002e 45%,#0000 70%);position:absolute;inset:0}.project-expand-banner-title{z-index:3;font-size:clamp(1.25rem,4vw,1.75rem);font-weight:var(--fw-500);color:var(--white-2);text-align:left;text-shadow:0 .125rem .75rem #000c;opacity:0;margin:0;line-height:1.2;transition:opacity .28s;position:absolute;bottom:1rem;left:1rem;right:3.5rem}.project-expand-banner-title.project-expand-banner-title-visible{opacity:1}.project-expand-close{z-index:4;width:2.5rem;height:2.5rem;color:var(--white-2);cursor:pointer;transition:var(--transition-1);background:#00000073;border:1px solid #ffffff1f;border-radius:.5rem;justify-content:center;align-items:center;padding:0;font-size:1.5rem;display:flex;position:absolute;top:.75rem;right:.75rem}.project-expand-close:hover{background:#0000009e}.project-expand-close svg{width:1em;height:1em}.project-expand-detail{z-index:2;pointer-events:auto;text-align:left;background:#00000085;flex:auto;position:relative}.project-expand-detail-inner{box-sizing:border-box;width:100%;max-width:40rem;padding:1.5rem 1.25rem calc(2.5rem + env(safe-area-inset-bottom,0));text-align:left;margin-left:0}.project-expand-meta{font-size:var(--fs-7);font-weight:var(--fw-300);letter-spacing:.04em;color:var(--orange-yellow-crayola);text-transform:uppercase;margin:0 0 .75rem}.project-expand-description{color:var(--light-gray)}.project-expand-description,.project-expand-placeholder{font-size:var(--fs-6);font-weight:var(--fw-300);margin:0 0 1.25rem;line-height:1.65}.project-expand-placeholder{color:var(--light-gray-70);font-style:italic}.project-expand-block{margin-top:1.25rem}.project-expand-subheading{font-size:var(--fs-7);font-weight:var(--fw-500);letter-spacing:.06em;color:var(--white-2);text-transform:uppercase;margin:0 0 .5rem}.project-expand-role{font-size:var(--fs-6);font-weight:var(--fw-300);color:var(--light-gray);margin:0;line-height:1.65}.project-expand-inline-code{font-family:ui-monospace,Cascadia Code,Source Code Pro,Menlo,Consolas,monospace;font-size:.92em;font-weight:var(--fw-400);color:var(--light-gray);background:#2c2c30;border-radius:.25rem;padding:.1em .35em}.project-expand-skills-list{flex-wrap:wrap;gap:.5rem;margin:0;padding:0;list-style:none;display:flex}.project-expand-skills-list li{font-size:var(--fs-7);font-weight:var(--fw-300);color:var(--light-gray);border:1px solid var(--jet);background:#232324;border-radius:.375rem;padding:.35rem .65rem;line-height:1.3}.project-expand-links{flex-wrap:wrap;gap:.75rem 1.25rem;margin-top:1.25rem;display:flex}.project-expand-external{font-size:var(--fs-6);font-weight:var(--fw-500);color:var(--orange-yellow-crayola);text-underline-offset:.2em;transition:var(--transition-1);margin-top:1.25rem;text-decoration:underline;display:inline-block}.project-expand-external:hover{color:var(--light-gray)}.project-expand-links .project-expand-external{margin-top:0}@media (prefers-reduced-motion:reduce){.project-expand-banner-animate{transition:none!important}.project-expand-banner-title{transition:none}}