@layer components{.work{--page-top:var(--space-xl);padding-block-end:var(--space-3xl)}@media (min-width:60rem){.work{--page-top:var(--frame-top)}}.work__header{display:flex;align-items:baseline;justify-content:space-between;gap:var(--space-m);margin-block-end:var(--space-l)}.work__title{font-size:var(--text-4);margin:0}.work__count{font-size:var(--text--1);letter-spacing:var(--tracking-label);color:var(--fg-muted);margin:0}.work__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:9.5%;--grid-row-gap:clamp(3.375rem,1.5493rem + 7.7934vw,8.5625rem);row-gap:var(--grid-row-gap);list-style:none;margin:0;padding:0}@media (min-width:60rem){.work__grid{grid-template-columns:repeat(4,minmax(0,1fr))}}.tile{display:block;color:var(--fg);text-decoration:none}.tile__media{position:relative;display:block;aspect-ratio:7 / 9;overflow:hidden;background:var(--project-colour);isolation:isolate}.tile__image{position:absolute;inset:0}.tile__media::after{content:'';position:absolute;inset:0;background:var(--project-colour);opacity:0;transition:opacity var(--duration-base) var(--ease-out)}.tile__image,.tile__image img{display:block;width:100%;height:100%;object-fit:cover}.tile__label{display:block;margin-block-start:var(--space-2xs);font-size:var(--text--1);line-height:1.4;letter-spacing:var(--tracking-label);color:var(--fg)}.tile__label--hover{opacity:0;transition:opacity var(--duration-base) var(--ease-out)}.tile:focus-visible .tile__label--hover{transition-delay:calc(var(--duration-fast) / 2)}.tile:focus-visible .tile__media::after{opacity:1;transition-duration:var(--duration-fast)}.tile:focus-visible .tile__label--hover{opacity:1}@media (hover:hover){.tile:hover .tile__label--hover{transition-delay:calc(var(--duration-fast) / 2)}.tile:hover .tile__media::after{opacity:1;transition-duration:var(--duration-fast)}.tile:hover .tile__label--hover{opacity:1}}.tile--soon:hover .tile__media::after{opacity:1;transition-duration:var(--duration-fast)}.tile:focus-visible .tile__media{outline:var(--focus-width) solid var(--project-ink);outline-offset:calc(var(--focus-width) * -2)}.tile--soon{cursor:default}.tile__soon{position:absolute;inset-inline-start:var(--space-2xs);inset-block-end:var(--space-2xs);z-index:1;opacity:0;font-size:var(--text--1);line-height:1.4;letter-spacing:var(--tracking-label);color:var(--project-ink);transition:opacity var(--duration-base) var(--ease-out)}.tile--soon:hover .tile__soon{opacity:1;transition-delay:calc(var(--duration-fast) / 2)}.work__filter--menu{display:none}.work__filter--pinned{display:block}@media (max-width:59.999rem){.work__filter--pinned{display:none}.work__filter--menu{display:block}}.work__filter ul{display:flex;flex-wrap:wrap;gap:var(--space-2xs) var(--space-s);margin:0;padding:0;list-style:none}.work__filter a{display:inline-block;font-family:var(--font-menu);font-size:var(--text-menu);letter-spacing:var(--tracking-menu);color:var(--fg);text-decoration:none;--link-step-dir:1;transition:transform var(--duration-base) var(--ease-out)}.work__filter a:focus-visible{transform:translateX(calc(var(--link-step-dir) * 0.35em))}@media (hover:hover){.work__filter a:hover{transform:translateX(calc(var(--link-step-dir) * 0.35em))}}.work__filter a[aria-current='page']{color:var(--fg-faint)}.work__filter-heading{font-size:var(--text--1);line-height:var(--leading-body);letter-spacing:var(--tracking-label);color:var(--fg);margin-block-end:var(--space-2xs)}.work__filter-empty{font-family:var(--font-menu);font-size:var(--text-menu);letter-spacing:var(--tracking-menu);color:var(--fg-muted)}@media (min-width:60rem){.work__filter--pinned{position:fixed;--filter-cap-top:calc(var(--text--1) * (var(--leading-menu) / 2 - var(--cap-centre-body)));inset-block-start:calc(var(--frame-top) - var(--filter-cap-top));inset-inline-end:var(--page-gutter);z-index:var(--z-sticky);inline-size:max-content;max-inline-size:var(--margin-end)}.work__filter--pinned .work__filter-heading{line-height:var(--leading-menu);margin-block-end:0}.work__filter--pinned ul{flex-direction:column;align-items:start;gap:0;font-family:var(--font-menu);font-size:var(--text-menu);line-height:var(--leading-menu);text-align:start;padding-inline-start:var(--space-xs)}}.work__warning{margin-block:var(--space-s);padding:var(--space-2xs) var(--space-xs);font-size:var(--text--1);letter-spacing:var(--tracking-label);color:var(--fg);border:var(--hairline-width) solid var(--fg)}}@layer overrides{@media (prefers-reduced-motion:reduce){.tile__media::after,.tile__label--hover,.tile__soon{transition:none}}}