/* BLACKLOW — interior pages (header, artists, gallery) */

/* ---------- PAGE HEADER ---------- */
.phead{ position:relative; padding:170px 0 60px; overflow:hidden; }
.phead__ghost{ position:absolute; right:-4vw; top:-6vh; font-size:60vh; line-height:.7;
  color:#0c0c0c; pointer-events:none; user-select:none; z-index:0; }
.phead .wrap{ position:relative; z-index:2; }
.phead__title{ font-size:clamp(64px,13vw,200px); line-height:.86; margin:18px 0 26px; }
.phead__sub{ display:flex; justify-content:space-between; align-items:flex-end; gap:30px;
  border-top:1px solid var(--line); padding-top:24px; flex-wrap:wrap; }
.phead__sub .lead{ margin:0; }
.phead__index{ font-family:var(--fmono); font-size:10px; letter-spacing:.2em; color:var(--bone-faint);
  text-transform:uppercase; text-align:right; white-space:nowrap; }

/* ---------- ARTIST ROWS ---------- */
.artist{ display:grid; grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);
  gap:clamp(30px,5vw,80px); align-items:center; padding-block:clamp(60px,9vh,120px);
  border-top:1px solid var(--line); }
.artist:nth-child(even) .artist__media{ order:2; }
.artist__media{ position:relative; }
.artist__media .frame{ aspect-ratio:4/5; }
.artist__media .frame img{ transition:transform 1.6s var(--ease), filter .8s var(--ease); object-position:50% 90%; }
.artist:hover .artist__media .frame img{ transform:scale(1.04); }
.artist__no{ position:absolute; top:-26px; left:-6px; font-family:var(--fmono); font-size:11px;
  letter-spacing:.3em; color:var(--bone-faint); }
.artist__tag{ position:absolute; bottom:-14px; right:14px; background:var(--ink); border:1px solid var(--line);
  font-family:var(--fmono); font-size:9px; letter-spacing:.22em; color:var(--bone-dim);
  padding:8px 12px; text-transform:uppercase; }

.artist__body{ display:flex; flex-direction:column; align-items:flex-start; gap:22px; }
.artist__name{ font-size:clamp(56px,8vw,118px); line-height:.84; }
.artist__role{ font-family:var(--fmono); font-size:11px; letter-spacing:.26em; text-transform:uppercase;
  color:var(--bone-dim); }
.artist__bio{ color:var(--bone-dim); font-weight:300; font-size:clamp(15px,1.35vw,17px);
  line-height:1.75; max-width:46ch; }
.artist__styles{ display:flex; flex-wrap:wrap; gap:8px; }
.chip{ font-family:var(--fmono); font-size:9px; letter-spacing:.16em; text-transform:uppercase;
  color:var(--bone-dim); border:1px solid var(--line); padding:7px 13px; }
.artist__meta{ display:flex; gap:34px; font-family:var(--fmono); font-size:10px;
  letter-spacing:.14em; color:var(--bone-faint); text-transform:uppercase;
  border-top:1px solid var(--line-soft); padding-top:18px; width:100%; }
.artist__meta b{ display:block; color:var(--bone); font-weight:400; font-size:15px; margin-top:5px; letter-spacing:.04em; }

@media (max-width:840px){
  .artist{ grid-template-columns:1fr; gap:34px; }
  .artist:nth-child(even) .artist__media{ order:0; }
  .artist__media .frame{ aspect-ratio:4/4.6; }
}

/* ---------- GALLERY ---------- */
.filters{ display:flex; gap:10px; flex-wrap:wrap; margin-bottom:40px; }
.filter{ font-family:var(--fmono); font-size:10px; letter-spacing:.18em; text-transform:uppercase;
  color:var(--bone-dim); border:1px solid var(--line); padding:10px 16px; background:transparent;
  cursor:pointer; transition:background .3s var(--ease), color .3s var(--ease); }
.filter:hover{ color:var(--bone); }
.filter.active{ background:var(--bone); color:var(--ink); border-color:var(--bone); }

.gal{ columns:4; column-gap:16px; }
.gal__item{ break-inside:avoid; margin-bottom:16px; position:relative; }
.gal__item .ph{ width:100%; }
.gal__item .frame{ padding:7px; }
.gal__cap{ position:absolute; left:14px; bottom:14px; font-family:var(--fmono); font-size:8px;
  letter-spacing:.18em; color:var(--bone-dim); text-transform:uppercase; z-index:3;
  background:rgba(5,5,5,.7); padding:5px 8px; opacity:0; transition:opacity .35s var(--ease); }
.gal__item:hover .gal__cap{ opacity:1; }
@media (max-width:1100px){ .gal{ columns:3; } }
@media (max-width:760px){ .gal{ columns:2; } }
@media (max-width:460px){ .gal{ columns:1; } }

/* ---------- CONTACT STRIP (shared) ---------- */
.strip{ display:grid; grid-template-columns:repeat(3,1fr); gap:30px; border-top:1px solid var(--line);
  padding-top:46px; margin-top:20px; }
.strip h4{ font-family:var(--fmono); font-size:10px; letter-spacing:.24em; text-transform:uppercase;
  color:var(--bone-faint); margin-bottom:14px; }
.strip p{ color:var(--bone-dim); font-size:15px; line-height:1.7; }
@media (max-width:700px){ .strip{ grid-template-columns:1fr; gap:26px; } }