/* ============================================================
   RVZ BİLİŞİM — Global V2 Theme
   Font: Inter (body + headings)
   Card: white/glass · soft blue border · diffuse shadow · 20px radius
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap');

/* ── Body font ── */
body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
}

/* ── V2 renk paleti — tüm sayfalarda geçerli ── */
:root {
  /* Eski: #1a5cdb / #1a5cdb → Yeni: siber mavi */
  --blue:  #1a5cdb;
  --cyan:  #1a5cdb;
  --c1:    #1a5cdb;
  --c2:    #6d28d9;   /* mor — değişmiyor */
  --c3:    #1a5cdb;
  --c4:    #059669;
  --c5:    #d97706;
  --c6:    #dc2626;
  --accent:       #1a5cdb;
  --accent-deep:  #0061a8;
  --accent-bright:#1a5cdb;
}

/* ── V2 card mixin variables ── */
:root {
  --v2-card-bg:     rgba(255,255,255,.84);
  --v2-card-border: rgba(0,143,214,.17);
  --v2-card-shadow: 0 8px 32px -8px rgba(0,97,168,.14), 0 2px 8px rgba(11,31,51,.05);
  --v2-card-shadow-hover: 0 16px 48px -12px rgba(0,97,168,.22), 0 4px 12px rgba(11,31,51,.08);
  --v2-card-radius: 20px;
  --v2-blur: blur(14px) saturate(1.15);
}

/* ──────────────────────────────────────────
   hizmetler.html · index.html  →  .svc-card
   ────────────────────────────────────────── */
.svc-card {
  background: var(--v2-card-bg) !important;
  backdrop-filter: var(--v2-blur) !important;
  -webkit-backdrop-filter: var(--v2-blur) !important;
  border-color: var(--v2-card-border) !important;
  border-radius: var(--v2-card-radius) !important;
  box-shadow: var(--v2-card-shadow) !important;
}
.svc-card:hover {
  border-color: rgba(0,143,214,.36) !important;
  box-shadow: var(--v2-card-shadow-hover) !important;
}

/* ──────────────────────────────────────────
   cozumler.html  →  .proj-card
   ────────────────────────────────────────── */
.proj-card {
  background: var(--v2-card-bg) !important;
  backdrop-filter: var(--v2-blur) !important;
  -webkit-backdrop-filter: var(--v2-blur) !important;
  border-color: var(--v2-card-border) !important;
  box-shadow: var(--v2-card-shadow) !important;
}
.proj-card:hover {
  border-color: rgba(0,143,214,.34) !important;
  box-shadow: var(--v2-card-shadow-hover) !important;
}

/* ──────────────────────────────────────────
   blog.html  →  .article-card
   ────────────────────────────────────────── */
.article-card {
  background: var(--v2-card-bg) !important;
  backdrop-filter: var(--v2-blur) !important;
  -webkit-backdrop-filter: var(--v2-blur) !important;
  border-color: var(--v2-card-border) !important;
  border-radius: var(--v2-card-radius) !important;
  box-shadow: var(--v2-card-shadow) !important;
}
.article-card:hover {
  border-color: rgba(0,143,214,.34) !important;
  box-shadow: var(--v2-card-shadow-hover) !important;
}

/* ──────────────────────────────────────────
   kariyer.html  →  .benefit-card  .job-item
   ────────────────────────────────────────── */
.benefit-card {
  background: var(--v2-card-bg) !important;
  backdrop-filter: var(--v2-blur) !important;
  -webkit-backdrop-filter: var(--v2-blur) !important;
  border-color: var(--v2-card-border) !important;
  border-radius: var(--v2-card-radius) !important;
  box-shadow: var(--v2-card-shadow) !important;
}
.benefit-card:hover {
  border-color: rgba(0,143,214,.34) !important;
  box-shadow: var(--v2-card-shadow-hover) !important;
}

.job-item {
  background: rgba(255,255,255,.78) !important;
  backdrop-filter: var(--v2-blur) !important;
  -webkit-backdrop-filter: var(--v2-blur) !important;
  border-color: var(--v2-card-border) !important;
  border-radius: 18px !important;
  box-shadow: 0 4px 20px -4px rgba(0,97,168,.1), 0 1px 6px rgba(11,31,51,.04) !important;
}
.job-item:hover,
.job-item.open {
  border-color: rgba(0,143,214,.34) !important;
  box-shadow: 0 8px 32px -8px rgba(0,97,168,.16) !important;
}

/* ──────────────────────────────────────────
   noc.html  →  .scard  .metric-card  .panel
   ────────────────────────────────────────── */
.scard,
.metric-card {
  background: var(--v2-card-bg) !important;
  backdrop-filter: var(--v2-blur) !important;
  -webkit-backdrop-filter: var(--v2-blur) !important;
  border-color: var(--v2-card-border) !important;
  border-radius: 18px !important;
  box-shadow: 0 4px 20px -4px rgba(0,97,168,.1), 0 1px 6px rgba(11,31,51,.04) !important;
}

.panel {
  background: rgba(255,255,255,.72) !important;
  backdrop-filter: var(--v2-blur) !important;
  -webkit-backdrop-filter: var(--v2-blur) !important;
  border-color: rgba(0,143,214,.14) !important;
  border-radius: 18px !important;
}

/* ──────────────────────────────────────────
   iletisim.html  →  .cc  .form-wrap  .info-block
   ────────────────────────────────────────── */
.cc {
  background: var(--v2-card-bg) !important;
  backdrop-filter: var(--v2-blur) !important;
  -webkit-backdrop-filter: var(--v2-blur) !important;
  border-color: var(--v2-card-border) !important;
  border-radius: var(--v2-card-radius) !important;
  box-shadow: var(--v2-card-shadow) !important;
}
.cc:hover {
  border-color: rgba(0,143,214,.34) !important;
  box-shadow: var(--v2-card-shadow-hover) !important;
}

.form-wrap {
  background: rgba(255,255,255,.90) !important;
  backdrop-filter: blur(16px) saturate(1.2) !important;
  -webkit-backdrop-filter: blur(16px) saturate(1.2) !important;
  border-color: rgba(0,143,214,.18) !important;
  border-radius: 22px !important;
  box-shadow: 0 10px 40px -10px rgba(0,97,168,.14), 0 2px 8px rgba(11,31,51,.06) !important;
}

.info-block {
  background: rgba(255,255,255,.80) !important;
  backdrop-filter: var(--v2-blur) !important;
  -webkit-backdrop-filter: var(--v2-blur) !important;
  border-color: var(--v2-card-border) !important;
  border-radius: 18px !important;
  box-shadow: 0 4px 20px -4px rgba(0,97,168,.1) !important;
}

/* ──────────────────────────────────────────
   index.html  →  stat / hero-spec
   ────────────────────────────────────────── */
.hero-spec {
  backdrop-filter: blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;
}

/* ============================================================
   GLOBAL NAV — tüm sayfalarda aynı görünüm (.rail-nav hariç)
   ============================================================ */
nav:not(.rail-nav) {
  background: rgba(255,255,255,.72) !important;
  backdrop-filter: blur(22px) saturate(1.6) !important;
  -webkit-backdrop-filter: blur(22px) saturate(1.6) !important;
  border-bottom: 1px solid rgba(26,92,219,.10) !important;
}

/* Nav linkleri — tüm sayfalarda okunabilir beyaz */
nav:not(.rail-nav) .nav-links a,
nav:not(.rail-nav) ul a {
  color: #3a4c63 !important;
  font-size: .7rem !important;
  letter-spacing: 0.4px !important;
}
nav:not(.rail-nav) .nav-links a:hover,
nav:not(.rail-nav) .nav-links a.active,
nav:not(.rail-nav) ul a:hover,
nav:not(.rail-nav) ul a.active {
  color: #1a5cdb !important;
  font-weight: 600 !important;
}

/* Logo */
nav .nav-logo,
nav .logo,
nav > a:first-child {
  background: linear-gradient(135deg, #1a5cdb, #1245b0) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}

/* CTA butonu */
nav .nav-cta {
  background: linear-gradient(135deg, #0061a8, #1a5cdb) !important;
  border: none !important;
  color: #fff !important;
  border-radius: 30px !important;
  padding: 8px 20px !important;
  font-weight: 600 !important;
  box-shadow: 0 4px 16px -4px rgba(0,97,168,.45) !important;
  transition: opacity .2s, transform .2s !important;
}
nav .nav-cta:hover {
  opacity: .88 !important;
  transform: translateY(-1px) !important;
  background: linear-gradient(135deg, #0061a8, #1a5cdb) !important;
  color: #fff !important;
}

/* Mobile menu */
nav .nav-links.open {
  background: rgba(255,255,255,.97) !important;
  backdrop-filter: blur(24px) !important;
}

/* Logo görselleri (metin logo yerine gelen img) */
.logo .logo-img, .brand .logo-img, .logo-link .logo-img { height: 42px !important; width: auto !important; display: block !important; }
.tb-logo .logo-img { height: 28px !important; width: auto !important; display: block !important; }
.logo-img-f { height: 30px; width: auto; display: block; }

/* ============================================================
   GLOBAL FOOTER — tüm sayfalarda aynı görünüm
   ============================================================ */
footer {
  background: #e8f0f9 !important;
  border-top: 1px solid #d0ddf0 !important;
  color: #4a6080 !important;
  position: relative;
  z-index: 10;
}
footer a {
  color: #4a6080 !important;
  text-decoration: none !important;
  transition: color .2s !important;
}
footer a:hover {
  color: #0061a8 !important;
}

/* Footer iç grid — 4 kolon */
.footer-top {
  display: grid !important;
  grid-template-columns: 2.5fr 1fr 1fr 1fr !important;
  gap: 44px !important;
  padding: 52px 64px 36px !important;
}
.footer-top h4 {
  font-size: 11px !important;
  letter-spacing: .15em !important;
  text-transform: uppercase !important;
  font-weight: 700 !important;
  color: #0a1c40 !important;
  margin-bottom: 14px !important;
}
.footer-top ul {
  list-style: none !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 9px !important;
}
.footer-top ul li a {
  font-size: 14px !important;
  color: #4a6080 !important;
}
.footer-top ul li a:hover {
  color: #0061a8 !important;
}

/* Footer alt bar */
.footer-bot {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 16px 64px !important;
  border-top: 1px solid #c8d8ee !important;
  font-size: 11.5px !important;
  color: #7a90aa !important;
  font-family: 'JetBrains Mono', ui-monospace, monospace !important;
  letter-spacing: .04em !important;
}
.footer-bot .status {
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
}
.footer-bot .pip {
  width: 7px !important;
  height: 7px !important;
  border-radius: 50% !important;
  background: #22c55e !important;
  box-shadow: 0 0 6px rgba(34,197,94,.7) !important;
  display: inline-block !important;
  flex-shrink: 0 !important;
  animation: footerPip 2.5s ease-in-out infinite !important;
}
@keyframes footerPip {
  0%,100%{opacity:1}
  50%{opacity:.35}
}

/* Footer logo alanı */
.footer-top .logo {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  letter-spacing: .04em !important;
  color: #0a1c40 !important;
}
.footer-top .logo .dot {
  width: 8px !important;
  height: 8px !important;
  background: #1a5cdb !important;
  border-radius: 50% !important;
  box-shadow: 0 0 8px rgba(0,143,214,.6) !important;
}
.footer-top .logo b { color: #0a1c40 !important; font-weight: 700 !important; }
.footer-top .logo i  { color: #1a5cdb !important; font-style: normal !important; }

/* Footer 1. kolon: BÜYÜK logo + yanında açıklama yazısı (yan yana) */
.footer-top > div:first-child { display: flex !important; align-items: center !important; gap: 20px !important; }
.footer-top > div:first-child .logo { margin-bottom: 0 !important; flex-shrink: 0 !important; }
.footer-top .logo-img-f { height: 56px !important; }
.footer-top > div:first-child p { margin: 0 !important; max-width: 280px !important; font-size: 13px !important; line-height: 1.55 !important; }

/* Responsive */
@media (max-width: 960px) {
  .footer-top {
    grid-template-columns: 1fr 1fr !important;
    gap: 32px !important;
    padding: 40px 32px 28px !important;
  }
}
@media (max-width: 600px) {
  .footer-top {
    grid-template-columns: 1fr !important;
    padding: 32px 20px 24px !important;
  }
  .footer-bot {
    flex-direction: column !important;
    gap: 8px !important;
    text-align: center !important;
    padding: 16px 20px !important;
  }
}

/* ============================================================
   GLOBAL RENK OVERRIDE — #1a5cdb → #1a5cdb
   Tüm sayfalardaki hardcoded eski mavi tonları güncellenir
   ============================================================ */

/* Butonlar & CTA */
.btn.primary,
.btn-main,
.apply-btn,
.cta-btn,
.nav-cta,
.nl-btn,
.filter-btn.active,
.fchip.active,
.cat-btn.active::after,
.form-submit {
  background: linear-gradient(135deg, #1a5cdb, #0061a8) !important;
}

/* Gradient accent text — em, .grad, .em sınıfları */
.grad,
h1 .grad,
h2 .grad,
.hero-h em,
.page-title em,
.section-header h2 .em,
.stack-text h2 .em,
.kabin-text h2 .em,
.fw-overlay h2 .em,
.room-overlay h2 .em,
.stage-step h3 .em,
.scene-step h3 .em,
.cta-text h2 .em {
  background: linear-gradient(120deg, #1a5cdb, #3d7bea 55%, #2b7cff) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  /* italic text clipping fix — son harf kesilmesini önler */
  padding-right: 0.1em !important;
  display: inline !important;
}

/* Genel gradient-text clip fix — tüm .em ve italic gradient elementleri */
h1 em, h2 em, h3 em,
.em, .grad {
  padding-right: 0.08em;
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
}

/* Sayısal değerler (stat .big, .n, .stat-num vb.) */
.stat .big,
.about-stat-num,
.hero-stat strong,
.cs-stat-val,
.metric .mv,
.card-yr,
.fw-stat .v.cy,
.an2-stat .v.cy {
  background: linear-gradient(135deg, #1a5cdb, #0061a8) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}

/* Section numara / eyebrow renkleri */
.section-header .num,
.eyebrow,
.tag-line,
.label-mono,
.an2-kicker,
.room-overlay .label-mono,
.stack-text .num,
.kabin-text .num,
.cs-label,
.cta-tag {
  color: #1a5cdb !important;
}

/* Link renkleri */
a.active, .nav-links a.active {
  color: #1a5cdb !important;
}

/* Progress / scroll bar */
#vp { background: linear-gradient(90deg, #1a5cdb, #1a5cdb) !important; }
#vp::after { background: linear-gradient(90deg, #1a5cdb, #1a5cdb) !important; }
.progress { background: linear-gradient(90deg, #0061a8, #1a5cdb) !important; }

/* Section üst çizgi vurgusu */
.section-header .num::after { background: #d0ddf0 !important; }
.stack-text .num::before,
.kabin-text .num::before { background: #1a5cdb !important; }

/* Hizmetler kategori nav */
.cat-btn:hover,
.cat-btn.active { color: #1a5cdb !important; border-bottom-color: #1a5cdb !important; }

/* Blog filter */
.filter-btn:hover { color: #1a5cdb !important; border-color: #1a5cdb !important; }