.projects{background:0 0;padding-block:clamp(3rem,5.5vw,5rem);position:relative;overflow:clip}.projects__stars{-webkit-mask-image:linear-gradient(#0000,#000 12% 86%,#0000);mask-image:linear-gradient(#0000,#000 12% 86%,#0000)}.projects__eyebrow{font-family:var(--font-mono);letter-spacing:.26em;text-transform:uppercase;color:oklch(82% .05 258/.75);align-items:center;gap:1rem;font-size:.68rem;font-weight:500;display:flex}.projects__eyebrow:after{content:"";background:linear-gradient(to right, var(--border), transparent);width:clamp(2rem,9vw,5rem);height:1px}.projects__accent{background:linear-gradient(120deg, var(--primary), color-mix(in oklch, var(--primary) 45%, white), var(--primary));color:#0000;background-size:200%;-webkit-background-clip:text;background-clip:text;margin:-.1em -.1em -.32em -.05em;padding:.1em .1em .32em .05em;animation:6s linear infinite projects-accent-flow;display:inline-block}@keyframes projects-accent-flow{0%{background-position:0%}to{background-position:200%}}.projects__grid{padding:1px 0 0 1px;display:grid}@media (width>=640px){.projects__grid{grid-template-columns:repeat(2,1fr)}}@media (width>=1024px){.projects__grid{grid-template-columns:repeat(3,1fr)}}.project-cell{color:inherit;background:#05070d;border:1px solid oklch(20.9526% .019182 268.613);flex-direction:column;margin:-1px 0 0 -1px;padding:1.1rem;text-decoration:none;transition:border-color .35s;display:flex;position:relative}.project-cell:hover,.project-cell:focus-visible{z-index:1;border-color:color-mix(in oklch, var(--primary) 55%, #05070d)}.project-cell:focus-visible{outline:2px solid var(--ring);outline-offset:3px}.project-cell__media{aspect-ratio:16/10;background:var(--surface-deep);display:block;overflow:hidden}.project-cell__media img{opacity:.75;filter:saturate(.85);transition:opacity .5s ease, filter .5s ease, transform .6s var(--ease-out-expo)}.project-cell:hover .project-cell__media img,.project-cell:focus-visible .project-cell__media img{opacity:1;filter:saturate();transform:scale(1.05)}.project-cell__category{font-family:var(--font-mono);letter-spacing:.16em;text-transform:uppercase;color:oklch(82% .05 258/.6);margin-top:.3rem;font-size:.62rem;display:block}.project-cell__arrow{width:2.1rem;height:2.1rem;color:color-mix(in oklch, var(--foreground) 65%, transparent);background:oklch(100% 5.96046e-8 none/.05);border:1px solid oklch(80% .05 285/.14);flex:none;place-items:center;transition:color .3s,border-color .3s,background-color .3s;display:grid;overflow:hidden}.project-cell__arrow svg{transition:transform .35s var(--ease-out-expo)}.project-cell:hover .project-cell__arrow,.project-cell:focus-visible .project-cell__arrow{color:var(--primary);border-color:color-mix(in oklch, var(--primary) 45%, transparent);background:color-mix(in oklch, var(--primary) 12%, transparent)}.project-cell:hover .project-cell__arrow svg,.project-cell:focus-visible .project-cell__arrow svg{transform:translate(2px,-2px)}.projects__filters{flex-wrap:wrap;align-items:center;gap:.5rem;display:flex}.projects__filter{border:1px solid var(--border);background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);cursor:pointer;-webkit-tap-highlight-color:transparent;font-family:var(--font-mono);letter-spacing:.14em;text-transform:uppercase;color:color-mix(in oklch, var(--foreground) 85%, transparent);align-items:center;gap:.55rem;padding:.55rem .8rem;font-size:.72rem;font-weight:500;transition:color .25s,border-color .25s,background-color .25s;display:inline-flex}.projects__filter:before{content:"";background:color-mix(in oklch, var(--foreground) 30%, transparent);flex:none;width:5px;height:5px;transition:background-color .25s,box-shadow .25s;transform:rotate(45deg)}.projects__filter:hover{color:var(--foreground);border-color:color-mix(in oklch, var(--foreground) 25%, transparent)}.projects__filter:focus-visible{outline:2px solid var(--ring);outline-offset:2px}.projects__filter[aria-pressed=true]{color:var(--tile-foreground);border-color:var(--tile-border);background:color-mix(in oklch, var(--primary) 18%, var(--glass-bg))}.projects__filter[aria-pressed=true]:before{background:var(--primary);box-shadow:0 0 8px color-mix(in oklch, var(--primary) 60%, transparent)}.projects__filter-count{letter-spacing:.12em;color:color-mix(in oklch, var(--primary) 45%, var(--foreground));font-size:.62rem}.projects__filter[aria-pressed=true] .projects__filter-count{color:var(--tile-foreground)}@media (width<=639px){.projects__filters{scrollbar-width:none;-webkit-overflow-scrolling:touch;flex-wrap:nowrap;gap:.5rem;min-width:0;max-width:100%;overflow-x:auto;-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 1.5rem),#0000);mask-image:linear-gradient(90deg,#000 calc(100% - 1.5rem),#0000)}.projects__filters::-webkit-scrollbar{display:none}.projects__filter{white-space:nowrap;flex:none}}.projects__grid[data-phase=out]{pointer-events:none}.projects__grid[data-phase=out] .project-cell{animation:.3s ease-in both project-sink;animation-delay:calc(var(--cell-i,0) * 25ms)}@keyframes project-sink{to{opacity:0;transform:translateY(16px)scale(.9)}}.projects__grid--switch:not([data-phase=out]) .project-cell{animation:project-assemble .55s var(--ease-out-expo) both;animation-timeline:auto;animation-delay:calc(var(--cell-i,0) * 55ms)}@keyframes project-assemble{0%{opacity:0;transform:translateX(calc(var(--cell-dir,1) * 3.5rem)) scale(.96)}to{opacity:1;transform:none}}button.project-cell{width:100%;font:inherit;text-align:left;cursor:pointer;-webkit-tap-highlight-color:transparent}html[data-project-modal]{overflow:hidden}html[data-project-modal] :is(.floating-star,.about-card__deal,.about__accent,.projects__accent){animation-play-state:paused}.project-modal{z-index:80;place-items:center;padding:clamp(.75rem,3vw,2.5rem);display:grid;position:fixed;inset:0}.project-modal--full{padding:0}.project-modal__backdrop{z-index:0;opacity:0;view-transition-name:project-backdrop;background:oklch(2% .008 260/.94);animation:1.8s ease-in-out forwards project-backdrop-dim;position:absolute;inset:0}@keyframes project-backdrop-dim{to{opacity:1}}.project-modal__panel{z-index:1;width:min(56rem,100%);height:min(85vh,58rem);position:relative}.project-modal--full .project-modal__panel{width:100%;height:100%}.project-modal__body{scrollbar-width:none;flex:1 1 0;min-height:0;overflow-y:auto}.project-modal__body::-webkit-scrollbar{display:none}.project-modal__body:focus-visible{outline:2px solid var(--ring);outline-offset:-2px}.project-modal__content{flex-direction:column;gap:2rem;padding:1.5rem 1.25rem 2.25rem;display:flex}@media (width>=1024px){.project-modal__content{padding:1.75rem 2rem 2.75rem}}.project-modal__cover{background:var(--surface-deep);flex:none;height:clamp(11rem,30vh,17rem);position:relative;overflow:hidden}.project-modal__cover img{opacity:.8}.project-modal__cover:after{content:"";background:linear-gradient(#0000 20%,oklch(3% .01 260/.5) 58%,#05070d 96%);position:absolute;inset:0}.project-modal__cover-copy{z-index:1;inset-inline:1.25rem;position:absolute;bottom:1.1rem}@media (width>=1024px){.project-modal__cover-copy{inset-inline:2rem;bottom:1.4rem}}.project-modal__eyebrow{font-family:var(--font-mono);letter-spacing:.22em;text-transform:uppercase;color:color-mix(in oklch, var(--primary) 45%, white);font-size:.62rem;font-weight:500}.project-modal__title{letter-spacing:-.03em;text-wrap:balance;margin-top:.4rem;font-size:clamp(1.45rem,3.2vw,2.1rem);font-weight:700;line-height:1.08}.project-modal__lede{text-wrap:balance;max-width:42rem;color:color-mix(in oklch, var(--foreground) 92%, transparent);font-size:1.05rem;font-weight:500;line-height:1.55}@media (width>=1024px){.project-modal__lede{font-size:1.15rem}}.project-modal__meta{background:oklch(100% 5.96046e-8 none/.14);grid-template-columns:repeat(auto-fit,minmax(min(13rem,100%),1fr));gap:1px;padding:1px;display:grid}.project-modal__meta-cell{background:var(--surface-deep);flex-direction:column;gap:.35rem;padding:.8rem 1rem;display:flex}.project-modal__meta-label{font-family:var(--font-mono);letter-spacing:.2em;text-transform:uppercase;color:color-mix(in oklch, var(--primary) 50%, white);font-size:.6rem;font-weight:500}.project-modal__meta-value{color:color-mix(in oklch, var(--foreground) 88%, transparent);font-size:.85rem;line-height:1.45}.project-modal__category{font-family:var(--font-mono);letter-spacing:.16em;text-transform:uppercase;color:oklch(82% .05 258/.6);margin-top:.2rem;font-size:.62rem;display:block}.project-modal__actions{z-index:5;gap:.5rem;display:flex;position:absolute;top:.9rem;right:.9rem}.project-modal__action{cursor:pointer;width:2.25rem;height:2.25rem;color:color-mix(in oklch, var(--foreground) 75%, transparent);background:oklch(10% .015 260/.85);border:1px solid oklch(100% 5.96046e-8 none/.14);border-color:oklch(100% 5.96046e-8 none/.14) oklch(100% 5.96046e-8 none/.14) oklch(100% 5.96046e-8 none/.14) oklch(100% 5.96046e-8 none/.14);place-items:center;padding:0;transition:color .3s,border-color .3s,background-color .3s;display:grid}.project-modal__action:hover,.project-modal__action:focus-visible{color:var(--primary);border-color:color-mix(in oklch, var(--primary) 45%, transparent);background:color-mix(in oklch, var(--primary) 12%, transparent)}.project-modal__action:focus-visible{outline:2px solid var(--ring);outline-offset:2px}.project-modal__label{font-family:var(--font-mono);letter-spacing:.24em;text-transform:uppercase;color:color-mix(in oklch, var(--primary) 50%, white);align-items:center;gap:1rem;margin-bottom:1rem;font-size:.65rem;font-weight:500;display:flex}.project-modal__label:after{content:"";background:linear-gradient(90deg,oklch(100% 5.96046e-8 none/.12),#0000);flex:1;height:1px}.project-modal__sub{letter-spacing:.04em;text-transform:uppercase;color:color-mix(in oklch, var(--foreground) 80%, transparent);margin-bottom:.5rem;font-size:.75rem;font-weight:600}.project-modal__stack-row{grid-template-columns:7.5rem 1fr;align-items:baseline;gap:1rem;padding-block:.6rem;display:grid}.project-modal__stack-row:not(:last-child){border-bottom:1px solid oklch(100% 5.96046e-8 none/.07)}.project-modal__stack-group{font-family:var(--font-mono);letter-spacing:.18em;text-transform:uppercase;color:color-mix(in oklch, var(--primary) 50%, white);font-size:.62rem;font-weight:500}.project-modal__stack-items{color:var(--muted-foreground);font-size:.875rem;line-height:1.55}.project-modal__pillar{border:1px solid oklch(100% 5.96046e-8 none/.14);border-color:oklch(100% 5.96046e-8 none/.14) oklch(100% 5.96046e-8 none/.14) oklch(100% 5.96046e-8 none/.14) oklch(100% 5.96046e-8 none/.14);border-left:2px solid color-mix(in oklch, var(--primary) 45%, transparent);background:oklch(100% 5.96046e-8 none/.03);padding:1.05rem}.project-modal__duo{background:oklch(100% 5.96046e-8 none/.14);gap:1px;padding:1px;display:grid}@media (width>=640px){.project-modal__duo{grid-template-columns:1fr 1fr}}.project-modal__duo-cell{background:var(--surface-deep);padding:1rem 1.1rem}.project-modal__duo-cell--fix{border-left:2px solid color-mix(in oklch, var(--primary) 55%, transparent);background:color-mix(in oklch, var(--primary) 6%, var(--surface-deep))}.project-modal__decision{border-left:1px solid oklch(100% 5.96046e-8 none/.14);padding-left:1.1rem}.project-modal__li{padding-left:1.1rem;position:relative}.project-modal__li:before{content:"";background:var(--tile-foreground);width:5px;height:5px;box-shadow:0 0 8px color-mix(in oklch, var(--primary) 45%, transparent);position:absolute;top:.5em;left:0;transform:rotate(45deg)}.project-modal__artifact img{aspect-ratio:16/10;object-fit:cover;border:1px solid oklch(100% 5.96046e-8 none/.14);border-color:oklch(100% 5.96046e-8 none/.14) oklch(100% 5.96046e-8 none/.14) oklch(100% 5.96046e-8 none/.14) oklch(100% 5.96046e-8 none/.14);width:100%}::view-transition{pointer-events:none}:root{view-transition-name:none}::view-transition-group(*){animation-duration:.45s;animation-timing-function:var(--ease-out-expo)}::view-transition-old(*){animation-duration:.45s;animation-timing-function:var(--ease-out-expo)}::view-transition-new(*){animation-duration:.45s;animation-timing-function:var(--ease-out-expo)}::view-transition-new(project-backdrop){opacity:1;animation:none}::view-transition-old(project-backdrop){animation-duration:.9s;animation-timing-function:ease}::view-transition-group(project-backdrop){z-index:0}::view-transition-group(project-0){z-index:1}::view-transition-group(project-1){z-index:1}::view-transition-group(project-2){z-index:1}::view-transition-group(project-3){z-index:1}::view-transition-group(project-4){z-index:1}::view-transition-group(project-5){z-index:1}::view-transition-old(project-0){opacity:0;animation:none}::view-transition-old(project-1){opacity:0;animation:none}::view-transition-old(project-2){opacity:0;animation:none}::view-transition-old(project-3){opacity:0;animation:none}::view-transition-old(project-4){opacity:0;animation:none}::view-transition-old(project-5){opacity:0;animation:none}::view-transition-new(project-0){opacity:1;animation:none}::view-transition-new(project-1){opacity:1;animation:none}::view-transition-new(project-2){opacity:1;animation:none}::view-transition-new(project-3){opacity:1;animation:none}::view-transition-new(project-4){opacity:1;animation:none}::view-transition-new(project-5){opacity:1;animation:none}@media (prefers-reduced-motion:reduce){.project-cell,.projects__grid[data-phase=out] .project-cell,.projects__grid--switch:not([data-phase=out]) .project-cell{animation:none}.projects__filter,.projects__filter:before,.project-cell__media img,.project-cell__arrow,.project-cell__arrow svg,.project-modal__action{transition:none}.projects__accent{animation:none}.project-modal__backdrop{opacity:1;animation:none}::view-transition-group(*){animation-duration:0s!important}::view-transition-old(*){animation-duration:0s!important}::view-transition-new(*){animation-duration:0s!important}}
