/* site/varlik/mekanda.css — «Mekânda Gör» kart üstü oda görünümü (mekanda.js).
 * Yalnız `#srgEserler[data-mekanda="1"]` olan sergide yüklenir.
 * > `.eser-k img` kuralları (12px dolgu, 320px tavan, hover dönüşümü)
 * > odadaki eser görseline de biner; `.mh-eser img` hepsini sıfırlar. */
.eserler[data-mekanda="1"] .eser-k.mh-var{position:relative}
.mh-sahne{position:absolute;z-index:2;overflow:hidden;opacity:0;pointer-events:none;
  background:#e3e2e8;transition:opacity .42s ease,transform .45s ease;
  box-shadow:0 26px 60px rgba(29,42,68,.22)}
.eser-k.mh-goster .mh-sahne{opacity:1}
@media (hover:hover){.eser-k.mh-var:hover .mh-sahne{transform:scale(1.03) translateY(-4px)}}
.mh-oda{position:absolute;background-size:100% 100%;background-repeat:no-repeat;isolation:isolate}
/* Çıplak tuval, duvardan ~2 cm önde (1em = 1 cm). Gölge katmanları:
 * geniş yumuşak düşen gölge + kenara yapışık temas gölgesi. */
.mh-eser{position:absolute;box-sizing:border-box;
  box-shadow:1.7em 2.1em 2.2em -.5em rgba(28,22,18,.42),
             .7em .9em .8em -.1em rgba(28,22,18,.30),
             .18em .24em .2em rgba(28,22,18,.28)}
.eserler .eser-k .mh-eser img{position:relative;width:100%;height:100%;max-width:none;max-height:none;
  object-fit:cover;display:block;padding:0;margin:0;background:none;box-shadow:none;
  transform:none!important;transition:none}
/* Ön yüzde ışık: pencere solda — sol hafif aydınlık, sağ hafif gölgeli;
 * üst kenarda ince parlama, alt kenarda ince koyuluk (kalınlık hissi). */
.mh-eser::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(100deg,rgba(255,255,255,.10),rgba(255,255,255,0) 35%,rgba(0,0,0,.07)),
             linear-gradient(180deg,rgba(255,255,255,.18),rgba(255,255,255,0) .14em,rgba(0,0,0,0) calc(100% - .16em),rgba(0,0,0,.22));}
/* Sol yan yüz: tuval 2 cm derin, bu açıdan ~0,55 cm görünür; resmin sol
 * kenarı yana sarılmış (gallery wrap), yan yüz önden koyu. (Onur 11-07: «biraz daha 3 boyutlu» — 0,85 cm.) */
.mh-yan{position:absolute;top:0;bottom:0;left:-.85em;width:.85em;
  background-size:4000% 100%;background-position:0 0;background-repeat:no-repeat;
  clip-path:polygon(0 .45em,100% 0,100% 100%,0 calc(100% - .45em));
  filter:brightness(.62) saturate(.8)}
.mh-yan::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.18),rgba(0,0,0,0))}
/* Oda 2 (asma): ellerdeki eser duvardan birkaç cm uzakta — gölgesi daha
 * geniş ve dağınık; el + parmak gölgesi katmanları eserin önünde. */
.mh-eser.mh-elde{box-shadow:2.6em 3em 3em -.7em rgba(28,22,18,.34),
  1em 1.3em 1.4em -.3em rgba(28,22,18,.24),.15em .2em .2em rgba(28,22,18,.2)}
.mh-katman{position:absolute;background-size:100% 100%;background-repeat:no-repeat;pointer-events:none}
.mh-isik{position:absolute;inset:0;background-size:100% 100%;mix-blend-mode:soft-light;pointer-events:none}
.mh-not{position:absolute;left:10px;bottom:10px;font-size:.68rem;letter-spacing:.04em;line-height:1.2;
  color:#262b3f;background:rgba(255,255,255,.86);padding:4px 8px;border-radius:2px;
  opacity:0;transition:opacity .3s .15s}
.eser-k.mh-goster .mh-not{opacity:1}
.mh-dugme{position:absolute;z-index:3;width:32px;height:32px;display:flex;align-items:center;justify-content:center;
  background:rgba(255,255,255,.92);color:#262b3f;border-radius:2px;box-shadow:0 2px 10px rgba(0,0,0,.1);cursor:pointer}
.mh-dugme svg{width:16px;height:16px}
.eser-k.mh-goster .mh-dugme{background:#262b3f;color:#fff}
@media (prefers-reduced-motion:reduce){.mh-sahne,.mh-not{transition:none}
  .eser-k.mh-var:hover .mh-sahne{transform:none}}
