/* Photography portfolio using the supplied work. */
.portfolio-gallery{padding:90px 4.5% 82px;background:#f4f3ef;color:#111}
.portfolio-heading{display:flex;align-items:end;justify-content:space-between;gap:50px;margin-bottom:42px}
.portfolio-heading h2{font:700 clamp(48px,6.3vw,96px)/.97 Manrope,Arial,sans-serif;letter-spacing:-.07em;margin:18px 0 0}
.portfolio-heading h2 em{font-family:Georgia,serif;font-weight:400;letter-spacing:-.055em}
.portfolio-heading p{max-width:310px;font-size:17px;line-height:1.55;margin:0}
.portfolio-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:clamp(185px,20vw,330px);gap:12px}
.portfolio-frame{position:relative;overflow:hidden;margin:0;background:#ddd}
.portfolio-frame--lead{grid-column:span 2;grid-row:span 2}
.portfolio-frame img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .55s ease}
.portfolio-frame:hover img{transform:scale(1.045)}
.portfolio-frame:after{content:"";position:absolute;inset:55% 0 0;background:linear-gradient(transparent,rgba(0,0,0,.45));pointer-events:none}
.portfolio-frame figcaption{position:absolute;z-index:1;left:16px;bottom:15px;color:white;font-size:11px;font-weight:700;letter-spacing:.16em}
.portfolio-link{display:inline-block;margin-top:28px;border-bottom:1px solid currentColor;padding-bottom:8px;font-size:15px}
.service-photo-story{display:grid;grid-template-columns:1.35fr .9fr .9fr;gap:12px;margin:14px 0 60px}
.service-photo-story figure{height:clamp(250px,32vw,470px);margin:0;overflow:hidden;background:#eee}
.service-photo-story img{display:block;width:100%;height:100%;object-fit:cover}
.service-photo-story figure:nth-child(2) img{object-position:center 35%}
.service-photo-story--opening{margin-top:0;margin-bottom:35px}
@media(max-width:800px){.portfolio-gallery{padding:68px 4.5%}.portfolio-heading{align-items:start;flex-direction:column;gap:20px}.portfolio-grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:clamp(160px,31vw,260px)}.service-photo-story{grid-template-columns:1fr 1fr}.service-photo-story figure:first-child{grid-column:span 2}.service-photo-story figure{height:250px}}
@media(max-width:520px){.portfolio-gallery{padding:56px 4.5%}.portfolio-grid{gap:7px;grid-auto-rows:160px}.portfolio-frame--lead{grid-row:span 2}.portfolio-frame figcaption{font-size:9px;left:10px;bottom:10px}.service-photo-story figure{height:190px}}
