/* cezeri bilişim · jazari soft · stil (17 ekim 2026).. sanat yönetimi "an": bugün üstte (gri, ince), yarın altta (siyah, bir adım ileride)..
   onaylı ön izleme: cezeri-kimlik/onizleme (ön izleme 2).. 17 ekim 2026 kullanıcı: başlıklar bold değil, normal (unbounded 300; 400 kesimi gözle kalın okunuyor, ölçüldü); alt bilgide logo ve söz rahat..
   renk: kireç zemin ~%60, is siyahı ~%30, ara gri bugün katmanı, akkor yalnız an işareti, kapı şeridi ve çalışan adım (~%2).. mavi yok.. */
@font-face { font-family: "cz-baslik"; src: url("/f/unbounded.woff2") format("woff2"); font-weight: 200 900; font-display: swap; }
@font-face { font-family: "cz-metin"; src: url("/f/onest.woff2") format("woff2"); font-weight: 100 900; font-display: swap; }
@font-face { font-family: "cz-mono"; src: url("/f/dm-mono-300.woff2") format("woff2"); font-weight: 300 400; font-display: swap; }
@font-face { font-family: "cz-mono"; src: url("/f/dm-mono-500.woff2") format("woff2"); font-weight: 500; font-display: swap; }

:root {
  --is: #111111; --kirec: #f1f0ec; --beyaz: #ffffff; --gri: #8c8a83; --gri-koyu: #5e5c56; --cizgi: #d9d7d0; --akkor: #ff5b1f; --vurgu: #ff5b1f;
  --akkor-yazi: #e04a12; --akkor-etiket: #c03e0e; /* açık zeminde turuncu yazı: büyük başlık 3,6:1, 14 px etiket 4,7:1 (17 ekim 2026) */
  --baslik: "cz-baslik", sans-serif; --metin: "cz-metin", sans-serif; --mono: "cz-mono", monospace;
  --kay: 11%;            /* logodaki dilim kayması: "yarın" bir adım ileride */
  --ic: 1280px; --kenar: clamp(20px, 4vw, 48px);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 120px; }
body { margin: 0; background: var(--kirec); color: var(--is); font: 400 18px/1.6 var(--metin); -webkit-font-smoothing: antialiased; }
a { color: inherit; }
img, svg { display: block; max-width: 100%; }
button { font: inherit; color: inherit; }
.ic { width: min(100% - 2 * var(--kenar), var(--ic)); margin: 0 auto; }
.etiket { font: 500 14px/1.4 var(--mono); letter-spacing: .08em; text-transform: uppercase; color: var(--gri-koyu); }
h1, h2, h3 { font-family: var(--baslik); font-weight: 300; margin: 0; letter-spacing: -.02em; }
h2 { font-size: clamp(30px, 3.6vw, 52px); line-height: 1.06; }
h3 { font-size: 22px; line-height: 1.2; letter-spacing: -.01em; }
p { margin: 0; }
:focus-visible { outline: 2px solid var(--akkor); outline-offset: 3px; }
.atla { position: absolute; left: -999px; }
.atla:focus { left: 16px; top: 16px; z-index: 30; background: var(--beyaz); padding: 8px 14px; }
.gizli { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* "an" çizgisi: bütün sitede bugün ile yarını ayıran ince çizgi; sol ucunda akkor işaret */
.an { position: relative; display: block; height: 0; border-top: 1px solid var(--is); }
.an::before { content: ""; position: absolute; left: calc(-1 * var(--kenar) + 6px); top: -3px; width: calc(var(--kenar) - 14px); max-width: 34px; height: 5px; background: var(--akkor); }
.an span { position: absolute; right: 0; bottom: 8px; font: 400 14px/1 var(--mono); letter-spacing: 0; color: var(--gri-koyu); }

/* düğmeler: kapı (siyah, solda akkor şerit), ikincil (eşit genişlikli, altı çizili) */
.kapi { display: inline-flex; align-items: center; gap: 12px; min-height: 48px; padding: 0 20px 0 0; background: var(--is); color: var(--beyaz); font: 500 16px/1 var(--metin); text-decoration: none; border: 0; cursor: pointer; }
.kapi::before { content: ""; width: 10px; align-self: stretch; background: var(--akkor); margin-right: 8px; }
.kapi:hover { background: #2a2a2a; }
.kapi:disabled { opacity: .55; cursor: default; }
.ikincil { font: 400 15px/1 var(--mono); text-decoration: none; border-bottom: 1px solid var(--is); padding: 10px 0 6px; }

/* üst bölüm (yapışkan, kireç zemin) */
.ust { position: sticky; top: 0; z-index: 20; background: var(--kirec); border-bottom: 1px solid var(--cizgi); }
.ust .ic { display: flex; align-items: center; gap: 32px; min-height: 100px; }
/* alt alta logo: iki dilde sözcük aynı boyda; jazari'nin j kuyruğu payı kadar uzun */
.ust .logo { display: block; flex-shrink: 0; padding: 10px 0; }
.ust .logo img { height: 70px; width: auto; }
html[lang="en"] .ust .logo img { height: 79px; }
.menu { display: flex; gap: 28px; margin-left: auto; font: 500 16px/1 var(--metin); }
.menu a { text-decoration: none; padding: 14px 0; }
.menu a:hover { text-decoration: underline; text-underline-offset: 6px; }
.menu .menu-kapat, .menu-ac { display: none; }
.ust-arac { display: flex; align-items: center; gap: 14px; }
.ara-simge { display: inline-grid; place-items: center; width: 40px; height: 44px; color: var(--is); }
.ara-simge svg { width: 20px; height: 20px; }
.dil-sec { display: flex; align-items: center; gap: 2px; font: 400 15px/1 var(--mono); text-transform: uppercase; }
.dil-sec a { display: inline-grid; place-items: center; min-width: 28px; min-height: 44px; text-decoration: none; color: var(--gri-koyu); }
.dil-sec a[aria-current] { color: var(--is); font-weight: 500; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 6px; }
.dil-sec span { color: var(--gri); }

/* 1 · kapı: slogan iki zamana bölünür */
.giris { padding: clamp(56px, 8vw, 112px) 0 clamp(48px, 6vw, 88px); }
.giris .etiket { margin-bottom: clamp(28px, 3vw, 44px); }
.giris h1 { font-size: clamp(44px, 8.2vw, 110px); line-height: .95; }
html[lang="en"] .giris h1 { font-size: clamp(40px, 7.3vw, 100px); } /* "Before Tomorrow…" türkçesinden uzun: her yarı tek satırda kalsın */
.giris h1 .bugun { display: block; font-weight: 200; color: var(--gri); padding-bottom: clamp(14px, 1.6vw, 22px); }
.giris h1 .yarin { display: block; font-weight: 300; color: var(--akkor-yazi); padding-top: clamp(12px, 1.4vw, 20px); margin-left: var(--kay); transition: margin-left .42s cubic-bezier(.2, .7, .1, 1); }
.giris.bekle h1 .yarin { margin-left: 0; }
.giris-alt { display: flex; flex-wrap: wrap; align-items: center; gap: 22px 36px; margin: clamp(36px, 4vw, 56px) 0 0 var(--kay); }
.giris-alt p { font: 400 clamp(19px, 1.6vw, 22px)/1.4 var(--metin); }

/* 2 · oyun bandı (fijitaliz oyunu; grup standardı: manşetin hemen altı) */
.oyun { background: var(--is); color: var(--beyaz); }
.oyun .ic { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 40px clamp(56px, 8vw, 128px); align-items: center; padding: 40px 0; }
.oyun-kod { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 40px; align-items: center; }
.oyun h2 { font-size: clamp(24px, 2.4vw, 34px); margin-top: 8px; }
.oyun .etiket { color: #a8a69f; }
.oyun-metin p { color: #c9c7c0; margin-top: 10px; max-width: 560px; }
.oyun-metin .ok { color: var(--beyaz); font: 400 15px/1 var(--mono); text-decoration: underline; text-underline-offset: 5px; margin-left: 6px; }
.oyun .dugme { display: inline-flex; align-items: center; min-height: 48px; padding: 0 20px; margin-top: 14px; background: var(--beyaz); color: var(--is); font: 500 16px/1 var(--metin); text-decoration: none; border-left: 10px solid var(--akkor); }
.telefon { width: 156px; aspect-ratio: 9 / 18.5; border: 2px solid #3a3a3a; border-radius: 26px; display: grid; align-content: center; gap: 6px; padding: 16px 12px; font: 400 14px/1.3 var(--mono); color: #c9c7c0; }
.telefon .sayac { color: var(--akkor); }
.telefon b { font: 300 15px/1.25 var(--baslik); color: var(--beyaz); margin-bottom: 4px; }
.telefon span:not(.sayac) { border: 1px solid #3a3a3a; padding: 5px 7px; }
.oyun .kod { display: grid; justify-items: center; gap: 8px; }
.oyun .kod img { width: 132px; height: 132px; background: var(--beyaz); padding: 6px; }
.oyun .kod small { font: 400 14px/1.3 var(--mono); color: #a8a69f; }

/* bölüm iskeleti: başlık üstte, an çizgisi, içerik bir adım ileride */
.bolum { padding: clamp(72px, 8vw, 120px) 0 0; }
.bolum > .ic > header { display: grid; gap: 14px; margin-bottom: clamp(28px, 3vw, 40px); }
.bolum > .ic > header p { max-width: 680px; color: var(--gri-koyu); }
/* numaralı bölüm başlıkları turuncu (17 ekim 2026, kullanıcı: "sitenin tek düze görüntüsünü biraz hareketlendirmiş olsak") */
.bolum > .ic > header .etiket, .akis-sol .etiket { color: var(--akkor-etiket); }
.bolum > .ic > header h2, .akis-sol h2 { color: var(--akkor-yazi); }

/* 3 · hangi işler hâlâ elle */
.secimler { display: flex; flex-wrap: wrap; gap: 10px; margin: 30px 0 0 var(--kay); }
.secimler button, .secilen button { min-height: 48px; padding: 0 18px; border: 1px solid var(--is); background: transparent; font: 500 16px/1 var(--metin); cursor: pointer; display: inline-flex; align-items: center; gap: 10px; }
.secimler button::before, .secilen button::before { content: ""; width: 10px; height: 10px; border: 1px solid currentColor; }
.secimler button[aria-pressed="true"] { background: var(--is); color: var(--beyaz); }
.secimler button[aria-pressed="true"]::before, .secilen button[aria-pressed="true"]::before { background: var(--akkor); border-color: var(--akkor); }
.farklar { display: grid; gap: 34px; margin-top: 44px; }
.fark-blok[hidden], .fark-bos[hidden] { display: none; }
.fark-blok h3 { font: 500 14px/1.4 var(--mono); letter-spacing: .08em; text-transform: uppercase; color: var(--gri-koyu); margin-bottom: 14px; }
.fark-blok .once { font: 200 clamp(22px, 2.1vw, 30px)/1.25 var(--baslik); color: var(--gri); padding-bottom: 16px; text-decoration: line-through; text-decoration-thickness: 1px; }
.fark-blok .sonra { font: 300 clamp(22px, 2.1vw, 30px)/1.25 var(--baslik); padding-top: 16px; margin-left: var(--kay); }
.fark-blok .alan { margin: 12px 0 0 var(--kay); font: 400 14px/1.4 var(--mono); color: var(--gri-koyu); }
.fark-bos { margin-left: var(--kay); color: var(--gri-koyu); }

/* 4 · dört alan: ne yapar / nerede durur */
.alanlar { border-top: 1px solid var(--is); }
.alan-satir { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1.4fr) minmax(0, 1.2fr); gap: 32px; padding: 28px 0; border-bottom: 1px solid var(--cizgi); }
.alan-satir h3 { font-size: clamp(22px, 2vw, 28px); }
.alan-satir h3 small { display: block; font: 400 14px/1.4 var(--mono); color: var(--gri-koyu); letter-spacing: 0; margin-top: 6px; }
.alan-satir .sinir { color: var(--gri-koyu); font: 400 16px/1.55 var(--metin); padding-left: 18px; border-left: 1px solid var(--cizgi); }
.alan-satir .sinir b { display: block; font: 500 14px/1.4 var(--mono); letter-spacing: .06em; text-transform: uppercase; color: var(--is); margin-bottom: 4px; }

/* 5 · örnek akış ve dört adım */
.akis { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); gap: 48px; align-items: start; }
.akis-sol h2 { margin-top: 14px; }
.akis-sol > p { color: var(--gri-koyu); margin-top: 14px; }
.akis-sol .kapi { margin-top: 26px; }
.akis-not { margin-top: 12px; font: 400 14px/1.4 var(--mono); color: var(--gri-koyu); }
.kayit { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--is); background: var(--beyaz); }
.kayit li { display: grid; grid-template-columns: 92px 150px minmax(0, 1fr); gap: 16px; padding: 16px 18px; border-bottom: 1px solid var(--cizgi); font: 400 15px/1.5 var(--mono); color: #8f8d86; transition: color .2s, background .2s; }
.kayit li b { font-weight: 500; }
.kayit li.calisti { color: var(--is); }
.kayit li.calisti .zaman::before { content: "■ "; color: var(--akkor); }
.kayit li.bekliyor { background: #fff4ee; color: var(--is); }
.onay { display: none; gap: 10px; grid-column: 3; margin-top: 8px; }
.kayit li.bekliyor .onay { display: flex; }
.onay button { min-height: 44px; padding: 0 16px; font: 500 15px/1 var(--metin); cursor: pointer; border: 1px solid var(--is); background: var(--beyaz); }
.onay button.evet { background: var(--is); color: var(--beyaz); }
.adimlar { margin-top: clamp(48px, 5vw, 72px); }
.adimlar h3 { font-size: clamp(22px, 2vw, 28px); }
.adimlar ol { list-style: none; margin: 22px 0 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid var(--is); }
.adimlar li { padding: 18px 20px 4px 0; display: grid; gap: 8px; align-content: start; }
.adimlar li + li { padding-left: 20px; border-left: 1px solid var(--cizgi); }
.adimlar li span { font: 400 14px/1 var(--mono); color: var(--akkor); }
.adimlar li b { font: 300 19px/1.25 var(--baslik); }
.adimlar li p { font-size: 16px; line-height: 1.55; color: var(--gri-koyu); }

/* 6 · çözüm aileleri */
.aile { border-top: 1px solid var(--is); }
.aile-satir { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.6fr) auto; gap: 28px; align-items: baseline; padding: 22px 0; border-bottom: 1px solid var(--cizgi); }
.aile-satir h3 { font-weight: 200; }
.aile-satir h3 b { font-weight: 300; }
.durum { font: 400 14px/1 var(--mono); padding: 7px 10px; border: 1px dashed var(--gri); color: var(--gri-koyu); white-space: nowrap; }

/* 7 · sektörler */
.sektorler { display: grid; grid-template-columns: 1fr 1fr; gap: 0; border-top: 1px solid var(--is); }
.sektor { padding: 26px 32px 26px 0; }
.sektor + .sektor { padding-left: 32px; border-left: 1px solid var(--cizgi); }
.sektor .once { color: var(--gri); text-decoration: line-through; text-decoration-thickness: 1px; margin: 14px 0 10px; }
.sektor .sonra { font-weight: 500; }
.sonra-diger { margin-top: 22px; color: var(--gri-koyu); font: 400 15px/1.6 var(--mono); }

/* 8 · birlikte (uğurböceği karakteri yazıya dönük, kelime işareti ve tanımlayıcıyla birlikte) */
.birlikte { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.birlik { background: var(--beyaz); padding: 30px; display: grid; gap: 18px; align-content: start; }
.birlik .logolar { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 18px; min-height: 64px; }
.birlik .arti { font: 200 28px/1 var(--baslik); color: var(--gri); }
.birlik .cz { height: 30px; width: auto; }
.ub-kilit { display: flex; align-items: center; gap: 8px; }
.ub-kilit img:first-child { width: 30px; height: auto; }
.ub-kilit img:last-child { width: 140px; height: auto; }
.birlik .acy { width: 120px; height: auto; }

/* 9 · ilk işler */
.isler { list-style: none; margin: 0 0 0 var(--kay); padding: 0; border-top: 1px solid var(--is); }
.isler li { display: grid; grid-template-columns: 48px minmax(0, 1fr); gap: 18px; padding: 16px 0; border-bottom: 1px solid var(--cizgi); }
.isler li span { font: 400 15px/1.6 var(--mono); color: var(--akkor); }

/* tavsiye (paylaşma kancası, iskelet/paylas.mjs) */
.cz-paylas { width: min(100% - 2 * var(--kenar), 680px); margin: 0 auto; padding: clamp(56px, 6vw, 88px) 0 clamp(32px, 4vw, 48px); display: grid; justify-items: center; gap: 16px; text-align: center; }
.cz-paylas[hidden] { display: none; }
.paylas-baslik { font: 300 clamp(22px, 2.2vw, 30px)/1.2 var(--baslik); color: var(--akkor-yazi); }
.paylas-govde { display: inline-grid; gap: 10px; width: fit-content; max-width: 100%; }
.paylas-dugmeler { display: grid; grid-template-columns: auto auto; gap: 8px; }
.paylas-dugmeler button { min-height: 44px; padding: 8px 20px; border: 1px solid var(--is); background: transparent; color: var(--is); font: 500 15px var(--metin); cursor: pointer; white-space: nowrap; }
.paylas-dugmeler .paylas-yerel { background: var(--is); color: var(--beyaz); }
.paylas-simgeler { display: flex; justify-content: space-between; gap: 12px; list-style: none; margin: 0; padding: 0; }
.paylas-simgeler a { position: relative; display: grid; place-items: center; width: 24px; height: 44px; color: var(--gri-koyu); }
.paylas-simgeler a::after { content: ""; position: absolute; inset: 0 -8px; }
.paylas-simgeler a:hover { color: var(--akkor); }
.paylas-not { min-height: 1.4em; font: 400 14px/1.4 var(--mono); color: var(--gri-koyu); }

/* 10 · kapanış ve ön değerlendirme (sitede veri toplanmaz; mesaj ziyaretçinin uygulamasında açılır) */
.kapanis { background: var(--is); color: var(--beyaz); padding: clamp(48px, 6vw, 96px) 0 clamp(64px, 7vw, 104px); }
.kapanis .an { border-top-color: #3a3a3a; }
.kapanis h2 .bugun { display: block; font-weight: 200; color: #8f8d86; padding-bottom: 18px; }
.kapanis h2 .yarin { display: block; padding-top: 18px; margin-left: var(--kay); color: var(--akkor); }
.on-deg { display: grid; grid-template-columns: 1fr 1fr; gap: 16px 20px; margin: 44px 0 0 var(--kay); max-width: 860px; }
.on-deg label { display: grid; gap: 8px; font: 500 15px/1.3 var(--metin); color: #e6e4de; }
.on-deg input { min-height: 50px; padding: 12px 14px; border: 1px solid #4a4a4a; background: #1b1b1b; color: var(--beyaz); font: 400 17px/1.4 var(--metin); }
.on-deg input::placeholder { color: #8f8d86; }
.on-deg .tam { grid-column: 1 / -1; }
.secilen { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.secilen button { min-height: 44px; border-color: #4a4a4a; color: #c9c7c0; font: 400 15px/1 var(--mono); }
.secilen button[aria-pressed="true"] { border-color: var(--beyaz); color: var(--beyaz); }
.od-dugmeler { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 6px; }
.kapi.beyaz { background: var(--beyaz); color: var(--is); }
.kapi.beyaz:hover { background: #e6e4de; }
.cizgili { min-height: 48px; padding: 0 20px; background: transparent; color: var(--beyaz); border: 1px solid #8f8d86; font: 500 16px/1 var(--metin); cursor: pointer; }
.cizgili:hover { border-color: var(--beyaz); }
.od-hata { min-height: 1.4em; color: #ff9a73; font: 400 15px/1.4 var(--metin); }
.form-not { font: 400 14px/1.5 var(--mono); color: #a8a69f; }

/* iç sayfa başı ve yasal metinler */
.sayfa-bas { padding: clamp(48px, 6vw, 88px) 0 clamp(28px, 3vw, 40px); }
.sayfa-bas .iz { margin-bottom: 18px; }
.sayfa-bas .iz a { text-decoration: none; }
.sayfa-bas h1 { font-size: clamp(34px, 5vw, 64px); line-height: 1.04; padding-bottom: 22px; }
.sayfa-bas .ozet { margin: 22px 0 0 var(--kay); max-width: 720px; color: var(--gri-koyu); }
.yasal { display: grid; grid-template-columns: 200px minmax(0, 1fr); gap: 48px; padding-bottom: clamp(56px, 6vw, 96px); }
.yasal-nav ul { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--is); }
.yasal-nav a { display: block; padding: 12px 0; border-bottom: 1px solid var(--cizgi); text-decoration: none; font: 400 15px/1.3 var(--mono); }
.yasal-nav a[aria-current] { color: var(--akkor); }
.yasal-govde { max-width: 760px; }
.yasal-govde h2 { font-size: clamp(22px, 2vw, 28px); margin: 28px 0 10px; }
.yasal-govde h2:first-child { margin-top: 0; }
.yasal-govde h3 { font-size: 19px; margin: 22px 0 8px; }
.yasal-govde p, .yasal-govde li { margin-bottom: 10px; }
.yasal-govde ul { padding-left: 20px; }
.kunye-liste { margin: 0; border-top: 1px solid var(--is); }
.kunye-liste div { display: grid; grid-template-columns: 200px minmax(0, 1fr); gap: 20px; padding: 14px 0; border-bottom: 1px solid var(--cizgi); }
.kunye-liste dt { font: 500 14px/1.6 var(--mono); letter-spacing: .06em; text-transform: uppercase; color: var(--gri-koyu); }
.kunye-liste dd { margin: 0; }
.oyun-alani { padding-bottom: clamp(40px, 5vw, 64px); }
.oyun-cerceve { margin-left: var(--kay); max-width: 720px; background: var(--beyaz); border-top: 1px solid var(--is); } /* oyun kendi boyunu verir (gom.js); boş yer ayrılmaz */
.oyun-alani .akis-not { margin-left: var(--kay); }
.bos-sayfa { display: flex; gap: 24px; align-items: center; padding-bottom: clamp(64px, 8vw, 120px); margin-left: calc(var(--kay) + var(--kenar)); }

/* alt bilgi: logo ve söz kendi satırında, geniş payla; künye ve iletişim alttaki sütunlarda */
.alt { background: var(--is); color: #d9d7d0; border-top: 1px solid #2c2c2c; padding: clamp(56px, 6vw, 88px) 0 28px; }
.alt-kimlik { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 32px clamp(48px, 8vw, 128px); padding-bottom: clamp(40px, 4vw, 56px); border-bottom: 1px solid #2c2c2c; }
.alt-logo img { width: clamp(220px, 20vw, 254px); height: auto; }
.alt .soz { font: 200 clamp(26px, 2.6vw, 36px)/1.2 var(--baslik); color: #a8a69f; letter-spacing: -.01em; }
.alt .soz .bugun, .alt .soz .yarin { display: block; }
.alt .soz .yarin { font-weight: 300; color: var(--akkor); margin-left: 1.6em; }
.alt-pano { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1.1fr) repeat(3, minmax(0, 1fr)); gap: 36px; padding: clamp(36px, 4vw, 48px) 0; border-bottom: 1px solid #2c2c2c; }
.alt h2 { font: 500 14px/1.4 var(--mono); letter-spacing: .08em; text-transform: uppercase; color: var(--akkor); margin-bottom: 14px; }
.alt ul { list-style: none; margin: 0; padding: 0; }
.alt li a { display: flex; gap: 12px; padding: 7px 0; text-decoration: none; font-size: 16px; line-height: 1.4; }
.alt li a span { font: 400 14px/1.6 var(--mono); color: #8f8d86; min-width: 30px; }
.alt li a:hover { color: var(--beyaz); text-decoration: underline; text-underline-offset: 5px; }
.alt .kunye { font: 400 15px/1.75 var(--metin); }
.alt .kunye a { text-decoration: none; }
.alt .kunye a:hover { text-decoration: underline; }
.alt-sosyal { padding: 18px 0; }
.sosyal { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.sosyal a, .sosyal .bekliyor { display: inline-grid; place-items: center; width: 40px; height: 40px; color: #d9d7d0; }
.sosyal .bekliyor { opacity: .35; }
.alt .grup-imza { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 18px 32px; padding-top: 22px; border-top: 1px solid #2c2c2c; font-size: 15px; color: #a8a69f; }
.alt .grup-imza a { color: #e6e4de; }
.grup-imza-logo { display: inline-flex; align-items: center; gap: 8px; }
.grup-imza-karakter { width: 26px; height: auto; }
.grup-imza-yazi { width: 120px; height: auto; }

@media (max-width: 1180px) {
  .menu { gap: 20px; }
  .ust .ic { gap: 22px; }
  .alan-satir { grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr); }
  .alan-satir .sinir { grid-column: 2; }
  .alt-pano { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .adimlar ol { grid-template-columns: 1fr 1fr; }
  .adimlar li:nth-child(3) { padding-left: 0; border-left: 0; }
  .adimlar li:nth-child(n+3) { border-top: 1px solid var(--cizgi); }
}
@media (max-width: 900px) {
  :root { --kay: 9%; }
  .ust .ic { gap: 14px; min-height: 84px; }
  .ust .logo img { height: 56px; }
  html[lang="en"] .ust .logo img { height: 64px; }
  .menu { display: none; }
  .menu:target { display: flex; flex-direction: column; gap: 0; position: fixed; inset: 0; z-index: 40; padding: 88px var(--kenar) 32px; background: var(--kirec); font-size: 22px; }
  .menu:target a { padding: 18px 0; border-bottom: 1px solid var(--cizgi); }
  .menu:target .menu-kapat { display: block; margin-top: 18px; border: 0; font: 400 16px/1 var(--mono); text-decoration: underline; }
  .menu-ac { display: inline-flex; align-items: center; min-height: 44px; padding: 0 4px; font: 500 15px/1 var(--mono); text-decoration: none; border-bottom: 1px solid var(--is); }
  .ust-arac { margin-left: auto; }
  .ust .ust-kapi { display: none; }
  .akis, .sektorler, .birlikte { grid-template-columns: minmax(0, 1fr); }
  .sektor, .sektor + .sektor { padding: 24px 0; border-left: 0; }
  .sektor + .sektor { border-top: 1px solid var(--cizgi); }
  .aile-satir { grid-template-columns: minmax(0, 1fr) auto; }
  .aile-satir p { grid-column: 1 / -1; }
  .kayit li { grid-template-columns: 76px minmax(0, 1fr); }
  .kayit li .adim, .kayit li .ne, .onay { grid-column: 2; }
  .on-deg { grid-template-columns: minmax(0, 1fr); }
  .yasal { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .alt-pano { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 560px) {
  :root { --kay: 7%; }
  body { font-size: 17px; }
  .giris h1 { font-size: clamp(36px, 11vw, 52px); }
  html[lang="en"] .giris h1 { font-size: clamp(34px, 10vw, 48px); }
  .ust .logo img { height: 50px; }
  html[lang="en"] .ust .logo img { height: 57px; }
  .alan-satir { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .alan-satir .sinir { grid-column: 1; }
  .oyun .ic { grid-template-columns: 96px minmax(0, 1fr); gap: 20px; align-items: start; }
  .telefon { width: 96px; border-radius: 18px; padding: 10px 6px; font-size: 14px; }
  .telefon b { font-size: 14px; }
  .telefon span:not(.sayac) { display: none; }
  .adimlar ol { grid-template-columns: minmax(0, 1fr); }
  .adimlar li, .adimlar li + li { padding: 16px 0; border-left: 0; }
  .adimlar li + li { border-top: 1px solid var(--cizgi); }
  .isler, .on-deg, .secimler, .giris-alt { margin-left: 0; }
  .birlik { padding: 22px; }
  .kapanis h2 { font-size: clamp(24px, 7.4vw, 40px); }
  .kunye-liste div { grid-template-columns: minmax(0, 1fr); gap: 4px; }
  .alt-pano { grid-template-columns: minmax(0, 1fr); gap: 28px; }
  .alt .soz .yarin { margin-left: 1em; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .giris h1 .yarin, .kayit li { transition: none; }
}
/* en dar telefon (320–360 px): logo sıkışmasın; üst bölümde yan pay 16 px, aralıklar dar */
@media (max-width: 360px) {
  .ust .ic { width: calc(100% - 32px); gap: 8px; }
  .ust-arac { gap: 6px; }
  .ust .logo img { height: 42px; }
  html[lang="en"] .ust .logo img { height: 48px; }
  .paylas-dugmeler button { padding: 8px 12px; }
}

/* ------------------------------------------------------------------ iskeletin ortak kuralları (aynen; değiştirmeyin) */

/* site içi arama (iskelet: arama.mjs), bütün markalarda aynı yapı */
.ara-simge { display: inline-flex; align-items: center; justify-content: center; width: 2.5rem; height: 2.5rem; border-radius: 999px; color: inherit; text-decoration: none; flex: none; }
.ara-simge:hover, .ara-simge:focus-visible, .ara-simge[aria-current] { background: color-mix(in srgb, currentColor 10%, transparent); }
.arama-kutusu { display: flex; align-items: center; gap: .5rem; max-width: 36rem; margin: 1.25rem 0; }
.arama-kutusu label { position: relative; flex: 1; display: block; }
.arama-kutusu label svg { position: absolute; left: .9rem; top: 50%; transform: translateY(-50%); opacity: .6; pointer-events: none; }
.arama-kutusu input { width: 100%; box-sizing: border-box; font: inherit; padding: .8rem 1rem .8rem 2.75rem; border: 1.5px solid currentColor; border-radius: 999px; background: transparent; color: inherit; }
.arama-kutusu input::placeholder { color: inherit; opacity: .55; }
.arama-kutusu .dugme { flex: none; }
.arama-kutusu.genis { max-width: 40rem; }
.arama-kutusu.genis input { font-size: 1.125rem; padding-top: 1rem; padding-bottom: 1rem; }
.gizli-etiket { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.arama-sayi { font-weight: 600; margin: 1.5rem 0 .5rem; }
.arama-liste { list-style: none; padding: 0; margin: 0; max-width: 46rem; }
.arama-liste li { border-top: 1px solid color-mix(in srgb, currentColor 18%, transparent); }
.arama-liste a { display: block; padding: 1rem 0; color: inherit; text-decoration: none; }
.arama-liste h2 { font-size: 1.25rem; margin: 0 0 .15rem; }
.arama-liste a:hover h2, .arama-liste a:focus-visible h2 { text-decoration: underline; }
.arama-yol { font-family: var(--mono, monospace); font-size: .875rem; opacity: .6; }
.arama-liste p { margin: .35rem 0 0; opacity: .8; }

/* tanışma kartı (iskelet: tanisma.mjs), bütün markalarda aynı yapı */
.tanisma { border: 0; border-radius: 20px; padding: 0; width: min(30rem, calc(100% - 2rem)); background: #fff; color: #16171a; box-shadow: 0 24px 60px rgba(0,0,0,.25); }
.tanisma::backdrop { background: rgba(10,12,16,.55); }
.tanisma-form { padding: 1.5rem; display: grid; gap: .75rem; }
.tanisma h2 { margin: 0; font-size: 1.35rem; }
.tanisma p { margin: 0; font-size: .92rem; opacity: .8; }
.tanisma-alanlar { display: grid; grid-template-columns: 1fr 1fr; gap: .6rem; }
.tanisma-alanlar label { display: grid; gap: .25rem; font-size: .875rem; font-weight: 600; }
.tanisma-alanlar label:nth-child(n+3) { grid-column: 1 / -1; }
.tanisma-alanlar input { font: inherit; font-size: 1rem; font-weight: 400; padding: .65rem .8rem; border: 1.5px solid rgba(0,0,0,.25); border-radius: 10px; background: #fff; color: inherit; box-sizing: border-box; width: 100%; }
.tanisma-alanlar input:focus-visible { outline: 3px solid currentColor; outline-offset: 1px; }
.tanisma-dugmeler { display: flex; flex-wrap: wrap; gap: .5rem; opacity: 1 !important; margin-top: .25rem !important; }
@media (max-width: 30rem) { .tanisma-alanlar { grid-template-columns: 1fr; } }

/* kod deneyimi (iskelet: kodDeneyimi), bütün markalarda aynı kural: telefonda kod ve okutma dili yok, düğme var */
.kd-cihazda { display: none; }
.kd-cihazda .dugme span { margin-inline-start: .4em; }
.kd-kod .kisa-adres { font-size: .9rem; text-align: center; overflow-wrap: anywhere; margin: .75rem 0 0; }
@media (max-width: 51.99rem), (hover: none) and (pointer: coarse) {
  .kod-deneyim .kd-kod, .kod-deneyim .kd-kodla { display: none; }
  .kod-deneyim .kd-cihazda { display: block; }
  .kod-deneyim { grid-template-columns: 1fr !important; }
}
