/* Collection masthead and compact image grid. */
.works-masthead{position:relative;isolation:isolate;padding-top:0;background:#fff;overflow:hidden}
.works-masthead .works-banner{position:relative;inset:auto;width:100%;height:100vh;height:100svh;min-height:0;z-index:0;background:#fff;overflow:hidden}
.works-masthead .works-banner>img{height:100%;object-fit:cover;object-position:center 58%;opacity:1;filter:none;transform:none}
.works-masthead .works-banner:before,.works-masthead .works-banner:after{content:"";position:absolute;inset:calc(100% / 3 * 2) 0 0;pointer-events:none}
.works-masthead .works-banner:before{backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);mask-image:linear-gradient(180deg,transparent,#000);-webkit-mask-image:linear-gradient(180deg,transparent,#000)}
.works-masthead .works-banner:after{background:linear-gradient(180deg,#fff0,#fff)}
.works-page .works-collection{padding-top:24px;padding-bottom:72px;scroll-margin-top:128px}
.works-page .works-toolbar{justify-content:flex-start;padding:0 0 24px;margin-bottom:28px;border-bottom:1px solid var(--line)}
.works-page .works-filters{width:auto;justify-content:flex-start;gap:42px;font-size:18px;line-height:1.6;letter-spacing:1px}
.works-page .works-filters a,.works-page .works-filters span{min-height:48px;display:flex;align-items:center;padding:9px 4px}
.works-page .works-filters [aria-current]:after{bottom:-25px}
.works-page .works-gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;align-items:start}
.works-page .works-gallery>.works-state{grid-column:1/-1}
.works-page .works-card{position:relative;overflow:hidden;background:#e9ece5;isolation:isolate}
.works-page .works-image{height:auto;aspect-ratio:1.55}
.works-page .works-image img{width:100%;height:100%;object-fit:cover}
.works-page .works-caption{position:absolute;inset:auto 0 0;padding:42px 20px 17px;color:#fff;background:linear-gradient(transparent,#142011b8);pointer-events:none}
.works-page .works-caption h2{font-size:15px;font-weight:400;letter-spacing:.3px;line-height:1.6;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-shadow:0 1px 8px #0004}
.works-page .works-caption p{color:#ffffffd9;font-size:11px;line-height:1.6;letter-spacing:1px;margin-top:5px}
.works-page .works-collection .pagination{margin-top:44px}

@media (max-width:1100px){
 .works-masthead{padding-top:0}
 .works-page .works-filters{font-size:17px;gap:30px}
 .works-page .works-caption{padding:32px 14px 13px}
 .works-page .works-caption h2{font-size:14px}
}
@media (max-width:800px){
 .works-page .works-gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
 .works-page .works-filters{width:100%;gap:24px}
 .works-page .works-collection{scroll-margin-top:108px}
}
@media (max-width:600px){
 .works-masthead{padding-top:0}
 .works-masthead .works-banner>img{object-position:60% center}
 .works-page .works-toolbar{padding-bottom:0;border-bottom:0;margin-bottom:24px}
 .works-page .works-filters{gap:8px;font-size:16px;letter-spacing:.5px}
 .works-page .works-filters a,.works-page .works-filters span{padding:10px 12px;min-height:48px;justify-content:flex-start;text-align:left}
 .works-page .works-gallery{grid-template-columns:1fr;gap:16px}
 .works-page .works-image{aspect-ratio:1.55}
 .works-page .works-caption{padding:42px 18px 16px}
 .works-page .works-caption h2{font-size:15px}
 .works-page .works-caption p{font-size:11px}
 .works-page .works-collection{padding-bottom:56px;scroll-margin-top:96px}
 .works-page .works-collection .pagination{margin-top:32px}
}

/* Brand signature on the softened lower edge of the banner. */
.works-banner-brand{position:absolute;z-index:2;left:50%;bottom:5svh;transform:translateX(-50%);width:calc(100% - 40px);display:flex;flex-direction:column;align-items:center;gap:20px;text-align:center;color:#343c30;pointer-events:none}
.works-brand-mark{width:clamp(180px,15vw,230px);aspect-ratio:10/3;overflow:hidden}
.works-brand-mark img{display:block;width:100%;height:auto;filter:brightness(0);opacity:.75}
.works-banner-brand p{font-family:Arial,sans-serif;font-size:13px;font-weight:400;line-height:1.6;letter-spacing:2.5px;white-space:nowrap}

/* Project details are revealed inside the image. */
.works-page .works-card:after{content:"";position:absolute;inset:0;z-index:1;background:rgba(23,29,23,.76);opacity:0;pointer-events:none;transition:opacity .42s ease}
.works-page .works-image img{transition:transform .65s cubic-bezier(.2,.7,.2,1)}
.works-page .works-caption{inset:0;z-index:2;padding:26px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;text-align:center;background:none;opacity:0;transform:translateY(10px);transition:opacity .35s ease,transform .5s cubic-bezier(.2,.7,.2,1)}
.works-page .works-caption h2{max-width:100%;font-size:18px;line-height:1.65;letter-spacing:.5px;white-space:normal;overflow-wrap:anywhere;text-shadow:none;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}
.works-page .works-caption p{display:block;margin:0;color:#f0f2eb;font-size:13px;line-height:1.6;letter-spacing:1.5px}
.works-page .works-caption:after{content:"";display:block;width:70%;max-width:240px;height:1px;margin-top:3px;background:#ffffffb8;transform:scaleX(.4);transition:transform .55s cubic-bezier(.2,.7,.2,1)}
.works-page .works-card:focus-visible:after{opacity:1}
.works-page .works-card:focus-visible .works-caption{opacity:1;transform:translateY(0)}
.works-page .works-card:focus-visible .works-caption:after{transform:scaleX(1)}
.works-page .works-card:focus-visible .works-image img{transform:scale(1.045)}
@media (hover:hover) and (pointer:fine){
 .works-page .works-card:hover:after{opacity:1}
 .works-page .works-card:hover .works-caption{opacity:1;transform:translateY(0)}
 .works-page .works-card:hover .works-caption:after{transform:scaleX(1)}
 .works-page .works-card:hover .works-image img{transform:scale(1.045)}
}
@media (max-width:1100px){
 .works-page .works-caption{padding:20px;gap:8px}
 .works-page .works-caption h2{font-size:16px}
 .works-page .works-caption p{font-size:12px}
}
@media (hover:none), (pointer:coarse){
 .works-page .works-caption{inset:auto 0 0;padding:42px 18px 16px;gap:5px;align-items:flex-start;text-align:left;background:linear-gradient(transparent,#142011bf);opacity:1;transform:none}
 .works-page .works-caption h2{font-size:15px;line-height:1.7;-webkit-line-clamp:2}
 .works-page .works-caption p{font-size:11px;letter-spacing:1px}
 .works-page .works-caption:after{display:none}
 .works-page .works-card:hover .works-image img{transform:none}
}
@media (max-width:600px){
 .works-banner-brand{bottom:5svh;gap:16px}
 .works-brand-mark{width:180px}
 .works-banner-brand p{font-size:11px;letter-spacing:1.8px}
}
@media (prefers-reduced-motion:reduce){
 .works-page .works-caption,.works-page .works-caption:after,.works-page .works-card:after,.works-page .works-image img{transition:none}
 .works-page .works-card:is(:hover,:focus-visible) .works-image img{transform:none}
}

.works-page-title{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}