/*
  BD Estilo — mağaza
  Dünya: logonun kendisi. Krem zemin (#faf8f1), zeytin yeşili mürekkep (#545d29),
  koyu zeytin alanlar. Süs yok; ürün fotoğrafı önde. Etiketler dikişli dokuma etiket gibi.
  Yazı: Apple tarzı — SF Pro (Apple aygıtlar), Inter (diğerleri). Başlıklar yarı kalın, sıkı aralık.
*/


/* Apple aygıtlarda sistemin SF Pro yazısı kullanılır; Inter yalnız SF olmayan aygıtlarda iner. */
@font-face { font-family: 'Inter Variable'; font-style: normal; font-display: swap; font-weight: 100 900; src: url(../fonts/inter/inter-latin-ext-wght-normal.woff2) format('woff2-variations'); unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: 'Inter Variable'; font-style: normal; font-display: swap; font-weight: 100 900; src: url(../fonts/inter/inter-latin-wght-normal.woff2) format('woff2-variations'); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }

:root {
  --zemin: #faf8f1;
  --yuzey: #ffffff;
  --krem: #f1ede0;
  --krem-koyu: #e6e0cd;
  --zeytin: #545d29;
  --zeytin-koyu: #383f1c;
  --zeytin-acik: #e7e8d4;
  --krem-yazi: #f6f1e1;
  --krem-soluk: #d9d6bf;
  --murekkep: #1c1e15;
  --gri: #5a5d4e;
  --cizgi: #e0dbca;
  --cizgi-koyu: #c9c3ad;
  --hata: #9e3519;
  --hata-zemin: #f8e9e2;
  --ok-zemin: #ecefdc;
  --font: -apple-system, BlinkMacSystemFont, 'SF Pro Text', 'Inter Variable', 'Segoe UI', system-ui, sans-serif;
  --serif: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter Variable', 'Segoe UI', system-ui, sans-serif;
  --kenar: clamp(16px, 4vw, 48px);
  --en: 1440px;
  --kose: 3px;
  --hiz: 220ms;
  --egri: cubic-bezier(.22, 1, .36, 1);
  --golge: 0 18px 40px -18px rgb(28 30 21 / .28), 0 2px 6px rgb(28 30 21 / .06);
  color-scheme: light;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; scroll-padding-top: 140px; }
body {
  margin: 0; background: var(--zemin); color: var(--murekkep);
  font: 400 1rem/1.6 var(--font); font-feature-settings: 'ss01';
  -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;
}
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration-thickness: 1px; text-underline-offset: .22em; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
h1, h2, h3 { margin: 0; text-wrap: balance; }
p { margin: 0; }
ul, ol { margin: 0; padding: 0; }
s { color: var(--gri); text-decoration-thickness: 1px; }
::selection { background: var(--zeytin); color: var(--krem-yazi); }
:focus-visible { outline: 2px solid var(--zeytin); outline-offset: 3px; border-radius: 2px; }
/* Zeytin zeminde zeytin çerçeve görünmez: krem çerçeve */
.kapak :focus-visible, .kombin-bandi :focus-visible, .alt :focus-visible, .duyuru :focus-visible { outline-color: var(--krem-yazi); }
.gizli { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
.atla { position: absolute; left: 12px; top: -60px; z-index: 100; background: var(--zeytin); color: var(--krem-yazi); padding: 10px 16px; border-radius: var(--kose); }
.atla:focus { top: 12px; }
.ikon { width: 20px; height: 20px; flex: none; }
[hidden] { display: none !important; }
html { scrollbar-color: var(--cizgi-koyu) transparent; }

@view-transition { navigation: auto; }
::view-transition-old(root), ::view-transition-new(root) { animation-duration: 180ms; }
@media (prefers-reduced-motion: reduce) {
  @view-transition { navigation: none; }
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}

/* ---------- Düğmeler ---------- */

.dugme {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  min-height: 50px; padding: 0 26px; border: 1px solid var(--zeytin); border-radius: var(--kose);
  background: var(--zeytin); color: var(--krem-yazi); font-weight: 650; font-size: .95rem; letter-spacing: .01em;
  text-decoration: none; white-space: nowrap;
  transition: background var(--hiz) var(--egri), color var(--hiz) var(--egri), border-color var(--hiz) var(--egri), transform 120ms;
}
.dugme:hover { background: var(--zeytin-koyu); border-color: var(--zeytin-koyu); }
.dugme:active { transform: translateY(1px); }
.dugme:disabled { opacity: .45; cursor: not-allowed; }
.dugme .ikon { width: 18px; height: 18px; }
.dugme--cizgi { background: transparent; color: var(--zeytin-koyu); border-color: var(--cizgi-koyu); }
.dugme--cizgi:hover { background: var(--krem); color: var(--zeytin-koyu); border-color: var(--zeytin); }
.dugme--krem { background: var(--krem-yazi); color: var(--zeytin-koyu); border-color: var(--krem-yazi); }
.dugme--krem:hover { background: #fff; border-color: #fff; color: var(--zeytin-koyu); }
.dugme--cizgi-krem { background: transparent; color: var(--krem-yazi); border-color: rgb(246 241 225 / .5); }
.dugme--cizgi-krem:hover { background: rgb(246 241 225 / .1); border-color: var(--krem-yazi); }
.dugme--genis { width: 100%; }
.dugme--kucuk { min-height: 40px; padding: 0 16px; }
.dugme[data-yukleniyor] { pointer-events: none; opacity: .7; }

.bag { background: none; border: 0; padding: 0; color: var(--zeytin-koyu); text-decoration: underline; text-underline-offset: .25em; font-weight: 600; font-size: .9rem; display: inline-flex; align-items: center; gap: 6px; }
.bag .ikon { width: 16px; height: 16px; }
.bag--sil { color: var(--gri); font-weight: 500; font-size: .85rem; }
.bag-ok { display: inline-flex; align-items: center; gap: 8px; color: var(--zeytin-koyu); font-weight: 650; font-size: .92rem; text-decoration: none; }
.bag-ok .ikon { width: 17px; height: 17px; transition: transform var(--hiz) var(--egri); }
.bag-ok:hover { text-decoration: underline; }
.bag-ok:hover .ikon { transform: translateX(3px); }

.ikon-dugme {
  position: relative; display: inline-grid; place-items: center; width: 44px; height: 44px;
  border: 0; border-radius: 50%; background: transparent; color: var(--murekkep); text-decoration: none;
  transition: background var(--hiz);
}
.ikon-dugme:hover { background: var(--krem); }
.ikon-dugme .ikon { width: 22px; height: 22px; }
.rozet {
  position: absolute; top: 4px; right: 2px; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px;
  background: var(--zeytin); color: var(--krem-yazi); font-size: .68rem; font-weight: 750; line-height: 18px; text-align: center;
  font-variant-numeric: tabular-nums;
}
.rozet.tik { animation: tik 420ms var(--egri); }
@keyframes tik { 40% { transform: scale(1.35); } }

/* Dokuma etiket: dikiş izi içte */
.etiket {
  position: absolute; left: 10px; top: 10px; z-index: 1;
  padding: 4px 9px; background: var(--krem-yazi); color: var(--zeytin-koyu);
  font-size: .7rem; font-weight: 750; letter-spacing: .04em; line-height: 1.3;
  border-radius: 2px; outline: 1px dashed rgb(84 93 41 / .55); outline-offset: -3px;
}
.etiket--koyu { background: var(--zeytin); color: var(--krem-yazi); outline-color: rgb(246 241 225 / .5); }
.fiyat--buyuk .etiket { position: static; display: inline-block; vertical-align: middle; }

/* ---------- Üst ---------- */

.duyuru { background: var(--zeytin-koyu); color: var(--krem-yazi); text-align: center; font-size: .8rem; font-weight: 600; letter-spacing: .03em; padding: 8px var(--kenar); }
.ust { position: sticky; top: 0; z-index: 40; background: rgb(250 248 241 / .96); backdrop-filter: saturate(1.4) blur(10px); -webkit-backdrop-filter: saturate(1.4) blur(10px); border-bottom: 1px solid var(--cizgi); }
.ust__ic { max-width: var(--en); margin: 0 auto; padding: 10px var(--kenar); display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 16px; }
.ust__sol { display: flex; align-items: center; gap: 8px; }
.ust__sag { display: flex; justify-content: flex-end; align-items: center; gap: 2px; }
.ust__menu, .ust__ara { display: none; }
.logo { display: flex; align-items: center; gap: 10px; text-decoration: none; }
.logo__m { width: auto; height: 40px; }
.logo__y { width: auto; height: 21px; margin-top: 4px; }
.arama { position: relative; width: min(300px, 100%); }
.arama input {
  width: 100%; height: 42px; padding: 0 44px 0 16px; border: 1px solid var(--cizgi); border-radius: 21px;
  background: var(--yuzey); font-size: .9rem; transition: border-color var(--hiz);
}
.arama input:focus { outline: none; border-color: var(--zeytin); }
.arama input::placeholder { color: var(--gri); }
.arama input::-webkit-search-cancel-button, .arama-panel input::-webkit-search-cancel-button { appearance: none; }
.arama button { position: absolute; right: 4px; top: 4px; width: 34px; height: 34px; border: 0; border-radius: 50%; background: transparent; display: grid; place-items: center; color: var(--zeytin-koyu); }
.arama button .ikon { width: 18px; height: 18px; }

.menu { border-top: 1px solid var(--cizgi); }
.menu__liste { list-style: none; max-width: var(--en); margin: 0 auto; padding: 0 var(--kenar); display: flex; justify-content: center; flex-wrap: wrap; gap: 0 4px; }
.menu__liste > li > a { display: block; padding: 13px 14px; font-size: .88rem; font-weight: 600; letter-spacing: .02em; text-decoration: none; position: relative; }
.menu__liste > li > a::after { content: ''; position: absolute; left: 14px; right: 14px; bottom: 8px; height: 1px; background: var(--zeytin); transform: scaleX(0); transform-origin: left; transition: transform var(--hiz) var(--egri); }
.menu__liste > li > a:hover::after, .menu__liste > li > a[aria-current]::after, .menu__oge:focus-within > a::after { transform: scaleX(1); }
.menu__liste > li > a[aria-current] { color: var(--zeytin); }
.menu__oge { position: relative; }
.menu__panel {
  position: absolute; left: 50%; top: 100%; min-width: 220px; translate: -50% 0;
  background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: var(--kose); box-shadow: var(--golge);
  padding: 10px; opacity: 0; visibility: hidden; transform: translateY(-4px);
  transition: opacity var(--hiz) var(--egri), transform var(--hiz) var(--egri), visibility 0s linear var(--hiz);
}
.menu__oge:hover .menu__panel, .menu__oge:focus-within .menu__panel { opacity: 1; visibility: visible; transform: none; transition-delay: 0s; }
.menu__panel ul { list-style: none; }
.menu__panel a { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 9px 12px; border-radius: 2px; font-size: .9rem; text-decoration: none; }
.menu__panel a:hover { background: var(--krem); }
.menu__tumu { margin-top: 4px; border-top: 1px solid var(--cizgi); color: var(--zeytin-koyu); font-weight: 650; }
.menu__tumu .ikon { width: 16px; height: 16px; }
.arama-panel { padding: 0 var(--kenar) 12px; }
.arama-panel form { display: flex; gap: 8px; position: relative; }

/* Arama önerileri: yazarken açılır, ilk harften itibaren */
.oneri {
  position: absolute; z-index: 45; top: calc(100% + 6px); left: 0; width: max(100%, 440px); max-height: min(70vh, 560px); overflow-y: auto;
  background: #fff; border: 1px solid var(--cizgi); border-radius: 14px; box-shadow: 0 18px 50px rgb(40 44 20 / .16); padding: 8px; text-align: left;
}
.oneri[hidden] { display: none; }
.arama-panel .oneri { width: 100%; }
.oneri__baslik { font-size: .7rem; font-weight: 700; letter-spacing: .04em; color: var(--gri); padding: 8px 10px 6px; }
.oneri__ciplar { display: flex; flex-wrap: wrap; gap: 6px; padding: 0 8px 8px; }
.oneri__cip { display: inline-flex; align-items: center; gap: 6px; min-height: 34px; padding: 0 12px; border-radius: 99px; background: var(--krem); color: var(--zeytin-koyu); font-size: .86rem; font-weight: 600; text-decoration: none; }
.oneri__cip small { color: var(--gri); font-weight: 500; }
.oneri__urun { display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 8px 10px; border-radius: 10px; text-decoration: none; color: var(--murekkep); }
.oneri__urun img { width: 44px; aspect-ratio: 4 / 5; object-fit: cover; border-radius: 4px; background: var(--krem); }
.oneri__ad { font-weight: 600; font-size: .92rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.oneri__ad small { display: block; color: var(--gri); font-weight: 500; font-size: .8rem; }
.oneri__fiyat { font-weight: 700; font-size: .88rem; font-variant-numeric: tabular-nums; }
.oneri mark { background: none; color: var(--zeytin); font-weight: 750; }
.oneri__urun:hover, .oneri__urun.secili, .oneri__cip:hover, .oneri__cip.secili, .oneri__tumu:hover, .oneri__tumu.secili { background: var(--krem); }
.oneri__cip.secili { outline: 2px solid var(--zeytin); }
.oneri__tumu { display: flex; justify-content: space-between; align-items: center; margin-top: 4px; padding: 12px 10px; border-top: 1px solid var(--cizgi); border-radius: 0 0 10px 10px; font-size: .88rem; font-weight: 700; color: var(--zeytin-koyu); text-decoration: none; }
.oneri__tumu .ikon { width: 16px; height: 16px; }
.oneri__bos { padding: 14px 10px; color: var(--gri); font-size: .9rem; }
.alan__kutu { position: relative; }
.oneri--adres { width: 100%; max-height: 280px; top: calc(100% + 4px); padding: 6px; border-radius: 10px; }
.oneri__satir { display: block; width: 100%; padding: 10px 12px; border: 0; border-radius: 8px; background: none; text-align: left; font: inherit; font-size: .95rem; color: var(--murekkep); cursor: pointer; }
.oneri__satir:hover, .oneri__satir.secili { background: var(--krem); }
.alan__ipucu { font-size: .8rem; color: var(--gri); }
@media (max-width: 560px) { .oneri__urun { grid-template-columns: 40px minmax(0, 1fr) auto; } }
.arama-panel input { flex: 1; height: 44px; padding: 0 14px; border: 1px solid var(--cizgi-koyu); border-radius: var(--kose); background: var(--yuzey); font-size: 1rem; }

/* ---------- Çekmeceler ---------- */

.cekmece {
  position: fixed; inset: 0 auto 0 auto; margin: 0; width: min(420px, 100vw); max-width: 100vw; height: 100dvh; max-height: 100dvh;
  padding: 0; border: 0; background: var(--zemin); color: var(--murekkep); display: flex; flex-direction: column;
  transition: transform 340ms var(--egri), overlay 340ms allow-discrete, display 340ms allow-discrete;
}
.cekmece:not([open]) { display: none; }
.cekmece--sag { right: 0; left: auto; transform: translateX(100%); }
.cekmece--sol { left: 0; transform: translateX(-100%); }
.cekmece[open] { transform: none; }
@starting-style { .cekmece--sag[open] { transform: translateX(100%); } .cekmece--sol[open] { transform: translateX(-100%); } }
.cekmece::backdrop { background: rgb(28 30 21 / 0); transition: background 340ms, overlay 340ms allow-discrete, display 340ms allow-discrete; }
.cekmece[open]::backdrop { background: rgb(28 30 21 / .42); }
@starting-style { .cekmece[open]::backdrop { background: rgb(28 30 21 / 0); } }
.cekmece__bas { display: flex; align-items: center; justify-content: space-between; padding: 12px 12px 12px 20px; border-bottom: 1px solid var(--cizgi); }
.cekmece__baslik { font-family: var(--serif); font-weight: 650; font-size: 1.3rem; line-height: 1.1; letter-spacing: -.02em; }
.cekmece__logo { height: 20px; width: auto; }
.cekmece__govde { flex: 1; overflow-y: auto; overscroll-behavior: contain; display: flex; flex-direction: column; }
.cekmece__alt { margin-top: auto; padding: 18px 20px 22px; border-top: 1px solid var(--cizgi); display: grid; gap: 10px; background: var(--yuzey); }
.cekmece .sepet-liste { padding: 0 20px; }
.cekmece-yukleniyor { padding: 40px 20px; color: var(--gri); }

.mobil-menu { padding: 8px 0 24px; }
.mobil-menu > a, .mobil-menu summary { display: flex; align-items: center; justify-content: space-between; padding: 15px 20px; font-size: 1.02rem; font-weight: 600; text-decoration: none; border-bottom: 1px solid var(--cizgi); cursor: pointer; list-style: none; }
.mobil-menu summary::-webkit-details-marker { display: none; }
.mobil-menu summary .ikon { width: 18px; height: 18px; transition: transform var(--hiz); }
.mobil-menu details[open] summary .ikon { transform: rotate(180deg); }
.mobil-menu details div { display: grid; padding: 4px 0 10px; background: var(--krem); border-bottom: 1px solid var(--cizgi); }
.mobil-menu details div a { padding: 10px 32px; text-decoration: none; }
.mobil-menu__alt { display: grid; gap: 2px; margin-top: 18px; padding: 0 8px; }
.mobil-menu__alt a { display: flex; align-items: center; gap: 12px; padding: 11px 12px; text-decoration: none; color: var(--zeytin-koyu); font-weight: 600; }

/* ---------- Kapak ---------- */

.kapak { display: grid; grid-template-columns: minmax(0, 45fr) minmax(0, 55fr); background: var(--zeytin); color: var(--krem-yazi); min-height: min(78vh, 760px); }
.kapak__metin { display: flex; flex-direction: column; justify-content: flex-end; gap: 22px; padding: clamp(32px, 6vw, 88px) var(--kenar); padding-left: max(var(--kenar), calc((100vw - var(--en)) / 2 + var(--kenar))); }
.kapak h1 { font-family: var(--serif); font-weight: 700; font-size: clamp(2.5rem, 5.2vw, 4.75rem); line-height: 1.04; letter-spacing: -.028em; }
.kapak p { max-width: 38ch; font-size: 1.05rem; color: var(--krem-soluk); }
.kapak__dugmeler { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 6px; }
.kapak__gorsel { position: relative; overflow: hidden; }
.kapak__gorsel img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 30%; }

/* ---------- Bölümler ---------- */

.bolum { max-width: var(--en); margin: 0 auto; padding: clamp(48px, 7vw, 96px) var(--kenar) 0; }
.bolum__bas { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; margin-bottom: 24px; }
.bolum__bas h2, .sayfa-bas h1 { font-family: var(--serif); font-weight: 680; font-size: clamp(1.65rem, 2.8vw, 2.4rem); line-height: 1.08; letter-spacing: -.028em; }

.karolar { list-style: none; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; }
.karo { display: block; position: relative; text-decoration: none; border-radius: var(--kose); overflow: hidden; background: var(--krem); }
.karo__img, .karo .gorsel-yok { aspect-ratio: 3 / 4; width: 100%; object-fit: cover; transition: transform 700ms var(--egri); }
.karo::after { content: ''; position: absolute; inset: 45% 0 0; background: linear-gradient(transparent, rgb(28 30 21 / .62)); pointer-events: none; }
.karo__ad { position: absolute; left: 14px; right: 14px; bottom: 12px; z-index: 1; color: #fff; font-weight: 700; font-size: 1rem; }
.karo:hover .karo__img { transform: scale(1.04); }

/* ---------- Ürün kartı ---------- */

.izgara { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 36px 20px; }
.izgara--liste { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.izgara--tam { max-width: var(--en); margin: 0 auto; padding: 0 var(--kenar); }
.kart { position: relative; display: flex; flex-direction: column; gap: 12px; }
.kart__gorsel { position: relative; display: block; aspect-ratio: 4 / 5; overflow: hidden; border-radius: var(--kose); background: var(--krem); }
.kart__img, .kart__img2, .kart__gorsel .gorsel-yok { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: opacity 400ms var(--egri), transform 900ms var(--egri); }
.kart__img2 { opacity: 0; }
.kart:hover .kart__img2 { opacity: 1; }
.kart:hover .kart__img { transform: scale(1.03); }
.kart--tukendi .kart__img { filter: grayscale(.5); opacity: .7; }
.kart__fav {
  position: absolute; top: 8px; right: 8px; z-index: 2; width: 38px; height: 38px; border-radius: 50%; border: 0;
  display: grid; place-items: center; background: rgb(250 248 241 / .92); color: var(--murekkep); transition: transform 160ms, color var(--hiz);
}
.kart__fav .ikon { width: 18px; height: 18px; }
.kart__fav:hover { transform: scale(1.08); }
[data-fav][aria-pressed="true"] { color: var(--zeytin); }
[data-fav][aria-pressed="true"] .ikon { fill: currentColor; }
[data-fav].atti .ikon { animation: kalp 480ms var(--egri); }
@keyframes kalp { 35% { transform: scale(1.3); } 70% { transform: scale(.92); } }
.kart__bilgi { display: grid; gap: 2px; }
.kart__ad { font-size: .95rem; font-weight: 600; line-height: 1.35; }
.kart__ad a { text-decoration: none; }
.kart__ad a::after { content: ''; position: absolute; inset: 0; z-index: 1; }
.kart__ad a:hover { text-decoration: underline; }
.kart__alt { font-size: .82rem; color: var(--gri); }
.fiyat { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; font-variant-numeric: tabular-nums; font-weight: 700; }
.fiyat s { font-weight: 500; font-size: .88em; }
.kart .fiyat { margin-top: 4px; font-size: .95rem; }

.gorsel-yok { display: grid; place-items: center; background: var(--krem); }
.gorsel-yok img { width: 34%; opacity: .35; }

/* ---------- Kombin bandı ---------- */

.kombin-bandi { margin-top: clamp(56px, 8vw, 110px); background: var(--zeytin); color: var(--krem-yazi); }
.kombin-bandi__ic { max-width: var(--en); margin: 0 auto; padding: clamp(44px, 6vw, 80px) var(--kenar); }
.kombin-bandi .bolum__bas { margin-bottom: 10px; }
.kombin-bandi .bag-ok { color: var(--krem-yazi); }
.kombin-bandi__giris { max-width: 52ch; color: var(--krem-soluk); margin-bottom: 30px; }
.kombin-satir { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; }
.kombin-kart { display: grid; gap: 4px; text-decoration: none; }
.kombin-kart__img, .kombin-kart .gorsel-yok { aspect-ratio: 4 / 5; width: 100%; object-fit: cover; border-radius: var(--kose); margin-bottom: 10px; transition: filter 400ms; }
.kombin-kart:hover .kombin-kart__img { filter: brightness(1.06); }
.kombin-kart__ad { font-family: var(--serif); font-weight: 650; font-size: 1.22rem; line-height: 1.15; letter-spacing: -.02em; }
.kombin-kart__alt { font-size: .85rem; color: var(--krem-soluk); font-variant-numeric: tabular-nums; }
.kombin-satir--acik .kombin-kart__alt { color: var(--gri); }
.kombin-satir--acik { grid-template-columns: repeat(3, minmax(0, 1fr)); }

.hakkinda-serit { max-width: 980px; margin: clamp(64px, 9vw, 120px) auto 0; padding: 0 var(--kenar); display: grid; grid-template-columns: 120px 1fr; gap: clamp(24px, 4vw, 56px); align-items: start; }
.hakkinda-serit img { width: 120px; }
.hakkinda-serit h2 { font-family: var(--serif); font-weight: 680; font-size: clamp(1.6rem, 2.7vw, 2.25rem); line-height: 1.1; letter-spacing: -.028em; margin-bottom: 14px; }
.hakkinda-serit p { color: var(--gri); max-width: 60ch; }
.hakkinda-serit__baglar { display: flex; flex-wrap: wrap; gap: 8px 28px; margin-top: 18px !important; }

/* ---------- Hizmet satırı + alt ---------- */

.hizmet { margin-top: clamp(64px, 9vw, 120px); border-top: 1px solid var(--cizgi); }
.hizmet ul { list-style: none; max-width: var(--en); margin: 0 auto; padding: 22px var(--kenar); display: flex; flex-wrap: wrap; justify-content: space-between; gap: 14px 28px; }
.hizmet li { display: flex; align-items: center; gap: 10px; font-size: .88rem; font-weight: 600; color: var(--zeytin-koyu); }
.hizmet .ikon { width: 20px; height: 20px; color: var(--zeytin); }

.alt { background: var(--zeytin-koyu); color: var(--krem-yazi); }
.alt__ic { max-width: var(--en); margin: 0 auto; padding: clamp(48px, 6vw, 80px) var(--kenar) 40px; display: grid; grid-template-columns: 1.3fr 1fr 1fr 1fr; gap: 40px; }
.alt__marka img { width: 120px; }
.alt__slogan { font-family: var(--serif); font-weight: 600; font-size: 1.1rem; letter-spacing: -.015em; margin-top: 14px; color: var(--krem-soluk); }
.alt__sosyal { display: flex; gap: 6px; margin-top: 16px; }
.alt__sosyal a { width: 42px; height: 42px; display: grid; place-items: center; border: 1px solid rgb(246 241 225 / .25); border-radius: 50%; transition: background var(--hiz), border-color var(--hiz); }
.alt__sosyal a:hover { background: rgb(246 241 225 / .1); border-color: var(--krem-yazi); }
.alt__sosyal .ikon { width: 18px; height: 18px; }
.alt__sutun { display: grid; align-content: start; gap: 8px; font-size: .92rem; }
.alt__sutun h2 { font-size: .78rem; letter-spacing: .04em; font-weight: 750; color: var(--krem-soluk); margin-bottom: 6px; }
.alt__sutun a { text-decoration: none; color: var(--krem-yazi); width: fit-content; }
.alt__sutun a:hover { text-decoration: underline; }
.alt__sutun p { color: var(--krem-soluk); }
.alt__en { max-width: var(--en); margin: 0 auto; padding: 18px var(--kenar) 26px; border-top: 1px solid rgb(246 241 225 / .16); display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px 20px; font-size: .8rem; color: var(--krem-soluk); }

/* ---------- Sayfa başı, kırıntı ---------- */

.sayfa-bas { max-width: var(--en); margin: 0 auto; padding: 28px var(--kenar) 24px; }
.sayfa-bas--ince { padding-bottom: 14px; }
.sayfa-bas h1 { margin-top: 10px; }
.sayfa-bas__giris { max-width: 62ch; margin-top: 12px; color: var(--gri); }
.sayac { font-family: var(--font); font-size: .4em; color: var(--gri); letter-spacing: 0; vertical-align: middle; }
.kirinti ol { list-style: none; display: flex; flex-wrap: wrap; gap: 4px; font-size: .8rem; color: var(--gri); }
.kirinti li + li::before { content: '/'; margin-right: 4px; color: var(--cizgi-koyu); }
.kirinti a { text-decoration: none; }
.kirinti a:hover { text-decoration: underline; color: var(--murekkep); }
.alt-kategoriler { list-style: none; display: flex; gap: 8px; margin-top: 20px; overflow-x: auto; scrollbar-width: none; padding-bottom: 2px; }
.alt-kategoriler a { display: block; padding: 8px 16px; border: 1px solid var(--cizgi-koyu); border-radius: 20px; font-size: .88rem; font-weight: 600; text-decoration: none; white-space: nowrap; transition: background var(--hiz), border-color var(--hiz); }
.alt-kategoriler a:hover { border-color: var(--zeytin); }
.alt-kategoriler a[aria-current] { background: var(--zeytin); border-color: var(--zeytin); color: var(--krem-yazi); }

/* ---------- Liste + süzgeç ---------- */

.liste { max-width: var(--en); margin: 0 auto; padding: 0 var(--kenar); display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: 40px; align-items: start; }
.suzgec { position: sticky; top: 140px; display: grid; gap: 22px; max-height: calc(100vh - 160px); overflow-y: auto; padding-right: 4px; scrollbar-width: thin; }
.suzgec__bas { display: none; }
.suzgec fieldset { border: 0; padding: 0 0 20px; margin: 0; border-bottom: 1px solid var(--cizgi); }
.suzgec legend { font-size: .78rem; font-weight: 750; letter-spacing: .04em; color: var(--gri); margin-bottom: 12px; padding: 0; }
.beden-kutulari { display: grid; grid-template-columns: repeat(auto-fill, minmax(50px, 1fr)); gap: 6px; }
.beden-kutu { position: relative; }
.beden-kutu input, .renk-kutu input, .beden input, .secenek input { position: absolute; opacity: 0; width: 100%; height: 100%; inset: 0; margin: 0; cursor: pointer; }
.beden-kutu span { display: grid; place-items: center; min-width: 0; height: 38px; padding: 0 10px; border: 1px solid var(--cizgi-koyu); border-radius: 2px; font-size: .85rem; font-weight: 600; transition: background var(--hiz), border-color var(--hiz); }
.beden-kutu input:checked + span { background: var(--zeytin); border-color: var(--zeytin); color: var(--krem-yazi); }
.beden-kutu input:focus-visible + span { outline: 2px solid var(--zeytin); outline-offset: 2px; }
.beden-kutu--yok span { color: var(--gri); text-decoration: line-through; }
.renk-secim { display: grid; gap: 4px; }
.renk-kutu { position: relative; display: flex; align-items: center; gap: 10px; padding: 5px 0; font-size: .9rem; cursor: pointer; }
.renk-kutu__nokta { width: 20px; height: 20px; border-radius: 50%; background: var(--renk); box-shadow: inset 0 0 0 1px rgb(28 30 21 / .15); flex: none; }
.renk-kutu input:checked ~ .renk-kutu__nokta { box-shadow: 0 0 0 2px var(--zemin), 0 0 0 3.5px var(--zeytin); }
.renk-kutu input:checked ~ span:last-child { font-weight: 700; }
.renk-kutu input:focus-visible ~ .renk-kutu__nokta { outline: 2px solid var(--zeytin); outline-offset: 4px; }
.fiyat-aralik { display: flex; align-items: center; gap: 8px; }
.fiyat-aralik input { width: 100%; height: 40px; padding: 0 10px; border: 1px solid var(--cizgi-koyu); border-radius: 2px; background: var(--yuzey); font-variant-numeric: tabular-nums; }
.anahtar { position: relative; display: flex; align-items: center; gap: 10px; font-size: .9rem; font-weight: 600; cursor: pointer; }
.anahtar input { appearance: none; width: 38px; height: 22px; border-radius: 11px; background: var(--cizgi-koyu); position: relative; margin: 0; cursor: pointer; transition: background var(--hiz); flex: none; }
.anahtar input::after { content: ''; position: absolute; top: 3px; left: 3px; width: 16px; height: 16px; border-radius: 50%; background: #fff; transition: transform var(--hiz) var(--egri); box-shadow: 0 1px 2px rgb(0 0 0 / .2); }
.anahtar input:checked { background: var(--zeytin); }
.anahtar input:checked::after { transform: translateX(16px); }
.suzgec__eylem { display: flex; align-items: center; gap: 16px; }
.js .suzgec__eylem .dugme { display: none; }
.arac-cubugu { display: flex; align-items: center; gap: 16px; padding-bottom: 16px; margin-bottom: 22px; border-bottom: 1px solid var(--cizgi); }
.arac-cubugu__sayi { font-size: .88rem; color: var(--gri); font-variant-numeric: tabular-nums; }
.suzgec-ac { display: none; }
.sirala { position: relative; margin-left: auto; }
.sirala select { appearance: none; height: 40px; padding: 0 38px 0 14px; border: 1px solid var(--cizgi-koyu); border-radius: 2px; background: var(--yuzey); font-size: .88rem; font-weight: 600; cursor: pointer; }
.sirala .ikon { position: absolute; right: 12px; top: 11px; width: 16px; height: 16px; pointer-events: none; }
.secili-suzgec { list-style: none; display: flex; flex-wrap: wrap; gap: 8px; margin: -8px 0 22px; }
.secili-suzgec a { display: inline-flex; align-items: center; gap: 6px; padding: 6px 10px 6px 12px; border-radius: 16px; background: var(--zeytin-acik); color: var(--zeytin-koyu); font-size: .82rem; font-weight: 650; text-decoration: none; }
.secili-suzgec .ikon { width: 14px; height: 14px; }
.sayfalama { display: flex; justify-content: center; gap: 6px; margin-top: 48px; }
.sayfalama a { min-width: 42px; height: 42px; display: grid; place-items: center; border: 1px solid var(--cizgi-koyu); border-radius: 2px; text-decoration: none; font-weight: 650; font-variant-numeric: tabular-nums; }
.sayfalama a[aria-current] { background: var(--zeytin); border-color: var(--zeytin); color: var(--krem-yazi); }

/* ---------- Boş durumlar, uyarılar ---------- */

.bos { max-width: 560px; margin: 0 auto; padding: 48px var(--kenar) 24px; text-align: center; display: grid; justify-items: center; gap: 12px; }
.bos > img { width: 72px; opacity: .55; margin-bottom: 8px; }
.bos h1, .bos h2 { font-family: var(--serif); font-weight: 680; font-size: clamp(1.45rem, 2.4vw, 1.9rem); line-height: 1.12; letter-spacing: -.025em; }
.bos p { color: var(--gri); }
.bos--kucuk { padding: 56px 24px; }
.bos--sayfa { padding-top: 72px; }
.bos__ara { display: flex; gap: 8px; width: 100%; margin-top: 8px; }
.bos__ara input { flex: 1; min-width: 0; height: 50px; padding: 0 14px; border: 1px solid var(--cizgi-koyu); border-radius: var(--kose); background: var(--yuzey); }
.bos__baglar { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 8px; }
.uyari { max-width: var(--en); margin: 0 auto 20px; padding: 14px 16px; border-radius: var(--kose); background: var(--ok-zemin); color: var(--zeytin-koyu); font-size: .92rem; font-weight: 600; }
.uyari--hata { background: var(--hata-zemin); color: var(--hata); }
.sayfa-bas + .uyari { margin: 0 var(--kenar) 20px; }
.kucuk-not { font-size: .82rem; color: var(--gri); }
.stok-notu { font-size: .85rem; font-weight: 650; color: var(--zeytin); margin-top: 10px; }
.hata-notu { font-size: .85rem; font-weight: 650; color: var(--hata); margin-top: 10px; }
.tukendi-notu { padding: 14px 16px; background: var(--krem); border-radius: var(--kose); font-size: .92rem; }

/* ---------- Ürün sayfası ---------- */

.urun { max-width: var(--en); margin: 0 auto; padding: 0 var(--kenar); display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: clamp(28px, 5vw, 72px); align-items: start; }
.galeri { display: grid; grid-template-columns: 76px minmax(0, 1fr); gap: 12px; position: sticky; top: 140px; }
.galeri:not(:has(.galeri__kucukler)) { grid-template-columns: 1fr; }
.galeri:not(:has(.galeri__kucukler)) .galeri__sahne { grid-column: 1; }
.galeri__sahne { grid-column: 2; grid-row: 1; display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; border-radius: var(--kose); background: var(--krem); aspect-ratio: 4 / 5; }
.galeri__sahne::-webkit-scrollbar { display: none; }
.galeri__kare { flex: 0 0 100%; margin: 0; scroll-snap-align: start; }
.galeri__kare img, .galeri__kare .gorsel-yok { width: 100%; height: 100%; object-fit: cover; }
.galeri__kucukler { grid-column: 1; grid-row: 1; display: grid; align-content: start; gap: 8px; }
.galeri__kucukler button { padding: 0; border: 1px solid transparent; border-radius: 2px; background: none; overflow: hidden; aspect-ratio: 4 / 5; opacity: .6; transition: opacity var(--hiz), border-color var(--hiz); }
.galeri__kucukler button[aria-current] { opacity: 1; border-color: var(--zeytin); }
.galeri__kucukler img { width: 100%; height: 100%; object-fit: cover; }
.urun__bilgi { display: grid; gap: 20px; padding-bottom: 24px; }
.urun__ad { font-family: var(--serif); font-weight: 680; font-size: clamp(1.6rem, 2.6vw, 2.25rem); line-height: 1.1; letter-spacing: -.028em; }
.urun__kod { font-size: .8rem; color: var(--gri); margin-top: -12px; letter-spacing: .03em; }
.fiyat--buyuk { font-size: 1.5rem; gap: 6px 12px; }
.sepet-form { display: grid; gap: 22px; }
.secim { border: 0; margin: 0; padding: 0; }
.secim__baslik { font-size: .88rem; font-weight: 600; margin-bottom: 10px; padding: 0; color: var(--gri); }
.secim__baslik strong { color: var(--murekkep); }
.renk-gorselleri { list-style: none; display: flex; flex-wrap: wrap; gap: 8px; }
.renk-gorselleri a { display: block; width: 64px; aspect-ratio: 4 / 5; border-radius: 2px; overflow: hidden; border: 1px solid var(--cizgi); background: var(--krem); }
.renk-gorselleri a[aria-current] { border-color: var(--zeytin); box-shadow: 0 0 0 1px var(--zeytin); }
.renk-gorselleri img, .renk-gorselleri .gorsel-yok { width: 100%; height: 100%; object-fit: cover; }
.bedenler { display: flex; flex-wrap: wrap; gap: 8px; }
.beden { position: relative; flex: 1 0 56px; max-width: 96px; }
.beden span:first-of-type { display: grid; place-items: center; min-width: 0; height: 48px; padding: 0 8px; white-space: nowrap; border: 1px solid var(--cizgi-koyu); border-radius: 2px; background: var(--yuzey); font-weight: 650; font-variant-numeric: tabular-nums; transition: background var(--hiz), border-color var(--hiz), color var(--hiz); }
.beden:hover span:first-of-type { border-color: var(--zeytin); }
.beden input:checked + span { background: var(--zeytin); border-color: var(--zeytin); color: var(--krem-yazi); }
.beden input:focus-visible + span { outline: 2px solid var(--zeytin); outline-offset: 2px; }
.beden--yok span:first-of-type { color: #6f7163; background: transparent; background-image: linear-gradient(to top right, transparent calc(50% - .5px), var(--cizgi-koyu) 50%, transparent calc(50% + .5px)); cursor: not-allowed; }
.beden--yok input { cursor: not-allowed; }
.secim--hata .bedenler { animation: salla 380ms; }
@keyframes salla { 25% { transform: translateX(-5px); } 75% { transform: translateX(5px); } }
.sepet-satir { display: flex; gap: 10px; }
.sepet-satir .dugme { flex: 1; min-height: 52px; }
.adet { display: inline-flex; align-items: center; border: 1px solid var(--cizgi-koyu); border-radius: var(--kose); background: var(--yuzey); }
.adet button { width: 42px; height: 50px; border: 0; background: none; display: grid; place-items: center; color: var(--murekkep); }
.adet button:disabled { opacity: .3; cursor: not-allowed; }
.adet .ikon { width: 16px; height: 16px; }
.adet input { width: 34px; height: 50px; border: 0; background: none; text-align: center; font-weight: 700; font-variant-numeric: tabular-nums; appearance: textfield; -moz-appearance: textfield; }
.adet input::-webkit-inner-spin-button { -webkit-appearance: none; }
.adet--kucuk button { width: 34px; height: 34px; }
.adet--kucuk span { min-width: 22px; text-align: center; font-weight: 700; font-size: .9rem; font-variant-numeric: tabular-nums; }
.urun__ikincil { display: flex; flex-wrap: wrap; gap: 10px; margin-top: -8px; }
.urun__ikincil .dugme { flex: 1; min-height: 46px; padding: 0 16px; }
.urun__guven { list-style: none; display: grid; gap: 10px; padding: 16px 0; border-top: 1px solid var(--cizgi); border-bottom: 1px solid var(--cizgi); font-size: .88rem; }
.urun__guven li { display: flex; align-items: center; gap: 10px; }
.urun__guven .ikon { color: var(--zeytin); width: 19px; height: 19px; }
.akordeon details { border-bottom: 1px solid var(--cizgi); }
.akordeon summary { display: flex; justify-content: space-between; align-items: center; padding: 16px 0; font-weight: 700; cursor: pointer; list-style: none; }
.akordeon summary::-webkit-details-marker { display: none; }
.akordeon summary .ikon { width: 18px; height: 18px; transition: transform var(--hiz); }
.akordeon details[open] summary .ikon { transform: rotate(180deg); }
.akordeon details > div { padding: 0 0 18px; display: grid; gap: 12px; color: var(--gri); font-size: .94rem; max-width: 62ch; }
.ozellikler { margin: 4px 0 0; display: grid; }
.ozellikler div { display: grid; grid-template-columns: 110px 1fr; gap: 12px; padding: 8px 0; border-top: 1px dashed var(--cizgi); }
.ozellikler dt { font-weight: 650; color: var(--murekkep); }
.ozellikler dd { margin: 0; }
.yapiskan-cubuk { position: fixed; left: 0; right: 0; bottom: 0; z-index: 30; display: none; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 16px calc(10px + env(safe-area-inset-bottom)); background: rgb(250 248 241 / .97); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); border-top: 1px solid var(--cizgi); box-shadow: 0 -8px 24px -12px rgb(28 30 21 / .2); }
.yapiskan-cubuk__ad { font-size: .82rem; color: var(--gri); max-width: 46vw; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* ---------- Kombin ---------- */

.kombin-izgara { max-width: var(--en); margin: 0 auto; padding: 0 var(--kenar); display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(28px, 4vw, 48px) 24px; }
.kombin-buyuk { display: grid; gap: 16px; text-decoration: none; }
.kombin-buyuk__gorsel { display: block; aspect-ratio: 4 / 5; overflow: hidden; border-radius: var(--kose); background: var(--krem); }
.kombin-buyuk__gorsel img { width: 100%; height: 100%; object-fit: cover; transition: transform 900ms var(--egri); }
.kombin-buyuk:hover .kombin-buyuk__gorsel img { transform: scale(1.025); }
.kombin-buyuk__bilgi { display: grid; gap: 8px; }
.kombin-buyuk__ad { font-family: var(--serif); font-weight: 680; font-size: clamp(1.45rem, 2.4vw, 1.95rem); line-height: 1.1; letter-spacing: -.025em; }
.kombin-buyuk__metin { color: var(--gri); max-width: 56ch; }
.kombin-buyuk__parcalar { display: flex; align-items: center; gap: 6px; margin-top: 4px; }
.kombin-buyuk__parca { width: 40px; aspect-ratio: 4 / 5; border-radius: 2px; overflow: hidden; background: var(--krem); }
.kombin-buyuk__parca img, .kombin-buyuk__parca .gorsel-yok { width: 100%; height: 100%; object-fit: cover; }
.kombin-buyuk__fiyat { margin-left: 8px; font-weight: 700; font-size: .9rem; font-variant-numeric: tabular-nums; }
.kombin-detay { max-width: var(--en); margin: 0 auto; padding: 0 var(--kenar); display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(28px, 5vw, 72px); align-items: start; }
.kombin-detay__gorsel { position: sticky; top: 140px; border-radius: var(--kose); overflow: hidden; background: var(--krem); aspect-ratio: 4 / 5; }
.kombin-detay__gorsel img { width: 100%; height: 100%; object-fit: cover; }
.kombin-detay h1 { font-family: var(--serif); font-weight: 700; font-size: clamp(1.9rem, 3.3vw, 2.8rem); line-height: 1.08; letter-spacing: -.026em; }
.kombin-detay__metin { color: var(--gri); margin-top: 12px; max-width: 52ch; }
.parca-liste { list-style: none; margin-top: 28px; border-top: 1px solid var(--cizgi); }
.parca { display: grid; grid-template-columns: 76px minmax(0, 1fr) auto; gap: 16px; align-items: center; padding: 14px 0; border-bottom: 1px solid var(--cizgi); }
.parca__gorsel { display: block; aspect-ratio: 4 / 5; border-radius: 2px; overflow: hidden; background: var(--krem); }
.parca__gorsel img, .parca__gorsel .gorsel-yok { width: 100%; height: 100%; object-fit: cover; }
.parca__bilgi { display: grid; gap: 2px; }
.parca__ad { font-weight: 650; text-decoration: none; }
.parca__ad:hover { text-decoration: underline; }
.parca__alt { font-size: .82rem; color: var(--gri); }
.parca select { appearance: none; height: 44px; width: 148px; padding: 0 36px 0 14px; border: 1px solid var(--cizgi-koyu); border-radius: 2px; font-weight: 600; font-size: .9rem; cursor: pointer;
  background: var(--yuzey) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='%23545d29' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m4 6 4 4 4-4'/%3E%3C/svg%3E") no-repeat right 12px center; }
.parca select:has(option:checked:not([value=""])) { border-color: var(--zeytin); box-shadow: 0 0 0 1px var(--zeytin); }
.parca__yok { font-size: .85rem; color: var(--gri); }
.anahtar--kucuk { font-size: .85rem; }
.kombin-detay__toplam { display: grid; gap: 12px; margin-top: 24px; }
.kombin-detay__toplam > p:first-child { font-size: 1.05rem; font-variant-numeric: tabular-nums; }

/* ---------- Sepet ---------- */

.sepet-liste { list-style: none; }
.sepet-oge { display: grid; grid-template-columns: 84px minmax(0, 1fr) auto; gap: 14px; padding: 18px 0; border-bottom: 1px solid var(--cizgi); }
.sepet-oge__gorsel { display: block; aspect-ratio: 4 / 5; border-radius: 2px; overflow: hidden; background: var(--krem); }
.sepet-oge__gorsel img, .sepet-oge__gorsel .gorsel-yok { width: 100%; height: 100%; object-fit: cover; }
.sepet-oge__bilgi { display: grid; align-content: start; gap: 2px; }
.sepet-oge__ad { font-weight: 650; line-height: 1.35; }
.sepet-oge__ad a { text-decoration: none; }
.sepet-oge__alt { font-size: .82rem; color: var(--gri); }
.sepet-oge__eylem { display: flex; align-items: center; gap: 14px; margin-top: 10px; }
.sepet-oge__tutar { font-weight: 700; font-variant-numeric: tabular-nums; }
.ozet { margin: 0; display: grid; gap: 8px; font-variant-numeric: tabular-nums; }
.ozet div { display: flex; justify-content: space-between; gap: 12px; font-size: .92rem; }
.ozet dt { color: var(--gri); }
.ozet dd { margin: 0; font-weight: 600; }
.ozet__toplam { padding-top: 10px; border-top: 1px solid var(--cizgi); font-size: 1.08rem !important; }
.ozet__toplam dt { color: var(--murekkep); font-weight: 700; }
.ozet__toplam dd { font-weight: 800; }
.ozet__indirim dt, .ozet__indirim dd { color: var(--zeytin) !important; font-weight: 700; }

/* Çark fırsatı: sepette geri sayım ve davet */
.firsat-serit, .firsat-davet {
  display: flex; align-items: center; gap: 10px; padding: 11px 14px; border-radius: 12px; font-size: .86rem; line-height: 1.35;
  background: var(--zeytin); color: var(--krem-yazi); margin-bottom: 12px;
}
.firsat-serit > .ikon, .firsat-davet > .ikon:first-child { width: 20px; height: 20px; flex: none; }
.firsat-serit > span:first-of-type { flex: 1; }
.firsat-serit__sayac { display: inline-flex; align-items: center; gap: 5px; padding: 4px 9px; border-radius: 99px; background: rgb(246 241 225 / .16); font-weight: 750; font-variant-numeric: tabular-nums; }
.firsat-serit__sayac .ikon { width: 15px; height: 15px; }
.firsat-serit--bitti { background: var(--krem); color: var(--gri); }
.firsat-davet { width: 100%; border: 0; text-align: left; cursor: pointer; font: inherit; font-size: .86rem; background: var(--krem); color: var(--zeytin-koyu); border: 1px dashed var(--zeytin); }
.firsat-davet b { display: block; font-size: .92rem; }
.firsat-davet span { flex: 1; }
.firsat-davet .ikon:last-child { width: 18px; height: 18px; }
.firsat-davet:hover { background: var(--zeytin-acik); }

/* İndirim kodu */
.firsat-serit small { display: block; font-size: .76rem; opacity: .8; letter-spacing: .03em; }
.firsat-uyari { display: flex; gap: 8px; align-items: flex-start; padding: 10px 12px; margin-bottom: 12px; border-radius: 12px; background: var(--krem); color: var(--zeytin-koyu); font-size: .84rem; line-height: 1.4; }
.firsat-uyari .ikon { width: 17px; height: 17px; flex: none; margin-top: 1px; }
.kupon-ac { font-size: .88rem; }
.kupon-ac summary { display: inline-flex; align-items: center; gap: 6px; cursor: pointer; font-weight: 650; color: var(--zeytin-koyu); list-style: none; padding: 4px 0; }
.kupon-ac summary::-webkit-details-marker { display: none; }
.kupon-ac summary .ikon { width: 16px; height: 16px; }
.kupon-kutu { display: flex; gap: 6px; margin-top: 8px; }
.kupon-kutu input { flex: 1; min-width: 0; height: 40px; padding: 0 12px; border: 1px solid var(--cizgi-koyu); border-radius: var(--kose); background: #fff; font: 650 .9rem/1 var(--font); letter-spacing: .05em; text-transform: uppercase; }
.kupon-kutu input::placeholder { text-transform: none; letter-spacing: 0; font-weight: 500; }
.kupon-kutu .dugme { min-height: 40px; }
.kupon-kutu--var { align-items: center; justify-content: space-between; flex-wrap: wrap; margin: 0; font-size: .84rem; color: var(--gri); }
.kupon-kutu--var span { display: inline-flex; align-items: center; gap: 7px; min-width: 0; }
.kupon-kutu--var .ikon { width: 16px; height: 16px; flex: none; }
.sepet-oge__tutar { display: grid; justify-items: end; align-content: start; gap: 1px; }
.sepet-oge__tutar s { font-size: .78rem; font-weight: 500; color: var(--gri); }
.sepet-oge__oneri { font-size: .7rem; font-weight: 750; color: var(--zeytin); white-space: nowrap; }
.mini-liste s { font-size: .78rem; color: var(--gri); font-weight: 500; }

/* Sepet önerileri */
.tamamla { margin: 6px 20px 18px; padding: 14px; border: 1px solid var(--cizgi); border-radius: 12px; background: #fff; }
.sepet-sayfa__liste .tamamla { margin: 22px 0 0; }
.tamamla__bas { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.tamamla__rozet { padding: 3px 9px; border-radius: 99px; background: var(--zeytin); color: var(--krem-yazi); font-size: .72rem; font-weight: 750; letter-spacing: .02em; }
.tamamla__neden { font-size: .72rem !important; font-weight: 700; color: var(--zeytin) !important; letter-spacing: .01em; }
.tamamla__fiyat s { font-weight: 500; margin-right: 2px; }
.tamamla__fiyat em .ikon { width: 13px; height: 13px; vertical-align: -2px; margin-right: 3px; }
.tamamla h2 { display: flex; align-items: center; gap: 8px; font-size: .95rem; font-weight: 700; letter-spacing: -.01em; }
.tamamla h2 .ikon { width: 18px; height: 18px; color: var(--zeytin); }
.tamamla > p { font-size: .84rem; color: var(--gri); margin: 4px 0 10px; }
.tamamla__liste { list-style: none; display: grid; gap: 0; }
.tamamla__oge { display: grid; grid-template-columns: 48px minmax(0, 1fr); gap: 4px 12px; align-items: center; padding: 10px 0; border-top: 1px solid var(--cizgi); }
.tamamla__gorsel { grid-row: span 2; }
.tamamla__gorsel img { width: 48px; aspect-ratio: 4 / 5; object-fit: cover; border-radius: 4px; background: var(--krem); }
.tamamla__bilgi { display: grid; min-width: 0; font-size: .86rem; }
.tamamla__bilgi a { font-weight: 650; text-decoration: none; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tamamla__bilgi span { color: var(--gri); font-size: .8rem; }
.tamamla__bilgi b { color: var(--murekkep); }
.tamamla__bilgi em { font-style: normal; font-weight: 700; color: var(--zeytin); }
.tamamla__form { display: flex; gap: 6px; }
.tamamla__form select { flex: 1; min-width: 0; height: 36px; padding: 0 10px; border: 1px solid var(--cizgi-koyu); border-radius: var(--kose); background: var(--yuzey); font-size: .84rem; font-weight: 600; }
.tamamla__form .dugme { min-height: 36px; padding: 0 12px; font-size: .82rem; gap: 4px; }
.tamamla__form .dugme .ikon { width: 15px; height: 15px; }
.tamamla__form:has(input[name="beden"]) .dugme { margin-left: 0; }
@media (min-width: 1000px) {
  .sepet-sayfa__liste .tamamla__liste { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 20px; }
}

/* Çark penceresi */
.cark {
  width: min(420px, calc(100% - 24px)); max-height: calc(100dvh - 24px); margin: auto; padding: 28px 24px 24px; border: 0; border-radius: 22px;
  background: var(--krem-zemin, #faf8f1); color: var(--murekkep); text-align: center; box-shadow: 0 30px 80px rgb(20 22 10 / .35); overflow: auto;
}
.cark::backdrop { background: rgb(28 30 21 / .55); }
.cark__kapat { position: absolute; top: 10px; right: 10px; }
.cark__ust { display: inline-flex; align-items: center; gap: 6px; font-size: .75rem; font-weight: 750; letter-spacing: .04em; color: var(--zeytin); }
.cark__ust .ikon { width: 16px; height: 16px; }
.cark h2 { font-family: var(--serif); font-weight: 700; font-size: 1.55rem; line-height: 1.15; letter-spacing: -.025em; margin: 6px 0; }
.cark__metin { font-size: .9rem; color: var(--gri); max-width: 32ch; margin: 0 auto; }
.cark__sahne { position: relative; width: min(300px, 78vw); aspect-ratio: 1; margin: 20px auto 6px; }
.cark__teker { width: 100%; height: 100%; filter: drop-shadow(0 12px 24px rgb(40 44 20 / .28)); }
.cark__teker [data-cark-teker] { will-change: transform; }
.cark__isik { fill: #f3e7b8; opacity: .55; }
.cark__sahne.donuyor .cark__isik { animation: cark-isik .32s steps(1) infinite; }
.cark__sahne.donuyor .cark__isik--cift { animation-delay: .16s; }
.cark__sahne.kazandi .cark__isik { opacity: 1; animation: cark-kazan .5s ease-in-out 3 alternate; }
@keyframes cark-isik { 0% { opacity: 1; } 50% { opacity: .25; } }
@keyframes cark-kazan { from { opacity: .3; } to { opacity: 1; } }
.cark__teker text { font-family: var(--font); letter-spacing: .02em; }
.cark__ok { position: absolute; z-index: 2; top: -8px; left: 50%; margin-left: -13px; width: 0; height: 0; border-left: 13px solid transparent; border-right: 13px solid transparent; border-top: 26px solid var(--murekkep); filter: drop-shadow(0 2px 2px rgb(0 0 0 / .3)); transform-origin: 50% 0; }
.cark__ok.tik { animation: cark-tik .14s ease-out; }
@keyframes cark-tik { 40% { transform: rotate(-16deg); } }
.cark__konfeti { position: absolute; inset: 50% auto auto 50%; pointer-events: none; }
.cark__konfeti i { position: absolute; width: 8px; height: 12px; border-radius: 2px; opacity: 0; animation: konfeti 1.6s cubic-bezier(.15, .6, .3, 1) var(--g) forwards; }
.cark__konfeti i.yuvarlak { width: 8px; height: 8px; border-radius: 50%; }
@keyframes konfeti {
  0% { opacity: 1; transform: translate(0, 0) rotate(0); }
  70% { opacity: 1; }
  100% { opacity: 0; transform: translate(var(--x), calc(var(--y) + 140px)) rotate(var(--r)); }
}
.cark__kod { display: flex; align-items: center; justify-content: center; gap: 10px; margin: 2px auto; padding: 10px 14px; border: 1.5px dashed var(--zeytin); border-radius: 12px; background: #fff; font-size: .82rem; color: var(--gri); }
.cark__kod b { font-size: 1.12rem; font-weight: 800; letter-spacing: .06em; color: var(--murekkep); font-variant-numeric: tabular-nums; }
.cark__cevir {
  position: absolute; inset: 50% auto auto 50%; translate: -50% -50%; width: 84px; height: 84px; border-radius: 50%; border: 4px solid #faf8f1;
  background: var(--murekkep); color: #faf8f1; font: 750 1rem/1 var(--font); letter-spacing: .02em; cursor: pointer; box-shadow: 0 6px 18px rgb(0 0 0 / .25); transition: transform var(--hiz);
}
.cark__cevir:hover { transform: scale(1.05); }
.cark__sahne.donuyor .cark__cevir { transform: scale(.94); }
.cark__cevir:disabled { cursor: default; transform: none; }
.cark__cevir:focus-visible { outline: 3px solid var(--zeytin); outline-offset: 3px; }
.cark__sonuc { display: grid; gap: 8px; margin-top: 12px; }
.cark__odul { font-family: var(--serif); font-weight: 750; font-size: 2rem; letter-spacing: -.03em; color: var(--zeytin); line-height: 1.1; }
.cark__sure { display: inline-flex; align-items: center; justify-content: center; gap: 6px; font-size: .9rem; color: var(--gri); }
.cark__sure .ikon { width: 16px; height: 16px; }
.cark__sure span { font-weight: 750; color: var(--murekkep); font-variant-numeric: tabular-nums; }
.cark__dugmeler { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 8px; }
@media (prefers-reduced-motion: reduce) { .cark__sahne.donuyor .cark__isik, .cark__sahne.kazandi .cark__isik, .cark__ok.tik { animation: none; } }
.kargo-esik { display: grid; gap: 8px; padding: 12px 14px; background: var(--zeytin-acik); border-radius: var(--kose); font-size: .85rem; color: var(--zeytin-koyu); }
.kargo-esik__cubuk { height: 4px; border-radius: 2px; background: rgb(84 93 41 / .18); overflow: hidden; }
.kargo-esik__cubuk span { display: block; height: 100%; background: var(--zeytin); border-radius: 2px; transition: width 600ms var(--egri); }
.sepet-sayfa { max-width: var(--en); margin: 0 auto; padding: 0 var(--kenar); display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: 48px; align-items: start; }
.sepet-sayfa__liste .sepet-liste { border-top: 1px solid var(--cizgi); }
.sepet-sayfa__ozet, .odeme__ozet { position: sticky; top: 140px; display: grid; gap: 16px; padding: 24px; background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: var(--kose); }
.sepet-sayfa__ozet h2, .odeme__ozet h2 { font-family: var(--serif); font-weight: 680; font-size: 1.35rem; line-height: 1.15; letter-spacing: -.022em; }

/* ---------- Ödeme ---------- */

.odeme { max-width: var(--en); margin: 0 auto; padding: 0 var(--kenar); display: grid; grid-template-columns: minmax(0, 1fr) 400px; gap: 48px; align-items: start; }
.odeme__form { display: grid; gap: 28px; }
.odeme fieldset { border: 0; margin: 0; padding: 0; display: grid; gap: 14px; }
.odeme legend { font-family: var(--serif); font-weight: 680; font-size: 1.22rem; line-height: 1.2; letter-spacing: -.02em; margin-bottom: 14px; padding: 0; }
.alan { display: grid; gap: 6px; }
.alan label { font-size: .85rem; font-weight: 650; }
.alan input, .alan select, .alan textarea, .kutu-form input {
  width: 100%; min-height: 50px; padding: 12px 14px; border: 1px solid var(--cizgi-koyu); border-radius: var(--kose);
  background: var(--yuzey); font-size: 1rem; transition: border-color var(--hiz), box-shadow var(--hiz);
}
.alan textarea { min-height: 0; resize: vertical; line-height: 1.5; }
.alan select { appearance: none; height: 50px; padding-right: 40px; cursor: pointer;
  background: var(--yuzey) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='%23545d29' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m4 6 4 4 4-4'/%3E%3C/svg%3E") no-repeat right 14px center; }
.alan input:focus, .alan select:focus, .alan textarea:focus, .kutu-form input:focus { outline: none; border-color: var(--zeytin); box-shadow: 0 0 0 1px var(--zeytin), 0 0 0 4px rgb(84 93 41 / .18); }
.alan input::placeholder, .alan textarea::placeholder { color: #6f7163; }
.alan--hata input, .alan--hata select, .alan--hata textarea { border-color: var(--hata); }
.alan__hata { font-size: .82rem; font-weight: 650; color: var(--hata); }
.alan-cift { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.secenekler { display: grid; gap: 10px; }
.secenek { position: relative; display: block; cursor: pointer; }
.secenek__ic { display: grid; gap: 3px; padding: 16px 16px 16px 48px; border: 1px solid var(--cizgi-koyu); border-radius: var(--kose); background: var(--yuzey); font-size: .88rem; color: var(--gri); transition: border-color var(--hiz), box-shadow var(--hiz); position: relative; }
.secenek__ic::before { content: ''; position: absolute; left: 16px; top: 18px; width: 18px; height: 18px; border-radius: 50%; border: 1.5px solid var(--cizgi-koyu); background: var(--yuzey); transition: border var(--hiz); }
.secenek__ic strong { font-size: 1rem; color: var(--murekkep); }
.secenek__ek { font-weight: 600; color: var(--gri); font-size: .88rem; }
.secenek input:checked + .secenek__ic { border-color: var(--zeytin); box-shadow: 0 0 0 1px var(--zeytin); }
.secenek input:checked + .secenek__ic::before { border: 5.5px solid var(--zeytin); }
.secenek input:focus-visible + .secenek__ic { outline: 2px solid var(--zeytin); outline-offset: 2px; }
.onay { display: flex; gap: 12px; align-items: flex-start; font-size: .9rem; cursor: pointer; font-weight: 500 !important; }
.onay input { width: 20px; height: 20px; min-height: 0; margin: 1px 0 0; accent-color: var(--zeytin); flex: none; }
.on-bilgi { border: 1px solid var(--cizgi-koyu); border-radius: var(--kose); background: var(--yuzey); }
.on-bilgi summary { padding: 14px 16px; min-height: 44px; font-weight: 650; font-size: .92rem; cursor: pointer; }
.on-bilgi__ic { max-height: 260px; overflow-y: auto; padding: 0 16px 14px; font-size: .84rem; color: var(--gri); display: grid; gap: 8px; }
.eksik { color: var(--hata); font-weight: 600; }
.mini-liste { list-style: none; display: grid; gap: 12px; }
.mini-liste li { display: grid; grid-template-columns: 56px minmax(0, 1fr) auto; gap: 12px; align-items: center; font-size: .9rem; font-variant-numeric: tabular-nums; }
.mini-liste__gorsel { position: relative; display: block; aspect-ratio: 4 / 5; border-radius: 2px; background: var(--krem); }
.mini-liste__gorsel img, .mini-liste__gorsel .gorsel-yok { width: 100%; height: 100%; object-fit: cover; border-radius: 2px; }
.mini-liste__adet { position: absolute; top: -7px; right: -7px; min-width: 20px; height: 20px; border-radius: 10px; background: var(--zeytin); color: var(--krem-yazi); font-size: .7rem; font-weight: 750; display: grid; place-items: center; padding: 0 5px; }
.mini-liste__ad { display: grid; font-weight: 600; line-height: 1.3; }
.mini-liste__ad small { font-weight: 500; color: var(--gri); font-size: .8rem; }

/* ---------- Teşekkür / takip ---------- */

.tesekkur { max-width: 720px; margin: 0 auto; padding: 48px var(--kenar) 0; display: grid; gap: 28px; }
.tesekkur__bas { display: grid; gap: 14px; }
.tesekkur__isaret { width: 56px; height: 56px; border-radius: 50%; display: grid; place-items: center; background: var(--zeytin); color: var(--krem-yazi); animation: belir 600ms var(--egri) both; }
.tesekkur__isaret .ikon { width: 28px; height: 28px; stroke-width: 2.2; stroke-dasharray: 30; stroke-dashoffset: 30; animation: ciz 520ms 260ms var(--egri) forwards; }
@keyframes belir { from { transform: scale(.6); opacity: 0; } }
@keyframes ciz { to { stroke-dashoffset: 0; } }
.tesekkur h1 { font-family: var(--serif); font-weight: 700; font-size: clamp(1.8rem, 3.4vw, 2.6rem); line-height: 1.08; letter-spacing: -.03em; }
.tesekkur__bas p { color: var(--gri); max-width: 58ch; }
.sip-no { color: var(--murekkep); font-variant-numeric: tabular-nums; letter-spacing: .03em; }
.havale-kutu, .tesekkur__ozet, .takip-sonuc, .kutu-form { display: grid; gap: 14px; padding: 24px; background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: var(--kose); }
.havale-kutu { background: var(--zeytin-acik); border-color: transparent; }
.havale-kutu h2, .tesekkur__ozet h2, .takip-sonuc h2 { font-family: var(--serif); font-weight: 680; font-size: 1.3rem; line-height: 1.15; letter-spacing: -.02em; }
.havale-kutu dl { margin: 0; display: grid; gap: 8px; }
.havale-kutu dl div { display: grid; grid-template-columns: 90px 1fr; gap: 12px; }
.havale-kutu dt { color: var(--gri); font-size: .88rem; }
.havale-kutu dd { margin: 0; font-weight: 650; display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; }
.iban { font-variant-numeric: tabular-nums; letter-spacing: .03em; word-break: break-all; }
.tesekkur__eylem { display: flex; flex-wrap: wrap; gap: 10px; }
.dar { max-width: 720px; margin: 0 auto; padding: 0 var(--kenar); }
.adimlar { list-style: none; display: grid; grid-template-columns: repeat(5, 1fr); margin: 8px 0; counter-reset: a; }
.adimlar li { position: relative; display: grid; justify-items: center; gap: 8px; text-align: center; font-size: .78rem; color: var(--gri); }
.adimlar li::before { counter-increment: a; content: counter(a); width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; border: 1.5px solid var(--cizgi-koyu); background: var(--yuzey); font-weight: 750; font-size: .78rem; position: relative; z-index: 1; }
.adimlar li + li::after { content: ''; position: absolute; top: 14px; right: 50%; width: 100%; height: 1.5px; background: var(--cizgi-koyu); }
.adimlar li.tamam::before { content: '✓'; background: var(--zeytin); border-color: var(--zeytin); color: var(--krem-yazi); }
.adimlar li.tamam::after, .adimlar li.simdi::after { background: var(--zeytin); }
.adimlar li.simdi::before { border-color: var(--zeytin); color: var(--zeytin); box-shadow: 0 0 0 4px var(--zeytin-acik); }
.adimlar li.simdi { color: var(--murekkep); font-weight: 700; }
.kutu-form p { color: var(--gri); }

.iletisim-liste { list-style: none; border-top: 1px solid var(--cizgi); }
.iletisim-liste a { display: grid; grid-template-columns: 24px 120px minmax(0, 1fr) auto; align-items: center; gap: 16px; padding: 20px 4px; border-bottom: 1px solid var(--cizgi); text-decoration: none; transition: background var(--hiz); }
.iletisim-liste a:hover { background: var(--krem); }
.iletisim-liste .ikon { color: var(--zeytin); }
.iletisim-liste__ad { font-weight: 700; }
.iletisim-liste__deger { color: var(--gri); overflow-wrap: anywhere; }
.iletisim-liste__eylem { display: inline-flex; align-items: center; gap: 6px; font-weight: 650; font-size: .88rem; color: var(--zeytin-koyu); }
.iletisim-liste__eylem .ikon { width: 16px; height: 16px; color: inherit; }

.metin { display: grid; gap: 14px; margin-top: 8px; }
.metin h2 { font-family: var(--serif); font-weight: 680; font-size: 1.28rem; line-height: 1.2; letter-spacing: -.02em; margin-top: 18px; }
.metin p, .metin li { color: #3f4236; max-width: 54ch; }
.metin ol, .metin ul { padding-left: 1.3em; display: grid; gap: 8px; }
.metin blockquote { border-left: 3px solid var(--zeytin); background: var(--krem); padding: 14px 16px; border-radius: 0 var(--kose) var(--kose) 0; }
.metin .tablo-kap { overflow-x: auto; max-width: 75ch; }
.metin table { width: 100%; border-collapse: collapse; font-size: .88rem; }
.metin th, .metin td { text-align: left; vertical-align: top; padding: 9px 10px; border-bottom: 1px solid var(--cizgi); }
.metin th { font-weight: 650; }

.hakkimizda { max-width: var(--en); margin: 0 auto; padding: 32px var(--kenar) 0; display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(32px, 6vw, 96px); align-items: center; }
.hakkimizda__gorsel { border-radius: var(--kose); overflow: hidden; aspect-ratio: 4 / 5; background: var(--krem); }
.hakkimizda__gorsel img { width: 100%; height: 100%; object-fit: cover; }
.hakkimizda h1 { font-family: var(--serif); font-weight: 700; font-size: clamp(2.1rem, 4vw, 3.4rem); line-height: 1.06; letter-spacing: -.028em; margin: 16px 0 10px; }
.hakkimizda .metin p { font-size: 1.05rem; }
.hakkimizda__imza { font-family: var(--serif); font-weight: 650; font-size: 1.2rem; letter-spacing: -.02em; color: var(--zeytin); margin-top: 22px; }
.hakkimizda__baglar { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 24px; }

/* ---------- Bildirim ---------- */

/* Çerez tercihi: alt köşede küçük kart, sayfayı kapatmaz */
.cerez {
  position: fixed; z-index: 60; left: 16px; bottom: 16px; width: min(420px, calc(100% - 32px));
  background: #fff; color: var(--murekkep); border: 1px solid var(--cizgi); border-radius: 14px;
  padding: 16px 18px; box-shadow: 0 12px 40px rgb(40 44 20 / .16); display: grid; gap: 14px; font-size: .88rem; line-height: 1.5;
}
.cerez[hidden] { display: none; }
.cerez b { display: block; font-size: .95rem; letter-spacing: -.01em; margin-bottom: 2px; }
.cerez a { color: var(--zeytin); }
.cerez__dugmeler { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.cerez__dugmeler .dugme { min-height: 42px; padding-inline: 12px; font-size: .86rem; }
.alt__cerez { all: unset; cursor: pointer; color: var(--krem-yazi); width: fit-content; }
.alt__cerez:hover { text-decoration: underline; }
.alt__cerez:focus-visible { outline: 2px solid var(--krem-yazi); outline-offset: 3px; }
@media (max-width: 560px) { .cerez { left: 10px; right: 10px; bottom: 10px; width: auto; } }
.bildirim {
  position: fixed; left: 50%; bottom: 24px; z-index: 60; translate: -50% 0; max-width: calc(100vw - 32px);
  padding: 13px 20px; border-radius: var(--kose); background: var(--murekkep); color: var(--krem-yazi); font-size: .9rem; font-weight: 600;
  box-shadow: var(--golge); animation: yuksel 320ms var(--egri);
}
.bildirim--hata { background: var(--hata); }
@keyframes yuksel { from { transform: translateY(12px); opacity: 0; } }

/* ---------- Bildirim (sunucudan, sayfa yüklenince) ---------- */

.flash {
  position: fixed; left: 50%; bottom: 24px; z-index: 60; translate: -50% 0; display: flex; align-items: center; gap: 10px;
  max-width: calc(100vw - 32px); padding: 13px 18px; border-radius: var(--kose); background: var(--zeytin-koyu); color: var(--krem-yazi);
  font-size: .92rem; font-weight: 600; box-shadow: var(--golge); pointer-events: none; animation: flash 5.2s var(--egri) forwards;
}
.flash--hata { background: var(--hata); color: #fff; }
@keyframes flash { 0% { opacity: 0; translate: -50% 12px; } 6%, 88% { opacity: 1; translate: -50% 0; } 100% { opacity: 0; translate: -50% 6px; visibility: hidden; } }

/* ---------- Hesap: giriş / üyelik ---------- */

.ust__hesap { position: relative; }
.ust__nokta { position: absolute; top: 9px; right: 9px; width: 7px; height: 7px; border-radius: 50%; background: var(--zeytin); box-shadow: 0 0 0 2px var(--zemin); }

.giris-sahne {
  max-width: 1040px; margin: 0 auto; padding: clamp(28px, 5vw, 64px) var(--kenar) 72px;
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .92fr); gap: clamp(24px, 4vw, 56px); align-items: start;
}
.giris-kutu { display: grid; gap: 20px; }
.giris-kutu > h1 { font: 700 clamp(1.7rem, 3.2vw, 2.1rem)/1.1 var(--serif); letter-spacing: -.03em; }
.giris-kutu > p { color: var(--gri); max-width: 48ch; }
.giris-kutu__alt a { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; text-decoration: none; color: var(--gri); }
.giris-kutu__alt .ikon { width: 16px; height: 16px; }
.giris-sekme { display: grid; grid-template-columns: 1fr 1fr; border-bottom: 1px solid var(--cizgi); }
.giris-sekme a {
  padding: 14px 4px 13px; text-align: center; text-decoration: none; font: 650 1.12rem/1.2 var(--serif); letter-spacing: -.015em; color: var(--gri);
  border-bottom: 2px solid transparent; margin-bottom: -1px; transition: color var(--hiz), border-color var(--hiz);
}
.giris-sekme a:hover { color: var(--murekkep); }
.giris-sekme a[aria-current] { color: var(--zeytin-koyu); border-color: var(--zeytin); }
.giris-form { display: grid; gap: 16px; }
.giris-form .uyari { margin: 0; }
.giris-form__unut { margin-top: -6px; text-align: right; font-size: .86rem; }
.giris-form__unut a { color: var(--gri); }
.sifre-alan { position: relative; }
.sifre-alan input { width: 100%; padding-right: 50px; }
.sifre-goster { position: absolute; top: 50%; right: 4px; translate: 0 -50%; width: 42px; height: 42px; display: grid; place-items: center; border: 0; background: none; color: var(--gri); border-radius: var(--kose); }
.sifre-goster:hover { color: var(--murekkep); }
.sifre-goster[aria-pressed='true'] { color: var(--zeytin); }

.giris-yan {
  position: relative; overflow: hidden; display: grid; gap: 18px; padding: clamp(28px, 4vw, 44px);
  background: var(--zeytin); color: var(--krem-yazi); border-radius: var(--kose);
}
.giris-yan::after { content: ''; position: absolute; inset: 8px; border: 1px dashed rgb(246 241 225 / .32); border-radius: 2px; pointer-events: none; }
.giris-yan__ust { font-size: .76rem; font-weight: 700; letter-spacing: .04em; opacity: .8; }
.giris-yan h2 { font: 700 clamp(1.45rem, 2.4vw, 1.8rem)/1.15 var(--serif); letter-spacing: -.028em; max-width: 18ch; }
.giris-yan ul { list-style: none; display: grid; gap: 16px; margin-top: 4px; }
.giris-yan li { display: grid; grid-template-columns: 22px 1fr; gap: 12px; font-size: .93rem; line-height: 1.5; color: rgb(246 241 225 / .86); }
.giris-yan li b { color: var(--krem-yazi); font-weight: 700; }
.giris-yan .ikon { margin-top: 2px; }
.giris-yan__not { font-size: .85rem; padding-top: 14px; border-top: 1px solid rgb(246 241 225 / .2); color: rgb(246 241 225 / .8); }

/* ---------- Hesap: panel ---------- */

.hesap {
  max-width: 1120px; margin: 0 auto; padding: clamp(24px, 4vw, 48px) var(--kenar) 80px;
  display: grid; grid-template-columns: 250px minmax(0, 1fr); gap: clamp(24px, 4vw, 56px); align-items: start;
}
.hesap__yan { position: sticky; top: 150px; display: grid; gap: 18px; }
.hesap__kim { display: flex; align-items: center; gap: 12px; padding-bottom: 18px; border-bottom: 1px solid var(--cizgi); }
.hesap__kim > span:last-child { display: grid; min-width: 0; }
.hesap__kim small { color: var(--gri); font-size: .8rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hesap__harf { flex: none; width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; background: var(--zeytin); color: var(--krem-yazi); font: 650 1.15rem/1 var(--serif); }
.hesap__menu { display: grid; gap: 2px; }
.hesap__menu form { display: contents; }
.hesap__menu a, .hesap__menu button {
  display: flex; align-items: center; gap: 12px; min-height: 44px; padding: 0 12px; border: 0; border-radius: var(--kose);
  background: none; text-decoration: none; font-weight: 600; font-size: .94rem; color: var(--gri); text-align: left; transition: background var(--hiz), color var(--hiz);
}
.hesap__menu a:hover, .hesap__menu button:hover { background: var(--krem); color: var(--murekkep); }
.hesap__menu a[aria-current] { background: var(--zeytin-acik); color: var(--zeytin-koyu); }
.hesap__menu button { margin-top: 8px; }
.hesap__icerik { display: grid; gap: 18px; min-width: 0; }
.hesap__icerik > .uyari { margin: 0; }
.hesap__baslik { font: 700 clamp(1.6rem, 3vw, 2rem)/1.1 var(--serif); letter-spacing: -.03em; }
.hesap__aciklama { color: var(--gri); margin-top: -8px; }
.hesap__geri { display: inline-flex; align-items: center; gap: 6px; justify-self: start; color: var(--gri); font-weight: 600; font-size: .88rem; text-decoration: none; }
.hesap__geri .ikon { width: 16px; height: 16px; }
.hesap-kart { padding: clamp(18px, 3vw, 26px); background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: var(--kose); display: grid; gap: 14px; }
.hesap-kart h2 { font-size: 1rem; font-weight: 750; }
.hesap-kart .mini-liste { margin: 0; }
.hesap-form { max-width: 560px; gap: 16px; }
.hesap-form .dugme { justify-self: start; }

.hesap-siparisler { list-style: none; display: grid; gap: 10px; }
.hesap-siparisler a {
  display: grid; grid-template-columns: 56px minmax(0, 1fr) auto auto 18px; align-items: center; gap: 16px;
  padding: 12px 16px 12px 12px; background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: var(--kose);
  text-decoration: none; transition: border-color var(--hiz), transform var(--hiz) var(--egri);
}
.hesap-siparisler a:hover { border-color: var(--zeytin); }
.hesap-siparisler a > .ikon { width: 18px; height: 18px; color: var(--gri); }
.hesap-siparisler__gorsel img, .hesap-siparisler__gorsel .gorsel-yok { width: 56px; aspect-ratio: 4 / 5; object-fit: cover; border-radius: 2px; background: var(--krem); }
.hesap-siparisler__gorsel .gorsel-yok img { width: 50%; }
.hesap-siparisler__bilgi { display: grid; gap: 2px; }
.hesap-siparisler__bilgi b { font-variant-numeric: tabular-nums; letter-spacing: .02em; }
.hesap-siparisler__bilgi small { color: var(--gri); font-size: .84rem; }
.hesap-siparisler__tutar { font-weight: 750; font-variant-numeric: tabular-nums; white-space: nowrap; }

.durum-etiket { display: inline-block; padding: 4px 10px; border-radius: 99px; font-size: .76rem; font-weight: 700; white-space: nowrap; background: var(--krem); color: var(--gri); }
.durum-etiket--yeni { background: var(--zeytin-acik); color: var(--zeytin-koyu); }
.durum-etiket--onaylandi, .durum-etiket--hazirlaniyor { background: #f7efd6; color: #6b4e0b; }
.durum-etiket--kargoda { background: #e3ebef; color: #2c4a57; }
.durum-etiket--teslim { background: var(--zeytin); color: var(--krem-yazi); }
.durum-etiket--iptal { background: var(--hata-zemin); color: var(--hata); }

.hesap-bos { display: grid; justify-items: center; gap: 12px; padding: 56px 20px; text-align: center; border: 1px dashed var(--cizgi-koyu); border-radius: var(--kose); }
.hesap-bos > .ikon { width: 34px; height: 34px; color: var(--zeytin); }
.hesap-bos .dugme { margin-top: 6px; }
.iban-kutu { padding: 16px 18px; border-radius: var(--kose); background: var(--krem); display: grid; gap: 6px; font-size: .92rem; }
.iban-kutu b { font-variant-numeric: tabular-nums; }

/* ---------- Mobil menü: ekranın yarısı ---------- */

.cekmece--sol { width: min(360px, max(54vw, 212px)); }
.cekmece--sol .cekmece__bas { padding: 10px 6px 10px 16px; }
.cekmece--sol .cekmece__logo { height: 17px; }
.cekmece--sol .mobil-menu > a, .cekmece--sol .mobil-menu summary { padding: 13px 16px; font-size: .96rem; }
.cekmece--sol .mobil-menu details div a { padding: 9px 16px 9px 26px; font-size: .92rem; }
.cekmece--sol .mobil-menu__alt { padding: 0 4px; margin-top: 12px; }
.cekmece--sol .mobil-menu__alt a { padding: 10px 12px; font-size: .9rem; gap: 10px; }
.cekmece--sol .mobil-menu__alt .ikon { width: 18px; height: 18px; }

@media (max-width: 860px) {
  .giris-sahne { grid-template-columns: minmax(0, 1fr); }
  .giris-yan { order: 2; }
  .hesap { grid-template-columns: minmax(0, 1fr); gap: 20px; }
  .hesap__yan { position: static; gap: 14px; }
  .hesap__kim { padding-bottom: 0; border: 0; }
  .hesap__menu { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; margin-inline: calc(var(--kenar) * -1); padding-inline: var(--kenar); }
  .hesap__menu a, .hesap__menu button { flex: none; min-height: 40px; padding: 0 14px; border: 1px solid var(--cizgi); border-radius: 99px; font-size: .88rem; gap: 8px; margin: 0; }
  .hesap__menu .ikon { width: 16px; height: 16px; }
  .hesap__menu a[aria-current] { border-color: var(--zeytin); }
}
@media (max-width: 560px) {
  .hesap-siparisler a { grid-template-columns: 48px minmax(0, 1fr) auto; gap: 4px 12px; }
  .hesap-siparisler__gorsel { grid-row: span 2; }
  .hesap-siparisler__gorsel img, .hesap-siparisler__gorsel .gorsel-yok { width: 48px; }
  .hesap-siparisler .durum-etiket { grid-column: 2; justify-self: start; }
  .hesap-siparisler__tutar { grid-column: 3; grid-row: 1; }
  .hesap-siparisler a > .ikon { display: none; }
  .ust__fav { display: none; }
}

/* ---------- Duyarlı ---------- */

@media (max-width: 1180px) {
  .menu__liste > li > a { padding: 13px 10px; font-size: .84rem; }
  .menu__liste > li > a::after { left: 10px; right: 10px; }
  .karolar { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .izgara { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .alt__ic { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 960px) {
  .ust__ic { grid-template-columns: auto 1fr auto; padding-block: 6px; gap: 4px; }
  .ust__menu, .ust__ara { display: inline-grid; }
  .ust .arama, .menu { display: none; }
  .logo { justify-content: center; gap: 8px; }
  .logo__m { height: 32px; }
  .logo__y { height: 17px; }
  html { scroll-padding-top: 80px; }
  .kapak { grid-template-columns: 1fr; min-height: 0; }
  .kapak__gorsel { order: -1; aspect-ratio: 4 / 4.4; max-height: 72vh; }
  .kapak__metin { padding: 32px var(--kenar) 40px; gap: 16px; }
  .liste { grid-template-columns: 1fr; }
  .suzgec { position: fixed; inset: auto 0 0 0; top: auto; z-index: 50; max-height: 86dvh; padding: 0 20px 20px; background: var(--zemin); border-radius: 12px 12px 0 0; box-shadow: 0 -20px 50px rgb(28 30 21 / .3); transform: translateY(105%); transition: transform 340ms var(--egri); visibility: hidden; }
  .suzgec.acik { transform: none; visibility: visible; }
  .suzgec__bas { display: flex; align-items: center; justify-content: space-between; position: sticky; top: 0; background: var(--zemin); padding: 14px 0 10px; z-index: 1; border-bottom: 1px solid var(--cizgi); }
  .suzgec__baslik { font-family: var(--serif); font-weight: 680; font-size: 1.25rem; line-height: 1.1; letter-spacing: -.02em; }
  .suzgec__eylem { position: sticky; bottom: -20px; background: var(--zemin); padding: 12px 0 0; }
  .js .suzgec__eylem .dugme { display: inline-flex; flex: 1; }
  .suzgec-ac { display: inline-flex; min-height: 40px; padding: 0 14px; font-size: .88rem; }
  .suzgec-ac .ikon { width: 16px; height: 16px; }
  .arac-cubugu__sayi { display: none; }
  .urun { grid-template-columns: 1fr; padding: 0; gap: 20px; }
  .urun__bilgi { padding: 0 var(--kenar) 24px; }
  .galeri { position: relative; top: 0; grid-template-columns: 1fr; }
  .galeri__sahne { grid-column: 1; border-radius: 0; }
  .galeri__kucukler { grid-column: 1; grid-row: 2; display: flex; justify-content: center; gap: 6px; }
  .galeri__kucukler button { width: 8px; height: 8px; aspect-ratio: auto; border-radius: 50%; background: var(--cizgi-koyu); border: 0; opacity: 1; }
  .galeri__kucukler button[aria-current] { background: var(--zeytin); width: 20px; border-radius: 4px; }
  .galeri__kucukler button img { display: none; }
  .urun-sayfasi .yapiskan-cubuk { display: flex; }
  .urun-sayfasi .hizmet { margin-bottom: 0; }
  .urun-sayfasi .alt__en { padding-bottom: 96px; }
  .kombin-satir { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 68%; overflow-x: auto; scroll-snap-type: x mandatory; margin: 0 calc(-1 * var(--kenar)); padding: 0 var(--kenar); scrollbar-width: none; }
  .kombin-kart { scroll-snap-align: start; }
  .kombin-izgara, .kombin-detay, .hakkimizda { grid-template-columns: 1fr; }
  .kombin-detay { padding: 0; }
  .kombin-detay__gorsel { position: static; border-radius: 0; aspect-ratio: 4 / 4.2; }
  .kombin-detay__bilgi { padding: 0 var(--kenar); }
  .sepet-sayfa, .odeme { grid-template-columns: minmax(0, 1fr); gap: 28px; }
  .sepet-sayfa__ozet, .odeme__ozet { position: static; }
  .hakkimizda { padding-top: 0; }
  .hakkimizda__gorsel { aspect-ratio: 4 / 3.4; margin: 0 calc(-1 * var(--kenar)); border-radius: 0; }
}

@media (max-width: 640px) {
  .izgara, .izgara--liste { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 10px; }
  .karolar { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 40%; overflow-x: auto; margin: 0 calc(-1 * var(--kenar)); padding: 0 var(--kenar); scroll-snap-type: x mandatory; scrollbar-width: none; gap: 8px; }
  .karo { scroll-snap-align: start; }
  .kart__ad { font-size: .88rem; }
  .kart__fav { width: 34px; height: 34px; top: 6px; right: 6px; }
  .etiket { left: 6px; top: 6px; font-size: .64rem; padding: 3px 7px; }
  .kapak h1 { font-size: clamp(2.8rem, 13vw, 3.6rem); }
  .kapak__dugmeler .dugme { flex: 1; padding: 0 16px; }
  .hakkinda-serit { grid-template-columns: 1fr; }
  .hakkinda-serit img { width: 64px; }
  .hizmet ul { display: grid; grid-template-columns: 1fr; gap: 12px; }
  .alt__ic { grid-template-columns: 1fr 1fr; gap: 32px 20px; }
  .alt__marka { grid-column: 1 / -1; }
  .alt__marka img { width: 96px; }
  .alan-cift { grid-template-columns: 1fr; }
  .parca { grid-template-columns: 64px minmax(0, 1fr); }
  .parca__beden { grid-column: 2; }
  .parca select { width: 100%; }
  .iletisim-liste a { grid-template-columns: 24px minmax(0, 1fr) auto; }
  .iletisim-liste__deger { grid-column: 2; grid-row: 2; margin-top: -12px; font-size: .88rem; }
  .iletisim-liste__eylem { grid-row: 1 / 3; grid-column: 3; }
  .adimlar li { font-size: .68rem; }
  .sepet-oge { grid-template-columns: 72px minmax(0, 1fr); }
  .sepet-oge__tutar { grid-column: 2; grid-row: 1; justify-self: end; align-self: start; }
  .sepet-oge__bilgi { padding-right: 70px; grid-column: 2; grid-row: 1; }
  .urun__ikincil .dugme { font-size: .88rem; }
}

.odeme__uye { display: flex; align-items: flex-start; gap: 10px; padding: 12px 14px; border-radius: var(--kose); background: var(--krem); font-size: .9rem; }
.odeme__uye .ikon { color: var(--zeytin); margin-top: 1px; }

/* ---------- Hesabım: özet, kodlar ---------- */
.hesap__menu a { position: relative; }
.hesap__rozet { margin-left: auto; min-width: 20px; height: 20px; padding: 0 6px; border-radius: 99px; background: var(--zeytin); color: var(--krem-yazi); font-size: .72rem; font-weight: 750; display: grid; place-items: center; }
.hesap-selam p { color: var(--gri); margin-top: 6px; }
.hesap-ozet { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.hesap-ozet__kutu { display: grid; gap: 4px; padding: 16px 18px; background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: var(--kose); text-decoration: none; transition: border-color var(--hiz); min-width: 0; }
.hesap-ozet__kutu:hover { border-color: var(--zeytin); }
.hesap-ozet__kutu > span { display: inline-flex; align-items: center; gap: 6px; font-size: .8rem; font-weight: 650; color: var(--gri); }
.hesap-ozet__kutu > span .ikon { width: 16px; height: 16px; color: var(--zeytin); }
.hesap-ozet__kutu b { font-size: 1.7rem; font-weight: 700; letter-spacing: -.03em; font-variant-numeric: tabular-nums; line-height: 1.1; }
.hesap-ozet__kutu b.hesap-ozet__metin { font-size: 1.02rem; letter-spacing: -.01em; padding: 6px 0 3px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hesap-ozet__kutu small { font-size: .8rem; color: var(--gri); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hesap-bolum { display: grid; gap: 12px; }
.hesap-kart__bas { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.hesap-kart__bas h2 { font-size: 1.02rem; font-weight: 700; letter-spacing: -.01em; }
.hesap-kart__bas a { display: inline-flex; align-items: center; gap: 2px; font-size: .86rem; font-weight: 650; color: var(--zeytin-koyu); text-decoration: none; }
.hesap-kart__bas a .ikon { width: 15px; height: 15px; }
.hesap-kart .adimlar { margin: 4px 0; }
.hesap-siparisler__gorsel { display: flex; }
.hesap-siparisler__gorsel picture, .hesap-siparisler__gorsel > img, .hesap-siparisler__gorsel .gorsel-yok { flex: none; }
.hesap-siparisler__gorsel[data-adet="2"] > * + *, .hesap-siparisler__gorsel[data-adet="3"] > * + * { margin-left: -26px; }
.hesap-siparisler__gorsel img, .hesap-siparisler__gorsel .gorsel-yok { box-shadow: 0 0 0 2px var(--yuzey); }
.hesap-bos--kucuk { padding: 28px 20px; }
.hesap-kisayol { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.hesap-kisayol a { display: flex; align-items: center; gap: 12px; padding: 14px 16px; border: 1px solid var(--cizgi); border-radius: var(--kose); text-decoration: none; background: var(--yuzey); transition: border-color var(--hiz); }
.hesap-kisayol a:hover { border-color: var(--zeytin); }
.hesap-kisayol .ikon { width: 20px; height: 20px; flex: none; color: var(--zeytin); }
.hesap-kisayol span { display: grid; min-width: 0; }
.hesap-kisayol b { font-size: .9rem; font-weight: 650; }
.hesap-kisayol small { font-size: .78rem; color: var(--gri); }
.hesap-iki { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 14px; align-items: start; }
.hesap-iki .dugme { justify-self: start; }
.kod-liste { list-style: none; display: grid; gap: 10px; }
.kod-kart { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: 10px 18px; padding: 14px 18px; background: var(--yuzey); border: 1px solid var(--cizgi); border-left: 4px solid var(--zeytin); border-radius: var(--kose); }
.kod-kart--kullanildi, .kod-kart--doldu, .kod-kart--kapali { border-left-color: var(--cizgi-koyu); opacity: .7; }
.kod-kart__sol { display: grid; gap: 2px; min-width: 0; }
.kod-kart__sol b { font-size: 1.05rem; font-weight: 700; letter-spacing: -.01em; }
.kod-kart__sol small, .kod-kart__sag small { font-size: .8rem; color: var(--gri); }
.kod-kart__kod { display: flex; align-items: center; gap: 10px; padding: 8px 12px; border: 1.5px dashed var(--cizgi-koyu); border-radius: 10px; }
.kod-kart__kod span { font-family: ui-monospace, "SF Mono", Menlo, monospace; font-weight: 700; letter-spacing: .05em; font-size: .92rem; }
.kod-kart__sag { display: grid; justify-items: end; gap: 6px; }
.kod-kart__sure { display: inline-flex; align-items: center; gap: 4px; font-variant-numeric: tabular-nums; }
.kod-kart__sure .ikon { width: 14px; height: 14px; }
.kod-kart__sure[data-kod-kalan] { color: var(--zeytin-koyu) !important; font-weight: 700; }
.kod-kart__uygulandi { display: inline-flex; align-items: center; gap: 4px; font-size: .84rem; font-weight: 700; color: var(--zeytin); }
.kod-kart__uygulandi .ikon { width: 16px; height: 16px; }
@media (max-width: 900px) {
  .hesap-iki { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 640px) {
  .hesap-ozet { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hesap-ozet__kutu:last-child { grid-column: 1 / -1; }
  .hesap-kisayol { grid-template-columns: minmax(0, 1fr); }
  .kod-kart { grid-template-columns: minmax(0, 1fr) auto; padding: 14px; }
  .kod-kart__kod { grid-column: 1 / -1; grid-row: 2; justify-content: space-between; }
  .kod-kart__sag { grid-column: 2; grid-row: 1; }
  .hesap__rozet { margin-left: 2px; }
}

/* ---------- Flaş indirim ---------- */
.flas__bas { display: flex; align-items: flex-end; justify-content: space-between; gap: 18px 28px; flex-wrap: wrap; margin-bottom: 24px; padding-bottom: 20px; border-bottom: 1px solid var(--cizgi); }
.flas h2 { font-family: var(--serif); font-weight: 700; font-size: clamp(1.8rem, 3.2vw, 2.6rem); line-height: 1.05; letter-spacing: -.03em; margin: 4px 0 6px; }
.flas h2 .ikon { width: .8em; height: .8em; color: var(--zeytin); vertical-align: -.06em; margin-right: .1em; }
.flas__metin { color: var(--gri); max-width: 46ch; }
.flas__sure { display: grid; justify-items: end; gap: 4px; }
.flas__sure small { font-size: .74rem; font-weight: 650; letter-spacing: .04em; color: var(--gri); }
.flas-sayac { display: inline-flex; align-items: center; gap: 8px; padding: 9px 16px; border-radius: 99px; background: var(--zeytin-koyu); color: var(--krem-yazi); font-weight: 750; font-size: 1.15rem; font-variant-numeric: tabular-nums; letter-spacing: .02em; }
.flas-sayac .ikon { width: 18px; height: 18px; }
.izgara--flas { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 28px 14px; }
.etiket--flas { display: inline-flex; align-items: center; gap: 3px; background: var(--murekkep); color: #fff; outline-color: rgb(255 255 255 / .35); }
.etiket--flas .ikon { width: 12px; height: 12px; fill: currentColor; stroke: none; }
.flas-urun { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 12px; padding: 10px 12px; border-radius: 12px; background: var(--zeytin-acik); color: var(--zeytin-koyu); font-size: .88rem; }
.flas-urun > .ikon { width: 18px; height: 18px; flex: none; }
.flas-urun > span:not(.flas-sayac) { flex: 1; min-width: 160px; }
.flas-urun .flas-sayac { padding: 5px 11px; font-size: .9rem; }
.flas-urun .flas-sayac .ikon { width: 15px; height: 15px; }
.ilgi-notu { display: flex; align-items: center; gap: 6px; margin-top: 10px; font-size: .86rem; color: var(--zeytin-koyu); }
.ilgi-notu .ikon { width: 16px; height: 16px; color: #b4561f; }
.tamamla__flas { font-style: normal; font-size: .7rem; font-weight: 800; letter-spacing: .04em; color: var(--murekkep); }
@media (max-width: 1100px) { .izgara--flas { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 700px) {
  .izgara--flas { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; gap: 10px; margin-inline: calc(var(--kenar) * -1); padding: 0 var(--kenar) 6px; scrollbar-width: none; }
  .izgara--flas > * { flex: 0 0 44%; scroll-snap-align: start; }
  .flas__sure { justify-items: start; }
}

/* ---------- Stok gelince haber ver, kampanya ipucu ---------- */
.haber { margin-top: 14px; padding: 12px 14px; border: 1px solid var(--cizgi); border-radius: 12px; background: var(--yuzey); font-size: .9rem; }
.haber summary { display: flex; align-items: center; gap: 8px; cursor: pointer; font-weight: 650; list-style: none; }
.haber summary::-webkit-details-marker { display: none; }
.haber summary .ikon { width: 18px; height: 18px; color: var(--zeytin); }
.haber__form { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0 6px; align-items: center; }
.haber__form select, .haber__form input[type="tel"] { height: 42px; padding: 0 12px; border: 1px solid var(--cizgi-koyu); border-radius: var(--kose); background: #fff; font: inherit; font-size: .9rem; }
.haber__form input[type="tel"] { flex: 1; min-width: 150px; }
.haber__form .dugme { min-height: 42px; }
.kampanya-ipucu { display: flex; gap: 8px; align-items: center; padding: 10px 12px; margin-bottom: 12px; border-radius: 12px; border: 1px dashed var(--zeytin); color: var(--zeytin-koyu); font-size: .85rem; line-height: 1.4; }
.kampanya-ipucu .ikon { width: 17px; height: 17px; flex: none; }

/* ---------- Hesap: davet, doğum günü ---------- */
.davet { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 12px 16px; align-items: center; padding: 18px 20px; border-radius: var(--kose); background: var(--zeytin-koyu); color: var(--krem-yazi); }
.davet h2 { display: flex; align-items: center; gap: 8px; font-size: 1.02rem; font-weight: 700; }
.davet h2 .ikon { width: 19px; height: 19px; }
.davet p { font-size: .86rem; opacity: .9; margin-top: 4px; line-height: 1.45; }
.davet__kod { display: flex; align-items: center; gap: 10px; padding: 8px 12px; border: 1.5px dashed rgb(246 241 225 / .5); border-radius: 10px; }
.davet__kod span { font-family: ui-monospace, "SF Mono", Menlo, monospace; font-weight: 700; letter-spacing: .05em; }
.davet .bag { color: var(--krem-yazi); }
.davet .dugme { background: var(--krem-yazi); color: var(--zeytin-koyu); border-color: var(--krem-yazi); }
.davet .dugme .ikon { width: 16px; height: 16px; }
.davet__alt { grid-column: 1 / -1; margin: 0 !important; }
.davet--alt { margin-top: 8px; }
.hesap-kutlama { display: flex; gap: 12px; align-items: center; padding: 14px 16px; border-radius: var(--kose); background: var(--zeytin-acik); color: var(--zeytin-koyu); font-size: .92rem; line-height: 1.45; }
.hesap-kutlama .ikon { width: 22px; height: 22px; flex: none; }
.hesap-form fieldset { border: 0; padding: 0; margin: 0; }
.hesap-form legend { font-size: .86rem; font-weight: 650; margin-bottom: 6px; }
.hesap-form legend small { font-weight: 500; color: var(--gri); }
.alan-cift--dar { max-width: 320px; }
.alan-cift--dar select { height: 44px; }
@media (max-width: 760px) {
  .davet { grid-template-columns: minmax(0, 1fr); }
  .davet__kod { justify-content: space-between; }
  .davet .dugme { justify-self: start; }
}

/* ---------- Dokunma alanı: görünüm aynı, parmak hedefi en az 44px ---------- */
.kart__fav::after, .adet--kucuk button::after, .bag--sil::after, .kirinti a::after { content: ''; position: absolute; }
.kart__fav::after { inset: -5px; border-radius: 50%; }
.adet--kucuk button { position: relative; }
.adet--kucuk button::after { inset: -5px 0; }
.bag--sil, .kirinti a { position: relative; }
.bag--sil::after { inset: -11px -6px; }
.kirinti a::after { inset: -14px -4px; }
.alt__sutun { gap: 0; }
.alt__sutun a, .alt__sutun .alt__cerez { padding-block: 6px; }
.haber summary { min-height: 44px; }
/* Yasal düğme metni uzun ("ödeme yükümlülüğünü kabul ediyorum"): dar ekranda satır kırar */
.odeme__ozet .dugme--genis { white-space: normal; text-align: center; line-height: 1.3; min-height: 52px; height: auto; padding-block: 12px; }