/* ════════════════════════════════════════════════════════════════
   MITSUKO — gallery grid + lightbox (gallery.html)
   Uniform tiles · uniform fixed-frame lightbox
   ════════════════════════════════════════════════════════════════ */
.gallery-wrap{max-width:1200px;margin:0 auto;padding:0 clamp(16px,4vw,30px) 20px;}
.gallery-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:clamp(12px,2vw,20px);}
.gallery-item{display:block;position:relative;aspect-ratio:3 / 4;overflow:hidden;border-radius:6px;cursor:zoom-in;
  border:1px solid rgba(201,167,102,.14);background:#0d0719;
  transition:transform .35s ease,box-shadow .35s ease,border-color .35s ease;}
.gallery-item img{width:100%;height:100%;object-fit:contain;display:block;transition:transform .6s ease;}
.gallery-item::after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at center,transparent 60%,rgba(7,3,16,.4));opacity:0;transition:opacity .35s ease;pointer-events:none;}
.gallery-item:hover{transform:translateY(-4px);box-shadow:0 16px 38px rgba(0,0,0,.55),0 0 30px rgba(154,111,194,.2);border-color:rgba(201,167,102,.34);}
.gallery-item:hover img{transform:scale(1.045);}
.gallery-item:hover::after{opacity:1;}

/* lightbox — fixed frame so every image opens at the same size */
.lightbox{position:fixed;inset:0;z-index:120;display:none;align-items:center;justify-content:center;padding:clamp(14px,4vw,40px);
  background:rgba(5,2,8,.94);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);}
.lightbox.open{display:flex;animation:lbIn .3s ease;}
@keyframes lbIn{from{opacity:0;}to{opacity:1;}}
.lb-frame{position:relative;height:min(84vh,860px);aspect-ratio:3 / 4;max-width:94vw;
  display:flex;align-items:center;justify-content:center;overflow:hidden;
  border-radius:6px;background:#070310;box-shadow:0 0 60px rgba(154,111,194,.22),0 22px 54px rgba(0,0,0,.6);}
.lb-frame img{max-width:100%;max-height:100%;width:auto;height:auto;display:block;}
.lb-close{position:absolute;top:14px;right:22px;background:none;border:none;color:var(--text-dim);font-size:2.3rem;cursor:pointer;line-height:1;transition:color .3s;font-family:'Cormorant Garamond',serif;z-index:5;}
.lb-close:hover{color:var(--gold-bright);}
.lb-count{position:absolute;left:0;right:0;bottom:18px;text-align:center;font-family:'Cormorant Garamond',serif;color:var(--text-faint);letter-spacing:.2em;font-size:.92rem;}
.lb-nav{position:absolute;top:50%;transform:translateY(-50%);background:rgba(7,3,16,.5);border:1px solid rgba(154,111,194,.25);
  color:var(--text);font-size:2.4rem;width:46px;height:62px;cursor:pointer;display:flex;align-items:center;justify-content:center;
  border-radius:4px;transition:all .3s;font-family:'Cormorant Garamond',serif;line-height:1;padding:0;z-index:5;}
.lb-nav:hover{background:rgba(154,111,194,.18);color:var(--gold-bright);border-color:rgba(154,111,194,.45);}
.lb-prev{left:clamp(8px,3vw,30px);}
.lb-next{right:clamp(8px,3vw,30px);}

@media(max-width:640px){
  .gallery-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px;}
  .lb-nav{width:38px;height:50px;font-size:2rem;}
  .lb-frame{height:min(74vh,640px);}
}
