/* Panel dışındaki üç yüzeyin (vitrin, tüketici, operatör) paylaştığı iki parça:
 * ziyaretçi bandı ve marka işareti.
 *
 * Bandın renkleri bilerek sabit, `var()` değil: operatör panelindeki önizlemenin
 * işi işletme sahibine ZİYARETÇİNİN gördüğünü göstermek. Değerler tokens.css'in
 * koyu paletinin birebir kopyası ve öyle kalmalı — biri değişirse buradaki de
 * değişir. (Önizleme bugün yalnız koyu temayı yansıtıyor; ziyaretçi açık temada
 * olduğunda önizleme hâlâ koyu gösteriyor. Bu bilinen sınır, ve çözümü
 * önizlemeyi bir iframe'e almak — bir renk kararı değil.)
 *
 * Marka işareti neden burada: consumer.html ve admin.html bu dosyayı zaten
 * yüklüyor, landing.html'e de eklendi, yani üç yüzeyin ortak bulabildiği TEK
 * stil sayfası bu. 2026-08-20'ye kadar dört yüzeyde dört ayrı çizim vardı
 * (34px çerçeveli kare + çubuk, 38px degrade kare, 32px degrade kare, 30px
 * degrade kare) ve DÖRDÜ DE favicon.svg'deki yıldız değildi — kullanıcının
 * sekmede gördüğü işaret ürünün hiçbir ekranında yoktu.
 */

/* --------------------------------- Marka ---------------------------------- */

/* Şekil favicon.svg'nin path'inin ta kendisi. Oradaki on nokta 512'lik tuvalde
 * yazılı; buradaki yüzdeler aynı on noktanın kendi sınırlayıcı kutusuna
 * (x 118,20–393,80 · y 107,01–369,13) göre normalize edilmiş hâli. Yani şekli
 * değiştirmedik, ölçekledik: 50/0 tepe noktası, 100/38,2 sağ uç, 80,9/100 sağ
 * alt uç, ve simetrikleri.
 *
 * Neden clip-path da maske ya da <svg> değil: maskeye vereceğimiz `data:` URI
 * CSP'nin `img-src`ine takılan bir sınır (bugün `data:` açık ama bir ikon için
 * o kapıyı açık tutmak zorunda kalmak istemiyoruz), satır içi <svg> ise
 * consumer.html ve admin.html'e dokunmayı gerektirirdi. clip-path saf CSS,
 * tek kural, ve renk `background`tan geldiği için tema ile değişebiliyor.
 *
 * Degrade YOK: dört eski çizimin üçü 135° degradeydi ve o degrade
 * docs/design/kanvas/ayarlar/Dugmeler.dc.html'de adıyla atıldı. */
.brand-mark {
  /* Yıldızın kendi oranı 275,60 : 262,12 = 1,0514. Kutuya kare desek yıldız
     dikeyde eziliyor; `aspect-ratio` oranı tek yerde yazılı tutuyor. */
  width: 27px;
  aspect-ratio: 275.6 / 262.12;
  flex: none;
  /* İşaret PLATFORMUN mavisi, kiracının değil: `--accent` işletme kaydından
     eziliyor ve bu üç yüzeyin hiçbiri kiracı markası taşımıyor. Geri düşüş
     değeri admin.html için: o sayfa Tabler'ın kendi koyu temasını dayattığı
     için tokens.css'i yüklemiyor (gerekçe admin.css'in başında).
     Ölçüldü: #436ad9 koyu zeminde (#080b12) 4,03:1, açık zeminde (#f4f6f9)
     4,51:1 — WCAG 2.2 1.4.11'in metin dışı 3:1 tabanının üstünde. */
  background: var(--primary, #436ad9);
  clip-path: polygon(
    50% 0%, 61.804% 38.192%, 100% 38.196%, 69.099% 61.804%, 80.904% 100%,
    50% 76.393%, 19.096% 100%, 30.901% 61.804%, 0% 38.196%, 38.196% 38.192%
  );
  /* Üç yüzeyin işaretinin içinde metin duruyor ("A*" ve "✦") ve consumer.html
     ile admin.html bu ajanın dosyası değil. `font-size:0` onu ekrandan
     kaldırıyor; erişilebilirlik ağacından kaldırmak `aria-hidden` ister ve
     admin.html'de zaten var, consumer.html'de YOK (rapora yazıldı). */
  font-size: 0;
  line-height: 0;
}

/* ------------------------------ Ziyaretçi bandı ---------------------------- */

.home-banners { display: grid; gap: 12px; margin-bottom: 22px; }

.home-banner {
  padding: 16px 18px;
  /* Sol kenar bandın türünü değil varlığını işaretliyor; markanın mavisi,
     eski #3a5b50 yeşili değil — o yeşil tüketici yüzeyinin artık taşımadığı
     ayrı paletin son izlerinden biriydi. */
  border: 1px solid rgba(255, 255, 255, .14);
  border-left: 4px solid #436ad9;
  border-radius: 12px;
  background: #121a26;
  color: #e7edf6;
  font-family: var(--font-body);
}
/* 16/24 ve 600: tokens.css'in --text-md/--leading-md/--weight-heading değerleri.
   `font:` kısayolu değil uzun yazım — kısayol yazı tipi ailesini de sıfırlar. */
.home-banner strong { display: block; font-family: var(--font-heading); font-size: 16px; line-height: 24px; font-weight: 600; }
/* #9aa4b2 / #121a26 = 6,93:1. */
.home-banner p { margin: 6px 0 0; color: #9aa4b2; font-size: 14px; line-height: 20px; overflow-wrap: anywhere; }
/* #a9c1ff / #121a26 = 9,79:1 — bandın tek bağlantısı ve tek tıklanabilir şeyi. */
.home-banner a { display: inline-block; margin-top: 10px; color: #a9c1ff; font-size: 14px; line-height: 20px; font-weight: 510; }