/* ══════════════════════════════════════════════════════════════════
 * ARTİEKRAN TANITIM SİTESİ — AYDINLIK TEMA (3.29)
 *
 * site-v10.css'ten SONRA yüklenir ve GÖRÜNÜŞÜ değiştirir; yapıyı
 * (ızgara, boşluk, akış) ona bırakır. Tek dosya olduğu için geri
 * dönmek tek satır: site-ortak.php'den bu dosyanın <link> satırını
 * kaldırmak kurumsal/koyu temaya döndürür.
 *
 * DİL: modern SaaS. Aydınlık zemin, beyaz ve açık gri bölümlerin
 * sırayla gelmesi, yuvarlak köşe, yumuşak gölge, hap düğme, kalın
 * sans başlık, ürün ekran görüntüsünün öne çıkması.
 *
 * RENK YİNE PANELDEN. --vurgu ve türevleri site-ortak.php'de
 * hesaplanır; burada yalnızca nerede kullanıldıkları değişir.
 * ══════════════════════════════════════════════════════════════════ */

:root{
  --kagit:#ffffff;
  --ton:#f5f7f9;              /* araya giren açık bölüm */
  --ton2:#eef4f6;
  --kart-golge:0 1px 2px rgba(16,27,34,.04), 0 8px 24px rgba(16,27,34,.06);
  --kart-golge-uzeri:0 2px 4px rgba(16,27,34,.05), 0 16px 40px rgba(16,27,34,.10);
  --yuvarlak:16px;
  --yuvarlak-kucuk:12px;
}

/* ---- 1. TİPOGRAFİ: serif gitti, kalın sans geldi ---- */
body{font-family:var(--sans);background:var(--kagit)}
h1,h2,h3,.st-bol h2,.st-cta h2,.st-kahraman h1,.ky-kart h2,.bb-bolum h2{
  font-family:var(--sans);font-weight:700;letter-spacing:-.025em}
.st-kahraman h1{font-size:52px;line-height:1.1;font-weight:700}
.st-bol h2{font-size:38px;line-height:1.18}
.st-cta h2{font-size:36px}
.st-yazi h2,.bb-bolum h2{font-size:24px;letter-spacing:-.015em}
.st-kart h3,.pl h3,.es h3,.sk h3,.cz h3,.tk-kutu h3,.vd-grup h3,.st-ad h3,
.st-pk h3,.ky-pk h3,.nd b,.kn h3,.ind-ust h3{font-weight:700;letter-spacing:-.015em}
.st-bol .st-girisi,.st-ac{font-size:17.5px;line-height:1.7;color:var(--soluk)}
.st-pk .st-tutar b,.st-rakam>div b,.st-capa b,.st-capa-tek b{
  font-family:var(--sans);font-weight:700;letter-spacing:-.03em}

/* ---- 2. BÖLÜM ETİKETİ: çizgi değil, hap rozet ---- */
.st-etiket{display:inline-block;background:var(--vurgu-cok-acik);color:var(--vurgu-baglanti);
  padding:7px 15px;border-radius:99px;font-family:var(--sans);font-size:12.5px;font-weight:700;
  letter-spacing:.02em;text-transform:none;margin-bottom:20px}
.st-etiket::before{display:none}
.st-bol.koyu .st-etiket,.st-kahraman .st-etiket{background:var(--vurgu-cok-acik);color:var(--vurgu-baglanti)}

/* ---- 3. ZEMİNLER: koyu kahraman gitti, aydınlık geldi ---- */
.st-kahraman{background:linear-gradient(180deg,var(--ton2) 0%,var(--kagit) 100%);color:var(--metin)}
.st-kahraman h1{color:var(--metin)}
.st-kahraman p.st-ac,.st-kahraman p.st-ac-kucuk,
.st-kahraman .st-ac,.st-kahraman .st-ac-kucuk{color:var(--soluk)}
.st-kahraman .st-ac-kucuk a{color:var(--vurgu-baglanti)}
.st-bol.koyu{background:var(--ton);color:var(--metin)}
.st-bol.koyu h2,.st-bol.koyu h3{color:var(--metin)}
.st-bol.koyu .st-girisi,.st-bol.koyu p{color:var(--soluk)}
.st-bol.gri{background:var(--ton)}
.st-bol{padding:88px 0}
.st-bol.dar{padding:64px 0}

/* ---- 4. ÜST MENÜ: beyaz, hap düğmeli ---- */
.st-ust{background:rgba(255,255,255,.92);backdrop-filter:blur(10px);color:var(--metin);
  border-bottom:1px solid #e7edf0}
.st-ust .st-kap{min-height:74px}
.st-logo{color:var(--metin);font-family:var(--sans);font-weight:700;font-size:20px}
.st-logo i{border-radius:10px;background:var(--vurgu);color:var(--vurgu-yazi)}
.st-logo small{font-family:var(--sans);font-size:10px;letter-spacing:.1em;color:var(--soluk);font-weight:600}
.st-ust nav a{color:#44555f;font-weight:500;font-size:15px;border-radius:99px;padding:9px 14px}
.st-ust nav a:hover{background:var(--ton);color:var(--metin)}
.st-ust nav a.on{background:none;color:var(--vurgu-baglanti);border-bottom:0;font-weight:600}
.st-ust nav a.cizgi{border:1px solid #d9e2e6;color:var(--metin);margin-left:8px}
.st-ust nav a.cizgi:hover{background:var(--ton);border-color:#c3d0d6}
.st-ust nav a.dug{background:var(--vurgu);color:var(--vurgu-yazi);border:0;font-weight:700;
  padding:11px 22px;border-radius:99px;box-shadow:0 2px 10px rgba(16,27,34,.10)}
.st-ust nav a.dug:hover{background:var(--vurgu-koyu)}
.st-mobil{color:var(--metin)}
@media(max-width:1040px){
  .st-ust nav{background:#fff;border-top:1px solid #e7edf0;margin-top:8px}
}

/* ---- 5. DÜĞMELER: hap ---- */
.st-bt{border-radius:99px;font-weight:700;font-size:16px;padding:15px 30px;border-width:1px}
.st-bt.ana{background:var(--vurgu);color:var(--vurgu-yazi);box-shadow:0 2px 12px rgba(16,27,34,.12)}
.st-bt.ana:hover{background:var(--vurgu-koyu)}
.st-bt.yesil{background:var(--vurgu);color:var(--vurgu-yazi);border-radius:99px}
.st-bt.cizgi{border-color:#d9e2e6;color:var(--metin);background:#fff}
.st-bt.cizgi:hover{background:var(--ton);border-color:#c3d0d6}
.st-bt.acik{border-color:#d9e2e6;color:var(--metin);background:#fff}
.st-bt.acik:hover{background:var(--ton)}
.st-kahraman .st-bt.cizgi{border-color:#cfdae0}

/* ---- 6. KARTLAR: saç teli ızgara gitti, yumuşak kart geldi ---- */
.st-kartlar,.pl-izgara,.nd-izgara,.sk-izgara,.kn-izgara,.ind-izgara,.ps-serit,.st-fiyat,.st-ref{
  gap:22px;border:0}
.st-kartlar>*,.pl-izgara>*,.nd-izgara>*,.sk-izgara>*,.kn-izgara>*,.ind-izgara>*,
.ps-serit>*,.st-fiyat>*,.st-ref>*{border:0}
.st-kart,.sk,.pl,.es,.cz-gorsel,.tk-kutu,.vd-grup,.st-pk,.ky-kart,.ky-pk,.st-os,.ps,
.st-deneme,.ok-kutu,.vd-sahne,.st-ref>span,.st-ref-bos,.ks-sar,.kn,.ind,.dr-sar,
.st-birak,.st-gizlilik,.tv-cerceve,.st-tv-cerceve{
  border:1px solid #e7edf0;border-radius:var(--yuvarlak);background:#fff;box-shadow:var(--kart-golge)}
.st-kart,.sk,.kn,.ind{padding:28px}
.nd{border:1px solid #e7edf0;border-radius:var(--yuvarlak);background:#fff;padding:28px;
  box-shadow:var(--kart-golge)}
.nd b{font-size:18px;margin-bottom:10px}
.st-kart:hover,.sk:hover,.pl:hover,.kn:hover{box-shadow:var(--kart-golge-uzeri);transform:translateY(-3px)}
.st-kart,.sk,.pl,.kn{transition:box-shadow .2s,transform .2s}
.st-bol.gri .st-kart,.st-bol.koyu .st-kart{background:#fff;color:var(--metin)}
.st-bol.koyu .st-kart p{color:var(--soluk)}
.st-kart i{border-radius:12px;background:var(--vurgu-cok-acik);color:var(--vurgu-baglanti);
  width:48px;height:48px;font-size:21px}
.kn{text-decoration:none}
.kn:hover{background:#fff}
.kn-no{display:inline-grid;place-items:center;width:40px;height:40px;border-radius:12px;
  background:var(--vurgu-cok-acik);color:var(--vurgu-baglanti);font-family:var(--sans);
  font-size:14px;font-weight:700;letter-spacing:0;margin-bottom:16px}
.kn em{font-weight:700;letter-spacing:0;text-transform:none;font-size:14px;font-family:var(--sans)}

/* ---- 7. KAHRAMAN: ürün görseli öne ---- */
.st-kahraman .st-izgara{align-items:center}
.st-gorsel-cerceve{border-radius:var(--yuvarlak);overflow:hidden;background:#fff;
  border:1px solid #e7edf0;box-shadow:0 4px 12px rgba(16,27,34,.06),0 24px 60px rgba(16,27,34,.12)}
.st-gorsel-cerceve img{display:block;width:100%;height:auto}
.st-gorsel-ust{display:flex;align-items:center;gap:7px;padding:11px 14px;background:#f7f9fa;
  border-bottom:1px solid #eef3f5}
.st-gorsel-ust span{width:10px;height:10px;border-radius:50%;background:#dde5e9;display:block}
.st-gorsel-ust b{margin-left:10px;font-size:11.5px;font-weight:600;color:#9aabb4;
  font-family:var(--sans);letter-spacing:.02em}

/* güven çıpası: koyu şerit değil, açık kartlar */
.st-capa{border-top:0;gap:18px;margin-top:44px}
.st-capa>div{border:1px solid #e7edf0;border-right:1px solid #e7edf0;border-radius:var(--yuvarlak);
  background:#fff;padding:22px 24px;box-shadow:var(--kart-golge)}
.st-capa b{color:var(--metin);font-size:30px}
.st-capa span{color:var(--soluk)}
.st-capa-tek{border-top:1px solid #e7edf0;color:var(--soluk)}
.st-capa-tek b{color:var(--metin);font-family:var(--sans);font-weight:700;font-size:18px}

/* ---- 8. ADIMLAR VE RAKAMLAR ---- */
.st-adim{gap:22px;border-top:0}
.st-ad{border:1px solid #e7edf0;border-radius:var(--yuvarlak);background:#fff;padding:26px;
  box-shadow:var(--kart-golge)}
.st-ad::before{display:inline-grid;place-items:center;width:40px;height:40px;border-radius:12px;
  background:var(--vurgu-cok-acik);color:var(--vurgu-baglanti);font-size:15px;font-weight:700;
  font-family:var(--sans)}
.st-rakam,.st-rakam-acik{gap:22px;border-top:0;text-align:left}
.st-rakam>div,.st-rakam-acik>div{border:1px solid #e7edf0;border-radius:var(--yuvarlak);
  background:#fff;padding:24px;box-shadow:var(--kart-golge)}
.st-rakam>div b,.st-rakam-acik>div b{color:var(--metin);font-size:38px}
.st-rakam>div span,.st-rakam-acik>div span{color:var(--soluk);font-family:var(--sans);
  font-size:13.5px;letter-spacing:0;text-transform:none;font-weight:500}

/* ---- 9. PLATFORM ŞERİDİ VE ROZETLER ---- */
.ps{border-radius:var(--yuvarlak-kucuk);padding:20px 12px}
.ps i{border-radius:12px}
.ps small{font-family:var(--sans);font-size:12px;letter-spacing:0;text-transform:none;font-weight:500}
.pl{border-top:1px solid #e7edf0;padding:26px}
.pl.tam{border-top:1px solid #e7edf0;box-shadow:inset 0 3px 0 var(--vurgu),var(--kart-golge)}
.pl.tarayici{box-shadow:inset 0 3px 0 #d6a93f,var(--kart-golge)}
.pl.yol{box-shadow:inset 0 3px 0 #c4d0d6,var(--kart-golge)}
.pl-rz{background:var(--vurgu-cok-acik)!important;padding:5px 11px;border-radius:99px;
  font-family:var(--sans);font-size:11.5px;font-weight:700;letter-spacing:0}
.pl-rz::before{display:inline-block;content:"";width:6px;height:6px;border-radius:50%;
  background:currentColor;margin-right:6px}
.pl-rz.tarayici{background:#fdf4e3!important}
.pl-rz.yol{background:#eef2f4!important}
/* Rozet yazı renkleri. Önceki katman rozetin zeminini kaldırmış ve
   yazıyı beyaz sayfaya göre ayarlamıştı; burada hap zemin geri geldiği
   için yazı da zemine göre yeniden kurulur. Ayrıca ".st-bol.koyu" artık
   KOYU değil: oradaki açık rozet yazıları okunmuyordu (ölçüm:
   "Tarayıcıdan çalışır" 1,74 · "Yol haritasında" 3,69).
   Ölçülen yeni değerler: 4,92 (tarayıcı) · 5,43 (yol). */
.pl-rz.tam,.st-bol.koyu .pl-rz.tam{color:var(--vurgu-baglanti)}
.pl-rz.tarayici,.st-bol.koyu .pl-rz.tarayici{color:#8a6410}
.pl-rz.yol,.st-bol.koyu .pl-rz.yol{color:#55646e}
.pl-logo{border-radius:12px}
/* Ekran taklidi kutular KOYU kalır — zeminleri sabit renktir, panelden
   değişmez. O yüzden üstlerindeki yazı da SABİT açık bir ton olmalı;
   panele bağlı türev (--koyu-soluk) kullanılırsa "koyu zemin" açık
   seçildiğinde yazı koyulaşıp okunmaz oluyordu (ölçüm: "EKRAN 1" 2,64).
   Ölçülen yeni değerler: 5,46 ve 7,51. */
.vd-ayrik span{color:#9db0ba}
.vd-etiket{color:#9db0ba}
.st-oyn a{border-radius:99px;border-color:#e0e8eb;font-weight:600}
.st-oyn a em{border-radius:99px;font-family:var(--sans);letter-spacing:0;font-size:11.5px}

/* ---- 10. FİYAT ---- */
.st-fiyat{align-items:stretch}
.st-pk{padding:30px}
.st-pk.one{border-color:var(--vurgu);box-shadow:0 0 0 1px var(--vurgu),var(--kart-golge-uzeri)}
.st-pk.one::before{background:var(--vurgu-cok-acik);color:var(--vurgu-baglanti);padding:5px 12px;
  border-radius:99px;display:inline-block;font-family:var(--sans);font-size:11.5px;font-weight:700;
  letter-spacing:0;text-transform:none;margin-bottom:16px}
.st-pk .st-tutar b{font-size:40px}
.st-donem{border-radius:99px;border-color:#e0e8eb;padding:5px;background:var(--ton)}
.st-donem button{border-radius:99px;font-weight:600}
.st-donem button.on{background:#fff;color:var(--metin);box-shadow:var(--kart-golge)}

/* ---- 11. REFERANS, CTA, ALT BİLGİ ---- */
.st-ref>span{border:1px solid #e7edf0;border-radius:var(--yuvarlak-kucuk);padding:20px 24px;
  box-shadow:var(--kart-golge)}
.st-ref em{font-family:var(--sans);letter-spacing:0;text-transform:none;font-size:12.5px}
.st-cta{background:var(--vurgu);color:var(--vurgu-yazi);padding:84px 0}
.st-cta h2{color:var(--vurgu-yazi)}
.st-cta p{color:var(--vurgu-yazi);opacity:.86;font-size:17.5px}
.st-cta .st-bt.ana{background:#fff;color:var(--metin);box-shadow:0 4px 18px rgba(0,0,0,.14)}
.st-cta .st-bt.ana:hover{background:#f2f5f6}
.st-cta .st-bt.cizgi{border-color:rgba(255,255,255,.5);color:var(--vurgu-yazi);background:none}
.st-cta .st-bt.cizgi:hover{background:rgba(255,255,255,.12)}
.st-alt{background:var(--koyu);color:var(--koyu-metin);padding:64px 0 32px}
.st-alt b{font-family:var(--sans);font-size:12.5px;letter-spacing:.02em;text-transform:none;
  font-weight:700;color:var(--koyu-yazi)}
.st-alt a{font-size:14.5px;color:var(--koyu-metin)}
.st-alt a:hover{color:var(--koyu-yazi)}
.st-telif{font-family:var(--sans);letter-spacing:0;font-size:13px}

/* ---- 12. İÇ SAYFALAR ---- */
.ks-tablo thead th.onerilen{background:var(--vurgu-cok-acik);box-shadow:inset 0 3px 0 var(--vurgu)}
/* Köşeleri yuvarlatmak için "overflow:hidden" yazmıştım; karşılaştırma
   tablosu telefonda geniş olduğu için o kural tablonun sağ tarafını
   kesiyordu. Yatay kaydırma kalmalı — yuvarlak köşe zaten kırpılıyor. */
.ks-sar{overflow-x:auto;overflow-y:hidden}
.bb-ara,.sh-ara{border-radius:var(--yuvarlak-kucuk)}
.bb-icindekiler a{border-radius:8px;padding-left:14px}
.bb-bolum summary{font-weight:600}
.st-eksik{border-radius:8px;font-family:var(--sans);letter-spacing:0;font-weight:600}
.st-birak{border-radius:var(--yuvarlak);border-color:#d7e3e8}
.st-gizlilik{border-radius:var(--yuvarlak-kucuk);background:var(--vurgu-cok-acik);
  color:var(--vurgu-baglanti);border:0;box-shadow:none}
.es>b{display:inline-grid;place-items:center;width:40px;height:40px;border-radius:12px;
  background:var(--vurgu-cok-acik);color:var(--vurgu-baglanti);font-family:var(--sans);
  font-size:15px;font-weight:700}
.es-kod span{border-radius:10px;background:var(--metin);color:#fff;font-family:var(--sans);font-weight:700}
.dr-rz{font-family:var(--sans);letter-spacing:0;font-size:12.5px;font-weight:700}
.dr-tablo th{font-family:var(--sans);letter-spacing:.02em;text-transform:none;font-size:12.5px;
  font-weight:700;background:var(--ton)}
.dr-duyuru{border-radius:var(--yuvarlak)}
.dr-duyuru b{font-family:var(--sans);letter-spacing:0;text-transform:none;font-size:13px}
.ind-rz{font-family:var(--sans);letter-spacing:0;text-transform:none;font-size:12px;font-weight:700}
.ind-bilgi dt{font-family:var(--sans);letter-spacing:0;text-transform:none;font-size:12.5px;font-weight:600}
.ind-bag{font-family:var(--sans);letter-spacing:0;text-transform:none;font-size:14px;font-weight:700}
.sk-ara-baslik{font-size:20px;font-weight:700}

@media(max-width:860px){
  .st-kahraman h1{font-size:36px}
  .st-bol h2{font-size:28px}
  .st-cta h2{font-size:26px}
  .st-bol{padding:60px 0}
  .st-capa>div,.st-rakam>div,.st-rakam-acik>div{padding:20px}
}

/* ══════════════════════════════════════════════════════════════════
   13. XIBO KURGUSU — 3.30
   Ana sayfa dokuz bölüme geçti; menü açılır alt menü aldı. Buradaki
   kurallar o düzenin gerektirdiği YENİ parçalar içindir: açılır menü,
   açılır madde (accordion), altılı kutu ızgarası, tikli liste,
   ortalanmış bölüm başlığı ve kapanış bağlantıları.
   ══════════════════════════════════════════════════════════════════ */

/* ---- açılır menü ---- */
.st-acilir{position:relative;display:inline-flex}
.st-acilir>a{display:inline-flex;align-items:center;gap:5px}
.st-acilir>a em{font-style:normal;font-size:10px;opacity:.55;transform:translateY(1px)}
.st-acilir-kutu{position:absolute;top:100%;left:0;min-width:232px;padding:8px;
  background:#fff;border:1px solid #e4ebee;border-radius:14px;
  box-shadow:0 18px 44px rgba(16,40,50,.14);
  display:grid;gap:2px;opacity:0;visibility:hidden;transform:translateY(6px);
  transition:opacity .14s ease,transform .14s ease;z-index:60}
/* Üstteki boşluk fareyle geçerken menünün kapanmasını engeller. */
.st-acilir::after{content:"";position:absolute;top:100%;left:0;right:0;height:12px}
.st-acilir:hover .st-acilir-kutu,
.st-acilir:focus-within .st-acilir-kutu{opacity:1;visibility:visible;transform:translateY(0)}
.st-acilir-kutu a{display:block;padding:9px 12px;border-radius:9px;font-size:14px;
  font-weight:500;color:var(--metin);text-decoration:none;white-space:nowrap}
.st-acilir-kutu a:hover{background:var(--vurgu-cok-acik);color:var(--vurgu-baglanti)}

/* ---- ortalanmış bölüm başlığı ---- */
.xb-orta .st-kap>h1,.xb-orta .st-kap>h2,.xb-orta .st-kap>.st-girisi{text-align:center}
.xb-genis{max-width:760px}
.xb-orta .xb-genis{margin-left:auto;margin-right:auto}
.xb-altbag{margin:24px 0 0;text-align:center;font-weight:600}

/* ---- tanıtım videosu ---- */
.xb-video{margin:34px auto 0;max-width:900px}
.xb-video video{display:block;width:100%;border-radius:var(--yuvarlak);
  background:#0a141a;box-shadow:var(--kart-golge-uzeri)}

/* ---- iki sütun: görsel + yazı ---- */
.xb-ikili{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:56px;align-items:center}
.xb-ikili-gorsel img{display:block;width:100%;height:auto;border-radius:var(--yuvarlak);
  border:1px solid #e7edf0;box-shadow:var(--kart-golge-uzeri)}

/* ---- açılır madde ---- */
.xb-acilan{display:grid;gap:10px;margin-top:26px}
.xb-acilan details{background:#fff;border:1px solid #e7edf0;border-radius:var(--yuvarlak-kucuk);
  box-shadow:var(--kart-golge);overflow:hidden}
.xb-acilan summary{list-style:none;cursor:pointer;padding:16px 46px 16px 18px;position:relative;
  font-weight:700;font-size:16px;color:var(--metin)}
.xb-acilan summary::-webkit-details-marker{display:none}
.xb-acilan summary::after{content:"›";position:absolute;right:18px;top:50%;
  transform:translateY(-50%) rotate(90deg);font-size:20px;line-height:1;
  color:var(--vurgu-baglanti);transition:transform .15s ease}
.xb-acilan details[open] summary::after{transform:translateY(-50%) rotate(-90deg)}
.xb-acilan details>p{margin:0;padding:0 18px 18px;color:var(--soluk);font-size:15px;line-height:1.65}

/* ---- altılı kutu ızgarası ---- */
.xb-alti{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:38px}
.xb-alti>div{background:#fff;border:1px solid #e7edf0;border-radius:var(--yuvarlak);
  box-shadow:var(--kart-golge);padding:26px 24px}
.xb-alti i{display:grid;place-items:center;width:46px;height:46px;border-radius:14px;
  background:var(--vurgu-cok-acik);color:var(--vurgu-baglanti);
  font-style:normal;font-size:21px;margin-bottom:14px}
.xb-alti b{display:block;font-size:16.5px;margin-bottom:7px;color:var(--metin)}
.xb-alti p{margin:0;font-size:14.5px;color:var(--soluk);line-height:1.65}

/* ---- tikli liste ---- */
.xb-tik{list-style:none;margin:24px 0 0;padding:0;display:grid;gap:14px}
.xb-tik li{position:relative;padding-left:34px;font-size:15.5px;color:var(--soluk);line-height:1.6}
.xb-tik li b{color:var(--metin)}
.xb-tik li::before{content:"✓";position:absolute;left:0;top:1px;width:22px;height:22px;
  display:grid;place-items:center;border-radius:50%;font-size:12px;font-weight:800;
  background:var(--vurgu-cok-acik);color:var(--vurgu-baglanti)}

/* ---- yan kutu (çağrı) ---- */
.xb-yan-kutu{background:#fff;border:1px solid #e7edf0;border-radius:var(--yuvarlak);
  box-shadow:var(--kart-golge-uzeri);padding:34px 32px}
.xb-yan-kutu h3{margin:0 0 12px;font-size:21px;line-height:1.3;color:var(--metin)}
.xb-yan-kutu p{margin:0 0 22px;font-size:15px;color:var(--soluk);line-height:1.65}
.xb-rozet{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-bottom:22px}
.xb-rozet>div{background:var(--ton);border-radius:var(--yuvarlak-kucuk);padding:16px 18px}
.xb-rozet b{display:block;font-size:24px;line-height:1.1;color:var(--metin)}
.xb-rozet span{display:block;margin-top:5px;font-size:12.5px;color:var(--soluk);line-height:1.45}

/* ---- kapanış bağlantıları ---- */
.xb-son .st-kap{text-align:center}
.xb-son-bag{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-top:22px}
.xb-son-bag a{display:inline-block;padding:14px 26px;border-radius:99px;
  border:1px solid #dde6ea;background:#fff;color:var(--metin);
  text-decoration:none;font-weight:600;font-size:15px;box-shadow:var(--kart-golge)}
.xb-son-bag a:hover{border-color:var(--vurgu);color:var(--vurgu-baglanti)}

@media(max-width:980px){
  .xb-ikili{grid-template-columns:1fr;gap:34px}
  .xb-ikili-gorsel{order:2}
  .xb-alti{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:1040px){
  /* Başlık kabı SARMALI: ".st-ust .st-kap" düz bir satır olduğu için
     hamburger paneli logonun yanındaki artık boşluğa sıkışıyor, logo da
     aşağı itiliyordu (telefonda ölçüldü). Sarınca panel logonun ALTINA,
     tam genişlikte düşer. */
  .st-ust .st-kap{flex-wrap:wrap}
  .st-ust .st-logo{margin-right:auto}
  /* Hamburger açıldığında alt menü hep görünür olur; üzerine gelme yok. */
  #stNav.acik .st-acilir{display:block;width:100%}
  #stNav.acik .st-acilir-kutu{position:static;opacity:1;visibility:visible;transform:none;
    box-shadow:none;border:0;padding:0 0 6px 14px;min-width:0}
  /* Hamburger panelinde alt menü yazıları SARMALI. "Kafe · restoran ·
     pastane" gibi uzun kalemler nowrap kaldığı için panel 390 pikselde
     8 piksel taşıyordu (ölçüldü: scrollWidth 398). */
  #stNav.acik .st-acilir-kutu a{padding:7px 0;font-size:13.5px;color:var(--soluk);
    white-space:normal;line-height:1.4}
  #stNav.acik{max-width:100%;box-sizing:border-box}
  #stNav.acik .st-acilir::after{display:none}
}
@media(max-width:640px){
  .xb-alti{grid-template-columns:1fr}
  .xb-rozet{grid-template-columns:1fr}
}

/* ══════════════════════════════════════════════════════════════════
   14. VURGU RENGİ NEREDE YAZI OLUR — 3.30
   Renk motoru iki güvenli değer üretiyor ama bazı yerler onları
   kullanmıyordu:
     --vurgu-yazi      : vurgu ZEMİNİ üstünde okunan renk (siyah/beyaz)
     --vurgu-baglanti  : vurgunun AÇIK zeminde yazı olarak okunan hâli
   Sabit "#fff" ve ham "var(--vurgu)" kullanılan yerler sarı gibi açık
   bir vurgu seçilince okunmaz oluyordu (ölçüldü: "SONRA · fiyatlı" 1,71
   ve kayıt sayfasında "Teklif" 1,56). Hepsi motora bağlandı.
   ══════════════════════════════════════════════════════════════════ */

/* --- vurgu ZEMİN, yazı motordan --- */
.st-bt.yesil,.st-donem button.on,.ky-donem button.on,.vd-grup button.on,
.st-cta,.os-rozet.sonra,.st-form button,.ok-adimlar button.on b,
.es>b,.vd-adim>b,.st-adim b{color:var(--vurgu-yazi)}
.st-cta h2,.st-cta p,.st-cta .st-girisi{color:var(--vurgu-yazi)}
.st-cta p{opacity:.88}

/* --- vurgu YAZI/İŞARET olarak, motordan --- */
.st-etiket,.st-bt.acik,.ky-pk em,.st-pk ul li::before,.st-sss summary::after,
.tk-kutu li::before,.cz-govde li::before,.st-vd-liste li::before,
.st-tik span::before,.st-rakam>div b,.es-kod,.st-gos.kesin{color:var(--vurgu-baglanti)}

/* --- tarayıcı çubuğundaki adres --- */
/* Kendi yazdığım sabit renk 2,24'te kalmıştı; zemini de sabit olduğu
   için sabit ama koyu bir ton veriyoruz — ölçülen 5,31 (zemin #f7f9fa). */
.st-gorsel-ust b{color:#5a6a73}
