/* ============================================================
   ERPware Kurumsal — v4 "Modern Defter"
   İmza konsept: ERP'nin özü kayıttır → site hassas bir kayıt
   defteri gibi kurgulanır. Sola dayalı editoryal düzen, otomatik
   bölüm numaraları (01, 02…), cetvel çizgisine oturan etiketler,
   çözümler "defter satırları", solda kaydırmayla dolan akış
   ipliği, dev hayalet kontur tipografi. Zemin: Apple sadeliği,
   Stripe tek imza degradesi, Palantir koyu blokları.
   ============================================================ */

:root {
  --ink: #0b0f1a;
  --ink-2: #1a2130;
  --body-c: #4c5568;
  --muted: #8a91a3;
  --line: #e8eaef;
  --line-2: #d8dbe3;
  --bg: #ffffff;
  --bg-soft: #f6f7f9;
  --dark: #05070d;
  --dark-2: #0b1020;

  --g1: #5b5bf6;
  --g2: #3b82f6;
  --g3: #22d3ee;
  --grad: linear-gradient(100deg, var(--g1) 0%, var(--g2) 55%, var(--g3) 100%);
  --grad-dik: linear-gradient(180deg, var(--g1) 0%, var(--g2) 55%, var(--g3) 100%);

  --accent: var(--g2);
  --accent-soft: #eef2fe;

  --radius-sm: 10px;
  --radius: 14px;
  --radius-lg: 18px;
  --shadow: 0 14px 40px rgba(11, 15, 26, .08);

  --container: 1200px;
  --font: "Inter", -apple-system, "Segoe UI", system-ui, sans-serif;
  --mono: "JetBrains Mono", ui-monospace, Consolas, monospace;
  --header-h: 72px;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: var(--header-h); }
body {
  margin: 0;
  font-family: var(--font);
  font-size: 16px;
  color: var(--ink);
  background: var(--bg);
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
  counter-reset: defter;
}
img, svg { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
h1, h2, h3, h4 { margin: 0; color: var(--ink); line-height: 1.08; letter-spacing: -0.035em; font-weight: 650; }
p { margin: 0; }
/* JS ile gizlenen ogeler: display:grid/flex verilen ogelerde tarayicinin varsayilan
   [hidden] kurali eziliyor; bu kural olmadan Saha Notlari suzgeci calismiyor. */
[hidden] { display: none !important; }

.container { width: 100%; max-width: var(--container); margin-inline: auto; padding-inline: clamp(20px, 4vw, 44px); }

.skip-link { position: absolute; left: -9999px; top: 0; background: var(--ink); color: #fff; padding: 10px 16px; z-index: 100; }
.skip-link:focus { left: 0; }
:focus-visible { outline: 2px solid var(--g2); outline-offset: 3px; border-radius: 4px; }

.t-grad, .hero-title em {
  font-style: normal;
  background-image: var(--grad);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

/* ---------------- Akış ipliği — solda, kaydırmayla dolar ---------------- */
.akis-ipligi {
  position: fixed; left: clamp(10px, 1.6vw, 26px); top: 0; bottom: 0;
  width: 2px; background: var(--line); z-index: 40; pointer-events: none;
}
.akis-ipligi i {
  position: absolute; left: 0; top: 0; width: 100%; height: 0%;
  background: var(--grad-dik);
  transition: height .15s linear;
}
.akis-ipligi::after {
  content: ""; position: absolute; left: 50%; top: var(--uc, 0%);
  width: 8px; height: 8px; border-radius: 50%;
  transform: translate(-50%, -50%);
  background: var(--g3);
  box-shadow: 0 0 0 4px rgba(34, 211, 238, .18);
  transition: top .15s linear;
}
@media (max-width: 900px) { .akis-ipligi { display: none; } }

/* ---------------- Defter etiketi — çizgiye oturan mono başlık ---------------- */
/* .defter-cizgi: tam genişlik kılcal çizgi; .eyebrow üstüne biner */
.eyebrow {
  display: inline-block;
  position: relative;
  font-family: var(--mono);
  font-size: .72rem;
  font-weight: 500;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--ink);
  background: inherit;
  margin-bottom: 22px;
}
.eyebrow::before {
  counter-increment: defter;
  content: counter(defter, decimal-leading-zero);
  color: var(--g2);
  margin-right: 14px;
}
/* çizgiye oturma: bölüm başları border-top alır, etiket üstüne çıkar */
.section-head {
  position: relative;
  border-top: 1px solid var(--line);
  padding-top: 26px;
  margin: 0 0 56px;
  max-width: none;
  text-align: left;
}
.section-head .eyebrow { position: absolute; top: -9px; left: 0; background: var(--bg); padding-right: 18px; margin: 0; }
.section-head h2 { font-size: clamp(30px, 4.6vw, 52px); font-weight: 700; max-width: 720px; }
.section-lead { margin-top: 16px; color: var(--body-c); font-size: 1.05rem; max-width: 620px; }

/* Kaydırınca belirme */
.reveal { opacity: 0; transform: translateY(14px); transition: opacity .7s cubic-bezier(.2,.6,.2,1), transform .7s cubic-bezier(.2,.6,.2,1); }
.reveal.gorunur { opacity: 1; transform: none; }

/* ---------------- Butonlar ---------------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  border-radius: 999px; padding: 12px 26px;
  font-weight: 550; font-size: 15px; letter-spacing: -.01em;
  cursor: pointer; border: 1px solid transparent; white-space: nowrap;
  transition: background .2s ease, color .2s ease, border-color .2s ease, transform .2s ease, box-shadow .2s ease;
}
.btn-primary { background: var(--ink); color: #fff; }
.btn-primary:hover { background: var(--ink-2); transform: translateY(-1px); box-shadow: 0 10px 28px rgba(11, 15, 26, .18); }
.btn-ghost { background: transparent; color: var(--ink); border-color: var(--line-2); }
.btn-ghost:hover { border-color: var(--ink); }
.btn-lg { padding: 15px 32px; font-size: 16px; }

/* ---------------- Üst bar ---------------- */
.site-header {
  position: sticky; top: 0; z-index: 60;
  background: rgba(255, 255, 255, .82);
  backdrop-filter: saturate(180%) blur(16px);
  border-bottom: 1px solid var(--line);
}
.header-inner { display: flex; align-items: center; justify-content: space-between; min-height: var(--header-h); gap: 20px; }
.brand { display: inline-flex; align-items: center; gap: 10px; }
.brand-mark { display: inline-flex; width: 34px; height: 34px; border-radius: 9px; background: var(--ink); color: #fff; align-items: center; justify-content: center; }
.brand-mark svg { width: 19px; height: 19px; }
.brand-foto { width: 52px; height: 52px; border-radius: 13px; background: #fff; border: 1px solid var(--line-2); overflow: hidden; }
.brand-foto img { width: 100%; height: 100%; object-fit: cover; }
.brand-name { font-weight: 700; font-size: 1.75rem; letter-spacing: -.035em; color: var(--ink); }
.brand-accent { color: inherit; }

.site-nav { display: flex; align-items: center; }
.nav-burger { display: none; flex-direction: column; gap: 5px; padding: 10px; cursor: pointer; border-radius: 9px; border: 1px solid var(--line); background: #fff; }
.nav-burger span { width: 20px; height: 2px; background: var(--ink); border-radius: 2px; transition: transform .25s ease, opacity .2s ease; }
.nav-list { list-style: none; margin: 0; padding: 0; display: flex; gap: 4px; align-items: center; }
.nav-list > li { position: relative; }
.nav-list a { display: block; padding: 8px 14px; border-radius: 999px; font-weight: 500; font-size: .9rem; color: var(--body-c); white-space: nowrap; transition: color .15s ease, background .15s ease; }
.nav-list a:hover { color: var(--ink); background: var(--bg-soft); }
.nav-cta { background: var(--ink); color: #fff !important; margin-left: 10px; }
.nav-cta:hover { background: var(--ink-2) !important; }
/* dil seçici: masaüstünde kısa kod (EN/TR), mobil menüde tam ad */
.nav-dil a { font-family: var(--mono); font-size: .78rem; letter-spacing: .08em; color: var(--muted); }
.nav-dil a:hover { color: var(--ink); }
.nav-dil .dil-uzun { display: none; }
/* 1001–1150px: menü tek satıra sığsın diye dolgular biraz daralır (hamburger 1000px altında) */
@media (min-width: 1001px) and (max-width: 1150px) {
  .nav-list a { padding: 8px 10px; }
  .nav-cta { margin-left: 6px; }
}

.nav-drop > a::after { content: " ›"; display: inline-block; transform: rotate(90deg); font-size: .8em; color: var(--muted); }
.nav-sub {
  list-style: none; margin: 0; padding: 10px;
  position: absolute; top: calc(100% + 10px); left: 50%;
  display: grid; grid-template-columns: repeat(2, minmax(230px, 1fr)); gap: 2px;
  width: max-content; max-width: calc(100vw - 48px);
  background: #fff; border: 1px solid var(--line);
  border-radius: var(--radius); box-shadow: var(--shadow);
  opacity: 0; visibility: hidden; transform: translateX(-50%) translateY(6px);
  transition: opacity .18s ease, transform .18s ease, visibility .18s;
}
.nav-drop:hover .nav-sub, .nav-drop:focus-within .nav-sub { opacity: 1; visibility: visible; transform: translateX(-50%) translateY(0); }
.nav-sub a { padding: 11px 14px; border-radius: var(--radius-sm); font-weight: 550; color: var(--ink); }
.nav-sub a small { display: block; font-weight: 400; color: var(--muted); font-size: .8rem; line-height: 1.45; letter-spacing: 0; }
.nav-sub a:hover { background: var(--bg-soft); }

@media (max-width: 1000px) {
  .nav-burger { display: inline-flex; }
  .nav-list {
    position: fixed; inset: var(--header-h) 0 auto 0;
    flex-direction: column; align-items: stretch; gap: 2px;
    background: #fff; padding: 12px 20px 20px;
    border-bottom: 1px solid var(--line); box-shadow: var(--shadow);
    transform: translateY(-135%);
    transition: transform .3s cubic-bezier(.4, 0, .2, 1);
    max-height: calc(100vh - var(--header-h)); overflow-y: auto;
  }
  .nav-list a { padding: 12px 14px; font-size: 1rem; border-radius: var(--radius-sm); }
  .nav-sub { position: static; opacity: 1; visibility: visible; transform: none; box-shadow: none; border: 0; padding: 0 0 0 14px; min-width: 0; width: auto; max-width: none; grid-template-columns: 1fr; }
  .nav-sub a small { display: none; }
  .nav-toggle:checked ~ .nav-list { transform: translateY(0); }
  .nav-toggle:checked ~ .nav-burger span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  .nav-toggle:checked ~ .nav-burger span:nth-child(2) { opacity: 0; }
  .nav-toggle:checked ~ .nav-burger span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
  .nav-cta { margin: 8px 0 0; text-align: center; }
  .nav-dil .dil-kisa { display: none; }
  .nav-dil .dil-uzun { display: inline; }
  .nav-dil a { font-family: var(--font); font-size: 1rem; letter-spacing: 0; }
}

/* ---------------- HERO — sola dayalı, hayalet kontur ---------------- */
.hero { position: relative; overflow: hidden; padding: 104px 0 0; background: var(--bg); }
/* dev hayalet kelime — kontur harflerle, sağ üstte */
.hero-hayalet {
  position: absolute; right: -2%; top: 30px;
  font-weight: 750; font-size: clamp(120px, 22vw, 300px);
  line-height: 1; letter-spacing: -.04em;
  color: transparent;
  -webkit-text-stroke: 1.5px var(--line-2);
  user-select: none; pointer-events: none;
  z-index: 0;
}
.hero-hayalet b {
  font-weight: 750;
  -webkit-text-stroke: 0;
  background-image: var(--grad);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  opacity: .14;
}
.hero-inner { position: relative; z-index: 1; display: block; text-align: left; }
.hero-iki-kolon { display: grid; grid-template-columns: 1fr; gap: 48px; align-items: center; }
@media (min-width: 960px) { .hero-iki-kolon { grid-template-columns: 1.08fr .92fr; gap: 64px; } }
.hero-copy { max-width: 820px; margin: 0; }

/* dava dosyası çerçevesi — dedektif illüstrasyonu */
.hero-gorsel {
  margin: 0; position: relative;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  overflow: hidden;
  background: #fff;
  max-width: 460px;
  justify-self: end;
  width: 100%;
}
.hero-gorsel .gorsel-etiket {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  font-family: var(--mono); font-size: .68rem; font-weight: 500;
  letter-spacing: .18em; text-transform: uppercase;
  color: var(--muted);
  padding: 12px 18px;
  border-bottom: 1px solid var(--line);
  background: var(--bg-soft);
}
.hero-gorsel .gorsel-durum { display: inline-flex; align-items: center; gap: 7px; color: var(--body-c); }
.hero-gorsel .gorsel-durum::before {
  content: ""; width: 6px; height: 6px; border-radius: 50%;
  background: #2fbf71; box-shadow: 0 0 0 3px rgba(47, 191, 113, .18);
}
.hero-gorsel img { width: 100%; filter: grayscale(1) contrast(1.03); }
@media (max-width: 959px) { .hero-gorsel { justify-self: start; max-width: 420px; } }
.hero-kicker {
  display: inline-flex; align-items: center; gap: 10px;
  font-family: var(--mono); font-size: .72rem; font-weight: 500;
  letter-spacing: .2em; text-transform: uppercase; color: var(--body-c);
  margin-bottom: 34px;
}
.hero-kicker::before { content: "00"; color: var(--g2); }
.hero-kicker .dot { width: 6px; height: 6px; border-radius: 50%; background: var(--g3); }
.hero-title { font-size: clamp(44px, 7.4vw, 92px); font-weight: 750; margin-bottom: 28px; }
.hero-subtitle { font-size: clamp(1.02rem, 1.6vw, 1.18rem); color: var(--body-c); max-width: 640px; margin: 0 0 36px; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; justify-content: flex-start; }

/* istatistikler — defterin ilk satırları */
/* veri akışı şeridi */
.hero-akis { position: relative; z-index: 1; margin-top: 72px; }
.hero-akis svg { width: 100%; height: auto; }
@media (max-width: 700px) { .hero-akis { display: none; } }

.hero-stats {
  display: grid; grid-template-columns: 1fr; gap: 0;
  margin: 64px 0 0; max-width: none;
  border-top: 1px solid var(--line);
}
@media (min-width: 640px) { .hero-stats { grid-template-columns: repeat(3, 1fr); } }
.stat { padding: 26px 28px 30px 0; margin: 0; text-align: left; position: relative; }
@media (min-width: 640px) {
  .stat + .stat { padding-left: 28px; border-left: 1px solid var(--line); }
}
.stat-value { font-size: 1.7rem; font-weight: 700; letter-spacing: -.03em; color: var(--ink); }
.stat-label { margin: 6px 0 0; color: var(--muted); font-size: .88rem; }

/* ---------------- Bölümler ---------------- */
.section { padding: 104px 0; }

/* ---------------- Çözümler — defter satırları ---------------- */
.satir-liste { border-top: 1px solid var(--line); }
.satir {
  display: grid;
  grid-template-columns: 56px 1fr 24px;
  gap: 20px;
  align-items: baseline;
  padding: 26px 0;
  border-bottom: 1px solid var(--line);
  position: relative;
  
}
@media (min-width: 860px) { .satir { grid-template-columns: 72px minmax(0, .95fr) minmax(0, 1.05fr) 32px; } }
.satir::before {
  content: ""; position: absolute; left: 0; bottom: -1px; height: 1px; width: 0%;
  background: var(--grad); transition: width .45s cubic-bezier(.2,.6,.2,1);
}
.satir:hover::before { width: 100%; }
.satir-daha-kutu { margin-top: 28px; }
.satir-daha { display: inline-block; text-decoration: none; }

.satir-no { font-family: var(--mono); font-size: .8rem; color: var(--muted); letter-spacing: .1em; }
.satir:hover .satir-no { color: var(--g2); }
.satir h3 { font-size: clamp(1.15rem, 2vw, 1.45rem); font-weight: 650; letter-spacing: -.02em; }
.satir h3 a { display: block; }
.satir p { color: var(--body-c); font-size: .95rem; line-height: 1.6; }
@media (max-width: 859px) { .satir p { grid-column: 2; } }
.satir-ok { font-size: 1.2rem; color: var(--line-2); transition: color .25s ease, transform .25s ease; justify-self: end; }
.satir:hover .satir-ok { color: var(--ink); transform: translateX(4px); }

/* ---------------- Yapay Zekâ — koyu defter ---------------- */
.section-ai { position: relative; overflow: hidden; background: var(--dark); color: #b9c0d2; }
.section-ai .section-head { border-top-color: rgba(255,255,255,.14); }
.section-ai .section-head .eyebrow { background: var(--dark); color: #fff; }
.section-ai .eyebrow::before { color: var(--g3); }
.ai-inner { position: relative; display: grid; grid-template-columns: 1fr; gap: 48px; align-items: start; }
@media (min-width: 900px) { .ai-inner { grid-template-columns: 1.05fr .95fr; gap: 72px; } }
.section-ai h2 { color: #fff; font-size: clamp(28px, 4.2vw, 46px); font-weight: 700; letter-spacing: -.03em; }
.ai-lead { margin-top: 18px; color: #99a1b6; font-size: 1.04rem; max-width: 520px; }
.ai-points { list-style: none; margin: 30px 0 0; padding: 0; display: grid; gap: 0; border-top: 1px solid rgba(255,255,255,.1); }
.ai-points li {
  display: flex; gap: 14px; align-items: baseline;
  color: #d6dae6; font-weight: 450; font-size: .95rem;
  padding: 13px 2px; border-bottom: 1px solid rgba(255,255,255,.1);
  counter-increment: aisatir;
}
.ai-points li::before {
  content: counter(aisatir, decimal-leading-zero);
  font-family: var(--mono); font-size: .72rem; color: var(--g3); letter-spacing: .1em;
}
.ai-points svg { display: none; }
.ai-visual { position: relative; display: flex; justify-content: center; }
.ai-card { width: 100%; max-width: 420px; background: rgba(255, 255, 255, .03); border: 1px solid rgba(255, 255, 255, .12); border-radius: var(--radius-lg); padding: 24px; }
.ai-card-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; }
.ai-badge { font-family: var(--mono); font-size: .68rem; font-weight: 500; letter-spacing: .16em; text-transform: uppercase; color: #9fc7d8; background: rgba(34, 211, 238, .1); border: 1px solid rgba(34, 211, 238, .25); padding: 5px 12px; border-radius: 999px; }
.ai-dots { display: inline-flex; gap: 6px; }
.ai-dots i { width: 7px; height: 7px; border-radius: 50%; background: rgba(255,255,255,.2); }
.ai-q { color: #fff; font-weight: 550; font-size: 1rem; margin-bottom: 14px; }
.ai-sql { font-family: var(--mono); font-size: .84rem; line-height: 1.9; color: #aeb6cc; background: rgba(0, 0, 0, .45); border: 1px solid rgba(255,255,255,.08); border-radius: var(--radius-sm); padding: 16px 18px; }
.ai-sql .kw { color: #7d9bff; font-weight: 600; }
.ai-sql .fn { color: #4dd6c2; }
.ai-sql .pm { color: #d8b465; }
.ai-foot { display: flex; align-items: center; gap: 9px; margin-top: 14px; font-family: var(--mono); font-size: .74rem; letter-spacing: .06em; color: #6d7690; }
.pulse { width: 8px; height: 8px; border-radius: 50%; background: #2fbf71; animation: pulse 2.2s infinite; }
@keyframes pulse { 0% { box-shadow: 0 0 0 0 rgba(47,191,113,.5); } 70% { box-shadow: 0 0 0 8px rgba(47,191,113,0); } 100% { box-shadow: 0 0 0 0 rgba(47,191,113,0); } }

/* ---------------- Metodoloji — dev hayalet numaralar ---------------- */
.steps { display: grid; grid-template-columns: 1fr; gap: 0; border-top: 1px solid var(--line); }
@media (min-width: 800px) { .steps { grid-template-columns: repeat(3, 1fr); } }
.step { position: relative; padding: 34px 28px 40px 0; background: transparent; overflow: hidden; }
@media (min-width: 800px) { .step + .step { padding-left: 28px; border-left: 1px solid var(--line); } }
.step-no {
  display: block;
  font-weight: 750; font-size: 84px; line-height: 1;
  letter-spacing: -.04em;
  color: transparent;
  -webkit-text-stroke: 1.3px var(--line-2);
  margin-bottom: 20px;
  transition: -webkit-text-stroke-color .3s ease;
}
.step:hover .step-no { -webkit-text-stroke-color: var(--g2); }
.step h3 { font-size: 1.15rem; font-weight: 650; margin-bottom: 8px; }
.step p { color: var(--body-c); font-size: .94rem; max-width: 300px; }

/* yolculuk bandı — Analiz → … → Hareket Özgürlüğü */
.yolculuk {
  position: relative;
  display: flex; flex-wrap: wrap; align-items: baseline; gap: 10px 14px;
  margin-top: 56px; padding: 22px 2px;
  border-top: 1px solid var(--line); border-bottom: 1px solid var(--line);
  font-family: var(--mono); font-size: .74rem; font-weight: 500;
  letter-spacing: .16em; text-transform: uppercase; color: var(--body-c);
  overflow: hidden;
}
.yolculuk i { font-style: normal; color: var(--line-2); }
.yolculuk b { font-weight: 650; letter-spacing: .16em; }
.yolculuk::after {
  content: ""; position: absolute; left: 0; top: 0;
  width: 7px; height: 2px; border-radius: 2px;
  background: var(--grad);
  animation: yol-al 6s linear infinite;
}
@keyframes yol-al { from { left: -2%; } to { left: 102%; } }

/* KAI zinciri — adımlar sırayla parlar */
.zincir { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; counter-reset: none; }
.zincir li { display: flex; gap: 12px; align-items: flex-start; opacity: .32; animation: zincir-parla 7s ease-in-out infinite; }
.zincir li:nth-child(1) { animation-delay: 0s; }
.zincir li:nth-child(2) { animation-delay: 1.4s; }
.zincir li:nth-child(3) { animation-delay: 2.8s; }
.zincir li:nth-child(4) { animation-delay: 4.2s; }
@keyframes zincir-parla {
  0%, 100% { opacity: .32; }
  12%, 78% { opacity: 1; }
}
.zincir li > span { font-family: var(--mono); font-size: .7rem; color: var(--g3); letter-spacing: .1em; margin-top: 6px; flex-shrink: 0; }
.zincir li > div { flex: 1; min-width: 0; }
.zincir .ai-q { margin-bottom: 0; }
.zincir-metin { color: #d6dae6; font-size: .92rem; padding: 8px 0 2px; }

/* on-prem şema */
.onprem { width: 100%; max-width: 520px; height: auto; margin-top: 32px; }
.onprem-dikey { display: none; width: 100%; max-width: 360px; height: auto; margin-top: 32px; }

/* ---------------- ErpwareBI paneli ---------------- */
.bi-inner { display: grid; grid-template-columns: 1fr; gap: 44px; align-items: center; }
@media (min-width: 940px) { .bi-inner { grid-template-columns: 1.15fr .85fr; gap: 64px; } }
.bi-panel svg { width: 100%; height: auto; filter: drop-shadow(0 18px 40px rgba(11, 15, 26, .09)); }
.bi-cubuk { transform-origin: center bottom; transform-box: fill-box; animation: bi-buyu .8s cubic-bezier(.2,.6,.2,1) backwards; }
@keyframes bi-buyu { from { transform: scaleY(0); } to { transform: scaleY(1); } }
.bi-points { list-style: none; margin: 0 0 28px; padding: 0; display: grid; gap: 0; border-top: 1px solid var(--line); }
.bi-points li {
  display: flex; gap: 14px; align-items: baseline;
  padding: 14px 2px; border-bottom: 1px solid var(--line);
  color: var(--ink-2); font-size: .96rem;
  counter-increment: bisatir;
}
.bi-points li::before {
  content: counter(bisatir, decimal-leading-zero);
  font-family: var(--mono); font-size: .72rem; color: var(--g2); letter-spacing: .1em;
}

/* ---------------- Teknoloji — mono dizin satırı ---------------- */
.section-tech { background: var(--bg); padding-top: 0; }
.section-tech .section-head { margin-bottom: 40px; }
.tech-badges { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0; justify-content: flex-start; }
.tech-badge {
  background: transparent; border: 0; border-radius: 0; box-shadow: none;
  padding: 6px 0; font-family: var(--mono); font-weight: 450; color: var(--body-c); font-size: .84rem;
  transition: color .2s ease;
}
.tech-badge:hover { color: var(--ink); transform: none; }
.tech-badges li:not(:last-child)::after { content: "/"; color: var(--line-2); margin: 0 16px; }

/* teknoloji izgarasi — logolu */
.tech-izgara {
  list-style: none; margin: 38px 0 0; padding: 0;
  display: grid; gap: 0;
  grid-template-columns: repeat(auto-fill, minmax(168px, 1fr));
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}
.tech-kart {
  background: #fff;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  display: flex; align-items: center; gap: 13px;
  padding: 18px 18px;
  min-height: 68px;
  transition: background .2s ease;
}
.tech-kart:hover { background: var(--accent-soft, #f6f7fb); }
/* logolar marka renginde; satır içi style ile geliyor, burası yedek */
.tech-logo { flex: none; width: 24px; height: 24px; color: var(--ink); display: block; }
.tech-logo svg { width: 100%; height: 100%; display: block; }
.tech-logo-cizgi { color: var(--muted); }
.tech-logo-cizgi svg { stroke-width: 1.7; }
.tech-ad {
  font-family: var(--mono); font-size: .78rem; font-weight: 450;
  line-height: 1.35; color: var(--body-c); word-break: break-word;
}
.tech-kart:hover .tech-ad { color: var(--ink); }
.tech-dipnot {
  margin: 18px 0 0; font-family: var(--mono); font-size: .68rem;
  letter-spacing: .06em; color: var(--muted);
}

@media (max-width: 520px) {
  .tech-izgara { grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); }
  .tech-kart { padding: 15px 13px; gap: 10px; min-height: 60px; }
  .tech-ad { font-size: .72rem; }
}

/* ---------------- CTA — koyu kapanış ---------------- */
.section-cta { text-align: left; }
.cta-inner {
  position: relative; overflow: hidden;
  background: var(--dark);
  border-radius: 24px; padding: 68px clamp(28px, 6vw, 72px); color: #fff; max-width: none;
}
.cta-inner::before {
  content: ""; position: absolute; width: 560px; height: 240px;
  right: -140px; bottom: -160px;
  background: radial-gradient(50% 50% at 40% 50%, rgba(91, 91, 246, .35), transparent 70%),
              radial-gradient(50% 50% at 60% 50%, rgba(34, 211, 238, .25), transparent 70%);
  filter: blur(46px);
}
.section-cta .eyebrow { color: #fff; }
.section-cta .eyebrow::before { color: var(--g3); }
.section-cta h2 { position: relative; color: #fff; font-size: clamp(28px, 4.2vw, 44px); font-weight: 700; max-width: 640px; }
.cta-lead { position: relative; margin: 16px 0 32px; color: #99a1b6; font-size: 1.04rem; max-width: 560px; }
.section-cta .btn-primary { position: relative; background: #fff; color: var(--ink); }
.section-cta .btn-primary:hover { background: #eef0f4; box-shadow: none; }
.cta-mail { position: relative; margin-top: 20px; font-family: var(--mono); font-size: .82rem; letter-spacing: .06em; color: #6d7690; }

/* ============================================================
   KATEGORİ SAYFASI (solutions) — defter satırları
   ============================================================ */
.cat-hero { position: relative; overflow: hidden; background: var(--dark); color: #fff; padding: 96px 0 72px; }
.cat-hero .eyebrow { color: #fff; }
.cat-hero .eyebrow::before { color: var(--g3); }
.cat-hero h1 { position: relative; color: #fff; font-size: clamp(36px, 6vw, 64px); font-weight: 750; letter-spacing: -.035em; }
.cat-hero p { position: relative; margin-top: 18px; color: #99a1b6; font-size: 1.05rem; max-width: 640px; }
.cat-hayalet {
  position: absolute; right: -1%; bottom: -8%;
  font-weight: 750; font-size: clamp(100px, 18vw, 240px); line-height: 1;
  color: transparent; -webkit-text-stroke: 1px rgba(255,255,255,.1);
  user-select: none; pointer-events: none;
}
.cat-grid { display: block; border: 0; background: transparent; border-radius: 0; overflow: visible; margin-block: 64px 96px; border-top: 1px solid var(--line); }
.cat-card {
  display: grid; grid-template-columns: 56px 1fr 24px; gap: 20px; align-items: baseline;
  background: transparent; padding: 30px 0; border-bottom: 1px solid var(--line);
  position: relative; 
}
@media (min-width: 860px) { .cat-card { grid-template-columns: 72px minmax(0, .95fr) minmax(0, 1.05fr) 32px; } }
.cat-card::before { content: ""; position: absolute; left: 0; bottom: -1px; height: 1px; width: 0%; background: var(--grad); transition: width .45s cubic-bezier(.2,.6,.2,1); }
.cat-card:hover { background: transparent; }
.cat-card:hover::before { width: 100%; }
.cat-card .feature-icon { display: none; }
.cat-card .cat-no { font-family: var(--mono); font-size: .8rem; color: var(--muted); letter-spacing: .1em; }
.cat-card:hover .cat-no { color: var(--accent); }
.cat-card h2 { font-size: clamp(1.2rem, 2.2vw, 1.6rem); font-weight: 650; letter-spacing: -.02em; }
.cat-card p { color: var(--body-c); font-size: .95rem; }
@media (max-width: 859px) { .cat-card p { grid-column: 2; } }
.cat-card .cat-more { margin: 0; font-size: 1.2rem; color: var(--line-2); justify-self: end; transition: color .25s ease, transform .25s ease; }
.cat-card:hover .cat-more { color: var(--accent); transform: translateX(4px); text-decoration: none; }

/* ============================================================
   ÇÖZÜM SAYFASI (solution)
   ============================================================ */
.sol-hero { position: relative; overflow: hidden; background: var(--dark); color: #fff; padding: 80px 0 64px; }
.sol-hero::after {
  content: ""; position: absolute; width: 480px; height: 220px; right: -120px; top: -80px;
  background: radial-gradient(50% 50% at 50% 50%, color-mix(in srgb, var(--accent) 40%, transparent), transparent 70%);
  filter: blur(50px);
}
.sol-crumbs { position: relative; font-family: var(--mono); font-size: .74rem; letter-spacing: .08em; color: #6d7690; margin-bottom: 24px; }
.sol-crumbs a:hover { color: #fff; }
.sol-hero-row { position: relative; display: flex; align-items: flex-start; gap: 22px; }
.sol-hero .feature-icon { background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .16); color: var(--accent); width: 56px; height: 56px; border-radius: 14px; flex-shrink: 0; margin: 6px 0 0; filter: saturate(1.4) brightness(1.5); display: inline-flex; align-items: center; justify-content: center; }
.sol-hero .feature-icon svg { width: 27px; height: 27px; }
.sol-hero h1 { color: #fff; font-size: clamp(32px, 5vw, 54px); font-weight: 750; letter-spacing: -.035em; }
.sol-hero .sol-summary { margin-top: 14px; color: #99a1b6; font-size: 1.05rem; max-width: 700px; }

.sol-body { display: grid; grid-template-columns: 1fr; gap: 48px; padding-block: 72px 96px; }
@media (min-width: 940px) { .sol-body { grid-template-columns: 1fr 300px; } }
.sol-content { min-width: 0; }
.sol-content h2 { font-size: 1.5rem; font-weight: 650; margin: 40px 0 14px; }
.sol-content h2:first-child { margin-top: 0; }
.sol-content h3 { font-size: 1.15rem; font-weight: 650; margin: 28px 0 10px; }
.sol-content p { margin-bottom: 16px; color: var(--ink-2); }
.sol-content ul, .sol-content ol { color: var(--ink-2); padding-left: 24px; margin: 0 0 16px; }
.sol-content li { margin-bottom: 6px; }
.sol-content blockquote { border-left: 3px solid var(--accent); margin: 24px 0; padding: 12px 22px; background: var(--bg-soft); border-radius: 0 var(--radius-sm) var(--radius-sm) 0; color: var(--body-c); }
.sol-content a { color: var(--accent); text-decoration: underline; text-underline-offset: 3px; }
.sol-content a.btn { text-decoration: none; margin-top: 4px; }
.sol-content a.btn-primary { color: #fff; }
.sol-content table, .page-body table { width: 100%; border-collapse: collapse; margin: 8px 0 20px; font-size: .93rem; color: var(--ink-2); }
.sol-content th, .sol-content td, .page-body th, .page-body td { border-bottom: 1px solid var(--line); padding: 11px 14px; text-align: left; vertical-align: top; }
.sol-content thead th, .page-body thead th { background: var(--bg-soft); font-weight: 600; color: var(--ink); border-bottom-color: var(--line-2); }
.sol-content tbody td:first-child, .page-body tbody td:first-child { font-weight: 600; color: var(--ink); }
.veri-gorsel { margin: 26px 0 30px; }
.veri-gorsel img + img { margin-top: 14px; }
.veri-gorsel img { display: block; width: 100%; max-width: 520px; height: auto; border: 1px solid var(--line); border-radius: var(--radius); background: #fff; }
.veri-gorsel figcaption { margin-top: 10px; font-size: .82rem; line-height: 1.5; color: var(--muted); max-width: 520px; }
.sol-content code { font-family: var(--mono); background: var(--bg-soft); border: 1px solid var(--line); border-radius: 6px; padding: 2px 6px; font-size: .86em; }

.sol-aside { display: flex; flex-direction: column; gap: 18px; }
.aside-card { background: #fff; border: 1px solid var(--line); border-radius: var(--radius-lg); padding: 26px; }
.aside-card h3 { font-family: var(--mono); font-size: .72rem; font-weight: 500; text-transform: uppercase; letter-spacing: .2em; color: var(--muted); margin-bottom: 16px; }
.aside-card ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.aside-card li { display: flex; gap: 10px; align-items: flex-start; font-size: .92rem; color: var(--ink-2); }
.aside-card li::before { content: "→"; color: var(--accent); font-weight: 600; }
.aside-cta { background: var(--dark); color: #fff; border-radius: var(--radius-lg); padding: 28px 26px; }
.aside-cta h3 { color: #fff; font-size: 1.05rem; font-weight: 650; margin-bottom: 8px; letter-spacing: -.015em; }
.aside-cta p { color: #99a1b6; font-size: .9rem; margin-bottom: 18px; }
.aside-cta .btn-primary { background: #fff; color: var(--ink); }
.aside-other a { display: block; padding: 9px 0; font-weight: 500; color: var(--body-c); border-bottom: 1px solid var(--line); font-size: .92rem; }
.aside-other a:last-child { border-bottom: 0; }
.aside-other a:hover { color: var(--accent); }

/* ============================================================
   METOT / ANLATIM (method)
   ============================================================ */
.method-head { border-bottom: 1px solid var(--line); padding: 80px 0 52px; }
.method-head h1 { font-size: clamp(32px, 5vw, 54px); font-weight: 750; max-width: 880px; letter-spacing: -.035em; }
.method-head .method-lead { margin-top: 16px; color: var(--body-c); font-size: 1.06rem; max-width: 740px; }
.method-meta { margin-top: 18px; font-family: var(--mono); font-size: .74rem; letter-spacing: .08em; color: var(--muted); }

.method-body { display: grid; grid-template-columns: 1fr; gap: 56px; padding-block: 56px 100px; }
@media (min-width: 980px) { .method-body { grid-template-columns: 250px minmax(0, 1fr); } }
.method-toc { display: none; }
@media (min-width: 980px) { .method-toc { display: block; position: sticky; top: calc(var(--header-h) + 28px); align-self: start; } }
.method-toc h4 { font-family: var(--mono); font-size: .7rem; font-weight: 500; text-transform: uppercase; letter-spacing: .2em; color: var(--muted); margin-bottom: 14px; }
.method-toc ol { list-style: none; margin: 0; padding: 0; border-left: 1px solid var(--line-2); counter-reset: toc; }
.method-toc a { display: block; padding: 7px 0 7px 16px; font-size: .88rem; color: var(--body-c); border-left: 1px solid transparent; margin-left: -1px; counter-increment: toc; }
.method-toc li > a:not(.toc-h3)::before { content: counter(toc, decimal-leading-zero) "  "; font-family: var(--mono); font-size: .72rem; color: var(--muted); }
.method-toc a:hover, .method-toc a.aktif { color: var(--ink); border-left-color: var(--ink); font-weight: 550; }
.method-toc .toc-h3 { padding-left: 30px; font-size: .82rem; }

.method-content { min-width: 0; max-width: 720px; font-size: 1.04rem; line-height: 1.75; }
.method-content h2 { font-size: 1.6rem; font-weight: 650; margin: 46px 0 16px; }
.method-content h2:first-child { margin-top: 0; }
.method-content h3 { font-size: 1.2rem; font-weight: 650; margin: 30px 0 10px; }
.method-content p { margin-bottom: 17px; color: var(--ink-2); }
.method-content ul, .method-content ol { padding-left: 26px; margin: 0 0 17px; color: var(--ink-2); }
.method-content li { margin-bottom: 7px; }
.method-content blockquote { border-left: 3px solid var(--ink); margin: 26px 0; padding: 14px 24px; background: var(--bg-soft); border-radius: 0 var(--radius-sm) var(--radius-sm) 0; color: var(--body-c); }
.method-content a { color: var(--g2); text-decoration: underline; text-underline-offset: 3px; }
.method-content code { font-family: var(--mono); background: var(--bg-soft); border: 1px solid var(--line); border-radius: 6px; padding: 2px 6px; font-size: .84em; }
.method-content table { width: 100%; border-collapse: collapse; margin: 0 0 20px; font-size: .93rem; }
.method-content th, .method-content td { border: 1px solid var(--line); padding: 11px 15px; text-align: left; }
.method-content th { background: var(--bg-soft); font-weight: 600; }
.method-content img { border-radius: var(--radius); border: 1px solid var(--line); }

/* ============================================================
   BLOG — defter satırları
   ============================================================ */
.blog-head { border-bottom: 0; padding: 80px 0 0; }
.blog-head h1 { font-size: clamp(32px, 5vw, 52px); font-weight: 750; letter-spacing: -.035em; }
.blog-grid { display: block; border: 0; background: transparent; border-radius: 0; overflow: visible; margin-block: 48px 96px; border-top: 1px solid var(--line); }
.blog-card { background: transparent; padding: 28px 0; border-bottom: 1px solid var(--line); position: relative;  }
.blog-card::before { content: ""; position: absolute; left: 0; bottom: -1px; height: 1px; width: 0%; background: var(--grad); transition: width .45s cubic-bezier(.2,.6,.2,1); }
.blog-card:hover { background: transparent; }
.blog-card:hover::before { width: 100%; }
.blog-card h2 { font-size: 1.3rem; font-weight: 650; letter-spacing: -.02em; margin-bottom: 8px; }
.blog-card h2 a:hover { color: var(--g2); }
.blog-card p { color: var(--body-c); font-size: .95rem; margin-bottom: 12px; max-width: 640px; }
.blog-card p:last-child { margin-bottom: 0; }

/* ---------------- Varsayılan iç sayfa ---------------- */
.page-body { max-width: 760px; margin: 0; padding: 80px 0 96px; }
.page-body h1 { font-size: clamp(30px, 4.6vw, 46px); font-weight: 750; margin-bottom: 22px; letter-spacing: -.035em; }
.page-body h2 { font-size: 1.45rem; font-weight: 650; margin: 34px 0 12px; }
.page-body h3 { font-size: 1.12rem; font-weight: 650; margin: 24px 0 10px; }
.page-body p { margin-bottom: 15px; color: var(--ink-2); }
.page-body ul, .page-body ol { padding-left: 24px; color: var(--ink-2); }
.page-body a { color: var(--g2); text-decoration: underline; text-underline-offset: 3px; }
.page-body blockquote { border-left: 3px solid var(--ink); margin: 22px 0; padding: 12px 22px; background: var(--bg-soft); border-radius: 0 var(--radius-sm) var(--radius-sm) 0; color: var(--body-c); }
.page-govde { max-width: var(--container); margin-inline: auto; padding-inline: clamp(20px, 4vw, 44px); }

/* ---------------- Alt bilgi ---------------- */
.site-footer { background: var(--dark); color: #99a1b6; padding: 64px 0 32px; }
.footer-grid { display: grid; grid-template-columns: 1fr; gap: 36px; padding-bottom: 40px; border-bottom: 1px solid rgba(255, 255, 255, .1); }
@media (min-width: 760px) { .footer-grid { grid-template-columns: 1.4fr 1fr 1fr; } }
.site-footer .brand-name { color: #fff; }
.footer-slogan { margin-top: 12px; font-size: .92rem; color: #6d7690; max-width: 330px; }
.footer-col h4 { color: #fff; font-family: var(--mono); font-size: .7rem; font-weight: 500; text-transform: uppercase; letter-spacing: .2em; margin-bottom: 16px; }
.footer-col ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.footer-col a { color: #99a1b6; font-size: .92rem; }
.footer-col a:hover { color: #fff; }
.footer-copy { padding-top: 24px; font-size: .82rem; color: #5d6478; display: flex; flex-wrap: wrap; gap: 10px; justify-content: space-between; }

/* ---------------- Ürün ailesi: sürüm kartları ---------------- */
.sol-aile { font-family: var(--mono); font-size: .72rem; letter-spacing: .18em; text-transform: uppercase; color: #8a91a3; margin-bottom: 10px; }
.surumler { margin-top: 48px; }
.surum-izgara {
  display: grid; grid-template-columns: 1fr; gap: 1px;
  background: var(--line); border: 1px solid var(--line);
  border-radius: var(--radius-lg); overflow: hidden;
}
@media (min-width: 640px) {
  .surum-izgara { grid-template-columns: repeat(2, 1fr); }
  /* tek sayıda sürümde son kart alt satırda yalnız kalmasın, satırı doldursun */
  .surum-kart:last-child:nth-child(odd) { grid-column: 1 / -1; }
}
.surum-kart {
  display: flex; flex-direction: column; gap: 6px;
  background: #fff; padding: 26px 24px;
  text-decoration: none !important; color: var(--ink) !important;
  transition: background .2s ease;
}
a.surum-kart:hover { background: var(--bg-soft); }
.surum-kart.pasif { background: var(--bg-soft); }
.surum-durum {
  align-self: flex-start; margin-bottom: 8px;
  font-family: var(--mono); font-size: .64rem; font-weight: 600;
  letter-spacing: .16em; text-transform: uppercase;
  color: var(--muted); border: 1px solid var(--line-2); border-radius: 4px; padding: 3px 8px;
}
.surum-durum.mevcut { color: #15a34a; border-color: #15a34a; }
.surum-on { font-size: .8rem; color: var(--muted); }
.surum-ad { font-size: 1.15rem; font-weight: 650; letter-spacing: -.02em; }
.surum-aciklama { font-size: .9rem; color: var(--body-c); line-height: 1.55; }
.surum-git { margin-top: 8px; font-size: .88rem; font-weight: 550; color: var(--accent); }

/* ============================================================
   SAHA NOTLARI — kategori kendi tasarım dilinde
   Teknik föy / fiş dosyası estetiği: kareli zemin, mono konu
   etiketleri, konuya göre renk kodu, künye satırı, numaralı
   adımlar. Defter konseptinin "teknik not defteri" hâli.
   ============================================================ */
.not-hero {
  position: relative;
  padding: 84px 0 44px;
  border-bottom: 1px solid var(--line);
  background:
    linear-gradient(var(--line) 1px, transparent 1px),
    linear-gradient(90deg, var(--line) 1px, transparent 1px);
  background-size: 28px 28px;
  background-color: var(--bg);
}
.not-hero::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(255,255,255,.55) 0%, rgba(255,255,255,.92) 100%);
  pointer-events: none;
}
.not-hero .container { position: relative; z-index: 1; }
.not-hero h1 { font-size: clamp(32px, 5vw, 54px); font-weight: 750; letter-spacing: -.035em; }
.not-lead { margin-top: 16px; color: var(--body-c); font-size: 1.05rem; max-width: 660px; }
.not-sayac { margin-top: 22px; font-family: var(--mono); font-size: .74rem; letter-spacing: .16em; text-transform: uppercase; color: var(--muted); }
.not-sayac span { color: var(--ink); font-weight: 600; }

/* konu süzgeci */
.konu-suzgec { display: flex; flex-wrap: wrap; gap: 8px; padding: 34px 0 26px; }
.konu-cip {
  font-family: var(--mono); font-size: .72rem; font-weight: 500;
  letter-spacing: .14em; text-transform: uppercase;
  padding: 8px 15px; border-radius: 999px; cursor: pointer;
  background: #fff; color: var(--body-c);
  border: 1px solid var(--line-2);
  transition: border-color .18s ease, color .18s ease, background .18s ease;
}
.konu-cip:hover { border-color: var(--kk, var(--ink)); color: var(--kk, var(--ink)); }
.konu-cip.aktif { background: var(--kk, var(--ink)); border-color: var(--kk, var(--ink)); color: #fff; }

/* not satırları — fiş dosyası */
.not-liste { border-top: 1px solid var(--line); }
.not-satir {
  display: grid; grid-template-columns: 110px minmax(0, 1fr) 130px;
  gap: 22px; align-items: baseline;
  padding: 24px 0; border-bottom: 1px solid var(--line);
  position: relative;
}
.not-satir::before {
  content: ""; position: absolute; left: 0; top: -1px; bottom: -1px; width: 3px;
  background: var(--kk); opacity: 0; transition: opacity .22s ease;
}
.not-satir:hover::before { opacity: 1; }
.not-konu {
  display: inline-block;
  font-family: var(--mono); font-size: .66rem; font-weight: 600;
  letter-spacing: .16em; text-transform: uppercase;
  color: var(--kk); border: 1px solid currentColor;
  padding: 4px 9px; border-radius: 4px; white-space: nowrap;
}
.not-konu.buyuk { font-size: .74rem; padding: 6px 13px; background: #fff; }
.not-govde h2 { font-size: 1.2rem; font-weight: 650; letter-spacing: -.02em; margin-bottom: 7px; }
.not-govde h2 a:hover { color: var(--kk); }
.not-govde p { color: var(--body-c); font-size: .94rem; }
.not-meta { font-family: var(--mono); font-size: .7rem; letter-spacing: .1em; color: var(--muted); text-align: right; white-space: nowrap; }
.not-bos { padding: 40px 0 80px; color: var(--muted); font-family: var(--mono); font-size: .85rem; }
.not-liste + .not-bos { padding-top: 40px; }
.not-liste { margin-bottom: 80px; }

/* daha fazla goster */
.not-sayfalama { margin: -56px 0 80px; display: flex; flex-direction: column; align-items: flex-start; gap: 12px; }
.not-daha {
  font-family: var(--mono); font-size: .74rem; font-weight: 500;
  letter-spacing: .14em; text-transform: uppercase;
  padding: 13px 26px; border-radius: 999px; cursor: pointer;
  background: #fff; color: var(--ink);
  border: 1px solid var(--line-2);
  transition: border-color .2s ease, color .2s ease, background .2s ease;
}
.not-daha:hover { border-color: var(--ink); background: var(--ink); color: #fff; }
.not-daha:focus-visible { outline: 2px solid var(--g2); outline-offset: 3px; }
.not-ilerleme { margin: 0; font-family: var(--mono); font-size: .72rem; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }

@media (max-width: 760px) {
  .not-satir { grid-template-columns: 1fr; gap: 10px; }
  .not-meta { text-align: left; }
}

/* tek not sayfası */
.not-tek-head {
  padding: 72px 0 40px; border-bottom: 1px solid var(--line);
  background:
    linear-gradient(var(--line) 1px, transparent 1px),
    linear-gradient(90deg, var(--line) 1px, transparent 1px);
  background-size: 28px 28px;
  background-color: var(--bg);
  position: relative;
}
.not-tek-head::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(255,255,255,.5) 0%, rgba(255,255,255,.94) 100%);
  pointer-events: none;
}
.not-tek-head .container { position: relative; z-index: 1; }
.not-crumbs { font-family: var(--mono); font-size: .72rem; letter-spacing: .1em; color: var(--muted); margin-bottom: 20px; }
.not-crumbs a:hover { color: var(--ink); }
.not-tek-head h1 { font-size: clamp(28px, 4.4vw, 46px); font-weight: 750; letter-spacing: -.035em; margin-top: 16px; max-width: 860px; }

/* künye şeridi */
.not-kunye {
  display: flex; flex-wrap: wrap; gap: 0; margin: 28px 0 0;
  border: 1px solid var(--line); border-radius: var(--radius-sm); background: #fff; overflow: hidden;
}
.not-kunye > div { padding: 12px 20px; flex: 1 1 auto; min-width: 130px; }
.not-kunye > div + div { border-left: 1px solid var(--line); }
.not-kunye dt { font-family: var(--mono); font-size: .64rem; font-weight: 500; letter-spacing: .18em; text-transform: uppercase; color: var(--muted); margin-bottom: 4px; }
.not-kunye dd { margin: 0; font-size: .92rem; font-weight: 550; color: var(--ink); }

/* not gövdesi — numaralı adımlar ve kod */
.not-icerik h2 { display: flex; align-items: baseline; gap: 14px; counter-increment: adim; }
.not-icerik h2::before {
  content: counter(adim, decimal-leading-zero);
  font-family: var(--mono); font-size: .78rem; font-weight: 500;
  letter-spacing: .1em; color: var(--kk); flex-shrink: 0;
}
.not-icerik { counter-reset: adim; }
.not-icerik pre {
  background: var(--dark); color: #cdd4e6; border-radius: var(--radius-sm);
  padding: 16px 18px; overflow-x: auto; font-family: var(--mono); font-size: .84rem; line-height: 1.75;
}
.not-icerik pre code { background: none; border: 0; padding: 0; color: inherit; font-size: inherit; }
.not-icerik blockquote { border-left-color: var(--kk); }
.not-icerik a { color: var(--kk); }
.not-icerik table th { background: #fff; }

/* diğer notlar kutusu */
.not-devam { margin-top: 56px; padding-top: 26px; border-top: 1px solid var(--line); }
.not-devam h4 { font-family: var(--mono); font-size: .7rem; font-weight: 500; text-transform: uppercase; letter-spacing: .2em; color: var(--muted); margin-bottom: 14px; }
.not-devam ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 0; }
.not-devam li { display: flex; align-items: baseline; gap: 14px; padding: 11px 0; border-bottom: 1px solid var(--line); }
.not-devam li:last-child { border-bottom: 0; }
.not-devam li span { font-family: var(--mono); font-size: .64rem; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); min-width: 74px; }
.not-devam li a { font-weight: 550; font-size: .95rem; }
.not-devam li a:hover { color: var(--g2); }

/* ============================================================
   ERPWARE BUILDER — ürün ailesinin kendi tasarım dili
   Broşürle birebir: Builder mavisi #0072ce zemin, dev beyaz
   "Sürükle. Bırak. Yayınla.", sağ üstte mono sürüm etiketi,
   kareler motifi (dolu kare kesikli yuvadan hedefe taşınır).
   ============================================================ */
.builder-bant {
  position: relative; overflow: hidden;
  background: #0072ce; color: #fff;
  padding: 72px 0 60px;
}
.builder-bant::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background:
    linear-gradient(rgba(255,255,255,.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.06) 1px, transparent 1px);
  background-size: 48px 48px;
  mask-image: radial-gradient(90% 90% at 80% 20%, #000 0%, transparent 100%);
}
.builder-bant .container { position: relative; }
.bb-ust { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 10px; margin-bottom: 30px; }
.bb-urun { font-size: 1.05rem; color: #fff; }
.bb-urun b { font-weight: 700; }
.bb-etiket { font-family: var(--mono); font-size: .74rem; letter-spacing: .22em; color: rgba(255,255,255,.88); }
.bb-izgara { display: grid; grid-template-columns: 1fr; gap: 48px; align-items: center; }
@media (min-width: 1000px) { .bb-izgara { grid-template-columns: .82fr 1.18fr; gap: 56px; } }
.bb-metin { min-width: 0; }
.bb-slogan { color: #fff; font-size: clamp(48px, 7vw, 92px); font-weight: 750; line-height: .98; letter-spacing: -.045em; margin-bottom: 26px; }
.bb-slogan.kucuk { font-size: clamp(22px, 2.6vw, 30px); line-height: 1.1; margin: 12px 0 18px; color: rgba(255,255,255,.92); }
.bb-baslik { color: #fff; font-size: clamp(30px, 4.2vw, 50px); font-weight: 750; letter-spacing: -.035em; }
.bb-lead { color: rgba(255,255,255,.92); font-size: 1.06rem; max-width: 520px; }
.bb-maddeler { list-style: none; margin: 26px 0 0; padding: 0; border-top: 1px solid rgba(255,255,255,.28); max-width: 520px; }
.bb-maddeler li { display: flex; gap: 12px; padding: 11px 0; border-bottom: 1px solid rgba(255,255,255,.28); font-size: .95rem; }
.bb-maddeler li::before { content: "→"; color: rgba(255,255,255,.7); }
.bb-cta { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
.bb-btn-birincil { background: #fff; color: #0072ce; }
.bb-btn-birincil:hover { background: #eaf3fc; transform: translateY(-1px); box-shadow: 0 10px 26px rgba(0, 30, 70, .25); }
.bb-btn-ikincil { background: transparent; color: #fff; border-color: rgba(255,255,255,.55); }
.bb-btn-ikincil:hover { border-color: #fff; }
.bb-yasal { margin-top: 40px; font-size: .74rem; color: rgba(255,255,255,.72); }
.bb-kirinti { font-family: var(--mono); font-size: .74rem; letter-spacing: .08em; color: rgba(255,255,255,.72); margin-bottom: 24px; }
.bb-kirinti a:hover { color: #fff; }
.bb-gorsel { position: relative; min-width: 0; }

/* kareler motifi — dolu kare kesikli yuvadan hedefe "sürüklenir" */
.bb-kareler { position: relative; display: grid; grid-template-columns: repeat(3, 34px); gap: 7px; margin-top: 44px; }
.bb-kareler i { width: 34px; height: 34px; border: 1.5px solid rgba(255,255,255,.8); border-radius: 3px; }
.bb-kareler i.kesik { border-style: dashed; }
.bb-kareler .tasinan {
  position: absolute; left: 0; top: 0; width: 34px; height: 34px; border-radius: 3px;
  background: #fff; transform: translate(82px, 0);
  animation: bb-tasi 5s ease-in-out infinite;
}
@keyframes bb-tasi {
  0%   { transform: translate(0, 41px); opacity: 0; }
  8%   { opacity: 1; }
  22%  { transform: translate(0, 41px); }
  55%  { transform: translate(82px, 0); }
  92%  { transform: translate(82px, 0); opacity: 1; }
  100% { transform: translate(82px, 0); opacity: 0; }
}

/* Designer penceresi — gerçek arayüzün temsili çizimi */
.bd-sarici { margin: 0; }
.bd-pencere {
  background: #252526; color: #d4d4d4;
  border: 1px solid rgba(255,255,255,.14); border-radius: 10px; overflow: hidden;
  box-shadow: 0 30px 70px rgba(0, 20, 60, .45);
  font-family: "Segoe UI", var(--font); font-size: 11px; line-height: 1.35; user-select: none;
}
.bd-baslik { display: flex; justify-content: space-between; align-items: center; gap: 10px; background: #1c2433; padding: 9px 14px; }
.bd-baslik strong { color: #fff; font-size: 12px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bd-kullanici { display: flex; align-items: center; gap: 8px; color: #c9d1dc; font-size: 10.5px; white-space: nowrap; }
.bd-kullanici i { font-style: normal; background: #f3f3f3; color: #111; border-radius: 4px; padding: 2px 8px; }
.bd-arac { display: flex; align-items: center; gap: 6px; padding: 8px 12px; background: #2d2d30; border-bottom: 1px solid #3c3c3c; overflow: hidden; }
.bd-marka { color: #3794ff; font-weight: 600; white-space: nowrap; }
.bd-ekran { color: #9a9a9a; margin-left: 8px; white-space: nowrap; }
.bd-bosluk { flex: 1; }
.bd-arac b { font-weight: 500; background: #3c3c3c; color: #e6e6e6; border-radius: 4px; padding: 4px 9px; white-space: nowrap; }
.bd-arac b.bd-yayinla { background: #0078d4; color: #fff; }
.bd-govde { display: grid; grid-template-columns: 148px minmax(0, 1fr) 158px; height: 340px; }
.bd-sol, .bd-sag { background: #252526; padding: 10px; overflow: hidden; }
.bd-sol { border-right: 1px solid #3c3c3c; }
.bd-sag { border-left: 1px solid #3c3c3c; }
.bd-panel-baslik { font-size: 9.5px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: #9a9a9a; margin: 4px 0 8px; }
.bd-agac { display: flex; flex-direction: column; gap: 5px; margin-bottom: 14px; }
.bd-agac span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bd-agac .alt { padding-left: 14px; color: #bdbdbd; }
.bd-agac .alt2 { padding-left: 26px; color: #9a9a9a; }
.bd-agac .secili { background: #094771; color: #fff; border-radius: 3px; padding: 2px 4px 2px 14px; }
.bd-agac.kucuk span { font-size: 10px; }
.bd-tuval { background: #1e1e1e; display: flex; flex-direction: column; min-width: 0; }
.bd-tuval-arac { display: flex; gap: 8px; padding: 7px 10px; border-bottom: 1px solid #3c3c3c; color: #bdbdbd; font-size: 10px; overflow: hidden; }
.bd-tuval-arac span { background: #333; border-radius: 3px; padding: 2px 7px; white-space: nowrap; }
.bd-sayfa {
  flex: 1; margin: 12px; padding: 10px; display: flex; flex-direction: column; gap: 8px; overflow: hidden;
  border: 1.5px solid #0078d4; background-color: #2a2a2a;
  background-image: linear-gradient(#353535 1px, transparent 1px), linear-gradient(90deg, #353535 1px, transparent 1px);
  background-size: 16px 16px;
}
.bd-kpi-satir { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; }
.bd-kpi-satir i { font-style: normal; display: flex; flex-direction: column; background: #333842; border: 1px solid #454b56; border-radius: 4px; padding: 5px 7px; font-size: 13px; font-weight: 600; color: #fff; }
.bd-kpi-satir em { font-style: normal; font-size: 8.5px; font-weight: 400; color: #9aa4b2; }
.bd-form { position: relative; display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; background: #333842; border: 1px solid #454b56; border-radius: 4px; padding: 14px 8px 8px; }
.bd-form.secili { outline: 1.5px solid #3794ff; outline-offset: 2px; }
.bd-etiket { position: absolute; top: -8px; left: 6px; background: #0078d4; color: #fff; font-size: 8.5px; padding: 1px 5px; border-radius: 2px; }
.bd-alan em { display: block; font-style: normal; font-size: 8.5px; color: #9aa4b2; margin-bottom: 3px; }
.bd-alan u { display: block; height: 14px; background: #252830; border: 1px solid #4a505b; border-radius: 2px; }
.bd-grid { background: #333842; border: 1px solid #454b56; border-radius: 4px; overflow: hidden; font-size: 9px; }
.bd-grid > div { display: grid; grid-template-columns: 1fr 1.6fr .7fr .7fr; }
.bd-grid > div span { padding: 4px 6px; border-bottom: 1px solid #3f4550; }
.bd-grid-bas span { background: #3a404b; color: #c9d1dc; font-weight: 600; }
.bd-grid .bar::after { content: ""; display: block; height: 5px; width: 70%; margin-top: 2px; border-radius: 2px; background: #4a515e; }
.bd-birak { border: 1.5px dashed #5a6170; border-radius: 4px; color: #8a93a3; text-align: center; padding: 8px; font-size: 9.5px; }
.bd-sekmeler { display: flex; gap: 4px; margin-bottom: 10px; }
.bd-sekmeler span { flex: 1; text-align: center; padding: 4px 0; border-radius: 3px; color: #9a9a9a; }
.bd-sekmeler .aktif { background: #37373d; color: #fff; box-shadow: inset 0 -2px 0 #3794ff; }
.bd-ozellik { display: flex; justify-content: space-between; gap: 6px; padding: 4px 0; border-bottom: 1px solid #333; }
.bd-ozellik em { font-style: normal; color: #9a9a9a; }
.bd-ozellik b { font-weight: 500; color: #e6e6e6; }
.bd-palet { display: flex; flex-direction: column; gap: 3px; }
.bd-palet span { padding: 3px 6px; border-radius: 3px; background: #2d2d30; }
.bd-palet span::before { content: "▪ "; color: #d19a66; }
.bd-gercek { display: block; width: 100%; max-width: 560px; height: auto; border-radius: 10px; border: 1px solid rgba(255,255,255,.14); box-shadow: 0 30px 70px rgba(0, 20, 60, .45); }
.bd-altyazi { margin-top: 10px; font-family: var(--mono); font-size: .68rem; letter-spacing: .12em; color: rgba(255,255,255,.66); text-align: right; }

@media (max-width: 760px) {
  .bd-govde { grid-template-columns: minmax(0, 1fr); height: auto; }
  .bd-sol, .bd-sag, .bd-ekran { display: none; }
  .bd-arac b:not(.bd-yayinla) { display: none; }
  .bd-kullanici { display: none; }
}

/* ürün sayfası (product.html.twig) */
.urun-hero { padding-top: 56px; padding-bottom: 92px; }
.urun-ozet {
  position: relative; z-index: 2; margin: -40px 0 0;
  display: grid; grid-template-columns: 1fr;
  background: #fff; border: 1px solid var(--line); border-radius: var(--radius-lg);
  box-shadow: var(--shadow); overflow: hidden;
}
@media (min-width: 760px) { .urun-ozet { grid-template-columns: repeat(4, 1fr); } }
.urun-ozet > div { padding: 20px 22px; }
.urun-ozet > div + div { border-top: 1px solid var(--line); }
@media (min-width: 760px) { .urun-ozet > div + div { border-top: 0; border-left: 1px solid var(--line); } }
.urun-ozet dt { font-family: var(--mono); font-size: .66rem; letter-spacing: .18em; text-transform: uppercase; color: #0072ce; margin-bottom: 6px; }
.urun-ozet dd { margin: 0; font-size: .95rem; font-weight: 550; color: var(--ink); }
.urun-icerik a { color: #0072ce; }
.urun-icerik table th { background: #eaf3fc; }
.urun-icerik h3 { color: var(--ink); }

/* ---------------- Mobil düzeltmeleri ---------------- */
@media (max-width: 720px) {
  /* hayalet kontur harfleri dar ekranda başlığın üstüne biniyordu */
  .hero-hayalet, .cat-hayalet { display: none; }

  /* çözüm başlığı: ikon solda sütun kaplayıp başlığı ve özeti daraltıyordu → ikon üste */
  .sol-hero { padding: 56px 0 48px; }
  .sol-hero-row { flex-direction: column; gap: 16px; }
  .sol-hero .feature-icon { width: 46px; height: 46px; border-radius: 12px; margin: 0; }
  .sol-hero .feature-icon svg { width: 22px; height: 22px; }
  .sol-hero h1 { font-size: 30px; line-height: 1.12; text-wrap: balance; }

  /* konu süzgeci: parmakla dokunulabilir yükseklik (33px → 42px) */
  .konu-cip { padding: 13px 16px; }

  /* metin içi tablolar dar ekranda sayfayı yana kaydırmasın, kendi içinde kaysın */
  .method-content table, .sol-content table, .page-body table {
    display: block; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch;
  }
  /* çözüm tabloları: sütunlar kelime kelime ezilmesin; ilk sütun (satır adı) kayarken yerinde kalsın */
  .sol-content table, .page-body table { font-size: .875rem; }
  .sol-content th, .sol-content td, .page-body th, .page-body td { padding: 10px 12px; min-width: 104px; }
  .sol-content th:first-child, .sol-content td:first-child,
  .page-body th:first-child, .page-body td:first-child {
    position: sticky; left: 0; z-index: 1; min-width: 112px; background: var(--bg);
    box-shadow: 1px 0 0 var(--line-2);
  }
  .sol-content thead th:first-child, .page-body thead th:first-child { background: var(--bg-soft); }
  .sol-content th:last-child, .sol-content td:last-child,
  .page-body th:last-child, .page-body td:last-child { min-width: 200px; }

  /* geniş şemalar: küçültmek yerine kendi içinde yatay kaydırılsın (yazılar okunur kalsın) */
  .onprem-sar, .bi-panel { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .onprem { display: none; }
  .onprem-dikey { display: block; }
  .bi-panel svg { min-width: 520px; }

  /* alt bilgi bağlantıları: parmakla dokunulabilir yükseklik */
  .footer-col ul { gap: 0; }
  .footer-col a { display: inline-block; padding-block: 7px; }

  .hero { padding-top: 72px; }
  .section { padding: 72px 0; }
  .cta-inner { padding: 48px 24px; }
}

@media (prefers-reduced-motion: reduce) {
  * { animation: none !important; scroll-behavior: auto !important; transition: none !important; }
  .reveal { opacity: 1; transform: none; }
  .akis-ipligi i, .akis-ipligi::after { transition: none; }
  /* tek piksel akışı SMIL ile çalışır ve marka mesajının kendisidir; bu modda da akar */
  .zincir li { opacity: 1; }
  .yolculuk::after { display: none; }
  .bi-cubuk { animation: none; }
}

/* ---- TIVA Builder tanitim afisi ---- */
.tiva-afis {
  margin: 34px 0 30px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
}
.tiva-afis img {
  display: block;
  width: 100%;
  max-width: 420px;
  height: auto;
  border-radius: 16px;
  border: 1px solid #e6e8ef;
  box-shadow: 0 18px 44px rgba(15, 27, 61, .14);
}
.tiva-afis figcaption {
  font-size: .86rem;
  line-height: 1.5;
  color: #5c6479;
  text-align: center;
  max-width: 460px;
}

/* --- Yapay Zekâ Sözlüğü ------------------------------------------------ */
.soz-hero {
  position: relative;
  padding: 84px 0 44px;
  border-bottom: 1px solid var(--line);
  background:
    linear-gradient(var(--line) 1px, transparent 1px),
    linear-gradient(90deg, var(--line) 1px, transparent 1px);
  background-size: 28px 28px;
  background-color: var(--bg);
}
.soz-hero::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(255,255,255,.55) 0%, rgba(255,255,255,.92) 100%);
  pointer-events: none;
}
.soz-hero .container { position: relative; z-index: 1; }
.soz-hero h1 { font-size: clamp(32px, 5vw, 54px); font-weight: 750; letter-spacing: -.035em; }
.soz-lead { margin-top: 16px; color: var(--body-c); font-size: 1.05rem; max-width: 680px; }
.soz-sayac { margin-top: 22px; font-family: var(--mono); font-size: .74rem; letter-spacing: .16em; text-transform: uppercase; color: var(--muted); }
.soz-sayac span, .soz-sayac time { color: var(--ink); font-weight: 600; }
.soz-sayac .soz-yeni-sayi { color: var(--accent); }

.soz-govde { padding-bottom: 88px; }
.soz-arac { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; padding-top: 30px; }
.soz-ara { position: relative; display: flex; align-items: center; flex: 1 1 260px; max-width: 360px; }
.soz-ara-ikon { position: absolute; left: 14px; width: 17px; height: 17px; color: var(--muted); pointer-events: none; }
.soz-ara-ikon svg { width: 100%; height: 100%; }
.soz-ara input {
  width: 100%; padding: 12px 14px 12px 40px;
  font: inherit; font-size: .95rem; color: var(--ink);
  background: #fff; border: 1px solid var(--line); border-radius: 999px;
}
.soz-ara input:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.soz-suzgec { padding: 0; }
.gorunmez { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

.soz-giris { max-width: 680px; margin: 10px 0 4px; color: var(--body-c); }
.soz-giris p { margin-bottom: 10px; }

.soz-liste { margin: 22px 0 0; display: grid; gap: 0; }
.soz-terim {
  position: relative; padding: 22px 0 22px 18px;
  border-top: 1px solid var(--line);
}
.soz-terim::before {
  content: ""; position: absolute; left: 0; top: 24px; bottom: 24px;
  width: 3px; border-radius: 2px; background: var(--kk, var(--ink)); opacity: .5;
}
.soz-terim:last-child { border-bottom: 1px solid var(--line); }
.soz-terim dt { display: flex; flex-wrap: wrap; align-items: baseline; gap: 10px; }
.soz-ad { font-size: 1.06rem; font-weight: 650; letter-spacing: -.015em; color: var(--ink); }
.soz-en { font-family: var(--mono); font-size: .78rem; color: var(--muted); }
.soz-rozet {
  font-family: var(--mono); font-size: .64rem; letter-spacing: .14em; text-transform: uppercase;
  color: #fff; background: var(--accent); border-radius: 999px; padding: 3px 9px;
}
.soz-terim dd { margin: 8px 0 0; max-width: 760px; }
.soz-terim dd p { color: var(--body-c); font-size: .96rem; margin: 0; }
.soz-saha { margin-top: 6px !important; font-size: .9rem !important; color: var(--ink-2) !important; }
.soz-saha span { font-family: var(--mono); font-size: .72rem; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); margin-right: 6px; }
.soz-grup {
  display: inline-block; margin-top: 10px;
  font-family: var(--mono); font-size: .68rem; letter-spacing: .12em; text-transform: uppercase;
  color: var(--kk, var(--muted));
}
.soz-terim.yeni { background: linear-gradient(90deg, var(--accent-soft), transparent 60%); }
.soz-kapanis { margin-top: 34px; color: var(--muted); font-size: .9rem; max-width: 680px; }

@media (max-width: 560px) {
  .soz-ara { max-width: none; }
  .soz-terim { padding-left: 14px; }
  .soz-ad { font-size: 1rem; }
}

/* Mobilde konu/grup çipleri: satır sayısını azaltmak için daha derli toplu */
@media (max-width: 560px) {
  .konu-suzgec { gap: 6px; }
  .konu-cip { font-size: .66rem; letter-spacing: .08em; padding: 7px 11px; }
}

/* --- Deneyim şeridi ve zincir ------------------------------------------ */
.deneyim .section-lead { max-width: 720px; }
.zaman {
  list-style: none; margin: 34px 0 0; padding: 0;
  display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  border-top: 1px solid var(--line);
}
.durak { position: relative; padding: 26px 22px 30px 0; }
.durak::before {
  content: ""; position: absolute; top: -1px; left: 0; width: 34px; height: 3px;
  background: var(--accent, #3b82f6);
}
.durak-yil {
  display: block; font-family: var(--mono); font-size: .76rem; letter-spacing: .14em;
  text-transform: uppercase; color: var(--muted); margin-bottom: 10px;
}
.durak h3 { font-size: 1.05rem; font-weight: 650; margin-bottom: 8px; letter-spacing: -.01em; }
.durak p { color: var(--body-c); font-size: .92rem; max-width: 280px; }
.durak.ileride::before { background: var(--line-2); }
.durak.ileride .durak-yil, .durak.ileride h3 { color: var(--muted); }
.durak-etiket {
  display: inline-block; vertical-align: middle; margin-left: 6px;
  font-family: var(--mono); font-size: .6rem; letter-spacing: .12em; text-transform: uppercase;
  color: var(--muted); border: 1px solid var(--line-2); border-radius: 999px; padding: 3px 8px;
}

.akis-kutu { margin-top: 40px; padding: 26px; background: var(--bg-soft); border: 1px solid var(--line); border-radius: var(--radius-lg); }
.akis { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.akis-halka {
  display: flex; align-items: baseline; gap: 8px;
  font-weight: 600; font-size: .95rem; color: var(--ink);
  background: #fff; border: 1px solid var(--line); border-radius: 999px; padding: 9px 16px;
}
.akis-halka + .akis-halka::before { content: "→"; color: var(--muted); margin-right: 4px; font-weight: 500; }
.akis-halka.ileride { color: var(--muted); border-style: dashed; background: transparent; }
.akis-halka em {
  font-style: normal; font-family: var(--mono); font-size: .6rem; letter-spacing: .1em;
  text-transform: uppercase; color: var(--muted);
}
.akis-not { margin-top: 14px; font-size: .86rem; color: var(--muted); max-width: 640px; }

@media (max-width: 560px) {
  .zaman { grid-template-columns: 1fr; }
  .durak { padding: 22px 0 24px; border-bottom: 1px solid var(--line); }
  .durak p { max-width: none; }
  .akis-kutu { padding: 20px 16px; }
  .akis-halka { font-size: .88rem; padding: 8px 13px; }
}

/* akış halkalarındaki span'i genel span kurallarından ayır */
.akis-halka { align-items: center; }
.akis-halka span {
  font-family: inherit; font-size: inherit; font-weight: inherit;
  letter-spacing: normal; text-transform: none; color: inherit;
}
.akis-halka em { margin-left: 2px; }

/* Kaynaklar açılır menüsü tek sütun */
.nav-sub-dar { grid-template-columns: 1fr; min-width: 250px; }

/* Çözüm sayfası — okumaya devam edin */
.sol-kaynaklar { margin-top: 46px; padding-top: 26px; border-top: 1px solid var(--line); }
.sol-kaynaklar h2 { font-family: var(--mono); font-size: .74rem; font-weight: 500; text-transform: uppercase; letter-spacing: .2em; color: var(--muted); margin-bottom: 16px; }
.sol-kaynaklar ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.sol-kaynaklar li { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; }
.sol-kaynaklar a { font-weight: 600; color: var(--ink); border-bottom: 1px solid var(--line-2); }
.sol-kaynaklar a:hover { color: var(--accent); border-color: var(--accent); }
.sol-kaynaklar span { color: var(--muted); font-size: .9rem; }

/* --- Yapay Zekâ sayfası ------------------------------------------------- */
.yz-cta { margin-top: 26px; }
.yz-govde { padding-bottom: 88px; }
.yz-giris { max-width: 720px; margin: 34px 0 0; color: var(--body-c); }
.yz-giris p { margin-bottom: 14px; }
.yz-blok { margin-top: 48px; }
.yz-blok > h2 { font-size: clamp(22px, 3vw, 30px); font-weight: 700; letter-spacing: -.02em; margin-bottom: 20px; }

.yz-durum { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 18px; }
.yz-sutun { background: #fff; border: 1px solid var(--line); border-radius: var(--radius-lg); padding: 22px; }
.yz-sutun ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.yz-sutun li { position: relative; padding-left: 18px; font-size: .93rem; color: var(--ink-2); }
.yz-sutun li::before { content: ""; position: absolute; left: 0; top: .55em; width: 7px; height: 7px; border-radius: 50%; background: var(--line-2); }
.yz-etiket {
  display: inline-block; margin-bottom: 14px;
  font-family: var(--mono); font-size: .66rem; letter-spacing: .14em; text-transform: uppercase;
  border-radius: 999px; padding: 5px 11px;
}
.yz-sutun.hazir .yz-etiket { background: var(--accent); color: #fff; }
.yz-sutun.hazir li::before { background: var(--accent); }
.yz-sutun.gelisiyor .yz-etiket { background: var(--bg-soft); color: var(--ink); border: 1px solid var(--line-2); }
.yz-sutun.ileride { border-style: dashed; background: transparent; }
.yz-sutun.ileride .yz-etiket { background: transparent; color: var(--muted); border: 1px solid var(--line-2); }
.yz-sutun.ileride li { color: var(--muted); }

.yz-konum { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 18px; }
.yz-kart { background: #fff; border: 1px solid var(--line); border-radius: var(--radius-lg); padding: 24px; }
.yz-kart h3 { font-size: 1.08rem; font-weight: 650; margin-bottom: 8px; }
.yz-kart > p { color: var(--body-c); font-size: .95rem; margin-bottom: 14px; }
.yz-kart ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.yz-kart li { display: flex; gap: 9px; font-size: .9rem; color: var(--ink-2); }
.yz-kart li::before { content: "→"; color: var(--accent); }
.yz-kapanis { margin-top: 40px; color: var(--muted); font-size: .9rem; max-width: 700px; }

@media (max-width: 560px) {
  .yz-sutun, .yz-kart { padding: 18px 16px; }
}

/* Yapay zekâ / güvenlik sayfalarında soru-cevap */
.yz-sorular dl { display: grid; gap: 0; border-top: 1px solid var(--line); }
.yz-sorular dl > div { padding: 20px 0; border-bottom: 1px solid var(--line); }
.yz-sorular dt { font-size: 1.02rem; font-weight: 650; color: var(--ink); margin-bottom: 8px; }
.yz-sorular dd { margin: 0; color: var(--body-c); font-size: .95rem; max-width: 760px; }

/* Çözümler menüsü — ailelere göre gruplama */
.nav-sub-aile { grid-template-columns: repeat(3, minmax(190px, 1fr)); padding: 14px; gap: 6px 10px; }
.nav-aile { padding: 4px 0 10px; }
.nav-aile-ad {
  display: block; padding: 0 12px 8px;
  font-family: var(--mono); font-size: .64rem; letter-spacing: .14em;
  text-transform: uppercase; color: var(--muted);
}
.nav-aile ul { list-style: none; margin: 0; padding: 0; }
.nav-sub-aile a { padding: 8px 12px; font-size: .92rem; }

@media (max-width: 1000px) {
  .nav-sub-aile { grid-template-columns: 1fr; padding: 0 0 0 14px; }
  .nav-aile { padding: 8px 0 4px; }
  .nav-aile-ad { padding: 0 14px 4px; }
}

/* --- Kullanım senaryoları ---------------------------------------------- */
.sen-izgara { margin-top: 38px; display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 20px; }
.sen-kart { background: #fff; border: 1px solid var(--line); border-radius: var(--radius-lg); padding: 26px; display: flex; flex-direction: column; }
.sen-kart > header { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
.sen-kart h2 { font-size: 1.15rem; font-weight: 700; letter-spacing: -.015em; }
.sen-sorular { list-style: none; margin: 0 0 16px; padding: 0; display: grid; gap: 9px; }
.sen-sorular li {
  position: relative; padding: 9px 13px 9px 30px;
  background: var(--bg-soft); border-radius: var(--radius-sm);
  font-size: .92rem; color: var(--ink-2);
}
.sen-sorular li::before { content: "“"; position: absolute; left: 12px; top: 8px; font-size: 1.1rem; color: var(--accent); font-weight: 700; }
.sen-cevap { color: var(--body-c); font-size: .93rem; margin-bottom: 12px; }
.sen-ileride { font-size: .88rem; color: var(--muted); margin-bottom: 12px; }
.sen-ileride span {
  font-family: var(--mono); font-size: .6rem; letter-spacing: .12em; text-transform: uppercase;
  border: 1px solid var(--line-2); border-radius: 999px; padding: 3px 8px; margin-right: 8px;
}
.sen-urunler { margin-top: auto; padding-top: 14px; border-top: 1px solid var(--line); display: flex; flex-wrap: wrap; gap: 8px; }
.sen-urunler a {
  font-family: var(--mono); font-size: .7rem; letter-spacing: .06em;
  color: var(--ink-2); background: var(--bg-soft); border-radius: 999px; padding: 6px 12px;
}
.sen-urunler a:hover { color: #fff; background: var(--accent); }

@media (max-width: 560px) {
  .sen-kart { padding: 20px 16px; }
}

.sen-kart .feature-icon {
  display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0;
  width: 40px; height: 40px; border-radius: 11px;
  background: var(--bg-soft); border: 1px solid var(--line); color: var(--accent);
}
.sen-kart .feature-icon svg { width: 20px; height: 20px; }

/* 320 px düzeltmeleri: dar ekranda ızgara ve uzun düğme taşmasın */
.sen-izgara { grid-template-columns: repeat(auto-fit, minmax(min(320px, 100%), 1fr)); }
.yz-durum { grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr)); }
.yz-konum { grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr)); }
.zaman { grid-template-columns: repeat(auto-fit, minmax(min(190px, 100%), 1fr)); }
@media (max-width: 420px) {
  .btn { white-space: normal; text-align: center; max-width: 100%; }
}

/* Dar masaüstünde Çözümler menüsü ekran dışına taşmasın */
@media (max-width: 1150px) {
  .nav-sub-aile {
    grid-template-columns: repeat(2, minmax(180px, 1fr));
    left: 0; transform: translateY(6px);
  }
  .nav-drop:hover .nav-sub-aile,
  .nav-drop:focus-within .nav-sub-aile { transform: translateY(0); }
}

/* --- Mimari sayfası ----------------------------------------------------- */
.mim-manifesto {
  margin-top: 18px; max-width: 680px;
  font-size: 1.05rem; font-weight: 650; color: var(--ink); line-height: 1.5;
  border-left: 3px solid var(--accent); padding-left: 14px;
}
.mim-yollar { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr)); gap: 20px; }
.mim-yol { background: #fff; border: 1px solid var(--line); border-radius: var(--radius-lg); padding: 26px; }
.mim-durum {
  display: inline-block; margin-bottom: 12px;
  font-family: var(--mono); font-size: .64rem; letter-spacing: .14em; text-transform: uppercase;
  color: #fff; background: var(--accent); border-radius: 999px; padding: 4px 11px;
}
.mim-yol h3 { font-size: 1.12rem; font-weight: 700; letter-spacing: -.015em; margin-bottom: 10px; }
.mim-yol > p { color: var(--body-c); font-size: .93rem; margin-bottom: 16px; }
.mim-yol ul, .mim-hizmet ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.mim-yol li, .mim-hizmet li { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; padding-top: 10px; border-top: 1px solid var(--line); }
.mim-yol li a, .mim-hizmet li a { font-weight: 600; color: var(--ink); }
.mim-yol li a:hover, .mim-hizmet li a:hover { color: var(--accent); }
.mim-yol em, .mim-hizmet em { font-style: normal; font-size: .85rem; color: var(--muted); }
.mim-hizmet { background: var(--bg-soft); border: 1px solid var(--line); border-radius: var(--radius-lg); padding: 26px; }
.mim-hizmet > p { color: var(--body-c); font-size: .93rem; max-width: 640px; margin-bottom: 16px; }
.mim-hizmet ul { grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr)); gap: 12px 24px; }

@media (max-width: 560px) {
  .mim-yol, .mim-hizmet { padding: 20px 16px; }
}

/* Aile menüsünün iki sütunlu hâli yalnız dar masaüstünde geçerli; mobilde tek sütun */
@media (max-width: 1000px) {
  .nav-sub-aile { grid-template-columns: 1fr; }
  .nav-sub-dar { min-width: 0; }
  .nav-sub, .nav-sub-aile, .nav-sub-dar { max-width: 100%; }
}

/* 1000-1200 px arası: menü kalemleri artınca üst menü sıkışsın, taşmasın */
@media (min-width: 1001px) and (max-width: 1200px) {
  .nav-list { gap: 0; }
  .nav-list a { padding: 8px 10px; font-size: .86rem; }
  .nav-cta { margin-left: 6px; }
}