/* ============================================================
   ÖLÇÜM NET — stil
   Palet doğrudan logodan alınmıştır:
   lacivert #132F5F · mavi #0B87C2 · gri #6E7B88
   ============================================================ */

:root{
  --lacivert:      #132F5F;
  --lacivert-2:    #1C4482;
  --lacivert-koyu: #0B1E40;
  --mavi:          #0B87C2;
  --mavi-koyu:     #076C9E;
  --mavi-cam:      #E9F2F9;
  --gri:           #64748B;
  --kagit:         #F4F7FA;
  --beyaz:         #FFFFFF;
  --cizgi:         #DCE4EE;

  --yesil:         #1B9E5A;   /* yalnızca sinyal lambası */
  --sari:          #E9B23C;
  --kirmizi:       #C8352C;

  --display: "Sora", "Segoe UI", sans-serif;
  --govde:   "Inter", "Segoe UI", Helvetica, Arial, sans-serif;
  --mono:    "IBM Plex Mono", ui-monospace, "Courier New", monospace;

  --en: 1180px;
  --r: 14px;
  --golge: 0 1px 2px rgba(19,47,95,.06), 0 14px 34px -20px rgba(19,47,95,.4);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth; -webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--kagit); color:var(--lacivert-koyu);
  font-family:var(--govde); font-size:17px; line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%; display:block}
a{color:inherit}
button{font:inherit; color:inherit}
:focus-visible{outline:3px solid var(--mavi); outline-offset:3px; border-radius:4px}
.gizli{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap}

.saran{width:100%; max-width:var(--en); margin:0 auto; padding:0 22px}

/* ---------- tipografi ---------- */
h1,h2,h3{font-family:var(--display); font-weight:700; line-height:1.1; letter-spacing:-.02em; margin:0}
h1{font-size:clamp(2rem, 5vw, 3.4rem); font-weight:800}
h2{font-size:clamp(1.65rem, 3.4vw, 2.4rem)}
h3{font-size:1.14rem; line-height:1.32}
p{margin:0 0 1em}
.girizgah{font-size:clamp(1rem,1.5vw,1.13rem); color:var(--gri); max-width:62ch}

.etiket{
  font-family:var(--mono); font-size:.72rem; font-weight:500;
  letter-spacing:.16em; text-transform:uppercase; color:var(--mavi);
  display:inline-flex; align-items:center; gap:10px; margin-bottom:16px;
}
.etiket::before{
  content:""; width:22px; height:11px; flex:none; align-self:center;
  border:2px solid var(--mavi); border-bottom:none;
  border-radius:22px 22px 0 0;              /* logodaki gösterge yayı */
}
.koyu-alan .etiket{color:#7FC4E8}
.koyu-alan .etiket::before{border-color:#7FC4E8}

/* ---------- bölümler ---------- */
.alan{padding:clamp(60px,7.5vw,100px) 0; position:relative}
.alan + .alan{border-top:1px solid var(--cizgi)}
.alan--beyaz{background:var(--beyaz)}
.alan--koyu{
  background:linear-gradient(160deg, var(--lacivert-2) 0%, var(--lacivert) 55%, var(--lacivert-koyu) 100%);
  color:#D9E4F2; border-top:none;
}
.alan--koyu h2,.alan--koyu h3{color:#fff}
.alan--koyu .girizgah{color:#AEC2DC}
.alan-basi{max-width:66ch; margin-bottom:clamp(32px,4.5vw,50px)}

/* ---------- düğmeler ---------- */
.dugme{
  display:inline-flex; align-items:center; justify-content:center; gap:9px;
  padding:14px 26px; border-radius:999px; border:1.5px solid transparent;
  font-weight:600; font-size:.97rem; text-decoration:none; cursor:pointer;
  transition:transform .16s ease, background .16s ease, border-color .16s ease, color .16s ease;
}
.dugme:hover{transform:translateY(-2px)}
.dugme--ana{background:var(--mavi); color:#fff; box-shadow:0 10px 24px -12px rgba(11,135,194,.9)}
.dugme--ana:hover{background:var(--mavi-koyu)}
.dugme--cizgi{border-color:var(--lacivert); color:var(--lacivert); background:transparent}
.dugme--cizgi:hover{background:var(--lacivert); color:#fff}
.koyu-alan .dugme--cizgi{border-color:rgba(255,255,255,.55); color:#fff}
.koyu-alan .dugme--cizgi:hover{background:#fff; color:var(--lacivert)}
.dugme--wa{background:#25D366; color:#fff}
.dugme--wa:hover{background:#1FB457}

/* ============================================================
   ÜST BAR & BAŞLIK
   ============================================================ */
.ustbar{background:var(--lacivert); color:#A9C0DE; font-family:var(--mono); font-size:.76rem}
.ustbar .saran{display:flex; gap:16px; justify-content:space-between; align-items:center; min-height:38px; flex-wrap:wrap}
.ustbar a{color:#fff; text-decoration:none}
.ustbar a:hover{text-decoration:underline}

.tepe{position:sticky; top:0; z-index:60; background:rgba(255,255,255,.92); backdrop-filter:saturate(1.5) blur(12px); border-bottom:1px solid var(--cizgi)}
.tepe .saran{display:flex; align-items:center; gap:18px; min-height:78px}
.marka{display:flex; align-items:center; margin-right:auto; text-decoration:none}
.marka img{height:46px; width:auto}
@media (max-width:420px){ .marka img{height:38px} }

.menu{display:flex; gap:2px; align-items:center}
.menu a{text-decoration:none; font-size:.93rem; font-weight:500; padding:9px 12px; border-radius:8px; color:var(--lacivert); transition:background .15s, color .15s}
.menu a:hover{background:var(--mavi-cam); color:var(--mavi-koyu)}
.menu .menu-dugme{margin-left:10px}
.menu a.menu-dugme:hover{background:var(--mavi-koyu); color:#fff}

.hamburger{display:none; width:46px; height:46px; border:1px solid var(--cizgi); background:#fff; border-radius:10px; cursor:pointer; align-items:center; justify-content:center}
.hamburger span{display:block; width:19px; height:2px; background:var(--lacivert); position:relative}
.hamburger span::before,.hamburger span::after{content:""; position:absolute; left:0; width:19px; height:2px; background:var(--lacivert)}
.hamburger span::before{top:-6px} .hamburger span::after{top:6px}

@media (max-width:960px){
  .menu{
    position:fixed; inset:118px 14px auto 14px; flex-direction:column; align-items:stretch;
    background:#fff; border:1px solid var(--cizgi); border-radius:var(--r); padding:10px;
    box-shadow:var(--golge); display:none;
  }
  .menu.acik{display:flex}
  .menu a{padding:13px 14px; font-size:1rem}
  .menu .menu-dugme{margin:6px 0 0}
  .hamburger{display:flex}
}

/* ============================================================
   HERO + SİNYAL PANELİ
   ============================================================ */
.hero{padding:clamp(44px,6vw,76px) 0 clamp(54px,7vw,86px); position:relative; overflow:hidden}
.hero::before{
  content:""; position:absolute; top:-160px; right:-160px; width:520px; height:520px; border-radius:50%;
  background:radial-gradient(circle at 30% 30%, rgba(11,135,194,.13), transparent 62%); pointer-events:none;
}
.hero::after{
  content:""; position:absolute; inset:auto 0 0 0; height:12px;
  background-image:repeating-linear-gradient(to right, var(--cizgi) 0 1px, transparent 1px 26px);
}
.hero-izgara{display:grid; grid-template-columns:1.06fr .94fr; gap:clamp(32px,5vw,60px); align-items:center; position:relative}
@media (max-width:900px){ .hero-izgara{grid-template-columns:1fr} }

.hero h1 .vurgu{
  color:var(--mavi);
  background-image:linear-gradient(to top, rgba(11,135,194,.22) .16em, transparent .16em);
  -webkit-box-decoration-break:clone; box-decoration-break:clone;
}
.hero .girizgah{margin-top:20px}
.hero-eylem{display:flex; gap:12px; flex-wrap:wrap; margin-top:28px}

.rozetler{display:flex; flex-wrap:wrap; margin-top:34px; border-top:1px solid var(--cizgi); padding-top:18px}
.rozet{padding-right:26px; margin-right:26px; border-right:1px solid var(--cizgi)}
.rozet:last-child{border-right:none; margin-right:0; padding-right:0}
.rozet b{display:block; font-family:var(--display); font-size:1.24rem; font-weight:700; letter-spacing:-.02em; color:var(--lacivert)}
.rozet span{font-size:.82rem; color:var(--gri)}

.panel{
  background:linear-gradient(165deg,var(--lacivert-2),var(--lacivert) 60%,var(--lacivert-koyu));
  color:#D9E4F2; border-radius:20px; padding:26px 24px 22px;
  box-shadow:0 30px 60px -34px rgba(11,30,64,.9); border:1px solid rgba(255,255,255,.1);
}
.panel-tepe{display:flex; justify-content:space-between; align-items:center; font-family:var(--mono); font-size:.68rem; letter-spacing:.15em; text-transform:uppercase; color:#8FAFD4}
.lambalar{display:flex; gap:14px; justify-content:center; margin:26px 0 20px}
.lamba{
  width:clamp(52px,13vw,66px); height:clamp(52px,13vw,66px); aspect-ratio:1; border-radius:50%;
  background:#0A1A38; border:2px solid rgba(255,255,255,.09);
  box-shadow:inset 0 4px 12px rgba(0,0,0,.55);
  transition:background .09s linear, box-shadow .09s linear;
}
.lamba.yanik-kirmizi{background:var(--kirmizi); box-shadow:0 0 30px rgba(200,53,44,.7), inset 0 2px 8px rgba(255,255,255,.25)}
.lamba.yanik-sari{background:var(--sari); box-shadow:0 0 30px rgba(233,178,60,.65), inset 0 2px 8px rgba(255,255,255,.3)}
.lamba.yanik-yesil{background:var(--yesil); box-shadow:0 0 34px rgba(27,158,90,.75), inset 0 2px 8px rgba(255,255,255,.28)}

.gosterge{text-align:center; font-family:var(--mono); border-top:1px dashed rgba(255,255,255,.18); border-bottom:1px dashed rgba(255,255,255,.18); padding:14px 0; margin-bottom:16px}
.gosterge-deger{font-size:clamp(2rem,7vw,2.6rem); font-weight:600; letter-spacing:-.03em; line-height:1; color:#fff}
.gosterge-deger small{font-size:.9rem; color:#8FAFD4; margin-left:4px; letter-spacing:0}
.gosterge-mesaj{font-size:.78rem; color:#A6BFDC; margin-top:9px; min-height:1.2em}

.panel-dugme{width:100%; padding:15px; border:none; border-radius:12px; background:var(--mavi); color:#fff; font-weight:600; cursor:pointer; transition:background .15s, transform .12s}
.panel-dugme:hover{background:var(--mavi-koyu)}
.panel-dugme:active{transform:scale(.99)}
.panel-dugme[data-durum="bekle"]{background:#2C4C82; cursor:default}
.panel-not{font-size:.72rem; color:#8FAFD4; text-align:center; margin:12px 0 0; line-height:1.5}
.panel-skor{display:flex; justify-content:center; gap:16px; font-family:var(--mono); font-size:.72rem; color:#8FAFD4; margin-top:10px; flex-wrap:wrap}

/* ============================================================
   KARTLAR
   ============================================================ */
.izgara{display:grid; gap:18px}
.i3{grid-template-columns:repeat(3,1fr)}
.i2{grid-template-columns:repeat(2,1fr)}
@media (max-width:900px){ .i3{grid-template-columns:repeat(2,1fr)} }
@media (max-width:640px){ .i3,.i2{grid-template-columns:1fr} }

.kart{background:var(--beyaz); border:1px solid var(--cizgi); border-radius:var(--r); padding:26px 24px; transition:transform .2s ease, box-shadow .2s ease}
.alan--beyaz .kart{background:var(--kagit)}
.kart:hover{transform:translateY(-3px); box-shadow:var(--golge)}
.kart h3{margin-bottom:9px; color:var(--lacivert)}
.kart p{margin:0; font-size:.95rem; color:var(--gri)}
.kart-ikon{width:34px; height:34px; margin-bottom:15px; color:var(--mavi)}

.kural{background:var(--beyaz); border:1px solid var(--cizgi); border-left:4px solid var(--mavi); border-radius:var(--r); padding:24px}
.alan--beyaz .kural{background:var(--kagit)}
.kural h3{margin-bottom:8px; color:var(--lacivert)}
.kural p{font-size:.95rem; color:var(--gri); margin:0 0 12px}
.kural .dayanak{font-family:var(--mono); font-size:.72rem; color:var(--gri); border-top:1px dashed var(--cizgi); padding-top:10px; display:block}

/* ---------- süreç ---------- */
.hat{position:relative; padding-left:54px}
.hat::before{content:""; position:absolute; left:17px; top:8px; bottom:8px; width:2px; background:repeating-linear-gradient(to bottom, rgba(255,255,255,.34) 0 6px, transparent 6px 12px)}
.durak{position:relative; padding-bottom:32px}
.durak:last-child{padding-bottom:0}
.durak-no{position:absolute; left:-54px; top:0; width:36px; height:36px; border-radius:50%; background:var(--mavi); color:#fff; display:flex; align-items:center; justify-content:center; font-family:var(--mono); font-weight:600; font-size:.9rem}
.durak h3{margin-bottom:6px}
.durak p{color:#AEC2DC; font-size:.95rem; margin:0}

.liste-kutu{background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.16); border-radius:var(--r); padding:26px}
.liste-kutu ul{list-style:none; margin:0; padding:0}
.liste-kutu li{display:flex; gap:12px; padding:11px 0; border-bottom:1px dashed rgba(255,255,255,.16); font-size:.95rem; color:#D9E4F2}
.liste-kutu li:last-child{border-bottom:none}
.liste-kutu li::before{content:"✓"; color:#5CC98E; font-weight:700; flex:none}
.liste-kutu .not{margin:20px 0 0; font-size:.9rem; color:#AEC2DC}

/* ============================================================
   BLOG
   ============================================================ */
.yazilar{display:grid; grid-template-columns:repeat(3,1fr); gap:18px}
@media (max-width:940px){ .yazilar{grid-template-columns:repeat(2,1fr)} }
@media (max-width:640px){ .yazilar{grid-template-columns:1fr} }

.yazi-kart{
  display:flex; flex-direction:column; background:var(--beyaz); border:1px solid var(--cizgi);
  border-radius:var(--r); overflow:hidden; text-decoration:none; color:inherit;
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s;
}
.alan--beyaz .yazi-kart{background:var(--kagit)}
.yazi-kart:hover{transform:translateY(-4px); box-shadow:var(--golge); border-color:#BFD2E6}
.yazi-serit{height:7px; background:linear-gradient(to right, var(--lacivert) 0 50%, var(--mavi) 50%)}
.yazi-gorsel{width:100%; height:auto; aspect-ratio:16/9; object-fit:cover}
.yazi-govde{padding:22px 22px 24px; display:flex; flex-direction:column; flex:1}
.yazi-ust{font-family:var(--mono); font-size:.7rem; letter-spacing:.1em; text-transform:uppercase; color:var(--gri); margin-bottom:12px}
.yazi-kart h3{margin-bottom:10px; color:var(--lacivert)}
.yazi-kart p{font-size:.92rem; color:var(--gri); margin:0 0 18px}
.yazi-devam{margin-top:auto; font-size:.86rem; font-weight:600; color:var(--mavi-koyu); display:inline-flex; align-items:center; gap:7px}
.yazi-kart:hover .yazi-devam{gap:12px}
.yazi-devam span{transition:margin .2s}

/* yazı sayfası */
.makale{max-width:760px; margin:0 auto; padding:clamp(34px,5vw,60px) 0 clamp(50px,7vw,80px)}
.geri{display:inline-flex; align-items:center; gap:8px; font-size:.88rem; color:var(--gri); text-decoration:none; margin-bottom:24px}
.geri:hover{color:var(--mavi-koyu)}
.makale h1{font-size:clamp(1.8rem,4.2vw,2.7rem); margin-bottom:14px}
.makale-ust{font-family:var(--mono); font-size:.76rem; letter-spacing:.1em; text-transform:uppercase; color:var(--gri); margin-bottom:28px}
.makale-kapak{border-radius:var(--r); margin-bottom:30px; width:100%}
.makale-icerik{font-size:1.05rem; color:#23324A}
.makale-icerik h3{margin:34px 0 10px; color:var(--lacivert)}
.makale-icerik ul{padding-left:20px}
.makale-icerik li{margin-bottom:9px}
.makale-icerik strong{color:var(--lacivert)}
.makale-cta{margin-top:44px; padding:28px; background:var(--mavi-cam); border:1px solid #CBE1F0; border-radius:var(--r)}
.makale-cta h3{margin:0 0 8px; color:var(--lacivert)}
.diger-yazilar{border-top:1px solid var(--cizgi); margin-top:52px; padding-top:34px}

/* ============================================================
   SSS
   ============================================================ */
.sss{border-top:1px solid var(--cizgi); max-width:900px}
.sss details{border-bottom:1px solid var(--cizgi)}
.sss summary{list-style:none; cursor:pointer; padding:20px 46px 20px 0; position:relative; font-family:var(--display); font-weight:600; font-size:1.04rem; color:var(--lacivert)}
.sss summary::-webkit-details-marker{display:none}
.sss summary::after{content:"+"; position:absolute; right:8px; top:50%; transform:translateY(-50%); font-family:var(--mono); font-size:1.4rem; color:var(--mavi); line-height:1}
.sss details[open] summary::after{content:"–"}
.sss details p{padding:0 40px 20px 0; margin:0; color:var(--gri); font-size:.97rem}

/* ============================================================
   İLETİŞİM
   ============================================================ */
.ikili{display:grid; grid-template-columns:1fr 1fr; gap:clamp(24px,4vw,46px)}
@media (max-width:840px){ .ikili{grid-template-columns:1fr} }
.bilgi-satir{display:flex; gap:14px; padding:16px 0; border-bottom:1px dashed var(--cizgi)}
.bilgi-satir:last-of-type{border-bottom:none}
.bilgi-satir svg{width:20px; height:20px; flex:none; color:var(--mavi); margin-top:4px}
.bilgi-satir b{display:block; font-size:.76rem; font-family:var(--mono); letter-spacing:.1em; text-transform:uppercase; color:var(--gri); font-weight:500; margin-bottom:3px}
.bilgi-satir a{text-decoration:none; color:var(--lacivert); font-weight:500}
.bilgi-satir a:hover{color:var(--mavi-koyu); text-decoration:underline}

.form{background:var(--beyaz); border:1px solid var(--cizgi); border-radius:var(--r); padding:26px}
.alan--beyaz .form{background:var(--kagit)}
.alanlar{margin-bottom:16px}
.alanlar label{display:block; font-size:.78rem; font-family:var(--mono); letter-spacing:.08em; text-transform:uppercase; color:var(--gri); margin-bottom:7px}
.alanlar input,.alanlar select,.alanlar textarea{
  width:100%; padding:13px 14px; border:1px solid var(--cizgi); border-radius:10px;
  background:#fff; font-family:var(--govde); font-size:1rem; color:var(--lacivert-koyu);
}
.alanlar textarea{min-height:100px; resize:vertical}
.alanlar input:focus,.alanlar select:focus,.alanlar textarea:focus{border-color:var(--mavi); outline:none; box-shadow:0 0 0 3px rgba(11,135,194,.16)}
.form-not{font-size:.78rem; color:var(--gri); margin:14px 0 0}
.tuzak{position:absolute; left:-9999px}

.uyari{padding:14px 18px; border-radius:10px; font-size:.94rem; margin-bottom:20px}
.uyari--ok{background:#E7F6EE; border:1px solid #B6E2C9; color:#136B41}
.uyari--hata{background:#FDECEA; border:1px solid #F5C6C2; color:#8C241D}

/* ============================================================
   ALT BİLGİ
   ============================================================ */
.altbilgi{background:var(--lacivert-koyu); color:#9FB4D2; padding:54px 0 24px; font-size:.92rem}
.altbilgi a{color:#DCE7F5; text-decoration:none}
.altbilgi a:hover{text-decoration:underline}
.altbilgi-logo{background:#fff; border-radius:12px; padding:12px 16px; display:inline-block; margin-bottom:16px}
.altbilgi-logo img{height:44px; width:auto}
.alt-izgara{display:grid; grid-template-columns:1.5fr 1fr 1fr; gap:34px; padding-bottom:32px; border-bottom:1px solid rgba(255,255,255,.14)}
@media (max-width:760px){ .alt-izgara{grid-template-columns:1fr; gap:26px} }
.alt-izgara h4{font-family:var(--mono); font-size:.74rem; letter-spacing:.14em; text-transform:uppercase; color:#7B93B8; margin:0 0 14px; font-weight:500}
.alt-izgara ul{list-style:none; padding:0; margin:0}
.alt-izgara li{margin-bottom:9px}
.alt-son{display:flex; justify-content:space-between; gap:14px; padding-top:20px; font-family:var(--mono); font-size:.73rem; color:#7B93B8; flex-wrap:wrap}

.wa-buton{position:fixed; right:18px; bottom:18px; z-index:70; width:56px; height:56px; border-radius:50%; background:#25D366; display:flex; align-items:center; justify-content:center; box-shadow:0 10px 26px -8px rgba(0,0,0,.45); color:#fff}
.wa-buton svg{width:29px; height:29px}

/* ---------- görünüme girince ---------- */
.yuksel{opacity:0; transform:translateY(18px); transition:opacity .6s ease, transform .6s ease}
.yuksel.icerde{opacity:1; transform:none}
@media (prefers-reduced-motion:reduce){
  *{animation:none !important; transition:none !important}
  .yuksel{opacity:1; transform:none}
  html{scroll-behavior:auto}
}

/* ============================================================
   ARAMA + WHATSAPP DÜĞMELERİ
   Masaüstünde sağ altta yuvarlak ikili, mobilde alt şerit.
   ============================================================ */
.yuzen{position:fixed; right:18px; bottom:18px; z-index:80; display:flex; flex-direction:column; gap:12px}
.yuzen a{
  width:56px; height:56px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  color:#fff; box-shadow:0 10px 26px -8px rgba(0,0,0,.45); transition:transform .16s ease;
}
.yuzen a:hover{transform:scale(1.06)}
.yuzen a svg{width:28px; height:28px}
.yuzen .ara{background:var(--mavi)}
.yuzen .wa{background:#25D366}

.mobil-cubuk{display:none}
@media (max-width:700px){
  .yuzen{display:none}
  .mobil-cubuk{
    display:flex; position:fixed; left:0; right:0; bottom:0; z-index:80;
    box-shadow:0 -6px 20px -8px rgba(11,30,64,.45);
  }
  .mobil-cubuk a{
    flex:1; display:flex; align-items:center; justify-content:center; gap:9px;
    padding:15px 8px; color:#fff; text-decoration:none; font-weight:600; font-size:1rem;
  }
  .mobil-cubuk a svg{width:20px; height:20px}
  .mobil-cubuk .ara{background:var(--mavi)}
  .mobil-cubuk .wa{background:#25D366}
  body{padding-bottom:58px}
}

/* Metin içindeki arama düğmesi */
.dugme--ara{background:var(--mavi); color:#fff}
.dugme--ara:hover{background:var(--mavi-koyu)}
.dugme svg{width:18px; height:18px; flex:none}

/* ============================================================
   TEST TANITIM KARTLARI VE DEMO KATMANI
   ============================================================ */
.test-kart{
  display:flex; flex-direction:column; align-items:flex-start; text-align:left; width:100%;
  background:var(--beyaz); border:1px solid var(--cizgi); border-radius:var(--r); padding:24px 22px;
  cursor:pointer; font-family:inherit; color:inherit;
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s;
}
.alan--beyaz .test-kart{background:var(--kagit)}
.test-kart:hover{transform:translateY(-3px); box-shadow:var(--golge); border-color:#B7CBE2}
.test-kart .grup{
  font-family:var(--mono); font-size:.66rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--mavi-koyu); background:var(--mavi-cam); border-radius:999px; padding:3px 10px; margin-bottom:14px;
}
.test-kart h3{margin-bottom:8px; color:var(--lacivert)}
.test-kart p{margin:0 0 16px; font-size:.94rem; color:var(--gri)}
.test-kart .ac{
  margin-top:auto; font-size:.86rem; font-weight:600; color:var(--mavi-koyu);
  display:inline-flex; align-items:center; gap:7px;
}
.test-kart:hover .ac{gap:12px}
.test-kart .ac span{transition:margin .2s}

/* katman */
.test-katman{position:fixed; inset:0; z-index:110; display:none}
.test-katman.acik{display:block}
.test-perde{position:absolute; inset:0; background:rgba(11,30,64,.66); backdrop-filter:blur(3px)}
.test-sayfa{
  position:absolute; inset:4vh 0 0; margin:0 auto; max-width:820px; background:#fff;
  border-radius:18px 18px 0 0; overflow-y:auto; padding:0 0 60px; box-shadow:0 -20px 60px rgba(11,30,64,.45);
}
.test-cubuk{
  position:sticky; top:0; background:#fff; border-bottom:1px solid var(--cizgi); z-index:3;
  padding:14px 24px; display:flex; justify-content:space-between; align-items:center;
}
.test-cubuk .et{font-family:var(--mono); font-size:.7rem; letter-spacing:.13em; text-transform:uppercase; color:var(--gri)}
.test-kapat{width:38px; height:38px; border-radius:50%; border:1px solid var(--cizgi); background:var(--kagit); cursor:pointer; font-size:1.05rem; line-height:1}
.test-kapat:hover{background:var(--lacivert); color:#fff}
.test-govde{padding:30px 24px 0}
.test-govde h2{color:var(--lacivert); margin-bottom:12px; font-size:clamp(1.45rem,3.4vw,2rem)}
.test-govde h3{color:var(--lacivert); margin:28px 0 10px; font-size:1.05rem}
.test-govde p{color:#23324A}
.test-mevzuat{
  font-family:var(--mono); font-size:.76rem; color:var(--gri); background:var(--kagit);
  border-left:3px solid var(--mavi); padding:10px 14px; border-radius:0 8px 8px 0; margin-bottom:20px;
}
.test-cta{margin-top:34px; padding:24px; background:var(--mavi-cam); border:1px solid #CBE1F0; border-radius:var(--r)}
.test-cta h3{margin:0 0 8px}
.test-cta p{color:var(--gri); margin-bottom:16px; font-size:.95rem}
.test-cta .dugmeler{display:flex; gap:12px; flex-wrap:wrap}

/* ---------- ortak demo öğeleri ---------- */
.demo-kutu{background:var(--kagit); border:1px solid var(--cizgi); border-radius:var(--r); padding:18px; margin-top:8px}
.demo-ust{
  display:flex; justify-content:space-between; align-items:center; gap:12px; flex-wrap:wrap;
  font-size:.88rem; color:var(--gri); margin-bottom:14px;
}
.demo-hedef{font-size:1.25rem; color:var(--mavi-koyu)}
.demo-sayac{font-family:var(--mono); font-size:.82rem; color:var(--lacivert); background:#fff; border:1px solid var(--cizgi); border-radius:999px; padding:3px 12px}
.demo-dugme{
  width:100%; padding:14px; border:none; border-radius:11px; background:var(--mavi); color:#fff;
  font-weight:600; font-size:1rem; cursor:pointer; margin-top:14px; font-family:inherit;
}
.demo-dugme:hover{background:var(--mavi-koyu)}
.demo-sonuc{
  margin-top:16px; background:#fff; border:1px solid var(--cizgi); border-radius:10px; padding:14px 16px;
  font-size:.95rem; color:var(--lacivert);
}
.demo-sonuc b{color:var(--mavi-koyu)}
.demo-sonuc span{display:block; margin-top:8px; font-size:.86rem; color:var(--gri); line-height:1.55}
.demo-uyari{font-size:.8rem; color:var(--gri); margin-top:14px; line-height:1.55}
.demo-ipucu{font-size:.9rem; color:var(--gri); margin:0 0 12px}
.demo-soru{font-weight:600; color:var(--lacivert); margin:16px 0 12px}
.demo-aciklama{font-size:.88rem; color:var(--gri); margin:12px 0 0}
.demo-tuval{width:100%; height:auto; border-radius:11px; display:block; touch-action:none}

/* dikkat ızgarası */
.demo-izgara{display:grid; grid-template-columns:repeat(10,1fr); gap:6px}
@media (max-width:560px){ .demo-izgara{grid-template-columns:repeat(6,1fr)} }
.demo-hucre{
  aspect-ratio:1; min-height:34px; border:1px solid var(--cizgi); background:#fff; border-radius:7px;
  font-size:1rem; cursor:pointer; color:var(--lacivert); padding:0; font-family:inherit;
}
.demo-hucre:hover{background:var(--mavi-cam)}
.demo-hucre.secili{background:#E4F5EC; border-color:#9FD9BB; color:var(--yesil)}
.demo-hucre.hatali{background:#FDECEA; border-color:#F0C6C2; color:var(--kirmizi)}

/* muhakeme */
.demo-dizi{display:flex; gap:10px; flex-wrap:wrap; justify-content:center}
.demo-dizi-kutu{
  min-width:64px; padding:14px 10px; background:#fff; border:1px solid var(--cizgi); border-radius:10px;
  text-align:center; font-size:1.1rem; color:var(--lacivert);
}
.demo-dizi-kutu.bos{border-style:dashed; color:var(--mavi); font-weight:700}
.demo-secenekler{display:flex; gap:8px; flex-wrap:wrap}
.demo-secenek{
  flex:1 1 auto; min-width:96px; padding:12px 14px; border:1px solid var(--cizgi); background:#fff;
  border-radius:10px; cursor:pointer; font-size:.95rem; color:var(--lacivert); font-family:inherit;
}
.demo-secenek:hover{border-color:var(--mavi); background:var(--mavi-cam)}
.demo-secenek.dogru{background:#E4F5EC; border-color:#9FD9BB; color:var(--yesil); font-weight:600}
.demo-secenek.yanlis{background:#FDECEA; border-color:#F0C6C2; color:var(--kirmizi)}
.demo-secenek.secili{background:var(--lacivert); border-color:var(--lacivert); color:#fff}

/* geniş görüş alanı */
.demo-cevre{
  position:relative; height:230px; background:#0B1E40; border-radius:11px; overflow:hidden;
  display:flex; align-items:center; justify-content:center;
}
.demo-merkez{color:#fff; font-family:var(--mono); font-size:2.4rem; font-weight:600}
.demo-nokta{
  position:absolute; width:34px; height:34px; border-radius:50%; border:none; padding:0;
  background:rgba(255,255,255,.07); cursor:pointer;
}
.demo-nokta.yanik{background:#F0B429; box-shadow:0 0 26px rgba(240,180,41,.85)}
.demo-nokta.sol-ust{left:12px; top:18px}
.demo-nokta.sol-alt{left:12px; bottom:18px}
.demo-nokta.sag-ust{right:12px; top:18px}
.demo-nokta.sag-alt{right:12px; bottom:18px}

/* şekil akışı */
.demo-akis{
  height:150px; background:#0B1E40; border-radius:11px; display:flex; align-items:center; justify-content:center;
}
.demo-akis-sekil{font-size:3.4rem; color:#fff; transition:color .12s, transform .12s}
.demo-akis-sekil.dogru{color:#5CC98E; transform:scale(1.12)}
.demo-akis-sekil.yanlis{color:#E8776F; transform:scale(.9)}

/* görsel bellek */
.demo-sahne{border-radius:11px; overflow:hidden; line-height:0}
.demo-sahne.kapali{display:none}

/* tepki lambaları */
.demo-lambalar{display:flex; gap:14px; justify-content:center; padding:20px; background:#0B1E40; border-radius:11px}
.demo-lamba{
  width:clamp(48px,12vw,62px); height:clamp(48px,12vw,62px); border-radius:50%;
  background:#081530; border:2px solid rgba(255,255,255,.09); box-shadow:inset 0 4px 12px rgba(0,0,0,.55);
}
.demo-lamba.kirmizi{background:var(--kirmizi); box-shadow:0 0 28px rgba(200,53,44,.7)}
.demo-lamba.sari{background:var(--sari); box-shadow:0 0 28px rgba(233,178,60,.65)}
.demo-lamba.yesil{background:var(--yesil); box-shadow:0 0 30px rgba(27,158,90,.75)}
.demo-gosterge{text-align:center; padding:14px 0 0}
.demo-gosterge .deger{display:block; font-family:var(--mono); font-size:1.9rem; font-weight:600; color:var(--lacivert)}
.demo-gosterge .mesaj{display:block; font-size:.84rem; color:var(--gri); margin-top:6px; min-height:1.2em}

/* tutum */
.demo-tutum-satir{padding-bottom:14px; margin-bottom:14px; border-bottom:1px dashed var(--cizgi)}
.demo-tutum-satir:last-of-type{border-bottom:none}
.demo-tutum-satir .demo-soru{margin-top:0}

/* ---------- blog kategori şeridi ---------- */
.kategori-serit{display:flex; gap:8px; flex-wrap:wrap; margin-bottom:26px}
.kategori-serit a{
  padding:8px 15px; border-radius:999px; border:1px solid var(--cizgi); background:var(--beyaz);
  text-decoration:none; font-size:.88rem; font-weight:500; color:var(--lacivert); transition:all .15s;
}
.kategori-serit a:hover{border-color:var(--mavi); color:var(--mavi-koyu)}
.kategori-serit a.etkin{background:var(--lacivert); border-color:var(--lacivert); color:#fff}
.kategori-serit a span{font-family:var(--mono); font-size:.76rem; opacity:.65; margin-left:4px}

/* ---------- makale içindeki kaynakça ---------- */
.kaynakca{list-style:none; padding:0; margin:0 0 18px}
.kaynakca li{
  padding:10px 14px; background:var(--kagit); border-left:3px solid var(--mavi);
  border-radius:0 8px 8px 0; margin-bottom:8px; font-size:.9rem;
}
.kaynakca a{color:var(--mavi-koyu); font-weight:500}
.makale-icerik em{color:var(--gri)}

/* ---------- harita ---------- */
.harita{
  margin-top:clamp(28px,4vw,44px); border-radius:var(--r); overflow:hidden;
  border:1px solid var(--cizgi); line-height:0; background:var(--kagit);
}
.harita iframe{width:100%; height:380px; border:0; display:block; filter:saturate(.9)}
@media (max-width:640px){ .harita iframe{height:280px} }

/* ============================================================
   DİL SEÇİCİ VE SAĞDAN SOLA (RTL) DESTEĞİ
   ============================================================ */
.ustbar-sag{display:inline-flex; align-items:center; gap:14px; flex-wrap:wrap}
.dil-secici{display:inline-flex; gap:2px; background:rgba(255,255,255,.1); border-radius:999px; padding:2px}
.dil-secici a{
  padding:3px 9px; border-radius:999px; font-size:.7rem; font-weight:600; letter-spacing:.04em;
  color:#B8CDE8; text-decoration:none; transition:background .15s, color .15s;
}
.dil-secici a:hover{background:rgba(255,255,255,.14); color:#fff; text-decoration:none}
.dil-secici a.etkin{background:var(--mavi); color:#fff}

/* --- RTL --- */
[dir="rtl"] body{font-family:"Noto Naskh Arabic","Segoe UI",Tahoma,var(--govde)}
[dir="rtl"] h1,[dir="rtl"] h2,[dir="rtl"] h3{letter-spacing:0}
[dir="rtl"] .etiket{letter-spacing:0}
[dir="rtl"] .etiket::before{transform:scaleX(-1)}
[dir="rtl"] .rozet{padding-right:0; padding-left:26px; margin-right:0; margin-left:26px;
  border-right:none; border-left:1px solid var(--cizgi)}
[dir="rtl"] .rozet:last-child{border-left:none; margin-left:0; padding-left:0}
[dir="rtl"] .kural{border-left:1px solid var(--cizgi); border-right:4px solid var(--mavi)}
[dir="rtl"] .hat{padding-left:0; padding-right:54px}
[dir="rtl"] .hat::before{left:auto; right:17px}
[dir="rtl"] .durak-no{left:auto; right:-54px}
[dir="rtl"] .sss summary{padding:20px 0 20px 46px}
[dir="rtl"] .sss summary::after{right:auto; left:8px}
[dir="rtl"] .sss details p{padding:0 0 20px 40px}
[dir="rtl"] .test-mevzuat{border-left:none; border-right:3px solid var(--mavi); border-radius:8px 0 0 8px}
[dir="rtl"] .kaynakca li{border-left:none; border-right:3px solid var(--mavi); border-radius:8px 0 0 8px}
[dir="rtl"] .yuzen{right:auto; left:18px}
[dir="rtl"] .wa-buton{right:auto; left:18px}
[dir="rtl"] .yazi-devam span,[dir="rtl"] .test-kart .ac span{transform:scaleX(-1); display:inline-block}
[dir="rtl"] .demo-izgara,[dir="rtl"] .demo-secenekler{direction:rtl}
[dir="rtl"] .hero h1 .vurgu{background-position:right bottom}

/* ============================================================
   KURUMSAL BÖLÜM
   ============================================================ */
.kurumsal-serit{
  background:linear-gradient(150deg,var(--lacivert-2),var(--lacivert) 60%,var(--lacivert-koyu));
  color:#D9E4F2; border-radius:var(--r); padding:clamp(28px,4vw,44px); position:relative; overflow:hidden;
}
.kurumsal-serit h2,.kurumsal-serit h3{color:#fff}
.kurumsal-serit .girizgah{color:#AEC2DC}
.kurumsal-ikili{display:grid; grid-template-columns:1.15fr .85fr; gap:clamp(24px,4vw,44px); align-items:center}
@media (max-width:820px){ .kurumsal-ikili{grid-template-columns:1fr} }
.kurumsal-liste{list-style:none; padding:0; margin:20px 0 0}
.kurumsal-liste li{display:flex; gap:12px; padding:10px 0; font-size:.96rem; color:#D9E4F2}
.kurumsal-liste li::before{content:"✓"; color:#5CC98E; font-weight:700; flex:none}
.rozet-serit{display:flex; gap:8px; flex-wrap:wrap; margin-top:18px}
.mini-rozet{
  font-family:var(--mono); font-size:.7rem; letter-spacing:.1em; text-transform:uppercase;
  background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.2);
  color:#DCE8F5; padding:5px 12px; border-radius:999px;
}
.dil-rozetleri{display:flex; gap:8px; flex-wrap:wrap; margin-top:14px}
.dil-rozet{
  display:inline-flex; align-items:center; gap:7px; background:var(--mavi-cam); color:var(--mavi-koyu);
  border:1px solid #CBE1F0; border-radius:999px; padding:6px 14px; font-size:.85rem; font-weight:600;
}

/* ============================================================
   DENEME TESTİ BATARYASI
   ============================================================ */
.dn-giris-liste{counter-reset:dn; list-style:none; padding:0; margin:0}
.dn-giris-liste li{
  position:relative; padding-left:44px; margin-bottom:16px; color:var(--gri); font-size:.97rem;
}
[dir="rtl"] .dn-giris-liste li{padding-left:0; padding-right:44px}
.dn-giris-liste li::before{
  counter-increment:dn; content:counter(dn);
  position:absolute; left:0; top:-2px; width:30px; height:30px; border-radius:50%;
  background:var(--mavi); color:#fff; display:flex; align-items:center; justify-content:center;
  font-family:var(--mono); font-size:.85rem; font-weight:600;
}
[dir="rtl"] .dn-giris-liste li::before{left:auto; right:0}

.dn-cerceve{
  background:var(--beyaz); border:1px solid var(--cizgi); border-radius:18px;
  padding:clamp(18px,3vw,30px); box-shadow:var(--golge);
}
.dn-baslik-satiri{display:flex; justify-content:space-between; align-items:center; gap:14px; margin-bottom:12px}
.dn-baslik-satiri strong{font-family:var(--display); font-size:1.12rem; color:var(--lacivert)}
.dn-baslik-satiri span{font-family:var(--mono); font-size:.8rem; color:var(--gri)}
.dn-ilerlik{height:6px; background:var(--kagit); border-radius:999px; overflow:hidden; margin-bottom:24px}
.dn-ilerlik i{display:block; height:100%; background:var(--mavi); transition:width .4s ease}

.dn-hazirlik{text-align:center; padding:clamp(20px,4vw,40px) 10px}
.dn-hazirlik h2{color:var(--lacivert); margin-bottom:14px; font-size:clamp(1.3rem,3vw,1.8rem)}
.dn-aciklama{color:var(--gri); max-width:52ch; margin:0 auto 10px; font-size:1rem}
.dn-ipucu{color:var(--mavi-koyu); font-size:.88rem; margin-bottom:24px}

.dn-dugme{
  padding:15px 30px; border:none; border-radius:12px; background:var(--mavi); color:#fff;
  font-family:inherit; font-weight:600; font-size:1rem; cursor:pointer; transition:background .15s, transform .1s;
}
.dn-dugme:hover{background:var(--mavi-koyu)}
.dn-dugme:active{transform:scale(.98)}
.dn-dugme.dn-buyuk{width:100%; padding:20px; font-size:1.15rem; letter-spacing:.06em; margin-top:16px}
.dn-dugme.dn-ikincil{background:var(--beyaz); color:var(--lacivert); border:1px solid var(--cizgi)}
.dn-dugme.dn-ikincil:hover{background:var(--kagit)}

.dn-alan{max-width:660px; margin:0 auto}
.dn-ust{display:flex; justify-content:space-between; align-items:center; gap:12px; margin-bottom:14px; font-size:.92rem; color:var(--gri)}
.dn-ust b{color:var(--mavi-koyu); font-size:1.2rem}
.dn-kronometre{font-family:var(--mono); font-size:1rem; color:var(--lacivert); background:var(--kagit); border-radius:999px; padding:4px 14px; min-width:56px; text-align:center}
.dn-durum{text-align:center; color:var(--gri); font-size:.95rem; min-height:1.5em; margin:12px 0 0}
.dn-sayac{text-align:center; font-family:var(--mono); font-size:.82rem; color:var(--gri); margin:10px 0 0}
.dn-tuval{width:100%; height:auto; border-radius:12px; display:block; touch-action:none}

.dn-lambalar{display:flex; gap:16px; justify-content:center; padding:26px; background:#0B1E40; border-radius:12px}
.dn-lamba{width:clamp(54px,14vw,74px); height:clamp(54px,14vw,74px); border-radius:50%; background:#081530;
  border:2px solid rgba(255,255,255,.09); box-shadow:inset 0 4px 12px rgba(0,0,0,.55)}
.dn-lamba.kirmizi{background:var(--kirmizi); box-shadow:0 0 32px rgba(200,53,44,.75)}
.dn-lamba.sari{background:var(--sari); box-shadow:0 0 32px rgba(233,178,60,.7)}
.dn-lamba.yesil{background:var(--yesil); box-shadow:0 0 36px rgba(27,158,90,.8)}

.dn-izgara{display:grid; grid-template-columns:repeat(12,1fr); gap:5px}
@media (max-width:640px){ .dn-izgara{grid-template-columns:repeat(8,1fr)} }
.dn-hucre{aspect-ratio:1; min-height:30px; border:1px solid var(--cizgi); background:#fff; border-radius:6px;
  font-size:.95rem; cursor:pointer; color:var(--lacivert); padding:0; font-family:inherit}
.dn-hucre:hover{background:var(--mavi-cam)}
.dn-hucre.ok{background:#E4F5EC; border-color:#9FD9BB; color:var(--yesil)}
.dn-hucre.hata{background:#FDECEA; border-color:#F0C6C2; color:var(--kirmizi)}

.dn-akis{height:170px; background:#0B1E40; border-radius:12px; display:flex; align-items:center; justify-content:center}
.dn-akis-sekil{font-size:3.8rem; color:#fff; transition:color .1s, transform .1s}
.dn-akis-sekil.ok{color:#5CC98E; transform:scale(1.12)}
.dn-akis-sekil.hata{color:#E8776F; transform:scale(.9)}

.dn-sahne{border-radius:12px; overflow:hidden; line-height:0}
.dn-soru{font-weight:600; color:var(--lacivert); text-align:center; margin:22px 0 14px; font-size:1.05rem}
.dn-secenekler{display:flex; gap:8px; flex-wrap:wrap; justify-content:center}
.dn-secenek{flex:1 1 auto; min-width:100px; max-width:220px; padding:14px; border:1px solid var(--cizgi);
  background:#fff; border-radius:10px; cursor:pointer; font-size:1rem; color:var(--lacivert); font-family:inherit}
.dn-secenek:hover{border-color:var(--mavi); background:var(--mavi-cam)}
.dn-secenek.ok{background:#E4F5EC; border-color:#9FD9BB; color:var(--yesil); font-weight:600}
.dn-secenek.hata{background:#FDECEA; border-color:#F0C6C2; color:var(--kirmizi)}

/* ---------- rapor ---------- */
.dn-rapor{max-width:720px; margin:0 auto}
.dn-ozet{display:flex; gap:24px; align-items:center; flex-wrap:wrap; padding-bottom:24px; border-bottom:1px solid var(--cizgi); margin-bottom:24px}
.dn-ozet h2{color:var(--lacivert); font-size:1.5rem; margin-bottom:8px}
.dn-ozet p{color:var(--gri); font-size:.95rem; margin:0 0 6px}
.dn-tarih{font-family:var(--mono); font-size:.78rem}
.dn-halka{
  --oran:0; width:110px; height:110px; border-radius:50%; flex:none;
  background:conic-gradient(var(--mavi) calc(var(--oran) * 1%), var(--kagit) 0);
  display:flex; align-items:center; justify-content:center; position:relative;
}
.dn-halka::after{content:""; position:absolute; inset:11px; background:#fff; border-radius:50%}
.dn-halka span{position:relative; z-index:1; font-family:var(--mono); font-size:1.9rem; font-weight:600; color:var(--lacivert)}

.dn-satir{padding:14px 0; border-bottom:1px dashed var(--cizgi)}
.dn-satir:last-child{border-bottom:none}
.dn-satir-ust{display:flex; justify-content:space-between; align-items:baseline; gap:12px; margin-bottom:8px}
.dn-satir-ust b{color:var(--lacivert); font-size:1rem}
.dn-deger{font-family:var(--mono); font-size:.88rem; color:var(--mavi-koyu)}
.dn-cubuk{height:9px; background:var(--kagit); border-radius:999px; overflow:hidden}
.dn-cubuk i{display:block; height:100%; border-radius:999px; transition:width .8s ease}
.dn-cubuk i.iyi{background:var(--yesil)}
.dn-cubuk i.orta{background:var(--sari)}
.dn-cubuk i.dusuk{background:var(--kirmizi)}
.dn-detay{font-size:.84rem; color:var(--gri); margin-top:7px}

.dn-yorum{background:var(--kagit); border-radius:var(--r); padding:20px; margin-top:24px}
.dn-yorum p{margin:0 0 8px; font-size:.95rem; color:var(--lacivert)}
.dn-yorum .dn-kucuk{font-size:.86rem; color:var(--gri); margin:12px 0 0}
.dn-uyari{font-size:.84rem; color:var(--gri); line-height:1.6; background:#FFF8E8;
  border:1px solid #F2E0B5; border-radius:10px; padding:14px 16px; margin-top:20px}
.dn-dugmeler{display:flex; gap:12px; flex-wrap:wrap; margin-top:22px}
.dn-cta{margin-top:26px; padding:24px; background:var(--mavi-cam); border:1px solid #CBE1F0; border-radius:var(--r)}
.dn-cta h3{color:var(--lacivert); margin:0 0 8px}
.dn-cta p{color:var(--gri); font-size:.95rem; margin:0 0 16px}

@media print{
  .tepe,.ustbar,.altbilgi,.yuzen,.mobil-cubuk,.dn-dugmeler,.dn-cta,#denemeGiris{display:none !important}
  .dn-cerceve{box-shadow:none; border:none}
  body{padding-bottom:0}
}