
/* ===== VIDEOLU BOLUMLER (mkbolumvideo.py) ===== */
.sstand.bv{background:var(--beyaz)!important;color:var(--mavi-koyu);aspect-ratio:auto!important;height:auto!important;padding:0!important}
.sstand.bv::before,.sstand.bv::after{display:none!important}
/* Gulbin, 8 Ekim: "bu alanlarin ekran alani kadar olmasini istiyorum, daha da uzamasin; aciklama
   basligin altina gelsin, sagdaki liste animasyonlu rozetler gibi saga yigilsin", "altindaki glass
   beyaz olacak". Video ve metin tam bir ekran (.bv-ekran); video ekrani kaplar, alt kismina header ve
   mini sepetin beyaz cami biner (sistem.css --cam-sepet, --cam-filtre-panel), ust kenari maskeyle
   yumusak erir. Camin ustunde solda baslik + aciklama (+ not), sagda ozellikler rozet olarak
   (.rband: sitenin rozetleri; masaustunde mkfizik.py ile duser, yigilir, fareyle itilir). */
.bv-ekran{position:relative;height:100vh;min-height:620px;overflow:hidden;background:rgb(2,49,113)}
.bv-ekran>video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.bv-cam{position:absolute;left:0;right:0;bottom:0;height:40%;pointer-events:none; /* Gulbin: "glas efekti biraz daha asagida olsun" (once %50) */
  background:var(--cam-sepet);-webkit-backdrop-filter:var(--cam-filtre-panel);backdrop-filter:var(--cam-filtre-panel);
  -webkit-mask-image:linear-gradient(180deg,transparent 0,rgba(0,0,0,.6) 16%,black 34%);
  mask-image:linear-gradient(180deg,transparent 0,rgba(0,0,0,.6) 16%,black 34%)}
.bv-metin{position:absolute;left:0;right:0;bottom:0;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  padding:0 calc(84.12*100cqw/var(--AW)) calc(80*100cqw/var(--AW));column-gap:calc(100*100cqw/var(--AW));align-items:end} /* Gulbin: "yazilari yukariya al biraz" 56 -> 110, "cok yukarida kaldi" -> 80 */
.bv-sol{display:grid;gap:calc(22*100cqw/var(--AW));align-content:end}
.bv-bas{margin:0;font-weight:var(--ag-baslik);text-transform:uppercase;line-height:1;white-space:pre-line;
  font-size:var(--m1);color:var(--mavi-koyu)}
.bv-gir{margin:0;max-width:calc(560*100cqw/var(--AW));font-size:var(--m4);line-height:1.55;color:var(--mavi-koyu)}
.bv-not{margin:0;font-size:var(--m5);line-height:1.35;white-space:pre-line;text-transform:uppercase;color:var(--mavi-koyu);opacity:.8}
/* Gulbin: "aciklamanin altina bizimle iletisime gecin butonu koy, direkt mail acilsin, bilgi@kolilazim.com".
   Sonra "butonlar bizim buton tarzi olsun, cerceveli olsun": sitenin "Daha fazlasini gor" dugmesi
   (.S2.lite .pmore a): ici bos, ince lacivert cerceve, lacivert buyuk harf ince yazi; uzerine
   gelince lacivert dolar, yazi beyaz. */
.bv-btn{justify-self:start;display:inline-block;border:var(--cizgi) solid var(--mavi-koyu);color:var(--mavi-koyu);background:transparent;
  text-decoration:none;text-transform:uppercase;font-weight:var(--ag-ince);font-size:var(--m4);padding:.62em 2.1em;
  transition:background .25s,color .25s,transform .16s ease-out}
.bv-btn:hover{background:var(--mavi-koyu);color:var(--beyaz)}
.bv-btn:active{transform:scale(.97)}
/* Gulbin: "bu alanlarda header yine transparan olsun", sonra "sayfaya tam sigdiginda (otomatik
   oturdugunda) transparan olsun" ve "uzerine gelirsem yine diger hali olacak": bolum ekrana tam
   oturunca betik .bvust ekler; cam yok, yazi ve ikonlar beyaz. Uzerine gelince ya da menu acikken
   (.beyaz) normal cam. */
.hd.bvust:not(.beyaz):not(:hover){color:var(--beyaz)!important;box-shadow:none!important;--giris-renk:var(--beyaz)}
.hd.bvust:not(.beyaz):not(:hover)::before{opacity:0!important}
/* rozetler sag altta yigilir; duz dizilimde de saga yasli */
.sstand.bv .bv-roz{margin:0;justify-content:flex-end;align-self:end}
/* Gulbin: "rozetlerin ici bos olsun": yalniz lacivert cizgi, arkasi cam; uzerine gelince lacivert dolar */
.sstand.bv .bv-roz span{background:transparent!important}
.sstand.bv .bv-roz span:hover{background:var(--mavi-koyu)!important;color:var(--beyaz)!important}
/* uclu videolar: artboard yerlesimi yerine yan yana uc kare */
.bv-uc{display:grid;grid-template-columns:repeat(3,1fr)}
.bv-uc .ssh{position:relative!important;left:auto!important;top:auto!important;right:auto!important;bottom:auto!important;
  width:auto!important;height:auto!important;margin:0!important;aspect-ratio:578/611;overflow:hidden;transform:none!important}
.bv-uc .ssgif{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;opacity:1!important}
.bv-uc .ssgif video,.bv-uc .ssgif img{width:100%!important;height:100%!important;object-fit:cover}
.bv-uc .ssno,.bv-uc .sset{position:absolute!important;z-index:2;left:calc(28*100cqw/var(--AW))!important;
  color:var(--beyaz);text-shadow:0 1px 10px rgba(0,0,0,.35);white-space:pre-line}
.bv-uc .ssno{top:calc(28*100cqw/var(--AW))!important;font-size:var(--m2);line-height:1}
/* Gulbin: "sayi ve aciklamasinin arasi cok acik, yaklastir": aciklama sayinin hemen altinda */
.bv-uc .sset{top:calc(28*100cqw/var(--AW) + var(--m2) + 6*100cqw/var(--AW))!important;font-size:var(--m5);line-height:1.3;text-transform:uppercase}
@media(max-width:820px){
  /* Gulbin, 9 Ekim (mobil): "videolu alanlarin altindaki beyazlar pek glass gibi durmuyor": cam beyaz zeminin
     ustundeydi, arkasinda bir sey yoktu. Video artik bolumun tamamini kaplar (ustte 56vh acik, altta metnin
     arkasinda); cam onun ustunde, video buzlu gorunur. Camin ust kenari uzun egriyle erir. */
  .bv-ekran{height:auto;min-height:0;overflow:hidden;background:transparent;position:relative;padding-top:56vh}
  .bv-ekran>video{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover}
  .bv-cam{display:none}
  .bv-metin{position:relative;grid-template-columns:1fr;margin-top:-24vh;padding:calc(var(--r3) + 14vh) var(--yan) var(--r3);row-gap:var(--r2);
    background:var(--cam-sepet);-webkit-backdrop-filter:var(--cam-filtre-panel);backdrop-filter:var(--cam-filtre-panel);
    -webkit-mask-image:linear-gradient(180deg,transparent 0,rgba(0,0,0,.08) 4vh,rgba(0,0,0,.3) 9vh,rgba(0,0,0,.62) 14vh,rgba(0,0,0,.88) 19vh,black 24vh);mask-image:linear-gradient(180deg,transparent 0,rgba(0,0,0,.08) 4vh,rgba(0,0,0,.3) 9vh,rgba(0,0,0,.62) 14vh,rgba(0,0,0,.88) 19vh,black 24vh)}
  .bv-bas{font-size:var(--f1);text-align:left!important}
  .bv-gir{font-size:var(--f4);text-align:left!important;max-width:none}
  .bv-not{font-size:var(--f5)}
  .bv-btn{font-size:var(--f5);min-height:44px;box-sizing:border-box;display:inline-flex;align-items:center;padding:0 var(--r3)}
  /* Gulbin: "rozetler mobilde olmasa mi acaba" -> mobilde yok */
  .sstand.bv .bv-roz{display:none!important}
  .sstand.bv .bv-roz span{border-color:var(--mavi-koyu)!important} /* mobil rozet kurali yesil veriyordu */
  /* Gulbin, 9 Ekim: "mobilde uclu gifler yan yana dursun masaustundeki gibi", "yazilarin boyutu degismesin ama": uc sutun, yazi boyutlari ayni */
  .bv-uc{grid-template-columns:repeat(3,1fr)}
  .bv-uc .ssno{font-size:var(--f2);top:var(--r2)!important;left:var(--r2)!important}
  .bv-uc .sset{font-size:var(--f5);top:calc(var(--r2) + var(--f2) + var(--r0, 4px))!important;left:var(--r2)!important}
}
