/* ============================================================
   NORDEM AÇIK TEMA v2 (Beyaz zemin + Mavi header/footer)
   Logo beyaz olduğu için logo bulunan alanlar (header, footer,
   preloader, ürün görsel paneli) mavi zemin kullanır.
   ============================================================ */

:root {
  --primary: #2563eb;
  --primary-hover: #1d4ed8;
  --secondary: #ffffff;
  --surface: #f5f8fd;
  --surface-light: #e5edf9;
  --accent: #2563eb;
  --alox-theme: #2563eb;
  --alox-theme-hover: #1d4ed8;
  --alox-glow-rgb: 37, 99, 235;
  --alox-glow-hex: #2563eb;
  --text-main: #0f172a;
  --text-muted: #5b6b84;
  --border: rgba(15, 23, 42, 0.10);
  --glass: rgba(255, 255, 255, 0.88);
  --shadow-glow: 0 8px 24px rgba(37, 99, 235, 0.14), 0 2px 8px rgba(15, 23, 42, 0.06);
  /* Nordem mavi zeminler */
  --nordem-blue-deep: #0d2357;
  --nordem-blue: #14357c;
  --nordem-blue-bright: #1d4ed8;
}

body { background-color: #ffffff !important; color: #0f172a !important; }

/* ============================================================
   STANDART HEADER YERLEŞİMİ (tüm sayfalarda birebir aynı)
   Renkler aşağıdaki HEADER bölümünde; buradakiler yerleşim.
   ============================================================ */
.top-bar { padding: 10px 0; font-size: 12px; position: relative; z-index: 1001; display: block; }
.top-bar-container { display: flex; justify-content: space-between; align-items: center; }
.top-bar-left, .top-bar-right { display: flex; gap: 25px; align-items: center; }
.top-bar-item { display: flex; align-items: center; gap: 8px; font-weight: 500; }
.top-socials { display: flex; gap: 15px; margin-left: 15px; padding-left: 15px; align-items: center; border-left: 1px solid rgba(255,255,255,.15); }
.top-socials a { font-size: 14px; display: block; padding: 2px; }

header { position: sticky !important; top: 0; z-index: 10000; height: 100px; display: flex; align-items: center; backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); }
.header-container { display: flex; justify-content: space-between; align-items: center; width: 100%; }
.logo img { height: 85px; transition: all .3s; }
nav { display: block; }
.nav-menu { display: flex; gap: 30px; align-items: center; list-style: none; margin: 0; padding: 0; }
.nav-link { font-weight: 600; font-size: 13px; text-transform: uppercase; letter-spacing: 1px; background: none; border: none; font-family: inherit; cursor: pointer; position: relative; text-decoration: none; }
.nav-link::after { content: ''; position: absolute; left: 0; bottom: -8px; width: 100%; height: 2px; transform: scaleX(0); transform-origin: left; transition: transform .35s ease; }
.nav-link:hover::after, .nav-item.active .nav-link::after { transform: scaleX(1); }

.dropdown { position: relative; }
.dropdown-menu { position: absolute; top: calc(100% + 20px); left: 0; border-radius: 12px; padding: 8px; opacity: 0; visibility: hidden; transition: all .3s ease; min-width: 230px; z-index: 10002; transform: translateY(10px); }
@media (min-width: 769px) {
  .dropdown:hover .dropdown-menu, .dropdown.desktop-open .dropdown-menu { opacity: 1; visibility: visible; top: calc(100% + 10px); transform: translateY(0); }
}
.dropdown-item { padding: 10px 15px; font-size: 13px; display: flex; align-items: center; gap: 10px; border-radius: 8px; transition: all .3s; font-weight: 600; text-decoration: none; }
.dropdown-item i { font-size: 14px; color: #2563eb !important; }

.menu-toggle { display: none; width: 52px; height: 52px; border-radius: 16px; font-size: 20px; cursor: pointer; z-index: 10006; position: relative; margin-left: auto; align-items: center; justify-content: center; }

.lang-switcher { position: relative; display: flex; align-items: center; margin-left: 20px; }
.lang-btn { display: flex; align-items: center; gap: 7px; border-radius: 8px; padding: 6px 12px; font-size: 12px; font-weight: 700; cursor: pointer; text-transform: uppercase; letter-spacing: 1px; font-family: inherit; }
.lang-dropdown { position: absolute; top: calc(100% + 10px); right: 0; border-radius: 14px; padding: 8px; min-width: 170px; opacity: 0; visibility: hidden; transform: translateY(8px); transition: all .25s ease; z-index: 10005; }
.lang-dropdown.open { opacity: 1; visibility: visible; transform: translateY(0); }
.lang-option { display: flex; align-items: center; gap: 10px; padding: 10px 14px; border-radius: 9px; cursor: pointer; transition: all .2s; font-size: 13px; font-weight: 600; }
.lang-option .lang-native { font-size: 11px; opacity: .6; margin-left: auto; }

/* ---------- TABLET (769-1150px): header sığsın, akıcı olsun ---------- */
@media (max-width: 1150px) and (min-width: 769px) {
  .nav-menu { gap: 16px; }
  .nav-link { font-size: 12px; letter-spacing: .6px; }
  .logo img { height: 64px; }
  .lang-switcher { margin-left: 10px; }
  .top-bar-left, .top-bar-right { gap: 14px; }
  .top-bar { font-size: 11px; }
  .container { padding: 0 20px; }
  .image-showcase { max-width: 560px; }
  .hero-grid { column-gap: 32px; }
}

@media (max-width: 768px) {
  .top-bar { display: none !important; }
  header { height: 84px; }
  .header-container { position: relative; justify-content: flex-end; height: 100%; }
  .logo { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: 10000; display: flex; align-items: center; justify-content: center; }
  .logo img { height: 58px; }
  .menu-toggle { display: inline-flex !important; width: 56px; height: 56px; font-size: 22px; }
  .page-content-wrapper { padding-top: 0 !important; }
  .lang-switcher { margin-left: 12px; }
  .nav-menu { position: fixed; top: 12px; right: 12px; left: 12px; width: auto; height: auto; max-height: calc(100vh - 24px); flex-direction: column; align-items: stretch; padding: 90px 20px 20px; z-index: 10005; display: flex; overflow-y: auto; opacity: 0; visibility: hidden; pointer-events: none; transform: translateY(-10px) scale(.98); border-radius: 28px; gap: 12px; transition: all .28s ease; box-shadow: 0 24px 60px rgba(15,23,42,.28); }
  .nav-menu.active { opacity: 1 !important; visibility: visible !important; pointer-events: auto; transform: translateY(0) scale(1); right: 12px !important; }
  .nav-item { width: 100%; }
  .nav-link { display: flex; align-items: center; justify-content: space-between; width: 100%; padding: 16px 20px; font-size: 15px; font-weight: 700; border-radius: 18px; }
  .nav-link::after { display: none; }
  .dropdown-menu { position: static; opacity: 1; visibility: visible; display: block; box-shadow: none; border: none; padding: 0; background: transparent !important; margin-top: 10px; min-width: 100%; max-height: 0; overflow: hidden; transform: none; transition: max-height .35s ease; }
  .dropdown.active .dropdown-menu { max-height: 420px; }
  .dropdown-menu-inner { display: flex; flex-direction: column; gap: 10px; padding-top: 6px; }
  .dropdown-item { padding: 14px 18px; font-size: 14px; border-radius: 16px; }
  .mobile-overlay { position: fixed; inset: 0; z-index: 9998; opacity: 0; visibility: hidden; transition: all .3s ease; }
  .mobile-overlay.active { opacity: 1; visibility: visible; }
}

/* ---------- BAŞLIKLAR & GENEL METİN ---------- */
h1, h2, h3, h4, h5, h6 { color: #0f172a !important; text-shadow: none !important; }
.title, .subtitle, p { text-shadow: none !important; }

/* ---------- PRELOADER (mavi zemin — beyaz logo görünür) ----------
   Tam yerleşim temada: stilleri olmayan sayfalarda da birebir aynı çalışır */
#preloader { position: fixed !important; inset: 0 !important; width: 100vw !important; height: 100vh !important;
  background: linear-gradient(160deg, #1e3a8a 0%, #14357c 55%, #0d2357 100%) !important; z-index: 2000000 !important;
  display: flex !important; justify-content: center !important; align-items: center !important;
  transition: opacity .5s ease, visibility .5s ease !important; }
body.loaded #preloader { opacity: 0 !important; visibility: hidden !important; pointer-events: none !important; }
#preloader .loader-content { display: flex; flex-direction: column; align-items: center; width: 100%; }
.loader-logo { filter: brightness(0) invert(1) !important; max-height: 110px !important; max-width: 75vw !important;
  width: auto !important; height: auto !important; object-fit: contain; animation: logo-breath 1.4s infinite ease-in-out; }
@keyframes logo-breath { 0%, 100% { opacity: .85; transform: scale(.98); } 50% { opacity: 1; transform: scale(1.03); } }
.loader-line-container { width: 220px; max-width: 70vw; height: 3px; margin-top: 28px; border-radius: 4px;
  position: relative; overflow: hidden; background: rgba(255,255,255,.15) !important; }
.loader-line { position: absolute; top: 0; left: 0; height: 100%; width: 0%; border-radius: 4px;
  background: linear-gradient(90deg, transparent, #93c5fd, #ffffff) !important; }
@media (max-width: 768px) { .loader-logo { max-height: 80px !important; } }

/* ---------- ÜST BAR ---------- */
.top-bar { background-color: #0d2357 !important; border-bottom: 1px solid rgba(255,255,255,.08) !important; }
/* telefon/mail altındaki çizgiler kalksın */
.top-bar a, .top-bar a:hover, .top-socials a, .nav-link, .dropdown-item,
footer a, .f-link, .f-contact-item a {
  text-decoration: none !important;
  border-bottom: none !important;
}
.top-bar-item { color: rgba(255,255,255,.75) !important; }
.top-bar-item i { color: #93c5fd !important; }
a.top-bar-item:hover { color: #ffffff !important; }
.top-socials { border-left-color: rgba(255,255,255,.15) !important; }
.top-socials a { color: rgba(255,255,255,.75) !important; }
.top-socials a:hover { color: #ffffff !important; }

/* ---------- HEADER (mavi zemin — beyaz logo görünür) ---------- */
header { background: linear-gradient(180deg, rgba(30,58,138,.97) 0%, rgba(20,53,124,.97) 100%) !important; border-bottom: 1px solid rgba(255,255,255,.10) !important; }
header.scrolled { background: rgba(17,42,99,.98) !important; box-shadow: 0 12px 30px rgba(13,35,87,.35) !important; border-bottom-color: rgba(255,255,255,.12) !important; }
.logo img { filter: brightness(0) invert(1) !important; }
.nav-link { color: rgba(255,255,255,.80) !important; }
.nav-link:hover, .nav-item.active .nav-link { color: #ffffff !important; }
.nav-link::after { background: linear-gradient(90deg, #93c5fd, transparent) !important; }
.menu-toggle { background: rgba(255,255,255,.10) !important; border-color: rgba(255,255,255,.22) !important; color: #ffffff !important; box-shadow: none !important; }
.menu-toggle:hover, .menu-toggle.active { color: #ffffff !important; border-color: rgba(255,255,255,.45) !important; background: rgba(255,255,255,.18) !important; }
.dropdown-menu { background: #ffffff !important; border-color: rgba(15,23,42,.10) !important; box-shadow: 0 20px 40px rgba(15,23,42,.18) !important; }
.dropdown-item { color: #47566e !important; }
.dropdown-item:hover { background: rgba(37,99,235,.08) !important; color: #2563eb !important; }

/* Mobil menü */
@media (max-width: 768px) {
  header { background: linear-gradient(180deg, #1e3a8a 0%, #14357c 100%) !important; }
  .nav-menu { background: #ffffff !important; border-color: rgba(15,23,42,.10) !important; box-shadow: 0 24px 60px rgba(15,23,42,.28) !important; }
  .nav-menu::before { color: #5b6b84 !important; }
  .nav-link { background: #f2f6fb !important; border-color: rgba(15,23,42,.08) !important; color: #0f172a !important; }
  .nav-item.active .nav-link, .nav-link:hover { background: rgba(37,99,235,.10) !important; color: #2563eb !important; border-color: rgba(37,99,235,.40) !important; box-shadow: none !important; }
  .dropdown-item { background: #f2f6fb !important; border-color: rgba(15,23,42,.08) !important; color: #0f172a !important; }
  .mobile-overlay { background: rgba(13,35,87,.45) !important; }
}

/* ---------- DİL SEÇİCİ (mavi header üstünde) ---------- */
.lang-btn { background: rgba(255,255,255,.12) !important; border-color: rgba(255,255,255,.25) !important; color: #ffffff !important; }
.lang-btn:hover { background: rgba(255,255,255,.22) !important; color: #ffffff !important; border-color: rgba(255,255,255,.45) !important; }
.lang-dropdown { background: #ffffff !important; border-color: rgba(15,23,42,.10) !important; box-shadow: 0 20px 50px rgba(15,23,42,.20) !important; }
.lang-option { color: #47566e !important; }
.lang-option:hover { background: rgba(37,99,235,.08) !important; color: #0f172a !important; }
.lang-option.active { background: rgba(37,99,235,.12) !important; color: #2563eb !important; }

/* ---------- BREADCRUMB ---------- */
.breadcrumbs, .breadcrumbs a { color: #5b6b84 !important; }
.breadcrumbs a:hover { color: #2563eb !important; }
.breadcrumbs span[style] { color: #0f172a !important; }

/* ---------- ÜRÜN GÖRSEL PANELİ (mavi zemin — ürün fotoğrafları net görünür) ---------- */
.image-showcase {
  background: #ffffff !important;
  border-radius: 28px !important;
  border: 1px solid rgba(15,23,42,.10) !important;
  box-shadow: 0 14px 34px rgba(15,23,42,.10) !important;
  overflow: hidden !important;
  /* tam kare panel — görsel kırpılmadan alanı doldurur, kolonu doldursun */
  aspect-ratio: 1 / 1;
  height: auto !important;
  max-width: 100%;
  width: 100%;
  margin: 0 auto;
  padding: 28px;
  box-sizing: border-box;
}

/* Görsel altı: ürün hizmet kutucukları */
.under-strip { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-top: 16px; }
.u-chip { background: #f5f8fd; border: 1px solid rgba(37,99,235,.14); border-radius: 14px; padding: 14px 10px; text-align: center; transition: all .3s; }
.u-chip:hover { background: #ffffff; border-color: rgba(37,99,235,.38); transform: translateY(-3px); box-shadow: 0 8px 18px rgba(37,99,235,.12); }
.u-chip i { color: #2563eb; font-size: 20px; margin-bottom: 8px; display: block; }
.u-chip strong { display: block; color: #0f172a; font-size: 12.5px; font-weight: 800; margin-bottom: 3px; }
.u-chip span { color: #5b6b84; font-size: 11px; line-height: 1.4; display: block; }
@media (max-width: 768px) { .under-strip { grid-template-columns: 1fr; gap: 8px; } .u-chip { display: flex; align-items: center; gap: 12px; text-align: left; padding: 12px 14px; } .u-chip i { margin-bottom: 0; } }
.image-showcase::before { display: none !important; }
.main-image {
  filter: drop-shadow(0 14px 24px rgba(15,23,42,.18)) !important;
  cursor: zoom-in !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  transform: scale(1.04);
}
.main-image:hover { transform: scale(1.08) translateY(-4px); }
/* TEK FOTOĞRAF DÜZENİ: küçük görseller ve gezinme okları gizli.
   İleride her ürüne çoklu fotoğraf gelirse bu iki satırı silmen yeterli. */
.thumbnail-gallery { display: none !important; }
.gallery-arrow { display: none !important; }
.thumb-btn { width: 140px !important; height: 100px !important; border-radius: 16px !important; }
@media (max-width: 768px) {
  .image-showcase { aspect-ratio: 1 / 1; height: auto !important; max-width: 100% !important; padding: 16px; }
  .main-image { transform: none !important; max-height: none !important; }
  .thumb-btn { width: 96px !important; height: 72px !important; }
}
.gallery-arrow { background: rgba(255,255,255,.14) !important; border: 1px solid rgba(255,255,255,.28) !important; color: #ffffff !important; }
.gallery-arrow:hover { background: #2563eb !important; color: #ffffff !important; border-color: #60a5fa !important; }
.thumb-btn { background: #f5f8fd !important; border-color: rgba(15,23,42,.12) !important; }
.thumb-btn.active { border-color: #2563eb !important; background: rgba(37,99,235,.08) !important; box-shadow: 0 0 12px rgba(37,99,235,.25) !important; }
.macro-lens { border-color: #dbe6f5 !important; background: #ffffff !important; }

/* ---------- KARTLAR / KUTULAR ---------- */
.option-group, .specs-card, .feature-box, .app-card, .faq-item, .grit-node,
.macro-display-box, .mission-card, .highlight-box, .form-card {
  background: #f5f8fd !important;
  border: 1px solid rgba(37,99,235,.14) !important;
  box-shadow: 0 6px 18px rgba(15,23,42,.06) !important;
}
.option-group:hover, .feature-box:hover, .app-card:hover, .grit-node:hover, .specs-card:hover, .macro-display-box:hover {
  border-color: rgba(37,99,235,.38) !important;
  box-shadow: 0 14px 32px rgba(37,99,235,.14) !important;
  background: #ffffff !important;
}
.l-feature { background: #f5f8fd !important; border: 1px solid rgba(37,99,235,.12) !important; }
.l-feature:hover { background: #ffffff !important; border-color: rgba(37,99,235,.35) !important; box-shadow: 0 8px 20px rgba(37,99,235,.12) !important; }
.l-feature-text h5 { color: #0f172a !important; }
.feature-box p, .app-card p, .l-feature-text p, .macro-text p, .option-desc, .grit-info p { color: #5b6b84 !important; }
.feature-box i, .app-card i { text-shadow: none !important; }

/* ---------- ANASAYFA: ÜRÜN GRUBU KARTLARI (s-card) ---------- */
.s-card { background: #16336e !important; }
.s-card-img { opacity: 1 !important; }
.s-card-overlay {
  background: linear-gradient(to top, rgba(13,35,87,.90) 0%, rgba(13,35,87,.28) 55%, transparent 100%) !important;
}
.s-card:hover .s-card-overlay {
  background: linear-gradient(to top, rgba(29,78,216,.88) 0%, rgba(13,35,87,.35) 60%, transparent 100%) !important;
}
.s-card-overlay h1, .s-card-overlay h2, .s-card-overlay h3, .s-card-overlay h4 { color: #ffffff !important; }
.s-card-overlay p, .s-card-overlay span { color: #dbe6f5 !important; }
.s-card-icon { color: #ffffff !important; }

/* ---------- ANASAYFA: BENTO KARTLAR ---------- */
.bento-card:hover { box-shadow: 0 16px 36px rgba(37,99,235,.16) !important; }
.bento-content-overlay p { color: #47566e !important; }
.bento-large::after { background: linear-gradient(to top, #ffffff 0%, rgba(255,255,255,.65) 30%, transparent 65%) !important; }

/* ---------- ROZET / ETİKET / PİLLER ---------- */
.badge { background: rgba(37,99,235,.10) !important; color: #2563eb !important; border-color: rgba(37,99,235,.35) !important; box-shadow: none !important; }
.usage-badge { background: #ffffff !important; border: 1px solid rgba(15,23,42,.12) !important; color: #47566e !important; }
.usage-badge:hover { background: rgba(37,99,235,.10) !important; border-color: #2563eb !important; color: #0f172a !important; }
.option-pill { background: #ffffff !important; border: 1px solid rgba(15,23,42,.14) !important; color: #47566e !important; }
.option-pill:hover { border-color: #2563eb !important; color: #0f172a !important; background: rgba(37,99,235,.06) !important; }
.grit-tag { background: #ffffff !important; border: 1px solid rgba(15,23,42,.12) !important; border-left: 3px solid #2563eb !important; color: #0f172a !important; box-shadow: 0 3px 8px rgba(15,23,42,.06) !important; }
.grit-tag:hover { background: rgba(37,99,235,.08) !important; color: #0f172a !important; box-shadow: 0 6px 14px rgba(37,99,235,.16) !important; }
.grit-info span { background: #ffffff !important; border-color: rgba(15,23,42,.12) !important; color: #47566e !important; }
.grit-node:hover .grit-info span { background: rgba(37,99,235,.10) !important; color: #2563eb !important; box-shadow: none !important; }
.grit-node:hover .grit-info h3 { color: #2563eb !important; text-shadow: none !important; }
.grit-node:hover .grit-info p { color: #0f172a !important; }
.grit-circle { background: #ffffff !important; border-color: #dbe6f5 !important; box-shadow: 0 6px 14px rgba(15,23,42,.10) !important; }
.grit-guide-header { background: #f5f8fd !important; border-color: rgba(37,99,235,.20) !important; box-shadow: 0 14px 30px rgba(15,23,42,.08) !important; }
.grit-guide-header p { color: #5b6b84 !important; }
.grit-guide-header h2 i { background: rgba(37,99,235,.10) !important; box-shadow: none !important; }

/* ---------- TABLO ---------- */
.specs-table tr { border-bottom: 1px solid rgba(15,23,42,.08) !important; }
.specs-table tr:hover { background: rgba(37,99,235,.04) !important; }
.specs-table td:first-child { color: #5b6b84 !important; }
.specs-table td:last-child { color: #0f172a !important; }
.specs-card h3 i { text-shadow: none !important; }

/* ---------- SSS ---------- */
.faq-question { color: #0f172a !important; }
.faq-question:hover { color: #2563eb !important; }
.faq-item.active { background: #ffffff !important; border-color: rgba(37,99,235,.45) !important; box-shadow: 0 6px 20px rgba(37,99,235,.12) !important; }
.faq-answer p { color: #47566e !important; border-top-color: rgba(15,23,42,.08) !important; }

/* ---------- BUTONLAR (mavi zeminde beyaz metin KALIR) ---------- */
.btn-primary, .btn-primary i { color: #ffffff !important; }
.btn-primary { box-shadow: 0 8px 20px rgba(37,99,235,.30) !important; }
.btn-primary:hover { box-shadow: 0 12px 28px rgba(37,99,235,.40) !important; }

/* ---------- FORM ELEMANLARI ---------- */
input:not([type="checkbox"]):not([type="radio"]), textarea, select {
  background: #ffffff !important;
  border: 1px solid rgba(15,23,42,.16) !important;
  color: #0f172a !important;
}
input::placeholder, textarea::placeholder { color: #93a3b8 !important; }
input:focus, textarea:focus, select:focus { border-color: #2563eb !important; box-shadow: 0 0 0 3px rgba(37,99,235,.12) !important; }
label { color: #334155 !important; }

/* ---------- ANASAYFA HERO (koyu video bölümü — kontrast için koyu kalır) ---------- */
.hero-creative { background: #0d2357 !important; }
.hero-overlay { background: radial-gradient(circle at center, rgba(13,35,87,.35) 0%, rgba(13,35,87,.94) 100%) !important; }
.hero-creative h1, .hero-creative h2, .hero-creative h3,
.hero-title-main { color: #ffffff !important; }
.hero-subtitle { color: #dbe6f5 !important; }
.cta-stats-wrapper h1, .cta-stats-wrapper h2, .cta-stats-wrapper h3, .cta-stats-wrapper h4 { color: #ffffff !important; }

/* ---------- FOOTER (mavi zemin — beyaz logo görünür) ---------- */
footer { background: linear-gradient(180deg, #14357c 0%, #0d2357 100%) !important; border-top: 1px solid rgba(255,255,255,.10) !important; }
footer img { filter: brightness(0) invert(1) !important; }
.footer-section h4 { color: #ffffff !important; }
.footer-section h4::after { background: #93c5fd !important; }
.footer-section p { color: rgba(255,255,255,.70) !important; }
.f-link { color: rgba(255,255,255,.70) !important; }
.f-link:hover { color: #ffffff !important; }
.f-contact-item { color: rgba(255,255,255,.70) !important; }
.f-contact-item i { color: #93c5fd !important; }
.f-contact-item a:hover { color: #ffffff !important; }
.f-working-hours { background: rgba(255,255,255,.08) !important; border: 1px solid rgba(255,255,255,.14) !important; }
.f-working-hours p span:first-child { color: #ffffff !important; }
.f-working-hours p span:last-child { color: #93c5fd !important; text-shadow: none !important; }
.footer-bottom { border-top: 1px solid rgba(255,255,255,.12) !important; color: rgba(255,255,255,.55) !important; opacity: 1 !important; }
.social-btn { background: rgba(255,255,255,.10) !important; border: 1px solid rgba(255,255,255,.20) !important; color: rgba(255,255,255,.85) !important; }
.social-btn:hover { background: #ffffff !important; color: #14357c !important; border-color: #ffffff !important; }

/* ---------- MODAL (görsel büyütme — koyu kalması normal) ---------- */
.modal { background-color: rgba(13, 25, 55, 0.94) !important; }

/* ---------- GENEL DÜZELTMELER ---------- */
.section-header-compact p { color: #5b6b84 !important; }
.macro-text h4 i, .option-group h4 i, .grit-display h4 i, .l-feature i { text-shadow: none !important; }
.grit-display { background: #f5f8fd !important; border-top-color: rgba(15,23,42,.08) !important; }
@media (max-width: 768px) {
  .grit-display { background: #f5f8fd !important; }
  .grit-tag { background: #ffffff !important; border-bottom: 2px solid #2563eb !important; }
  .image-showcase { border-radius: 20px !important; }
}

/* ============================================================
   v2.1 EK KAPSAM — sayfaya özgü bölümler
   ============================================================ */

/* --- ÜRÜNLERİMİZ sayfası: ürün kartları --- */
.product-card { background: #ffffff !important; border: 1px solid rgba(37,99,235,.16) !important; box-shadow: 0 6px 18px rgba(15,23,42,.06) !important; }
.product-card:hover { border-color: rgba(37,99,235,.40) !important; box-shadow: 0 16px 36px rgba(37,99,235,.16) !important; }
.card-image-wrapper {
  background: #ffffff !important;
  border-bottom: 1px solid rgba(15,23,42,.08) !important;
}
.card-image-wrapper::after { display: none !important; }
.card-image-wrapper img { filter: drop-shadow(0 10px 16px rgba(15,23,42,.15)) !important; }
.product-card::before { display: none !important; }
.card-tag { background: #f2f6fb !important; color: #47566e !important; border: 1px solid rgba(15,23,42,.10) !important; }
.card-badge { background: rgba(37,99,235,.10) !important; color: #2563eb !important; border-color: rgba(37,99,235,.35) !important; }

/* --- Kategori sayfaları: başlık & filtre --- */
.cat-heading h1 { background: none !important; -webkit-text-fill-color: #0f172a !important; color: #0f172a !important; }
.cat-heading p { color: #2563eb !important; }
.tech-guide-header { background: #f5f8fd !important; border-color: rgba(37,99,235,.20) !important; box-shadow: 0 14px 30px rgba(15,23,42,.08) !important; }
.filter-btn { background: #ffffff !important; border: 1px solid rgba(15,23,42,.14) !important; color: #47566e !important; }
.filter-btn:hover { border-color: #2563eb !important; color: #2563eb !important; background: rgba(37,99,235,.06) !important; }
.filter-btn.active { background: #2563eb !important; border-color: #2563eb !important; color: #ffffff !important; }

/* --- Ürün detay: grit satırları / pil değerleri --- */
.grit-row { background: #f5f8fd !important; border: 1px solid rgba(37,99,235,.14) !important; box-shadow: 0 4px 12px rgba(15,23,42,.05) !important; }
.grit-row:hover { background: #ffffff !important; border-color: rgba(37,99,235,.38) !important; box-shadow: 0 10px 24px rgba(37,99,235,.14) !important; }
.grit-label { color: #0f172a !important; background: transparent !important; }
.grit-val-pill { background: #ffffff !important; border: 1px solid rgba(15,23,42,.14) !important; color: #47566e !important; }
.grit-val-pill.active, .grit-val-pill:hover { background: rgba(37,99,235,.10) !important; border-color: #2563eb !important; color: #2563eb !important; }
.grit-pill { background: #ffffff !important; border: 1px solid rgba(15,23,42,.14) !important; color: #0f172a !important; }

/* --- Bant sayfaları --- */
.spec-card, .type-item { background: #f5f8fd !important; border: 1px solid rgba(37,99,235,.14) !important; box-shadow: 0 6px 18px rgba(15,23,42,.06) !important; }
.type-label { color: #0f172a !important; }
.detail-card p, .detail-card li, .product-info p, .type-item p { color: #47566e !important; }
.spec-card:hover, .type-item:hover { background: #ffffff !important; border-color: rgba(37,99,235,.38) !important; }
.instructions-list li { background: #f5f8fd !important; border: 1px solid rgba(15,23,42,.10) !important; color: #334155 !important; }
.color-pill { border: 1px solid rgba(15,23,42,.16) !important; }

/* --- İletişim & form kartları --- */
.contact-form-card, .contact-info-card, .contact-item { background: #f5f8fd !important; border: 1px solid rgba(37,99,235,.14) !important; }
.contact-item:hover { background: #ffffff !important; border-color: rgba(37,99,235,.38) !important; }

/* --- Anasayfa CTA (fotoğraf üstü) — mavi tonlu koyu kalır, yazı beyaz --- */
.cta-overlay { background: linear-gradient(135deg, rgba(13,35,87,.90) 0%, rgba(29,78,216,.75) 100%) !important; }
.cta-stats-wrapper p, .cta-stats-wrapper span { color: #dbe6f5 !important; }

/* --- Aydınlatma metni vb. --- */
.glowing-card { background: #f5f8fd !important; border: 1px solid rgba(37,99,235,.16) !important; box-shadow: 0 10px 26px rgba(15,23,42,.08) !important; }

/* ============================================================
   MOBİL HEADER — KESİN KURALLAR
   Sayfaların kendi eski mobil CSS'leri ne derse desin geçerli.
   ============================================================ */
@media (max-width: 768px) {
  header { position: sticky !important; top: 0 !important; height: 76px !important; display: flex !important; align-items: center !important; z-index: 10000 !important; }
  header .header-container { display: flex !important; flex-direction: row !important; justify-content: flex-end !important; align-items: center !important; position: relative !important; width: 100% !important; }
  /* logo ortada, dokunulmaz */
  header .logo { position: absolute !important; left: 50% !important; top: 50% !important; transform: translate(-50%, -50%) !important; margin: 0 !important; z-index: 1 !important; pointer-events: auto; }
  header .logo img { height: 72px !important; }
  /* dil seçici EN SOLDA, büyük ve her zaman görünür */
  header .lang-switcher { display: flex !important; position: absolute !important; left: 14px !important; top: 50% !important; transform: translateY(-50%) !important; margin: 0 !important; z-index: 3 !important; }
  header .lang-btn { padding: 10px 14px !important; font-size: 13px !important; border-radius: 10px !important; gap: 8px !important; }
  /* DİL LİSTESİ MOBİL SABİT: body seviyesinde, her şeyin üstünde */
  .lang-dropdown { position: fixed !important; top: 82px !important; left: 12px !important; right: auto !important;
    bottom: auto !important; z-index: 10010 !important; background: #ffffff !important; min-width: 190px !important;
    box-shadow: 0 20px 50px rgba(15,23,42,.30) !important; }
  .lang-option { padding: 12px 16px !important; font-size: 14px !important; }
  /* hamburger en sağda, logodan bağımsız */
  header .menu-toggle { display: inline-flex !important; position: relative !important; left: auto !important; right: auto !important; top: auto !important; transform: none !important; margin: 0 !important; width: 50px !important; height: 50px !important; font-size: 20px !important; z-index: 3 !important; order: 2; align-items: center !important; justify-content: center !important; }
  /* nav masaüstü düzeninden çık */
  header nav { position: static !important; }
  /* MENÜ PANELİ — header'ın ALTINDA açılır; hamburger görünür kalır ve X'e dönüşür */
  .nav-menu { position: fixed !important; top: 84px !important; right: 10px !important; left: 10px !important; bottom: auto !important; width: auto !important; height: auto !important; max-height: calc(100vh - 96px) !important; background: #ffffff !important; border: 1px solid rgba(15,23,42,.10) !important; border-radius: 20px !important; box-shadow: 0 24px 60px rgba(15,23,42,.30) !important; display: flex !important; flex-direction: column !important; align-items: stretch !important; gap: 10px !important; padding: 16px !important; margin: 0 !important; overflow-y: auto !important; z-index: 10002 !important; opacity: 0 !important; visibility: hidden !important; pointer-events: none !important; transform: translateY(-8px) scale(.98) !important; transition: all .28s ease !important; }
  .nav-menu.active { opacity: 1 !important; visibility: visible !important; pointer-events: auto !important; transform: translateY(0) scale(1) !important; }
  .nav-menu::before { display: none !important; content: none !important; }
  #navMenu { padding-top: 78px !important; }
  /* panel kapalıyken içerideki geçişler kapalı — açılışta seğirme olmaz */
  .nav-menu:not(.active) .nav-link, .nav-menu:not(.active) .dropdown-menu,
  .nav-menu:not(.active) .dropdown-item { transition: none !important; }
  .nav-menu .nav-link { -webkit-tap-highlight-color: transparent !important; }
  .nav-menu .dropdown:not(.active) .dropdown-menu { max-height: 0 !important; }
  /* panel üstü: header ile aynı mavi bant */
  #navMenu { padding-top: 92px !important; overflow: hidden !important; overflow-y: auto !important; }
  #navMenu::before { content: '' !important; display: block !important; position: absolute !important;
    top: 0 !important; left: 0 !important; right: 0 !important; height: 76px !important;
    background: linear-gradient(180deg, #1e3a8a 0%, #14357c 100%) !important;
    border-radius: 20px 20px 0 0 !important; border-bottom: 1px solid rgba(255,255,255,.10) !important; }
  /* mavi bant üstünde BEYAZ logo (header'daki gibi) */
  #nordemMenuLogo { position: absolute; top: 12px; left: 50%; transform: translateX(-50%);
    height: 52px; width: auto; filter: brightness(0) invert(1) !important; z-index: 6; pointer-events: none; }
  /* X butonu mavi bant üstünde beyaz */
  #nordemMenuClose { top: 17px !important; right: 14px !important; background: rgba(255,255,255,.14) !important;
    border: 1px solid rgba(255,255,255,.30) !important; color: #ffffff !important; z-index: 6 !important; }
  #nordemMenuClose { position: absolute; top: 12px; right: 12px; width: 42px; height: 42px;
    border-radius: 50%; border: 1px solid rgba(15,23,42,.14); background: #f2f6fb; color: #0f172a;
    font-size: 20px; font-weight: 700; display: flex; align-items: center; justify-content: center;
    cursor: pointer; z-index: 5; transition: all .25s; }
  #nordemMenuClose:active { background: #2563eb; color: #fff; }
  /* menü öğeleri her durumda görünür */
  .nav-menu .nav-item, .nav-menu.active .nav-item { opacity: 1 !important; transform: none !important; width: 100% !important; display: block !important; }
  .nav-menu .nav-link { display: flex !important; align-items: center !important; justify-content: space-between !important; width: 100% !important; padding: 15px 18px !important; font-size: 14.5px !important; font-weight: 700 !important; border-radius: 16px !important; background: #f2f6fb !important; border: 1px solid rgba(15,23,42,.08) !important; color: #0f172a !important; opacity: 1 !important; transform: none !important; }
  .nav-menu .nav-item.active .nav-link { background: rgba(37,99,235,.10) !important; color: #2563eb !important; border-color: rgba(37,99,235,.40) !important; }
  /* katalog alt menüsü */
  .nav-menu .dropdown-menu { position: static !important; opacity: 1 !important; visibility: visible !important; display: block !important; max-height: 0 !important; overflow: hidden !important; background: transparent !important; border: none !important; box-shadow: none !important; padding: 0 !important; margin-top: 8px !important; transform: none !important; transition: max-height .35s ease !important; }
  .nav-menu .dropdown.active .dropdown-menu { max-height: 420px !important; }
  .nav-menu .dropdown-item { display: flex !important; padding: 13px 16px !important; font-size: 13.5px !important; border-radius: 14px !important; background: #f8fafc !important; border: 1px solid rgba(15,23,42,.06) !important; color: #334155 !important; margin-top: 6px; }
  /* menü açıkken arka plan blur */
  .mobile-overlay { display: block !important; position: fixed !important; inset: 0 !important;
    background: rgba(13,35,87,.20) !important; backdrop-filter: blur(6px) !important; -webkit-backdrop-filter: blur(6px) !important;
    z-index: 9000 !important; opacity: 0 !important; visibility: hidden !important; pointer-events: none !important; transition: all .3s ease !important; }
  .mobile-overlay.active { opacity: 1 !important; visibility: visible !important; pointer-events: auto !important; }
}

/* ============================================================
   COOKIE BANDI
   ============================================================ */
#nordemCookie { position: fixed; left: 16px; right: 16px; bottom: 16px; z-index: 100000;
  background: #ffffff; border: 1px solid rgba(15,23,42,.12); border-radius: 18px;
  box-shadow: 0 20px 50px rgba(15,23,42,.25); padding: 18px 22px;
  display: flex; align-items: center; gap: 18px; flex-wrap: wrap;
  font-family: 'Plus Jakarta Sans', sans-serif; animation: cookie-in .5s ease; }
@keyframes cookie-in { from { transform: translateY(30px); opacity: 0; } to { transform: none; opacity: 1; } }
#nordemCookie p { flex: 1; min-width: 220px; margin: 0; color: #334155; font-size: 13px; line-height: 1.55; }
#nordemCookie a { color: #2563eb; font-weight: 700; text-decoration: underline !important; }
#nordemCookie .nc-btns { display: flex; gap: 10px; }
#nordemCookie button { font-family: inherit; font-weight: 800; font-size: 13px; padding: 11px 22px;
  border-radius: 10px; cursor: pointer; transition: all .25s; letter-spacing: .3px; }
#nordemCookie .nc-accept { background: #2563eb; color: #fff; border: none; box-shadow: 0 6px 16px rgba(37,99,235,.30); }
#nordemCookie .nc-accept:hover { background: #1d4ed8; transform: translateY(-1px); }
#nordemCookie .nc-reject { background: #ffffff; color: #47566e; border: 1px solid rgba(15,23,42,.18); }
#nordemCookie .nc-reject:hover { border-color: #94a3b8; color: #0f172a; }
@media (max-width: 768px) {
  #nordemCookie { left: 10px; right: 10px; bottom: 10px; padding: 14px 16px; }
  #nordemCookie .nc-btns { width: 100%; }
  #nordemCookie button { flex: 1; }
}

/* ============================================================
   v2.2 — Kategori sayfaları (aşındırıcı ürünler, bant grupları vb.)
   ============================================================ */

/* Eski şablonun koyu metal gradyanı → açık */
:root { --metal-grad: linear-gradient(160deg, #ffffff 0%, #eef4fd 100%); }

/* Hamburger menü masaüstünde asla görünmesin */
@media (min-width: 769px) {
  .menu-toggle { display: none !important; }
}

/* Kategori başlık bölümü: koyu radial → açık mavi geçiş */
.cat-heading {
  background: linear-gradient(180deg, #e8f0fc 0%, #ffffff 100%) !important;
}
.cat-heading h1 { text-shadow: none !important; }

/* Kategori ürün kartları (item-card) */
.item-card {
  background: #ffffff !important;
  border: 1px solid rgba(37,99,235,.16) !important;
  box-shadow: 0 6px 18px rgba(15,23,42,.06) !important;
}
.item-card:hover {
  border-color: rgba(37,99,235,.45) !important;
  box-shadow: 0 18px 40px rgba(37,99,235,.16) !important;
}
.item-img {
  background: #ffffff !important;
  border-bottom: 1px solid rgba(15,23,42,.08) !important;
}
.item-img img { filter: drop-shadow(0 10px 18px rgba(15,23,42,.18)) !important; }
.item-content p { color: #5b6b84 !important; }
.item-btn {
  background: #ffffff !important;
  color: #2563eb !important;
  border: 1px solid rgba(37,99,235,.35) !important;
}
.item-card:hover .item-btn, .item-btn:hover {
  background: #2563eb !important;
  color: #ffffff !important;
  border-color: #2563eb !important;
}

/* ============================================================
   v2.3 — Liste sayfaları (flap diskler, fiber diskler, bantlar vb.)
   ============================================================ */

/* Liste sayfası hero: koyu gradyan → açık mavi geçiş, başlık net */
.listing-hero {
  background: linear-gradient(180deg, #e8f0fc 0%, #ffffff 100%) !important;
}
.listing-hero h1 {
  background: none !important;
  -webkit-background-clip: initial !important;
  -webkit-text-fill-color: #0f172a !important;
  color: #0f172a !important;
}
.listing-hero p { color: #5b6b84 !important; }

/* Hakkımızda & İletişim hero başlıkları (beyaz gradyan yazı → koyu) */
.about-hero h1, .contact-hero h1 {
  background: none !important;
  -webkit-background-clip: initial !important;
  -webkit-text-fill-color: #0f172a !important;
  color: #0f172a !important;
}

/* Ürün görselleri beyaz zeminli fotoğraflar — kutu da beyaz olsun, kaynaşsın */
.product-image {
  background: #ffffff !important;
  border-bottom: 1px solid rgba(15,23,42,.08) !important;
}
.product-image img { filter: none !important; mix-blend-mode: multiply; }


/* ============================================================
   YATAY KAYMA KİLİDİ — parmakla sağ/sol sürüklemede site oynamaz
   ============================================================ */
html, body { overflow-x: hidden !important; max-width: 100vw !important; }
body { position: relative; }
/* menü açıkken arka plan kaydırılamaz (JS body'ye .nordem-lock ekler) */
body.nordem-lock { overflow: hidden !important; height: 100vh !important; touch-action: none; }


/* ============================================================
   GOOGLE TRANSLATE — üst çubuk ve balonlar gizli, sayfa kaymaz
   ============================================================ */
iframe.goog-te-banner-frame, .goog-te-banner-frame, #goog-gt-tt, .goog-te-balloon-frame,
.goog-tooltip, #google_translate_element { display: none !important; }
body { top: 0 !important; }
.goog-text-highlight { background: none !important; box-shadow: none !important; }
font { background: none !important; }


/* ============================================================
   IŞIK KUTUSU (ürün görseli büyütme) — mobil dahil her yerde
   ============================================================ */
#nordemLightbox { position: fixed; inset: 0; z-index: 3000000; background: rgba(10,18,38,.93);
  display: flex; align-items: center; justify-content: center; padding: 20px; animation: lb-in .25s ease; }
@keyframes lb-in { from { opacity: 0; } to { opacity: 1; } }
#nordemLightbox img { max-width: 94vw; max-height: 86vh; object-fit: contain; border-radius: 14px;
  background: #ffffff; padding: 12px; box-shadow: 0 30px 80px rgba(0,0,0,.6); }
#nordemLightboxClose { position: fixed; top: 16px; right: 16px; width: 48px; height: 48px; border-radius: 50%;
  background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.35); color: #ffffff;
  font-size: 22px; font-weight: 700; display: flex; align-items: center; justify-content: center;
  cursor: pointer; z-index: 3000001; transition: all .25s; }
#nordemLightboxClose:hover, #nordemLightboxClose:active { background: #2563eb; border-color: #2563eb; }
/* eski sayfa içi modallar devre dışı (çakışmasın) */
#imageModal { display: none !important; }


/* ============================================================
   FOOTER SOSYAL DÜZEN — CSS'i olmayan eski sayfalarda da yatay ve boyutlu
   ============================================================ */
.social-links { display: flex !important; flex-direction: row !important; gap: 12px !important; margin-top: 22px; flex-wrap: wrap; }
.social-btn { width: 40px !important; height: 40px !important; border-radius: 50% !important;
  display: inline-flex !important; align-items: center !important; justify-content: center !important;
  font-size: 16px !important; flex: 0 0 auto !important; transition: all .3s !important; }
.f-contact-item { display: flex; gap: 14px; margin-bottom: 18px; font-size: 14px; line-height: 1.6; }
.footer-grid { display: grid; grid-template-columns: 1.2fr 1fr .8fr 1.2fr; gap: 50px; }
@media (max-width: 1100px) { .footer-grid { grid-template-columns: 1fr 1fr; gap: 36px; } }
@media (max-width: 768px) { .footer-grid { grid-template-columns: 1fr; gap: 26px; } }

/* Anasayfa ürün grubu kartları tıklanabilir */
.s-card { position: relative !important; cursor: pointer !important; }
.s-full { position: absolute !important; inset: 0 !important; z-index: 40 !important; display: block !important; }
/* karartma ve içerik katmanları tıklamayı yutmasın */
.s-card-overlay, .s-card-overlay *, .s-card-img { pointer-events: none !important; }