@charset "UTF-8";
/* =====================================================================
   KARAM SAFETY — kn.css   ·  "kN" premium tasarım sistemi  ·  v1
   2026-08-16
   ---------------------------------------------------------------------
   kN = kiloNewton, KARAM ürünlerinin derecelendirildiği birim.
   Görsel dil: gün ışığı yüzeyler + ölçüm tırnağı imzası + tek güçlü
   güvenlik turuncusu + mühendislik mavisi. Koyu zemin YOK, blob YOK,
   glassmorphism YOK, her kutu aynı radius'ta DEĞİL.

   ⚠ KAPSAM KURALI
   Bu dosyadaki HER seçici .kn ile başlar (ya da body.knpd/.knab ile
   kapılanır). Hiçbir kural element seçicisiyle (section/h2/img/button)
   global yazılmamıştır. Korunan bölümler (.ka-hero, .kx-hero,
   .kx-sect.kx-conv, .kx-sect.kx-rel) .kn'nin DIŞINDA durur → bu dosya
   onlara ulaşamaz.
   ===================================================================== */

/* ═══════════════════════════════════════════════════════════════════
   1 · TOKENLAR
   ═══════════════════════════════════════════════════════════════════ */
.kn{
  /* — yüzeyler (hepsi aydınlık) — */
  --kn-paper:#ffffff;
  --kn-shell:#F7F8F7;          /* sıcak çok açık gri */
  --kn-ice:#EDF4F9;            /* çok açık buz mavisi */
  --kn-mint:#EBF5F0;           /* soft mint */
  --kn-peach:#FFF3EC;          /* çok açık şeftali */
  --kn-sand:#FAF7F2;

  /* — mürekkep merdiveni — */
  --kn-ink:#0F1419;
  --kn-ink-80:rgba(15,20,25,.82);
  --kn-ink-64:rgba(15,20,25,.68);   /* küçük metin AA sınırı üstünde */
  --kn-ink-44:rgba(15,20,25,.46);
  --kn-ink-20:rgba(15,20,25,.20);
  --kn-line:rgba(15,20,25,.11);
  --kn-line-2:rgba(15,20,25,.18);

  /* — vurgular — */
  --kn-orange:#F2540C;         /* çizgi/ikon/dolgu — METİN DEĞİL */
  --kn-orange-t:#C43F06;       /* küçük turuncu metin (5,2:1) */
  --kn-orange-b:#D2440A;       /* düğme dolgusu, beyaz yazı (4,6:1) */
  --kn-blue:#0B5FBF;           /* mühendislik mavisi (6,2:1) */
  --kn-cyan:#1197BE;
  --kn-green:#0E7A5A;          /* onay/uygunluk (5,3:1) */

  /* — ölçü — */
  --kn-max:1240px;
  --kn-pad:clamp(20px,5vw,48px);
  --kn-1:4px;  --kn-2:8px;   --kn-3:12px; --kn-4:16px;
  --kn-5:22px; --kn-6:30px;  --kn-7:40px; --kn-8:56px;
  --kn-9:clamp(56px,7vw,88px);
  --kn-10:clamp(72px,9vw,124px);

  /* — geometri: bilinçli olarak ÇEŞİTLİ — */
  --kn-r-xs:4px; --kn-r-sm:8px; --kn-r-md:14px; --kn-r-lg:22px; --kn-r-xl:32px;

  /* — hareket — */
  --kn-ease:cubic-bezier(.16,1,.3,1);
  --kn-ease-o:cubic-bezier(.33,1,.68,1);
  --kn-d:0s;
  --kn-sbw:0px;                /* kaydırma çubuğu genişliği (kn.js yazar) */

  /* — tipografi — */
  --kn-display:'Manrope','Inter',system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  --kn-body:'Inter',system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  --kn-mono:ui-monospace,SFMono-Regular,'SF Mono',Menlo,Consolas,'Liberation Mono',monospace;

  position:relative;
  font-family:var(--kn-body);
  color:var(--kn-ink);
  /* KAPSAMA: yeni tasarımın hiçbir kuralı dışarı sızmaz */
  isolation:isolate;
}
/* Arapça: Manrope Arap alfabesi taşımaz → sitede zaten yüklü Cairo'ya düş */
[dir=rtl] .kn{ --kn-display:'Cairo','Manrope','Inter',sans-serif; --kn-body:'Cairo','Inter',sans-serif; }

/* ═══════════════════════════════════════════════════════════════════
   2 · KABUK / IZGARA
   ═══════════════════════════════════════════════════════════════════ */
.kn-wrap{ width:100%; max-width:var(--kn-max); margin-inline:auto; padding-inline:var(--kn-pad); }
/* ⚠ Sitenin sabit .fab-stack'i sağda ~78px kaplıyor → sağa dayalı künye
   değerleri altında kalabiliyor. Geniş ekranda içerik sütununu simetrik
   olarak daraltarak her iki yanda ≥88px açıklık garanti edilir. */
@media (min-width:1024px){ .kn{ --kn-max:min(1240px,calc(100vw - 176px)); } }
.kn-sect{ position:relative; padding-block:var(--kn-9); }
.kn-sect--tight{ padding-block:var(--kn-8); }

/* Kenardan kenara zemin — belge genişliğini DEĞİŞTİRMEZ (yatay kaydırma yok) */
.kn-wash{ position:relative; }
.kn-wash::before{
  content:""; position:absolute; z-index:-1;
  inset-block:0;
  inset-inline:calc(50% - 50vw + var(--kn-sbw) / 2);
  background:var(--kn-wash-bg,var(--kn-shell));
  pointer-events:none;
}
.kn-wash--ice::before{ --kn-wash-bg:linear-gradient(180deg,#FAFCFD 0%,var(--kn-ice) 46%,#FAFCFD 100%); }
.kn-wash--mint::before{ --kn-wash-bg:linear-gradient(180deg,#FBFDFC 0%,var(--kn-mint) 52%,#FBFDFC 100%); }
.kn-wash--sand::before{ --kn-wash-bg:linear-gradient(180deg,#FFFFFF 0%,var(--kn-sand) 50%,#FFFFFF 100%); }
.kn-wash--shell::before{ --kn-wash-bg:var(--kn-shell); }

/* Yumuşak ışık yıkaması — dekorasyon değil, mekân derinliği */
.kn-aurora{
  position:absolute; inset-block:-8% -14%; inset-inline:calc(50% - 50vw + var(--kn-sbw) / 2);
  z-index:-1; pointer-events:none; overflow:hidden;
}
.kn-aurora i{ position:absolute; display:block; border-radius:50%; filter:blur(60px); opacity:.5; }
.kn-aurora i:nth-child(1){ inset-inline-start:4%;  inset-block-start:-6%; inline-size:46vw; block-size:46vw; max-inline-size:640px; max-block-size:640px; background:radial-gradient(circle,rgba(17,151,190,.34),transparent 68%); }
.kn-aurora i:nth-child(2){ inset-inline-end:-6%;   inset-block-end:-18%;  inline-size:40vw; block-size:40vw; max-inline-size:560px; max-block-size:560px; background:radial-gradient(circle,rgba(242,84,12,.20),transparent 66%); }
.kn-aurora i:nth-child(3){ inset-inline-start:38%; inset-block-end:-10%;  inline-size:32vw; block-size:32vw; max-inline-size:460px; max-block-size:460px; background:radial-gradient(circle,rgba(14,122,90,.16),transparent 70%); }

/* Teknik ızgara dokusu — çok hafif */
.kn-grid-tex{
  position:absolute; inset:0; z-index:-1; pointer-events:none; opacity:.5;
  background-image:linear-gradient(rgba(15,20,25,.055) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(15,20,25,.055) 1px,transparent 1px);
  background-size:44px 44px;
  -webkit-mask-image:radial-gradient(ellipse 78% 66% at 50% 42%,#000 12%,transparent 76%);
          mask-image:radial-gradient(ellipse 78% 66% at 50% 42%,#000 12%,transparent 76%);
}

/* ═══════════════════════════════════════════════════════════════════
   3 · TİPOGRAFİ
   ═══════════════════════════════════════════════════════════════════ */
.kn-d1{
  font-family:var(--kn-display); font-weight:800;
  font-size:clamp(2.05rem,1.1rem + 3.9vw,4.05rem);
  line-height:1.09;                   /* Türkçe kuyrukları (ş/ğ/ı) için ≥1.08 */
  letter-spacing:-.028em; margin:0; text-wrap:balance;
}
.kn-d2{
  font-family:var(--kn-display); font-weight:800;
  font-size:clamp(1.62rem,1rem + 2.3vw,2.7rem);
  line-height:1.17; letter-spacing:-.022em; margin:0; text-wrap:balance;
}
.kn-d3{
  font-family:var(--kn-display); font-weight:700;
  font-size:clamp(1.12rem,.96rem + .62vw,1.42rem);
  line-height:1.28; letter-spacing:-.012em; margin:0;
}
.kn-lead{
  font-size:clamp(1.02rem,.97rem + .28vw,1.16rem);
  line-height:1.68; color:var(--kn-ink-80); margin:0; max-width:62ch;
}
.kn-p{ font-size:1rem; line-height:1.76; color:var(--kn-ink-64); margin:0; max-width:66ch; }
.kn-hi{ color:var(--kn-orange-t); }
.kn-hi-b{ color:var(--kn-blue); }

/* İmza grafiği: ölçüm tırnağı + etiket */
.kn-ey{
  display:inline-flex; align-items:center; gap:10px;
  font-family:var(--kn-mono); font-size:.735rem; font-weight:600;
  letter-spacing:.15em; text-transform:uppercase;
  color:var(--kn-ink-64); margin:0 0 var(--kn-4);
}
.kn-ey i{
  flex:none; inline-size:34px; block-size:9px; display:block;
  background:
    linear-gradient(var(--kn-orange),var(--kn-orange)) left center/100% 2px no-repeat,
    linear-gradient(var(--kn-orange),var(--kn-orange)) left top/2px 9px no-repeat,
    linear-gradient(var(--kn-ink-20),var(--kn-ink-20)) 12px top/1px 6px no-repeat,
    linear-gradient(var(--kn-ink-20),var(--kn-ink-20)) 23px top/1px 6px no-repeat,
    linear-gradient(var(--kn-ink-20),var(--kn-ink-20)) right top/1px 9px no-repeat;
}
.kn-ey--blue i{ background-image:
    linear-gradient(var(--kn-blue),var(--kn-blue)),
    linear-gradient(var(--kn-blue),var(--kn-blue)),
    linear-gradient(var(--kn-ink-20),var(--kn-ink-20)),
    linear-gradient(var(--kn-ink-20),var(--kn-ink-20)),
    linear-gradient(var(--kn-ink-20),var(--kn-ink-20)); }

/* Bölüm başlığı bloğu */
.kn-head{ max-width:74ch; margin-bottom:var(--kn-7); }
.kn-head .kn-lead{ margin-top:var(--kn-4); }
.kn-head--split{
  display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);
  gap:var(--kn-6) var(--kn-8); align-items:end; max-width:none;
}
.kn-head--split .kn-lead{ margin-top:0; padding-bottom:6px; }
@media (max-width:860px){ .kn-head--split{ grid-template-columns:1fr; align-items:start; } }

/* ═══════════════════════════════════════════════════════════════════
   4 · DÜĞMELER & BAĞLANTILAR
   ═══════════════════════════════════════════════════════════════════ */
.kn-btn{
  --kn-bg:var(--kn-ink); --kn-fg:#fff; --kn-bd:transparent;
  position:relative; display:inline-flex; align-items:center; gap:10px;
  padding:14px 22px; border-radius:var(--kn-r-sm);
  background:var(--kn-bg); color:var(--kn-fg); border:1px solid var(--kn-bd);
  font-family:var(--kn-body); font-size:.95rem; font-weight:650; line-height:1.2;
  text-decoration:none; cursor:pointer; overflow:hidden; isolation:isolate;
  transition:transform .35s var(--kn-ease), box-shadow .35s var(--kn-ease), background-color .28s var(--kn-ease), color .28s var(--kn-ease), border-color .28s var(--kn-ease);
}
.kn-btn svg{ inline-size:17px; block-size:17px; flex:none; transition:transform .38s var(--kn-ease); }
.kn-btn:hover{ transform:translateY(-2px); box-shadow:0 10px 24px -14px rgba(15,20,25,.5); }
.kn-btn:hover svg:last-child{ transform:translateX(3px); }
[dir=rtl] .kn-btn:hover svg:last-child{ transform:translateX(-3px); }
.kn-btn:focus-visible{ outline:2px solid var(--kn-blue); outline-offset:3px; }
.kn-btn:active{ transform:translateY(0); }

.kn-btn--primary{ --kn-bg:var(--kn-orange-b); }
.kn-btn--primary:hover{ --kn-bg:#B93A07; }
/* ⚠ #128C4A beyaz yazıyla 4,31:1 (AA altı) → #0E7A41 ile 5,41:1 */
.kn-btn--wa{ --kn-bg:#0E7A41; }
.kn-btn--wa:hover{ --kn-bg:#0B6435; }
.kn-btn--line{ --kn-bg:transparent; --kn-fg:var(--kn-ink); --kn-bd:var(--kn-line-2); }
.kn-btn--line:hover{ --kn-bg:var(--kn-ink); --kn-fg:#fff; --kn-bd:var(--kn-ink); }
.kn-btn--sm{ padding:11px 16px; font-size:.88rem; }
/* ⚠ [hidden] tarayıcı stilinde display:none'dur ama .kn-btn'in display:inline-flex
   kuralı onu EZER → gizlenmesi gereken düğme görünür kalır. Açıkça bastır. */
.kn-btn[hidden]{ display:none !important; }

/* Metin bağlantısı — altı çizgi tabana göre konumlanır (Türkçe kuyrukları kesmez) */
.kn-link{
  display:inline-flex; align-items:center; gap:8px;
  color:var(--kn-blue); font-weight:600; text-decoration:underline;
  text-decoration-thickness:1.5px; text-underline-offset:.28em;
  text-decoration-color:rgba(11,95,191,.34);
  transition:text-decoration-color .3s var(--kn-ease), gap .3s var(--kn-ease);
}
.kn-link svg{ inline-size:16px; block-size:16px; transition:transform .35s var(--kn-ease); }
.kn-link:hover{ text-decoration-color:var(--kn-blue); }
.kn-link:hover svg{ transform:translateX(3px); }
[dir=rtl] .kn-link svg{ transform:scaleX(-1); }
[dir=rtl] .kn-link:hover svg{ transform:scaleX(-1) translateX(3px); }
.kn-link:focus-visible{ outline:2px solid var(--kn-blue); outline-offset:3px; border-radius:3px; }

/* ═══════════════════════════════════════════════════════════════════
   5 · HAREKET (IntersectionObserver ile .is-in)
   ═══════════════════════════════════════════════════════════════════ */
/* ⚠⚠ FAIL-OPEN KURALI
   Gizleme YALNIZCA .kn-anim varken uygulanır. Bu sınıfı sarmalayıcının hemen
   içindeki satır içi <script> senkron ekler; kn.js yüklenirse window.__knok
   işaretlenir; load + 1,5 sn sonra işaret yoksa sınıf kaldırılır.
   Böylece JS hiç gelmese/ hata verse bile İÇERİK GÖRÜNÜR KALIR.
   (İçeriği gizleyen animasyon, animasyon değil hatadır.) */
.kn.kn-anim .kn-rev{
  opacity:0; transform:translate3d(0,22px,0);
  transition:opacity .74s var(--kn-ease) var(--kn-d), transform .74s var(--kn-ease) var(--kn-d);
  will-change:opacity,transform;
}
.kn.kn-anim .kn-rev.is-in{ opacity:1; transform:none; will-change:auto; }

.kn.kn-anim .kn-clip{ clip-path:inset(0 0 100% 0); transition:clip-path .95s var(--kn-ease) var(--kn-d); }
.kn.kn-anim .kn-clip.is-in{ clip-path:inset(0 0 0 0); }

@media (prefers-reduced-motion:reduce){
  .kn *,.kn *::before,.kn *::after{
    animation-duration:.01ms !important; animation-iteration-count:1 !important;
    transition-duration:.01ms !important; scroll-behavior:auto !important;
  }
  .kn.kn-anim .kn-rev{ opacity:1; transform:none; }
  .kn.kn-anim .kn-clip{ clip-path:none; }
  .kn.kn-anim .kn-figure img{ transform:none; }
}

/* ═══════════════════════════════════════════════════════════════════
   6 · ORTAK BİLEŞENLER
   ═══════════════════════════════════════════════════════════════════ */

/* Ürün kodu plakası — sistemin karakteristik parçası */
.kn-code{
  display:inline-flex; align-items:stretch; border:1px solid var(--kn-line-2);
  border-radius:var(--kn-r-xs); overflow:hidden; background:var(--kn-paper);
  font-family:var(--kn-mono); line-height:1;
}
.kn-code b{
  display:flex; align-items:center; padding:8px 10px;
  background:var(--kn-ink); color:#fff;
  font-size:.66rem; font-weight:600; letter-spacing:.13em; text-transform:uppercase;
}
.kn-code span{
  display:flex; align-items:center; padding:8px 13px;
  font-size:.98rem; font-weight:600; letter-spacing:.05em; color:var(--kn-ink);
  white-space:nowrap;
}

/* Standart rozeti */
.kn-chip{
  display:inline-flex; align-items:center; gap:7px;
  padding:8px 13px; border-radius:100px;
  border:1px solid rgba(14,122,90,.28); background:rgba(14,122,90,.07);
  font-family:var(--kn-mono); font-size:.78rem; font-weight:600; letter-spacing:.04em;
  color:#0B6046; white-space:nowrap;
}
.kn-chip svg{ inline-size:14px; block-size:14px; flex:none; color:var(--kn-green); }
.kn-chip b{ font-weight:700; }
.kn-chip em{
  font-style:normal; font-size:.9em; opacity:.82;
  padding-inline-start:8px; margin-inline-start:2px;
  border-inline-start:1px solid rgba(14,122,90,.32);
}
.kn-chip--ce{ border-color:rgba(11,95,191,.28); background:rgba(11,95,191,.07); color:#0A4E9C; }
.kn-chip--ce svg{ color:var(--kn-blue); }

/* Güven satırı */
.kn-trust{ display:flex; flex-wrap:wrap; gap:10px 22px; margin:0; padding:0; list-style:none; }
.kn-trust li{
  display:flex; align-items:center; gap:9px;
  font-size:.9rem; font-weight:550; color:var(--kn-ink-64);
}
.kn-trust svg{ inline-size:16px; block-size:16px; flex:none; color:var(--kn-green); }

/* Büyük rakam */
.kn-fig b{
  display:block; font-family:var(--kn-display); font-weight:800;
  font-size:clamp(2.1rem,1.3rem + 2.5vw,3.3rem); line-height:1;
  letter-spacing:-.035em; color:var(--kn-ink); font-variant-numeric:tabular-nums;
}
.kn-fig b em{ font-style:normal; color:var(--kn-orange); }
/* ⚠ etiket kuralı DAİMA ">" ile — sayaç span'ını yakalamasın */
.kn-fig > span{
  display:block; margin-top:9px;
  font-family:var(--kn-mono); font-size:.735rem; font-weight:600;
  letter-spacing:.11em; text-transform:uppercase; color:var(--kn-ink-64);
}

/* ═══════════════════════════════════════════════════════════════════
   7 · ÜRÜN DETAY — SAHNE (above the fold)
   ═══════════════════════════════════════════════════════════════════ */
.kn-stage{ padding-block:var(--kn-8) var(--kn-9); }
.kn-stage-grid{
  display:grid; grid-template-columns:minmax(0,1.06fr) minmax(0,.94fr);
  gap:clamp(28px,4vw,64px); align-items:start;
}

/* — sol: ürün sahnesi — */
.kn-pstage{ position:relative; }
.kn-pstage-in{
  position:relative; border-radius:var(--kn-r-xl); overflow:hidden;
  background:
    radial-gradient(ellipse 74% 62% at 50% 40%,#FFFFFF 0%,#FBFCFD 44%,#EEF3F7 100%);
  border:1px solid var(--kn-line);
  box-shadow:0 1px 2px rgba(15,20,25,.04), 0 26px 48px -34px rgba(15,20,25,.34);
  aspect-ratio:1/1;
  display:grid; place-items:center;
  isolation:isolate;
}
.kn-pstage-tex{
  position:absolute; inset:0; z-index:0; pointer-events:none; opacity:.62;
  background-image:linear-gradient(rgba(15,20,25,.05) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(15,20,25,.05) 1px,transparent 1px);
  background-size:38px 38px;
  -webkit-mask-image:radial-gradient(circle at 50% 46%,transparent 26%,#000 82%);
          mask-image:radial-gradient(circle at 50% 46%,transparent 26%,#000 82%);
}
.kn-pstage-glow{
  position:absolute; z-index:0; inset-inline:14%; inset-block-end:6%; block-size:26%;
  background:radial-gradient(ellipse at 50% 100%,rgba(242,84,12,.17),transparent 70%);
  filter:blur(18px); pointer-events:none;
}
.kn-pstage-img{
  position:relative; z-index:1; inline-size:84%; block-size:84%;
  display:grid; place-items:center;
  transition:transform .7s var(--kn-ease);
  transform:translate3d(var(--kn-px,0px),var(--kn-py,0px),0);
}
.kn-pstage-img picture{ display:contents; }
.kn-pstage-img img{
  max-inline-size:100%; max-block-size:100%; inline-size:auto; block-size:auto;
  object-fit:contain;
  filter:drop-shadow(0 26px 34px rgba(15,20,25,.20));
  transition:transform .8s var(--kn-ease);
}
.kn-pstage-in:hover .kn-pstage-img img{ transform:scale(1.022); }

/* köşe ölçüm tırnakları — mühendislik diyagramı esintisi */
.kn-pstage-in::before,
.kn-pstage-in::after{
  content:""; position:absolute; z-index:2; inline-size:26px; block-size:26px;
  border:2px solid rgba(242,84,12,.42); pointer-events:none;
}
.kn-pstage-in::before{ inset-block-start:18px; inset-inline-start:18px; border-inline-end:0; border-block-end:0; border-start-start-radius:6px; }
.kn-pstage-in::after{ inset-block-end:18px; inset-inline-end:18px; border-inline-start:0; border-block-start:0; border-end-end-radius:6px; }

/* yüzen ürün kodu plakası */
.kn-pstage-code{
  position:absolute; z-index:3; inset-block-start:18px; inset-inline-end:18px;
  box-shadow:0 8px 20px -12px rgba(15,20,25,.4);
}
.kn-pstage-zoom{
  position:absolute; z-index:3; inset-block-end:16px; inset-inline-start:16px;
  inline-size:42px; block-size:42px; display:grid; place-items:center;
  border-radius:50%; border:1px solid var(--kn-line-2);
  background:rgba(255,255,255,.92); color:var(--kn-ink); cursor:pointer;
  transition:transform .35s var(--kn-ease), background-color .3s, color .3s;
}
.kn-pstage-zoom svg{ inline-size:19px; block-size:19px; }
.kn-pstage-zoom:hover{ background:var(--kn-ink); color:#fff; transform:scale(1.07); }
.kn-pstage-zoom:focus-visible{ outline:2px solid var(--kn-blue); outline-offset:3px; }

/* küçük görsel rayı (birden fazla görsel varsa) */
.kn-thumbs{ display:flex; gap:10px; margin-top:14px; flex-wrap:wrap; }
.kn-thumb{
  inline-size:70px; block-size:70px; padding:6px; cursor:pointer;
  border:1px solid var(--kn-line); border-radius:var(--kn-r-sm);
  background:var(--kn-paper); display:grid; place-items:center;
  transition:border-color .3s var(--kn-ease), transform .3s var(--kn-ease);
}
.kn-thumb img{ max-inline-size:100%; max-block-size:100%; object-fit:contain; }
.kn-thumb:hover{ transform:translateY(-2px); border-color:var(--kn-ink-20); }
.kn-thumb[aria-current=true]{ border-color:var(--kn-orange); box-shadow:0 0 0 1px var(--kn-orange); }
.kn-thumb:focus-visible{ outline:2px solid var(--kn-blue); outline-offset:2px; }

/* — sağ: bilgi sütunu — */
.kn-pinfo{ padding-block-start:6px; min-inline-size:0; }
.kn-pinfo .kn-d2{ margin-block:0 var(--kn-4); overflow-wrap:break-word; }
.kn-pmeta{ display:flex; flex-wrap:wrap; gap:10px; margin-bottom:var(--kn-5); }
.kn-pcat{
  display:inline-flex; align-items:center; padding:8px 13px;
  border-radius:100px; background:var(--kn-shell); border:1px solid var(--kn-line);
  font-size:.82rem; font-weight:600; color:var(--kn-ink-64);
}
.kn-pstd{ display:flex; flex-wrap:wrap; gap:8px; margin-bottom:var(--kn-5); }
.kn-pinfo .kn-lead{ margin-bottom:var(--kn-6); }

/* Öne çıkan değerler — künyeden seçilmiş 3 gerçek ölçü */
.kn-hilite{
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr));
  gap:0 clamp(12px,2vw,26px); margin:0 0 var(--kn-6);
  padding-block:var(--kn-4); border-block:1px solid var(--kn-line);
}
.kn-hilite > div{ min-inline-size:0; border-inline-start:1px solid var(--kn-line); padding-inline-start:clamp(12px,1.6vw,20px); }
.kn-hilite > div:first-child{ border-inline-start:0; padding-inline-start:0; }
.kn-hilite dt{
  font-family:var(--kn-mono); font-size:.685rem; font-weight:600;
  letter-spacing:.09em; text-transform:uppercase; color:var(--kn-ink-64);
  margin:0 0 7px; overflow-wrap:break-word;
}
.kn-hilite dd{
  margin:0; font-family:var(--kn-display); font-weight:800;
  font-size:clamp(1.15rem,.98rem + .7vw,1.62rem); line-height:1.12;
  letter-spacing:-.024em; color:var(--kn-ink); overflow-wrap:break-word;
  font-variant-numeric:tabular-nums;
}
.kn-hilite dd u{
  text-decoration:none; font-family:var(--kn-mono); font-weight:600;
  font-size:.68em; color:var(--kn-ink-64);
}
/* ⚠ Mobilde değerleri SAĞA dayamıyoruz: sitenin sabit .fab-stack'i sağ alt
   köşede duruyor ve sağa dayalı rakamların üstüne biniyor. Etiket üstte,
   değer altta — künye tabakası gibi okunur ve çakışma imkânsız. */
@media (max-width:520px){
  .kn-hilite{ grid-template-columns:repeat(3,minmax(0,1fr)); gap:0 12px; }
  .kn-hilite dd{ font-size:1.12rem; }
  .kn-hilite dt{ font-size:.63rem; letter-spacing:.06em; }
}
@media (max-width:400px){
  .kn-hilite{ grid-template-columns:1fr 1fr; row-gap:14px; }
  .kn-hilite > div:nth-child(3){ border-inline-start:0; padding-inline-start:0; }
}

/* CTA hiyerarşisi — üçü aynı ağırlıkta DEĞİL */
.kn-pcta{ display:flex; flex-wrap:wrap; gap:12px; align-items:center; margin-bottom:var(--kn-6); }
.kn-pcta .kn-btn--primary{ padding-inline:26px; }

.kn-pinfo .kn-trust{
  padding-block-start:var(--kn-5); border-block-start:1px solid var(--kn-line);
}
.kn-pfoot{ display:flex; flex-wrap:wrap; gap:14px 20px; align-items:center; margin-top:var(--kn-5); }
.kn-copy{
  display:inline-flex; align-items:center; gap:9px; padding:9px 14px;
  border:1px dashed var(--kn-line-2); border-radius:var(--kn-r-sm);
  background:none; color:var(--kn-ink-64); cursor:pointer;
  font-family:var(--kn-body); font-size:.86rem; font-weight:600;
  transition:color .3s var(--kn-ease), border-color .3s var(--kn-ease), background-color .3s;
}
.kn-copy svg{ inline-size:15px; block-size:15px; }
.kn-copy:hover{ color:var(--kn-ink); border-color:var(--kn-ink-20); background:var(--kn-shell); }
.kn-copy:focus-visible{ outline:2px solid var(--kn-blue); outline-offset:3px; }
.kn-copy.is-done{ color:var(--kn-green); border-color:rgba(14,122,90,.4); border-style:solid; }

@media (max-width:960px){
  .kn-stage-grid{ grid-template-columns:1fr; gap:var(--kn-6); }
  .kn-pstage-in{ aspect-ratio:4/3; }
  .kn-pstage-img{ inline-size:80%; block-size:80%; }
}
@media (max-width:520px){
  .kn-pstage-in{ aspect-ratio:1/1; border-radius:var(--kn-r-lg); }
  .kn-pstage-code{ inset-block-start:12px; inset-inline-end:12px; }
  .kn-pcta{ gap:10px; }
  .kn-pcta .kn-btn{ flex:1 1 auto; justify-content:center; min-inline-size:0; }
  .kn-thumb{ inline-size:58px; block-size:58px; }
}
/* Dokunmatikte rahat hedef (≥44px) — metin bağlantısı ve kopyala düğmesi
   masaüstünde ince kalır, mobilde büyür. */
@media (max-width:768px){
  .kn-link{ min-block-size:44px; align-items:center; padding-block:6px; }
  .kn-copy{ min-block-size:44px; padding-block:0; }
}

/* ═══════════════════════════════════════════════════════════════════
   8 · SAYFA İÇİ GEZİNME (yapışkan ray)
   ═══════════════════════════════════════════════════════════════════ */
/* Sitenin kendi başlığı kaydırınca position:fixed olup ~74px yer kaplar →
   yapışkan ray onun ALTINA oturmalı. Gerçek yükseklik kn.js ile ölçülür. */
.kn{ --kn-top:74px; }
.kn-jump{
  position:sticky; inset-block-start:var(--kn-top); z-index:6;
  background:rgba(255,255,255,.9);
  -webkit-backdrop-filter:blur(9px); backdrop-filter:blur(9px);
  border-block:1px solid var(--kn-line);
}
.kn-jump-in{ display:flex; gap:4px; overflow-x:auto; scrollbar-width:none; -ms-overflow-style:none; }
.kn-jump-in::-webkit-scrollbar{ display:none; }
.kn-jump a{
  flex:none; padding:14px 15px; text-decoration:none; white-space:nowrap;
  font-family:var(--kn-mono); font-size:.76rem; font-weight:600;
  letter-spacing:.09em; text-transform:uppercase; color:var(--kn-ink-64);
  border-block-end:2px solid transparent;
  transition:color .28s var(--kn-ease), border-color .28s var(--kn-ease);
}
.kn-jump a:hover{ color:var(--kn-ink); }
.kn-jump a[aria-current=true]{ color:var(--kn-ink); border-block-end-color:var(--kn-orange); }
.kn-jump a:focus-visible{ outline:2px solid var(--kn-blue); outline-offset:-3px; }
.kn [id^="knS-"]{ scroll-margin-block-start:calc(var(--kn-top) + 62px); }

/* ═══════════════════════════════════════════════════════════════════
   9 · TEKNİK KÜNYE
   ═══════════════════════════════════════════════════════════════════ */
.kn-specs{
  display:grid; gap:0 clamp(28px,4vw,64px);
  grid-template-columns:repeat(var(--kn-cols,1),minmax(0,1fr));
}
.kn-spec{
  display:grid; grid-template-columns:minmax(0,auto) 1fr minmax(0,auto);
  align-items:baseline; gap:0 10px;
  padding-block:15px; border-block-end:1px solid var(--kn-line);
  min-inline-size:0;
}
.kn-spec-k{
  font-size:.925rem; font-weight:550; color:var(--kn-ink-64);
  overflow-wrap:break-word; min-inline-size:0;
}
/* nokta rehberi — mühendislik künyesi hissi */
.kn-spec-dot{
  block-size:1px; align-self:center; min-inline-size:16px;
  background-image:radial-gradient(circle,var(--kn-ink-20) 1px,transparent 1px);
  background-size:5px 5px; background-repeat:repeat-x; background-position:0 center;
  opacity:.85;
}
.kn-spec-v{
  font-family:var(--kn-mono); font-size:.94rem; font-weight:600; color:var(--kn-ink);
  text-align:end; overflow-wrap:break-word; min-inline-size:0;
  font-variant-numeric:tabular-nums;
}
.kn-spec-v u{ text-decoration:none; color:var(--kn-ink-64); font-weight:500; }
/* STACK — değer sütuna sığmayacak kadar uzun: etiketin ALTINA iner,
   hücresinde kalır (ızgara ritmi bozulmaz) */
.kn-spec--stack{ grid-template-columns:1fr; gap:5px; }
.kn-spec--stack .kn-spec-v{ text-align:start; }

/* FLOW — gerçekten uzun metin (CMS bazı değerlere paragraf sıkıştırmış):
   tüm sütunları kaplar ve okunur gövde tipografisine geçer */
.kn-spec--flow{ grid-template-columns:1fr; gap:6px; }
.kn-spec--flow .kn-spec-v{
  text-align:start; font-family:var(--kn-body); font-weight:500;
  font-size:.95rem; line-height:1.68; color:var(--kn-ink-80);
}
.kn-specs--wide .kn-spec--flow{ grid-column:1 / -1; }

.kn-notes{ margin-top:var(--kn-6); display:flex; flex-direction:column; gap:10px; }
.kn-note{
  display:flex; gap:12px; align-items:flex-start;
  padding:14px 16px; border-radius:var(--kn-r-md);
  background:var(--kn-peach); border:1px solid rgba(242,84,12,.16);
  font-size:.94rem; line-height:1.62; color:var(--kn-ink-80);
}
.kn-note svg{ inline-size:17px; block-size:17px; flex:none; color:var(--kn-orange-t); margin-top:2px; }

@media (max-width:760px){
  .kn-specs{ --kn-cols:1 !important; }
  .kn-spec{ grid-template-columns:minmax(0,1fr) minmax(0,auto); gap:4px 12px; }
  .kn-spec-dot{ display:none; }
}

/* ═══════════════════════════════════════════════════════════════════
   10 · STANDARTLAR / GÜVEN KATMANI
   ═══════════════════════════════════════════════════════════════════ */
.kn-std-grid{
  display:grid; grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);
  gap:clamp(26px,4vw,60px); align-items:center;
}
.kn-std-cards{ display:grid; grid-template-columns:repeat(auto-fill,minmax(148px,1fr)); gap:12px; }
.kn-std-card{
  position:relative; padding:20px 18px; border-radius:var(--kn-r-md);
  background:var(--kn-paper); border:1px solid var(--kn-line);
  transition:transform .4s var(--kn-ease), box-shadow .4s var(--kn-ease), border-color .4s var(--kn-ease);
  overflow:hidden;
}
.kn-std-card::after{
  content:""; position:absolute; inset-block-start:0; inset-inline:0; block-size:2px;
  background:linear-gradient(90deg,var(--kn-orange),var(--kn-cyan));
  transform:scaleX(0); transform-origin:inline-start;
  transition:transform .5s var(--kn-ease);
}
.kn-std-card:hover{ transform:translateY(-3px); border-color:var(--kn-ink-20); box-shadow:0 14px 30px -22px rgba(15,20,25,.4); }
.kn-std-card:hover::after{ transform:scaleX(1); }
.kn-std-card b{
  display:block; font-family:var(--kn-mono); font-size:1.02rem; font-weight:700;
  letter-spacing:.02em; color:var(--kn-ink); margin-bottom:6px;
}
.kn-std-card > span{
  display:flex; align-items:center; gap:6px;
  font-size:.775rem; font-weight:600; color:var(--kn-green);
}
.kn-std-card > span svg{ inline-size:13px; block-size:13px; }
@media (max-width:860px){ .kn-std-grid{ grid-template-columns:1fr; } }

/* ═══════════════════════════════════════════════════════════════════
   11 · DOKÜMANLAR
   ═══════════════════════════════════════════════════════════════════ */
.kn-docs{ display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:14px; }
.kn-doc{
  position:relative; display:flex; align-items:flex-start; gap:14px;
  padding:18px; border-radius:var(--kn-r-md); text-decoration:none;
  background:var(--kn-paper); border:1px solid var(--kn-line); min-inline-size:0;
  transition:transform .4s var(--kn-ease), box-shadow .4s var(--kn-ease), border-color .4s var(--kn-ease);
}
.kn-doc:hover{ transform:translateY(-3px); border-color:var(--kn-ink-20); box-shadow:0 16px 32px -24px rgba(15,20,25,.42); }
.kn-doc:focus-visible{ outline:2px solid var(--kn-blue); outline-offset:3px; }
.kn-doc-ic{
  position:relative; flex:none; inline-size:44px; block-size:52px;
  display:grid; place-items:center; border-radius:var(--kn-r-xs);
  background:var(--kn-ice); color:var(--kn-blue);
}
.kn-doc-ic svg{ inline-size:22px; block-size:22px; }
.kn-doc-ic i{
  position:absolute; inset-block-end:-6px; inset-inline-start:50%;
  transform:translateX(-50%); padding:2px 6px; border-radius:3px;
  background:var(--kn-ink); color:#fff; font-style:normal;
  font-family:var(--kn-mono); font-size:.56rem; font-weight:700; letter-spacing:.06em;
}
[dir=rtl] .kn-doc-ic i{ transform:translateX(50%); }
.kn-doc-b{ min-inline-size:0; flex:1 1 auto; }
.kn-doc-t{
  display:block; font-family:var(--kn-mono); font-size:.7rem; font-weight:600;
  letter-spacing:.11em; text-transform:uppercase; color:var(--kn-ink-64); margin-bottom:5px;
}
.kn-doc-n{
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;
  overflow:hidden; overflow-wrap:anywhere; word-break:break-word;
  font-size:.95rem; font-weight:600; line-height:1.4; color:var(--kn-ink);
}
.kn-doc-go{
  flex:none; align-self:center; inline-size:30px; block-size:30px;
  display:grid; place-items:center; border-radius:50%;
  background:var(--kn-shell); color:var(--kn-ink-64);
  transition:background-color .35s var(--kn-ease), color .35s var(--kn-ease), transform .35s var(--kn-ease);
}
.kn-doc-go svg{ inline-size:15px; block-size:15px; }
[dir=rtl] .kn-doc-go svg{ transform:scaleX(-1); }
.kn-doc:hover .kn-doc-go{ background:var(--kn-orange-b); color:#fff; transform:translateX(2px); }
[dir=rtl] .kn-doc:hover .kn-doc-go{ transform:translateX(-2px); }

/* ═══════════════════════════════════════════════════════════════════
   12 · VİDEO
   ═══════════════════════════════════════════════════════════════════ */
.kn-videos{ display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr)); gap:20px; }
.kn-video{
  position:relative; aspect-ratio:16/9; border-radius:var(--kn-r-lg); overflow:hidden;
  background:var(--kn-ink); border:1px solid var(--kn-line);
  box-shadow:0 20px 40px -30px rgba(15,20,25,.5);
}
.kn-video img{ inline-size:100%; block-size:100%; object-fit:cover; transition:transform .8s var(--kn-ease), opacity .5s; }
.kn-video iframe{ position:absolute; inset:0; inline-size:100%; block-size:100%; border:0; }
.kn-video-btn{
  position:absolute; inset:0; inline-size:100%; block-size:100%;
  display:grid; place-items:center; cursor:pointer; border:0; padding:0;
  background:linear-gradient(180deg,rgba(15,20,25,.05),rgba(15,20,25,.42));
}
.kn-video-btn i{
  inline-size:74px; block-size:74px; border-radius:50%; display:grid; place-items:center;
  background:rgba(255,255,255,.95); color:var(--kn-orange-b);
  box-shadow:0 12px 30px -12px rgba(15,20,25,.6);
  transition:transform .45s var(--kn-ease), background-color .3s;
}
.kn-video-btn i svg{ inline-size:26px; block-size:26px; margin-inline-start:4px; }
[dir=rtl] .kn-video-btn i svg{ transform:scaleX(-1); margin-inline-start:0; margin-inline-end:4px; }
.kn-video-btn:hover i{ transform:scale(1.08); }
.kn-video-btn:hover + img,
.kn-video:hover img{ transform:scale(1.035); }
.kn-video-btn:focus-visible{ outline:3px solid var(--kn-blue); outline-offset:-4px; }

/* ═══════════════════════════════════════════════════════════════════
   13 · CMS / SERBEST METİN
   ═══════════════════════════════════════════════════════════════════ */
.kn-prose{ max-width:70ch; font-size:1.02rem; line-height:1.82; color:var(--kn-ink-80); }
.kn-prose > *{ margin-block:0 1.1em; }
.kn-prose > :last-child{ margin-block-end:0; }
.kn-prose strong,.kn-prose b{ color:var(--kn-ink); font-weight:650; }
.kn-prose a{ color:var(--kn-blue); text-decoration:underline; text-underline-offset:.22em; }
.kn-prose ul,.kn-prose ol{ padding-inline-start:1.3em; }
.kn-prose li{ margin-block:.4em; }
.kn-prose img{ max-inline-size:100%; block-size:auto; border-radius:var(--kn-r-md); }
.kn-prose table{
  inline-size:100%; border-collapse:collapse; font-size:.94rem;
  display:block; overflow-x:auto; white-space:normal;
}
.kn-prose td,.kn-prose th{
  padding:11px 13px; border:1px solid var(--kn-line); text-align:start; vertical-align:top;
}
.kn-prose th{ background:var(--kn-shell); font-weight:650; color:var(--kn-ink); }

/* ═══════════════════════════════════════════════════════════════════
   14 · MOBİL YAPIŞKAN CTA
   ═══════════════════════════════════════════════════════════════════ */
.kn-dock{
  position:fixed; inset-inline:0; inset-block-end:0; z-index:40;
  display:none; align-items:center; gap:10px;
  padding:10px 12px calc(10px + env(safe-area-inset-bottom));
  background:rgba(255,255,255,.96);
  -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px);
  border-block-start:1px solid var(--kn-line);
  box-shadow:0 -6px 24px -18px rgba(15,20,25,.5);
  transform:translateY(102%); visibility:hidden;
  transition:transform .42s var(--kn-ease), visibility 0s linear .42s;
}
.kn-dock.is-on{ transform:none; visibility:visible; transition:transform .42s var(--kn-ease), visibility 0s; }
.kn-dock-i{ flex:1 1 auto; min-inline-size:0; }
.kn-dock-i strong{
  display:block; font-size:.86rem; font-weight:650; color:var(--kn-ink);
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.kn-dock-i span{ display:block; font-family:var(--kn-mono); font-size:.72rem; color:var(--kn-ink-64); }
.kn-dock .kn-btn{ flex:none; }
.kn-dock-wa{
  flex:none; inline-size:44px; block-size:44px; display:grid; place-items:center;
  border-radius:var(--kn-r-sm); background:#0E7A41; color:#fff;
}
.kn-dock-wa svg{ inline-size:21px; block-size:21px; }
@media (max-width:760px){ .kn-dock{ display:flex; } }

/* ⚠ Sitenin sabit `.to-top` (z-index 60) ve `.fab-stack` (45) düğmeleri
   yapışkan CTA'nın (z-index 40) ÜSTÜNE biniyor — ölçüldü: to-top 766-818,
   dock 779-844. Dock görünürken ikisini yukarı ötele.
   ⚠ `.to-top`'un KENDİ `transition:.4s var(--ease)` (TÜM özellikler) kuralı
     var; üzerine yalnız `transition:translate` yazmak göster/gizle geçişini
     İPTAL eder → özgün geçiş yeniden bildirilip translate EKLENİR.
   ⚠ Taşıma `bottom` ile değil `translate` ile yapılır: kendi
     `transform:translateY()` göster/gizle animasyonu bozulmaz, CLS olmaz. */
@media (max-width:760px){
  body.knpd .fab-stack,
  body.knpd .to-top{
    transition:.4s var(--ease), translate .42s cubic-bezier(.16,1,.3,1);
  }
  body.knpd.kn-dock-on .fab-stack,
  body.knpd.kn-dock-on .to-top{ translate:0 -72px; }
  /* dock, sayfanın en altındaki footer içeriğini örtmesin */
  body.knpd footer.site-footer{ padding-block-end:72px; }
}

/* ═══════════════════════════════════════════════════════════════════
   15 · IŞIK KUTUSU
   ═══════════════════════════════════════════════════════════════════ */
.kn-lb{
  position:fixed; inset:0; z-index:120; display:grid; place-items:center;
  padding:clamp(16px,4vw,48px); background:rgba(247,248,247,.97);
  -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px);
  opacity:0; visibility:hidden; transition:opacity .35s var(--kn-ease), visibility 0s linear .35s;
}
.kn-lb.is-on{ opacity:1; visibility:visible; transition:opacity .35s var(--kn-ease), visibility 0s; }
.kn-lb img{ max-inline-size:100%; max-block-size:86vh; object-fit:contain; border-radius:var(--kn-r-md); }
.kn-lb-x{
  position:absolute; inset-block-start:clamp(12px,3vw,26px); inset-inline-end:clamp(12px,3vw,26px);
  inline-size:46px; block-size:46px; border-radius:50%; display:grid; place-items:center;
  border:1px solid var(--kn-line-2); background:#fff; color:var(--kn-ink); cursor:pointer;
  transition:background-color .3s, color .3s, transform .3s var(--kn-ease);
}
.kn-lb-x svg{ inline-size:20px; block-size:20px; }
.kn-lb-x:hover{ background:var(--kn-ink); color:#fff; transform:rotate(90deg); }
.kn-lb-x:focus-visible{ outline:2px solid var(--kn-blue); outline-offset:3px; }

/* ═══════════════════════════════════════════════════════════════════
   16 · HAKKIMIZDA — HİKÂYE
   ═══════════════════════════════════════════════════════════════════ */
.kn-story-grid{
  display:grid; grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);
  gap:clamp(30px,5vw,76px); align-items:center;
}
.kn-story-media{ position:relative; }
.kn-figure{
  position:relative; margin:0; border-radius:var(--kn-r-xl); overflow:hidden;
  background:var(--kn-shell); box-shadow:0 26px 52px -38px rgba(15,20,25,.5);
}
.kn-figure picture,.kn-figure img{ display:block; inline-size:100%; block-size:100%; object-fit:cover; }
.kn-figure--tall{ aspect-ratio:4/5; }
.kn-figure--wide{ aspect-ratio:16/11; }
/* ⚠ .is-in seçicisi HEM ata HEM ÖĞENİN KENDİSİ için yazılır —
   yalnız ".is-in .kn-figure img" yazmak, işaret figure'ün ÜZERİNDEYSE
   eşleşmez ve görsel sonsuza dek büyütülmüş kalır. */
.kn.kn-anim .kn-figure img{ transform:scale(1.05); transition:transform 1.3s var(--kn-ease); }
.kn.kn-anim .kn-figure.is-in img,
.kn.kn-anim .is-in .kn-figure img{ transform:none; }

.kn-story-badge{
  position:absolute; z-index:2; inset-block-end:20px; inset-inline-start:20px;
  display:inline-flex; align-items:center; gap:10px; padding:12px 16px;
  border-radius:var(--kn-r-md); background:rgba(255,255,255,.95);
  border:1px solid var(--kn-line); box-shadow:0 12px 28px -18px rgba(15,20,25,.5);
  font-size:.86rem; font-weight:650; color:var(--kn-ink);
}
.kn-story-badge svg{ inline-size:19px; block-size:19px; color:var(--kn-green); flex:none; }

.kn-story-txt .kn-p{ margin-top:var(--kn-4); }
.kn-story-acts{ display:flex; flex-wrap:wrap; gap:14px 22px; align-items:center; margin-top:var(--kn-6); }

/* rakam şeridi */
.kn-figs{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(140px,1fr));
  gap:var(--kn-4); margin-top:var(--kn-7);
  padding-block-start:var(--kn-6); border-block-start:1px solid var(--kn-line);
}
@media (max-width:900px){ .kn-story-grid{ grid-template-columns:1fr; } }

/* ═══════════════════════════════════════════════════════════════════
   17 · HAKKIMIZDA — YOLCULUK (dikey ilerleme hattı)
   ═══════════════════════════════════════════════════════════════════ */
.kn-tl{ position:relative; }
.kn-tl-list{ list-style:none; margin:0; padding:0; }
.kn-tl-rail{
  position:absolute; inset-block:14px 14px; inset-inline-start:var(--kn-rail,22px);
  inline-size:2px; background:var(--kn-line); border-radius:2px; overflow:hidden;
}
/* ⚠ Dolgu YÜZDE YÜKSEKLİKLE yapılmaz: kap mutlak konumlu ve yüksekliği
   inset'lerden geliyor → Chrome `block-size:32%` değerini 0px'e çözüyor
   (ölçüldü: --kn-fill=32.2% iken height=0px). Doğru ve GPU dostu yol
   scaleY: yükseklik %100 sabit, dolgu transform ile anlatılır. */
.kn-tl-rail i{
  position:absolute; inset-block-start:0; inset-inline:0; block-size:100%;
  transform:scaleY(var(--kn-fill,0)); transform-origin:top center;
  background:linear-gradient(180deg,var(--kn-orange),var(--kn-cyan));
  transition:transform .2s linear;
}
.kn-tl-item{
  position:relative; display:grid;
  grid-template-columns:46px minmax(0,1fr) minmax(0,1.25fr);
  gap:0 clamp(18px,3vw,44px); align-items:start;
  padding-block:clamp(24px,3.4vw,40px);
  border-block-end:1px solid var(--kn-line);
}
.kn-tl-item:last-child{ border-block-end:0; }
.kn-tl-node{
  position:relative; z-index:1; inline-size:46px; block-size:46px;
  display:grid; place-items:center; border-radius:50%;
  background:var(--kn-paper); border:1px solid var(--kn-line);
  color:var(--kn-ink-44);
  transition:border-color .5s var(--kn-ease), color .5s var(--kn-ease), background-color .5s var(--kn-ease), transform .5s var(--kn-ease);
}
.kn-tl-node svg{ inline-size:20px; block-size:20px; }
.kn-tl-item.is-on .kn-tl-node{
  border-color:var(--kn-orange); color:var(--kn-orange-t);
  background:var(--kn-peach); transform:scale(1.06);
}
.kn-tl-h{ min-inline-size:0; }
/* ⚠ Sıra numarası DEKORATİF DEĞİL (bilgi taşır) → AA kontrast zorunlu.
   --kn-ink-44 (.46 alfa) 3,08:1 veriyordu; --kn-ink-64 ≈ 5,3:1. */
.kn-tl-no{
  display:block; font-family:var(--kn-mono); font-size:.76rem; font-weight:700;
  letter-spacing:.13em; color:var(--kn-ink-64); margin-bottom:8px;
  transition:color .5s var(--kn-ease);
}
.kn-tl-item.is-on .kn-tl-no{ color:var(--kn-orange-t); }
.kn-tl-p{ font-size:1rem; line-height:1.74; color:var(--kn-ink-64); margin:0; max-width:56ch; }
@media (max-width:820px){
  .kn-tl-item{ grid-template-columns:44px minmax(0,1fr); gap:0 18px; }
  .kn-tl-p{ grid-column:2; margin-top:10px; }
  .kn-tl-rail{ --kn-rail:21px; }
}

/* ═══════════════════════════════════════════════════════════════════
   18 · HAKKIMIZDA — NEDEN KARAM? (editoryal ızgara)
   ═══════════════════════════════════════════════════════════════════ */
.kn-why{ display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:clamp(14px,1.8vw,22px); }
.kn-card{
  position:relative; display:flex; flex-direction:column; overflow:hidden;
  background:var(--kn-paper); border:1px solid var(--kn-line);
  transition:transform .5s var(--kn-ease), box-shadow .5s var(--kn-ease), border-color .5s var(--kn-ease);
}
.kn-card:hover{ transform:translateY(-4px); border-color:var(--kn-ink-20); box-shadow:0 26px 46px -34px rgba(15,20,25,.46); }
/* radius bilinçli olarak çeşitli */
.kn-why > .kn-card:nth-child(1){ grid-column:span 3; border-radius:var(--kn-r-xl); }
.kn-why > .kn-card:nth-child(2){ grid-column:span 3; border-radius:var(--kn-r-lg); }
.kn-why > .kn-card:nth-child(3){ grid-column:span 2; border-radius:var(--kn-r-md); }
.kn-why > .kn-card:nth-child(4){ grid-column:span 2; border-radius:var(--kn-r-lg); }
.kn-why > .kn-card:nth-child(5){ grid-column:span 2; border-radius:var(--kn-r-xl); }
.kn-card-media{ position:relative; overflow:hidden; aspect-ratio:16/10; background:var(--kn-shell); }
.kn-card-media picture,.kn-card-media img{ display:block; inline-size:100%; block-size:100%; object-fit:cover; }
.kn-card-media img{ transition:transform .85s var(--kn-ease); }
.kn-card:hover .kn-card-media img{ transform:scale(1.045); }
.kn-card-no{
  position:absolute; z-index:2; inset-block-start:14px; inset-inline-start:14px;
  padding:6px 11px; border-radius:var(--kn-r-xs);
  background:rgba(255,255,255,.94); color:var(--kn-ink);
  font-family:var(--kn-mono); font-size:.74rem; font-weight:700; letter-spacing:.1em;
}
.kn-card-b{ padding:clamp(18px,2.2vw,26px); display:flex; flex-direction:column; gap:10px; flex:1 1 auto; }
.kn-card-ic{
  inline-size:38px; block-size:38px; display:grid; place-items:center;
  border-radius:var(--kn-r-sm); background:var(--kn-ice); color:var(--kn-blue); margin-bottom:2px;
}
.kn-card-ic svg{ inline-size:19px; block-size:19px; }
.kn-card-b p{ font-size:.96rem; line-height:1.68; color:var(--kn-ink-64); margin:0; }
@media (max-width:1000px){
  .kn-why{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .kn-why > .kn-card{ grid-column:span 1 !important; }
  .kn-why > .kn-card:nth-child(5){ grid-column:span 2 !important; }
}
@media (max-width:620px){
  .kn-why{ grid-template-columns:1fr; }
  .kn-why > .kn-card:nth-child(n){ grid-column:span 1 !important; }
}

/* ═══════════════════════════════════════════════════════════════════
   19 · HAKKIMIZDA — KÜRESEL ERİŞİM
   ═══════════════════════════════════════════════════════════════════ */
.kn-globe{
  position:relative; border-radius:var(--kn-r-xl); overflow:hidden;
  background:linear-gradient(160deg,#FFFFFF 0%,#F3F8FC 58%,#EAF3F8 100%);
  border:1px solid var(--kn-line); padding:clamp(22px,3.4vw,44px);
  box-shadow:0 26px 54px -42px rgba(15,20,25,.42);
}
.kn-globe-map{ position:relative; }
.kn-globe-map img{ display:block; inline-size:100%; block-size:auto; opacity:.5; }
.kn-globe-net{ position:absolute; inset:0; inline-size:100%; block-size:100%; }
.kn-globe-net .base{ fill:none; stroke:rgba(15,20,25,.16); stroke-width:1; }
.kn-globe-net .flow{
  fill:none; stroke:var(--kn-orange); stroke-width:1.8; stroke-linecap:round;
  stroke-dasharray:8 190; stroke-dashoffset:198;
  animation:knFlow 4.4s linear infinite; animation-delay:calc(var(--i) * .42s);
}
@keyframes knFlow{ to{ stroke-dashoffset:-198; } }
.kn-globe-net .node{ fill:var(--kn-cyan); }
.kn-globe-net .hub{ fill:var(--kn-orange); }
.kn-globe-net .ring{ fill:none; stroke:var(--kn-orange); stroke-width:1.4; opacity:.5; }
.kn-globe-tag{
  position:absolute; z-index:2; inset-block-start:26%; inset-inline-start:57%;
  display:inline-flex; align-items:center; gap:7px;
  padding:6px 11px; border-radius:100px;
  background:rgba(255,255,255,.94); border:1px solid var(--kn-line);
  box-shadow:0 6px 16px -10px rgba(15,20,25,.5);
  font-family:var(--kn-mono); font-size:.7rem; font-weight:600;
  letter-spacing:.05em; color:var(--kn-ink); white-space:nowrap;
}
.kn-globe-tag i{ inline-size:7px; block-size:7px; border-radius:50%; background:var(--kn-orange); flex:none; }
@media (max-width:620px){ .kn-globe-tag{ font-size:.62rem; padding:4px 8px; } }
.kn-globe-figs{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
  gap:var(--kn-5); margin-top:var(--kn-7);
  padding-block-start:var(--kn-6); border-block-start:1px solid var(--kn-line);
}
@media (prefers-reduced-motion:reduce){ .kn-globe-net .flow{ animation:none; stroke-dasharray:none; stroke-dashoffset:0; opacity:.42; } }

/* ═══════════════════════════════════════════════════════════════════
   20 · HAKKIMIZDA — BELGELER
   ═══════════════════════════════════════════════════════════════════ */
.kn-certs{ display:grid; grid-template-columns:repeat(auto-fill,minmax(168px,1fr)); gap:16px; }
.kn-cert{
  position:relative; display:block; overflow:hidden;
  border-radius:var(--kn-r-md); border:1px solid var(--kn-line);
  background:var(--kn-paper); text-decoration:none; aspect-ratio:3/4;
  transition:transform .5s var(--kn-ease), box-shadow .5s var(--kn-ease), border-color .5s var(--kn-ease);
}
.kn-cert picture{ display:block; inline-size:100%; block-size:100%; }
.kn-cert img{ inline-size:100%; block-size:100%; object-fit:cover; object-position:top center; transition:transform .8s var(--kn-ease); }
.kn-cert:hover{ transform:translateY(-4px); border-color:var(--kn-ink-20); box-shadow:0 22px 40px -28px rgba(15,20,25,.5); }
.kn-cert:hover img{ transform:scale(1.04); }
.kn-cert:focus-visible{ outline:2px solid var(--kn-blue); outline-offset:3px; }
.kn-cert-sh{
  position:absolute; inset-block-end:0; inset-inline:0; padding:26px 14px 12px;
  background:linear-gradient(180deg,transparent,rgba(15,20,25,.88) 88%);
  color:#fff; font-family:var(--kn-mono); font-size:.7rem; font-weight:600; letter-spacing:.08em;
}
.kn-std-strip{ display:flex; flex-wrap:wrap; gap:10px; margin-top:var(--kn-6); }
.kn-certfoot{
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between;
  gap:var(--kn-5); margin-top:var(--kn-7);
  padding-block-start:var(--kn-6); border-block-start:1px solid var(--kn-line);
}

/* ═══════════════════════════════════════════════════════════════════
   21 · HAKKIMIZDA — KURUMSAL METİN (editoryal)
   ═══════════════════════════════════════════════════════════════════ */
.kn-cms-grid{
  display:grid; grid-template-columns:minmax(0,1.35fr) minmax(0,.65fr);
  gap:clamp(28px,4vw,64px); align-items:start;
}
.kn-cms-body{ position:relative; }
.kn-cms-body::before{
  content:"\201C"; position:absolute; inset-block-start:-.34em; inset-inline-start:-.06em;
  font-family:var(--kn-display); font-size:6.2rem; font-weight:800; line-height:1;
  color:rgba(242,84,12,.14); pointer-events:none; z-index:0;
}
.kn-cms-body > *{ position:relative; z-index:1; }
.kn-quote{
  margin:0; padding:26px 24px; border-radius:var(--kn-r-lg);
  background:var(--kn-mint); border:1px solid rgba(14,122,90,.16);
}
.kn-quote blockquote{
  margin:0 0 14px; font-family:var(--kn-display); font-weight:700;
  font-size:clamp(1.1rem,.98rem + .5vw,1.34rem); line-height:1.42;
  letter-spacing:-.014em; color:var(--kn-ink);
}
.kn-quote figcaption{
  display:flex; align-items:center; gap:10px;
  font-family:var(--kn-mono); font-size:.74rem; font-weight:600;
  letter-spacing:.11em; text-transform:uppercase; color:var(--kn-ink-64);
}
.kn-quote figcaption i{ display:block; inline-size:26px; block-size:2px; background:var(--kn-green); }
.kn-cms-side{ position:sticky; inset-block-start:24px; display:grid; gap:18px; }
@media (max-width:920px){
  .kn-cms-grid{ grid-template-columns:1fr; }
  .kn-cms-side{ position:static; }
}

/* Uzun metin: kademeli açılım */
.kn-more{ position:relative; }
.kn-more[data-clamped=true] .kn-more-body{
  max-block-size:34em; overflow:hidden;
  -webkit-mask-image:linear-gradient(180deg,#000 72%,transparent 100%);
          mask-image:linear-gradient(180deg,#000 72%,transparent 100%);
}
.kn-more-btn{ margin-top:var(--kn-5); }

/* ═══════════════════════════════════════════════════════════════════
   22 · KAPANIŞ CTA
   ═══════════════════════════════════════════════════════════════════ */
.kn-cta{
  position:relative; overflow:hidden; border-radius:var(--kn-r-xl);
  padding:clamp(30px,5vw,68px);
  background:linear-gradient(140deg,#FFF6F0 0%,#FFFFFF 42%,#EDF4F9 100%);
  border:1px solid var(--kn-line);
  box-shadow:0 30px 60px -46px rgba(15,20,25,.44);
}
.kn-cta-glow{
  position:absolute; z-index:0; inset-block-start:-38%; inset-inline-end:-14%;
  inline-size:52%; aspect-ratio:1; border-radius:50%; pointer-events:none;
  background:radial-gradient(circle,rgba(242,84,12,.19),transparent 66%); filter:blur(38px);
}
.kn-cta-in{ position:relative; z-index:1; max-width:66ch; }
.kn-cta-btns{ display:flex; flex-wrap:wrap; gap:12px; margin-top:var(--kn-6); }

/* ═══════════════════════════════════════════════════════════════════
   23 · SAYFA KAPSAMI DÜZELTMELERİ
   Yalnız yeni sayfaların GÖVDE sınıfına kapılanır; korunan bölümlere
   ait hiçbir seçici yoktur.
   ═══════════════════════════════════════════════════════════════════ */
/* eski gövde artık yok → eski taban kuralların boşluğu sıfırlanır */
body.knab .kn{ background:var(--kn-paper); }
body.knpd .kn{ background:var(--kn-paper); }
/* uzun bileşik kelimeler dar ekranda taşmasın */
.kn h1,.kn h2,.kn h3,.kn p,.kn li,.kn span,.kn b,.kn strong{ overflow-wrap:break-word; }
.kn ::selection{ background:rgba(242,84,12,.22); color:var(--kn-ink); }