/* Work page only. Shared palette, typefaces, controls, header/footer and gallery
   come from styles.css; these rules never affect the homepage. */
.portfolio-page nav a[aria-current="page"]{border-bottom:1px solid var(--olive);color:var(--paper)}
.portfolio-intro{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.57fr);gap:22px 8%;align-items:end;padding-block:64px 48px}
.portfolio-intro>.meta{grid-column:1/-1;font-size:12px;letter-spacing:1.5px}
.portfolio-intro h1{font-size:clamp(64px,5.2vw,104px);line-height:1.04;letter-spacing:-3.8px;font-weight:400}
.portfolio-lead{font-size:18px;line-height:1.75;color:var(--secondary);max-width:355px;padding-bottom:6px}
.portfolio-catalogue{padding-bottom:76px}
.portfolio-page .filter-row{margin-bottom:30px;min-width:0}
.portfolio-page .filters{flex-wrap:wrap;gap:12px 27px}
.portfolio-page .filter{font-size:14px;min-height:46px}
.portfolio-page .work-count{font-size:11px}
/* Same native sticky positioning and stacking order as Services; no fixed clone. */
.portfolio-navigation{position:sticky;top:0;z-index:8;background:var(--dark);margin-bottom:30px}
.portfolio-page .portfolio-navigation .filter-row{margin-bottom:0}
.portfolio-page .portfolio-grid,.portfolio-page .portfolio-grid.filtered{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:54px 28px;position:static;width:100%;height:auto;overflow:visible;padding:0;max-width:100%}
.portfolio-page .project:nth-child(n){position:static;grid-column:auto;grid-row:auto;width:auto;min-width:0;left:auto;top:auto;margin:0;flex:none}
.portfolio-page .project .media-slot{width:100%;aspect-ratio:16/9;min-height:0;height:auto;max-height:none}
.portfolio-page .project .media-slot img{object-fit:cover}
.portfolio-page .project-caption{margin-top:17px;gap:20px}
.portfolio-page .project-caption h2{font-size:clamp(21px,1.45vw,28px);line-height:1.25;letter-spacing:-.55px;font-weight:400}
.portfolio-page .project-caption p{font-size:12px;letter-spacing:.3px;margin-top:7px}
.portfolio-page .project-caption>.meta{font-size:11px;padding-top:4px}
.portfolio-page .open-project{width:44px;height:44px}
@media(max-width:1100px){.portfolio-intro{grid-template-columns:1fr .65fr;gap:20px 5%;padding-block:48px 38px}.portfolio-intro h1{font-size:64px;letter-spacing:-2.6px}.portfolio-lead{font-size:16px}.portfolio-page .filter-row{gap:15px}.portfolio-page .filters{gap:8px 20px}.portfolio-page .filter{font-size:13px}.portfolio-page .work-count{font-size:10px}.portfolio-page .portfolio-grid,.portfolio-page .portfolio-grid.filtered{gap:40px 22px}}
@media(max-width:767px){.portfolio-intro{display:block;padding-block:36px 29px}.portfolio-intro>.meta{font-size:11px;letter-spacing:1px;margin-bottom:19px}.portfolio-intro h1{font-size:54px;line-height:1.05;letter-spacing:-2.2px}.portfolio-lead{font-size:16px;line-height:1.65;padding:0;margin-top:21px;max-width:330px}.portfolio-catalogue{padding-bottom:40px}.portfolio-page .filter-row{display:block;margin-bottom:23px;padding-top:11px}.portfolio-page .filters{display:flex;flex-wrap:wrap;gap:4px 9px;overflow:visible;padding:0}.portfolio-page .filter{font-size:13px;min-height:46px;padding:10px 9px}.portfolio-page .work-count{display:block;font-size:10px;letter-spacing:.3px;margin-top:15px}.portfolio-page .portfolio-grid,.portfolio-page .portfolio-grid.filtered{display:grid;grid-template-columns:minmax(0,1fr);gap:34px;width:100%;overflow:visible;scroll-snap-type:none}.portfolio-page .project .media-slot{aspect-ratio:4/3}.portfolio-page .project-caption{margin-top:14px;gap:15px}.portfolio-page .project-caption h2{font-size:22px;letter-spacing:-.6px}.portfolio-page .project-caption p{font-size:12px;line-height:1.55;margin-top:5px}.portfolio-page .project-caption>.meta{font-size:10px}.portfolio-page .open-project{width:38px;height:38px;bottom:14px;right:14px}}
@media(max-width:360px){.portfolio-intro h1{font-size:48px}.portfolio-page .filter{font-size:12px;padding-inline:8px}.portfolio-page .filters{column-gap:6px}.portfolio-page .project-caption h2{font-size:20px}}
@media(max-width:767px){
  .portfolio-navigation{margin-bottom:23px}
  .portfolio-page .portfolio-navigation .filter-row{padding-top:0}
  .portfolio-page .portfolio-navigation .filters{flex-wrap:nowrap;overflow-x:auto;overscroll-behavior-inline:contain;scroll-padding-inline:3px;padding:4px 3px 6px;scrollbar-width:none}
  .portfolio-page .portfolio-navigation .filter{flex:none}
  .portfolio-page .portfolio-navigation .portfolio-context{display:grid;grid-template-columns:auto minmax(0,1fr);margin-top:0;gap:8px}
  .portfolio-page .portfolio-navigation .work-count{white-space:nowrap}
  .portfolio-page .portfolio-navigation .portfolio-services-link{gap:8px;min-width:0;min-height:44px;padding-block:0;white-space:normal}
}

/* Compact closing invitation, exclusive to the Work page. */
.portfolio-cta{display:flex;justify-content:space-between;align-items:center;gap:32px;border-block:1px solid var(--line);padding-block:28px;margin-bottom:40px}
.portfolio-cta-copy{min-width:0}
.portfolio-cta .meta{font-size:11px;letter-spacing:1.3px;margin-bottom:10px}
.portfolio-cta h2{font-size:36px;line-height:1.15;letter-spacing:-1.2px;font-weight:400}
.portfolio-cta-description{font-size:16px;line-height:1.7;color:var(--secondary);margin-top:10px}
.portfolio-cta .text-link{flex-shrink:0;font-size:16px;min-width:210px;min-height:48px;border-bottom-color:var(--olive)}
.portfolio-cta .text-link:hover{color:var(--olive)}
@media(max-width:767px){.portfolio-cta{flex-direction:column;align-items:flex-start;gap:20px;padding-block:25px;margin-bottom:28px}.portfolio-cta h2{font-size:30px;line-height:1.15;letter-spacing:-.85px}.portfolio-cta-description{font-size:15px;line-height:1.65;margin-top:10px}.portfolio-cta .text-link{font-size:15px;min-width:200px}}