/* HERKESE ACIK SAYFALAR (seo/uret.js uretir) — uygulamanin gorsel dili.
 *
 * NEDEN style.css DEGIL: o dosya 570 KB ve uygulama kabugu icin; bir
 * okuma sayfasinin ilk boyamasini onun inmesine baglamak Core Web Vitals'i
 * bozar (LCP). Burada yalnizca bu sayfalarin ihtiyaci var.
 *
 * DEGERLER style.css'TEN KOPYALANDI, UYDURULMADI: kum sayfa #F5F1EA,
 * kagit kart #FFFDF8, kenar #E9E1D4/#E3DACB, murekkep #17222E, bakir
 * #A3572E, lacivert vitrin #0F1C2B; koyu tema handoff'un lacivert paleti.
 * Kurallar ayni: tek aile (Geist), agirlik tavani 600, 11px alti yazi yok,
 * GRADYAN YOK, emoji yok, 4px izgara, dokunma hedefi >= 44px.
 * Renk UC blokta: acik · [data-theme=dark] · prefers-color-scheme.
 */
@font-face {
  font-family: 'Geist';
  src: url('../fonts/geist-latin.woff2') format('woff2-variations');
  font-weight: 300 600; font-style: normal; font-display: swap;
  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;
}
@font-face {
  font-family: 'Geist';
  src: url('../fonts/geist-latin-ext.woff2') format('woff2-variations');
  font-weight: 300 600; font-style: normal; font-display: swap;
  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;
}

:root {
  color-scheme: light;
  --page: #F5F1EA;
  --card: #FFFDF8;
  --card2: #F5F1EA;
  --line: #E3DACB;
  --line-kart: #E9E1D4;
  --btn-line: #8E8579;
  --text: #17222E;
  --muted: #4E5560;
  --accent: #A3572E;
  --accent-soft: rgba(163, 87, 46, 0.10);
  --ink-ters: #FFF7EF;
  --ok: #3F6B52;
  --ok-soft: rgba(63, 107, 82, 0.10);
  --bad: #9A3131;
  --bad-soft: rgba(154, 49, 49, 0.08);
  --vitrin: #0F1C2B;
  --vitrin-text: #E9EDF2;
  --vitrin-muted: #A7AEB5;
  --shadow-card: 0 1px 2px rgba(15, 28, 43, 0.03), 0 10px 30px -24px rgba(15, 28, 43, 0.40);
  --odak: 0 0 0 3px rgba(163, 87, 46, 0.35);

  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px;
  --sp-5: 20px; --sp-6: 24px; --sp-8: 32px; --sp-10: 40px;
  --fs-xs: 11px; --fs-sm: 12.5px; --fs-base: 15px; --fs-md: 16px;
  --fs-lg: 19px; --fs-xl: 23px; --fs-2xl: 34px;
  --r-sm: 8px; --r-md: 11px; --r-lg: 16px; --r-full: 999px;
  --ctrl-h: 44px; --ctrl-h-lg: 52px;
  --icerik-w: 1180px;
  --font: 'Geist', system-ui, -apple-system, 'Segoe UI', sans-serif;
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --page: #0B1622; --card: #16293C; --card2: #21384F;
  --line: #24384E; --line-kart: #24384E; --btn-line: #6B87A3;
  --text: #E9EDF2; --muted: #A7AEB5;
  --accent: #C98A5B; --accent-soft: rgba(201, 138, 91, 0.14); --ink-ters: #0F1C2B;
  --ok: #7FB093; --ok-soft: rgba(127, 176, 147, 0.12);
  --bad: #E08A8A; --bad-soft: rgba(224, 138, 138, 0.10);
  --vitrin: #16293C; --vitrin-text: #E9EDF2; --vitrin-muted: #A7AEB5;
  --shadow-card: 0 1px 2px rgba(0, 0, 0, 0.30), 0 10px 30px -24px rgba(0, 0, 0, 0.90);
  --odak: 0 0 0 3px rgba(201, 138, 91, 0.45);
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --page: #0B1622; --card: #16293C; --card2: #21384F;
    --line: #24384E; --line-kart: #24384E; --btn-line: #6B87A3;
    --text: #E9EDF2; --muted: #A7AEB5;
    --accent: #C98A5B; --accent-soft: rgba(201, 138, 91, 0.14); --ink-ters: #0F1C2B;
    --ok: #7FB093; --ok-soft: rgba(127, 176, 147, 0.12);
    --bad: #E08A8A; --bad-soft: rgba(224, 138, 138, 0.10);
    --vitrin: #16293C; --vitrin-text: #E9EDF2; --vitrin-muted: #A7AEB5;
    --shadow-card: 0 1px 2px rgba(0, 0, 0, 0.30), 0 10px 30px -24px rgba(0, 0, 0, 0.90);
    --odak: 0 0 0 3px rgba(201, 138, 91, 0.45);
  }
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0; background: var(--page); color: var(--text);
  font: 400 var(--fs-base)/1.6 var(--font);
  text-rendering: optimizeLegibility;
}
b, strong, th, h1, h2, h3 { font-weight: 600; }
a { color: var(--accent); text-underline-offset: 3px; }
a:focus-visible, .btn:focus-visible { outline: none; box-shadow: var(--odak); border-radius: var(--r-sm); }
@media (forced-colors: active) { a:focus-visible, .btn:focus-visible { outline: 2px solid; } }

.atla { position: absolute; left: var(--sp-4); top: -60px; z-index: 10; padding: var(--sp-2) var(--sp-4);
  background: var(--card); border-radius: var(--r-sm); }
.atla:focus { top: var(--sp-2); }

/* ---- ust cubuk ---- */
.ust { position: sticky; top: 0; z-index: 5; background: var(--page);
  border-bottom: 1px solid var(--line); }
.ust-ic { max-width: var(--icerik-w); margin: 0 auto; padding: 0 var(--sp-6);
  min-height: 64px; display: flex; align-items: center; gap: var(--sp-6); }
.marka { display: inline-flex; align-items: center; gap: var(--sp-2); color: var(--text);
  text-decoration: none; font-weight: 600; font-size: var(--fs-md); min-height: 44px; }
.marka-glif { width: 26px; height: 26px; color: var(--accent); flex: none; }
.gez { display: flex; gap: var(--sp-1); margin-left: auto; }
.gez a { color: var(--muted); text-decoration: none; padding: 0 var(--sp-3); border-radius: var(--r-sm);
  min-height: var(--ctrl-h); display: inline-flex; align-items: center; font-size: var(--fs-sm); font-weight: 500; }
.gez a:hover { color: var(--text); background: var(--accent-soft); }
.gez a[aria-current="page"] { color: var(--text); box-shadow: inset 0 -2px 0 var(--accent); border-radius: 0; }

.btn { display: inline-flex; align-items: center; justify-content: center; gap: var(--sp-2);
  min-height: var(--ctrl-h); padding: 0 var(--sp-5); border-radius: var(--r-md);
  border: 1px solid var(--btn-line); background: var(--card); color: var(--text);
  font: 500 var(--fs-sm)/1 var(--font); text-decoration: none; white-space: nowrap; }
.btn:hover { background: var(--card2); }
.btn-birincil { background: var(--accent); border-color: var(--accent); color: var(--ink-ters); font-weight: 600; }
.btn-birincil:hover { background: var(--accent); filter: brightness(1.06); }
.btn-buyuk { min-height: var(--ctrl-h-lg); padding: 0 var(--sp-8); font-size: var(--fs-md); border-radius: var(--r-lg); }

/* ---- sayfa ---- */
.sayfa { max-width: var(--icerik-w); margin: 0 auto; padding: var(--sp-6) var(--sp-6) var(--sp-10); }
.kirinti ol { list-style: none; display: flex; flex-wrap: wrap; gap: var(--sp-1) var(--sp-2);
  margin: 0 0 var(--sp-6); padding: 0; font-size: var(--fs-sm); color: var(--muted); }
.kirinti li + li::before { content: '/'; margin-right: var(--sp-2); color: var(--btn-line); }
.kirinti a { color: var(--muted); }

.bas { margin-bottom: var(--sp-8); }
.kas { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-2); margin: 0 0 var(--sp-3); }
.kas-bolum { font-size: var(--fs-xs); font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.hap { display: inline-flex; align-items: center; min-height: 24px; padding: 0 var(--sp-2);
  border-radius: var(--r-full); font-size: var(--fs-xs); font-weight: 600;
  background: var(--accent-soft); color: var(--accent); }
.hap-a1 { background: var(--ok-soft); color: var(--ok); }
h1 { font-size: clamp(var(--fs-xl), 3.2vw, var(--fs-2xl)); line-height: 1.2; letter-spacing: -.015em;
  font-weight: 500; margin: 0 0 var(--sp-3); }
.h1-alt { display: block; font-size: var(--fs-md); font-weight: 400; color: var(--muted); letter-spacing: 0; margin-top: var(--sp-1); }
.giris { font-size: var(--fs-md); color: var(--muted); margin: 0; }
.ingilizce-ad { color: var(--muted); font-style: italic; }

.iki-sutun { display: flex; flex-wrap: wrap; gap: var(--sp-6); align-items: flex-start; }
.okuma { flex: 1 1 560px; min-width: 0; display: flex; flex-direction: column; gap: var(--sp-5); }
.yan { flex: 1 1 280px; max-width: 100%; display: flex; flex-direction: column; gap: var(--sp-5); }
@media (min-width: 941px) { .yan { flex: 0 0 320px; position: sticky; top: 88px; } }

.kart { background: var(--card); border: 1px solid var(--line-kart); border-radius: var(--r-lg);
  box-shadow: var(--shadow-card); padding: var(--sp-6); }
.kart.sessiz { background: transparent; box-shadow: none; }
.kart > h2 { font-size: var(--fs-lg); letter-spacing: -.008em; margin: 0 0 var(--sp-3);
  display: flex; align-items: baseline; gap: var(--sp-2); flex-wrap: wrap; }
.kart > :last-child { margin-bottom: 0; }
.kart-not { color: var(--muted); font-size: var(--fs-sm); margin: 0 0 var(--sp-4); }
.sayac { font-size: var(--fs-sm); font-weight: 400; color: var(--muted); }
.kart.ipucu { border-color: var(--accent); background: var(--accent-soft); box-shadow: none; }

.bicim { width: 100%; border-collapse: collapse; }
.bicim th, .bicim td { text-align: left; padding: var(--sp-2) var(--sp-3); border-top: 1px solid var(--line-kart); vertical-align: top; }
.bicim tr:first-child th, .bicim tr:first-child td { border-top: 0; }
.bicim th { width: 1%; white-space: nowrap; color: var(--accent); }
.maddeler, .ornekler { margin: 0; padding-left: var(--sp-5); display: flex; flex-direction: column; gap: var(--sp-2); }
.ornekler li::marker { color: var(--accent); }
.hatalar { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--sp-3); }
.hatalar li { display: flex; flex-direction: column; gap: var(--sp-1); }
.yanlis, .dogru { padding: var(--sp-2) var(--sp-3); border-radius: var(--r-sm); }
.yanlis { background: var(--bad-soft); color: var(--bad); text-decoration: line-through; text-decoration-thickness: 1px; }
.yanlis .isaret { text-decoration: none; display: inline-block; }
.dogru { background: var(--ok-soft); color: var(--ok); }
.isaret { font-weight: 600; }

.bag-liste { list-style: none; margin: 0; padding: 0; }
.bag-liste a { display: flex; align-items: center; min-height: var(--ctrl-h); padding: var(--sp-1) 0;
  border-top: 1px solid var(--line-kart); text-decoration: none; color: var(--text); }
.bag-liste li:first-child a { border-top: 0; }
.bag-liste a:hover { color: var(--accent); }

/* ---- kart listesi (merkez sayfalar) — flex, grid auto-fill DEGIL ---- */
.bolum { margin-bottom: var(--sp-8); }
.bolum > h2 { font-size: var(--fs-lg); margin: 0 0 var(--sp-4); }
.kartlar { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--sp-4); }
.kartlar > li { flex: 1 1 260px; display: flex; }
.kart-bag { flex: 1; display: flex; flex-direction: column; gap: var(--sp-2); padding: var(--sp-5);
  background: var(--card); border: 1px solid var(--line-kart); border-radius: var(--r-lg);
  box-shadow: var(--shadow-card); color: var(--text); text-decoration: none;
  transition: border-color 150ms cubic-bezier(.22, 1, .36, 1); }
.kart-bag:hover { border-color: var(--accent); }
.kart-bag b { font-size: var(--fs-md); }
.kart-ust { display: flex; gap: var(--sp-2); align-items: center; min-height: 24px; }
.kart-alt { color: var(--muted); font-size: var(--fs-sm); margin-top: auto; }

/* ---- diyalog ---- */
.diyalog { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--sp-3); }
.replik { display: flex; flex-direction: column; gap: 2px; max-width: 86%; padding: var(--sp-3) var(--sp-4);
  border-radius: var(--r-lg); background: var(--card2); }
.replik.sen { align-self: flex-end; background: var(--accent-soft); }
.kim { font-size: var(--fs-xs); font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.replik .en { font-weight: 500; }
.tr { color: var(--muted); font-size: var(--fs-sm); }

.cift, .fiil { width: 100%; border-collapse: collapse; }
.cift th, .cift td, .fiil th, .fiil td { text-align: left; padding: var(--sp-2) var(--sp-3);
  border-top: 1px solid var(--line-kart); vertical-align: top; }
.cift thead th, .fiil thead th { border-top: 0; font-size: var(--fs-xs); letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.fiil tbody tr:nth-child(even) { background: var(--card2); }
.fiil caption { text-align: left; color: var(--muted); font-size: var(--fs-sm); padding-bottom: var(--sp-3); }
.tablo-kap { overflow-x: auto; }

/* ---- sozluk ---- */
.sozluk { margin: 0; display: flex; flex-direction: column; }
.madde { padding: var(--sp-4) 0; border-top: 1px solid var(--line-kart); }
.madde:first-child { border-top: 0; padding-top: 0; }
.madde dt { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--sp-1) var(--sp-2); }
.madde dt b { font-size: var(--fs-md); }
.ipa { color: var(--muted); font-size: var(--fs-sm); }
.oku { color: var(--accent); font-size: var(--fs-sm); }
.tur { font-size: var(--fs-xs); color: var(--muted); border: 1px solid var(--line); border-radius: var(--r-full); padding: 0 var(--sp-2); }
.madde dd { margin: var(--sp-1) 0 0; }
.anlam { font-weight: 500; }
.ornek-cift { list-style: none; margin: var(--sp-2) 0 0; padding: 0 0 0 var(--sp-3); border-left: 2px solid var(--line);
  display: flex; flex-direction: column; gap: var(--sp-2); }
.ornek-cift li { display: flex; flex-direction: column; }

/* ---- yasal ---- */
.yasal h2 { font-size: var(--fs-lg); margin: var(--sp-8) 0 var(--sp-3); }
.yasal h2:first-child { margin-top: 0; }
.yasal ul { padding-left: var(--sp-5); display: flex; flex-direction: column; gap: var(--sp-2); }
.yasal .cift { margin: var(--sp-3) 0; font-size: var(--fs-sm); }

/* ---- lacivert vitrin: sayfanin tek eylemi ---- */
.vitrin { margin-top: var(--sp-10); background: var(--vitrin); color: var(--vitrin-text);
  border-radius: var(--r-lg); padding: var(--sp-8); display: flex; flex-wrap: wrap;
  align-items: center; justify-content: space-between; gap: var(--sp-6); }
.vitrin > div { flex: 1 1 420px; }
.vitrin h2 { margin: 0 0 var(--sp-2); font-size: var(--fs-xl); font-weight: 500; letter-spacing: -.015em; }
.vitrin p { margin: 0; color: var(--vitrin-muted); }
.vitrin .btn-birincil { background: #C98A5B; border-color: #C98A5B; color: #0F1C2B; }

/* ---- alt ---- */
.alt { border-top: 1px solid var(--line); margin-top: var(--sp-10); }
.alt-ic { max-width: var(--icerik-w); margin: 0 auto; padding: var(--sp-8) var(--sp-6) var(--sp-4);
  display: flex; flex-wrap: wrap; gap: var(--sp-8); }
.alt-marka { flex: 2 1 280px; }
.alt-marka p { color: var(--muted); font-size: var(--fs-sm); margin: var(--sp-2) 0 0; max-width: 46ch; }
.alt nav { flex: 1 1 160px; display: flex; flex-direction: column; }
.alt nav b { font-size: var(--fs-xs); letter-spacing: .14em; text-transform: uppercase; color: var(--muted); margin-bottom: var(--sp-2); }
.alt nav a { color: var(--text); text-decoration: none; min-height: 40px; display: flex; align-items: center; font-size: var(--fs-sm); }
.alt nav a:hover { color: var(--accent); }
.alt-not { max-width: var(--icerik-w); margin: 0 auto; padding: var(--sp-4) var(--sp-6) var(--sp-8);
  color: var(--muted); font-size: var(--fs-xs); }

/* ---- telefon (uygulamayla ayni kirilim: 940) ---- */
@media (max-width: 940px) {
  /* Gezinme GIZLENMEZ, ikinci satira iner: merkez sayfalara giden tek
     yol alt kisma kalirsa hem kullanici hem tarayici onu gec bulur. */
  .ust-ic { flex-wrap: wrap; gap: 0 var(--sp-4); }
  .ust-cta { margin-left: auto; }
  .gez { order: 3; flex: 1 1 100%; margin: 0 calc(-1 * var(--sp-3)); overflow-x: auto;
    scrollbar-width: none; }
  .gez::-webkit-scrollbar { display: none; }
  .gez a { flex: none; }
  .ust-ic, .sayfa { padding-left: var(--sp-4); padding-right: var(--sp-4); }
  .kart { padding: var(--sp-5); }
  .replik { max-width: 94%; }
  .vitrin { padding: var(--sp-6); }
  .vitrin .btn-buyuk { width: 100%; }
}

@media (prefers-reduced-motion: reduce) { * { transition-duration: 1ms !important; } }
