/* ============================================================================
   SadeceKurye — public site
   Tek stil dosyası. Kaynak: SADECEKURYE-UI-SARTNAMESI.md §1 (tasarım sistemi).

   Bu dosya satın alınmış "winter-flat" şablonunun yerine geçti. Şablon
   Bootstrap 3 + jQuery 2.2.1 + tether + owl.carousel + bootstrap-select +
   Font Awesome yüklüyordu (~489 KB) ve mobil uygulamanın tasarım diliyle
   hiçbir bağı yoktu.

   Şartname yasakları burada da geçerli:
     · gradyan yok
     · cam / blur efekti yok
     · dolgu ikon yok (ikonlar tek çizgi, inline SVG)
     · aynı ekranda ikinci parlak renk yok — tek vurgu `--far`
     · gölge yalnızca yüzen kartlarda ve çok düşük opaklıkta
   ============================================================================ */

/* ── Tokenlar · §1.2 ─────────────────────────────────────────────────────── */
:root {
  /* Ortak */
  --far:        #FFC24A;   /* ana vurgu — hi-vis amber */
  --far-koyu:   #E0A32E;   /* basılı hâl */
  --far-soluk:  #FFF4DC;   /* açık temada amber zemin */
  --reflektor:  #FF5A2B;   /* acil, hata, yıkıcı eylem */
  --yol:        #2FBF71;   /* onay, geçerlilik, başarı */
  --uyari:      #E8A317;   /* dikkat, bekleyen durum */

  /* Müşteri tarafı (açık) — sitenin ana karakteri */
  --serit:      #F6F7F9;   /* zemin */
  --kagit:      #FFFFFF;   /* kart yüzeyi */
  --murekkep:   #101319;   /* birincil metin */
  --murekkep-2: #5C6672;   /* ikincil metin */
  --murekkep-3: #8A929E;   /* üçüncül metin */
  --cizgi:      #E4E7EB;   /* kenarlık, ayırıcı */

  /* Kurye tarafı (koyu) — kurye bölümlerinde blok zemin olarak */
  --asfalt:     #12161C;
  --asfalt-2:   #1C222B;
  --asfalt-3:   #232B36;
  --metin:      #FFFFFF;
  --metin-2:    #8A929E;

  /* Amber üstü metin DAİMA koyu mürekkep: beyaz 1,61:1 kalır, mürekkep 11,5:1 */
  --far-ustu:   #101319;

  /* Boşluk ölçeği · §1.4 */
  --s4: 4px;  --s8: 8px;   --s12: 12px; --s16: 16px; --s20: 20px;
  --s24: 24px; --s32: 32px; --s40: 40px; --s56: 56px;

  /* Köşe yarıçapı · §1.4 müşteri tarafı */
  --r-kart: 16px;
  --r-giris: 12px;
  --r-hap: 999px;

  /* Gölge · §1.2 — yalnızca yüzen kartlarda, çok düşük opaklık */
  --golge: 0 2px 8px rgba(0, 0, 0, .06);

  /* Hareket · §1.6 */
  --sure-kucuk: 120ms;
  --sure-ekran: 240ms;
  --egri-out: cubic-bezier(.22, .61, .36, 1);

  --kenar: 20px;          /* yatay kenar boşluğu, §1.4 */
  --olcu: 1180px;         /* içerik genişliği */
}

/* ── Sıfırlama ───────────────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  background: var(--serit);
  color: var(--murekkep);
  font-family: "Barlow", system-ui, -apple-system, "Segoe UI", sans-serif;
  font-size: 15px;             /* govde · §1.3 */
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

img { max-width: 100%; height: auto; display: block; }
svg { display: block; }

a { color: inherit; text-decoration: none; }
a:hover { text-decoration: none; }

button { font: inherit; color: inherit; }

/* Odak her yerde görünür · §6 klavye erişimi */
:focus-visible {
  outline: 3px solid var(--far-koyu);
  outline-offset: 2px;
  border-radius: 4px;
}

/* ── Tipografi · §1.3 ────────────────────────────────────────────────────── */
h1, h2, h3, h4 {
  font-family: "Barlow Condensed", "Barlow", system-ui, sans-serif;
  margin: 0;
  text-wrap: balance;
}

.kahraman {                                   /* 56 · net kazanç, teklif tutarı */
  font-size: clamp(38px, 7vw, 56px);
  font-weight: 700;
  letter-spacing: -.03em;
  line-height: 1.02;
}
h1, .baslik-1 {                               /* 30 · ekran başlığı */
  font-size: clamp(26px, 4vw, 30px);
  font-weight: 700;
  letter-spacing: -.02em;
  line-height: 1.15;
}
h2, .baslik-2 {                               /* 22 · bölüm başlığı */
  font-size: 22px;
  font-weight: 600;
  letter-spacing: -.01em;
  line-height: 1.25;
}
h3, .baslik-3 {                               /* 17 · liste öğesi başlığı */
  font-family: "Barlow", sans-serif;
  font-size: 17px;
  font-weight: 600;
  line-height: 1.35;
}

p { margin: 0; max-width: 68ch; }

.govde-s { font-size: 13px; }                 /* ikincil açıklama */
.mikro   { font-size: 11px; }                 /* dipnot */

.etiket {                                     /* 12 · bölüm etiketi */
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--murekkep-2);
}

.veri {                                       /* 14 mono · takip no, plaka, kod */
  font-family: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: .02em;
  font-variant-numeric: tabular-nums;
}

/* Rakamlar her yerde tabular · §1.3 */
.rakam { font-variant-numeric: tabular-nums; }

.ikincil { color: var(--murekkep-2); }
.ucuncul { color: var(--murekkep-3); }

/* ── Yerleşim ────────────────────────────────────────────────────────────── */
.kap {
  width: 100%;
  max-width: var(--olcu);
  margin-inline: auto;
  padding-inline: var(--kenar);
}

.bolum { padding-block: var(--s56); }
.bolum-dar { padding-block: var(--s40); }

.yigin { display: flex; flex-direction: column; }
.yigin-4  { gap: var(--s4); }
.yigin-8  { gap: var(--s8); }
.yigin-12 { gap: var(--s12); }
.yigin-16 { gap: var(--s16); }
.yigin-24 { gap: var(--s24); }
.yigin-32 { gap: var(--s32); }

.satir { display: flex; align-items: center; gap: var(--s12); flex-wrap: wrap; }

.izgara { display: grid; gap: var(--s20); }
.izgara-2 { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
.izgara-3 { grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
.izgara-4 { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }

/* İki sütunlu yerleşimler. Satır içi `grid-template-columns` medya sorgusuyla
   ezilemediği için bunlar sınıf olarak tanımlı. */
.izgara-yan {                       /* içerik + yan kutu */
  grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr);
  align-items: center;
  gap: var(--s40);
}
.izgara-icerik {                    /* geniş içerik + dar kenar çubuğu */
  grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr);
  align-items: start;
  gap: var(--s32);
}
.izgara-cagri {                     /* metin + tek buton */
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: var(--s32);
}

@media (max-width: 900px) {
  .izgara-yan,
  .izgara-icerik,
  .izgara-cagri { grid-template-columns: 1fr; gap: var(--s24); }
  .izgara-cagri .btn { justify-self: start; }
}

/* ── İmza öğesi · §1.5 yol şeridi ────────────────────────────────────────
   Bölüm ayırıcı olarak düz çizgi değil kesikli şerit: 12 dolu · 8 boşluk · 2 kalın.
   Aynı desen dikey bağlantıda (takip adımları) tekrar eder. Tek grafik fikir. */
.serit-cizgi {
  height: 2px;
  border: 0;
  margin: 0;
  background: repeating-linear-gradient(
    to right,
    color-mix(in srgb, var(--murekkep-3) 35%, transparent) 0 12px,
    transparent 12px 20px
  );
}
.serit-dikey {
  width: 2px;
  background: repeating-linear-gradient(
    to bottom,
    color-mix(in srgb, var(--murekkep-3) 35%, transparent) 0 12px,
    transparent 12px 20px
  );
}
.koyu .serit-cizgi,
.koyu .serit-dikey {
  background-image: repeating-linear-gradient(
    to right,
    color-mix(in srgb, var(--metin-2) 35%, transparent) 0 12px,
    transparent 12px 20px
  );
}
.koyu .serit-dikey {
  background-image: repeating-linear-gradient(
    to bottom,
    color-mix(in srgb, var(--metin-2) 35%, transparent) 0 12px,
    transparent 12px 20px
  );
}

/* ── Yüzeyler ────────────────────────────────────────────────────────────── */
.kart {
  background: var(--kagit);
  border: 1px solid var(--cizgi);
  border-radius: var(--r-kart);
  padding: var(--s24);
}
.kart-yuzen { box-shadow: var(--golge); }

/* Koyu blok — kurye tarafı karakteri (§1.1 "aynı marka, iki karakter") */
.koyu {
  background: var(--asfalt);
  color: var(--metin);
  border-radius: var(--r-kart);
}
.koyu .ikincil { color: var(--metin-2); }
.koyu .etiket { color: var(--metin-2); }
.koyu .kart {
  background: var(--asfalt-2);
  border-color: var(--asfalt-3);
  color: var(--metin);
  box-shadow: none;             /* koyu temada gölge yerine kenarlık · §1.2 */
}

/* ── Butonlar · §1.4 ─────────────────────────────────────────────────────── */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--s8);
  min-height: 56px;             /* müşteri ana buton · §1.4 */
  padding: 0 var(--s24);
  border: 1px solid transparent;
  border-radius: var(--r-hap);  /* müşteri: hap */
  font-weight: 600;
  font-size: 15px;
  cursor: pointer;
  text-align: center;
  transition: background var(--sure-kucuk) var(--egri-out),
              border-color var(--sure-kucuk) var(--egri-out);
}

.btn-ana {
  background: var(--far);
  color: var(--far-ustu);       /* amber üstü daima koyu mürekkep */
}
.btn-ana:hover { background: var(--far-koyu); }

.btn-ikincil {
  min-height: 48px;             /* müşteri ikincil · §1.4 */
  background: transparent;
  color: var(--murekkep);
  border-color: var(--cizgi);
}
.btn-ikincil:hover { border-color: var(--murekkep-3); }

.koyu .btn-ikincil {
  color: var(--metin);
  border-color: var(--asfalt-3);
}
.koyu .btn-ikincil:hover { border-color: var(--metin-2); }

.btn-blok { width: 100%; }

/* Minimum dokunma hedefi 48×48 · §6 */
.dokunma { min-width: 48px; min-height: 48px; display: inline-flex;
           align-items: center; justify-content: center; }

/* ── Form alanları ───────────────────────────────────────────────────────── */
.alan { display: flex; flex-direction: column; gap: var(--s8); }

.alan > label {
  font-size: 13px;
  font-weight: 600;
  color: var(--murekkep-2);
}

.giris, .secim, .metin-alani {
  width: 100%;
  min-height: 48px;
  padding: var(--s12) var(--s16);
  background: var(--kagit);
  color: var(--murekkep);
  border: 1px solid var(--cizgi);
  border-radius: var(--r-giris);
  font: inherit;
  transition: border-color var(--sure-kucuk) var(--egri-out);
}
.metin-alani { min-height: 120px; resize: vertical; line-height: 1.6; }

.giris::placeholder, .metin-alani::placeholder { color: var(--murekkep-3); }
.giris:hover, .secim:hover, .metin-alani:hover { border-color: var(--murekkep-3); }
.giris:focus, .secim:focus, .metin-alani:focus {
  border-color: var(--far-koyu);
  outline: 2px solid color-mix(in srgb, var(--far) 45%, transparent);
  outline-offset: 0;
}

/* Takip numarası gibi kod alanları mono ve büyük harf */
.giris-kod {
  font-family: "IBM Plex Mono", ui-monospace, monospace;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.secim {
  appearance: none;
  padding-right: var(--s40);
  /* Tek çizgi chevron — dolgu ikon değil, inline SVG data URI */
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%235C6672' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right var(--s12) center;
}

.alan-hata {
  color: var(--reflektor);
  font-size: 13px;
  font-weight: 500;
}

/* ── Çipler ve rozetler ──────────────────────────────────────────────────── */
.cip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px var(--s12);
  border-radius: var(--r-hap);   /* müşteri: hap */
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .02em;
  border: 1px solid var(--cizgi);
  background: var(--kagit);
  color: var(--murekkep-2);
  white-space: nowrap;
}
.cip-far  { background: var(--far-soluk); border-color: transparent; color: #6B4E12; }
.cip-yol  { background: color-mix(in srgb, var(--yol) 14%, white); border-color: transparent; color: #14603A; }
.cip-uyari{ background: color-mix(in srgb, var(--uyari) 16%, white); border-color: transparent; color: #6B4E12; }
.cip-acil { background: color-mix(in srgb, var(--reflektor) 14%, white); border-color: transparent; color: #8C2A0E; }

.koyu .cip { background: var(--asfalt-3); border-color: var(--asfalt-3); color: var(--metin-2); }

/* ── İkonlar · §1.4 tek çizgi, 1.75 kalınlık, 24 kutu ────────────────────── */
.ikon {
  width: 24px; height: 24px;
  flex: none;
  stroke: currentColor;
  stroke-width: 1.75;
  stroke-linecap: round;
  stroke-linejoin: round;
  fill: none;
}
.ikon-s { width: 18px; height: 18px; }
.ikon-l { width: 32px; height: 32px; }

/* ── Başlık / gezinme ────────────────────────────────────────────────────── */
.ust-serit {
  background: var(--asfalt);
  color: var(--metin-2);
  font-size: 13px;
}
.ust-serit .kap {
  display: flex; align-items: center; justify-content: space-between;
  gap: var(--s16); min-height: 40px; flex-wrap: wrap;
}
.ust-serit a { color: var(--metin-2); }
.ust-serit a:hover { color: var(--far); }

.basisk {
  position: sticky; top: 0; z-index: 50;
  background: color-mix(in srgb, var(--kagit) 92%, transparent);
  backdrop-filter: none;                 /* §1.2 blur yasak */
  background: var(--kagit);
  border-bottom: 1px solid var(--cizgi);
}
.basisk .kap {
  display: flex; align-items: center; gap: var(--s24);
  min-height: 72px;
}

/* Marka — placeholder görsel yerine gerçek yazı markası.
   "SADECE" ince, "KURYE" amber vurgulu: tek parlak renk kuralına uyar. */
.marka {
  font-family: "Barlow Condensed", sans-serif;
  font-size: 26px;
  font-weight: 700;
  letter-spacing: -.01em;
  text-transform: uppercase;
  display: inline-flex; align-items: center; gap: 2px;
  white-space: nowrap;
}
.marka span:last-child { color: var(--far-koyu); }
.marka-isaret { width: 26px; height: 26px; color: var(--far-koyu); }

.gezinme { display: flex; align-items: center; gap: var(--s4); margin-left: auto; }
.gezinme a {
  padding: var(--s8) var(--s12);
  border-radius: var(--r-hap);
  font-weight: 500;
  color: var(--murekkep-2);
  min-height: 40px; display: inline-flex; align-items: center;
  transition: color var(--sure-kucuk), background var(--sure-kucuk);
}
.gezinme a:hover { color: var(--murekkep); background: var(--serit); }
.gezinme a[aria-current="page"] { color: var(--murekkep); font-weight: 600; }

/* Mobil menü — JavaScript YOK, salt CSS açılır kapanır.
   Şablonun jQuery/Bootstrap collapse bağımlılığı bu sayede tamamen kalktı. */
.menu-anahtar { position: absolute; opacity: 0; pointer-events: none; }
.menu-dugme { display: none; }

@media (max-width: 900px) {
  .basisk .kap { flex-wrap: wrap; }
  .menu-dugme {
    display: inline-flex; align-items: center; justify-content: center;
    width: 48px; height: 48px; margin-left: auto;
    border: 1px solid var(--cizgi); border-radius: var(--r-giris);
    background: var(--kagit); cursor: pointer;
  }
  .gezinme {
    display: none;
    flex-direction: column; align-items: stretch;
    width: 100%; margin: 0 0 var(--s12);
    gap: 2px;
  }
  .menu-anahtar:checked ~ .gezinme { display: flex; }
  .gezinme a { min-height: 48px; }
}

/* ── Kahraman bölümü ─────────────────────────────────────────────────────── */
.kahraman-blok {
  background: var(--asfalt);
  color: var(--metin);
  border-radius: var(--r-kart);
  padding: clamp(var(--s32), 5vw, var(--s56));
  position: relative;
  overflow: hidden;
}
/* Tek dekoratif öğe: alt kenarda yol şeridi. Başka süs eklenmez (§1.5). */
.kahraman-blok::after {
  content: "";
  position: absolute; left: 0; right: 0; bottom: 0; height: 3px;
  background: repeating-linear-gradient(
    to right, var(--far) 0 12px, transparent 12px 20px);
}

/* ── Takip zaman çizelgesi ───────────────────────────────────────────────── */
.adimlar { display: grid; gap: 0; }
.adim { display: grid; grid-template-columns: 24px 1fr; gap: var(--s16); }
.adim-isaret { display: flex; flex-direction: column; align-items: center; }
.adim-nokta {
  width: 14px; height: 14px; border-radius: 50%;
  border: 2px solid var(--cizgi); background: var(--kagit);
  flex: none; margin-top: 5px;
}
.adim-gecti .adim-nokta { background: var(--yol); border-color: var(--yol); }
.adim-simdi .adim-nokta { background: var(--far); border-color: var(--far); }
.adim-bag { flex: 1; min-height: 28px; width: 2px; }
.adim-govde { padding-bottom: var(--s20); }

/* ── Durum bildirimi ─────────────────────────────────────────────────────── */
.bildirim {
  display: flex; gap: var(--s12);
  padding: var(--s16);
  border-radius: var(--r-giris);
  border: 1px solid var(--cizgi);
  background: var(--kagit);
}
.bildirim-iyi  { background: color-mix(in srgb, var(--yol) 8%, white); border-color: color-mix(in srgb, var(--yol) 30%, white); }
.bildirim-hata { background: color-mix(in srgb, var(--reflektor) 8%, white); border-color: color-mix(in srgb, var(--reflektor) 30%, white); }
.bildirim .ikon { flex: none; }

/* ── Boş / hata durumu · §5.2, §5.3 ──────────────────────────────────────
   "Her boş ekran bir davettir": ikon + tek satır açıklama + eylem. */
.durum {
  display: flex; flex-direction: column; align-items: center; text-align: center;
  gap: var(--s16); padding: var(--s56) var(--s20);
}
.durum .ikon-l { color: var(--murekkep-3); }
.durum p { max-width: 42ch; }

/* ── İskelet · §5.1 ──────────────────────────────────────────────────────── */
.iskelet {
  border-radius: var(--r-giris);
  background: linear-gradient(90deg, var(--cizgi) 25%, #EDEFF2 37%, var(--cizgi) 63%);
  background-size: 400% 100%;
  animation: kayma 1200ms ease-in-out infinite;
}
@keyframes kayma { from { background-position: 100% 0; } to { background-position: 0 0; } }

/* ── Kartlar: haber / ilan ───────────────────────────────────────────────── */
.kart-bag {
  display: flex; flex-direction: column;
  background: var(--kagit);
  border: 1px solid var(--cizgi);
  border-radius: var(--r-kart);
  overflow: hidden;
  transition: border-color var(--sure-kucuk) var(--egri-out),
              transform var(--sure-kucuk) var(--egri-out);
}
.kart-bag:hover { border-color: var(--murekkep-3); transform: translateY(-2px); }
.kart-bag img { aspect-ratio: 16 / 9; object-fit: cover; width: 100%; }
.kart-govde { padding: var(--s20); display: flex; flex-direction: column; gap: var(--s8); flex: 1; }
.kart-alt {
  display: flex; align-items: center; gap: var(--s12);
  padding: var(--s12) var(--s20);
  border-top: 1px solid var(--cizgi);
  font-size: 13px; color: var(--murekkep-3);
  flex-wrap: wrap;
}

/* İlan kategorisi — renk TEK anlam taşıyıcı değil, metinle birlikte (§6) */
.ilan-serit { border-left: 3px solid var(--cizgi); }
.ilan-kurye    { border-left-color: var(--far); }
.ilan-depocu   { border-left-color: var(--uyari); }
.ilan-operator { border-left-color: var(--yol); }

/* ── İstatistik ──────────────────────────────────────────────────────────── */
.sayi {
  font-family: "Barlow Condensed", sans-serif;
  font-size: clamp(34px, 5vw, 46px);
  font-weight: 700;
  line-height: 1;
  letter-spacing: -.02em;
  font-variant-numeric: tabular-nums;
}

/* ── Adım numaraları (Nasıl çalışır) ─────────────────────────────────────
   Numaralandırma burada gerçekten sıra bildiriyor; dekoratif değil. */
.adim-no {
  width: 44px; height: 44px; flex: none;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 50%;
  background: var(--far-soluk);
  color: #6B4E12;
  font-family: "Barlow Condensed", sans-serif;
  font-size: 20px; font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.koyu .adim-no { background: var(--asfalt-3); color: var(--far); }

/* ── Alt bilgi ───────────────────────────────────────────────────────────── */
.altbilgi {
  background: var(--asfalt);
  color: var(--metin-2);
  margin-top: var(--s56);
}
.altbilgi a { color: var(--metin-2); }
.altbilgi a:hover { color: var(--far); }
.altbilgi h4 {
  color: var(--metin);
  font-size: 12px; font-weight: 600;
  letter-spacing: .06em; text-transform: uppercase;
  font-family: "Barlow", sans-serif;
  margin-bottom: var(--s12);
}
.altbilgi ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--s8); }
.altbilgi-alt {
  border-top: 1px solid var(--asfalt-3);
  padding-block: var(--s20);
  font-size: 13px;
}

/* ── Zengin metin (haber içeriği) ────────────────────────────────────────
   İçerik panelden HTML olarak geliyor; sınıfsız etiketleri burada biçimliyoruz. */
.yazi { font-size: 16px; line-height: 1.75; }
.yazi > * + * { margin-top: var(--s16); }
.yazi p { max-width: 68ch; }
.yazi h2 { font-size: 24px; margin-top: var(--s32); }
.yazi h3 { font-size: 19px; margin-top: var(--s24); }
.yazi ul, .yazi ol { padding-left: var(--s20); display: flex; flex-direction: column; gap: var(--s8); }
.yazi a { color: var(--murekkep); text-decoration: underline; text-underline-offset: 3px;
          text-decoration-color: var(--far-koyu); text-decoration-thickness: 2px; }
.yazi a:hover { color: var(--far-koyu); }
.yazi img { border-radius: var(--r-giris); margin-block: var(--s24); }
.yazi blockquote {
  margin: var(--s24) 0; padding: var(--s4) 0 var(--s4) var(--s20);
  border-left: 3px solid var(--far); color: var(--murekkep-2);
}
.yazi code {
  font-family: "IBM Plex Mono", ui-monospace, monospace; font-size: .9em;
  background: var(--serit); padding: 2px 6px; border-radius: 5px;
}
.yazi pre { overflow-x: auto; background: var(--serit); padding: var(--s16); border-radius: var(--r-giris); }
.yazi table { width: 100%; border-collapse: collapse; }
.yazi th, .yazi td { text-align: left; padding: var(--s8) var(--s12); border-bottom: 1px solid var(--cizgi); }

/* ── Yardımcılar ─────────────────────────────────────────────────────────── */
.orta { text-align: center; }
.gizli-gorsel {
  position: absolute; width: 1px; height: 1px;
  padding: 0; margin: -1px; overflow: hidden;
  clip-path: inset(50%); white-space: nowrap; border: 0;
}
.tasma-x { overflow-x: auto; }

/* ── Hareket azaltma · §1.6 "bu kontrol atlanmayacak" ────────────────────── */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
    scroll-behavior: auto !important;
  }
  .kart-bag:hover { transform: none; }
}

/* ── Yazdırma ────────────────────────────────────────────────────────────── */
@media print {
  .basisk, .ust-serit, .altbilgi, .btn { display: none !important; }
  body { background: #fff; }
}