@import url("font/inter.css");
@import url("font/plex.css");

/* İhracat Raporu · arayüz v2 (Figma: "İhracat Raporu · Arayüz v2").
   Yerleşim: solda kenar menü, sağda içerik (en çok 1200 px). Rapor: özet şeridi + yapışkan sekmeler + beş bölüm.
   Renk: mavi (birincil) eylem ve dağılım; temper bronzu yalnız Türkiye'yi işaretler; durum renkleri ayrı. */
:root {
  --zemin: #f7f8fa;
  --yuzey: #ffffff;
  --yuzey-2: #f2f4f7;
  --cizgi: #e4e7ec;
  --cizgi-2: #eef0f3;
  --metin: #101828;
  --metin-2: #475467;
  --metin-3: #667085;
  --birincil: #2457c5;
  --birincil-koyu: #1d47a6;
  --birincil-yumusak: #eaf0fd;
  --birincil-ustu: #ffffff;
  --veri: #2c6fb4;
  --turkiye: #b5650d;
  --iyi: #12805c;
  --iyi-yumusak: #e7f6ef;
  --uyari: #b54708;
  --uyari-yumusak: #fef0e1;
  --kritik: #d92d20;
  --kritik-yumusak: #fdecea;
  --ipucu-zemin: #101828;
  --ipucu-metin: #f7f8fa;
  --harita-acik: #eef2f7;
  --harita-koyu: #1d4f8a;
  --harita-ustu: #ffffff;
  --karo-esik: 0.72;
  --golge-1: 0 1px 2px rgb(16 24 40 / 0.05);
  --golge-2: 0 1px 3px rgb(16 24 40 / 0.08), 0 1px 2px rgb(16 24 40 / 0.04);
  --golge-3: 0 12px 32px -4px rgb(16 24 40 / 0.12), 0 4px 8px -2px rgb(16 24 40 / 0.04);
  --yazi: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --mono: "IBM Plex Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  --r-kucuk: 8px;
  --r: 12px;
  --r-buyuk: 16px;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --zemin: #0c1116; --yuzey: #141b22; --yuzey-2: #1a232c; --cizgi: #26313c; --cizgi-2: #1f2933;
    --metin: #e6ebf0; --metin-2: #a9b4bf; --metin-3: #84909c;
    --birincil: #6e9bf0; --birincil-koyu: #8cb1f4; --birincil-yumusak: #182844; --birincil-ustu: #0c1116;
    --veri: #3a83c9; --turkiye: #bf7a1e;
    --iyi: #4cc38a; --iyi-yumusak: #12291f; --uyari: #f2a65a; --uyari-yumusak: #33230f; --kritik: #f97066; --kritik-yumusak: #3a1714;
    --ipucu-zemin: #e6ebf0; --ipucu-metin: #0c1116;
    --harita-acik: #1a232c; --harita-koyu: #6aa6e8; --harita-ustu: #0c1116; --karo-esik: 0.58;
    --golge-1: 0 1px 2px rgb(0 0 0 / 0.3); --golge-2: 0 1px 3px rgb(0 0 0 / 0.35); --golge-3: 0 12px 32px -4px rgb(0 0 0 / 0.5);
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --zemin: #0c1116; --yuzey: #141b22; --yuzey-2: #1a232c; --cizgi: #26313c; --cizgi-2: #1f2933;
  --metin: #e6ebf0; --metin-2: #a9b4bf; --metin-3: #84909c;
  --birincil: #6e9bf0; --birincil-koyu: #8cb1f4; --birincil-yumusak: #182844; --birincil-ustu: #0c1116;
  --veri: #3a83c9; --turkiye: #bf7a1e;
  --iyi: #4cc38a; --iyi-yumusak: #12291f; --uyari: #f2a65a; --uyari-yumusak: #33230f; --kritik: #f97066; --kritik-yumusak: #3a1714;
  --ipucu-zemin: #e6ebf0; --ipucu-metin: #0c1116;
  --harita-acik: #1a232c; --harita-koyu: #6aa6e8; --harita-ustu: #0c1116; --karo-esik: 0.58;
  --golge-1: 0 1px 2px rgb(0 0 0 / 0.3); --golge-2: 0 1px 3px rgb(0 0 0 / 0.35); --golge-3: 0 12px 32px -4px rgb(0 0 0 / 0.5);
  color-scheme: dark;
}

/* ── temel ─────────────────────────────────────────────────────────────── */
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--zemin); color: var(--metin); font-family: var(--yazi); font-size: 14px; line-height: 1.5;
  font-feature-settings: "cv11", "ss01"; -webkit-font-smoothing: antialiased; }
a { color: var(--birincil); text-decoration: none; }
a:hover { text-decoration: underline; text-underline-offset: 2px; }
:focus-visible { outline: 2px solid var(--birincil); outline-offset: 2px; border-radius: 4px; }
h1, h2, h3 { margin: 0; font-weight: 600; text-wrap: balance; letter-spacing: -0.02em; }
h1 { font-size: 24px; line-height: 1.25; }
h2 { font-size: 16px; line-height: 1.35; letter-spacing: -0.01em; }
h3 { font-size: 14px; line-height: 1.4; }
p { margin: 0; }
[hidden] { display: none !important; }
.gizli { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.num, td.num { font-variant-numeric: tabular-nums; }
.mono { font-family: var(--mono); font-size: 0.93em; }
.ince { color: var(--metin-3); }
.dipnot { font-size: 12.5px; color: var(--metin-3); max-width: 90ch; }
.etiket-ust { font-size: 11.5px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--metin-3); font-weight: 600; }
.yigin { display: grid; gap: 16px; }
.satir-arac { display: flex; flex-wrap: wrap; gap: 8px 12px; align-items: center; }
.ara-bosluk { flex: 1; }
.ikon { width: 18px; height: 18px; flex: none; display: inline-block; vertical-align: middle; }
.ikon-14 { width: 14px; height: 14px; }
.ikon-16 { width: 16px; height: 16px; }
.ikon-20 { width: 20px; height: 20px; }

/* ── düğmeler ──────────────────────────────────────────────────────────── */
.dugme { font: inherit; font-size: 14px; font-weight: 500; line-height: 20px; color: var(--metin); background: var(--yuzey);
  border: 1px solid var(--cizgi); border-radius: var(--r-kucuk); padding: 8px 14px; cursor: pointer; text-decoration: none;
  display: inline-flex; gap: 8px; align-items: center; justify-content: center; box-shadow: var(--golge-1); white-space: nowrap; }
.dugme:hover { background: var(--yuzey-2); text-decoration: none; }
.dugme .ikon { width: 16px; height: 16px; color: var(--metin-2); }
.dugme.ana { background: var(--birincil); border-color: var(--birincil); color: var(--birincil-ustu); font-weight: 600; }
.dugme.ana .ikon { color: var(--birincil-ustu); }
.dugme.ana:hover { background: var(--birincil-koyu); border-color: var(--birincil-koyu); }
.dugme.hayalet { background: transparent; border-color: transparent; box-shadow: none; color: var(--metin-2); }
.dugme.hayalet:hover { background: var(--yuzey-2); color: var(--metin); }
.dugme.tehlike { color: var(--kritik); }
.dugme.tehlike .ikon { color: var(--kritik); }
.dugme.kucuk { font-size: 13px; padding: 5px 10px; }
.dugme.buyuk { font-size: 15px; padding: 11px 18px; }
.dugme:disabled { opacity: 0.55; cursor: progress; }

/* ── form ──────────────────────────────────────────────────────────────── */
.alan { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 8px; font-size: 13px; font-weight: 500; color: var(--metin-2); min-width: 0; }
.alan > input:not([type="checkbox"]), .alan > select, .alan > textarea { flex: 1 1 100%; }
.alan .birim { font-family: var(--mono); font-size: 11.5px; font-weight: 400; color: var(--metin-3); }
.alan.genis { grid-column: 1 / -1; }
input[type="text"], input[type="email"], input[type="password"], input[type="search"], select, textarea {
  font: inherit; font-size: 14px; font-weight: 400; color: var(--metin); background: var(--yuzey); border: 1px solid var(--cizgi);
  border-radius: var(--r-kucuk); padding: 9px 12px; min-width: 0; width: 100%; box-shadow: var(--golge-1); }
input::placeholder { color: var(--metin-3); }
input:focus-visible, select:focus-visible, textarea:focus-visible { outline: none; border-color: var(--birincil); box-shadow: 0 0 0 3px var(--birincil-yumusak); }
.onay { display: flex; gap: 8px; align-items: flex-start; font-size: 13px; font-weight: 400; color: var(--metin-2); }
.onay input { margin-top: 3px; accent-color: var(--birincil); }
.form-izgara > .genis { grid-column: 1 / -1; }
.form-izgara { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 14px 16px; }
.hata-kutu { color: var(--kritik); background: var(--kritik-yumusak); border-radius: var(--r-kucuk); padding: 9px 12px; font-size: 13.5px; }
.bilgi-kutu { color: var(--uyari); background: var(--uyari-yumusak); border-radius: var(--r-kucuk); padding: 9px 12px; font-size: 13px; }

/* ── kartlar, tablolar, rozetler ───────────────────────────────────────── */
.kart, .panel { background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: var(--r); box-shadow: var(--golge-2); min-width: 0; }
.panel { padding: 20px; }
.kart-bas { display: flex; flex-wrap: wrap; gap: 8px 12px; align-items: center; padding: 16px 20px; }
.kart-bas .metin { flex: 1; min-width: 0; display: grid; gap: 2px; }
.kart-bas p { color: var(--metin-3); font-size: 13px; }
.kart-govde { padding: 4px 20px 20px; }
.tablo-kap { overflow-x: auto; border: 1px solid var(--cizgi); border-radius: var(--r); background: var(--yuzey); box-shadow: var(--golge-2); }
.kart .tablo-kap { border: 0; border-radius: 0; box-shadow: none; }
.kart > .tablo-kap:last-child, .kart > div > .tablo-kap:last-child { border-bottom-left-radius: calc(var(--r) - 1px); border-bottom-right-radius: calc(var(--r) - 1px); }
.kart-liste { padding-bottom: 8px; }
table { border-collapse: collapse; width: 100%; font-size: 14px; }
th, td { padding: 11px 16px; text-align: left; border-top: 1px solid var(--cizgi-2); vertical-align: middle; }
th { font-size: 11.5px; letter-spacing: 0.05em; text-transform: uppercase; color: var(--metin-3); font-weight: 600; white-space: nowrap; background: var(--yuzey-2); border-top: 1px solid var(--cizgi); }
td { white-space: nowrap; color: var(--metin-2); }
td.sar { white-space: normal; min-width: 180px; }
td b, td .ana-hucre { color: var(--metin); font-weight: 500; }
th.num, td.num { text-align: right; }
tbody tr:hover td { background: color-mix(in srgb, var(--yuzey-2) 55%, transparent); }
.rozet, .cip { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 500; border-radius: 999px; padding: 2px 9px; white-space: nowrap; line-height: 18px; }
.rozet::before, .cip::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.rozet.iyi, .cip.iyi { color: var(--iyi); background: var(--iyi-yumusak); }
.rozet.orta, .cip.orta { color: var(--uyari); background: var(--uyari-yumusak); }
.rozet.kotu, .cip.kotu { color: var(--kritik); background: var(--kritik-yumusak); }
.rozet.notr, .cip.notr { color: var(--metin-2); background: var(--yuzey-2); }
.rozet.birincil { color: var(--birincil); background: var(--birincil-yumusak); }
.rozet.duz::before { display: none; }
.cip { font-family: var(--mono); }
.etiket { font-size: 11px; font-weight: 500; color: var(--metin-3); border: 1px solid var(--cizgi); border-radius: 999px; padding: 0 7px; margin-left: 8px; white-space: nowrap; }
.kod { font-family: var(--mono); font-size: 12.5px; border: 1px solid var(--cizgi); background: var(--yuzey); padding: 2px 8px; border-radius: 6px; color: var(--metin-2); white-space: nowrap; }
.puan-rozet { font-family: var(--mono); font-size: 12px; font-weight: 500; color: var(--birincil); background: var(--birincil-yumusak); border-radius: 6px; padding: 1px 7px; }
.yukleniyor { display: flex; gap: 12px; align-items: center; color: var(--metin-2); padding: 24px 0; }
.yukleniyor::before { content: ""; width: 16px; height: 16px; border-radius: 50%; border: 2px solid var(--cizgi); border-top-color: var(--birincil); animation: don 0.9s linear infinite; flex: none; }
@keyframes don { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .yukleniyor::before { animation: none; } }
.bos-durum { display: grid; gap: 8px; justify-items: start; padding: 28px; border: 1px dashed var(--cizgi); border-radius: var(--r); color: var(--metin-2); background: var(--yuzey); }

/* ── uygulama kabuğu: kenar menü + içerik ──────────────────────────────── */
.uygulama { display: grid; grid-template-columns: 248px minmax(0, 1fr); min-height: 100vh; }
.kenar { position: sticky; top: 0; height: 100vh; display: flex; flex-direction: column; gap: 4px; padding: 20px 16px 12px;
  background: var(--yuzey); border-right: 1px solid var(--cizgi); overflow-y: auto; }
.marka { display: inline-flex; align-items: center; gap: 10px; font-weight: 600; font-size: 15px; letter-spacing: -0.01em; color: var(--metin); text-decoration: none; }
.marka:hover { text-decoration: none; }
.marka-simge { width: 28px; height: 28px; border-radius: var(--r-kucuk); background: var(--birincil); color: var(--birincil-ustu); display: grid; place-items: center; flex: none; }
.marka-simge .ikon { width: 18px; height: 18px; }
.kenar .marka { padding: 4px 8px 16px; }
/* TÜBSİAD amblemi: koyu temada beyaz yuvarlak zemin (amblemin içindeki beyaz boşluklar zeminle uyumlu kalsın) */
.marka-logo { width: 34px; height: 34px; flex: none; border-radius: 50%; object-fit: contain; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .marka-logo { background: #fff; padding: 2px; } }
:root[data-theme="dark"] .marka-logo { background: #fff; padding: 2px; }
.logo-kart { display: flex; width: max-content; background: #fff; border-radius: var(--r-buyuk); padding: 10px 14px; box-shadow: var(--golge-2); margin-bottom: 22px; }
.logo-kart img { display: block; width: 200px; height: auto; }
.yazdir-logo { display: none; }
.kenar-firma { display: grid; gap: 2px; padding: 10px 12px; border-radius: var(--r-kucuk); background: var(--yuzey-2); margin-bottom: 12px; }
.kenar-firma b { font-size: 13px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kenar-firma span { font-size: 12px; color: var(--metin-3); }
.kenar-menu { display: grid; gap: 2px; }
.kenar-menu a { display: flex; align-items: center; gap: 10px; padding: 8px 12px; border-radius: var(--r-kucuk); color: var(--metin-2); font-weight: 500; text-decoration: none; }
.kenar-menu a .ikon { color: var(--metin-3); }
.kenar-menu a:hover { background: var(--yuzey-2); color: var(--metin); }
.kenar-menu a[aria-current="page"] { background: var(--birincil-yumusak); color: var(--birincil); font-weight: 600; }
.kenar-menu a[aria-current="page"] .ikon { color: var(--birincil); }
.kenar-menu .sayac { margin-left: auto; font-size: 12px; font-weight: 600; color: var(--kritik); background: var(--kritik-yumusak); border-radius: 999px; padding: 0 7px; }
.kenar-bolum { font-size: 11px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--metin-3); padding: 16px 12px 6px; }
.kenar-alt { margin-top: auto; border-top: 1px solid var(--cizgi); padding: 12px 4px 0; display: flex; gap: 10px; align-items: center; }
.avatar { width: 32px; height: 32px; border-radius: 50%; background: var(--birincil-yumusak); color: var(--birincil); display: grid; place-items: center; font-size: 12px; font-weight: 600; flex: none; }
.kenar-alt .kim { flex: 1; min-width: 0; display: grid; }
.kenar-alt .kim b { font-size: 13px; font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kenar-alt .kim span { font-size: 12px; color: var(--metin-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ana-kolon { min-width: 0; display: flex; flex-direction: column; }
.ust-mobil { display: none; }
.arama { position: relative; display: inline-flex; align-items: center; min-width: 0; }
.arama .ikon { position: absolute; left: 11px; width: 16px; height: 16px; color: var(--metin-3); pointer-events: none; }
.arama input { padding-left: 34px; width: 260px; max-width: 100%; }
@media (max-width: 640px) { .arama, .arama input { width: 100%; } .sayfa-bas .satir-arac { width: 100%; } }
main.icerik { min-width: 0; padding: 28px max(32px, env(safe-area-inset-right, 0px)) 72px 32px; max-width: 1264px; width: 100%; }
.sayfa-bas { display: flex; flex-wrap: wrap; gap: 12px 16px; align-items: flex-end; justify-content: space-between; margin-bottom: 24px; }
.sayfa-bas .metin { display: grid; gap: 4px; min-width: 0; }
.sayfa-bas p { color: var(--metin-2); max-width: 72ch; }
.kirinti { display: flex; align-items: center; gap: 6px; font-size: 13px; color: var(--metin-3); margin-bottom: 12px; }
.kirinti a { color: var(--metin-3); }
.kirinti b { color: var(--metin-2); font-weight: 500; }
.bildirim { position: fixed; z-index: 30; left: 50%; bottom: max(20px, env(safe-area-inset-bottom, 0px)); transform: translateX(-50%); background: var(--ipucu-zemin); color: var(--ipucu-metin);
  padding: 10px 16px; border-radius: var(--r-kucuk); font-size: 14px; box-shadow: var(--golge-3); max-width: calc(100vw - 32px); }
.ipucu { position: fixed; z-index: 20; pointer-events: none; background: var(--ipucu-zemin); color: var(--ipucu-metin); font-size: 12.5px; line-height: 1.45; padding: 8px 10px; border-radius: var(--r-kucuk); max-width: 260px; box-shadow: var(--golge-3); }

@media (max-width: 960px) {
  .uygulama { grid-template-columns: minmax(0, 1fr); }
  .kenar { position: fixed; z-index: 40; inset: 0 auto 0 0; width: 280px; transform: translateX(-100%); transition: transform 0.2s ease; box-shadow: var(--golge-3);
    padding-top: max(20px, env(safe-area-inset-top, 0px)); padding-left: max(16px, env(safe-area-inset-left, 0px)); }
  body.menu-acik .kenar { transform: none; }
  body.menu-acik::after { content: ""; position: fixed; inset: 0; z-index: 35; background: rgb(16 24 40 / 0.35); }
  .ust-mobil { display: flex; align-items: center; gap: 10px; position: sticky; top: 0; z-index: 30; background: var(--yuzey); border-bottom: 1px solid var(--cizgi);
    padding: max(10px, env(safe-area-inset-top, 0px)) max(16px, env(safe-area-inset-right, 0px)) 10px max(16px, env(safe-area-inset-left, 0px)); }
  main.icerik { padding: 20px max(16px, env(safe-area-inset-right, 0px)) 64px max(16px, env(safe-area-inset-left, 0px)); }
}

/* ── genel bakış ───────────────────────────────────────────────────────── */
.ozet-serit { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin-bottom: 24px; }
@media (max-width: 1100px) { .ozet-serit { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.ozet-kutu { padding: 16px; display: grid; gap: 6px; align-content: start; }
.ozet-kutu .etiket-k { font-size: 12.5px; font-weight: 500; color: var(--metin-2); }
.ozet-kutu .deger { font-size: 24px; font-weight: 600; letter-spacing: -0.03em; line-height: 1.2; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.ozet-kutu .alt { font-size: 12.5px; color: var(--metin-3); display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.ozet-kutu .alt .ikon { width: 14px; height: 14px; color: var(--iyi); }
.ozet-kutu .alt .ikon.azal-ikon { color: var(--kritik); }
.pano { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 24px; align-items: start; }
@media (max-width: 1100px) { .pano { grid-template-columns: minmax(0, 1fr); } }
.pano-sol, .pano-sag { display: grid; gap: 24px; min-width: 0; }
.uyari-oge { display: flex; gap: 12px; padding: 12px 20px; border-top: 1px solid var(--cizgi-2); color: inherit; text-decoration: none; }
.uyari-oge:hover { background: var(--yuzey-2); text-decoration: none; }
.uyari-oge .kutu { width: 28px; height: 28px; border-radius: var(--r-kucuk); display: grid; place-items: center; flex: none; }
.uyari-oge .kutu .ikon { width: 16px; height: 16px; }
.uyari-oge.kritik .kutu { background: var(--kritik-yumusak); color: var(--kritik); }
.uyari-oge.uyari .kutu { background: var(--uyari-yumusak); color: var(--uyari); }
.uyari-oge .metin { min-width: 0; display: grid; gap: 1px; }
.uyari-oge b { font-weight: 500; color: var(--metin); }
.uyari-oge small { font-size: 13px; color: var(--metin-3); }
.uyari-oge.iyi .kutu { background: var(--iyi-yumusak); color: var(--iyi); }
.adim-oge { display: flex; gap: 10px; align-items: center; padding: 8px 20px; font-weight: 500; color: var(--metin); text-decoration: none; }
.adim-oge:hover { background: var(--yuzey-2); text-decoration: none; }
.adim-oge .ikon { width: 18px; height: 18px; }
.adim-oge.tamam { color: var(--metin-3); font-weight: 400; }
.adim-oge.tamam .ikon { color: var(--iyi); }
.adim-oge:not(.tamam) .ikon { color: var(--metin-3); }
.ilerleme { height: 6px; border-radius: 999px; background: var(--yuzey-2); overflow: hidden; margin: 0 20px 8px; }
.kart-alt { padding: 8px 20px 16px; }
.tik-satir { cursor: pointer; }
.ilerleme span { display: block; height: 100%; background: var(--iyi); border-radius: 999px; }
.etkinlik-oge { display: flex; gap: 12px; align-items: center; padding: 9px 20px; border-top: 1px solid var(--cizgi-2); }
.etkinlik-oge .nokta { width: 8px; height: 8px; border-radius: 50%; flex: none; background: var(--metin-3); }
.etkinlik-oge .nokta.kritik { background: var(--kritik); }
.etkinlik-oge .nokta.iyi { background: var(--iyi); }
.etkinlik-oge .nokta.veri { background: var(--veri); }
.etkinlik-oge p { flex: 1; min-width: 0; }
.etkinlik-oge time { font-family: var(--mono); font-size: 12px; color: var(--metin-3); white-space: nowrap; }
.spark { display: block; overflow: visible; }

/* ── ürünler ───────────────────────────────────────────────────────────── */
.urun-kartlar { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 16px; }
.urun-kart { padding: 18px; display: grid; gap: 10px; align-content: start; transition: border-color 0.15s, box-shadow 0.15s; }
.urun-kart:hover { border-color: color-mix(in srgb, var(--birincil) 45%, var(--cizgi)); box-shadow: var(--golge-3); }
.urun-kart .ust { display: flex; gap: 12px; align-items: flex-start; }
.urun-kart .simge-kutu, .simge-kutu { width: 36px; height: 36px; border-radius: 10px; background: var(--birincil-yumusak); color: var(--birincil); display: grid; place-items: center; flex: none; }
.urun-kart .ad { font-weight: 600; font-size: 15px; color: var(--metin); }
.urun-kart .tanim { font-size: 12.5px; color: var(--metin-3); overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.urun-kart .olcu { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; padding-top: 10px; border-top: 1px solid var(--cizgi-2); }
.urun-kart .olcu div { display: grid; gap: 2px; }
.urun-kart .olcu span { font-size: 11.5px; color: var(--metin-3); }
.urun-kart .olcu b { font-size: 14px; font-weight: 600; font-variant-numeric: tabular-nums; }
@media (max-width: 560px) { .urun-kart .olcu { grid-template-columns: 1fr 1fr; } .urun-kart .olcu div:last-child { grid-column: 1 / -1; } }
.secenekler { display: grid; gap: 8px; }
.secenek { display: grid; grid-template-columns: auto 1fr; gap: 2px 10px; align-items: start; border: 1px solid var(--cizgi); border-radius: var(--r-kucuk); padding: 10px 12px; cursor: pointer; background: var(--yuzey); }
.secenek:has(input:checked) { border-color: var(--birincil); background: var(--birincil-yumusak); }
.secenek input { margin-top: 4px; grid-row: span 2; accent-color: var(--birincil); }
.secenek .ust { display: flex; gap: 8px; flex-wrap: wrap; align-items: baseline; }
.secenek .alt { font-size: 12.5px; color: var(--metin-3); }

/* ── rapor ─────────────────────────────────────────────────────────────── */
.rapor-bas { display: flex; flex-wrap: wrap; gap: 16px; align-items: flex-start; margin-bottom: 20px; }
.rapor-bas .metin { flex: 1; min-width: 260px; display: grid; gap: 8px; }
.rapor-bas h1 { font-size: 28px; letter-spacing: -0.03em; }
.rapor-bas .cipler { display: flex; flex-wrap: wrap; gap: 8px; }
.rapor-bas .tanim { font-size: 13px; color: var(--metin-3); }
.sekme-serit { position: sticky; top: 0; z-index: 10; display: flex; gap: 4px; overflow-x: auto; scrollbar-width: none; background: var(--zemin);
  border-bottom: 1px solid var(--cizgi); margin: 0 0 24px; }
.sekme-serit a { display: inline-flex; align-items: center; gap: 8px; padding: 11px 14px; color: var(--metin-2); font-weight: 500; text-decoration: none; border-bottom: 2px solid transparent; white-space: nowrap; margin-bottom: -1px; }
.sekme-serit a .ikon { width: 16px; height: 16px; color: var(--metin-3); }
.sekme-serit a:hover { color: var(--metin); }
.sekme-serit a[aria-current="true"] { color: var(--birincil); border-bottom-color: var(--birincil); font-weight: 600; }
.sekme-serit a[aria-current="true"] .ikon { color: var(--birincil); }
@media (max-width: 960px) { .sekme-serit { top: var(--ust-h, 53px); } }
.bolum { display: grid; gap: 16px; padding-bottom: 40px; scroll-margin-top: calc(var(--ust-h, 0px) + 64px); }
.bolum-bas { display: grid; gap: 4px; }
.bolum-bas h2 { font-size: 18px; display: flex; align-items: center; gap: 10px; }
.bolum-bas h2 .no { font-family: var(--mono); font-size: 12px; font-weight: 500; color: var(--birincil); background: var(--birincil-yumusak); border-radius: 6px; padding: 2px 7px; }
.bolum-bas p { color: var(--metin-2); max-width: 78ch; }
.pazar-izgara { display: grid; grid-template-columns: 468px minmax(0, 1fr); gap: 24px; align-items: start; }
@media (max-width: 1180px) { .pazar-izgara { grid-template-columns: minmax(0, 1fr); } }
.harita { display: grid; grid-template-columns: repeat(7, 52px); grid-template-rows: repeat(7, 52px); gap: 6px; justify-content: center; padding: 4px 20px 8px; }
.karo { all: unset; box-sizing: border-box; display: grid; place-items: center; align-content: center; gap: 1px; border-radius: var(--r-kucuk); cursor: pointer; color: var(--metin);
  background: color-mix(in srgb, var(--harita-koyu) calc(var(--o, 1) * 100%), var(--harita-acik)); font-size: 13px; font-weight: 600; line-height: 1.1; }
.karo small { font-size: 11px; font-weight: 500; font-family: var(--mono); opacity: 0.9; }
.karo.koyu { color: var(--harita-ustu); }
.karo:hover { outline: 2px solid color-mix(in srgb, var(--metin) 40%, transparent); outline-offset: 1px; }
.karo.secili { outline: 2px solid var(--metin); outline-offset: 1px; }
.karo:focus-visible { outline: 2px solid var(--birincil); outline-offset: 2px; }
.harita-lejant { display: flex; flex-wrap: wrap; gap: 6px 12px; align-items: center; padding: 8px 20px 18px; font-size: 12px; color: var(--metin-3); }
.harita-lejant span { display: inline-flex; gap: 5px; align-items: center; font-family: var(--mono); color: var(--metin-2); }
.harita-lejant i { width: 14px; height: 14px; border-radius: 3px; background: color-mix(in srgb, var(--harita-koyu) calc(var(--o) * 100%), var(--harita-acik)); }
@media (max-width: 520px) { .harita { grid-template-columns: repeat(7, 40px); grid-template-rows: repeat(7, 40px); gap: 4px; padding: 4px 12px 8px; } .karo { font-size: 11px; } .karo small { display: none; } }
.agirliklar { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 20px; }
@media (min-width: 640px) { .agirliklar { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1100px) { .agirliklar { grid-template-columns: repeat(6, minmax(0, 1fr)); } }
.agirlik { display: grid; gap: 4px; }
.agirlik label { font-size: 12.5px; font-weight: 500; color: var(--metin-2); display: flex; justify-content: space-between; gap: 8px; }
.agirlik output { font-family: var(--mono); color: var(--metin); }
.agirlik input[type="range"] { width: 100%; accent-color: var(--birincil); }
.agirlik.kapali { opacity: 0.5; }
.abd-ozet { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
@media (max-width: 900px) { .abd-ozet { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.abd-ozet > div { background: var(--yuzey-2); border-radius: 10px; padding: 12px 14px; display: grid; gap: 2px; align-content: start; min-width: 0; }
.abd-ozet span { font-size: 12px; color: var(--metin-3); font-weight: 500; }
.abd-ozet b { font-size: 18px; font-weight: 600; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.abd-ozet small { font-size: 12px; color: var(--metin-2); }
.abd-tedarik { margin-top: 14px; font-size: 13px; color: var(--metin-2); line-height: 1.7; }
.abd-tedarik b { color: var(--metin); font-weight: 500; }
details.ayar > summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 8px; padding: 14px 20px; font-weight: 500; }
details.ayar > summary::-webkit-details-marker { display: none; }
details.ayar > summary .ikon { color: var(--metin-3); }
details.ayar > summary .ok { margin-left: auto; transition: transform 0.15s; }
details.ayar[open] > summary .ok { transform: rotate(180deg); }
details.ayar .ayar-govde { padding: 4px 20px 18px; display: grid; gap: 12px; }
#pazar-tablo { min-width: 860px; }
#pazar-tablo th, #pazar-tablo td { padding-left: 12px; padding-right: 12px; }
#pazar-tablo th:first-child, #pazar-tablo td:first-child { padding-left: 20px; }
#pazar-tablo th button { all: unset; cursor: pointer; display: inline-flex; gap: 4px; align-items: center; }
#pazar-tablo th button:focus-visible { outline: 2px solid var(--birincil); outline-offset: 2px; }
#pazar-tablo th .ok { opacity: 0; font-size: 10px; }
#pazar-tablo th[aria-sort] .ok { opacity: 1; }
#pazar-tablo tbody tr { cursor: pointer; }
#pazar-tablo tbody tr.secili td { background: var(--birincil-yumusak); }
#pazar-tablo tbody tr.secili .ulke-ad { font-weight: 600; color: var(--metin); }
.ulke-ad { color: var(--metin); font-weight: 500; }
.iso { font-family: var(--mono); font-size: 11px; color: var(--metin-3); margin-right: 8px; display: inline-block; width: 18px; }
.puan-hucre { display: flex; align-items: center; gap: 10px; min-width: 130px; }
.puan-cubuk { flex: 1; height: 8px; background: var(--yuzey-2); border-radius: 4px; overflow: hidden; min-width: 70px; }
.puan-cubuk span { display: block; height: 100%; background: var(--veri); border-radius: 4px; }
.puan-hucre b { font-family: var(--mono); font-weight: 500; width: 2.2em; text-align: right; color: var(--metin); }
.ithalat-hucre { display: inline-flex; align-items: center; gap: 10px; justify-content: flex-end; }
.ithalat-hucre > span { white-space: nowrap; }
.art { color: var(--iyi); }
.azal { color: var(--kritik); }
.ilk-liste button.satir { font: inherit; color: inherit; background: none; border: 0; border-top: 1px solid var(--cizgi-2); width: 100%; text-align: left; }
.ilk-liste button.satir:focus-visible { outline-offset: -2px; }
.ilk-liste .satir { display: grid; grid-template-columns: 26px minmax(0, 1fr) 176px 76px 52px; gap: 12px; align-items: center; padding: 10px 20px; border-top: 1px solid var(--cizgi-2); cursor: pointer; }
.ilk-liste .satir:hover { background: var(--yuzey-2); }
.ilk-liste .satir[aria-pressed="true"] { background: var(--birincil-yumusak); }
.ilk-liste .satir[aria-pressed="true"] .ulke-ad { font-weight: 600; }
.ilk-liste .satir.baslik { cursor: default; background: var(--yuzey-2); padding-top: 8px; padding-bottom: 8px; font-size: 11.5px; letter-spacing: 0.05em; text-transform: uppercase; color: var(--metin-3); font-weight: 600; }
.ilk-liste .satir .sag { text-align: right; font-variant-numeric: tabular-nums; }
.ilk-liste .satir .sira { font-family: var(--mono); color: var(--metin-3); }
@media (max-width: 640px) { .ilk-liste .satir { grid-template-columns: 22px minmax(0, 1fr) 110px 64px; } .ilk-liste .satir .gizle-dar { display: none; } }
.fiyat-ust { display: flex; flex-wrap: wrap; gap: 10px 18px; align-items: end; justify-content: space-between; }
.secim { display: grid; gap: 6px; font-size: 13px; font-weight: 500; color: var(--metin-2); }
.secim select { width: auto; min-width: 180px; }
.lejant { display: flex; flex-wrap: wrap; gap: 6px 16px; font-size: 12.5px; color: var(--metin-2); }
.lejant span { display: inline-flex; align-items: center; gap: 6px; }
.lejant i { width: 14px; height: 8px; border-radius: 0 3px 3px 0; display: inline-block; }
.lejant i.tr { background: var(--turkiye); }
.lejant i.diger { background: var(--veri); }
.lejant i.cizgi { width: 0; height: 14px; border-left: 2px dashed var(--metin-2); border-radius: 0; }
.grafik { display: grid; gap: 8px; margin-top: 8px; }
.g-satir, .g-eksen { display: grid; grid-template-columns: minmax(96px, 150px) 1fr 76px 56px; gap: 12px; align-items: center; }
.g-satir { font-size: 13px; border-radius: 4px; }
.g-satir .ad { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--metin-2); }
.g-satir .iz { position: relative; height: 16px; }
.g-satir .cubuk { position: absolute; left: 0; top: 2px; bottom: 2px; background: var(--veri); border-radius: 0 4px 4px 0; }
.g-satir.tr .cubuk { background: var(--turkiye); }
.g-satir.tr .ad { color: var(--metin); font-weight: 600; }
.g-satir.az { opacity: 0.45; }
.g-satir .tasma { position: absolute; right: -2px; top: 0; font-size: 11px; color: var(--metin-3); }
.g-satir .deger { text-align: right; font-variant-numeric: tabular-nums; font-family: var(--mono); font-size: 12.5px; }
.g-satir .pay { text-align: right; color: var(--metin-3); font-variant-numeric: tabular-nums; font-size: 12px; font-family: var(--mono); }
.g-satir .ort { position: absolute; top: -4px; bottom: -4px; border-left: 2px dashed var(--metin-2); opacity: 0.5; pointer-events: none; }
.g-satir:hover .ad, .g-satir:focus-visible .ad { color: var(--metin); }
.g-eksen { font-size: 11px; color: var(--metin-3); }
.g-eksen .iz { position: relative; height: 16px; border-bottom: 1px solid var(--cizgi); }
.g-eksen .tik { position: absolute; bottom: 2px; transform: translateX(-50%); font-variant-numeric: tabular-nums; white-space: nowrap; }
.g-eksen .tik:first-child { transform: none; }
.g-eksen .bas-not, .g-eksen .bos-pay { text-align: right; }
details.sayilar { margin-top: 12px; font-size: 13px; }
details.sayilar summary { cursor: pointer; color: var(--birincil); font-weight: 500; }
details.sayilar .tablo-kap { margin-top: 10px; }
.iki-sutun { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; align-items: start; }
@media (max-width: 1100px) { .iki-sutun { grid-template-columns: minmax(0, 1fr); } }
.iki-sutun td { white-space: normal; }
.iki-sutun th, .iki-sutun td { padding-left: 12px; padding-right: 12px; }
.iki-sutun td.oran, .iki-sutun td.mono { white-space: nowrap; }
.vergi-bas { display: flex; justify-content: space-between; gap: 10px; align-items: baseline; flex-wrap: wrap; margin-bottom: 12px; }
td.oran { font-family: var(--mono); text-align: right; color: var(--metin); }
td.oran.sifir { color: var(--iyi); font-weight: 500; }
.notlar { margin: 12px 0 0; padding-left: 18px; display: grid; gap: 5px; font-size: 12.5px; color: var(--metin-2); }
.tarih-cip { font-size: 11.5px; font-weight: 500; border-radius: 999px; padding: 2px 9px; background: var(--yuzey-2); color: var(--metin-2); white-space: nowrap; }
.tarih-cip.eski { background: var(--uyari-yumusak); color: var(--uyari); }
.hesap { display: grid; grid-template-columns: minmax(0, 1fr); gap: 24px; }
@media (min-width: 1100px) { .hesap { grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr); } }
.ornek-not { font-size: 12.5px; color: var(--uyari); background: var(--uyari-yumusak); border-radius: var(--r-kucuk); padding: 8px 12px; margin-bottom: 14px; }
.kayit-durum { font-size: 12px; color: var(--metin-3); }
.merdiven td.num { font-family: var(--mono); font-size: 13px; color: var(--metin); }
.merdiven tr.vurgu td { background: var(--birincil-yumusak); }
.merdiven tr.vurgu td b { color: var(--birincil); }
.merdiven .aciklama { color: var(--metin-3); font-size: 12px; white-space: normal; }
.merdiven td:first-child { white-space: normal; }
.kar-serit { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 10px; margin-top: 16px; }
.kar-kutu { border: 1px solid var(--cizgi); border-radius: var(--r-kucuk); padding: 10px 12px; display: grid; gap: 2px; background: var(--yuzey); }
.kar-kutu .d { font-family: var(--mono); font-size: 16px; font-weight: 500; color: var(--metin); }
.kar-kutu .d.eksi { color: var(--kritik); }
.kar-kutu .d.arti { color: var(--iyi); }
.kar-kutu .e { font-size: 12px; color: var(--metin-3); }
.kiyas { margin-top: 18px; display: grid; gap: 8px; }
.kiyas-iz { position: relative; height: 54px; margin: 0 10px; }
.kiyas-iz .hat { position: absolute; left: 0; right: 0; top: 26px; border-top: 1px solid var(--cizgi); }
.kiyas-iz .im { position: absolute; top: 20px; width: 12px; height: 12px; margin-left: -6px; border-radius: 50%; border: 2px solid var(--yuzey); }
.kiyas-iz .im.siz { background: var(--birincil); }
.kiyas-iz .im.pazar { background: var(--metin-2); border-radius: 2px; }
.kiyas-iz .im.tr { background: var(--turkiye); }
.kiyas-iz .yazi { position: absolute; font-size: 11.5px; white-space: nowrap; transform: translateX(-50%); color: var(--metin-2); font-variant-numeric: tabular-nums; }
.kiyas-iz .yazi.ust { top: 0; }
.kiyas-iz .yazi.alt { top: 36px; }
.risk-izgara { display: grid; grid-template-columns: minmax(0, 1fr); gap: 24px; }
@media (min-width: 1100px) { .risk-izgara { grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); } }
.ulke-risk .buyuk { font-size: 22px; font-weight: 600; letter-spacing: -0.02em; }
.durum { display: inline-flex; align-items: center; gap: 8px; font-size: 13.5px; font-weight: 500; border-radius: var(--r-kucuk); padding: 8px 12px; }
.durum::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: currentColor; flex: none; }
.durum.iyi { color: var(--iyi); background: var(--iyi-yumusak); }
.durum.orta { color: var(--uyari); background: var(--uyari-yumusak); }
.durum.kotu { color: var(--kritik); background: var(--kritik-yumusak); }
.durum.bekle { color: var(--metin-2); background: var(--yuzey-2); }
.sonuclar { list-style: none; margin: 12px 0 0; padding: 0; display: grid; gap: 6px; }
.sonuclar li { display: grid; grid-template-columns: 1fr auto; gap: 2px 12px; padding: 9px 12px; border: 1px solid var(--cizgi-2); border-radius: var(--r-kucuk); background: var(--yuzey); }
.sonuclar .isim { font-weight: 500; overflow-wrap: anywhere; color: var(--metin); }
.sonuclar .skor { font-family: var(--mono); font-size: 13px; text-align: right; }
.sonuclar .bilgi { grid-column: 1 / -1; font-size: 12px; color: var(--metin-3); overflow-wrap: anywhere; }
.liste-cip { font-family: var(--mono); font-size: 11px; border: 1px solid var(--cizgi); border-radius: 4px; padding: 0 5px; margin-right: 6px; color: var(--metin-2); }
.kaynakca { border-top: 1px solid var(--cizgi); margin-top: 8px; padding-top: 20px; display: grid; gap: 8px; font-size: 13px; color: var(--metin-2); }
.kaynakca ul { margin: 0; padding-left: 18px; display: grid; gap: 4px; }
@media (max-width: 560px) {
  .g-satir, .g-eksen { grid-template-columns: 84px 1fr 64px; }
  .g-satir .pay, .g-eksen .bos-pay { display: none; }
  .ozet-serit { gap: 10px; }
  .ozet-kutu { padding: 12px; }
  .ozet-kutu .deger { font-size: 19px; }
}
@media (prefers-reduced-motion: no-preference) { .puan-cubuk span, .g-satir .cubuk { transition: width 0.25s ease; } }

/* ── tanıtım sayfası ───────────────────────────────────────────────────── */
.site { background: var(--yuzey); }
.site-kap { max-width: 1280px; margin: 0 auto; padding-left: max(24px, env(safe-area-inset-left, 0px)); padding-right: max(24px, env(safe-area-inset-right, 0px)); }
.site-ust { position: sticky; top: 0; z-index: 20; background: color-mix(in srgb, var(--yuzey) 88%, transparent); backdrop-filter: blur(8px); border-bottom: 1px solid var(--cizgi); }
.site-ust .site-kap { display: flex; align-items: center; gap: 24px; padding-top: max(14px, env(safe-area-inset-top, 0px)); padding-bottom: 14px; }
.site-ust nav { display: flex; gap: 24px; margin-left: auto; }
.site-ust nav a { color: var(--metin-2); font-weight: 500; }
.site-ust nav a:hover { color: var(--metin); text-decoration: none; }
@media (max-width: 860px) { .site-ust nav { display: none; } .site-ust .giris-bag { margin-left: auto; } }
.site-ust .marka { white-space: nowrap; }
.site-ust .giris-bag { flex-wrap: nowrap; }
@media (max-width: 560px) { .site-ust .giris-bag .dugme.ana { display: none; } }
.vitrin { background: linear-gradient(180deg, var(--birincil-yumusak), var(--yuzey) 92%); }
.vitrin .site-kap { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr); gap: 56px; align-items: center; padding-top: 72px; padding-bottom: 72px; }
@media (max-width: 1000px) { .vitrin .site-kap { grid-template-columns: minmax(0, 1fr); padding-top: 48px; } }
.hap { display: inline-flex; align-items: center; gap: 8px; padding: 5px 12px; border-radius: 999px; background: var(--yuzey); border: 1px solid var(--cizgi); font-size: 13px; font-weight: 500; color: var(--metin-2); box-shadow: var(--golge-1); }
.hap .ikon { width: 14px; height: 14px; color: var(--iyi); }
.vitrin h1 { font-size: clamp(30px, 1.4rem + 2.6vw, 54px); line-height: 1.08; letter-spacing: -0.035em; margin: 22px 0 18px; max-width: 16ch; }
.vitrin .giris-metni { font-size: 18px; line-height: 1.6; color: var(--metin-2); max-width: 54ch; }
.vitrin .satir-arac { margin: 28px 0 18px; }
.vitrin .kaynak-satir { font-size: 13px; color: var(--metin-3); }
.onizleme { padding: 20px; border-radius: var(--r-buyuk); box-shadow: var(--golge-3); display: grid; gap: 16px; }
.onizleme .ust { display: flex; gap: 10px; align-items: center; }
.onizleme .ust .metin { flex: 1; display: grid; gap: 2px; }
.mini-ozet { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.mini-ozet div { background: var(--yuzey-2); border-radius: 10px; padding: 10px 12px; display: grid; gap: 2px; }
.mini-ozet span { font-size: 11.5px; color: var(--metin-3); font-weight: 500; }
.mini-ozet b { font-size: 16px; font-weight: 600; letter-spacing: -0.02em; }
.mini-govde { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 18px; align-items: start; }
.mini-govde .harita { grid-template-columns: repeat(7, 34px); grid-template-rows: repeat(7, 34px); gap: 4px; padding: 0; }
.mini-govde .karo { font-size: 10px; cursor: default; }
.mini-liste { display: grid; gap: 10px; }
.mini-liste .s { display: grid; gap: 4px; }
.mini-liste .s div { display: flex; justify-content: space-between; font-size: 13px; font-weight: 500; }
.mini-liste .s div span { font-family: var(--mono); font-size: 12px; color: var(--metin-2); }
.mini-liste .iz { height: 6px; border-radius: 3px; background: var(--yuzey-2); overflow: hidden; }
.mini-liste .iz i { display: block; height: 100%; background: var(--veri); border-radius: 3px; }
@media (max-width: 560px) { .mini-govde { grid-template-columns: minmax(0, 1fr); } .mini-govde .harita { justify-content: start; } }
.site-bolum { padding: 80px 0; }
.site main [id] { scroll-margin-top: 72px; }
.site-bolum.gri { background: var(--zemin); }
.bolum-etiket { font-size: 13px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--birincil); }
.site-bolum h2 { font-size: clamp(28px, 1.4rem + 1.4vw, 38px); line-height: 1.15; letter-spacing: -0.03em; margin: 10px 0 40px; max-width: 24ch; }
.ozellik-izgara { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 20px; }
.ozellik { padding: 24px; display: grid; gap: 12px; align-content: start; box-shadow: var(--golge-1); }
.ozellik h3 { font-size: 17px; }
.ozellik p { color: var(--metin-2); line-height: 1.55; }
.adimlar { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 28px; counter-reset: adim; }
.adim-kart { display: grid; gap: 12px; align-content: start; }
.adim-kart .no { width: 36px; height: 36px; border-radius: 50%; background: var(--birincil); color: var(--birincil-ustu); display: grid; place-items: center; font-weight: 600; }
.adim-kart h3 { font-size: 18px; }
.adim-kart p { color: var(--metin-2); font-size: 15px; line-height: 1.55; }
.cagri { background: var(--birincil); color: var(--birincil-ustu); border-radius: 20px; padding: 40px 48px; display: flex; flex-wrap: wrap; gap: 20px; align-items: center; }
.cagri .metin { flex: 1; min-width: 260px; display: grid; gap: 8px; }
.cagri h2 { margin: 0; font-size: 28px; color: inherit; max-width: none; }
.cagri p { font-size: 16px; opacity: 0.9; }
.giris-bolum .site-kap { display: grid; grid-template-columns: minmax(0, 1fr) 440px; gap: 48px; align-items: start; }
@media (max-width: 960px) { .giris-bolum .site-kap { grid-template-columns: minmax(0, 1fr); } }
.giris-bolum ul { margin: 18px 0 0; padding: 0; list-style: none; display: grid; gap: 12px; }
.giris-bolum li { display: flex; gap: 10px; color: var(--metin-2); font-size: 15px; }
.giris-bolum li .ikon { color: var(--iyi); margin-top: 2px; }
.form-kart { padding: 24px; display: grid; gap: 14px; box-shadow: var(--golge-3); }
.form-kart .sekmeler { display: grid; grid-template-columns: 1fr 1fr; background: var(--yuzey-2); border-radius: var(--r-kucuk); padding: 4px; }
.form-kart .sekmeler button { font: inherit; font-weight: 500; background: none; border: 0; padding: 8px; color: var(--metin-2); cursor: pointer; border-radius: 6px; }
.form-kart .sekmeler button[aria-selected="true"] { background: var(--yuzey); color: var(--metin); box-shadow: var(--golge-1); font-weight: 600; }
.sss { display: grid; gap: 10px; max-width: 820px; }
.sss details { background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: var(--r); padding: 0 18px; }
.sss summary { cursor: pointer; padding: 16px 0; font-weight: 600; list-style: none; display: flex; justify-content: space-between; gap: 12px; }
.sss summary::-webkit-details-marker { display: none; }
.sss summary::after { content: "+"; color: var(--metin-3); font-weight: 400; font-size: 18px; line-height: 1; }
.sss details[open] summary::after { content: "−"; }
.sss details p { padding: 0 0 16px; color: var(--metin-2); line-height: 1.6; }
.metin-sayfa { max-width: 828px; padding-top: 40px; padding-bottom: 72px; line-height: 1.65; font-size: 15px; }
.metin-sayfa h1 { font-size: 30px; }
.metin-sayfa h2 { font-size: 20px; }
.mini-govde .karo:hover { outline: none; }
.site-alt { border-top: 1px solid var(--cizgi); background: var(--zemin); padding: 28px 0 40px; font-size: 13px; color: var(--metin-3); }
.site-alt .site-kap { display: flex; flex-wrap: wrap; gap: 12px 24px; justify-content: space-between; }

/* ── yazdırma / PDF ────────────────────────────────────────────────────── */
@media print {
  :root { --zemin: #fff; --yuzey: #fff; }
  body { font-size: 10.5pt; }
  .uygulama { display: block; }
  .kenar, .ust-mobil, .sekme-serit, .yazdirma, details.ayar, .dugme, details.sayilar summary, .bildirim { display: none !important; }
  .yazdir-logo { display: block; width: 150px; height: auto; margin: 0 0 14px; }
  main.icerik { padding: 0; max-width: none; }
  .kart, .panel, .tablo-kap { box-shadow: none; break-inside: avoid; }
  .bolum { break-inside: auto; }
  #pazar-tablo { min-width: 0; }
  a { color: inherit; }
}