.portfolio-page{padding-top:calc(var(--header-mobile) + 5px);background:var(--paper);color:var(--ink)}
.portfolio-page .portfolio-intro{padding:64px 0 42px}
.portfolio-page .portfolio-intro-grid{display:grid;gap:22px;align-items:end}
.portfolio-page .eyebrow{color:var(--rose-gold)}
.portfolio-page .portfolio-intro .display{font-size:clamp(2.55rem,5.2vw,4.7rem);line-height:1.04;color:var(--forest)}
.portfolio-page .portfolio-intro .lead{max-width:44ch;margin:0}
.portfolio-page .portfolio-hint{display:flex;align-items:center;gap:10px;margin:22px 0 0;color:var(--forest);font-size:.83rem}
.portfolio-page .portfolio-gallery{padding:0 0 68px}
.portfolio-page .portfolio-content .portfolio-grid{display:block;columns:1;column-gap:28px;width:100%;max-width:none;margin:0 0 26px}
.portfolio-page .portfolio-content .portfolio-grid .portfolio-photo,
.portfolio-page .portfolio-content>.portfolio-photo{display:block;break-inside:avoid;width:100%!important;max-width:100%;height:auto;flex:none;margin:0 0 28px;padding:0}
.portfolio-page .portfolio-photo-link{position:relative;display:block;width:100%;height:auto;border-radius:12px;background:var(--cream);cursor:zoom-in}
.portfolio-page .portfolio-content .portfolio-photo img{display:block;position:static;width:100%;max-width:100%;height:auto;aspect-ratio:auto;object-fit:contain;border-radius:12px;margin:0;flex:none}
.portfolio-page .portfolio-content .portfolio-photo figcaption{position:static;display:block;width:auto;max-height:none;margin:0;padding:12px 1px 0;background:none;color:var(--forest);font:inherit;font-size:.9rem;font-weight:600;line-height:1.45;text-align:left;overflow-wrap:anywhere}
.portfolio-page .portfolio-content .portfolio-grid>figcaption{column-span:all;position:static;margin:8px 0 30px;color:var(--muted);font-size:.92rem}
.portfolio-page .portfolio-zoom{position:absolute;right:14px;bottom:14px;display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:var(--warm-white);color:var(--forest);box-shadow:0 3px 14px rgba(0,0,0,.12);pointer-events:none}
.portfolio-page .portfolio-photo-link:hover .portfolio-zoom{background:var(--forest);color:var(--warm-white)}
.portfolio-page a:focus-visible{outline:3px solid var(--forest);outline-offset:4px}
.portfolio-page .portfolio-content>h2,
.portfolio-page .portfolio-content>h3{margin:28px 0 24px;color:var(--forest);font-weight:550;line-height:1.15;letter-spacing:-.025em}
.portfolio-page .portfolio-content>p{max-width:68ch;color:var(--muted)}
.portfolio-page .portfolio-empty{padding:30px 0 50px}
.portfolio-page .portfolio-contact{padding:64px 0;background:var(--forest);color:var(--warm-white)}
.portfolio-page .portfolio-contact-inner{display:grid;gap:26px;align-items:center}
.portfolio-page .portfolio-contact .section-title{font-size:clamp(2rem,4vw,3.4rem)}
.portfolio-page .portfolio-contact .eyebrow{color:var(--accent)}
.portfolio-page .portfolio-contact .lead{margin:18px 0 0;color:var(--warm-white)}
.portfolio-page .portfolio-contact .btn{justify-self:start;gap:12px;min-height:52px;background:var(--warm-white);color:var(--forest)}
.portfolio-page .portfolio-contact a:focus-visible{outline-color:var(--warm-white)}
@media (min-width:680px){
  .portfolio-page .portfolio-content .portfolio-grid{column-count:2}
}
@media (min-width:980px){
  .portfolio-page{padding-top:calc(var(--header-desktop) + 1px)}
  .portfolio-page .portfolio-intro{padding:84px 0 56px}
  .portfolio-page .portfolio-intro-grid{grid-template-columns:1.3fr 1fr;gap:64px}
  .portfolio-page .portfolio-content .portfolio-grid{column-count:3}
  .portfolio-page .portfolio-gallery{padding-bottom:84px}
  .portfolio-page .portfolio-contact{padding:80px 0}
  .portfolio-page .portfolio-contact-inner{grid-template-columns:1fr auto;gap:50px}
}