/* Dijital Kalkan maskotu — resources/views/site/parcalar/maskot.blade.php (<picture class="dk-maskot">) ve yerlesimleri.
   Plan: .tmpwork/maskot/ENTEGRASYON-PLANI.md §1 (baglayici) · varliklar/olculer: public/img/maskot/manifest.json (App\Maskot\Maskot).
   Parca bu dosyayi @once @push('stil') ile <head>'e iter; paylasilan CSS dosyalarina (dk.css URETILIR, dk-site.css, dk-ortak.css)
   dokunulmadi. Kurallar:
   - Oran kilidi <img width/height> ozniteliklerinden; burada YALNIZ genislik verilir, height:auto (CLS yok).
   - Yan maske kesik_kenarlar'dan (sinif dk-maskot--yan-{iki|sag|sol|yok}); kesik OLMAYAN kenara maske yok.
   - Yatay cevirme / renk filtresi / object-fit kirpmasi YOK; hareket YOK (§1.7 — giris efekti eklenmedi).
   - Hero'da bel kesigi bolumun ALT kenarina denk gelir: negatif alt pay = bolumun alt dolgusu (--dk-maskot-alt).
   Kirilma noktalari: hero izgarasi (dc9eaf34) maskotlu bolumde auto-fit yerine ACIK iki sutun (>= 880 px) — genislik ve sizes
   ayni noktalardan hesaplanir (auto-fit kaydirma cubugu genisligine gore 864-880 px arasinda sutun degistirirdi). */

/* ---- Temel <picture> ---------------------------------------------------------------------------------------------------- */
.dk-maskot{position:relative;display:block;isolation:isolate;line-height:0}
.dk-maskot img{display:block;width:100%;height:auto;max-width:none;color:transparent;font-size:0}
/* Bozuk resmin alt metni line-height:0 ile ust uste binmesin; WebP de acilmazsa bos sahne ayrilmaz. Alt ozniteligi korunur. */
.dk-maskot[hidden]{display:none}

/* (A) Koyu zemin: kesik yanlar %12 gecisle zemine erir + arkada mavi parilti. z-index:-1 ile isolation birlikte gerekir:
   parilti konumlandirilmis bir ogedir, bunlar olmazsa konumlandirilmamis <img>'in USTUNE boyanir. */
.dk-maskot--koyu.dk-maskot--yan-iki img{-webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
.dk-maskot--koyu.dk-maskot--yan-sag img{-webkit-mask-image:linear-gradient(90deg,#000 88%,transparent);mask-image:linear-gradient(90deg,#000 88%,transparent)}
.dk-maskot--koyu.dk-maskot--yan-sol img{-webkit-mask-image:linear-gradient(90deg,transparent,#000 12%);mask-image:linear-gradient(90deg,transparent,#000 12%)}
.dk-maskot--koyu::before{content:"";position:absolute;z-index:-1;left:50%;top:38%;width:110%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;pointer-events:none;background:radial-gradient(closest-side,rgba(47,107,255,.45),transparent)}

/* (B) Acik zemin: lacivert "pencere" karti. Zemin YALNIZ heronun dogrusal degradesi (radyal parilti karta konmaz). Gorsel kartin
   tam genisliginde ve alta yasli: kesik kenarlar kartin kenarina denk gelir, maske gerekmez. */
.dk-maskot--kart{overflow:hidden;border-radius:24px;background:linear-gradient(160deg,#0B1A3A,#10285F)}

/* ---- Hero sahnesi (ana sayfa: site/anasayfa/_hero · alt sayfalar: site/parcalar/sayfa-hero 'maskot' secenegi) ------------- */
.dk-maskot-izgara{grid-template-columns:minmax(0,1fr)}
.dk-maskot-sahne{--dk-maskot-alt:clamp(64px,8vw,112px);display:flex;flex-direction:column;align-items:center;gap:16px;
  align-self:end;min-width:0;margin-bottom:calc(-1 * var(--dk-maskot-alt))}
.dka-hero .dk-maskot-sahne{--dk-maskot-alt:clamp(52px,6.5vw,92px)}            /* alt sayfa hero'sunun alt dolgusu (dk-site.css .dka-hero) */
.dk-maskot-sahne > .dk-maskot{width:240px;max-width:100%}                        /* tek sutun (mobil): 240x320, ortali */
@media (min-width:880px){
  .dk-maskot-izgara{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .dk-maskot-sahne > .dk-maskot{width:min(420px,100%)}                           /* masaustu 420x560 */
}
@media (min-width:1280px){
  .dk-maskot-sahne--hero-kalkan > .dk-maskot{width:490px}                        /* ana sayfa >= 1280: 490x653 */
}
@media (min-width:1440px){
  .dk-maskot-sahne--hero-kalkan > .dk-maskot{width:540px}                        /* >= 1440: 540x720 */
  .dk-maskot-sahne--hosting > .dk-maskot{width:min(460px,100%)}
}
@media (min-width:1600px){
  .dk-maskot-sahne--hero-kalkan > .dk-maskot{width:600px}                        /* >= 1600: 600x800 */
  .dk-maskot-sahne--hosting > .dk-maskot{width:min(500px,100%)}
}
@media (min-width:1920px){
  .dk-maskot-sahne--hero-kalkan > .dk-maskot{width:660px}                        /* >= 1920: 660x880 */
  .dk-maskot-sahne--hosting > .dk-maskot{width:min(540px,100%)}
}

/* Sahnedeki durum karti (/hosting: sunucu olcumleri — AnasayfaTest'in rakamlari). Maskotun USTUNE binmez: tek sutunda ve
   880-1279 px'te maskotun ustunde yigilir; >= 1280 px'te hosting pozunun BOS sag-ust bolgesinde (dolabin ustu, basin sagi) durur.
   Olculen bos bolge (manifest alfa, hosting): y <= %30 iken opak x <= %62,7; y = %35'te <= %66,5; dolap y >= %50. Kart 336 px
   (prototip yazi boyunda satir kirilmaz); maskot sutun araligina 44 px tasar (metin sutunundan >= 25 px uzak) ve kartin 74 px
   altindan baslar: kartin sol kenari basin/omzun, alt kenari dolabin disinda kalir (Chrome'da olculdu: kesisim yok). */
.dk-maskot-kart{width:min(360px,100%);text-align:left}
.dk-maskot-kart .d549b35a{padding:18px}
@media (min-width:880px) and (max-width:1279px){
  .dk-maskot-sahne--kartli > .dk-maskot{width:min(320px,100%)}
  .dk-maskot-kart{width:min(340px,100%)}
}
@media (min-width:1280px){
  :is(.dk-maskot-sahne--hosting, .dk-maskot-sahne--hero-kalkan-isaret).dk-maskot-sahne--kartli{display:grid;grid-template-columns:minmax(0,1fr);align-items:end}
  :is(.dk-maskot-sahne--hosting, .dk-maskot-sahne--hero-kalkan-isaret).dk-maskot-sahne--kartli > *{grid-area:1/1}
  .dk-maskot-sahne--hosting.dk-maskot-sahne--kartli > .dk-maskot{justify-self:start;margin:74px 0 0 -44px}
  .dk-maskot-sahne--hero-kalkan-isaret.dk-maskot-sahne--kartli > .dk-maskot{justify-self:start;margin:30px 0 0 -20px}
  :is(.dk-maskot-sahne--hosting, .dk-maskot-sahne--hero-kalkan-isaret).dk-maskot-sahne--kartli > .dk-maskot-kart{justify-self:end;align-self:start;position:relative;z-index:1;width:336px}
}

/* ---- 404 karti (errors/parcalar/kart, $hata['maskot']): masaustunde metin solda + pencere karti sagda; mobilde metnin ustunde ---- */
.dkh-kart--maskot{display:grid;grid-template-columns:minmax(0,1fr);gap:22px;align-items:center}
.dkh-kart--maskot > .dkh-maskot{order:-1;justify-self:center;width:180px}
@media (min-width:768px){
  .d0e4bd62:has(> .dkh-kart--maskot){max-width:1000px}
  .dkh-kart--maskot{grid-template-columns:minmax(0,1fr) 240px;gap:40px;text-align:left}
  .dkh-kart--maskot > .dkh-maskot{order:0;width:100%}
  .dkh-kart--maskot .d7d1ac30{margin-left:0;margin-right:0}
  .dkh-kart--maskot .d749724a{justify-content:flex-start}
}
@media (min-width:1024px){
  .d0e4bd62:has(> .dkh-kart--maskot){max-width:1080px}                           /* uc eylem tek satira sigar */
  .dkh-kart--maskot{grid-template-columns:minmax(0,1fr) 330px;gap:48px}
}

/* ---- /aylik-koruma guvence kutusu ("Virus tekrar bulasir mi?"): kollar-kavusturulmus, acik zeminde pencere karti ------------ */
.dk-maskot-guvence{container-type:inline-size}
.dk-maskot-guvence-ic{display:grid;grid-template-columns:minmax(0,1fr);gap:18px}
.dk-maskot-guvence-ic > .dk-maskot{justify-self:center;width:150px;border-radius:18px}
@container (min-width:400px){
  .dk-maskot-guvence-ic{grid-template-columns:minmax(0,1fr) 150px;gap:22px;align-items:start}
  .dk-maskot-guvence-ic > .dk-maskot{width:100%}
}