/* =====================================================================
   ParselAnaliz — Tasarım Sistemi v3 "GECE HARİTASI"
   Koyu komuta-merkezi estetiği · nane→camgöbeği aurora · Space Grotesk
   başlıklar + Inter gövde (kendi sunucumuzdan; CSP default-src 'self')
   Rakip tüm parsel siteleri beyaz/bootstrap — biz geceyiz.
   ===================================================================== */

/* -------------------- Fontlar (self-hosted, OFL) -------------------- */
@font-face {
  font-family: "Space Grotesk"; font-style: normal; font-weight: 300 700; font-display: swap;
  src: url("/statik/fonts/space-grotesk-var-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-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Space Grotesk"; font-style: normal; font-weight: 300 700; font-display: swap;
  src: url("/statik/fonts/space-grotesk-var-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: "InterV"; font-style: normal; font-weight: 100 900; font-display: swap;
  src: url("/statik/fonts/inter-var-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-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "InterV"; font-style: normal; font-weight: 100 900; font-display: swap;
  src: url("/statik/fonts/inter-var-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;
}

/* -------------------- Belirteçler -------------------- */
:root {
  color-scheme: dark;

  /* Zemin katmanları */
  --gece-0: #050a10;
  --gece-1: #081119;
  --gece-2: #0c1822;
  --gece-3: #12212e;
  --gece-4: #182b3a;

  /* Çizgi / metin */
  --cizgi: rgb(148 190 210 / .13);
  --cizgi-2: rgb(148 190 210 / .24);
  --metin: #e6f1f5;
  --soluk: #9db6c2;
  --soluk-2: #62808e;

  /* Marka ışıltısı */
  --nane: #2ee6c0;
  --cam: #38bdf8;
  --bakir: #e79a4e;
  --grad-marka: linear-gradient(100deg, var(--nane), var(--cam));
  --grad-metin: linear-gradient(96deg, #7df3d9, #38bdf8 70%);

  /* Risk anlamları (koyu zemin üstünde) */
  --kirmizi: #ff7a6e; --kirmizi-bg: rgb(255 107 94 / .12); --kirmizi-cizgi: rgb(255 107 94 / .3);
  --sari: #ffc857;   --sari-bg: rgb(255 200 87 / .11);    --sari-cizgi: rgb(255 200 87 / .3);
  --yesil: #4ade9d;  --yesil-bg: rgb(74 222 157 / .11);   --yesil-cizgi: rgb(74 222 157 / .3);

  /* Gölge / ışıltı */
  --golge-1: 0 1px 2px rgb(0 0 0 / .3), 0 4px 14px rgb(0 0 0 / .25);
  --golge-2: 0 8px 30px rgb(0 0 0 / .4);
  --golge-3: 0 24px 70px -18px rgb(0 0 0 / .65);
  --isilti-nane: 0 0 0 1px rgb(46 230 192 / .25), 0 8px 40px -6px rgb(46 230 192 / .35);

  --r-1: 12px; --r-2: 18px; --r-3: 26px; --r-hap: 999px;
  --gecis: 180ms cubic-bezier(.4, 0, .2, 1);
  --kapsam: 1180px;

  --f-govde: "InterV", "Inter", -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --f-baslik: "Space Grotesk", "InterV", -apple-system, "Segoe UI", sans-serif;
}

/* -------------------- Sıfırlama -------------------- */
* { box-sizing: border-box; }
[hidden] { display: none !important; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  margin: 0; background: var(--gece-0); color: var(--metin);
  font-family: var(--f-govde); font-size: 16px; line-height: 1.65;
  -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;
}
img { max-width: 100%; display: block; }
a { color: var(--cam); text-decoration: none; }
a:hover { text-decoration: underline; text-underline-offset: 3px; }
h1, h2, h3, h4 { font-family: var(--f-baslik); line-height: 1.12; letter-spacing: -0.025em; color: #fff; margin: 0 0 .4em; font-weight: 600; }
::selection { background: rgb(46 230 192 / .35); color: #fff; }
:focus-visible { outline: 2.5px solid var(--nane); outline-offset: 3px; border-radius: 6px; }
::-webkit-scrollbar { width: 11px; height: 11px; }
::-webkit-scrollbar-track { background: var(--gece-0); }
::-webkit-scrollbar-thumb { background: var(--gece-4); border-radius: 8px; border: 2.5px solid var(--gece-0); }
::-webkit-scrollbar-thumb:hover { background: #22394c; }

.kapsayici { max-width: var(--kapsam); margin: 0 auto; padding: 0 24px; }

/* -------------------- Butonlar -------------------- */
.btn, button.birincil, a.birincil {
  display: inline-flex; align-items: center; justify-content: center; gap: 9px;
  font: inherit; font-weight: 650; cursor: pointer; border: 0; border-radius: var(--r-hap);
  padding: 13px 26px; min-height: 48px; text-decoration: none; transition: var(--gecis);
  white-space: nowrap; letter-spacing: -.01em;
}
.btn-birincil, button.birincil, a.birincil {
  background: var(--grad-marka); color: #03231c;
  box-shadow: 0 10px 34px -10px rgb(46 230 192 / .5);
}
.btn-birincil:hover, button.birincil:not(:disabled):hover, a.birincil:hover {
  transform: translateY(-2px);
  box-shadow: 0 16px 44px -10px rgb(46 230 192 / .65);
  text-decoration: none; filter: brightness(1.06);
}
.btn-birincil:active, button.birincil:active { transform: translateY(0); }
button.birincil:disabled { background: var(--gece-4); color: var(--soluk-2); box-shadow: none; cursor: not-allowed; }
.btn-ikincil {
  background: rgb(255 255 255 / .06); color: #e9f5f8;
  border: 1px solid rgb(255 255 255 / .16); backdrop-filter: blur(8px);
}
.btn-ikincil:hover { background: rgb(255 255 255 / .11); border-color: rgb(255 255 255 / .3); text-decoration: none; transform: translateY(-2px); }
.btn-buyuk { padding: 16px 34px; min-height: 58px; font-size: 17px; }

/* -------------------- Rozet / çip -------------------- */
.rozet-ai {
  display: inline-flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 600;
  padding: 7px 15px; border-radius: var(--r-hap);
  background: rgb(46 230 192 / .09); color: var(--nane);
  border: 1px solid rgb(46 230 192 / .28);
}
.rozet-ai .nokta { width: 7px; height: 7px; border-radius: 50%; background: var(--nane); animation: nabiz 2.4s infinite; }
@keyframes nabiz {
  0% { box-shadow: 0 0 0 0 rgb(46 230 192 / .6); }
  70% { box-shadow: 0 0 0 9px transparent; }
  100% { box-shadow: 0 0 0 0 transparent; }
}
.cip {
  display: inline-flex; align-items: center; gap: 7px; font-size: 12.5px; font-weight: 600;
  padding: 6px 13px; border-radius: var(--r-hap);
  background: rgb(255 255 255 / .05); color: var(--soluk);
  border: 1px solid var(--cizgi);
}

/* ==================== ÜST BAR ==================== */
.navbar {
  position: sticky; top: 0; z-index: 90;
  background: rgb(5 10 16 / .72); backdrop-filter: saturate(160%) blur(14px);
  border-bottom: 1px solid var(--cizgi);
}
.navbar .kapsayici { display: flex; align-items: center; justify-content: space-between; height: 68px; }
.marka {
  display: flex; align-items: center; gap: 11px; font-family: var(--f-baslik);
  font-size: 20px; font-weight: 700; color: #fff; letter-spacing: -.02em;
}
.marka:hover { text-decoration: none; }
.marka span { background: var(--grad-metin); -webkit-background-clip: text; background-clip: text; color: transparent; }
.marka-logo { width: 32px; height: 32px; flex: 0 0 auto; filter: drop-shadow(0 0 12px rgb(46 230 192 / .35)); }
.nav-sag { display: flex; align-items: center; gap: 20px; }
.nav-link { color: var(--soluk); font-weight: 550; font-size: 14.5px; transition: var(--gecis); }
.nav-link:hover { color: #fff; text-decoration: none; }
@media (max-width: 680px) {
  .nav-link { display: none; }
  .marka { font-size: 17px; gap: 8px; }
  .navbar .btn-birincil { padding: 9px 16px; min-height: 40px; font-size: 13.5px; }
  .navbar .rozet-ai { display: none; }
}

/* ==================== KAHRAMAN ==================== */
.kahraman { position: relative; overflow: hidden; }
.kahraman::before {  /* aurora */
  content: ""; position: absolute; inset: -20% -10%; pointer-events: none;
  background:
    radial-gradient(46% 42% at 82% 6%, rgb(46 230 192 / .17), transparent 65%),
    radial-gradient(38% 40% at 8% 88%, rgb(56 189 248 / .13), transparent 60%),
    radial-gradient(26% 30% at 30% 12%, rgb(231 154 78 / .07), transparent 60%);
}
.kahraman::after {  /* ince ızgara */
  content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .5;
  background-image:
    linear-gradient(rgb(148 190 210 / .05) 1px, transparent 1px),
    linear-gradient(90deg, rgb(148 190 210 / .05) 1px, transparent 1px);
  background-size: 52px 52px;
  mask-image: radial-gradient(115% 85% at 55% 0%, #000 35%, transparent 80%);
}
.kahraman .kapsayici {
  position: relative; z-index: 2; display: grid; grid-template-columns: 1.02fr .98fr;
  gap: 56px; align-items: center; padding: 84px 24px 96px;
}
@media (max-width: 920px) { .kahraman .kapsayici { grid-template-columns: 1fr; gap: 56px; padding: 56px 24px 72px; } }
.kahraman h1 {
  font-size: clamp(2.3rem, 5vw, 3.8rem); font-weight: 640; margin: 20px 0 20px; color: #f4fbfd;
}
.kahraman h1 .vurgu { background: var(--grad-metin); -webkit-background-clip: text; background-clip: text; color: transparent; }
.kahraman .giris { font-size: clamp(1.02rem, 1.5vw, 1.19rem); color: var(--soluk); max-width: 560px; margin: 0 0 32px; }
.hero-aksiyon { display: flex; flex-wrap: wrap; gap: 14px; align-items: center; }
.hero-mikro { margin-top: 18px; font-size: 13.5px; color: var(--soluk-2); display: flex; align-items: center; gap: 8px; }
.hero-mikro svg { color: var(--yesil); flex: 0 0 auto; }

/* Hero istatistik şeridi */
.hero-sayilar { display: flex; gap: 34px; margin-top: 40px; flex-wrap: wrap; }
.hero-sayi .deger {
  font-family: var(--f-baslik); font-size: 28px; font-weight: 700; color: #fff;
  letter-spacing: -.02em; font-variant-numeric: tabular-nums; display: flex; align-items: baseline; gap: 2px;
}
.hero-sayi .deger .art { color: var(--nane); font-size: 20px; }
.hero-sayi .etiket { font-size: 12.5px; color: var(--soluk-2); font-weight: 550; margin-top: 2px; }

/* ---------- 3B sahne (sürüklenebilir) ---------- */
.sahne { perspective: 1200px; position: relative; touch-action: pan-y; user-select: none; }
.sahne3d {
  position: relative; transform-style: preserve-3d;
  transform: rotateX(var(--rx, 8deg)) rotateY(var(--ry, -14deg));
  transition: transform .5s cubic-bezier(.2, .7, .2, 1); cursor: grab;
}
.sahne3d.tutuldu { transition: none; cursor: grabbing; }
.sahne.suzul .sahne3d { animation: sahneSuzul 9s ease-in-out infinite; }
@keyframes sahneSuzul {
  0%, 100% { transform: rotateX(var(--rx, 8deg)) rotateY(var(--ry, -14deg)) translateY(0); }
  50% { transform: rotateX(var(--rx, 8deg)) rotateY(var(--ry, -14deg)) translateY(-12px); }
}
/* Katman 0: harita tabanı */
.s-harita {
  position: relative; border-radius: var(--r-3); overflow: hidden;
  background: linear-gradient(150deg, #0e1e2a, #0a1520 60%, #0c1a26);
  border: 1px solid var(--cizgi-2); box-shadow: var(--golge-3);
  aspect-ratio: 10 / 8.6;
}
.s-harita svg { width: 100%; height: 100%; display: block; }
/* Katman 1: rapor kartı */
.s-kart {
  position: absolute; left: -6%; bottom: -9%; width: 76%;
  background: rgb(14 26 36 / .96);
  border: 1px solid var(--cizgi-2); border-radius: var(--r-2);
  box-shadow: var(--golge-3), inset 0 1px 0 rgb(255 255 255 / .06);
  padding: 18px; transform: translateZ(56px);
}
.s-kart .m-ust { display: flex; align-items: center; justify-content: space-between; margin-bottom: 11px; }
.s-kart .m-baslik { font-family: var(--f-baslik); font-weight: 600; font-size: 13.5px; color: #fff; }
.s-kart .m-no { font-size: 11px; color: var(--soluk-2); }
.m-bulgu {
  display: flex; align-items: center; gap: 9px; padding: 8px 11px; border-radius: 10px;
  margin: 6px 0; font-size: 12.8px; font-weight: 550;
}
.m-bulgu .im { width: 8px; height: 8px; border-radius: 50%; flex: 0 0 auto; }
.m-bulgu.kirmizi { background: var(--kirmizi-bg); color: var(--kirmizi); border: 1px solid var(--kirmizi-cizgi); } .m-bulgu.kirmizi .im { background: var(--kirmizi); }
.m-bulgu.sari { background: var(--sari-bg); color: var(--sari); border: 1px solid var(--sari-cizgi); } .m-bulgu.sari .im { background: var(--sari); }
.m-bulgu.yesil { background: var(--yesil-bg); color: var(--yesil); border: 1px solid var(--yesil-cizgi); } .m-bulgu.yesil .im { background: var(--yesil); }
.s-kart .m-aralik {
  margin-top: 11px; padding-top: 11px; border-top: 1px dashed var(--cizgi-2);
  display: flex; justify-content: space-between; align-items: baseline;
}
.s-kart .m-aralik b { font-family: var(--f-baslik); font-size: 17px; color: var(--nane); letter-spacing: -.01em; }
.s-kart .m-aralik span { font-size: 10.5px; color: var(--soluk-2); }
/* Hero kartı — canlı tarama satırları (m-tara): iki parçalı satır, m-bulgu yerine */
.s-kart .m-tara { list-style: none; margin: 0 0 11px; padding: 0; display: flex; flex-direction: column; gap: 7px; }
.s-kart .m-tara li { display: flex; align-items: baseline; gap: 8px; font-size: 12px; line-height: 1.3;
  opacity: 0; transform: translateY(4px); transition: opacity .45s ease, transform .45s ease; }
.s-kart .m-tara li.gorundu { opacity: 1; transform: none; }
.s-kart .m-tara .mk { flex: 0 0 auto; color: var(--nane); font-weight: 700; }
.s-kart .m-tara .ad { flex: 0 0 auto; color: var(--soluk); font-weight: 500; }
.s-kart .m-tara .nokta-ara { flex: 1 1 auto; align-self: center; border-bottom: 1px dotted var(--cizgi-2); min-width: 10px; }
.s-kart .m-tara .snc { flex: 0 0 auto; font-family: var(--f-baslik); font-weight: 600; white-space: nowrap; color: #c9dde6; }
.s-kart .m-tara .snc.sari { color: var(--sari); }
.s-kart .m-tara .snc.kirmizi { color: var(--kirmizi); }
.s-kart .m-tara .snc.yesil { color: var(--yesil); }
.s-kart .m-tara .snc.ak { color: var(--cam); }
.s-kart .m-tara .snc.duz { color: #c9dde6; }
/* Katman 2: yüzen çipler */
.s-cip {
  position: absolute; padding: 8px 14px; border-radius: var(--r-hap);
  font-size: 12px; font-weight: 650; display: flex; align-items: center; gap: 7px;
  box-shadow: var(--golge-2); white-space: nowrap;
}
.s-cip.ai {
  top: -16px; right: 6%; transform: translateZ(90px);
  background: rgb(9 26 24 / .88); color: var(--nane); border: 1px solid rgb(46 230 192 / .45);
}
.s-cip.ai .nokta { width: 7px; height: 7px; border-radius: 50%; background: var(--nane); animation: nabiz 2.4s infinite; }
.s-cip.sit {
  top: 26%; left: -9%; transform: translateZ(74px);
  background: rgb(40 15 14 / .88); color: var(--kirmizi); border: 1px solid var(--kirmizi-cizgi);
}
.s-cip.deger {
  bottom: 20%; right: -7%; transform: translateZ(82px);
  background: rgb(10 26 22 / .88); color: var(--yesil); border: 1px solid var(--yesil-cizgi);
}
.sahne-ipucu {
  position: absolute; left: 50%; bottom: -44px; transform: translateX(-50%);
  font-size: 12px; color: var(--soluk-2); display: flex; align-items: center; gap: 7px; white-space: nowrap;
}
.sahne-ipucu svg { color: var(--nane); }
.parselYol { stroke-dasharray: 7 7; animation: cizgiAk 7s linear infinite; }
@keyframes cizgiAk { to { stroke-dashoffset: -140; } }
.term-satir .duz { color: #c9dde6; }
.term-satir .on { color: var(--soluk-2); }
@media (max-width: 920px) {
  .s-cip.sit { left: 2%; } .s-cip.deger { right: 2%; }
  .s-kart { left: 4%; width: 82%; bottom: -7%; }
  .sahne { margin-bottom: 46px; }
}
@media (max-width: 640px) {
  /* dar ekranda kart haritanın ALTINA iner, harita görünür kalır */
  .s-kart { position: relative; left: 0; bottom: 0; width: 100%; margin-top: -22px; transform: translateZ(40px); }
  .s-cip.deger { display: none; }
  .s-cip.sit { top: 12px; left: 10px; }
  .sahne-ipucu { position: static; transform: none; display: flex; justify-content: center; margin-top: 14px; }
  .sahne { margin-bottom: 8px; }
}

/* ==================== KAYNAK ŞERİDİ (marquee) ==================== */
.kaynak-serit { border-block: 1px solid var(--cizgi); background: var(--gece-1); overflow: hidden; }
.kaynak-serit .baslik {
  text-align: center; font-size: 11.5px; letter-spacing: .18em; text-transform: uppercase;
  color: var(--soluk-2); font-weight: 700; padding: 18px 24px 0;
}
.serit-sar { position: relative; padding: 14px 0 20px; mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); }
.serit-ic { display: flex; gap: 56px; width: max-content; animation: kaydir 30s linear infinite; }
.serit-sar:hover .serit-ic { animation-play-state: paused; }
@keyframes kaydir { to { transform: translateX(-50%); } }
.serit-ic .kaynak {
  display: flex; align-items: center; gap: 9px; font-family: var(--f-baslik);
  font-weight: 600; font-size: 15px; color: var(--soluk); white-space: nowrap;
}
.serit-ic .kaynak::before { content: ""; width: 7px; height: 7px; border-radius: 2px; background: var(--grad-marka); transform: rotate(45deg); }

/* ==================== BÖLÜMLER ==================== */
.bolum { padding: 96px 0; position: relative; }
.bolum-basi { text-align: center; max-width: 700px; margin: 0 auto 56px; }
.bolum-basi .etk {
  display: inline-flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 700;
  letter-spacing: .16em; text-transform: uppercase; color: var(--nane);
  padding: 6px 14px; border: 1px solid rgb(46 230 192 / .25); border-radius: var(--r-hap);
  background: rgb(46 230 192 / .06);
}
.bolum-basi h2 { font-size: clamp(1.7rem, 3.2vw, 2.5rem); margin: 18px 0 12px; }
.bolum-basi p { font-size: 16.5px; color: var(--soluk); margin: 0; }

/* ---------- Nasıl çalışır: bağlantılı adımlar ---------- */
.adim-izgara { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; position: relative; }
@media (max-width: 860px) { .adim-izgara { grid-template-columns: 1fr 1fr; } }
@media (max-width: 520px) { .adim-izgara { grid-template-columns: 1fr; } }
.adim-kart {
  background: var(--gece-2); border: 1px solid var(--cizgi); border-radius: var(--r-2);
  padding: 26px 22px; position: relative; transition: var(--gecis); overflow: hidden;
}
.adim-kart::before {
  content: ""; position: absolute; inset: 0 0 auto 0; height: 2px;
  background: var(--grad-marka); opacity: 0; transition: var(--gecis);
}
.adim-kart:hover { transform: translateY(-5px); border-color: var(--cizgi-2); box-shadow: var(--golge-2); }
.adim-kart:hover::before { opacity: 1; }
.adim-kart .sayi {
  font-family: var(--f-baslik); position: absolute; top: 14px; right: 18px;
  font-size: 44px; font-weight: 700; color: rgb(148 190 210 / .1); line-height: 1;
}
.adim-kart .ikon {
  width: 46px; height: 46px; border-radius: 13px; display: grid; place-items: center;
  background: rgb(56 189 248 / .1); color: var(--cam); margin-bottom: 16px;
  border: 1px solid rgb(56 189 248 / .2);
}
.adim-kart h3 { font-size: 17px; margin: 0 0 6px; }
.adim-kart p { font-size: 14px; color: var(--soluk); margin: 0; }

/* ---------- Canlı analiz (terminal) ---------- */
.canli-sar { display: grid; grid-template-columns: 1fr 1.1fr; gap: 52px; align-items: center; }
@media (max-width: 920px) { .canli-sar { grid-template-columns: 1fr; gap: 36px; } }
.canli-metin h2 { font-size: clamp(1.6rem, 2.8vw, 2.2rem); }
.canli-metin p { color: var(--soluk); font-size: 16px; }
.canli-metin ul { list-style: none; padding: 0; margin: 20px 0 0; }
.canli-metin li { display: flex; align-items: flex-start; gap: 11px; margin: 12px 0; font-size: 15px; color: var(--metin); }
.canli-metin li svg { flex: 0 0 auto; margin-top: 4px; color: var(--nane); }
.term {
  background: #071019; border: 1px solid var(--cizgi-2); border-radius: var(--r-2);
  box-shadow: var(--golge-3), 0 0 60px -20px rgb(46 230 192 / .25); overflow: hidden;
}
.term-bas {
  display: flex; align-items: center; gap: 8px; padding: 13px 18px;
  border-bottom: 1px solid var(--cizgi); background: rgb(255 255 255 / .02);
}
.term-bas .top { width: 11px; height: 11px; border-radius: 50%; }
.term-bas .top:nth-child(1) { background: #ff6058; } .term-bas .top:nth-child(2) { background: #ffbd2e; } .term-bas .top:nth-child(3) { background: #28ca41; }
.term-bas .term-ad { margin-left: 8px; font-size: 12px; color: var(--soluk-2); font-weight: 600; }
.term-govde { padding: 20px 22px 24px; font-size: 13.6px; line-height: 2.05; min-height: 300px;
  font-family: ui-monospace, "Cascadia Code", Consolas, monospace; }
.term-satir { display: flex; gap: 10px; align-items: baseline; opacity: 0; transform: translateY(4px); transition: opacity .4s ease, transform .4s ease; }
.term-satir.gorundu { opacity: 1; transform: none; }
.term-satir .on { color: var(--soluk-2); flex: 0 0 auto; }
.term-satir .ok { color: var(--yesil); }
.term-satir .uyar { color: var(--sari); }
.term-satir .kritik { color: var(--kirmizi); }
.term-satir .bilgi { color: var(--cam); }
.term-satir .sonuc { color: var(--nane); font-weight: 700; }
.term-imlec { display: inline-block; width: 8px; height: 15px; background: var(--nane); vertical-align: -2px; animation: imlec 1s steps(2) infinite; }
@keyframes imlec { 50% { opacity: 0; } }

/* ---------- Bento ızgara ---------- */
.bento { display: grid; grid-template-columns: repeat(6, 1fr); gap: 16px; }
.bento-kart {
  background: var(--gece-2); border: 1px solid var(--cizgi); border-radius: var(--r-2);
  padding: 26px; position: relative; overflow: hidden; transition: var(--gecis);
  grid-column: span 2;
}
.bento-kart.genis { grid-column: span 4; }
.bento-kart.orta { grid-column: span 3; }
@media (max-width: 920px) { .bento-kart, .bento-kart.genis, .bento-kart.orta { grid-column: span 6; } }
.bento-kart:hover { border-color: var(--cizgi-2); transform: translateY(-4px); box-shadow: var(--golge-2); }
.bento-kart::after {
  content: ""; position: absolute; inset: 0; pointer-events: none; opacity: 0; transition: opacity .3s;
  background: radial-gradient(60% 70% at 85% 0%, rgb(46 230 192 / .09), transparent 70%);
}
.bento-kart:hover::after { opacity: 1; }
.bento-kart .ikon {
  width: 44px; height: 44px; border-radius: 12px; display: grid; place-items: center; margin-bottom: 16px;
  background: rgb(46 230 192 / .09); color: var(--nane); border: 1px solid rgb(46 230 192 / .22);
}
.bento-kart h3 { font-size: 17.5px; margin: 0 0 7px; }
.bento-kart p { font-size: 14px; color: var(--soluk); margin: 0; }
.bento-kart .mini { margin-top: 18px; }
/* mini görseller */
.mini-aralik { position: relative; height: 46px; }
.mini-aralik .bant { position: absolute; inset: 18px 0 auto; height: 8px; border-radius: 6px;
  background: linear-gradient(90deg, var(--yesil), var(--sari) 55%, var(--kirmizi)); opacity: .85; }
.mini-aralik .aralik-vurgu { position: absolute; top: 14px; left: 26%; width: 34%; height: 16px; border-radius: 8px;
  border: 2px solid #fff; box-shadow: 0 0 14px rgb(255 255 255 / .35); }
.mini-aralik .im { position: absolute; top: -6px; left: 47%; font-size: 11px; color: #fff; transform: translateX(-50%); font-weight: 700; }
.mini-bar { display: flex; align-items: flex-end; gap: 7px; height: 54px; }
.mini-bar i { flex: 1; border-radius: 4px 4px 0 0; background: linear-gradient(180deg, var(--cam), rgb(56 189 248 / .25)); }
.mini-kural { display: flex; flex-wrap: wrap; gap: 7px; }
.mini-kural b {
  font-size: 11px; font-weight: 650; padding: 4px 10px; border-radius: var(--r-hap);
  background: rgb(255 255 255 / .05); border: 1px solid var(--cizgi); color: var(--soluk);
}
.mini-kural b.k { color: var(--kirmizi); border-color: var(--kirmizi-cizgi); background: var(--kirmizi-bg); }
.mini-kural b.s { color: var(--sari); border-color: var(--sari-cizgi); background: var(--sari-bg); }

/* ---------- Örnek rapor ---------- */
.ornek-sar { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; }
@media (max-width: 880px) { .ornek-sar { grid-template-columns: 1fr; gap: 30px; } }
.ornek-metin h2 { font-size: clamp(1.6rem, 2.8vw, 2.2rem); }
.ornek-metin h2 .kirmizi-vurgu { color: var(--kirmizi); }
.ornek-metin p { color: var(--soluk); font-size: 16px; }
.ornek-metin ul { list-style: none; padding: 0; margin: 18px 0 28px; }
.ornek-metin li { display: flex; align-items: flex-start; gap: 10px; margin: 11px 0; font-size: 15px; }
.ornek-metin li svg { flex: 0 0 auto; margin-top: 3px; color: var(--nane); }
.ornekRapor {
  background: var(--gece-2); border: 1px solid var(--cizgi-2); border-radius: var(--r-2);
  box-shadow: var(--golge-3); padding: 24px; position: relative;
}
.ornekRapor::before {
  content: ""; position: absolute; inset: -1px; border-radius: inherit; padding: 1px; pointer-events: none;
  background: linear-gradient(140deg, rgb(46 230 192 / .4), transparent 40%, transparent 65%, rgb(56 189 248 / .3));
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor; mask-composite: exclude;
}
.ornekBaslik {
  display: flex; align-items: center; justify-content: space-between;
  font-family: var(--f-baslik); font-weight: 600; color: #fff; margin-bottom: 14px;
  padding-bottom: 13px; border-bottom: 1px solid var(--cizgi);
}
.ornekBaslik .rozet-ai { font-size: 11px; padding: 4px 10px; }
.bulguListe { list-style: none; margin: 0 0 16px; padding: 0; }
.bulgu { display: flex; align-items: center; gap: 11px; padding: 11px 13px; border-radius: var(--r-1); margin: 8px 0; font-size: 14px; font-weight: 550; }
.bulgu::before { content: ""; width: 8px; height: 8px; border-radius: 50%; flex: 0 0 auto; }
.bulgu.kirmizi { background: var(--kirmizi-bg); color: var(--kirmizi); border: 1px solid var(--kirmizi-cizgi); } .bulgu.kirmizi::before { background: var(--kirmizi); }
.bulgu.sari { background: var(--sari-bg); color: var(--sari); border: 1px solid var(--sari-cizgi); } .bulgu.sari::before { background: var(--sari); }
.bulgu.yesil { background: var(--yesil-bg); color: var(--yesil); border: 1px solid var(--yesil-cizgi); } .bulgu.yesil::before { background: var(--yesil); }
.ornekYapilacak { background: rgb(255 255 255 / .03); border: 1px solid var(--cizgi); border-radius: var(--r-1); padding: 15px 17px; }
.ornekYapilacak b { color: var(--nane); font-size: 13.5px; letter-spacing: .02em; }
.ornekYapilacak ul { margin: 9px 0 0; padding-left: 18px; font-size: 13.8px; color: var(--soluk); }
.ornekYapilacak li { margin: 5px 0; }

/* ---------- Karşılaştırma ---------- */
.kiyas { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; max-width: 900px; margin: 0 auto; }
@media (max-width: 760px) { .kiyas { grid-template-columns: 1fr; } }
.kiyas-kart { border-radius: var(--r-2); padding: 28px; border: 1px solid var(--cizgi); }
.kiyas-kart.sira { background: var(--gece-1); }
.kiyas-kart.biz { background: linear-gradient(160deg, rgb(46 230 192 / .07), rgb(56 189 248 / .04)); border-color: rgb(46 230 192 / .3); box-shadow: 0 0 50px -18px rgb(46 230 192 / .3); }
.kiyas-kart h3 { font-size: 15px; margin-bottom: 16px; display: flex; align-items: center; gap: 9px; }
.kiyas-kart.sira h3 { color: var(--soluk); }
.kiyas-kart.biz h3 .marka-mini { background: var(--grad-metin); -webkit-background-clip: text; background-clip: text; color: transparent; }
.kiyas-kart ul { list-style: none; margin: 0; padding: 0; }
.kiyas-kart li { display: flex; gap: 10px; align-items: flex-start; padding: 8px 0; font-size: 14.2px; }
.kiyas-kart.sira li { color: var(--soluk-2); }
.kiyas-kart.biz li { color: var(--metin); }
.kiyas-kart li svg { flex: 0 0 auto; margin-top: 4px; }
.kiyas-kart.sira li svg { color: var(--soluk-2); }
.kiyas-kart.biz li svg { color: var(--nane); }

/* ---------- SSS ---------- */
.sss-liste { max-width: 780px; margin: 0 auto; }
details.sss {
  background: var(--gece-2); border: 1px solid var(--cizgi); border-radius: var(--r-1);
  padding: 4px 22px; margin-bottom: 12px; transition: var(--gecis);
}
details.sss:hover { border-color: var(--cizgi-2); }
details.sss[open] { border-color: rgb(46 230 192 / .35); box-shadow: 0 0 34px -14px rgb(46 230 192 / .3); }
details.sss summary {
  cursor: pointer; font-weight: 600; color: #fff; padding: 17px 0; list-style: none;
  display: flex; justify-content: space-between; align-items: center; gap: 12px; font-size: 15.5px;
}
details.sss summary::-webkit-details-marker { display: none; }
details.sss summary::after {
  content: "+"; font-family: var(--f-baslik); font-size: 22px; font-weight: 400;
  color: var(--nane); transition: var(--gecis); line-height: 1;
}
details.sss[open] summary::after { transform: rotate(45deg); }
details.sss p { margin: 0 0 18px; font-size: 14.8px; color: var(--soluk); }
details.sss p b { color: var(--metin); }

/* ---------- CTA şeridi ---------- */
.cta-serit { position: relative; overflow: hidden; text-align: center; padding: 110px 0; }
.cta-serit::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background:
    radial-gradient(50% 65% at 50% 110%, rgb(46 230 192 / .16), transparent 70%),
    radial-gradient(40% 50% at 80% -10%, rgb(56 189 248 / .1), transparent 65%);
}
.cta-serit .kapsayici { position: relative; }
.cta-serit h2 { font-size: clamp(1.9rem, 3.6vw, 2.8rem); }
.cta-serit p { color: var(--soluk); font-size: 17px; max-width: 540px; margin: 0 auto 32px; }

/* ==================== FOOTER ==================== */
.ayak { background: var(--gece-1); border-top: 1px solid var(--cizgi); color: var(--soluk); padding: 60px 0 34px; }
.ayak-izgara { display: grid; grid-template-columns: 1.5fr 1fr 1fr; gap: 34px; margin-bottom: 36px; }
@media (max-width: 720px) { .ayak-izgara { grid-template-columns: 1fr; gap: 26px; } }
.ayak .marka { margin-bottom: 12px; font-size: 18px; }
.ayak h4 { color: #d7e7ec; font-size: 12px; text-transform: uppercase; letter-spacing: .12em; margin: 0 0 14px; }
.ayak a { color: var(--soluk); display: block; margin: 9px 0; font-size: 14px; transition: var(--gecis); }
.ayak a:hover { color: #fff; text-decoration: none; }
.ayak .aciklama { font-size: 13.8px; max-width: 330px; line-height: 1.7; color: var(--soluk-2); }
.ayak-alt { border-top: 1px solid var(--cizgi); padding-top: 22px; font-size: 12.3px; color: var(--soluk-2); line-height: 1.75; }
.ayak-alt a { display: inline; margin: 0; color: var(--soluk); }

/* ==================== UYGULAMA EKRANI (S2–S5) ==================== */
.uyg-govde { background: var(--gece-0); }
.uyg-govde::before {
  content: ""; position: fixed; inset: 0; pointer-events: none; z-index: 0;
  background:
    radial-gradient(40% 34% at 88% -4%, rgb(46 230 192 / .08), transparent 60%),
    radial-gradient(34% 30% at 2% 100%, rgb(56 189 248 / .06), transparent 60%);
}
.uyg-baslik {
  position: relative; z-index: 1; padding: 30px 0 14px;
  display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; flex-wrap: wrap;
}
.uyg-baslik h1 { font-size: 26px; margin: 0 0 4px; }
.uyg-baslik p { color: var(--soluk); margin: 0; font-size: 14.5px; }
.uyg-kaynaklar { display: flex; gap: 8px; flex-wrap: wrap; }
.uyg-kaynaklar .cip::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--yesil); }
@media (max-width: 780px) { .uyg-kaynaklar { display: none; } }

.yerlesim {
  position: relative; z-index: 1;
  display: grid; gap: 18px; grid-template-columns: 330px 1fr 372px;
  max-width: 1440px; margin: 0 auto; padding: 16px 24px 56px;
}
@media (max-width: 1120px) { .yerlesim { grid-template-columns: 310px 1fr; } .sag { grid-column: 1 / -1; } }
@media (max-width: 780px) { .yerlesim { grid-template-columns: 1fr; } }

.panel {
  background: var(--gece-2); border: 1px solid var(--cizgi); border-radius: var(--r-2);
  padding: 24px; box-shadow: var(--golge-1);
}
.sag .panel { animation: belir .4s ease; }
@keyframes belir { from { opacity: 0; transform: translateY(12px); } }
.panel h2 { font-size: 16.5px; margin: 0 0 18px; display: flex; align-items: center; gap: 10px; color: #fff; }
.adimNo {
  width: 25px; height: 25px; flex: 0 0 auto; border-radius: 8px; display: inline-grid; place-items: center;
  background: var(--grad-marka); color: #03231c; font-family: var(--f-baslik);
  font-size: 13px; font-weight: 700;
}

label { display: block; margin-bottom: 15px; font-size: 12.5px; font-weight: 600; color: var(--soluk); letter-spacing: .01em; }
select, input[type=text], input[type=email], input:not([type]) {
  width: 100%; margin-top: 6px; padding: 12px 14px; border: 1px solid var(--cizgi-2); border-radius: var(--r-1);
  font: inherit; font-weight: 500; color: var(--metin); background: var(--gece-3); min-height: 46px; transition: var(--gecis);
}
select:focus, input:focus {
  border-color: var(--nane); outline: none;
  box-shadow: 0 0 0 3px rgb(46 230 192 / .18); background: var(--gece-4);
}
select:disabled { background: var(--gece-1); color: var(--soluk-2); border-color: var(--cizgi); }
input::placeholder { color: var(--soluk-2); }
.yanyana { display: grid; grid-template-columns: 1fr 1fr; gap: 13px; }
.ipucu { font-size: 12.5px; color: var(--soluk-2); margin: 8px 0 0; }
.ipucu a { color: var(--cam); }

.hata {
  display: flex; align-items: flex-start; gap: 9px; color: var(--kirmizi); font-size: 13.5px;
  font-weight: 550; margin-top: 12px; background: var(--kirmizi-bg);
  border: 1px solid var(--kirmizi-cizgi); border-radius: var(--r-1); padding: 11px 13px; line-height: 1.5;
}
.hata::before {
  content: "!"; flex: 0 0 auto; width: 17px; height: 17px; border-radius: 50%; margin-top: 1px;
  background: var(--kirmizi); color: #240b09; font-weight: 800; font-size: 12px;
  display: inline-grid; place-items: center;
}

/* Harita çalışma alanı */
.haritaKap {
  position: relative; border-radius: var(--r-2); overflow: hidden;
  border: 1px solid var(--cizgi-2); min-height: 560px; background: var(--gece-3);
  box-shadow: var(--golge-2);
}
#harita { width: 100%; height: 100%; min-height: 560px; background: #0d1721; }
.haritaIpucu {
  position: absolute; z-index: 500; top: 12px; right: 12px; pointer-events: none;
  display: inline-flex; align-items: center; gap: 7px;
  background: rgb(5 10 16 / .82); backdrop-filter: blur(8px);
  border: 1px solid var(--cizgi-2); border-radius: var(--r-hap);
  padding: 8px 14px; font-size: 12.5px; font-weight: 600; color: var(--metin); box-shadow: var(--golge-1);
}
.haritaIpucu svg { color: var(--nane); }
@media (max-width: 780px) { .haritaKap, #harita { min-height: 400px; } }
/* Leaflet koyu tema uyumu */
.leaflet-container { font-family: var(--f-govde); }
.leaflet-bar { border: 1px solid var(--cizgi-2) !important; box-shadow: var(--golge-1) !important; }
.leaflet-bar a {
  background: rgb(8 17 25 / .92) !important; color: var(--metin) !important;
  border-bottom: 1px solid var(--cizgi) !important;
}
.leaflet-bar a:hover { background: var(--gece-4) !important; }
.leaflet-control-attribution {
  background: rgb(5 10 16 / .78) !important; color: var(--soluk-2) !important;
  font-size: 10px !important; backdrop-filter: blur(6px);
}
.leaflet-control-attribution a { color: var(--soluk) !important; }
/* Uydu karoları: hafif doygunluk + kontrast (Gece Haritası "tuval" hissi) */
.leaflet-tile { filter: saturate(1.14) contrast(1.05) brightness(1.02); }
/* Katman değiştirici (Uydu/Sokak) koyu kimlik */
.leaflet-control-layers {
  background: rgb(8 17 25 / .92) !important; border: 1px solid var(--cizgi-2) !important;
  border-radius: 12px !important; color: var(--metin) !important; box-shadow: var(--golge-1) !important;
}
.leaflet-control-layers-expanded { padding: 8px 12px !important; font: 600 12.5px var(--f-govde) !important; }
.leaflet-control-layers label { margin: 3px 0 !important; display: block; }
.leaflet-control-layers input { accent-color: var(--nane); margin-right: 6px; }
/* Harita çerçevesi: iç vinyet — kenarlarda yumuşak koyulaşma (doygun görünüm) */
.haritaKap::after {
  content: ""; position: absolute; inset: 0; pointer-events: none; z-index: 450;
  border-radius: inherit; box-shadow: inset 0 0 44px rgb(3 8 14 / .55);
}

.sag { display: flex; flex-direction: column; gap: 18px; }

/* Boş durum */
#bosDurum { text-align: center; padding: 36px 26px; border-style: dashed; border-width: 1.5px; border-color: var(--cizgi-2); box-shadow: none; background: rgb(12 24 34 / .5); }
#bosDurum .bosIkon {
  width: 58px; height: 58px; margin: 0 auto 14px; border-radius: 18px; display: grid; place-items: center;
  background: rgb(46 230 192 / .08); color: var(--nane); border: 1px solid rgb(46 230 192 / .22);
}
#bosDurum h3 { font-size: 16.5px; margin: 0 0 6px; }
#bosDurum p { font-size: 13.5px; color: var(--soluk); margin: 0 auto 16px; max-width: 300px; }
#bosDurum .bosAdimlar { list-style: none; margin: 0; padding: 0; text-align: left; display: inline-block; }
#bosDurum .bosAdimlar li { font-size: 13px; color: var(--soluk); padding: 5px 0 5px 25px; position: relative; }
#bosDurum .bosAdimlar li::before {
  content: "✓"; position: absolute; left: 0; top: 6px; width: 16px; height: 16px; border-radius: 50%;
  background: var(--yesil-bg); border: 1px solid var(--yesil-cizgi); color: var(--yesil);
  font-size: 10px; font-weight: 800; display: grid; place-items: center;
}
#bosDurum .bosYukleniyor { display: none; }
#bosDurum.yukleniyor .bosIkon, #bosDurum.yukleniyor h3, #bosDurum.yukleniyor p, #bosDurum.yukleniyor .bosAdimlar { display: none; }
#bosDurum.yukleniyor .bosYukleniyor {
  display: flex; align-items: center; justify-content: center; gap: 11px; padding: 28px 0;
  font-size: 14.5px; font-weight: 650; color: var(--nane);
}
.spinner {
  width: 20px; height: 20px; border-radius: 50%; flex: 0 0 auto;
  border: 2.5px solid rgb(46 230 192 / .2); border-top-color: var(--nane); animation: don .8s linear infinite;
}
@keyframes don { to { transform: rotate(360deg); } }
button.birincil.mesgul { pointer-events: none; opacity: .85; }
button.birincil.mesgul::before {
  content: ""; width: 16px; height: 16px; border-radius: 50%; flex: 0 0 auto;
  border: 2px solid rgb(3 35 28 / .35); border-top-color: #03231c; animation: don .7s linear infinite;
}

/* Ön özet */
.kunye { font-family: var(--f-baslik); font-weight: 600; color: #fff; margin-bottom: 12px; font-size: 14.5px; letter-spacing: -.01em; }
.damga { font-size: 12px; color: var(--soluk-2); margin-bottom: 4px; font-variant-numeric: tabular-nums; }
dl { margin: 0; }
dl div { display: flex; justify-content: space-between; gap: 12px; padding: 9px 0; border-bottom: 1px dashed var(--cizgi); }
dt { color: var(--soluk-2); font-size: 13px; }
dd { margin: 0; font-weight: 600; text-align: right; font-size: 13.5px; color: var(--metin); }
.durumSatiri {
  margin: 10px 0; padding: 11px 13px; border-radius: var(--r-1); border: 1px solid var(--cizgi);
  background: var(--gece-3); font-size: 13.3px; font-weight: 500; display: flex; gap: 9px; align-items: flex-start;
  color: var(--soluk);
}
.durumSatiri::before { content: "•"; font-weight: 700; }
.durumSatiri.riskli { background: var(--kirmizi-bg); border-color: var(--kirmizi-cizgi); color: var(--kirmizi); font-weight: 600; }
.durumSatiri.dikkat { background: var(--sari-bg); border-color: var(--sari-cizgi); color: var(--sari); }
.durumSatiri.temiz { background: var(--yesil-bg); border-color: var(--yesil-cizgi); color: var(--yesil); }
.durumSatiri.bekliyor {
  color: var(--soluk);
  background: linear-gradient(100deg, var(--gece-3) 40%, var(--gece-4) 50%, var(--gece-3) 60%);
  background-size: 220% 100%; animation: parilti 1.6s ease-in-out infinite;
}
.durumSatiri.bekliyor::before {
  content: ""; width: 13px; height: 13px; border-radius: 50%; flex: 0 0 auto; margin-top: 3px;
  border: 2px solid var(--soluk-2); border-top-color: transparent; animation: don .8s linear infinite;
}
@keyframes parilti { 0% { background-position: 120% 0; } 100% { background-position: -120% 0; } }
.yasal { font-size: 11.3px; color: var(--soluk-2); margin-top: 14px; line-height: 1.6; }

/* S4 form */
.grup { border: 1px solid var(--cizgi); border-radius: var(--r-1); padding: 14px 16px; margin: 0 0 16px; background: rgb(255 255 255 / .02); }
.grup legend { font-size: 12.5px; color: var(--nane); font-weight: 700; padding: 0 7px; letter-spacing: .02em; }
.opsiyonel { color: var(--soluk-2); font-weight: 500; }
label.onay { display: flex; align-items: flex-start; gap: 10px; font-size: 13px; color: var(--soluk); font-weight: 450; line-height: 1.55; }
label.onay input { width: auto; min-height: 0; margin-top: 3px; flex: 0 0 auto; accent-color: var(--nane); }
label.onay a { color: var(--cam); }
button.birincil { width: 100%; }

/* S5 üretim */
.ilerlemeSar { display: flex; align-items: center; gap: 12px; margin: 14px 0; }
.ilerleme { flex: 1; background: var(--gece-3); border: 1px solid var(--cizgi); border-radius: var(--r-hap); height: 10px; overflow: hidden; }
.ilerlemeDolu { position: relative; height: 100%; width: 5%; border-radius: var(--r-hap); background: var(--grad-marka); transition: width .5s ease; overflow: hidden; }
.ilerlemeDolu::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(100deg, transparent 30%, rgb(255 255 255 / .5) 50%, transparent 70%);
  background-size: 220% 100%; animation: parilti 1.8s ease-in-out infinite;
}
.ilerlemeYuzde { font-family: var(--f-baslik); font-size: 13.5px; font-weight: 700; color: var(--nane); min-width: 44px; text-align: right; font-variant-numeric: tabular-nums; }
.adimListe { list-style: none; margin: 10px 0 0; padding: 0; }
.adimListe .adim { padding: 9px 0 9px 34px; font-size: 14px; color: var(--soluk-2); position: relative; }
.adimListe .adim::before {
  content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%);
  width: 20px; height: 20px; border-radius: 50%; box-sizing: border-box;
  border: 2px solid var(--cizgi-2); background: var(--gece-3);
  display: grid; place-items: center; font-size: 11px; font-weight: 800; line-height: 1;
}
.adimListe .adim:not(:last-child)::after {
  content: ""; position: absolute; left: 9px; top: calc(50% + 12px); height: calc(100% - 24px);
  width: 2px; background: var(--cizgi); border-radius: 1px;
}
.adimListe .adim.isleniyor { color: #fff; font-weight: 600; }
.adimListe .adim.isleniyor::before {
  border: 2.5px solid rgb(231 154 78 / .3); border-top-color: var(--bakir); animation: don .9s linear infinite;
}
.adimListe .adim.tamam { color: var(--metin); }
.adimListe .adim.tamam::before { content: "✓"; border-color: transparent; background: var(--yesil); color: #04231a; }
.adimListe .adim.tamam:not(:last-child)::after { background: rgb(74 222 157 / .4); }
.adimListe .adim.dead_letter { color: var(--kirmizi); font-weight: 600; }
.adimListe .adim.dead_letter::before { content: "✕"; border-color: transparent; background: var(--kirmizi); color: #240b09; }
.indirKart {
  margin-top: 18px; padding: 18px; border-radius: var(--r-1); text-align: center;
  background: var(--yesil-bg); border: 1px solid var(--yesil-cizgi);
}
.indirKart .indirBas {
  display: flex; align-items: center; justify-content: center; gap: 9px;
  font-family: var(--f-baslik); font-weight: 600; color: var(--yesil); font-size: 15px; margin-bottom: 12px;
}
.indirKart .indirBas::before {
  content: "✓"; width: 22px; height: 22px; border-radius: 50%; background: var(--yesil); color: #04231a;
  font-size: 13px; font-weight: 800; display: inline-grid; place-items: center;
}
.indirKart .ipucu { margin-top: 10px; }
.indirKart a.gorBtn { display: flex; width: 100%; }
.indirKart a.pdfBtn { display: flex; width: 100%; margin-top: 9px; min-height: 44px; }
a.indir { display: flex; margin-top: 0; background: linear-gradient(135deg, var(--yesil), #22a06b); color: #04231a; box-shadow: 0 10px 26px -8px rgb(74 222 157 / .4); }
a.indir:hover { transform: translateY(-2px); box-shadow: 0 14px 32px -8px rgb(74 222 157 / .55); text-decoration: none; }

/* ==================== RAPOR AKIŞI (tam ekran S4→S5) ==================== */
@property --yuzde { syntax: "<number>"; inherits: true; initial-value: 5; }

body.akisAcik { overflow: hidden; }
/* Kaplama açıkken arkada kalan backdrop-filter'lar kapatılır: zaten görünmezler
   ve tam-ekran katman + backdrop-filter bileşimi Chromium kompozitörünü
   kilitleyebiliyor (yazılım-render ortamında deterministik tekrarlandı). */
body.akisAcik .navbar,
body.akisAcik .haritaIpucu,
body.akisAcik .leaflet-control-attribution { backdrop-filter: none !important; }
.akis { position: fixed; inset: 0; z-index: 200; overflow-y: auto; }
.akis-fon {
  position: fixed; inset: 0;
  background:
    radial-gradient(44% 38% at 82% 0%, rgb(46 230 192 / .12), transparent 62%),
    radial-gradient(36% 34% at 4% 100%, rgb(56 189 248 / .1), transparent 60%),
    var(--gece-0);
}
.akis-ic {
  position: relative; z-index: 2; max-width: 1080px; margin: 0 auto;
  padding: 18px 24px 56px; min-height: 100%;
  display: flex; flex-direction: column;
}
.akis-bas { display: flex; align-items: center; gap: 16px; padding: 10px 0 22px; }
.akis-marka {
  display: flex; align-items: center; gap: 9px; font-family: var(--f-baslik);
  font-size: 17px; font-weight: 700; color: #fff; letter-spacing: -.02em;
}
.akis-marka .marka-logo { width: 26px; height: 26px; }
.akis-marka span:not(.marka-logo) { background: var(--grad-metin); -webkit-background-clip: text; background-clip: text; color: transparent; }
.akis-kunye {
  flex: 1; text-align: center; font-family: var(--f-baslik); font-size: 13.5px;
  font-weight: 600; color: var(--soluk); letter-spacing: .01em;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.akis-kapat {
  flex: 0 0 auto; margin-left: auto; width: 38px; height: 38px; border-radius: 12px; cursor: pointer;
  display: grid; place-items: center; font: inherit; color: var(--soluk);
  background: rgb(255 255 255 / .05); border: 1px solid var(--cizgi-2); transition: var(--gecis);
}
.akis-kapat:hover { color: #fff; border-color: rgb(255 255 255 / .35); background: rgb(255 255 255 / .1); }

.akis-kart {
  background: var(--gece-2); border: 1px solid var(--cizgi-2); border-radius: var(--r-3);
  box-shadow: 0 18px 48px -16px rgb(0 0 0 / .55), 0 0 44px -18px rgb(46 230 192 / .3);
  animation: akisGel .5s cubic-bezier(.2, .7, .2, 1); overflow: hidden; position: relative;
}
@keyframes akisGel { from { opacity: 0; transform: translateY(26px) scale(.985); } }

/* --- S4: talep --- */
#talepPanel.akis-kart { display: grid; grid-template-columns: 1fr 1.06fr; }
.akis-tanitim {
  padding: clamp(26px, 4vw, 46px);
  background:
    radial-gradient(70% 60% at 0% 0%, rgb(46 230 192 / .07), transparent 70%),
    rgb(255 255 255 / .015);
  border-right: 1px solid var(--cizgi);
}
.akis-tanitim h2 { font-size: clamp(1.45rem, 2.6vw, 1.9rem); margin: 16px 0 10px; }
.akis-aciklama { color: var(--soluk); font-size: 14.8px; margin: 0 0 20px; }
.akis-icerik { list-style: none; margin: 0 0 22px; padding: 0; }
.akis-icerik li { position: relative; padding: 7px 0 7px 30px; font-size: 14.2px; color: var(--metin); }
.akis-icerik li::before {
  content: "✓"; position: absolute; left: 0; top: 8px; width: 19px; height: 19px; border-radius: 50%;
  background: var(--yesil-bg); border: 1px solid var(--yesil-cizgi); color: var(--yesil);
  font-size: 11px; font-weight: 800; display: grid; place-items: center;
}
.akis-form { padding: clamp(26px, 4vw, 46px); }
.akis-form h3 { font-size: 16px; margin: 0 0 20px; color: #fff; }

/* --- S5: üretim --- */
.ilerleme-ust { position: absolute; inset: 0 0 auto 0; height: 3px; background: rgb(148 190 210 / .1); }
.ilerleme-ust .ilerlemeDolu { border-radius: 0; }
.uretim-sar {
  display: grid; grid-template-columns: 1fr 1fr; gap: clamp(26px, 4vw, 52px);
  padding: clamp(30px, 4.5vw, 52px); align-items: center;
}
.uretim-gorsel { text-align: center; }
.halkaSar { position: relative; width: 210px; height: 210px; margin: 6px auto 22px; }
.halkaSar::before {  /* dönen dış süs halkası */
  content: ""; position: absolute; inset: -14px; border-radius: 50%;
  border: 1.5px dashed rgb(46 230 192 / .3); animation: don 14s linear infinite;
}
.halka {
  position: absolute; inset: 0; border-radius: 50%;
  background: conic-gradient(from -90deg, var(--nane) calc(var(--yuzde) * 1%), rgb(148 190 210 / .12) 0);
  -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 15px), #000 calc(100% - 14px));
  mask: radial-gradient(farthest-side, transparent calc(100% - 15px), #000 calc(100% - 14px));
  transition: --yuzde .6s ease;
}
.halkaSar::after {  /* yumuşak parlama (filtre yerine ucuz radyal katman) */
  content: ""; position: absolute; inset: -22px; border-radius: 50%; pointer-events: none;
  background: radial-gradient(closest-side, transparent 62%, rgb(46 230 192 / .16) 74%, transparent 88%);
}
.halkaMerkez {
  position: absolute; inset: 0; display: flex; flex-direction: column;
  align-items: center; justify-content: center; gap: 4px; padding: 0 26px;
}
.halkaMerkez .ilerlemeYuzde {
  font-family: var(--f-baslik); font-size: 46px; font-weight: 700; color: #fff;
  letter-spacing: -.03em; min-width: 0; text-align: center; font-variant-numeric: tabular-nums;
}
.halka-alt { font-size: 12.5px; font-weight: 600; color: var(--nane); min-height: 2.6em; line-height: 1.3; }
.uretim-baslik { font-size: clamp(1.3rem, 2.4vw, 1.7rem); margin: 0 0 6px; }
.uretim-not { font-size: 12.5px; color: var(--soluk-2); margin: 10px 0 0; }
.uretim-adimlar .adimListe { margin-top: 0; }
/* tamam / hata durumları */
.uretim.tamam .halkaSar::before { animation: none; border-color: rgb(74 222 157 / .5); border-style: solid; }
.uretim.tamam .halka { background: conic-gradient(var(--yesil) 100%, transparent 0); }
.uretim.tamam .halkaSar::after {
  background: radial-gradient(closest-side, transparent 60%, rgb(74 222 157 / .2) 74%, transparent 90%);
}
.uretim.tamam .halka-alt { color: var(--yesil); }
.uretim.hatali .halkaSar::before { animation: none; border-color: var(--kirmizi-cizgi); }
.uretim.hatali .halka { background: conic-gradient(var(--kirmizi) calc(var(--yuzde) * 1%), rgb(148 190 210 / .12) 0); }
.uretim.hatali .halka-alt { color: var(--kirmizi); }

/* köşe durum pili */
.raporMini {
  position: fixed; right: 18px; bottom: 18px; z-index: 150; cursor: pointer;
  display: inline-flex; align-items: center; gap: 10px; padding: 12px 18px;
  font: inherit; font-size: 13.5px; font-weight: 650; color: var(--metin);
  background: rgb(12 24 34 / .94); border: 1px solid rgb(46 230 192 / .35);
  border-radius: var(--r-hap); box-shadow: var(--golge-2), 0 0 30px -8px rgb(46 230 192 / .35);
  transition: var(--gecis); animation: belir .35s ease;
}
.raporMini:hover { transform: translateY(-2px); border-color: rgb(46 230 192 / .6); }
.raporMini .spinner.kucuk { width: 15px; height: 15px; border-width: 2px; }
.raporMini.hazir { border-color: var(--yesil-cizgi); color: var(--yesil); }
.raporMini.hazir .spinner { display: none; }
.raporMini.hazir::before {
  content: "✓"; width: 17px; height: 17px; border-radius: 50%; background: var(--yesil);
  color: #04231a; font-size: 11px; font-weight: 800; display: inline-grid; place-items: center;
}

@media (max-width: 860px) {
  #talepPanel.akis-kart { grid-template-columns: 1fr; }
  .akis-tanitim { border-right: 0; border-bottom: 1px solid var(--cizgi); }
  .uretim-sar { grid-template-columns: 1fr; }
  .akis-kunye { display: none; }
  .halkaSar { width: 180px; height: 180px; }
  .halkaMerkez .ilerlemeYuzde { font-size: 38px; }
}

/* ==================== BELGE SAYFALARI (kağıt) ==================== */
.belge {
  max-width: 860px; margin: 44px auto 80px; padding: clamp(28px, 5vw, 54px);
  background: #f7fafb; color: #1d3540; border-radius: var(--r-3); box-shadow: var(--golge-3);
}
.belge h1 { font-size: clamp(1.6rem, 3vw, 2.1rem); margin: 6px 0 20px; color: #0b2530; }
.belge h2 { font-size: 17px; color: #0d5b6b; border-bottom: 1px solid #dbe7ea; padding-bottom: 7px; margin: 34px 0 10px; }
.belge p, .belge li { font-size: 15.3px; color: #2a4450; line-height: 1.75; }
.belge a { color: #0d7a94; }
.belge b { color: #16323d; }
.kucukbelge { font-size: 12.5px; color: #64808d; margin-top: 28px; }
.belge .birincil.cta { width: auto; display: inline-flex; margin-top: 10px; }
@media (max-width: 900px) { .belge { margin: 20px 16px 48px; } }

/* ==================== HAREKET ==================== */
.reveal { opacity: 0; transform: translateY(24px); transition: opacity .6s ease, transform .6s cubic-bezier(.2, .7, .2, 1); }
.reveal.gorundu { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  * { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
  .reveal { opacity: 1; transform: none; }
  .sahne3d { transform: none !important; }
  .term-satir { opacity: 1; transform: none; }
}