/* ============================================================
   PROJE DETAY — bilgin.studio/tr/works/... uyarlaması
   Kapak ve galeri tam genişlik, metin 1150px'te sabit.
   ============================================================ */

.pd-sayfa{ background:#F0F0F0; color:#414145; }

/* --- metin kabı: 1150px sabit, ortalanmış --- */
.pj-kap{ width:1150px; max-width:calc(100% - 40px); margin-inline:auto; }
.pj-kap.dar{ width:479px; }

/* 12'lik ızgara (bilgin: col-5 479, col-3 288) */
.pj-satir{ display:grid; grid-template-columns:repeat(12,1fr); }
.pj-c5{ grid-column:span 5; }
.pj-c3{ grid-column:span 3; }
.pj-c12{ grid-column:span 12; }
@media (max-width:900px){
  .pj-c5, .pj-c3{ grid-column:span 12; }
}

/* ============================================================
   ORTAK SAYFA IZGARASI (bilgin 12'lik sistem, 1150px kap)
   col-8 767 · col-6 575 · col-5 479 · col-2 192 · col-1 96
   ============================================================ */
.pj-c8{ grid-column:span 8; }
.pj-c6{ grid-column:span 6; }
.pj-c4{ grid-column:span 4; }
.pj-c2{ grid-column:span 2; }
.pj-c10{ grid-column:span 10; }
@media (max-width:900px){ .pj-c8,.pj-c6,.pj-c4,.pj-c2,.pj-c10{ grid-column:span 12; } }

/* --- sayfa kapağı (tam genişlik) --- */
.sy-kapak{ position:relative; height:900px; max-height:100svh; overflow:hidden; background:#131316; }
.sy-kapak.kisa{ height:600px; }
.sy-kapak img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.sy-kapak::after{ content:""; position:absolute; inset:0;
  background:linear-gradient(to bottom, rgba(10,18,28,.5) 0 20%, rgba(10,18,28,.15) 45%, rgba(10,18,28,.65)); }
.sy-kapak-in{ position:absolute; inset:auto 0 0 0; z-index:2; padding-bottom:clamp(40px,7vh,90px); }
.sy-kapak-in h1{
  font-size:48px; font-weight:700; line-height:57.6px; color:#fff; margin:0 0 16px;
  letter-spacing:-.01em; text-shadow:0 2px 24px rgba(8,16,28,.45);
}
.sy-kapak-in p{ font-size:16px; font-weight:300; line-height:24px; color:rgba(255,255,255,.92); margin:0; max-width:767px; }

/* --- bölüm --- */
.sy-bolum{ padding:clamp(46px,6.5vw,96px) 0; }
.sy-bolum.ust0{ padding-top:0; }
.sy-bolum h2{ font-size:24px; font-weight:700; line-height:28.8px; color:#313139; margin:0 0 20px; }
.sy-bolum h3{ font-size:18px; font-weight:700; line-height:27px; color:#313139; margin:0 0 6px; }
.sy-bolum p{ font-size:16px; font-weight:300; line-height:24px; color:#414145; margin:0 0 14px; }
.sy-etiket{ font-size:12px; font-weight:600; line-height:18px; color:#8A8A90; margin:0 0 8px; }

/* --- kurucu kartı --- */
.sy-kisi{ display:grid; grid-template-columns:192px 1fr; gap:24px; align-items:start; }
@media (max-width:680px){ .sy-kisi{ grid-template-columns:1fr; } }
.sy-kisi .foto{ width:160px; aspect-ratio:428/500; overflow:hidden; background:#e4e4e4; }
.sy-kisi .foto img{ width:100%; height:100%; object-fit:cover; filter:grayscale(1); transition:filter .5s; }
.sy-kisi:hover .foto img{ filter:none; }

/* --- bilgi listesi --- */
.sy-bilgi .k{ padding:5px 5px 5px 0; border-bottom:1px solid #DEDEDE; font-size:16px; font-weight:300; line-height:24px; }
.sy-bilgi .k b{ font-weight:600; color:#313139; }
.sy-bilgi .k a{ color:#414145; } .sy-bilgi .k a:hover{ color:#DD5656; }

/* --- tam genişlik görsel bandı --- */
.sy-bant{ display:block; }
.sy-bant img{ width:100%; height:auto; display:block; }

@media (max-width:767px){
  .sy-kapak{ height:70svh; } .sy-kapak.kisa{ height:52svh; }
  .sy-kapak-in h1{ font-size:28px; line-height:34px; }
  .sy-kapak-in p, .sy-bolum p, .sy-bilgi .k{ font-size:12px; line-height:18px; }
  .sy-bolum h2{ font-size:18px; line-height:22px; }
}

/* ============================================================
   HAKKIMIZDA / İLETİŞİM — bilgin blok akışı
   ============================================================ */
/* kurucu: portre ÜSTTE (192px), biyografi ALTTA (479px) */
.sy-kurucu .portre{ width:192px; aspect-ratio:192/193; overflow:hidden; background:#e4e4e4; margin-bottom:22px; }
.sy-kurucu .portre img{ width:100%; height:100%; object-fit:cover; filter:grayscale(1); transition:filter .5s; }
.sy-kurucu:hover .portre img{ filter:none; }
.sy-kurucu .bio{ max-width:479px; }
.sy-kurucu h3{ font-size:18px; font-weight:700; line-height:27px; color:#313139; margin:0 0 2px; }
.sy-kurucu .unvan{ font-size:12px; font-weight:600; line-height:18px; color:#8A8A90; margin:0 0 12px; }
.sy-kurucu p{ font-size:16px; font-weight:300; line-height:24px; color:#414145; margin:0 0 12px; }

/* rozet + satır (bilgin: col-1 96px görsel + col-10 958px metin) */
.sy-rozet{ display:grid; grid-template-columns:96px 1fr; gap:0 20px; align-items:start;
  padding:14px 0; border-bottom:1px solid #DEDEDE; }
.sy-rozet .im{ width:96px; height:96px; display:grid; place-items:center;
  border:1px solid #DEDEDE; background:#fff; font-size:12px; font-weight:600; color:#8A8A90; }
.sy-rozet .yz{ font-size:16px; font-weight:300; line-height:24px; color:#414145; padding-top:4px; }
.sy-rozet .yz b{ font-weight:600; color:#313139; }
@media (max-width:680px){ .sy-rozet{ grid-template-columns:1fr; gap:10px; } }

/* koyu tam genişlik ekip bandı */
.sy-koyu{ background:#191919; color:#fff; }
.sy-koyu h2, .sy-koyu h3{ color:#fff; }
.sy-koyu p{ color:rgba(255,255,255,.86); }
.sy-koyu .sy-etiket{ color:rgba(255,255,255,.55); }
.sy-ekip{ column-count:2; column-gap:40px; }
.sy-ekip div{ break-inside:avoid; padding:7px 0; border-bottom:1px solid rgba(255,255,255,.14);
  font-size:16px; font-weight:300; line-height:24px; }
.sy-ekip div b{ font-weight:600; }
@media (max-width:680px){ .sy-ekip{ column-count:1; } }

/* ============================================================
   KOYU SAYFALAR (hakkımızda + iletişim)
   Ölçüler bilgin.studio'dan 1440px'te alındı:
     zemin #191919 · kap 1150 / sol 138 · 12 sütun, her öğe 10px iç boşluk
     -> sütun 95.83 · col-2 192 · col-5 479 · col-6 575 · col-8 767
     -> metin sol kenarı 148, sağ kolon 723
   Not: bilgin mono yazı tipi kullandığı için gövde metinlerini bold yazmış.
        Helvetica'da aynı ağırlık okunmuyor; boyutlar birebir, ağırlık normal.
   ============================================================ */
body.koyu-sayfa{ background:#191919; color:#fff; }
body.koyu-sayfa .page{ padding-top:0; }
body.koyu-sayfa h1, body.koyu-sayfa h2, body.koyu-sayfa h3{ color:#fff; }

/* --- 12 sütun: bilgin sistemi (gap yok, öğede 10px padding) --- */
.ky-satir{ display:grid; grid-template-columns:repeat(12,1fr); }
.ky-satir > *{ padding-inline:10px; min-width:0; }
.ky-c2{ grid-column:span 2; } .ky-c3{ grid-column:span 3; }
.ky-c4{ grid-column:span 4; } .ky-c5{ grid-column:span 5; }
.ky-c6{ grid-column:span 6; } .ky-c8{ grid-column:span 8; }
.ky-c12{ grid-column:span 12; }
@media (max-width:900px){ .ky-c2,.ky-c3,.ky-c4,.ky-c5,.ky-c6,.ky-c8{ grid-column:span 12; } }

/* --- bölümler --- */
.ky-blok{ padding:0 0 clamp(56px,7vw,104px); }
.ky-blok.ky-ust{ padding-top:165px; }
.ky-blok h1{ font-size:24px; font-weight:700; line-height:28.8px; margin:0 0 51px; }
.ky-blok h2{ font-size:18px; font-weight:700; line-height:21.6px; margin:0 0 56px; }
.ky-blok p.giris{ font-size:18px; font-weight:400; line-height:27px;
  color:rgba(255,255,255,.88); margin:0 0 18px; }
.ky-blok p.giris:last-child{ margin-bottom:0; }

/* --- kurucular: portre 160x187 ÜSTTE, biyografi ALTTA --- */
.ky-kisi .portre{ width:160px; aspect-ratio:160/187; overflow:hidden; background:#2a2a2a; margin:0 0 60px; }
.ky-kisi .portre img{ width:100%; height:100%; object-fit:cover; filter:grayscale(1); transition:filter .5s; }
.ky-kisi:hover .portre img{ filter:none; }
.ky-kisi h3, .ky-kisi .unvan, .ky-kisi p{ max-width:459px; }   /* bilgin: bio col-5 */
.ky-kisi h3{ font-size:13px; font-weight:700; line-height:21px; margin:0 0 3px; }
.ky-kisi .unvan{ font-size:13px; font-weight:700; line-height:21px;
  color:rgba(255,255,255,.72); margin:0 0 12px; }
.ky-kisi p{ font-size:13px; font-weight:400; line-height:20px;
  color:rgba(255,255,255,.8); margin:0 0 12px; }
@media (max-width:900px){ .ky-kisi + .ky-kisi{ margin-top:56px; } }

/* --- satır listesi (projeler / ödüller) --- */
.ky-liste div{ font-size:13px; font-weight:700; line-height:21px; color:#fff; padding:3px 0; }
.ky-liste div span{ font-weight:400; color:rgba(255,255,255,.7); }
.ky-not{ font-size:13px; font-weight:400; line-height:20px; color:rgba(255,255,255,.6); margin:0; }

/* ---------- İLETİŞİM: tam genişlik harita + koyu bilgi bloğu ---------- */
.ky-harita{ position:relative; width:100%; height:600px; background:#101010; overflow:hidden; }
/* Google gomme haritasi sol ustte bir yer etiketi karti cizer; logonun arkasinda
   kalmasin diye cerceve 340px sola kaydirilip ayni kadar genisletiliyor.
   Google'in zorunlu telif/atif satiri sag altta kaldigi icin gorunur kaliyor. */
.ky-harita iframe{ position:absolute; top:0; left:-340px; width:calc(100% + 340px); height:100%;
  border:0; display:block;
  filter:grayscale(1) invert(.93) brightness(.72) contrast(1.06); }
/* menü haritanın hangi bölgesine denk gelirse gelsin okunur kalsın */
.ky-harita::before{ content:""; position:absolute; inset:0 0 auto 0; height:150px; z-index:2;
  pointer-events:none;
  background:linear-gradient(to bottom, rgba(12,12,12,.78), rgba(12,12,12,.30) 60%, rgba(12,12,12,0)); }
.ky-ayrac{ height:50px; }                      /* haritadan sonraki boş satır */

.ky-iletisim .ky-c6{ padding-top:16px; }               /* bilgin: metin y666, satir y650 */
.ky-iletisim h2{ font-size:18px; font-weight:700; line-height:21.6px; margin:0 0 53px; }
.ky-adres{ font-size:14px; font-weight:700; line-height:21px; color:#fff; margin:0 0 14px; }
.ky-adres a{ color:#fff; }
.ky-satirlar a{ display:block; font-size:14px; font-weight:700; line-height:21px;
  color:#fff; margin:0 0 12px; transition:opacity .3s; }
.ky-satirlar a:hover{ opacity:.62; }

/* sosyal: sağ col-6'nın içinde sağa yaslı col-2 (192px) */
.ky-sag{ display:flex; justify-content:flex-end; padding-right:0; }  /* col-2 sutun kenarina yaslanir */
.ky-sosyal{ width:192px; padding:54px 10px 0; }        /* ikon sol kenari 1106, metin 1142 */
.ky-sosyal a{ display:flex; align-items:center; gap:16px; height:21px; margin-bottom:10px;
  font-size:14px; font-weight:700; line-height:21px; color:#fff; transition:opacity .3s; }
.ky-sosyal a:hover{ opacity:.62; }
.ky-sosyal svg{ width:20px; height:20px; flex:none; stroke:currentColor; fill:none;
  stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
@media (max-width:900px){ .ky-sag{ justify-content:flex-start; margin-top:44px; } }

@media (max-width:767px){
  .ky-blok.ky-ust{ padding-top:118px; }
  .ky-blok h1{ font-size:20px; line-height:25px; margin-bottom:32px; }
  .ky-blok h2{ font-size:16px; line-height:20px; margin-bottom:32px; }
  .ky-blok p.giris{ font-size:15px; line-height:23px; }
  .ky-harita{ height:320px; }
  .ky-harita iframe{ left:-150px; width:calc(100% + 150px); }  /* dar ekranda kayma azalir */
  .ky-ayrac{ height:34px; }
}

/* ============================================================
   PROJE DETAY — bilgin.studio/tr/works/... 1440px'te ölçüldü
     slayt 1425x900 · oklar 35x55, kenardan 80 · kart sol 80, alttan 76
     kredi sağ 80 · sayaç ortada, alttan 42
     bilgi bloğu: kap 1150/sol 147 · künye col-6 (722) + col-9 (1010), 268 geniş
     benzer projeler: 4 sütun, görsel 268x201 (4:3)
   Nokta göstergesi yerine slaytın altında küçük görsel şeridi var.
   ============================================================ */
.pj-sayfa{ background:#F0F0F0; color:#414145; }

/* ---------- SLAYT ---------- */
.sl{ position:relative; width:100%; height:100svh;
  min-height:520px; overflow:hidden; background:#131316; }
.sl-kare{ position:absolute; inset:0; opacity:0; transition:opacity .7s ease; }
.sl-kare.acik{ opacity:1; }
.sl-kare img{ width:100%; height:100%; object-fit:cover; display:block; }
.sl::after{ content:""; position:absolute; inset:0; pointer-events:none; z-index:1;
  background:linear-gradient(to bottom, rgba(8,12,18,.42) 0 12%, rgba(8,12,18,0) 34%,
                              rgba(8,12,18,0) 62%, rgba(8,12,18,.42)); }

/* oklar */
.sl-ok{ position:absolute; top:50%; transform:translateY(-50%); z-index:4;
  width:35px; height:55px; display:grid; place-items:center;
  background:rgba(0,0,0,.65); border:0; cursor:pointer; color:#fff;
  transition:background .3s; }
.sl-ok:hover{ background:rgba(0,0,0,.85); }
.sl-ok svg{ width:15px; height:15px; stroke:currentColor; fill:none; stroke-width:2;
  stroke-linecap:round; stroke-linejoin:round; }
.sl-ok.geri{ left:80px; } .sl-ok.ileri{ right:80px; }

/* sol alt bilgi kartı */
.sl-kart{ position:absolute; left:80px; bottom:122px; z-index:3; max-width:calc(100% - 160px);
  display:flex; flex-direction:column; align-items:flex-start; }  /* alt baslik bos olsa da alt alta */
.sl-kart .ad{ display:inline-block; background:#000; color:#fff; padding:5px;
  font-size:18px; font-weight:700; line-height:27px; margin:0; }
.sl-kart .alt{ display:block; background:#fff; color:#000; padding:5px; max-width:280px;
  font-size:10px; font-weight:400; line-height:15px; margin:0; }
.sl-kart .btn-hak{ display:inline-block; background:#000; color:#fff; padding:7px;
  font-size:12px; font-weight:400; line-height:12px; margin-top:12px;
  transition:background .3s; }
.sl-kart .btn-hak:hover{ background:#313139; }

/* sağ alt künye satırı */
.sl-kredi{ position:absolute; right:80px; bottom:122px; z-index:3;
  background:#000; color:#fff; padding:5px; font-size:10px; font-weight:400; line-height:10px; }

/* sayaç */
.sl-alt{ position:absolute; left:0; right:0; bottom:26px; z-index:3;
  display:flex; flex-direction:column; align-items:center; gap:8px;
  padding-inline:80px; pointer-events:none; }
.sl-alt > *{ pointer-events:auto; }
.sl-sayac{ font-size:12px; font-weight:400; line-height:16px; color:#fff;
  text-shadow:0 1px 10px rgba(0,0,0,.6); }

/* ---------- KÜÇÜK GÖRSEL ŞERİDİ (nokta yerine) ---------- */
.sl-serit{ display:flex; gap:6px; max-width:100%; overflow-x:auto;
  scrollbar-width:none; padding:2px; }
.sl-serit::-webkit-scrollbar{ display:none; }
.sl-serit button{ flex:none; width:60px; height:45px; padding:0; border:0;
  background:#2a2a2a; cursor:pointer; overflow:hidden; opacity:.5;
  transition:opacity .3s; outline-offset:2px; }
.sl-serit button img{ width:100%; height:100%; object-fit:cover; display:block;
  filter:grayscale(1); transition:filter .4s; }
.sl-serit button:hover{ opacity:.85; }
.sl-serit button.acik{ opacity:1; outline:2px solid #fff; }
.sl-serit button.acik img{ filter:none; }

/* ---------- BİLGİ BLOĞU ---------- */
/* Alt boşluk üstle EŞİT. Eskiden 0'dı; altında "Benzer Projeler" bölümü
   olduğu için nefes payını o veriyordu. O bölüm kaldırılınca blok alt
   çubuğa yapıştı. Bu kural hem proje hem hizmet sayfasında geçerli. */
.pj-bilgi{ padding:110px 0; }
.pj-bilgi .ky-satir{ align-items:start; }
.pj-bilgi h1{ font-size:48px; font-weight:700; line-height:57.6px; color:#313139;
  margin:0 0 42px; letter-spacing:-.01em; }
.pj-bilgi .alt{ font-size:12px; font-weight:700; line-height:18px; color:#313139; margin:0 0 26px; }
.pj-paylas{ display:flex; gap:14px; }
.pj-paylas a{ display:grid; place-items:center; width:20px; height:20px; color:#313139;
  transition:opacity .3s; }
.pj-paylas a:hover{ opacity:.55; }
.pj-paylas svg{ width:18px; height:18px; stroke:currentColor; fill:none; stroke-width:1.6;
  stroke-linecap:round; stroke-linejoin:round; }

/* künye satırları: üstünde ince çizgi, 74px adım */
.pj-kunye-k .sat{ border-top:1px solid #313139; padding:10px 0 11px; min-height:38px;
  font-size:12px; line-height:17px; margin-bottom:36px; }   /* bilgin: satir adimi 74px */
.pj-kunye-k .sat b{ font-size:12px; font-weight:700; line-height:17px; color:#313139; }
.pj-kunye-k .sat.son{ border-bottom:1px solid #313139; }
.pj-kunye-k .sat.son{ margin-bottom:0; }
.pj-kunye-k .kunye-ac{ display:flex; align-items:center; justify-content:space-between;
  width:100%; background:none; border:0; padding:0; margin:0; cursor:pointer;
  color:inherit; font:inherit; text-align:left; }
.pj-kunye-k .kunye-ac i{ font-style:normal; font-size:14px; line-height:17px;
  color:#313139; transition:transform .3s; }
.pj-kunye-k .kunye-govde[hidden]{ display:none; }
.pj-kunye-k .grup{ margin-top:22px; }
.pj-kunye-k .grup p{ font-size:16px; font-weight:700; line-height:24px; color:#313139; margin:0; }
.pj-kunye-k .grup + .grup{ margin-top:18px; }
.pj-kunye-k .kapat{ border-top:1px solid #313139; margin-top:26px; }

/* ---------- PLANLAR (künyenin altında, ana galeriden ayrı) ---------- */
/* Planlar çizimdir: slaytın koyu zeminine değil, bilgi bölümünün açık zeminine
   oturur. Yan yana dizilir; 900px altında alt alta geçer. */
.pj-planlar{ grid-column:span 12; margin-top:88px; padding-inline:10px; }
.pj-planlar-b{ font-size:12px; font-weight:700; line-height:17px; color:#313139;
  letter-spacing:.02em; margin:0 0 18px; padding-bottom:11px;
  border-bottom:1px solid #313139; }
.pj-planlar-iz{ display:grid; gap:24px;
  grid-template-columns:repeat(auto-fit, minmax(320px, 1fr)); }
/* Üçten fazla plan varsa ikişerli daha okunaklı; tek plan tam genişliği kaplamasın. */
.pj-planlar[data-adet="1"] .pj-planlar-iz{ grid-template-columns:minmax(0, 560px); }
.pj-planlar .plan{ margin:0; }
.pj-planlar .plan img{ display:block; width:100%; height:auto; background:#F2F2F2;
  border:1px solid #E3E3E6; cursor:zoom-in; transition:border-color .3s, opacity .3s; }
.pj-planlar .plan img:hover{ border-color:#313139; opacity:.92; }
.pj-planlar figcaption{ font-size:12px; line-height:17px; color:#6B6B73; margin-top:10px; }

@media (max-width:900px){
  .pj-planlar{ margin-top:56px; }
  .pj-planlar-iz{ grid-template-columns:1fr; }
  .pj-planlar[data-adet="1"] .pj-planlar-iz{ grid-template-columns:1fr; }
}

/* ---------- BENZER PROJELER ---------- */
.pj-benzer{ padding:112px 0 clamp(56px,7vw,104px); }
.pj-benzer h2{ font-size:24px; font-weight:700; line-height:28.8px; color:#313139;
  margin:0 0 20px; padding-inline:10px; }
.pj-benzer .liste{ display:grid; grid-template-columns:repeat(4,1fr); }
.pj-benzer .kart{ display:block; padding:10px; }
.pj-benzer .gorsel{ width:100%; aspect-ratio:4/3; overflow:hidden; background:#dcdcdc; }
.pj-benzer .gorsel img{ width:100%; height:100%; object-fit:cover; display:block;
  filter:grayscale(1); transition:filter .5s; }
.pj-benzer .kart:hover .gorsel img{ filter:none; }
.pj-benzer h3{ font-size:14px; font-weight:700; line-height:22px; color:#313139; margin:8px 0 0; }
.pj-benzer .etiket{ font-size:10px; font-weight:300; line-height:16px; color:#8A8A90; }
.pj-benzer .etiket span + span{ margin-left:11px; }
@media (max-width:1024px){ .pj-benzer .liste{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px){ .pj-benzer .liste{ grid-template-columns:1fr; } }

@media (max-width:900px){
  .pj-bilgi h1{ font-size:34px; line-height:41px; margin-bottom:26px; }
  .pj-kunye-k{ margin-top:34px; }
}
@media (max-width:767px){
  .sl{ height:100svh; min-height:380px; }
  .sl-ok.geri{ left:14px; } .sl-ok.ileri{ right:14px; }
  .sl-kart{ left:14px; bottom:150px; max-width:calc(100% - 28px); }
  .sl-kredi{ left:14px; right:auto; bottom:110px; }
  .sl-alt{ padding-inline:14px; bottom:22px; }
  .sl-serit button{ width:48px; height:36px; }
  .pj-bilgi{ padding-top:46px; padding-bottom:46px; }
  .pj-bilgi h1{ font-size:26px; line-height:32px; }
  .pj-benzer{ padding-top:60px; }
}

.ky-satirlar .saat{ display:block; font-size:14px; font-weight:400; line-height:21px;
  color:rgba(255,255,255,.6); margin-top:14px; }

/* proje detay — açıklama müşteriden bekleniyor */
.pj-bilgi .alt.bekliyor{ color:#A8A8AE;
  text-decoration:underline dashed #CFCFD4; text-underline-offset:3px; }

/* ============================================================
   TAM EKRAN GÖRSEL — slayttaki görsele tıklanınca açılır
   ============================================================ */
.sl-kare img{ cursor:zoom-in; }
.buyut{
  position:fixed; inset:0; z-index:200; background:rgba(9,9,11,.96);
  display:none; align-items:center; justify-content:center;
  opacity:0; transition:opacity .25s ease;
}
.buyut.acik{ display:flex; }
.buyut.gorunur{ opacity:1; }
.buyut img{
  max-width:calc(100vw - 160px); max-height:calc(100svh - 130px);
  width:auto; height:auto; object-fit:contain; display:block; cursor:zoom-out;
}
.buyut button{
  position:absolute; background:rgba(0,0,0,.65); border:0; cursor:pointer; color:#fff;
  display:grid; place-items:center; transition:background .3s;
}
.buyut button:hover{ background:rgba(0,0,0,.9); }
.buyut svg{ stroke:currentColor; fill:none; stroke-width:2;
  stroke-linecap:round; stroke-linejoin:round; }
.buyut .b-kapat{ top:22px; right:22px; width:42px; height:42px; }
.buyut .b-kapat svg{ width:18px; height:18px; }
.buyut .b-ok{ top:50%; transform:translateY(-50%); width:35px; height:55px; }
.buyut .b-ok svg{ width:15px; height:15px; }
.buyut .b-geri{ left:36px; } .buyut .b-ileri{ right:36px; }
.buyut .b-sayac{
  position:absolute; left:0; right:0; bottom:26px; text-align:center;
  font-size:12px; line-height:16px; color:rgba(255,255,255,.8); pointer-events:none;
}
body.buyut-acik{ overflow:hidden; }

@media (max-width:767px){
  .buyut img{ max-width:calc(100vw - 28px); max-height:calc(100svh - 150px); }
  .buyut .b-geri{ left:8px; } .buyut .b-ileri{ right:8px; }
  .buyut .b-kapat{ top:12px; right:12px; }
}

/* ---------- İLETİŞİM: alt bilgi çubuğu aşağıya insin ---------- */
.ky-iletisim{ padding-bottom:clamp(150px,26vh,300px); }
/* sayfa ekrandan kısa kalırsa alt bilgi yine en alta yapışsın */
body.koyu-sayfa{ min-height:100svh; display:flex; flex-direction:column; }
body.koyu-sayfa .page{ flex:1 0 auto; }
body.koyu-sayfa .foot-bilgin{ flex:none; }

/* ============================================================
   MARKA TİPOGRAFİSİ — başlıklar logodaki serif (Marcellus)
   Gövde metni Montserrat kalır (logonun alt satırı, okunaklı).
   Boyut, satır yüksekliği ve hizalar değişmez; sadece harf biçimi.
   Marcellus tek ağırlıklı olduğundan kalınlık 400'e alınır,
   harf aralığı serife göre biraz kısılır.
   ============================================================ */
.pj-bilgi h1,
.pj-benzer h2,
.ky-blok h1,
.ky-blok h2,
.ky-iletisim h2,
.sl-kart .ad,
.pr-tit, .pr-tit a,
/* Başlıklar logonun yazı tipiyle yazılır. Küçük büyük harfli ETİKETLER
   (künye satırları, PLANLAR gibi) bunun dışındadır — onlar gövde fontunda. */
/* Başlıklar gövde yazı tipinde (menüdeki ile aynı). Daha önce logodaki serif
   deneniyordu; kullanıcı beğenmedi ve marka yazısı artık header'da doğrudan
   logodan geldiği için font taklidine gerek kalmadı. */
.hz-hero .in h1,
.sec-head h2,
.hiz h3,
.ky-kisi h3,
.hk-kisi,
.sec h1,
.sec h2{
  font-family:var(--font);
  font-weight:400;
  letter-spacing:-.005em;
}

/* Marcellus'un x-yüksekliği Montserrat'tan küçük; büyük başlıklarda
   aynı optik ağırlığı tutturmak için bir tık büyütülüyor. */
.pj-bilgi h1{ font-size:52px; line-height:60px; }
.ky-blok h1{ font-size:26px; line-height:31px; }
.pr-tit{ font-size:19px; line-height:27px; }
.sl-kart .ad{ font-size:19px; line-height:27px; }

@media (max-width:900px){ .pj-bilgi h1{ font-size:36px; line-height:43px; } }
@media (max-width:767px){
  .pj-bilgi h1{ font-size:28px; line-height:34px; }
  .ky-blok h1{ font-size:22px; line-height:27px; }
}