@font-face { font-family: 'Cormorant Garamond'; font-style: normal; font-weight: 300; font-display: swap; src: url(fontlar/cormorant-300-vietnamese.woff2) format('woff2'); unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB; }
@font-face { font-family: 'Cormorant Garamond'; font-style: normal; font-weight: 400; font-display: swap; src: url(fontlar/cormorant-400-vietnamese.woff2) format('woff2'); unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB; }
@font-face { font-family: 'Cormorant Garamond'; font-style: italic; font-weight: 300; font-display: swap; src: url(fontlar/cormorant-300-italik-vietnamese.woff2) format('woff2'); unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB; }
@font-face { font-family: 'Cormorant Garamond'; font-style: italic; font-weight: 400; font-display: swap; src: url(fontlar/cormorant-400-italik-vietnamese.woff2) format('woff2'); unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB; }
@font-face { font-family: 'Cormorant Garamond'; font-style: normal; font-weight: 300; font-display: swap; src: url(fontlar/cormorant-300-cyrillic.woff2) format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Cormorant Garamond'; font-style: normal; font-weight: 400; font-display: swap; src: url(fontlar/cormorant-400-cyrillic.woff2) format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Cormorant Garamond'; font-style: italic; font-weight: 300; font-display: swap; src: url(fontlar/cormorant-300-italik-cyrillic.woff2) format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Cormorant Garamond'; font-style: italic; font-weight: 400; font-display: swap; src: url(fontlar/cormorant-400-italik-cyrillic.woff2) format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Cormorant Garamond'; font-style: normal; font-weight: 300; font-display: swap; src: url(fontlar/cormorant-300-latin-ext.woff2) format('woff2'); 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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Cormorant Garamond'; font-style: normal; font-weight: 400; font-display: swap; src: url(fontlar/cormorant-400-latin-ext.woff2) format('woff2'); 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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Cormorant Garamond'; font-style: italic; font-weight: 300; font-display: swap; src: url(fontlar/cormorant-300-italik-latin-ext.woff2) format('woff2'); 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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Cormorant Garamond'; font-style: italic; font-weight: 400; font-display: swap; src: url(fontlar/cormorant-400-italik-latin-ext.woff2) format('woff2'); 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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Cormorant Garamond'; font-style: normal; font-weight: 300; font-display: swap; src: url(fontlar/cormorant-300-latin.woff2) format('woff2'); 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: 'Cormorant Garamond'; font-style: normal; font-weight: 400; font-display: swap; src: url(fontlar/cormorant-400-latin.woff2) format('woff2'); 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: 'Cormorant Garamond'; font-style: italic; font-weight: 300; font-display: swap; src: url(fontlar/cormorant-300-italik-latin.woff2) format('woff2'); 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: 'Cormorant Garamond'; font-style: italic; font-weight: 400; font-display: swap; src: url(fontlar/cormorant-400-italik-latin.woff2) format('woff2'); 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: 'Jost'; font-style: normal; font-weight: 300; font-display: swap; src: url(fontlar/jost-300-cyrillic.woff2) format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Jost'; font-style: normal; font-weight: 400 500; font-display: swap; src: url(fontlar/jost-400-cyrillic.woff2) format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Jost'; font-style: normal; font-weight: 300; font-display: swap; src: url(fontlar/jost-300-latin-ext.woff2) format('woff2'); 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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Jost'; font-style: normal; font-weight: 400 500; font-display: swap; src: url(fontlar/jost-400-latin-ext.woff2) format('woff2'); 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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Jost'; font-style: normal; font-weight: 300; font-display: swap; src: url(fontlar/jost-300-latin.woff2) format('woff2'); 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: 'Jost'; font-style: normal; font-weight: 400 500; font-display: swap; src: url(fontlar/jost-400-latin.woff2) format('woff2'); 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: 'IBM Plex Mono'; font-style: normal; font-weight: 400; font-display: swap; src: url(fontlar/ibm-plex-mono-400-latin-ext.woff2) format('woff2'); 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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'IBM Plex Mono'; font-style: normal; font-weight: 400; font-display: swap; src: url(fontlar/ibm-plex-mono-400-latin.woff2) format('woff2'); 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; }
/* Kelime isareti yalniz Latin harfleri kullanir (f a l ı u s). */
@font-face { font-family: 'Instrument Serif'; font-style: normal; font-weight: 400; font-display: swap; src: url(fontlar/instrument-serif-400-latin.woff2) format('woff2'); unicode-range: U+0061-007A, U+0131; }
@font-face { font-family: 'Amiri'; font-style: normal; font-weight: 400; font-display: swap; src: url(fontlar/amiri-400-arabic.woff2) format('woff2'); unicode-range: U+0600-06FF, U+0750-077F, U+0870-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC, U+102E0-102FB, U+10E60-10E7E, U+10EC2-10EC7, U+10EC9-10EEE, U+10EF0-10EFF, U+1EE00-1EE03, U+1EE05-1EE1F, U+1EE21-1EE22, U+1EE24, U+1EE27, U+1EE29-1EE32, U+1EE34-1EE37, U+1EE39, U+1EE3B, U+1EE42, U+1EE47, U+1EE49, U+1EE4B, U+1EE4D-1EE4F, U+1EE51-1EE52, U+1EE54, U+1EE57, U+1EE59, U+1EE5B, U+1EE5D, U+1EE5F, U+1EE61-1EE62, U+1EE64, U+1EE67-1EE6A, U+1EE6C-1EE72, U+1EE74-1EE77, U+1EE79-1EE7C, U+1EE7E, U+1EE80-1EE89, U+1EE8B-1EE9B, U+1EEA1-1EEA3, U+1EEA5-1EEA9, U+1EEAB-1EEBB, U+1EEF0-1EEF1; }
@font-face { font-family: 'Amiri Kadran'; font-style: normal; font-weight: 400; font-display: swap; src: url(fontlar/amiri-kadran.woff2) format('woff2'); }

/* Falius web sitesi. Yon D "Murekkep tiyatrosu": uygulamayla ayni renk, yazi ve atmosfer
   (uygulama/shared/.../Tema.kt ve Atmosfer.kt degerleri). Duzen mobil once; 600 / 900 / 1200 px
   kirilimlari. Yatay kaydirma hicbir genislikte olmaz. */
:root {
  --zemin: #0B1320; --yuzey: #19283A; --yuzey2: #223243; --cizgi: #2B3C4E;
  --metin: #F4F1EA; --ikincil: #9AAEBE; --ucuncul: #8EA2B3; --eylem: #74CFC4; --eylem-ustu: #0B1320;
  --nokta: #C9A45C;
  --ay1: rgba(74, 116, 150, .46); --ay2: rgba(36, 90, 92, .38); --yildiz: #CDDAE2; --gren: .07;
  --golge: rgba(2, 6, 12, .45);
  --f-baslik: "Cormorant Garamond", "Iowan Old Style", Georgia, serif;
  --f-govde: "Cormorant Garamond", "Iowan Old Style", Georgia, serif;
  --f-arayuz: "Jost", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --f-hesap: "IBM Plex Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  /* Sonuc rakamlari ve kelime isareti her dilde ayni yazi: dil kurallari bunlari degistirmez. */
  --f-sayi: "Cormorant Garamond", Georgia, serif;
  --f-marka: "Instrument Serif", "Iowan Old Style", Georgia, serif;
  --f-arap: "Amiri Kadran", "Amiri", "Geeza Pro", "Noto Naskh Arabic", serif;
  --govde-boy: 20px;
  --rakam: "lnum" 1, "kern" 1;
  --bosluk: clamp(16px, 4vw, 48px);
  color-scheme: dark;
}
@media (prefers-color-scheme: light) {
  :root {
    --zemin: #F2EEE6; --yuzey: #FBF8F2; --yuzey2: #E8E2D6; --cizgi: #D3CBBC;
    --metin: #18222E; --ikincil: #4F5A66; --ucuncul: #5F6874; --eylem: #1B746B; --eylem-ustu: #FFFFFF;
    --nokta: #9A7633;
    --ay1: rgba(214, 190, 150, .35); --ay2: rgba(120, 170, 170, .18); --yildiz: transparent; --gren: .05;
    --golge: rgba(60, 50, 30, .18);
    color-scheme: light;
  }
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body {
  margin: 0; background: var(--zemin); color: var(--metin);
  font: 400 var(--govde-boy)/1.55 var(--f-govde);
  /* Cormorant'in varsayilan eski usul rakamlarinda 1, I harfine benzer. font kisaltmasi hem
     font-variant-numeric'i hem font-feature-settings'i sifirlar (Chrome'da olculdu, 2026-10-11): bu
     yuzden font kisaltmasi kullanan her kurala --rakam ayrica yazilir. */
  font-feature-settings: var(--rakam);
  -webkit-font-smoothing: antialiased; overflow-x: hidden; position: relative;
}
/* Atmosfer: iki ay isigi lekesi, gren ve seyrek yildiz. Sabit katman, icerigin altinda; tasma yapmaz. */
body::before, body::after { content: ""; position: fixed; inset: 0; pointer-events: none; z-index: -1; }
body::before {
  background:
    radial-gradient(95vmax 70vmax at 22% 8%, var(--ay1), transparent 62%),
    radial-gradient(80vmax 65vmax at 88% 64%, var(--ay2), transparent 60%);
}
body::after {
  opacity: var(--gren);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .5 0 0 0 0 .5 0 0 0 0 .5 0 0 0 1.6 -.3'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23g)'/%3E%3C/svg%3E");
}
.yildizlar { position: fixed; inset: 0; pointer-events: none; z-index: -1; overflow: hidden; }
.yildizlar i { position: absolute; width: 2px; height: 2px; border-radius: 50%; background: var(--yildiz); opacity: .55; animation: parla 7s ease-in-out infinite; }
.yildizlar i:nth-child(3n) { width: 1.5px; height: 1.5px; animation-duration: 9s; }
.yildizlar i:nth-child(4n) { animation-delay: -3s; opacity: .35; }
@keyframes parla { 50% { opacity: .15; } }
@media (prefers-reduced-motion: reduce) { .yildizlar i { animation: none; } }
/* Gok katmani (gok.js): yildiz, sis ve kayan yildiz tuvalde; betik calisinca duragan yildizlar gizlenir. */
canvas.gok { position: fixed; inset: 0; width: 100vw; height: 100vh; pointer-events: none; z-index: -1; }
html.gok-acik .yildizlar { display: none; }

img { max-width: 100%; height: auto; display: block; }
a { color: var(--eylem); text-underline-offset: .18em; text-decoration-thickness: 1px; }
:focus-visible { outline: 2px solid var(--eylem); outline-offset: 3px; border-radius: 4px; }
h1, h2, h3 { font-family: var(--f-baslik); font-weight: 300; margin: 0; line-height: 1.04; letter-spacing: -.005em; text-wrap: balance; }
h1 em, h2 em, h3 em { font-style: italic; font-weight: 300; }
p { margin: 0; }

.kap { width: 100%; max-width: 1180px; margin-inline: auto; padding-inline: max(var(--bosluk), env(safe-area-inset-left)) max(var(--bosluk), env(safe-area-inset-right)); }
.kap.dar { max-width: 820px; }
/* Gorunmez ama odaklaninca beliren atlama baglantisi. Eksi konum KULLANILMAZ: sagdan sola sayfada
   sola tasan oge yatay kaydirma yaratir (2026-10-10'da olculdu: 360 px ekran 1359 px oldu). */
.atla { position: absolute; top: 8px; inset-inline-start: 8px; z-index: 10; background: var(--eylem); color: var(--eylem-ustu); padding: 8px 14px; border-radius: 8px; font-family: var(--f-arayuz); }
.atla:not(:focus) { width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }

/* Etiket: uygulamadaki gibi italik serif, ilk harf kucuk (Latin ve Kiril'de). */
.etiket { font: italic 300 21px/1.3 var(--f-govde); color: var(--ikincil); font-feature-settings: var(--rakam); }
.govde { color: var(--ikincil); max-width: 58ch; }
.kucuk { font: 400 14px/1.55 var(--f-arayuz); color: var(--ucuncul); font-feature-settings: var(--rakam); }

/* Kelime isareti: noktasiz ı ve pirinc nokta (olculen metrik: merkez taban cizgisinin 0,63 em ustu) */
.kelime { font-family: var(--f-marka); font-size: 30px; line-height: 1; color: var(--metin); text-decoration: none; white-space: nowrap; }
.kelime-i { position: relative; display: inline-block; }
.kelime-i::after { content: ""; position: absolute; left: 50%; top: .135em; width: .15em; height: .15em; border-radius: 50%; background: var(--nokta); transform: translateX(-50%); }
.kelime-kucuk { font-size: 26px; }

/* Ust cubuk */
.ust { position: sticky; top: 0; z-index: 5; background: color-mix(in srgb, var(--zemin) 80%, transparent); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); border-bottom: 1px solid color-mix(in srgb, var(--cizgi) 70%, transparent); padding-top: env(safe-area-inset-top); }
.ust-ic { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 64px; position: relative; }
.ust nav { display: none; gap: 30px; font: 400 15px/1 var(--f-arayuz); font-feature-settings: var(--rakam); }
.ust nav a { color: var(--ikincil); text-decoration: none; padding-block: 8px; }
.ust nav a:hover { color: var(--metin); }
@media (min-width: 860px) { .ust nav { display: flex; } }

.dugme { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 10px 24px; border-radius: 999px; font: 500 15px/1.2 var(--f-arayuz); letter-spacing: .01em; text-decoration: none; font-feature-settings: var(--rakam); }
.dugme-dolu { background: var(--eylem); color: var(--eylem-ustu); }
.dugme-kucuk { min-height: 40px; padding: 8px 18px; font-size: 14px; }

/* Kahraman */
.kahraman { padding-block: 32px 72px; }
.kahraman-ic { display: grid; gap: 28px; align-items: center; }
.kahraman h1 { font-size: clamp(46px, 11vw, 92px); margin: 14px 0 22px; max-width: 13ch; }
.giris { color: var(--ikincil); font-size: 22px; line-height: 1.5; max-width: 40ch; }
.kahraman-gorsel { order: -1; justify-self: center; width: min(80vw, 320px); position: relative; }
@media (min-width: 900px) {
  .kahraman { padding-block: 80px 128px; }
  .kahraman-ic { grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: 56px; }
  .kahraman-gorsel { order: 0; width: 100%; max-width: 470px; }
}
.magazalar { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 32px; }
.magaza { display: inline-flex; flex-direction: column; justify-content: center; min-height: 54px; padding: 8px 22px; border-radius: 14px; border: 1px solid color-mix(in srgb, var(--metin) 55%, transparent); font: 500 16px/1.2 var(--f-arayuz); color: var(--metin); font-feature-settings: var(--rakam); }
.magaza small { font-size: 11px; font-weight: 400; color: var(--ikincil); letter-spacing: .06em; }

/* Usturlap kadrani */
.kadran { width: 100%; height: auto; display: block; overflow: visible; }
.kadran .olcek { transform-origin: 0 0; animation: don 300s linear infinite; }
@keyframes don { to { transform: rotate(-360deg); } }
@media (prefers-reduced-motion: reduce) { .kadran .olcek { animation: none; } }
.k-cizgi { fill: none; stroke: var(--metin); stroke-width: 1; opacity: .42; }
.k-ince { fill: none; stroke: var(--metin); stroke-width: .7; opacity: .24; }
.k-uzun { stroke: var(--metin); stroke-width: 1.2; opacity: .7; }
.k-kisa { stroke: var(--metin); stroke-width: .7; opacity: .36; }
.k-harf { fill: var(--metin); opacity: .62; font: 17px var(--f-arap); text-anchor: middle; dominant-baseline: central; font-feature-settings: var(--rakam); }
.k-ufuk { stroke: var(--metin); stroke-width: .7; opacity: .3; stroke-dasharray: 3 4; }
.i-halka { fill: none; stroke: var(--metin); stroke-width: 7; }
.i-cizgi { stroke: var(--metin); stroke-width: 7; }
.i-nokta { fill: var(--nokta); }
.kadran-sayi { position: absolute; inset: 0; display: grid; place-content: center; text-align: center; pointer-events: none; }

/* Bolumler */
.bolum { padding-block: 80px; position: relative; }
.bolum + .bolum::before { content: ""; position: absolute; top: 0; inset-inline: max(var(--bosluk), calc((100% - 1180px) / 2 + var(--bosluk))); border-top: 1px solid var(--cizgi); }
.bolum h2 { font-size: clamp(38px, 7.4vw, 64px); margin: 10px 0 22px; max-width: 18ch; }
@media (min-width: 900px) { .bolum { padding-block: 128px; } }

.uclu { display: grid; gap: 0; margin-top: 48px; }
.uclu article { padding: 30px 0; display: flex; flex-direction: column; gap: 10px; min-width: 0; border-top: 1px solid var(--cizgi); }
.uclu h3 { font-size: 36px; }
.uclu p:last-child { color: var(--ikincil); font-size: 19px; }
.tur { font: 400 13px/1.4 var(--f-arayuz); letter-spacing: .14em; text-transform: uppercase; color: var(--eylem); font-feature-settings: var(--rakam); }
.simge { width: 46px; height: 46px; fill: none; stroke: var(--metin); stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; margin-bottom: 6px; }
.simge .dolu { fill: var(--metin); stroke: none; }
.simge .pirinc { fill: var(--nokta); stroke: none; }
@media (min-width: 900px) {
  .uclu { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .uclu article { padding: 34px 32px 8px; border-top: 0; border-inline-start: 1px solid var(--cizgi); }
  .uclu article:first-child { padding-inline-start: 0; border-inline-start: 0; }
}

.iki-sutun { display: grid; gap: 56px; align-items: center; }
@media (min-width: 900px) { .iki-sutun { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 72px; } }
.yigin { display: flex; flex-direction: column; min-width: 0; }
.hesaplar { margin: 36px 0 0; display: flex; flex-direction: column; border-top: 1px solid var(--cizgi); }
.hesap { padding-block: 20px; border-bottom: 1px solid var(--cizgi); }
.hesap dt { font: italic 300 19px/1.3 var(--f-govde); color: var(--ikincil); margin-bottom: 8px; font-feature-settings: var(--rakam); }
.hesap dd { margin: 0; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 18px; }
.hesap .ar { font: 36px/1.3 var(--f-arap); direction: rtl; font-feature-settings: var(--rakam); }
.hesap .satir { font: 14px/1.7 var(--f-hesap); color: var(--ikincil); overflow-wrap: anywhere; font-feature-settings: var(--rakam); }
.hesap .sonuc { font: 300 64px/1 var(--f-sayi); color: var(--eylem); font-feature-settings: var(--rakam); }
.hesap .sonuc-kelime { font-family: var(--f-baslik); font-size: 40px; font-style: italic; }
.hesap dd:not(:has(.ar)) { grid-template-columns: minmax(0, 1fr) auto; }

.cihaz-cifti { margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; max-width: 520px; justify-self: center; width: 100%; }
.cihaz-cifti img { border-radius: 26px; box-shadow: 0 0 0 1px var(--cizgi), 0 24px 56px var(--golge); }
.cihaz-cifti img:last-child { margin-top: 56px; }

/* Okuma vitrini */
.okuma { display: grid; gap: 40px; }
.okuma-liste { list-style: none; margin: 28px 0 0; padding: 0; display: grid; gap: 0; border-top: 1px solid var(--cizgi); }
.okuma-liste li { display: grid; grid-template-columns: 44px minmax(0, 1fr); align-items: baseline; padding-block: 16px; border-bottom: 1px solid var(--cizgi); font-size: 22px; }
.okuma-liste li span { font: 300 26px/1 var(--f-sayi); color: var(--eylem); font-feature-settings: var(--rakam); }
.okuma-not { margin-top: 22px; }
.okuma-kart { position: relative; border: 1px solid var(--cizgi); border-radius: 28px; padding: clamp(24px, 4vw, 40px); background: color-mix(in srgb, var(--yuzey) 55%, transparent); overflow: hidden; }
.okuma-kart::before { content: ""; position: absolute; inset: -20% -10% auto auto; width: 70%; aspect-ratio: 1; background: radial-gradient(closest-side, var(--ay1), transparent); pointer-events: none; }
.okuma-kart > * { position: relative; }
.okuma-kart .ust-satir { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; font: 400 12px/1 var(--f-arayuz); letter-spacing: .14em; text-transform: uppercase; color: var(--eylem); font-feature-settings: var(--rakam); }
.okuma-kart .kapsam { margin-top: 26px; font: 300 clamp(26px, 3.4vw, 34px)/1.3 var(--f-baslik); color: var(--metin); text-wrap: pretty; font-feature-settings: var(--rakam); }
.okuma-kart .not { margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--cizgi); font: 13px/1.6 var(--f-hesap); color: var(--ucuncul); font-feature-settings: var(--rakam); }
@media (min-width: 900px) { .okuma { grid-template-columns: minmax(0, 1fr) minmax(0, .9fr); gap: 72px; align-items: center; } }

.tablet-kare { margin: 0; justify-self: center; width: 100%; max-width: 460px; }
.tablet-kare img { border-radius: 28px; box-shadow: 0 0 0 1px var(--cizgi), 0 30px 70px var(--golge); }
@media (min-width: 900px) { .cihazlar .tablet-kare { justify-self: end; } }

.sorular { margin-top: 28px; border-top: 1px solid var(--cizgi); }
.sorular details { border-bottom: 1px solid var(--cizgi); }
.sorular summary { cursor: pointer; list-style: none; display: flex; justify-content: space-between; align-items: center; gap: 16px; padding-block: 22px; font: 400 23px/1.35 var(--f-govde); font-feature-settings: var(--rakam); }
.sorular summary::-webkit-details-marker { display: none; }
.sorular summary::after { content: ""; flex: none; width: 9px; height: 9px; border-right: 1.5px solid var(--ikincil); border-bottom: 1.5px solid var(--ikincil); transform: rotate(45deg) translate(-3px, -3px); transition: transform .2s; }
.sorular details[open] summary::after { transform: rotate(-135deg); }
.sorular details p { color: var(--ikincil); padding-bottom: 24px; max-width: 62ch; }

.alt { border-top: 1px solid var(--cizgi); padding-block: 44px calc(44px + env(safe-area-inset-bottom)); }
.alt-ic { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 28px; color: var(--ikincil); font: 400 14px/1.6 var(--f-arayuz); font-feature-settings: var(--rakam); }
.alt-ic a { color: var(--ikincil); }
.alt-ic a:hover { color: var(--metin); }

/* Dil secici. Menu dugmeye degil ust cubugun kenarina baglanir: dar ekranda iki yonde de tasmaz. */
.ust-sag { display: flex; align-items: center; gap: 10px; }
.dil-sec { position: static; }
.dil-sec:not([open]) ul { display: none; }
.dil-sec summary { list-style: none; cursor: pointer; display: inline-flex; align-items: center; gap: 6px; min-height: 40px; padding: 6px 10px; border-radius: 999px; color: var(--ikincil); font: 400 14px/1 var(--f-arayuz); font-feature-settings: var(--rakam); }
.dil-sec summary::-webkit-details-marker { display: none; }
.dil-sec summary:hover { color: var(--metin); }
.dil-sec svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.4; }
.dil-sec summary span { display: none; }
@media (min-width: 600px) { .dil-sec summary span { display: inline; } }
.dil-sec ul { position: absolute; inset-inline-end: var(--bosluk); top: calc(100% - 4px); z-index: 10; margin: 0; padding: 6px; list-style: none; width: max-content; max-width: calc(100% - 2 * var(--bosluk)); max-height: min(70vh, 520px); overflow-y: auto; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2px 8px; background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: 16px; box-shadow: 0 18px 40px var(--golge); }
.dil-sec li a { display: block; padding: 8px 12px; border-radius: 10px; color: var(--metin); text-decoration: none; font: 400 15px/1.3 var(--f-arayuz); white-space: nowrap; font-feature-settings: var(--rakam); }
.dil-sec li a:hover { background: var(--yuzey2); }
.dil-sec li a[aria-current="page"] { color: var(--eylem); }

/* Yazi sistemleri. Kapsama fontTools ile olculdu (2026-10-11): Cormorant Latin, Vietnamca ve Kiril'i,
   Jost Latin ve Kiril'i kapsar (Vietnamca isaretleri yok). Digerlerinde sistem yazilari. */
:lang(vi) { --f-arayuz: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; }
:lang(ar), :lang(fa), :lang(ur) { --f-baslik: "Amiri", "Geeza Pro", "Noto Naskh Arabic", serif; --f-govde: "Geeza Pro", "Noto Sans Arabic", "Segoe UI", Tahoma, sans-serif; --f-arayuz: var(--f-govde); --govde-boy: 18px; }
:lang(ur) { --f-baslik: "Amiri", "Noto Nastaliq Urdu", "Geeza Pro", serif; }
:lang(hi) { --f-baslik: "Kohinoor Devanagari", "Noto Sans Devanagari", "Nirmala UI", sans-serif; --f-govde: var(--f-baslik); --f-arayuz: var(--f-baslik); --govde-boy: 18px; }
:lang(bn) { --f-baslik: "Kohinoor Bangla", "Noto Sans Bengali", "Nirmala UI", sans-serif; --f-govde: var(--f-baslik); --f-arayuz: var(--f-baslik); --govde-boy: 18px; }
:lang(th) { --f-baslik: Thonburi, "Noto Sans Thai", "Leelawadee UI", sans-serif; --f-govde: var(--f-baslik); --f-arayuz: var(--f-baslik); --govde-boy: 18px; }
:lang(ja) { --f-baslik: "Hiragino Mincho ProN", "Yu Mincho", "Noto Serif JP", serif; --f-govde: "Hiragino Sans", "Yu Gothic", "Noto Sans JP", sans-serif; --f-arayuz: var(--f-govde); --govde-boy: 17px; }
:lang(zh) { --f-baslik: "Songti SC", "Noto Serif SC", "SimSun", serif; --f-govde: "PingFang SC", "Microsoft YaHei", "Noto Sans SC", sans-serif; --f-arayuz: var(--f-govde); --govde-boy: 17px; }
:lang(ko) { --f-baslik: "AppleMyungjo", "Noto Serif KR", "Batang", serif; --f-govde: "Apple SD Gothic Neo", "Malgun Gothic", "Noto Sans KR", sans-serif; --f-arayuz: var(--f-govde); --govde-boy: 17px; }
/* Sistem yazili dillerde ince agirlik ve italik yoktur ya da tarayici sahte uretir: duz ve normal. */
:is(:lang(ar), :lang(fa), :lang(ur), :lang(hi), :lang(bn), :lang(th), :lang(ja), :lang(zh), :lang(ko)) :is(h1, h2, h3, .etiket, .hesap dt, .hesap .sonuc-kelime) { font-weight: 400; font-style: normal; }
:is(:lang(ar), :lang(fa), :lang(ur), :lang(hi), :lang(bn), :lang(th), :lang(ja), :lang(zh), :lang(ko)) :is(.etiket, .hesap dt) { font-size: 16px; }
:is(:lang(ar), :lang(fa), :lang(ur), :lang(hi), :lang(bn), :lang(th), :lang(ja), :lang(zh), :lang(ko)) .giris { font-size: 19px; }
:is(:lang(ar), :lang(fa), :lang(ur), :lang(hi), :lang(bn), :lang(th), :lang(ja), :lang(zh), :lang(ko)) .okuma-kart .kapsam { font-size: 22px; font-weight: 400; line-height: 1.5; }
:is(:lang(ar), :lang(fa), :lang(ur), :lang(hi), :lang(bn), :lang(th), :lang(ja), :lang(zh), :lang(ko)) :is(.sorular summary, .okuma-liste li) { font-size: 19px; }
:is(:lang(ar), :lang(fa), :lang(ur), :lang(hi), :lang(bn), :lang(th), :lang(ja), :lang(zh), :lang(ko)) .uclu p:last-child { font-size: 17px; }
/* Harf araligi ve buyuk harf yalniz Latin ve Kiril'de: Arap, Hint, Tay yazisinda harfleri koparir. */
:is(:lang(ar), :lang(fa), :lang(ur), :lang(hi), :lang(bn), :lang(th), :lang(ja), :lang(zh), :lang(ko)) :is(.tur, .okuma-kart .ust-satir) { letter-spacing: 0; text-transform: none; font-size: 14px; }
/* Arap yazisi ve Hint yazilari daha yuksek satir ister. */
:is(:lang(ar), :lang(fa), :lang(ur), :lang(hi), :lang(bn), :lang(th)) :is(h1, h2) { line-height: 1.35; }
:lang(ur) :is(h1, h2) { line-height: 1.6; }
/* CJK basliklarda daha kucuk punto: harfler genis. */
:is(:lang(ja), :lang(zh), :lang(ko)) .kahraman h1 { font-size: clamp(36px, 7.5vw, 64px); line-height: 1.2; }
:is(:lang(ja), :lang(zh), :lang(ko)) .bolum h2 { font-size: clamp(30px, 5.6vw, 48px); line-height: 1.25; }
/* Japoncada satiri kelime ortasindan degil ifade sinirindan kir (destekleyen tarayicilarda). */
:lang(ja) :is(h1, h2, h3) { word-break: auto-phrase; }
