.portfolio-page .arrow{display:inline-block}.folio-hero{isolation:isolate;color:#fff;background:#3c4245;min-height:clamp(400px,56svh,560px);position:relative;overflow:hidden}.folio-hero-image{z-index:-1;position:absolute;inset:0}.folio-hero-image picture{display:contents}.folio-hero-image img{object-fit:cover;object-position:54% center;filter:saturate(.85)contrast(1.05);width:100%;height:100%}.folio-hero-image:after{content:"";background:linear-gradient(90deg,#080a0ccc,#080a0c80 48%,#080a0c1a),linear-gradient(#0000 50%,#080a0c8c);position:absolute;inset:0}.folio-hero-content{min-height:inherit;flex-direction:column;padding-block:.5rem clamp(1.5rem,1rem + 1.5vw,2.5rem);display:flex;position:relative}.folio-breadcrumb{color:#eef0ef;border-bottom:1px solid #ffffff73;align-items:center;gap:.6rem;min-height:44px;padding-bottom:.4rem;font-size:.82rem;font-weight:600;display:flex}.folio-breadcrumb a{justify-content:center;align-items:center;min-width:44px;min-height:44px;display:inline-flex}.folio-breadcrumb>span[aria-hidden]{color:#c9cfcd}.folio-hero-main{max-width:1320px;margin-top:auto;padding-top:2.5rem}.folio-hero h1{font-size:var(--type-hero);letter-spacing:-.055em;text-transform:uppercase;text-shadow:0 2px 18px #0000004d;margin:0;font-weight:700;line-height:.92}.folio-hero h1 em{color:#e3e7e5;font-style:normal;font-weight:400}.folio-hero h1>span,.folio-hero h1>em{display:inline-block}.folio-hero-bottom{max-width:1110px;margin-top:var(--space-lead);border-top:1px solid #ffffff80;justify-content:space-between;align-items:end;gap:1.25rem 3rem;padding-top:.9rem;display:flex}.folio-hero-bottom p{color:#f1f3f2;max-width:56ch;font-size:var(--type-intro);text-shadow:0 1px 12px #00000059;margin:0;line-height:1.5}.folio-hero-bottom a{border-bottom:1px solid #fff;flex:none;justify-content:space-between;align-items:center;gap:1.2rem;min-width:13rem;min-height:48px;padding-bottom:.5rem;font-weight:700;display:flex}.folio-work{background:var(--surface-paper);color:var(--ink)}.folio-work-top{padding-block:var(--space-section) var(--space-lead)}.folio-work-top h2{font-size:var(--type-h2);letter-spacing:var(--display-tracking);font-weight:700;line-height:var(--display-leading);text-transform:uppercase;margin:0}.folio-filters{z-index:30;top:var(--header-h);border-block:1px solid var(--line-on-light);backdrop-filter:blur(12px);background:#dfe0dff7;justify-content:space-between;align-items:center;gap:1.5rem;min-height:64px;display:flex;position:sticky}.folio-filters[hidden]{display:none}.folio-filters>span{color:var(--ink-muted);font-size:var(--type-meta);letter-spacing:var(--tracking-meta);text-transform:uppercase;white-space:nowrap;font-weight:700}.folio-filters>div{background:var(--line-on-light);align-items:stretch;gap:1px;min-height:48px;display:flex;position:relative}.folio-filters button{background:var(--surface-grey);color:var(--ink);font:inherit;cursor:pointer;transition:background .2s ease, color .2s ease, scale .16s var(--motion-ease);border:0;align-items:center;gap:.7rem;padding:.5rem clamp(.8rem,1.5vw,1.4rem);font-size:.88rem;font-weight:700;display:flex}.folio-filters button small{color:var(--action);font-variant-numeric:tabular-nums;font-size:.72rem}.folio-filters button[aria-pressed=true]{background:#fff}.folio-filters button:active{scale:.97}.folio-filter-indicator{z-index:1;background:var(--action);pointer-events:none;width:0;height:2px;position:absolute;bottom:0;left:0}.folio-filters:not(.has-indicator) button[aria-pressed=true]{box-shadow:inset 0 -2px var(--action)}.folio-filters.has-indicator .folio-filter-indicator.is-ready{transition:translate .32s var(--ease-out-strong), width .32s var(--ease-out-strong)}.folio-case-list{margin-top:0}.folio-case{border-top:1px solid var(--line-on-light);grid-template-columns:minmax(0,1fr) minmax(0,1fr);min-height:clamp(360px,32vw,460px);display:grid}.folio-case:last-child{border-bottom:1px solid var(--line-on-light)}.folio-case[hidden]{display:none!important}.folio-case-media{isolation:isolate;background:#3c4245;min-width:0;min-height:360px;margin:0;position:relative;overflow:hidden}.folio-case-media picture{display:contents}.folio-case-media img{z-index:-2;object-fit:cover;object-position:center;filter:saturate(.85)contrast(1.04);width:100%;height:100%;position:absolute;inset:0}.folio-case-copy{background:var(--surface-paper);flex-direction:column;justify-content:center;align-items:flex-start;gap:1.25rem;min-width:0;padding:clamp(1.5rem,3vw,3rem);display:flex}.folio-case:nth-child(2n) .folio-case-copy{background:var(--surface-grey)}.folio-case-meta{border-bottom:1px solid var(--line-on-light);color:var(--action);font-size:var(--type-meta);letter-spacing:var(--tracking-meta);text-transform:uppercase;justify-content:space-between;align-self:stretch;align-items:flex-start;gap:1rem;padding-bottom:.6rem;font-weight:700;line-height:1.35;display:flex}.folio-case-meta span:last-child{font-variant-numeric:tabular-nums}.folio-case-copy h3{max-width:20ch;font-size:var(--type-h3);letter-spacing:-.035em;text-transform:uppercase;text-wrap:balance;overflow-wrap:break-word;margin:0 0 .75rem;font-weight:700;line-height:1}.folio-case-copy p{max-width:50ch;color:var(--ink-muted);font-size:var(--type-body);margin:0;line-height:1.55}.folio-case-reverse .folio-case-media{order:2}.folio-case-reverse .folio-case-copy{order:1}.folio-more{padding-block:var(--space-section);border-top:1px solid var(--line-on-light);background:var(--surface-grey);color:var(--ink)}.folio-more-inner{grid-template-columns:minmax(0,1.1fr) minmax(250px,.9fr);align-items:end;gap:1.5rem clamp(2rem,5vw,6rem);display:grid}.folio-more h2{font-size:var(--type-h2);letter-spacing:var(--display-tracking);font-weight:700;line-height:var(--display-leading);text-transform:uppercase;margin:0}.folio-more-links{border-top:1px solid var(--line-strong-on-light)}.folio-more-links a{border-bottom:1px solid var(--line-strong-on-light);min-height:56px;font-size:var(--type-h4);letter-spacing:-.02em;text-transform:uppercase;justify-content:space-between;align-items:center;gap:1rem;font-weight:700;display:flex}.folio-more-links a .arrow{color:var(--action)}.folio-hero-bottom a,.underlined-link,.folio-more-links a{transition:scale .16s var(--motion-ease), color var(--motion-fast) ease}.folio-hero-bottom a:active,.underlined-link:active,.folio-more-links a:active{scale:.98}@media (hover:hover) and (pointer:fine){.portfolio-page .arrow{transition:translate .22s var(--motion-ease)}.portfolio-page a:hover .arrow{translate:3px -3px}.folio-hero-bottom a:hover .arrow{translate:3px 3px}.folio-breadcrumb a:hover{text-underline-offset:.3em;text-decoration:underline}.folio-filters button:not([aria-pressed=true]):hover{background:#f4f5f2}.folio-more-links a:hover{color:var(--action)}}@media (prefers-reduced-motion:no-preference){.folio-hero-image img{animation:settle-image 1.1s var(--ease-out-strong) backwards}.folio-case.is-revealed .folio-case-media{animation:reveal-fade .52s var(--ease-out-strong) backwards}.folio-case.is-revealed .folio-case-media img{animation:settle-image .9s var(--ease-out-strong) backwards}.folio-case.is-revealed .folio-case-copy>*{animation:reveal-rise var(--reveal-duration) var(--ease-settle) backwards;animation-delay:calc(.16s + var(--j,0) * 60ms)}.folio-case-meta{--j:0}.folio-case-copy>div{--j:1}.folio-case-copy>.underlined-link{--j:2}.folio-case.is-entering{animation:reveal-rise-soft .48s var(--ease-out-strong) calc(var(--enter-i,0) * 60ms) backwards}}@media (width<=1000px){.folio-hero-bottom{flex-direction:column;align-items:flex-start}.folio-case-meta{flex-wrap:wrap}}@media (width<=760px){.folio-hero{min-height:440px}.folio-hero-image:after{background:linear-gradient(#080a0c26,#080a0c80 50%,#080a0ce0)}.folio-hero h1{font-size:min(var(--type-hero), calc((100vw - 2 * var(--page-gutter)) / (var(--chars) * .56)))}.folio-work-top h2,.folio-more h2{font-size:min(var(--type-h2), calc((100vw - 2 * var(--page-gutter)) / (var(--chars) * .56)))}.folio-filters{flex-direction:column;align-items:stretch;gap:.4rem;padding-block:.5rem}.folio-filters button{flex:1;justify-content:center}.folio-case{flex-direction:column;min-height:0;display:flex}.folio-case-media,.folio-case-reverse .folio-case-media{order:0;height:240px;min-height:240px}.folio-case-copy,.folio-case-reverse .folio-case-copy{padding:1.5rem var(--page-gutter);order:1}.folio-more-inner{grid-template-columns:1fr}}@media (width<=520px){.folio-breadcrumb{gap:.4rem;font-size:.78rem}.folio-filters>span{font-size:.68rem}.folio-filters button{gap:.25rem;padding:.5rem .35rem;font-size:.78rem}}
