/* One category column beside five project columns on desktop. */
.projects-gallery-page main{background:#fff;min-height:65vh}
.projects-gallery-page .page-intro{padding:32px 3.5% 26px;background:transparent;border:0;display:flex;align-items:baseline;justify-content:center;gap:20px;text-align:center}
.projects-gallery-page .page-intro .page-back{display:none}
.projects-gallery-page .page-intro p{font-size:10px;letter-spacing:2px;margin:0;order:2}
.projects-gallery-page .page-intro h1{font-size:32px;line-height:1.4;margin:0;color:#f76200}
.projects-gallery-page .work{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));column-gap:22px;align-items:start;padding:0 3.5% 64px;background:transparent;border:0}
.projects-masonry{grid-column:2/-1;grid-row:1;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:28px 22px;align-items:start;min-width:0}
.projects-masonry .project,.projects-masonry .project.offset{margin:0;min-width:0;align-self:start;background:transparent;text-align:center}
.projects-masonry .project-image{height:auto;max-height:none;aspect-ratio:4/3;background:#e9e9e7;border-radius:0;overflow:hidden}
.projects-masonry .project-image img{display:block;width:100%;height:100%;object-fit:cover}
.projects-masonry .project-caption{display:block;padding:10px 0 0;border:0;text-align:center}
.projects-masonry .project-caption strong{display:block;font-size:12px;line-height:1.6;font-weight:400;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;letter-spacing:0}
.projects-masonry .project-caption>span{display:none}
.projects-masonry .open-icon{width:30px;height:30px;opacity:0;transition:opacity .2s}
.projects-masonry .project:hover .open-icon,.projects-masonry .project:focus-visible .open-icon{opacity:1}

@media(max-width:1000px){.projects-gallery-page .work{grid-template-columns:repeat(4,minmax(0,1fr));column-gap:16px}.projects-masonry{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px 16px}}
@media(max-width:600px){.projects-gallery-page .work{grid-template-columns:106px minmax(0,1fr);column-gap:14px}.projects-masonry{grid-template-columns:minmax(0,1fr);gap:22px}.projects-gallery-page .page-intro{padding:28px 5% 22px;display:block}.projects-gallery-page .page-intro p{margin-top:8px}.projects-gallery-page .page-intro h1{font-size:28px}.projects-gallery-page .work{padding-inline:5%}.projects-masonry .project-caption strong{font-size:11px}}

.project-filters{grid-column:1;grid-row:1;display:flex;flex-direction:column;align-items:flex-start;gap:12px;margin:0;min-width:0}
.project-filters button{max-width:100%;text-align:left;border:1px solid #d8d8d5;border-radius:999px;background:transparent;color:#555;padding:10px 18px;font-size:14px;line-height:1.5;cursor:pointer;transition:color .18s,background-color .18s,border-color .18s}
.project-filters button:hover{border-color:#f76200;color:#f76200}
.project-filters button[aria-pressed="true"]{background:transparent;border-color:#f76200;color:#f76200}
.project-filters button:focus-visible{outline:2px solid #f76200;outline-offset:3px}
.projects-masonry .project[hidden],.project-filters[hidden],.projects-empty[hidden]{display:none}
.projects-empty{grid-column:2/-1;grid-row:1;margin:0;padding:80px 20px;text-align:center;font-size:16px;line-height:1.8;color:#777}
.projects-status{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
@media(max-width:600px){.project-filters{gap:8px}.project-filters button{font-size:12px;padding:9px 12px}.projects-empty{padding:56px 12px;font-size:14px}}
@media(prefers-reduced-motion:reduce){.project-filters button{transition:none}}

.projects-contact{padding:0 3.5% 64px}
.projects-contact-button{display:flex;align-items:center;justify-content:space-between;gap:24px;width:100%;min-height:128px;padding:28px 40px;border:1px solid #f76200;border-radius:5px;background:transparent;color:#f76200;text-align:left;font-size:32px;line-height:1.5;cursor:pointer;transition:background-color .2s,color .2s}
.projects-contact-button svg{flex:none;width:36px;height:36px}
.projects-contact-button:hover{background:#f76200;color:#fff}
.projects-contact-button:focus-visible{outline:2px solid #f76200;outline-offset:5px}
@media(max-width:600px){.projects-contact{padding:0 5% 40px}.projects-contact-button{min-height:96px;padding:24px;font-size:24px}.projects-contact-button svg{width:28px;height:28px}}
@media(prefers-reduced-motion:reduce){.projects-contact-button{transition:none}}

/* The gallery title belongs with its category navigation. */
.projects-gallery-page .work{padding-top:32px}
.projects-sidebar{grid-column:1;grid-row:1;min-width:0}
.projects-gallery-page .projects-sidebar .page-intro{display:flex;flex-direction:column;align-items:flex-start;gap:8px;text-align:left;padding:0;margin:0 0 28px}
.projects-gallery-page .projects-sidebar .page-intro h1{font-size:28px;order:0}
.projects-gallery-page .projects-sidebar .page-intro p{font-size:9px;letter-spacing:1.2px;order:1;margin:0;line-height:1.8}
@media(max-width:600px){.projects-gallery-page .work{padding-top:28px}.projects-gallery-page .projects-sidebar .page-intro h1{font-size:21px}.projects-gallery-page .projects-sidebar .page-intro p{font-size:8px;letter-spacing:.6px}.projects-gallery-page .projects-sidebar .page-intro{margin-bottom:22px}}

/* Vertical line navigation for project categories. */
.project-filters{gap:0}
.project-filters button{border:0;border-left:1px solid #dededb;border-radius:0;padding:14px 18px;background:transparent}
.project-filters button:hover{border-left-color:#f76200;background:transparent}
.project-filters button[aria-pressed="true"]{border:0;border-left:3px solid #f76200;padding-left:16px;background:transparent;color:#f76200}

.projects-gallery-page .projects-sidebar{position:relative;left:10px}
