.portfolio-page{background:#fafaf8;color:#181818}.portfolio-main{width:90%;max-width:1600px;margin:auto}.portfolio-intro{padding:48px 0 34px}.portfolio-back{font-size:12px;color:#666}.portfolio-title{display:flex;justify-content:space-between;align-items:end;margin:45px 0 26px}.portfolio-title h1{font-size:clamp(76px,10.5vw,156px);line-height:.88;font-weight:500;letter-spacing:-.075em}.portfolio-title h1>span{display:inline-block;font:12px Inter,Arial,sans-serif;vertical-align:top;letter-spacing:0;margin:8px 0 0 16px;color:#777}.portfolio-title>p{font-size:15px;line-height:1.6;letter-spacing:-.02em;padding:0 3px 5px 24px}.portfolio-description{max-width:690px;margin:0 0 8px auto;font-size:clamp(15px,1.3vw,18px);line-height:1.65;letter-spacing:-.015em;color:#484844}.portfolio-toolbar{position:sticky;top:0;z-index:8;background:#fafaf8f5;backdrop-filter:blur(12px);display:flex;align-items:center;justify-content:space-between;border-top:1px solid #d9d9d6;border-bottom:1px solid #d9d9d6;gap:24px;padding:10px 0;margin-bottom:34px}.portfolio-toolbar[hidden]{display:none}.project-filters,.view-options{display:flex;align-items:center;gap:24px}.portfolio-toolbar button{border:0;background:none;cursor:pointer;color:#777;padding:9px 0;font-size:12px;white-space:nowrap;position:relative;min-height:38px}.project-filters button span{font-size:9px;vertical-align:super;margin-left:5px}.portfolio-toolbar button[aria-pressed=true]{color:#151515}.portfolio-toolbar button[aria-pressed=true]::after{content:'';height:1px;background:#181818;position:absolute;left:0;right:0;bottom:2px}.view-options{gap:16px}.project-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:54px 2.2%;align-items:start}.project-card{grid-column:span 4;min-width:0}.project-card[hidden]{display:none!important}.project-card:nth-child(8n+3),.project-card:nth-child(8n+7){margin-top:82px}.project-card a{display:block}.project-image{position:relative;overflow:hidden;background:#eeece7}.project-image img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .65s cubic-bezier(.2,.7,.2,1)}.project-open{position:absolute;bottom:14px;right:14px;background:#fafaf8;color:#181818;width:38px;height:38px;display:grid;place-items:center;border-radius:50%;font-size:21px;opacity:0;transform:translateY(8px);transition:opacity .25s,transform .25s}.project-card a:hover img{transform:scale(1.025)}.project-card a:hover .project-open,.project-card a:focus-visible .project-open{opacity:1;transform:translateY(0)}.project-caption{padding:14px 0 0;display:grid;grid-template-columns:1fr auto;gap:4px 10px;position:relative}.project-caption h2{font-size:16px;line-height:1.35;letter-spacing:-.025em;font-weight:500}.project-caption>span{font-size:10px;color:#777;grid-column:1}.project-caption small{grid-row:1;grid-column:2;font-size:9px;color:#777;padding-top:4px;font-variant-numeric:tabular-nums}.project-grid[data-layout=grid]{gap:40px 2.2%}.project-grid[data-layout=grid] .project-card{grid-column:span 3;margin:0}.project-grid[data-layout=grid] .project-card:nth-child(8n+3),.project-grid[data-layout=grid] .project-card:nth-child(8n+7){margin:0}.project-pagination{display:flex;justify-content:center;align-items:center;gap:18px;margin:54px 0 0}.project-pagination[hidden]{display:none}.project-pagination .page-button{min-width:36px;min-height:40px;border:0;background:transparent;color:#777;font:12px Inter,Arial,sans-serif;cursor:pointer;position:relative}.project-pagination .page-button[aria-current=page]{color:#181818}.project-pagination .page-button[aria-current=page]::after{content:'';position:absolute;bottom:3px;left:3px;right:3px;height:1px;background:#181818}.project-pagination .page-button:disabled{opacity:.3;cursor:default}.project-pagination .page-button:not(:disabled):hover{color:#111}.portfolio-end{display:flex;justify-content:space-between;margin-top:55px;padding:20px 0;border-top:1px solid #d9d9d6;font-size:11px;color:#666}.portfolio-contact{display:flex;justify-content:space-between;align-items:end;gap:35px;padding:72px 0 95px}.portfolio-contact p{font-size:15px;color:#666}.portfolio-contact>a{font-family:Geist,Arial,sans-serif;font-size:clamp(44px,6vw,80px);letter-spacing:-.045em;line-height:1.1}.portfolio-contact>a span{padding-left:40px}#project-viewer{margin:0;padding:0;inset:0;width:100%;height:100dvh;max-width:none;max-height:none;border:0;background:#f6f5f1;color:#181818;overflow:auto}#project-viewer::backdrop{background:#f6f5f1}.viewer-top{height:72px;display:flex;justify-content:space-between;align-items:center;padding:0 5%;border-bottom:1px solid #deddd8}.viewer-brand{font-family:Geist,Arial,sans-serif;font-size:19px;font-weight:600;letter-spacing:-.04em}.viewer-top>span{font-size:11px;font-variant-numeric:tabular-nums}.viewer-close{background:none;border:0;font:12px Inter,Arial,sans-serif;display:flex;align-items:center;gap:18px;padding:12px 0;cursor:pointer}.viewer-close span{font-size:28px;line-height:1}.viewer-stage{position:relative;height:calc(100dvh - 195px);min-height:260px;padding:20px 7%;display:flex;align-items:center;justify-content:center}.viewer-stage>img{width:100%;height:100%;object-fit:contain}.viewer-prev,.viewer-next{position:absolute;top:50%;transform:translateY(-50%);border:1px solid #d8d7d2;border-radius:50%;background:#fafaf8e8;color:#222;width:44px;height:44px;font-size:21px;cursor:pointer}.viewer-prev{left:2%}.viewer-next{right:2%}.viewer-prev:disabled,.viewer-next:disabled{opacity:.25;cursor:default}.viewer-caption{padding:2px 7% 22px;display:flex;justify-content:space-between;gap:24px;align-items:end}.viewer-caption h2{font-size:28px;line-height:1.2;margin-top:7px}.viewer-caption p{font-size:10px;line-height:1.6;color:#777}.viewer-note{text-align:right}.portfolio-page:has(#project-viewer[open]){overflow:hidden}.portfolio-page:has(#project-viewer[open]) .whatsapp{display:none}
@media(hover:none){.project-open{opacity:1;transform:none;width:32px;height:32px;font-size:18px;bottom:10px;right:10px}}
@media(max-width:1100px){.project-grid{grid-template-columns:repeat(12,minmax(0,1fr));gap:42px 2.4%}.project-card{grid-column:span 4}.project-card:nth-child(8n+3),.project-card:nth-child(8n+7){margin-top:60px}.portfolio-title{margin-top:35px}.project-caption h2{font-size:15px}.portfolio-contact{padding:60px 0 75px}}
@media(max-width:640px){.portfolio-main{width:90%}.portfolio-intro{padding-top:30px}.portfolio-title{margin:35px 0 22px;align-items:end}.portfolio-title h1{font-size:18vw}.portfolio-title h1>span{font-size:9px;margin-left:7px}.portfolio-title>p{font-size:10px;line-height:1.5;padding-left:10px}.portfolio-description{font-size:13px;margin:0 0 6px}.portfolio-toolbar{gap:8px;padding:7px 0;margin-bottom:25px;overflow:auto}.project-filters{gap:18px;min-width:max-content}.project-filters button{font-size:11px}.project-filters button span{font-size:8px;margin-left:3px}.view-options{gap:13px;margin-left:auto}.view-options button{font-size:10px}.project-grid{grid-template-columns:repeat(12,minmax(0,1fr));gap:30px 4%}.project-card{grid-column:span 6}.project-card:nth-child(8n+3),.project-card:nth-child(8n+7){margin-top:35px}.project-caption{padding-top:10px}.project-caption h2{font-size:13px}.project-caption>span{font-size:9px}.project-caption small{font-size:8px}.project-grid[data-layout=grid]{gap:25px 4%}.project-grid[data-layout=grid] .project-card{grid-column:span 6}.project-grid[data-layout=grid] .project-caption h2{font-size:13px}.project-pagination{margin-top:35px;gap:10px}.portfolio-end{margin-top:35px;font-size:10px}.portfolio-contact{align-items:start;flex-direction:column;gap:17px;padding:45px 0 60px}.portfolio-contact p{font-size:13px}.portfolio-contact>a{font-size:48px}.viewer-top{height:62px;padding:0 5%}.viewer-brand{font-size:16px}.viewer-top>span{font-size:10px}.viewer-close{font-size:11px;gap:9px}.viewer-stage{height:calc(100dvh - 185px);padding:15px 3%;min-height:240px}.viewer-prev,.viewer-next{top:auto;bottom:-2px;transform:none;width:38px;height:38px}.viewer-caption{padding:16px 5% 20px;align-items:start}.viewer-caption h2{font-size:22px}.viewer-note{max-width:110px;font-size:9px!important}.viewer-prev{left:5%}.viewer-next{right:5%}}
@media(prefers-reduced-motion:reduce){.project-image img,.project-open{transition:none}.project-card a:hover img{transform:none}}
/* Balanced masonry gallery: uniform column widths, natural image ratios. */
#project-grid[data-layout=gallery]{display:block;columns:4;column-gap:2.2%;}
#project-grid[data-layout=gallery] .project-card{display:inline-block;vertical-align:top;width:100%;margin:0 0 38px;break-inside:avoid;}
#project-grid[data-layout=gallery] .project-card:nth-child(8n+3),#project-grid[data-layout=gallery] .project-card:nth-child(8n+7){margin-top:0;}
#project-grid[data-layout=gallery] .project-image{max-height:460px;}
#project-grid[data-layout=gallery] .project-image img{object-fit:cover;}
#project-grid[data-layout=grid]{columns:initial;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));}
.viewer-stage{height:calc(100dvh - 185px);padding:18px 0;overflow:hidden;}
.viewer-track{box-sizing:border-box;width:100%;height:100%;display:flex;align-items:center;overflow-x:auto;overflow-y:hidden;padding:0 38vw;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain;}
.viewer-track::-webkit-scrollbar{display:none;}
.viewer-slide{height:100%;flex:0 0 auto;margin:0 clamp(-54px,-4vw,-18px);display:grid;place-items:center;position:relative;z-index:1;scroll-snap-align:center;scroll-snap-stop:always;opacity:.55;transform:scale(.84);transition:opacity .35s ease,transform .45s cubic-bezier(.2,.7,.2,1);}
.viewer-slide img{display:block;width:auto;height:100%;max-width:74vw;object-fit:contain;box-shadow:0 12px 40px #15151512;user-select:none;-webkit-user-drag:none;}
.viewer-slide.is-active{z-index:3;opacity:1;transform:scale(1);}
.viewer-slide[aria-current=true] img{box-shadow:0 22px 62px #15151522;}
.viewer-prev,.viewer-next{z-index:5;}
@media(max-width:1100px){#project-grid[data-layout=gallery]{columns:3;column-gap:2.4%;}#project-grid[data-layout=gallery] .project-card{margin-bottom:32px;}}
@media(max-width:640px){#project-grid[data-layout=gallery]{columns:2;column-gap:4%;}#project-grid[data-layout=gallery] .project-card{margin-bottom:25px;}#project-grid[data-layout=gallery] .project-image{max-height:420px;}.viewer-stage{height:calc(100dvh - 178px);padding:12px 0;}.viewer-track{padding:0 34vw;}.viewer-slide{margin:0 -22px;}.viewer-slide img{max-width:80vw;}.viewer-prev,.viewer-next{top:50%;bottom:auto;transform:translateY(-50%);width:36px;height:36px;}.viewer-prev{left:3%;}.viewer-next{right:3%;}}
@media(prefers-reduced-motion:reduce){.viewer-slide{transition:none;}}
.portfolio-empty{padding:clamp(64px,12vw,160px) 0;border-top:1px solid #d9d9d6;border-bottom:1px solid #d9d9d6;margin:16px 0 0;}
.portfolio-empty[hidden]{display:none;}
.portfolio-empty p{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:#777;margin-bottom:22px;}
.portfolio-empty h2{font-size:clamp(34px,6vw,76px);font-weight:400;letter-spacing:-.06em;line-height:1;margin-bottom:18px;}
.portfolio-empty span{font-size:14px;color:#666;}
.viewer-slide{aspect-ratio:9/16;width:auto;}
.viewer-slide img{width:100%;height:100%;max-width:none;object-fit:cover;}
@media(max-width:640px){.viewer-slide img{max-width:none;}}
/* Editorial masonry gallery and compact four-up grid. */
.project-grid[data-layout=gallery]{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0 2.2%;align-items:start;columns:initial;}
.project-grid[data-layout=gallery] .gallery-column{display:flex;flex-direction:column;gap:clamp(22px,3.4vw,48px);min-width:0;padding-bottom:32px;transform:translate3d(0,var(--motion-y,0px),0);will-change:transform;}
.project-grid[data-layout=gallery] .gallery-column:nth-child(2){padding-top:clamp(34px,7vw,104px);}
.project-grid[data-layout=gallery] .gallery-column:nth-child(3){padding-top:clamp(12px,3vw,44px);}
.project-grid[data-layout=gallery] .gallery-column:nth-child(4){padding-top:clamp(52px,10vw,146px);}
.project-grid[data-layout=gallery] .project-card{display:block;width:100%;margin:0;break-inside:avoid;grid-column:auto;}
.project-grid[data-layout=gallery] .project-image{max-height:none;}
.project-grid[data-layout=gallery] .project-image img{object-fit:cover;}
.project-grid[data-layout=grid]{display:grid;columns:initial;grid-template-columns:repeat(4,minmax(0,1fr));gap:40px 2.2%;align-items:start;}
.project-grid[data-layout=grid]>.project-card{display:block;grid-column:auto;width:auto;margin:0;break-inside:auto;}
@media(max-width:1100px){.project-grid[data-layout=gallery]{grid-template-columns:repeat(3,minmax(0,1fr));gap:0 2.4%;}.project-grid[data-layout=gallery] .gallery-column:nth-child(4){padding-top:0;}.project-grid[data-layout=grid]{grid-template-columns:repeat(3,minmax(0,1fr));}}
@media(max-width:640px){.project-grid[data-layout=gallery]{grid-template-columns:repeat(2,minmax(0,1fr));gap:0 4%;}.project-grid[data-layout=gallery] .gallery-column{gap:24px;padding-bottom:24px;}.project-grid[data-layout=gallery] .gallery-column:nth-child(2){padding-top:42px;}.project-grid[data-layout=gallery] .gallery-column:nth-child(3),.project-grid[data-layout=gallery] .gallery-column:nth-child(4){padding-top:0;}.project-grid[data-layout=grid]{grid-template-columns:repeat(2,minmax(0,1fr));gap:25px 4%;}}
@media(prefers-reduced-motion:reduce){.project-grid[data-layout=gallery] .gallery-column{transform:none!important;will-change:auto;}}
.viewer-top{height:62px;}
.viewer-stage{height:calc(100dvh - 148px);padding:12px 0;overflow:hidden;}
.viewer-track{scroll-snap-type:x proximity;scroll-snap-stop:normal;scroll-behavior:smooth;}
.viewer-slide{opacity:.42;transform:scale(.88);transition:opacity .8s cubic-bezier(.22,1,.36,1),transform .9s cubic-bezier(.22,1,.36,1);}
.viewer-slide.is-active{opacity:1;transform:scale(1);}
.viewer-slide img{max-height:100%;}
@media(max-width:640px){.viewer-stage{height:calc(100dvh - 158px);padding:10px 0;}.viewer-track{padding:0 34vw;}.viewer-slide{margin:0 -22px;}}
@media(prefers-reduced-motion:reduce){.viewer-track{scroll-behavior:auto;}.viewer-slide{transition:none;}}
/* Explicit ID selectors override the earlier legacy layout declarations. */
#project-grid[data-layout=gallery]{display:grid;columns:initial;grid-template-columns:repeat(4,minmax(0,1fr));gap:0 2.2%;align-items:start;}
#project-grid[data-layout=gallery] .project-card{display:block;}
#project-grid[data-layout=gallery] .project-image{max-height:none;}
#project-grid[data-layout=grid]{display:grid;columns:initial;grid-template-columns:repeat(4,minmax(0,1fr));gap:40px 2.2%;align-items:start;}
#project-grid[data-layout=grid] .project-card{grid-column:auto!important;display:block;width:auto;margin:0;}
@media(max-width:1100px){#project-grid[data-layout=gallery]{grid-template-columns:repeat(3,minmax(0,1fr));gap:0 2.4%;}#project-grid[data-layout=grid]{grid-template-columns:repeat(3,minmax(0,1fr));}}
@media(max-width:640px){#project-grid[data-layout=gallery]{grid-template-columns:repeat(2,minmax(0,1fr));gap:0 4%;}#project-grid[data-layout=grid]{grid-template-columns:repeat(2,minmax(0,1fr));gap:25px 4%;}}
/* Match the approved portfolio intro. */
.portfolio-title{align-items:end;gap:24px}
.portfolio-title>p{flex:0 0 auto;text-align:left;font-size:12px;line-height:1.55;letter-spacing:0;padding:0 3px 6px 24px}
.portfolio-description{max-width:690px}
@media(max-width:640px){.portfolio-title{gap:12px}.portfolio-title>p{font-size:10px;padding:0 0 4px 12px}.portfolio-description{font-size:13px}}
/* The positioned track makes slide offsets deterministic before and after image load. */
.viewer-track{position:relative}
.viewer-slide{background:#e7e5df}
.viewer-slide img{opacity:0;transition:opacity .28s ease}
.viewer-slide.is-loaded img{opacity:1}
.viewer-slide.is-failed img{visibility:hidden}
.viewer-slide.is-failed::after{content:attr(data-error);position:absolute;inset:0;display:grid;place-items:center;color:#777;font-size:11px}
@media(max-width:640px){.portfolio-toolbar{display:flex;flex-wrap:wrap;overflow:visible;row-gap:0;align-items:center}.project-filters{flex:0 0 100%;width:100%;box-sizing:border-box;min-width:0;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none;-webkit-overflow-scrolling:touch;padding-bottom:7px}.project-filters::-webkit-scrollbar{display:none}.view-options{flex:0 0 100%;justify-content:flex-end;margin-left:0;border-top:1px solid #ecebe8;padding-top:7px}}


/* Keep the original carousel motion; dim neighbouring images with a lightweight overlay. */
.viewer-slide{opacity:1;transform:scale(.88);transition:transform .9s cubic-bezier(.22,1,.36,1);}
.viewer-slide.is-active{transform:scale(1);}
.viewer-slide::after{content:'';position:absolute;inset:0;background:rgba(78,78,78,.46);opacity:1;pointer-events:none;transition:opacity .65s cubic-bezier(.22,1,.36,1);}
.viewer-slide.is-active::after{opacity:0;}
.viewer-slide img{transition:opacity .28s ease;}
@media(prefers-reduced-motion:reduce){.viewer-slide,.viewer-slide::after,.viewer-slide img{transition:none;}}

/* Draw the same thin arrow on every platform, without emoji substitution. */
.project-open svg{display:block;width:22px;height:22px;pointer-events:none}
@media(max-width:999px), (hover:none), (pointer:coarse){
 .project-open{opacity:1;transform:none;width:38px;height:38px}
 .viewer-prev,.viewer-next{width:44px;height:44px}
 .viewer-close,.project-pagination .page-button,.portfolio-toolbar button{min-width:44px;min-height:44px}
 .viewer-caption{padding-bottom:max(20px,env(safe-area-inset-bottom))}
 .viewer-caption h2{overflow-wrap:anywhere}
 .viewer-caption>div{min-width:0}
 .viewer-track{overscroll-behavior-x:contain}
}

/* Filter labels keep their full width inside the horizontal touch scroller. */
.project-filters button{flex-shrink:0}
