/* mevlutkaya.com.tr — ortak tema (tüm genel sayfalar bu dosyayı kullanır) */
:root {
  --theme-primary: #f5a524;
  --theme-secondary: #d97706;
  --theme-glow: rgba(245, 165, 36, 0.32);
  --theme-border: rgba(148, 163, 184, 0.2);
  --theme-dot: #fbbf24;
  --on-primary: #1a1204;
  --arac-renk: #22d3ee;
}
[data-theme="cyan"] {
  --theme-primary: #06b6d4;
  --theme-secondary: #3b82f6;
  --theme-glow: rgba(6, 182, 212, 0.4);
  --theme-border: rgba(56, 189, 248, 0.22);
  --theme-dot: #22d3ee;
  --on-primary: #04111a;
}
[data-theme="green"] {
  --theme-primary: #10b981;
  --theme-secondary: #059669;
  --theme-glow: rgba(16, 185, 129, 0.4);
  --theme-border: rgba(52, 211, 153, 0.22);
  --theme-dot: #34d399;
  --on-primary: #03150e;
}

html { scroll-padding-top: 100px; }
section { scroll-margin-top: 100px; }
body { font-family: 'Plus Jakarta Sans', sans-serif; background-color: #07090f; }
h1, h2, h3, .font-display { font-family: 'Bricolage Grotesque', 'Plus Jakarta Sans', sans-serif; letter-spacing: -0.015em; }
.eyebrow { font-family: 'JetBrains Mono', monospace; font-size: 12px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--theme-primary); }
.on-primary { color: var(--on-primary) !important; }
.font-mono { font-family: 'JetBrains Mono', monospace; }

/* Özel imleç (yalnızca fare olan cihazlarda) */
@media (hover: hover) and (pointer: fine) {
  body, a, button, input, textarea, summary { cursor: none !important; }
}
.cursor-dot {
  width: 8px; height: 8px; background-color: var(--theme-dot);
  border-radius: 50%; position: fixed; top: 0; left: 0;
  pointer-events: none; z-index: 9999;
  box-shadow: 0 0 10px var(--theme-dot), 0 0 20px var(--theme-primary);
  transition: transform 0.08s ease-out, background-color 0.2s ease;
  transform: translate(-50%, -50%);
}
.cursor-outline {
  width: 36px; height: 36px; border: 1.5px solid var(--theme-border);
  border-radius: 50%; position: fixed; top: 0; left: 0;
  pointer-events: none; z-index: 9998;
  box-shadow: 0 0 15px var(--theme-glow);
  transition: width 0.25s ease, height 0.25s ease, border-color 0.25s ease, background-color 0.25s ease;
  transform: translate(-50%, -50%);
}
.cursor-hover {
  width: 54px !important; height: 54px !important;
  border-color: rgba(129, 140, 248, 0.8) !important;
  background: rgba(99, 102, 241, 0.12) !important;
  box-shadow: 0 0 25px rgba(99, 102, 241, 0.4) !important;
}
.mouse-spotlight {
  position: fixed; top: 0; left: 0; width: 600px; height: 600px;
  border-radius: 50%;
  background: radial-gradient(circle, var(--theme-glow) 0%, rgba(99, 102, 241, 0.03) 40%, transparent 70%);
  pointer-events: none; z-index: 1; transform: translate(-50%, -50%);
}

.bg-grid-neon {
  background-size: 56px 56px;
  background-image:
    linear-gradient(to right, rgba(148, 163, 184, 0.045) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(148, 163, 184, 0.045) 1px, transparent 1px);
}

.neon-glass-card {
  background: rgba(13, 19, 34, 0.9);
  backdrop-filter: blur(14px);
  border: 1px solid var(--theme-border);
  box-shadow: 0 4px 24px -6px rgba(0, 0, 0, 0.45);
  transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}
.neon-glass-card:hover {
  border-color: var(--theme-primary);
  transform: translateY(-2px);
  box-shadow: 0 10px 34px -10px var(--theme-glow);
}
/* İçinde etkileşimli araç/makale olan kartlar yerinde kalır */
.neon-glass-card.sabit:hover { transform: none; }

.system-card-glow {
  position: absolute; inset: -3px;
  background: linear-gradient(180deg, #6366f1 0%, var(--theme-primary) 50%, var(--theme-secondary) 100%);
  border-radius: 28px; filter: blur(22px); opacity: 0.38; z-index: -1;
}
.system-inner-panel { background: rgba(6, 10, 22, 0.85); border: 1px solid var(--theme-border); }

.neon-btn-primary {
  background: var(--theme-primary);
  color: var(--on-primary) !important;
  box-shadow: 0 10px 28px -8px var(--theme-glow);
  transition: all 0.25s ease;
}
.neon-btn-primary:hover { filter: brightness(1.08); transform: translateY(-1px); }
.btn-ikincil {
  border: 1px solid var(--arac-renk); color: var(--arac-renk);
  background: rgba(34, 211, 238, 0.06); transition: all .25s ease;
}
.btn-ikincil:hover { background: rgba(34, 211, 238, 0.14); transform: translateY(-1px); }

/* Cam menü şeridi */
.menu-cam {
  background: rgba(13, 19, 34, 0.74);
  backdrop-filter: blur(14px);
  border: 1px solid var(--theme-border);
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.4);
}

/* Bölüm başlığı */
.hero-vurgu { color: var(--theme-primary); position: relative; white-space: nowrap; }
.hero-vurgu::after {
  content: ''; position: absolute; left: 0; right: 0; bottom: -6px; height: 9px; opacity: .55;
  background: no-repeat center / 100% 100% url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 300 12' preserveAspectRatio='none'%3E%3Cpath d='M2 8 C 60 1, 120 12, 180 5 S 270 3, 298 7' fill='none' stroke='%23fbbf24' stroke-width='3' stroke-linecap='round'/%3E%3C/svg%3E");
}

@keyframes neonGlowPulse {
  0%   { box-shadow: 0 0 5px var(--theme-glow), inset 0 0 5px var(--theme-glow); border-color: var(--theme-border); }
  50%  { box-shadow: 0 0 15px var(--theme-primary), inset 0 0 10px var(--theme-primary); border-color: var(--theme-primary); }
  100% { box-shadow: 0 0 5px var(--theme-glow), inset 0 0 5px var(--theme-glow); border-color: var(--theme-border); }
}
.animated-neon-logo { animation: neonGlowPulse 3s infinite ease-in-out; }

.no-scrollbar::-webkit-scrollbar { display: none; }
.no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }
details > summary::-webkit-details-marker { display: none; }

/* Blog yazısı içeriği */
.blog-content p { margin-bottom: 1.25rem; line-height: 1.8; color: #cbd5e1; }
.blog-content h2, .blog-content h3 { color: #fff; font-weight: 700; margin-top: 2rem; margin-bottom: 1rem; }
.blog-content h2 { font-size: 1.5rem; }
.blog-content h3 { font-size: 1.25rem; }
.blog-content ul { list-style-type: disc; margin-left: 1.5rem; margin-bottom: 1.25rem; color: #cbd5e1; }
.blog-content ol { list-style-type: decimal; margin-left: 1.5rem; margin-bottom: 1.25rem; color: #cbd5e1; }
.blog-content li { margin-bottom: 0.5rem; }
.blog-content strong { color: #f8fafc; }
.blog-content a { color: var(--theme-dot); text-decoration: underline; }
.blog-content img { max-width: 100%; height: auto; border-radius: 0.75rem; margin: 1rem 0; }
.blog-content code { background: #0f172a; padding: 2px 6px; border-radius: 4px; font-family: 'JetBrains Mono', monospace; font-size: 0.9em; border: 1px solid rgba(56,189,248,0.2); color: #38bdf8; }

/* Bildirim kutusu (iletişim formu vb.) */
.mk-toast {
  position: fixed; left: 50%; bottom: 24px; transform: translateX(-50%) translateY(20px);
  z-index: 10000; max-width: min(92vw, 420px); padding: 12px 18px; border-radius: 14px;
  font-size: 13px; font-weight: 600; opacity: 0; transition: all .3s ease;
  background: rgba(6, 10, 22, .95); border: 1px solid var(--theme-border); color: #e2e8f0;
  box-shadow: 0 10px 30px rgba(0,0,0,.5);
}
.mk-toast.goster { opacity: 1; transform: translateX(-50%) translateY(0); }
.mk-toast.hata { border-color: rgba(244,63,94,.5); color: #fda4af; }
.mk-toast.basari { border-color: rgba(16,185,129,.5); color: #6ee7b7; }

/* ===== Araç sayfaları (ortak bileşenler: panelden eklenen araçlar bu sınıfları kullanır) ===== */
.ar-kutu { background: rgba(15, 23, 42, .55); border: 1px solid var(--theme-border); border-radius: 1rem; padding: 1.25rem; }
.ar-etiket { display: block; font-size: .75rem; font-weight: 700; color: #cbd5e1; margin-bottom: .4rem; }
.ar-girdi { width: 100%; padding: .6rem .8rem; border-radius: .75rem; background: #070b14; border: 1px solid var(--theme-border); color: #e2e8f0; font-size: .875rem; outline: none; }
.ar-girdi:focus { border-color: var(--arac-renk); }
textarea.ar-girdi { min-height: 9rem; resize: vertical; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; line-height: 1.5; }
select.ar-girdi { cursor: pointer; }
.ar-btn { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; padding: .65rem 1.25rem; border-radius: .75rem; font-size: .875rem; font-weight: 800; background: var(--theme-primary); color: var(--on-primary); transition: filter .15s, transform .15s; cursor: pointer; border: 0; }
.ar-btn:hover { filter: brightness(1.08); transform: translateY(-1px); }
.ar-btn:disabled { opacity: .5; cursor: not-allowed; transform: none; }
.ar-btn2 { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; padding: .6rem 1.1rem; border-radius: .75rem; font-size: .8rem; font-weight: 700; color: var(--arac-renk); border: 1px solid color-mix(in srgb, var(--arac-renk) 50%, transparent); background: transparent; cursor: pointer; transition: background .15s; }
.ar-btn2:hover { background: color-mix(in srgb, var(--arac-renk) 12%, transparent); }
.ar-drop { display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; gap: .25rem; padding: 2rem 1rem; border-radius: 1rem; border: 2px dashed color-mix(in srgb, var(--arac-renk) 55%, transparent); cursor: pointer; transition: background .15s; }
.ar-drop:hover, .ar-drop.ar-uzerinde { background: color-mix(in srgb, var(--arac-renk) 8%, transparent); }
.ar-sonuc { background: #070b14; border: 1px solid var(--theme-border); border-radius: .75rem; padding: .85rem 1rem; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .8rem; color: #e2e8f0; white-space: pre-wrap; word-break: break-all; min-height: 2.75rem; }
.ar-mesaj { font-size: .8rem; font-weight: 600; text-align: center; min-height: 1.25rem; }
.ar-mesaj.ok { color: #34d399; } .ar-mesaj.hata { color: #fb7185; } .ar-mesaj.bilgi { color: var(--arac-renk); }
.ar-izgara { display: grid; gap: 1rem; } @media (min-width: 640px) { .ar-izgara.iki { grid-template-columns: 1fr 1fr; } .ar-izgara.uc { grid-template-columns: repeat(3, 1fr); } }
.ar-ipucu { font-size: .7rem; color: #64748b; margin-top: .3rem; }
.ar-tablo { width: 100%; font-size: .8rem; border-collapse: collapse; }
.ar-tablo th { text-align: left; color: #94a3b8; font-weight: 700; padding: .5rem .6rem; border-bottom: 1px solid var(--theme-border); }
.ar-tablo td { padding: .5rem .6rem; border-bottom: 1px solid rgba(148, 163, 184, .1); vertical-align: top; }
.ar-kucuk { font-size: .7rem; padding: .3rem .6rem; border-radius: .5rem; border: 1px solid var(--theme-border); color: #cbd5e1; background: rgba(15, 23, 42, .6); cursor: pointer; }
.ar-kucuk:hover { color: #fff; border-color: var(--arac-renk); }
.ar-sayfa { position: relative; background: #0b1220; border: 1px solid var(--theme-border); border-radius: .75rem; padding: .5rem; cursor: grab; }
.ar-sayfa canvas { width: 100%; height: auto; display: block; border-radius: .4rem; background: #fff; }
.ar-sayfa.surukleniyor { opacity: .4; }

/* Blog yazısı ek öğeleri */
.blog-content ol { list-style-type: decimal; margin-left: 1.5rem; margin-bottom: 1.25rem; color: #cbd5e1; }
.blog-content li { margin-bottom: .4rem; line-height: 1.7; }
.blog-content a { color: var(--theme-dot); text-decoration: underline; text-underline-offset: 3px; }
.blog-content a:hover { color: #fff; }
.blog-content code { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .85em; padding: .1rem .35rem; border-radius: .35rem; background: rgba(15,23,42,.8); border: 1px solid var(--theme-border); color: #e2e8f0; }
.blog-content pre { overflow-x: auto; padding: 1rem; border-radius: .75rem; background: #070b14; border: 1px solid var(--theme-border); margin-bottom: 1.25rem; }
.blog-content pre code { padding: 0; border: 0; background: transparent; }
.blog-content table { width: 100%; border-collapse: collapse; margin-bottom: 1.25rem; font-size: .9em; }
.blog-content th, .blog-content td { text-align: left; padding: .55rem .75rem; border-bottom: 1px solid var(--theme-border); }
.blog-content th { color: #fff; font-weight: 700; }

/* Eski araç kodlarındaki mavi-cyan eylem düğmeleri tema rengine (amber) çekilir; cyan yalnızca araç kimliği (ikon, sürükle alanı, etiketler) olarak kalır */
.arac-icerik button[class*="from-cyan-"], .arac-icerik a[class*="from-cyan-"] { background-image: none !important; background-color: var(--theme-primary) !important; color: var(--on-primary) !important; box-shadow: none !important; }
.arac-icerik button[class*="from-cyan-"]:hover, .arac-icerik a[class*="from-cyan-"]:hover { filter: brightness(1.08); }

/* ---- Mobil / dokunmatik performans ----
   Cam bulanıklığı (backdrop-filter) ve dev bulanık ışık katmanları telefonlarda
   her kaydırmada yeniden çizildiği için sayfayı ağırlaştırıyordu. Mobilde bunları
   kapatıp aynı görünümü düz renk + ucuz gradyanla veriyoruz. */
@media (max-width: 1023px), (pointer: coarse) {
  .neon-glass-card { backdrop-filter: none; -webkit-backdrop-filter: none; background: rgb(13, 19, 34); transition: border-color .2s ease; }
  .neon-glass-card:hover { transform: none; }
  .menu-cam { backdrop-filter: none; -webkit-backdrop-filter: none; background: rgba(10, 15, 28, 0.97); }
  [class*="backdrop-blur"] { backdrop-filter: none !important; -webkit-backdrop-filter: none !important; }
  .dekor-isik, .cursor-dot, .cursor-outline, .mouse-spotlight { display: none !important; }
  body.bg-grid-neon { background-image:
      radial-gradient(ellipse 120% 380px at 50% -60px, color-mix(in srgb, var(--theme-primary) 14%, transparent), transparent 70%),
      linear-gradient(to right, rgba(148, 163, 184, 0.045) 1px, transparent 1px),
      linear-gradient(to bottom, rgba(148, 163, 184, 0.045) 1px, transparent 1px);
    background-size: 100% 100%, 56px 56px, 56px 56px; background-repeat: no-repeat, repeat, repeat; }
  .animate-ping, .animate-bounce, .animated-neon-logo, .animate-bot-float { animation: none !important; }
  .system-card-glow { filter: none; opacity: .18; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}