@charset "UTF-8";
/* ==========================================================================
   Panorama E-Ofis — tasarim sistemi
   --------------------------------------------------------------------------
   Marka yonu: logodaki krem/siyah serif monogram ve moodboard paletinden
   (sicak greige, bakir, celik mavisi) turetilmis "butik kurumsal" dil.
   Referans hissi: iyi tasarlanmis bir hukuk burosu / uye kulubu kirtasiyesi.

   Yapi
     01  Fontlar
     02  Token'lar (renk, tipografi, olcu, katman)
     03  Sifirlama ve temel
     04  Tipografi olcegi
     05  Duzen (kapsayici, izgara, bolum)
     06  Dekoratif ogeler (yay, ince cizgi, filigran)
     07  Bilesenler
     08  Ust bar, baslik, gezinme, dil secici
     09  Alt bilgi
     10  Formlar
     11  Yardimci siniflar
     12  Hareket, erisilebilirlik, RTL, yazdirma

   Not: tum yon bagimli ozellikler mantiksal (logical) ozelliklerle yazilir
   (margin-inline, inset-inline, border-inline-start ...) — boylece Arapca
   sayfalarda dir="rtl" ek stil dosyasi gerektirmeden calisir.
   ========================================================================== */

/* ---------------------------------------------------------------- 01 Fontlar
   Inter ve Fraunces SIL OFL 1.1 altindadir; lisans metinleri
   /assets/fonts/OFL-*.txt icinde, atif /LISANSLAR.md dosyasindadir.
   Kiril ayri dosyadadir: unicode-range sayesinde Turkce/Ingilizce
   ziyaretciler o dosyayi hic indirmez.                                       */
@font-face {
  font-family: "Inter";
  src: url("../fonts/inter-latin.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0100-017F, U+0300-0303, U+0308, U+0327, U+0328,
    U+02BC, U+02C6, U+02DC, U+2000-206F, U+20AC, U+20BA, U+00A9, U+00AE,
    U+2122, U+2190-2193, U+25A0-25CF, U+2713, U+2714;
}
@font-face {
  font-family: "Inter";
  src: url("../fonts/inter-kiril.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0400-045F, U+0490-0491, U+2116;
}
@font-face {
  font-family: "Fraunces";
  src: url("../fonts/fraunces.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Fraunces";
  src: url("../fonts/fraunces-italic.woff2") format("woff2");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}
/* Arapca. unicode-range yalnizca Arap alfabesini kapsar; Turkce/Ingilizce/
   Rusca ziyaretciler bu dosyayi hic indirmez. Latin karakterler (telefon,
   "WhatsApp", "No: 23" gibi) /ar/ sayfalarinda da Inter'den gelir. */
@font-face {
  font-family: "Noto Sans Arabic";
  src: url("../fonts/noto-arabic.woff2") format("woff2");
  font-weight: 300 700;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0600-06FF;
}

/* -------------------------------------------------------------- 02 Token'lar */
:root {
  /* Renk — kontrast oranlari test/test_erisilebilirlik.py icinde dogrulanir */
  --ink: #141110;          /* sicak siyah: ana metin, koyu bolumler */
  --ink-2: #221d1a;        /* koyu zeminde yukseltilmis yuzey */
  --ink-3: #352d28;        /* koyu zeminde ince cizgi */
  --paper: #fbf8f3;        /* sayfa zemini */
  --paper-2: #f3ede3;      /* donusumlu bolum / kart zemini */
  --paper-3: #e8dfd1;      /* ayirici, kenarlik */
  --paper-4: #d4c7b3;      /* guclu kenarlik */
  --cream: #f0ede4;        /* koyu zeminde metin (logo kremi) */
  --cream-dim: #b9b0a2;    /* koyu zeminde ikincil metin */
  --copper: #a25e28;       /* acik zeminde vurgu  (4.8:1) */
  --copper-deep: #7e4718;  /* acik zeminde vurgu metni (7.1:1) */
  --copper-lt: #c98b4b;    /* koyu zeminde vurgu (6.6:1) */
  --steel: #2f4c63;        /* ikincil vurgu */
  --uyari-zemin: #f8f2e6;  /* not kutusu zemini — kagidin bir kademe sicagi */

  /* Yazi aileleri
     "Noto Sans Arabic" yiginda BILEREK yer aliyor: dil secici menusunde
     Arapca secenek kendi alfabesiyle ("العربية") yaziliyor ve bu, Turkce/
     Ingilizce/Rusca sayfalarda da goruntuleniyor. Yiginda olmasaydi Arapca
     glifler sistem fontuna duser, her cihazda farkli gorunurdu.
     Indirme maliyeti yok: @font-face'in unicode-range'i sayesinde dosya
     yalnizca gercekten Arapca glif cizilmesi gerektiginde indirilir
     (menu kapaliyken hic indirilmez). */
  --yazi-baslik: "Fraunces", "Noto Sans Arabic", Georgia, "Times New Roman", serif;
  --yazi-govde: "Inter", "Noto Sans Arabic", system-ui, -apple-system,
    "Segoe UI", Roboto, sans-serif;

  /* Olcu */
  --kapsayici: 74rem;      /* 1184px */
  --kapsayici-dar: 46rem;
  --olcu: 68ch;            /* okunabilir satir uzunlugu */
  /* Form ve iletisim listesi AYNI olcuyu paylasir; iki blok alt alta
     geldiginde genislikleri orantili gorunsun. */
  --olcu-form: 38rem;
  --bosluk-yan: clamp(1.25rem, 4vw, 2.5rem);
  --bolum-y: clamp(4rem, 8.5vw, 7.5rem);
  --yuvarlak: 2px;         /* marka dili keskin; yalnizca hafif yumusatma */
  --yuvarlak-lg: 4px;

  /* Katman */
  --z-baslik: 100;
  --z-ortu: 200;

  /* Gecis */
  --gecis: 220ms cubic-bezier(0.4, 0, 0.2, 1);
  --gecis-yavas: 620ms cubic-bezier(0.16, 1, 0.3, 1);
}

/* Rusca: Fraunces'te Kiril yok — basliklar Inter'e duser.
   Inter baslik olarak kullanilirken daha siki harf araligi ister.           */
html[lang="ru"] {
  --yazi-baslik: "Inter", "Noto Sans Arabic", system-ui, sans-serif;
  --baslik-aralik: -0.022em;
  --baslik-agirlik: 560;
}

/* Arapca: Inter'de de Fraunces'te de Arap alfabesi yok. Gomulu Noto Sans
   Arabic (SIL OFL 1.1) kullanilir; boylece Arapca metin her isletim
   sisteminde ayni gorunur. Sistem fontlari yalnizca yedek olarak listelenir.
   Arapca'da harf araligi (letter-spacing) harfleri KOPARIR — bu yuzden
   baslik araligi sifirlanir.                                                */
html[lang="ar"] {
  --yazi-baslik: "Noto Sans Arabic", "Segoe UI", Tahoma, "Geeza Pro", sans-serif;
  --yazi-govde: "Noto Sans Arabic", "Segoe UI", Tahoma, "Geeza Pro", sans-serif;
  --baslik-aralik: 0;
  --baslik-agirlik: 600;
}

/* --------------------------------------------------- 03 Sifirlama ve temel */
*,
*::before,
*::after { box-sizing: border-box; }

html {
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
  scroll-padding-block-start: 6rem;   /* sabit baslik ic baglantiyi kesmesin */
}

body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--yazi-govde);
  font-size: 1.0625rem;               /* 17px */
  font-weight: 400;
  line-height: 1.72;
  font-feature-settings: "kern" 1, "liga" 1, "calt" 1;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

img,
svg,
video { display: block; max-width: 100%; }

img { height: auto; }

a { color: inherit; }

button,
input,
select,
textarea { font: inherit; color: inherit; }

ul,
ol { margin: 0; padding: 0; }

figure,
blockquote { margin: 0; }

/* Tarayicilar <address> ogesini varsayilan olarak italik cizer; kurumsal
   adres bloklarinda bu istenmiyor. */
address { font-style: normal; }

hr {
  height: 1px;
  margin-block: var(--bolum-y);
  border: 0;
  background: var(--paper-3);
}

::selection {
  background: var(--copper);
  color: #fff;
}

:focus-visible {
  outline: 2px solid var(--copper);
  outline-offset: 3px;
  border-radius: 1px;
}
.ink-alan :focus-visible { outline-color: var(--copper-lt); }

/* ------------------------------------------------------- 04 Tipografi olcegi */
h1, h2, h3, h4, h5 {
  margin: 0;
  font-family: var(--yazi-baslik);
  font-weight: var(--baslik-agirlik, 380);
  letter-spacing: var(--baslik-aralik, -0.014em);
  line-height: 1.14;
  text-wrap: balance;
}

/* Fraunces'in varsayilan agirligi 900 oldugu icin agirlik her zaman acikca
   yazilir; aksi halde tum basliklar siyah gorunur.                          */
.d1 {
  font-size: clamp(2.5rem, 6vw, 4.5rem);
  font-weight: var(--baslik-agirlik, 340);
  line-height: 1.03;
  letter-spacing: var(--baslik-aralik, -0.026em);
}
.d2 {
  font-size: clamp(1.95rem, 3.6vw, 2.95rem);
  font-weight: var(--baslik-agirlik, 360);
  line-height: 1.1;
  letter-spacing: var(--baslik-aralik, -0.02em);
}
.d3 {
  font-size: clamp(1.4rem, 2.2vw, 1.9rem);
  font-weight: var(--baslik-agirlik, 400);
  line-height: 1.22;
}
.d4 {
  font-size: clamp(1.14rem, 1.5vw, 1.32rem);
  font-weight: var(--baslik-agirlik, 460);
  line-height: 1.3;
  letter-spacing: -0.008em;
}

/* Ustbaslik etiketi — kucuk, harf araligi genis, bakir */
.etiket {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  margin: 0 0 1.15rem;
  color: var(--copper-deep);
  font-family: var(--yazi-govde);
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.19em;
  line-height: 1.4;
  text-transform: uppercase;
}
.etiket::before {
  content: "";
  flex: none;
  inline-size: 1.75rem;
  block-size: 1px;
  background: currentColor;
}
.ink-alan .etiket { color: var(--copper-lt); }

.giris {
  max-inline-size: var(--olcu);
  color: #453c36;
  font-size: clamp(1.075rem, 1.4vw, 1.24rem);
  line-height: 1.62;
}
.ink-alan .giris { color: var(--cream-dim); }

p { margin: 0 0 1.15em; }
p:last-child { margin-bottom: 0; }

strong { font-weight: 600; }

small {
  font-size: 0.875rem;
  line-height: 1.6;
}

/* Metin gövdesi (yasal sayfalar, rehber icerigi) */
.metin { max-inline-size: var(--olcu); }
.metin > * + * { margin-block-start: 1.15em; }
.metin h2 {
  margin-block-start: 2.6em;
  font-size: clamp(1.5rem, 2.2vw, 1.9rem);
  font-weight: 400;
}
.metin h3 {
  margin-block-start: 2em;
  font-size: clamp(1.15rem, 1.5vw, 1.3rem);
  font-weight: 500;
}
.metin h2:first-child,
.metin h3:first-child { margin-block-start: 0; }
.metin ul,
.metin ol {
  padding-inline-start: 1.35rem;
  list-style-position: outside;
}
.metin ul { list-style-type: none; }
.metin ul > li { position: relative; }
.metin ul > li::before {
  content: "";
  position: absolute;
  inset-inline-start: -1.1rem;
  inset-block-start: 0.72em;
  inline-size: 5px;
  block-size: 1px;
  background: var(--copper);
}
.metin ol > li { padding-inline-start: 0.3rem; }
.metin li + li { margin-block-start: 0.5em; }
.metin a {
  color: var(--copper-deep);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.22em;
  transition: color var(--gecis);
}
.metin a:hover { color: var(--ink); }
.metin dt { font-weight: 600; }
.metin dd { margin-inline-start: 0; margin-block-end: 1em; }

/* ------------------------------------------------------------- 05 Duzen */
.kapsayici {
  inline-size: 100%;
  max-inline-size: var(--kapsayici);
  margin-inline: auto;
  padding-inline: var(--bosluk-yan);
}
.kapsayici--dar { max-inline-size: var(--kapsayici-dar); }

.bolum {
  position: relative;
  padding-block: var(--bolum-y);
  /* Dekoratif ogeler (.yay, .filigran) bilerek bolum sinirinin disina
     tasar. Kirpma olmadan bu tasma sayfanin kaydirma genisligini buyutup
     yatay kaydirma yaratiyor. "clip" tercih edildi: "hidden" gibi yeni bir
     kaydirma kabi olusturmaz, yalnizca kirpar. */
  overflow: clip;
}
@supports not (overflow: clip) {
  .bolum { overflow: hidden; }
}
.bolum--sik { padding-block: clamp(2.75rem, 5vw, 4.5rem); }
.bolum--greige { background: var(--paper-2); }
.bolum--ink {
  background: var(--ink);
  color: var(--cream);
}
.bolum--cizgili { border-block-start: 1px solid var(--paper-3); }

/* Koyu zeminli her kap bu sinifi alir; ic bilesenler renklerini buna gore
   ayarlar (tek bir yerden yonetim).                                          */
.ink-alan { color: var(--cream); }
.ink-alan h1,
.ink-alan h2,
.ink-alan h3 { color: var(--cream); }

.bolum-basligi { margin-block-end: clamp(2.25rem, 4vw, 3.5rem); }
.bolum-basligi--orta {
  margin-inline: auto;
  text-align: center;
}
.bolum-basligi--orta .etiket { justify-content: center; }
.bolum-basligi--orta .giris { margin-inline: auto; }

/* Iki kolonlu asimetrik blok */
.ikili {
  display: grid;
  gap: clamp(2rem, 5vw, 4.5rem);
  align-items: center;
}
@media (min-width: 62rem) {
  .ikili { grid-template-columns: 1.05fr 0.95fr; }
  .ikili--genis-sol { grid-template-columns: 1.25fr 0.75fr; }
  .ikili--genis-sag { grid-template-columns: 0.75fr 1.25fr; }
  .ikili--ust { align-items: start; }
  .ikili__once { order: -1; }
}

.izgara {
  display: grid;
  gap: clamp(1.1rem, 2vw, 1.6rem);
}
.izgara--2 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 19rem), 1fr)); }
.izgara--3 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 15.5rem), 1fr)); }
.izgara--4 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 12.5rem), 1fr)); }

/* SABIT kolonlu izgaralar.
   auto-fit, kap genisligine gore kolon sayisini kendi secer; oge sayisi buna
   bolunmedigunde son satirda tek basina "oksuz" bir kart kaliyordu (4 oge ->
   3+1, 6 oge -> 4+2). Oge sayisi bilinen bolumlerde kolon sayisi acikca
   verilir ki dizilim her zaman dengeli olsun. */
.izgara--s2,
.izgara--s3 { grid-template-columns: 1fr; }
@media (min-width: 42rem) {
  .izgara--s2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .izgara--s3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 60rem) {
  .izgara--s3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* ------------------------------------------- 06 Dekoratif ogeler */
/* Logodaki dairesel yay motifinin yankisi. Salt dekoratif; ekran
   okuyuculardan aria-hidden ile saklanir.                                    */
.yay {
  position: absolute;
  z-index: 0;
  pointer-events: none;
  border: 1px solid var(--paper-4);
  border-radius: 50%;
  opacity: 0.5;
}
.ink-alan .yay {
  border-color: var(--ink-3);
  opacity: 1;
}
.yay--kesik {
  border-color: transparent;
  border-block-start-color: var(--copper);
  opacity: 0.45;
}

/* Buyuk monogram filigrani (koyu bolumlerde) */
.filigran {
  position: absolute;
  z-index: 0;
  inline-size: min(38rem, 70%);
  opacity: 0.045;
  pointer-events: none;
  inset-inline-end: -6rem;
  inset-block-end: -8rem;
}

/* Ince ust cizgi + kucuk numara: editoryal "icindekiler" hissi */
.sira {
  display: block;
  margin-block-end: 0.9rem;
  color: var(--copper);
  font-family: var(--yazi-baslik);
  font-size: 0.98rem;
  font-weight: 500;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.06em;
}
.ink-alan .sira { color: var(--copper-lt); }

/* ------------------------------------------------------- 07 Bilesenler */

/* --- Dugmeler --- */
.dugme {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.6rem;
  min-block-size: 2.95rem;
  padding: 0.72rem 1.6rem;
  border: 1px solid transparent;
  border-radius: var(--yuvarlak);
  font-family: var(--yazi-govde);
  font-size: 0.945rem;
  font-weight: 550;
  letter-spacing: 0.005em;
  line-height: 1.3;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  transition: background var(--gecis), color var(--gecis),
    border-color var(--gecis), transform var(--gecis);
}
.dugme:active { transform: translateY(1px); }
.dugme svg { flex: none; }

.dugme--birincil {
  background: var(--ink);
  border-color: var(--ink);
  color: var(--cream);
}
.dugme--birincil:hover {
  background: var(--copper-deep);
  border-color: var(--copper-deep);
}

.dugme--ikincil {
  background: transparent;
  border-color: var(--paper-4);
  color: var(--ink);
}
.dugme--ikincil:hover {
  background: var(--ink);
  border-color: var(--ink);
  color: var(--cream);
}

/* Koyu zemin uzerinde */
.ink-alan .dugme--birincil {
  background: var(--cream);
  border-color: var(--cream);
  color: var(--ink);
}
.ink-alan .dugme--birincil:hover {
  background: var(--copper-lt);
  border-color: var(--copper-lt);
  color: var(--ink);
}
.ink-alan .dugme--ikincil {
  border-color: var(--ink-3);
  color: var(--cream);
}
.ink-alan .dugme--ikincil:hover {
  background: var(--cream);
  border-color: var(--cream);
  color: var(--ink);
}

.dugme--tam { inline-size: 100%; }

/* Metin baglantisi + ok */
.ok-bag {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: var(--copper-deep);
  font-size: 0.93rem;
  font-weight: 550;
  text-decoration: none;
  transition: gap var(--gecis), color var(--gecis);
}
.ok-bag:hover { gap: 0.85rem; color: var(--ink); }
.ok-bag svg { transition: transform var(--gecis); }
.ink-alan .ok-bag { color: var(--copper-lt); }
.ink-alan .ok-bag:hover { color: var(--cream); }
/* RTL'de ok yon degistirir */
[dir="rtl"] .ok-bag svg { transform: scaleX(-1); }

.dugme-grubu {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-block-start: 2rem;
}

/* --- Kart --- */
.kart {
  position: relative;
  display: flex;
  flex-direction: column;
  padding: clamp(1.5rem, 2.4vw, 2.1rem);
  background: var(--paper);
  border: 1px solid var(--paper-3);
  border-radius: var(--yuvarlak-lg);
  transition: border-color var(--gecis), transform var(--gecis-yavas),
    box-shadow var(--gecis);
}
.bolum--greige .kart { background: #fdfbf7; }
.kart__baslik { margin-block-end: 0.7rem; }
.kart__metin {
  margin: 0;
  color: #4d443d;
  font-size: 0.975rem;
  line-height: 1.66;
}
.kart__alt { margin-block-start: auto; padding-block-start: 1.4rem; }

a.kart { text-decoration: none; }
a.kart:hover {
  border-color: var(--paper-4);
  transform: translateY(-2px);
  box-shadow: 0 14px 34px -22px rgb(20 17 16 / 0.3);
}
a.kart:hover .ok-bag { gap: 0.85rem; color: var(--ink); }

.ink-alan .kart {
  background: var(--ink-2);
  border-color: var(--ink-3);
}
.ink-alan .kart__metin { color: var(--cream-dim); }
.ink-alan a.kart:hover { border-color: #4a3f38; }

/* --- Editoryal numarali liste (hizmetler) --- */
.dizin { list-style: none; }
.dizin__oge { border-block-start: 1px solid var(--paper-3); }
.dizin__oge:last-child { border-block-end: 1px solid var(--paper-3); }
.dizin__bag {
  display: grid;
  gap: 0.35rem 1.75rem;
  align-items: baseline;
  padding-block: clamp(1.5rem, 2.6vw, 2.15rem);
  text-decoration: none;
  transition: padding-inline var(--gecis), background var(--gecis);
}
@media (min-width: 48rem) {
  .dizin__bag {
    grid-template-columns: 3.5rem minmax(0, 15rem) minmax(0, 1fr) auto;
  }
}
.dizin__bag:hover { padding-inline-start: 0.85rem; background: var(--paper-2); }
.dizin__no {
  color: var(--copper);
  font-family: var(--yazi-baslik);
  font-size: 0.95rem;
  font-weight: 500;
  font-variant-numeric: tabular-nums;
}
.dizin__ad {
  font-family: var(--yazi-baslik);
  font-size: clamp(1.25rem, 1.9vw, 1.6rem);
  font-weight: 400;
  line-height: 1.2;
}
.dizin__aciklama {
  margin: 0;
  color: #4d443d;
  font-size: 0.97rem;
  line-height: 1.6;
}
.dizin__ok {
  align-self: center;
  color: var(--copper-deep);
}
[dir="rtl"] .dizin__ok svg { transform: scaleX(-1); }

/* --- Guven olculeri (rakamsiz, dogrulanabilir) --- */
.guven {
  display: grid;
  gap: 0;
  border-block: 1px solid var(--ink-3);
}
@media (min-width: 48rem) {
  .guven { grid-template-columns: repeat(3, 1fr); }
  .guven__oge + .guven__oge { border-inline-start: 1px solid var(--ink-3); }
}
.guven__oge {
  padding: clamp(1.6rem, 3vw, 2.5rem) clamp(1.25rem, 2.5vw, 2.25rem);
}
@media (max-width: 47.99rem) {
  .guven__oge + .guven__oge { border-block-start: 1px solid var(--ink-3); }
}
.guven__ust {
  display: block;
  margin-block-end: 0.6rem;
  color: var(--copper-lt);
  font-family: var(--yazi-baslik);
  font-size: clamp(1.5rem, 2.4vw, 2rem);
  font-weight: 380;
  line-height: 1.15;
}
.guven__alt {
  margin: 0;
  color: var(--cream-dim);
  font-size: 0.945rem;
  line-height: 1.6;
}

/* --- Surec adimlari --- */
.adimlar {
  display: grid;
  gap: clamp(1.75rem, 3vw, 2.5rem);
  counter-reset: adim;
  list-style: none;
}
@media (min-width: 52rem) {
  .adimlar { grid-template-columns: repeat(3, 1fr); }
}
.adim { counter-increment: adim; }
.adim__no {
  display: flex;
  align-items: center;
  gap: 0.9rem;
  margin-block-end: 1.05rem;
  color: var(--copper-deep);
  font-family: var(--yazi-baslik);
  font-size: 1.05rem;
  font-weight: 500;
  font-variant-numeric: tabular-nums;
}
.adim__no::after {
  content: "";
  flex: 1;
  block-size: 1px;
  background: var(--paper-3);
}
.adim__baslik { margin-block-end: 0.55rem; }
.adim__metin {
  margin: 0;
  color: #4d443d;
  font-size: 0.975rem;
  line-height: 1.66;
}

/* --- Paket karti (fiyat yerine kapsam) --- */
.paket {
  display: flex;
  flex-direction: column;
  padding: clamp(1.6rem, 2.6vw, 2.3rem);
  background: var(--paper);
  border: 1px solid var(--paper-3);
  border-radius: var(--yuvarlak-lg);
}
.paket--one-cikan {
  background: var(--ink);
  border-color: var(--ink);
  color: var(--cream);
}
.paket__ad {
  margin-block-end: 0.5rem;
  font-family: var(--yazi-baslik);
  font-size: clamp(1.3rem, 1.9vw, 1.55rem);
  font-weight: 420;
}
.paket__kim {
  margin: 0 0 1.5rem;
  color: #574d45;
  font-size: 0.93rem;
  line-height: 1.6;
}
.paket--one-cikan .paket__kim { color: var(--cream-dim); }
.paket__liste {
  margin: 0 0 1.75rem;
  padding: 1.4rem 0 0;
  border-block-start: 1px solid var(--paper-3);
  list-style: none;
  font-size: 0.955rem;
}
.paket--one-cikan .paket__liste { border-block-start-color: var(--ink-3); }
.paket__liste li {
  display: flex;
  gap: 0.7rem;
  align-items: flex-start;
  line-height: 1.55;
}
.paket__liste li + li { margin-block-start: 0.72rem; }
/* Onay isareti: KARE bir kutu esit kollu bir "V" uretiyor ve tik gibi
   okunmuyordu. Dikdortgen kutu (kisa taban + uzun yan) 45 derece
   dondurulunce gercek bir tik olusur. Kenarlar fiziksel verilir ki RTL'de
   sekil bozulmasin — onay isareti yon bagimsizdir. */
.paket__liste li::before {
  content: "";
  flex: none;
  inline-size: 0.34rem;
  block-size: 0.62rem;
  margin-block-start: 0.28em;
  border-bottom: 1.2px solid var(--copper);
  border-right: 1.2px solid var(--copper);
  rotate: 45deg;
}
.paket--one-cikan .paket__liste li::before {
  border-color: var(--copper-lt);
}
.paket__liste li[data-yok] { color: #8c8177; }
.paket__liste li[data-yok]::before {
  border: 0;
  block-size: 1px;
  inline-size: 0.6rem;
  margin-block-start: 0.72em;
  background: currentColor;
  rotate: none;
}
.paket__alt { margin-block-start: auto; }

/* --- Karsilastirma tablosu --- */
.tablo-sarmal {
  overflow-x: auto;
  margin-block-start: 2rem;
  border: 1px solid var(--paper-3);
  border-radius: var(--yuvarlak-lg);
}
.tablo {
  inline-size: 100%;
  border-collapse: collapse;
  font-size: 0.94rem;
  text-align: start;
}
.tablo caption {
  padding: 1rem 1.15rem;
  color: #574d45;
  font-size: 0.875rem;
  text-align: start;
  border-block-end: 1px solid var(--paper-3);
}
.tablo th,
.tablo td {
  padding: 0.85rem 1.15rem;
  border-block-start: 1px solid var(--paper-3);
  text-align: start;
  vertical-align: top;
}
.tablo thead th {
  border-block-start: 0;
  background: var(--paper-2);
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  white-space: nowrap;
}
.tablo tbody th {
  font-weight: 500;
  min-inline-size: 12rem;
}
.tablo td[data-var] { color: var(--copper-deep); font-weight: 550; }
.tablo td[data-yok] { color: #8c8177; }

/* --- Akordeon (SSS) — native details/summary, ek JS gerekmez --- */
.sss { border-block-start: 1px solid var(--paper-3); }
.sss__oge { border-block-end: 1px solid var(--paper-3); }
.sss__soru {
  display: flex;
  align-items: flex-start;
  gap: 1rem;
  padding-block: 1.4rem;
  font-family: var(--yazi-baslik);
  font-size: clamp(1.05rem, 1.5vw, 1.22rem);
  font-weight: 440;
  line-height: 1.35;
  cursor: pointer;
  list-style: none;
  transition: color var(--gecis);
}
.sss__soru::-webkit-details-marker { display: none; }
.sss__soru:hover { color: var(--copper-deep); }
/* Konum (margin-inline-start:auto) mantiksal kalir — ok satirin SONUNA
   yerlesir, RTL'de sola gecer. Ancak kenarlar FIZIKSEL olmali: ok her iki
   yonde de ASAGI bakmali. Mantiksal kenarlarla RTL'de sola bakiyordu. */
.sss__soru::after {
  content: "";
  flex: none;
  inline-size: 0.72rem;
  block-size: 0.72rem;
  margin-block-start: 0.42em;
  margin-inline-start: auto;
  border-bottom: 1.5px solid currentColor;
  border-right: 1.5px solid currentColor;
  rotate: 45deg;
  transition: rotate var(--gecis);
}
.sss__oge[open] .sss__soru::after { rotate: 225deg; }
.sss__cevap {
  max-inline-size: var(--olcu);
  padding-block-end: 1.65rem;
  color: #4d443d;
  font-size: 0.99rem;
}
.sss__cevap > *:first-child { margin-block-start: 0; }

/* --- Alinti --- */
.alinti {
  max-inline-size: 40rem;
  padding-inline-start: clamp(1.25rem, 3vw, 2.25rem);
  border-inline-start: 1px solid var(--copper);
  font-family: var(--yazi-baslik);
  font-size: clamp(1.3rem, 2.2vw, 1.75rem);
  font-style: italic;
  font-weight: 400;
  line-height: 1.42;
}
.alinti__kim {
  display: block;
  margin-block-start: 1.25rem;
  color: var(--copper-deep);
  font-family: var(--yazi-govde);
  font-size: 0.82rem;
  font-style: normal;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}
.ink-alan .alinti__kim { color: var(--copper-lt); }

/* --- Bilgi notu ---
   Onceki surum jenerik bir "sari uyari kutusu"ydu ve sayfanin geri kalaniyla
   ayni dili konusmuyordu. Yeni surum sitenin kendi kalibini kullanir:
   ustte kisa bakir cizgi + harf aralikli kucuk baslik (.etiket ile ayni
   ritim), altinda metin; zemin kagit tonunun bir kademe sicagi. */
.not {
  position: relative;
  padding: clamp(1.4rem, 2.4vw, 1.85rem) clamp(1.35rem, 2.4vw, 1.9rem);
  background: var(--uyari-zemin);
  border: 1px solid var(--paper-3);
  border-radius: var(--yuvarlak-lg);
  font-size: 0.955rem;
  line-height: 1.68;
}
/* Ust kenardaki kisa bakir vurgu — kartlarla ayni kirtasiye detayi */
.not::before {
  content: "";
  position: absolute;
  inset-block-start: -1px;
  inset-inline-start: clamp(1.35rem, 2.4vw, 1.9rem);
  inline-size: 2.25rem;
  block-size: 2px;
  background: var(--copper);
}
.not__baslik {
  display: flex;
  align-items: baseline;
  gap: 0.6rem;
  margin-block-end: 0.7rem;
  color: var(--copper-deep);
  font-family: var(--yazi-govde);
  font-size: 0.73rem;
  font-weight: 600;
  letter-spacing: 0.17em;
  line-height: 1.4;
  text-transform: uppercase;
}
.not p { margin-block-end: 0.8em; }
.not p:last-child { margin-block-end: 0; }
.not > .metin { max-inline-size: none; }
.not .metin ul { margin-block: 0; }

/* Notr varyant: bilgi degil, yalnizca yan bilgi kutusu */
.not--notr {
  background: var(--paper-2);
  border-color: var(--paper-4);
}
.not--notr::before { background: var(--paper-4); }
.not--notr .not__baslik { color: #5c5249; }

/* Koyu bolumler icinde */
.ink-alan .not {
  background: var(--ink-2);
  border-color: var(--ink-3);
  color: var(--cream-dim);
}
.ink-alan .not__baslik { color: var(--copper-lt); }
[dir="rtl"] .not__baslik { letter-spacing: 0; }

/* --- Gorsel cerceve --- */
.gorsel {
  position: relative;
  overflow: hidden;
  border-radius: var(--yuvarlak-lg);
  background: var(--paper-2);
}
.gorsel img {
  inline-size: 100%;
  block-size: 100%;
  object-fit: cover;
}
.gorsel--4x5 { aspect-ratio: 4 / 5; }
.gorsel--2x3 { aspect-ratio: 2 / 3; }
.gorsel--kare { aspect-ratio: 1 / 1; }

/* Gorseli dogal cozunurlugunun cok uzerine buyutmemek icin ust sinir. */
.gorsel--orta { max-inline-size: 28rem; }    /* ~448 px */

/* NOT: Fotografin uzerinden gecen dekoratif bakir cizgi KALDIRILDI.
   Amaci kirtasiye hissi vermekti ama fotografin uzerinde amacsiz bir cizik
   gibi gorunuyordu. .gorsel--cizgili sinifi HTML'den de temizlendi. */

.gorsel-alt {
  margin-block-start: 0.85rem;
  color: #6b6058;
  font-size: 0.82rem;
  letter-spacing: 0.01em;
  line-height: 1.5;
}
.ink-alan .gorsel-alt { color: var(--cream-dim); }

/* --- Kirinti (breadcrumb) --- */
.kirinti {
  padding-block: 1.35rem;
  border-block-end: 1px solid var(--paper-3);
  font-size: 0.83rem;
}
.kirinti ol {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
  list-style: none;
}
.kirinti li { display: flex; gap: 0.5rem; align-items: center; }
/* Kirinti ayiricisi okuma yonunde bakmalidir: LTR'de saga, RTL'de sola.
   Kenarlar fiziksel, yon degisimi yalnizca rotate ile yapilir — boylece
   davranis her iki yonde de ongorulebilir kalir. */
.kirinti li + li::before {
  content: "";
  inline-size: 0.34rem;
  block-size: 0.34rem;
  border-top: 1px solid var(--paper-4);
  border-right: 1px solid var(--paper-4);
  rotate: 45deg;
}
[dir="rtl"] .kirinti li + li::before { rotate: 225deg; }
.kirinti a {
  color: #6b6058;
  text-decoration: none;
}
.kirinti a:hover { color: var(--copper-deep); text-decoration: underline; }
.kirinti [aria-current] { color: var(--ink); font-weight: 550; }

/* --- Iletisim satirlari --- */
.iletisim-liste { list-style: none; }
.iletisim-liste li + li {
  margin-block-start: 1.15rem;
  padding-block-start: 1.15rem;
  border-block-start: 1px solid var(--paper-3);
}

/* Iletisim sayfasi varyanti: DUSEY liste, formla AYNI olcude.
   Yatay dort kolonlu deneme, kalemler farkli uzunlukta oldugu icin
   dengesiz gorunuyordu ve sayfanin editoryal duseyligine aykiriydi.
   Ust ve alt ince cizgi bloga cerceve verir. */
.iletisim-liste--olcu {
  max-inline-size: var(--olcu-form);
  padding-block: 0.35rem;
  border-block: 1px solid var(--paper-3);
}
.iletisim-liste--olcu li { padding-block: 0.95rem; }
.iletisim-liste--olcu li + li { padding-block-start: 0.95rem; }
.ink-alan .iletisim-liste li + li { border-block-start-color: var(--ink-3); }
/* display:block sart: bunlar <span> ogeleri, satir ici kalirlarsa hem
   margin-block-end yok sayilir hem de etiket ile deger ayni satirda
   birlesik gorunur ("TELEFON+90 531 ..."). */
.iletisim-liste dt,
.iletisim-liste__ad {
  display: block;
  margin-block-end: 0.3rem;
  color: #6b6058;
  font-size: 0.74rem;
  font-weight: 600;
  letter-spacing: 0.15em;
  text-transform: uppercase;
}
.ink-alan .iletisim-liste__ad,
.ink-alan .iletisim-liste dt { color: var(--cream-dim); }
.iletisim-liste__deger {
  display: block;
  font-family: var(--yazi-baslik);
  font-size: clamp(1.05rem, 1.5vw, 1.22rem);
  font-weight: 420;
  line-height: 1.4;
}
.iletisim-liste a {
  color: inherit;
  text-decoration: none;
  border-block-end: 1px solid var(--paper-4);
  transition: border-color var(--gecis), color var(--gecis);
}
.iletisim-liste a:hover {
  color: var(--copper-deep);
  border-block-end-color: var(--copper);
}
.ink-alan .iletisim-liste a { border-block-end-color: var(--ink-3); }
.ink-alan .iletisim-liste a:hover {
  color: var(--copper-lt);
  border-block-end-color: var(--copper-lt);
}

/* ------------------------------------ 08 Ust bar, baslik, gezinme */
.atla {
  position: absolute;
  inset-inline-start: 50%;
  inset-block-start: 0;
  z-index: 999;
  padding: 0.7rem 1.25rem;
  background: var(--ink);
  color: var(--cream);
  font-size: 0.9rem;
  text-decoration: none;
  translate: -50% -120%;
  transition: translate var(--gecis);
}
.atla:focus-visible { translate: -50% 0; }

.ust-bar {
  background: var(--ink);
  color: var(--cream-dim);
  font-size: 0.8rem;
}
.ust-bar__ic {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem 1.5rem;
  align-items: center;
  justify-content: space-between;
  min-block-size: 2.6rem;
  padding-block: 0.4rem;
}
/* Adres ve telefon ayni puntoda (0.8rem). Adres onceden --cream-dim
   oldugu icin daha kucuk algilaniyordu; rengi aciklastirilarak iki bilgi
   gorsel olarak ayni agirliga getirildi. */
.ust-bar__yer {
  display: flex;
  gap: 0.55rem;
  align-items: center;
  color: #d6cec2;
  letter-spacing: 0.02em;
}
.ust-bar__baglar {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem 1.35rem;
  align-items: center;
  list-style: none;
}
/* inline-flex sart: temel sifirlamada svg { display: block } oldugu icin,
   duz bir <a> icindeki ikon metni alt satira itiyordu. Flex kabi ikonu ve
   metni ayni satirda tutar; bosluk gap ile verilir. */
.ust-bar a {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  color: var(--cream);
  text-decoration: none;
  transition: color var(--gecis);
}
.ust-bar a:hover { color: var(--copper-lt); }
@media (max-width: 47.99rem) {
  .ust-bar__yer { display: none; }
  .ust-bar__ic { justify-content: center; }
}

.baslik {
  position: sticky;
  inset-block-start: 0;
  z-index: var(--z-baslik);
  background: color-mix(in srgb, var(--paper) 92%, transparent);
  backdrop-filter: blur(10px);
  border-block-end: 1px solid var(--paper-3);
}
@supports not (background: color-mix(in srgb, red 50%, blue)) {
  .baslik { background: var(--paper); }
}
.baslik__ic {
  display: flex;
  gap: 1.5rem;
  align-items: center;
  justify-content: space-between;
  min-block-size: 4.5rem;
}
.marka {
  display: flex;
  flex: none;
  align-items: center;
  text-decoration: none;
}
/* Yatay logo kilidi (~4:1). Dikey kilit bu yukseklikte okunamadigi icin
   baslikta ve alt bilgide yatay surum kullanilir. */
.marka img {
  inline-size: auto;
  block-size: clamp(2.35rem, 3.4vw, 2.85rem);
}

/* Dil secici + mobil dugme, gezinme panelinin disinda kalir: mobilde panel
   tam ekran kayarken bu ikisi baslikta sabit gorunmeye devam eder. */
.baslik__sag {
  display: flex;
  flex: none;
  gap: 0.6rem;
  align-items: center;
}

.gezinme { display: flex; gap: 1.5rem; align-items: center; }
.gezinme__liste {
  display: flex;
  gap: clamp(1rem, 2vw, 1.9rem);
  align-items: center;
  list-style: none;
}
.gezinme__bag {
  display: block;
  padding-block: 0.5rem;
  color: var(--ink);
  font-size: 0.925rem;
  font-weight: 480;
  text-decoration: none;
  white-space: nowrap;
  transition: color var(--gecis);
}
.gezinme__bag:hover { color: var(--copper-deep); }
.gezinme__bag[aria-current] {
  color: var(--copper-deep);
  box-shadow: inset 0 -1px 0 var(--copper);
}

/* Alt menu */
.gezinme__alt-sarmal { position: relative; }
.gezinme__alt {
  position: absolute;
  inset-block-start: calc(100% + 0.5rem);
  inset-inline-start: -1rem;
  z-index: 10;
  min-inline-size: 15.5rem;
  padding: 0.5rem;
  background: var(--paper);
  border: 1px solid var(--paper-3);
  border-radius: var(--yuvarlak-lg);
  box-shadow: 0 20px 44px -26px rgb(20 17 16 / 0.34);
  list-style: none;
  opacity: 0;
  visibility: hidden;
  translate: 0 -0.35rem;
  transition: opacity var(--gecis), translate var(--gecis), visibility var(--gecis);
}
.gezinme__alt-sarmal:hover > .gezinme__alt,
.gezinme__alt-sarmal:focus-within > .gezinme__alt {
  opacity: 1;
  visibility: visible;
  translate: 0 0;
}
.gezinme__alt a {
  display: block;
  padding: 0.6rem 0.85rem;
  border-radius: var(--yuvarlak);
  font-size: 0.9rem;
  text-decoration: none;
  transition: background var(--gecis), color var(--gecis);
}
.gezinme__alt a:hover { background: var(--paper-2); color: var(--copper-deep); }

/* --- Dil secici (bayrakli) --- */
.dil {
  position: relative;
  flex: none;
}
.dil__dugme {
  display: flex;
  gap: 0.5rem;
  align-items: center;
  min-block-size: 2.4rem;
  padding: 0.35rem 0.7rem;
  background: transparent;
  border: 1px solid var(--paper-3);
  border-radius: var(--yuvarlak);
  font-size: 0.83rem;
  font-weight: 550;
  letter-spacing: 0.06em;
  cursor: pointer;
  transition: border-color var(--gecis), background var(--gecis);
}
.dil__dugme:hover { border-color: var(--paper-4); background: var(--paper-2); }
/* Kenarlar fiziksel: ok RTL'de de ASAGI bakmali (mantiksal kenarlarla
   Arapca sayfalarda sola bakiyordu). */
.dil__dugme::after {
  content: "";
  inline-size: 0.4rem;
  block-size: 0.4rem;
  margin-inline-start: 0.1rem;
  border-bottom: 1.4px solid currentColor;
  border-right: 1.4px solid currentColor;
  rotate: 45deg;
  translate: 0 -0.1rem;
  transition: rotate var(--gecis);
}
.dil__dugme[aria-expanded="true"]::after { rotate: 225deg; translate: 0 0.1rem; }
.dil__menu {
  position: absolute;
  inset-block-start: calc(100% + 0.45rem);
  inset-inline-end: 0;
  z-index: 20;
  min-inline-size: 12.5rem;
  padding: 0.4rem;
  background: var(--paper);
  border: 1px solid var(--paper-3);
  border-radius: var(--yuvarlak-lg);
  box-shadow: 0 20px 44px -26px rgb(20 17 16 / 0.34);
  list-style: none;
}
.dil__menu[hidden] { display: none; }
.dil__menu a {
  display: flex;
  gap: 0.7rem;
  align-items: center;
  padding: 0.58rem 0.7rem;
  border-radius: var(--yuvarlak);
  font-size: 0.9rem;
  text-decoration: none;
  transition: background var(--gecis);
}
.dil__menu a:hover { background: var(--paper-2); }
.dil__menu a[aria-current] { font-weight: 600; }
.dil__menu a[aria-current]::after {
  content: "";
  inline-size: 0.42rem;
  block-size: 0.42rem;
  margin-inline-start: auto;
  background: var(--copper);
  border-radius: 50%;
}
.bayrak {
  flex: none;
  inline-size: 1.35rem;
  block-size: 0.95rem;
  border: 1px solid rgb(20 17 16 / 0.14);
  border-radius: 1px;
  object-fit: cover;
}

/* --- Mobil gezinme --- */
.mobil-dugme {
  display: none;
  flex: none;
  align-items: center;
  justify-content: center;
  inline-size: 2.85rem;
  block-size: 2.85rem;
  padding: 0;
  background: transparent;
  border: 1px solid var(--paper-3);
  border-radius: var(--yuvarlak);
  cursor: pointer;
}
.mobil-dugme__cizgi {
  position: relative;
  display: block;
  inline-size: 1.05rem;
  block-size: 1px;
  background: var(--ink);
  transition: background var(--gecis);
}
.mobil-dugme__cizgi::before,
.mobil-dugme__cizgi::after {
  content: "";
  position: absolute;
  inset-inline-start: 0;
  inline-size: 100%;
  block-size: 1px;
  background: var(--ink);
  transition: translate var(--gecis), rotate var(--gecis);
}
.mobil-dugme__cizgi::before { translate: 0 -0.32rem; }
.mobil-dugme__cizgi::after { translate: 0 0.32rem; }
.mobil-dugme[aria-expanded="true"] .mobil-dugme__cizgi { background: transparent; }
.mobil-dugme[aria-expanded="true"] .mobil-dugme__cizgi::before { translate: 0 0; rotate: 45deg; }
.mobil-dugme[aria-expanded="true"] .mobil-dugme__cizgi::after { translate: 0 0; rotate: -45deg; }

@media (max-width: 61.99rem) {
  .mobil-dugme { display: flex; }
  /* Kapali menu ekranin SAGINA otelenmiyor.
     Neden: position:fixed bir oge, body'deki overflow-x:hidden tarafindan
     KIRPILMAZ; translate:100% ile disari itilen panel sayfanin kaydirma
     genisligini iki katina cikariyor ve mobilde yatay tasma yaratiyordu.
     Bunun yerine panel viewport icinde kalir, visibility + opacity ile
     gizlenir ve yalnizca DIKEY olarak hafifce kayar. visibility:hidden ayni
     zamanda kapali menunun sekme sirasina girmesini de engeller. */
  .gezinme {
    position: fixed;
    inset: 0;
    z-index: var(--z-ortu);
    display: block;
    padding: 6.5rem var(--bosluk-yan) 2.5rem;
    background: var(--paper);
    overflow-y: auto;
    visibility: hidden;
    opacity: 0;
    translate: 0 -0.85rem;
    /* visibility ayrik (discrete) bir ozellik oldugu icin sureyle
       gecistirilmez: kapanirken solma bitene KADAR bekletilir (gecikme),
       acilirken ANINDA uygulanir. Sureyle gecis verilirse menu acilirken
       ilk yarim animasyon boyunca gorunmez kaliyordu. */
    transition: opacity var(--gecis), translate var(--gecis),
      visibility 0s var(--gecis);
  }
  .gezinme[data-acik] {
    visibility: visible;
    opacity: 1;
    translate: 0 0;
    transition: opacity var(--gecis), translate var(--gecis), visibility 0s;
  }
  .gezinme__liste {
    display: block;
    border-block-start: 1px solid var(--paper-3);
  }
  .gezinme__liste > li { border-block-end: 1px solid var(--paper-3); }
  .gezinme__bag {
    padding-block: 1.05rem;
    font-family: var(--yazi-baslik);
    font-size: 1.3rem;
    font-weight: 400;
  }
  .gezinme__alt {
    position: static;
    min-inline-size: 0;
    padding: 0 0 1rem;
    border: 0;
    box-shadow: none;
    opacity: 1;
    visibility: visible;
    translate: none;
  }
  .gezinme__alt a {
    padding: 0.5rem 0 0.5rem 1rem;
    border-inline-start: 1px solid var(--paper-3);
    border-radius: 0;
  }
  .gezinme__kapat-alan { display: block; margin-block-start: 2rem; }
  body[data-menu-acik] { overflow: hidden; }
}
@media (min-width: 62rem) {
  .gezinme__kapat-alan { display: none; }
}

/* --- Kahraman (hero) --- */
.kahraman {
  position: relative;
  overflow: hidden;
  padding-block: clamp(3rem, 7vw, 6rem) clamp(3.5rem, 8vw, 6.5rem);
}
.kahraman__ic {
  position: relative;
  z-index: 1;
  display: grid;
  gap: clamp(2.5rem, 5vw, 4rem);
  align-items: center;
}
@media (min-width: 62rem) {
  .kahraman__ic { grid-template-columns: 1.08fr 0.92fr; }
}
.kahraman__baslik { margin-block-end: 1.5rem; }
.kahraman__vurgu {
  display: block;
  color: var(--copper-deep);
  font-style: italic;
  font-weight: 340;
}
.kahraman__gorsel { position: relative; }
.kahraman__gorsel .gorsel { max-inline-size: 30rem; margin-inline: auto; }
.kahraman__yay {
  inline-size: 26rem;
  block-size: 26rem;
  inset-block-start: -9rem;
  inset-inline-end: -9rem;
}
/* Tek kolon: uc madde yan yana sigmadigi icin "2 + 1" seklinde kiriliyor ve
   dengesiz gorunuyordu. Alt alta dizilince hem okunur hem duzenli. */
.kahraman__alt-seritler {
  display: grid;
  gap: 0.6rem;
  margin-block-start: 2.5rem;
  padding-block-start: 1.75rem;
  border-block-start: 1px solid var(--paper-3);
  list-style: none;
  color: #574d45;
  font-size: 0.89rem;
}
.kahraman__alt-seritler li {
  display: flex;
  gap: 0.55rem;
  align-items: center;
}
.kahraman__alt-seritler li::before {
  content: "";
  flex: none;
  inline-size: 0.42rem;
  block-size: 0.42rem;
  border: 1px solid var(--copper);
  rotate: 45deg;
}

/* --- Cagri seridi (CTA) --- */
.cagri {
  position: relative;
  overflow: hidden;
  background: var(--ink);
  color: var(--cream);
}
.cagri__ic {
  position: relative;
  z-index: 1;
  display: grid;
  gap: clamp(1.75rem, 4vw, 3.5rem);
  align-items: center;
  padding-block: clamp(3rem, 6vw, 5rem);
}
@media (min-width: 56rem) {
  .cagri__ic { grid-template-columns: 1fr auto; }
}

/* ------------------------------------------------------- 09 Alt bilgi */
.alt-bilgi {
  background: var(--ink);
  color: var(--cream-dim);
  font-size: 0.9rem;
  /* Ustunde de koyu bir cagri seridi oldugunda ikisi tek bir blok gibi
     goruluyordu; ince cizgi yapiyi ayirir. */
  border-block-start: 1px solid var(--ink-3);
}
.alt-bilgi__ust {
  display: grid;
  gap: clamp(2.25rem, 4vw, 3.5rem);
  padding-block: clamp(3rem, 6vw, 4.5rem);
}
@media (min-width: 52rem) {
  .alt-bilgi__ust { grid-template-columns: 1.4fr repeat(3, 1fr); }
}
.alt-bilgi__marka img {
  inline-size: auto;
  block-size: 3.1rem;
  margin-block-end: 1.5rem;
}
.alt-bilgi__ozet {
  max-inline-size: 24rem;
  line-height: 1.68;
}
/* Sosyal hesaplar */
.alt-bilgi__sosyal {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem 1.4rem;
  margin-block-start: 1.6rem;
  padding-block-start: 1.4rem;
  border-block-start: 1px solid var(--ink-3);
  list-style: none;
}
.alt-bilgi__sosyal a {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.875rem;
}
.alt-bilgi__sosyal a:hover { color: var(--copper-lt); }

.alt-bilgi__grup-baslik {
  margin-block-end: 1.1rem;
  color: var(--cream);
  font-family: var(--yazi-govde);
  font-size: 0.74rem;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}
.alt-bilgi ul { list-style: none; }
.alt-bilgi li + li { margin-block-start: 0.7rem; }
.alt-bilgi a {
  color: var(--cream-dim);
  text-decoration: none;
  transition: color var(--gecis);
}
.alt-bilgi a:hover { color: var(--copper-lt); }
.alt-bilgi__alt {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem 2rem;
  align-items: center;
  justify-content: space-between;
  padding-block: 1.6rem;
  border-block-start: 1px solid var(--ink-3);
  font-size: 0.82rem;
}
/* Kunye adres satiri, alt bilgideki telefon (~16.8px) yaninda 12.5px'te
   ince yazi gibi duruyordu. Punto 0.9rem'e (14.4px) cikarildi ve renk
   okunurluk icin aciklastirildi — telefonla ayni degil ama orantili. */
.alt-bilgi__kunye {
  max-inline-size: 46rem;
  color: #a39a8f;
  font-size: 0.9rem;
  line-height: 1.7;
}
.alt-bilgi__kunye dl {
  display: flex;
  flex-wrap: wrap;
  gap: 0.2rem 1.4rem;
  margin: 0;
}
.alt-bilgi__kunye div { display: flex; gap: 0.4rem; }
.alt-bilgi__kunye dt { font-weight: 500; }
.alt-bilgi__kunye dd { margin: 0; }

/* ---------------------------------------------------------- 10 Formlar */
.form { max-inline-size: var(--olcu-form); }
.form__satir {
  display: grid;
  gap: 1.15rem;
}
@media (min-width: 40rem) {
  .form__satir--2 { grid-template-columns: 1fr 1fr; }
}
.alan { margin-block-end: 1.15rem; }
.alan__etiket {
  display: block;
  margin-block-end: 0.4rem;
  font-size: 0.86rem;
  font-weight: 550;
}
.alan__gerekli {
  color: var(--copper-deep);
  font-weight: 400;
}
/* "(isteğe bağlı)" — zorunlu alan isaretinden ayirt edilsin diye notr renk */
.alan__ipucu-satir {
  color: #6b6058;
  font-weight: 400;
}
.alan__ipucu {
  display: block;
  margin-block-start: 0.35rem;
  color: #6b6058;
  font-size: 0.8rem;
  line-height: 1.5;
}
.girdi,
.secim,
.metin-alani {
  inline-size: 100%;
  min-block-size: 2.95rem;
  padding: 0.7rem 0.9rem;
  background: #fff;
  border: 1px solid var(--paper-4);
  border-radius: var(--yuvarlak);
  font-size: 0.975rem;
  transition: border-color var(--gecis), box-shadow var(--gecis);
}
.metin-alani {
  min-block-size: 8.5rem;
  line-height: 1.6;
  resize: vertical;
}
.girdi:hover,
.secim:hover,
.metin-alani:hover { border-color: #b9a98f; }
.girdi:focus,
.secim:focus,
.metin-alani:focus {
  outline: 0;
  border-color: var(--copper);
  box-shadow: 0 0 0 3px rgb(162 94 40 / 0.14);
}
.girdi[aria-invalid="true"],
.metin-alani[aria-invalid="true"] { border-color: #a3312a; }
.secim {
  appearance: none;
  padding-inline-end: 2.4rem;
  background-image: linear-gradient(45deg, transparent 50%, var(--ink) 50%),
    linear-gradient(135deg, var(--ink) 50%, transparent 50%);
  background-position: right 1.05rem center, right 0.75rem center;
  background-size: 0.32rem 0.32rem, 0.32rem 0.32rem;
  background-repeat: no-repeat;
}
[dir="rtl"] .secim {
  padding-inline-end: 0.9rem;
  padding-inline-start: 2.4rem;
  background-position: left 0.75rem center, left 1.05rem center;
}

.onay {
  display: flex;
  gap: 0.75rem;
  align-items: flex-start;
  margin-block-end: 1.4rem;
  font-size: 0.9rem;
  line-height: 1.6;
}
.onay input[type="checkbox"] {
  flex: none;
  inline-size: 1.15rem;
  block-size: 1.15rem;
  margin: 0.28em 0 0;
  accent-color: var(--copper);
}
.onay a { color: var(--copper-deep); }

/* Bal kupu: gercek kullanicidan tamamen gizli, botlar doldurur.
   display:none yerine gorsel gizleme kullanilir cunku bazi botlar
   display:none alanlari atlar.                                              */
.bal-kupu {
  position: absolute !important;
  inline-size: 1px;
  block-size: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

.form-sonuc {
  margin-block-end: 1.5rem;
  padding: 1rem 1.15rem;
  border: 1px solid;
  border-radius: var(--yuvarlak);
  font-size: 0.94rem;
}
.form-sonuc--basarili {
  background: #f1f6f0;
  border-color: #b9cfb4;
}
.form-sonuc--hata {
  background: #fdf2f1;
  border-color: #e2b7b3;
}
.form-sonuc ul {
  margin-block-start: 0.5rem;
  padding-inline-start: 1.15rem;
  list-style: disc;
}

/* ------------------------------------------------- 11 Yardimci siniflar */
.gizli-gorsel {
  position: absolute !important;
  inline-size: 1px;
  block-size: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}
.orta { text-align: center; }
.olcu { max-inline-size: var(--olcu); }
.olcu-orta { max-inline-size: var(--olcu); margin-inline: auto; }
.ust-bosluk { margin-block-start: clamp(2rem, 4vw, 3.25rem); }
.ust-bosluk-sm { margin-block-start: 1.5rem; }
.alt-bosluk { margin-block-end: clamp(2rem, 4vw, 3.25rem); }
.sabit-oran { font-variant-numeric: tabular-nums; }
.kesme { white-space: nowrap; }

/* --------------------------- 12 Hareket, erisilebilirlik, RTL, yazdirma */
/* Kaydirmayla belirme. .js sinifi <head>'deki kucuk betikle eklenir; betik
   calismazsa icerik zaten gorunur kalir (JS'siz erisim garanti).            */
.js .belir {
  opacity: 0;
  translate: 0 1.15rem;
  transition: opacity var(--gecis-yavas), translate var(--gecis-yavas);
}
.js .belir.gorunur {
  opacity: 1;
  translate: 0 0;
}
/* Ilk ekranda zaten gorunen ogeler: gecis yok, aninda tam gorunur.
   site.js bu sinifi sayfa acilisinda ekler. */
.js .belir--anisiz {
  transition: none;
}
.js .belir--gecikme-1 { transition-delay: 90ms; }
.js .belir--gecikme-2 { transition-delay: 180ms; }
.js .belir--gecikme-3 { transition-delay: 270ms; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *,
  *::before,
  *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
  }
  .js .belir {
    opacity: 1;
    translate: none;
  }
}

@media (prefers-contrast: more) {
  :root {
    --paper-3: #b8ab97;
    --paper-4: #8d8069;
    --cream-dim: #ded6c9;
  }
  .kart__metin,
  .adim__metin,
  .dizin__aciklama,
  .sss__cevap { color: #322b26; }
}

/* Arapca'da EGIK YAZI KULLANILMAZ.
   Noto Sans Arabic'in italik kesimi yoktur; font-style:italic verildiginde
   tarayici harfleri yapay olarak yatirir (synthetic oblique) ve bu Arap
   yazisinda hatali bir goruntu uretir. Vurgu, egim yerine renk ve agirlikla
   verilir. */
html[lang="ar"] .kahraman__vurgu,
html[lang="ar"] .alinti,
html[lang="ar"] em,
html[lang="ar"] .paket__liste em {
  font-style: normal;
}
html[lang="ar"] .kahraman__vurgu { font-weight: 700; }
html[lang="ar"] em { font-weight: 600; }

/* RTL: yalnizca mantiksal ozelliklerle cozulemeyen birkac durum */
[dir="rtl"] .etiket { letter-spacing: 0; }
[dir="rtl"] .alt-bilgi__grup-baslik,
[dir="rtl"] .iletisim-liste__ad,
[dir="rtl"] .tablo thead th,
[dir="rtl"] .alinti__kim { letter-spacing: 0; }
[dir="rtl"] .filigran { scale: -1 1; }

@media print {
  .ust-bar,
  .baslik,
  .cagri,
  .mobil-dugme,
  .dil,
  .atla { display: none !important; }
  body {
    background: #fff;
    color: #000;
    font-size: 11pt;
  }
  .bolum { padding-block: 1.25rem; }
  .bolum--ink,
  .cagri,
  .alt-bilgi {
    background: #fff !important;
    color: #000 !important;
  }
  a { text-decoration: underline; }
  .metin a::after { content: " (" attr(href) ")"; font-size: 0.85em; }
  .sss__oge { break-inside: avoid; }
}