/* B2 · Duvar vitrini — sayfa içindeki duvar (.vd) ve tıklayınca açılan tam ekran sahne (.vd-kat) */
body{overflow-x:clip}
html.vd-kilit,html.vd-kilit body{overflow:hidden!important}
html.vd-kilit #scrollUp{display:none!important}
.vd,.vd-kat{--zemin:radial-gradient(120% 75% at 50% -5%,#ffffff 0%,#f1f2f5 55%,#e4e6eb 100%);--yazi:#1b2430;--baslik:#161b26;--soluk:#7a818c;--oz:#333b48;--cizgi:rgba(0,0,0,.08);--golge:rgba(20,30,50,.16);--kirmizi:#e30613;
  --btnZ:rgba(255,255,255,.85);--btnC:rgba(0,0,0,.12);--btnY:#1b2430;--alt:linear-gradient(180deg,rgba(241,242,245,0) 0,rgba(241,242,245,.96) 26px,#f1f2f5 60px);--soluk2:.3}
html[data-tema=koyu] .vd,html[data-tema=koyu] .vd-kat{--zemin:radial-gradient(120% 75% at 50% -5%,#221f22 0%,#0e0d10 50%,#060607 100%);--yazi:#f2efe9;--baslik:#fff;--soluk:#8d8578;--oz:#dcd5cb;--cizgi:rgba(255,255,255,.08);--golge:rgba(0,0,0,.55);--kirmizi:#ff4b45;
  --btnZ:rgba(22,21,24,.7);--btnC:rgba(255,255,255,.18);--btnY:#fff;--alt:linear-gradient(180deg,rgba(10,10,12,0) 0,rgba(10,10,12,.94) 26px,#0b0b0d 60px);--soluk2:.22}
.vd *,.vd-kat *{box-sizing:border-box}
.vd{margin:0 calc(50% - 50vw);background:var(--zemin);color:var(--yazi);font-family:Inter,Arial,sans-serif;transition:color .4s}
.vd-ic{max-width:1880px;margin:0 auto;padding:30px clamp(16px,3.4vw,64px) 70px}
.vd-benzer .vd-ic{padding-top:46px}
.vd-alt-baslik{margin:0;font:800 clamp(22px,2.4vw,30px)/1.15 Inter,Arial,sans-serif;letter-spacing:-.01em;color:var(--baslik)}
.vd-adet{font-size:13px;color:var(--soluk)}
.vd-bas{display:flex;align-items:flex-end;justify-content:space-between;gap:14px 16px;flex-wrap:wrap}
.vd-yol{font-size:12px;color:var(--soluk)}
.vd-yol b{color:var(--baslik)}
.vd-bas h1{margin:8px 0 0;font-size:clamp(28px,3.4vw,46px);font-weight:800;letter-spacing:-.015em;color:var(--baslik);line-height:1.05}
.vd-sag{display:flex;align-items:center;gap:12px;font-size:13px;color:var(--soluk)}
/* Açık / Koyu: iki eşit düğme, seçilinin altında kayan kırmızı hap */
.vd-tema{position:relative;display:inline-grid;grid-template-columns:1fr 1fr;height:38px;padding:3px;border:1px solid var(--btnC);border-radius:20px;background:var(--btnZ);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.vd-tema::before{content:"";position:absolute;top:3px;bottom:3px;left:3px;width:calc(50% - 3px);border-radius:16px;background:#e30613;box-shadow:0 2px 6px rgba(227,6,19,.35);transition:transform .35s cubic-bezier(.4,0,.2,1)}
html[data-tema=koyu] .vd-tema::before{transform:translateX(100%)}
.vd-tema button{position:relative;z-index:1;display:inline-flex;align-items:center;justify-content:center;gap:6px;width:44px;height:100%;padding:0;margin:0;border:0;background:none;color:var(--soluk);font:600 12.5px/1 Inter,Arial,sans-serif;cursor:pointer;transition:color .3s}
.vd-tema button.on{color:#fff}
.vd-tema svg{width:14px;height:14px;flex:none;display:block}
.vd-tema i{font-style:normal}
/* Duvar: sabit ölçüler — kare sahne, resim tabanı ile kod arası her üründe 26px, ad için hep 2 satır yer */
.vd-duvar{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(22px,3vw,40px) clamp(14px,2.6vw,40px);align-items:start;padding-top:40px}
@media (min-width:1500px){.vd-duvar{grid-template-columns:repeat(5,minmax(0,1fr))}}
@media (min-width:1860px){.vd-duvar{grid-template-columns:repeat(6,minmax(0,1fr))}}
.vd-hucre{display:flex;flex-direction:column;text-decoration:none!important;color:inherit;text-align:center;transition:opacity .7s,filter .7s;-webkit-tap-highlight-color:transparent;outline-offset:6px}
.vd-sahne{position:relative;display:block;aspect-ratio:1/1}
.vd-foto{position:absolute;left:6%;right:6%;top:0;bottom:0;display:flex;align-items:flex-end;justify-content:center;transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.vd-foto img{display:block;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;filter:drop-shadow(0 16px 14px var(--golge));transition:opacity .5s}
.vd.js-hazir .vd-foto img:not(.hazir),.vd-kat .vd-foto img:not(.hazir){opacity:0}
.vd-etiket{display:flex;flex-direction:column;align-items:center;margin-top:26px;padding:0 4px;transition:opacity .35s}
.vd-kod{font-size:12px;line-height:20px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--kirmizi)}
.vd-ad{font-size:17px;line-height:22px;height:44px;font-weight:700;margin-top:5px;color:var(--baslik);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
@media (hover:hover) and (pointer:fine){.vd .vd-hucre:hover .vd-foto{transform:translateY(-8px) scale(1.04)}}
/* Tam ekran sahne */
.vd-kat{position:fixed;inset:0;z-index:2147483000;color:var(--yazi);font-family:Inter,Arial,sans-serif;overflow:hidden;overscroll-behavior:contain;display:none}
.vd-perde{position:absolute;inset:0;background:var(--zemin);opacity:0;transition:opacity .4s}
.vd-kat.gor .vd-perde{opacity:1}
.vd-kat .vd-duvar{position:absolute;margin:0;transform-origin:0 0;transition:transform 1s cubic-bezier(.66,0,.18,1);will-change:transform}
.vd-kat.yakin .vd-etiket{opacity:0}
.vd-kat.yakin .vd-hucre:not(.secili){opacity:var(--soluk2);filter:blur(2px)}
.vd-bilgi{position:fixed;left:clamp(20px,5vw,80px);top:50%;transform:translate(-16px,-50%);width:min(390px,34vw);max-height:86vh;overflow:auto;opacity:0;pointer-events:none;transition:opacity .4s,transform .4s}
.vd-kat.acik .vd-bilgi{opacity:1;transform:translate(0,-50%);pointer-events:auto;transition:opacity .55s .5s,transform .55s .5s}
.vd-bilgi .k{font-size:12px;font-weight:800;letter-spacing:.17em;color:var(--kirmizi)}
.vd-bilgi h2{font-size:clamp(26px,2.7vw,42px);line-height:1.06;margin:10px 0 16px;font-weight:800;color:var(--baslik);letter-spacing:-.01em;font-family:Inter,Arial,sans-serif}
.vd-bilgi .e span{display:inline-block;font-size:12px;font-weight:700;padding:5px 11px;border-radius:20px;border:1px solid rgba(227,6,19,.45);color:var(--kirmizi);margin:0 6px 6px 0;background:rgba(227,6,19,.07)}
.vd-bilgi ul{list-style:none;padding:0;margin:10px 0 22px;font-size:14.5px;color:var(--oz)}
.vd-bilgi li{padding:10px 0;border-bottom:1px solid var(--cizgi);list-style:none}
.vd-bilgi li::before{content:"✓";color:var(--kirmizi);font-weight:800;margin-right:10px}
.vd-bilgi .b{display:flex;gap:10px;flex-wrap:wrap}
.vd-bilgi .b a{display:inline-flex;align-items:center;gap:8px;padding:12px 18px;border-radius:30px;font:700 14px/1 Inter,Arial,sans-serif;text-decoration:none!important}
.vd-bilgi .wa{background:#25d366;color:#06240f!important}
.vd-bilgi .tl i{font-style:normal}
.vd-bilgi .tl{border:1px solid var(--btnC);color:var(--baslik)!important;background:var(--btnZ)}
.vd-bilgi .sy{display:inline-block;margin-top:16px;font-size:13px;font-weight:700;color:var(--soluk)!important;text-decoration:none!important}
.vd-bilgi .sy:hover{color:var(--kirmizi)!important}
.vd-kont{position:fixed;right:clamp(16px,3vw,40px);bottom:clamp(20px,4vh,40px);display:flex;align-items:center;gap:10px;opacity:0;pointer-events:none;transition:opacity .3s}
.vd-kat.yakin .vd-kont{opacity:1;pointer-events:auto;transition:opacity .4s .6s}
.vd-kont span{font-size:13px;color:var(--soluk);min-width:44px;text-align:center;font-variant-numeric:tabular-nums}
.vd-btn{width:44px;height:44px;margin:0;padding:0;border-radius:50%;border:1px solid var(--btnC);background:var(--btnZ);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:var(--btnY);font:400 20px/1 Arial,sans-serif;cursor:pointer;display:inline-flex;align-items:center;justify-content:center}
.vd-kapat{position:fixed;top:clamp(14px,3vh,28px);right:clamp(14px,3vw,36px);opacity:0;pointer-events:none;transition:opacity .3s}
.vd-kat.yakin .vd-kapat{opacity:1;pointer-events:auto;transition:opacity .4s .5s}
.vd-tema-yakin{position:fixed;top:clamp(14px,3vh,28px);right:calc(clamp(14px,3vw,36px) + 56px);opacity:0;pointer-events:none;transition:opacity .3s}
.vd-kat.yakin .vd-tema-yakin{opacity:1;pointer-events:auto;transition:opacity .4s .5s}
@media (prefers-reduced-motion:reduce){.vd-kat .vd-duvar{transition-duration:.01s}}
@media (max-width:760px){
  .vd-ic{padding:22px 16px 50px}
  .vd-duvar{grid-template-columns:repeat(2,minmax(0,1fr));gap:26px 14px;padding-top:24px}
  .vd-etiket{margin-top:20px}
  .vd-kod{font-size:11px;line-height:18px}
  .vd-ad{font-size:15px;line-height:19px;height:38px}
  .vd-bilgi{left:0;right:0;top:auto;bottom:0;width:auto;max-height:50vh;max-height:50svh;transform:translateY(24px);padding:30px 20px calc(22px + env(safe-area-inset-bottom));background:var(--alt)}
  .vd-bilgi .b{display:grid;grid-template-columns:1fr 1fr;gap:8px}
  .vd-bilgi .b a{justify-content:center;padding:13px 6px;font-size:14px;white-space:nowrap}
  .vd-bilgi .tl i{display:none}
  .vd-kat.acik .vd-bilgi{transform:none}
  .vd-bilgi h2{font-size:26px;margin:6px 0 12px}
  .vd-kont{right:auto;left:14px;bottom:auto;top:clamp(14px,3vh,28px)}
  .vd-kont span{min-width:34px}
  .vd-tema-yakin{right:66px}
  .vd-tema-yakin .vd-tema button{width:44px}
  .vd-tema-yakin .vd-tema i{display:none}
}

/* birden fazla fotoğraf: bilgi panelinde küçük resimler */
.vd-bilgi .fo{display:flex;gap:8px;flex-wrap:wrap;margin:8px 0 6px}
.vd-bilgi .fo:empty{display:none}
.vd-bilgi .fo button{width:56px;height:56px;margin:0;padding:5px;border-radius:12px;border:1px solid var(--btnC);background:var(--btnZ);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:border-color .2s,box-shadow .2s}
.vd-bilgi .fo button.on{border-color:#e30613;box-shadow:0 0 0 2px rgba(227,6,19,.18)}
.vd-bilgi .fo img{display:block;max-width:100%;max-height:100%;object-fit:contain}
@media (max-width:760px){.vd-bilgi .fo{flex-wrap:nowrap;overflow-x:auto;padding-bottom:4px;scrollbar-width:none}.vd-bilgi .fo::-webkit-scrollbar{display:none}.vd-bilgi .fo button{flex:0 0 52px;width:52px;height:52px}}
