.portfolio-page{overflow:hidden;background:var(--atelier-paper)}
.portfolio-intro{position:relative;padding:clamp(70px,10vw,145px) clamp(24px,9vw,140px) clamp(55px,7vw,95px);background:#111318;color:#fff}.portfolio-intro .eyebrow{color:#d5d9e2}.portfolio-intro .eyebrow span{color:#aab4ff}.portfolio-intro h1{max-width:950px;margin:20px 0 0;font:500 clamp(62px,10vw,142px)/.83 'Space Grotesk',Arial,sans-serif;letter-spacing:-.095em}.portfolio-intro h1 em{font-style:normal;color:#aab4ff}.portfolio-intro>p:not(.eyebrow){max-width:560px;margin:26px 0 0;color:#d0d4de;font-size:17px;line-height:1.7}.portfolio-count{display:block;margin-top:36px;color:#aab4ff;font:10px 'IBM Plex Mono',monospace;letter-spacing:.14em}
.portfolio-wall{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));grid-auto-rows:clamp(58px,7vw,100px);gap:12px;padding:12px clamp(12px,2vw,28px) clamp(70px,9vw,120px);background:#e9ebf0}.portfolio-card{position:relative;grid-column:span 4;grid-row:span 4;min-width:0;margin:0;overflow:hidden;background:#d5d8df}.portfolio-card img{width:100%;height:100%;object-fit:cover;transition:transform .75s cubic-bezier(.2,.8,.2,1),filter .4s}.portfolio-card:hover img{transform:scale(1.035);filter:saturate(1.05)}.portfolio-card:after{content:"";position:absolute;inset:35% 0 0;background:linear-gradient(0deg,rgba(12,14,18,.85),transparent);pointer-events:none}.portfolio-card figcaption{position:absolute;z-index:1;right:20px;bottom:18px;left:20px;display:grid;gap:7px;color:#fff}.portfolio-card figcaption span{color:#ccd4ff;font:10px 'IBM Plex Mono',monospace;letter-spacing:.12em}.portfolio-card figcaption strong{font:500 clamp(18px,2vw,27px)/1.1 'Space Grotesk',Arial,sans-serif}.portfolio-card--wide{grid-column:span 8;grid-row:span 5}.portfolio-card--portrait{grid-column:span 4;grid-row:span 6}.portfolio-card--portrait img{object-position:center 24%}.portfolio-card--square{grid-column:span 4;grid-row:span 4}.portfolio-card--tall{grid-column:span 4;grid-row:span 6}.portfolio-card--tall img{object-position:center 40%}.portfolio-card--wide img{object-position:center 43%}
.portfolio-filters{display:flex;flex-wrap:wrap;gap:8px;padding:24px clamp(12px,2vw,28px) 6px;background:#e9ebf0}.portfolio-filters button{min-height:42px;padding:0 16px;border:1px solid #c4c9d4;background:transparent;color:#303541;font:10px 'IBM Plex Mono',monospace;letter-spacing:.03em;cursor:pointer;transition:background .18s ease,color .18s ease,border-color .18s ease}.portfolio-filters button:hover{border-color:#111318}.portfolio-filters button[aria-pressed=true]{border-color:#111318;background:#111318;color:#fff}.portfolio-filters button:focus-visible{outline:3px solid var(--atelier-blue);outline-offset:3px}.portfolio-filter-status{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.portfolio-card[hidden]{display:none!important}
.portfolio-next{padding:clamp(68px,9vw,120px) clamp(24px,9vw,140px);background:#f7f8fa;color:#111318}.portfolio-next .eyebrow{color:#57606e}.portfolio-next h2{margin:18px 0 0;font:500 clamp(52px,7.5vw,98px)/.9 'Space Grotesk',Arial,sans-serif;letter-spacing:-.085em}.portfolio-next h2 em{font-style:normal;color:var(--atelier-blue)}.portfolio-next>div{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;max-width:1040px;margin-top:34px;background:#cbd0dc}.portfolio-next>div>a{display:flex;justify-content:space-between;gap:16px;padding:21px;background:#fff;color:#111318;font:500 11px 'IBM Plex Mono',monospace;text-decoration:none}.portfolio-next>div>a:hover{background:#111318;color:#fff}.portfolio-next>div>a span{color:var(--atelier-blue)}.portfolio-footer{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;padding:24px clamp(24px,5vw,76px);background:#111318;color:#b9bfca;font:10px 'IBM Plex Mono',monospace}.portfolio-footer nav{display:flex;flex-wrap:wrap;gap:17px}.portfolio-footer a{color:#e4e7ee;text-decoration:none}.portfolio-footer a:hover{color:#aab4ff}
@media(max-width:850px){.portfolio-wall{grid-auto-rows:clamp(55px,9vw,78px);gap:8px}.portfolio-card--wide{grid-column:span 8}.portfolio-card--portrait{grid-column:span 4}.portfolio-card--square,.portfolio-card--tall{grid-column:span 6}.portfolio-card--square{grid-row:span 4}.portfolio-card--tall{grid-row:span 5}}
@media(max-width:600px){.portfolio-intro{padding:64px 20px 45px}.portfolio-intro h1{font-size:clamp(55px,14.5vw,78px)}.portfolio-intro>p:not(.eyebrow){margin-top:18px;font-size:15px}.portfolio-count{margin-top:25px;font-size:9px}.portfolio-filters{flex-wrap:nowrap;overflow-x:auto;padding:18px 12px 8px;scrollbar-width:thin;-webkit-overflow-scrolling:touch}.portfolio-filters button{flex:none;min-height:44px;padding:0 13px}.portfolio-wall{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:115px;gap:6px;padding:6px 6px 64px}.portfolio-card,.portfolio-card--square{grid-column:span 1;grid-row:span 3}.portfolio-card--wide{grid-column:span 2;grid-row:span 4}.portfolio-card--portrait{grid-column:span 1;grid-row:span 4}.portfolio-card--tall{grid-column:span 1;grid-row:span 4}.portfolio-card figcaption{right:10px;bottom:10px;left:10px;gap:5px}.portfolio-card figcaption span{font-size:8px;letter-spacing:.06em}.portfolio-card figcaption strong{font-size:17px}.portfolio-next{padding:64px 20px}.portfolio-next h2{font-size:clamp(48px,12.5vw,70px)}.portfolio-next>div{grid-template-columns:1fr;margin-top:25px}.portfolio-next>div>a{padding:18px;font-size:10px}.portfolio-footer{align-items:flex-start;flex-direction:column;padding:22px 20px}.portfolio-footer nav{gap:14px}.portfolio-footer nav a{font-size:9px}}