/* Sunum tasarım katmanı: kutu, kart ve vurgu bileşenlerini ortak bir görsel dile getirir.
   İçeriğe dokunmaz; yalnızca görünümü rafine eder. Renkler deste değişkenlerinden (--c1..--c6, --acc, --navy) gelir.
   color-mix desteklenmeyen tarayıcıda ilgili satırlar yok sayılır ve deste kendi stiliyle görünür. */

/* Zemin: düz gri yerine çok hafif ışık geçişi, kartlar öne çıksın */
.slide{background:
  radial-gradient(900px 420px at 100% 0%, color-mix(in srgb, var(--acc, #1fb5c9) 9%, transparent), transparent 70%),
  radial-gradient(760px 420px at 0% 100%, color-mix(in srgb, var(--c2, #2b6ea3) 6%, transparent), transparent 70%),
  var(--bg, #f4f6f9)}

/* Kartlar: renkli yüzey tonu, ince renkli çerçeve, renkli yumuşak gölge, üstte solan renk şeridi */
.slide .card,.slide .ncard,.slide .flow-step,.slide .duel-side{
  --kc:var(--k, var(--c2, #2b6ea3));
  position:relative;overflow:hidden;
  background:linear-gradient(165deg,#fff 52%, color-mix(in srgb, var(--kc) 8%, #fff) 100%);
  border:1px solid color-mix(in srgb, var(--kc) 22%, #dfe6ee);
  border-radius:16px;
  box-shadow:0 1px 2px rgba(15,27,42,.05), 0 12px 28px -12px color-mix(in srgb, var(--kc) 38%, transparent);
}
.slide .card.blue,.slide .card.cyan{--k:var(--c2, #2b6ea3)}
.slide .card.cyan{--k:var(--c1, #1fb5c9)}
.slide .card.green{--k:var(--c3, #0e9f86)}
.slide .card.orange{--k:var(--c4, #f07a1a)}
.slide .card.red{--k:var(--c5, #e5484d)}
.slide .card.purple{--k:var(--c6, #8b5cf6)}
.slide .card::before,.slide .ncard::before,.slide .flow-step::before{
  content:"";position:absolute;left:0;right:0;top:0;height:4px;
  background:linear-gradient(90deg, var(--kc), color-mix(in srgb, var(--kc) 12%, transparent) 85%)}
.slide .card,.slide .ncard{border-top-width:1px}
.slide .card h4,.slide .ncard h4,.slide .flow-step h4{letter-spacing:-.005em;font-weight:800;color:var(--ink)}
.slide .card .ic,.slide .flow-step .ic{
  background:linear-gradient(145deg, color-mix(in srgb, var(--kc) 18%, #fff), color-mix(in srgb, var(--kc) 8%, #fff));
  color:var(--kc);box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--kc) 28%, transparent)}
.slide .ncard .no{
  background:linear-gradient(135deg, var(--kc), color-mix(in srgb, var(--kc) 68%, #000));
  box-shadow:0 5px 12px -3px color-mix(in srgb, var(--kc) 55%, transparent)}
/* Kart içinde anahtar kelime: fosforlu kalem altı */
.slide .card strong,.slide .ncard strong,.slide .flow-step strong,.slide .duel-side strong{
  color:var(--ink);background:linear-gradient(transparent 62%, color-mix(in srgb, var(--kc) 24%, transparent) 62%);
  padding:0 .12em;border-radius:2px}

/* Sayı kartı */
.slide .kpi{
  --kc:var(--k, var(--c1, #1fb5c9));position:relative;overflow:hidden;border:1px solid color-mix(in srgb, var(--kc) 22%, #dfe6ee);
  border-left:1px solid color-mix(in srgb, var(--kc) 22%, #dfe6ee);border-radius:16px;
  background:linear-gradient(165deg,#fff 52%, color-mix(in srgb, var(--kc) 8%, #fff) 100%);
  box-shadow:0 1px 2px rgba(15,27,42,.05), 0 12px 28px -12px color-mix(in srgb, var(--kc) 38%, transparent)}
.slide .kpi::before{content:"";position:absolute;left:0;top:0;bottom:0;width:6px;
  background:linear-gradient(180deg, var(--kc), color-mix(in srgb, var(--kc) 25%, transparent))}
.slide .kpi{padding-left:26px}

/* Karşılaştırma (duello): iki ayrı kart, ortada "vs" */
.slide .duel{grid-template-columns:1fr 72px 1fr}
.slide .duel-side.a,.slide .duel-side.b{border-radius:16px;border:1px solid color-mix(in srgb, var(--kc) 22%, #dfe6ee)}
.slide .duel-side.a{--k:var(--c2, #2b6ea3)}
.slide .duel-side.b{--k:var(--c4, #f07a1a)}
.slide .duel-side::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;
  background:linear-gradient(90deg, var(--kc), color-mix(in srgb, var(--kc) 12%, transparent) 85%)}
.slide .duel-vs::before{display:none}
.slide .duel-vs span{box-shadow:0 8px 18px -6px rgba(11,27,43,.5)}

/* Uyarı / vurgu kutusu */
.slide .callout{
  position:relative;
  background:linear-gradient(100deg, color-mix(in srgb, var(--acc, #1fb5c9) 11%, #fff), #fff 72%);
  border:1px solid color-mix(in srgb, var(--acc, #1fb5c9) 26%, #e3e8ef);
  border-left:6px solid var(--acc, #1fb5c9);border-radius:6px 16px 16px 6px;
  box-shadow:0 10px 26px -14px color-mix(in srgb, var(--acc, #1fb5c9) 45%, transparent)}
.slide .callout h4{display:flex;align-items:center;gap:8px;font-weight:800;color:var(--ink)}
.slide .callout .icon{color:var(--acc-d, var(--acc, #1fb5c9))}

/* Ana mesaj şeridi ve "Ne anlama geliyor?" */
.slide .keybar{
  background:linear-gradient(100deg, var(--navy-2, #132a40), var(--navy, #0b1b2b));
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 14px 28px -14px rgba(11,27,43,.65), inset 0 1px 0 rgba(255,255,255,.07)}
.slide .okuma{
  background:linear-gradient(100deg, var(--navy-2, #132a40), var(--navy, #0b1b2b));
  border-radius:16px;border:1px solid rgba(255,255,255,.08);
  box-shadow:0 14px 28px -14px rgba(11,27,43,.65), inset 0 1px 0 rgba(255,255,255,.07)}
.slide .okuma b{
  display:inline-block;background:color-mix(in srgb, var(--acc, #1fb5c9) 22%, transparent);
  color:var(--acc, #1fb5c9);padding:2px 12px;border-radius:999px;font-size:.88em;letter-spacing:.02em;margin-right:12px}

/* Şekil çerçevesi ve tablolar */
.slide .sekil,.slide .diagram-wrap,.slide .tbl-wrap{
  border-radius:18px;border:1px solid #dfe6ee;
  box-shadow:0 1px 2px rgba(15,27,42,.05), 0 16px 34px -18px rgba(15,27,42,.28)}
.slide .tbl-wrap,.slide table.data{overflow:hidden}
.slide table.data th{background:var(--navy-2, #132a40)}
.slide table.data tbody tr:nth-child(even) td{background:#f6f9fb}
.slide table.data tbody td:first-child{font-weight:700;color:var(--ink)}

/* Sayılar: büyük sayı hafif degrade */
.slide .hero-stat .num span{background:linear-gradient(135deg, var(--acc, #1fb5c9), var(--acc-d, #157f8e));
  -webkit-background-clip:text;background-clip:text;color:transparent}

/* Yoklama şıkları, etkileşim kartları */
.slide .anket button{border-radius:14px;box-shadow:0 1px 2px rgba(15,27,42,.05)}
.slide .canli .adim,.slide .canli .pencere,.slide .etk-kart{border-radius:16px}

/* Alt alta dizilen kartlar (ızgara dışında) arasında boşluk */
.slide :not([class*="grid-"]):not(.flow):not(.duel) > .card + .card{margin-top:14px}
/* Satır sonunu aşan vurgu kenarlarını bozmasın */
.slide .card strong,.slide .ncard strong,.slide .flow-step strong,.slide .duel-side strong{-webkit-box-decoration-break:clone;box-decoration-break:clone}