/* Endüstri Partner — vitrin stilleri ("C · Raf" tasarımı, 2026-11-13).
   Renk kimliği: Lacivert #13294B (ana) + Amber #F2A900 (vurgu; açık zeminde YAZI RENGİ OLARAK KULLANILMAZ).
   Tüm renkler aşağıdaki değişkenlerden; türev tonlar color-mix ile (desteklemeyen tarayıcı sabit karşılığı kullanır). */

/* ───────── 1. Değişkenler ───────── */
:root {
  color-scheme: light;
  --ep-lacivert: #13294B;
  --ep-amber: #F2A900;
  --ep-kagit: #F7F8FA;
  --ep-celik: #5B6472;
  --ep-beyaz: #FFFFFF;
  /* türevler (sabit karşılıklar; @supports altında color-mix ile yeniden tanımlanır) */
  --ep-lacivert-koyu: #0C1C36;
  --ep-lacivert-hover: #0F2340;
  --ep-lacivert-50: #F1F3F6;
  --ep-lacivert-100: #E4E8EE;
  --ep-cizgi: #D9DEE6;
  --ep-cizgi-ince: #EEF0F4;
  --ep-cerceve: #8792A2;
  --ep-amber-hover: #D99800;
  --ep-ust-yazi: #C9D4E3;
  --ep-ust-ayrac: #7F92B0;
  --ep-alt-yazi: #D5DEEA;
  --ep-alt-soluk: #AFC0D6;
  --ep-bant-cerceve: #5F7396;
  /* işlev renkleri */
  --ep-yesil: #0B6B3A;
  --ep-yesil-nokta: #0E8A4A;
  --ep-yesil-zemin: #E7F4EC;
  --ep-kirmizi: #B3261E;
  --ep-kirmizi-zemin: #FCEDEC;
  --ep-uyari: #8A5A00;
  --ep-uyari-zemin: #FFF4D1;
  /* yazı tipleri */
  --ep-font: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --ep-font-baslik: "Space Grotesk", "Inter", system-ui, sans-serif;
  --ep-font-mono: "IBM Plex Mono", ui-monospace, "Cascadia Mono", Consolas, monospace;
  --ep-max: 1392px;
  --ep-yan: 24px;
  --ep-r: 3px;

  /* Eski (OM) görünüm değişkenleri — sayfa içi satır stilleri bunlara bakıyor; EP paletine bağlanır */
  --navy: var(--ep-lacivert); --text: var(--ep-lacivert); --muted: var(--ep-celik); --dim: var(--ep-celik);
  --border: var(--ep-cizgi); --line: var(--ep-cizgi); --white: #FFFFFF; --bg: var(--ep-kagit);
  --teal: var(--ep-lacivert); --teal-2: var(--ep-lacivert); --teal-bg: var(--ep-lacivert-50); --accent: var(--ep-lacivert); --blue: var(--ep-lacivert);
  --orange: var(--ep-uyari); --orange-2: var(--ep-uyari); --orange-bg: var(--ep-uyari-zemin);
  --green: var(--ep-yesil-nokta); --green-2: var(--ep-yesil); --green-bg: var(--ep-yesil-zemin); --ok: var(--ep-yesil); --ok-bg: var(--ep-yesil-zemin);
  --red: var(--ep-kirmizi); --bad: var(--ep-kirmizi); --red-bg: var(--ep-kirmizi-zemin); --warn: var(--ep-uyari); --warn-bg: var(--ep-uyari-zemin);
  --f: var(--ep-font); --font-m: var(--ep-font-mono); --font-d: var(--ep-font-baslik);
  --r: var(--ep-r); --r-lg: var(--ep-r);
}
@supports (color: color-mix(in srgb, red 50%, blue)) {
  :root {
    --ep-lacivert-koyu: color-mix(in srgb, var(--ep-lacivert) 66%, #000);
    --ep-lacivert-hover: color-mix(in srgb, var(--ep-lacivert) 82%, #000);
    --ep-lacivert-50: color-mix(in srgb, var(--ep-lacivert) 6%, #fff);
    --ep-lacivert-100: color-mix(in srgb, var(--ep-lacivert) 11%, #fff);
    --ep-cizgi: color-mix(in srgb, var(--ep-lacivert) 16%, #fff);
    --ep-cizgi-ince: color-mix(in srgb, var(--ep-lacivert) 7%, #fff);
    --ep-cerceve: color-mix(in srgb, var(--ep-celik) 74%, #fff);
    --ep-amber-hover: color-mix(in srgb, var(--ep-amber) 90%, #000);
    --ep-ust-yazi: color-mix(in srgb, var(--ep-lacivert) 18%, #fff);
    --ep-alt-yazi: color-mix(in srgb, var(--ep-lacivert) 14%, #fff);
    --ep-alt-soluk: color-mix(in srgb, var(--ep-lacivert) 30%, #fff);
    --ep-bant-cerceve: color-mix(in srgb, var(--ep-lacivert) 55%, #fff);
  }
}

/* ───────── 2. Taban ───────── */
*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body {
  background: var(--ep-beyaz); color: var(--ep-lacivert);
  font-family: var(--ep-font); font-size: 14px; line-height: 20px;
  -webkit-font-smoothing: antialiased; overflow-wrap: break-word;
}
img, svg, video { max-width: 100%; }
img { height: auto; }
.ic, .ep-mark { flex: 0 0 auto; display: block; }
a { color: var(--ep-lacivert); text-underline-offset: 3px; }
a:hover { color: var(--ep-lacivert-koyu); }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
table { border-collapse: collapse; }
ul[class], ol[class] { list-style: none; padding: 0; }
:focus-visible { outline: 2px solid var(--ep-lacivert); outline-offset: 2px; }
.ep-koyu :focus-visible { outline-color: var(--ep-amber); }
.vh { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.mono { font-family: var(--ep-font-mono); }
.ep-atla { position: absolute; left: 12px; top: -60px; z-index: 1000; background: var(--ep-amber); color: var(--ep-lacivert); font-weight: 700; padding: 12px 16px; border-radius: var(--ep-r); }
.ep-atla:focus { top: 8px; }
[hidden] { display: none !important; }

/* Hareket: yalnız tercihi "azaltma YOK" olanlarda sayfa geçişi (aynı site gezintisi) */
@media (prefers-reduced-motion: no-preference) {
  @view-transition { navigation: auto; }
  ::view-transition-old(root), ::view-transition-new(root) { animation-duration: .18s; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}

/* Ortak kap */
.ep-w { max-width: var(--ep-max); margin-inline: auto; padding-inline: var(--ep-yan); }
@media (max-width: 640px) { :root { --ep-yan: 16px; } }

/* ───────── 3. Üst bilgi (4 katman) ───────── */
.ep-ust { background: var(--ep-lacivert-koyu); color: var(--ep-ust-yazi); font-size: 12.5px; line-height: 16px; }
.ep-ust .ep-w { min-height: 36px; display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 0 24px; }
.ep-ust-g { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 10px; padding: 4px 0; }
.ep-ust b { font-weight: 600; color: #fff; }
.ep-ust .ayr { color: var(--ep-ust-ayrac); }
.ep-ust a { color: #fff; text-decoration: none; display: inline-flex; align-items: center; gap: 6px; min-height: 28px; }
.ep-ust a:hover { text-decoration: underline; color: #fff; }
.ep-ust .tel { font-family: var(--ep-font-mono); font-weight: 600; }

.ep-bant { background: var(--ep-lacivert); color: #fff; }
.ep-bant .ep-w { padding-block: 16px; display: flex; flex-wrap: wrap; align-items: center; gap: 12px 24px; }
.ep-logo { flex: 0 0 auto; height: 48px; display: flex; align-items: center; gap: 10px; color: #fff; text-decoration: none; }
.ep-logo:hover { color: #fff; }
.ep-wordmark { font-family: var(--ep-font-baslik); font-size: 24px; line-height: 28px; letter-spacing: -0.025em; white-space: nowrap; }
.ep-wordmark .w1 { font-weight: 500; } .ep-wordmark .w2 { font-weight: 700; }

.ep-ara { flex: 999 1 420px; min-width: 0; height: 48px; display: flex; align-items: stretch; background: #fff; border-radius: var(--ep-r); }
.ep-ara:focus-within { box-shadow: 0 0 0 3px var(--ep-amber); }
.ep-ara-kod { flex: 0 0 auto; display: flex; align-items: center; gap: 8px; padding: 0 12px; background: var(--ep-kagit); border-right: 1px solid var(--ep-cizgi); border-radius: var(--ep-r) 0 0 var(--ep-r); font-size: 12.5px; line-height: 16px; font-weight: 600; color: var(--ep-lacivert); white-space: nowrap; cursor: pointer; }
.ep-ara-kod input { flex: 0 0 18px; width: 18px; height: 18px; margin: 0; accent-color: var(--ep-lacivert); }
.ep-ara input[type="search"] { flex: 1 1 auto; min-width: 0; padding: 0 14px; border: 0; background: #fff; color: var(--ep-lacivert); font-family: var(--ep-font-mono); font-size: 14px; }
.ep-ara input[type="search"]::placeholder { color: var(--ep-celik); opacity: 1; }
.ep-ara input[type="search"]:focus { outline: none; }
.ep-ara button { flex: 0 0 auto; display: flex; align-items: center; gap: 8px; padding: 0 20px; border: 0; border-radius: 0 var(--ep-r) var(--ep-r) 0; background: var(--ep-amber); color: var(--ep-lacivert); font-size: 15px; font-weight: 700; }
.ep-ara button:hover { background: var(--ep-amber-hover); }
.ep-ara button:focus-visible { outline: 2px solid #fff; outline-offset: -4px; }

.ep-eylem { flex: 0 0 auto; display: flex; align-items: center; gap: 8px; }
.ep-eylem > a, .ep-eylem .ep-tia button { min-width: 68px; height: 48px; padding: 0 6px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; color: #fff; font-size: 12px; line-height: 14px; font-weight: 500; text-decoration: none; background: transparent; border: 0; border-radius: var(--ep-r); position: relative; }
.ep-eylem > a:hover, .ep-eylem .ep-tia button:hover { background: rgba(255, 255, 255, .08); color: #fff; }
.ep-eylem .ep-sepet { flex-direction: row; gap: 10px; padding: 0 14px; border: 1px solid var(--ep-bant-cerceve); font-size: 14px; line-height: 20px; font-weight: 600; }
.ep-rozet { min-width: 22px; height: 22px; padding: 0 6px; display: inline-flex; align-items: center; justify-content: center; border-radius: 11px; background: var(--ep-amber); color: var(--ep-lacivert); font-family: var(--ep-font-mono); font-size: 12px; font-weight: 600; line-height: 1; }
.ep-eylem .ep-fav .ep-rozet { position: absolute; top: 0; right: 8px; min-width: 18px; height: 18px; font-size: 11px; padding: 0 4px; }
.ep-tia { margin: 0; display: flex; }
.ep-tia img { display: block; border-radius: 4px; }

/* Kategori gezinmesi */
.ep-nav { background: #fff; border-bottom: 1px solid var(--ep-cizgi); }
.ep-nav .ep-w { min-height: 46px; display: flex; flex-wrap: wrap; align-items: stretch; gap: 0 4px; font-size: 13.5px; line-height: 18px; }
.ep-nav a, .ep-nav-ac { display: flex; align-items: center; gap: 7px; min-height: 46px; padding: 0 12px; color: var(--ep-lacivert); font-weight: 600; text-decoration: none; white-space: nowrap; background: transparent; border: 0; }
.ep-nav a:hover { background: var(--ep-kagit); color: var(--ep-lacivert); }
.ep-nav .ep-nav-tum, .ep-nav-ac { padding: 0 14px; gap: 8px; background: var(--ep-lacivert); color: #fff; }
.ep-nav .ep-nav-tum:hover, .ep-nav-ac:hover { background: var(--ep-lacivert-hover); color: #fff; }
.ep-nav .say { font-family: var(--ep-font-mono); font-size: 11.5px; font-weight: 400; color: var(--ep-celik); }
.ep-nav a[aria-current] { background: var(--ep-kagit); box-shadow: inset 0 -3px 0 var(--ep-amber); }
.ep-nav-ac { display: none; }
.ep-kat-l { display: flex; flex-wrap: wrap; align-items: stretch; gap: 0 4px; }
.ep-kat-bas { display: none; }
.ep-nav .bosluk { flex: 1 1 auto; }
/* Geniş ekran: kategori listesi satır içi (popover sunumu sıfırlanır) */
@media (min-width: 900px) {
  .ep-kat[popover] { display: flex; position: static; inset: auto; margin: 0; padding: 0; border: 0; background: transparent; color: inherit; width: auto; height: auto; overflow: visible; }
}
/* Dar ekran: "Kategoriler" düğmesi + açılır panel (popover="auto": dışarı tıklama / Esc kapatır) */
@media (max-width: 899.98px) {
  .ep-nav-tum { display: none !important; }
  .ep-nav-ac { display: flex; }
  .ep-kat:popover-open { position: fixed; inset: 8px 8px auto 8px; width: auto; max-width: 520px; margin: 0 auto; max-height: calc(100dvh - 16px); overflow: auto; padding: 0; border: 1px solid var(--ep-cizgi); border-top: 3px solid var(--ep-lacivert); background: #fff; color: var(--ep-lacivert); box-shadow: 0 18px 48px rgba(12, 28, 54, .28); }
  .ep-kat::backdrop { background: rgba(12, 28, 54, .45); }
  .ep-kat:popover-open .ep-kat-bas { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 4px 4px 4px 16px; background: var(--ep-kagit); border-bottom: 1px solid var(--ep-cizgi); font-family: var(--ep-font-baslik); font-weight: 700; font-size: 17px; }
  .ep-kat:popover-open .ep-kat-l { flex-direction: column; }
  .ep-kat:popover-open .ep-kat-l a { justify-content: space-between; border-bottom: 1px solid var(--ep-cizgi-ince); padding: 0 16px; }
  .ep-kat-kapat { width: 44px; height: 44px; display: grid; place-items: center; border: 0; background: transparent; color: var(--ep-lacivert); }
}

/* Amber hizmet şeridi */
.ep-servis { background: var(--ep-amber); color: var(--ep-lacivert); }
.ep-servis .ep-w { min-height: 34px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0 20px; font-size: 12.5px; line-height: 16px; font-weight: 600; }
.ep-servis span { display: flex; align-items: center; gap: 7px; padding: 4px 0; }

@media (max-width: 720px) {
  .ep-bant .ep-w { padding-block: 10px 12px; gap: 10px 8px; justify-content: space-between; }
  .ep-ara { order: 3; flex: 1 1 100%; }
  .ep-eylem { gap: 2px; }
  .ep-eylem > a, .ep-eylem .ep-tia button { min-width: 52px; padding: 0 4px; }
  .ep-eylem .ep-sepet { padding: 0 10px; gap: 6px; }
  .ep-eylem .ep-sepet .etk { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .ep-tia { display: none; }
  .ep-servis .ep-w { flex-wrap: nowrap; overflow-x: auto; justify-content: flex-start; scrollbar-width: none; }
  .ep-servis .ep-w::-webkit-scrollbar { display: none; }
  .ep-servis span { white-space: nowrap; }
}
@media (max-width: 480px) {
  .ep-wordmark { font-size: 19px; line-height: 24px; }
  .ep-logo { gap: 8px; }
  .ep-logo .ep-mark { width: 30px; height: 30px; }
  .ep-ara-kod { padding: 0 10px; }
  .ep-ara button { padding: 0 14px; }
  .ep-ara button .etk { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .ep-eylem > a .etk { font-size: 11px; }
}
@media (max-width: 370px) {
  .ep-eylem > a .etk { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .ep-eylem > a { min-width: 44px; }
}

/* ───────── 4. Bildirimler ───────── */
.flash { max-width: var(--ep-max); margin: 12px auto 0; padding: 11px 16px; font-size: 13.5px; font-weight: 600; border: 1px solid; width: calc(100% - 2 * var(--ep-yan)); }
.flash.ok { background: var(--ep-yesil-zemin); border-color: color-mix(in srgb, var(--ep-yesil) 35%, #fff); color: var(--ep-yesil); }
.flash.err { background: var(--ep-kirmizi-zemin); border-color: color-mix(in srgb, var(--ep-kirmizi) 35%, #fff); color: var(--ep-kirmizi); }
.page .flash { width: auto; max-width: none; margin: 0 0 12px; }
.ep-toast { position: fixed; left: 50%; bottom: 24px; z-index: 9999; transform: translateX(-50%) translateY(16px); opacity: 0; pointer-events: none; max-width: calc(100vw - 32px); background: var(--ep-lacivert); color: #fff; padding: 12px 18px; border-left: 4px solid var(--ep-amber); font-size: 13.5px; font-weight: 600; box-shadow: 0 8px 28px rgba(12, 28, 54, .32); transition: opacity .2s, transform .2s; }
.ep-toast.on { opacity: 1; transform: translateX(-50%) translateY(0); }
@media (prefers-reduced-motion: reduce) { .ep-toast, .ep-toast.on { transform: translateX(-50%); } }

/* Hata kutusu (yerel <dialog>, sayfalar window.hataKutusu ile açar) */
.ep-hata { width: min(440px, calc(100vw - 32px)); padding: 0; border: 0; border-top: 4px solid var(--ep-kirmizi); background: #fff; color: var(--ep-lacivert); box-shadow: 0 24px 60px rgba(12, 28, 54, .32); }
.ep-hata:modal { overscroll-behavior: contain; }
.ep-hata::backdrop { background: rgba(12, 28, 54, .55); overflow: hidden; overscroll-behavior: contain; }
.ep-hata .ic-b { padding: 20px 22px 18px; }
.ep-hata h2 { display: flex; align-items: center; gap: 8px; font-family: var(--ep-font-baslik); font-size: 17px; line-height: 24px; color: var(--ep-kirmizi); margin-bottom: 8px; }
.ep-hata p { font-size: 14px; line-height: 21px; margin: 0 0 16px; }
.ep-hata form { margin: 0; }
.ep-hata button { width: 100%; height: 44px; border: 0; border-radius: var(--ep-r); background: var(--ep-lacivert); color: #fff; font-weight: 700; font-size: 14px; }
.ep-hata button:hover { background: var(--ep-lacivert-hover); }

/* ───────── 5. Bölüm başlıkları ve ızgara ───────── */
.ep-main { display: block; }
.ep-giris { background: var(--ep-kagit); border-bottom: 1px solid var(--ep-cizgi); }
.ep-giris .ep-w { padding-block: 20px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px 32px; }
.ep-giris-m { flex: 999 1 420px; min-width: 0; }
.ep-giris h1 { font-family: var(--ep-font-baslik); font-size: 26px; line-height: 32px; font-weight: 700; letter-spacing: -0.02em; }
.ep-giris p { margin-top: 6px; color: var(--ep-celik); }
.ep-sayac { flex: 1 1 400px; max-width: 460px; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(96px, 100%), 1fr)); border: 1px solid var(--ep-cizgi); border-right: 0; background: #fff; margin: 0; }
.ep-sayac > div { padding: 10px 14px; border-right: 1px solid var(--ep-cizgi); display: flex; flex-direction: column-reverse; justify-content: flex-end; }
.ep-sayac dd { margin: 0; font-family: var(--ep-font-mono); font-size: 20px; line-height: 26px; font-weight: 600; }
.ep-sayac dt { font-family: var(--ep-font-mono); font-size: 11px; line-height: 14px; letter-spacing: .06em; color: var(--ep-celik); }

.ep-govde { padding-block: 20px 32px; display: flex; flex-direction: column; gap: 24px; }
.ep-sh { min-height: 44px; padding: 0 14px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 2px 16px; background: var(--ep-kagit); border: 1px solid var(--ep-cizgi); border-top: 2px solid var(--ep-lacivert); }
.ep-sh h2, .ep-sh .h2 { font-family: var(--ep-font-baslik); font-size: 17px; line-height: 24px; font-weight: 700; letter-spacing: -0.01em; }
.ep-meta { font-family: var(--ep-font-mono); font-size: 11.5px; line-height: 16px; letter-spacing: .06em; color: var(--ep-celik); text-transform: uppercase; }
.ep-sh a.ep-meta-a { min-height: 44px; display: flex; align-items: center; gap: 4px; font-family: var(--ep-font-mono); font-size: 12px; letter-spacing: .02em; }
.ep-cizgi-izgara { display: grid; border-left: 1px solid var(--ep-cizgi); }
.ep-cizgi-izgara > * { border-right: 1px solid var(--ep-cizgi); border-bottom: 1px solid var(--ep-cizgi); background: #fff; }

/* Ana sayfa: kategori sütunları */
.ep-kat-izgara { grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr)); }
.ep-kat-sutun { display: flex; flex-direction: column; }
.ep-kat-sutun > a { min-height: 44px; padding: 0 14px; display: flex; align-items: center; justify-content: space-between; gap: 10px; border-bottom: 1px solid var(--ep-cizgi-ince); text-decoration: none; color: var(--ep-lacivert); font-size: 13px; line-height: 18px; }
.ep-kat-sutun > a:hover { background: var(--ep-kagit); }
.ep-kat-sutun > a .ad { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ep-kat-sutun > a .say { font-family: var(--ep-font-mono); font-size: 12.5px; color: var(--ep-celik); }
.ep-kat-sutun a.ana { min-height: 52px; border-bottom-color: var(--ep-cizgi); }
.ep-kat-sutun a.ana + a.ana, .ep-kat-sutun a:not(.ana) + a.ana { border-top: 1px solid var(--ep-cizgi); margin-top: -1px; }
.ep-kat-sutun a.ana .ad { font-family: var(--ep-font-baslik); font-size: 16px; line-height: 22px; font-weight: 700; letter-spacing: -0.01em; }
.ep-kat-sutun a.ana .say { display: flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600; color: var(--ep-lacivert); white-space: nowrap; }
.ep-kat-sutun a.tumu .ad { font-weight: 600; }
.ep-kod-yok { flex: 1 1 auto; min-height: 150px; padding: 14px; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 6px; background: var(--ep-kagit); }
.ep-kod-yok b { font-size: 14px; line-height: 20px; }
.ep-kod-yok p { font-size: 13px; line-height: 18px; color: var(--ep-celik); }

/* Markalar */
.ep-marka-l { display: flex; flex-wrap: wrap; border-left: 1px solid var(--ep-cizgi); }
.ep-marka-l a { flex: 1 1 auto; min-height: 52px; padding: 0 16px; display: flex; align-items: center; justify-content: space-between; gap: 10px; border-right: 1px solid var(--ep-cizgi); border-bottom: 1px solid var(--ep-cizgi); background: #fff; text-decoration: none; color: var(--ep-lacivert); white-space: nowrap; }
.ep-marka-l a:hover { background: var(--ep-kagit); }
.ep-marka-l .ad { font-family: var(--ep-font-baslik); font-size: 14px; line-height: 20px; font-weight: 700; letter-spacing: .01em; }
.ep-marka-l .say { font-family: var(--ep-font-mono); font-size: 12px; line-height: 16px; color: var(--ep-celik); }

/* Hizmet kartları */
.ep-hizmet { grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr)); }
.ep-hizmet > div { min-height: 132px; padding: 16px; display: flex; align-items: flex-start; gap: 12px; }
.ep-hizmet .ik { flex: 0 0 36px; width: 36px; height: 36px; display: grid; place-items: center; border-radius: 2px; background: var(--ep-lacivert); color: var(--ep-amber); }
.ep-hizmet h3 { font-size: 14.5px; line-height: 20px; font-weight: 700; }
.ep-hizmet p { margin-top: 4px; font-size: 13px; line-height: 19px; color: var(--ep-celik); }

.ep-etiket { font-family: var(--ep-font-mono); font-size: 11.5px; line-height: 16px; font-weight: 500; letter-spacing: .08em; color: var(--ep-celik); text-transform: uppercase; }
.ep-yetki { margin-top: 6px; padding: 0; list-style: none; }
.ep-yetki li { min-height: 44px; display: flex; align-items: center; gap: 10px; border-bottom: 1px solid var(--ep-cizgi); font-size: 14px; font-weight: 600; }
.ep-yetki li span span { font-weight: 400; color: var(--ep-celik); }
.ep-belge { margin-top: 6px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; padding: 0; list-style: none; }
.ep-belge li { min-height: 40px; padding: 0 12px; display: flex; align-items: center; border: 1px solid var(--ep-cizgi); background: #fff; font-family: var(--ep-font-mono); font-size: 13px; font-weight: 500; }

/* ───────── 6. Düğmeler ve form ögeleri ───────── */
.btn, .ep-btn { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 44px; padding: 0 18px; border: 1px solid var(--ep-lacivert); border-radius: var(--ep-r); background: var(--ep-lacivert); color: #fff; font-family: var(--ep-font); font-size: 14px; font-weight: 700; line-height: 18px; text-decoration: none; cursor: pointer; text-align: center; }
.btn:hover, .ep-btn:hover { background: var(--ep-lacivert-hover); border-color: var(--ep-lacivert-hover); color: #fff; }
.btn.blue, .ep-btn.amber { background: var(--ep-amber); border-color: var(--ep-amber); color: var(--ep-lacivert); }
.btn.blue:hover, .ep-btn.amber:hover { background: var(--ep-amber-hover); border-color: var(--ep-amber-hover); color: var(--ep-lacivert); }
.btn.ghost, .ep-btn.cerceve { background: #fff; color: var(--ep-lacivert); border-color: var(--ep-lacivert); }
.btn.ghost:hover, .ep-btn.cerceve:hover { background: var(--ep-kagit); color: var(--ep-lacivert); }
.btn:disabled, .ep-btn:disabled, .btn[aria-disabled="true"] { opacity: .55; cursor: not-allowed; }
.btn .ic, .ep-btn .ic { width: 18px; height: 18px; }
.ep-btn.tam, .btn.tam { width: 100%; }

.field { margin-bottom: 14px; }
.field label, .ep-etk { display: block; margin-bottom: 5px; font-size: 13px; line-height: 18px; font-weight: 600; color: var(--ep-lacivert); }
.field input:not([type="checkbox"]):not([type="radio"]), .field select, .field textarea,
.ep-girdi, .ep-secim {
  width: 100%; min-height: 44px; padding: 0 12px; border: 1px solid var(--ep-cerceve); border-radius: var(--ep-r);
  background: #fff; color: var(--ep-lacivert); font-size: 14px; line-height: 20px;
}
.field textarea, textarea.ep-girdi { padding: 10px 12px; min-height: 88px; resize: vertical; }
.field input:focus-visible, .field select:focus-visible, .field textarea:focus-visible, .ep-girdi:focus-visible, .ep-secim:focus-visible { outline: 2px solid var(--ep-lacivert); outline-offset: 0; border-color: var(--ep-lacivert); }
.field input::placeholder, .field textarea::placeholder, .ep-girdi::placeholder { color: var(--ep-celik); opacity: .85; }
/* Kullanıcı alanla etkileşime girdikten SONRA geçersizse kırmızı çerçeve (:user-invalid; desteklemeyen tarayıcı sunucu/JS uyarısına güvenir) */
.field :is(input, select, textarea):user-invalid, .ep-girdi:user-invalid { border-color: var(--ep-kirmizi); box-shadow: inset 0 0 0 1px var(--ep-kirmizi); }
.field:has(:user-invalid) > label { color: var(--ep-kirmizi); }
input[type="checkbox"], input[type="radio"] { accent-color: var(--ep-lacivert); width: 18px; height: 18px; }
.zor { color: var(--ep-kirmizi); }
.ops { color: var(--ep-celik); font-weight: 400; }
.ep-not { font-size: 12.5px; line-height: 18px; color: var(--ep-celik); margin-top: 5px; }

/* Adet seçici (− [ ] +) */
.ep-adet { flex: 0 0 128px; width: 128px; height: 44px; display: flex; align-items: stretch; border-radius: var(--ep-r); background: #fff; box-shadow: inset 0 0 0 1px var(--ep-cerceve); }
.ep-adet button { flex: 0 0 42px; padding: 0; border: 0; background: transparent; color: var(--ep-lacivert); display: grid; place-items: center; border-radius: var(--ep-r); }
.ep-adet button:hover { background: var(--ep-kagit); }
.ep-adet input { flex: 1 1 auto; width: 40px; min-width: 0; padding: 0; border: 0; border-left: 1px solid var(--ep-cizgi); border-right: 1px solid var(--ep-cizgi); background: transparent; color: var(--ep-lacivert); font-family: var(--ep-font-mono); font-size: 14px; font-weight: 600; text-align: center; -moz-appearance: textfield; appearance: textfield; }
.ep-adet input::-webkit-outer-spin-button, .ep-adet input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.ep-adet input:focus-visible { outline: 2px solid var(--ep-lacivert); outline-offset: -2px; }
.ep-adet.buyuk { height: 48px; }
.ep-sepete { flex: 1 1 auto; min-height: 44px; padding: 0 8px; display: flex; align-items: center; justify-content: center; gap: 6px; border: 0; border-radius: var(--ep-r); background: var(--ep-amber); color: var(--ep-lacivert); font-size: 13.5px; font-weight: 700; white-space: nowrap; text-decoration: none; }
.ep-sepete:hover { background: var(--ep-amber-hover); color: var(--ep-lacivert); }
.ep-sepete:disabled { opacity: .6; cursor: progress; }
.ep-teklif-b { flex: 1 1 auto; min-height: 44px; padding: 0 12px; display: flex; align-items: center; justify-content: center; gap: 6px; border: 1px solid var(--ep-lacivert); border-radius: var(--ep-r); background: #fff; color: var(--ep-lacivert); font-size: 13.5px; font-weight: 700; white-space: nowrap; text-decoration: none; }
.ep-teklif-b:hover { background: var(--ep-kagit); color: var(--ep-lacivert); }

/* ───────── 7. Ürün satırı (liste / kompakt / kart) ───────── */
.ep-satirlar { container-type: inline-size; container-name: satir; border-left: 1px solid var(--ep-cizgi); border-right: 1px solid var(--ep-cizgi); }
.ep-satirlar.kompakt { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(600px, 100%), 1fr)); border-right: 0; }
.ep-satir { min-height: 88px; padding: 11px 14px 12px; display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; border-bottom: 1px solid var(--ep-cizgi); background: #fff; }
.ep-satirlar.kompakt .ep-satir { min-height: 96px; gap: 8px 14px; border-right: 1px solid var(--ep-cizgi); }
.ep-satir .gorsel { flex: 0 0 64px; width: 64px; height: 64px; display: flex; align-items: center; justify-content: center; border: 1px solid #E3E7ED; border-radius: 2px; background: #fff; color: var(--ep-cerceve); }
.ep-satir .gorsel img { display: block; width: 54px; height: 54px; object-fit: contain; }
.ep-satirlar.kompakt .gorsel { flex-basis: 72px; width: 72px; height: 72px; }
.ep-satirlar.kompakt .gorsel img { width: 62px; height: 62px; }
.ep-satir .kimlik { flex: 1 1 220px; min-width: 0; min-height: 44px; display: block; color: var(--ep-lacivert); text-decoration: none; }
.ep-satirlar.kompakt .kimlik { flex-basis: 130px; }
.ep-satir .kimlik .marka { display: block; font-family: var(--ep-font-mono); font-size: 11px; line-height: 14px; letter-spacing: .06em; color: var(--ep-celik); text-transform: uppercase; }
.ep-satir .kimlik .kod { display: block; font-family: var(--ep-font-mono); font-size: 15px; line-height: 20px; font-weight: 600; text-decoration: underline; text-decoration-color: var(--ep-cerceve); text-underline-offset: 3px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ep-satirlar.kompakt .kimlik .kod { font-size: 14.5px; margin-top: 2px; }
.ep-satir .kimlik:hover .kod { text-decoration-color: var(--ep-lacivert); }
.ep-satir .kimlik .ad { margin-top: 3px; max-height: 34px; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; font-size: 13px; line-height: 17px; color: var(--ep-celik); }
.ep-satirlar.kompakt .kimlik .ad { font-size: 12.5px; line-height: 16px; max-height: 32px; margin-top: 2px; }
.ep-satir .marka-s { flex: 0 0 100px; font-size: 13px; line-height: 18px; font-weight: 600; overflow-wrap: anywhere; }
.ep-satir .stok { flex: 0 0 132px; display: flex; align-items: center; gap: 7px; font-size: 13px; line-height: 18px; font-weight: 600; white-space: nowrap; }
.stok-d { display: inline-flex; align-items: center; gap: 7px; font-weight: 600; color: var(--ep-yesil); }
.stok-d::before { content: ""; flex: 0 0 8px; width: 8px; height: 8px; border-radius: 50%; background: var(--ep-yesil-nokta); }
.stok-d.out { color: var(--ep-celik); }
.stok-d.out::before { background: transparent; box-shadow: inset 0 0 0 1.5px var(--ep-celik); }
.stok-d .mono { font-family: var(--ep-font-mono); }
.ep-satir .fiyat { flex: 0 0 168px; text-align: right; }
.ep-satir .fiyat .tutar { font-family: var(--ep-font-mono); font-size: 16px; line-height: 20px; font-weight: 600; white-space: nowrap; }
.ep-satir .fiyat .kdv { font-size: 11px; line-height: 14px; color: var(--ep-celik); }
.ep-satir .fiyat .net { font-family: var(--ep-font-mono); font-size: 11.5px; line-height: 16px; color: var(--ep-celik); white-space: nowrap; }
.ep-satir .fiyat .teklif-y { font-size: 13px; line-height: 18px; font-weight: 700; color: var(--ep-lacivert); }
.ep-satirlar.kompakt .fiyat { flex-basis: 124px; display: flex; flex-direction: column; align-items: flex-end; gap: 1px; }
.ep-satirlar.kompakt .fiyat .tutar { font-size: 15px; }
.ep-satirlar.kompakt .fiyat .stok-d { font-size: 12.5px; line-height: 16px; gap: 6px; }
.ep-satirlar.kompakt .fiyat .stok-d::before { flex-basis: 7px; width: 7px; height: 7px; }
.ep-satir .al { flex: 0 0 268px; display: flex; align-items: center; gap: 8px; margin: 0; }
.ep-satirlar.kompakt .al { flex-basis: 256px; }
.ep-satir .al form { display: contents; }
/* liste sütun başlığı */
.ep-satir-bas { min-height: 36px; padding: 0 14px; display: flex; align-items: center; gap: 0 16px; border-bottom: 1px solid var(--ep-cizgi); background: #fff; font-family: var(--ep-font-mono); font-size: 11.5px; line-height: 16px; letter-spacing: .06em; color: var(--ep-celik); }
.ep-satir-bas span:nth-child(1) { flex: 0 0 64px; } .ep-satir-bas span:nth-child(2) { flex: 1 1 220px; min-width: 0; }
.ep-satir-bas span:nth-child(3) { flex: 0 0 100px; } .ep-satir-bas span:nth-child(4) { flex: 0 0 132px; }
.ep-satir-bas span:nth-child(5) { flex: 0 0 168px; text-align: right; } .ep-satir-bas span:nth-child(6) { flex: 0 0 268px; }
.ep-satirlar:not(.kompakt) .ep-satir .kimlik .marka { display: none; }
/* Liste: dar kapta (≈ tablet/telefon) satır ızgaraya geçer: [görsel][kod/ad] / [görsel][stok][fiyat] / [adet + sepet] */
@container satir (max-width: 979px) {
  .ep-satir-bas { display: none; }
  .ep-satirlar:not(.kompakt) .ep-satir { display: grid; grid-template-columns: 64px minmax(0, 1fr) auto; grid-template-areas: "g k k" "g s f" "a a a"; gap: 6px 14px; align-items: center; }
  .ep-satirlar:not(.kompakt) .ep-satir .kimlik .marka { display: block; }
  .ep-satirlar:not(.kompakt) .ep-satir .marka-s { display: none; }
  .ep-satir .gorsel { grid-area: g; align-self: start; }
  .ep-satir .kimlik { grid-area: k; }
  .ep-satir .stok { grid-area: s; }
  .ep-satir .fiyat { grid-area: f; }
  .ep-satir .al { grid-area: a; }
}
/* Kompakt (ana sayfa, benzer ürünler): dar hücrede aynı ızgara */
@container satir (max-width: 599px) {
  .ep-satirlar.kompakt .ep-satir { display: grid; grid-template-columns: 64px minmax(0, 1fr) auto; grid-template-areas: "g k k" "g k k" "g . f" "a a a"; gap: 6px 14px; }
  .ep-satirlar.kompakt .gorsel { width: 64px; height: 64px; grid-area: g; align-self: start; }
  .ep-satirlar.kompakt .gorsel img { width: 54px; height: 54px; }
  .ep-satirlar.kompakt .kimlik { grid-area: k; }
  .ep-satirlar.kompakt .fiyat { grid-area: f; }
  .ep-satirlar.kompakt .al { grid-area: a; }
}
@container satir (max-width: 420px) {
  .ep-satirlar:not(.kompakt) .ep-satir { grid-template-areas: "g k k" "g s s" "g f f" "a a a"; }
  .ep-satirlar:not(.kompakt) .ep-satir .fiyat { text-align: left; }
}
/* Kart görünümü (katalogda düğmeyle; tercih tarayıcıda saklanır) */
.ep-satirlar[data-gorunum="kart"] { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(232px, 100%), 1fr)); border-right: 0; }
.ep-satirlar[data-gorunum="kart"] .ep-satir-bas { display: none; }
.ep-satirlar[data-gorunum="kart"] .ep-satir { display: flex; flex-direction: column; align-items: stretch; gap: 10px; border-right: 1px solid var(--ep-cizgi); }
.ep-satirlar[data-gorunum="kart"] .ep-satir .gorsel { width: 100%; height: 150px; flex: 0 0 auto; }
.ep-satirlar[data-gorunum="kart"] .ep-satir .gorsel img { width: 130px; height: 130px; }
.ep-satirlar[data-gorunum="kart"] .ep-satir .kimlik { flex: 0 0 auto; }
.ep-satirlar[data-gorunum="kart"] .ep-satir .kimlik .marka { display: block; }
.ep-satirlar[data-gorunum="kart"] .ep-satir .marka-s { display: none; }
.ep-satirlar[data-gorunum="kart"] .ep-satir .stok, .ep-satirlar[data-gorunum="kart"] .ep-satir .fiyat { flex: 0 0 auto; text-align: left; }
.ep-satirlar[data-gorunum="kart"] .ep-satir .al { flex: 0 0 auto; margin-top: auto; }

/* ───────── 8. Sayfa yolu ───────── */
.ep-yol { background: var(--ep-kagit); border-bottom: 1px solid var(--ep-cizgi); }
.ep-yol .ep-w { min-height: 44px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0 24px; font-size: 13px; line-height: 18px; }
.breadcrumb { font-size: 13px; line-height: 18px; color: var(--ep-celik); margin-bottom: 8px; }
.ep-yol .breadcrumb { margin: 0; }
.breadcrumb ol { display: flex; flex-wrap: wrap; align-items: center; gap: 0 6px; margin: 0; padding: 0; list-style: none; }
.breadcrumb li { display: flex; align-items: center; gap: 6px; }
.breadcrumb li:not(:last-child)::after { content: "›"; color: var(--ep-celik); }
.breadcrumb li:not(:last-child)::after { content: "›" / ""; }
.breadcrumb a { min-height: 44px; display: inline-flex; align-items: center; color: var(--ep-lacivert); }
.breadcrumb [aria-current] { font-weight: 600; color: var(--ep-lacivert); }
.breadcrumb .mono[aria-current], .breadcrumb [aria-current] .mono { font-family: var(--ep-font-mono); }
.breadcrumb span:not([aria-current]) { min-height: 44px; display: inline-flex; align-items: center; }

/* ───────── 9. Katalog ───────── */
.ep-katalog { padding-block: 20px 32px; display: flex; flex-direction: row-reverse; flex-wrap: wrap; align-items: flex-start; gap: 24px; }
.ep-katalog-m { flex: 999 1 560px; min-width: 0; }
.ep-katalog-bas { min-height: 36px; display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 2px 16px; }
.ep-katalog-bas h1 { font-family: var(--ep-font-baslik); font-size: 28px; line-height: 36px; font-weight: 700; letter-spacing: -0.02em; overflow-wrap: anywhere; }
.ep-katalog-bas .ep-meta { font-size: 12.5px; letter-spacing: .04em; }
.ep-arac { margin-top: 12px; min-height: 60px; padding: 6px 14px 7px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; background: var(--ep-kagit); border: 1px solid var(--ep-cizgi); border-top: 2px solid var(--ep-lacivert); }
.ep-arac .bilgi { font-size: 13.5px; line-height: 20px; }
.ep-arac .bilgi .mono { font-weight: 600; }
.ep-arac form { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin: 0; }
.ep-arac label { font-size: 13px; line-height: 18px; color: var(--ep-celik); }
.ep-arac select { height: 44px; padding: 0 10px; border: 1px solid var(--ep-cerceve); border-radius: var(--ep-r); background: #fff; color: var(--ep-lacivert); font-size: 13.5px; }
.ep-gorunum { height: 44px; display: flex; align-items: stretch; border-radius: var(--ep-r); background: #fff; box-shadow: inset 0 0 0 1px var(--ep-cerceve); }
.ep-gorunum button { width: 44px; padding: 0; border: 0; background: transparent; color: var(--ep-lacivert); display: grid; place-items: center; }
.ep-gorunum button:first-child { border-radius: var(--ep-r) 0 0 var(--ep-r); } .ep-gorunum button:last-child { border-radius: 0 var(--ep-r) var(--ep-r) 0; }
.ep-gorunum button[aria-pressed="true"] { background: var(--ep-lacivert); color: #fff; }
.ep-bos { padding: 36px 18px; text-align: center; border: 1px solid var(--ep-cizgi); border-top: 0; background: #fff; }
.ep-bos b { display: block; font-size: 15px; margin-bottom: 6px; }
.ep-bos p { color: var(--ep-celik); margin-bottom: 14px; }
.ep-kodyok-s { margin-top: 16px; min-height: 68px; padding: 11px 14px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; background: var(--ep-kagit); border: 1px solid var(--ep-cizgi); }
.ep-kodyok-s > div:first-child { flex: 1 1 380px; min-width: 0; font-size: 13.5px; line-height: 20px; }
.ep-kodyok-s > div:first-child span { color: var(--ep-celik); }
.ep-kodyok-s .dugmeler { display: flex; flex-wrap: wrap; gap: 8px; }
.ep-sayfalama { margin-top: 16px; min-height: 44px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; }
.ep-sayfalama .bilgi { font-size: 13px; color: var(--ep-celik); }
.ep-sayfalama .bilgi .mono { font-weight: 600; color: var(--ep-lacivert); }
.ep-sayfalama ol { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; margin: 0; padding: 0; list-style: none; }
.ep-sayfalama a, .ep-sayfalama .on, .ep-sayfalama .pasif { min-width: 44px; height: 44px; display: flex; align-items: center; justify-content: center; gap: 6px; padding: 0 8px; border: 1px solid var(--ep-cizgi); border-radius: var(--ep-r); background: #fff; color: var(--ep-lacivert); font-family: var(--ep-font-mono); font-size: 14px; font-weight: 500; text-decoration: none; }
.ep-sayfalama a:hover { border-color: var(--ep-lacivert); }
.ep-sayfalama .on { border-color: var(--ep-lacivert); background: var(--ep-lacivert); color: #fff; font-weight: 600; }
.ep-sayfalama .ok-d { font-family: var(--ep-font); font-size: 13.5px; font-weight: 600; padding: 0 14px; }
.ep-sayfalama .pasif { color: var(--ep-celik); border-style: dashed; }
.ep-sayfalama .el { min-width: 28px; justify-content: center; color: var(--ep-celik); font-family: var(--ep-font-mono); }

/* Sol ray (kategoriler + filtreler) */
.ep-ray-k { flex: 1 1 248px; min-width: 0; }
.ep-ray { border: 1px solid var(--ep-cizgi); border-top: 2px solid var(--ep-lacivert); background: #fff; }
.ep-ray > summary { display: none; }
.ep-ray h2 { min-height: 40px; padding: 0 14px; display: flex; align-items: center; background: var(--ep-kagit); border-bottom: 1px solid var(--ep-cizgi); font-family: var(--ep-font-mono); font-size: 11.5px; line-height: 16px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; }
.ep-ray h2 + * { margin-top: 0; }
.ep-ray * + h2 { margin-top: -1px; border-top: 1px solid var(--ep-cizgi); }
.ep-ray summary + h2 { margin-top: 0; border-top: 0; }
.ep-ray a.r, .ep-ray .r { min-height: 44px; padding: 0 14px; display: flex; align-items: center; justify-content: space-between; gap: 8px; border-bottom: 1px solid var(--ep-cizgi); background: #fff; color: var(--ep-lacivert); font-size: 13.5px; line-height: 18px; font-weight: 600; text-decoration: none; }
.ep-ray a.r:hover { background: var(--ep-kagit); }
.ep-ray a.r .say { font-family: var(--ep-font-mono); font-size: 12px; font-weight: 400; color: var(--ep-celik); }
.ep-ray a.r[aria-current] { background: var(--ep-lacivert); color: #fff; border-bottom-color: var(--ep-lacivert); font-weight: 700; }
.ep-ray a.r[aria-current] .say { color: #fff; font-weight: 600; }
.ep-ray a.r.alt { padding-left: 28px; font-size: 13px; font-weight: 400; border-bottom-color: var(--ep-cizgi-ince); }
.ep-ray a.r.alt[aria-current] { font-weight: 700; }
.ep-ray a.r.alt + a.r:not(.alt) { border-top: 1px solid var(--ep-cizgi); margin-top: -1px; }
/* onay kutusu görünümlü filtre bağlantıları */
.ep-ray a.k { min-height: 44px; padding: 0 14px; display: flex; align-items: center; gap: 10px; border-bottom: 1px solid var(--ep-cizgi-ince); color: var(--ep-lacivert); font-size: 13.5px; line-height: 18px; text-decoration: none; }
.ep-ray a.k:hover { background: var(--ep-kagit); }
.ep-ray a.k::before { content: ""; flex: 0 0 18px; width: 18px; height: 18px; border: 1.5px solid var(--ep-cerceve); border-radius: 2px; background: #fff; }
.ep-ray a.k[aria-current]::before { border-color: var(--ep-lacivert); background: var(--ep-lacivert) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / 14px no-repeat; }
.ep-ray a.k[aria-current] { font-weight: 700; }
.ep-ray a.k .say { margin-left: auto; font-family: var(--ep-font-mono); font-size: 12px; color: var(--ep-celik); }
.ep-ray a.k.temizle { color: var(--ep-lacivert); font-weight: 600; text-decoration: underline; }
.ep-ray a.k.temizle::before { display: none; }
.ep-ray .fiyat-f { padding: 12px 14px 14px; }
.ep-ray .fiyat-f .iki { display: flex; align-items: flex-end; gap: 8px; }
.ep-ray .fiyat-f .iki > div { flex: 1 1 0; min-width: 0; }
.ep-ray .fiyat-f label { display: block; margin-bottom: 4px; font-size: 12px; line-height: 16px; color: var(--ep-celik); }
.ep-ray .fiyat-f input { width: 100%; height: 44px; padding: 0 10px; border: 1px solid var(--ep-cerceve); border-radius: var(--ep-r); background: #fff; color: var(--ep-lacivert); font-family: var(--ep-font-mono); font-size: 14px; }
.ep-ray .fiyat-f .ep-btn { width: 100%; margin-top: 10px; }
/* Dar ekranda ray, katalog başlığının ALTINDA açılır-kapanır (details/summary) */
@media (max-width: 899.98px) {
  .ep-katalog { flex-direction: column; }
  .ep-ray-k { flex: 0 0 auto; width: 100%; order: -1; }
  .ep-ray > summary { min-height: 48px; padding: 0 14px; display: flex; align-items: center; justify-content: space-between; gap: 10px; cursor: pointer; font-weight: 700; list-style: none; }
  .ep-ray > summary::-webkit-details-marker { display: none; }
  .ep-ray > summary .ic { transition: transform .15s; }
  .ep-ray[open] > summary { border-bottom: 1px solid var(--ep-cizgi); }
  .ep-ray[open] > summary .ic { transform: rotate(90deg); }
  .ep-ray > summary .ozet { font-weight: 400; color: var(--ep-celik); font-size: 13px; margin-left: auto; }
  .ep-katalog-m { flex: 1 1 auto; width: 100%; }
}

/* ───────── 10. Ürün sayfası ───────── */
.ep-yol .ep-w > nav + nav { display: flex; flex-wrap: wrap; gap: 0 16px; }
.ep-urun { padding-block: 20px 24px; display: flex; flex-wrap: wrap; align-items: flex-start; gap: 24px; }
.ep-galeri { flex: 0 0 auto; width: min(480px, 100%); }
.ep-gorsel-k { position: relative; width: 100%; aspect-ratio: 1 / 1; max-height: 480px; padding: 24px; display: flex; align-items: center; justify-content: center; border: 1px solid var(--ep-cizgi); background: #fff; color: var(--ep-cerceve); }
.ep-gorsel-k img { display: block; width: 100%; height: 100%; object-fit: contain; }
.ep-gorsel-k iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; background: #fff; z-index: 2; }
.ep-kucuk { margin-top: 10px; display: flex; flex-wrap: wrap; gap: 8px; padding: 0; list-style: none; }
.ep-kucuk button, .ep-kucuk a { width: 64px; height: 64px; padding: 4px; border: 1px solid var(--ep-cizgi); border-radius: 2px; background: #fff; color: var(--ep-lacivert); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; font-size: 10.5px; line-height: 12px; font-weight: 700; text-align: center; text-decoration: none; }
.ep-kucuk button img { width: 100%; height: 100%; object-fit: contain; }
.ep-kucuk button[aria-pressed="true"] { border-color: var(--ep-lacivert); box-shadow: inset 0 0 0 1px var(--ep-lacivert); }
.ep-kucuk button:hover, .ep-kucuk a:hover { border-color: var(--ep-lacivert); }
.ep-bilgi { flex: 999 1 380px; min-width: 0; }
.ep-bilgi .ust { font-family: var(--ep-font-mono); font-size: 12px; line-height: 16px; letter-spacing: .08em; color: var(--ep-celik); text-transform: uppercase; }
.ep-bilgi h1 { margin-top: 4px; font-family: var(--ep-font-mono); font-size: 30px; line-height: 38px; font-weight: 600; letter-spacing: -0.01em; overflow-wrap: anywhere; }
.ep-bilgi .ad { margin-top: 4px; font-size: 17px; line-height: 24px; font-weight: 500; }
.ep-dl { margin: 16px 0 0; border-top: 1px solid var(--ep-cizgi); }
.ep-dl > div { min-height: 44px; display: flex; align-items: center; gap: 12px; border-bottom: 1px solid var(--ep-cizgi-ince); font-size: 14px; line-height: 20px; padding-block: 4px; }
.ep-dl dt { flex: 0 0 150px; font-size: 13px; line-height: 18px; color: var(--ep-celik); }
.ep-dl dd { margin: 0; min-width: 0; }
.ep-dl dd a { min-height: 44px; display: inline-flex; align-items: center; gap: 6px; font-weight: 600; }
.ep-dl dd .yol { display: flex; flex-wrap: wrap; align-items: center; gap: 0 6px; }
.ep-al-kutu { flex: 0 0 auto; width: min(380px, 100%); padding: 18px; border: 2px solid var(--ep-lacivert); background: #fff; }
.ep-al-kutu .kdv-e { font-size: 12px; line-height: 16px; color: var(--ep-celik); }
.ep-al-kutu .tutar { margin-top: 2px; font-family: var(--ep-font-mono); font-size: 30px; line-height: 36px; font-weight: 600; letter-spacing: -0.01em; }
.ep-al-kutu .net { margin-top: 2px; font-size: 13px; line-height: 18px; color: var(--ep-celik); }
.ep-al-kutu .net .mono { color: var(--ep-lacivert); }
.ep-al-kutu .teklif-baslik { font-family: var(--ep-font-baslik); font-size: 20px; line-height: 26px; font-weight: 700; }
.ep-al-kutu .stok-b { margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--ep-cizgi); }
.ep-al-kutu .stok-b .stok-d { font-size: 15px; line-height: 20px; font-weight: 700; }
.ep-al-kutu .stok-b .stok-d::before { flex-basis: 9px; width: 9px; height: 9px; }
.ep-al-kutu .stok-b p { margin-top: 4px; font-size: 13px; line-height: 18px; color: var(--ep-celik); }
.ep-al-kutu .satin { margin-top: 14px; display: flex; align-items: flex-end; gap: 8px; }
.ep-al-kutu .satin label { display: block; margin-bottom: 4px; font-size: 12px; line-height: 16px; color: var(--ep-celik); }
.ep-al-kutu .satin .ep-sepete { min-height: 48px; font-size: 16px; gap: 8px; }
.ep-al-kutu .ep-teklif-b { margin-top: 8px; width: 100%; font-size: 14.5px; }
.ep-al-kutu .ikincil { margin-top: 6px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0 8px; }
.ep-al-kutu .ikincil button, .ep-al-kutu .ikincil a { min-height: 44px; padding: 0 4px; display: flex; align-items: center; gap: 7px; border: 0; background: transparent; color: var(--ep-lacivert); font-size: 13.5px; font-weight: 600; text-decoration: none; }
.ep-al-kutu .ikincil a:hover, .ep-al-kutu .ikincil button:hover { text-decoration: underline; }
.ep-al-kutu .gercek { margin: 10px 0 0; padding: 12px 0 0; display: flex; flex-direction: column; gap: 8px; border-top: 1px solid var(--ep-cizgi); font-size: 13px; line-height: 18px; list-style: none; }
.ep-al-kutu .gercek li { display: flex; align-items: flex-start; gap: 9px; }
.ep-al-kutu .gercek .ic { width: 16px; height: 16px; margin-top: 1px; }
.ep-lot { margin-top: 8px; font-size: 12.5px; line-height: 18px; color: var(--ep-celik); display: flex; gap: 6px; align-items: flex-start; }
[data-fav][aria-pressed="true"] .ic { fill: var(--ep-lacivert); }

.ep-bolum-nav { background: #fff; border-top: 1px solid var(--ep-cizgi); border-bottom: 2px solid var(--ep-lacivert); }
.ep-bolum-nav .ep-w { min-height: 48px; display: flex; flex-wrap: wrap; align-items: stretch; justify-content: space-between; gap: 0 24px; }
.ep-bolum-nav nav ul { display: flex; flex-wrap: wrap; align-items: stretch; gap: 0 4px; height: 100%; }
.ep-bolum-nav nav a { min-height: 48px; padding: 0 14px; display: flex; align-items: center; color: var(--ep-lacivert); font-size: 14px; line-height: 20px; font-weight: 600; text-decoration: none; white-space: nowrap; }
.ep-bolum-nav nav a:hover { background: var(--ep-kagit); box-shadow: inset 0 -3px 0 var(--ep-amber); }
.ep-bolum-nav .ozet { display: flex; flex-wrap: wrap; align-items: center; gap: 0 14px; font-family: var(--ep-font-mono); font-size: 13px; line-height: 18px; }
.ep-bolum-nav .ozet b { font-weight: 600; } .ep-bolum-nav .ozet span { color: var(--ep-celik); }
@media (max-width: 720px) { .ep-bolum-nav .ozet { display: none; } .ep-bolum-nav nav ul { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; } .ep-bolum-nav .ep-w { padding-inline: 0; } }

.ep-detay { padding-block: 20px 0; display: flex; flex-wrap: wrap; align-items: flex-start; gap: 24px; }
.ep-detay > section:first-child { flex: 999 1 560px; min-width: 0; }
.ep-detay > .yan { flex: 1 1 400px; min-width: 0; display: flex; flex-direction: column; gap: 16px; }
[id] { scroll-margin-top: 12px; }
.ep-ozellik { margin: 0; border: 1px solid var(--ep-cizgi); border-top: 0; }
.ep-ozellik > div { min-height: 36px; display: flex; align-items: center; border-bottom: 1px solid var(--ep-cizgi-ince); background: #fff; font-size: 13.5px; line-height: 20px; padding-block: 4px; }
.ep-ozellik > div:nth-child(even) { background: var(--ep-kagit); }
.ep-ozellik > div:last-child { border-bottom: 0; }
.ep-ozellik dt { flex: 0 0 38%; padding: 0 14px; font-weight: 600; }
.ep-ozellik dd { flex: 1 1 auto; min-width: 0; margin: 0; padding: 0 14px 0 0; font-family: var(--ep-font-mono); overflow-wrap: anywhere; }
.ep-ozellik dd a { font-family: var(--ep-font); }
.ep-aciklama { padding: 16px 14px; border: 1px solid var(--ep-cizgi); border-top: 0; font-size: 14px; line-height: 22px; overflow-x: auto; }
.ep-aciklama p + p, .ep-aciklama ul, .ep-aciklama ol { margin-top: 10px; }
.ep-aciklama ul, .ep-aciklama ol { padding-left: 20px; }
.ep-aciklama table { width: 100%; font-size: 13px; }
.ep-aciklama td, .ep-aciklama th { border: 1px solid var(--ep-cizgi); padding: 6px 8px; text-align: left; }
.ep-aciklama .kisa { font-weight: 600; margin-bottom: 10px; }
.ep-kutu-l { border: 1px solid var(--ep-cizgi); border-top: 0; }
.ep-kutu-l > div { min-height: 50px; padding: 6px 14px; display: flex; align-items: center; gap: 12px; border-bottom: 1px solid var(--ep-cizgi-ince); }
.ep-kutu-l > div:last-child { border-bottom: 0; }
.ep-kutu-l .b { font-size: 14px; line-height: 20px; font-weight: 600; }
.ep-kutu-l .a { font-size: 13px; line-height: 18px; color: var(--ep-celik); }
.ep-kutu-l .dok { flex: 1 1 auto; min-width: 0; font-size: 14px; line-height: 20px; font-weight: 600; }
.ep-kutu-l .tur { padding: 1px 6px; border: 1px solid var(--ep-cerceve); border-radius: 2px; font-family: var(--ep-font-mono); font-size: 11.5px; line-height: 16px; }
.ep-kutu-l .ind { min-height: 44px; padding: 0 12px; display: flex; align-items: center; gap: 6px; border: 1px solid var(--ep-lacivert); border-radius: var(--ep-r); color: var(--ep-lacivert); font-size: 13.5px; font-weight: 600; text-decoration: none; white-space: nowrap; }
.ep-kutu-l .ind:hover { background: var(--ep-kagit); }
.ep-kutu-l .sor { flex-wrap: wrap; gap: 0 6px; font-size: 13px; line-height: 18px; color: var(--ep-celik); min-height: 44px; }
.ep-kutu-l .sor a { min-height: 44px; display: flex; align-items: center; font-weight: 600; }
.ep-benzer { padding-block: 24px 32px; }

/* ───────── 11. Genel sayfa bileşenleri (sepet, ödeme, hesap, formlar…) ───────── */
.page { max-width: var(--ep-max); margin: 0 auto; padding: 16px var(--ep-yan) 40px; }
.h1 { font-family: var(--ep-font-baslik); font-size: 26px; line-height: 32px; font-weight: 700; letter-spacing: -0.02em; margin: 0 0 4px; color: var(--ep-lacivert); }
.h2, .cardh { font-family: var(--ep-font-baslik); font-size: 17px; line-height: 24px; font-weight: 700; letter-spacing: -0.01em; margin: 0 0 8px; }
.lead { color: var(--ep-celik); margin: 4px 0 16px; font-size: 14px; line-height: 21px; }
.card { background: #fff; border: 1px solid var(--ep-cizgi); border-top: 2px solid var(--ep-lacivert); padding: 18px; min-width: 0; }
.card .card { border-top-width: 1px; }
.narrow { max-width: 480px; margin: 8px auto; }
.split { display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: 24px; align-items: start; }
@media (max-width: 900px) { .split { grid-template-columns: minmax(0, 1fr); } }
.sb-h { font-family: var(--ep-font-mono); font-size: 11.5px; line-height: 16px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--ep-lacivert); padding: 0 0 10px; margin-bottom: 10px; border-bottom: 1px solid var(--ep-cizgi); }
.card > .sb-h:first-child { margin-top: -2px; }
.sb { display: flex; flex-direction: column; gap: 12px; }
.sb-box { background: #fff; border: 1px solid var(--ep-cizgi); border-top: 2px solid var(--ep-lacivert); }
.sb-box .sb-h { min-height: 40px; display: flex; align-items: center; padding: 0 14px; margin: 0; background: var(--ep-kagit); }
.sb-list { padding: 0; }
.sb-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 44px; padding: 0 14px; font-size: 13.5px; color: var(--ep-lacivert); border-bottom: 1px solid var(--ep-cizgi-ince); text-decoration: none; }
.sb-list .sb-row:last-child { border-bottom: 0; }
a.sb-row:hover { background: var(--ep-kagit); }
.sb-row.on { background: var(--ep-lacivert); color: #fff; font-weight: 700; }
label.sb-row { cursor: pointer; }
label.sb-row:has(input:checked) { border-color: var(--ep-lacivert) !important; box-shadow: inset 0 0 0 1px var(--ep-lacivert); background: var(--ep-lacivert-50); }
.dtable { width: 100%; border-collapse: collapse; font-size: 13.5px; }
.dtable th, .dtable td { padding: 10px 12px; border-bottom: 1px solid var(--ep-cizgi-ince); text-align: left; vertical-align: middle; }
.dtable thead th, .dtable > tr:first-child > th { font-family: var(--ep-font-mono); font-size: 11.5px; line-height: 16px; font-weight: 500; letter-spacing: .06em; text-transform: uppercase; color: var(--ep-celik); background: var(--ep-kagit); border-bottom-color: var(--ep-cizgi); white-space: nowrap; }
.dtable tbody th { font-weight: 600; color: var(--ep-lacivert); }
.ep-tablo, .ep-tablo-k { width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.pill { display: inline-flex; align-items: center; gap: 5px; padding: 2px 8px; border-radius: 2px; font-size: 12px; line-height: 18px; font-weight: 600; border: 1px solid transparent; white-space: nowrap; }
.pill.ok { background: var(--ep-yesil-zemin); color: var(--ep-yesil); }
.pill.warn { background: var(--ep-uyari-zemin); color: var(--ep-uyari); }
.pill.bad { background: var(--ep-kirmizi-zemin); color: var(--ep-kirmizi); }
.pill.blue { background: var(--ep-lacivert-50); color: var(--ep-lacivert); border-color: var(--ep-cizgi); }
.p-brand { font-family: var(--ep-font-mono); font-size: 11px; line-height: 14px; letter-spacing: .06em; text-transform: uppercase; color: var(--ep-celik); }
.p-code { display: inline-block; font-family: var(--ep-font-mono); font-size: 13px; font-weight: 600; color: var(--ep-lacivert); }
.pimg-wrap { display: flex; align-items: center; justify-content: center; background: #fff; color: var(--ep-cerceve); }
.pimg-wrap img { object-fit: contain; }
.qty-input { font-family: var(--ep-font-mono); font-weight: 600; text-align: center; }
.static-content { font-size: 15px; line-height: 24px; }
.static-content > * + * { margin-top: 12px; }
.static-content h2, .static-content h3 { font-family: var(--ep-font-baslik); line-height: 1.3; margin-top: 22px; }
.static-content h2 { font-size: 20px; } .static-content h3 { font-size: 17px; }
.static-content ul, .static-content ol { padding-left: 22px; }
.static-content img { max-width: 100%; height: auto; margin: 12px 0; }
.static-content figure { margin: 14px 0; } .static-content figcaption { font-size: 13px; color: var(--ep-celik); text-align: center; margin-top: 4px; }
.static-content a { font-weight: 600; }
.static-content table { width: 100%; display: block; overflow-x: auto; }
.static-content td, .static-content th { border: 1px solid var(--ep-cizgi); padding: 6px 8px; }
.ep-iki { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 12px; }
@media (max-width: 520px) { .ep-iki { grid-template-columns: minmax(0, 1fr); } }
.ep-ozet-s { display: flex; justify-content: space-between; gap: 12px; padding: 6px 0; font-size: 13.5px; }
.ep-ozet-s span:first-child { color: var(--ep-celik); }
.ep-ozet-s strong, .ep-ozet-s .mono { font-family: var(--ep-font-mono); font-weight: 600; white-space: nowrap; }
.ep-ozet-s.toplam { padding-top: 12px; margin-top: 6px; border-top: 1px solid var(--ep-cizgi); font-size: 15px; font-weight: 700; }
.ep-ozet-s.toplam span:first-child { color: var(--ep-lacivert); }
.ep-ozet-s.toplam strong { font-size: 18px; }
.ep-ozet-s.indirim, .ep-ozet-s.indirim span:first-child { color: var(--ep-yesil); font-weight: 600; }
.ep-ayrac { border: 0; border-top: 1px solid var(--ep-cizgi); margin: 16px 0; }
.ep-ikon-yuvarlak { width: 56px; height: 56px; border-radius: 50%; display: grid; place-items: center; margin: 0 auto 14px; }
.ep-ikon-yuvarlak.ok { background: var(--ep-yesil-zemin); color: var(--ep-yesil); }
.ep-ikon-yuvarlak.bad { background: var(--ep-kirmizi-zemin); color: var(--ep-kirmizi); }
.ep-ikon-yuvarlak.bilgi { background: var(--ep-lacivert-50); color: var(--ep-lacivert); }
.ep-ikon-yuvarlak .ic { width: 28px; height: 28px; }
.ep-kutu-uyari { padding: 12px 14px; border: 1px solid; font-size: 13.5px; line-height: 20px; }
.ep-kutu-uyari.ok { background: var(--ep-yesil-zemin); border-color: color-mix(in srgb, var(--ep-yesil) 30%, #fff); color: var(--ep-yesil); }
.ep-kutu-uyari.bilgi { background: var(--ep-kagit); border-color: var(--ep-cizgi); color: var(--ep-lacivert); }
.ep-kutu-uyari.warn { background: var(--ep-uyari-zemin); border-color: color-mix(in srgb, var(--ep-uyari) 30%, #fff); color: var(--ep-uyari); }
/* Fatura tipi seçimi (Bireysel / Tüzel) — seçili kart :has(:checked) ile; JS de .on verir */
.bt-seg { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-bottom: 14px; }
.bt-opt { position: relative; display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; padding: 8px 12px; border: 1px solid var(--ep-cerceve); border-radius: var(--ep-r); background: #fff; color: var(--ep-lacivert); font-weight: 600; font-size: 13.5px; line-height: 18px; text-align: center; cursor: pointer; }
.bt-opt input { position: absolute; opacity: 0; width: 1px; height: 1px; pointer-events: none; }
.bt-opt:has(input:checked), .bt-opt.on { background: var(--ep-lacivert); border-color: var(--ep-lacivert); color: #fff; }
.bt-opt:has(input:focus-visible) { outline: 2px solid var(--ep-lacivert); outline-offset: 2px; }
@media (max-width: 420px) { .bt-seg { grid-template-columns: minmax(0, 1fr); } }

/* ───────── 12. Alt bilgi ───────── */
.ep-alt { background: var(--ep-lacivert); color: var(--ep-alt-yazi); font-size: 13.5px; line-height: 20px; }
.ep-alt a { color: #fff; text-decoration: none; }
.ep-alt a:hover { text-decoration: underline; color: #fff; }
.ep-alt-izgara { padding-block: 32px; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr)); gap: 28px 32px; align-items: start; }
.ep-alt-izgara > div { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.ep-alt h2 { margin: 0 0 4px; font-family: var(--ep-font-mono); font-size: 11.5px; line-height: 20px; font-weight: 500; letter-spacing: .08em; color: var(--ep-alt-soluk); text-transform: uppercase; }
.ep-alt .ep-logo { height: 44px; align-self: flex-start; }
.ep-alt .ep-wordmark { font-size: 21px; line-height: 26px; }
.ep-alt .iso { font-family: var(--ep-font-mono); font-size: 12px; line-height: 18px; color: var(--ep-alt-soluk); }
.ep-alt-l { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 16px; padding: 0; margin: 0; list-style: none; }
.ep-alt-l a { min-height: 44px; display: flex; align-items: center; }
.ep-alt-l.tek { grid-template-columns: minmax(0, 1fr); }
.ep-alt .tel-b { min-height: 44px; display: flex; align-items: center; gap: 8px; font-family: var(--ep-font-mono); font-size: 16px; font-weight: 600; }
.ep-alt .posta-b { min-height: 44px; display: flex; align-items: center; gap: 8px; overflow-wrap: anywhere; }
.ep-alt-logolar { display: flex; flex-wrap: wrap; gap: 10px; }
.ep-alt-logolar img { height: 44px; width: auto; max-width: 140px; object-fit: contain; background: #fff; padding: 6px 10px; border-radius: 2px; }
/* Satıcı yasal kimlik bloğu (Google Merchant: satıcı kimliği sitede açıkça yazmalı) */
.ep-yasal { border-top: 1px solid rgba(255, 255, 255, .14); }
.ep-yasal .ep-w { padding-block: 20px; display: grid; grid-template-columns: minmax(0, 220px) minmax(0, 1fr); gap: 12px 32px; align-items: start; }
.ep-yasal dl { margin: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(260px, 100%), 1fr)); gap: 8px 28px; }
.ep-yasal dl > div { min-width: 0; }
.ep-yasal dt { font-family: var(--ep-font-mono); font-size: 11px; line-height: 16px; letter-spacing: .08em; color: var(--ep-alt-soluk); text-transform: uppercase; }
.ep-yasal dd { margin: 2px 0 0; color: #fff; font-size: 13.5px; line-height: 20px; overflow-wrap: anywhere; }
@media (max-width: 760px) { .ep-yasal .ep-w { grid-template-columns: minmax(0, 1fr); } }
.ep-sozlesme-l { border-top: 1px solid rgba(255, 255, 255, .14); }
.ep-sozlesme-l ul { display: flex; flex-wrap: wrap; gap: 0 20px; padding: 6px 0; margin: 0; list-style: none; }
.ep-sozlesme-l a { min-height: 44px; display: flex; align-items: center; font-size: 13px; }
.ep-odeme-s { background: #fff; border-top: 1px solid var(--ep-cizgi); }
.ep-odeme-s .ep-w { padding-block: 14px; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 12px 22px; }
.ep-odeme-s img { height: 26px; width: auto; display: block; }
/* ETBİS kare kodu (sağ konumlu footer logosu) — iletişim sütununda adres altında; koyu zeminde beyaz kart */
.ep-alt-etbis { margin-top: 14px; }
.ep-alt-etbis img { display: block; width: 104px; height: auto; background: #fff; padding: 6px; border-radius: 4px; }
.ep-alt-son { background: var(--ep-lacivert-koyu); color: var(--ep-alt-soluk); }
.ep-alt-son .ep-w { min-height: 44px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 2px 24px; font-size: 12.5px; line-height: 18px; padding-block: 8px; }

/* Çerez bildirimi + yüzen WhatsApp */
.ep-cerez { position: fixed; left: 0; right: 0; bottom: 0; z-index: 250; background: #fff; border-top: 2px solid var(--ep-lacivert); box-shadow: 0 -6px 24px rgba(12, 28, 54, .12); }
.ep-cerez .ep-w { padding-block: 12px; display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; }
.ep-cerez p { flex: 1 1 260px; font-size: 13.5px; line-height: 20px; color: var(--ep-lacivert); }
.ep-cerez .dugmeler { display: flex; gap: 8px; }
.ep-wa { position: fixed; right: 20px; bottom: 20px; z-index: 300; width: 54px; height: 54px; border-radius: 50%; background: #128C7E; color: #fff; display: grid; place-items: center; box-shadow: 0 8px 24px -6px rgba(18, 140, 126, .6); }
.ep-wa:hover { color: #fff; background: #0E7266; }
.ep-wa svg { width: 30px; height: 30px; }
body:has(.ep-cerez:not([hidden])) .ep-wa { bottom: 96px; }
@media print { .ep-ust, .ep-bant, .ep-nav, .ep-servis, .ep-alt, .ep-cerez, .ep-wa { display: none !important; } }

/* ───────── 13. Ek parçalar ───────── */
.ep-kat-l .yalniz-dar { display: none; }
@media (max-width: 899.98px) {
  .ep-kat:popover-open .ep-kat-l .yalniz-dar { display: block; }
  .ep-nav .genis { display: none; }
}
.ep-fav-sil { flex: 0 0 44px; width: 44px; height: 44px; display: grid; place-items: center; padding: 0; border: 1px solid var(--ep-cerceve); border-radius: var(--ep-r); background: #fff; color: var(--ep-lacivert); }
.ep-fav-sil:hover { border-color: var(--ep-kirmizi); color: var(--ep-kirmizi); }
.ep-satirlar.fav .ep-satir .al { flex-basis: 320px; }
.ep-satirlar.fav .ep-satir-bas span:nth-child(6) { flex-basis: 320px; }
.ep-blok { padding: 16px 0 0; }
.ep-blog-l { grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr)); }
.ep-blog-l a { display: flex; gap: 14px; padding: 14px; min-height: 96px; color: var(--ep-lacivert); text-decoration: none; }
.ep-blog-l a:hover { background: var(--ep-kagit); }
.ep-blog-l .g { flex: 0 0 96px; width: 96px; height: 68px; background: var(--ep-kagit); display: grid; place-items: center; color: var(--ep-cerceve); overflow: hidden; }
.ep-blog-l .g img { width: 100%; height: 100%; object-fit: cover; }
.ep-blog-l .t { font-weight: 700; font-size: 14px; line-height: 19px; }
.ep-blog-l .d { font-family: var(--ep-font-mono); font-size: 11.5px; color: var(--ep-celik); margin-bottom: 3px; }
.ep-blog-l .o { font-size: 13px; line-height: 18px; color: var(--ep-celik); margin-top: 3px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; overflow: hidden; }
.ep-sayfa-bloklari:empty { display: none; }
.ep-detay > .ana { flex: 999 1 560px; min-width: 0; display: flex; flex-direction: column; gap: 16px; }
.ep-blog-l .d, .ep-blog-l .t { display: block; }
.ep-satir .gorsel:empty, .ep-kucuk li:empty { background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238792A2' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3.5' y='4.5' width='17' height='15' rx='1.5'/%3E%3Ccircle cx='9' cy='10' r='1.6'/%3E%3Cpath d='M4 17l5-4.5 3.5 3 2.5-2 4.5 3.5'/%3E%3C/svg%3E") center / 28px no-repeat; }
.ep-gorsel-k:not(:has(img)) { background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238792A2' stroke-width='1.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3.5' y='4.5' width='17' height='15' rx='1.5'/%3E%3Ccircle cx='9' cy='10' r='1.6'/%3E%3Cpath d='M4 17l5-4.5 3.5 3 2.5-2 4.5 3.5'/%3E%3C/svg%3E") center / 96px no-repeat #fff; }
.ep-bolum-nav nav ul { list-style: none; margin: 0; padding: 0; }
/* Kompakt satır (ana sayfa / benzer): sipariş kodu okunsun diye fiyat ve sepet sütunu daraltıldı (dokunma hedefleri 44 px kalır) */
.ep-satirlar.kompakt .kimlik { flex-basis: 160px; }
.ep-satirlar.kompakt .fiyat { flex-basis: 112px; }
.ep-satirlar.kompakt .al { flex-basis: 244px; }
.ep-satirlar.kompakt .ep-adet { flex-basis: 120px; width: 120px; }
p > .ic, .ep-not > .ic, .lead > .ic { display: inline-block; vertical-align: -3px; margin-right: 4px; }
.om-acc > .card + .card, .om-acc > .card + script + .card { margin-top: 16px; }
.ep-bolum-nav nav { min-width: 0; max-width: 100%; }
@media (max-width: 720px) { .ep-bolum-nav nav { flex: 1 1 100%; } .ep-bolum-nav nav ul { padding-inline: 8px; } }
/* Telefonda ana sayfa kategori sütunları yalnız ana kategorileri gösterir (alt kategoriler kategori sayfasının rayında) */
@media (max-width: 640px) { .ep-kat-sutun > a:not(.ana) { display: none; } .ep-kat-sutun > a.ana { border-bottom-color: var(--ep-cizgi-ince); } }
.ep-ust-ek { display: contents; }
@media (max-width: 720px) {
  .ep-ust-ek { display: none; }
  .ep-ust .ep-w { justify-content: center; }
}
@media (max-width: 400px) { .ep-ust .saat2 { display: none; } }
@media (max-width: 480px) {
  .ep-eylem > a .etk { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .ep-eylem > a { min-width: 44px; padding: 0; }
  .ep-eylem .ep-sepet { padding: 0 8px; }
  .ep-eylem .ep-fav .ep-rozet { right: -2px; }
  .ep-sayac { grid-template-columns: repeat(4, minmax(0, 1fr)); max-width: none; }
  .ep-sayac > div { padding: 8px 8px; }
  .ep-sayac dd { font-size: 17px; line-height: 22px; }
  .ep-giris h1 { font-size: 23px; line-height: 29px; }
}
@media (max-width: 720px) {
  .ep-gorsel-k { max-height: 300px; padding: 12px; }
  .ep-dl .ad-satir { display: none; }
  .ep-bilgi h1 { font-size: 24px; line-height: 30px; }
  .ep-dl dt { flex-basis: 120px; }
}
/* Dokunma hedefleri ≥ 44 px (dar ekran / dokunmatik) */
.ep-ust a { min-height: 36px; }
@media (max-width: 720px), (pointer: coarse) { .ep-ust a { min-height: 44px; } }
.ep-adet button { flex-basis: 44px; }
a.p-code { display: inline-flex; align-items: center; min-height: 44px; }
.om-acc .seg label { min-height: 44px; }
.field input::placeholder, .field textarea::placeholder, .ep-girdi::placeholder { opacity: 1; }
.ep-main:focus { outline: none; }
.ep-nav .ep-nav-tum[aria-current] { background: var(--ep-lacivert); color: #fff; box-shadow: inset 0 -3px 0 var(--ep-amber); }
/* 2. tur (2026-11-13) — gözden geçirme düzeltmeleri */
/* Yatay taşma: görsel olarak gizli (.vh) öğe, konumlanmamış kaydırma kutusundan kaçıp sayfayı genişletiyordu (sepet/teklif/hesap tabloları) */
.ep-tablo, .ep-tablo-k { position: relative; }
.vh { top: 0; left: 0; clip-path: inset(50%); }
/* Branding logosu (ANIT'te yüklüyse) — koyu bantta okunur olsun diye açık zemin */
.ep-logo-img { display: block; height: 44px; width: auto; max-width: 220px; object-fit: contain; background: #fff; padding: 4px 8px; border-radius: 2px; }
.ep-alt .ep-logo-img { height: 40px; }
/* Yüzen WhatsApp / sohbet düğmesi ürün sayfası bölüm çubuğunun sağındaki kod+fiyatı örtmesin */
body:has(.ep-wa, #cbw) .ep-bolum-nav .ep-w { padding-right: calc(var(--ep-yan) + 72px); }
.ep-bolum-nav nav ul, .ep-bolum-nav nav li { list-style: none; margin: 0; padding: 0; }
.ep-bolum-nav nav li::before, .ep-bolum-nav nav li::after, .ep-bolum-nav nav li::marker { content: none; }
