/* User-supplied, permission-confirmed photography. Scene pixels are not retouched. */
.graphite .photo.customer-photo {background:#9ea9b2;isolation:isolate}
.graphite .photo.customer-photo picture {display:block;width:100%;height:100%}
.graphite .photo.customer-photo img {display:block;width:100%;height:100%;object-fit:cover;object-position:var(--photo-position,50% 50%);filter:none}
.graphite .photo.customer-photo[data-letterbox=true] picture {position:absolute;left:0;right:0;top:var(--frame-top);height:var(--frame-height)}
.graphite .photo.customer-photo[data-letterbox=true] img {object-position:50% 50%}
.graphite .photo.customer-photo figcaption {z-index:2;font-size:9px;letter-spacing:.04em;padding:7px 10px;background:#19262ed9}
.graphite .brand-photo .customer-photo figcaption {left:auto;right:15%;bottom:15px}
.graphite .brand-montage .space-inset.customer-photo {border-width:8px}
.graphite .business-feature .customer-photo {box-shadow:19px 19px 0 #d9dfe1}
.construction-gallery {padding:0 7% 90px;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:44px 30px}
.construction-shot {grid-column:span 4;min-width:0;align-self:start}
.construction-shot.shot-1 {grid-column:span 7}
.construction-shot.shot-2 {grid-column:span 5;align-self:end}
.construction-gallery .photo {aspect-ratio:3/4;height:auto;width:100%}
.graphite .construction-gallery .customer-photo {--photo-position:50% 50%!important}
.construction-shot .shot-caption {display:flex;gap:15px;align-items:baseline;border-bottom:1px solid #8298a7;padding:20px 0 22px}
.construction-shot .shot-caption>span {font:11px/1.8 Arial,sans-serif;color:#4c6373}
.construction-shot .shot-caption h2 {font-size:19px;letter-spacing:-.035em;line-height:1.75;font-weight:700}
.construction-shot.shot-1 .shot-caption h2 {font-size:23px}
.photo-gallery-note {margin:0 7% 45px;padding:19px 23px;border-left:3px solid #718b9e;background:#e7ecee;font-size:12px;line-height:2;color:#2c4353}
@media(max-width:900px) {
 .construction-gallery {padding-left:6%;padding-right:6%;gap:33px 23px}
 .construction-shot {grid-column:span 6}
 .construction-shot .shot-caption h2 {font-size:18px}
 .construction-shot.shot-1 .shot-caption h2 {font-size:21px}
}
@media(max-width:760px) {
 .graphite .brand-photo .customer-photo figcaption {right:16%;bottom:14px;font-size:8px;padding:6px 9px}
 .graphite .brand-montage .space-inset.customer-photo {border-width:6px;border-left:0}
 .graphite .photo.customer-photo figcaption {font-size:8px;padding:6px 8px}
 .graphite .business-feature .customer-photo {box-shadow:12px 12px 0 #d9dfe1}
 .construction-gallery {display:block;padding:0 24px 48px}
 .construction-shot {margin-bottom:35px}
 .construction-shot.shot-2 {width:87%;margin-left:auto}
 .construction-shot:nth-child(4n) {width:87%}
 .construction-shot .shot-caption {padding:15px 0 18px;gap:13px}
 .construction-shot .shot-caption h2,.construction-shot.shot-1 .shot-caption h2 {font-size:19px}
 .photo-gallery-note {margin:0 24px 30px;padding:17px 19px;font-size:11px}
}

/* Interior photographs: retain the approved gray design and the original scene. */
.graphite .page-photo.interior-photo {height:auto;aspect-ratio:4/3}
.photo-categories {display:flex;flex-wrap:wrap;gap:16px 32px;padding:0 7% 45px}
.photo-categories a {display:flex;align-items:center;min-height:44px;border-bottom:1px solid #4c6373;font-size:14px;font-weight:700}
.photo-category-heading {padding:0 7% 35px;scroll-margin-top:120px}
.photo-category-heading h2 {font-size:clamp(24px,3vw,36px);line-height:1.5;letter-spacing:-.04em}
.interior-portfolio {padding:80px 7% 72px;background:#e5e8e9;border-top:1px solid #899299;scroll-margin-top:110px}
.portfolio-heading {display:grid;grid-template-columns:1fr 1fr;gap:9%;align-items:end;margin-bottom:54px}
.portfolio-heading h2 {font-size:clamp(32px,4vw,54px);line-height:1.45;letter-spacing:-.05em}
.portfolio-heading>div>p:not(.eyebrow) {font-size:14px;line-height:2;margin:0 0 24px;color:#2f424f}
.portfolio-heading .cta {max-width:360px}
.interior-grid {display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:30px;row-gap:48px;align-items:start}
.interior-shot {min-width:0;grid-column:span 4}
.interior-shot-1 {grid-column:span 8}
.interior-shot-2 {grid-column:span 4;padding-top:68px}
.interior-shot-3 {grid-column:span 7}
.interior-shot-4 {grid-column:span 5;padding:40px 0 0 12%}
.interior-shot-5,.interior-shot-6 {grid-column:span 6}
.photo-enlarge {display:block;position:relative;color:#f5f5f5}
.photo-enlarge:focus-visible {outline:3px solid #1d4f74;outline-offset:6px}
.interior-grid .photo {height:auto;aspect-ratio:3/4;width:100%}
.interior-shot-1 .photo,.interior-shot-3 .photo,.interior-shot-5 .photo,.interior-shot-6 .photo {aspect-ratio:4/3}
.enlarge-mark {position:absolute;right:14px;bottom:14px;width:40px;height:40px;display:grid;place-items:center;background:#1d2226e8;color:#fff;font:22px/1 Arial,sans-serif;border:1px solid #ffffff5c}
.photo-enlarge:hover .enlarge-mark {background:#ff6b2d;color:#1d2226}
.interior-caption {display:flex;gap:16px;align-items:baseline;border-bottom:1px solid #7c8d98;padding:18px 0 20px}
.interior-caption>span {font:11px/1.8 Arial,sans-serif;color:#415562}
.interior-caption h3 {font-size:clamp(16px,1.5vw,21px);font-weight:700;line-height:1.7;letter-spacing:-.035em}
.portfolio-footnote {margin-top:30px;font-size:12px;color:#344953}
@media(max-width:1000px) and (min-width:761px) {
 .interior-grid {gap:36px 22px}
 .interior-shot {grid-column:span 6;padding:0}
 .interior-shot-1,.interior-shot-3 {grid-column:span 12}
 .interior-shot-2 {grid-column:span 6}
 .interior-shot-3 {grid-row:auto}
 .portfolio-heading {gap:30px}
}
@media(max-width:760px) {
 .photo-categories {padding:0 24px 32px;gap:16px 26px}
 .photo-categories a {font-size:12px}
 .photo-category-heading {padding:0 24px 25px;scroll-margin-top:100px}
 .interior-portfolio {padding:45px 24px 46px;scroll-margin-top:90px}
 .portfolio-heading {display:block;margin-bottom:32px}
 .portfolio-heading h2 {font-size:34px}
 .portfolio-heading>div+div {margin-top:24px}
 .portfolio-heading>div>p:not(.eyebrow) {font-size:13px;margin-bottom:20px}
 .portfolio-heading .cta {max-width:none;width:100%;min-height:58px}
 .interior-grid {display:block}
 .interior-shot {padding:0;margin-bottom:32px}
 .interior-shot-2,.interior-shot-4 {width:86%;margin-left:auto}
 .interior-shot-8,.interior-shot-10 {width:86%;margin-right:auto}
 .interior-caption {padding:14px 0 17px;gap:13px}
 .interior-caption h3 {font-size:17px}
 .enlarge-mark {width:36px;height:36px;right:12px;bottom:12px}
 .portfolio-footnote {font-size:11px;line-height:1.8;margin-top:20px}
}