@charset "utf-8";
/* ==========================================================================
   BestLinkPOS - ortak tasarım sistemi v3 (2026-09-30, Toast referansı)
   Saf CSS. Derleme yok, dış kaynak yok, CDN yok.

   ÖNBELLEK KURALI: .htaccess css/js/woff2/svg/png dosyalarına bir yıl
   "immutable" veriyor. Bu dosyanın içeriği yayına çıktıktan sonra
   DEĞİŞTİRİLMEZ; değişiklik yeni adla yazılır (site-YYYYMMDDx.css) ve
   HTML yeni adı referans alır.

   v2'den farkı (referans: pos.toasttab.com): tek yazı ailesi (Onest), iri ve
   ince başlık, daha büyük panel yuvarlaklığı, 72px menü, çizgi düğme,
   lacivert hero bloğu, lacivert bant üstünde yüzen kartlı alt bar.
   Sayfa bileşenleri burada DEĞİL: sayfa-*.css (ana sayfa + iç sayfalar).

   Bölümler:
     - Yazı tipi (Onest, self-host)
     - Jetonlar (açık + koyu)
     - Taban
     - Tipografi
     - Düzen: kapsayıcı, bölüm ritmi
     - Bağlantı ve odak halkası
     - Düğmeler
     - Yüzeyler ve rozet
     - Üst menü
     - Alt bar + ödeme şeridi
     - Yasal sayfa
     - Hareket
     - Kullanıcı tercihleri (hareket, saydamlık, zorunlu renk)
     - Yazdırma
   ========================================================================== */

/* --------------------------------------------------------------------------
   YAZI TİPİ
   Başlık ve metin: Onest (OFL 1.1, v2.001, değişken 100-900). Tek aile:
   başlık 500 (Toast'taki gibi iri ve ince), gövde 400. Schibsted Grotesk
   v3'te kullanılmıyor; dosyası sunucuda eski sayfalar için duruyor.
   Kaynak: Google Fonts CSS2 API, latin + latin-ext alt kümeleri.
   Türkçe: ç ö ü ı -> latin; ğ Ğ ş Ş İ ₺ -> latin-ext. İKİSİ BİRLİKTE ZORUNLU.
   Lisans metinleri: /varlik/font/OFL-*.txt
   -------------------------------------------------------------------------- */

@font-face {
  font-family: "Onest";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("/varlik/font/onest-v2001-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF,
    U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020,
    U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: "Onest";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("/varlik/font/onest-v2001-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
    U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193,
    U+2212, U+2215, U+FEFF, U+FFFD;
}

/* Ölçüsü eşlenmiş yedek yüzler: web yazı tipi gelene kadar Arial gösterilir,
   ama genişlik ve satır yüksekliği hedef yazı tipine göre ayarlıdır. Böylece
   yazı tipi yüklenince satırlar kaymaz (CLS). Değerler fontTools ile Türkçe
   örnek metin üzerinden ölçüldü (Onest 400 / Arial, Onest 600-900 / Arial Bold). */
@font-face {
  font-family: "Onest Yedek";
  src: local("Arial"), local("ArialMT"), local("Helvetica Neue"), local("Helvetica");
  size-adjust: 103.75%;
  ascent-override: 93.49%;
  descent-override: 29.4%;
  line-gap-override: 0%;
}

@font-face {
  font-family: "Onest Yedek";
  font-weight: 600 900;
  src: local("Arial Bold"), local("Arial-BoldMT"), local("Helvetica Neue Bold"), local("Helvetica Bold");
  size-adjust: 103.75%;
  ascent-override: 93.49%;
  descent-override: 29.4%;
  line-gap-override: 0%;
}

/* --------------------------------------------------------------------------
   JETONLAR
   Palet logodaki gerçek maviden ölçüldü (PIL, 1254x1254 logo çalışması):
   baskın ton #0060f6 = oklch(0.544 0.237 261). Değerler OKLCH'te kuruldu,
   eski tarayıcılar için hex yazıldı; her satırda kaynak OKLCH değeri var.
   Kontrast oranları (WCAG 2.x) satır sonunda; kabuk-v2-notu.md tam tabloyu taşır.
   Sayfa tek temadır: bölümler ters dönmez, tema prefers-color-scheme ile döner.
   -------------------------------------------------------------------------- */

:root {
  color-scheme: light dark;

  /* Marka ailesi (tek vurgu: mavi) */
  --renk-ana: #0d61f4;                /* oklch(0.545 0.232 261.5)  dolgu; beyaz metin 5.21:1 */
  --renk-ana-koyu: #0f47d4;           /* oklch(0.470 0.222 263.5)  basılı/koyu dolgu; beyaz 7.31:1 */
  --renk-ana-derin: #0b2785;          /* oklch(0.330 0.160 265.0)  derin marka; beyaz 12.78:1 */
  --renk-ana-yumusak: #e8f2ff;        /* oklch(0.958 0.024 259)    açık marka zemini */
  --renk-ana-yumusak-2: #cfe3ff;      /* oklch(0.912 0.048 259)    seçim, ince vurgu */
  --renk-ana-metin: #0f47d4;          /* marka renkli metin/bağlantı; zeminde 7.11:1 */
  --renk-ana-uzeri: #ffffff;          /* marka dolgusu üzerindeki metin */
  --renk-ana-uzeri-ikincil: #e4f0ff;  /* marka dolgusunda ikincil metin; --renk-ana-koyu üstünde 6.34:1 */
  --renk-parlama: #39d0fc;            /* oklch(0.800 0.135 222)    camgöbeği parlama, METİN İÇİN DEĞİL */
  --renk-ana-rgb: 13 97 244;          /* rgb(var(--renk-ana-rgb) / .2) biçiminde saydam kullanım */
  --renk-parlama-rgb: 57 208 252;

  /* Mürekkep: koyu lacivert. Açık temada metin, her iki temada koyu yüzey */
  --murekkep: #0b1531;                /* oklch(0.205 0.058 266) */
  --murekkep-rgb: 11 21 49;

  /* Metin */
  --metin: #0b1531;                   /* zeminde 17.52:1 */
  --metin-ikincil: #475369;           /* oklch(0.440 0.040 263)  zeminde 7.54, zemin-2'de 7.02 */
  --metin-ucuncul: #5d687c;           /* oklch(0.515 0.034 262)  zeminde 5.46, zemin-2'de 5.09 */

  /* Zemin ve yüzey: soğuk, markaya doğru çok hafif boyalı nötrler */
  --zemin: #fafcfe;                   /* oklch(0.990 0.004 256) */
  --zemin-2: #f0f4fa;                 /* oklch(0.966 0.009 256)  ikinci bölüm tonu */
  --yuzey: #ffffff;                   /* kart / yükseltilmiş yüzey */
  --zemin-rgb: 250 252 254;

  /* Çizgi */
  --cizgi: #dfe4ed;                   /* oklch(0.918 0.013 258)  ayırıcı */
  --cizgi-guclu: #828d9f;             /* oklch(0.640 0.030 260)  bileşen sınırı; zeminde 3.26:1 (WCAG 1.4.11) */

  /* Etkileşim */
  --odak: #0f47d4;                    /* odak halkası; zeminde 7.11:1 */
  --dugme-birincil-ust: #0f47d4;      /* birincil düğme üzerine gelince; beyaz 7.31:1 */

  /* Gölge: zemine boyalı, saf siyah değil */
  --golge-rgb: 11 21 49;
  --golge-1: 0 1px 2px rgb(var(--golge-rgb) / .06), 0 1px 1px rgb(var(--golge-rgb) / .04);
  --golge-2: 0 2px 4px rgb(var(--golge-rgb) / .05), 0 10px 24px -6px rgb(var(--golge-rgb) / .12);
  --golge-3: 0 4px 8px rgb(var(--golge-rgb) / .05), 0 24px 48px -12px rgb(var(--golge-rgb) / .18);

  /* Yazı aileleri */
  --yazi-baslik: "Onest", "Onest Yedek", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --yazi-metin: "Onest", "Onest Yedek", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;

  /* Yazı ölçeği: 390px -> 1280px arasında akışkan (masaüstü px / mobil px) */
  --yazi-0: 0.875rem;                                             /* 14 küçük */
  --yazi-1: clamp(1.0625rem, 1.035rem + 0.112vw, 1.125rem);       /* 17 -> 18 gövde */
  --yazi-2: clamp(1.125rem, 1.043rem + 0.337vw, 1.3125rem);       /* 18 -> 21 giriş metni, h4 */
  --yazi-3: clamp(1.3125rem, 1.176rem + 0.562vw, 1.625rem);       /* 21 -> 26 h3 */
  --yazi-4: clamp(2rem, 1.452rem + 2.247vw, 3.25rem);             /* 32 -> 52 h2 */
  --yazi-5: clamp(2.25rem, 1.538rem + 2.921vw, 3.875rem);         /* 36 -> 62 h1 */
  --yazi-6: clamp(2.25rem, 1.374rem + 3.596vw, 4.25rem);          /* 36 -> 68 vitrin başlığı */

  /* Boşluk ölçeği */
  --bosluk-1: 0.25rem;
  --bosluk-2: 0.5rem;
  --bosluk-3: 0.75rem;
  --bosluk-4: 1rem;
  --bosluk-5: 1.5rem;
  --bosluk-6: 2rem;
  --bosluk-7: 3rem;
  --bosluk-8: 4rem;
  --bosluk-9: 6rem;

  /* Düzen */
  --kap-en: 1280px;
  --kap-dar: 760px;
  --kenar: clamp(1rem, 0.5rem + 2vw, 2rem);                       /* 390px'te 16px kenar boşluğu */
  --okuma: 65ch;
  --bolum-dikey: clamp(3.5rem, 1.9rem + 6.3vw, 7rem);             /* 56 -> 112 */
  --bolum-dikey-sik: clamp(2.5rem, 1.7rem + 3.2vw, 4.5rem);       /* 40 -> 72 */
  --menu-y: 72px;

  /* Yuvarlaklık: tek kural. Düğme, rozet, çip = hap; kart = 20; büyük panel/bant = 24-36 (akışkan); küçük = 8 */
  --r-kucuk: 8px;
  --r-yuzey: 20px;
  --r-buyuk: clamp(24px, 0.95rem + 1.35vw, 36px);
  --r-hap: 999px;

  /* Hareket: üstel yavaşlayan eğriler, sekme/yay yok */
  --egri-cikis: cubic-bezier(0.22, 1, 0.36, 1);                   /* ease-out-quint */
  --egri-cikis-uzun: cubic-bezier(0.16, 1, 0.3, 1);               /* ease-out-expo */
  --sure-kisa: 160ms;
  --sure-orta: 280ms;
  --sure-uzun: 700ms;

  /* Katman düzeni: tek yerde, rastgele z-index yok */
  --kat-menu: 40;
  --kat-panel: 50;
  --kat-atla: 60;
}

@media (prefers-color-scheme: dark) {
  :root {
    /* Düğme dolgusu aynı marka mavisi kalır (beyaz metin 5.21:1); metin olarak
       kullanılan mavi koyu zeminde okunsun diye açılır. */
    --renk-ana-yumusak: #102144;      /* oklch(0.255 0.070 263) */
    --renk-ana-yumusak-2: #143065;    /* oklch(0.320 0.100 262) */
    --renk-ana-metin: #71b5ff;        /* oklch(0.760 0.130 252)  zeminde 8.9:1 */

    --metin: #eef2f8;                 /* oklch(0.960 0.009 256)  zeminde 17.13:1 */
    --metin-ikincil: #b8c3d4;         /* oklch(0.815 0.026 258)  zeminde 10.81, yüzeyde 9.54 */
    --metin-ucuncul: #9eaabd;         /* oklch(0.735 0.030 258)  zeminde 8.19, yüzeyde 7.23 */

    --zemin: #090e1c;                 /* oklch(0.168 0.030 266) */
    --zemin-2: #0e1526;               /* oklch(0.198 0.036 266) */
    --yuzey: #131c30;                 /* oklch(0.228 0.042 266) */
    --zemin-rgb: 9 14 28;

    --cizgi: #252f43;                 /* oklch(0.305 0.040 264) */
    --cizgi-guclu: #5c6981;           /* oklch(0.520 0.040 262)  zeminde 3.48:1 */

    --odak: #7ec4ff;                  /* oklch(0.800 0.115 247)  zeminde 10.4:1 */
    --dugme-birincil-ust: #1467f7;    /* oklch(0.560 0.228 261)  koyu zeminde hafif açılır; beyaz 4.87:1 */

    --golge-rgb: 2 5 14;
    --golge-1: 0 1px 2px rgb(var(--golge-rgb) / .5);
    --golge-2: 0 2px 4px rgb(var(--golge-rgb) / .4), 0 12px 28px -8px rgb(var(--golge-rgb) / .6);
    --golge-3: 0 4px 10px rgb(var(--golge-rgb) / .45), 0 28px 56px -12px rgb(var(--golge-rgb) / .7);
  }
}

/* --------------------------------------------------------------------------
   TABAN
   -------------------------------------------------------------------------- */

*,
*::before,
*::after { box-sizing: border-box; }

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  scroll-behavior: smooth;
  scroll-padding-top: calc(var(--menu-y) + 1rem);   /* çapa, yapışkan menünün altında kalmaz */
}

body {
  margin: 0;
  background: var(--zemin);
  color: var(--metin);
  font-family: var(--yazi-metin);
  font-size: var(--yazi-1);
  line-height: 1.6;
  font-kerning: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-wrap: break-word;          /* uzun e-posta / adres satırı taşmaz */
}

img, svg, video, picture { display: block; max-width: 100%; height: auto; }
button, input, select, textarea { font: inherit; color: inherit; }
hr { border: 0; border-top: 1px solid var(--cizgi); margin: var(--bosluk-7) 0; }
address { font-style: normal; }

::selection { background: var(--renk-ana-yumusak-2); color: var(--metin); }

/* Klavye kullanıcısı için atlama bağlantısı: odaklanınca görünür */
.atla {
  position: absolute;
  top: var(--bosluk-2);
  left: var(--bosluk-2);
  z-index: var(--kat-atla);
  padding: 0.75rem 1.25rem;
  background: var(--renk-ana);
  color: var(--renk-ana-uzeri);
  border-radius: var(--r-hap);
  font-weight: 600;
  text-decoration: none;
  transform: translateY(-200%);
}
.atla:focus { transform: none; }

.gorsel-gizli {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

/* --------------------------------------------------------------------------
   TİPOGRAFİ
   Başlık ve gövde Onest. Başlık iri ve ince (500), referanstaki gibi; ağırlık
   değil boyut ve renk hiyerarşi kurar. Başlık oranları >= 1.25.
   Türkçe büyük harf aksanları (İ Ğ Ş Ç Ö Ü) üst satırın alt uzantılarına
   (g ş ç y) değmesin diye satır aralığı 1.06'nın altına inmez.
   -------------------------------------------------------------------------- */

h1, h2, h3, h4 {
  margin: 0 0 0.5em;
  font-family: var(--yazi-baslik);
  color: var(--metin);
  text-wrap: balance;
  font-kerning: normal;
}

h1 { font-size: var(--yazi-5); font-weight: 500; line-height: 1.06; letter-spacing: -0.035em; }
h2 { font-size: var(--yazi-4); font-weight: 500; line-height: 1.08; letter-spacing: -0.03em; }
h3 { font-size: var(--yazi-3); font-weight: 600; line-height: 1.2; letter-spacing: -0.02em; }
h4 { font-size: var(--yazi-2); font-weight: 600; line-height: 1.3; letter-spacing: -0.01em; }

/* Vitrin başlığı: hero h1'i için (masaüstü 68px, 360-390px'te 34px: iki cümlelik
   hero başlığı telefonda da iki satırda kalır) */
.baslik-vitrin {
  font-size: var(--yazi-6);
  font-weight: 500;
  line-height: 1.06;
  letter-spacing: -0.04em;
}

p { margin: 0 0 1em; text-wrap: pretty; }
p:last-child { margin-bottom: 0; }

strong, b { font-weight: 600; }

/* Giriş metni: hero ve bölüm başlığı altındaki açıklama */
.giris {
  font-size: var(--yazi-2);
  line-height: 1.55;
  color: var(--metin-ikincil);
  max-width: 52ch;
}

.kucuk { font-size: var(--yazi-0); line-height: 1.5; color: var(--metin-ucuncul); }
.ikincil { color: var(--metin-ikincil); }
.olcu { max-width: var(--okuma); }
.rakam { font-variant-numeric: tabular-nums; }

/* Bölüm etiketi (eyebrow). SAYARAK kullanılır: sayfadaki toplam adet
   <= ceil(bölüm sayısı / 3), hero dahil. Bir bölümde varsa sonraki iki
   bölümde yoktur. Türkçe büyük harf için <html lang="tr"> şart (i -> İ). */
.etiket {
  display: inline-block;
  margin: 0 0 var(--bosluk-4);
  font-family: var(--yazi-metin);
  font-size: 0.8125rem;
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--renk-ana-metin);
}

/* --------------------------------------------------------------------------
   DÜZEN
   -------------------------------------------------------------------------- */

/* Kapsayıcı. .site-container yalnız eski yasal sayfa gövdeleri kırılmasın
   diye eş addır; yeni yazımda .kap kullanılır. */
.kap,
.site-container {
  width: min(var(--kap-en), 100% - 2 * var(--kenar));
  margin-inline: auto;
}
.kap--dar { width: min(var(--kap-dar), 100% - 2 * var(--kenar)); }

/* Bölüm ritmi */
.bolum { padding-block: var(--bolum-dikey); }
.bolum--sik { padding-block: var(--bolum-dikey-sik); }
.bolum--ton { background: var(--zemin-2); }

/* Bölüm başlığı: başlık + açıklama DİKEY yığılır (split header yok) */
.bolum-bas {
  max-width: 46rem;
  margin-bottom: clamp(2rem, 1.3rem + 2.6vw, 3.5rem);
}
.bolum-bas > h2 { margin-bottom: var(--bosluk-4); }
.bolum-bas > .giris { max-width: 58ch; }

/* Dikey yığın */
.yigin { display: grid; gap: var(--bosluk-4); }
.yigin--dar { gap: var(--bosluk-2); }
.yigin--genis { gap: var(--bosluk-6); }

/* --------------------------------------------------------------------------
   BAĞLANTI VE ODAK HALKASI
   -------------------------------------------------------------------------- */

a {
  color: var(--renk-ana-metin);
  text-decoration-line: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.2em;
  text-decoration-color: color-mix(in srgb, currentColor 40%, transparent);
  transition: color var(--sure-kisa) var(--egri-cikis), text-decoration-color var(--sure-kisa) var(--egri-cikis);
}
a:hover { text-decoration-color: currentColor; }

/* Odak halkası: her etkileşimli öğede görünür, hiçbir kuralla bastırılmaz */
:where(a, button, summary, input, select, textarea, [tabindex]):focus-visible {
  outline: 2px solid var(--odak);
  outline-offset: 3px;
}

/* --------------------------------------------------------------------------
   DÜĞMELER
   Tek yuvarlaklık ailesi (hap). Dokunma hedefi >= 44px. Etiket tek satır.
   Birincil eylemin etiketi sitede tek: "Hesap aç".
   -------------------------------------------------------------------------- */

.dugme {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--bosluk-2);
  min-height: 48px;
  padding: 0 1.375rem;
  border: 1px solid transparent;
  border-radius: var(--r-hap);
  background: transparent;
  color: var(--metin);
  font-family: var(--yazi-metin);
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.1;
  letter-spacing: -0.006em;
  text-align: center;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
  user-select: none;
  -webkit-user-select: none;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
  transition:
    transform var(--sure-kisa) var(--egri-cikis),
    background-color var(--sure-kisa) var(--egri-cikis),
    border-color var(--sure-kisa) var(--egri-cikis),
    color var(--sure-kisa) var(--egri-cikis),
    box-shadow var(--sure-orta) var(--egri-cikis);
}

/* Basma: fiziksel geri bildirim */
.dugme:active { transform: scale(0.98); }

/* Birincil: marka dolgusu, üstte ince parlaklık (logonun parlak yüzeyi) */
.dugme--birincil {
  background-color: var(--renk-ana);
  background-image: linear-gradient(180deg, rgb(255 255 255 / .12), rgb(255 255 255 / 0) 60%);
  color: var(--renk-ana-uzeri);
  box-shadow:
    inset 0 1px 0 rgb(255 255 255 / .18),
    0 1px 2px rgb(var(--golge-rgb) / .16),
    0 8px 20px -10px rgb(var(--renk-ana-rgb) / .75);
}
.dugme--birincil:hover {
  background-color: var(--dugme-birincil-ust);
  color: var(--renk-ana-uzeri);
}

/* İkincil: dolu yüzey + bileşen sınırı */
.dugme--ikincil {
  background-color: var(--yuzey);
  border-color: var(--cizgi-guclu);
  color: var(--metin);
  box-shadow: var(--golge-1);
}
.dugme--ikincil:hover {
  background-color: var(--renk-ana-yumusak);
  border-color: var(--renk-ana-metin);
  color: var(--metin);
}

/* Hayalet: zemin yok, sınır var (sınırsız hayalet düğme yok) */
.dugme--hayalet {
  border-color: var(--cizgi-guclu);
  color: var(--metin);
}
.dugme--hayalet:hover {
  background-color: var(--zemin-2);
  border-color: var(--metin-ucuncul);
  color: var(--metin);
}

/* Çizgi: marka renkli çerçeve ve metin (referanstaki "Login" / "See Pricing").
   Beyaz zeminde 7.11:1, koyu zeminde 8.9:1. */
.dugme--cizgi {
  border-color: var(--renk-ana-metin);
  color: var(--renk-ana-metin);
}
.dugme--cizgi:hover {
  background-color: var(--renk-ana-yumusak);
  border-color: var(--renk-ana-metin);
  color: var(--renk-ana-metin);
}

/* Boyutlar */
.dugme--kucuk { min-height: 44px; padding: 0 1.05rem; font-size: 0.9375rem; }
.dugme--buyuk { min-height: 56px; padding: 0 1.75rem; font-size: 1.0625rem; }
.dugme--genis { width: 100%; }

/* Üzerine gelince hafif kalkış: yalnız fare/iz dörtgeni olan cihazlarda */
@media (hover: hover) and (pointer: fine) {
  .dugme:hover { transform: translateY(-1px); }
  .dugme--birincil:hover {
    box-shadow:
      inset 0 1px 0 rgb(255 255 255 / .18),
      0 2px 4px rgb(var(--golge-rgb) / .14),
      0 14px 28px -12px rgb(var(--renk-ana-rgb) / .8);
  }
  .dugme:active { transform: translateY(0) scale(0.98); }
}

/* Düğme sırası: 30rem altında tam genişlik alt alta */
.dugme-grubu {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--bosluk-3);
}

@media (max-width: 30rem) {
  .dugme-grubu { flex-direction: column; align-items: stretch; }
  .dugme-grubu > .dugme { width: 100%; }
}

/* --------------------------------------------------------------------------
   YÜZEYLER VE ROZET
   -------------------------------------------------------------------------- */

/* Kart yüzeyi: yalnız yükselti gerçekten hiyerarşi anlatıyorsa */
.yuzey {
  background: var(--yuzey);
  border: 1px solid var(--cizgi);
  border-radius: var(--r-yuzey);
}

/* Açık marka tonu */
.yuzey-ton {
  background: var(--renk-ana-yumusak);
  border-radius: var(--r-yuzey);
}

/* Marka renk bloğu (tema değişimi DEĞİL; her iki temada aynı mavi).
   Beyaz metin 7.31:1 (parlama köşesinde 5.50:1). Parlama köşede %20'de
   tutulur: ikincil metin (--renk-ana-uzeri-ikincil) en açık noktada 4.77:1.
   İçindeki bileşenler jetonlar yeniden tanımlandığı için kendiliğinden uyar. */
.yuzey-marka {
  --metin: var(--renk-ana-uzeri);
  --metin-ikincil: var(--renk-ana-uzeri-ikincil);
  --metin-ucuncul: var(--renk-ana-uzeri-ikincil);
  --renk-ana-metin: #ffffff;
  --odak: #ffffff;
  --cizgi: rgb(255 255 255 / .22);
  --cizgi-guclu: rgb(255 255 255 / .72);
  background-color: var(--renk-ana-koyu);
  background-image:
    radial-gradient(90% 120% at 100% 0%, rgb(var(--renk-parlama-rgb) / .2), transparent 60%),
    linear-gradient(155deg, var(--renk-ana-koyu) 30%, var(--renk-ana-derin) 130%);
  color: var(--metin);
  border-radius: var(--r-buyuk);
}
.yuzey-marka ::selection { background: #ffffff; color: var(--renk-ana-koyu); }

/* Marka bloğunda birincil düğme tersine döner: beyaz dolgu, mavi metin (7.31:1) */
.yuzey-marka .dugme--birincil {
  background-color: #ffffff;
  background-image: none;
  color: var(--renk-ana-koyu);
  box-shadow: 0 1px 2px rgb(var(--golge-rgb) / .2), 0 10px 24px -12px rgb(var(--golge-rgb) / .6);
}
.yuzey-marka .dugme--birincil:hover { background-color: var(--renk-ana-yumusak); color: var(--renk-ana-koyu); }
.yuzey-marka .dugme--ikincil { background-color: transparent; box-shadow: none; }
.yuzey-marka .dugme--cizgi { border-color: #ffffff; color: #ffffff; }
.yuzey-marka .dugme--ikincil:hover,
.yuzey-marka .dugme--hayalet:hover,
.yuzey-marka .dugme--cizgi:hover { background-color: rgb(255 255 255 / .12); border-color: #ffffff; color: #ffffff; }

/* Gece varyantı: lacivert zemin, sağda mavi parlama. Ana sayfa hero'su;
   referanstaki karanlık fotoğraflı hero'nun karşılığı (fotoğraf yok, logo
   çalışması parlamanın önünde durur). Metin solda lacivert üstünde: 17.5:1. */
.yuzey-marka--gece {
  background-color: var(--murekkep);
  background-image:
    radial-gradient(55% 75% at 76% 50%, rgb(var(--renk-ana-rgb) / .6), transparent 72%),
    radial-gradient(35% 45% at 88% 16%, rgb(var(--renk-parlama-rgb) / .22), transparent 72%),
    linear-gradient(165deg, var(--murekkep) 10%, var(--renk-ana-derin) 135%);
}
@media (prefers-color-scheme: dark) {
  /* Koyu zeminde lacivert blok kenarı kaybolmasın */
  .yuzey-marka--gece { box-shadow: inset 0 0 0 1px rgb(255 255 255 / .08); }
}

/* Rozet: kısa bilgi hapı ("14 gün ücretsiz deneme" gibi). Görsel üstüne konmaz. */
.rozet {
  display: inline-flex;
  align-items: center;
  gap: var(--bosluk-2);
  min-height: 30px;
  padding: 0.25rem 0.8rem;
  border-radius: var(--r-hap);
  background: var(--renk-ana-yumusak);
  color: var(--renk-ana-metin);
  font-size: 0.875rem;
  font-weight: 600;
  line-height: 1.25;
}
.yuzey-marka .rozet { background: rgb(255 255 255 / .14); color: #ffffff; }

/* --------------------------------------------------------------------------
   ÜST MENÜ
   Yapışkan, tek satır, 72px. Referanstaki düzen: solda marka + sayfa
   bağlantıları, sağda çizgi "Giriş yap" ve dolu "Hesap aç". 70rem altında:
   marka + "Hesap aç" + menü düğmesi; bağlantılar <details> paneline iner
   (JS olmadan çalışır). Bulunulan sayfa aria-current="page" taşır.
   -------------------------------------------------------------------------- */
.ust-menu {
  position: sticky;
  top: 0;
  z-index: var(--kat-menu);
  background: var(--zemin);
  border-bottom: 1px solid var(--cizgi);
}

/* Yarı saydam zemin yalnız bulanıklık destekleniyorsa (aksi halde düz zemin) */
@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .ust-menu {
    background: rgb(var(--zemin-rgb) / .86);
    -webkit-backdrop-filter: saturate(1.6) blur(14px);
    backdrop-filter: saturate(1.6) blur(14px);
  }
}

.ust-menu__ic {
  display: flex;
  align-items: center;
  gap: var(--bosluk-6);
  height: var(--menu-y);
}

/* Marka kilidi: işaret + kelime markası. Tıklama alanı >= 44px */
.ust-menu__marka {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  flex: 0 0 auto;
  min-height: 44px;
  color: var(--metin);
  text-decoration: none;
  border-radius: var(--r-kucuk);
}
.ust-menu__marka img { width: auto; height: 34px; }

.ust-menu__kelime,
.alt-bar__kelime {
  font-family: var(--yazi-baslik);
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1;
  letter-spacing: -0.03em;
  color: var(--metin);
  white-space: nowrap;
}

.ust-menu__baglantilar {
  display: flex;
  align-items: center;
  gap: 0.125rem;
}
.ust-menu__baglantilar a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 0 0.8rem;
  border-radius: var(--r-hap);
  color: var(--metin);
  font-size: 0.9375rem;
  font-weight: 500;
  text-decoration: none;
  white-space: nowrap;
  transition: color var(--sure-kisa) var(--egri-cikis), background-color var(--sure-kisa) var(--egri-cikis);
}
.ust-menu__baglantilar a:hover { color: var(--renk-ana-metin); background: var(--zemin-2); }
.ust-menu__baglantilar a[aria-current="page"] { color: var(--renk-ana-metin); background: var(--renk-ana-yumusak); }

.ust-menu__islemler {
  display: flex;
  align-items: center;
  gap: var(--bosluk-2);
  flex: 0 0 auto;
  margin-inline-start: auto;
}

/* Mobil menü düğmesi ve paneli */
.ust-menu__acilir { display: none; }

.ust-menu__acilir > summary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border: 1px solid var(--cizgi-guclu);
  border-radius: var(--r-hap);
  color: var(--metin);
  cursor: pointer;
  list-style: none;
  -webkit-tap-highlight-color: transparent;
  transition: background-color var(--sure-kisa) var(--egri-cikis), transform var(--sure-kisa) var(--egri-cikis);
}
.ust-menu__acilir > summary::-webkit-details-marker { display: none; }
.ust-menu__acilir > summary::marker { content: ""; }
.ust-menu__acilir > summary:active { transform: scale(0.96); }
.ust-menu__acilir[open] > summary { background: var(--zemin-2); }

/* Üç çizgi -> çarpı: saf CSS, SVG çizilmedi */
.hamburger,
.hamburger::before,
.hamburger::after {
  display: block;
  width: 18px;
  height: 2px;
  border-radius: 2px;
  background: currentColor;
  transition: transform var(--sure-orta) var(--egri-cikis), background-color var(--sure-kisa) linear;
}
.hamburger { position: relative; }
.hamburger::before,
.hamburger::after { content: ""; position: absolute; left: 0; }
.hamburger::before { top: -6px; }
.hamburger::after { top: 6px; }
.ust-menu__acilir[open] .hamburger { background-color: transparent; }
.ust-menu__acilir[open] .hamburger::before { transform: translateY(6px) rotate(45deg); }
.ust-menu__acilir[open] .hamburger::after { transform: translateY(-6px) rotate(-45deg); }

/* Panel yapışkan menünün tam genişliğinde açılır */
.ust-menu__panel {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  z-index: var(--kat-panel);
  max-height: calc(100vh - var(--menu-y));
  max-height: calc(100dvh - var(--menu-y));
  overflow-y: auto;
  overscroll-behavior: contain;
  background: var(--zemin);
  border-bottom: 1px solid var(--cizgi);
  box-shadow: var(--golge-3);
}

.ust-menu__panel-ic {
  display: grid;
  padding-block: var(--bosluk-2) var(--bosluk-5);
}

.ust-menu__panel-ic a:not(.dugme) {
  display: flex;
  align-items: center;
  min-height: 52px;
  color: var(--metin);
  font-size: 1.0625rem;
  font-weight: 500;
  text-decoration: none;
  border-bottom: 1px solid var(--cizgi);
}
.ust-menu__panel-ic .dugme { margin-top: var(--bosluk-5); }

.ust-menu__panel-ic a[aria-current="page"] { color: var(--renk-ana-metin); }

@media (max-width: 69.99rem) {
  .ust-menu__baglantilar,
  .ust-menu__giris { display: none; }
  .ust-menu__islemler { gap: 0; }
  .ust-menu__acilir { display: block; }
  .ust-menu__ic { gap: var(--bosluk-3); }
}

/* 22rem (352px) altında kelime markası gizlenir, işaret kalır */
@media (max-width: 22rem) {
  .ust-menu__kelime { display: none; }
}

/* --------------------------------------------------------------------------
   ALT BAR
   Referanstaki düzen: marka lacivertinde bant, üstünde yüzen kart (koyu
   temada koyu yüzey). Kartta: iletişim hapları, dört sütun (marka + üç
   bağlantı grubu), alt şerit (telif + künye + ödeme). Kartın altında iri
   kelime markası. İçerik ve sütun sırası her sayfada birebir aynıdır:
   scripts/kabuk.py varlik/kabuk-v3.html'den basar.
   -------------------------------------------------------------------------- */
.alt-bar {
  padding-block: clamp(2rem, 1.2rem + 3vw, 4rem) clamp(1rem, 0.6rem + 1.6vw, 2rem);
  background-color: var(--renk-ana-derin);
  background-image: linear-gradient(180deg, var(--renk-ana-derin) 0%, var(--murekkep) 100%);
  color: var(--metin-ikincil);
}

.alt-bar__kart {
  padding: clamp(1.75rem, 1rem + 3vw, 3.5rem) clamp(1.25rem, 0.5rem + 3vw, 3.5rem) 0;
  border-radius: var(--r-buyuk);
  background: var(--yuzey);
  box-shadow: 0 30px 60px -30px rgb(2 6 23 / .6);
}

/* Üst sıra: çağrı + iletişim hapları */
.alt-bar__ust {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--bosluk-5);
  padding-bottom: clamp(1.75rem, 1.2rem + 2vw, 2.75rem);
  border-bottom: 1px solid var(--cizgi);
}
.alt-bar__cagri {
  margin: 0;
  font-family: var(--yazi-baslik);
  font-size: clamp(1.625rem, 1.3rem + 1.3vw, 2.375rem);
  font-weight: 500;
  line-height: 1.1;
  letter-spacing: -0.03em;
  color: var(--metin);
}
.alt-bar__kanallar {
  display: flex;
  flex-wrap: wrap;
  gap: var(--bosluk-3);
}

.alt-bar__izgara {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) repeat(3, minmax(0, 1fr));
  gap: var(--bosluk-7) var(--bosluk-6);
  padding-block: clamp(2rem, 1.5rem + 2vw, 3rem);
}

.alt-bar__marka { max-width: 24rem; }

.alt-bar__kilit {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  min-height: 44px;
  margin-bottom: var(--bosluk-4);
  text-decoration: none;
  border-radius: var(--r-kucuk);
}
.alt-bar__kilit img { width: auto; height: 36px; }
.alt-bar__kelime { font-size: 1.25rem; }

.alt-bar__tanim {
  max-width: 36ch;
  margin-bottom: var(--bosluk-5);
  font-size: 0.9375rem;
  line-height: 1.6;
  color: var(--metin-ikincil);
}

.alt-bar__tuzel {
  font-size: 0.8125rem;
  line-height: 1.65;
  color: var(--metin-ucuncul);
}
.alt-bar__tuzel strong {
  display: block;
  margin-bottom: 0.2rem;
  color: var(--metin-ikincil);
  font-weight: 600;
  letter-spacing: 0.01em;
}

/* Sütun başlığı: cümle düzeninde, büyük harf etiket değil */
.alt-bar__baslik {
  margin: 0 0 var(--bosluk-2);
  font-family: var(--yazi-metin);
  font-size: 0.9375rem;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: 0;
  color: var(--metin);
}

.alt-bar__liste {
  margin: 0;
  padding: 0;
  list-style: none;
}

/* Dokunma hedefi 44px; satır arası bu yükseklikten gelir */
.alt-bar__liste a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding-block: 0.3rem;
  color: var(--metin-ikincil);
  font-size: 0.9375rem;
  line-height: 1.35;
  text-decoration: none;
}
.alt-bar__liste a:hover { color: var(--metin); text-decoration: underline; text-decoration-color: currentColor; }

/* Alt şerit: solda telif + künye, sağda ödeme şeridi */
.alt-bar__serit {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--bosluk-5) var(--bosluk-6);
  padding-block: var(--bosluk-5) var(--bosluk-6);
  border-top: 1px solid var(--cizgi);
}

.alt-bar__telif {
  margin: 0;
  font-size: 0.8125rem;
  line-height: 1.6;
  color: var(--metin-ucuncul);
}
.alt-bar__kunye {
  display: block;
  margin-top: 0.15rem;
  font-variant-numeric: tabular-nums;
}

/* Ödeme şeridi: logo dosyaları gelene kadar metin rozetleri.
   Yükseklik sabit (34px): gerçek logolar konunca düzen değişmez. */
.odeme-serit {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--bosluk-3);
}

.odeme-serit__etiket {
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--metin-ikincil);
  white-space: nowrap;
}

.odeme-serit__logolar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--bosluk-2);
  min-height: 34px;
}

.odeme-serit__kart {
  display: inline-flex;
  align-items: center;
  height: 30px;
  padding: 0 0.7rem;
  border: 1px solid var(--cizgi);
  border-radius: var(--r-kucuk);
  background: var(--yuzey);
  color: var(--metin-ikincil);
  font-size: 0.8125rem;
  font-weight: 600;
  letter-spacing: 0.005em;
  white-space: nowrap;
}

/* Gerçek logolar: koyu temada da okunsun diye beyaz taşıyıcı */
.odeme-serit__logolar img {
  width: auto;
  height: 30px;
  max-width: 76px;
  padding: 4px 8px;
  object-fit: contain;
  background: #ffffff;
  border: 1px solid var(--cizgi);
  border-radius: var(--r-kucuk);
}

/* İri kelime markası: bandın dibinde, dekoratif (aria-hidden) */

@media (max-width: 62rem) {
  .alt-bar__izgara { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .alt-bar__marka { grid-column: 1 / -1; max-width: 34rem; }
}
@media (max-width: 40rem) {
  /* Telefonda bağlantı sütunları ikişer: marka tam genişlik, sonra Ürün | Kurumsal, altta Destek */
  .alt-bar__izgara { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--bosluk-6) var(--bosluk-4); }
  .alt-bar__marka { grid-column: 1 / -1; }
  .alt-bar__serit { flex-direction: column; align-items: flex-start; }
  .alt-bar__kanallar { width: 100%; }
  .alt-bar__kanallar .dugme { flex: 1 1 100%; }
}

/* --------------------------------------------------------------------------
   YASAL SAYFA
   Gizlilik, kullanım şartları, mesafeli satış, teslimat-iade, hesap silme,
   destek, iletişim. Okuma ölçüsü 65ch, gövde 17-18px, satır 1.7.
   -------------------------------------------------------------------------- */

/* Başlık ve gövde aynı ortalı okuma sütununu paylaşır (65ch). Eski
   gövdelerdeki "site-container" eş adıyla birlikte de çalışır. */
.yasal-baslik,
.yasal-govde { width: min(var(--okuma), 100% - 2 * var(--kenar)); margin-inline: auto; }

.yasal-baslik {
  padding-block: clamp(2.5rem, 1.6rem + 3.6vw, 4.5rem) var(--bosluk-6);
  border-bottom: 1px solid var(--cizgi);
}
.yasal-baslik h1 {
  max-width: 22ch;
  margin-bottom: var(--bosluk-3);
  font-size: clamp(2rem, 1.55rem + 1.85vw, 3rem);
}
.yasal-baslik .kucuk { margin: 0; }

.yasal-govde {
  padding-block: clamp(2rem, 1.5rem + 2vw, 3rem) clamp(3.5rem, 2.5rem + 4vw, 6rem);
  font-size: var(--yazi-1);
  line-height: 1.7;
  color: var(--metin-ikincil);
}

.yasal-govde h2 {
  margin: 2.6em 0 0.7em;
  font-size: clamp(1.375rem, 1.26rem + 0.47vw, 1.625rem);
  font-weight: 740;
  line-height: 1.2;
  letter-spacing: -0.02em;
  color: var(--metin);
}
.yasal-govde > h2:first-child { margin-top: 0; }

.yasal-govde h3 {
  margin: 1.8em 0 0.5em;
  font-size: 1.125rem;
  font-weight: 700;
  line-height: 1.35;
  letter-spacing: -0.01em;
  color: var(--metin);
}

.yasal-govde p { margin: 0 0 1.1em; }
.yasal-govde strong { color: var(--metin); }
.yasal-govde a:not(.dugme) { font-weight: 500; }

.yasal-govde ul,
.yasal-govde ol { margin: 0 0 1.25em; padding-inline-start: 1.35em; }
.yasal-govde li { margin-bottom: 0.5em; padding-inline-start: 0.2em; }
.yasal-govde li::marker { color: var(--renk-ana-metin); }
.yasal-govde ul ul,
.yasal-govde ol ol { margin-top: 0.5em; margin-bottom: 0.5em; }

/* Gövde içindeki düğme: bağlantı kuralı düğme rengini ezmez */
.yasal-govde .dugme { margin-block: 0.25em; }

/* Tablo: dar ekranda yatay kaydırılır, sayfa taşmaz */
.yasal-tablo-sarmal {
  max-width: 100%;
  min-width: 0;
  margin: 0 0 1.5em;
  overflow-x: auto;
  border: 1px solid var(--cizgi);
  border-radius: var(--r-yuzey);
  background: var(--yuzey);
  -webkit-overflow-scrolling: touch;
}

.yasal-govde table {
  width: 100%;
  min-width: 32rem;
  border-collapse: collapse;
  font-size: 0.9375rem;
  line-height: 1.55;
}

.yasal-govde th,
.yasal-govde td {
  padding: 0.8rem 1rem;
  text-align: start;
  vertical-align: top;
  border-bottom: 1px solid var(--cizgi);
}

.yasal-govde thead th {
  background: var(--zemin-2);
  color: var(--metin);
  font-size: 0.875rem;
  font-weight: 600;
  white-space: nowrap;
}

.yasal-govde tbody th { color: var(--metin); font-weight: 600; }
.yasal-govde tbody tr:last-child th,
.yasal-govde tbody tr:last-child td { border-bottom: 0; }

@media (max-width: 34rem) {
  .yasal-govde table { min-width: 27rem; font-size: 0.875rem; }
  .yasal-govde th,
  .yasal-govde td { padding: 0.65rem 0.8rem; }
}

/* Künye kutusu: satıcı bilgileri gibi <dl> blokları */
.kunye-kutu {
  margin: 0 0 1.5em;
  padding: 1.25rem 1.4rem;
  background: var(--zemin-2);
  border: 1px solid var(--cizgi);
  border-radius: var(--r-yuzey);
  font-size: 0.9375rem;
  line-height: 1.65;
}
.kunye-kutu dl {
  display: grid;
  grid-template-columns: max-content minmax(0, 1fr);
  gap: 0.4rem 1.25rem;
  margin: 0;
}
.kunye-kutu dt { color: var(--metin-ucuncul); }
.kunye-kutu dd { margin: 0; color: var(--metin); font-weight: 500; }

@media (max-width: 34rem) {
  .kunye-kutu dl { grid-template-columns: minmax(0, 1fr); gap: 0.1rem; }
  .kunye-kutu dd { margin-bottom: 0.65rem; }
}

/* --------------------------------------------------------------------------
   HAREKET
   .belir: görünür varsayılanı zenginleştirir, içeriği asla gizli bırakmaz.
   site-20260930.js yalnız ekrana SONRADAN giren öğeye .belir--aktif ekler;
   ilk ekranda zaten görünen öğe hiç canlandırılmaz (yanıp sönme, LCP gecikmesi
   yok). JS çalışmazsa, gizli sekmede ya da tam sayfa ekran görüntüsünde içerik
   olduğu gibi görünür. Yalnız opacity + transform. window scroll dinleyicisi yok.
   -------------------------------------------------------------------------- */

@keyframes belir {
  from { opacity: 0; transform: translate3d(0, 18px, 0); }
  to   { opacity: 1; transform: none; }
}

@keyframes suzul {
  from { transform: translate3d(0, 0, 0); }
  to   { transform: translate3d(0, -8px, 0); }
}

@keyframes panel-ac {
  from { opacity: 0; transform: translate3d(0, -6px, 0); }
  to   { opacity: 1; transform: none; }
}

@media (prefers-reduced-motion: no-preference) {
  .belir--aktif { animation: belir var(--sure-uzun) var(--egri-cikis-uzun) both; }
  .belir--aktif.gecikme-1 { animation-delay: 80ms; }
  .belir--aktif.gecikme-2 { animation-delay: 160ms; }
  .belir--aktif.gecikme-3 { animation-delay: 240ms; }
  .belir--aktif.gecikme-4 { animation-delay: 320ms; }

  /* Süzülme: 6 sn tam tur (3 sn gidiş + 3 sn dönüş), 8px. Hero görseli için */
  .suzul { animation: suzul 3s ease-in-out 6 alternate; }

  .ust-menu__acilir[open] .ust-menu__panel { animation: panel-ac var(--sure-orta) var(--egri-cikis) both; }
}

/* --------------------------------------------------------------------------
   KULLANICI TERCİHLERİ
   -------------------------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }

  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    animation-delay: 0ms !important;
    transition-duration: 0.01ms !important;
    transition-delay: 0ms !important;
    scroll-behavior: auto !important;
  }

  .belir--aktif,
  .suzul { animation: none !important; }
  .dugme:hover,
  .dugme:active,
  .ust-menu__acilir > summary:active { transform: none; }
}

@media (prefers-reduced-transparency: reduce) {
  .ust-menu {
    background: var(--zemin);
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }
}

/* Windows yüksek karşıtlık: sınırı olmayan düğme görünmez kalmasın */
@media (forced-colors: active) {
  .dugme,
  .rozet,
  .odeme-serit__kart,
  .ust-menu__acilir > summary { border: 1px solid ButtonText; }
  .hamburger,
  .hamburger::before,
  .hamburger::after { background: ButtonText; }
  .ust-menu__acilir[open] .hamburger { background: transparent; }
  .alt-bar__kart { border: 1px solid CanvasText; }
}

/* --------------------------------------------------------------------------
   YAZDIRMA
   Yasal sayfalar kâğıtta okunur: menü, bağlantı sütunları ve ödeme şeridi
   gizlenir; telif ve künye satırı kalır.
   -------------------------------------------------------------------------- */

@media print {
  .ust-menu,
  .atla,
  .alt-bar__ust,
  .alt-bar__izgara,
  .odeme-serit { display: none !important; }
  .alt-bar__kart { padding: 0; box-shadow: none; border-radius: 0; }

  html { scroll-padding-top: 0; }
  body { background: #ffffff; color: #000000; font-size: 11pt; }
  h1, h2, h3, h4, .yasal-govde strong { color: #000000; }
  .yasal-govde, .giris, .kucuk, .alt-bar, .alt-bar__telif { color: #222222; max-width: none; }
  .yasal-govde { font-size: 11pt; }
  .alt-bar, .bolum--ton, .yasal-tablo-sarmal, .kunye-kutu { background: none; }
  .yasal-govde h2, .yasal-govde h3 { break-after: avoid; }
  .yasal-govde tr, .kunye-kutu { break-inside: avoid; }
  .belir--aktif, .suzul { animation: none !important; opacity: 1 !important; transform: none !important; }
  /* Zemin rengi kâğıda basılmaz: marka dolgusu üstündeki beyaz metin kaybolmasın */
  .yuzey-marka { background: none !important; color: #000000; border: 1px solid #999999; }
  .dugme,
  .rozet { background: none !important; color: #000000 !important; border: 1px solid #999999 !important; box-shadow: none !important; }
  a { color: #000000; text-decoration: underline; }
  .yasal-govde a[href^="http"]::after,
  .yasal-govde a[href^="mailto:"]::after { content: " (" attr(href) ")"; font-size: 0.85em; word-break: break-all; }
  .yasal-govde a.dugme::after { content: none; }
}
