/* =====================================================================
   PRO E-BİKE kurumsal site — tasarım sistemi
   E-ticaret sitesinin (Tailwind + bilesenler.css) marka dili temel alındı.
   ===================================================================== */

@font-face {
  font-family: 'ProParaSembolu';
  src: local('Segoe UI'), local('Tahoma'), local('Arial'), local('Helvetica Neue'),
       local('DejaVu Sans'), local('Noto Sans'), local('Liberation Sans');
  unicode-range: U+20BA;
  font-display: swap;
}

:root {
  --marka:        #fede00;
  --marka-400:    #ffe62e;
  --marka-koyu:   #e2c500;
  --marka-metin:  #877300;
  --marka-50:     #fffdf0;
  --marka-100:    #fff9cc;
  --ink:          #0a0a0c;
  --ink-800:      #141418;
  --ink-700:      #1e1e24;
  --ink-600:      #2b2b33;
  --ink-500:      #3b3b45;
  --zemin:        #f6f6f7;
  --kenar:        #ececef;
  --kenar-koyu:   #e4e4e7;
  --metin:        #3f3f46;
  --soluk:        #71717a;
  --soluk-2:      #a1a1aa;
  --yesil:        #047857;

  --font: 'ProParaSembolu', 'DM Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --golge-kart:   0 22px 45px -28px rgba(10, 10, 12, .45);
  --golge-banner: 0 26px 60px -42px rgba(10, 10, 12, .82);
  --gecis:        cubic-bezier(.22, 1, .36, 1);
}

/* ---------------------------------------------------------------------
   Temel
   --------------------------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; overflow-x: hidden; overflow-x: clip; scroll-behavior: smooth; }
body.site {
  margin: 0;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  background: var(--zemin);
  color: var(--ink);
  font-family: var(--font);
  font-size: 15px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
body.site main { flex: 1 0 auto; }
:where(body.site) :where(h1, h2, h3, h4, p, ul, ol, dl, dd, figure, address, blockquote) { margin: 0; }
:where(body.site) :where(ul, ol) { padding: 0; list-style: none; }
:where(body.site) :where(img, svg, video, iframe) { display: block; max-width: 100%; }
:where(body.site) :where(img) { height: auto; }
:where(body.site) :where(a) { color: inherit; text-decoration: none; }
:where(body.site) :where(button, input, select, textarea) { font: inherit; color: inherit; }
:where(body.site) :where(button) { background: none; border: 0; padding: 0; cursor: pointer; }
:where(body.site) address { font-style: normal; }
[hidden] { display: none !important; }
::selection { background: var(--marka); color: var(--ink); }
:focus-visible { outline: 3px solid rgba(254, 222, 0, .7); outline-offset: 2px; }

.material-symbols-outlined {
  font-family: 'Material Symbols Outlined';
  font-weight: normal;
  font-style: normal;
  font-size: 20px;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  font-variation-settings: 'FILL' 0, 'wght' 350, 'GRAD' 0, 'opsz' 24;
  user-select: none;
  flex-shrink: 0;
}
.ikon-dolu { font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 0, 'opsz' 24; }

.gizli {
  position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}
.icerige-atla {
  position: fixed; top: 12px; left: 12px; z-index: 200;
  background: var(--marka); color: var(--ink); padding: .6rem 1rem; border-radius: .75rem;
  font-weight: 800; font-size: 13px; transform: translateY(-160%); transition: transform .2s;
}
.icerige-atla:focus { transform: none; }

.kap {
  width: 100%;
  max-width: 80rem;
  margin-inline: auto;
  padding-inline: 1rem;
}
@media (min-width: 640px)  { .kap { padding-inline: 1.5rem; } }
@media (min-width: 1024px) { .kap { padding-inline: 2rem; } }

/* Bölüm aralıkları */
.bolum { margin-top: 3rem; }
.bolum-ilk { margin-top: 1rem; }
@media (min-width: 640px)  { .bolum { margin-top: 4rem; } .bolum-ilk { margin-top: 1.5rem; } }
@media (min-width: 1024px) { .bolum { margin-top: 5rem; } }

/* ---------------------------------------------------------------------
   Tipografi
   --------------------------------------------------------------------- */
.baslik {
  font-family: var(--font);
  font-weight: 800;
  letter-spacing: -.03em;
  line-height: 1.12;
  color: inherit;
}
.baslik-sikma { letter-spacing: -.045em; }

.ust-yazi {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--marka-metin);
  line-height: 1.2;
}
.ust-yazi::before {
  content: '';
  width: 1.5rem;
  height: 2px;
  background: var(--marka);
  border-radius: 2px;
  flex-shrink: 0;
}
.ust-yazi-koyu { color: var(--marka); }
.ust-yazi-sari { color: var(--ink); }
.ust-yazi-sari::before { background: var(--ink); }

.bolum-basligi {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1.25rem;
}
.bolum-basligi .ust-yazi { margin-bottom: .5rem; }
.bolum-basligi h2 {
  font-weight: 800;
  letter-spacing: -.03em;
  font-size: 26px;
  line-height: 1.1;
  color: var(--ink);
}
.bolum-basligi p { color: var(--soluk); font-size: 14.5px; margin-top: .5rem; max-width: 40rem; }
.bolum-basligi .tumu {
  font-size: 12px; font-weight: 800; color: var(--marka-metin);
  display: inline-flex; align-items: center; gap: .25rem; white-space: nowrap;
  padding: .5rem 0;
}
.bolum-basligi .tumu .material-symbols-outlined { font-size: 16px; }
.bolum-basligi .tumu:hover { color: var(--ink); }
@media (min-width: 640px) { .bolum-basligi h2 { font-size: 30px; } .bolum-basligi { margin-bottom: 1.5rem; } }

/* ---------------------------------------------------------------------
   Butonlar
   --------------------------------------------------------------------- */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  min-height: 46px;
  font-weight: 800;
  font-size: 12px;
  letter-spacing: .04em;
  text-transform: uppercase;
  border-radius: 1rem;
  padding: .875rem 1.5rem;
  border: 2px solid transparent;
  transition: background-color .18s, color .18s, border-color .18s, transform .18s, box-shadow .18s;
  cursor: pointer;
  white-space: nowrap;
  line-height: 1;
  text-align: center;
}
.btn .material-symbols-outlined { font-size: 18px; }
.btn:active { transform: translateY(1px); }
.btn-marka {
  background: linear-gradient(180deg, #ffe733 0%, #fede00 55%, #f0d200 100%); color: var(--ink);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .55), 0 8px 18px -10px rgba(226, 197, 0, .85);
}
.btn-marka:hover { background: linear-gradient(180deg, #fede00, #e2c500); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .4), 0 16px 30px -12px rgba(226, 197, 0, .9); }
.btn-koyu {
  background: linear-gradient(180deg, #26262d 0%, #0a0a0c 100%); color: #fff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1), 0 10px 20px -12px rgba(10, 10, 12, .8);
}
.btn-koyu .material-symbols-outlined { color: var(--marka); }
.btn-koyu:hover { background: linear-gradient(180deg, #ffe733, #fede00); color: var(--ink); }
.btn-koyu:hover .material-symbols-outlined { color: var(--ink); }
.btn-cizgi { background: #fff; color: var(--ink); border: 1.5px solid var(--kenar-koyu); box-shadow: 0 1px 2px rgba(10, 10, 12, .05); }
.btn-cizgi:hover { border-color: var(--ink); background: var(--ink); color: #fff; }
.btn-cizgi-acik { background: transparent; color: #fff; border-color: rgba(255, 255, 255, .28); }
.btn-cizgi-acik:hover { border-color: var(--marka); color: var(--ink); background: var(--marka); }
.btn-beyaz { background: #fff; color: var(--ink); }
.btn-beyaz:hover { background: var(--ink); color: #fff; }
.btn-kucuk { min-height: 40px; padding: .625rem 1rem; font-size: 11px; border-radius: .875rem; }
.btn-kucuk .material-symbols-outlined { font-size: 17px; }
.btn-genis { width: 100%; }
.btn[disabled] { background: #e6e6e9; color: #9a9aa4; border-color: transparent; cursor: not-allowed; box-shadow: none; }

.ikon-dugme {
  width: 42px; height: 42px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: .875rem; color: var(--ink);
  transition: background-color .15s;
}
.ikon-dugme:hover { background: #f4f4f5; }
.ikon-dugme .material-symbols-outlined { font-size: 24px; }

.metin-link {
  display: inline-flex; align-items: center; gap: .3rem;
  font-size: 12px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase;
  color: var(--ink);
}
.metin-link .material-symbols-outlined { font-size: 17px; transition: transform .18s; }
.metin-link:hover .material-symbols-outlined { transform: translateX(3px); }

/* ---------------------------------------------------------------------
   Kartlar, paneller, rozetler
   --------------------------------------------------------------------- */
.kart {
  background: #fff;
  border: 1px solid var(--kenar);
  border-radius: 1.25rem;
  transition: border-color .2s, box-shadow .2s, transform .2s;
}
.kart-etkilesimli:hover {
  border-color: rgba(10, 10, 12, .14);
  box-shadow: var(--golge-kart);
  transform: translateY(-3px);
}

.panel-koyu {
  position: relative;
  background: var(--ink);
  color: #fff;
  border-radius: 1.75rem;
  overflow: hidden;
  isolation: isolate;
}
.panel-koyu::before {
  content: '';
  position: absolute;
  inset: -40% 40% 40% -20%;
  background: radial-gradient(closest-side, rgba(254, 222, 0, .20), transparent 70%);
  z-index: -1;
  pointer-events: none;
}
.panel-koyu::after {
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(255, 255, 255, .035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, .035) 1px, transparent 1px);
  background-size: 46px 46px;
  z-index: -1;
  pointer-events: none;
}
.panel-marka {
  position: relative;
  background: var(--marka);
  color: var(--ink);
  border-radius: 1.75rem;
  overflow: hidden;
  isolation: isolate;
}
.panel-marka::after {
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(10, 10, 12, .055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(10, 10, 12, .055) 1px, transparent 1px);
  background-size: 46px 46px;
  z-index: -1;
  pointer-events: none;
}

.rozet {
  display: inline-flex; align-items: center; gap: .25rem;
  font-size: 10.5px; font-weight: 800; letter-spacing: .04em;
  padding: .32rem .55rem; border-radius: .55rem; line-height: 1;
  text-transform: uppercase;
}
.rozet-marka { background: var(--marka); color: var(--ink); }
.rozet-koyu  { background: var(--ink); color: var(--marka); }
.rozet-yesil { background: #ecfdf5; color: var(--yesil); }
.rozet-notr  { background: #f2f2f4; color: #52525b; }

.cip {
  display: inline-flex; align-items: center; gap: .35rem;
  min-height: 36px;
  font-size: 12.5px; font-weight: 700;
  padding: .4rem .8rem; border-radius: .75rem;
  background: #f4f4f6; color: var(--metin); white-space: nowrap;
  transition: background-color .15s, color .15s;
}
a.cip:hover { background: var(--marka); color: var(--ink); }
.cip .material-symbols-outlined { font-size: 16px; color: var(--marka-metin); }
.cip-liste { display: flex; flex-wrap: wrap; gap: .45rem; }

.durum-rozet {
  display: inline-flex; align-items: center; gap: .35rem;
  font-size: 11px; font-weight: 800; letter-spacing: .02em;
  padding: .28rem .55rem; border-radius: 99px;
  background: rgba(16, 185, 129, .12); color: #34d399;
  vertical-align: middle;
}
.durum-rozet::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }

/* ---------------------------------------------------------------------
   Form
   --------------------------------------------------------------------- */
.alan {
  width: 100%;
  min-height: 48px;
  background: #f7f7f8;
  border: 1.5px solid #e6e6e9;
  border-radius: .875rem;
  padding: .75rem 1rem;
  font-size: 15px;
  font-weight: 500;
  color: #18181b;
  transition: border-color .15s, background-color .15s, box-shadow .15s;
}
.alan::placeholder { color: var(--soluk-2); }
.alan:focus { outline: none; background: #fff; border-color: var(--ink); box-shadow: 0 0 0 4px rgba(254, 222, 0, .28); }
.alan-etiket { display: block; font-size: 12.5px; font-weight: 800; color: var(--metin); margin-bottom: .4rem; }
.alan-ikonlu { position: relative; margin-bottom: .75rem; }
.alan-ikonlu > .material-symbols-outlined { position: absolute; left: .9rem; top: 50%; transform: translateY(-50%); color: var(--soluk-2); }
.alan-ikonlu .alan { padding-left: 2.75rem; }
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; appearance: none; }

/* ---------------------------------------------------------------------
   Üst bölüm (header)
   --------------------------------------------------------------------- */
.site-ust { position: sticky; top: 0; z-index: 60; }

.ust-cubuk {
  display: none;
  background: var(--ink-800);
  color: #a1a1aa;
  font-size: 13px;
  font-weight: 500;
  border-bottom: 1px solid rgba(255, 255, 255, .05);
}
.ust-cubuk__ic { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; height: 36px; }
.ust-cubuk__slogan { display: flex; align-items: center; gap: .5rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ust-cubuk__slogan .nokta { width: 6px; height: 6px; border-radius: 50%; background: var(--marka); flex-shrink: 0; }
.ust-cubuk__baglantilar { display: flex; align-items: center; gap: 1.25rem; flex-shrink: 0; }
.ust-cubuk__baglantilar > * { display: inline-flex; align-items: center; gap: .35rem; white-space: nowrap; }
.ust-cubuk__baglantilar .material-symbols-outlined { font-size: 15px; color: var(--marka); }
.ust-cubuk__baglantilar a:hover { color: var(--marka); }
.ust-cubuk__tel { color: #fff; font-weight: 700; }
.ust-cubuk__saat { display: none !important; }
@media (min-width: 768px)  { .ust-cubuk { display: block; } }
@media (min-width: 1024px) { .ust-cubuk__saat { display: inline-flex !important; } }

.ust-bar { background: #fff; border-bottom: 1px solid rgba(228, 228, 231, .8); }
.ust-bar__ic { display: flex; align-items: center; gap: .75rem; height: 64px; }
@media (min-width: 640px)  { .ust-bar__ic { gap: 1.25rem; } }
@media (min-width: 1024px) { .ust-bar__ic { gap: 2rem; height: 80px; } }

.marka { display: flex; align-items: center; gap: .65rem; flex-shrink: 0; min-width: 0; }
.marka__logo {
  width: 40px; height: 40px; object-fit: contain; border-radius: 50%;
  box-shadow: 0 0 0 2px rgba(10, 10, 12, .05); transition: box-shadow .2s;
}
.marka:hover .marka__logo { box-shadow: 0 0 0 2px var(--marka); }
.marka__yazi { line-height: 1; min-width: 0; }
.marka__yazi strong { display: block; font-weight: 800; font-size: 16px; letter-spacing: -.02em; color: var(--ink); white-space: nowrap; }
.marka__yazi strong span { color: var(--marka-koyu); }
.marka__yazi small {
  display: none; margin-top: .3rem;
  font-size: 10.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .16em; color: var(--soluk-2);
  white-space: nowrap;
}
.marka--acik .marka__yazi strong { color: #fff; }
.marka--acik .marka__yazi strong span { color: var(--marka); }
@media (min-width: 640px)  { .marka__yazi strong { font-size: 18px; } .marka__yazi small { display: block; } }
@media (min-width: 1024px) { .marka__logo { width: 48px; height: 48px; } .marka__yazi strong { font-size: 20px; } }

.ust-arama { display: none; position: relative; flex: 1; max-width: 40rem; }
.ust-arama input {
  width: 100%; height: 48px;
  background: #f4f4f5; border: 2px solid transparent; border-radius: 1rem;
  padding: 0 5.5rem 0 3rem; font-size: 13.5px; font-weight: 500; color: var(--ink);
  transition: background-color .15s, border-color .15s, box-shadow .15s;
}
.ust-arama input::placeholder { color: var(--soluk-2); }
.ust-arama input:focus { outline: none; background: #fff; border-color: var(--ink); box-shadow: 0 0 0 4px rgba(254, 222, 0, .3); }
.ust-arama__ikon { position: absolute; left: 1rem; top: 50%; transform: translateY(-50%); color: var(--soluk-2); }
.ust-arama .btn { position: absolute; right: 5px; top: 50%; transform: translateY(-50%); min-height: 36px; padding: .5rem 1rem; }
@media (min-width: 1024px) { .ust-arama { display: block; } }

.ust-eylemler { display: flex; align-items: center; gap: .25rem; margin-left: auto; flex-shrink: 0; }
.ust-destek, .ust-konum { display: none !important; }
.ust-destek { align-items: center; gap: .65rem; padding-right: .5rem; }
.ust-destek__ikon {
  width: 42px; height: 42px; border-radius: .875rem; background: var(--marka-50);
  display: inline-flex; align-items: center; justify-content: center; color: var(--marka-metin);
}
.ust-destek__ikon .material-symbols-outlined { font-size: 22px; }
.ust-destek__yazi { line-height: 1.1; }
.ust-destek__yazi small { display: block; font-size: 10.5px; font-weight: 800; text-transform: uppercase; letter-spacing: .12em; color: var(--soluk-2); }
.ust-destek__yazi strong { display: block; font-size: 15px; font-weight: 800; margin-top: .2rem; white-space: nowrap; }
.ust-destek:hover strong { color: var(--marka-metin); }
.ust-konum { min-height: 44px; }
@media (min-width: 640px)  { .ust-konum { display: inline-flex !important; } }
@media (min-width: 1024px) { .mobil-yalniz { display: none !important; } .ust-eylemler { gap: .75rem; } }
@media (min-width: 1180px) { .ust-destek { display: inline-flex !important; } }

/* Siyah menü şeridi */
.ana-menu { display: none; background: var(--ink); color: #d4d4d8; position: relative; }
@media (min-width: 1024px) { .ana-menu { display: block; } }
.ana-menu__ic { display: flex; align-items: stretch; gap: .15rem; height: 48px; font-size: 13.5px; font-weight: 700; }
.ana-menu__ic > a {
  display: flex; align-items: center; gap: .35rem; padding: 0 .8rem; white-space: nowrap;
  position: relative; transition: color .15s;
}
.ana-menu__ic > a:hover, .ana-menu__ic > a.etkin { color: var(--marka); }
.ana-menu__ic > a.etkin::after {
  content: ''; position: absolute; left: .8rem; right: .8rem; bottom: 0; height: 3px;
  background: var(--marka); border-radius: 3px 3px 0 0;
}
.ana-menu__ic > a .material-symbols-outlined { font-size: 18px; }
.ana-menu__bosluk { flex: 1; }
.ana-menu__iletisim { color: var(--marka); }
.ana-menu__iletisim:hover { color: #fff !important; }
.ana-menu__fiyat {
  display: flex; align-items: center; gap: .5rem; padding: 0 1rem; margin-right: .5rem;
  background: var(--marka); color: var(--ink) !important;
  font-weight: 800; text-transform: uppercase; letter-spacing: .03em; font-size: 12.5px; white-space: nowrap;
  transition: background-color .15s;
}
.ana-menu__fiyat:hover, .ana-menu__fiyat[aria-expanded="true"] { background: var(--marka-400); }
.ana-menu__fiyat .material-symbols-outlined { font-size: 19px; }
.ana-menu__fiyat .ok { font-size: 18px; transition: transform .2s; }
.ana-menu__fiyat[aria-expanded="true"] .ok { transform: rotate(180deg); }
@media (max-width: 1179px) {
  .ana-menu__ic > a { padding: 0 .6rem; }
  .ana-menu__ic > a.etkin::after { left: .6rem; right: .6rem; }
}

/* Fiyat listeleri açılır paneli */
.menu-panel-kap { position: relative; height: 0; }
.menu-panel {
  position: absolute; top: 0; left: 1rem; right: 1rem; z-index: 70;
  opacity: 0; visibility: hidden; transform: translateY(-6px);
  transition: opacity .16s ease, transform .16s ease, visibility 0s linear .16s;
}
@media (min-width: 640px)  { .menu-panel { left: 1.5rem; right: 1.5rem; } }
@media (min-width: 1024px) { .menu-panel { left: 2rem; right: 2rem; } }
.menu-panel.acik { opacity: 1; visibility: visible; transform: none; transition: opacity .16s ease, transform .16s ease, visibility 0s; }
.menu-panel__kutu {
  background: #fff; color: var(--ink);
  border: 1px solid var(--kenar-koyu); border-top: 0;
  border-radius: 0 0 1.5rem 1.5rem; overflow: hidden;
  box-shadow: 0 30px 60px -20px rgba(10, 10, 12, .35);
}
.menu-panel__izgara { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; padding: 1.25rem; }
@media (min-width: 1024px) { .menu-panel__izgara { grid-template-columns: repeat(3, minmax(0, 1fr)); padding: 1.5rem; } }
.menu-kategori {
  display: flex; align-items: center; gap: .9rem; padding: .6rem; border-radius: 1rem;
  transition: background-color .15s;
}
.menu-kategori:hover { background: var(--marka-50); }
.menu-kategori__gorsel {
  width: 76px; height: 57px; border-radius: .75rem; overflow: hidden; flex-shrink: 0; background: var(--ink);
}
.menu-kategori__gorsel img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.menu-kategori:hover .menu-kategori__gorsel img { transform: scale(1.06); }
.menu-kategori__yazi { flex: 1; min-width: 0; line-height: 1.25; }
.menu-kategori__yazi strong { display: block; font-size: 14px; font-weight: 800; letter-spacing: -.01em; }
.menu-kategori__yazi small { display: block; font-size: 12.5px; font-weight: 600; color: var(--soluk); margin-top: .2rem; }
.menu-kategori__ok {
  width: 32px; height: 32px; border-radius: .7rem; background: #f4f4f5;
  display: inline-flex !important; align-items: center; justify-content: center; font-size: 18px !important;
  transition: background-color .15s;
}
.menu-kategori:hover .menu-kategori__ok { background: var(--marka); }
.menu-panel__alt {
  display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1.5rem;
  padding: .9rem 1.5rem; background: #fafafa; border-top: 1px solid var(--kenar);
  font-size: 13px; font-weight: 700; color: var(--soluk);
}
.menu-panel__alt span { display: inline-flex; align-items: center; gap: .35rem; }
.menu-panel__alt .material-symbols-outlined { font-size: 17px; color: var(--marka-metin); }
.menu-panel__alt a { margin-left: auto; display: inline-flex; align-items: center; gap: .3rem; color: var(--ink); font-weight: 800; }
.menu-panel__alt a:hover { color: var(--marka-metin); }

/* ---------------------------------------------------------------------
   Çekmeceler (mobil menü + arama)
   --------------------------------------------------------------------- */
.cekmece-perde {
  position: fixed; inset: 0; z-index: 90;
  background: rgba(10, 10, 12, .55); backdrop-filter: blur(2px);
  opacity: 0; visibility: hidden;
  transition: opacity .25s ease, visibility 0s linear .25s;
}
.cekmece-perde.acik { opacity: 1; visibility: visible; transition: opacity .25s ease, visibility 0s; }
.cekmece {
  position: fixed; top: 0; right: 0; bottom: 0; z-index: 95;
  width: min(90vw, 380px);
  background: #fff; display: flex; flex-direction: column;
  transform: translateX(100%); visibility: hidden;
  transition: transform .28s var(--gecis), visibility 0s linear .28s;
  box-shadow: -24px 0 60px -20px rgba(10, 10, 12, .4);
}
.cekmece.acik { transform: none; visibility: visible; transition: transform .28s var(--gecis), visibility 0s; }
.cekmece__baslik {
  display: flex; align-items: center; justify-content: space-between; gap: .75rem;
  height: 64px; padding: 0 .75rem 0 1.25rem; border-bottom: 1px solid var(--kenar); flex-shrink: 0;
}
.cekmece__baslik strong { font-weight: 800; font-size: 15px; }
.cekmece__baslik--koyu { background: var(--ink); color: #fff; border-color: var(--ink); }
.cekmece__baslik--koyu strong span { color: var(--marka); }
.cekmece__baslik--koyu .ikon-dugme { color: #fff; }
.cekmece__baslik--koyu .ikon-dugme:hover { background: rgba(255, 255, 255, .1); }
.cekmece__govde { flex: 1; overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; }
.cekmece__govde--dolgu { padding: 1.25rem; }
.cekmece__etiket {
  font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .15em; color: var(--soluk-2);
  margin: 1.5rem 0 .6rem;
}
.cekmece-menu { padding: .6rem; font-size: 15px; font-weight: 600; color: var(--metin); }
.cekmece-menu > a, .cekmece-menu summary {
  display: flex; align-items: center; gap: .85rem; min-height: 50px; padding: 0 .75rem; border-radius: .875rem;
  cursor: pointer; list-style: none;
}
.cekmece-menu summary::-webkit-details-marker { display: none; }
.cekmece-menu summary span:not(.material-symbols-outlined) { flex: 1; }
.cekmece-menu > a:hover, .cekmece-menu summary:hover { background: var(--marka-50); }
.cekmece-menu > a.etkin { background: var(--marka-50); color: var(--ink); font-weight: 800; }
.cekmece-menu .material-symbols-outlined { font-size: 22px; color: var(--soluk-2); }
.cekmece-menu > a.etkin .material-symbols-outlined { color: var(--marka-metin); }
.cekmece-menu .ok { transition: transform .2s; }
.cekmece-menu details[open] .ok { transform: rotate(180deg); }
.cekmece-menu__alt { margin: 0 0 .4rem 1.6rem; padding-left: .85rem; border-left: 2px solid rgba(254, 222, 0, .5); }
.cekmece-menu__alt a {
  display: flex; align-items: center; justify-content: space-between; gap: .5rem;
  min-height: 44px; padding: 0 .75rem; border-radius: .7rem; font-size: 14px; font-weight: 500;
}
.cekmece-menu__alt a:hover { background: var(--marka-50); }
.cekmece-menu__alt a.guclu { font-weight: 800; color: var(--marka-metin); }
.cekmece-menu__alt small { font-size: 12px; color: var(--soluk-2); font-weight: 700; }
.cekmece-bilgi { margin: .5rem 1.25rem 1.25rem; padding-top: .25rem; border-top: 1px solid var(--kenar); }
.cekmece-bilgi .cekmece__etiket { margin-top: 1.1rem; }
.cekmece-bilgi p:not(.cekmece__etiket) { display: flex; gap: .6rem; font-size: 13.5px; color: var(--metin); margin-top: .55rem; line-height: 1.45; }
.cekmece-bilgi p .material-symbols-outlined { font-size: 18px; color: var(--marka-metin); }
.cekmece__alt { border-top: 1px solid var(--kenar); padding: 1rem; display: grid; gap: .5rem; flex-shrink: 0; padding-bottom: calc(1rem + env(safe-area-inset-bottom)); }
.cekmece__alt-ikili { display: grid; grid-template-columns: 1fr 1fr; gap: .5rem; }
.cekmece__alt-ikili .btn { padding-inline: .5rem; }
body.kaydirma-kilit { overflow: hidden; }

/* ---------------------------------------------------------------------
   Mobil alt hızlı erişim çubuğu
   --------------------------------------------------------------------- */
.alt-cubuk {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 80;
  display: grid; grid-template-columns: repeat(5, 1fr);
  background: rgba(255, 255, 255, .97); backdrop-filter: blur(12px);
  border-top: 1px solid var(--kenar);
  padding-bottom: env(safe-area-inset-bottom);
}
.alt-cubuk > a, .alt-cubuk > button {
  position: relative;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px;
  min-height: 60px; padding: .45rem 0 .4rem;
  font-size: 10.5px; font-weight: 700; color: var(--soluk);
}
.alt-cubuk .material-symbols-outlined { font-size: 23px; }
.alt-cubuk .etkin { color: var(--ink); }
.alt-cubuk .etkin::before {
  content: ''; position: absolute; top: 0; left: 50%; transform: translateX(-50%);
  width: 26px; height: 3px; background: var(--marka); border-radius: 0 0 3px 3px;
}
.alt-cubuk__ara { color: var(--ink) !important; }
.alt-cubuk__ara-ikon {
  width: 44px; height: 44px; margin-top: -20px; border-radius: 50%;
  background: var(--marka); color: var(--ink);
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 10px 22px -8px rgba(226, 197, 0, .9), 0 0 0 4px #fff;
}
.alt-cubuk__ara-ikon .material-symbols-outlined { font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 0, 'opsz' 24; }
@media (min-width: 1024px) { .alt-cubuk { display: none; } }
@media (max-width: 1023px) { body.site { padding-bottom: calc(62px + env(safe-area-inset-bottom)); } }

/* ---------------------------------------------------------------------
   Alt bölüm (footer)
   --------------------------------------------------------------------- */
.site-alt {
  position: relative; overflow: hidden;
  margin-top: 4rem;
  background: var(--ink); color: #a1a1aa;
  font-size: 14px;
}
@media (min-width: 1024px) { .site-alt { margin-top: 5rem; } }
.site-alt__isik {
  pointer-events: none; position: absolute; top: -8rem; left: -6rem; width: 420px; height: 420px; border-radius: 50%;
  background: radial-gradient(closest-side, rgba(254, 222, 0, .14), transparent);
}
.site-alt .kap { position: relative; }

.site-alt__cta {
  display: grid; gap: 1.5rem; align-items: center;
  padding: 2.25rem 0; border-bottom: 1px solid rgba(255, 255, 255, .1);
}
.site-alt__cta .ust-yazi { margin-bottom: .75rem; }
.site-alt__cta h2 { color: #fff; font-size: 24px; }
.site-alt__cta p { margin-top: .6rem; max-width: 36rem; line-height: 1.65; }
.site-alt__cta-dugmeler { display: grid; gap: .6rem; }
@media (min-width: 640px) { .site-alt__cta-dugmeler { grid-template-columns: 1fr 1fr; } .site-alt__cta h2 { font-size: 30px; } }
@media (min-width: 1024px) {
  .site-alt__cta { grid-template-columns: minmax(0, 1fr) auto; padding: 3rem 0; }
  .site-alt__cta-dugmeler { grid-template-columns: auto auto; }
}

.site-alt__izgara {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2rem 1.5rem;
  padding: 2.5rem 0;
}
.site-alt__marka { grid-column: 1 / -1; }
.site-alt__marka p { margin-top: 1rem; max-width: 24rem; line-height: 1.7; }
.site-alt__sosyal {
  display: inline-flex; align-items: center; gap: .45rem; margin-top: 1.1rem;
  min-height: 40px; padding: 0 .9rem; border-radius: .75rem;
  background: rgba(255, 255, 255, .05); border: 1px solid rgba(255, 255, 255, .1);
  color: #fff; font-size: 13px; font-weight: 700; transition: all .15s;
}
.site-alt__sosyal:hover { background: var(--marka); color: var(--ink); border-color: var(--marka); }
.site-alt__sosyal .material-symbols-outlined { font-size: 18px; }
.site-alt h3 { color: #fff; font-size: 14px; font-weight: 800; margin-bottom: 1rem; letter-spacing: -.01em; }
.site-alt__izgara ul { display: grid; gap: .15rem; }
.site-alt__izgara ul a { display: inline-flex; align-items: center; gap: .5rem; min-height: 34px; transition: color .15s; }
.site-alt__izgara ul a:hover { color: var(--marka); }
.site-alt__iletisim .material-symbols-outlined { font-size: 18px; color: var(--marka); }
.site-alt__iletisim a { word-break: break-word; }
.site-alt__saatler { margin-top: 1rem; display: grid; gap: .35rem; font-size: 13px; }
.site-alt__saatler div { display: flex; justify-content: space-between; gap: 1rem; padding-bottom: .35rem; border-bottom: 1px dashed rgba(255, 255, 255, .08); }
.site-alt__saatler dt { color: #d4d4d8; }
.site-alt__saatler dd { font-weight: 700; color: #fff; white-space: nowrap; }
.site-alt__saatler .kapali dd { color: #71717a; }
@media (max-width: 639px) { .site-alt__izgara > div:last-child { grid-column: 1 / -1; } }
@media (min-width: 768px)  { .site-alt__izgara { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .site-alt__izgara { grid-template-columns: 1.6fr 1fr 1.1fr 1.3fr; padding: 3rem 0; } .site-alt__marka { grid-column: auto; } }

.site-alt__subeler { display: grid; gap: .75rem; padding-bottom: 2.5rem; }
@media (min-width: 1024px) { .site-alt__subeler { grid-template-columns: 1fr 1fr; } }
.sube-satir {
  display: grid; grid-template-columns: auto minmax(0, 1fr); gap: .9rem 1rem; align-items: center;
  padding: 1rem; border-radius: 1.25rem;
  background: rgba(255, 255, 255, .04); border: 1px solid rgba(255, 255, 255, .09);
}
.sube-satir__ikon {
  width: 44px; height: 44px; border-radius: .875rem; background: rgba(254, 222, 0, .12); color: var(--marka);
  display: flex; align-items: center; justify-content: center;
}
.sube-satir h3 { margin: 0 0 .25rem; display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; }
.sube-satir address { font-size: 13px; line-height: 1.5; }
.sube-satir__eylem { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1fr; gap: .5rem; }
@media (min-width: 640px) {
  .sube-satir { grid-template-columns: auto minmax(0, 1fr) auto; padding: 1.1rem 1.25rem; }
  .sube-satir__eylem { grid-column: auto; display: flex; }
}
@media (min-width: 1024px) and (max-width: 1279px) {
  .sube-satir { grid-template-columns: auto minmax(0, 1fr); }
  .sube-satir__eylem { grid-column: 1 / -1; display: grid; }
}

.site-alt__dip {
  display: flex; flex-wrap: wrap; justify-content: space-between; gap: .5rem 1.5rem;
  padding: 1.25rem 0 1.5rem; border-top: 1px solid rgba(255, 255, 255, .1);
  font-size: 12.5px; color: #71717a;
}

/* =====================================================================
   BİLEŞENLER — ana sayfa ve iç sayfalar
   ===================================================================== */

/* Hero */
.hero { display: grid; grid-template-columns: minmax(0, 1fr); }
.hero__gorsel { position: relative; order: -1; aspect-ratio: 16 / 11; overflow: hidden; }
.hero__gorsel img { width: 100%; height: 100%; object-fit: cover; }
.hero__gorsel::after {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(0deg, var(--ink) 0%, rgba(10, 10, 12, 0) 45%);
}
.hero__yazi { position: relative; padding: 0 1.25rem 1.75rem; margin-top: -2.5rem; z-index: 1; }
.hero__baslik { font-size: 38px; margin-top: .9rem; color: #fff; }
.hero__baslik span { display: block; color: var(--marka); }
.hero__aciklama { margin-top: 1rem; color: #a1a1aa; font-size: 15px; line-height: 1.65; max-width: 34rem; }
.hero__dugmeler { display: grid; gap: .6rem; margin-top: 1.5rem; }
.hero__ozellikler { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1.5rem; }
.hero__ozellikler li {
  display: inline-flex; align-items: center; gap: .4rem;
  min-height: 34px; padding: 0 .75rem; border-radius: .75rem;
  background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .12);
  color: #e4e4e7; font-size: 12.5px; font-weight: 700;
}
.hero__ozellikler .material-symbols-outlined { font-size: 17px; color: var(--marka); }
.hero__slogan { display: none; }
@media (min-width: 480px) { .hero__dugmeler { grid-template-columns: auto auto; justify-content: start; } }
@media (min-width: 640px) {
  .hero__gorsel { aspect-ratio: 16 / 8; }
  .hero__yazi { padding: 0 2.25rem 2.5rem; }
  .hero__baslik { font-size: 50px; }
}
@media (min-width: 1024px) {
  .hero { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); min-height: 540px; }
  .hero__gorsel { order: 0; aspect-ratio: auto; }
  .hero__gorsel::after { background: linear-gradient(90deg, var(--ink) 0%, rgba(10, 10, 12, .35) 30%, rgba(10, 10, 12, 0) 60%); }
  .hero__yazi { margin: 0; padding: 3.5rem 0 5rem 3.5rem; align-self: center; }
  .hero__baslik { font-size: 60px; }
  .hero__slogan {
    display: flex; align-items: center; gap: .5rem;
    position: absolute; left: 3.5rem; bottom: 1.6rem; z-index: 2;
    color: #71717a; font-size: 13px; font-style: italic;
  }
  .hero__slogan .material-symbols-outlined { color: var(--marka); font-size: 18px; }
}
@media (min-width: 1280px) { .hero__baslik { font-size: 68px; } }

/* Güven şeridi */
.guven-bolum { margin-top: .75rem; }
@media (min-width: 640px) { .guven-bolum { margin-top: 1rem; } }
.guven-serit {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
  background: #fff; border: 1px solid var(--kenar); border-radius: 1.25rem; overflow: hidden;
}
.guven-madde { display: flex; align-items: center; gap: .75rem; padding: .9rem .85rem; min-width: 0; }
.guven-madde:nth-child(odd) { border-right: 1px solid var(--kenar); }
.guven-madde:nth-child(-n+2) { border-bottom: 1px solid var(--kenar); }
.guven-madde__ikon {
  width: 40px; height: 40px; border-radius: .8rem; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  background: var(--ink); color: var(--marka);
}
.guven-madde__ikon .material-symbols-outlined { font-size: 21px; }
.guven-madde__yazi { min-width: 0; line-height: 1.25; }
.guven-madde__yazi strong { display: block; font-size: 13.5px; font-weight: 800; letter-spacing: -.01em; }
.guven-madde__yazi small { display: block; font-size: 12px; color: var(--soluk); margin-top: .2rem; }
@media (max-width: 379px) { .guven-madde__yazi small { display: none; } }
@media (min-width: 1024px) {
  .guven-serit { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .guven-madde { padding: 1.25rem 1.4rem; gap: 1rem; }
  .guven-madde:nth-child(-n+2) { border-bottom: 0; }
  .guven-madde:not(:last-child) { border-right: 1px solid var(--kenar); }
  .guven-madde__ikon { width: 46px; height: 46px; border-radius: .9rem; }
  .guven-madde__yazi strong { font-size: 15px; }
  .guven-madde__yazi small { font-size: 13px; }
}

/* Kategori kartları */
.kategori-izgara { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; }
@media (min-width: 640px)  { .kategori-izgara { gap: 1rem; } }
@media (min-width: 768px)  { .kategori-izgara { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .kategori-izgara { gap: 1.25rem; } }
.kategori-kart { display: flex; flex-direction: column; overflow: hidden; }
.kategori-kart__gorsel { display: block; aspect-ratio: 4 / 3; overflow: hidden; background: var(--ink); }
.kategori-kart__gorsel img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s var(--gecis); }
.kategori-kart:hover .kategori-kart__gorsel img { transform: scale(1.04); }
.kategori-kart__alt { display: flex; align-items: center; justify-content: space-between; gap: .5rem; padding: .75rem .8rem .85rem; flex: 1; }
.kategori-kart__yazi { min-width: 0; line-height: 1.2; }
.kategori-kart__yazi strong { display: block; font-size: 14px; font-weight: 800; letter-spacing: -.015em; }
.kategori-kart__yazi small { display: block; font-size: 12px; font-weight: 600; color: var(--soluk); margin-top: .3rem; }
.kategori-kart__ok {
  display: none; width: 36px; height: 36px; border-radius: .8rem; flex-shrink: 0;
  align-items: center; justify-content: center; background: #f4f4f5; transition: background-color .15s;
}
.kategori-kart:hover .kategori-kart__ok { background: var(--marka); }
@media (min-width: 640px) {
  .kategori-kart__alt { padding: 1rem 1.1rem 1.1rem; }
  .kategori-kart__yazi strong { font-size: 16px; }
  .kategori-kart__yazi small { font-size: 13px; }
  .kategori-kart__ok { display: flex; }
}

/* Hizmetler */
.hizmet-blok { display: grid; gap: 1.5rem; }
.hizmet-blok__baslik h2 { font-size: 28px; margin-top: .6rem; }
.hizmet-blok__baslik p { color: var(--soluk); margin-top: .75rem; line-height: 1.65; max-width: 30rem; }
.hizmet-blok__baslik .metin-link { margin-top: 1.1rem; }
.hizmet-izgara { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; }
.hizmet-kart { display: flex; flex-direction: column; padding: 1rem; min-width: 0; }
.hizmet-kart__ust { display: flex; align-items: flex-start; justify-content: space-between; }
.hizmet-kart__ikon {
  width: 44px; height: 44px; border-radius: .9rem; display: flex; align-items: center; justify-content: center;
  background: var(--marka-50); color: var(--marka-metin); border: 1px solid var(--marka-100);
  transition: background-color .2s, color .2s;
}
.hizmet-kart__ikon .material-symbols-outlined { font-size: 24px; }
.hizmet-kart:hover .hizmet-kart__ikon { background: var(--marka); color: var(--ink); }
.hizmet-kart__no { font-size: 12px; font-weight: 800; color: #d4d4d8; letter-spacing: .05em; }
.hizmet-kart strong { margin-top: .9rem; font-size: 14.5px; font-weight: 800; line-height: 1.25; letter-spacing: -.015em; }
.hizmet-kart__metin { margin-top: .45rem; font-size: 12.5px; color: var(--soluk); line-height: 1.55; flex: 1; }
.hizmet-kart__link {
  margin-top: .9rem; display: inline-flex; align-items: center; gap: .25rem;
  font-size: 11.5px; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; color: var(--marka-metin);
}
.hizmet-kart__link .material-symbols-outlined { font-size: 16px; }
@media (max-width: 419px) { .hizmet-kart__metin { display: none; } .hizmet-kart strong { flex: 1; } }
@media (min-width: 640px) {
  .hizmet-kart { padding: 1.4rem; }
  .hizmet-kart strong { font-size: 16px; }
  .hizmet-kart__metin { font-size: 13.5px; }
  .hizmet-blok__baslik h2 { font-size: 34px; }
}
@media (min-width: 1024px) {
  .hizmet-blok { grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: 2.5rem; align-items: center; }
  .hizmet-izgara { gap: 1rem; }
}

/* Kampanya görselleri */
.kampanya-gorsel {
  display: block; width: 100%; overflow: hidden;
  border: 1px solid rgba(24, 24, 27, .12); border-radius: 1.35rem;
  background: var(--ink); box-shadow: var(--golge-banner);
}
.kampanya-gorsel picture { display: block; width: 100%; height: 100%; }
.kampanya-gorsel img { width: 100%; height: 100%; object-fit: cover; transition: transform .55s cubic-bezier(.2, .7, .3, 1); }
.kampanya-gorsel:hover img { transform: scale(1.012); }

/* Ürün kartları */
.urun-izgara { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; }
@media (min-width: 640px)  { .urun-izgara { gap: 1rem; } }
@media (min-width: 768px)  { .urun-izgara { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .urun-izgara { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.25rem; } }
@media (min-width: 768px) and (max-width: 1023px) { .urun-izgara--vitrin > :nth-child(n+7) { display: none; } }
.urun-kart { display: flex; flex-direction: column; overflow: hidden; min-width: 0; }
.urun-kart__gorsel {
  position: relative; display: block; aspect-ratio: 1; padding: .75rem;
  background: radial-gradient(circle at 70% 20%, rgba(254, 222, 0, .12), transparent 55%), linear-gradient(180deg, #fafafa, #f1f1f2);
}
.urun-kart__gorsel { overflow: hidden; }
.urun-kart__gorsel img { position: absolute; inset: .75rem; width: calc(100% - 1.5rem); height: calc(100% - 1.5rem); object-fit: contain; transition: transform .5s var(--gecis); mix-blend-mode: multiply; }
.urun-kart:hover .urun-kart__gorsel img { transform: scale(1.04); }
.urun-kart__rozet { position: absolute; top: .6rem; left: .6rem; }
.urun-kart__govde { display: flex; flex-direction: column; align-items: flex-start; padding: .8rem .8rem .9rem; flex: 1; }
.urun-kart__marka { font-size: 10.5px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--marka-metin); }
.urun-kart__ad {
  margin-top: .3rem; font-size: 13.5px; font-weight: 700; line-height: 1.3; letter-spacing: -.01em;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; min-height: 2.6em;
}
.urun-kart__varyant { margin-top: .5rem; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: block; }
.urun-kart__fiyat { margin-top: auto; padding-top: .65rem; font-size: 17px; font-weight: 800; letter-spacing: -.02em; }
.urun-kart__fiyat small { font-size: 13px; }
.urun-kart__dugme { margin-top: .7rem; }
.urun-kart:hover .urun-kart__dugme { background: var(--marka); color: var(--ink); }
@media (max-width: 419px) { .urun-kart__dugme { font-size: 10px; padding-inline: .5rem; } .urun-kart__dugme .material-symbols-outlined { display: none; } }
@media (min-width: 640px) {
  .urun-kart__govde { padding: 1rem 1.1rem 1.1rem; }
  .urun-kart__ad { font-size: 14.5px; }
  .urun-kart__fiyat { font-size: 19px; }
}

/* Vitrin bloğu (banner + ürünler) */
.vitrin-blok { display: grid; gap: .75rem; }
.vitrin-blok__urunler { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; }
@media (min-width: 640px) { .vitrin-blok, .vitrin-blok__urunler { gap: 1rem; } }
@media (min-width: 1100px) {
  .vitrin-blok { grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); gap: 1.25rem; }
  .vitrin-blok__urunler { gap: 1.25rem; }
}

/* Neden PRO E-BİKE */
.neden { display: grid; gap: 1.75rem; padding: 1.75rem 1.25rem; }
.neden__baslik h2 { font-size: 30px; margin-top: .75rem; }
.neden__baslik p { margin-top: .9rem; color: rgba(10, 10, 12, .72); line-height: 1.65; max-width: 34rem; }
.neden__sayilar { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .6rem; }
.neden__sayilar div {
  background: rgba(255, 255, 255, .5); border: 1px solid rgba(10, 10, 12, .08);
  border-radius: 1rem; padding: .9rem 1rem; display: flex; flex-direction: column-reverse; gap: .2rem;
}
.neden__sayilar dt { font-size: 12px; font-weight: 700; color: rgba(10, 10, 12, .65); }
.neden__sayilar dd { font-size: 24px; font-weight: 800; letter-spacing: -.03em; line-height: 1.1; }
.neden__maddeler { display: grid; gap: .6rem; }
.neden__maddeler li {
  display: flex; gap: .8rem; align-items: flex-start;
  background: var(--ink); color: #a1a1aa; border-radius: 1rem; padding: 1rem;
  font-size: 13.5px; line-height: 1.55;
}
.neden__maddeler .material-symbols-outlined { color: var(--marka); font-size: 24px; }
.neden__maddeler strong { display: block; color: #fff; font-size: 14.5px; margin-bottom: .15rem; }
@media (min-width: 640px) {
  .neden { padding: 2.5rem 2.25rem; }
  .neden__baslik h2 { font-size: 40px; }
  .neden__sayilar { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .neden__maddeler { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (min-width: 1024px) {
  .neden { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); padding: 3.25rem; gap: 2rem 3rem; }
  .neden__baslik { grid-row: span 2; align-self: center; }
  .neden__baslik h2 { font-size: 46px; }
  .neden__sayilar { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .neden__sayilar dd { font-size: 30px; }
  .neden__maddeler { grid-template-columns: minmax(0, 1fr); }
}

/* Konum bloğu */
.konum-blok { display: grid; overflow: hidden; }
.konum-blok__bilgi { padding: 1.25rem; display: flex; flex-direction: column; gap: 1rem; }
.konum-blok__subeler { display: flex; flex-wrap: wrap; gap: .4rem; }
.konum-blok__subeler .material-symbols-outlined { font-size: 14px; }
.konum-blok__bilgi h3 { font-size: 20px; font-weight: 800; letter-spacing: -.02em; line-height: 1.3; }
.konum-blok__dugmeler { display: grid; gap: .6rem; margin-top: auto; }
.konum-blok__harita { min-height: 280px; background: #e4e4e7; }
.konum-blok__harita iframe { width: 100%; height: 100%; min-height: 280px; border: 0; }
@media (min-width: 480px) { .konum-blok__dugmeler { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1024px) {
  .konum-blok { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); min-height: 420px; }
  .konum-blok__bilgi { padding: 2.25rem; gap: 1.25rem; }
  .konum-blok__bilgi h3 { font-size: 24px; }
}

.saat-listesi { display: grid; border-top: 1px solid var(--kenar); }
.saat-listesi div { display: flex; justify-content: space-between; gap: 1rem; padding: .7rem 0; border-bottom: 1px solid var(--kenar); font-size: 14px; }
.saat-listesi dt { color: var(--metin); }
.saat-listesi dd { font-weight: 800; white-space: nowrap; }
.saat-listesi .kapali dd { color: var(--soluk-2); }

/* Blog kartları */
.blog-izgara { display: grid; gap: .9rem; }
@media (min-width: 640px) { .blog-izgara { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 768px) { .blog-izgara { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.25rem; } }
.blog-kart { display: flex; flex-direction: column; overflow: hidden; }
.blog-kart__gorsel { display: block; aspect-ratio: 16 / 10; overflow: hidden; background: #e4e4e7; }
.blog-kart__gorsel img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s var(--gecis); }
.blog-kart:hover .blog-kart__gorsel img { transform: scale(1.04); }
.blog-kart__govde { display: flex; flex-direction: column; align-items: flex-start; gap: .55rem; padding: 1.1rem 1.2rem 1.25rem; flex: 1; }
.blog-kart__meta { display: flex; align-items: center; gap: .6rem; font-size: 12.5px; color: var(--soluk); font-weight: 600; }
.blog-kart strong { font-size: 16px; font-weight: 800; letter-spacing: -.015em; line-height: 1.3; }
.blog-kart__ozet {
  font-size: 13.5px; color: var(--soluk); line-height: 1.6;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.blog-kart .metin-link { margin-top: auto; padding-top: .3rem; }

/* =====================================================================
   İÇ SAYFA ORTAKLARI
   ===================================================================== */
.kirinti {
  display: flex; flex-wrap: wrap; align-items: center; gap: .15rem .35rem;
  font-size: 13px; font-weight: 600; color: var(--soluk); margin-bottom: .85rem;
}
.kirinti a:hover { color: var(--ink); }
.kirinti .material-symbols-outlined { font-size: 16px; color: var(--soluk-2); }
.kirinti [aria-current] { color: var(--ink); font-weight: 700; }

.bolum--yakin { margin-top: 2.25rem; }
@media (min-width: 1024px) { .bolum--yakin { margin-top: 3rem; } }

.sayfa-baslik { display: grid; gap: 1.5rem; padding: 1.75rem 1.25rem; overflow: visible; }
.sayfa-baslik h1 { font-size: 34px; color: #fff; margin-top: .8rem; }
.sayfa-baslik__yazi > p { color: #a1a1aa; margin-top: .8rem; line-height: 1.65; max-width: 36rem; }
.sayfa-baslik__sayilar { display: flex; flex-wrap: wrap; gap: .45rem; margin-top: 1.1rem; }
.sayfa-baslik__sayilar li {
  display: inline-flex; align-items: baseline; gap: .3rem;
  padding: .45rem .75rem; border-radius: .75rem;
  background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .1);
  font-size: 12.5px; color: #a1a1aa; font-weight: 600;
}
.sayfa-baslik__sayilar strong { color: var(--marka); font-size: 15px; font-weight: 800; }
@media (min-width: 640px) { .sayfa-baslik { padding: 2.5rem 2.25rem; } .sayfa-baslik h1 { font-size: 46px; } }
@media (min-width: 1024px) {
  .sayfa-baslik { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: end; gap: 3rem; padding: 3rem; }
  .sayfa-baslik h1 { font-size: 54px; }
}

.bos-durum { padding: 2.5rem 1.5rem; text-align: center; display: grid; justify-items: center; gap: .5rem; }
.bos-durum > .material-symbols-outlined { font-size: 40px; color: var(--marka-metin); background: var(--marka-50); border-radius: 1rem; padding: .6rem; }
.bos-durum h2 { font-size: 18px; font-weight: 800; }
.bos-durum p { color: var(--soluk); font-size: 14px; }

/* Katalog araması */
.katalog-arama { position: relative; z-index: 5; }
.katalog-arama__etiket { display: block; color: #fff; font-size: 13px; font-weight: 700; margin-bottom: .55rem; }
.katalog-arama__kutu { position: relative; }
.katalog-arama__kutu input {
  width: 100%; height: 58px; border-radius: 1.1rem; border: 2px solid transparent;
  background: #fff; color: var(--ink); padding: 0 3.25rem 0 3.25rem; font-size: 15px; font-weight: 500;
}
.katalog-arama__kutu input:focus { outline: none; border-color: var(--marka); box-shadow: 0 0 0 5px rgba(254, 222, 0, .25); }
.katalog-arama__ikon { position: absolute; left: 1.1rem; top: 50%; transform: translateY(-50%); color: var(--soluk); font-size: 24px !important; }
.katalog-arama__temizle {
  position: absolute; right: .6rem; top: 50%; transform: translateY(-50%);
  width: 40px; height: 40px; border-radius: .8rem; display: flex; align-items: center; justify-content: center; color: var(--soluk);
}
.katalog-arama__temizle:hover { background: #f4f4f5; color: var(--ink); }
.arama-sonuc {
  position: absolute; left: 0; right: 0; top: calc(100% + .5rem);
  background: #fff; color: var(--ink); border-radius: 1.1rem; border: 1px solid var(--kenar-koyu);
  box-shadow: 0 30px 60px -20px rgba(10, 10, 12, .45);
  max-height: min(70vh, 520px); overflow-y: auto; padding: .4rem;
}
.arama-sonuc__sayi { font-size: 11.5px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--soluk-2); padding: .5rem .7rem .3rem; }
.arama-sonuc__sayi:empty { display: none; }
.arama-sonuc__bos { padding: 1.25rem; text-align: center; color: var(--soluk); font-size: 14px; }
.arama-sonuc__satir { display: flex; align-items: center; gap: .75rem; padding: .55rem .6rem; border-radius: .85rem; }
.arama-sonuc__satir:hover, .arama-sonuc__satir:focus-visible { background: var(--marka-50); }
.arama-sonuc__gorsel {
  width: 48px; height: 48px; border-radius: .7rem; background: #f4f4f5; flex-shrink: 0; overflow: hidden;
  display: flex; align-items: center; justify-content: center; color: var(--soluk-2);
}
.arama-sonuc__gorsel img { width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply; }
.arama-sonuc__yazi { flex: 1; min-width: 0; line-height: 1.25; }
.arama-sonuc__yazi strong { display: block; font-size: 13.5px; font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.arama-sonuc__yazi small { display: block; font-size: 12px; color: var(--soluk); margin-top: .2rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.arama-sonuc__satir b { font-size: 13.5px; font-weight: 800; white-space: nowrap; }

/* Katalog kategori kartları */
.katalog-izgara { display: grid; gap: .75rem; }
@media (min-width: 768px)  { .katalog-izgara { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; } }
@media (min-width: 1024px) { .katalog-izgara { gap: 1.25rem; } }
.katalog-kart { display: grid; grid-template-columns: minmax(0, 1fr); overflow: hidden; }
.katalog-kart__gorsel { display: block; background: var(--ink); overflow: hidden; aspect-ratio: 16 / 7; }
.katalog-kart__gorsel img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s var(--gecis); }
.katalog-kart:hover .katalog-kart__gorsel img { transform: scale(1.05); }
.katalog-kart__govde { padding: .9rem .9rem .8rem 1rem; display: flex; flex-direction: column; min-width: 0; }
.katalog-kart__baslik h3 { font-size: 16px; font-weight: 800; letter-spacing: -.02em; line-height: 1.2; }
.katalog-kart__baslik h3 a:hover { color: var(--marka-metin); }
.katalog-kart__baslik span { display: block; margin-top: .25rem; font-size: 12.5px; color: var(--soluk); font-weight: 600; }
.liste-baglantilari { margin-top: .6rem; border-top: 1px solid var(--kenar); }
.liste-baglantilari a {
  display: flex; align-items: center; gap: .5rem; min-height: 42px; padding: .25rem 0;
  border-bottom: 1px solid var(--kenar); font-size: 13px; font-weight: 700; color: var(--metin);
}
.liste-baglantilari li:last-child a { border-bottom: 0; }
.liste-baglantilari a span { flex: 1; min-width: 0; line-height: 1.3; }
.liste-baglantilari small {
  font-size: 11.5px; font-weight: 800; color: var(--soluk); background: #f4f4f5; border-radius: 99px; padding: .15rem .5rem;
}
.liste-baglantilari .material-symbols-outlined { font-size: 18px; color: var(--soluk-2); transition: transform .15s, color .15s; }
.liste-baglantilari a:hover { color: var(--ink); }
.liste-baglantilari a:hover .material-symbols-outlined { color: var(--ink); transform: translateX(2px); }
.liste-baglantilari a:hover small { background: var(--marka); color: var(--ink); }
.katalog-kart__tumu { margin-top: .5rem; font-size: 11px; color: var(--marka-metin); }
@media (min-width: 1100px) {
  .katalog-kart { grid-template-columns: 34% minmax(0, 1fr); }
  .katalog-kart__gorsel { aspect-ratio: auto; }
}
@media (min-width: 1280px) {
  .katalog-kart__govde { padding: 1.25rem 1.4rem 1rem; }
  .katalog-kart__baslik h3 { font-size: 19px; }
}

.liste-dugmeleri { display: grid; gap: .45rem; margin-top: .85rem; }
.liste-dugme {
  display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: .6rem;
  min-height: 54px; padding: .55rem .55rem .55rem .9rem; border-radius: .95rem;
  background: #f7f7f8; border: 1.5px solid transparent;
  transition: background-color .15s, border-color .15s, box-shadow .15s;
}
.liste-dugme__ad { font-size: 13.5px; font-weight: 800; line-height: 1.25; letter-spacing: -.005em; overflow-wrap: anywhere; }
.liste-dugme__sayi { font-size: 11.5px; font-weight: 700; color: var(--soluk); white-space: nowrap; }
.liste-dugme__ok {
  width: 36px; height: 36px; border-radius: .75rem; background: #fff; border: 1px solid var(--kenar-koyu);
  display: flex; align-items: center; justify-content: center; transition: all .15s;
}
.liste-dugme__ok .material-symbols-outlined { font-size: 18px; }
.liste-dugme:hover { background: #fff; border-color: var(--ink); box-shadow: 0 10px 22px -16px rgba(10, 10, 12, .5); }
.liste-dugme:hover .liste-dugme__ok { background: var(--marka); border-color: var(--marka); }
.katalog-kart__govde { padding: 1rem 1rem 1.05rem; }

/* Yardım şeridi */
.yardim-serit { display: grid; gap: 1rem; padding: 1.25rem; border-left: 4px solid var(--marka); }
.yardim-serit__ikon {
  width: 52px; height: 52px; border-radius: 1rem; background: var(--ink); color: var(--marka);
  display: flex; align-items: center; justify-content: center;
}
.yardim-serit__ikon .material-symbols-outlined { font-size: 28px; }
.yardim-serit h2 { font-size: 21px; }
.yardim-serit p { color: var(--soluk); margin-top: .35rem; line-height: 1.6; font-size: 14px; }
.yardim-serit__dugmeler { display: grid; grid-template-columns: 1fr 1fr; gap: .5rem; }
@media (min-width: 900px) {
  .yardim-serit { grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; padding: 1.5rem 1.75rem; gap: 1.5rem; }
  .yardim-serit h2 { font-size: 24px; }
}

/* =====================================================================
   FİYAT LİSTESİ DETAY
   ===================================================================== */
.liste-baslik { display: grid; overflow: hidden; }
.liste-baslik__yazi { padding: 1.5rem 1.25rem 1.6rem; position: relative; z-index: 1; }
.liste-baslik h1 { font-size: 32px; color: #fff; margin-top: .7rem; }
.liste-baslik__dugmeler { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1.1rem; }
.liste-baslik__gorsel { display: none; }
@media (min-width: 640px) {
  .liste-baslik { grid-template-columns: minmax(0, 1fr) 42%; }
  .liste-baslik__yazi { padding: 2.25rem 2.25rem 2.4rem; }
  .liste-baslik h1 { font-size: 42px; }
  .liste-baslik__gorsel { display: block; position: relative; }
  .liste-baslik__gorsel img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
  .liste-baslik__gorsel::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, var(--ink), rgba(10, 10, 12, 0) 55%); }
}
@media (min-width: 1024px) { .liste-baslik h1 { font-size: 52px; } .liste-baslik__yazi { padding: 2.75rem 3rem; } }

/* Liste seçimi: tüm listeler görünür, büyük dokunma alanları */
.liste-secimi-bolum { margin-top: 1rem; scroll-margin-top: 90px; }
@media (min-width: 1024px) { .liste-secimi-bolum { scroll-margin-top: 180px; } }
.liste-secimi { padding: 1rem; }
.liste-secimi__baslik { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: .8rem; }
.liste-secimi__baslik h2 { display: flex; align-items: center; gap: .5rem; font-size: 16px; font-weight: 800; letter-spacing: -.01em; }
.liste-secimi__baslik h2 .material-symbols-outlined { color: var(--marka-metin); font-size: 22px; }
.liste-secimi__baslik span { font-size: 12.5px; font-weight: 700; color: var(--soluk); }
.liste-secenekler { display: grid; grid-template-columns: minmax(0, 1fr); gap: .5rem; }
@media (min-width: 480px)  { .liste-secenekler { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .liste-secenekler { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .6rem; } .liste-secimi { padding: 1.25rem 1.4rem 1.4rem; } }
@media (min-width: 1280px) { .liste-secenekler { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.liste-secenek {
  display: flex; align-items: center; gap: .75rem; min-height: 60px; padding: .65rem .85rem;
  border-radius: 1rem; border: 1.5px solid var(--kenar-koyu); background: #fafafa;
  transition: border-color .15s, background-color .15s, box-shadow .15s, transform .15s;
}
.liste-secenek:hover { border-color: var(--ink); background: #fff; box-shadow: 0 10px 22px -16px rgba(10, 10, 12, .5); }
.liste-secenek:active { transform: scale(.99); }
.liste-secenek__isaret {
  width: 26px; height: 26px; border-radius: 50%; flex-shrink: 0; border: 2px solid #d4d4d8; background: #fff;
  display: flex; align-items: center; justify-content: center;
}
.liste-secenek__isaret .material-symbols-outlined { font-size: 17px; color: transparent; font-variation-settings: 'FILL' 0, 'wght' 700, 'GRAD' 0, 'opsz' 24; }
.liste-secenek__yazi { min-width: 0; line-height: 1.2; }
.liste-secenek__yazi strong { display: block; font-size: 13.5px; font-weight: 800; letter-spacing: -.005em; overflow-wrap: anywhere; }
.liste-secenek__yazi small { display: block; margin-top: .2rem; font-size: 12px; font-weight: 600; color: var(--soluk); }
.liste-secenek.etkin { background: var(--ink); border-color: var(--ink); color: #fff; box-shadow: 0 14px 28px -18px rgba(10, 10, 12, .8); }
.liste-secenek.etkin .liste-secenek__isaret { background: var(--marka); border-color: var(--marka); }
.liste-secenek.etkin .liste-secenek__isaret .material-symbols-outlined { color: var(--ink); }
.liste-secenek.etkin small { color: var(--marka); }

/* Yapışkan araç çubuğu: seçili liste + arama */
.liste-arac {
  position: sticky; top: 64px; z-index: 40;
  margin-top: 1rem; padding: .55rem 0;
  background: rgba(246, 246, 247, .95); backdrop-filter: blur(10px);
  transition: box-shadow .2s, background-color .2s;
}
.liste-arac.yapisik { background: rgba(255, 255, 255, .97); box-shadow: 0 10px 24px -18px rgba(10, 10, 12, .5); border-bottom: 1px solid var(--kenar); }
@media (min-width: 768px)  { .liste-arac { top: 100px; } }
@media (min-width: 1024px) { .liste-arac { top: 164px; } }
.liste-arac__ic { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .5rem .6rem; align-items: center; }
.liste-arac__secili { display: none; min-width: 0; line-height: 1.2; }
.liste-arac.yapisik .liste-arac__secili { display: block; }
.liste-arac__etiket { display: block; font-size: 10.5px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--soluk-2); }
.liste-arac__secili strong { display: block; font-size: 13.5px; font-weight: 800; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.liste-arac__degistir { display: none; }
.liste-arac.yapisik .liste-arac__degistir { display: inline-flex; }
.liste-arama { grid-column: 1 / -1; }
@media (min-width: 1024px) {
  .liste-arac__ic { grid-template-columns: minmax(0, 1fr) auto 380px; }
  .liste-arama { grid-column: auto; }
  .liste-arac__secili { display: block; }
  .liste-arac__degistir { display: inline-flex; }
}
@media (max-width: 1023px) { .liste-arac.yapisik .liste-arac__degistir span:not(.material-symbols-outlined) { display: none; } .liste-arac.yapisik .liste-arac__degistir { width: 40px; padding: 0; } }
.liste-arama { position: relative; display: flex; align-items: center; }
.liste-arama > .material-symbols-outlined { position: absolute; left: .85rem; color: var(--soluk-2); }
.liste-arama input {
  width: 100%; height: 46px; border-radius: .95rem; border: 1.5px solid var(--kenar-koyu); background: #fff;
  padding: 0 6.5rem 0 2.6rem; font-size: 14.5px; font-weight: 500;
}
.liste-arama input:focus { outline: none; border-color: var(--ink); box-shadow: 0 0 0 4px rgba(254, 222, 0, .28); }
.liste-arama button { position: absolute; right: 4.6rem; width: 32px; height: 32px; display: flex; align-items: center; justify-content: center; color: var(--soluk); }
.liste-arama button .material-symbols-outlined { font-size: 18px; }
.liste-arama__sayi {
  position: absolute; right: .45rem; font-size: 11.5px; font-weight: 800; color: var(--ink);
  background: var(--marka-50); border: 1px solid var(--marka-100); border-radius: .6rem; padding: .3rem .5rem; white-space: nowrap;
}

/* Seçili liste bilgisi */
.liste-icerik { margin-top: .75rem; scroll-margin-top: 130px; }
@media (min-width: 1024px) { .liste-icerik { scroll-margin-top: 230px; } }
.liste-bilgi { padding: 1.1rem 1.1rem 1rem; }
.liste-bilgi__ust { display: grid; gap: .8rem; }
.liste-bilgi h2 { font-size: 21px; margin-top: .45rem; letter-spacing: -.02em; }
.liste-bilgi p { color: var(--soluk); font-size: 13.5px; margin-top: .35rem; line-height: 1.5; }
.liste-bilgi__rozetler { display: flex; flex-wrap: wrap; gap: .4rem; align-content: flex-start; }
.liste-bilgi__rozetler .rozet { font-size: 11px; padding: .45rem .65rem; border-radius: .7rem; }
.liste-bilgi__rozetler .material-symbols-outlined { font-size: 15px; }
@media (min-width: 768px) {
  .liste-bilgi { padding: 1.5rem 1.6rem 1.35rem; }
  .liste-bilgi__ust { grid-template-columns: minmax(0, 1fr) auto; align-items: start; }
  .liste-bilgi h2 { font-size: 28px; }
  .liste-bilgi__rozetler { justify-content: flex-end; }
}
.liste-bilgi .not-listesi { margin-top: 1rem; }

.not-listesi { display: grid; gap: .45rem; padding-top: 1rem; border-top: 1px dashed var(--kenar-koyu); }
@media (min-width: 768px) { .not-listesi { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: .6rem; } }
.not {
  display: flex; align-items: center; gap: .65rem;
  padding: .55rem .7rem; border-radius: .85rem; background: #fafafa;
  font-size: 12.5px; font-weight: 600; line-height: 1.4; color: var(--metin);
}
.not .material-symbols-outlined {
  font-size: 18px; width: 32px; height: 32px; border-radius: .6rem; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center; background: var(--marka-50); color: var(--marka-metin); border: 1px solid var(--marka-100);
}
.not--vurgu .material-symbols-outlined { background: var(--ink); color: var(--marka); border-color: var(--ink); }
.not--basari .material-symbols-outlined { background: #ecfdf5; color: var(--yesil); border-color: #d1fae5; }

/* Ürün fiyat kartları — premium */
.fiyat-izgara { display: grid; gap: .8rem; margin-top: 1rem; }
@media (min-width: 640px)  { .fiyat-izgara { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; } }
@media (min-width: 1024px) { .fiyat-izgara { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.25rem; margin-top: 1.25rem; } }
@media (min-width: 1280px) { .fiyat-izgara { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

.fiyat-kart {
  position: relative; display: grid; min-width: 0;
  grid-template-columns: 112px minmax(0, 1fr); grid-template-areas: "medya govde" "alt alt";
  gap: .85rem; padding: .8rem;
  background: #fff; border: 1px solid var(--kenar); border-radius: 1.35rem;
  box-shadow: 0 1px 2px rgba(10, 10, 12, .04);
  transition: border-color .2s, box-shadow .25s, transform .25s var(--gecis);
  scroll-margin-top: 240px;
}
.fiyat-kart:hover { border-color: rgba(10, 10, 12, .12); box-shadow: 0 26px 50px -30px rgba(10, 10, 12, .45); transform: translateY(-3px); }
.fiyat-kart__medya { grid-area: medya; position: relative; align-self: start; }
.fiyat-kart__gorsel, .fiyat-kart__ikon {
  display: flex; align-items: center; justify-content: center; width: 100%;
  aspect-ratio: 1; border-radius: 1rem; overflow: hidden;
  background: radial-gradient(120% 90% at 75% 10%, rgba(254, 222, 0, .16), transparent 55%), linear-gradient(180deg, #fbfbfb, #efeff1);
}
.fiyat-kart__gorsel img { width: 100%; height: 100%; object-fit: contain; padding: .4rem; mix-blend-mode: multiply; transition: transform .5s var(--gecis); cursor: zoom-in; }
.fiyat-kart:hover .fiyat-kart__gorsel img { transform: scale(1.06); }
.fiyat-kart__ikon .material-symbols-outlined { font-size: 34px; color: var(--marka-metin); }
.fiyat-kart__adet {
  position: absolute; left: .4rem; bottom: .4rem; display: inline-flex; align-items: center; gap: .15rem;
  font-size: 10.5px; font-weight: 800; color: #fff; background: rgba(10, 10, 12, .72); backdrop-filter: blur(4px); border-radius: .5rem; padding: .18rem .4rem;
  pointer-events: none;
}
.fiyat-kart__adet .material-symbols-outlined { font-size: 12px; }
.fiyat-kart__rozetler { position: absolute; top: .4rem; left: .4rem; display: flex; flex-direction: column; align-items: flex-start; gap: .25rem; pointer-events: none; }
.fiyat-kart__rozetler .rozet { font-size: 9px; padding: .28rem .45rem; box-shadow: 0 4px 10px -4px rgba(10, 10, 12, .35); }

.karsilastir-kutu { position: absolute; top: .4rem; right: .4rem; cursor: pointer; }
.karsilastir-kutu input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.karsilastir-kutu__isaret {
  width: 32px; height: 32px; border-radius: .7rem; background: rgba(255, 255, 255, .92); border: 1px solid var(--kenar-koyu);
  display: flex; align-items: center; justify-content: center; color: var(--metin);
  box-shadow: 0 6px 14px -8px rgba(10, 10, 12, .4); transition: all .15s;
}
.karsilastir-kutu__isaret .material-symbols-outlined { font-size: 18px; }
.karsilastir-kutu__dolu { display: none !important; }
.karsilastir-kutu:hover .karsilastir-kutu__isaret { border-color: var(--ink); color: var(--ink); }
.karsilastir-kutu input:checked + .karsilastir-kutu__isaret { background: var(--ink); border-color: var(--ink); color: var(--marka); }
.karsilastir-kutu input:checked + .karsilastir-kutu__isaret .karsilastir-kutu__bos { display: none; }
.karsilastir-kutu input:checked + .karsilastir-kutu__isaret .karsilastir-kutu__dolu { display: inline-block !important; }
.karsilastir-kutu input:focus-visible + .karsilastir-kutu__isaret { outline: 3px solid rgba(254, 222, 0, .7); }

.fiyat-kart__govde { grid-area: govde; min-width: 0; display: flex; flex-direction: column; }
.fiyat-kart__marka { font-size: 10.5px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--marka-metin); }
.fiyat-kart__ad { margin-top: .2rem; font-size: 15px; font-weight: 800; letter-spacing: -.02em; line-height: 1.22; overflow-wrap: anywhere; }
.fiyat-kart__aciklama {
  margin-top: .3rem; font-size: 12.5px; color: var(--soluk); line-height: 1.45;
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
.fiyat-kart__ozellik { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .35rem; margin-top: .6rem; }
.fiyat-kart__ozellik div { background: #f7f7f8; border-radius: .6rem; padding: .35rem .5rem; min-width: 0; }
.fiyat-kart__ozellik dt { font-size: 9.5px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--soluk-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fiyat-kart__ozellik dd { font-size: 12px; font-weight: 700; color: var(--ink); margin-top: .05rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fiyat-kart__ozellik div:nth-child(n+3) { display: none; }

.fiyat-kart__alt { grid-area: alt; display: grid; gap: .6rem; padding-top: .75rem; border-top: 1px solid var(--kenar); }
.fiyat-kart__etiket { display: block; font-size: 10.5px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--soluk-2); }
.fiyat { font-size: 23px; font-weight: 800; letter-spacing: -.035em; line-height: 1.1; color: var(--ink); white-space: nowrap; margin-top: .15rem; }
.fiyat small { font-size: 15px; font-weight: 700; }
.odeme-ozet { display: grid; grid-template-columns: 1fr 1fr; gap: .4rem; }
.odeme-ozet div { display: flex; flex-direction: column; background: var(--marka-50); border: 1px solid var(--marka-100); border-radius: .7rem; padding: .35rem .55rem; }
.odeme-ozet dt { font-size: 10px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--marka-metin); }
.odeme-ozet dd { font-size: 13px; font-weight: 800; white-space: nowrap; }
.fiyat-kart__eylem { display: grid; grid-template-columns: 1fr 1fr; gap: .5rem; }
.fiyat-kart__eylem .btn { min-height: 44px; padding-inline: .6rem; border-radius: .9rem; }
.fiyat-kart.stok-yok .fiyat-kart__gorsel img { opacity: .5; filter: grayscale(1); }
.fiyat-kart.stok-yok .fiyat { color: var(--soluk); }
.fiyat-kart.secili { border-color: var(--ink); box-shadow: 0 0 0 3px var(--marka), 0 26px 50px -30px rgba(10, 10, 12, .45); }
.fiyat-kart.vurgulu { animation: vurgu 2.2s ease; }
@keyframes vurgu { 0%, 40% { box-shadow: 0 0 0 4px var(--marka); } 100% { box-shadow: 0 0 0 0 rgba(254, 222, 0, 0); } }

@media (min-width: 640px) {
  .fiyat-kart { grid-template-columns: minmax(0, 1fr); grid-template-areas: "medya" "govde" "alt"; padding: .7rem .7rem 1rem; gap: .9rem; }
  .fiyat-kart__gorsel, .fiyat-kart__ikon { aspect-ratio: 4 / 3; }
  .fiyat-kart__govde, .fiyat-kart__alt { padding-inline: .35rem; }
  .fiyat-kart__alt { margin-top: auto; }
  .fiyat-kart__ad { font-size: 16.5px; }
  .fiyat-kart__ozellik div:nth-child(n+3) { display: block; }
  .fiyat-kart__rozetler { top: .6rem; left: .6rem; }
  .karsilastir-kutu { top: .6rem; right: .6rem; }
  .fiyat-kart__adet { left: .6rem; bottom: .6rem; }
  .fiyat-kart--gorselsiz .fiyat-kart__ikon { aspect-ratio: 16 / 7; }
}
.fiyat-kart--gorselsiz .fiyat-kart__ikon { background: linear-gradient(135deg, var(--ink), var(--ink-700)); }
.fiyat-kart--gorselsiz .fiyat-kart__ikon .material-symbols-outlined { color: var(--marka); }

/* Fiyat listesi taksit bilgisi (ürüne göre; boşsa hiç basılmaz) */
.fiyat-kart__taksit {
  display: inline-flex; align-items: flex-start; gap: .3rem; max-width: 100%; margin-top: .4rem;
  padding: .28rem .55rem; border-radius: .6rem; background: linear-gradient(135deg, #dc2626, #c2410c); border: 1px solid #b91c1c;
  font-size: 11.5px; font-weight: 800; line-height: 1.2; color: #fff;
  box-shadow: 0 6px 14px -8px rgba(194, 65, 12, .75);
}
.fiyat-kart__taksit span:last-child { min-width: 0; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow-wrap: anywhere; }
.fiyat-kart__taksit .material-symbols-outlined { font-size: 15px; color: #fff; flex-shrink: 0; }
.detay-fiyat .fiyat-kart__taksit { font-size: 12.5px; margin-top: .1rem; }
.fiyat-kart__alt { grid-template-columns: minmax(0, 1fr); }
.fiyat-kart__fiyat { min-width: 0; }
@media (min-width: 360px) and (max-width: 639px) {
  .fiyat-kart__taksit { font-size: 10.5px; padding: .22rem .42rem; margin-top: .3rem; gap: .22rem; }
  .fiyat-kart__taksit .material-symbols-outlined { font-size: 13px; }
}

/* Mobil fiyat listesi: satırda 2 ürün (360–639px). 360px altında tekli yatay kart korunur. */
@media (min-width: 360px) and (max-width: 639px) {
  .fiyat-izgara { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .6rem; }
  .fiyat-kart {
    grid-template-columns: minmax(0, 1fr); grid-template-areas: "medya" "govde" "alt";
    gap: .55rem; padding: .45rem .45rem .6rem; border-radius: 1.1rem;
  }
  .fiyat-kart:hover { transform: none; }
  .fiyat-kart__gorsel, .fiyat-kart__ikon { aspect-ratio: 4 / 3; border-radius: .8rem; }
  .fiyat-kart--gorselsiz .fiyat-kart__ikon { aspect-ratio: 16 / 9; }
  .fiyat-kart__ikon .material-symbols-outlined { font-size: 28px; }
  .fiyat-kart__govde, .fiyat-kart__alt { padding-inline: .2rem; }
  .fiyat-kart__marka { font-size: 9.5px; letter-spacing: .1em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .fiyat-kart__ad {
    font-size: 13.5px; line-height: 1.25; letter-spacing: -.01em;
    display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
  }
  .fiyat-kart__aciklama { font-size: 11.5px; -webkit-line-clamp: 2; }
  .fiyat-kart__ozellik { grid-template-columns: minmax(0, 1fr); gap: .25rem; margin-top: .45rem; }
  .fiyat-kart__ozellik div { padding: .25rem .45rem; border-radius: .5rem; }
  .fiyat-kart__ozellik dt { font-size: 9px; }
  .fiyat-kart__ozellik dd { font-size: 11.5px; }
  .fiyat-kart__alt { margin-top: auto; gap: .45rem; padding-top: .55rem; }
  .fiyat-kart__etiket { font-size: 9.5px; letter-spacing: .06em; }
  .fiyat-kart .fiyat { font-size: clamp(15px, 4.6vw, 18px); letter-spacing: -.03em; }
  .fiyat-kart .fiyat small { font-size: 12px; }
  .fiyat-kart .odeme-ozet { grid-template-columns: minmax(0, 1fr); gap: .25rem; }
  .fiyat-kart .odeme-ozet div { padding: .25rem .45rem; border-radius: .55rem; min-width: 0; }
  .fiyat-kart .odeme-ozet dt { font-size: 8.5px; letter-spacing: .03em; }
  .fiyat-kart .odeme-ozet dd { font-size: 11.5px; }
  .fiyat-kart__eylem { grid-template-columns: 40px minmax(0, 1fr); gap: .35rem; }
  .fiyat-kart__eylem .btn { min-height: 40px; padding-inline: .4rem; border-radius: .75rem; }
  .fiyat-kart__eylem [data-detay] { font-size: 0; gap: 0; padding: 0; }
  .fiyat-kart__eylem .btn .material-symbols-outlined { font-size: 17px; }
  .fiyat-kart__rozetler { top: .3rem; left: .3rem; }
  .fiyat-kart__rozetler .rozet { font-size: 8.5px; padding: .22rem .38rem; }
  .karsilastir-kutu { top: .3rem; right: .3rem; }
  .karsilastir-kutu__isaret { width: 30px; height: 30px; border-radius: .6rem; }
  .fiyat-kart__adet { left: .3rem; bottom: .3rem; }
}

/* Karşılaştırma çubuğu */
.karsilastir-cubuk {
  position: fixed; left: .75rem; right: .75rem; bottom: calc(72px + env(safe-area-inset-bottom)); z-index: 85;
  display: flex; align-items: center; gap: .6rem;
  background: var(--ink); color: #fff; border-radius: 1.1rem; padding: .55rem .55rem .55rem .7rem;
  box-shadow: 0 24px 50px -18px rgba(10, 10, 12, .7);
}
@media (min-width: 1024px) { .karsilastir-cubuk { left: 50%; right: auto; transform: translateX(-50%); bottom: 1.25rem; min-width: 460px; } }
.karsilastir-cubuk__yuvalar { display: flex; align-items: center; gap: .3rem; }
.karsilastir-cubuk__yuvalar span {
  width: 40px; height: 40px; border-radius: .7rem; background: rgba(255, 255, 255, .08); border: 1px dashed rgba(255, 255, 255, .25);
  display: flex; align-items: center; justify-content: center; overflow: hidden; color: #71717a;
}
.karsilastir-cubuk__yuvalar img { width: 100%; height: 100%; object-fit: contain; background: #fff; }
.karsilastir-cubuk__yuvalar b { font-size: 10px; color: var(--marka); }
.karsilastir-cubuk__yazi { flex: 1; min-width: 0; line-height: 1.2; }
.karsilastir-cubuk__yazi strong { display: block; font-size: 13px; }
.karsilastir-cubuk__yazi small { display: block; font-size: 11.5px; color: #a1a1aa; }
.karsilastir-cubuk .ikon-dugme { color: #a1a1aa; width: 38px; height: 38px; }
.karsilastir-cubuk .ikon-dugme:hover { background: rgba(255, 255, 255, .08); color: #fff; }
body.karsilastirma-acik { padding-bottom: calc(140px + env(safe-area-inset-bottom)); }

/* Pencere (modal) */
.pencere { position: fixed; inset: 0; z-index: 120; display: flex; align-items: flex-end; justify-content: center; }
.pencere__perde { position: absolute; inset: 0; background: rgba(10, 10, 12, .6); backdrop-filter: blur(3px); opacity: 0; transition: opacity .2s; }
.pencere__panel {
  position: relative; width: 100%; max-height: 92vh; display: flex; flex-direction: column;
  background: #fff; border-radius: 1.5rem 1.5rem 0 0; transform: translateY(24px); opacity: 0;
  transition: transform .25s var(--gecis), opacity .2s;
}
.pencere.acik .pencere__perde { opacity: 1; }
.pencere.acik .pencere__panel { transform: none; opacity: 1; }
@media (min-width: 768px) {
  .pencere { align-items: center; padding: 1.5rem; }
  .pencere__panel { max-width: 720px; border-radius: 1.5rem; max-height: 88vh; }
  .pencere__panel--genis { max-width: 920px; }
}
.pencere__baslik { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; padding: 1.1rem 1rem 1rem 1.25rem; border-bottom: 1px solid var(--kenar); }
.pencere__baslik h2 { font-size: 19px; margin-top: .35rem; }
.pencere__govde { overflow-y: auto; padding: 1.25rem; padding-bottom: calc(1.25rem + env(safe-area-inset-bottom)); }
.detay-ust { display: grid; gap: 1rem; }
@media (min-width: 560px) { .detay-ust { grid-template-columns: 1fr 1fr; align-items: center; } }
.detay-gorsel { display: block; width: 100%; aspect-ratio: 4 / 3; border-radius: 1rem; background: #f4f4f5; overflow: hidden; cursor: zoom-in; }
.detay-gorsel img { width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply; }
.detay-fiyat { display: flex; flex-direction: column; align-items: flex-start; gap: .4rem; }
.detay-fiyat small { font-size: 12px; font-weight: 700; color: var(--soluk); text-transform: uppercase; letter-spacing: .1em; }
.detay-fiyat .fiyat { font-size: 32px; }
.odeme-ozet--buyuk { display: grid; gap: .3rem; width: 100%; background: var(--marka-50); border: 1px solid var(--marka-100); border-radius: .9rem; padding: .7rem .9rem; }
.odeme-ozet--buyuk div { justify-content: space-between; font-size: 13.5px; }
.ozellik-tablo { margin-top: 1.25rem; border: 1px solid var(--kenar); border-radius: 1rem; overflow: hidden; }
.ozellik-tablo div { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); font-size: 13.5px; }
.ozellik-tablo div:nth-child(odd) { background: #fafafa; }
.ozellik-tablo dt { padding: .65rem .9rem; color: var(--soluk); font-weight: 600; }
.ozellik-tablo dd { padding: .65rem .9rem; font-weight: 700; overflow-wrap: anywhere; }
.detay-dugmeler { display: grid; grid-template-columns: 1fr 1fr; gap: .5rem; margin-top: 1.25rem; }

.karsilastir-tablo { display: grid; grid-template-columns: minmax(90px, .8fr) minmax(0, 1fr) minmax(0, 1fr); border: 1px solid var(--kenar); border-radius: 1rem; overflow: hidden; font-size: 13px; }
.karsilastir-tablo > div { padding: .65rem .75rem; border-bottom: 1px solid var(--kenar); overflow-wrap: anywhere; }
.karsilastir-tablo__etiket { color: var(--soluk); font-weight: 600; background: #fafafa; }
.karsilastir-tablo__deger { font-weight: 700; }
.karsilastir-tablo .farkli.karsilastir-tablo__deger { background: var(--marka-50); }
.karsilastir-tablo__urun { display: flex; flex-direction: column; gap: .45rem; font-size: 13px; }
.karsilastir-tablo__urun img { width: 100%; aspect-ratio: 4 / 3; object-fit: contain; background: #f4f4f5; border-radius: .7rem; }

/* Galeri */
.galeri { position: fixed; inset: 0; z-index: 130; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1rem; padding: 3.5rem 1rem 1rem; opacity: 0; transition: opacity .2s; }
.galeri.acik { opacity: 1; }
.galeri__perde { position: absolute; inset: 0; background: rgba(10, 10, 12, .94); }
.galeri > img { position: relative; max-width: min(100%, 1000px); max-height: 72vh; object-fit: contain; border-radius: 1rem; background: #fff; }
.galeri__kapat { position: absolute; top: .75rem; right: .75rem; width: 46px; height: 46px; border-radius: 50%; background: rgba(255, 255, 255, .12); color: #fff; display: flex; align-items: center; justify-content: center; z-index: 1; }
.galeri__kapat:hover { background: var(--marka); color: var(--ink); }
.galeri__kucukler { position: relative; display: flex; gap: .5rem; overflow-x: auto; max-width: 100%; padding-bottom: .25rem; }
.galeri__kucukler button { width: 64px; height: 64px; border-radius: .7rem; overflow: hidden; background: #fff; border: 2px solid transparent; flex-shrink: 0; opacity: .6; }
.galeri__kucukler button.etkin { border-color: var(--marka); opacity: 1; }
.galeri__kucukler img { width: 100%; height: 100%; object-fit: contain; }

.bildirim {
  position: fixed; left: 50%; bottom: calc(150px + env(safe-area-inset-bottom)); transform: translateX(-50%); z-index: 140;
  background: var(--ink-800); color: #fff; font-size: 13px; font-weight: 600; padding: .7rem 1rem; border-radius: .9rem;
  box-shadow: 0 20px 40px -12px rgba(10, 10, 12, .45); white-space: nowrap;
}

/* =====================================================================
   SOSYAL MEDYA
   ===================================================================== */
.sosyal-ikon { width: 24px; height: 24px; flex-shrink: 0; }
.sosyal-blok { display: grid; gap: 1.5rem; padding: 1.75rem 1.25rem; }
.sosyal-blok h2 { color: #fff; font-size: 32px; margin-top: .75rem; }
.sosyal-blok__yazi p { color: #a1a1aa; margin-top: .75rem; line-height: 1.65; max-width: 30rem; }
.sosyal-kartlar { display: grid; gap: .75rem; }
@media (min-width: 640px) { .sosyal-blok { padding: 2.5rem 2.25rem; } .sosyal-blok h2 { font-size: 42px; } .sosyal-kartlar { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.sosyal-blok--1 .sosyal-kartlar { grid-template-columns: minmax(0, 1fr); }
@media (min-width: 1024px) {
  .sosyal-blok { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); align-items: center; padding: 3rem; gap: 3rem; }
}
.sosyal-kart {
  position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr); gap: .9rem 1rem; align-items: center;
  padding: 1.1rem; border-radius: 1.25rem; overflow: hidden;
  background: rgba(255, 255, 255, .05); border: 1px solid rgba(255, 255, 255, .1);
  transition: transform .25s var(--gecis), border-color .2s, background-color .2s;
}
.sosyal-kart:hover { transform: translateY(-3px); border-color: rgba(255, 255, 255, .25); background: rgba(255, 255, 255, .08); }
.sosyal-kart__ikon {
  width: 56px; height: 56px; border-radius: 1rem; display: flex; align-items: center; justify-content: center; color: #fff;
  box-shadow: 0 12px 24px -12px rgba(0, 0, 0, .8);
}
.sosyal-kart__ikon .sosyal-ikon { width: 30px; height: 30px; }
.sosyal-kart--instagram .sosyal-kart__ikon { background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fd5949 45%, #d6249f 60%, #285aeb 90%); }
.sosyal-kart--youtube .sosyal-kart__ikon { background: #ff0033; }
.sosyal-kart--tiktok .sosyal-kart__ikon { background: #010101; box-shadow: -2px -2px 0 #25f4ee, 2px 2px 0 #fe2c55; }
.sosyal-kart--facebook .sosyal-kart__ikon { background: #1877f2; }
.sosyal-kart__yazi { min-width: 0; line-height: 1.25; color: #fff; }
.sosyal-kart__yazi strong { display: block; font-size: 17px; font-weight: 800; }
.sosyal-kart__yazi em { display: block; font-style: normal; color: var(--marka); font-size: 14px; font-weight: 700; margin-top: .15rem; }
.sosyal-kart__yazi small { display: block; color: #a1a1aa; font-size: 13px; margin-top: .3rem; }
.sosyal-kart__dugme {
  grid-column: 1 / -1; display: inline-flex; align-items: center; justify-content: center; gap: .35rem;
  min-height: 44px; border-radius: .9rem; background: #fff; color: var(--ink);
  font-size: 12px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; transition: background-color .15s;
}
.sosyal-kart__dugme .material-symbols-outlined { font-size: 17px; }
.sosyal-kart:hover .sosyal-kart__dugme { background: var(--marka); }
@media (min-width: 640px) {
  .sosyal-blok--1 .sosyal-kart { grid-template-columns: auto minmax(0, 1fr) auto; padding: 1.5rem; }
  .sosyal-blok--1 .sosyal-kart__dugme { grid-column: auto; padding: 0 1.25rem; }
  .sosyal-blok--1 .sosyal-kart__ikon { width: 72px; height: 72px; border-radius: 1.25rem; }
  .sosyal-blok--1 .sosyal-kart__ikon .sosyal-ikon { width: 38px; height: 38px; }
  .sosyal-blok--1 .sosyal-kart__yazi strong { font-size: 20px; }
}

.ust-cubuk__sosyal .sosyal-ikon { width: 15px; height: 15px; color: var(--marka); }
.ust-cubuk__sosyal span { display: none; }
@media (min-width: 1180px) { .ust-cubuk__sosyal span { display: inline; } }
.site-alt__sosyaller { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1.1rem; }
.site-alt__sosyal {
  display: inline-flex; align-items: center; gap: .5rem;
  min-height: 42px; padding: 0 .95rem 0 .6rem; border-radius: .85rem;
  background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .12);
  color: #fff; font-size: 13px; font-weight: 700; transition: all .15s;
}
.site-alt__sosyal .sosyal-ikon { width: 20px; height: 20px; color: var(--marka); }
.site-alt__sosyal:hover { background: var(--marka); color: var(--ink); border-color: var(--marka); }
.site-alt__sosyal:hover .sosyal-ikon { color: var(--ink); }
.cekmece-sosyal { display: flex; flex-wrap: wrap; gap: .4rem; padding: .85rem 1rem 0; border-top: 1px solid var(--kenar); }
.sosyal-rozet {
  display: inline-flex; align-items: center; gap: .4rem; min-height: 40px; padding: 0 .8rem 0 .55rem;
  border-radius: .8rem; background: #f4f4f5; font-size: 13px; font-weight: 700;
}
.sosyal-rozet .sosyal-ikon { width: 20px; height: 20px; }
.sosyal-rozet--instagram .sosyal-ikon { color: #d6249f; }
.sosyal-rozet--youtube .sosyal-ikon { color: #ff0033; }
.sosyal-rozet--facebook .sosyal-ikon { color: #1877f2; }

/* =====================================================================
   İLETİŞİM SAYFASI
   ===================================================================== */
.acik-durum {
  display: inline-flex; align-items: center; gap: .45rem; margin-top: 1.1rem;
  font-size: 13px; font-weight: 700; color: #fca5a5;
  background: rgba(239, 68, 68, .1); border: 1px solid rgba(239, 68, 68, .25); border-radius: 99px; padding: .4rem .8rem;
}
.acik-durum__nokta { width: 8px; height: 8px; border-radius: 50%; background: currentColor; }
.acik-durum--acik { color: #4ade80; background: rgba(34, 197, 94, .1); border-color: rgba(34, 197, 94, .3); }
.acik-durum--acik .acik-durum__nokta { box-shadow: 0 0 0 0 rgba(74, 222, 128, .6); animation: nabiz 2s infinite; }
@keyframes nabiz { 70% { box-shadow: 0 0 0 8px rgba(74, 222, 128, 0); } 100% { box-shadow: 0 0 0 0 rgba(74, 222, 128, 0); } }
.acik-durum--acik-zemin { margin: 0 0 0 auto; font-size: 12px; padding: .3rem .65rem; color: #b91c1c; background: #fef2f2; border-color: #fecaca; }
.acik-durum--acik-zemin.acik-durum--acik { color: #15803d; background: #f0fdf4; border-color: #bbf7d0; }

.hizli-kanallar { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .6rem; }
.hizli-kanal {
  position: relative; display: flex; flex-direction: column; gap: .7rem; min-height: 116px; padding: .95rem;
  border-radius: 1.2rem; background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .12); color: #fff;
  transition: transform .2s var(--gecis), background-color .2s, border-color .2s;
}
.hizli-kanal:hover { transform: translateY(-2px); border-color: rgba(255, 255, 255, .3); }
.hizli-kanal__ikon {
  width: 44px; height: 44px; border-radius: .9rem; background: rgba(255, 255, 255, .1); color: var(--marka);
  display: flex; align-items: center; justify-content: center;
}
.hizli-kanal__ikon .material-symbols-outlined { font-size: 24px; }
.hizli-kanal__yazi { min-width: 0; line-height: 1.25; }
.hizli-kanal__yazi strong { display: block; font-size: 15px; font-weight: 800; }
.hizli-kanal__yazi small { display: block; font-size: 12px; color: #a1a1aa; margin-top: .2rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hizli-kanal__ok { position: absolute; top: .9rem; right: .9rem; font-size: 18px !important; color: #71717a; }
.hizli-kanal--marka { background: var(--marka); border-color: var(--marka); color: var(--ink); }
.hizli-kanal--marka .hizli-kanal__ikon { background: var(--ink); color: var(--marka); }
.hizli-kanal--marka small, .hizli-kanal--marka .hizli-kanal__ok { color: rgba(10, 10, 12, .65); }
.hizli-kanal--koyu { background: #fff; border-color: #fff; color: var(--ink); }
.hizli-kanal--koyu .hizli-kanal__ikon { background: var(--ink); color: var(--marka); }
.hizli-kanal--koyu small, .hizli-kanal--koyu .hizli-kanal__ok { color: var(--soluk); }
@media (min-width: 1024px) { .sayfa-baslik:has(.hizli-kanallar) { align-items: center; } }

.iletisim-konum { display: grid; gap: .9rem; }
.iletisim-konum__sol { display: grid; gap: .9rem; align-content: start; }
@media (min-width: 1024px) { .iletisim-konum { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 1.25rem; } .iletisim-konum__sol { gap: 1rem; } }
.sube-kart, .saat-kart { padding: 1.1rem; }
.sube-kart__ust, .saat-kart__ust { display: flex; align-items: center; gap: .8rem; flex-wrap: wrap; }
.sube-kart__ust > div { flex: 1; min-width: 0; }
.sube-kart__ikon {
  width: 46px; height: 46px; border-radius: .95rem; background: var(--ink); color: var(--marka);
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.sube-kart h3, .saat-kart h3 { font-size: 17px; font-weight: 800; letter-spacing: -.02em; }
.sube-kart__ust p { font-size: 12.5px; color: var(--soluk); margin-top: .15rem; }
.sube-kart__ust .rozet .material-symbols-outlined { font-size: 13px; }
.sube-kart__bilgi { display: grid; gap: .5rem; margin: 1rem 0; padding: .9rem 0; border-top: 1px solid var(--kenar); border-bottom: 1px solid var(--kenar); }
.sube-kart__bilgi li { display: flex; gap: .6rem; font-size: 14px; line-height: 1.45; }
.sube-kart__bilgi .material-symbols-outlined { font-size: 19px; color: var(--marka-metin); margin-top: .05rem; }
.sube-kart__bilgi a { font-weight: 700; }
.sube-kart__bilgi a:hover { color: var(--marka-metin); }
.sube-kart__dugmeler { display: grid; grid-template-columns: 1fr 1fr; gap: .5rem; }
.saat-kart .saat-listesi { margin-top: 1rem; }
.saat-kart h3 { flex: 1; }
.saat-listesi .bugun { background: var(--marka-50); margin: 0 -.6rem; padding-inline: .6rem; border-radius: .6rem; border-bottom-color: transparent; }
.saat-listesi dt small { font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; background: var(--ink); color: var(--marka); border-radius: .4rem; padding: .12rem .35rem; margin-left: .35rem; vertical-align: middle; }
.harita-kart { display: flex; flex-direction: column; overflow: hidden; min-height: 360px; }
.harita-kart iframe { flex: 1; width: 100%; min-height: 300px; border: 0; background: #e4e4e7; }
.harita-kart__alt { display: grid; gap: .75rem; padding: 1rem 1.1rem; }
.harita-kart__alt strong { display: block; font-size: 15px; font-weight: 800; }
.harita-kart__alt span { display: block; font-size: 13px; color: var(--soluk); margin-top: .15rem; }
@media (min-width: 640px) { .harita-kart__alt { grid-template-columns: minmax(0, 1fr) auto; align-items: center; } }
@media (min-width: 1024px) { .harita-kart { min-height: 100%; } .sube-kart, .saat-kart { padding: 1.35rem; } }

.form-blok { display: grid; gap: 1.5rem; }
@media (min-width: 1024px) { .form-blok { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 3rem; align-items: start; } }
.form-blok__bilgi h2 { font-size: 28px; margin-top: .6rem; }
.form-blok__bilgi > p { color: var(--soluk); margin-top: .7rem; line-height: 1.65; }
.form-blok__maddeler { display: grid; gap: .6rem; margin-top: 1.25rem; }
.form-blok__maddeler li { display: flex; gap: .75rem; align-items: flex-start; font-size: 13.5px; color: var(--soluk); line-height: 1.45; }
.form-blok__maddeler .material-symbols-outlined {
  width: 40px; height: 40px; border-radius: .8rem; background: #fff; border: 1px solid var(--kenar);
  display: flex; align-items: center; justify-content: center; color: var(--marka-metin); font-size: 21px;
}
.form-blok__maddeler strong { display: block; color: var(--ink); font-size: 14.5px; }
@media (min-width: 640px) { .form-blok__bilgi h2 { font-size: 36px; } }
.form-kart { padding: 1.1rem; }
@media (min-width: 640px) { .form-kart { padding: 1.75rem; } }
.form { display: grid; gap: 1rem; }
.form__ikili { display: grid; gap: 1rem; }
@media (min-width: 640px) { .form__ikili { grid-template-columns: 1fr 1fr; } }
.form textarea.alan { resize: vertical; min-height: 130px; }
.departman-secim { border: 0; padding: 0; margin: 0; }
.departman-secim__liste { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .45rem; }
.departman { position: relative; cursor: pointer; }
.departman input { position: absolute; opacity: 0; }
.departman span {
  display: flex; align-items: center; min-height: 50px; padding: .5rem .8rem; border-radius: .85rem;
  border: 1.5px solid #e6e6e9; background: #f7f7f8; font-size: 13px; font-weight: 700; line-height: 1.25; transition: all .15s;
}
.departman:hover span { border-color: var(--soluk-2); }
.departman input:checked + span { background: var(--ink); border-color: var(--ink); color: #fff; box-shadow: inset 3px 0 0 var(--marka); }
.departman input:focus-visible + span { outline: 3px solid rgba(254, 222, 0, .7); }
.dosya-alan { display: flex; align-items: center; gap: .5rem; }
.dosya-alan__secici {
  flex: 1; display: flex; align-items: center; gap: .75rem; min-height: 58px; padding: .5rem .8rem; cursor: pointer;
  border: 1.5px dashed #d4d4d8; border-radius: .95rem; background: #fafafa; transition: border-color .15s, background-color .15s;
}
.dosya-alan__secici:hover { border-color: var(--ink); background: #fff; }
.dosya-alan__ikon { width: 38px; height: 38px; border-radius: .75rem; background: var(--marka-50); color: var(--marka-metin); display: flex; align-items: center; justify-content: center; }
.dosya-alan__yazi { min-width: 0; line-height: 1.25; }
.dosya-alan__yazi strong { display: block; font-size: 13.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dosya-alan__yazi small { display: block; font-size: 12px; color: var(--soluk); margin-top: .15rem; }
.form__gonder { min-height: 54px; font-size: 13px; }
.form__not { display: flex; align-items: center; justify-content: center; gap: .35rem; font-size: 12px; color: var(--soluk); }
.form__not .material-symbols-outlined { font-size: 15px; }
.form-uyari { padding: .85rem 1rem; border-radius: .9rem; font-size: 14px; font-weight: 600; margin-bottom: 1rem; }
.form-uyari--basari { background: #f0fdf4; color: #15803d; border: 1px solid #bbf7d0; }
.form-uyari--hata { background: #fef2f2; color: #b91c1c; border: 1px solid #fecaca; }
a.yardim-serit:hover { box-shadow: var(--golge-kart); }

/* ---------------------------------------------------------------------
   Geçiş dönemi: henüz yeni tasarıma taşınmamış sayfalar (ortak.css)
   Renk ve yazı tipini yeni marka diline çeker.
   --------------------------------------------------------------------- */
body.pe-site-shell {
  --pe-primary: #fede00;
  --pe-primary-hover: #e2c500;
  --pe-primary-pressed: #b89f00;
  --pe-ink: #0a0a0c;
  --pe-canvas: #f6f6f7;
  --pe-border: #ececef;
  --pe-surface-soft: #f4f4f5;
  --pe-brand-gradient: #fede00;
  font-family: var(--font);
  padding-bottom: 0;
}
@media (max-width: 1023px) { body.pe-site-shell { padding-bottom: calc(62px + env(safe-area-inset-bottom)); } }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; scroll-behavior: auto !important; }
}
@media print {
  .site-ust, .site-alt, .alt-cubuk, .cekmece, .cekmece-perde { display: none !important; }
  body.site { background: #fff; padding: 0; }
}

@media (max-width: 639px) { .urun-izgara--vitrin > :nth-child(n+7) { display: none; } }

/* Adım 5 ince ayarlar */
@media (max-width: 479px) { .sube-kart__ust .rozet { display: none; } }
@media (min-width: 1024px) {
  .liste-arac__secili, .liste-arac__degistir { visibility: hidden; }
  .liste-arac.yapisik .liste-arac__secili, .liste-arac.yapisik .liste-arac__degistir { visibility: visible; }
}
.fiyat-kart--gorselsiz .fiyat-kart__ikon { background: radial-gradient(120% 90% at 75% 10%, rgba(254, 222, 0, .22), transparent 60%), linear-gradient(180deg, #fbfbfb, #efeff1); }
.fiyat-kart--gorselsiz .fiyat-kart__ikon .material-symbols-outlined { color: var(--marka-metin); }

/* =====================================================================
   Mobil yönlendirme: hızlı kategori, ürünlere git, "aşağıda" ipucu
   ===================================================================== */
.hizli-kategori-bolum { margin-top: .9rem; }
.hizli-kategori { padding: 1rem; border: 1.5px solid var(--ink); box-shadow: 0 18px 40px -30px rgba(10, 10, 12, .6); }
.hizli-kategori__baslik { display: flex; align-items: center; gap: .75rem; margin-bottom: .85rem; }
.hizli-kategori__adim {
  width: 38px; height: 38px; border-radius: 50%; flex-shrink: 0; background: var(--marka); color: var(--ink);
  display: flex; align-items: center; justify-content: center; font-weight: 800; font-size: 17px;
  box-shadow: 0 0 0 5px var(--marka-100);
}
.hizli-kategori__baslik h2 { font-size: 19px; font-weight: 800; letter-spacing: -.02em; line-height: 1.15; }
.hizli-kategori__baslik p { font-size: 13px; color: var(--soluk); margin-top: .15rem; }
.hizli-kategori__izgara { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; }
.hizli-kategori__oge {
  position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: .55rem;
  min-height: 104px; padding: .8rem .75rem; border-radius: 1rem; background: #f7f7f8; border: 1.5px solid transparent;
  transition: border-color .15s, background-color .15s, transform .15s;
}
.hizli-kategori__oge:active { transform: scale(.98); }
.hizli-kategori__oge:hover { border-color: var(--ink); background: #fff; }
.hizli-kategori__ikon {
  width: 42px; height: 42px; border-radius: .85rem; background: var(--ink); color: var(--marka);
  display: flex; align-items: center; justify-content: center;
}
.hizli-kategori__ikon .material-symbols-outlined { font-size: 24px; }
.hizli-kategori__yazi { line-height: 1.2; padding-right: 1rem; }
.hizli-kategori__yazi strong { display: block; font-size: 13.5px; font-weight: 800; letter-spacing: -.01em; }
.hizli-kategori__yazi small { display: block; font-size: 12px; font-weight: 600; color: var(--soluk); margin-top: .15rem; }
.hizli-kategori__ok { position: absolute; right: .5rem; top: .8rem; color: var(--soluk-2); }
.hizli-kategori__oge--ilk { grid-column: 1 / -1; flex-direction: row; align-items: center; min-height: 72px; background: var(--marka); }
.hizli-kategori__oge--ilk .hizli-kategori__yazi strong { font-size: 16px; }
.hizli-kategori__oge--ilk .hizli-kategori__yazi small { color: rgba(10, 10, 12, .7); }
.hizli-kategori__oge--ilk .hizli-kategori__ok { top: 50%; transform: translateY(-50%); color: var(--ink); }
.hizli-kategori__oge--ilk:hover { background: var(--marka-400); }
@media (min-width: 768px) {
  .hizli-kategori { padding: 1.4rem 1.5rem; }
  .hizli-kategori__izgara { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .65rem; }
  .hizli-kategori__oge--ilk { grid-column: auto; flex-direction: column; align-items: flex-start; min-height: 104px; }
  .hizli-kategori__oge--ilk .hizli-kategori__ok { top: .8rem; transform: none; }
}
@media (min-width: 1100px) { .hizli-kategori__izgara { grid-template-columns: repeat(6, minmax(0, 1fr)); } }

.asagi-bilgi {
  display: flex; align-items: center; justify-content: center; gap: .55rem; margin-top: .85rem;
  padding: .7rem .9rem; border-radius: .9rem; background: var(--marka-50); border: 1px dashed #e8d44d;
  font-size: 13px; color: var(--metin); line-height: 1.35; text-align: left;
}
.asagi-bilgi strong { color: var(--ink); }
.asagi-bilgi__ok { color: var(--marka-metin); animation: zipla 1.4s ease-in-out infinite; }
@keyframes zipla { 0%, 100% { transform: translateY(-2px); } 50% { transform: translateY(4px); } }

/* Mobilde fiyat sayfası başlıkları daha kısa */
@media (max-width: 639px) {
  .sayfa-baslik { padding: 1.35rem 1.1rem; gap: 1rem; }
  .sayfa-baslik h1 { font-size: 28px; margin-top: .55rem; }
  .sayfa-baslik__yazi > p { display: none; }
  .sayfa-baslik__sayilar { margin-top: .75rem; }
  .sayfa-baslik__sayilar li { padding: .3rem .6rem; font-size: 12px; }
  .sayfa-baslik__sayilar strong { font-size: 13.5px; }
  .katalog-arama__kutu input { height: 52px; }
  .liste-baslik__yazi { padding: 1.2rem 1.1rem 1.25rem; }
  .liste-baslik h1 { font-size: 26px; margin-top: .5rem; }
  .liste-baslik .sayfa-baslik__sayilar { display: none; }
  .liste-baslik__dugmeler { margin-top: .8rem; }
  .kirinti { margin-bottom: .6rem; font-size: 12.5px; }
  .fiyat-sayfa .kirinti a:first-child, .fiyat-sayfa .kirinti a:first-child + .material-symbols-outlined { display: none; }
}

/* Liste sayfası rehberi: ürünlere git + liste değiştir */
.liste-rehber { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .5rem; margin-top: .6rem; }
.liste-rehber__urun {
  display: flex; align-items: center; gap: .75rem; min-height: 64px; padding: .55rem .9rem .55rem .6rem;
  border-radius: 1.1rem; background: linear-gradient(180deg, #ffe733, #fede00); color: var(--ink);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .5), 0 14px 26px -16px rgba(226, 197, 0, .95);
}
.liste-rehber__ikon {
  width: 44px; height: 44px; border-radius: .85rem; background: var(--ink); color: var(--marka); flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
}
.liste-rehber__ikon .material-symbols-outlined { animation: zipla 1.4s ease-in-out infinite; }
.liste-rehber__yazi { min-width: 0; line-height: 1.2; }
.liste-rehber__yazi strong { display: block; font-size: 15.5px; font-weight: 800; letter-spacing: -.01em; }
.liste-rehber__yazi small { display: block; font-size: 12px; font-weight: 600; color: rgba(10, 10, 12, .7); margin-top: .15rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.liste-rehber__liste {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .1rem;
  min-width: 86px; min-height: 64px; padding: .4rem .6rem; border-radius: 1.1rem; background: #fff; border: 1.5px solid var(--ink);
  text-align: center; line-height: 1.1;
}
.liste-rehber__liste .material-symbols-outlined { font-size: 20px; color: var(--marka-metin); }
.liste-rehber__liste strong { display: block; font-size: 13px; font-weight: 800; }
.liste-rehber__liste small { display: block; font-size: 11px; font-weight: 700; color: var(--soluk); }
@media (min-width: 1024px) { .liste-rehber { display: none; } }

.liste-secimi__not {
  display: flex; align-items: flex-start; gap: .45rem; margin: -.2rem 0 .8rem;
  font-size: 12.5px; color: var(--soluk); line-height: 1.4;
}
.liste-secimi__not .material-symbols-outlined { font-size: 17px; color: var(--marka-metin); }
.liste-secimi__not strong { color: var(--ink); }
@media (max-width: 639px) {
  .liste-secenek { min-height: 52px; padding: .5rem .75rem; }
  .liste-secenek__yazi strong { font-size: 13px; }
  .liste-secenek__yazi small { font-size: 11.5px; }
}

.urunler-baslik {
  display: flex; align-items: center; justify-content: space-between; gap: 1rem;
  margin-top: 1.25rem; scroll-margin-top: 140px;
}
@media (min-width: 768px) { .urunler-baslik { scroll-margin-top: 170px; } }
@media (min-width: 1024px) { .urunler-baslik { scroll-margin-top: 240px; } }
.urunler-baslik h2 { display: flex; align-items: center; gap: .5rem; font-size: 20px; }
.urunler-baslik h2 .material-symbols-outlined { color: var(--marka-metin); }
.urunler-baslik span { font-size: 12px; font-weight: 800; background: var(--ink); color: var(--marka); border-radius: 99px; padding: .3rem .7rem; }
#tum-listeler { scroll-margin-top: 80px; }
@media (min-width: 1024px) { #tum-listeler { scroll-margin-top: 180px; } }
.katalog-kart { scroll-margin-top: 80px; }

/* Yüzen "aşağıda" ipucu (yalnızca mobil/tablet) */
.kaydir-ipucu {
  position: fixed; left: 50%; bottom: calc(76px + env(safe-area-inset-bottom)); z-index: 82;
  display: inline-flex; align-items: center; gap: .45rem;
  min-height: 46px; padding: 0 1.1rem 0 .8rem; border-radius: 99px;
  background: var(--ink); color: #fff; font-size: 13.5px; font-weight: 800; white-space: nowrap;
  box-shadow: 0 16px 34px -12px rgba(10, 10, 12, .7), 0 0 0 3px rgba(254, 222, 0, .9);
  opacity: 0; transform: translate(-50%, 16px); pointer-events: none;
  transition: opacity .25s ease, transform .25s var(--gecis);
}
.kaydir-ipucu .material-symbols-outlined { color: var(--marka); animation: zipla 1.4s ease-in-out infinite; }
.kaydir-ipucu.gorunur { opacity: 1; transform: translate(-50%, 0); pointer-events: auto; }
@media (min-width: 1024px) { .kaydir-ipucu { display: none; } }


/* =====================================================================
   Fiyat listeleri — "Tüm listeler" satır düzeni (v2)
   ===================================================================== */
.katalog-izgara { display: grid; grid-template-columns: minmax(0, 1fr) !important; gap: .9rem; }
.katalog-kart { display: grid !important; grid-template-columns: minmax(0, 1fr) !important; overflow: hidden; }
.katalog-kart__kapak { position: relative; display: block; aspect-ratio: 16 / 7; overflow: hidden; background: var(--ink); isolation: isolate; }
.katalog-kart__kapak img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .6s var(--gecis); z-index: -1; }
.katalog-kart__kapak::after { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(0deg, rgba(10, 10, 12, .92) 0%, rgba(10, 10, 12, .35) 55%, rgba(10, 10, 12, .05) 100%); }
.katalog-kart__kapak:hover img { transform: scale(1.05); }
.katalog-kart__kapak-yazi { position: absolute; left: 0; right: 0; bottom: 0; display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: .7rem; align-items: center; padding: .9rem 1rem; color: #fff; }
.katalog-kart__ikon { grid-row: span 2; width: 42px; height: 42px; border-radius: .85rem; background: var(--marka); color: var(--ink); display: flex; align-items: center; justify-content: center; }
.katalog-kart__ikon .material-symbols-outlined { font-size: 23px; }
.katalog-kart__kapak-yazi strong { font-size: 18px; font-weight: 800; letter-spacing: -.02em; line-height: 1.15; }
.katalog-kart__kapak-yazi small { font-size: 12.5px; font-weight: 600; color: rgba(255, 255, 255, .75); margin-top: .1rem; }
.katalog-kart__govde { padding: .9rem !important; display: flex; flex-direction: column; justify-content: center; }
.katalog-kart__etiket { font-size: 11px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--soluk-2); margin-bottom: .55rem; }
.katalog-kart .liste-dugmeleri { margin-top: 0; }
.liste-dugmeleri { display: grid; grid-template-columns: minmax(0, 1fr); gap: .5rem; }
.liste-dugme { min-height: 56px; }

@media (min-width: 768px) {
  .katalog-kart { grid-template-columns: 260px minmax(0, 1fr) !important; min-height: 190px; }
  .katalog-kart__kapak { aspect-ratio: auto; min-height: 100%; }
  .katalog-kart__kapak-yazi { grid-template-columns: minmax(0, 1fr); row-gap: .35rem; padding: 1.1rem 1.15rem; }
  .katalog-kart__ikon { grid-row: auto; margin-bottom: .35rem; }
  .katalog-kart__kapak-yazi strong { font-size: 20px; }
  .katalog-kart__govde { padding: 1.25rem 1.4rem !important; }
  .liste-dugmeleri { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .6rem; }
}
@media (min-width: 1024px) {
  .katalog-izgara { gap: 1.1rem; }
  .katalog-kart { grid-template-columns: 320px minmax(0, 1fr) !important; min-height: 210px; }
  .katalog-kart__kapak-yazi strong { font-size: 22px; }
  .katalog-kart__govde { padding: 1.5rem 1.75rem !important; }
  .liste-dugmeleri { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .liste-dugme { min-height: 64px; padding-left: 1rem; }
  .liste-dugme__ad { font-size: 14px; }
}

/* =====================================================================
   Fiyat girisi — mobilde tek karar, buyuk dokunma alanlari
   ===================================================================== */
.fiyat-giris-sayfa .fiyat-giris { padding-top: 1rem; }
.fiyat-giris__baslik { max-width: 760px; padding: .35rem 0 .2rem; }
.fiyat-giris__baslik h1 {
  max-width: 680px; margin-top: .45rem; font-size: clamp(30px, 8vw, 44px); line-height: 1.08;
  letter-spacing: -.035em;
}
.fiyat-giris__baslik p { max-width: 620px; margin-top: .7rem; color: var(--soluk); font-size: 17px; line-height: 1.55; }

.fiyat-gruplari { margin-top: 1rem; }
.fiyat-grup-izgara { display: grid; grid-template-columns: minmax(0, 1fr); gap: .8rem; }
.fiyat-grup-ogesi { min-width: 0; align-self: start; }
.fiyat-grup-kart {
  display: grid; grid-template-columns: 112px minmax(0, 1fr); align-items: stretch; min-height: 132px;
  width: 100%; color: inherit; font: inherit; text-align: left; cursor: pointer;
  padding: .65rem; overflow: hidden; background: #fff; border: 2px solid var(--kenar); border-radius: 1.2rem;
  box-shadow: 0 8px 22px -20px rgba(10, 10, 12, .55);
  transition: border-color .15s, box-shadow .15s, transform .15s;
}
.fiyat-grup-kart:hover, .fiyat-grup-kart:focus-visible {
  border-color: var(--ink); box-shadow: 0 18px 34px -24px rgba(10, 10, 12, .65); outline: none;
}
.fiyat-grup-kart:active { transform: scale(.99); }
.fiyat-grup-kart__gorsel { min-width: 0; overflow: hidden; border-radius: .85rem; background: var(--pe-surface-soft); }
.fiyat-grup-kart__gorsel img { width: 100%; height: 100%; object-fit: cover; }
.fiyat-grup-kart__yazi { display: flex; flex-direction: column; justify-content: center; min-width: 0; padding: .35rem .35rem .35rem .9rem; }
.fiyat-grup-kart__yazi > strong { font-size: 19px; font-weight: 800; line-height: 1.18; letter-spacing: -.02em; overflow-wrap: anywhere; }
.fiyat-grup-kart__yazi > small { margin-top: .35rem; color: var(--soluk); font-size: 14px; font-weight: 600; line-height: 1.35; }
.fiyat-grup-kart__eylem { display: flex; align-items: center; gap: .35rem; margin-top: .65rem; color: var(--ink); font-size: 15px; font-weight: 800; }
.fiyat-grup-kart__eylem .material-symbols-outlined { font-size: 20px; color: var(--marka-metin); transition: transform .15s; }
.fiyat-grup-kart:hover .fiyat-grup-kart__eylem .material-symbols-outlined { transform: translateY(2px); }
.fiyat-grup-kart[aria-expanded="true"] { border-color: var(--ink); border-radius: 1.2rem 1.2rem .75rem .75rem; }
.fiyat-grup-kart[aria-expanded="true"] .fiyat-grup-kart__eylem .material-symbols-outlined { transform: rotate(180deg); }

.fiyat-alt-listeler {
  margin-top: .5rem; padding: .9rem; background: #fff; border: 2px solid var(--ink); border-radius: .8rem 1rem 1rem;
  box-shadow: 0 16px 30px -24px rgba(10, 10, 12, .6);
}
.fiyat-alt-listeler[hidden] { display: none; }
.fiyat-alt-listeler h3 { font-size: 17px; font-weight: 800; line-height: 1.3; }
.fiyat-alt-listeler > p { margin-top: .55rem; color: var(--soluk); font-size: 15px; line-height: 1.45; }
.fiyat-alt-listeler__secenekler { display: grid; gap: .55rem; margin-top: .75rem; }
.fiyat-alt-liste {
  display: flex; align-items: center; justify-content: space-between; gap: .75rem; min-height: 60px;
  padding: .7rem .8rem; background: var(--pe-surface-soft); border: 1px solid var(--kenar); border-radius: .75rem;
  transition: border-color .15s, background-color .15s;
}
.fiyat-alt-liste:hover, .fiyat-alt-liste:focus-visible { background: #fff; border-color: var(--ink); outline: none; }
.fiyat-alt-liste > span:first-child { display: flex; flex-direction: column; min-width: 0; }
.fiyat-alt-liste strong { font-size: 15px; font-weight: 800; line-height: 1.3; overflow-wrap: anywhere; }
.fiyat-alt-liste small { margin-top: .2rem; color: var(--soluk); font-size: 13px; font-weight: 700; }
.fiyat-alt-liste > .material-symbols-outlined { flex: 0 0 auto; color: var(--marka-metin); font-size: 22px; }

.fiyat-arama-bolum { margin-top: 1.5rem; }
.fiyat-arama { position: relative; z-index: 3; display: grid; gap: 1rem; padding: 1rem; }
.fiyat-arama__baslik { display: flex; align-items: center; gap: .8rem; }
.fiyat-arama__ikon {
  width: 46px; height: 46px; flex-shrink: 0; display: flex; align-items: center; justify-content: center;
  border-radius: .9rem; background: var(--ink); color: var(--marka);
}
.fiyat-arama__baslik h2 { font-size: 18px; font-weight: 800; line-height: 1.2; }
.fiyat-arama__baslik p { margin-top: .2rem; color: var(--soluk); font-size: 14px; line-height: 1.4; }
.fiyat-arama .katalog-arama { position: relative; min-width: 0; }
.fiyat-arama .katalog-arama__kutu input { height: 56px; border-color: var(--kenar-koyu); font-size: 16px; }
.fiyat-arama .arama-sonuc { z-index: 4; }
.fiyat-arama .arama-sonuc__satir { min-height: 64px; }
.fiyat-arama .arama-sonuc__yazi strong, .fiyat-arama .arama-sonuc__satir b { font-size: 14.5px; }
.fiyat-yardim-bolum { margin-top: 1.5rem; margin-bottom: 3rem; }
.fiyat-giris-sayfa .yardim-serit__dugmeler .btn { min-height: 52px; font-size: 14px; }

@media (max-width: 479px) {
  .fiyat-grup-kart { grid-template-columns: 100px minmax(0, 1fr); min-height: 126px; }
  .fiyat-grup-kart__yazi { padding-left: .75rem; }
  .fiyat-grup-kart__yazi > strong { font-size: 18px; }
  .fiyat-giris-sayfa .yardim-serit__dugmeler { grid-template-columns: minmax(0, 1fr); }
}
@media (min-width: 700px) {
  .fiyat-giris-sayfa .fiyat-giris { padding-top: 1.5rem; }
  .fiyat-gruplari { margin-top: 1.5rem; }
  .fiyat-grup-izgara { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
  .fiyat-grup-kart { grid-template-columns: 150px minmax(0, 1fr); min-height: 164px; padding: .75rem; }
  .fiyat-grup-kart__yazi { padding-left: 1.1rem; }
  .fiyat-grup-kart__yazi > strong { font-size: 21px; }
  .fiyat-arama { grid-template-columns: minmax(0, 1fr) minmax(320px, .9fr); align-items: center; padding: 1.25rem; }
}
@media (min-width: 1100px) {
  .fiyat-giris__baslik h1 { font-size: 48px; }
  .fiyat-grup-kart { grid-template-columns: 170px minmax(0, 1fr); min-height: 178px; }
  .fiyat-grup-kart__yazi > strong { font-size: 23px; }
  .fiyat-grup-kart__yazi > small { font-size: 15px; }
}

/* =====================================================================
   Fiyat listesi — okunabilir, fiyat-oncelikli urun kartlari
   ===================================================================== */
.fiyat-sayfa .fiyat-izgara { grid-template-columns: minmax(0, 1fr); gap: 1rem; }
.fiyat-sayfa .fiyat-kart {
  grid-template-columns: minmax(0, 1fr); grid-template-areas: "medya" "govde" "alt";
  gap: 1rem; padding: .85rem; border-width: 1.5px; border-radius: 1.25rem; scroll-margin-top: 190px;
}
.fiyat-sayfa .fiyat-kart:hover { transform: none; }
.fiyat-sayfa .fiyat-kart__gorsel,
.fiyat-sayfa .fiyat-kart__ikon { aspect-ratio: 4 / 3; border-radius: 1rem; }
.fiyat-sayfa .fiyat-kart--gorselsiz .fiyat-kart__ikon { aspect-ratio: 16 / 8; }
.fiyat-sayfa .fiyat-kart__gorsel img { padding: .65rem; }
.fiyat-sayfa .fiyat-kart__govde,
.fiyat-sayfa .fiyat-kart__alt { padding-inline: .25rem; }
.fiyat-sayfa .fiyat-kart__marka { font-size: 11.5px; letter-spacing: .1em; }
.fiyat-sayfa .fiyat-kart__ad { margin-top: .25rem; font-size: 20px; line-height: 1.2; }
.fiyat-sayfa .fiyat-kart__fiyat { margin-top: .8rem; }
.fiyat-sayfa .fiyat-kart__etiket { font-size: 11.5px; letter-spacing: .07em; }
.fiyat-sayfa .fiyat-kart .fiyat { margin-top: .25rem; font-size: 30px; line-height: 1; }
.fiyat-sayfa .fiyat-kart .fiyat small { font-size: 18px; }
.fiyat-sayfa .fiyat-kart__taksit { margin-top: .55rem; padding: .4rem .6rem; font-size: 13px; line-height: 1.3; }
.fiyat-sayfa .fiyat-kart__taksit .material-symbols-outlined { font-size: 17px; }
.fiyat-sayfa .fiyat-kart__ozellik { grid-template-columns: minmax(0, 1fr); gap: .4rem; margin-top: .9rem; }
.fiyat-sayfa .fiyat-kart__ozellik div {
  display: grid; grid-template-columns: minmax(86px, .8fr) minmax(0, 1.2fr); align-items: baseline; gap: .65rem;
  min-height: 42px; padding: .55rem .7rem; border-radius: .7rem;
}
.fiyat-sayfa .fiyat-kart__ozellik div:nth-child(n+3) { display: grid; }
.fiyat-sayfa .fiyat-kart__ozellik dt {
  font-size: 12px; letter-spacing: .035em; overflow: visible; text-overflow: clip; white-space: normal;
}
.fiyat-sayfa .fiyat-kart__ozellik dd {
  font-size: 14px; line-height: 1.3; text-align: right; overflow: visible; text-overflow: clip; white-space: normal;
}
.fiyat-sayfa .fiyat-kart__alt { gap: .75rem; margin-top: auto; padding-top: .9rem; }
.fiyat-sayfa .fiyat-kart .odeme-ozet { grid-template-columns: minmax(0, 1fr); gap: .4rem; }
.fiyat-sayfa .fiyat-kart .odeme-ozet div { min-height: 48px; padding: .5rem .65rem; }
.fiyat-sayfa .fiyat-kart .odeme-ozet dt { font-size: 11px; }
.fiyat-sayfa .fiyat-kart .odeme-ozet dd { font-size: 14px; }
.fiyat-sayfa .fiyat-kart__eylem { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .45rem; }
.fiyat-sayfa .fiyat-kart__eylem .btn {
  min-height: 46px; padding-inline: .55rem; border-radius: .8rem; font-size: 13px;
}
.fiyat-sayfa .fiyat-kart__eylem [data-detay] { font-size: 13px; gap: .35rem; padding-inline: .55rem; }
.fiyat-sayfa .fiyat-kart__eylem .btn .material-symbols-outlined { font-size: 18px; }

.fiyat-sayfa .karsilastir-kutu {
  top: .65rem; right: .65rem; display: flex; align-items: center; gap: .35rem; min-height: 44px;
  padding: .3rem .55rem .3rem .3rem; border: 1px solid var(--kenar-koyu); border-radius: .85rem;
  background: rgba(255, 255, 255, .96); box-shadow: 0 8px 18px -12px rgba(10, 10, 12, .65);
}
.fiyat-sayfa .karsilastir-kutu__isaret { width: 32px; height: 32px; border: 0; box-shadow: none; background: #f4f4f5; }
.fiyat-sayfa .karsilastir-kutu__yazi { font-size: 12px; font-weight: 800; color: var(--metin); }
.fiyat-sayfa .karsilastir-kutu:has(input:checked) { border-color: var(--ink); background: var(--ink); }
.fiyat-sayfa .karsilastir-kutu:has(input:checked) .karsilastir-kutu__yazi { color: #fff; }
.fiyat-sayfa .fiyat-kart__rozetler { top: .65rem; left: .65rem; }
.fiyat-sayfa .fiyat-kart__rozetler .rozet { font-size: 10.5px; padding: .35rem .5rem; }
.fiyat-sayfa .fiyat-kart__adet { left: .65rem; bottom: .65rem; font-size: 11.5px; padding: .25rem .45rem; }

@media (max-width: 639px) {
  .fiyat-sayfa .fiyat-izgara { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .65rem; }
  .fiyat-sayfa .fiyat-kart { gap: .6rem; padding: .5rem; border-radius: 1rem; }
  .fiyat-sayfa .fiyat-kart__gorsel,
  .fiyat-sayfa .fiyat-kart__ikon { border-radius: .75rem; }
  .fiyat-sayfa .fiyat-kart__gorsel img { padding: .25rem; }
  .fiyat-sayfa .fiyat-kart__govde,
  .fiyat-sayfa .fiyat-kart__alt { padding-inline: .1rem; }
  .fiyat-sayfa .fiyat-kart__marka { font-size: 10px; letter-spacing: .07em; }
  .fiyat-sayfa .fiyat-kart__ad { min-height: 2.4em; font-size: 16px; line-height: 1.2; }
  .fiyat-sayfa .fiyat-kart__fiyat { margin-top: .55rem; }
  .fiyat-sayfa .fiyat-kart__etiket { font-size: 9.5px; }
  .fiyat-sayfa .fiyat-kart .fiyat { font-size: clamp(21px, 6.2vw, 25px); white-space: nowrap; }
  .fiyat-sayfa .fiyat-kart .fiyat small { font-size: 14px; }
  .fiyat-sayfa .fiyat-kart__taksit { padding: .35rem .4rem; font-size: 11px; }
  .fiyat-sayfa .fiyat-kart__taksit .material-symbols-outlined { display: none; }
  .fiyat-sayfa .fiyat-kart__ozellik { gap: .3rem; margin-top: .65rem; }
  .fiyat-sayfa .fiyat-kart__ozellik div {
    grid-template-columns: minmax(0, 1fr); gap: .15rem; min-height: 48px; padding: .4rem .45rem;
  }
  .fiyat-sayfa .fiyat-kart__ozellik div:nth-child(n+3) { display: none; }
  .fiyat-sayfa .fiyat-kart__ozellik dt { font-size: 9.5px; }
  .fiyat-sayfa .fiyat-kart__ozellik dd { font-size: 12px; line-height: 1.2; text-align: left; }
  .fiyat-sayfa .fiyat-kart__alt { gap: .5rem; padding-top: .55rem; }
  .fiyat-sayfa .fiyat-kart .odeme-ozet { gap: .3rem; }
  .fiyat-sayfa .fiyat-kart .odeme-ozet div { min-height: 43px; padding: .4rem .45rem; }
  .fiyat-sayfa .fiyat-kart .odeme-ozet dt { font-size: 9px; }
  .fiyat-sayfa .fiyat-kart .odeme-ozet dd { font-size: 12px; }
  .fiyat-sayfa .fiyat-kart__eylem { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .3rem; }
  .fiyat-sayfa .fiyat-kart__eylem .btn,
  .fiyat-sayfa .fiyat-kart__eylem [data-detay] {
    min-height: 44px; padding-inline: .2rem; border-radius: .7rem; font-size: 10.5px; line-height: 1;
  }
  .fiyat-sayfa .fiyat-kart__eylem .btn .material-symbols-outlined { display: none; }
  .fiyat-sayfa .karsilastir-kutu { top: .4rem; right: .4rem; min-height: 38px; gap: .2rem; padding: .2rem .4rem .2rem .2rem; }
  .fiyat-sayfa .karsilastir-kutu__isaret { width: 28px; height: 28px; }
  .fiyat-sayfa .karsilastir-kutu__yazi { font-size: 10px; }
  .fiyat-sayfa .fiyat-kart__rozetler { top: .4rem; left: .4rem; }
  .fiyat-sayfa .fiyat-kart__adet { left: .4rem; bottom: .4rem; }
}

@media (min-width: 640px) {
  .fiyat-sayfa .fiyat-izgara { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
  .fiyat-sayfa .fiyat-kart { padding: .9rem; }
}
@media (min-width: 1100px) {
  .fiyat-sayfa .fiyat-izgara { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.2rem; }
  .fiyat-sayfa .fiyat-kart__ad { font-size: 21px; }
}
@media (min-width: 1280px) {
  .fiyat-sayfa .fiyat-izgara { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .fiyat-sayfa .fiyat-kart__eylem .btn,
  .fiyat-sayfa .fiyat-kart__eylem [data-detay] { font-size: 13.5px; padding-inline: .55rem; }
}

/* =====================================================================
   Urun detayi — gorsel, ad, fiyat, kisa ozellikler, iletisim
   ===================================================================== */
#productModal .pencere__panel { max-height: 96vh; }
#productModal .pencere__baslik--yalin {
  position: absolute; top: .6rem; right: .6rem; z-index: 3; width: auto; padding: 0; border: 0;
}
#productModal .pencere__baslik--yalin .ikon-dugme {
  width: 48px; height: 48px; background: rgba(255, 255, 255, .96); border: 1px solid var(--kenar-koyu);
  box-shadow: 0 10px 24px -16px rgba(10, 10, 12, .8);
}
#productModal .pencere__govde { padding: .8rem; padding-bottom: calc(1rem + env(safe-area-inset-bottom)); }
.detay-icerik { display: grid; gap: 1rem; }
#productModal .detay-gorsel {
  position: relative; aspect-ratio: 4 / 3; border-radius: 1.15rem; cursor: default;
  border: 1px solid var(--kenar); background: linear-gradient(180deg, #fafafa, #f1f1f3);
}
#productModal button.detay-gorsel { cursor: zoom-in; }
#productModal .detay-gorsel img { padding: .6rem; }
.detay-gorsel__buyut {
  position: absolute; left: 50%; bottom: .65rem; transform: translateX(-50%);
  display: inline-flex; align-items: center; justify-content: center; gap: .35rem; min-height: 44px;
  padding: .4rem .75rem; border-radius: 99px; background: rgba(10, 10, 12, .88); color: #fff;
  font-size: 13px; font-weight: 800; white-space: nowrap; box-shadow: 0 10px 20px -12px rgba(10, 10, 12, .8);
}
.detay-gorsel__buyut .material-symbols-outlined { color: var(--marka); font-size: 19px; }
.detay-kimlik { padding: .1rem .35rem 0; }
.detay-kimlik__marka {
  display: block; margin-bottom: .3rem; color: var(--marka-metin); font-size: 12px; font-weight: 800;
  letter-spacing: .1em; text-transform: uppercase;
}
.detay-kimlik h2 { font-size: 25px; line-height: 1.18; letter-spacing: -.025em; }
#productModal .detay-fiyat {
  gap: .45rem; padding: 1rem; border: 1px solid var(--kenar); border-left: 5px solid var(--marka);
  border-radius: 1rem; background: #fafafa;
}
#productModal .detay-fiyat > small { font-size: 12px; font-weight: 800; color: var(--soluk-2); }
#productModal .detay-fiyat .fiyat { margin: 0; font-size: 35px; line-height: 1; }
#productModal .detay-fiyat .fiyat-kart__taksit { margin-top: .2rem; padding: .45rem .65rem; font-size: 13.5px; }
#productModal .detay-fiyat > .rozet { margin-top: .2rem; padding: .4rem .65rem; font-size: 12px; }
.detay-ozellikler { margin-top: .15rem; }
.detay-ozellikler > h3 { padding-inline: .25rem; font-size: 18px; font-weight: 800; }
#productModal .ozellik-tablo { margin-top: .65rem; border-radius: .9rem; }
#productModal .ozellik-tablo div { grid-template-columns: minmax(105px, .9fr) minmax(0, 1.1fr); min-height: 48px; font-size: 14px; }
#productModal .ozellik-tablo dt { padding: .75rem; color: var(--soluk); font-weight: 700; }
#productModal .ozellik-tablo dd { padding: .75rem; text-align: right; font-weight: 800; }
.detay-tum-ozellikler { margin-top: .65rem; }
.detay-tum-ozellikler summary {
  display: flex; align-items: center; justify-content: center; gap: .45rem; min-height: 50px; padding: .55rem .8rem;
  border: 1.5px solid var(--kenar-koyu); border-radius: .85rem; background: #fff; cursor: pointer;
  font-size: 14px; font-weight: 800; list-style: none;
}
.detay-tum-ozellikler summary::-webkit-details-marker { display: none; }
.detay-tum-ozellikler summary .material-symbols-outlined { font-size: 20px; color: var(--marka-metin); transition: transform .15s; }
.detay-tum-ozellikler[open] summary .material-symbols-outlined { transform: rotate(45deg); }
#productModal .ozellik-tablo--devam { margin-top: .5rem; }
#productModal .detay-dugmeler { grid-template-columns: minmax(0, 1fr); gap: .55rem; margin-top: .25rem; }
#productModal .detay-dugmeler .btn { min-height: 56px; padding-inline: .9rem; border-radius: .95rem; font-size: 15px; }
#productModal .detay-dugmeler .material-symbols-outlined { font-size: 22px; }

@media (min-width: 640px) {
  #productModal .pencere__panel { max-width: 760px; }
  #productModal .pencere__govde { padding: 1.15rem; }
  .detay-icerik { grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr); gap: 1rem 1.25rem; }
  #productModal .detay-gorsel { grid-row: 1 / span 2; aspect-ratio: 1; }
  .detay-kimlik { align-self: end; padding: .4rem 0 0; }
  .detay-kimlik h2 { font-size: 28px; }
  #productModal .detay-fiyat { align-self: start; }
  .detay-ozellikler, #productModal .detay-dugmeler { grid-column: 1 / -1; }
  #productModal .detay-dugmeler { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #productModal .detay-dugmeler__satin-al { grid-column: 1 / -1; }
}
.katalog-kart--tek .liste-dugmeleri { grid-template-columns: minmax(0, 1fr); }

/* Liste düğmesi: ad üstte, ürün sayısı altta -> uzun adlara daha fazla yer */
.liste-dugme {
  grid-template-columns: minmax(0, 1fr) auto !important; grid-template-areas: "ad ok" "sayi ok";
  row-gap: .15rem !important; align-content: center;
}
.liste-dugme__ad { grid-area: ad; }
.liste-dugme__sayi { grid-area: sayi; }
.liste-dugme__ok { grid-area: ok; }
@media (min-width: 768px) {
  .katalog-kart--1 .liste-dugmeleri { grid-template-columns: minmax(0, 1fr); }
  .katalog-kart--2 .liste-dugmeleri { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .katalog-kart--1 .liste-dugme, .katalog-kart--2 .liste-dugme { min-height: 84px; padding: .9rem .9rem .9rem 1.2rem; background: linear-gradient(135deg, #f7f7f8, #fff); border-color: var(--kenar-koyu); }
  .katalog-kart--1 .liste-dugme__ad, .katalog-kart--2 .liste-dugme__ad { font-size: 16px; }
  .katalog-kart--1 .liste-dugme__ok, .katalog-kart--2 .liste-dugme__ok { width: 46px; height: 46px; background: var(--ink); border-color: var(--ink); color: var(--marka); border-radius: .9rem; }
}

/* =====================================================================
   KURUMSAL SAYFALAR: Hakkımızda, Hizmetler, Servis & Destek
   ===================================================================== */
.ic-hero__aciklama { color: #a1a1aa; margin-top: .8rem; line-height: 1.65; max-width: 36rem; font-size: 15px; }
@media (max-width: 639px) { .ic-hero__aciklama { font-size: 14px; margin-top: .6rem; } .ic-hero h1 { font-size: 28px; } }
@media (min-width: 1024px) { .ic-hero { min-height: 360px; } .ic-hero h1 { font-size: 48px; } .ic-hero .liste-baslik__yazi { align-self: center; } }

/* Hakkımızda */
.hikaye { display: grid; gap: 1.5rem; }
.hikaye__yazi h2 { font-size: 28px; margin-top: .6rem; }
.hikaye__yazi p { color: var(--metin); line-height: 1.75; margin-top: .9rem; font-size: 15.5px; max-width: 42rem; }
.hikaye__sayilar { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .6rem; align-content: center; }
.hikaye__sayilar div { background: #fff; border: 1px solid var(--kenar); border-radius: 1.1rem; padding: 1rem 1.1rem; display: flex; flex-direction: column-reverse; gap: .25rem; border-left: 3px solid var(--marka); }
.hikaye__sayilar dt { font-size: 12.5px; font-weight: 600; color: var(--soluk); line-height: 1.35; }
.hikaye__sayilar dd { font-size: 26px; font-weight: 800; letter-spacing: -.03em; line-height: 1.1; }
@media (min-width: 640px) { .hikaye__yazi h2 { font-size: 36px; } }
@media (min-width: 1024px) { .hikaye { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 3rem; } .hikaye__sayilar dd { font-size: 32px; } }

.deger-izgara { display: grid; gap: .75rem; }
@media (min-width: 640px) { .deger-izgara { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; } }
@media (min-width: 1024px) { .deger-izgara { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.25rem; } }
.deger-kart { padding: 1.25rem; display: flex; flex-direction: column; }
.deger-kart h3 { font-size: 17px; font-weight: 800; letter-spacing: -.02em; margin-top: 1rem; }
.deger-kart p { font-size: 14px; color: var(--soluk); line-height: 1.6; margin-top: .45rem; }

.marka-panel { display: grid; gap: 1.25rem; padding: 1.75rem 1.25rem; }
.marka-panel h2 { font-size: 30px; margin-top: .7rem; }
.marka-panel p { margin-top: .6rem; color: rgba(10, 10, 12, .72); line-height: 1.6; }
.marka-panel__liste { display: flex; flex-wrap: wrap; gap: .5rem; align-content: center; }
.marka-panel__liste li { background: var(--ink); color: #fff; font-weight: 800; font-size: 15px; letter-spacing: .02em; border-radius: .9rem; padding: .75rem 1.1rem; }
@media (min-width: 1024px) { .marka-panel { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); padding: 3rem; gap: 3rem; align-items: center; } .marka-panel h2 { font-size: 42px; } .marka-panel__liste li { font-size: 17px; padding: .95rem 1.4rem; } }

/* Hizmetler */
.hizmet-atla { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .45rem; margin-top: .75rem; }
.hizmet-atla a {
  display: flex; align-items: center; gap: .5rem; min-height: 50px; padding: .45rem .7rem; border-radius: .9rem;
  background: #fff; border: 1px solid var(--kenar); font-size: 12.5px; font-weight: 800; line-height: 1.2; transition: all .15s;
}
.hizmet-atla a .material-symbols-outlined { width: 32px; height: 32px; border-radius: .6rem; background: var(--ink); color: var(--marka); display: flex; align-items: center; justify-content: center; font-size: 19px; }
.hizmet-atla a:hover { border-color: var(--ink); }
@media (min-width: 768px) { .hizmet-atla { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1100px) { .hizmet-atla { grid-template-columns: repeat(5, minmax(0, 1fr)); } }

.hizmet-detaylar { display: grid; gap: 1rem; }
@media (min-width: 1024px) { .hizmet-detaylar { gap: 1.5rem; } }
.hizmet-detay { display: grid; overflow: hidden; scroll-margin-top: 90px; }
@media (min-width: 1024px) { .hizmet-detay { scroll-margin-top: 190px; } }
.hizmet-detay__gorsel { display: block; aspect-ratio: 16 / 9; overflow: hidden; background: var(--ink); }
.hizmet-detay__gorsel img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s var(--gecis); }
.hizmet-detay:hover .hizmet-detay__gorsel img { transform: scale(1.04); }
.hizmet-detay__yazi { padding: 1.25rem; display: flex; flex-direction: column; }
.hizmet-detay__yazi h2 { font-size: 24px; margin-top: .9rem; }
.hizmet-detay__yazi > p { color: var(--soluk); line-height: 1.65; margin-top: .55rem; font-size: 15px; }
.tik-liste { display: grid; gap: .45rem; margin-top: 1rem; }
.tik-liste li { display: flex; align-items: flex-start; gap: .5rem; font-size: 14px; font-weight: 600; color: var(--metin); line-height: 1.4; }
.tik-liste .material-symbols-outlined { font-size: 19px; color: var(--marka-metin); font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 0, 'opsz' 24; }
.hizmet-detay__dugmeler { display: grid; grid-template-columns: 1fr 1fr; gap: .5rem; margin-top: 1.25rem; }
@media (min-width: 768px) {
  .hizmet-detay { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .hizmet-detay__gorsel { aspect-ratio: auto; min-height: 100%; }
  .hizmet-detay--ters .hizmet-detay__gorsel { order: 2; }
  .hizmet-detay__yazi { padding: 2rem; justify-content: center; }
  .hizmet-detay__dugmeler { display: flex; flex-wrap: wrap; }
}
@media (min-width: 1024px) { .hizmet-detay { min-height: 380px; } .hizmet-detay__yazi { padding: 2.75rem 3rem; } .hizmet-detay__yazi h2 { font-size: 32px; } }

.surec { display: grid; gap: 1.5rem; padding: 1.75rem 1.25rem; }
.surec__baslik h2 { color: #fff; font-size: 30px; margin-top: .7rem; }
.surec__baslik .btn { margin-top: 1rem; }
.surec__adimlar { display: grid; gap: .6rem; counter-reset: none; }
.surec__adimlar li {
  position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: .85rem; row-gap: .2rem;
  padding: 1rem; border-radius: 1.1rem; background: rgba(255, 255, 255, .05); border: 1px solid rgba(255, 255, 255, .1); color: #a1a1aa; font-size: 13.5px; line-height: 1.5;
}
.surec__no { grid-row: span 2; width: 40px; height: 40px; border-radius: 50%; background: var(--marka); color: var(--ink); font-weight: 800; font-size: 17px; display: flex; align-items: center; justify-content: center; }
.surec__ikon { display: none !important; }
.surec__adimlar strong { color: #fff; font-size: 15.5px; }
@media (min-width: 768px) { .surec__adimlar { grid-template-columns: repeat(2, minmax(0, 1fr)); } .surec { padding: 2.5rem 2.25rem; } .surec__baslik h2 { font-size: 40px; } }
@media (min-width: 1024px) {
  .surec { padding: 3rem; }
  .surec__baslik { display: flex; align-items: flex-end; justify-content: space-between; gap: 2rem; flex-wrap: wrap; }
  .surec__adimlar { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .surec__adimlar li { grid-template-columns: minmax(0, 1fr); padding: 1.4rem; row-gap: .45rem; }
  .surec__no { grid-row: auto; margin-bottom: .5rem; }
}

/* Servis */
.servis-arama { margin-bottom: 1rem; max-width: 560px; }
.servis-izgara { display: grid; gap: .6rem; }
@media (min-width: 768px) { .servis-izgara { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem; } }
@media (min-width: 1280px) { .servis-izgara { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.servis-kalem { background: #fff; border: 1px solid var(--kenar); border-radius: 1.1rem; padding: 1rem 1.1rem; display: flex; flex-direction: column; gap: .45rem; transition: border-color .15s, box-shadow .2s; }
.servis-kalem:hover { border-color: rgba(10, 10, 12, .15); box-shadow: 0 18px 36px -26px rgba(10, 10, 12, .45); }
.servis-kalem__ust { display: flex; align-items: flex-start; justify-content: space-between; gap: .75rem; }
.servis-kalem h3 { font-size: 15.5px; font-weight: 800; letter-spacing: -.015em; line-height: 1.25; }
.servis-kalem__fiyat { font-size: 18px; font-weight: 800; letter-spacing: -.03em; white-space: nowrap; background: var(--marka-50); border: 1px solid var(--marka-100); border-radius: .7rem; padding: .2rem .55rem; }
.servis-kalem__fiyat small { font-size: 13px; }
.servis-kalem__detay { font-size: 13.5px; color: var(--soluk); line-height: 1.5; }
.servis-kalem__etiketler { display: flex; flex-wrap: wrap; gap: .35rem; margin-top: auto; padding-top: .2rem; }
.servis-kalem .cip { min-height: 30px; font-size: 12px; padding: .25rem .6rem; }
.cip--garanti { background: #ecfdf5; color: var(--yesil); }
.cip--garanti .material-symbols-outlined { color: var(--yesil); }
.servis-not { display: flex; align-items: flex-start; gap: .45rem; margin-top: 1rem; font-size: 13px; color: var(--soluk); line-height: 1.5; }
.servis-not .material-symbols-outlined { font-size: 18px; color: var(--marka-metin); }
.servis-nokta { display: grid; gap: 1rem; }
@media (min-width: 1024px) { .servis-nokta { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 1.25rem; align-items: start; } }
.servis-nokta .sube-kart h2 { font-size: 19px; }
.sss-mini { padding: 1.1rem 1.25rem; }
.sss-mini > h2 { display: flex; align-items: center; gap: .5rem; font-size: 19px; margin-bottom: .5rem; }
.sss-mini > h2 .material-symbols-outlined { color: var(--marka-metin); }
.sss-oge { border-bottom: 1px solid var(--kenar); }
.sss-oge summary { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 56px; padding: .6rem 0; cursor: pointer; list-style: none; font-size: 14.5px; font-weight: 700; line-height: 1.35; }
.sss-oge summary::-webkit-details-marker { display: none; }
.sss-oge summary .material-symbols-outlined { transition: transform .2s; color: var(--soluk); }
.sss-oge[open] summary .material-symbols-outlined { transform: rotate(180deg); }
.sss-oge > div { padding: 0 0 1rem; font-size: 14px; color: var(--soluk); line-height: 1.65; }
.sss-mini .metin-link { margin-top: 1rem; }

/* Adım 6 ince ayarlar */
@media (min-width: 1024px) {
  .surec__baslik { display: grid !important; grid-template-columns: minmax(0, 1fr) auto; align-items: end; column-gap: 2rem; row-gap: 0; justify-content: stretch; }
  .surec__baslik .ust-yazi, .surec__baslik h2 { grid-column: 1; }
  .surec__baslik .btn { grid-column: 2; grid-row: 1 / span 2; align-self: end; margin: 0; }
}
@media (max-width: 639px) {
  .ic-hero .liste-baslik__gorsel { display: block; position: relative; order: -1; aspect-ratio: 16 / 8; }
  .ic-hero .liste-baslik__gorsel img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
  .ic-hero .liste-baslik__gorsel::after { content: ''; position: absolute; inset: 0; background: linear-gradient(0deg, var(--ink), rgba(10, 10, 12, 0) 60%); }
  .ic-hero .liste-baslik__yazi { margin-top: -1.5rem; }
}

/* =====================================================================
   SSS, BLOG, BLOG YAZISI
   ===================================================================== */
.sss-duzen { display: grid; gap: 1.25rem; }
@media (min-width: 1024px) { .sss-duzen { grid-template-columns: minmax(0, 8fr) minmax(0, 4fr); gap: 1.5rem; align-items: start; } .sss-yan { position: sticky; top: 184px; } }
.sss-liste { display: grid; gap: .6rem; }
.sss-kart { overflow: hidden; transition: border-color .15s, box-shadow .2s; }
.sss-kart[open] { border-color: rgba(10, 10, 12, .16); box-shadow: 0 18px 36px -28px rgba(10, 10, 12, .45); }
.sss-kart summary { display: flex; align-items: center; gap: .85rem; min-height: 64px; padding: .8rem 1rem; cursor: pointer; list-style: none; }
.sss-kart summary::-webkit-details-marker { display: none; }
.sss-kart__no { font-size: 12px; font-weight: 800; color: var(--marka-metin); background: var(--marka-50); border: 1px solid var(--marka-100); border-radius: .6rem; padding: .25rem .45rem; flex-shrink: 0; }
.sss-kart__soru { flex: 1; font-size: 15.5px; font-weight: 800; letter-spacing: -.015em; line-height: 1.3; }
.sss-kart__ikon { width: 36px; height: 36px; border-radius: .75rem; background: #f4f4f5; display: flex; align-items: center; justify-content: center; flex-shrink: 0; transition: background-color .15s, transform .25s; }
.sss-kart[open] .sss-kart__ikon { background: var(--ink); color: var(--marka); }
.sss-kart__ikon .material-symbols-outlined { transition: transform .25s; }
.sss-kart[open] .sss-kart__ikon .material-symbols-outlined { transform: rotate(45deg); }
.sss-kart__cevap { padding: 0 1rem 1.1rem 3.6rem; font-size: 15px; color: var(--metin); line-height: 1.75; }
@media (max-width: 479px) { .sss-kart__no { display: none; } .sss-kart__cevap { padding-left: 1rem; } .sss-kart__soru { font-size: 15px; } }
@media (min-width: 640px) { .sss-kart summary { padding: 1rem 1.25rem; min-height: 72px; } .sss-kart__cevap { padding-right: 1.5rem; } }

.sss-yan { display: grid; gap: .75rem; }
.sss-yardim { display: grid; gap: .6rem; padding: 1.4rem; }
.sss-yardim h2 { color: #fff; font-size: 21px; margin-top: .4rem; }
.sss-yardim p { color: #a1a1aa; font-size: 14px; line-height: 1.6; margin-bottom: .4rem; }
.sss-yardim .yardim-serit__ikon { background: var(--marka); color: var(--ink); }
.sss-baglantilar { padding: .4rem; }
.sss-baglantilar a { display: flex; align-items: center; gap: .7rem; min-height: 52px; padding: 0 .75rem; border-radius: .85rem; font-size: 14px; font-weight: 700; }
.sss-baglantilar a span:not(.material-symbols-outlined) { flex: 1; }
.sss-baglantilar a .material-symbols-outlined:first-child { color: var(--marka-metin); }
.sss-baglantilar a .material-symbols-outlined:last-child { color: var(--soluk-2); }
.sss-baglantilar a:hover { background: var(--marka-50); }
@media (min-width: 1024px) { .deger-izgara--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

/* Blog */
.blog-vitrin { display: grid; overflow: hidden; }
.blog-vitrin__gorsel { position: relative; display: block; aspect-ratio: 16 / 10; overflow: hidden; background: #e4e4e7; }
.blog-vitrin__gorsel img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s var(--gecis); }
.blog-vitrin:hover .blog-vitrin__gorsel img { transform: scale(1.03); }
.blog-vitrin__gorsel .rozet { position: absolute; top: .9rem; left: .9rem; }
.blog-vitrin__yazi { display: flex; flex-direction: column; align-items: flex-start; gap: .8rem; padding: 1.25rem; }
.blog-vitrin__yazi strong { font-size: 24px; line-height: 1.2; }
.blog-vitrin__ozet { color: var(--soluk); line-height: 1.65; font-size: 15px; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
.blog-vitrin__yazi .btn { margin-top: .3rem; }
@media (min-width: 900px) {
  .blog-vitrin { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); min-height: 420px; }
  .blog-vitrin__gorsel { aspect-ratio: auto; }
  .blog-vitrin__yazi { justify-content: center; padding: 2.5rem; }
  .blog-vitrin__yazi strong { font-size: 32px; }
}
.blog-baslik { flex-wrap: wrap; }
.blog-filtre { display: flex; flex-wrap: wrap; gap: .4rem; }
.blog-filtre__dugme {
  display: inline-flex; align-items: center; gap: .35rem; min-height: 40px; padding: 0 .9rem; border-radius: .85rem;
  background: #fff; border: 1.5px solid var(--kenar-koyu); font-size: 13px; font-weight: 700; color: var(--metin);
}
.blog-filtre__dugme small { font-size: 11px; font-weight: 800; background: #f4f4f5; border-radius: 99px; padding: .05rem .4rem; }
.blog-filtre__dugme:hover { border-color: var(--ink); color: var(--ink); }
.blog-filtre__dugme.etkin { background: var(--ink); border-color: var(--ink); color: #fff; }
.blog-filtre__dugme.etkin small { background: var(--marka); color: var(--ink); }
@media (max-width: 639px) { .blog-filtre { width: 100%; } }

/* Blog yazısı */
.yazi-baslik { display: grid; gap: 1.1rem; }
.yazi-baslik h1 { font-size: 30px; margin-top: .8rem; }
.yazi-baslik__ozet { margin-top: .8rem; font-size: 16.5px; color: var(--metin); line-height: 1.65; }
.yazi-baslik__gorsel { margin: 0; border-radius: 1.35rem; overflow: hidden; aspect-ratio: 16 / 10; background: #e4e4e7; box-shadow: var(--golge-banner); }
.yazi-baslik__gorsel img { width: 100%; height: 100%; object-fit: cover; }
@media (min-width: 640px) { .yazi-baslik h1 { font-size: 40px; } }
@media (min-width: 1024px) { .yazi-baslik { grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); gap: 3rem; align-items: center; } .yazi-baslik h1 { font-size: 46px; } }

.yazi-duzen { display: grid; gap: 1.25rem; margin-top: 1.5rem; }
@media (min-width: 1024px) { .yazi-duzen { grid-template-columns: minmax(0, 8fr) minmax(0, 4fr); gap: 1.5rem; align-items: start; margin-top: 2.5rem; } .yazi-yan { position: sticky; top: 184px; } }
.yazi-govde { padding: 1.25rem; }
@media (min-width: 640px) { .yazi-govde { padding: 2.25rem 2.5rem; } }
.yazi-govde .icerik-metni { font-size: 16.5px; line-height: 1.8; color: var(--metin); }
.icerik-metni > * + * { margin-top: 1.1rem; }
.icerik-metni h2 { font-size: 24px; font-weight: 800; letter-spacing: -.02em; color: var(--ink); margin-top: 2rem; line-height: 1.25; }
.icerik-metni h3 { font-size: 19px; font-weight: 800; color: var(--ink); margin-top: 1.75rem; }
.icerik-metni strong { color: var(--ink); }
.icerik-metni ul { list-style: disc; padding-left: 1.25rem; }
.icerik-metni ol { list-style: decimal; padding-left: 1.25rem; }
.icerik-metni li { margin-top: .45rem; }
.icerik-metni li::marker { color: var(--marka-metin); }
.icerik-metni a { color: var(--marka-metin); text-decoration: underline; text-decoration-color: var(--marka); text-decoration-thickness: 2px; text-underline-offset: 3px; }
.icerik-metni img { border-radius: 1rem; height: auto; }
.icerik-metni blockquote { border-left: 4px solid var(--marka); background: var(--marka-50); padding: .9rem 1.1rem; border-radius: 0 .9rem .9rem 0; color: var(--ink); }
.icerik-metni table { width: 100%; border-collapse: collapse; font-size: 14px; display: block; overflow-x: auto; }
.icerik-metni th, .icerik-metni td { border: 1px solid var(--kenar); padding: .55rem .75rem; text-align: left; }
.icerik-metni th { background: #fafafa; color: var(--ink); }
.yazi-paylas { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .75rem; margin-top: 2rem; padding-top: 1.25rem; border-top: 1px solid var(--kenar); }
.yazi-paylas strong { font-size: 15px; }
.yazi-paylas__dugmeler { display: flex; flex-wrap: wrap; gap: .45rem; }
.yazi-paylas .sosyal-ikon { width: 16px; height: 16px; }
.yazi-yan .sss-yardim { position: relative; }

@media (max-width: 1023px) {
  .yazi-baslik__gorsel { order: -1; }
  .yazi-baslik__ozet { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
}
@media (max-width: 639px) { .yazi-baslik h1 { font-size: 26px; } .yazi-govde .icerik-metni { font-size: 16px; } }

/* Blog listesi mobilde kompakt satır kartı */
@media (max-width: 639px) {
  #blogIzgara { gap: .6rem; }
  #blogIzgara .blog-kart { display: grid; grid-template-columns: 112px minmax(0, 1fr); }
  #blogIzgara .blog-kart__gorsel { aspect-ratio: auto; height: 100%; min-height: 112px; }
  #blogIzgara .blog-kart__govde { padding: .75rem .85rem; gap: .35rem; }
  #blogIzgara .blog-kart strong { font-size: 14.5px; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
  #blogIzgara .blog-kart__ozet, #blogIzgara .metin-link { display: none; }
  #blogIzgara .blog-kart__meta .rozet { display: none; }
  .blog-filtre { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
  .blog-filtre__dugme { flex-shrink: 0; }
}

/* =====================================================================
   Fiyat akisi — acik geri donus ve secili liste baglami
   ===================================================================== */
.fiyat-yol { display: flex; align-items: center; justify-content: space-between; gap: .75rem; margin-bottom: .8rem; }
.fiyat-geri {
  display: inline-flex; align-items: center; gap: .45rem; min-height: 48px; padding: .55rem .85rem;
  border: 1.5px solid var(--kenar-koyu); border-radius: .9rem; background: #fff;
  font-size: 14px; font-weight: 800; line-height: 1.2;
}
.fiyat-geri:hover, .fiyat-geri:focus-visible { border-color: var(--ink); outline: none; }
.fiyat-geri .material-symbols-outlined { font-size: 20px; color: var(--marka-metin); }
.fiyat-yol__konum { min-width: 0; text-align: right; line-height: 1.2; }
.fiyat-yol__konum small { display: block; color: var(--soluk); font-size: 11px; font-weight: 700; }
.fiyat-yol__konum strong { display: block; margin-top: .15rem; font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.liste-baslik__secili { margin-top: .8rem; color: #d4d4d8; font-size: 15px; line-height: 1.45; }
.liste-baslik__secili strong { color: #fff; }

.fiyat-sayfa .liste-secenek { min-height: 58px; }
.fiyat-sayfa .liste-secenek__yazi strong { font-size: 14.5px; }
.fiyat-sayfa .liste-secenek__yazi small { font-size: 12.5px; }
.fiyat-sayfa .liste-arac__secili { display: block; visibility: visible; }
.fiyat-sayfa .liste-arac__secili strong { font-size: 14px; }
.fiyat-sayfa .liste-arac__degistir { display: inline-flex; visibility: visible; min-height: 48px; }

.fiyat-sayfa .urunler-baslik { display: grid; grid-template-columns: minmax(0, 1fr); align-items: stretch; gap: .7rem; }
.urunler-baslik__yazi { min-width: 0; }
.fiyat-sayfa .urunler-baslik__liste {
  display: inline-flex; max-width: 100%; padding: .38rem .7rem; background: var(--ink); color: #fff;
  font-size: 12.5px; line-height: 1.25; white-space: normal;
}
.fiyat-sayfa .urunler-baslik h2 { margin-top: .55rem; font-size: 22px; }
.fiyat-sayfa .urunler-baslik h2 small {
  display: inline-flex; margin-left: .2rem; padding: .2rem .5rem; border-radius: 99px;
  background: var(--marka-50); color: var(--ink); font-size: 12px; font-weight: 800; white-space: nowrap;
}
.urunler-baslik__degistir { min-height: 50px; }
#productModal .detay-dugmeler__geri { grid-column: 1 / -1; background: #fff; }

@media (max-width: 1023px) {
  .fiyat-sayfa .liste-arac.yapisik .liste-arac__degistir { width: auto; min-width: 0; padding-inline: .75rem; }
  .fiyat-sayfa .liste-arac.yapisik .liste-arac__degistir span:not(.material-symbols-outlined) { display: inline; }
}
@media (max-width: 479px) {
  .fiyat-yol__konum { display: none; }
  .fiyat-geri { width: 100%; justify-content: flex-start; font-size: 15px; }
  .fiyat-sayfa .liste-arac__ic { grid-template-columns: minmax(0, 1fr) auto; }
  .fiyat-sayfa .liste-arac__degistir { font-size: 13px; padding-inline: .65rem; }
}
@media (min-width: 640px) {
  .fiyat-sayfa .urunler-baslik { grid-template-columns: minmax(0, 1fr) auto; align-items: end; }
  .urunler-baslik__degistir { align-self: end; }
}
.fiyat-sayfa .urunler-baslik { scroll-margin-top: 215px; }
@media (min-width: 1024px) { .fiyat-sayfa .urunler-baslik { scroll-margin-top: 250px; } }