*{margin:0;padding:0;box-sizing:border-box}
:root{--ind:#6366f1;--vio:#a855f7;--pink:#f472b6;--bg:#0d0a1f;
  /* kapı geometrisi JS ile hesaplanır (cover-crop), defaultlar masaüstü içindir */
  --door-l:43.5%; --door-t:43.4%; --door-w:13%; --door-h:38.5%;
  --inner-x:0px; --inner-y:0px;
  --tex-size:100% 100%; --tex-pos:0px 0px;}
html,body{background:var(--bg);color:#fff;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased}
img{display:block}
.progress{position:fixed;top:0;left:0;height:3px;width:0;background:linear-gradient(90deg,var(--ind),var(--pink));z-index:200}

#exp{position:relative}
.stage{position:relative;height:100vh;width:100%;overflow:hidden;background:#07060f}
.scaler{position:absolute;inset:0;perspective:1200px;perspective-origin:50% 52%;transform:translateZ(0);will-change:transform;z-index:3;pointer-events:none}
.layer{position:absolute;inset:0;width:100%;height:100%}
.layer img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}

/* GALERİ ODASI + COVERFLOW */
.gallery{position:absolute;inset:0;z-index:1;opacity:0}
.gbg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.gtint{position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,6,20,.35),rgba(8,6,20,.30) 55%,rgba(8,6,20,.55))}
.cover{position:absolute;inset:0;perspective:1700px;perspective-origin:50% 48%;pointer-events:none}
.cv .info .btns a{pointer-events:auto}
.cv{position:absolute;top:50%;left:50%;width:min(40vw,460px);height:66vh;
  transform:translate(-50%,-50%);transform-style:preserve-3d;will-change:transform,opacity;backface-visibility:hidden}
.cv .mat{position:relative;height:100%;border-radius:6px;overflow:hidden;
  border:14px solid;border-image:linear-gradient(145deg,#52468a,#15102b) 1;
  box-shadow:0 44px 90px rgba(0,0,0,.7), 0 0 0 1px rgba(168,139,250,.3), 0 0 50px rgba(168,85,247,.3)}
.cv img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.cv .grad{position:absolute;inset:0;background:linear-gradient(to top,rgba(13,10,31,.97) 16%,rgba(13,10,31,.12) 58%,transparent)}
.cv .info{position:absolute;left:22px;right:22px;bottom:20px;opacity:0;transition:opacity .25s ease}
.cv.is-center .info{opacity:1}
.cv .info h3{font-size:27px;font-weight:600}
.cv .info p{font-size:14px;color:#cdc4f0;margin-top:7px;line-height:1.5}
.cv .info .btns{display:flex;gap:10px;margin-top:16px}
.cv .info .btns a{font-size:13px;padding:9px 16px;border-radius:10px;cursor:pointer;text-decoration:none;pointer-events:auto}
.b1{color:#fff;background:linear-gradient(90deg,var(--ind),var(--vio))}
.b2{color:#c4b5fd;border:1px solid rgba(167,139,250,.5)}

/* kapı — konum/boyut JS ile cover-crop matematiğiyle px set edilir */
.doorway{position:absolute;left:var(--door-l);top:var(--door-t);width:var(--door-w);height:var(--door-h);z-index:4;overflow:hidden;transform-style:preserve-3d;will-change:transform}
/* arkadaki oda full-viewport, doorway origin'ine göre öteleniyor → cepheyle birebir hizalı */
.doorway .inner{position:absolute;left:var(--inner-x);top:var(--inner-y);width:100vw;height:100vh}
.doorway .inner img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:brightness(.95)}
/* açılan kapının arkasını mor sergi salonuyla uyumlu yap */
.doorway .inner .dtint{position:absolute;inset:0;opacity:0;
  background:radial-gradient(circle at 50% 48%,rgba(168,85,247,.55),rgba(99,102,241,.30) 40%,rgba(8,6,20,.2) 75%)}
.door{position:absolute;top:0;height:100%;width:50%;overflow:hidden;backface-visibility:hidden;will-change:transform}
/* kanat dokusu: cephedeki plaza-1 ile AYNI cover ölçeği/konumu → kapalıyken dikiş yok */
.door .tex{position:absolute;top:0;height:100%;width:200%;
  background-image:url(../assets/sahne/plaza-1.jpg);background-repeat:no-repeat;
  background-size:var(--tex-size);background-position:var(--tex-pos)}
.door-left{left:0;transform-origin:left center}.door-left .tex{left:0}
.door-right{right:0;transform-origin:right center}.door-right .tex{right:0}
.layer-facade{z-index:3;will-change:transform}

/* marka */
.brand{position:absolute;inset:0;z-index:6;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;will-change:transform,opacity;pointer-events:none}
.brand .box{background:rgba(13,10,31,.32);backdrop-filter:blur(4px);padding:34px 56px;border-radius:22px;display:flex;flex-direction:column;align-items:center}
.brand .logo{width:clamp(96px,12vw,150px);height:auto;filter:drop-shadow(0 6px 22px rgba(168,85,247,.45))}
.brand .name{font-size:clamp(46px,9vw,108px);font-weight:600;letter-spacing:-3px;line-height:1;margin-top:6px}
.brand .slogan{font-size:clamp(10px,1.4vw,15px);letter-spacing:5px;color:#d6cdf5;margin-top:14px}

/* kapı açılınca beliren geçiş katmanı (mor, sonraki salonla uyumlu) */
.intro{position:absolute;inset:0;z-index:5;display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;
  background:radial-gradient(circle at 50% 50%,rgba(168,85,247,.30),rgba(99,102,241,.12) 45%,transparent 65%)}
.intro .t{font-size:clamp(30px,5.5vw,72px);font-weight:600;letter-spacing:3px;color:#fff;
  text-shadow:0 4px 36px rgba(168,85,247,.7);transform:translateY(10px)}

.hall-head{position:absolute;top:6vh;left:0;right:0;z-index:7;text-align:center;opacity:0;text-shadow:0 2px 16px rgba(0,0,0,.7);pointer-events:none}
.hall-head .k{font-size:12px;letter-spacing:5px;color:#d6cdf5}
.hall-head .t{font-size:clamp(18px,2.4vw,28px);font-weight:500;margin-top:4px;letter-spacing:1px}

.scrollhint{position:absolute;bottom:30px;left:50%;z-index:6;transform:translateX(-50%);font-size:11px;letter-spacing:3px;opacity:.85;pointer-events:none;animation:bob 1.8s ease-in-out infinite}
@keyframes bob{0%,100%{transform:translate(-50%,0)}50%{transform:translate(-50%,9px)}}

#contact{position:relative;min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:18px;padding:90px 20px;
  background:radial-gradient(circle at 50% 38%,rgba(99,102,241,.20),transparent 62%)}
#contact h2{font-size:clamp(30px,6vw,68px);font-weight:600;letter-spacing:-2px;line-height:1.05}
#contact .grad-txt{background:linear-gradient(90deg,var(--ind),var(--pink));-webkit-background-clip:text;background-clip:text;color:transparent}
#contact p{color:#c4b5fd;font-size:16px;max-width:540px;line-height:1.6}
#contact .cta{margin-top:10px;display:flex;gap:14px;flex-wrap:wrap;justify-content:center}
#contact .cta a{padding:15px 30px;border-radius:12px;font-size:15px;font-weight:500;text-decoration:none;cursor:pointer}
#contact .foot{position:absolute;bottom:24px;font-size:12px;color:#6b6493;letter-spacing:1px}
.reveal{opacity:0;transform:translateY(28px)}

@media(max-width:767px){
  .cv{width:74vw;height:58vh}
  .brand .box{padding:26px 30px}
}
@media(prefers-reduced-motion:reduce){.scrollhint{animation:none}}