/* ---------- THE COLLECTION: real photos pinned on a dark walnut workbench ---------- */
.collection{position:relative;padding:110px 0 120px;overflow:hidden;overflow:clip;
  background:
    radial-gradient(ellipse at 20% 0%,rgba(255,143,86,.10),transparent 55%),
    radial-gradient(ellipse at 85% 100%,rgba(232,178,60,.08),transparent 50%),
    repeating-linear-gradient(92deg,rgba(0,0,0,.18) 0 2px,transparent 2px 9px,rgba(255,255,255,.018) 9px 10px,transparent 10px 23px),
    linear-gradient(180deg,#22170d,#170f08 60%,#120b06);}
.collection:before{content:"";position:absolute;inset:0;pointer-events:none;
  background:repeating-linear-gradient(178deg,rgba(255,255,255,.02) 0 1px,transparent 1px 140px);}
.collection-in{position:relative;z-index:1;max-width:1200px;margin:0 auto;padding:0 24px;}
.collection-head{max-width:760px;margin:0 0 56px;}
.collection-head h2{font-family:var(--display);font-weight:600;font-size:clamp(1.9rem,3.6vw,2.7rem);color:var(--ink);line-height:1.08;margin:0 0 22px;}
.collection-quote{margin:0;padding:0 0 0 22px;border-left:2px solid var(--ember);}
.collection-quote p{font-family:var(--display);font-style:italic;font-weight:500;font-size:clamp(1.25rem,2.4vw,1.7rem);line-height:1.35;color:var(--ink);margin:0;}
.collection-quote cite{display:block;margin-top:12px;font-style:normal;font-family:var(--ui);font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);}

/* masonry columns keep every photo at its natural aspect: nothing is cropped */
.pinboard{display:flex;gap:34px;align-items:flex-start;}
.pin-col{flex:1 1 0;min-width:0;display:flex;flex-direction:column;}
.pin{position:relative;break-inside:avoid;margin:0 0 42px;display:block;
  background:#efe6d6;padding:12px 12px 0;border-radius:2px;
  box-shadow:0 18px 34px -14px rgba(0,0,0,.75),0 2px 0 rgba(255,255,255,.06) inset;
  transform:rotate(var(--r,0deg)) translateY(26px);opacity:0;
  transition:opacity .7s ease var(--d,0s),transform .7s cubic-bezier(.2,.8,.2,1) var(--d,0s),box-shadow .3s ease;}
.pin.in{opacity:1;transform:rotate(var(--r,0deg));}


.pin:before{content:"";position:absolute;top:-9px;left:50%;width:18px;height:18px;margin-left:-9px;border-radius:50%;z-index:2;
  background:radial-gradient(circle at 35% 30%,#fff3cf,#e8b23c 35%,#8a5a12 75%,#4a2f08);
  box-shadow:0 4px 6px rgba(0,0,0,.55);}
.pin:hover,.pin:focus-within{transform:rotate(0deg) scale(1.03);box-shadow:0 30px 50px -16px rgba(0,0,0,.85),0 0 0 1px rgba(255,143,86,.35);z-index:3;transition-delay:0s;}
.pin-open{display:block;width:100%;padding:0;margin:0;border:0;background:#1a120a;cursor:zoom-in;line-height:0;}
.pin-open:focus-visible{outline:3px solid var(--ember-2);outline-offset:3px;}
.pin img{display:block;width:100%;height:auto;}
.pin figcaption{font-family:var(--ui);font-size:.8rem;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:#3b2a1a;padding:11px 4px 13px;text-align:center;}
.pin-flyer figcaption{color:#8a2e14;}

@media (max-width:980px){.pinboard{gap:26px;}}
@media (max-width:600px){
  .collection{padding:80px 0 90px;}
  .collection-in{padding:0 18px;}
  .pinboard{display:block;}
  .pin,.pin:nth-child(3n+2),.pin:nth-child(3n){margin:0 6px 34px;}
}

/* ---------- LIGHTBOX ---------- */
.lightbox{position:fixed;inset:0;z-index:300;display:flex;align-items:center;justify-content:center;padding:56px 70px;
  background:rgba(8,5,3,.94);backdrop-filter:blur(6px);opacity:0;transition:opacity .28s ease;}
.lightbox[hidden]{display:none;}
.lightbox.open{opacity:1;}
.lb-stage{margin:0;max-width:min(1100px,100%);max-height:100%;display:flex;flex-direction:column;align-items:center;
  transform:scale(.92);transition:transform .32s cubic-bezier(.2,.8,.2,1);}
.lightbox.open .lb-stage{transform:scale(1);}
.lb-img{display:block;max-width:100%;max-height:calc(100vh - 150px);width:auto;height:auto;object-fit:contain;border-radius:3px;box-shadow:0 30px 70px rgba(0,0,0,.7);}
.lb-cap{margin-top:16px;font-family:var(--ui);font-size:.86rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-2);text-align:center;}
.lb-close{position:absolute;top:14px;right:18px;width:46px;height:46px;border-radius:50%;border:1.5px solid rgba(243,236,224,.35);background:rgba(28,20,12,.7);color:var(--ink);font-size:28px;line-height:1;cursor:pointer;}
.lb-nav{position:absolute;top:50%;width:48px;height:48px;margin-top:-24px;border-radius:50%;border:1.5px solid rgba(243,236,224,.3);background:rgba(28,20,12,.7);color:var(--ink);cursor:pointer;display:flex;align-items:center;justify-content:center;}
.lb-nav svg{width:22px;height:22px;}
.lb-prev{left:14px;}.lb-next{right:14px;}
.lb-close:hover,.lb-nav:hover{border-color:var(--ember-2);color:var(--ember-2);}
@media (max-width:600px){.lightbox{padding:64px 12px 40px;}.lb-nav{top:auto;bottom:14px;margin-top:0;}.lb-prev{left:calc(50% - 60px);}.lb-next{right:calc(50% - 60px);}.lb-img{max-height:calc(100vh - 190px);}}

@media (prefers-reduced-motion:reduce){
  .pin{transition:none;opacity:1;transform:rotate(var(--r,0deg));}
  .lightbox,.lb-stage{transition:none;}
}

/* heading left, quote right: no empty half beside the head */
.collection-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:18px 56px;align-items:end;max-width:none;}
.collection-head .eyebrow{grid-column:1;}
.collection-head h2{grid-column:1;}
.collection-head .collection-quote{grid-column:2;grid-row:1 / span 2;align-self:end;margin:0;}
@media (max-width:820px){.collection-head{grid-template-columns:1fr;}.collection-head .collection-quote{grid-column:1;grid-row:auto;}}

/* keep each print on its own layer so hover/reveal never re-rasterizes across columns */
.pin{will-change:transform;backface-visibility:hidden;-webkit-backface-visibility:hidden;}
