/* ==========================================================================
   uyguno — Ana sayfa v3 · 06.10.2026 Sunai
   Patron: "daha estetik, daha az yazı". v2'nin token sistemi korunur; v2 dosyası canlıda
   değişmeden kalır (bu dosya ayrı ad, ayrı sürüm).
   Tokenlar konudan adlandırıldı: raf (zemin), fiş (yüzey), mürekkep (metin),
   etiket-gri (ikincil metin), kazanç (en ucuz = yeşil, sayfa boyunca tek anlam), uyarı (bayat veri).
   İMZA: "raf etiketi" — market rafındaki fiyat etiketi; hero'da raf çıtasına asılı tek etiket.
   ========================================================================== */

/* ---------- Yazı tipi: Inter değişken, TR alt kümesi (self-host) ---------- */
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("/assets/fonts/inter-latin-v2.woff2") format("woff2");
  unicode-range: U+0020-007E, U+00A0-00FF, U+0131, U+2009, U+2013-2014, U+2018-2019, U+201C-201D, U+2022, U+2026, U+202F;
}
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("/assets/fonts/inter-tr-v2.woff2") format("woff2");
  unicode-range: U+011E-011F, U+0130, U+015E-015F, U+20BA;
}

/* ---------- Tokenlar ---------- */
:root {
  --raf: #f3f5f8;          /* sayfa zemini — soğuk raf grisi (krem DEĞİL) */
  --fis: #ffffff;          /* kart/yüzey */
  --murekkep: #0f172a;     /* ana metin — 17,8:1 fiş üstünde */
  --etiket: #475569;       /* ikincil metin — 7,2:1 fiş, 6,7:1 raf üstünde */
  --cizgi: #e2e8f0;        /* ayraç (dekoratif) */
  --cizgi-guclu: #7c8ba1;  /* etkileşimli kenar — 3,46:1 fiş (bileşen eşiği 3:1) */
  --turuncu: #f97316;      /* marka — yalnız dekor (metin DEĞİL: 2,8:1) */
  --turuncu-orta: #ea580c; /* kenar/odak — 3,6:1 */
  --turuncu-koyu: #c2410c; /* düğme zemini + bağlantı metni — 5,2:1 */
  --turuncu-zemin: #fff7ed;
  --kazanc: #15803d;       /* en ucuz — 5,0:1 fiş; 4,8:1 kazanc-zemin */
  --kazanc-zemin: #f0fdf4;
  --uyari: #b45309;        /* bayat veri — 5,0:1 */
  --uyari-zemin: #fffbeb;
  --koyu: #0f172a;         /* footer zemini (imza #00BFFE 8,4:1 bunun üstünde) */
  --gorsel-zemin: #f8fafc;

  --m-bim: #e30613; --m-a101: #0097a7; --m-sok: #ffcb05;
  --m-migros: #f37021; --m-carrefoursa: #0055a5; --m-koop: #00843d;

  --r-s: 10px; --r-m: 14px; --r-l: 20px;
  --golge: 0 1px 2px rgb(15 23 42 / .06), 0 1px 1px rgb(15 23 42 / .04);
  --sure: 180ms;
  --alt-menu-y: 64px;
  --ust-y: 56px;
  --kenar: 16px;           /* kap iç boşluğu — şeritler bununla taşar */
  font-family: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  font-feature-settings: "cv11", "ss01";
  -webkit-text-size-adjust: 100%;
  color-scheme: light;
}

/* ---------- Taban ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-padding-top: calc(var(--ust-y) + 12px); }
body.av3 {
  margin: 0;
  background: var(--raf);
  color: var(--murekkep);
  font-size: 16px;
  line-height: 1.5;
  padding-bottom: calc(var(--alt-menu-y) + env(safe-area-inset-bottom, 0px));
  text-rendering: optimizeLegibility;
  overflow-x: clip;
}
h1, h2, h3, p, ul, ol, figure { margin: 0; }
ul, ol { padding: 0; list-style: none; }
a { color: inherit; }
img { display: block; max-width: 100%; }
button, input { font: inherit; color: inherit; }
button { cursor: pointer; }
[hidden] { display: none !important; }
.ikon { width: 1.25em; height: 1.25em; fill: currentColor; flex: none; }
.ikon-sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
.sr {
  position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
:focus-visible { outline: 3px solid var(--turuncu-orta); outline-offset: 2px; border-radius: 6px; }
.atla {
  position: absolute; left: 12px; top: -60px; z-index: 100; padding: 12px 16px;
  background: var(--murekkep); color: #fff; border-radius: var(--r-s); text-decoration: none;
}
.atla:focus { top: 12px; }

.kap { width: 100%; max-width: 1200px; margin-inline: auto; padding-inline: var(--kenar); }

/* ---------- Fiyat: raf etiketi tipografisi (büyük lira, yükseltilmiş kuruş) ---------- */
.fiyat { font-variant-numeric: tabular-nums; white-space: nowrap; }
.fiyat-g { display: inline-flex; align-items: flex-start; font-weight: 800; letter-spacing: -0.02em; line-height: 1; }
.fiyat-l { font-size: 1.25em; }
.fiyat-k { font-size: .72em; margin-top: .08em; }
.fiyat-tl { font-size: .72em; margin-top: .08em; margin-left: .18em; font-weight: 700; }
.fiyat--orta { font-size: 1.05rem; }
.fiyat--kazanc { color: var(--kazanc); }

/* ---------- Üst bant ---------- */
.ust {
  position: sticky; top: 0; z-index: 40;
  background: rgb(255 255 255 / .92);
  -webkit-backdrop-filter: saturate(1.4) blur(10px);
  backdrop-filter: saturate(1.4) blur(10px);
  border-bottom: 1px solid var(--cizgi);
}
.ust-ic { display: flex; align-items: center; gap: 16px; height: var(--ust-y); }
.ust-nav { display: none; }
.ust-ara { display: none; }
.ust-ic > .uy-hesap { margin-left: auto; }
.ust-menu {
  margin-left: -12px; display: inline-grid; place-items: center; width: 44px; height: 44px; flex: none;
  padding: 0; border: 0; border-radius: var(--r-s); background: transparent; color: var(--murekkep);
}
.ust-menu .ikon { width: 24px; height: 24px; }
.ust-menu:hover, .ust-menu[aria-expanded="true"] { background: #f1f5f9; }

/* ==========================================================================
   1 · HERO — tek başlık + arama; sağda raf çıtasına asılı etiket; altta market şeridi
   ========================================================================== */
.kahraman { background: var(--fis); border-bottom: 1px solid var(--cizgi); }
.kahraman-ic { padding-top: 28px; padding-bottom: 8px; }
.kahraman h1 {
  font-size: clamp(2.125rem, 1.35rem + 3.3vw, 3.75rem);
  line-height: 1.04; letter-spacing: -0.042em; font-weight: 800;
  max-width: 15ch; text-wrap: balance;
}

.arama { margin-top: 24px; position: relative; max-width: 620px; }
.arama-etiket { display: block; font-size: 1rem; font-weight: 600; margin-bottom: 6px; color: var(--etiket); }
.arama-kutu {
  display: flex; align-items: center; height: 60px; padding-left: 16px;
  background: var(--fis); border: 2px solid var(--turuncu-orta); border-radius: 16px;
  box-shadow: 0 10px 28px -14px rgb(234 88 12 / .55);
}
.arama-kutu:focus-within { outline: 3px solid var(--murekkep); outline-offset: 2px; }
.arama-ikon { width: 22px; height: 22px; color: var(--etiket); }
.arama-kutu input {
  flex: 1; min-width: 0; height: 100%; border: 0; outline: 0; background: transparent;
  padding: 0 8px 0 10px; font-size: 1rem;
}
.arama-kutu input::placeholder { color: #64748b; }
.arama-kutu input::-webkit-search-cancel-button { -webkit-appearance: none; }
.arama-barkod {
  display: inline-grid; place-items: center; width: 44px; height: 44px; border: 0;
  background: transparent; border-radius: var(--r-s); color: var(--murekkep);
}
.arama-barkod .ikon { width: 24px; height: 24px; }
.arama-dugme {
  height: 46px; margin: 0 5px 0 2px; padding: 0 20px; border: 0; border-radius: 11px;
  background: var(--turuncu-koyu); color: #fff; font-weight: 700;
  transition: background var(--sure) ease;
}
.arama-dugme:hover { background: #9a3412; }
/* UYG-1100 (18.10.2026 Sunai): "Ara" yazısı yerine kimlik büyüteci — arama ekranı düğmesiyle aynı görünüm (turuncu gradyan, 46 px kare) */
.arama-dugme--ikon {
  display: inline-grid; place-items: center; width: 46px; padding: 0; border-radius: 12px; color: #fff;
  background: linear-gradient(135deg, var(--turuncu, #f97316), var(--turuncu-orta, #ea580c));
}
.arama-dugme--ikon:hover { background: linear-gradient(135deg, var(--turuncu-orta, #ea580c), var(--turuncu-koyu, #c2410c)); }
.arama-dugme--ikon:focus-visible { outline: 3px solid var(--murekkep); outline-offset: 2px; }
.arama-dugme--ikon .uy-buyutec { width: 20px; height: 20px; overflow: visible; }
.arama-kutu:has(.arama-dugme--ikon) { padding-left: 4px; }
/* UYG-1100 (patron: "6 markette X ürün tarıyoruz yazısı küçülsün, daha az yer kaplasın") — yalnız ana sayfa kahramanında */
.kahraman .tk-satir--kahraman { margin-top: 10px; font-size: .875rem; line-height: 1.4; }
.arama-ipucu { min-height: 1.25rem; margin-top: 6px; font-size: 1rem; color: var(--uyari); font-weight: 600; }
.arama-ipucu:empty { min-height: 0; margin: 0; }
.oneriler {
  position: absolute; left: 0; right: 0; top: calc(100% + 4px); z-index: 30;
  background: var(--fis); border: 1px solid var(--cizgi); border-radius: var(--r-m);
  box-shadow: 0 16px 40px -12px rgb(15 23 42 / .25); padding: 6px; max-height: 320px; overflow: auto;
}
.oneriler a {
  display: flex; align-items: center; gap: 10px; min-height: 44px; padding: 8px 10px;
  border-radius: var(--r-s); text-decoration: none;
}
.oneriler a:hover, .oneriler a:focus-visible { background: var(--turuncu-zemin); }
.oneriler .oneri-tur { margin-left: auto; font-size: .75rem; color: var(--etiket); }

.tazelik {
  display: inline-flex; align-items: center; gap: 8px; margin-top: 14px;
  font-size: 1rem; font-weight: 600; color: var(--kazanc);
}
.tazelik .ikon { width: 18px; height: 18px; }
.tazelik--bayat { color: var(--uyari); background: var(--uyari-zemin); padding: 6px 10px; border-radius: var(--r-s); }

/* Sık arananlar: mobilde tek sıra şerit (kap içinde kayar), masaüstünde sarar */
.cipler {
  display: flex; gap: 8px; margin: 14px calc(var(--kenar) * -1) 0; padding: 2px var(--kenar) 4px;
  overflow-x: auto; scrollbar-width: none; overscroll-behavior-x: contain;
}
.cipler::-webkit-scrollbar { display: none; }
.cip {
  flex: none; display: inline-flex; align-items: center; min-height: 44px; padding: 0 16px;
  border: 1px solid var(--cizgi-guclu); border-radius: 999px; background: var(--fis);
  font-size: 1rem; font-weight: 600; text-decoration: none;
  transition: border-color var(--sure) ease, background var(--sure) ease;
}
.cip:hover { border-color: var(--turuncu-orta); background: var(--turuncu-zemin); }

/* Market renk işareti — rengi metin taşımaz, yalnız tanıtır */
.m-bim { --m: var(--m-bim); } .m-a101 { --m: var(--m-a101); } .m-sok { --m: var(--m-sok); }
.m-migros { --m: var(--m-migros); } .m-carrefoursa { --m: var(--m-carrefoursa); } .m-koop { --m: var(--m-koop); }
.m-cok { --m: #475569; }
.mk-isaret {
  display: inline-block; width: 10px; height: 10px; border-radius: 3px; flex: none;
  background: var(--m, #64748b); box-shadow: inset 0 0 0 1px rgb(15 23 42 / .15);
}
.mk-cip { display: inline-flex; align-items: center; gap: 6px; font-weight: 700; }

/* --- Hero manşet kabı (UYG-1176b: raf çıtası + asılı etiket imzası, yani eski tek hero etiketi, kalktı) --- */
.kahraman-etiket {
  position: relative; margin-top: 28px; padding: 22px 6px 6px;
  /* filter: drop-shadow KULLANILMAZ — Chrome LCP metin alanını filtre katmanıyla şişirip LCP'yi H1'den
     etikete taşıyor (06.10 ölçüldü: 67.665 vs H1 40.710 px²). Gölge box-shadow, delik sahte. */
}
/* --- Market şeridi: sade, alt yazısız --- */
.marketler {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 8px;
  margin-top: 24px; padding-top: 8px; border-top: 1px solid var(--cizgi);
}
.market {
  display: flex; align-items: center; gap: 8px; min-height: 48px; padding: 0 4px;
  font-weight: 800; letter-spacing: -0.02em; font-size: 1rem; text-decoration: none; color: var(--murekkep);
  border-radius: var(--r-s);
}
.market .mk-isaret { width: 12px; height: 12px; }
.market:hover { text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 2px; text-decoration-color: var(--m); }

/* ==========================================================================
   Blok iskeleti + şerit
   ========================================================================== */
.blok { padding-block: 36px 0; }
.blok-bas { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.blok h2 {
  font-size: clamp(1.375rem, 1.15rem + 1vw, 1.875rem); line-height: 1.2; letter-spacing: -0.03em; font-weight: 800;
  text-wrap: balance;
}
.tumu {
  display: inline-flex; align-items: center; gap: 2px; min-height: 44px; flex: none;
  color: var(--turuncu-koyu); font-weight: 700; font-size: 1rem; text-decoration: none;
}
.tumu:hover { text-decoration: underline; text-underline-offset: 3px; }
.tumu .ikon { width: 16px; height: 16px; }

/* Şerit: mobil/tablette yatay kayan liste. Kaydırma kabın İÇİNDE; sayfa yatay taşmaz. */
.serit {
  display: grid; grid-auto-flow: column; grid-auto-columns: var(--serit-g, 80%); gap: 12px;
  overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory;
  margin-inline: calc(var(--kenar) * -1); padding: 4px var(--kenar) 14px; scroll-padding-inline: var(--kenar);
  scrollbar-width: none;
}
.serit::-webkit-scrollbar { display: none; }
.serit > * { scroll-snap-align: start; min-width: 0; }

/* ==========================================================================
   3 · İMZA: raf etiketi
   ========================================================================== */
.etiket {
  position: relative; display: flex; flex-direction: column; gap: 12px;
  background: var(--fis); border-radius: var(--r-l); padding: 16px;
  border: 1px solid var(--cizgi); box-shadow: var(--golge);
  transition: border-color var(--sure) ease, transform var(--sure) ease;
}
.etiket:hover { border-color: var(--cizgi-guclu); }
.etiket-ust { display: flex; align-items: center; gap: 12px; }
.kiyas-gorsel {
  position: relative; width: 72px; height: 72px; flex: none; border-radius: 12px; background: var(--gorsel-zemin);
  display: grid; place-items: center; overflow: hidden;
}
.kiyas-gorsel img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; padding: 6px; background: var(--gorsel-zemin); mix-blend-mode: multiply; }
.etiket-ad {
  font-size: 1rem; line-height: 1.3; font-weight: 700;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.etiket-link { text-decoration: none; }
.etiket-link::after { content: ""; position: absolute; inset: 0; border-radius: var(--r-l); z-index: 1; }
.etiket-link:focus-visible { outline: none; }
.etiket-link:focus-visible::after { outline: 3px solid var(--turuncu-orta); outline-offset: 2px; }
.etiket:hover .etiket-link { text-decoration: underline; text-underline-offset: 3px; }

/* Fiyat bandı: yırtma çizgisinin altında, etiketin kalbi */
.etiket-fiyat {
  display: grid; grid-template-columns: 1fr auto; align-items: end; gap: 2px 10px;
  padding-top: 12px; border-top: 2px dashed var(--cizgi);
}
.etiket-en { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; font-size: .875rem; font-weight: 600; color: var(--etiket); }
.etiket-en .mk-cip { color: var(--murekkep); font-size: 1rem; }
.fiyat--etiket { font-size: 1.75rem; }
.fark {
  display: inline-flex; align-items: baseline; padding: 4px 10px; border-radius: 999px;
  background: var(--kazanc-zemin); color: var(--kazanc); font-weight: 800; font-size: 1rem;
  font-variant-numeric: tabular-nums; white-space: nowrap; align-self: center;
}
.fark-k { font-weight: 700; font-size: .875rem; margin-left: 2px; }

.cetvel-svg { width: 100%; height: auto; display: block; overflow: visible; }
.cetvel-iz { stroke: var(--cizgi); stroke-width: 6; stroke-linecap: round; }
.cetvel-dolu {
  stroke: var(--kazanc); stroke-opacity: .28; stroke-width: 6; stroke-linecap: round;
  transform-box: fill-box; transform-origin: left center;
}
.cetvel-n { fill: var(--m, #64748b); stroke: #fff; stroke-width: 2.5; transform-box: fill-box; transform-origin: center; }
.cetvel-n--en { stroke: var(--kazanc); stroke-width: 3; }
.cetvel-adet { font: 700 11px/1 "Inter", sans-serif; fill: var(--murekkep); }

/* Orkestre edilmiş TEK an (js/anasayfa-v2.js): blok görününce iz soldan sağa çizilir, noktalar oturur */
.cetvel-hazir .cetvel-dolu { transform: scaleX(0); }
.cetvel-hazir .cetvel-n { transform: scale(0); }
.cetvel-oynat .cetvel-dolu { transform: scaleX(1); transition: transform 300ms cubic-bezier(.25,1,.5,1); }
.cetvel-oynat .cetvel-n { transform: scale(1); transition: transform 220ms cubic-bezier(.25,1,.5,1); }
.cetvel-oynat .cetvel-n:nth-last-of-type(1) { transition-delay: 60ms; }
.cetvel-oynat .cetvel-n:nth-last-of-type(2) { transition-delay: 120ms; }
.cetvel-oynat .cetvel-n:nth-last-of-type(3) { transition-delay: 180ms; }
.cetvel-oynat .cetvel-n:nth-last-of-type(4) { transition-delay: 240ms; }
.cetvel-oynat .cetvel-n:nth-last-of-type(5) { transition-delay: 300ms; }
.cetvel-oynat .cetvel-n:nth-last-of-type(6) { transition-delay: 360ms; }

/* Diğer marketler: sarmalanan kısa satır — ad asla kırpılmaz */
.etiket-diger { display: flex; flex-wrap: wrap; gap: 6px 16px; font-size: .9375rem; }
.etiket-diger li { display: inline-flex; align-items: center; gap: 6px; color: var(--etiket); white-space: nowrap; }
.etiket-diger-ad { font-weight: 600; }
.etiket-diger .fiyat { color: var(--murekkep); font-size: .9375rem; }
.etiket-kalan { font-weight: 700; color: var(--etiket); }

/* Hero etiketi: büyük; delikli üst; hafif eğik asılı */
.etiket--kahraman {
  border: 1px solid var(--cizgi); padding: 26px 18px 18px; gap: 14px;
  box-shadow: 0 14px 30px -10px rgb(15 23 42 / .18), 0 2px 4px rgb(15 23 42 / .06);
}
.etiket--kahraman::before {          /* etiket deliği: hero zemini renginde, iç gölgeli */
  content: ""; position: absolute; left: 50%; top: 7px; width: 14px; height: 14px; margin-left: -7px;
  border-radius: 50%; background: var(--fis); box-shadow: inset 0 1px 3px rgb(15 23 42 / .35);
}
.etiket--kahraman .kiyas-gorsel { width: 88px; height: 88px; }
.etiket--kahraman .etiket-ad { font-size: 1.125rem; }
.etiket--kahraman .fiyat--etiket { font-size: 2.5rem; }
.etiket--kahraman .etiket-link::after { border-radius: var(--r-l); }

/* Bölüm kartları: şerit genişliği */
.etiketler { --serit-g: 84%; }

/* ---------- 4 · Fiyatı düşenler ---------- */
.sekmeler {
  display: flex; gap: 8px; overflow-x: auto; padding: 2px var(--kenar) 12px; margin-inline: calc(var(--kenar) * -1);
  scrollbar-width: none; scroll-snap-type: x proximity;
}
.sekmeler::-webkit-scrollbar { display: none; }
.sekme {
  flex: none; display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 0 16px;
  border-radius: 999px; border: 1px solid var(--cizgi-guclu); background: var(--fis);
  font-weight: 600; font-size: 1rem; white-space: nowrap; scroll-snap-align: start;
  transition: background var(--sure) ease, color var(--sure) ease, border-color var(--sure) ease;
}
.sekme:hover { border-color: var(--murekkep); }
.sekme[aria-selected="true"] { background: var(--murekkep); color: #fff; border-color: var(--murekkep); }
.sekme[aria-selected="true"] .mk-isaret { box-shadow: 0 0 0 1px #fff; }
.sekme-panel:focus-visible { outline-offset: 6px; }

.kartlar { --serit-g: 46%; }
.kart {
  position: relative; display: flex; flex-direction: column; gap: 6px;
  background: var(--fis); border: 1px solid var(--cizgi); border-radius: var(--r-l); padding: 8px 8px 12px;
  transition: border-color var(--sure) ease;
}
.kart:hover { border-color: var(--cizgi-guclu); }
.kart-gorsel {
  position: relative; aspect-ratio: 1; border-radius: var(--r-m); background: var(--gorsel-zemin);
  display: grid; place-items: center; overflow: hidden; margin-bottom: 4px;
}
.kart-gorsel img {
  position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; padding: 12px;
  background: var(--gorsel-zemin); mix-blend-mode: multiply;
  transition: transform 300ms cubic-bezier(.25,1,.5,1);
}
.kart:hover .kart-gorsel img { transform: scale(1.04); }
.gorsel-yer { width: 36%; height: 36%; color: #cbd5e1; }
/* Görsel geldiyse yer tutucu çekilir: şeffaf PNG'nin arkasından sepet ikonu görünmesin */
.kart-gorsel:has(> img:not([data-src]):not(.gorsel-gizli)) .gorsel-yer,
.kiyas-gorsel:has(> img:not([data-src]):not(.gorsel-gizli)) .gorsel-yer { visibility: hidden; }
.gorsel-gizli { display: none; }
img[data-src] { visibility: hidden; }
.rozet-dusus {
  position: absolute; top: 14px; right: 14px; display: inline-flex; align-items: center;
  padding: 3px 9px; border-radius: 999px; background: var(--kazanc); color: #fff; font-size: .875rem; font-weight: 800;
  font-variant-numeric: tabular-nums;
}
.kart-ad { padding-inline: 4px; font-size: 1rem; line-height: 1.3; font-weight: 600; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; min-height: 2.6em; }
.kart-link { text-decoration: none; }
.kart-link::after { content: ""; position: absolute; inset: 0; border-radius: var(--r-l); }
.kart-link:focus-visible { outline: none; }
.kart-link:focus-visible::after { outline: 3px solid var(--turuncu-orta); outline-offset: 2px; }
.kart-fiyat { padding-inline: 4px; display: flex; align-items: baseline; flex-wrap: wrap; gap: 2px 8px; margin-top: auto; }
.kart-fiyat .fiyat { color: var(--kazanc); font-size: 1.125rem; }
.kart-eski { font-size: .875rem; color: var(--etiket); }
.kart > .mk-cip { padding-inline: 4px; font-size: .875rem; color: var(--etiket); font-weight: 600; }
.sepet-ekle {
  position: absolute; top: 8px; left: 8px; z-index: 2; width: 44px; height: 44px;
  display: inline-grid; place-items: center; border-radius: 12px;
  border: 1px solid var(--cizgi-guclu); background: rgb(255 255 255 / .95); color: var(--murekkep);
  transition: background var(--sure) ease, color var(--sure) ease, border-color var(--sure) ease;
}
.sepet-ekle:hover { background: var(--turuncu-koyu); border-color: var(--turuncu-koyu); color: #fff; }
.sepet-ekle[aria-pressed="true"] { background: var(--kazanc); border-color: var(--kazanc); color: #fff; }
.sepet-ekle .ikon { width: 20px; height: 20px; }
.panel-alt { margin-top: 2px; }

/* ---------- 5+6 · Aktüel + araçlar ---------- */
.ikili { display: grid; gap: 0; }
.blok--ikili .blok-bas { margin-bottom: 12px; }
.aktueller { display: flex; flex-wrap: wrap; gap: 8px; }
.aktuel {
  display: flex; align-items: center; gap: 8px; min-height: 48px; padding: 6px 8px 6px 14px; border-radius: 999px;
  background: var(--fis); border: 1px solid var(--cizgi); text-decoration: none;
  transition: border-color var(--sure) ease;
}
.aktuel:hover { border-color: var(--cizgi-guclu); }
.aktuel-ad { font-weight: 800; letter-spacing: -0.01em; white-space: nowrap; line-height: 1.2; }
.aktuel-sayi {
  flex: none; padding: 3px 10px; border-radius: 999px; background: var(--kazanc-zemin);
  color: var(--kazanc); font-weight: 800; font-variant-numeric: tabular-nums;
}
.aktuel-sayi-k { font-weight: 600; font-size: .875rem; }

.araclar { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.arac {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px;
  min-height: 108px; padding: 14px 8px; text-align: center; border-radius: var(--r-m);
  background: var(--fis); border: 1px solid var(--cizgi); text-decoration: none;
  font-weight: 700; line-height: 1.25; transition: border-color var(--sure) ease;
}
.arac:hover { border-color: var(--turuncu-orta); }
.arac-ikon {
  display: inline-grid; place-items: center; width: 48px; height: 48px; border-radius: 50%; flex: none;
  background: var(--turuncu-zemin); color: var(--turuncu-koyu);
}
.arac-ikon .ikon { width: 24px; height: 24px; }
/* 06.10.2026 Sunai (39a): Fiş tara + Asistan çekildi → tek araç, tam genişlik yatay kart (boş ızgara hücresi kalmasın) */
.araclar--tek { grid-template-columns: minmax(0, 1fr); }
.araclar--tek .arac { flex-direction: row; justify-content: flex-start; gap: 14px; min-height: 76px; padding: 14px 16px; text-align: left; }
.arac-metin { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.arac-alt { font-weight: 500; font-size: .875rem; color: var(--etiket); }

/* ---------- 7 · Raporlar ---------- */
.raporlar { display: grid; gap: 8px; }
.rapor { background: var(--fis); border: 1px solid var(--cizgi); border-radius: var(--r-m); padding: 14px 16px; }
.rapor-ust { display: flex; gap: 10px; font-size: .875rem; color: var(--etiket); }
.rapor-tur { font-weight: 700; color: var(--murekkep); }
.rapor-baslik { margin-top: 4px; font-size: 1.125rem; line-height: 1.3; font-weight: 700; }
.rapor-baslik a { text-decoration: none; }
.rapor-baslik a:hover { text-decoration: underline; text-underline-offset: 3px; }

/* ---------- 8 · SSS: kapalı akordiyon ---------- */
.blok--sss { padding-top: 44px; }
.sss { display: grid; gap: 0; border-top: 1px solid var(--cizgi); }
.sss-oge { border-bottom: 1px solid var(--cizgi); }
.sss-oge summary {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  min-height: 56px; padding: 12px 2px; font-weight: 700; cursor: pointer; list-style: none;
}
.sss-oge summary::-webkit-details-marker { display: none; }
.sss-oge summary:hover { color: var(--turuncu-koyu); }
.sss-ok { width: 18px; height: 18px; color: var(--etiket); transition: transform var(--sure) ease; }
details[open] > summary .sss-ok { transform: rotate(180deg); }
.sss-oge > p { padding: 0 2px 16px; color: var(--etiket); max-width: 62ch; }
.seo summary { font-weight: 600; color: var(--etiket); }
.seo-ic { padding: 0 2px 16px; display: grid; gap: 10px; color: var(--etiket); font-size: 1rem; }
.seo-ic h2 { font-size: 1.125rem; color: var(--murekkep); letter-spacing: -0.01em; }
.seo-marketler { display: flex; flex-wrap: wrap; gap: 0 14px; }
.seo-marketler a { color: var(--turuncu-koyu); font-weight: 600; min-height: 44px; display: inline-flex; align-items: center; }

/* ---------- Footer ---------- */
.alt { margin-top: 56px; background: var(--koyu); color: #cbd5e1; }
.alt-ic { padding-top: 36px; padding-bottom: 20px; }
.alt-kolonlar { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.alt-kolonlar > div:last-child { grid-column: 1 / -1; }
.alt-baslik { font-size: .875rem; font-weight: 700; color: #f1f5f9; margin-bottom: 8px; letter-spacing: .02em; }
.alt ul { display: grid; gap: 0; }
.alt ul a { display: inline-flex; align-items: center; min-height: 44px; color: #cbd5e1; text-decoration: none; font-size: 1rem; }
.alt ul a:hover { color: #fff; text-decoration: underline; text-underline-offset: 3px; }
.alt-son {
  margin-top: 24px; padding-top: 16px; border-top: 1px solid #1e293b;
  display: flex; align-items: center; justify-content: space-between; gap: 12px; font-size: .875rem; color: #94a3b8;
}
.imza { display: inline-grid; place-items: center; width: 44px; height: 44px; flex: none; opacity: .85; transition: opacity var(--sure) ease; border-radius: 10px; }
.imza:hover { opacity: 1; }

.rozet-sayi {
  position: absolute; top: -6px; right: -10px; min-width: 18px; height: 18px; padding: 0 5px;
  border-radius: 999px; background: var(--turuncu-koyu); color: #fff;
  font-size: .6875rem; font-weight: 800; line-height: 18px; text-align: center;
  box-shadow: 0 0 0 2px #fff; font-variant-numeric: tabular-nums;
}

/* Çerez bandı ortak dosyada (css/cerez-bandi.css); burada yalnız alt menü boşluğu */
body.av3 { --uyc-alt: 72px; }

/* ==========================================================================
   ≥ 640px
   ========================================================================== */
@media (min-width: 640px) {
  :root { --kenar: 24px; }
  .marketler { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 0 16px; }
  .etiketler { --serit-g: 46%; }
  .kartlar { --serit-g: 30%; }
  .alt-kolonlar { grid-template-columns: repeat(3, 1fr); }
  .alt-kolonlar > div:last-child { grid-column: auto; }
  .kahraman-etiket { max-width: 460px; }
}

/* ==========================================================================
   ≥ 1024px — masaüstü: alt menü gizli, üst menü açık, şeritler ızgaraya döner
   ========================================================================== */
@media (min-width: 1024px) {
  body.av3 { padding-bottom: 0; --uyc-alt: 16px; }
  .alt-ic { padding-bottom: 100px; }
  .ust-nav { display: flex; align-items: center; gap: 2px; margin-left: auto; }
  .ust-nav a {
    display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 0 10px; border-radius: var(--r-s);
    text-decoration: none; font-size: 1rem; font-weight: 600; color: var(--etiket); position: relative;
  }
  .ust-nav a:hover { color: var(--murekkep); background: #f1f5f9; }
  .ust-nav .ikon { width: 20px; height: 20px; }
  .ust-sepet .rozet-sayi { position: static; margin-left: 2px; box-shadow: none; }
  .ust--ara .ust-ara {
    display: flex; align-items: center; flex: 1; max-width: 360px; height: 40px;
    border: 1px solid var(--cizgi-guclu); border-radius: var(--r-s); background: var(--fis); overflow: hidden;
  }
  .ust-ara input { flex: 1; min-width: 0; height: 100%; border: 0; outline: 0; padding: 0 12px; font-size: 1rem; background: transparent; }
  .ust-ara button { width: 44px; height: 100%; border: 0; background: var(--turuncu-koyu); color: #fff; display: grid; place-items: center; }
  .ust-ara:focus-within { outline: 3px solid var(--murekkep); outline-offset: 2px; }

  .kahraman-ic {
    display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); column-gap: 72px;
    align-items: center; padding-top: 64px; padding-bottom: 8px;
  }
  .kahraman-sol { grid-column: 1; }
  .cipler { flex-wrap: wrap; overflow: visible; margin-inline: 0; padding-inline: 0; }
  .kahraman-etiket { grid-column: 2; grid-row: 1; margin-top: 0; max-width: 440px; justify-self: end; width: 100%; }
  .kahraman-etiket .etiket--kahraman { transform: rotate(-1.6deg); transform-origin: 50% 0; }
  .kahraman-ic--tek { grid-template-columns: minmax(0, 1fr); }   /* UYG-1176b: manşet yok → sağ sütun açılmaz, sol sütun tam genişlik */
  .kahraman-ic--tek .kahraman-sol { max-width: 760px; }
  .marketler { grid-column: 1 / -1; margin-top: 56px; padding-block: 12px; display: flex; justify-content: space-between; }
  .market { font-size: 1.25rem; padding: 0 6px; }

  /* Şeritler → ızgara */
  .serit { grid-auto-flow: row; overflow: visible; margin-inline: 0; padding: 0; scroll-snap-type: none; }
  .etiketler { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
  .etiketler > :nth-child(n+4) { display: none; }
  .kartlar { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
  .sekmeler { flex-wrap: wrap; overflow: visible; margin-inline: 0; padding-inline: 0; }

  .blok { padding-block: 64px 0; }
  .ikili { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); column-gap: 48px; }
  .sss-izgara { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.6fr); column-gap: 64px; align-items: start; }
  .blok--sss { padding-top: 72px; }
  .raporlar { grid-template-columns: repeat(3, 1fr); }
}

/* ---------- Hareket azaltma ---------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition-duration: 0ms !important; animation-duration: 0ms !important; scroll-behavior: auto !important; }
  .cetvel-hazir .cetvel-dolu, .cetvel-hazir .cetvel-n { transform: none !important; }
  .kart:hover .kart-gorsel img { transform: none; }
}

/* ==========================================================================
   4b · Fiyatı düşenler: KAYAN ŞERİT (06.10.2026 akşam, patron: "kaydırmalı şerit + Tümünü gör")
   Mobilde parmakla, masaüstünde ok düğmeleri + klavye (kartlar arası Tab, kaydırma kabı odaklanabilir).
   Kütüphane yok: scroll-snap + overflow-x. Bu blok dosyanın SONUNDA: ≥1024'teki ".serit → ızgara" kuralını ezer.
   ========================================================================== */
.blok-bas-sag { display: flex; align-items: center; gap: 8px; flex: none; }
.serit-oklar { display: none; gap: 8px; }
.serit-ok {
  display: inline-grid; place-items: center; width: 44px; height: 44px; padding: 0;
  border-radius: 50%; border: 1px solid var(--cizgi-guclu); background: var(--fis); color: var(--murekkep);
  transition: background var(--sure) ease, color var(--sure) ease, border-color var(--sure) ease, opacity var(--sure) ease;
}
.serit-ok .ikon { width: 20px; height: 20px; }
.serit-ok--geri .ikon { transform: scaleX(-1); }
.serit-ok:hover:not([aria-disabled="true"]) { background: var(--murekkep); border-color: var(--murekkep); color: #fff; }
.serit-ok[aria-disabled="true"] { opacity: .4; cursor: default; }
/* Oklar yalnız fare/iz dörtgeni olan cihazda; JS hazır olana dek yer ayrılır ama görünmez (CLS 0) */
@media (hover: hover) and (pointer: fine) {
  .serit-oklar { display: flex; visibility: hidden; }
  .serit-oklar.hazir { visibility: visible; }
}

/* Son kart: "Tümünü gör" — kart boyutunda, raf etiketi diliyle (turuncu çıta + delik) */
.kart--son { padding: 0; border: 0; background: transparent; }
.kart-son {
  position: relative; flex: 1; display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-end;
  gap: 4px; min-height: 100%; padding: 20px 16px 18px; border-radius: var(--r-l);
  background: var(--turuncu-zemin); border: 1px solid #fed7aa; border-top: 6px solid var(--turuncu-orta);
  color: var(--murekkep); text-decoration: none;
  transition: border-color var(--sure) ease, background var(--sure) ease;
}
.kart-son::before {                    /* etiket deliği */
  content: ""; position: absolute; top: 14px; left: 50%; width: 14px; height: 14px; margin-left: -7px;
  border-radius: 50%; background: var(--raf); box-shadow: inset 0 1px 2px rgb(15 23 42 / .25);
}
.kart-son-ok {
  display: inline-grid; place-items: center; width: 48px; height: 48px; margin-bottom: auto; margin-top: 28px;
  border-radius: 50%; background: var(--turuncu-koyu); color: #fff;
  transition: transform var(--sure) cubic-bezier(.25,1,.5,1);
}
.kart-son-ok .ikon { width: 24px; height: 24px; }
.kart-son-baslik { font-size: 1.25rem; font-weight: 800; letter-spacing: -0.02em; line-height: 1.2; color: var(--turuncu-koyu); }
.kart-son-sayi { font-size: .875rem; font-weight: 600; color: var(--etiket); font-variant-numeric: tabular-nums; }
.kart-son:hover { border-color: var(--turuncu-orta); }
.kart-son:hover .kart-son-ok { transform: translateX(4px); }

/* Odak halkası (3px + 2px boşluk) kaydırma kabının kenarında kesilmesin: üstte 6px */
.serit--kayar { padding-top: 6px; }

@media (min-width: 1024px) {
  /* Şerit masaüstünde de kayar: 5 kart görünür, kaydırma kabın içinde. Odak halkası kesilmesin diye 6px iç boşluk. */
  .kartlar.serit--kayar {
    grid-auto-flow: column; grid-template-columns: none;
    grid-auto-columns: calc((100% - 4 * 16px - 12px) / 5); gap: 16px;
    overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory;
    margin-inline: -6px; padding: 6px 6px 14px; scroll-padding-inline: 6px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .kart-son:hover .kart-son-ok { transform: none; }
}

/* ==========================================================================
   77 · DİNAMİK ÜST BANT (07.10.2026 Sunai) — patron: "daha dinamik olsun header"
   Düzen kutusu (.ust) HİÇ değişmez → CLS 0. Görünen bant ::before katmanıdır; küçülürken yalnız
   transform ile yukarı çekilir, içerik yarısı kadar kayar, logo %86'ya iner. Kutunun altta açılan
   şeridi tıklamayı yutmasın diye .ust pointer-events:none, yalnız gerçek denetimler auto.
   Sınıflar js/anasayfa-v3.js'ten: .ust--canli (JS var) · .ust--kaydi (y>4) · .ust--kucuk (aşağı yön, y>64).
   JS yoksa: tam boy, alt çizgi görünür, statik — bugünkü davranış.
   ========================================================================== */
:root { --ust-y: 60px; --ust-kucuk: 50px; --ust-gecis: 220ms cubic-bezier(.2, .8, .2, 1); }
.ust {
  background: none; border-bottom: 0; -webkit-backdrop-filter: none; backdrop-filter: none;
  pointer-events: none;
}
.ust::before {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: rgb(255 255 255 / .92);
  -webkit-backdrop-filter: saturate(1.4) blur(10px); backdrop-filter: saturate(1.4) blur(10px);
  border-bottom: 1px solid var(--cizgi);
  transition: transform var(--ust-gecis), box-shadow var(--ust-gecis), border-color var(--ust-gecis);
}
.ust-ic { pointer-events: none; transition: transform var(--ust-gecis); }
.ust-ic > * { pointer-events: auto; }
.ust .uy-logo > svg { transform-origin: 0 50%; transition: transform var(--ust-gecis); }

/* JS var + sayfa başı: bant hero ile tek yüzey (çizgi yok, tam beyaz — arkadaki gövde zemini #f3f5f8 sızmasın) */
.ust--canli:not(.ust--kaydi)::before { border-bottom-color: transparent; background-color: var(--fis); }
/* Kaydırıldı: ayrılır — çizgi + yumuşak gölge + daha derin buzlu cam */
.ust--kaydi::before {
  background-color: rgb(255 255 255 / .9);
  box-shadow: 0 8px 24px -14px rgb(15 23 42 / .30);
  -webkit-backdrop-filter: saturate(1.6) blur(16px); backdrop-filter: saturate(1.6) blur(16px);
}
/* Küçük: bant (--ust-y − --ust-kucuk) kadar yukarı, içerik yarısı kadar; dokunma hedefleri 44×44 kalır */
.ust--kucuk::before { transform: translate3d(0, calc(var(--ust-kucuk) - var(--ust-y)), 0); }
.ust--kucuk .ust-ic { transform: translate3d(0, calc((var(--ust-kucuk) - var(--ust-y)) / 2), 0); }
.ust--kucuk .uy-logo > svg { transform: scale(.86); }

/* CANLI HATA DÜZELTMESİ (07.10 ölçüldü): html{scroll-padding-top} yapışkan bantaki öğeyi de "bandın altında kalmış"
   sayıyordu → kaydırılmış sayfada üst aramaya TIKLAYINCA sayfa 1000→544, TAB ile 1000→88 zıplıyor, hero araması
   görünür olunca üst arama kaybolup odak düşüyordu. Pay artık yalnız içerik öğelerinde (scroll-margin): çapalar ve
   klavye odağı yine bandın altında kalmaz (WCAG 2.4.11), bandın kendisi kaydırma tetiklemez. */
html { scroll-padding-top: 0; }
main *, .alt * { scroll-margin-top: calc(var(--ust-y) + 12px); }

@media (min-width: 1024px) {
  :root { --ust-y: 68px; --ust-kucuk: 56px; }
  /* Sağ küme sabit: boşluğu yalnız nav'ın auto'su alır. Önceden hesap ikonunun auto'su ile paylaşılıyordu →
     üst arama belirince nav ~190 px kayıyordu (canlı CLS 0,002, ölçüldü). */
  .ust-ic > .uy-hesap { margin-left: 0; }
  /* Üst bant araması: hero araması görünmez olunca belirir (mevcut .ust--ara), odakta genişler.
     Genişlik ANİMASYONSUZ değişir (width/height animasyonu yasak); belirme opacity+transform ile. */
  .ust--ara .ust-ara {
    max-width: 340px; border-radius: 999px; padding-left: 6px;
    transition: opacity var(--ust-gecis), transform var(--ust-gecis), box-shadow var(--ust-gecis), border-color var(--ust-gecis);
  }
  @starting-style { .ust--ara .ust-ara { opacity: 0; transform: translate3d(0, -4px, 0); } }
  .ust--ara .ust-ara:focus-within { max-width: 520px; border-color: var(--turuncu-orta); box-shadow: 0 6px 20px -10px rgb(234 88 12 / .45); }
}
@media (prefers-reduced-motion: reduce) {
  .ust::before, .ust-ic, .ust .uy-logo > svg, .ust-ara { transition: none !important; }
  .ust--kucuk::before, .ust--kucuk .ust-ic, .ust--kucuk .uy-logo > svg { transform: none; }
}

/* ==========================================================================
   77 · TİPOGRAFİ — VARYANT A "Zarif/sakin" (07.10.2026 Sunai)
   Patron: "fontlar çok büyük ve çok kaba … daha zarif olsun". Ölçülen kaynak: metnin %33'ü 700+ ağırlık,
   H1 60px/800/1,04, H2 30px/800, tüm fiyatlar 800. Aile aynı (Inter değişken 100–900, yeni dosya YOK).
   Ölçek: 1,2 modüler (16 · 19,2 · 23 · 27,6 · 33,2 · 39,8 · 47,8). Kademe: başlık 600 · fiyat 650 · arayüz 500 · gövde 400.
   Bu blok dosyanın SONUNDA; önceki kuralları aynı seçicilerle ezer (özgüllük eşit, sıra kazanır).
   ========================================================================== */
body.av3 { line-height: 1.55; }

/* Başlıklar: ağırlık 800→600, satır 1,04→1,12, izleme biraz açıldı (ince ağırlık daha az sıkı izleme ister) */
.kahraman h1 { font-size: clamp(1.75rem, 1.2rem + 2.4vw, 2.875rem); font-weight: 600; line-height: 1.12; letter-spacing: -0.03em; max-width: 16ch; }
.blok h2 { font-size: clamp(1.25rem, 1.1rem + .6vw, 1.625rem); font-weight: 600; line-height: 1.25; letter-spacing: -0.022em; }
.seo-ic h2 { font-size: 1.125rem; font-weight: 600; letter-spacing: -0.01em; }   /* .blok h2 ezmesin (özgüllük eşit) */

/* Ürün adları */
.kart-ad { font-weight: 500; line-height: 1.375; min-height: 2.75em; }
.etiket-ad { font-weight: 600; line-height: 1.35; }

/* Fiyat: raf etiketi yapısı (büyük lira, yükseltilmiş kuruş) korunur; 800→650, rakam tablo genişliğinde */
.fiyat-g { font-weight: 650; letter-spacing: -0.025em; }
.fiyat-tl { font-weight: 550; }
.fiyat--etiket { font-size: 1.625rem; }
.etiket--kahraman .fiyat--etiket { font-size: 2.25rem; }
.etiket-diger .fiyat-g { font-weight: 600; }

/* Rozetler ve sayılar */
.rozet-dusus, .fark, .aktuel-sayi { font-weight: 700; }
.fark-k, .aktuel-sayi-k { font-weight: 500; }
.aktuel-sayi, .kart-son-sayi, .kart-eski, .tazelik time, .rapor-ust time { font-variant-numeric: tabular-nums; }

/* Arayüz metni: 600/700/800 → 500/600 */
.arama-etiket, .tazelik, .cip, .sekme, .kart > .mk-cip, .etiket-en { font-weight: 500; }
.mk-cip, .etiket-en .mk-cip, .etiket-diger-ad, .etiket-kalan { font-weight: 600; }
.arama-dugme, .tumu, .sss-oge summary, .arac, .rapor-tur, .alt-baslik { font-weight: 600; }
.seo summary, .arac-alt { font-weight: 500; }
.rapor-baslik { font-weight: 600; }
.market { font-weight: 600; letter-spacing: -0.01em; }
.aktuel-ad { font-weight: 600; letter-spacing: 0; }
.kart-son-baslik { font-weight: 650; font-size: 1.125rem; letter-spacing: -0.015em; }

/* Gövde: daha ferah satır aralığı */
.sss-oge > p, .seo-ic { line-height: 1.65; }

@media (min-width: 1024px) {
  .kahraman h1 { max-width: 21ch; }   /* 46px'te 16ch üç satıra bölüp "en"i asılı bırakıyordu */
  .ust-nav a { font-size: .9375rem; font-weight: 500; letter-spacing: -0.005em; }
  .market { font-size: 1.125rem; }
}

/* ---------- VARYANT B "Zarif/canlı": A'nın tabanı + daha geniş hiyerarşi aralığı ----------
   Fark yalnız uçlarda: başlıklar bir kademe büyük/sıkı (650), fiyatlar güçlü (750, hero 40px korunur),
   üst bilgi (market adı, eski fiyat, tazelik) bir kademe sakin. Ortadaki arayüz metni A ile aynı. */
.kahraman h1 { font-size: clamp(1.875rem, 1.2rem + 2.9vw, 3.25rem); font-weight: 650; line-height: 1.08; letter-spacing: -0.036em; max-width: 15ch; }
.blok h2 { font-size: clamp(1.375rem, 1.15rem + .8vw, 1.875rem); font-weight: 650; line-height: 1.2; letter-spacing: -0.028em; }
.seo-ic h2 { font-size: 1.125rem; font-weight: 600; letter-spacing: -0.01em; }

.fiyat-g { font-weight: 750; letter-spacing: -0.03em; }
.fiyat-tl { font-weight: 600; }
.fiyat--etiket { font-size: 1.75rem; }
.etiket--kahraman .fiyat--etiket { font-size: 2.5rem; }
.kart-fiyat .fiyat { font-size: 1.1875rem; }
.etiket-diger .fiyat-g { font-weight: 650; }
.rozet-dusus, .fark { font-weight: 750; }

.kart > .mk-cip, .kart-eski, .etiket-en { font-weight: 450; }
.tazelik { font-size: .9375rem; font-weight: 500; }
.market { font-weight: 650; letter-spacing: -0.015em; }
.kart-son-baslik { font-weight: 700; font-size: 1.1875rem; letter-spacing: -0.02em; }

@media (min-width: 1024px) {
  .kahraman h1 { max-width: 19ch; }
  .market { font-size: 1.1875rem; }
}

/* ---------- 78 · Market başına güncelleme (Zekai 07.10.2026 · includes/market_tazelik.php) ----------
   Ayrı blok: birleştirmede OLDUĞU GİBİ taşınır. Sınıf öneki .mt — başka kural bu öneki kullanmaz.
   Renkler mevcut tokenlardan (--etiket 7,2:1 · --murekkep · --uyari 5,0:1 / --uyari-zemin); yeni token YOK.
   Tipografi 79-B ölçeğinde: meta 15px/450, market adı tazelik satırıyla aynı 500; Sunai bloklarından SONRA gelir. */
.mt { margin-top: 6px; }
.mt-satir { margin: 0; font-size: .9375rem; font-weight: 450; line-height: 1.5; color: var(--etiket); }
.mt-oge { white-space: nowrap; font-variant-numeric: tabular-nums; }
.mt-ad { font-weight: 500; color: var(--murekkep); }
.mt-oge--bayat, .mt-oge--bayat .mt-ad { color: var(--uyari); }
.mt-uyari {
  display: flex; align-items: flex-start; gap: 6px; margin: 6px 0 0; padding: 6px 10px;
  border-radius: var(--r-s); background: var(--uyari-zemin); color: var(--uyari);
  font-size: .9375rem; font-weight: 500; line-height: 1.4;
}
.mt-uyari .ikon { flex: none; width: 16px; height: 16px; margin-top: 2px; }

/* ==========================================================================
   80 · TASARIM DALGASI D1 (07.10.2026 Sunai) — patron: "rakipleri taradın, tasarımda hiçbir şey değişmeyecek mi?"
   Ana fikir: hero'daki raf etiketinin DİLİ (yırtma çizgisi, yükseltilmiş kuruş, market noktası, yeşil = yalnız en ucuz)
   sayfanın geri kalanına sessizce yayılır; imza yine tek: asılı etiket. Yeni renk/yazı tipi YOK (tokenlar yukarıda).
   Bu blok dosyanın SONUNDA; Zekai'nin "78 ·" (.mt) bloğundan sonra gelir, onu yalnız bir yerde gizler.
   ========================================================================== */

/* ---------- Hero: market şeridi = güncelleme tabelası (78'in saat satırı şeride taşındı) ----------
   Önce: "BİM 06:12 · A101 06:18 · … · Koop 08:07" tek satır; 1280'de "Koop 08:07" alt satıra yetim düşüyordu.
   Şimdi: her market kendi hücresinde ad + saat. Mobil 3×2, ≥640 6 eşit sütun → yetim yok, satır kırılmaz.
   (Instacart'ın mağaza şeridinde "By 4:30am" deseni; bizde anlamı teslimat değil VERİNİN YAŞI.) */
/* <1024: şerit hero etiketinin ALTINDA kalıyor (ilk ekranda değil) → saatler aramanın yanındaki .mt-satir'de kalır,
   şeritte saat gizli. ≥1024: şerit ilk ekranda → saat şeritte, .mt-satir gizli. Her genişlikte bilgi TEK yerde okunur. */
.marketler--saatli .market-saat { display: none; }
.marketler--saatli { gap: 4px 8px; padding-block: 10px 6px; }
.marketler--saatli .market {
  display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; column-gap: 8px; row-gap: 0;
  min-height: 52px; padding: 4px 6px; line-height: 1.25;
}
.marketler--saatli .market-ad { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.market-saat {
  grid-column: 2; display: inline-flex; align-items: center; gap: 4px;
  font-size: .8125rem; font-weight: 450; letter-spacing: 0; color: var(--etiket); font-variant-numeric: tabular-nums;
}
.market-saat .ikon { width: 13px; height: 13px; }
.market-saat--bayat { color: var(--uyari); font-weight: 600; }
.marketler--saatli .market:hover { text-decoration: none; }
.marketler--saatli .market:hover .market-ad { text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 2px; text-decoration-color: var(--m); }
@media (min-width: 640px) {
  .marketler--saatli { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); justify-content: stretch; }
}
@media (min-width: 1024px) {
  .kahraman-ic:has(.marketler--saatli) .mt-satir { display: none; }   /* .mt-uyari (bayat market) her genişlikte kalır */
  .kahraman-ic:has(.marketler--saatli) .mt { margin-top: 0; }
  .marketler--saatli .market-saat { display: inline-flex; }
  .marketler--saatli { margin-top: 48px; padding-block: 14px 10px; gap: 0 12px; }
  .marketler--saatli .market { font-size: 1.125rem; min-height: 56px; }
  .market-saat { font-size: .875rem; }
}

/* ---------- Fiyatı düşen kartı: raf etiketi dili (yırtma çizgisi fiyatın üstünde) ----------
   Önce: ad → fiyat → eski fiyat → market, aynı yüzeyde akıyordu; fiyat bloğu görselden sonra kayboluyordu.
   Şimdi: kesikli çizgi fiyat bandını ayırır (hero etiketiyle aynı 2px dashed), market adı bandın içinde. */
.kart-fiyat { margin-top: auto; padding-top: 8px; border-top: 2px dashed var(--cizgi); }
.kart-ad { margin-bottom: 6px; }
.kart > .mk-cip { margin-top: -2px; }

/* ---------- Aktüel: eşit kutucuk ızgarası (önce: sarmalanan haplar, mobilde 1-2-1 düzensiz sıra) ---------- */
.aktueller { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.aktuel {
  display: grid; grid-template-columns: auto minmax(0, 1fr); grid-template-rows: auto auto; column-gap: 8px;
  align-items: center; min-height: 64px; padding: 10px 14px; border-radius: var(--r-m);
}
.aktuel .mk-isaret { grid-row: 1; }
.aktuel-ad { grid-column: 2; overflow: hidden; text-overflow: ellipsis; }
.aktuel-sayi {
  grid-column: 2; justify-self: start; padding: 0; background: none; border-radius: 0;
  font-size: .9375rem; font-weight: 650; line-height: 1.3;
}
.aktuel-sayi-k { font-weight: 450; color: var(--etiket); }
@media (min-width: 640px) { .aktueller { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
/* Sepet bloğu varken araç kartı sepet başlığına ("Kendi listeni yap") taşınır; aktüel tam genişlik, tek sıra */
.ikili--tek { grid-template-columns: minmax(0, 1fr) !important; }
@media (min-width: 1024px) { .ikili--tek .aktueller { grid-template-columns: repeat(6, minmax(0, 1fr)); } }

/* ---------- SSS: sol sütun boş kalmasın — tek cümle + tarafsızlık bağlantısı ---------- */
.blok-bas--sss { flex-direction: column; align-items: flex-start; gap: 6px; }
.sss-giris { color: var(--etiket); max-width: 36ch; line-height: 1.55; }
.sss-giris a { color: var(--turuncu-koyu); font-weight: 600; text-underline-offset: 3px; display: flex; align-items: center; width: fit-content; min-height: 44px; }

/* ==========================================================================
   80 · HAZIR SEPETLER — "kasa fişi" (Recai A3; veri Zekai'den gelecek, sözleşme includes/anasayfa-v3-ek.php)
   Raf etiketi TEK ürünü anlatır; sepet bir ALIŞVERİŞİ anlatır → nesnesi kasa fişi. Fiş kâğıdı beyaz, alt kenarı
   yırtık (CSS mask, görsel dosya yok), marketler ucuzdan pahalıya (gerçek sıralama → <ol>), nokta dolgulu satır.
   Yeşil yine yalnız en ucuz satır. Eksik ürünü olan market sıralamaya girmez, "2 ürün yok" yazar (dürüstlük kuralı).
   ========================================================================== */
.blok--sepet .sepetler { --serit-g: 86%; padding-bottom: 22px; }
.sepet {
  position: relative; display: flex; flex-direction: column; gap: 12px;
  background: var(--fis); padding: 18px 18px 30px; border-radius: var(--r-l) var(--r-l) 0 0;
  border: 1px solid var(--cizgi); border-bottom: 0;
  /* Yırtık alt kenar: 12px'lik dişler. mask yalnız bu kutuyu keser; gölge drop-shadow DEĞİL (LCP katman notu, yukarıda). */
  -webkit-mask: radial-gradient(circle 7px at 50% 100%, #0000 98%, #000) 50% 100% / 14px 100% repeat-x,
                linear-gradient(#000 0 0) top / 100% calc(100% - 7px) no-repeat;
          mask: radial-gradient(circle 7px at 50% 100%, #0000 98%, #000) 50% 100% / 14px 100% repeat-x,
                linear-gradient(#000 0 0) top / 100% calc(100% - 7px) no-repeat;
}
.sepet-bas { display: flex; align-items: center; gap: 12px; padding-bottom: 12px; border-bottom: 2px dashed var(--cizgi); }
.sepet-ikon {
  display: inline-grid; place-items: center; width: 44px; height: 44px; flex: none; border-radius: 50%;
  background: var(--turuncu-zemin); color: var(--turuncu-koyu);
}
.sepet-ikon .ikon { width: 22px; height: 22px; }
.sepet-ad { font-size: 1.125rem; font-weight: 650; letter-spacing: -0.015em; line-height: 1.25; }
.sepet-alt { font-size: .875rem; font-weight: 450; color: var(--etiket); }
.sepet-satirlar { display: grid; gap: 2px; counter-reset: sepet; }
.sepet-satir {
  display: flex; align-items: baseline; gap: 8px; min-height: 36px; padding: 6px 8px; border-radius: var(--r-s);
  font-size: 1rem; font-variant-numeric: tabular-nums;
}
.sepet-satir .mk-isaret { align-self: center; }
.sepet-market { font-weight: 500; white-space: nowrap; }
.sepet-nokta { flex: 1; min-width: 12px; border-bottom: 2px dotted #cbd5e1; transform: translateY(-4px); }
.sepet-satir .fiyat { font-size: 1.0625rem; }
.sepet-satir:not(.sepet-satir--en) .fiyat-g { font-weight: 600; }
.sepet-satir--en { background: var(--kazanc-zemin); }
.sepet-satir--en .sepet-market { font-weight: 650; }
.sepet-satir--en .fiyat { font-size: 1.25rem; }
@media (min-width: 1024px) { .sepet-satir--en .fiyat { font-size: 1.375rem; } }
.sepet-en {
  align-self: center; padding: 2px 8px; border-radius: 999px; background: var(--kazanc); color: #fff;
  font-size: .75rem; font-weight: 650; letter-spacing: .01em; white-space: nowrap;
}
.sepet-satir--eksik { color: var(--etiket); }
.sepet-satir--eksik .mk-isaret { opacity: .55; }
.sepet-yok { font-size: .875rem; font-weight: 450; white-space: nowrap; }
.sepet-fark { font-size: .9375rem; color: var(--etiket); padding-top: 10px; border-top: 2px dashed var(--cizgi); }
.sepet-fark strong { color: var(--kazanc); font-weight: 700; font-variant-numeric: tabular-nums; }
.sepet-urunler summary {
  display: flex; align-items: center; justify-content: space-between; min-height: 44px; cursor: pointer; list-style: none;
  font-weight: 600; color: var(--murekkep);
}
.sepet-urunler summary::-webkit-details-marker { display: none; }
.sepet-urunler[open] summary .sss-ok { transform: rotate(180deg); }
.sepet-urunler ul { display: grid; gap: 0; padding-bottom: 4px; }
.sepet-urunler li a, .sepet-urunler li { font-size: .9375rem; color: var(--etiket); }
.sepet-urunler li a { display: flex; align-items: center; min-height: 44px; text-decoration: none; }
.sepet-urunler li a:hover { color: var(--murekkep); text-decoration: underline; text-underline-offset: 3px; }
.sepet-zaman { display: inline-flex; align-items: center; gap: 6px; margin-top: auto; font-size: .8125rem; color: var(--etiket); font-variant-numeric: tabular-nums; }
.sepet-zaman .ikon { width: 14px; height: 14px; }
@media (min-width: 640px) { .blok--sepet .sepetler { --serit-g: 46%; } }
@media (min-width: 1024px) {
  .blok--sepet .sepetler { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; padding-bottom: 0; }
  .blok--sepet .sepetler > :nth-child(n+4) { display: none; }
}
@media (prefers-reduced-motion: reduce) { .sepet-urunler summary .sss-ok { transition: none; } }

/* ==========================================================================
   d1 · Fiyatı düşenler: 48 KART, masaüstünde İKİ SIRALI kayan şerit (07.10.2026 Sunai)
   Patron: "çok daha fazla ürün gösterilsin" → sekme başına 48 (includes/anasayfa-v3-veri.php ANASAYFA_V3_SERIT_ADET).
   ≥1024: 5 sütun × 2 sıra = ekranda 10 kart; ok düğmeleri bir ekran (5 sütun) kaydırır (js/anasayfa-v3.js, değişmedi).
   Klavye: DOM sırası = sütun sırası (üst, alt, sonraki sütun) → Tab görsel akışla aynı; odaklanan kart kabın içinde görünüme
   kayar; kartta iken ←/→ kabı kaydırır. "Tümünü gör · N indirim" kartı iki sırayı kaplar (şeridin sonu net okunur).
   Kartların yüksekliği satır içinde eşit (grid satırı); görsel kutusu zaten oranlı → CLS yok. Mobil (<1024) TEK SIRA, değişmedi.
   ========================================================================== */
@media (min-width: 1024px) {
  .kartlar.serit--kayar { grid-template-rows: repeat(2, auto); grid-auto-flow: column; row-gap: 16px; }
  .kartlar.serit--kayar > .kart--son { grid-row: span 2; }
}

/* ==========================================================================
   119 · FİYATI DÜŞENLER: MARKET RAFLARI (08.10.2026 Sunai) — patron: "her market için ayrı ayrı, alt alta;
   bugün + bu hafta; tek sıra, sağa sola kaydırma; Tümü yine olsun". Görünüm av3_raf() · davranış js/anasayfa-v3-raf.js.
   İMZA: her rafın altında market renginde RAF ÇITASI (hero'daki raf etiketinin dili) — şerit rafın üstünde durur.
   Kart = mevcut ana sayfa kartı (değişmedi). Masaüstü 5 kart görünür, tek sıra (d1'in iki sırası raflarda KAPALI).
   Kaydırma şeridin İÇİNDE; sayfa yatay taşmaz. Odak halkası kesilmesin: şerit üstte 6px iç boşluk (4b ile aynı).
   ========================================================================== */
.raflar { display: grid; grid-template-columns: minmax(0, 1fr); gap: 28px; }
.raf { min-width: 0; }
.raf-bas {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "ad tumu" "donem donem";
  align-items: center; gap: 4px 12px; margin-bottom: 6px;
}
.raf-ad {
  grid-area: ad; display: flex; align-items: center; gap: 10px; min-width: 0;
  font-size: 1.1875rem; line-height: 1.25; font-weight: 750; letter-spacing: -0.02em;
}
.raf-ad .mk-isaret { width: 14px; height: 14px; border-radius: 4px; }
.raf-tumu { grid-area: tumu; }
.raf-donem {
  grid-area: donem; justify-self: start; display: inline-flex; gap: 2px; padding: 3px;
  border-radius: 999px; background: var(--fis); border: 1px solid var(--cizgi-guclu);
}
.raf-donem-d {
  display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 0 12px; border: 0; border-radius: 999px;
  background: transparent; color: var(--murekkep); font: inherit; font-size: 1rem; font-weight: 600; white-space: nowrap; cursor: pointer;
  transition: background var(--sure) ease, color var(--sure) ease;
}
.raf-donem-d:hover:not([disabled]):not([aria-pressed="true"]) { background: #f1f5f9; }
.raf-donem-d[aria-pressed="true"] { background: var(--murekkep); color: #fff; }
.raf-donem-d[disabled] { color: var(--etiket); cursor: default; }
.raf-donem-d:focus-visible { outline: 3px solid var(--turuncu-orta); outline-offset: 2px; }
.raf-sayi {
  min-width: 1.75em; padding: 1px 7px; border-radius: 999px; background: #e2e8f0; color: var(--murekkep);
  font-size: .875rem; font-weight: 700; font-variant-numeric: tabular-nums; text-align: center;
}
.raf-donem-d[aria-pressed="true"] .raf-sayi { background: rgb(255 255 255 / .2); color: #fff; }

/* Raf gövdesi + çıta (imza): şeridin altında 6px, solda market rengi, sağa raf grisine söner */
.raf-govde { position: relative; padding-bottom: 10px; }
.raf-govde::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 6px; border-radius: 3px;
  background: linear-gradient(90deg, var(--m, var(--turuncu-orta)) 0, var(--m, var(--turuncu-orta)) 72px, #cbd5e1 72px, #cbd5e1);
  box-shadow: 0 2px 0 rgb(15 23 42 / .08);
  pointer-events: none;
}
.raf-serit { padding-top: 6px; padding-bottom: 12px; }

@media (min-width: 640px) {
  .raf-bas { grid-template-columns: auto auto minmax(0, 1fr) auto; grid-template-areas: "ad donem . tumu"; gap: 8px 16px; }
}
@media (min-width: 1024px) {
  .raflar { gap: 40px; }
  .raf-bas { grid-template-columns: auto auto minmax(0, 1fr) auto; grid-template-areas: "ad donem . tumu"; margin-bottom: 8px; }
  /* UYG-1203 · 26.10.2026 Sunai (patron: "marketlerde masaüstü görünümde 2 satır, toplam 10 ürün; mobil tek satır yana kaydırmalı kalsın"):
     ≥1024 raf şeridi KAYAN ŞERİT DEĞİL, 5 sütun × 2 satır ızgara (av3 ANASAYFA_V3_RAF_ADET = 10 kart). Kaydırma ve ok düğmeleri yok;
     taşma görünür olduğundan odak halkası kesilmez (iç boşluk yalnız üst/alt). Kartlar satır içinde eşit boy (grid satırı).
     <1024 (tablet dahil) değişmedi: tek satır, scroll-snap, parmakla kaydırma (kart genişliği 46% → ≥640'ta 30%). */
  .kartlar.serit--kayar.raf-serit {
    grid-template-columns: repeat(5, minmax(0, 1fr)); grid-template-rows: none; grid-auto-flow: row; grid-auto-columns: auto;
    gap: 16px; overflow: visible; scroll-snap-type: none; margin-inline: 0; padding: 6px 0 12px; scroll-padding-inline: 0;
  }
}
@media (prefers-reduced-motion: reduce) { .raf-donem-d { transition: none; } }

/* ==========================================================================
   120 → 198 → UYG-1106 · HERO MANŞETİ — KAROSEL + OTOMATİK DÖNÜŞ (UYG-1106 · 18.10.2026 Sunai; önce 120 · 125 · 198)
   Patron 18.10 öğleden sonra: "masaüstü ve mobil AYNI · sol/sağ oklar, turuncu çizgi ve gri askı kalksın, yalnız beyaz çerçeveli kart ·
   2 sn'de bir sonraki kart, sonsuz · fare üstünde/dokununca/odakta durur · duraklat/oynat düğmesi · reduced-motion'da dönmez".
   Kartlar yatay pistte, her biri tam genişlik (scroll-snap) → parmakla kaydırma ve klavye JS'siz. Dönüş js/anasayfa-v3-manset.js.
   Yükseklik = en uzun kart (flex stretch; ad tek satır → bütün kartlar aynı boy) · noktalar + düğme JS'ten önce de yer kaplar
   (visibility) → CLS 0. Dokunma hedefleri: nokta 40 px, duraklat 32 px (≥ 24, WCAG 2.5.8).
   ========================================================================== */
/* Raf imzası (çıta + askı) UYG-1176b ile kalktı; manşet kartında etiket deliği de yok. Çıta için ayrılan üst boşluk da kalktı. */
.kahraman-etiket.manset { padding-top: 6px; }
.manset .etiket--kahraman::before { display: none; }
.manset-sahne { position: relative; }
.manset-pist {
  display: flex; gap: 44px; overflow-x: auto; overflow-y: hidden; overscroll-behavior-x: contain;
  scroll-snap-type: x mandatory; scroll-behavior: smooth; scrollbar-width: none;
  /* Kart gölgesi (.etiket--kahraman: 0 14px 30px -10px → aşağı 34, yana 20 px) taşma kabında kırpılmasın: dolgu yan 22 / alt 36,
     eksi kenar boşluğuyla yerleşim aynı (CLS 0). Kartlar arası 44 px (= 2 × yan dolgu) → komşu kart dolgu bölgesinde görünmez. */
  padding: 6px 22px 36px; margin: -6px -22px -36px; scroll-padding-inline: 22px;
  border-radius: 18px; outline: none;
}
.manset-pist::-webkit-scrollbar { display: none; }
.manset-pist:focus-visible { outline: 3px solid var(--turuncu-orta); outline-offset: 4px; }
.manset-slayt { flex: 0 0 100%; min-width: 0; display: flex; scroll-snap-align: center; scroll-snap-stop: always; }
.manset-slayt > .etiket { width: 100%; height: auto; }

/* position + z-index: konumlu .manset-sahne (pistin 36 px gölge dolgusu) noktaların üstüne binip tıklamayı yutmasın */
.manset-noktalar { position: relative; z-index: 1; display: flex; justify-content: center; align-items: center; gap: 0; margin-top: 12px; visibility: hidden; }
.manset--hazir .manset-noktalar { visibility: visible; }
.manset-nokta {
  display: inline-grid; place-items: center; width: 40px; height: 40px; padding: 0; border: 0; background: transparent; border-radius: 50%; cursor: pointer;
}
.manset-nokta > span {
  display: block; width: 9px; height: 9px; border-radius: 5px; background: var(--cizgi-guclu);
  transition: background var(--sure) ease, box-shadow var(--sure) ease;   /* boyut animasyonu YOK */
}
.manset-nokta[aria-current="true"] > span { background: var(--turuncu-koyu); box-shadow: 0 0 0 3px var(--turuncu-zemin), 0 0 0 4px var(--turuncu-orta); }
.manset-nokta:hover > span { background: var(--murekkep); }
.manset-nokta[aria-current="true"]:hover > span { background: var(--turuncu-koyu); }
/* Duraklat/oynat: küçük, sade (noktaların sağında; ikon 12 px, hedef 32 px). Simge durumla: dönüyorsa "duraklat", durduysa "oynat". */
.manset-dur {
  display: inline-grid; place-items: center; width: 32px; height: 32px; margin-left: 6px; padding: 0; flex: none;
  border: 1px solid var(--cizgi-guclu); border-radius: 50%; background: var(--fis); color: var(--etiket); cursor: pointer;
  transition: background var(--sure) ease, color var(--sure) ease, border-color var(--sure) ease;
}
.manset-dur:hover { background: var(--murekkep); border-color: var(--murekkep); color: #fff; }
.manset-dur-ik { width: 12px; height: 12px; fill: currentColor; }
.manset-dur-ik--oynat, .manset-dur[data-durum="durdu"] .manset-dur-ik--dur { display: none; }
.manset-dur[data-durum="durdu"] .manset-dur-ik--oynat { display: block; }
.manset-nokta:focus-visible, .manset-dur:focus-visible { outline: 3px solid var(--turuncu-orta); outline-offset: 2px; }
@media (min-width: 1024px) {
  .manset-noktalar { margin-top: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  .manset-pist { scroll-behavior: auto; }
  .manset-nokta > span, .manset-dur { transition: none; }
}

/* UYG-1176 · 20.10.2026 Sunai (patron): "Aynı ürün, farklı fiyat" bölümü kalktı → 121 kıyas kartı (.kk*) + yön B (.kiyaslar*) kuralları silindi.
   KALAN ORTAK: .kiyas-gorsel (hero etiketi + manşet görsel kutusu), .etiketler, .serit, .blok. */

/* ==========================================================================
   121+ · MARKET LOGOLARI ANA SAYFADA (08.10.2026 Sunai) — patron: "market isimleri alanlarında market logolarını kullan".
   Tek kaynak includes/market_logo.php, 'liste' boyu (taban 32 px; optik denge sonrası 21–39 px yükseklik, CarrefourSA 154 px en geniş).
   Kural (asistan): logo yalnız ≥~20 px okunur boyda; küçük rozetler (kart altı market etiketi, etiket-diger, aktüel, tazelik satırı) METİN.
   Her logo yuvası SABİT 40 px yükseklik → hangi market gelirse gelsin satır/kart yüksekliği aynı (CLS 0). Logo yuvadan genişse
   max-width:100% + object-fit:contain ile orantılı küçülür (ölçüm raporda: en dar yer 320 px market şeridi).
   ========================================================================== */
.raf-ad--logo { min-height: 40px; }
.raf-ad--logo .mlogo, .mk-cip--logo .mlogo, .market-ad--logo .mlogo { display: block; max-width: 100%; }
.mk-cip--logo { height: 40px; max-width: 100%; }
.etiket-en:has(.mk-cip--logo) { row-gap: 2px; }

/* Market şeridi: logo tek sütunda, saat altında. <640 iki sütun (3 sütunda CarrefourSA 154 px sığmıyor), 640–1023 üç, ≥1024 altı. */
.marketler--saatli .market:has(.market-ad--logo) { grid-template-columns: minmax(0, 1fr); padding: 4px; }
.marketler--saatli .market:has(.market-ad--logo) .market-saat { grid-column: 1; }
.market-ad--logo { display: flex; align-items: center; height: 40px; min-width: 0; overflow: visible; }
.marketler--saatli .market:hover .market-ad--logo { text-decoration: none; }
.marketler--saatli .market:has(.market-ad--logo):hover { background: #f1f5f9; }
.marketler--saatli .market:has(.market-ad--logo):focus-visible { outline: 3px solid var(--turuncu-orta); outline-offset: 2px; }
.marketler.marketler--saatli:has(.market-ad--logo) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 640px) { .marketler.marketler--saatli:has(.market-ad--logo) { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .marketler.marketler--saatli:has(.market-ad--logo) { grid-template-columns: repeat(6, minmax(0, 1fr)); } }
/* <640: iki logo arasında en az 16 px boşluk (bitişik logolar tek marka gibi okunuyordu, 320 ölçümü). 320'de CarrefourSA 132×18 px'e iner
   — tek istisna, raporda; daha geniş her ekranda ≥21 px. */
@media (max-width: 639.98px) { .marketler.marketler--saatli:has(.market-ad--logo) { column-gap: 16px; } }

/* ==========================================================================
   125 · HERO MARKET ŞERİDİ TEK SATIR (08.10.2026 Sunai; kategori şeridi UYG-1203'te kalktı)
   (a) Patron: "mobilde market logo şeridi tek satır, 6 logo ekrana sığsın" (yana kaydırma DEĞİL). <1024 flex, tek satır:
       her öğenin esas boyu logonun doğal genişliği (width özniteliği), flex-shrink bu esasla orantılı → altı logo AYNI oranda küçülür,
       122'nin optik dengesi (logolar arası görsel ağırlık) korunur. Kenar boşluğu 4 px'e iner (şerit kap dolgusuna taşar, ekrana değil),
       aralık 4 px, kutu dolgusu 0. Bağlantı yüksekliği 52 px (dokunma ≥44). Okunurluk: CarrefourSA/Migros 320'de ~11 px (patrona söylendi).
   ========================================================================== */
@media (max-width: 1023.98px) {
  .marketler.marketler--saatli:has(.market-ad--logo) {
    display: flex; flex-wrap: nowrap; align-items: stretch; gap: 4px;
    margin-inline: calc(var(--kenar) * -1 + 4px);
  }
  /* esas boy = logonun 'liste' genişliği (includes/market_logo.php 122 çıktısı, ölçüldü 08.10); eşit flex-shrink → hepsi aynı oranda küçülür */
  .marketler.marketler--saatli:has(.market-ad--logo) > li { flex: 0 1 var(--lw, 80px); min-width: 0; display: flex; }
  .marketler--saatli > li:has(.mlogo--bim) { --lw: 65px; } .marketler--saatli > li:has(.mlogo--a101) { --lw: 84px; }
  .marketler--saatli > li:has(.mlogo--sok) { --lw: 56px; } .marketler--saatli > li:has(.mlogo--migros) { --lw: 105px; }
  .marketler--saatli > li:has(.mlogo--carrefoursa) { --lw: 154px; } .marketler--saatli > li:has(.mlogo--koop) { --lw: 83px; }
  .marketler.marketler--saatli:has(.market-ad--logo) { justify-content: space-between; }
  .marketler--saatli .market:has(.market-ad--logo) { flex: 1; min-width: 0; min-height: 52px; padding: 0; justify-items: stretch; }
  .marketler--saatli .market:has(.market-ad--logo) .market-ad--logo { height: auto; width: 100%; justify-content: center; }
  .marketler--saatli .market-ad--logo .mlogo { width: 100%; height: auto; max-width: none; }
}

/* ==========================================================================
   156 · MANŞET KARTI (11.10.2026 Sunai) — includes/anasayfa-v3-gorunum.php av3_manset_kart()
   Patron 11.10 örneği: büyük ürün görseli solda; sağda ad (2 satır), "En ucuz" + market logosu, ÇOK büyük yeşil fiyat (kuruş üst simge).
   Diğer market fiyatı / cetvel / fark rozeti YOK. Raf çıtası + delik (imza) kalır; eğim kalktı (modern, sakin).
   Ölçüler sabit (görsel kutusu 112 / 160 px, kart min-yükseklik) → slaytlar arası ve yüklenirken CLS 0.
   Renk: fiyat var(--kazanc) #15803d beyaz üstünde 5,0:1 (AA; büyük metin eşiği 3:1). "En ucuz" var(--etiket) #475569 7,6:1.
   ========================================================================== */
/* UYG-1106: düzen — 1. satır: ad (iki sütunu kaplar, TEK SATIR, taşarsa …) · 2. satır: solda görsel, sağda logo + altında fiyat. Delik yok
   → üst dolgu 26 → 18. Ad tek satır olduğu için bütün kartlar aynı yükseklikte (dönüşte boy oynamaz). */
.etiket--manset {
  display: grid; grid-template-columns: 112px minmax(0, 1fr); grid-template-areas: "ad ad" "gorsel govde";
  align-items: center; column-gap: 14px; row-gap: 12px; padding: 18px 16px; min-height: 0;
}
.etiket--manset .mns-ad { grid-area: ad; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.etiket--manset .mns-gorsel { grid-area: gorsel; }
.etiket--manset .mns-govde { grid-area: govde; }
.mns-sr { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.etiket--manset .mns-gorsel { width: 112px; height: 112px; border-radius: 14px; }
.etiket--manset .mns-gorsel, .etiket--manset .mns-gorsel img { background: var(--fis); }   /* örnekteki gibi beyaz zemin, kutu çizgisiz */
.mns-gorsel img { padding: 4px; }
.mns-govde { min-width: 0; display: flex; flex-direction: column; align-items: flex-start; gap: 10px; }
.etiket--manset .mns-ad { font-size: 1.0625rem; line-height: 1.3; font-weight: 700; color: var(--murekkep); }
.mns-en { display: flex; flex-wrap: nowrap; align-items: center; gap: 4px 10px; min-width: 0; max-width: 100%; overflow: hidden; font-size: .9375rem; font-weight: 600; color: var(--etiket); }   /* UYG-1106: tek satır logo (yükseklik sabit) */
.mns-logo { display: inline-flex; align-items: center; height: 30px; }
.mns-logo .mlogo { display: block; max-width: 96px; height: auto; max-height: 30px; }
.fiyat--manset { font-size: 2.25rem; line-height: 1; }
.fiyat--manset .fiyat-k { font-size: .5em; margin-top: .14em; }
.fiyat--manset .fiyat-tl { font-size: .5em; margin-top: .14em; }
.kahraman-etiket .etiket--manset { transform: none; }   /* 120'nin eğimi (rotate -1.6deg) manşet kartında yok */
@media (min-width: 400px) {
  .etiket--manset { grid-template-columns: 136px minmax(0, 1fr); }
  .etiket--manset .mns-gorsel { width: 136px; height: 136px; }
  .fiyat--manset { font-size: 2.5rem; }
}
@media (min-width: 1024px) {
  .etiket--manset { grid-template-columns: 160px minmax(0, 1fr); column-gap: 20px; row-gap: 14px; padding: 22px 22px 22px; min-height: 0; }
  .etiket--manset .mns-gorsel { width: 160px; height: 160px; }
  .etiket--manset .mns-ad { font-size: 1.1875rem; }
  .fiyat--manset { font-size: 3rem; }
}

/* 11.10.2026 Sunai — kalan market ADLARI da LOGO (patron: "market adlarını marketlerin logolarını kullan"). 'rozet' boyu (≤84×18),
   alt = ad. Renk işareti logoda gereksiz → yerinde hiç (çip, aktüel, saat satırı). */
.mk-logo { display: inline-flex; align-items: center; min-height: 18px; }
.mk-logo .mlogo, .mk-cip--rozet .mlogo, .aktuel-ad--logo .mlogo, .mt-ad .mlogo { display: block; max-width: 100%; height: auto; }
.mk-cip--rozet { min-height: 20px; }
.mt-ad { display: inline-flex; align-items: center; vertical-align: middle; min-height: 18px; }
.aktuel:has(.aktuel-ad--logo) { grid-template-columns: minmax(0, 1fr); }
.aktuel:has(.aktuel-ad--logo) .aktuel-ad, .aktuel:has(.aktuel-ad--logo) .aktuel-sayi { grid-column: 1; }
.aktuel-ad--logo { display: flex; align-items: center; min-height: 20px; overflow: visible; }

/* 11.10.2026 Sunai tur2: ?v= yenileme (tur1 ACL penceresinde 404 önbelleğe girmiş olabilir) */

/* ==========================================================================
   UYG-1207 · 26.10.2026 Sunai — MARKET RAFI: 20 ürün + "<Market> tüm indirimli ürünler" (ek sayfalar)
   ≥1024: raf şeridi 5 sütun × 4 satır = 20 kart (ızgara kuralı yukarıda, satır sayısı kart sayısından gelir).
   <1024: 20 kart tek satır kayan şerit (değişmedi). Düğme rafın altında; tıklayınca ek ürünler rafın altına açılır:
   <640 2 sütun · ≥640 3 sütun · ≥1024 5 sütun; kaydırdıkça 20'şer (js/anasayfa-v3-raf.js, api/v1/raf_urunler.php).
   Görsel kutuları aspect-ratio 1 (.kart-gorsel) + width/height öznitelikleri → yükleme CLS yapmaz; iskelet kart gerçek kartla aynı boyda.
   ========================================================================== */
.raf-devam { display: flex; flex-direction: column; align-items: center; gap: 12px; margin-top: 14px; min-width: 0; }
.raf-ek-kap { width: 100%; min-width: 0; }
.raf-ek-kap:empty { display: none; }
.raf-ek { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; width: 100%; padding: 6px 0 0; margin: 0 0 12px; list-style: none; }
.raf-ek[hidden] { display: none; }
.raf-devam-d {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 48px; padding: 0 22px; max-width: 100%;
  border: 1px solid var(--cizgi-guclu); border-radius: 999px; background: var(--fis); color: var(--turuncu-koyu);
  font: inherit; font-size: 1rem; font-weight: 700; text-align: center; text-decoration: none; cursor: pointer;
  transition: background var(--sure) ease, border-color var(--sure) ease;
}
.raf-devam-d[hidden] { display: none; }
.raf-devam-d:hover { background: var(--turuncu-zemin); border-color: var(--turuncu-orta); }
.raf-devam-d:focus-visible { outline: 3px solid var(--turuncu-orta); outline-offset: 2px; }
.raf-devam-d .ikon { width: 16px; height: 16px; flex: none; }
.raf-devam-durum { margin: 0; min-height: 0; font-size: .9375rem; line-height: 1.4; color: var(--etiket); text-align: center; }
.raf-devam-durum:empty { display: none; }
.raf-devam-durum .raf-devam-d { margin-left: 8px; min-height: 44px; padding-inline: 16px; }
.raf-bekle { width: 100%; height: 1px; }
/* iskelet kart: gerçek kartla aynı kutu (görsel 1:1 + iki satır metin) */
.kart--iskelet { pointer-events: none; }
.kart--iskelet .iskelet-kutu { display: block; border-radius: var(--r-m); background: linear-gradient(90deg, #e9edf2 0%, #f4f6f9 50%, #e9edf2 100%); background-size: 200% 100%; animation: iskelet-akis 1.4s ease-in-out infinite; }
.kart--iskelet .iskelet-kutu--g { aspect-ratio: 1; }
.kart--iskelet .iskelet-kutu--m { height: 1.2em; margin: 8px 4px 0; }
.kart--iskelet .iskelet-kutu--k { height: 1.2em; width: 55%; margin: 4px 4px 0; }
@keyframes iskelet-akis { to { background-position: -200% 0; } }
@media (prefers-reduced-motion: reduce) { .kart--iskelet .iskelet-kutu { animation: none; } .raf-devam-d { transition: none; } }
@media (min-width: 640px) { .raf-ek { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; } }
@media (min-width: 1024px) { .raf-ek { grid-template-columns: repeat(5, minmax(0, 1fr)); } }