/* Photography page — loaded after styles.css, only here */

/* ===== LIGHT METER (stats readout) ===== */
.meter-row{
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  border:1px solid var(--navy-line);
  border-radius:4px;
  overflow:hidden;
  background:var(--navy-panel);
  margin-top:8px;
}
.meter{
  padding:20px 16px;
  border-left:1px solid var(--navy-line);
  text-align:center;
}
.meter:first-child{ border-left:none; }
.meter .m-num{
  display:block;
  font-family:var(--font-mono);
  font-weight:600;
  font-size:clamp(17px, 2vw, 22px);
  color:var(--gold);
}
.meter .m-label{
  display:block;
  font-family:var(--font-mono);
  font-size:10px;
  letter-spacing:0.08em;
  text-transform:uppercase;
  color:var(--parchment-dim);
  margin-top:6px;
}
.meter-note{
  font-family:var(--font-mono);
  font-size:11px;
  color:var(--parchment-dim);
  margin-top:10px;
  font-style:italic;
}
@media (max-width:680px){
  .meter-row{ grid-template-columns:repeat(2,1fr); }
  .meter:nth-child(3){ border-left:none; }
}

/* ===== CONTACT SHEET GALLERY ===== */
.contact-sheet{
  position:relative;
  padding:22px 0;
  border-top:1px dashed var(--navy-line);
  border-bottom:1px dashed var(--navy-line);
}
.contact-sheet::before,
.contact-sheet::after{
  content:"";
  position:absolute;
  left:0; right:0;
  height:10px;
  background-image:radial-gradient(circle, var(--navy-deep) 3px, transparent 3.5px);
  background-size:22px 10px;
  background-repeat:repeat-x;
}
.contact-sheet::before{ top:-5px; }
.contact-sheet::after{ bottom:-5px; }

.negative-grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:14px;
}
@media (max-width:820px){ .negative-grid{ grid-template-columns:repeat(2, 1fr); } }
@media (max-width:480px){ .negative-grid{ grid-template-columns:1fr; } }

.negative{
  position:relative;
  border:1px solid var(--navy-line);
  background:var(--navy-panel);
  border-radius:3px;
  overflow:hidden;
  transition:border-color .2s ease, transform .2s ease;
}
.negative:hover{ border-color:var(--gold-dim); transform:translateY(-2px); }
.negative .frame{
  position:relative;
  aspect-ratio:4/3;
  background:var(--navy-line);
  overflow:hidden;
}
.negative .frame img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  opacity:0;
  transition:opacity .4s ease;
}
.negative .frame img.loaded{ opacity:1; }
.negative .frame-skeleton{
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  font-family:var(--font-mono);
  font-size:10px;
  color:var(--parchment-dim);
  letter-spacing:0.08em;
}
.negative .cap{
  padding:9px 11px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
}
.negative .frame-no{
  font-family:var(--font-mono);
  font-size:10px;
  color:var(--gold-dim);
  letter-spacing:0.04em;
}
.negative a.view-link{
  font-family:var(--font-mono);
  font-size:10.5px;
  color:var(--gold);
}
.gallery-error{
  font-family:var(--font-mono);
  font-size:12.5px;
  color:var(--parchment-dim);
  padding:16px 0;
}

/* ===== PEXELS CREDIT LINE ===== */
.pexels-credit{
  font-family:var(--font-mono);
  font-size:11.5px;
  color:var(--parchment-dim);
  margin-top:16px;
}
.pexels-credit a{ color:var(--gold-dim); }

/* ===== TAGLINE CARD ===== */
.photo-bio{
  font-family:var(--font-display);
  font-style:italic;
  font-size:19px;
  color:var(--parchment);
  margin:0 0 6px;
}
.photo-loc{
  font-family:var(--font-mono);
  font-size:12px;
  color:var(--parchment-dim);
}