/* Portfolio projects: original photography, readable captions and quiet space. */
.project-card{display:block;margin-top:42px}
.project-card-image{position:relative;overflow:hidden;background:#e6e4dc;aspect-ratio:16/9}
.project-card-image img{object-position:center 47%;transition:transform .7s ease}
.project-card:hover .project-card-image img{transform:scale(1.025)}
.project-card-open{position:absolute;right:24px;bottom:24px;width:56px;height:56px;display:grid;place-items:center;font-size:28px;color:var(--paper);border:1px solid #ffffffa0;background:#17181528;backdrop-filter:blur(5px)}
.project-card-caption{display:flex;justify-content:space-between;gap:32px;padding-top:24px}
.project-card-caption .eyebrow{color:var(--muted);font-size:16px}
.project-card-caption h3{font:400 clamp(48px,5vw,76px)/1.1 var(--serif);letter-spacing:-.03em;margin-top:9px}
.project-card-meta{display:flex;align-items:flex-end;gap:64px}
.project-card-meta p{font-size:18px;line-height:1.7}
.project-card-meta .text-link{white-space:nowrap;gap:30px;margin-bottom:4px}
.project-nav{display:flex;align-items:center;gap:38px}
.project-back{font-size:18px;white-space:nowrap}
.project-back:hover,.project-return:hover{text-decoration:underline;text-underline-offset:5px}
.project-intro{padding-top:60px}
.project-intro>.eyebrow{color:var(--muted)}
.project-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;margin-top:28px}
.project-heading h1{font-size:clamp(100px,13vw,218px);line-height:.93;letter-spacing:-.055em}
.project-heading h1>span{color:#77776b}
.project-subtitle{font-size:20px;line-height:1.6;padding-right:8%;padding-bottom:10px}
.project-subtitle em{font-size:30px}
.project-details{display:grid;grid-template-columns:1fr 1.25fr 1fr auto;gap:28px;margin:46px 0 38px;padding-top:22px;border-top:1px solid var(--line)}
.project-details dt{font-size:16px;color:var(--muted);letter-spacing:.06em}
.project-details dd{font-size:18px;line-height:1.6;margin:7px 0 0}
.project-photo{background:#e6e4dc;cursor:zoom-in}
.project-photo img{height:auto;object-fit:contain}
.project-photo:hover img{transform:none}
.project-expand{position:absolute;right:20px;bottom:20px;width:44px;height:44px;display:grid;place-items:center;color:white;background:#1718153b;border:1px solid #ffffff80;font-size:25px;backdrop-filter:blur(4px)}
.project-story figcaption{display:flex;align-items:center;justify-content:space-between;gap:16px;font-size:16px;color:var(--muted);padding-top:10px;line-height:1.6}
.project-story-note{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;padding:62px 0 70px}
.project-story-note>p{font-size:24px;line-height:1.5}
.project-story-note em{font-size:38px}
.project-story-note>.small-note{text-align:right}
.project-gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:62px 32px;align-items:start}
.project-frame{min-width:0}
.project-frame-wide{grid-column:1/-1}
.project-end{display:grid;grid-template-columns:1fr auto;align-items:end;gap:40px;margin-top:110px;margin-bottom:80px}
.project-end>div{border-top:1px solid var(--line);padding-top:30px}
.project-end .eyebrow{color:var(--muted)}
.project-end h2{font-size:clamp(54px,6vw,100px);margin-top:25px}
.project-end>.text-link{margin-bottom:7px}
.project-return{font-size:18px;grid-column:1/-1;padding-top:15px}
.project-lightbox #project-counter{font-size:16px;color:#b5b6ac;white-space:nowrap}
.project-lightbox .lightbox-caption h2{font-size:34px}
.project-lightbox .lightbox-caption p{text-transform:none;letter-spacing:.02em}
.project-lightbox-hint{font-size:16px;color:#b5b6ac;line-height:1.6}
@media(max-width:1100px){
 .project-card-meta{gap:30px;flex-direction:column;align-items:flex-start}
 .project-details{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
 .project-subtitle{padding-right:0}
}
@media(max-width:760px){
 .project-card{margin-top:30px}
 .project-card-image{aspect-ratio:3/2}
 .project-card-open{width:44px;height:44px;right:14px;bottom:14px;font-size:24px}
 .project-card-caption{display:block;padding-top:19px}
 .project-card-caption .eyebrow{font-size:16px;letter-spacing:.03em}
 .project-card-caption h3{font-size:55px;margin-top:9px}
 .project-card-meta{margin-top:16px;gap:20px}
 .project-card-meta p{font-size:18px}
 .project-card-meta .text-link{font-size:18px;min-height:44px;gap:48px}
 .project-page .header{gap:18px}
 .project-page .brand-descriptor{display:none}
 .project-nav{gap:22px}
 .project-back{font-size:16px}
 .project-nav .header-plan{font-size:16px;gap:10px;min-height:44px;white-space:nowrap}
 .project-intro{padding-top:36px}
 .project-heading{display:block;margin-top:25px}
 .project-heading h1{font-size:clamp(86px,21vw,144px)}
 .project-subtitle{font-size:18px;margin-top:20px;padding:0}
 .project-subtitle br{display:none}
 .project-subtitle em{font-size:26px;margin-left:5px}
 .project-details{margin:27px 0 28px;gap:22px 20px}
 .project-details dt{font-size:16px;letter-spacing:.03em}
 .project-details dd{font-size:18px;line-height:1.5;margin-top:6px}
 .project-expand{right:12px;bottom:12px}
 .project-story-note{display:block;padding:36px 0 42px}
 .project-story-note>p{font-size:21px}
 .project-story-note em{font-size:32px}
 .project-story-note>.small-note{display:block;text-align:left;margin-top:18px;font-size:16px}
 .project-gallery{gap:34px 20px}
 .project-story figcaption{font-size:16px;padding-top:8px}
 .project-story figcaption>span:last-child{display:none}
 .project-end{display:block;margin-top:66px;margin-bottom:48px}
 .project-end h2{font-size:58px;margin-top:22px}
 .project-end>.text-link{margin-top:29px}
 .project-return{display:block;margin-top:25px;font-size:18px;padding-top:0}
 .project-lightbox .lightbox-top>.eyebrow{max-width:none}
 .project-lightbox .lightbox-caption{padding-top:14px}
 .project-lightbox .lightbox-caption h2{font-size:30px}
 .project-lightbox .lightbox-caption p{font-size:16px}
 .project-lightbox-hint{display:none}
}
@media(max-width:640px){.project-gallery{grid-template-columns:1fr}.project-frame-wide{grid-column:auto}}
@media(max-width:360px){.project-page .header{padding-inline:14px;gap:8px}.project-page .wordmark{font-size:36px}.project-nav{gap:10px}.project-back{font-size:16px}.project-details{grid-template-columns:1fr}.project-heading h1{font-size:80px}.project-end h2{font-size:50px}}
