/* Shared photo sections (Works in Iron / Functional Iron) + lightbox.
   Each site sets --gal-accent in :root; everything else uses the site's own
   --bg / --surface / --line / --text / --text-dim tokens and heading fonts. */

.pf{border-top:1px solid var(--line);}
.pf-head{display:flex; justify-content:space-between; align-items:flex-end; gap:24px; flex-wrap:wrap; margin-bottom:52px;}
.pf-head h2{font-size:clamp(28px,3.4vw,42px); max-width:20ch;}
.pf-head p{color:var(--text-dim); max-width:46ch; font-size:15.5px; margin:0;}

.pf-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:28px;}
@media (max-width:900px){ .pf-grid{grid-template-columns:1fr 1fr;} }
@media (max-width:600px){ .pf-grid{grid-template-columns:1fr;} }

.pf-work{display:flex; flex-direction:column; background:var(--surface); border:1px solid var(--line);}
.pf-shot{
  position:relative; display:block; width:100%; padding:0; border:0; margin:0;
  background:#000; cursor:zoom-in; overflow:hidden;
}
.pf-shot img{width:100%; height:100%; object-fit:cover; display:block; transition:transform .5s ease, opacity .2s;}
.pf-shot:hover img{transform:scale(1.03);}
.pf-shot:focus-visible{outline:2px solid var(--gal-accent, var(--text)); outline-offset:2px;}
.pf-main{aspect-ratio:4/5;}

.pf-thumbs{display:grid; grid-template-columns:repeat(4,1fr); gap:6px; padding:6px 6px 0;}
.pf-thumbs .pf-shot{aspect-ratio:1/1;}
.pf-thumbs .pf-shot img{opacity:.8;}
.pf-thumbs .pf-shot:hover img{opacity:1;}

.pf-badge{
  position:absolute; top:12px; left:12px; z-index:2;
  font-size:10px; letter-spacing:.14em; text-transform:uppercase; line-height:1;
  padding:6px 9px; background:rgba(10,10,10,.62); color:#f4f1ea;
  border:1px solid rgba(255,255,255,.35); backdrop-filter:blur(4px);
}
.pf-badge.real{background:var(--gal-accent, #333); color:var(--gal-on-accent, #fff); border-color:transparent;}

.pf-info{padding:20px 22px 24px;}
.pf-info h3{font-size:21px;}
.pf-info .pf-meta{display:block; font-size:12px; letter-spacing:.08em; text-transform:uppercase; color:var(--gal-accent, var(--text-dim)); margin:6px 0 10px;}
.pf-info p{font-size:14px; color:var(--text-dim); margin:0;}

.pf-note{margin-top:28px; font-size:12.5px; color:var(--text-dim);}

/* lightbox */
.lb{position:fixed; inset:0; z-index:200; display:none; align-items:center; justify-content:center; background:rgba(8,8,8,.94);}
.lb.open{display:flex;}
.lb figure{margin:0; max-width:min(92vw,1100px); max-height:88vh; display:flex; flex-direction:column; align-items:center; gap:14px;}
.lb img{max-width:100%; max-height:78vh; object-fit:contain; display:block;}
.lb figcaption{color:#e9e5dc; font-size:14px; text-align:center; font-family:inherit;}
.lb figcaption small{display:block; color:#9d978c; font-size:12px; margin-top:4px; letter-spacing:.06em;}
.lb button{
  position:absolute; background:rgba(255,255,255,.08); color:#fff; border:1px solid rgba(255,255,255,.25);
  width:48px; height:48px; border-radius:50%; font-size:20px; line-height:1; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
}
.lb button:hover{background:rgba(255,255,255,.2);}
.lb .lb-close{top:20px; right:20px;}
.lb .lb-prev{left:20px; top:50%; transform:translateY(-50%);}
.lb .lb-next{right:20px; top:50%; transform:translateY(-50%);}
@media (max-width:600px){ .lb .lb-prev,.lb .lb-next{top:auto; bottom:20px; transform:none;} }