.projects-index .index-shell{max-width:1600px;margin:0 auto;padding:0 var(--margin)}
.projects-index .index-intro{padding:72px 0 64px}
.projects-index .index-eyebrow{font-size:12px;letter-spacing:.06em;color:#77736D;margin:0 0 32px}
.projects-index h1{font-size:clamp(64px,9vw,136px);font-weight:400;line-height:1;letter-spacing:-.065em;margin:0 0 34px}
.projects-index .index-introduction{max-width:650px;font-size:clamp(18px,2vw,25px);line-height:1.5;letter-spacing:-.02em;color:#77736D;margin:0}
.projects-index .index-filterbar{border-top:1px solid #D9D3C8;border-bottom:1px solid #D9D3C8;padding:20px 0;display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:44px}
.projects-index .index-filters{display:flex;flex-wrap:wrap;gap:8px}
.projects-index [hidden]{display:none!important}
.projects-index .index-filters button{border:1px solid #D9D3C8;border-radius:0;background:#F4F1EA;color:#191919;padding:11px 15px;font-size:13px;min-height:44px;transition:background 250ms ease,color 250ms ease,border-color 250ms ease}
.projects-index .index-filters button:hover{border-color:#191919}
.projects-index .index-filters button[aria-pressed=true]{background:#191919;color:#F4F1EA;border-color:#191919}
.projects-index .index-count{font-size:12px;color:#77736D;white-space:nowrap;margin:0}
.projects-index .index-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:64px 28px}
.projects-index .index-project{min-width:0;display:block}
.projects-index .index-project-image{aspect-ratio:4/3;overflow:hidden;background:#F4F1EA;display:flex;align-items:center;justify-content:center}
.projects-index .index-project-image img{display:block;width:100%;height:100%;object-fit:contain;transition:transform 400ms cubic-bezier(.22,1,.36,1)}
.projects-index .index-project:hover img,.projects-index .index-project:focus-visible img{transform:scale(1.03)}
.projects-index .index-project-caption{display:grid;grid-template-columns:27px minmax(0,1fr) 24px;gap:12px;padding:20px 0 22px;border-bottom:1px solid #D9D3C8;align-items:start}
.projects-index .index-project-number{font-size:12px;color:#77736D;padding-top:7px}
.projects-index .index-project h2{font-size:clamp(23px,2.5vw,36px);font-weight:400;letter-spacing:-.04em;line-height:1.15;margin:0}
.projects-index .index-project-caption p{font-size:12px;color:#77736D;margin:10px 0 0;line-height:1.7}
.projects-index .index-project-arrow{font-size:25px;opacity:0;transform:translate(-3px,3px);transition:opacity 300ms ease,transform 300ms ease}
.projects-index .index-project:hover .index-project-arrow,.projects-index .index-project:focus-visible .index-project-arrow{opacity:1;transform:translate(0,0)}
.projects-index .index-project-pending{display:block;font-size:11px;color:#77736D;margin-top:8px}
.projects-index .index-asset-pending{display:flex;align-items:center;justify-content:center;border:1px solid #D9D3C8;width:100%;height:100%;font-size:13px;color:#77736D;margin:0}
.projects-index .index-contact{margin-top:110px;padding:60px 0 80px;border-top:1px solid #D9D3C8}
.projects-index .index-contact>a{display:flex;justify-content:space-between;align-items:center;gap:24px}
.projects-index .index-contact h2{font-size:clamp(40px,6.5vw,94px);letter-spacing:-.055em;font-weight:400;line-height:1.08;margin:0}
.projects-index .index-contact>a>span{font-size:clamp(38px,5vw,64px);transition:transform 300ms ease}
.projects-index .index-contact>a:hover>span,.projects-index .index-contact>a:focus-visible>span{transform:translate(5px,-5px)}
@media(max-width:1050px){.projects-index .index-filterbar{align-items:flex-start;flex-direction:column;gap:16px}.projects-index .index-grid{gap:48px 24px}}
@media(max-width:700px){.projects-index .index-intro{padding:44px 0}.projects-index h1{font-size:clamp(48px,12vw,78px)}.projects-index .index-eyebrow{font-size:11px;margin-bottom:24px}.projects-index .index-grid{grid-template-columns:1fr;gap:36px}.projects-index .index-project h2{font-size:28px}.projects-index .index-filterbar{margin-bottom:32px}.projects-index .index-filters{gap:8px}.projects-index .index-filters button{font-size:12px;padding:10px 12px}.projects-index .index-contact{margin-top:64px;padding:40px 0 50px}.projects-index .index-contact h2{font-size:44px}}
@media(hover:none){.projects-index .index-project-arrow{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.projects-index .index-project-image img,.projects-index .index-project-arrow,.projects-index .index-contact>a>span{transition:none;transform:none!important}}
