/* Zenova Prime · 3B Daire Turu */
:root {
  --mavi: #0a4f99; --mavi-koyu: #083d77; --murekkep: #16232f; --soluk: #697785; --cizgi: rgba(22, 35, 47, .12);
  --yuzey: rgba(255, 255, 255, .92); --yuzey-koyu: rgba(14, 22, 30, .78); --golge: 0 6px 24px rgba(10, 25, 40, .16);
  color-scheme: light;
}
* { box-sizing: border-box; }
[hidden] { display: none !important; }
html, body { margin: 0; height: 100%; background: #e9edf0; color: var(--murekkep); font: 14px/1.4 Arial, 'Helvetica Neue', sans-serif; overflow: hidden; overscroll-behavior: none; -webkit-tap-highlight-color: transparent; }
button { font: inherit; color: inherit; cursor: pointer; }
#tur { position: fixed; inset: 0; }
#tur-sahne { position: absolute; inset: 0; touch-action: none; }
#tur-sahne canvas { display: block; width: 100%; height: 100%; outline: none; }
#tur-sahne.yuruyus canvas { cursor: grab; }
#tur-sahne.yuruyus.surukle canvas { cursor: grabbing; }

/* üst çubuk */
.tur-ust { position: absolute; left: 12px; right: 12px; top: 12px; display: flex; gap: 10px; align-items: flex-start; justify-content: space-between; pointer-events: none; z-index: 5; }
.tur-ust > * { pointer-events: auto; }
.tur-marka { display: flex; flex-direction: column; gap: 2px; padding: 9px 13px; background: var(--yuzey); border-radius: 12px; box-shadow: var(--golge); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); min-width: 0; }
.tur-marka small { font-size: 10.5px; letter-spacing: .12em; color: var(--mavi); font-weight: 700; }
.tur-marka strong { font-size: 15px; white-space: nowrap; }
.tur-tipler { display: flex; gap: 4px; padding: 4px; background: var(--yuzey); border-radius: 12px; box-shadow: var(--golge); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
.tur-tipler button, .tur-mod button { border: 0; background: transparent; padding: 8px 12px; border-radius: 9px; font-weight: 600; font-size: 13px; color: var(--soluk); white-space: nowrap; }
.tur-tipler button span { display: block; font-size: 11px; font-weight: 400; }
.tur-tipler button[aria-pressed="true"], .tur-mod button[aria-pressed="true"] { background: var(--mavi); color: #fff; }
.tur-sag { display: flex; gap: 8px; align-items: center; }
.tur-mod { display: flex; gap: 4px; padding: 4px; background: var(--yuzey); border-radius: 12px; box-shadow: var(--golge); }
.tur-ikon { width: 40px; height: 40px; border-radius: 12px; border: 0; background: var(--yuzey); box-shadow: var(--golge); display: grid; place-items: center; font-size: 18px; color: var(--murekkep); }
.tur-ikon svg { width: 18px; height: 18px; }
.tur-ikon[aria-pressed="true"] { background: var(--mavi); color: #fff; }

/* odalar */
.tur-odalar { position: absolute; left: 12px; top: 84px; width: 210px; max-height: calc(100% - 84px - 24px - var(--mini-h, 300px)); overflow: auto; padding: 8px; background: var(--yuzey); border-radius: 14px; box-shadow: var(--golge); z-index: 4; scrollbar-width: thin; }
.tur-odalar h3 { margin: 4px 6px 6px; font-size: 11px; letter-spacing: .1em; color: var(--soluk); font-weight: 700; }
.tur-odalar button { display: flex; width: 100%; justify-content: space-between; gap: 8px; border: 0; background: transparent; padding: 7px 8px; border-radius: 8px; text-align: left; font-size: 13px; }
.tur-odalar button:hover { background: #eef3f8; }
.tur-odalar button[aria-current="true"] { background: #e3edf8; color: var(--mavi); font-weight: 700; }
.tur-odalar button span:last-child { color: var(--soluk); font-variant-numeric: tabular-nums; white-space: nowrap; }
.tur-odalar .tur-toplam { margin: 6px 8px 2px; padding-top: 7px; border-top: 1px solid var(--cizgi); font-size: 12px; color: var(--soluk); display: flex; justify-content: space-between; }

/* mini plan */
.tur-mini { position: absolute; left: 12px; bottom: 12px; width: 210px; background: #fff; border-radius: 14px; box-shadow: var(--golge); overflow: hidden; z-index: 4; }
.tur-mini canvas { display: block; width: 100%; cursor: crosshair; }
.tur-mini small { display: block; padding: 5px 9px 7px; font-size: 10.5px; color: var(--soluk); border-top: 1px solid var(--cizgi); }

/* alt sağ: çağrı */
.tur-cta { position: absolute; right: 12px; bottom: 12px; display: flex; flex-direction: column; gap: 8px; align-items: flex-end; z-index: 4; max-width: min(360px, calc(100% - 24px)); }
.tur-cta .tur-btn { display: inline-flex; align-items: center; gap: 8px; border: 0; background: var(--mavi); color: #fff; padding: 13px 18px; border-radius: 12px; font-weight: 700; font-size: 14.5px; box-shadow: 0 8px 24px rgba(10, 79, 153, .35); text-decoration: none; }
.tur-cta .tur-btn:hover { background: var(--mavi-koyu); }
.tur-cta .tur-btn2 { background: var(--yuzey); color: var(--murekkep); box-shadow: var(--golge); font-weight: 600; padding: 10px 14px; font-size: 13px; }
.tur-not { font-size: 11px; line-height: 1.35; color: #3d4b57; background: var(--yuzey); padding: 7px 10px; border-radius: 10px; box-shadow: var(--golge); text-align: left; }
.tur-not button { border: 0; background: none; padding: 0; color: var(--mavi); text-decoration: underline; font-size: 11px; }

/* ipucu ve konum */
.tur-ipucu { position: absolute; left: 50%; bottom: 16px; transform: translateX(-50%); background: var(--yuzey-koyu); color: #fff; padding: 8px 14px; border-radius: 999px; font-size: 12.5px; z-index: 3; pointer-events: none; transition: opacity .5s; white-space: nowrap; }
.tur-ipucu.gizli { opacity: 0; }
.tur-konum { position: absolute; left: 50%; top: 84px; transform: translateX(-50%); background: var(--yuzey); padding: 6px 13px; border-radius: 999px; font-weight: 700; font-size: 13px; box-shadow: var(--golge); z-index: 3; pointer-events: none; }
.tur-konum span { font-weight: 400; color: var(--soluk); margin-left: 6px; }
.tur-konum[hidden] { display: none; }

/* oda etiketleri (kuş bakışı) */
.tur-etiketler { position: absolute; inset: 0; pointer-events: none; z-index: 2; overflow: hidden; }
.tur-etiket { position: absolute; left: 0; top: 0; transform: translate(-50%, -50%); background: rgba(255, 255, 255, .86); border-radius: 7px; padding: 2px 7px; font-size: 11px; font-weight: 700; white-space: nowrap; box-shadow: 0 2px 8px rgba(0, 0, 0, .12); pointer-events: auto; cursor: pointer; border: 0; }
.tur-etiket span { display: block; font-weight: 400; font-size: 10px; color: var(--soluk); text-align: center; }
.tur-etiket:hover { background: #fff; color: var(--mavi); }

/* yükleme */
.tur-yukleme { position: absolute; inset: 0; display: grid; place-items: center; background: #e9edf0; z-index: 20; transition: opacity .4s; }
.tur-yukleme.bitti { opacity: 0; pointer-events: none; }
.tur-yukleme div { text-align: center; color: var(--soluk); }
.tur-yukleme b { display: block; color: var(--murekkep); font-size: 16px; margin-bottom: 6px; }
.tur-donen { width: 34px; height: 34px; margin: 0 auto 14px; border-radius: 50%; border: 3px solid #cfd8e0; border-top-color: var(--mavi); animation: tur-don 0.9s linear infinite; }
@keyframes tur-don { to { transform: rotate(360deg); } }

/* bilgi penceresi */
.tur-bilgi { position: absolute; inset: 0; background: rgba(10, 20, 30, .45); display: grid; place-items: center; z-index: 30; padding: 16px; }
.tur-bilgi[hidden] { display: none; }
.tur-bilgi > div { background: #fff; border-radius: 16px; max-width: 520px; width: 100%; padding: 20px 22px; box-shadow: 0 20px 60px rgba(0, 0, 0, .3); max-height: calc(100% - 32px); overflow: auto; }
.tur-bilgi h2 { margin: 0 0 10px; font-size: 18px; }
.tur-bilgi ul { margin: 0 0 12px; padding-left: 18px; color: #33414d; }
.tur-bilgi li { margin: 5px 0; }
.tur-bilgi .tur-btn { border: 0; background: var(--mavi); color: #fff; padding: 10px 16px; border-radius: 10px; font-weight: 700; }
.tur-plan-buyuk img { width: 100%; height: auto; display: block; border-radius: 8px; border: 1px solid var(--cizgi); }

/* WebGL yoksa */
.tur-hata { position: absolute; inset: 0; display: grid; place-items: center; padding: 24px; text-align: center; z-index: 25; background: #e9edf0; }
.tur-hata[hidden] { display: none; }

@media (min-width: 761px) and (max-height: 860px) { .tur-mini { width: 168px; } .tur-odalar { width: 200px; } .tur-odalar button { padding: 5px 8px; } }
@media (max-width: 1080px) { .tur-marka { display: none; } }   /* tablet genişliğinde üst çubuk sığmıyor; başlık tip düğmelerinin altında kalıyordu */
@media (max-width: 980px) {
  .tur-tipler button { padding: 7px 9px; font-size: 12px; }
  .tur-odalar { width: 190px; }
  .tur-mini { width: 170px; }
}
@media (max-width: 760px) {
  .tur-ust { left: 8px; right: 8px; top: 8px; flex-wrap: wrap; gap: 6px; }
  .tur-marka { display: none; }
  .tur-tipler { order: 2; flex: 1 1 100%; overflow-x: auto; scrollbar-width: none; }
  .tur-tipler button { flex: 1 0 auto; padding: 6px 8px; }
  .tur-tipler button span { font-size: 10.5px; }
  .tur-sag { order: 1; width: 100%; justify-content: space-between; }
  .tur-mod button { padding: 7px 10px; font-size: 12.5px; }
  .tur-ikon { width: 36px; height: 36px; }
  .tur-odalar { top: auto; bottom: 66px; left: 8px; right: 8px; width: auto; max-height: none; display: flex; gap: 4px; overflow-x: auto; padding: 5px; border-radius: 12px; scrollbar-width: none; }
  .tur-odalar h3, .tur-odalar .tur-toplam { display: none; }
  .tur-odalar button { width: auto; flex: 0 0 auto; padding: 6px 9px; font-size: 12px; background: #f1f4f7; }
  .tur-odalar button span:last-child { display: none; }
  .tur-mini { width: 112px; left: auto; right: 8px; top: 104px; bottom: auto; }
  .tur-mini small { display: none; }
  .tur-cta { right: 8px; left: 8px; bottom: 8px; max-width: none; flex-direction: row; align-items: stretch; }
  .tur-cta .tur-btn { flex: 1; justify-content: center; padding: 12px 10px; font-size: 13.5px; }
  .tur-cta .tur-not { position: absolute; left: 0; right: 0; bottom: 100px; font-size: 10px; line-height: 1.3; padding: 5px 9px; }
  .tur-cta .tur-not button { font-size: 10px; }
  .tur-cta .tur-btn2 { flex: 0 0 auto; }
  .tur-ipucu { bottom: 150px; font-size: 11.5px; white-space: normal; text-align: center; width: max-content; max-width: calc(100% - 32px); }
  .tur-konum { top: 104px; left: 8px; transform: none; max-width: calc(100% - 136px); font-size: 12.5px; }
  .tur-konum span { display: block; margin-left: 0; font-size: 11.5px; }
}
@media (prefers-reduced-motion: reduce) { .tur-donen { animation-duration: 3s; } }


/* 360° gezinti, tavan yüksekliği ve gerçek manzara */
.tur-foto { position: absolute; inset: 0; z-index: 1; background: #e9edf0; pointer-events: none; transition: opacity .35s ease; }
.tur-foto img { position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: contain; display: block; transition: opacity .16s linear; }
.tur-foto img[hidden] { display: none; }
@media (max-width: 760px) { #tur.foto-acik .tur-mini { display: none; } }
.tur-foto.gizli { opacity: 0; }

.tur-ikon.tur-yazili { width: auto; padding: 0 13px; gap: 7px; display: inline-flex; align-items: center; font-weight: 700; font-size: 13px; }
.tur-ikon.tur-yazili svg { color: var(--mavi); }
.tur-tavan { position: absolute; left: 50%; top: 84px; transform: translateX(-50%); display: flex; align-items: center; gap: 7px; background: var(--yuzey); padding: 6px 13px 6px 10px; border-radius: 999px; font-size: 13px; box-shadow: var(--golge); z-index: 3; pointer-events: none; white-space: nowrap; }
.tur-tavan svg { width: 16px; height: 16px; color: var(--mavi); }
.tur-tavan b { color: var(--mavi); }
.tur-pano-katman { position: absolute; inset: 0; pointer-events: none; z-index: 2; overflow: hidden; }
.tur-olcu { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.tur-olcu line { stroke: #fff; stroke-width: 2.4; stroke-linecap: round; filter: drop-shadow(0 0 1.6px rgba(0, 0, 0, .65)); }
.tur-olcu-etiket { position: absolute; left: 0; top: 0; background: var(--mavi); color: #fff; border-radius: 10px; padding: 5px 10px 6px; text-align: center; line-height: 1.15; box-shadow: 0 4px 14px rgba(10, 40, 80, .35); white-space: nowrap; }
.tur-olcu-etiket b { display: block; font-size: 16px; }
.tur-olcu-etiket span { font-size: 10.5px; opacity: .92; }
.tur-nokta-etiket { position: absolute; left: 0; top: 0; pointer-events: auto; border: 0; background: rgba(14, 22, 30, .7); color: #fff; border-radius: 999px; padding: 5px 10px; font-size: 12px; font-weight: 600; white-space: nowrap; backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px); }
.tur-nokta-etiket.ust, .tur-nokta-etiket:hover { background: var(--mavi); }
.tur-manzara-isaret { position: absolute; left: 0; top: 0; pointer-events: auto; display: inline-flex; align-items: center; gap: 6px; border: 0; background: rgba(255, 255, 255, .94); color: var(--murekkep); border-radius: 999px; padding: 6px 12px 6px 8px; font-size: 12.5px; font-weight: 700; box-shadow: 0 4px 16px rgba(10, 30, 50, .28); white-space: nowrap; }
.tur-manzara-isaret svg { width: 18px; height: 18px; color: var(--mavi); }
.tur-manzara-isaret:hover { background: var(--mavi); color: #fff; }
.tur-manzara-isaret:hover svg { color: #fff; }
.tur-perde { position: absolute; inset: 0; background: #f4f2ee; opacity: 0; pointer-events: none; transition: opacity .22s; z-index: 6; }
.tur-perde.acik { opacity: 1; }
.tur-pano-yukleniyor { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: 7; background: rgba(255, 255, 255, .88); border-radius: 50%; padding: 11px; box-shadow: var(--golge); }
.tur-pano-yukleniyor .tur-donen { margin: 0; }
#tur-sahne.isaret canvas { cursor: pointer; }
.tur-manzara > div { max-width: min(1040px, calc((100vh - 290px) * 16 / 9 + 32px)); min-width: min(100%, 680px); display: flex; flex-direction: column; gap: 14px; padding: 16px; position: relative; }
.tur-kapat-x { position: absolute; right: 10px; top: 10px; width: 36px; height: 36px; border: 0; border-radius: 50%; background: rgba(255, 255, 255, .92); box-shadow: var(--golge); display: grid; place-items: center; z-index: 2; }
.tur-kapat-x svg { width: 18px; height: 18px; }
.tur-manzara-foto { position: relative; margin: 0; flex: 0 0 auto; width: 100%; aspect-ratio: 16 / 9; border-radius: 12px; overflow: hidden; background: #dfe5ea; }
.tur-manzara-foto img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
.tur-manzara-foto .tur-rozet { position: absolute; left: 12px; top: 12px; margin: 0; background: rgba(229, 242, 232, .95); box-shadow: 0 2px 10px rgba(0, 0, 0, .22); }
.tur-pin { position: absolute; transform: translate(-50%, calc(-100% - 14px)); background: var(--mavi); color: #fff; font-size: 11.5px; font-weight: 700; padding: 4px 8px; border-radius: 8px; white-space: nowrap; box-shadow: 0 3px 10px rgba(0, 0, 0, .3); }
.tur-pin i { position: absolute; left: 50%; bottom: -5px; width: 10px; height: 10px; background: var(--mavi); transform: translateX(-50%) rotate(45deg); }
.tur-pin::after { content: ''; position: absolute; left: 50%; top: calc(100% + 14px); width: 14px; height: 14px; border: 2.5px solid #fff; border-radius: 50%; transform: translate(-50%, -50%); box-shadow: 0 0 0 2px var(--mavi), 0 0 8px rgba(0, 0, 0, .4); }
.tur-manzara-yazi { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: 4px 24px; align-items: start; padding: 0 4px; }
.tur-manzara-yazi h2 { margin: 0 0 6px; }
.tur-manzara-alt { margin: 10px 0 0; text-align: right; }
.tur-rozet { display: inline-block; margin: 0 0 10px; background: #e5f2e8; color: #1d6a35; font-size: 11px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; padding: 4px 9px; border-radius: 999px; }
.tur-manzara-not { margin: 0 0 6px; font-size: 14.5px; color: #24323e; }
.tur-pusula { display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); gap: 4px; margin: 2px 0 12px; }
.tur-pusula button { border: 1px solid var(--cizgi); background: #fff; border-radius: 8px; padding: 8px 0; font-weight: 700; font-size: 12px; color: var(--soluk); }
.tur-pusula button.cephe { border-color: rgba(10, 79, 153, .55); color: var(--mavi); }
.tur-pusula button[aria-pressed="true"] { background: var(--mavi); border-color: var(--mavi); color: #fff; }
.tur-manzara-tip { font-size: 13px; line-height: 1.55; background: #f2f5f8; border-radius: 10px; padding: 10px 12px; color: #2a3844; }
.tur-manzara-tip button { border: 0; background: none; padding: 0; color: var(--mavi); font-weight: 700; text-decoration: underline; font-size: 13px; }
.tur-manzara-kucuk { font-size: 11.5px; line-height: 1.45; color: var(--soluk); margin: 12px 0 0; }
@media (max-width: 760px) {
  .tur-ikon.tur-yazili { padding: 0 10px; }
  .tur-ikon.tur-yazili span { display: none; }
  .tur-tavan { top: 104px; left: 8px; transform: none; font-size: 12px; padding: 5px 11px 5px 9px; }
  .tur-manzara > div { padding: 12px; gap: 12px; min-width: 0; max-width: 100%; }
  .tur-manzara-yazi { grid-template-columns: minmax(0, 1fr); padding: 0; }
  .tur-manzara-foto .tur-rozet { left: 8px; top: 8px; font-size: 10px; }
  .tur-pusula { margin-top: 10px; }
  .tur-pusula button { padding: 7px 0; font-size: 11px; }
  .tur-olcu-etiket b { font-size: 14px; }
}
@media (max-height: 560px) and (min-width: 600px) {   /* yatay telefon: görüntü solda, yazı sağda */
  .tur-manzara > div { flex-direction: row; align-items: flex-start; max-width: 100%; min-width: 0; }
  .tur-manzara-foto { width: min(58%, calc((100vh - 64px) * 16 / 9)); }
  .tur-manzara-yazi { flex: 1 1 0; min-width: 0; grid-template-columns: minmax(0, 1fr); padding: 0; }
  .tur-pusula { margin-top: 10px; }
}

/* küçük resim çekimi için (yalnızca sahne) */
#tur.yalin > :not(#tur-sahne):not(.tur-yukleme) { display: none !important; }

/* Sitedeki daire tipi bölümüne gömülü tur (yerinde=1): yalın arayüz — tip düğmeleri, başlık, oda listesi, "Planı Gör" ve tam ekran
   düğmesi sayfada zaten var; kuş bakışında köşe planı gizli (model büyük görünsün), 360° gezintide küçük köşe planı kalır */
#tur.yerinde .tur-marka, #tur.yerinde .tur-tipler, #tur.yerinde .tur-odalar, #tur.yerinde #tur-tam, #tur.yerinde #tur-plan-ac { display: none !important; }
#tur.yerinde .tur-ust { justify-content: flex-end; left: 10px; right: 10px; top: 10px; }
#tur.yerinde .tur-tavan { top: 12px; left: 12px; transform: none; font-size: 12px; padding: 5px 11px 5px 9px; }
#tur.yerinde.foto-acik .tur-mini { display: none; }
#tur.yerinde .tur-mini { width: 150px; left: 10px; bottom: 10px; }
#tur.yerinde .tur-mini small { display: none; }
#tur.yerinde .tur-cta { right: 10px; bottom: 10px; }
#tur.yerinde .tur-cta .tur-btn { padding: 10px 15px; font-size: 13px; border-radius: 10px; }
#tur.yerinde .tur-etiket { font-size: 11px; padding: 2px 7px; }
@media (max-width: 760px) {
  #tur.yerinde .tur-ust { top: 8px; left: 8px; right: 8px; justify-content: space-between; }
  #tur.yerinde .tur-tavan { display: none; }
  #tur.yerinde .tur-cta { left: auto; right: 8px; bottom: 8px; }
  #tur.yerinde .tur-cta .tur-btn { flex: 0 0 auto; padding: 9px 13px; font-size: 12.5px; }
  #tur.yerinde .tur-mini { width: 112px; }
  #tur.yerinde .tur-etiket { font-size: 11px; padding: 3px 7px; }
  #tur.yerinde .tur-etiket span { display: none; }   /* telefonda yalnız oda adı: model yazıların altında kalmasın */
}

/* otomatik sunum (?sunum=1): durdurulunca "▶ Otomatik Sunum" düğmesi sağda, eylem düğmelerinin üstünde görünür
   (ortadaki ipucu yazılarıyla çakışmaz) */
.tur-sunum-dugme { position: absolute; right: 12px; bottom: 124px; z-index: 4; border: 0; padding: 9px 15px; border-radius: 999px; background: var(--yuzey-koyu); color: #fff; font-weight: 700; font-size: 13px; box-shadow: 0 8px 22px rgba(10, 40, 80, .28); cursor: pointer; white-space: nowrap; }
.tur-sunum-dugme:hover { background: var(--mavi); }
.tur-sunum-dugme[hidden] { display: none; }
#tur.sunum .tur-ipucu { max-width: calc(100% - 32px); white-space: normal; text-align: center; }
@media (max-width: 760px) { .tur-sunum-dugme { right: 10px; bottom: 112px; padding: 8px 13px; font-size: 12.5px; } }
#tur.yerinde .tur-sunum-dugme { bottom: 56px; }
