/* ==========================================================================
   İstek Yazılım — tasarım sistemi
   Renkler logodaki mavi (#2A80B7) ve gri (#747273) üzerine kuruludur.
   ========================================================================== */

:root {
  --mavi-50:  #EEF6FC;
  --mavi-100: #D9EBF7;
  --mavi-200: #B3D6EE;
  --mavi-300: #7FB8E0;
  --mavi-400: #4A9BD0;
  --mavi-500: #2A80B7;
  --mavi-600: #1F6A9C;
  --mavi-700: #18557E;
  --mavi-800: #123F5E;
  --mavi-900: #0B2740;
  --camgobegi: #20B5D8;

  --murekkep: #0B1424;
  --metin:    #2A3342;
  --soluk:    #5D6778;
  --silik:    #8A93A3;
  --cizgi:    #E6EAF0;
  --cizgi-2:  #D9DFE7;
  --zemin:    #FFFFFF;
  --zemin-2:  #F6F8FB;
  --zemin-3:  #EEF2F7;
  --gece:     #07111F;
  --gece-2:   #0D1B2E;

  --basari: #12A06B;
  --uyari:  #E59A1A;

  --yazi: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --yazi-baslik: "Inter Tight", "Inter", ui-sans-serif, system-ui, sans-serif;

  --r-sm: 8px;
  --r-md: 12px;
  --r-lg: 18px;
  --r-xl: 26px;

  --golge-xs: 0 1px 2px rgba(11, 20, 36, .05);
  --golge-sm: 0 1px 2px rgba(11, 20, 36, .04), 0 4px 12px -2px rgba(11, 20, 36, .06);
  --golge-md: 0 2px 4px rgba(11, 20, 36, .04), 0 12px 32px -8px rgba(11, 20, 36, .12);
  --golge-lg: 0 4px 8px rgba(11, 20, 36, .04), 0 28px 64px -16px rgba(11, 20, 36, .22);
  --golge-mavi: 0 1px 0 rgba(255,255,255,.25) inset, 0 6px 18px -6px rgba(42, 128, 183, .65);

  --kap: 1440px;
  --nav-h: 72px;
  --gecis: cubic-bezier(.2, .7, .2, 1);
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: calc(var(--nav-h) + 16px); }
html, body { overflow-x: clip; }
.mobil { display: none; }
body {
  margin: 0;
  font-family: var(--yazi);
  font-size: 16px;
  line-height: 1.65;
  color: var(--metin);
  background: var(--zemin);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  font-feature-settings: "cv11", "ss01", "ss03";
  overflow-x: hidden;
}
img, svg, video { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; cursor: pointer; }
:focus-visible { outline: 2px solid var(--mavi-500); outline-offset: 3px; border-radius: 6px; }
::selection { background: var(--mavi-100); color: var(--mavi-900); }

.kap { width: 100%; max-width: var(--kap); margin: 0 auto; padding: 0 16px; }
.sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ---------- Tipografi ---------- */
h1, h2, h3, h4 { font-family: var(--yazi-baslik); color: var(--murekkep); margin: 0; letter-spacing: -.025em; line-height: 1.12; font-weight: 650; }
.b-dev   { font-size: clamp(2.5rem, 5.4vw, 4.5rem); letter-spacing: -.04em; line-height: 1.02; font-weight: 700; }
.b-buyuk { font-size: clamp(2rem, 3.6vw, 3rem); letter-spacing: -.035em; line-height: 1.08; }
.b-orta  { font-size: clamp(1.35rem, 2vw, 1.6rem); }
.on-yazi { font-size: clamp(1.05rem, 1.4vw, 1.25rem); color: var(--soluk); line-height: 1.6; }
.vurgu-metin {
  background: linear-gradient(100deg, var(--mavi-500) 10%, var(--camgobegi) 90%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
.ust-etiket {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 13px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase;
  color: var(--mavi-600);
}
.ust-etiket::before { content: ""; width: 18px; height: 2px; border-radius: 2px; background: currentColor; }
.bolum-bas { max-width: 720px; margin: 0 auto 56px; text-align: center; }
.bolum-bas .ust-etiket { margin-bottom: 16px; }
.bolum-bas .on-yazi { margin: 18px auto 0; max-width: 620px; }
.bolum-bas.sol { margin-left: 0; text-align: left; }

/* ---------- Butonlar ---------- */
.btn {
  --bh: 48px;
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  height: var(--bh); padding: 0 22px; border-radius: 999px; border: 1px solid transparent;
  font-size: 15px; font-weight: 600; letter-spacing: -.01em; white-space: nowrap;
  transition: transform .25s var(--gecis), box-shadow .25s var(--gecis), background-color .2s, border-color .2s, color .2s;
}
.btn i { font-size: 18px; transition: transform .25s var(--gecis); }
.btn:hover i.ti-arrow-right, .btn:hover i.ti-arrow-up-right { transform: translateX(3px); }
.btn-ana { background: var(--mavi-500); color: #fff; box-shadow: var(--golge-mavi); }
.btn-ana:hover { background: var(--mavi-600); transform: translateY(-1px); }
.btn-ikincil { background: #fff; color: var(--murekkep); border-color: var(--cizgi-2); box-shadow: var(--golge-xs); }
.btn-ikincil:hover { border-color: var(--mavi-300); color: var(--mavi-700); transform: translateY(-1px); }
.btn-hayalet { color: var(--metin); padding: 0 14px; }
.btn-hayalet:hover { color: var(--mavi-600); background: var(--mavi-50); }
.btn-beyaz { background: #fff; color: var(--mavi-800); box-shadow: 0 8px 24px -8px rgba(0,0,0,.35); }
.btn-beyaz:hover { transform: translateY(-1px); background: var(--mavi-50); }
.btn-cam { background: rgba(255,255,255,.08); color: #fff; border-color: rgba(255,255,255,.18); }
.btn-cam:hover { background: rgba(255,255,255,.14); }
.btn-kucuk { --bh: 40px; padding: 0 16px; font-size: 14px; }
.btn-buyuk { --bh: 56px; padding: 0 28px; font-size: 16px; }

.link-ok { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; font-size: 15px; color: var(--mavi-600); }
.link-ok i { transition: transform .25s var(--gecis); }
.link-ok:hover i { transform: translateX(4px); }

/* ---------- Üst duyuru şeridi ---------- */
.serit {
  background: var(--gece); color: #C7D3E3; font-size: 13.5px; position: relative; z-index: 60;
}
.serit .kap { display: flex; align-items: center; justify-content: center; gap: 10px; min-height: 40px; text-align: center; }
.serit b { color: #fff; font-weight: 600; }
.serit .rozet { background: linear-gradient(100deg, var(--mavi-500), var(--camgobegi)); color: #fff; font-size: 11px; font-weight: 700; letter-spacing: .04em; padding: 3px 8px; border-radius: 999px; }
.serit a { color: #fff; display: inline-flex; align-items: center; gap: 4px; font-weight: 600; }
.serit a:hover { color: var(--mavi-200); }

/* ---------- Navigasyon ---------- */
.nav {
  position: sticky; top: 0; z-index: 50;
  background: rgba(255,255,255,.82);
  backdrop-filter: saturate(180%) blur(16px); -webkit-backdrop-filter: saturate(180%) blur(16px);
  border-bottom: 1px solid transparent;
  transition: border-color .3s, box-shadow .3s, background-color .3s;
}
.nav.kaydi { border-bottom-color: var(--cizgi); box-shadow: 0 8px 24px -18px rgba(11,20,36,.25); background: rgba(255,255,255,.92); }
.nav .kap { display: flex; align-items: center; gap: 28px; height: var(--nav-h); }
.nav-logo img { height: 34px; width: auto; }
.nav-menu { display: flex; align-items: center; gap: 2px; list-style: none; margin: 0; padding: 0; flex: 1; }
.nav-menu > li { position: static; }
.nav-oge {
  display: inline-flex; align-items: center; gap: 4px; height: 40px; padding: 0 14px; border-radius: 999px;
  font-size: 15px; font-weight: 550; color: var(--metin); background: none; border: 0;
  transition: color .2s, background-color .2s;
}
.nav-oge i { font-size: 15px; color: var(--silik); transition: transform .3s var(--gecis); }
.nav-oge:hover, .nav-menu > li.acik > .nav-oge { color: var(--murekkep); background: var(--zemin-3); }
.nav-menu > li.acik > .nav-oge i { transform: rotate(180deg); }
.nav-sag { display: flex; align-items: center; gap: 8px; }
.nav-tel { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 600; color: var(--metin); padding: 0 10px; }
.nav-tel i { font-size: 18px; color: var(--mavi-500); }
.nav-tel:hover { color: var(--mavi-600); }

/* Mega menü */
.mega {
  position: absolute; left: 0; right: 0; top: 100%;
  padding-top: 10px;
  opacity: 0; visibility: hidden; transform: translateY(-6px);
  transition: opacity .22s var(--gecis), transform .22s var(--gecis), visibility .22s;
}
.nav-menu > li.acik > .mega { opacity: 1; visibility: visible; transform: none; }
.mega-ic {
  max-width: calc(var(--kap) - 32px); margin: 0 auto;
  background: #fff; border: 1px solid var(--cizgi); border-radius: var(--r-xl);
  box-shadow: var(--golge-lg); overflow: hidden;
  display: grid; grid-template-columns: 1fr 320px;
}
.mega-ic.tek { grid-template-columns: 1fr; max-width: 760px; }
.mega-izgara { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px 8px; padding: 22px; }
.mega-izgara.iki { grid-template-columns: repeat(2, 1fr); }
.mega-urun { padding: 14px; border-radius: var(--r-md); transition: background-color .2s; }
.mega-urun:hover { background: var(--zemin-2); }
.mega-urun-bas { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; }
.mega-urun-bas .ikon { width: 38px; height: 38px; border-radius: 10px; display: grid; place-items: center; font-size: 20px; color: var(--mavi-600); background: var(--mavi-50); border: 1px solid var(--mavi-100); flex: none; }
.mega-urun-bas b { display: block; font-size: 14.5px; font-weight: 650; color: var(--murekkep); line-height: 1.3; letter-spacing: -.01em; }
.mega-urun-bas small { display: block; font-size: 12.5px; color: var(--silik); line-height: 1.35; margin-top: 2px; }
.mega-urun:hover .mega-urun-bas b { color: var(--mavi-700); }
.mega-alt { list-style: none; margin: 0; padding: 0 0 0 50px; display: grid; gap: 1px; }
.mega-alt a { display: block; font-size: 13.5px; color: var(--soluk); padding: 3px 0; transition: color .15s, transform .2s var(--gecis); }
.mega-alt a:hover { color: var(--mavi-600); transform: translateX(2px); }
.mega-yan {
  background: linear-gradient(160deg, var(--mavi-50) 0%, #fff 70%);
  border-left: 1px solid var(--cizgi); padding: 28px; display: flex; flex-direction: column; gap: 14px;
}
.mega-yan h4 { font-size: 18px; letter-spacing: -.02em; }
.mega-yan p { margin: 0; font-size: 14px; color: var(--soluk); }
.mega-yan .mini-ekran { margin-top: auto; border-radius: 12px; overflow: hidden; border: 1px solid var(--cizgi); box-shadow: var(--golge-sm); }
.mega-liste { display: grid; grid-template-columns: repeat(2, 1fr); gap: 4px; padding: 18px; }
.mega-liste a { display: flex; gap: 12px; padding: 12px; border-radius: var(--r-md); transition: background-color .2s; }
.mega-liste a:hover { background: var(--zemin-2); }
.mega-liste .ikon { width: 36px; height: 36px; border-radius: 10px; display: grid; place-items: center; font-size: 19px; color: var(--mavi-600); background: var(--mavi-50); border: 1px solid var(--mavi-100); flex: none; }
.mega-liste b { display: flex; align-items: center; gap: 4px; font-size: 14.5px; font-weight: 600; color: var(--murekkep); }
.mega-liste b i { font-size: 13px; color: var(--silik); }
.mega-liste small { display: block; font-size: 12.5px; color: var(--silik); line-height: 1.4; margin-top: 2px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.mega-baslik { grid-column: 1 / -1; font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--silik); padding: 6px 12px 2px; }

.nav-ac { display: none; width: 44px; height: 44px; border-radius: 12px; border: 1px solid var(--cizgi); background: #fff; place-items: center; font-size: 22px; margin-left: auto; }

/* Mobil menü */
.mobil-menu { position: fixed; inset: 0; z-index: 70; visibility: hidden; transition: visibility 0s linear .44s; }
.mobil-menu .perde { position: absolute; inset: 0; background: rgba(7,17,31,.45); opacity: 0; transition: opacity .3s; }
.mobil-menu .cekmece {
  position: absolute; top: 0; right: 0; bottom: 0; width: min(420px, 100%); background: #fff;
  transform: translateX(100%); transition: transform .35s var(--gecis);
  display: flex; flex-direction: column;
}
.mobil-menu.acik { visibility: visible; transition: visibility 0s; }
.mobil-menu.acik .perde { opacity: 1; }
.mobil-menu.acik .cekmece { transform: none; }
.cekmece-bas { display: flex; align-items: center; justify-content: space-between; padding: 16px 20px; border-bottom: 1px solid var(--cizgi); }
.cekmece-bas img { height: 30px; width: auto; }
.cekmece-bas button { width: 40px; height: 40px; border-radius: 10px; border: 1px solid var(--cizgi); background: #fff; font-size: 20px; display: grid; place-items: center; }
.cekmece-govde { overflow-y: auto; padding: 8px 12px 24px; flex: 1; }
.cekmece-govde details { border-bottom: 1px solid var(--cizgi); }
.cekmece-govde summary { list-style: none; display: flex; align-items: center; justify-content: space-between; padding: 16px 8px; font-weight: 600; font-size: 16px; color: var(--murekkep); cursor: pointer; }
.cekmece-govde summary::-webkit-details-marker { display: none; }
.cekmece-govde summary i { transition: transform .3s; color: var(--silik); }
.cekmece-govde details[open] summary i { transform: rotate(180deg); }
.cekmece-govde .alt { padding: 0 8px 14px; display: grid; gap: 2px; }
.cekmece-govde .alt a { display: flex; align-items: center; gap: 10px; padding: 9px 10px; border-radius: 10px; font-size: 15px; color: var(--metin); }
.cekmece-govde .alt a:hover { background: var(--zemin-2); }
.cekmece-govde .alt a i { color: var(--mavi-500); font-size: 18px; }
.cekmece-govde > a { display: block; padding: 16px 8px; font-weight: 600; font-size: 16px; color: var(--murekkep); border-bottom: 1px solid var(--cizgi); }
.cekmece-alt { padding: 16px 20px 24px; border-top: 1px solid var(--cizgi); display: grid; gap: 10px; }
.cekmece-alt .btn { width: 100%; }

/* ---------- Bölümler ---------- */
.bolum { padding: 120px 0; position: relative; }
.bolum.sik { padding: 88px 0; }
.bolum.gri { background: var(--zemin-2); }
.bolum.cizgili { border-top: 1px solid var(--cizgi); }

/* ---------- Kahraman (hero) ---------- */
.hero { position: relative; padding: 72px 0 0; overflow: hidden; isolation: isolate; }
.hero::before {
  content: ""; position: absolute; inset: 0; z-index: -2;
  background:
    radial-gradient(60% 50% at 50% 0%, rgba(42,128,183,.16) 0%, rgba(42,128,183,0) 70%),
    radial-gradient(30% 30% at 85% 20%, rgba(32,181,216,.12) 0%, rgba(32,181,216,0) 70%),
    radial-gradient(30% 30% at 10% 30%, rgba(42,128,183,.08) 0%, rgba(42,128,183,0) 70%);
}
.hero::after {
  content: ""; position: absolute; inset: 0; z-index: -1;
  background-image: linear-gradient(to right, rgba(11,20,36,.055) 1px, transparent 1px), linear-gradient(to bottom, rgba(11,20,36,.055) 1px, transparent 1px);
  background-size: 56px 56px;
  -webkit-mask-image: radial-gradient(70% 60% at 50% 20%, #000 0%, transparent 75%);
  mask-image: radial-gradient(70% 60% at 50% 20%, #000 0%, transparent 75%);
}
.hero-icerik { text-align: center; max-width: 900px; margin: 0 auto; }
.hero-rozet {
  display: inline-flex; align-items: center; gap: 10px; padding: 6px 14px 6px 6px; margin-bottom: 28px;
  background: #fff; border: 1px solid var(--cizgi); border-radius: 999px; box-shadow: var(--golge-sm);
  font-size: 14px; color: var(--metin); font-weight: 500;
}
.hero-rozet .nokta { display: inline-flex; align-items: center; gap: 6px; background: var(--mavi-50); color: var(--mavi-700); font-weight: 650; font-size: 12.5px; padding: 3px 10px; border-radius: 999px; }
.hero-rozet .nokta::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--basari); box-shadow: 0 0 0 3px rgba(18,160,107,.18); }
.hero-rozet i { color: var(--silik); }
.hero h1 { margin-bottom: 24px; }
.hero .on-yazi { max-width: 680px; margin: 0 auto 36px; }
.hero-butonlar { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; margin-bottom: 28px; }
.hero-guven { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px 28px; font-size: 14px; color: var(--soluk); margin-bottom: 64px; }
.hero-guven span { display: inline-flex; align-items: center; gap: 8px; }
.hero-guven i { color: var(--basari); font-size: 18px; }

/* Ürün ekranı kompozisyonu */
.sahne { position: relative; max-width: 1120px; margin: 0 auto; perspective: 2000px; }
.sahne::before {
  content: ""; position: absolute; left: 8%; right: 8%; top: 18%; bottom: -10%; z-index: -1;
  background: radial-gradient(closest-side, rgba(42,128,183,.35), transparent); filter: blur(40px);
}
.uygulama {
  position: relative; background: #fff; border-radius: 18px 18px 0 0; overflow: hidden;
  border: 1px solid rgba(11,20,36,.08); border-bottom: 0;
  box-shadow: 0 0 0 6px rgba(255,255,255,.7), 0 0 0 7px rgba(11,20,36,.06), 0 40px 80px -24px rgba(11,40,70,.35);
  transform: rotateX(8deg) scale(.98); transform-origin: 50% 100%;
  transition: transform 1.2s var(--gecis);
}
.sahne.gorundu .uygulama { transform: none; }
.uyg-ust { display: flex; align-items: center; gap: 16px; height: 44px; padding: 0 16px; background: var(--zemin-2); border-bottom: 1px solid var(--cizgi); }
.uyg-ust .noktalar { display: flex; gap: 7px; }
.uyg-ust .noktalar span { width: 11px; height: 11px; border-radius: 50%; background: #E1E5EB; }
.uyg-ust .noktalar span:nth-child(1) { background: #FF6159; } .uyg-ust .noktalar span:nth-child(2) { background: #FFBD2E; } .uyg-ust .noktalar span:nth-child(3) { background: #28C941; }
.uyg-ust .adres { flex: 1; max-width: 360px; margin: 0 auto; height: 26px; border-radius: 8px; background: #fff; border: 1px solid var(--cizgi); font-size: 12px; color: var(--silik); display: flex; align-items: center; justify-content: center; gap: 6px; }
.uyg-govde { display: grid; grid-template-columns: 210px 1fr; min-height: 470px; text-align: left; }
.uyg-yan { background: var(--gece-2); color: #9FB0C6; padding: 16px 12px; font-size: 13px; }
.uyg-yan .marka { display: flex; align-items: center; gap: 8px; color: #fff; font-weight: 650; font-size: 14px; padding: 4px 8px 16px; }
.uyg-yan .marka span { width: 26px; height: 26px; border-radius: 7px; background: var(--mavi-500); display: grid; place-items: center; font-size: 13px; font-weight: 800; letter-spacing: -.03em; }
.uyg-yan .ara { height: 32px; border-radius: 8px; background: rgba(255,255,255,.06); display: flex; align-items: center; gap: 8px; padding: 0 10px; margin-bottom: 12px; color: #6F8199; font-size: 12px; }
.uyg-yan ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
.uyg-yan li { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 8px; }
.uyg-yan li i { font-size: 17px; }
.uyg-yan li.secili { background: rgba(42,128,183,.22); color: #fff; }
.uyg-yan li.secili i { color: #7FC4F0; }
.uyg-ana { padding: 22px 24px; background: #FBFCFE; }
.uyg-baslik { display: flex; align-items: center; justify-content: space-between; margin-bottom: 18px; }
.uyg-baslik b { font-size: 17px; color: var(--murekkep); letter-spacing: -.02em; font-weight: 650; }
.uyg-baslik small { display: block; font-size: 12px; color: var(--silik); font-weight: 500; }
.uyg-baslik .sekme { display: flex; gap: 4px; background: var(--zemin-3); padding: 3px; border-radius: 9px; font-size: 12px; }
.uyg-baslik .sekme span { padding: 4px 10px; border-radius: 7px; color: var(--soluk); }
.uyg-baslik .sekme span.secili { background: #fff; color: var(--murekkep); box-shadow: var(--golge-xs); font-weight: 600; }
.kpi-izgara { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 14px; }
.kpi { background: #fff; border: 1px solid var(--cizgi); border-radius: 12px; padding: 12px 14px; }
.kpi small { display: flex; align-items: center; gap: 6px; font-size: 11.5px; color: var(--silik); font-weight: 550; }
.kpi small i { font-size: 14px; color: var(--mavi-500); }
.kpi b { display: block; font-size: 21px; font-weight: 700; color: var(--murekkep); letter-spacing: -.03em; margin: 4px 0 2px; font-family: var(--yazi-baslik); }
.kpi em { font-style: normal; font-size: 11.5px; font-weight: 600; color: var(--basari); display: inline-flex; align-items: center; gap: 2px; }
.kpi em.dusus { color: var(--basari); }
.uyg-alt { display: grid; grid-template-columns: 1.55fr 1fr; gap: 12px; }
.panel { background: #fff; border: 1px solid var(--cizgi); border-radius: 12px; padding: 14px; }
.panel-bas { display: flex; justify-content: space-between; align-items: center; font-size: 12.5px; font-weight: 650; color: var(--murekkep); margin-bottom: 10px; }
.panel-bas span { font-weight: 500; color: var(--silik); font-size: 11.5px; }
.grafik { height: 150px; }
.grafik path.alan { fill: url(#grafikDolgu); }
.grafik path.cizgi { fill: none; stroke: var(--mavi-500); stroke-width: 2.2; stroke-linecap: round; stroke-dasharray: 900; stroke-dashoffset: 900; }
.sahne.gorundu .grafik path.cizgi { animation: ciz 2.2s .4s var(--gecis) forwards; }
@keyframes ciz { to { stroke-dashoffset: 0; } }
.tablo { width: 100%; border-collapse: collapse; font-size: 12px; }
.tablo th { text-align: left; font-weight: 550; color: var(--silik); font-size: 11px; padding: 0 0 6px; border-bottom: 1px solid var(--cizgi); }
.tablo td { padding: 7px 0; border-bottom: 1px solid var(--zemin-3); color: var(--metin); white-space: nowrap; }
.tablo tr:last-child td { border-bottom: 0; }
.durum { display: inline-flex; align-items: center; gap: 4px; padding: 2px 8px; border-radius: 999px; font-size: 10.5px; font-weight: 650; }
.durum::before { content: ""; width: 5px; height: 5px; border-radius: 50%; background: currentColor; }
.durum.yesil { background: #E7F7F0; color: #0E8A5C; }
.durum.mavi { background: var(--mavi-50); color: var(--mavi-700); }
.durum.turuncu { background: #FDF3E2; color: #B26F05; }

.yuzen {
  position: absolute; z-index: 3; background: rgba(255,255,255,.92); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
  border: 1px solid rgba(11,20,36,.08); border-radius: 16px; box-shadow: var(--golge-lg);
  padding: 14px 16px; display: flex; align-items: center; gap: 12px; text-align: left;
  animation: suzul 6s ease-in-out infinite;
}
.yuzen .ikon { width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; font-size: 21px; flex: none; }
.yuzen b { display: block; font-size: 14px; color: var(--murekkep); font-weight: 650; letter-spacing: -.01em; }
.yuzen small { display: block; font-size: 12.5px; color: var(--soluk); }
.yuzen.y1 { left: -48px; top: 150px; }
.yuzen.y1 .ikon { background: #E7F7F0; color: #0E8A5C; }
.yuzen.y2 { right: -40px; top: 82px; animation-delay: -2s; }
.yuzen.y2 .ikon { background: var(--mavi-50); color: var(--mavi-600); }
.yuzen.y3 { left: -48px; bottom: 64px; animation-delay: -4s; }
.yuzen.y3 .ikon { background: #FDF3E2; color: #B26F05; }
@keyframes suzul { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }

/* ---------- Referans logoları ---------- */
.referanslar { padding: 56px 0 64px; border-bottom: 1px solid var(--cizgi); background: #fff; position: relative; z-index: 2; }
.referanslar p { text-align: center; font-size: 14px; color: var(--soluk); margin: 0 0 28px; font-weight: 500; }
.referanslar p b { color: var(--murekkep); font-weight: 650; }
.kayan { overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent); mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent); }
.kayan-ic { display: flex; gap: 56px; width: max-content; animation: kay 60s linear infinite; align-items: center; }
.kayan:hover .kayan-ic { animation-play-state: paused; }
.kayan-ic img { height: 46px; width: auto; max-width: 150px; object-fit: contain; filter: grayscale(1) contrast(.9); opacity: .6; transition: filter .3s, opacity .3s; mix-blend-mode: multiply; }
.kayan-ic img:hover { filter: none; opacity: 1; }
@keyframes kay { to { transform: translateX(-50%); } }

/* ---------- Ürün bento ---------- */
.bento { display: grid; grid-template-columns: repeat(6, 1fr); gap: 20px; }
.kart {
  position: relative; background: #fff; border: 1px solid var(--cizgi); border-radius: var(--r-xl);
  box-shadow: var(--golge-xs); overflow: hidden; isolation: isolate;
  transition: transform .4s var(--gecis), box-shadow .4s var(--gecis), border-color .3s;
}
a.kart:hover, .kart.etkilesim:hover { transform: translateY(-4px); box-shadow: var(--golge-md); border-color: var(--cizgi-2); }
.kart-ic { padding: 32px; position: relative; z-index: 1; height: 100%; display: flex; flex-direction: column; }
.kart .ikon-kutu {
  width: 48px; height: 48px; border-radius: 14px; display: grid; place-items: center; font-size: 24px; margin-bottom: 22px;
  color: #fff; background: linear-gradient(140deg, var(--mavi-400), var(--mavi-600)); box-shadow: var(--golge-mavi);
}
.kart h3 { font-size: 22px; letter-spacing: -.025em; margin-bottom: 10px; }
.kart p { margin: 0; color: var(--soluk); font-size: 15.5px; }
.kart .etiketler { display: flex; flex-wrap: wrap; gap: 6px; margin: 20px 0 24px; }
.kart .etiketler span { display: inline-flex; align-items: center; gap: 5px; font-size: 12.5px; font-weight: 550; color: var(--metin); background: var(--zemin-2); border: 1px solid var(--cizgi); padding: 4px 10px; border-radius: 999px; }
.kart .etiketler span i { color: var(--mavi-500); font-size: 14px; }
.kart .link-ok { margin-top: auto; }
.b-genis { grid-column: span 4; }
.b-dar { grid-column: span 2; }
.b-yari { grid-column: span 3; }
.kart.amiral { background: linear-gradient(180deg, #fff 0%, var(--mavi-50) 100%); border-color: var(--mavi-100); }
.kart.amiral .kart-ic { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; align-items: center; }
.kart.amiral .kart-ic > div:first-child { display: flex; flex-direction: column; height: 100%; }
.amiral-rozet { position: absolute; top: 24px; right: 24px; z-index: 2; font-size: 12px; font-weight: 700; color: var(--mavi-700); background: #fff; border: 1px solid var(--mavi-100); padding: 4px 10px; border-radius: 999px; display: inline-flex; gap: 6px; align-items: center; }
.mini-panel { background: #fff; border: 1px solid var(--cizgi); border-radius: 16px; box-shadow: var(--golge-md); padding: 16px; font-size: 12px; }
.mini-panel .satir { display: flex; align-items: center; gap: 10px; padding: 9px 0; border-bottom: 1px solid var(--zemin-3); }
.mini-panel .satir:last-child { border-bottom: 0; }
.mini-panel .satir .renk { width: 28px; height: 28px; border-radius: 8px; flex: none; }
.mini-panel .satir b { display: block; font-size: 12.5px; color: var(--murekkep); font-weight: 600; }
.mini-panel .satir small { color: var(--silik); font-size: 11.5px; }
.mini-panel .satir .deger { margin-left: auto; text-align: right; font-weight: 650; color: var(--murekkep); }
.cubuk { height: 6px; border-radius: 6px; background: var(--zemin-3); overflow: hidden; margin-top: 4px; width: 90px; }
.cubuk span { display: block; height: 100%; border-radius: 6px; background: linear-gradient(90deg, var(--mavi-400), var(--camgobegi)); }
.kart .dekor { position: absolute; right: -40px; bottom: -40px; width: 200px; height: 200px; border-radius: 50%; background: radial-gradient(circle, var(--mavi-50), transparent 70%); z-index: 0; }

/* ---------- Süreç akışı ---------- */
.akis { display: grid; grid-template-columns: repeat(6, 1fr); gap: 0; position: relative; counter-reset: adim; }
.akis::before { content: ""; position: absolute; top: 31px; left: 8%; right: 8%; height: 2px; background: repeating-linear-gradient(90deg, var(--mavi-200) 0 8px, transparent 8px 14px); }
.akis-adim { text-align: center; padding: 0 10px; position: relative; }
.akis-adim .daire { width: 64px; height: 64px; margin: 0 auto 18px; border-radius: 20px; display: grid; place-items: center; font-size: 28px; color: var(--mavi-600); background: #fff; border: 1px solid var(--cizgi); box-shadow: var(--golge-sm); position: relative; transition: transform .4s var(--gecis), box-shadow .4s, color .3s, background-color .3s; }
.akis-adim:hover .daire { transform: translateY(-4px); box-shadow: var(--golge-md); background: var(--mavi-500); color: #fff; }
.akis-adim .daire::after { counter-increment: adim; content: counter(adim); position: absolute; top: -8px; right: -8px; width: 22px; height: 22px; border-radius: 50%; background: var(--murekkep); color: #fff; font-size: 11px; font-weight: 700; display: grid; place-items: center; border: 2px solid #fff; }
.akis-adim b { display: block; font-family: var(--yazi-baslik); font-size: 16px; color: var(--murekkep); letter-spacing: -.015em; margin-bottom: 4px; }
.akis-adim small { display: block; font-size: 13.5px; color: var(--soluk); line-height: 1.5; }

/* ---------- Gerçek ekran bölümü ---------- */
.ikili { display: grid; grid-template-columns: 1fr 1.15fr; gap: 72px; align-items: center; }
.ikili.ters { grid-template-columns: 1.15fr 1fr; }
.madde-liste { list-style: none; margin: 32px 0 36px; padding: 0; display: grid; gap: 18px; }
.madde-liste li { display: flex; gap: 14px; }
.madde-liste .ikon { width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; font-size: 20px; color: var(--mavi-600); background: var(--mavi-50); border: 1px solid var(--mavi-100); flex: none; }
.madde-liste b { display: block; color: var(--murekkep); font-weight: 650; font-size: 16px; letter-spacing: -.01em; }
.madde-liste span { font-size: 15px; color: var(--soluk); }
.cerceve { position: relative; border-radius: 18px; background: #fff; border: 1px solid var(--cizgi); box-shadow: var(--golge-lg); overflow: hidden; }
.cerceve .uyg-ust { height: 38px; }
.cerceve img { width: 100%; height: auto; }
.cerceve-arka { position: relative; }
.cerceve-arka::before { content: ""; position: absolute; inset: -24px -24px -24px 24px; border-radius: 28px; background: linear-gradient(140deg, var(--mavi-100), var(--mavi-50) 60%, transparent); z-index: -1; }
.platformlar { display: flex; gap: 8px; flex-wrap: wrap; }
.platformlar span { display: inline-flex; align-items: center; gap: 6px; font-size: 13.5px; font-weight: 600; color: var(--metin); padding: 7px 14px; border-radius: 999px; border: 1px solid var(--cizgi); background: #fff; }
.platformlar span i { color: var(--mavi-500); font-size: 17px; }

/* ---------- Rakamlar (koyu bant) ---------- */
.koyu { background: var(--gece); color: #C3CFDE; position: relative; overflow: hidden; isolation: isolate; }
.koyu::before { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(50% 80% at 15% 0%, rgba(42,128,183,.35), transparent 70%), radial-gradient(40% 70% at 90% 100%, rgba(32,181,216,.18), transparent 70%); }
.koyu::after { content: ""; position: absolute; inset: 0; z-index: -1; background-image: linear-gradient(to right, rgba(255,255,255,.05) 1px, transparent 1px), linear-gradient(to bottom, rgba(255,255,255,.05) 1px, transparent 1px); background-size: 56px 56px; -webkit-mask-image: linear-gradient(180deg, #000, transparent 85%); mask-image: linear-gradient(180deg, #000, transparent 85%); }
.koyu h2, .koyu h3 { color: #fff; }
.koyu .ust-etiket { color: var(--mavi-300); }
.koyu .on-yazi { color: #9DB0C7; }
.rakamlar { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; border: 1px solid rgba(255,255,255,.1); border-radius: var(--r-xl); background: rgba(255,255,255,.025); overflow: hidden; }
.rakam { padding: 36px 32px; border-right: 1px solid rgba(255,255,255,.08); }
.rakam:last-child { border-right: 0; }
.rakam b { display: block; font-family: var(--yazi-baslik); font-size: clamp(2.5rem, 4vw, 3.5rem); font-weight: 700; letter-spacing: -.04em; line-height: 1; color: #fff; margin-bottom: 12px; }
.rakam b sup { font-size: .5em; color: var(--mavi-300); vertical-align: top; margin-left: 2px; position: relative; top: .25em; }
.rakam > span { display: block; font-weight: 600; color: #E3EAF3; font-size: 16px; }
.rakam small { display: block; font-size: 14px; color: #8195AE; margin-top: 4px; }

/* ---------- e-Dönüşüm ---------- */
.edonusum { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.e-kart { padding: 26px; border-radius: var(--r-lg); background: #fff; border: 1px solid var(--cizgi); transition: transform .35s var(--gecis), box-shadow .35s, border-color .3s; position: relative; overflow: hidden; }
.e-kart:hover { transform: translateY(-3px); box-shadow: var(--golge-md); border-color: var(--mavi-200); }
.e-kart .ikon { width: 44px; height: 44px; border-radius: 12px; display: grid; place-items: center; font-size: 22px; color: var(--mavi-600); background: var(--mavi-50); margin-bottom: 18px; }
.e-kart b { display: block; font-family: var(--yazi-baslik); font-size: 18px; color: var(--murekkep); letter-spacing: -.02em; margin-bottom: 6px; }
.e-kart p { margin: 0; font-size: 14.5px; color: var(--soluk); line-height: 1.55; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.e-kart .ok { position: absolute; top: 24px; right: 24px; color: var(--silik); font-size: 20px; transition: transform .3s var(--gecis), color .3s; }
.e-kart:hover .ok { transform: translate(3px, -3px); color: var(--mavi-500); }
.entegrasyon-serit { margin-top: 20px; display: flex; flex-wrap: wrap; gap: 10px; align-items: center; justify-content: center; padding: 18px; border-radius: var(--r-lg); border: 1px dashed var(--cizgi-2); background: var(--zemin-2); font-size: 14px; color: var(--soluk); }
.entegrasyon-serit span.e { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: 999px; background: #fff; border: 1px solid var(--cizgi); color: var(--metin); font-weight: 550; font-size: 13.5px; }
.entegrasyon-serit span.e i { color: var(--mavi-500); }
.gib-rozet { display: inline-flex; align-items: center; gap: 10px; padding: 10px 16px; border-radius: 14px; background: #E7F7F0; color: #0B7A51; font-weight: 650; font-size: 14px; }
.gib-rozet i { font-size: 22px; }

/* ---------- Hizmetler ---------- */
.hizmetler { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--cizgi); border: 1px solid var(--cizgi); border-radius: var(--r-xl); overflow: hidden; }
.hizmet { background: #fff; padding: 36px 32px; transition: background-color .3s; display: flex; flex-direction: column; }
.hizmet:hover { background: var(--zemin-2); }
.hizmet .ikon { font-size: 28px; color: var(--mavi-500); margin-bottom: 20px; width: 52px; height: 52px; border-radius: 14px; display: grid; place-items: center; border: 1px solid var(--cizgi); background: #fff; box-shadow: var(--golge-xs); transition: transform .4s var(--gecis); }
.hizmet:hover .ikon { transform: scale(1.06) rotate(-4deg); }
.hizmet b { display: block; font-family: var(--yazi-baslik); font-size: 19px; color: var(--murekkep); letter-spacing: -.02em; margin-bottom: 8px; }
.hizmet p { margin: 0 0 18px; color: var(--soluk); font-size: 15px; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.hizmet .link-ok { margin-top: auto; font-size: 14px; }

/* ---------- Blog ---------- */
.blog-izgara { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.yazi-kart { display: flex; flex-direction: column; border-radius: var(--r-xl); background: #fff; border: 1px solid var(--cizgi); overflow: hidden; transition: transform .4s var(--gecis), box-shadow .4s; }
.yazi-kart:hover { transform: translateY(-4px); box-shadow: var(--golge-md); }
.yazi-gorsel { aspect-ratio: 16 / 10; background: var(--zemin-3); overflow: hidden; position: relative; }
.yazi-gorsel img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s var(--gecis); }
.yazi-kart:hover .yazi-gorsel img { transform: scale(1.04); }
.yazi-gorsel.bos { display: grid; place-items: center; background: linear-gradient(140deg, var(--mavi-500), var(--mavi-800)); color: rgba(255,255,255,.9); font-size: 44px; }
.yazi-gorsel.bos::after { content: ""; position: absolute; inset: 0; background-image: linear-gradient(to right, rgba(255,255,255,.08) 1px, transparent 1px), linear-gradient(to bottom, rgba(255,255,255,.08) 1px, transparent 1px); background-size: 28px 28px; }
.yazi-govde { padding: 24px 26px 28px; display: flex; flex-direction: column; flex: 1; }
.yazi-meta { display: flex; align-items: center; gap: 10px; font-size: 13px; color: var(--silik); margin-bottom: 12px; }
.yazi-meta .kat { color: var(--mavi-700); background: var(--mavi-50); padding: 3px 10px; border-radius: 999px; font-weight: 650; font-size: 12px; }
.yazi-kart h3 { font-size: 19px; letter-spacing: -.02em; line-height: 1.3; margin-bottom: 10px; }
.yazi-kart p { margin: 0 0 20px; color: var(--soluk); font-size: 15px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.yazi-kart .link-ok { margin-top: auto; font-size: 14px; }
.bolum-ust-sira { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 48px; }
.bolum-ust-sira .bolum-bas { margin: 0; }

/* ---------- Kapanış CTA ---------- */
.cta { border-radius: 32px; padding: 72px; position: relative; overflow: hidden; isolation: isolate; background: var(--gece-2); color: #C3CFDE; display: grid; grid-template-columns: 1.3fr 1fr; gap: 48px; align-items: center; }
.cta::before { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(60% 90% at 100% 0%, rgba(42,128,183,.55), transparent 65%), radial-gradient(40% 60% at 0% 100%, rgba(32,181,216,.25), transparent 70%); }
.cta::after { content: ""; position: absolute; inset: 0; z-index: -1; background-image: radial-gradient(rgba(255,255,255,.12) 1px, transparent 1px); background-size: 22px 22px; -webkit-mask-image: linear-gradient(90deg, transparent, #000); mask-image: linear-gradient(90deg, transparent, #000); }
.cta h2 { color: #fff; margin-bottom: 16px; }
.cta p { margin: 0 0 32px; font-size: 18px; color: #A9BBD1; max-width: 520px; }
.cta-butonlar { display: flex; flex-wrap: wrap; gap: 12px; }
.cta-iletisim { display: grid; gap: 12px; }
.cta-iletisim a { display: flex; align-items: center; gap: 16px; padding: 18px 20px; border-radius: 18px; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.1); transition: background-color .3s, transform .3s var(--gecis); }
.cta-iletisim a:hover { background: rgba(255,255,255,.1); transform: translateX(4px); }
.cta-iletisim .ikon { width: 46px; height: 46px; border-radius: 14px; display: grid; place-items: center; font-size: 22px; background: rgba(255,255,255,.1); color: #fff; flex: none; }
.cta-iletisim small { display: block; font-size: 13px; color: #8DA2BC; }
.cta-iletisim b { display: block; font-size: 16.5px; color: #fff; font-weight: 600; letter-spacing: -.01em; }
.cta-iletisim .ti-arrow-up-right { margin-left: auto; color: #8DA2BC; font-size: 20px; }

/* ---------- Footer ---------- */
.alt { background: #fff; border-top: 1px solid var(--cizgi); padding: 80px 0 0; margin-top: 120px; font-size: 14.5px; }
.alt-izgara { display: grid; grid-template-columns: 1.4fr repeat(4, 1fr); gap: 40px; padding-bottom: 56px; }
.alt-marka img { height: 36px; width: auto; margin-bottom: 20px; }
.alt-marka p { color: var(--soluk); margin: 0 0 24px; max-width: 300px; font-size: 15px; }
.alt-sosyal { display: flex; gap: 8px; }
.alt-sosyal a { width: 40px; height: 40px; border-radius: 12px; border: 1px solid var(--cizgi); display: grid; place-items: center; font-size: 19px; color: var(--soluk); transition: color .2s, border-color .2s, background-color .2s, transform .3s var(--gecis); }
.alt-sosyal a:hover { color: var(--mavi-600); border-color: var(--mavi-200); background: var(--mavi-50); transform: translateY(-2px); }
.alt h4 { font-family: var(--yazi); font-size: 13px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--murekkep); margin-bottom: 18px; }
.alt ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.alt ul a { color: var(--soluk); transition: color .2s; }
.alt ul a:hover { color: var(--mavi-600); }
.alt-iletisim li { display: flex; gap: 10px; color: var(--soluk); }
.alt-iletisim i { color: var(--mavi-500); font-size: 18px; margin-top: 2px; }
.alt-taban { border-top: 1px solid var(--cizgi); padding: 24px 0 32px; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 16px; color: var(--silik); font-size: 13.5px; }
.alt-taban nav { display: flex; flex-wrap: wrap; gap: 6px 22px; }
.alt-taban a:hover { color: var(--mavi-600); }

/* WhatsApp butonu */
.wp { position: fixed; right: 24px; bottom: 24px; z-index: 40; width: 58px; height: 58px; border-radius: 50%; background: #25D366; color: #fff; display: grid; place-items: center; font-size: 30px; box-shadow: 0 12px 32px -8px rgba(37,211,102,.6); transition: transform .3s var(--gecis); }
.wp:hover { transform: scale(1.08); }
.wp::after { content: ""; position: absolute; inset: 0; border-radius: 50%; border: 2px solid #25D366; animation: nabiz 2.4s ease-out infinite; }
@keyframes nabiz { 0% { transform: scale(1); opacity: .7; } 100% { transform: scale(1.6); opacity: 0; } }

/* ---------- Görünme animasyonu ---------- */
.gor { opacity: 0; transform: translateY(24px); transition: opacity .9s var(--gecis), transform .9s var(--gecis); }
.gor.gorundu { opacity: 1; transform: none; }
/* Kahraman bölümü sayfa açılır açılmaz görünür (gözlemciye bağlı değil) */
.hero .gor { transition: none; animation: belir .8s var(--gecis) both; }
.hero .gor.g1 { animation-delay: .06s; } .hero .gor.g2 { animation-delay: .12s; } .hero .gor.g3 { animation-delay: .18s; } .hero .gor.g4 { animation-delay: .24s; }
@keyframes belir { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }
.gor.g1 { transition-delay: .08s; } .gor.g2 { transition-delay: .16s; } .gor.g3 { transition-delay: .24s; } .gor.g4 { transition-delay: .32s; } .gor.g5 { transition-delay: .4s; }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
  .gor { opacity: 1; transform: none; }
  .uygulama { transform: none; }
}

/* ---------- Duyarlı tasarım ---------- */
@media (max-width: 1180px) {
  .nav-tel { display: none; }
  .yuzen.y1 { left: -16px; } .yuzen.y2 { right: -16px; }
}
@media (max-width: 1024px) {
  .nav-menu, .nav-sag .btn-hayalet, .nav-sag .gizle-mobil { display: none; }
  .nav-ac { display: grid; }
  .nav .kap { gap: 12px; }
  .bolum { padding: 88px 0; }
  .bento { grid-template-columns: repeat(2, 1fr); }
  .b-genis, .b-dar, .b-yari { grid-column: span 1; }
  .kart.amiral { grid-column: 1 / -1; }
  .akis { grid-template-columns: repeat(3, 1fr); row-gap: 40px; }
  .akis::before { display: none; }
  .ikili, .ikili.ters { grid-template-columns: 1fr; gap: 48px; }
  .rakamlar { grid-template-columns: repeat(2, 1fr); }
  .rakam:nth-child(2) { border-right: 0; }
  .rakam:nth-child(-n+2) { border-bottom: 1px solid rgba(255,255,255,.08); }
  .edonusum { grid-template-columns: repeat(2, 1fr); }
  .hizmetler { grid-template-columns: repeat(2, 1fr); }
  .blog-izgara { grid-template-columns: repeat(2, 1fr); }
  .cta { grid-template-columns: 1fr; padding: 56px 40px; }
  .alt-izgara { grid-template-columns: repeat(3, 1fr); }
  .alt-marka { grid-column: 1 / -1; }
  .uyg-govde { grid-template-columns: 1fr; }
  .uyg-yan { display: none; }
  .yuzen.y1 { display: none; }
}
@media (max-width: 720px) {
  .masaustu { display: none; }
  .mobil { display: inline; }
  .kap { padding: 0 16px; }
  .serit .kap { font-size: 12.5px; }
  .serit .rozet { display: none; }
  .hero { padding-top: 48px; }
  .hero-guven { margin-bottom: 44px; }
  .hero-butonlar { flex-direction: column; align-items: stretch; }
  .hero-butonlar .btn { width: 100%; }
  .b-dev { font-size: 2.15rem; letter-spacing: -.035em; line-height: 1.08; }
  .b-buyuk { font-size: 1.85rem; }
  .hero-rozet { font-size: 13px; }
  .bolum { padding: 72px 0; }
  .bolum-bas { margin-bottom: 40px; }
  .bolum-ust-sira { flex-direction: column; align-items: flex-start; }
  .bento, .edonusum, .hizmetler, .blog-izgara { grid-template-columns: 1fr; }
  .kart.amiral .kart-ic { grid-template-columns: 1fr; }
  .kart-ic { padding: 26px; }
  .amiral-rozet { position: static; margin: 24px 0 -8px 26px; align-self: flex-start; }
  .akis { grid-template-columns: repeat(2, 1fr); }
  .kpi-izgara { grid-template-columns: repeat(2, 1fr); }
  .uyg-alt { grid-template-columns: 1fr; }
  .uyg-alt .panel:last-child { display: none; }
  .uyg-ana { padding: 16px; }
  .uyg-baslik .sekme { display: none; }
  .uyg-ust .adres { display: none; }
  .yuzen { display: none !important; }
  .rakamlar { grid-template-columns: 1fr 1fr; }
  .rakam { padding: 24px 20px; }
  .cta { padding: 40px 24px; border-radius: 24px; }
  .alt { margin-top: 72px; padding-top: 56px; }
  .alt-izgara { grid-template-columns: 1fr 1fr; gap: 32px; }
  .alt-taban { flex-direction: column; }
  .kayan-ic { gap: 36px; }
  .kayan-ic img { height: 38px; }
  .wp { right: 16px; bottom: 16px; width: 52px; height: 52px; font-size: 27px; }
}

/* ==========================================================================
   Kurumsal katman (v2): fotoğraflı slider, renkli ürün kutuları, sekmeli
   vitrin, renk bantları, talep formu ve koyu footer
   ========================================================================== */
:root {
  --lacivert: #0A2540;
  --lacivert-2: #0F3157;
  --derin: #061A30;
  --u-kumas: #2A80B7;
  --u-konfeksiyon: #6D5BF0;
  --u-muhasebe: #0F9F6E;
  --u-kartela: #EE7A2C;
  --u-barkod: #0AA5BA;
}

/* Üst bilgi çubuğu */
.ust-cubuk { background: var(--derin); color: #9DB2CB; font-size: 13px; position: relative; z-index: 60; }
.ust-cubuk .kap { display: flex; align-items: center; justify-content: space-between; min-height: 40px; gap: 16px; }
.ust-cubuk a { display: inline-flex; align-items: center; gap: 6px; transition: color .2s; }
.ust-cubuk a:hover { color: #fff; }
.ust-cubuk i { font-size: 15px; color: var(--mavi-300); }
.ust-cubuk .sol, .ust-cubuk .sag { display: flex; align-items: center; gap: 22px; }
.ust-cubuk .ayrac { width: 1px; height: 14px; background: rgba(255,255,255,.14); }
.ust-cubuk .duyuru-link { color: #fff; font-weight: 600; }
.ust-cubuk .duyuru-link span { background: var(--u-kartela); color: #fff; font-size: 10.5px; font-weight: 800; padding: 2px 7px; border-radius: 4px; letter-spacing: .04em; }

/* Slider */
.slider { position: relative; height: min(760px, 88vh); min-height: 600px; background: var(--derin); overflow: hidden; color: #fff; isolation: isolate; }
.slayt { position: absolute; inset: 0; opacity: 0; visibility: hidden; transition: opacity 1.1s ease, visibility 1.1s; }
.slayt.aktif { opacity: 1; visibility: visible; z-index: 1; }
.slayt-foto { position: absolute; inset: 0; background-size: cover; background-position: center; transform: scale(1.12); }
.slayt.aktif .slayt-foto { animation: kenburns 9s ease-out forwards; }
@keyframes kenburns { from { transform: scale(1.12); } to { transform: scale(1); } }
.slayt::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(6,26,48,.96) 0%, rgba(6,26,48,.86) 38%, rgba(10,37,64,.35) 72%, rgba(10,37,64,.15) 100%), linear-gradient(0deg, rgba(6,26,48,.7) 0%, transparent 35%); }
.slayt-ic { position: relative; z-index: 2; height: 100%; display: flex; align-items: center; padding-bottom: 90px; }
.slayt-metin { max-width: 640px; }
.slayt-metin > * { opacity: 0; transform: translateY(28px); }
.slayt.aktif .slayt-metin > * { animation: yukari .9s var(--gecis) forwards; }
.slayt.aktif .slayt-metin > *:nth-child(2) { animation-delay: .12s; }
.slayt.aktif .slayt-metin > *:nth-child(3) { animation-delay: .24s; }
.slayt.aktif .slayt-metin > *:nth-child(4) { animation-delay: .36s; }
.slayt.aktif .slayt-metin > *:nth-child(5) { animation-delay: .48s; }
@keyframes yukari { to { opacity: 1; transform: none; } }
.slayt-etiket { display: inline-flex; align-items: center; gap: 10px; font-size: 13px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: #8FD3F2; margin-bottom: 22px; }
.slayt-etiket i { width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; font-size: 18px; color: #fff; background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.2); backdrop-filter: blur(6px); }
.slayt h1, .slayt h2 { color: #fff; font-size: clamp(2.4rem, 4.6vw, 4rem); line-height: 1.06; letter-spacing: -.035em; font-weight: 700; margin-bottom: 22px; }
.slayt h1 em, .slayt h2 em { font-style: normal; background: linear-gradient(100deg, #6FC3F0, #3BD3E8); -webkit-background-clip: text; background-clip: text; color: transparent; }
.slayt p { font-size: clamp(1.05rem, 1.3vw, 1.2rem); color: #C2D2E4; margin: 0 0 34px; max-width: 560px; line-height: 1.6; }
.slayt-butonlar { display: flex; gap: 12px; flex-wrap: wrap; }
.slayt-ozellik { display: flex; gap: 26px; margin-top: 40px; flex-wrap: wrap; }
.slayt-ozellik span { display: inline-flex; align-items: center; gap: 8px; font-size: 14.5px; color: #D6E2EF; font-weight: 500; }
.slayt-ozellik i { color: #3BD3E8; font-size: 19px; }
.slider-kontrol { position: absolute; z-index: 5; left: 0; right: 0; bottom: 118px; }
.slider-kontrol .kap { display: flex; align-items: center; gap: 18px; }
.slider-nokta { display: flex; gap: 10px; }
.slider-nokta button { width: 120px; height: 46px; background: none; border: 0; padding: 0; text-align: left; color: rgba(255,255,255,.55); font-size: 12.5px; font-weight: 600; position: relative; transition: color .3s; }
.slider-nokta button::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 3px; border-radius: 3px; background: rgba(255,255,255,.18); }
.slider-nokta button::after { content: ""; position: absolute; left: 0; top: 0; height: 3px; width: 0; border-radius: 3px; background: #fff; }
.slider-nokta button.aktif { color: #fff; }
.slider-nokta button.aktif::after { animation: ilerle var(--sure, 7s) linear forwards; }
.slider.durdu .slider-nokta button.aktif::after { animation-play-state: paused; }
.slider-nokta button span { display: block; padding-top: 12px; }
@keyframes ilerle { to { width: 100%; } }
.slider-ok { margin-left: auto; display: flex; gap: 8px; }
.slider-ok button { width: 46px; height: 46px; border-radius: 50%; border: 1px solid rgba(255,255,255,.25); background: rgba(255,255,255,.06); color: #fff; font-size: 20px; display: grid; place-items: center; transition: background-color .2s, border-color .2s; backdrop-filter: blur(6px); }
.slider-ok button:hover { background: rgba(255,255,255,.16); border-color: rgba(255,255,255,.5); }

/* Slider'a binen ürün kutuları */
.urun-serit { position: relative; z-index: 6; margin-top: -84px; }
.urun-serit-ic { display: grid; grid-template-columns: repeat(5, 1fr); background: #fff; border-radius: 22px; box-shadow: 0 30px 70px -25px rgba(6,26,48,.45), 0 0 0 1px rgba(10,37,64,.06); overflow: hidden; }
.urun-kutu { --u: var(--mavi-500); position: relative; padding: 26px 24px 24px; border-right: 1px solid var(--cizgi); transition: background-color .3s; display: flex; flex-direction: column; gap: 14px; overflow: hidden; }
.urun-kutu:last-child { border-right: 0; }
.urun-kutu::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 4px; background: var(--u); transform: scaleX(0); transform-origin: left; transition: transform .45s var(--gecis); }
.urun-kutu:hover { background: color-mix(in srgb, var(--u) 5%, #fff); }
.urun-kutu:hover::before { transform: scaleX(1); }
.urun-kutu .ikon { width: 50px; height: 50px; border-radius: 14px; display: grid; place-items: center; font-size: 25px; color: #fff; background: var(--u); box-shadow: 0 10px 22px -10px var(--u); transition: transform .4s var(--gecis); }
.urun-kutu:hover .ikon { transform: translateY(-3px) rotate(-5deg); }
.urun-kutu b { font-family: var(--yazi-baslik); font-size: 16.5px; line-height: 1.25; color: var(--murekkep); letter-spacing: -.015em; }
.urun-kutu small { font-size: 13.5px; color: var(--soluk); line-height: 1.5; }
.urun-kutu .ok { margin-top: auto; display: inline-flex; align-items: center; gap: 6px; font-size: 13.5px; font-weight: 650; color: var(--u); }
.urun-kutu .ok i { transition: transform .3s var(--gecis); }
.urun-kutu:hover .ok i { transform: translateX(4px); }

/* Fotoğraflı çözüm kartları */
.cozum-izgara { display: grid; grid-template-columns: 1.25fr 1fr 1fr; grid-template-rows: 300px 300px; gap: 20px; }
.foto-kart { position: relative; border-radius: 24px; overflow: hidden; color: #fff; isolation: isolate; display: flex; flex-direction: column; justify-content: flex-end; padding: 30px; min-height: 260px; }
.foto-kart.buyuk { grid-row: span 2; padding: 40px; }
.foto-kart .foto { position: absolute; inset: 0; z-index: -2; background-size: cover; background-position: center; transition: transform 1.2s var(--gecis); }
.foto-kart:hover .foto { transform: scale(1.07); }
.foto-kart::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(6,26,48,.05) 0%, rgba(6,26,48,.55) 45%, rgba(6,26,48,.94) 100%); transition: background .4s; }
.foto-kart .rozet { position: absolute; top: 22px; left: 22px; display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; padding: 6px 12px; border-radius: 999px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.25); backdrop-filter: blur(8px); }
.foto-kart h3 { color: #fff; font-size: 22px; margin-bottom: 8px; letter-spacing: -.02em; }
.foto-kart.buyuk h3 { font-size: 30px; }
.foto-kart p { margin: 0; color: #C8D6E6; font-size: 15px; max-width: 460px; }
.foto-kart .gizli { max-height: 0; opacity: 0; overflow: hidden; transition: max-height .5s var(--gecis), opacity .4s, margin .4s; }
.foto-kart:hover .gizli { max-height: 160px; opacity: 1; margin-top: 16px; }
.foto-kart .etiket-sira { display: flex; flex-wrap: wrap; gap: 6px; }
.foto-kart .etiket-sira span { font-size: 12.5px; padding: 4px 10px; border-radius: 999px; background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.18); }
.foto-kart .kart-ok { position: absolute; top: 22px; right: 22px; width: 42px; height: 42px; border-radius: 50%; display: grid; place-items: center; background: #fff; color: var(--lacivert); font-size: 19px; transform: scale(.8) rotate(-45deg); opacity: 0; transition: transform .4s var(--gecis), opacity .3s; }
.foto-kart:hover .kart-ok { transform: none; opacity: 1; }
.foto-kart.renkli { background: linear-gradient(150deg, var(--u, var(--mavi-600)) 0%, var(--lacivert) 100%); }
.foto-kart.renkli::after { background: radial-gradient(80% 60% at 100% 0%, rgba(255,255,255,.18), transparent 60%); }
.foto-kart.renkli .buyuk-ikon { position: absolute; right: 26px; top: 26px; font-size: 64px; color: rgba(255,255,255,.22); transition: transform .6s var(--gecis); }
.foto-kart.renkli:hover .buyuk-ikon { transform: scale(1.1) rotate(-6deg); }

/* Sekmeli ürün vitrini */
.vitrin { display: grid; grid-template-columns: 340px 1fr; gap: 28px; align-items: stretch; }
.vitrin-sekmeler { display: flex; flex-direction: column; gap: 8px; }
.vitrin-sekme { --u: var(--mavi-500); display: flex; align-items: center; gap: 14px; padding: 16px 18px; border-radius: 16px; border: 1px solid var(--cizgi); background: #fff; text-align: left; transition: border-color .3s, box-shadow .3s, background-color .3s, transform .3s var(--gecis); position: relative; overflow: hidden; }
.vitrin-sekme .ikon { width: 42px; height: 42px; border-radius: 12px; display: grid; place-items: center; font-size: 21px; color: var(--u); background: color-mix(in srgb, var(--u) 12%, #fff); flex: none; transition: background-color .3s, color .3s; }
.vitrin-sekme b { display: block; font-size: 15px; font-weight: 650; color: var(--murekkep); line-height: 1.3; }
.vitrin-sekme small { display: block; font-size: 12.5px; color: var(--silik); margin-top: 2px; }
.vitrin-sekme:hover { border-color: color-mix(in srgb, var(--u) 40%, #fff); transform: translateX(3px); }
.vitrin-sekme.aktif { border-color: var(--u); box-shadow: 0 14px 30px -18px var(--u); background: color-mix(in srgb, var(--u) 4%, #fff); }
.vitrin-sekme.aktif .ikon { background: var(--u); color: #fff; }
.vitrin-sekme .ilerleme { position: absolute; left: 0; bottom: 0; height: 3px; width: 0; background: var(--u); }
.vitrin-sekme.aktif .ilerleme { animation: ilerle 8s linear forwards; }
.vitrin.durdu .vitrin-sekme.aktif .ilerleme { animation-play-state: paused; }
.vitrin-panel-alan { position: relative; border-radius: 26px; background: linear-gradient(160deg, var(--zemin-2), #fff); border: 1px solid var(--cizgi); overflow: hidden; min-height: 520px; }
.vitrin-panel { --u: var(--mavi-500); position: absolute; inset: 0; padding: 40px; display: grid; grid-template-columns: 1fr 1.1fr; gap: 36px; align-items: center; opacity: 0; visibility: hidden; transform: translateY(14px); transition: opacity .5s var(--gecis), transform .5s var(--gecis), visibility .5s; }
.vitrin-panel.aktif { opacity: 1; visibility: visible; transform: none; position: relative; }
.vitrin-panel::before { content: ""; position: absolute; right: -120px; top: -120px; width: 420px; height: 420px; border-radius: 50%; background: radial-gradient(closest-side, color-mix(in srgb, var(--u) 22%, transparent), transparent); z-index: 0; }
.vitrin-panel > * { position: relative; z-index: 1; }
.vitrin-panel .ust-etiket { color: var(--u); }
.vitrin-panel h3 { font-size: 28px; letter-spacing: -.03em; margin: 14px 0 12px; }
.vitrin-panel p { margin: 0 0 22px; color: var(--soluk); }
.ozellik-listesi { list-style: none; margin: 0 0 28px; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 10px 16px; }
.ozellik-listesi li a { display: flex; align-items: center; gap: 8px; font-size: 14.5px; color: var(--metin); font-weight: 500; transition: color .2s; }
.ozellik-listesi li a:hover { color: var(--u); }
.ozellik-listesi li i { color: var(--u); font-size: 18px; }
.vitrin-gorsel { position: relative; }
.vitrin-gorsel .cerceve { box-shadow: 0 30px 60px -24px rgba(6,26,48,.4); }
.vitrin-gorsel .cerceve img { aspect-ratio: 16 / 10; object-fit: cover; }
.vitrin-gorsel .yuzen { animation: none; position: absolute; }
.vitrin-gorsel .yuzen.a { left: -26px; bottom: 26px; }
.vitrin-gorsel .yuzen .ikon { background: color-mix(in srgb, var(--u) 14%, #fff); color: var(--u); }
.btn-renk { background: var(--u); color: #fff; box-shadow: 0 10px 24px -10px var(--u); }
.btn-renk:hover { filter: brightness(1.08); transform: translateY(-1px); }

/* Mavi rakam bandı */
.mavi-bant { background: linear-gradient(115deg, #1C6CA3 0%, var(--mavi-500) 40%, #1FA7D0 100%); color: #fff; position: relative; overflow: hidden; isolation: isolate; padding: 84px 0; }
.mavi-bant::before { content: ""; position: absolute; inset: 0; z-index: -1; background-image: radial-gradient(rgba(255,255,255,.14) 1.2px, transparent 1.2px); background-size: 24px 24px; -webkit-mask-image: linear-gradient(90deg, #000, transparent 70%); mask-image: linear-gradient(90deg, #000, transparent 70%); }
.mavi-bant::after { content: ""; position: absolute; right: -10%; top: -60%; width: 60%; height: 220%; z-index: -1; background: radial-gradient(closest-side, rgba(255,255,255,.18), transparent); }
.mavi-bant .kap { display: grid; grid-template-columns: 1fr 2fr; gap: 56px; align-items: center; }
.mavi-bant h2 { color: #fff; font-size: clamp(1.8rem, 2.6vw, 2.4rem); letter-spacing: -.03em; }
.mavi-bant p { margin: 14px 0 0; color: #D8ECF8; }
.bant-rakamlar { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; }
.bant-rakamlar div { padding: 6px 26px; border-left: 1px solid rgba(255,255,255,.25); }
.bant-rakamlar b { display: block; font-family: var(--yazi-baslik); font-size: clamp(2.4rem, 3.6vw, 3.4rem); font-weight: 700; letter-spacing: -.04em; line-height: 1; }
.bant-rakamlar b sup { font-size: .5em; vertical-align: top; position: relative; top: .2em; color: #BDE6FA; }
.bant-rakamlar div > span { display: block; margin-top: 10px; font-size: 14.5px; color: #E2F2FB; font-weight: 500; }

/* Koyu fotoğraflı e-Dönüşüm bandı */
.koyu-foto { position: relative; color: #C3D1E2; overflow: hidden; isolation: isolate; background: var(--derin); }
.koyu-foto .arka { position: absolute; inset: 0; z-index: -2; background-size: cover; background-position: center right; opacity: .55; }
.koyu-foto::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(6,26,48,.98) 0%, rgba(6,26,48,.85) 45%, rgba(6,26,48,.55) 100%); }
.koyu-foto h2 { color: #fff; }
.koyu-foto .ust-etiket { color: #7FD0F2; }
.koyu-foto .on-yazi { color: #A9BCD2; }
.cam-izgara { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-top: 48px; }
.cam-kart { padding: 26px; border-radius: 20px; background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.12); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); transition: background-color .3s, transform .35s var(--gecis), border-color .3s; position: relative; }
.cam-kart:hover { background: rgba(255,255,255,.1); transform: translateY(-4px); border-color: rgba(127,208,242,.5); }
.cam-kart .ikon { width: 48px; height: 48px; border-radius: 14px; display: grid; place-items: center; font-size: 24px; color: #fff; background: linear-gradient(140deg, #3BB3E8, var(--mavi-600)); margin-bottom: 18px; box-shadow: 0 10px 24px -10px #3BB3E8; }
.cam-kart b { display: block; color: #fff; font-family: var(--yazi-baslik); font-size: 19px; margin-bottom: 8px; letter-spacing: -.02em; }
.cam-kart p { margin: 0; font-size: 14.5px; color: #A9BCD2; line-height: 1.55; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.cam-kart .ok { position: absolute; top: 24px; right: 24px; color: #7FD0F2; font-size: 20px; transition: transform .3s var(--gecis); }
.cam-kart:hover .ok { transform: translate(3px, -3px); }
.cam-serit { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 22px; }
.cam-serit span { display: inline-flex; align-items: center; gap: 7px; padding: 8px 14px; border-radius: 999px; font-size: 13.5px; font-weight: 550; color: #DCE7F3; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.12); }
.cam-serit span i { color: #7FD0F2; font-size: 16px; }

/* Neden biz */
.neden { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: center; }
.neden-foto { position: relative; border-radius: 28px; overflow: hidden; aspect-ratio: 5 / 4.4; box-shadow: var(--golge-lg); }
.neden-foto img { width: 100%; height: 100%; object-fit: cover; }
.neden-foto .rozet-kart { position: absolute; left: 24px; bottom: 24px; right: 24px; display: flex; align-items: center; gap: 16px; padding: 18px 20px; border-radius: 18px; background: rgba(255,255,255,.94); backdrop-filter: blur(10px); box-shadow: var(--golge-md); }
.neden-foto .rozet-kart b { display: block; font-family: var(--yazi-baslik); font-size: 30px; color: var(--mavi-600); letter-spacing: -.03em; line-height: 1; }
.neden-foto .rozet-kart span { font-size: 14px; color: var(--soluk); }
.neden-foto .rozet-kart .avatarlar { display: flex; margin-left: auto; }
.neden-foto .rozet-kart .avatarlar i { width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; font-size: 18px; color: #fff; border: 2px solid #fff; margin-left: -10px; }
.neden-maddeler { display: grid; grid-template-columns: 1fr 1fr; gap: 26px 28px; margin-top: 36px; }
.neden-madde .ikon { width: 52px; height: 52px; border-radius: 16px; display: grid; place-items: center; font-size: 25px; color: #fff; margin-bottom: 16px; }
.neden-madde b { display: block; font-family: var(--yazi-baslik); font-size: 18px; color: var(--murekkep); letter-spacing: -.02em; margin-bottom: 6px; }
.neden-madde p { margin: 0; color: var(--soluk); font-size: 15px; }

/* Referans ızgarası */
.ref-izgara { display: grid; grid-template-columns: repeat(6, 1fr); border-top: 1px solid var(--cizgi); border-left: 1px solid var(--cizgi); border-radius: 20px; overflow: hidden; background: #fff; }
.ref-izgara a, .ref-izgara div { aspect-ratio: 16 / 9; display: grid; place-items: center; padding: 18px; border-right: 1px solid var(--cizgi); border-bottom: 1px solid var(--cizgi); transition: background-color .3s; }
.ref-izgara img { max-height: 56px; max-width: 100%; width: auto; object-fit: contain; filter: grayscale(1); opacity: .65; transition: filter .35s, opacity .35s, transform .35s var(--gecis); mix-blend-mode: multiply; }
.ref-izgara div:hover { background: var(--zemin-2); }
.ref-izgara div:hover img { filter: none; opacity: 1; transform: scale(1.06); }

/* Talep formu bölümü */
.talep { position: relative; border-radius: 32px; overflow: hidden; isolation: isolate; background: linear-gradient(130deg, var(--lacivert) 0%, #123E6B 55%, #1A5E92 100%); color: #C3D3E5; display: grid; grid-template-columns: 1fr 1.05fr; }
.talep::before { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(50% 70% at 0% 100%, rgba(59,211,232,.25), transparent 70%), radial-gradient(40% 60% at 100% 0%, rgba(255,255,255,.12), transparent 70%); }
.talep-sol { padding: 64px; display: flex; flex-direction: column; }
.talep-sol h2 { color: #fff; font-size: clamp(2rem, 3vw, 2.7rem); letter-spacing: -.035em; margin: 16px 0 16px; }
.talep-sol p { margin: 0 0 32px; color: #AFC4DB; font-size: 17px; }
.talep-sol .ust-etiket { color: #7FD0F2; }
.talep-adimlar { list-style: none; margin: 0 0 36px; padding: 0; display: grid; gap: 16px; }
.talep-adimlar li { display: flex; gap: 14px; align-items: flex-start; }
.talep-adimlar li span.n { width: 32px; height: 32px; border-radius: 10px; display: grid; place-items: center; background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.18); color: #fff; font-weight: 700; font-size: 14px; flex: none; }
.talep-adimlar b { display: block; color: #fff; font-weight: 600; }
.talep-adimlar small { color: #9DB3CB; font-size: 14px; }
.talep-iletisim { margin-top: auto; display: flex; flex-wrap: wrap; gap: 12px; }
.talep-iletisim a { display: inline-flex; align-items: center; gap: 10px; padding: 12px 16px; border-radius: 14px; background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.14); color: #fff; font-weight: 600; font-size: 15px; transition: background-color .2s; }
.talep-iletisim a:hover { background: rgba(255,255,255,.14); }
.talep-iletisim i { font-size: 19px; color: #7FD0F2; }
.talep-form { margin: 14px; padding: 40px; border-radius: 24px; background: #fff; color: var(--metin); box-shadow: 0 30px 60px -30px rgba(0,0,0,.5); }
.talep-form h3 { font-size: 22px; margin-bottom: 6px; }
.talep-form > p { margin: 0 0 24px; color: var(--soluk); font-size: 14.5px; }
.form-izgara { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.form-izgara .tam { grid-column: 1 / -1; }
.alan label { display: block; font-size: 13px; font-weight: 600; color: var(--murekkep); margin-bottom: 6px; }
.alan input, .alan select, .alan textarea { width: 100%; height: 48px; padding: 0 14px; border-radius: 12px; border: 1px solid var(--cizgi-2); background: var(--zemin-2); font: inherit; font-size: 15px; color: var(--murekkep); transition: border-color .2s, box-shadow .2s, background-color .2s; }
.alan textarea { height: 96px; padding: 12px 14px; resize: vertical; }
.alan input:focus, .alan select:focus, .alan textarea:focus { outline: 0; border-color: var(--mavi-400); background: #fff; box-shadow: 0 0 0 4px rgba(42,128,183,.14); }
.onay { display: flex; gap: 10px; align-items: flex-start; font-size: 13px; color: var(--soluk); margin: 4px 0 18px; }
.onay input { width: 18px; height: 18px; margin-top: 1px; accent-color: var(--mavi-500); flex: none; }
.onay a { color: var(--mavi-600); text-decoration: underline; text-underline-offset: 2px; }
.talep-form .btn { width: 100%; }
.form-mesaj { display: flex; gap: 10px; align-items: flex-start; padding: 14px 16px; border-radius: 12px; font-size: 14.5px; margin-bottom: 18px; }
.form-mesaj.ok { background: #E7F7F0; color: #0B6E49; }
.form-mesaj.hata { background: #FDECEC; color: #A42323; }
.form-mesaj i { font-size: 20px; flex: none; }
.tuzak { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* Koyu footer */
.alt.koyu-alt { background: var(--derin); color: #93A8C1; border-top: 0; margin-top: 0; position: relative; }
.alt.koyu-alt::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 4px; background: linear-gradient(90deg, var(--u-kumas), var(--u-konfeksiyon), var(--u-muhasebe), var(--u-kartela), var(--u-barkod)); }

.koyu-alt .alt-marka p { color: #93A8C1; }
.koyu-alt h4 { color: #fff; }
.koyu-alt ul a { color: #93A8C1; }
.koyu-alt ul a:hover { color: #fff; }
.koyu-alt .alt-iletisim li { color: #93A8C1; }
.koyu-alt .alt-iletisim i { color: #6FC3F0; }
.koyu-alt .alt-sosyal a { border-color: rgba(255,255,255,.14); color: #C3D1E2; }
.koyu-alt .alt-sosyal a:hover { background: rgba(255,255,255,.08); color: #fff; border-color: rgba(255,255,255,.3); }
.koyu-alt .alt-taban { border-top-color: rgba(255,255,255,.1); color: #6F86A1; }
.koyu-alt .alt-taban a:hover { color: #fff; }
.alt-ust-bant { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; padding-bottom: 56px; margin-bottom: 56px; border-bottom: 1px solid rgba(255,255,255,.1); }
.alt-ust-bant a { display: flex; align-items: center; gap: 16px; padding: 20px 22px; border-radius: 18px; background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.09); transition: background-color .3s, border-color .3s; }
.alt-ust-bant a:hover { background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.2); }
.alt-ust-bant .ikon { width: 48px; height: 48px; border-radius: 14px; display: grid; place-items: center; font-size: 22px; color: #fff; background: linear-gradient(140deg, var(--mavi-400), var(--mavi-600)); flex: none; }
.alt-ust-bant small { display: block; font-size: 13px; color: #7F95AF; }
.alt-ust-bant b { display: block; color: #fff; font-size: 17px; font-weight: 600; letter-spacing: -.01em; }

/* v2 duyarlı */
@media (max-width: 1180px) {
  .urun-serit-ic { grid-template-columns: repeat(3, 1fr); }
  .urun-kutu:nth-child(3) { border-right: 0; }
  .urun-kutu:nth-child(-n+3) { border-bottom: 1px solid var(--cizgi); }
  .vitrin { grid-template-columns: 1fr; }
  .vitrin-sekmeler { flex-direction: row; overflow-x: auto; padding-bottom: 6px; scrollbar-width: none; }
  .vitrin-sekme { flex: none; }
  .ref-izgara { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1024px) {
  .ust-cubuk .sol { display: none; }
  .ust-cubuk .kap { justify-content: center; }
  .cozum-izgara { grid-template-columns: 1fr 1fr; grid-template-rows: auto; }
  .foto-kart.buyuk { grid-row: auto; grid-column: 1 / -1; min-height: 380px; }
  .vitrin-panel { grid-template-columns: 1fr; padding: 28px; }
  .mavi-bant .kap { grid-template-columns: 1fr; gap: 36px; }
  .cam-izgara { grid-template-columns: 1fr 1fr; }
  .neden { grid-template-columns: 1fr; gap: 44px; }
  .talep { grid-template-columns: 1fr; }
  .talep-sol { padding: 48px 40px 24px; }
  .alt-ust-bant { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
  .ust-cubuk .sag > :not(.duyuru-link) { display: none; }
  .slider { height: auto; min-height: 640px; }
  .slayt-ic { align-items: flex-start; padding: 64px 0 150px; }
  .slayt::after { background: linear-gradient(180deg, rgba(6,26,48,.82), rgba(6,26,48,.95)); }
  .slayt-ozellik { display: none; }
  .slayt-butonlar { flex-direction: column; }
  .slayt-butonlar .btn { width: 100%; }
  .slider-kontrol { bottom: 104px; }
  .slider-nokta button { width: 70px; }
  .slider-nokta button span { display: none; }
  .slider-ok { display: none; }
  .urun-serit { margin-top: -64px; }
  .urun-serit-ic { grid-template-columns: 1fr 1fr; }
  .urun-kutu { border-right: 1px solid var(--cizgi) !important; border-bottom: 1px solid var(--cizgi); padding: 20px 18px; }
  .urun-kutu:nth-child(2n) { border-right: 0 !important; }
  .urun-kutu small { display: none; }
  .cozum-izgara { grid-template-columns: 1fr; }
  .foto-kart { min-height: 280px; }
  .foto-kart .gizli { max-height: none; opacity: 1; margin-top: 14px; }
  .vitrin-panel { padding: 22px; }
  .vitrin-panel h3 { font-size: 23px; }
  .ozellik-listesi { grid-template-columns: 1fr; }
  .vitrin-gorsel .yuzen { display: none; }
  .vitrin-panel-alan { min-height: 0; }
  .bant-rakamlar { grid-template-columns: 1fr 1fr; row-gap: 28px; }
  .bant-rakamlar div { padding: 4px 18px; }
  .cam-izgara { grid-template-columns: 1fr; }
  .neden-maddeler { grid-template-columns: 1fr; }
  .ref-izgara { grid-template-columns: repeat(3, 1fr); }
  .talep { border-radius: 24px; }
  .talep-sol { padding: 36px 24px 12px; }
  .talep-form { margin: 10px; padding: 24px 20px; }
  .form-izgara { grid-template-columns: 1fr; }
}

/* ==========================================================================
   v3 cilası: şeffaf menü, slayt panelleri, ışık efekti, uygulama süreci
   ========================================================================== */

/* Şeffaf menü (ana sayfada slider üstünde) */
.seffaf-nav .slider { margin-top: calc(-1 * var(--nav-h)); }
.seffaf-nav .slayt-ic { padding-top: var(--nav-h); }
.seffaf-nav .nav:not(.kaydi):not(.menu-acik) { background: transparent; backdrop-filter: none; -webkit-backdrop-filter: none; border-bottom-color: rgba(255,255,255,.1); box-shadow: none; }
.seffaf-nav .nav:not(.kaydi):not(.menu-acik) .nav-oge,
.seffaf-nav .nav:not(.kaydi):not(.menu-acik) .nav-tel,
.seffaf-nav .nav:not(.kaydi):not(.menu-acik) .btn-hayalet { color: #fff; }
.seffaf-nav .nav:not(.kaydi):not(.menu-acik) .nav-oge i,
.seffaf-nav .nav:not(.kaydi):not(.menu-acik) .nav-tel i { color: rgba(255,255,255,.7); }
.seffaf-nav .nav:not(.kaydi):not(.menu-acik) .nav-oge:hover,
.seffaf-nav .nav:not(.kaydi):not(.menu-acik) .btn-hayalet:hover { background: rgba(255,255,255,.1); color: #fff; }
.nav-logo .logo-beyaz { display: none; }
.seffaf-nav .nav:not(.kaydi):not(.menu-acik) .nav-logo .logo-renkli { display: none; }
.seffaf-nav .nav:not(.kaydi):not(.menu-acik) .nav-logo .logo-beyaz { display: block; }
.seffaf-nav .nav:not(.kaydi):not(.menu-acik) .nav-ac { background: rgba(255,255,255,.1); border-color: rgba(255,255,255,.25); color: #fff; }
.seffaf-nav .nav:not(.kaydi):not(.menu-acik) .btn-ana { background: #fff; color: var(--mavi-700); box-shadow: 0 8px 22px -10px rgba(0,0,0,.5); }
.nav.menu-acik { background: #fff; }

/* Slayt içi cam panel */
.slayt-ic.ikili-slayt { display: grid; grid-template-columns: 1fr 440px; gap: 56px; align-items: center; }
.slayt-panel {
  position: relative; border-radius: 22px; padding: 22px; color: #fff;
  background: linear-gradient(160deg, rgba(255,255,255,.16), rgba(255,255,255,.06));
  border: 1px solid rgba(255,255,255,.22); backdrop-filter: blur(18px) saturate(140%); -webkit-backdrop-filter: blur(18px) saturate(140%);
  box-shadow: 0 30px 80px -30px rgba(0,0,0,.6), inset 0 1px 0 rgba(255,255,255,.25);
  opacity: 0; transform: translateY(30px) scale(.97);
}
.slayt.aktif .slayt-panel { animation: panelGel 1s .35s var(--gecis) forwards; }
@keyframes panelGel { to { opacity: 1; transform: none; } }
.slayt-panel .p-bas { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; }
.slayt-panel .p-bas b { font-size: 15px; font-weight: 650; letter-spacing: -.01em; display: flex; align-items: center; gap: 8px; }
.slayt-panel .p-bas b i { width: 30px; height: 30px; border-radius: 9px; display: grid; place-items: center; background: rgba(255,255,255,.14); font-size: 16px; }
.slayt-panel .canli { display: inline-flex; align-items: center; gap: 6px; font-size: 11.5px; font-weight: 700; color: #7CF0C2; background: rgba(18,160,107,.2); padding: 4px 10px; border-radius: 999px; }
.slayt-panel .canli::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: #39E3A1; animation: yanip 1.6s infinite; }
@keyframes yanip { 50% { opacity: .3; } }
.p-kpi { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-bottom: 16px; }
.p-kpi div { padding: 12px; border-radius: 14px; background: rgba(6,26,48,.35); border: 1px solid rgba(255,255,255,.1); }
.p-kpi small { display: block; font-size: 11px; color: #AFC6DD; margin-bottom: 4px; }
.p-kpi b { font-family: var(--yazi-baslik); font-size: 20px; font-weight: 700; letter-spacing: -.03em; }
.p-kpi em { display: block; font-style: normal; font-size: 11px; color: #7CF0C2; font-weight: 600; margin-top: 2px; }
.p-satirlar { display: grid; gap: 10px; }
.p-satir { display: grid; grid-template-columns: 1fr auto; gap: 6px 12px; align-items: center; font-size: 13px; padding: 10px 12px; border-radius: 12px; background: rgba(6,26,48,.28); border: 1px solid rgba(255,255,255,.08); }
.p-satir span { color: #E4EDF6; font-weight: 550; display: flex; align-items: center; gap: 8px; }
.p-satir span i { color: #8FD3F2; font-size: 16px; }
.p-satir strong { font-size: 12.5px; font-weight: 700; }
.p-cubuk { grid-column: 1 / -1; height: 6px; border-radius: 6px; background: rgba(255,255,255,.12); overflow: hidden; }
.p-cubuk i { display: block; height: 100%; width: 0; border-radius: 6px; background: linear-gradient(90deg, #4FB4EA, #3BD3E8); }
.slayt.aktif .p-cubuk i { animation: dolum 1.6s .8s var(--gecis) forwards; }
@keyframes dolum { to { width: var(--w); } }
.p-durum { font-size: 11px !important; padding: 3px 9px; border-radius: 999px; }
.p-durum.yesil { background: rgba(18,160,107,.25); color: #7CF0C2; }
.p-durum.mavi { background: rgba(79,180,234,.22); color: #A9DCF7; }
.p-durum.turuncu { background: rgba(238,122,44,.25); color: #FFC08F; }
.slayt-panel .rozet-alt { position: absolute; left: -36px; bottom: -26px; display: flex; align-items: center; gap: 12px; padding: 12px 16px; border-radius: 16px; background: #fff; color: var(--murekkep); box-shadow: 0 20px 50px -20px rgba(0,0,0,.55); opacity: 0; transform: translateY(16px); }
.slayt.aktif .slayt-panel .rozet-alt { animation: panelGel .9s 1.1s var(--gecis) forwards; }
.slayt-panel .rozet-alt i { width: 38px; height: 38px; border-radius: 11px; display: grid; place-items: center; font-size: 20px; color: #fff; background: var(--basari); }
.slayt-panel .rozet-alt b { display: block; font-size: 14px; font-weight: 650; }
.slayt-panel .rozet-alt small { font-size: 12px; color: var(--soluk); }

/* Kartlarda fareyi takip eden ışık */
.isik { position: relative; }
.isik::after { content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; opacity: 0; transition: opacity .3s; background: radial-gradient(360px circle at var(--mx, 50%) var(--my, 50%), rgba(255,255,255,.16), transparent 45%); z-index: 3; }
.isik.acik-zemin::after { background: radial-gradient(320px circle at var(--mx, 50%) var(--my, 50%), color-mix(in srgb, var(--u, var(--mavi-500)) 10%, transparent), transparent 50%); }
.isik:hover::after { opacity: 1; }

/* Logo şeridi (ürün kutularının altında) */
.guven-serit { padding: 56px 0 8px; }
.guven-serit p { text-align: center; margin: 0 0 26px; font-size: 13px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--silik); }

/* Uygulama süreci */
.surec { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; position: relative; }
.surec::before { content: ""; position: absolute; top: 44px; left: 12%; right: 12%; height: 2px; background: linear-gradient(90deg, var(--u-kumas), var(--u-konfeksiyon), var(--u-muhasebe), var(--u-kartela)); opacity: .35; }
.surec-adim { position: relative; background: #fff; border: 1px solid var(--cizgi); border-radius: 22px; padding: 28px 24px; transition: transform .4s var(--gecis), box-shadow .4s, border-color .3s; }
.surec-adim:hover { transform: translateY(-6px); box-shadow: var(--golge-md); border-color: color-mix(in srgb, var(--u) 35%, #fff); }
.surec-adim .no { position: relative; z-index: 1; width: 64px; height: 64px; border-radius: 20px; display: grid; place-items: center; font-family: var(--yazi-baslik); font-size: 22px; font-weight: 700; color: #fff; background: var(--u); box-shadow: 0 14px 30px -14px var(--u); margin-bottom: 22px; }
.surec-adim .no i { position: absolute; right: -8px; bottom: -8px; width: 28px; height: 28px; border-radius: 9px; display: grid; place-items: center; font-size: 15px; background: #fff; color: var(--u); box-shadow: var(--golge-sm); }
.surec-adim b { display: block; font-family: var(--yazi-baslik); font-size: 19px; color: var(--murekkep); letter-spacing: -.02em; margin-bottom: 8px; }
.surec-adim p { margin: 0; color: var(--soluk); font-size: 15px; }

/* Bölüm başlığı sayaçları */
.ust-etiket .sira { font-variant-numeric: tabular-nums; opacity: .55; margin-right: 2px; }

@media (max-width: 1180px) {
  .slayt-ic.ikili-slayt { grid-template-columns: 1fr 380px; gap: 32px; }
}
@media (max-width: 1024px) {
  .slayt-ic.ikili-slayt { grid-template-columns: 1fr; }
  .slayt-panel { display: none; }
  .surec { grid-template-columns: 1fr 1fr; }
  .surec::before { display: none; }
}
@media (max-width: 720px) {
  .surec { grid-template-columns: 1fr; }
  .guven-serit { padding-top: 40px; }
}

/* ==========================================================================
   v4 cilası
   ========================================================================== */
h1, h2, h3, .b-dev, .b-buyuk { text-wrap: balance; }
.on-yazi, .kart p, .foto-kart p, .hizmet p, .cam-kart p { text-wrap: pretty; }

/* Fotoğraflı kartlarda okunabilirlik */
.foto-kart::after { background: linear-gradient(180deg, rgba(6,26,48,.15) 0%, rgba(6,26,48,.35) 35%, rgba(6,26,48,.88) 72%, rgba(6,26,48,.97) 100%); }
.foto-kart h3, .foto-kart p { text-shadow: 0 2px 14px rgba(0,0,0,.45); }
.foto-kart:hover::after { background: linear-gradient(180deg, rgba(6,26,48,.25) 0%, rgba(6,26,48,.5) 35%, rgba(6,26,48,.92) 70%, rgba(6,26,48,.98) 100%); }
.foto-kart .renk-cizgi { position: absolute; left: 30px; bottom: 0; height: 4px; width: 56px; border-radius: 4px 4px 0 0; background: var(--u); transition: width .5s var(--gecis); }
.foto-kart.buyuk .renk-cizgi { left: 40px; }
.foto-kart:hover .renk-cizgi { width: 120px; }

/* Vitrin: daha büyük görsel, düzenli liste */
.vitrin-panel { grid-template-columns: 1fr 1.2fr; }
.ozellik-listesi { grid-template-columns: 1fr; gap: 2px; }
.ozellik-listesi li a { padding: 9px 12px; border-radius: 10px; justify-content: space-between; border: 1px solid transparent; }
.ozellik-listesi li a span { display: inline-flex; align-items: center; gap: 10px; }
.ozellik-listesi li a > i.ti-chevron-right { color: var(--silik); font-size: 15px; opacity: 0; transform: translateX(-4px); transition: opacity .2s, transform .25s var(--gecis); }
.ozellik-listesi li a:hover { background: #fff; border-color: var(--cizgi); box-shadow: var(--golge-xs); }
.ozellik-listesi li a:hover > i.ti-chevron-right { opacity: 1; transform: none; color: var(--u); }
.vitrin-gorsel .cerceve img { aspect-ratio: 4 / 3; }

/* Hizmet kartları: renkli ikon, hover */
.hizmet { position: relative; overflow: hidden; }
.hizmet .ikon { color: #fff; background: var(--u, var(--mavi-500)); border: 0; box-shadow: 0 12px 26px -12px var(--u, var(--mavi-500)); }
.hizmet::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 3px; background: var(--u, var(--mavi-500)); transform: scaleX(0); transform-origin: left; transition: transform .45s var(--gecis); }
.hizmet:hover::before { transform: scaleX(1); }
.hizmet:hover { background: color-mix(in srgb, var(--u, var(--mavi-500)) 4%, #fff); }
.hizmet .link-ok { color: var(--u, var(--mavi-600)); }

/* Rakam bandı ikonları */
.bant-rakamlar i.ti { display: block; font-size: 24px; color: #BDE6FA; margin-bottom: 14px; }

/* Slider altında kaydırma işareti */
.kaydir-isaret { position: absolute; z-index: 5; left: 50%; bottom: 112px; transform: translateX(-50%); width: 26px; height: 42px; border-radius: 14px; border: 2px solid rgba(255,255,255,.35); display: none; }
.kaydir-isaret::after { content: ""; position: absolute; left: 50%; top: 8px; width: 4px; height: 8px; margin-left: -2px; border-radius: 2px; background: #fff; animation: kaydirma 1.8s infinite; }
@keyframes kaydirma { 0% { opacity: 0; transform: translateY(0); } 30% { opacity: 1; } 100% { opacity: 0; transform: translateY(14px); } }
.foto-kart .foto { filter: brightness(.78) saturate(.95); }
.foto-kart:not(.buyuk)::after { background: linear-gradient(180deg, rgba(6,26,48,.2) 0%, rgba(6,26,48,.55) 30%, rgba(6,26,48,.93) 62%, rgba(6,26,48,.98) 100%); }
@media (max-width: 720px) {
  .slayt-ic, .seffaf-nav .slayt-ic { padding: calc(var(--nav-h) + 40px) 16px 150px; }
  .urun-kutu:last-child:nth-child(odd) { grid-column: 1 / -1; border-right: 0 !important; flex-direction: row; align-items: center; flex-wrap: wrap; }
  .urun-kutu:last-child:nth-child(odd) b { flex: 1; min-width: 0; }
  .urun-kutu:last-child:nth-child(odd) .ok { margin-top: 0; width: 100%; }
  .guven-serit p { padding: 0 16px; }
}
@media (max-width: 720px) {
  .slayt-ic, .seffaf-nav .slayt-ic { padding-bottom: 190px; }
  .slider-kontrol { bottom: 82px; }
}

/* ==========================================================================
   Mega menü v2: koyu cam tema, sekmeli ürün paneli, kusursuz geçişler
   ========================================================================== */
.nav { transition: background-color .4s var(--gecis), border-color .4s, box-shadow .4s, backdrop-filter .4s; }
.nav-oge, .nav-tel, .nav .btn-hayalet { transition: color .3s, background-color .3s; }

/* Menü açıkken üst çubuk koyu laciverde döner (her iki durumda da) */
.nav.menu-acik, .seffaf-nav .nav.menu-acik { background: rgba(6,22,40,.97); border-bottom-color: rgba(255,255,255,.08); box-shadow: none; backdrop-filter: saturate(160%) blur(18px); -webkit-backdrop-filter: saturate(160%) blur(18px); }
.nav.menu-acik .nav-oge, .nav.menu-acik .nav-tel, .nav.menu-acik .btn-hayalet { color: #DCE6F2; }
.nav.menu-acik .nav-oge i, .nav.menu-acik .nav-tel i { color: rgba(255,255,255,.55); }
.nav.menu-acik .nav-oge:hover, .nav.menu-acik .btn-hayalet:hover, .nav.menu-acik .nav-menu > li.acik > .nav-oge { background: rgba(255,255,255,.08); color: #fff; }
.nav.menu-acik .nav-menu > li.acik > .nav-oge i { color: #6FC3F0; }
.nav.menu-acik .nav-logo .logo-renkli { display: none; }
.nav.menu-acik .nav-logo .logo-beyaz { display: block; }
.seffaf-nav .nav.menu-acik .nav-logo .logo-renkli { display: none; }

/* Sayfa karartma perdesi */
.menu-perdesi { position: fixed; inset: 0; z-index: 45; background: rgba(4,14,26,.55); backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px); opacity: 0; visibility: hidden; transition: opacity .35s var(--gecis), visibility .35s; pointer-events: none; }
.menu-perdesi.acik { opacity: 1; visibility: visible; }

/* Açılır alan */
.mega { padding-top: 0; transform: none; transition: opacity .28s var(--gecis), visibility .28s; }
.mega::before { content: ""; position: absolute; left: 0; right: 0; top: -14px; height: 14px; } /* üzerine gelme köprüsü */
.nav-menu > li.acik > .mega { transform: none; }
.mm {
  max-width: calc(var(--kap) - 32px); margin: 0 auto; position: relative; overflow: hidden;
  background: linear-gradient(180deg, #0B2341 0%, #081A31 100%);
  border: 1px solid rgba(255,255,255,.08); border-top: 0; border-radius: 0 0 26px 26px;
  box-shadow: 0 40px 80px -30px rgba(0,0,0,.65);
  color: #A9BCD2;
  clip-path: inset(0 0 100% 0 round 0 0 26px 26px);
  transition: clip-path .5s var(--gecis);
}
.nav-menu > li.acik > .mega .mm { clip-path: inset(0 0 0 0 round 0 0 26px 26px); }
.mm::before { content: ""; position: absolute; inset: 0; pointer-events: none; background: radial-gradient(50% 60% at 100% 0%, rgba(42,128,183,.22), transparent 70%), radial-gradient(40% 50% at 0% 100%, rgba(32,181,216,.08), transparent 70%); }
.mm > * { position: relative; }
.mm a { color: inherit; }
/* İçerik kademeli belirir */
.mm .kademe { opacity: 0; transform: translateY(8px); transition: opacity .4s var(--gecis), transform .4s var(--gecis); }
.nav-menu > li.acik .mm .kademe { opacity: 1; transform: none; }
.nav-menu > li.acik .mm .kademe:nth-child(2) { transition-delay: .05s; }
.nav-menu > li.acik .mm .kademe:nth-child(3) { transition-delay: .1s; }
.nav-menu > li.acik .mm .kademe:nth-child(4) { transition-delay: .15s; }

.mm-baslik { display: block; font-size: 11.5px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: #6F86A1; padding: 4px 14px 10px; }
.mm-etiket { display: inline-flex; align-items: center; gap: 7px; font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: color-mix(in srgb, var(--u, #6FC3F0) 60%, #fff); }

/* Ürünler: sol liste + sağ panel */
.mm-urun { display: grid; grid-template-columns: 340px 1fr; }
.mm-liste { padding: 22px 14px; border-right: 1px solid rgba(255,255,255,.07); display: flex; flex-direction: column; gap: 3px; background: rgba(255,255,255,.015); }
.mm-sekme { position: relative; display: flex; align-items: center; gap: 12px; padding: 11px 12px; border-radius: 14px; transition: background-color .25s, color .25s; }
.mm-sekme .ikon { width: 38px; height: 38px; border-radius: 11px; display: grid; place-items: center; font-size: 19px; flex: none; color: color-mix(in srgb, var(--u) 55%, #fff); background: color-mix(in srgb, var(--u) 18%, transparent); border: 1px solid color-mix(in srgb, var(--u) 30%, transparent); transition: background-color .25s, color .25s, transform .3s var(--gecis); }
.mm-sekme b { display: block; font-size: 14px; font-weight: 600; color: #E6EEF7; line-height: 1.3; letter-spacing: -.01em; }
.mm-sekme small { display: block; font-size: 12px; color: #7F95AF; margin-top: 1px; }
.mm-sekme .ok { margin-left: auto; color: #4C6481; font-size: 16px; opacity: 0; transform: translateX(-6px); transition: opacity .25s, transform .3s var(--gecis), color .25s; }
.mm-sekme::before { content: ""; position: absolute; left: -14px; top: 12px; bottom: 12px; width: 3px; border-radius: 0 3px 3px 0; background: var(--u); transform: scaleY(0); transition: transform .3s var(--gecis); }
.mm-sekme.aktif { background: rgba(255,255,255,.06); }
.mm-sekme.aktif::before { transform: scaleY(1); }
.mm-sekme.aktif .ikon { background: var(--u); color: #fff; border-color: transparent; transform: scale(1.04); }
.mm-sekme.aktif .ok { opacity: 1; transform: none; color: #fff; }
.mm-tum { margin-top: auto; display: inline-flex; align-items: center; gap: 6px; padding: 14px 14px 4px; font-size: 13.5px; font-weight: 600; color: #6FC3F0 !important; }
.mm-tum i { transition: transform .3s var(--gecis); }
.mm-tum:hover i { transform: translateX(4px); }

.mm-paneller { position: relative; padding: 26px 28px; display: grid; }
.mm-panel { grid-area: 1 / 1; display: flex; flex-direction: column; opacity: 0; visibility: hidden; transform: translateX(10px); transition: opacity .35s var(--gecis), transform .35s var(--gecis), visibility .35s; }
.mm-panel.aktif { opacity: 1; visibility: visible; transform: none; }
.mm-panel-ust { display: grid; grid-template-columns: 1fr 230px; gap: 24px; align-items: start; margin-bottom: 20px; }
.mm-panel h4 { color: #fff; font-size: 21px; letter-spacing: -.02em; margin: 10px 0 8px; }
.mm-panel p { margin: 0; font-size: 14px; line-height: 1.6; color: #9DB2CB; }
.mm-gorsel { height: 130px; border-radius: 16px; background-size: cover; background-position: center; position: relative; overflow: hidden; box-shadow: 0 16px 30px -18px rgba(0,0,0,.8); }
.mm-gorsel::after { content: ""; position: absolute; inset: 0; border-radius: inherit; box-shadow: inset 0 0 0 1px rgba(255,255,255,.12); background: linear-gradient(180deg, transparent 40%, color-mix(in srgb, var(--u) 45%, transparent)); }
.mm-moduller { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; margin-bottom: 20px; }
.mm-moduller a { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 12px; font-size: 13.5px; font-weight: 500; color: #CBD8E6; background: rgba(255,255,255,.03); border: 1px solid rgba(255,255,255,.06); transition: background-color .2s, border-color .2s, color .2s, transform .25s var(--gecis); }
.mm-moduller a i { font-size: 17px; color: color-mix(in srgb, var(--u) 60%, #fff); flex: none; }
.mm-moduller a span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mm-moduller a:hover { background: rgba(255,255,255,.08); border-color: color-mix(in srgb, var(--u) 50%, transparent); color: #fff; transform: translateY(-1px); }
.mm-alt { margin-top: auto; display: flex; align-items: center; gap: 18px; padding-top: 18px; border-top: 1px solid rgba(255,255,255,.07); }
.mm-demo { display: inline-flex; align-items: center; gap: 8px; font-size: 13.5px; font-weight: 600; color: #A9BCD2 !important; transition: color .2s; }
.mm-demo:hover { color: #fff !important; }
.mm-demo i { font-size: 17px; color: #6FC3F0; }

/* Çözümler */
.mm-cozum { display: grid; grid-template-columns: 1fr 1fr 300px; gap: 0; }
.mm-grup { padding: 24px 20px; border-right: 1px solid rgba(255,255,255,.07); }
.mm-grup-bas { display: flex; align-items: center; gap: 12px; padding: 4px 10px 16px; margin-bottom: 8px; border-bottom: 1px solid rgba(255,255,255,.07); }
.mm-grup-bas .ikon { width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; font-size: 20px; color: #fff; background: var(--u); box-shadow: 0 10px 20px -10px var(--u); }
.mm-grup-bas b { display: block; color: #fff; font-size: 15.5px; font-weight: 650; }
.mm-grup-bas small { font-size: 12px; color: #7F95AF; }
.mm-grup-liste { display: grid; gap: 2px; }
.mm-grup-liste a { display: flex; gap: 12px; padding: 10px; border-radius: 12px; transition: background-color .2s; }
.mm-grup-liste a > i { width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; font-size: 17px; flex: none; color: color-mix(in srgb, var(--u) 60%, #fff); background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.07); transition: background-color .2s, color .2s; }
.mm-grup-liste b { display: block; font-size: 14px; font-weight: 600; color: #E6EEF7; }
.mm-grup-liste small { display: block; font-size: 12.5px; color: #7F95AF; line-height: 1.45; margin-top: 1px; }
.mm-grup-liste a:hover { background: rgba(255,255,255,.06); }
.mm-grup-liste a:hover > i { background: var(--u); color: #fff; border-color: transparent; }
.mm-tanitim { margin: 16px; padding: 26px; border-radius: 20px; display: flex; flex-direction: column; gap: 12px; background: linear-gradient(150deg, var(--mavi-500), #164E7E 70%); color: #DCEBF6; position: relative; overflow: hidden; }
.mm-tanitim::after { content: ""; position: absolute; inset: 0; background-image: radial-gradient(rgba(255,255,255,.14) 1px, transparent 1px); background-size: 18px 18px; -webkit-mask-image: linear-gradient(200deg, #000, transparent 60%); mask-image: linear-gradient(200deg, #000, transparent 60%); pointer-events: none; }
.mm-tanitim > * { position: relative; z-index: 1; }
.mm-tanitim .mm-etiket { color: #CFE9F8; }
.mm-tanitim h4 { color: #fff; font-size: 19px; letter-spacing: -.02em; line-height: 1.25; }
.mm-tanitim p { margin: 0; font-size: 13.5px; color: #CFE2F1; line-height: 1.55; }
.mm-tanitim .btn { align-self: flex-start; margin-top: 4px; }
.mm-tanitim-alt { margin-top: auto; display: flex; align-items: center; gap: 12px; padding-top: 16px; border-top: 1px solid rgba(255,255,255,.18); }
.mm-tanitim-alt i { font-size: 22px; }
.mm-tanitim-alt small { display: block; font-size: 12px; color: #BFDDF1; }
.mm-tanitim-alt b { color: #fff; font-size: 15px; }

/* Müşteri paneli */
.mm-panel-menu { max-width: 760px; padding: 22px; display: grid; gap: 14px; }
.mm-panel-kartlar { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.mm-pkart { display: flex; flex-direction: column; gap: 8px; padding: 22px; border-radius: 18px; background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.08); transition: background-color .25s, border-color .25s, transform .3s var(--gecis); position: relative; overflow: hidden; }
.mm-pkart::after { content: ""; position: absolute; right: -50px; top: -50px; width: 160px; height: 160px; border-radius: 50%; background: radial-gradient(closest-side, color-mix(in srgb, var(--u) 35%, transparent), transparent); opacity: .6; transition: opacity .3s; }
.mm-pkart:hover { background: rgba(255,255,255,.07); border-color: color-mix(in srgb, var(--u) 45%, transparent); transform: translateY(-2px); }
.mm-pkart:hover::after { opacity: 1; }
.mm-pkart .ikon { width: 46px; height: 46px; border-radius: 14px; display: grid; place-items: center; font-size: 23px; color: #fff; background: var(--u); margin-bottom: 6px; box-shadow: 0 12px 24px -12px var(--u); }
.mm-pkart b { color: #fff; font-size: 16px; font-weight: 650; }
.mm-pkart small { font-size: 13px; color: #8DA2BC; line-height: 1.5; }
.mm-giris { margin-top: 6px; display: inline-flex; align-items: center; gap: 6px; font-size: 13.5px; font-weight: 600; color: color-mix(in srgb, var(--u) 55%, #fff); }
.mm-giris i { transition: transform .3s var(--gecis); }
.mm-pkart:hover .mm-giris i { transform: translate(3px, -3px); }
.mm-destek { display: flex; align-items: center; gap: 14px; padding: 16px 18px; border-radius: 16px; border: 1px dashed rgba(255,255,255,.14); transition: background-color .25s, border-color .25s; }
.mm-destek:hover { background: rgba(255,255,255,.05); border-color: rgba(255,255,255,.25); }
.mm-destek .ikon { width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; font-size: 20px; color: #6FC3F0; background: rgba(111,195,240,.12); }
.mm-destek b { display: block; color: #fff; font-size: 14.5px; }
.mm-destek small { font-size: 12.5px; color: #7F95AF; }
.mm-destek > i { margin-left: auto; color: #6F86A1; font-size: 18px; }

@media (max-width: 1180px) {
  .mm-urun { grid-template-columns: 300px 1fr; }
  .mm-moduller { grid-template-columns: repeat(2, 1fr); }
  .mm-panel-ust { grid-template-columns: 1fr; }
  .mm-gorsel { display: none; }
  .mm-cozum { grid-template-columns: 1fr 1fr; }
  .mm-tanitim { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .mm { clip-path: none !important; }
}

/* ==========================================================================
   Mega menü v3: açık, süzülen kart (koyu tema geri alındı)
   ========================================================================== */
.menu-perdesi { background: rgba(6,26,48,.28); backdrop-filter: blur(2px); -webkit-backdrop-filter: blur(2px); }
.mega { padding-top: 10px; }
.mega::before { top: -4px; height: 14px; }
.mm {
  background: #fff; color: var(--soluk);
  border: 1px solid rgba(10,37,64,.08); border-radius: 22px;
  box-shadow: 0 2px 6px rgba(10,37,64,.05), 0 30px 70px -20px rgba(10,37,64,.35);
  clip-path: none; opacity: 0; transform: translateY(-10px) scale(.985); transform-origin: 50% 0;
  transition: opacity .3s var(--gecis), transform .4s var(--gecis);
}
.nav-menu > li.acik > .mega .mm { clip-path: none; opacity: 1; transform: none; }
.mm::before { background: radial-gradient(40% 60% at 100% 0%, rgba(42,128,183,.06), transparent 70%); }
.mm a { color: inherit; }

/* Ürünler: 5 kart yan yana */
.mm-urun { display: block; padding: 18px; }
.mm-urun-izgara { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; }
.mm-ukart { display: flex; flex-direction: column; padding: 10px 10px 14px; border-radius: 16px; border: 1px solid transparent; transition: background-color .25s, border-color .25s, box-shadow .3s; }
.mm-ukart:hover { background: color-mix(in srgb, var(--u) 4%, #fff); border-color: color-mix(in srgb, var(--u) 18%, #fff); box-shadow: 0 10px 24px -16px color-mix(in srgb, var(--u) 60%, transparent); }
.mm-ukart-bas { position: relative; display: block; height: 96px; border-radius: 12px; overflow: hidden; margin-bottom: 12px; }
.mm-ukart-foto { position: absolute; inset: 0; background-size: cover; background-position: center; transition: transform .8s var(--gecis); }
.mm-ukart-bas::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 20%, color-mix(in srgb, var(--u) 70%, transparent)); }
.mm-ukart:hover .mm-ukart-foto { transform: scale(1.07); }
.mm-ukart-bas .ikon { position: absolute; z-index: 1; left: 10px; bottom: 10px; width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; font-size: 18px; color: var(--u); background: #fff; box-shadow: 0 6px 14px -6px rgba(0,0,0,.35); }
.mm-ukart-ad { font-family: var(--yazi-baslik); font-size: 14.5px; font-weight: 650; line-height: 1.3; letter-spacing: -.015em; color: var(--murekkep) !important; padding: 0 4px; min-height: 38px; transition: color .2s; }
.mm-ukart-ad:hover { color: var(--u) !important; }
.mm-ukart ul { list-style: none; margin: 10px 0 12px; padding: 0 4px; display: grid; gap: 1px; }
.mm-ukart li a { display: block; font-size: 13px; color: var(--soluk); padding: 3px 0 3px 12px; position: relative; transition: color .2s, transform .25s var(--gecis); }
.mm-ukart li a::before { content: ""; position: absolute; left: 0; top: 50%; width: 5px; height: 5px; margin-top: -2.5px; border-radius: 50%; background: color-mix(in srgb, var(--u) 45%, #fff); transition: background-color .2s; }
.mm-ukart li a:hover { color: var(--u); transform: translateX(2px); }
.mm-ukart li a:hover::before { background: var(--u); }
.mm-ukart-ok { margin-top: auto; padding: 0 4px; display: inline-flex; align-items: center; gap: 5px; font-size: 13px; font-weight: 650; color: var(--u) !important; }
.mm-ukart-ok i { transition: transform .3s var(--gecis); }
.mm-ukart-ok:hover i { transform: translateX(3px); }
.mm-serit { margin-top: 14px; padding: 14px 18px; border-radius: 14px; background: var(--zemin-2); display: flex; align-items: center; justify-content: space-between; gap: 16px; font-size: 13.5px; color: var(--soluk); }
.mm-serit span { display: inline-flex; align-items: center; gap: 8px; }
.mm-serit i.ti-topology-ring-3 { color: var(--mavi-500); font-size: 18px; }
.mm-serit a { display: inline-flex; align-items: center; gap: 6px; font-weight: 650; color: var(--mavi-600) !important; white-space: nowrap; }
.mm-serit a i { transition: transform .3s var(--gecis); }
.mm-serit a:hover i { transform: translateX(3px); }

/* Çözümler (açık tema) */
.mm-grup { border-right-color: var(--cizgi); }
.mm-grup-bas { border-bottom-color: var(--cizgi); }
.mm-grup-bas b { color: var(--murekkep); }
.mm-grup-bas small, .mm-grup-liste small { color: var(--silik); }
.mm-grup-liste b { color: var(--murekkep); }
.mm-grup-liste a > i { color: var(--u); background: color-mix(in srgb, var(--u) 9%, #fff); border-color: color-mix(in srgb, var(--u) 16%, #fff); }
.mm-grup-liste a:hover { background: var(--zemin-2); }
.mm-grup-liste a:hover b { color: var(--u); }

/* Müşteri paneli (açık tema) */
.mm-pkart { background: var(--zemin-2); border-color: var(--cizgi); }
.mm-pkart:hover { background: color-mix(in srgb, var(--u) 5%, #fff); border-color: color-mix(in srgb, var(--u) 30%, #fff); }
.mm-pkart b { color: var(--murekkep); }
.mm-pkart small { color: var(--soluk); }
.mm-giris { color: var(--u); }
.mm-pkart::after { opacity: .35; }
.mm-destek { border-color: var(--cizgi-2); }
.mm-destek:hover { background: var(--zemin-2); border-color: var(--mavi-200); }
.mm-destek .ikon { color: var(--mavi-600); background: var(--mavi-50); }
.mm-destek b { color: var(--murekkep); }
.mm-destek small { color: var(--silik); }
.mm-destek > i { color: var(--silik); }

@media (max-width: 1180px) {
  .mm-urun-izgara { grid-template-columns: repeat(3, 1fr); }
}
.mm .btn-beyaz { color: var(--mavi-800) !important; }

/* ==========================================================================
   Üst bant v4 (Nebim dili): üst çubuk yok, sade koyu menü, küçük açılır paneller
   ========================================================================== */
:root { --nav-h: 76px; --antrasit: #101A28; }
.nav, .seffaf-nav .nav:not(.kaydi):not(.menu-acik) { background: var(--antrasit); border-bottom: 1px solid rgba(255,255,255,.06); box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none; }
.seffaf-nav .nav:not(.kaydi) { background: transparent; border-bottom-color: transparent; }
.nav.kaydi, .seffaf-nav .nav.kaydi { background: rgba(16,26,40,.96); border-bottom-color: rgba(255,255,255,.06); box-shadow: 0 10px 30px -12px rgba(0,0,0,.45); backdrop-filter: saturate(160%) blur(14px); -webkit-backdrop-filter: saturate(160%) blur(14px); }
.nav .kap { gap: 44px; }
.nav-logo .logo-renkli { display: none !important; }
.nav-logo .logo-beyaz { display: block !important; height: 34px; width: auto; }
.nav-menu { gap: 4px; }
.nav-menu > li { position: relative; }
.nav .nav-oge, .seffaf-nav .nav .nav-oge { height: 38px; padding: 0 12px; border-radius: 8px; color: #E3EAF2 !important; font-size: 15px; font-weight: 500; letter-spacing: -.005em; background: transparent; }
.nav .nav-oge i { color: rgba(227,234,242,.6) !important; font-size: 14px; }
.nav .nav-oge:hover, .nav .nav-menu > li.acik > .nav-oge { color: #fff !important; background: transparent !important; }
.nav .nav-menu > li.acik > .nav-oge i { color: #fff !important; }
/* Üst menü seçimi: dolgulu pill yerine sade/kurumsal ince alt çizgi vurgusu */
.nav .nav-oge { position: relative; background: transparent !important; border-radius: 0 !important; }
.nav .nav-oge::after { content: ""; position: absolute; left: 12px; right: 12px; bottom: 5px; height: 2px; border-radius: 2px; background: currentColor; opacity: 0; transform: scaleX(.3); transform-origin: center; transition: opacity .25s var(--gecis), transform .3s var(--gecis); pointer-events: none; }
.nav .nav-oge:hover::after { opacity: 1; transform: scaleX(1); }
/* Aktif sayfa: yalnız parlak metin (mavi alt çizgi yok) */
.nav .nav-oge.aktif { color: #fff !important; }
.nav .nav-oge.aktif::after { opacity: 0 !important; }
/* Açılan menü (dropdown) AÇIKKEN başlık altındaki çizgi gösterilmesin */
.nav .nav-menu > li.acik > .nav-oge::after { opacity: 0 !important; transform: scaleX(.3) !important; }
/* Açılır menü başlıkları (buton) altında hiç çizgi olmasın — çizgi yalnız düz linklerde (a) kalır */
.nav button.nav-oge::after { content: none !important; }
.nav .nav-ac { background: rgba(255,255,255,.08) !important; border-color: rgba(255,255,255,.18) !important; color: #fff !important; margin-left: auto; }

/* Açılır panel */
.acilir {
  position: absolute; left: 0; top: calc(100% + 10px); min-width: 260px; padding: 10px;
  background: rgba(20,40,66,.94); backdrop-filter: blur(18px) saturate(140%); -webkit-backdrop-filter: blur(18px) saturate(140%);
  border: 1px solid rgba(120,180,230,.22); border-radius: 12px;
  box-shadow: 0 24px 60px -20px rgba(0,0,0,.7), inset 0 1px 0 rgba(255,255,255,.06);
  opacity: 0; visibility: hidden; transform: translateY(-6px);
  transition: opacity .22s var(--gecis), transform .3s var(--gecis), visibility .22s;
}
.acilir::before { content: ""; position: absolute; left: 0; right: 0; top: -14px; height: 14px; }
.acilir::after { content: ""; position: absolute; left: 14px; right: 14px; bottom: -1px; height: 2px; border-radius: 2px; background: linear-gradient(90deg, var(--mavi-500), var(--camgobegi)); opacity: .9; }
.nav-menu > li.acik > .acilir { opacity: 1; visibility: visible; transform: none; }
.acilir.genis { min-width: 380px; }
.acilir a { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 8px; color: #DCE6F1; transition: background-color .2s, color .2s; }
.acilir a b { display: block; font-size: 14.5px; font-weight: 500; color: inherit; white-space: nowrap; }
.acilir a small { display: block; font-size: 12.5px; color: #8EA4BD; margin-top: 1px; }
.acilir a > i:first-child { width: 34px; height: 34px; border-radius: 9px; display: grid; place-items: center; font-size: 18px; flex: none; color: color-mix(in srgb, var(--u, var(--mavi-400)) 55%, #fff); background: color-mix(in srgb, var(--u, var(--mavi-400)) 22%, transparent); }
.acilir a .dis { margin-left: auto; font-size: 15px; color: #7F95AF; }
.acilir a:hover { background: rgba(255,255,255,.07); color: #fff; }
.acilir a:hover .dis { color: #fff; }
.menu-perdesi { background: rgba(4,12,24,.5); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); }

/* Giriş alanı: Nebim dili */
.slayt-etiket { font-size: 13.5px; letter-spacing: .14em; color: #5FB8EE; }
.slayt-etiket i { display: none; }
.slayt h1, .slayt h2 { font-size: clamp(2.6rem, 5vw, 4.4rem); font-weight: 700; letter-spacing: -.03em; line-height: 1.05; }
.slayt h1 em, .slayt h2 em { background: linear-gradient(100deg, #3E8EF0, #4FC3F7); -webkit-background-clip: text; background-clip: text; }
.slayt-butonlar .btn { text-transform: uppercase; letter-spacing: .06em; font-size: 13.5px; font-weight: 700; }
.slayt-butonlar .btn-ana { background: linear-gradient(95deg, #3A5BDB, #43B4EC); box-shadow: 0 14px 30px -12px rgba(67,180,236,.7); }
.slayt-butonlar .btn-ana:hover { filter: brightness(1.06); }
.slayt-butonlar .btn-cam { background: rgba(10,22,40,.55); border: 1.5px solid rgba(120,180,230,.45); }
.slayt-butonlar .btn-cam:hover { border-color: rgba(160,210,245,.8); background: rgba(10,22,40,.7); }

/* Sağda cam rakam kartları (tüm slaytlarda sabit) */
.hero-rakam { position: absolute; z-index: 4; right: max(16px, calc((100vw - var(--kap)) / 2 + 16px)); top: 50%; transform: translateY(-46%); display: grid; grid-template-columns: repeat(2, 210px); gap: 14px; }
.hero-rakam div { padding: 22px 22px 20px; border-radius: 14px; background: rgba(14,30,54,.42); border: 1px solid rgba(120,180,230,.32); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); opacity: 0; transform: translateY(16px); animation: panelGel .9s var(--gecis) forwards; }
.hero-rakam div:nth-child(2) { animation-delay: .1s; } .hero-rakam div:nth-child(3) { animation-delay: .2s; } .hero-rakam div:nth-child(4) { animation-delay: .3s; }
.hero-rakam b { display: block; font-family: var(--yazi-baslik); font-size: 30px; font-weight: 600; color: #fff; letter-spacing: -.02em; line-height: 1.1; }
.hero-rakam span { display: block; margin-top: 8px; font-size: 11.5px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #6FB6E6; }
.slayt-panel { display: none !important; }
.slayt-ic.ikili-slayt { grid-template-columns: 1fr; }
.slayt-metin { max-width: 640px; }
@media (max-width: 1180px) { .hero-rakam { grid-template-columns: repeat(2, 170px); } .hero-rakam b { font-size: 24px; } }
@media (max-width: 1024px) { .hero-rakam { display: none; } .nav .kap { gap: 12px; } }
.seffaf-nav .nav:not(.kaydi):not(.menu-acik) { background: linear-gradient(180deg, rgba(6,18,34,.55), rgba(6,18,34,0)); border-bottom-color: transparent; }
@media (max-width: 720px) { .slider-kontrol { display: none; } .slayt-ic, .seffaf-nav .slayt-ic { padding-bottom: 130px; } }

/* ==========================================================================
   v5: Sentez + Nebim — sinematik giriş, Poppins başlıklar
   ========================================================================== */
:root { --yazi-baslik: "Poppins", "Inter", ui-sans-serif, system-ui, sans-serif; }
h1, h2, h3, h4 { letter-spacing: -.02em; font-weight: 600; }
.b-buyuk { letter-spacing: -.025em; font-weight: 600; }
.nav .nav-oge, .acilir a b { font-family: var(--yazi-baslik); font-weight: 400; }
.nav .nav-oge { font-size: 14.5px; }

.sinema { position: relative; min-height: max(680px, 100vh); margin-top: calc(-1 * var(--nav-h)); background: #040B16; color: #fff; overflow: hidden; isolation: isolate; display: flex; align-items: center; }
.sinema-foto { position: absolute; inset: 0; z-index: -3; background-size: cover; background-position: center; opacity: .38; filter: saturate(.7) contrast(1.05); transform: scale(1.08); animation: sinemaZoom 24s ease-in-out infinite alternate; }
@keyframes sinemaZoom { to { transform: scale(1.0); } }
.sinema::before { content: ""; position: absolute; inset: 0; z-index: -2; background: radial-gradient(60% 55% at 50% 45%, rgba(10,40,80,.15), rgba(4,11,22,.85) 70%), linear-gradient(180deg, rgba(4,11,22,.65) 0%, rgba(4,11,22,.2) 35%, rgba(4,11,22,.9) 100%); }
.sinema-ag { position: absolute; inset: 0; z-index: -1; width: 100%; height: 100%; }
.sinema-isik { position: absolute; z-index: -1; left: 50%; top: 42%; width: 900px; height: 900px; margin: -450px 0 0 -450px; border-radius: 50%; background: radial-gradient(closest-side, rgba(42,128,183,.28), rgba(32,181,216,.08) 55%, transparent 72%); filter: blur(10px); animation: nefes 8s ease-in-out infinite; pointer-events: none; }
@keyframes nefes { 50% { transform: scale(1.08); opacity: .8; } }
.sinema-ic { text-align: center; padding-top: calc(var(--nav-h) + 40px); padding-bottom: 140px; position: relative; }
.sinema-ic > * { opacity: 0; transform: translateY(22px); animation: yukari 1.1s var(--gecis) forwards; }
.sinema-ic > :nth-child(2) { animation-delay: .15s; } .sinema-ic > :nth-child(3) { animation-delay: .3s; } .sinema-ic > :nth-child(4) { animation-delay: .45s; } .sinema-ic > :nth-child(5) { animation-delay: .65s; }
.sinema-etiket { display: inline-block; font-family: var(--yazi-baslik); font-size: 12.5px; font-weight: 500; letter-spacing: .28em; text-transform: uppercase; color: #7FC4EE; margin-bottom: 30px; }
.sinema-baslik { font-family: var(--yazi-baslik); font-weight: 300; font-size: clamp(2.6rem, 6.4vw, 5.6rem); line-height: 1.05; letter-spacing: .14em; text-transform: uppercase; color: #fff; margin: 0 auto 22px; text-shadow: 0 10px 40px rgba(0,0,0,.45); }
.sinema-baslik span { font-weight: 600; background: linear-gradient(100deg, #3E8EF0, #4FC3F7 60%, #7FE0F8); -webkit-background-clip: text; background-clip: text; color: transparent; }
.sinema-alt { font-family: var(--yazi-baslik); font-weight: 300; font-size: clamp(.95rem, 1.4vw, 1.15rem); letter-spacing: .32em; text-transform: uppercase; color: #B9CBDE; margin: 0 0 46px; }
.sinema-buton { justify-content: center; margin-bottom: 64px; }
.sinema-rakam { display: grid; grid-template-columns: repeat(4, minmax(0, 200px)); gap: 14px; justify-content: center; }
.sinema-rakam div { padding: 20px 18px; border-radius: 14px; text-align: left; background: rgba(14,30,54,.38); border: 1px solid rgba(120,180,230,.28); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); transition: border-color .3s, background-color .3s, transform .4s var(--gecis); }
.sinema-rakam div:hover { border-color: rgba(127,196,238,.6); background: rgba(14,30,54,.55); transform: translateY(-3px); }
.sinema-rakam b { font-family: var(--yazi-baslik); font-size: 28px; font-weight: 600; color: #fff; letter-spacing: -.01em; }
.sinema-rakam b + b { color: #4FC3F7; margin-left: 1px; }
.sinema-rakam span { display: block; margin-top: 6px; font-size: 11px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: #6FB6E6; }
.sinema-asagi { position: absolute; left: 50%; bottom: 112px; width: 26px; height: 42px; margin-left: -13px; border-radius: 14px; border: 1.5px solid rgba(255,255,255,.35); z-index: 3; }
.sinema-asagi span { position: absolute; left: 50%; top: 8px; width: 4px; height: 8px; margin-left: -2px; border-radius: 2px; background: #fff; animation: kaydirma 1.8s infinite; }
.sinema + .urun-serit { margin-top: -96px; }
.seffaf-nav .sinema ~ * .nav { }
@media (max-width: 1024px) { .sinema-rakam { grid-template-columns: repeat(2, minmax(0, 220px)); } .sinema-asagi { display: none; } }
@media (max-width: 720px) {
  .sinema { min-height: 0; }
  .sinema-ic { padding: calc(var(--nav-h) + 48px) 16px 120px; }
  .sinema-baslik { letter-spacing: .06em; font-size: 2.3rem; }
  .sinema-alt { letter-spacing: .16em; font-size: .85rem; margin-bottom: 34px; }
  .sinema-etiket { letter-spacing: .16em; font-size: 11px; }
  .sinema-buton { flex-direction: column; margin-bottom: 40px; }
  .sinema-buton .btn { width: 100%; }
  .sinema-rakam { grid-template-columns: 1fr 1fr; gap: 10px; }
  .sinema-rakam b { font-size: 22px; }
  .sinema + .urun-serit { margin-top: -64px; }
}
@media (prefers-reduced-motion: reduce) { .sinema-foto, .sinema-isik { animation: none; } }
.nav-portal { margin-left: auto; display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 18px; border-radius: 999px; font-family: var(--yazi-baslik); font-size: 14px; font-weight: 500; color: #fff; border: 1.5px solid rgba(120,180,230,.45); background: rgba(10,22,40,.35); transition: border-color .25s, background-color .25s, transform .25s var(--gecis); white-space: nowrap; }
.nav-portal i { font-size: 18px; color: #6FC3F0; }
.nav-portal:hover { border-color: rgba(160,210,245,.85); background: rgba(42,128,183,.25); transform: translateY(-1px); }
.nav-portal + .nav-ac { margin-left: 10px; }
@media (max-width: 1024px) { .nav-portal { height: 38px; padding: 0 14px; font-size: 13px; } }
@media (max-width: 420px) { .nav-portal { padding: 0 12px; } .nav-portal i { display: none; } }

/* ==========================================================================
   Açılır menü cilası: büyüyerek/netleşerek açılış, kademeli satırlar,
   işaret oku, kayan alt çizgi
   ========================================================================== */
.nav-menu { position: relative; }
.nav-cizgi { position: absolute !important; left: 0; bottom: -2px; height: 2px; width: 0; border-radius: 2px; background: linear-gradient(90deg, #3E8EF0, #4FC3F7); opacity: 0; pointer-events: none; transition: transform .35s var(--gecis), width .35s var(--gecis), opacity .25s; }
.nav-cizgi.gorunur { opacity: 1; }

.acilir {
  top: calc(100% + 14px); padding: 8px; min-width: 280px;
  background: linear-gradient(90deg, #3E8EF0, #4FC3F7) top / 100% 2px no-repeat, rgba(17,34,58,.96);
  border: 1px solid rgba(120,180,230,.18); border-radius: 14px;
  box-shadow: 0 2px 4px rgba(0,0,0,.2), 0 30px 70px -24px rgba(0,0,0,.8);
  transform-origin: 24px 0;
  opacity: 0; visibility: hidden; transform: translateY(8px) scale(.97); filter: blur(4px);
  transition: opacity .16s ease, transform .2s ease, filter .16s ease, visibility .16s;
}
.acilir::after { content: ""; position: absolute; left: 22px; right: auto; top: -6px; bottom: auto; width: 12px; height: 12px; border-radius: 3px 0 0 0; background: #2F6FB9; transform: rotate(45deg); opacity: 1; border: 0; }
.acilir::before { top: -18px; height: 18px; }
.nav-menu > li.acik > .acilir {
  opacity: 1; visibility: visible; transform: none; filter: none;
  transition: opacity .3s var(--gecis), transform .45s cubic-bezier(.16,1,.3,1), filter .35s var(--gecis), visibility .3s;
}
.acilir-baslik { display: block; padding: 10px 12px 8px; font-size: 11px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: #6F8FB0; }
.acilir a { position: relative; padding: 10px 12px; gap: 12px; overflow: hidden; }
/* Sol kenar çizgisi kaldırıldı — sade/kurumsal seçim (yalnız arkaplan vurgusu) */
.acilir a::before { content: none !important; }
.acilir a > i:first-child { width: 32px; height: 32px; border-radius: 9px; font-size: 17px; color: color-mix(in srgb, var(--u, #4FC3F7) 65%, #fff); background: color-mix(in srgb, var(--u, #4FC3F7) 16%, transparent); transition: background-color .25s, color .25s, transform .3s var(--gecis); }
.acilir a:hover > i:first-child { background: var(--u, var(--mavi-500)); color: #fff; transform: scale(1.06); }
.acilir a:hover { background: rgba(255,255,255,.06); }
.acilir a b { font-size: 14px; }
.acilir-alt { margin-top: 6px; border-top: 1px solid rgba(255,255,255,.07); border-radius: 0 0 8px 8px !important; justify-content: space-between; font-size: 13px; font-weight: 600; color: #6FC3F0 !important; padding: 12px 12px 8px !important; }
.acilir-alt::before { display: none; }
.acilir-alt i { transition: transform .3s var(--gecis); }
.acilir-alt:hover { background: transparent !important; color: #A9DCF7 !important; }
.acilir-alt:hover i { transform: translateX(4px); }

/* Satırlar kademeli belirir */
.acilir > * { opacity: 0; transform: translateY(6px); transition: opacity .12s, transform .12s; }
.nav-menu > li.acik > .acilir > * { opacity: 1; transform: none; transition: opacity .35s var(--gecis), transform .45s cubic-bezier(.16,1,.3,1); transition-delay: calc(var(--s, 0) * 32ms + 60ms); }

/* Menü başlığı oku dönüşü */
.nav .nav-oge i { transition: transform .35s cubic-bezier(.16,1,.3,1), color .25s; }
.nav .nav-menu > li.acik > .nav-oge i { transform: rotate(180deg); }
.menu-perdesi { transition: opacity .4s var(--gecis), visibility .4s; }
@media (prefers-reduced-motion: reduce) { .acilir, .acilir > * { filter: none !important; transition-duration: .01ms !important; } }
.acilir .acilir-alt > i:first-child { width: auto; height: auto; background: none !important; color: inherit !important; font-size: 16px; border-radius: 0; transform: none; }
.acilir .acilir-alt:hover > i:first-child { transform: translateX(4px); }

/* Giriş arka plan videosu */
/* Renk ayarı (doygunluk .85, kontrast 1.05, parlaklık .9) kliplerin içine işlendi; CSS filtresi her karede GPU'yu yormasın */
.sinema-video { position: absolute; inset: 0; z-index: -3; width: 100%; height: 100%; object-fit: cover; opacity: 0; transition: opacity 1.4s ease; will-change: opacity; }
.sinema-video.oynuyor { opacity: .62; }
.sinema.videolu .sinema-foto { animation: none; }
.sinema.videolu::before { background: radial-gradient(70% 60% at 50% 45%, rgba(6,22,44,.35), rgba(4,11,22,.88) 75%), linear-gradient(180deg, rgba(4,11,22,.75) 0%, rgba(4,11,22,.35) 35%, rgba(4,11,22,.92) 100%); }
.sinema.videolu .sinema-ag { opacity: .55; }
.sinema-video.oynuyor { opacity: .9; }

/* Giriş videosu ürün şeridi: oynayan ürün vurgulanır, çubuk klipler ilerledikçe dolar */
/* Sol alttaki WhatsApp butonunun üstünde kalsın; şerit varken "aşağı kaydır" simgesi gizlenir */
.sahne-serit { position: absolute; left: 0; right: 0; bottom: 100px; z-index: 2; opacity: 0; visibility: hidden; transition: opacity .8s ease, visibility .8s; }
.sinema.videolu .sahne-serit { opacity: 1; visibility: visible; }
.sinema.videolu .sinema-asagi { display: none; }
@media (max-width: 720px) { .sahne-serit { bottom: 28px; } }
.sahne-liste { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 18px; }
.sahne-oge { display: block; padding-top: 4px; color: rgba(255,255,255,.5); font-size: 13.5px; font-weight: 500; letter-spacing: .01em; text-decoration: none; transition: color .3s; }
.sahne-oge:hover, .sahne-oge.aktif { color: #fff; }
.sahne-cubuk { display: block; height: 2px; margin-bottom: 12px; border-radius: 2px; background: rgba(255,255,255,.2); overflow: hidden; }
.sahne-cubuk i { display: block; height: 100%; background: #fff; transform: scaleX(0); transform-origin: left; will-change: transform, opacity; }
.sahne-mobil-ad { display: none; }
/* Ürün değişince başlık: kelimeler sırayla yukarı çıkar, yenileri aşağıdan gelir, vurgu çizgisi yeniden çizilir */
/* Kayma ve solma birlikte: vurgulu kelimenin (alt çizgi için genişletilmiş) maskesinin dışında kalan kısmı da görünmez kalır.
   Parıltı her durumda aynı sırada ve aynı ayarla tanımlı, geçişte kesilip sıçramasın. */
@keyframes kelimeGit { from { transform: none; opacity: 1; } to { transform: translateY(-100%); opacity: 0; } }
@keyframes kelimeGelYeni { from { transform: translateY(100%); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes cizSil { from { stroke-dashoffset: 0; opacity: .9; } to { stroke-dashoffset: -320; opacity: 0; } }
@keyframes cizYeni { from { stroke-dashoffset: 320; } to { stroke-dashoffset: 0; } }
.sinema-baslik.v2.degisiyor .kelime > span { animation: kelimeGit .52s cubic-bezier(.55,0,.78,.2) both; }
.sinema-baslik.v2.degisiyor .kelime:nth-child(2) > span { animation: kelimeGit .52s .05s cubic-bezier(.55,0,.78,.2) both, parilti 6s 1.4s ease-in-out infinite; }
.sinema-baslik.v2.degisiyor .kelime:nth-child(3) > span { animation-delay: .1s; }
.sinema-baslik.v2.degisiyor .cizgi path { animation: cizSil .38s cubic-bezier(.55,0,.78,.2) both; }
.sinema-baslik.v2.geliyor .kelime > span { animation: kelimeGelYeni .95s cubic-bezier(.16,1,.3,1) both; }
.sinema-baslik.v2.geliyor .kelime:nth-child(2) > span { animation: kelimeGelYeni .95s .07s cubic-bezier(.16,1,.3,1) both, parilti 6s 1.4s ease-in-out infinite; }
.sinema-baslik.v2.geliyor .kelime:nth-child(3) > span { animation-delay: .14s; }
.sinema-baslik.v2.geliyor .cizgi path { animation: cizYeni .85s .4s cubic-bezier(.65,0,.35,1) both; }
/* Vurgulu kelimenin maskesi geçiş boyunca diğer kelimelerle aynı hizada; çizgi çizilirken eski genişliğine döner */
@keyframes vurguMaskeCik { from { clip-path: inset(-20% -10% -40% -10%); } 25%, to { clip-path: inset(0 -10% -40% -10%); } }
@keyframes vurguMaskeGir { from, 38% { clip-path: inset(0 -10% 0 -10%); } 55%, to { clip-path: inset(-20% -10% -40% -10%); } }
.sinema-baslik.v2.degisiyor .vurgu { animation: vurguMaskeCik .57s linear both; }
.sinema-baslik.v2.geliyor .vurgu { animation: vurguMaskeGir 1.02s linear both; }
@media (max-width: 640px) {
  .sahne-liste { gap: 6px; }
  .sahne-oge { padding: 10px 0; }
  .sahne-cubuk { margin-bottom: 0; }
  .sahne-ad { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .sahne-mobil-ad { display: block; margin-bottom: 4px; color: #fff; font-size: 13px; font-weight: 500; }
}
.sinema.videolu::before { background: radial-gradient(75% 65% at 50% 42%, rgba(6,22,44,.18), rgba(4,11,22,.72) 78%), linear-gradient(180deg, rgba(4,11,22,.7) 0%, rgba(4,11,22,.25) 30%, rgba(4,11,22,.35) 65%, rgba(4,11,22,.92) 100%); }
.sinema.videolu .sinema-isik { opacity: .55; }
.sinema-baslik, .sinema-alt, .sinema-etiket { text-shadow: 0 2px 24px rgba(0,0,0,.6); }

/* ==========================================================================
   Üst menü A: ortalanmış menü, ortada açılan ızgara paneller
   ========================================================================== */
.nav .kap { position: relative; }
.nav-menu { flex: 1; justify-content: center; }
.nav-menu > li { position: static; }
.nav-portal { margin-left: 0; }
.acilir {
  left: 50%; top: calc(100% - 4px);
  transform: translate(-50%, 8px) scale(.98); transform-origin: 50% 0;
  min-width: 0; width: min(420px, calc(100vw - 48px)); padding: 14px;
}
.nav-menu > li.acik > .acilir { transform: translate(-50%, 0); }
.acilir::after { display: none; }
.acilir::before { top: -22px; height: 22px; }
.acilir.izgara-3 { width: min(820px, calc(100vw - 48px)); display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px; }
.acilir.izgara-2 { width: min(640px, calc(100vw - 48px)); display: grid; grid-template-columns: repeat(2, 1fr); gap: 4px; }
.acilir.izgara-3 > .acilir-baslik, .acilir.izgara-2 > .acilir-baslik, .acilir.izgara-3 > .acilir-alt, .acilir.izgara-2 > .acilir-alt { grid-column: 1 / -1; }
.acilir.izgara-3 a, .acilir.izgara-2 a { align-items: flex-start; padding: 12px; }
.acilir.izgara-3 a b, .acilir.izgara-2 a b { white-space: normal; line-height: 1.35; }
.acilir.izgara-3 a small, .acilir.izgara-2 a small { line-height: 1.45; margin-top: 3px; }
.acilir.izgara-3 a > i:first-child, .acilir.izgara-2 a > i:first-child { width: 36px; height: 36px; font-size: 19px; }
.acilir-baslik { padding-bottom: 6px; border-bottom: 1px solid rgba(255,255,255,.06); margin-bottom: 4px; }
.acilir-alt { margin-top: 4px; }
/* Açılan menü üst barın alt kenarına tam hizalı açılsın (bar içine taşmasın);
   hover köprüsü bar ile panel arasındaki boşluğu kapatır. */
.acilir, .mega { top: calc(100% + 14px) !important; }
.acilir::before, .mega::before { top: -24px !important; height: 24px !important; }

/* ===== Nav: kaydırınca sadece arka plan ve gölge değişir; logo, başlıklar ve yükseklik sabit kalır ===== */
.nav { transition: background-color .4s var(--gecis), border-color .4s, box-shadow .4s, backdrop-filter .4s; }
/* Kaydırılmış (ince) barda açılan menü yine barın alt kenarına hizalı açılsın */
.nav.kaydi .acilir, .nav.kaydi .mega { top: calc(100% + 10px) !important; }

/* ===== Açılan menü paneli: yumuşak gölge + hairline + yumuşak köşe, blur yok ===== */
.acilir {
  border: 1px solid rgba(17,34,58,.08) !important;
  border-radius: 16px !important;
  box-shadow: 0 2px 4px rgba(11,20,36,.04), 0 28px 56px -28px rgba(11,20,36,.30) !important;
  backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
  filter: none !important;
}

/* ===== Üst menü ile Portal girişi arasında ince dikey ayraç ===== */
.nav-portal { position: relative; }
.nav-portal::before { content: ""; position: absolute; left: -16px; top: 50%; transform: translateY(-50%); width: 1px; height: 20px; background: rgba(255,255,255,.16); }

/* Ürün kartları bir tık daha belirgin */
.acilir.izgara-3 a { background: rgba(255,255,255,.025); border: 1px solid rgba(255,255,255,.05); }
.acilir.izgara-3 a:hover { background: rgba(255,255,255,.07); border-color: color-mix(in srgb, var(--u) 45%, transparent); }
@media (max-width: 1180px) { .acilir.izgara-3 { grid-template-columns: repeat(2, 1fr); } }
.nav .kap { position: static; }
.acilir { top: calc(100% + 6px); }
.acilir::before { top: -14px; height: 14px; }
.acilir.izgara-3 a.acilir-alt, .acilir.izgara-2 a.acilir-alt { background: transparent; border: 0; border-top: 1px solid rgba(255,255,255,.07); border-radius: 0 !important; align-items: center; padding: 12px 12px 6px !important; }
/* Menü logonun yanında; paneller ait oldukları başlığın altından açılır */
.nav .kap { gap: 36px; }
.nav-menu { justify-content: flex-start; }
.nav-menu > li { position: relative; }
.acilir { left: -8px; transform: translateY(8px) scale(.98); transform-origin: 30px 0; }
.nav-menu > li.acik > .acilir { transform: none; }
.nav-portal { margin-left: auto; }

/* ==========================================================================
   Açılır menü: açık renk, sade açılış, temiz iç düzen
   ========================================================================== */
.menu-perdesi { background: rgba(6,18,34,.18); backdrop-filter: none; -webkit-backdrop-filter: none; }
.acilir {
  background: #fff; color: var(--metin);
  border: 1px solid var(--cizgi); border-radius: 12px; padding: 8px;
  box-shadow: 0 1px 2px rgba(11,20,36,.06), 0 16px 40px -12px rgba(11,20,36,.28);
  backdrop-filter: none; -webkit-backdrop-filter: none;
  top: calc(100% + 4px); left: -8px;
  opacity: 0; visibility: hidden; filter: none !important;
  transform: translateY(6px);
  transition: opacity .16s ease, transform .16s ease, visibility .16s;
}
.nav-menu > li.acik > .acilir { opacity: 1; visibility: visible; transform: none; transition: opacity .2s ease-out, transform .2s ease-out, visibility .2s; }
.acilir::after { display: none !important; }
.acilir > *, .nav-menu > li.acik > .acilir > * { opacity: 1 !important; transform: none !important; transition: none !important; }
.acilir.genis { width: 380px; display: block; }
.acilir.izgara-2 { width: 600px; }
.acilir:not(.genis):not(.izgara-2) { width: 280px; }
.acilir-baslik { color: var(--silik); font-size: 11px; letter-spacing: .1em; padding: 8px 12px 8px; border-bottom: 0; margin: 0; }
.acilir a, .acilir.izgara-2 a { display: flex; align-items: flex-start; gap: 12px; padding: 10px 12px; border-radius: 8px; border: 0; background: transparent; color: var(--murekkep); transition: background-color .15s; }
.acilir a::before { display: none; }
.acilir a:hover, .acilir.izgara-2 a:hover { background: var(--zemin-2); color: var(--murekkep); border-color: transparent; }
.acilir a b { font-family: var(--yazi); font-size: 14px; font-weight: 600; color: var(--murekkep); white-space: normal; line-height: 1.35; }
.acilir a small { font-size: 12.5px; color: var(--soluk); margin-top: 2px; line-height: 1.45; }
.acilir a > i:first-child, .acilir.izgara-2 a > i:first-child { width: 34px; height: 34px; border-radius: 8px; font-size: 18px; flex: none; color: var(--u, var(--mavi-600)); background: color-mix(in srgb, var(--u, var(--mavi-500)) 10%, #fff); transform: none !important; transition: none; }
.acilir a:hover > i:first-child { background: color-mix(in srgb, var(--u, var(--mavi-500)) 14%, #fff); color: var(--u, var(--mavi-600)); }
.acilir a:not(:has(small)) { align-items: center; }
.acilir a .dis { color: var(--silik); margin-left: auto; align-self: center; }
.acilir a:hover .dis { color: var(--mavi-600); }
.acilir-alt, .acilir.izgara-2 a.acilir-alt { margin: 4px -8px -8px; padding: 12px 20px !important; border-top: 1px solid var(--cizgi) !important; border-radius: 0 0 12px 12px !important; background: var(--zemin-2) !important; color: var(--mavi-600) !important; font-size: 13px; font-weight: 600; justify-content: space-between; align-items: center !important; }
.acilir-alt:hover { background: var(--zemin-3) !important; color: var(--mavi-700) !important; }
.acilir .acilir-alt > i:first-child { color: inherit !important; }
.nav-cizgi { display: none; }

/* Zengin beyaz paneller: sol liste + sağ öne çıkan kutu */
.acilir.zengin { display: grid; grid-template-columns: 1fr 250px; gap: 0; padding: 0; width: 640px; overflow: hidden; }
.acilir.zengin.iki-sutun { width: 820px; }
.acilir.zengin.dar-sol { width: 620px; }
.acilir-sol { padding: 8px; }
.acilir.zengin.iki-sutun .acilir-sol { display: grid; grid-template-columns: 1fr 1fr; align-content: start; gap: 0 4px; }
.acilir.zengin.iki-sutun .acilir-baslik { grid-column: 1 / -1; }
.acilir-yan { background: var(--zemin-2); border-left: 1px solid var(--cizgi); padding: 18px; display: flex; flex-direction: column; gap: 10px; }
.acilir-yan b { font-family: var(--yazi-baslik); font-size: 14.5px; font-weight: 600; color: var(--murekkep); line-height: 1.35; }
.acilir-yan p { margin: 0; font-size: 12.5px; color: var(--soluk); line-height: 1.55; }
.acilir .acilir-yan a { padding: 0; border-radius: 0; background: none; display: inline-flex; gap: 6px; align-items: center; }
.acilir .acilir-yan a:hover { background: none; }
.yan-foto { position: relative; display: block !important; height: 110px; border-radius: 10px !important; background-size: cover; background-position: center; overflow: hidden; }
.yan-foto::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 40%, rgba(6,26,48,.55)); }
.yan-foto span { position: absolute; z-index: 1; left: 10px; bottom: 10px; font-size: 10.5px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #fff; background: var(--mavi-500); padding: 3px 8px; border-radius: 5px; }
.acilir .yan-link { color: var(--mavi-600) !important; font-size: 13px; font-weight: 600; }
.acilir .yan-link i { transition: transform .2s; }
.acilir .yan-link:hover i { transform: translateX(3px); }
.acilir .yan-buton { margin-top: auto; justify-content: center; height: 38px; border-radius: 8px !important; background: var(--mavi-500) !important; color: #fff !important; font-size: 13px; font-weight: 600; }
.acilir .yan-buton:hover { background: var(--mavi-600) !important; }
.acilir .yan-tel { color: var(--metin) !important; font-size: 13px; font-weight: 600; justify-content: center; }
.acilir .yan-tel i { color: var(--mavi-500); }
.yan-ikon { width: 40px; height: 40px; border-radius: 10px; display: grid; place-items: center; font-size: 21px; color: var(--mavi-600); background: var(--mavi-50); border: 1px solid var(--mavi-100); }
.yan-ikon.yesil { color: #0B7A51; background: #E7F7F0; border-color: #CDEFE0; }
.acilir.zengin > .acilir-alt { grid-column: 1 / -1; margin: 0; border-radius: 0 !important; }
.acilir .destek-kutu { margin-top: 6px; border: 1px dashed var(--cizgi-2) !important; }
.acilir .destek-kutu:hover { border-color: var(--mavi-200) !important; }
@media (max-width: 1180px) { .acilir.zengin.iki-sutun { width: 640px; } .acilir.zengin.iki-sutun .acilir-sol { grid-template-columns: 1fr; } }
.acilir.zengin { width: 660px !important; }
.acilir.zengin.iki-sutun { width: 840px !important; }
.acilir.zengin.dar-sol { width: 640px !important; }
.acilir:not(.zengin):not(.genis):not(.izgara-2) { width: 340px; }
.acilir .acilir-yan a > i:first-child { width: auto; height: auto; background: none !important; color: inherit !important; font-size: 15px; border-radius: 0; }
.acilir .yan-tel > i:first-child { color: var(--mavi-500) !important; }
@media (max-width: 1180px) { .acilir.zengin.iki-sutun { width: 660px !important; } }
.sinema-buton { margin-bottom: 0; }

/* Ürün şeridi v2: videonun üstüne binen ayrı cam-beyaz kartlar */
.sinema-ic { padding-bottom: 230px; }
.sinema-asagi { display: none; }
.sinema + .urun-serit.v2 { margin-top: -190px; }
.urun-serit.v2 { position: relative; z-index: 6; }
.urun-serit-bas { display: flex; align-items: center; justify-content: space-between; margin: 0 4px 14px; }
.urun-serit-bas span { font-family: var(--yazi-baslik); font-size: 12px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: #9FC6E6; }
.urun-serit-bas a { display: inline-flex; align-items: center; gap: 6px; font-size: 13.5px; font-weight: 600; color: #fff; opacity: .85; transition: opacity .2s; }
.urun-serit-bas a:hover { opacity: 1; }
.urun-serit-bas a i { transition: transform .25s var(--gecis); }
.urun-serit-bas a:hover i { transform: translateX(3px); }
.urun-serit.v2 .urun-serit-ic { display: grid; grid-template-columns: repeat(5, 1fr); gap: 14px; background: none; box-shadow: none; border-radius: 0; overflow: visible; }
.urun-serit.v2 .urun-kutu {
  position: relative; display: flex; flex-direction: column; gap: 10px; padding: 22px 20px 20px; min-height: 196px;
  background: rgba(255,255,255,.97); border: 1px solid rgba(255,255,255,.6); border-radius: 16px; border-right: 1px solid rgba(255,255,255,.6) !important;
  box-shadow: 0 1px 2px rgba(6,26,48,.08), 0 22px 44px -22px rgba(6,26,48,.6);
  overflow: hidden; transition: transform .35s var(--gecis), box-shadow .35s var(--gecis);
  opacity: 0; animation: kutuGel .8s var(--gecis) forwards; animation-delay: calc(.5s + var(--s) * .08s);
}
@keyframes kutuGel { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: none; } }
.urun-serit.v2 .urun-kutu::before { top: auto; bottom: 0; height: 3px; transform: scaleX(0); background: var(--u); }
.urun-serit.v2 .urun-kutu:hover { transform: translateY(-6px); box-shadow: 0 1px 2px rgba(6,26,48,.08), 0 30px 54px -22px rgba(6,26,48,.7); background: #fff; }
.urun-serit.v2 .urun-kutu:hover::before { transform: scaleX(1); }
.urun-serit.v2 .ust { display: flex; align-items: center; justify-content: space-between; margin-bottom: 6px; }
.urun-serit.v2 .ikon { width: 44px; height: 44px; border-radius: 12px; font-size: 22px; box-shadow: none; color: var(--u); background: color-mix(in srgb, var(--u) 11%, #fff); transform: none !important; transition: background-color .3s, color .3s; }
.urun-serit.v2 .urun-kutu:hover .ikon { background: var(--u); color: #fff; }
.urun-serit.v2 .modul { font-size: 11px; font-weight: 600; color: var(--silik); background: var(--zemin-2); border: 1px solid var(--cizgi); padding: 3px 8px; border-radius: 999px; }
.urun-serit.v2 b { font-family: var(--yazi-baslik); font-size: 15.5px; font-weight: 600; line-height: 1.3; color: var(--murekkep); letter-spacing: -.01em; }
.urun-serit.v2 small { display: block !important; font-size: 13px; color: var(--soluk); line-height: 1.5; }
.urun-serit.v2 .ok { margin-top: auto; font-size: 13px; font-weight: 600; color: var(--u); opacity: .0; transform: translateX(-6px); transition: opacity .25s, transform .3s var(--gecis); }
.urun-serit.v2 .urun-kutu:hover .ok { opacity: 1; transform: none; }
@media (hover: none) { .urun-serit.v2 .ok { opacity: 1; transform: none; } }
@media (max-width: 1180px) { .urun-serit.v2 .urun-serit-ic { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 720px) {
  .sinema-ic { padding-bottom: 150px; }
  .sinema + .urun-serit.v2 { margin-top: -110px; }
  .urun-serit.v2 .urun-serit-ic { grid-template-columns: 1fr 1fr; gap: 10px; }
  .urun-serit.v2 .urun-kutu { min-height: 0; padding: 16px; }
  .urun-serit.v2 .urun-kutu:last-child:nth-child(odd) { grid-column: 1 / -1; flex-direction: column; align-items: stretch; }
  .urun-serit.v2 .modul { display: none; }
  .urun-serit.v2 small { display: none !important; }
}
@media (prefers-reduced-motion: reduce) { .urun-serit.v2 .urun-kutu { animation: none; opacity: 1; } }

/* Ürün şeridi v3: giriş ekranıyla bütünleşik koyu cam kartlar */
.sinema-ic { padding-bottom: 300px; }
.sinema + .urun-serit.v2 { margin-top: -290px; }
.urun-serit.v2 { padding-bottom: 8px; }
.urun-serit-bas span { color: #7FC4EE; }
.urun-serit.v2 .urun-kutu {
  background: linear-gradient(160deg, rgba(20,44,76,.62), rgba(8,22,42,.72));
  border: 1px solid rgba(120,180,230,.24) !important;
  backdrop-filter: blur(16px) saturate(140%); -webkit-backdrop-filter: blur(16px) saturate(140%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.07), 0 24px 50px -28px rgba(0,0,0,.8);
  min-height: 186px;
}
.urun-serit.v2 .urun-kutu::before { top: 0; bottom: auto; height: 2px; }
.urun-serit.v2 .urun-kutu::after { content: ""; position: absolute; right: -40px; top: -40px; width: 140px; height: 140px; border-radius: 50%; background: radial-gradient(closest-side, color-mix(in srgb, var(--u) 40%, transparent), transparent); opacity: .35; transition: opacity .4s; pointer-events: none; }
.urun-serit.v2 .urun-kutu:hover { background: linear-gradient(160deg, rgba(26,56,96,.78), rgba(10,28,52,.85)); border-color: color-mix(in srgb, var(--u) 55%, rgba(120,180,230,.3)) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 30px 60px -26px rgba(0,0,0,.85); }
.urun-serit.v2 .urun-kutu:hover::after { opacity: .8; }
.urun-serit.v2 .ikon { color: #fff; background: color-mix(in srgb, var(--u) 75%, #0A2540); box-shadow: 0 10px 22px -10px var(--u); }
.urun-serit.v2 .urun-kutu:hover .ikon { background: var(--u); }
.urun-serit.v2 .modul { color: #A9C6E0; background: rgba(255,255,255,.06); border-color: rgba(255,255,255,.12); }
.urun-serit.v2 b { color: #fff; }
.urun-serit.v2 small { color: #9DB3CB; }
.urun-serit.v2 .ok { color: color-mix(in srgb, var(--u) 45%, #fff); }
/* Ürün şeridinin altı: koyudan beyaza yumuşak geçiş */
.urun-serit.v2 + .guven-serit { padding-top: 64px; }
@media (max-width: 720px) {
  .sinema-ic { padding-bottom: 170px; }
  .sinema + .urun-serit.v2 { margin-top: -160px; }
}
/* Koyu zemin ürün şeridinin tamamını kapsasın */
.urun-serit.v2::before { content: ""; position: absolute; z-index: -1; left: 50%; width: 100vw; transform: translateX(-50%); top: 290px; bottom: -56px; background: #040B16; pointer-events: none; }
.urun-serit.v2 + .guven-serit { padding-top: 104px; }
@media (max-width: 720px) { .urun-serit.v2::before { top: 160px; bottom: -40px; } .urun-serit.v2 + .guven-serit { padding-top: 80px; } }

/* Ürün şeridi v4: giriş diliyle uyumlu tek cam panel, ortalanmış bölmeler */
.urun-serit.v3 .urun-serit-bas { justify-content: center; gap: 18px; margin: 0 0 22px; }
.urun-serit.v3 .urun-serit-bas span { display: flex; align-items: center; gap: 18px; font-size: 12px; font-weight: 500; letter-spacing: .28em; color: #7FC4EE; }
.urun-serit.v3 .urun-serit-bas span::before, .urun-serit.v3 .urun-serit-bas span::after { content: ""; width: 56px; height: 1px; background: linear-gradient(90deg, transparent, rgba(127,196,238,.6)); }
.urun-serit.v3 .urun-serit-bas span::after { transform: scaleX(-1); }
.urun-serit.v3 .urun-serit-ic {
  display: grid; grid-template-columns: repeat(5, 1fr); gap: 0;
  border-radius: 18px; overflow: hidden;
  background: linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.025));
  border: 1px solid rgba(160,200,235,.18);
  backdrop-filter: blur(18px) saturate(140%); -webkit-backdrop-filter: blur(18px) saturate(140%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 30px 70px -30px rgba(0,0,0,.8);
  opacity: 0; animation: kutuGel .9s .45s var(--gecis) forwards;
}
.urun-serit.v3 .urun-kutu {
  align-items: center; text-align: center; gap: 0; min-height: 0; padding: 30px 22px 26px;
  background: transparent !important; border: 0 !important; border-radius: 0; box-shadow: none !important;
  backdrop-filter: none; -webkit-backdrop-filter: none;
  border-right: 1px solid rgba(160,200,235,.12) !important;
  opacity: 1; animation: none; transform: none !important;
  transition: background-color .35s var(--gecis);
}
.urun-serit.v3 .urun-kutu:last-child { border-right: 0 !important; }
.urun-serit.v3 .urun-kutu::after { display: none; }
.urun-serit.v3 .urun-kutu::before { top: auto; bottom: 0; left: 50%; right: auto; width: 0; height: 2px; transform: translateX(-50%); background: var(--u); transition: width .45s var(--gecis); }
.urun-serit.v3 .urun-kutu:hover { background: rgba(255,255,255,.05) !important; }
.urun-serit.v3 .urun-kutu:hover::before { width: 60%; transform: translateX(-50%); }
.urun-serit.v3 .ikon { width: 56px; height: 56px; border-radius: 50%; margin: 0 auto 18px; font-size: 24px; color: color-mix(in srgb, var(--u) 50%, #fff); background: transparent; border: 1px solid color-mix(in srgb, var(--u) 55%, transparent); box-shadow: 0 0 0 6px color-mix(in srgb, var(--u) 9%, transparent); transition: background-color .35s, color .35s, box-shadow .35s, border-color .35s; }
.urun-serit.v3 .urun-kutu:hover .ikon { background: var(--u); color: #fff; border-color: var(--u); box-shadow: 0 0 0 8px color-mix(in srgb, var(--u) 18%, transparent), 0 12px 28px -10px var(--u); }
.urun-serit.v3 b { font-family: var(--yazi-baslik); font-size: 15px; font-weight: 500; line-height: 1.35; color: #fff; letter-spacing: 0; min-height: 40px; display: flex; align-items: center; justify-content: center; }
.urun-serit.v3 small { margin-top: 6px; font-size: 12.5px; color: #93A9C2; letter-spacing: .01em; }
.urun-serit.v3 .ok { margin-top: 14px; justify-content: center; display: inline-flex; gap: 6px; font-size: 12px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: color-mix(in srgb, var(--u) 40%, #fff); opacity: 0; transform: translateY(-4px); transition: opacity .3s, transform .35s var(--gecis); }
.urun-serit.v3 .urun-kutu:hover .ok { opacity: 1; transform: none; }
@media (hover: none) { .urun-serit.v3 .ok { opacity: .9; transform: none; } }
@media (max-width: 1180px) {
  .urun-serit.v3 .urun-serit-ic { grid-template-columns: repeat(3, 1fr); }
  .urun-serit.v3 .urun-kutu { border-bottom: 1px solid rgba(160,200,235,.12) !important; }
  .urun-serit.v3 .urun-kutu:nth-child(3) { border-right: 0 !important; }
}
@media (max-width: 720px) {
  .urun-serit.v3 .urun-serit-ic { grid-template-columns: 1fr 1fr; }
  .urun-serit.v3 .urun-kutu { padding: 22px 12px 18px; border-right: 1px solid rgba(160,200,235,.12) !important; }
  .urun-serit.v3 .urun-kutu:nth-child(2n) { border-right: 0 !important; }
  .urun-serit.v3 .urun-kutu:nth-child(3) { border-right: 1px solid rgba(160,200,235,.12) !important; }
  .urun-serit.v3 .urun-kutu:last-child:nth-child(odd) { grid-column: 1 / -1; border-right: 0 !important; border-bottom: 0 !important; }
  .urun-serit.v3 .ikon { width: 46px; height: 46px; font-size: 20px; margin-bottom: 12px; }
  .urun-serit.v3 b { font-size: 13.5px; min-height: 36px; }
  .urun-serit.v3 small { display: none !important; }
  .urun-serit.v3 .urun-serit-bas span::before, .urun-serit.v3 .urun-serit-bas span::after { width: 28px; }
}

/* Başlık v2: kalın, sıkı, kelime kelime açılan; 'dijital' parıltılı ve altı çizili */
.sinema-baslik.v2 { font-family: var(--yazi-baslik); font-weight: 600; text-transform: none; letter-spacing: -.035em; line-height: 1.02; font-size: clamp(3rem, 7.2vw, 6.4rem); margin-bottom: 28px; text-shadow: 0 8px 40px rgba(0,0,0,.45); opacity: 1; transform: none; animation: none; }
.sinema-baslik.v2 .kelime { display: inline-block; overflow: hidden; vertical-align: top; padding: 0 .04em .12em; margin: 0 -.02em; }
.sinema-baslik.v2 .kelime > span { display: inline-block; transform: translateY(105%); animation: kelimeGel 1s cubic-bezier(.16,1,.3,1) forwards; }
.sinema-baslik.v2 .kelime:nth-child(2) > span { animation-delay: .12s; }
.sinema-baslik.v2 .kelime:nth-child(3) > span { animation-delay: .24s; }
@keyframes kelimeGel { to { transform: none; } }
.sinema-baslik.v2 .vurgu { overflow: visible; }
.sinema-baslik.v2 .vurgu > span { position: relative; background: linear-gradient(100deg, #3E8EF0 0%, #4FC3F7 35%, #CFF1FF 50%, #4FC3F7 65%, #3E8EF0 100%); background-size: 220% 100%; background-position: 100% 0; -webkit-background-clip: text; background-clip: text; color: transparent; text-shadow: none; filter: drop-shadow(0 8px 30px rgba(62,142,240,.35)); animation: kelimeGel 1s .12s cubic-bezier(.16,1,.3,1) forwards, parilti 6s 1.4s ease-in-out infinite; }
.sinema-baslik.v2 .vurgu { clip-path: inset(-20% -10% -40% -10%); }
@keyframes parilti { 0%, 100% { background-position: 100% 0; } 50% { background-position: 0% 0; } }
.sinema-baslik.v2 .cizgi { position: absolute; left: 2%; right: 2%; bottom: -.08em; width: 96%; height: .22em; overflow: visible; }
.sinema-baslik.v2 .cizgi path { fill: none; stroke: url(#cizgiRenk); stroke: #4FC3F7; stroke-width: 5; stroke-linecap: round; stroke-dasharray: 320; stroke-dashoffset: 320; opacity: .9; animation: ciz 1.1s 1s cubic-bezier(.65,0,.35,1) forwards; }
.sinema-alt.v2 { font-family: var(--yazi); font-weight: 400; text-transform: none; letter-spacing: 0; font-size: clamp(1.02rem, 1.35vw, 1.22rem); line-height: 1.6; color: #C2D3E5; max-width: 640px; margin: 0 auto 42px; }
@media (max-width: 720px) {
  .sinema-baslik.v2 { font-size: 2.9rem; letter-spacing: -.03em; }
  .sinema-alt.v2 { font-size: 1rem; margin-bottom: 30px; }
}
@media (prefers-reduced-motion: reduce) {
  .sinema-baslik.v2 .kelime > span { transform: none; animation: none; }
  .sinema-baslik.v2 .cizgi path { stroke-dashoffset: 0; animation: none; }
}

/* Giriş butonları v2 */
.sinema-buton.v2 { display: flex; align-items: center; justify-content: center; gap: 14px; flex-wrap: wrap; opacity: 0; transform: translateY(22px); animation: yukari 1.1s .5s var(--gecis) forwards; }
/* Giriş butonları: tek satır, sade. Ana: beyaz zemin, lacivert yazı, mavi ok; ikincil: ince çerçeve. Açıklama butonların altında not olarak. */
.cta-ana {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  height: 54px; padding: 0 22px 0 26px; border-radius: 10px;
  background: #fff; color: #0B1B2E;
  font-family: var(--yazi-baslik); font-size: 15.5px; font-weight: 600; letter-spacing: -.01em; white-space: nowrap;
  box-shadow: 0 1px 2px rgba(0,0,0,.2), 0 12px 30px -14px rgba(0,0,0,.6);
  transition: transform .3s var(--gecis), box-shadow .3s var(--gecis), background-color .2s;
}
.cta-ana i { font-size: 18px; color: var(--mavi-500); transition: transform .35s var(--gecis); }
.cta-ana:hover { transform: translateY(-1px); background: #EEF5FB; box-shadow: 0 1px 2px rgba(0,0,0,.2), 0 18px 38px -16px rgba(0,0,0,.7); }
.cta-ana:hover i { transform: translateX(4px); }
.cta-ana:active { transform: translateY(0); }
.cta-ikincil {
  display: inline-flex; align-items: center; justify-content: center; height: 54px; padding: 0 24px; border-radius: 10px;
  font-family: var(--yazi-baslik); font-size: 15.5px; font-weight: 500; color: #fff; white-space: nowrap;
  background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.24);
  transition: background-color .25s, border-color .25s, transform .3s var(--gecis);
}
.cta-ikincil:hover { background: rgba(255,255,255,.1); border-color: rgba(255,255,255,.45); transform: translateY(-1px); }
.cta-ana:focus-visible, .cta-ikincil:focus-visible { outline: 2px solid #7FC4EE; outline-offset: 3px; }
.cta-not { flex-basis: 100%; display: flex; align-items: center; gap: 8px; margin: 4px 0 0; font-size: 13.5px; color: #A9BCD2; }
.cta-not i { font-size: 16px; color: #7FC4EE; }
@media (max-width: 720px) {
  .sinema-buton.v2 { flex-direction: column; align-items: stretch; }
  .cta-not { justify-content: center; }
}
.sinema-baslik.v2 .kelime > span { background: none; -webkit-background-clip: initial; background-clip: initial; color: #fff; font-weight: 600; }
.sinema-baslik.v2 .vurgu > span { background: linear-gradient(100deg, #3E8EF0 0%, #4FC3F7 35%, #CFF1FF 50%, #4FC3F7 65%, #3E8EF0 100%); background-size: 220% 100%; -webkit-background-clip: text; background-clip: text; color: transparent; }

/* Duyuru rozeti ve güven satırı */
.duyuru-rozet { display: inline-flex; align-items: center; gap: 10px; padding: 5px 14px 5px 5px; margin-bottom: 30px; border-radius: 999px; font-size: 13.5px; color: #D6E4F2; background: rgba(12,28,50,.5); border: 1px solid rgba(160,200,235,.28); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); transition: border-color .25s, background-color .25s; }
.duyuru-rozet:hover { border-color: rgba(160,210,245,.6); background: rgba(20,44,76,.6); }
.duyuru-rozet .yeni { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: 999px; font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #fff; background: linear-gradient(95deg, #2F7FD8, #1F9BCF); }
.duyuru-rozet .yeni::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: #7CF0C2; box-shadow: 0 0 0 3px rgba(124,240,194,.25); animation: yanip 1.8s infinite; }
.duyuru-rozet i { color: #7FC4EE; transition: transform .25s var(--gecis); }
.duyuru-rozet:hover i { transform: translateX(3px); }
.guven-satir { display: flex; align-items: center; justify-content: center; gap: 14px; margin-top: 34px; opacity: 0; animation: yukari 1s .75s var(--gecis) forwards; transform: translateY(16px); }
.logo-dizi { display: flex; }
.logo-dizi span { width: 34px; height: 34px; border-radius: 50%; background: #fff; border: 2px solid #0A1A2E; display: grid; place-items: center; overflow: hidden; margin-left: -9px; box-shadow: 0 4px 10px -4px rgba(0,0,0,.5); }
.logo-dizi span:first-child { margin-left: 0; }
.logo-dizi img { width: 26px; height: 26px; object-fit: contain; }
.logo-dizi .arti { background: var(--mavi-500); color: #fff; font-weight: 700; font-size: 15px; }
.guven-satir p { margin: 0; font-size: 14px; color: #A9BCD2; }
.guven-satir b { color: #fff; font-weight: 600; }
/* Referanslar sayfasına bağlantı: üzerine gelince logolar hafifçe açılır, ok kayar */
a.guven-satir { color: inherit; text-decoration: none; border-radius: 10px; }
.guven-satir .bolunmez { white-space: nowrap; }
.guven-satir .logo-dizi span { transition: margin-left .35s var(--gecis), transform .35s var(--gecis); }
.guven-satir p i { display: inline-block; margin-left: 4px; font-size: 14px; vertical-align: -1px; color: #7FC4EE; transition: transform .3s var(--gecis); }
.guven-satir p b { transition: color .25s; }
a.guven-satir:hover .logo-dizi span:not(:first-child) { margin-left: -4px; }
a.guven-satir:hover p b { color: #7FC4EE; }
a.guven-satir:hover p i { transform: translateX(4px); }
a.guven-satir:focus-visible { outline: 2px solid #7FC4EE; outline-offset: 6px; }
.sinema-ic { padding-bottom: 290px; }
@media (max-width: 720px) { .duyuru-rozet { font-size: 12px; } .guven-satir { flex-direction: column; gap: 10px; } .guven-satir p { font-size: 13px; } }
.sinema-ic { padding-bottom: 320px; } .sinema + .urun-serit.v2 { margin-top: -286px; } .urun-serit.v2::before { top: 286px; }

/* Ürün ailemiz v5: tek cam panel içinde fotoğraf kapaklı ürün bölmeleri */
.urun-serit.v4 .urun-serit-bas { justify-content: center; margin: 0 0 22px; }
.urun-serit.v4 .urun-serit-bas span { display: flex; align-items: center; gap: 18px; font-size: 12px; font-weight: 500; letter-spacing: .28em; text-transform: uppercase; color: #7FC4EE; }
.urun-serit.v4 .urun-serit-bas span::before, .urun-serit.v4 .urun-serit-bas span::after { content: ""; width: 56px; height: 1px; background: linear-gradient(90deg, transparent, rgba(127,196,238,.6)); }
.urun-serit.v4 .urun-serit-bas span::after { transform: scaleX(-1); }
.urun-serit.v4 .urun-serit-ic {
  display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px; padding: 10px;
  border-radius: 22px; background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03));
  border: 1px solid rgba(160,200,235,.2); backdrop-filter: blur(18px) saturate(140%); -webkit-backdrop-filter: blur(18px) saturate(140%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 30px 70px -30px rgba(0,0,0,.85);
  opacity: 0; animation: kutuGel .9s .45s var(--gecis) forwards;
}
.urun-serit.v4 .urun-kutu {
  position: relative; display: flex; flex-direction: column; gap: 0; padding: 0; min-height: 0; overflow: hidden;
  border-radius: 14px; background: rgba(6,18,34,.55) !important; border: 1px solid rgba(160,200,235,.12) !important;
  box-shadow: none !important; backdrop-filter: none; -webkit-backdrop-filter: none; opacity: 1; animation: none;
  transition: transform .4s var(--gecis), border-color .3s, background-color .3s, box-shadow .4s var(--gecis);
}
.urun-serit.v4 .urun-kutu::before, .urun-serit.v4 .urun-kutu::after { display: none; }
.urun-serit.v4 .kapak { position: relative; display: block; height: 92px; background-size: cover; background-position: center; filter: saturate(.85) brightness(.85); transition: transform .9s var(--gecis), filter .5s; }
.urun-serit.v4 .kapak::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, color-mix(in srgb, var(--u) 30%, transparent) 0%, rgba(6,18,34,.15) 45%, rgba(6,18,34,.92) 100%); }
.urun-serit.v4 .ikon { position: absolute; left: 16px; top: 68px; z-index: 2; width: 44px; height: 44px; border-radius: 12px; margin: 0; font-size: 21px; color: #fff; background: var(--u); border: 2px solid rgba(6,18,34,.9); box-shadow: 0 10px 22px -10px var(--u); transition: transform .4s var(--gecis); }
.urun-serit.v4 .govde { display: block; padding: 30px 16px 6px; text-align: left; }
.urun-serit.v4 b { display: block; min-height: 0; font-family: var(--yazi-baslik); font-size: 14.5px; font-weight: 600; line-height: 1.35; color: #fff; letter-spacing: -.005em; text-align: left; }
.urun-serit.v4 small { display: block !important; margin-top: 5px; font-size: 12.5px; color: #93A9C2; line-height: 1.45; text-align: left; }
.urun-serit.v4 .alt-satir { margin-top: auto; display: flex; align-items: center; justify-content: space-between; padding: 12px 16px 14px; border-top: 1px solid rgba(160,200,235,.1); font-size: 11.5px; font-weight: 600; color: #7F95AF; letter-spacing: .02em; }
.urun-serit.v4 .alt-satir .ok { margin: 0; display: inline-flex; align-items: center; gap: 5px; opacity: 1; transform: none; font-size: 12px; letter-spacing: 0; text-transform: none; color: color-mix(in srgb, var(--u) 45%, #fff); }
.urun-serit.v4 .alt-satir .ok i { transition: transform .3s var(--gecis); }
.urun-serit.v4 .urun-kutu:hover { transform: translateY(-5px); border-color: color-mix(in srgb, var(--u) 55%, rgba(160,200,235,.2)) !important; background: rgba(10,26,48,.75) !important; box-shadow: 0 24px 40px -22px rgba(0,0,0,.9) !important; }
.urun-serit.v4 .urun-kutu:hover .kapak { transform: scale(1.08); filter: saturate(1) brightness(.95); }
.urun-serit.v4 .urun-kutu:hover .ikon { transform: translateY(-3px) rotate(-6deg); }
.urun-serit.v4 .urun-kutu:hover .alt-satir .ok i { transform: translateX(4px); }
.urun-serit.v4 .urun-kutu { animation: kutuGel .8s var(--gecis) both; animation-delay: calc(.6s + var(--s) * .08s); }
@media (max-width: 1180px) { .urun-serit.v4 .urun-serit-ic { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 720px) {
  .urun-serit.v4 .urun-serit-ic { grid-template-columns: 1fr 1fr; gap: 8px; padding: 8px; }
  .urun-serit.v4 .urun-kutu:last-child:nth-child(odd) { grid-column: 1 / -1; }
  .urun-serit.v4 .kapak { height: 70px; }
  .urun-serit.v4 .ikon { top: 48px; width: 38px; height: 38px; font-size: 18px; left: 12px; }
  .urun-serit.v4 .govde { padding: 24px 12px 4px; }
  .urun-serit.v4 b { font-size: 13px; }
  .urun-serit.v4 small { display: none !important; }
  .urun-serit.v4 .alt-satir { padding: 10px 12px; }
  .urun-serit.v4 .alt-satir > span:first-child { display: none; }
  .urun-serit.v4 .urun-serit-bas span::before, .urun-serit.v4 .urun-serit-bas span::after { width: 28px; }
}
@media (prefers-reduced-motion: reduce) { .urun-serit.v4 .urun-kutu { animation: none; } }
html, body { overflow-x: clip !important; }

/* Referanslar */
.referans-bolum { padding: 120px 0 96px; background: #fff; position: relative; }
.urun-serit.v2 + .referans-bolum { padding-top: 150px; }
.referans-bas { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 44px; }
.referans-bas h2 { font-family: var(--yazi-baslik); font-size: clamp(1.7rem, 2.8vw, 2.4rem); font-weight: 600; letter-spacing: -.025em; line-height: 1.15; margin-top: 14px; }
.ref-kayan { overflow: hidden; padding: 8px 0; -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.ref-kayan + .ref-kayan { margin-top: 6px; }
.ref-kayan-ic { display: flex; gap: 16px; width: max-content; animation: kay 70s linear infinite; }
.ref-kayan.ters .ref-kayan-ic { animation-direction: reverse; animation-duration: 80s; }
.ref-kayan:hover .ref-kayan-ic { animation-play-state: paused; }
.ref-karo { width: 180px; height: 92px; flex: none; display: grid; place-items: center; padding: 16px 22px; border-radius: 14px; background: #fff; border: 1px solid var(--cizgi); box-shadow: 0 1px 2px rgba(11,20,36,.04); transition: transform .35s var(--gecis), box-shadow .35s var(--gecis), border-color .3s; }
.ref-karo img { max-width: 100%; max-height: 56px; width: auto; height: auto; object-fit: contain; filter: grayscale(1) contrast(.95); opacity: .62; mix-blend-mode: multiply; transition: filter .35s, opacity .35s; }
.ref-karo:hover { transform: translateY(-4px); box-shadow: 0 16px 30px -16px rgba(11,20,36,.3); border-color: var(--cizgi-2); }
.ref-karo:hover img { filter: none; opacity: 1; }
@media (max-width: 720px) {
  .referans-bolum { padding: 72px 0 64px; }
  .urun-serit.v2 + .referans-bolum { padding-top: 110px; }
  .referans-bas { flex-direction: column; align-items: flex-start; margin-bottom: 28px; }
  .referans-bas h2 br { display: none; }
  .ref-karo { width: 140px; height: 76px; padding: 12px 16px; }
  .ref-karo img { max-height: 44px; }
}
@media (prefers-reduced-motion: reduce) { .ref-kayan-ic { animation: none; flex-wrap: wrap; width: auto; justify-content: center; } }
.referans-bas { align-items: center; margin-bottom: 30px; }

/* Referanslar v2: gri bant, çizgili yuvalar */
.referans-bolum.v2 { background: var(--zemin-2); padding: 96px 0 72px; }
.urun-serit.v2 + .referans-bolum.v2 { padding-top: 140px; }
.ref-etiket { display: flex; justify-content: center; margin-bottom: 36px; }
.ref-etiket span { display: flex; align-items: center; gap: 18px; font-family: var(--yazi-baslik); font-size: 12px; font-weight: 600; letter-spacing: .28em; text-transform: uppercase; color: var(--mavi-600); }
.ref-etiket span::before, .ref-etiket span::after { content: ""; width: 64px; height: 1px; background: linear-gradient(90deg, transparent, var(--mavi-300)); }
.ref-etiket span::after { transform: scaleX(-1); }
.ref-bant { border-top: 1px solid var(--cizgi-2); border-bottom: 1px solid var(--cizgi-2); background: #fff; }
.referans-bolum.v2 .ref-kayan { padding: 0; -webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); }
.referans-bolum.v2 .ref-kayan + .ref-kayan { margin-top: 0; border-top: 1px solid var(--cizgi); }
.referans-bolum.v2 .ref-kayan-ic { gap: 0; }
.ref-yuva { width: 224px; height: 118px; flex: none; display: grid; place-items: center; padding: 16px 26px; border-right: 1px solid var(--cizgi); transition: background-color .3s; }
.ref-yuva img { max-width: 100%; max-height: 70px; width: auto; height: auto; object-fit: contain; filter: grayscale(1) contrast(.9); opacity: .55; mix-blend-mode: multiply; transition: filter .35s, opacity .35s, transform .35s var(--gecis); }
.ref-yuva:hover { background: var(--zemin-2); }
.ref-yuva:hover img { filter: none; opacity: 1; transform: scale(1.05); }
.ref-alt { display: flex; justify-content: center; margin-top: 30px; }
.ref-alt a { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 600; color: var(--mavi-600); }
.ref-alt a i { transition: transform .3s var(--gecis); }
.ref-alt a:hover i { transform: translateX(4px); }
@media (max-width: 720px) {
  .referans-bolum.v2 { padding: 64px 0 52px; }
  .urun-serit.v2 + .referans-bolum.v2 { padding-top: 100px; }
  .ref-yuva { width: 190px; height: 110px; padding: 12px 16px; }
  .ref-yuva img { max-height: 70px; }
  .ref-etiket span::before, .ref-etiket span::after { width: 32px; }
}

/* Ürün ailemiz v6: minimal şerit (panel/kutu/fotoğraf yok) */
.urun-serit.v5 .urun-serit-bas { justify-content: center; margin: 0 0 18px; }
.urun-serit.v5 .urun-serit-bas span { display: flex; align-items: center; gap: 18px; font-size: 12px; font-weight: 500; letter-spacing: .28em; text-transform: uppercase; color: #7FC4EE; }
.urun-serit.v5 .urun-serit-bas span::before, .urun-serit.v5 .urun-serit-bas span::after { content: ""; width: 56px; height: 1px; background: linear-gradient(90deg, transparent, rgba(127,196,238,.6)); }
.urun-serit.v5 .urun-serit-bas span::after { transform: scaleX(-1); }
.urun-serit.v5 .urun-serit-ic { display: grid; grid-template-columns: repeat(5, 1fr); gap: 0; padding: 0; background: none; border: 0; border-radius: 0; box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none; border-top: 1px solid rgba(160,200,235,.18); border-bottom: 1px solid rgba(160,200,235,.18); opacity: 0; animation: kutuGel .9s .45s var(--gecis) forwards; }
.urun-serit.v5 .urun-kutu { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 0; padding: 26px 16px 24px; min-height: 0; background: transparent !important; border: 0 !important; border-right: 1px solid rgba(160,200,235,.12) !important; border-radius: 0; box-shadow: none !important; backdrop-filter: none; -webkit-backdrop-filter: none; opacity: 1; animation: none; transform: none !important; overflow: visible; transition: background-color .3s; }
.urun-serit.v5 .urun-kutu:last-child { border-right: 0 !important; }
.urun-serit.v5 .urun-kutu::before { content: ""; display: block; position: absolute; top: -1px; bottom: auto; left: 50%; width: 0; height: 1px; transform: translateX(-50%); background: var(--u); transition: width .45s var(--gecis); }
.urun-serit.v5 .urun-kutu::after { display: none; }
.urun-serit.v5 .urun-kutu:hover { background: linear-gradient(180deg, rgba(255,255,255,.04), transparent) !important; }
.urun-serit.v5 .urun-kutu:hover::before { width: 70%; }
.urun-serit.v5 .ikon { width: 46px; height: 46px; margin: 0 auto 14px; border-radius: 50%; font-size: 21px; color: color-mix(in srgb, var(--u) 45%, #fff); background: transparent; border: 1px solid color-mix(in srgb, var(--u) 50%, rgba(255,255,255,.1)); box-shadow: none; transition: background-color .3s, color .3s, border-color .3s; }
.urun-serit.v5 .urun-kutu:hover .ikon { background: var(--u); color: #fff; border-color: var(--u); }
.urun-serit.v5 b { font-family: var(--yazi-baslik); font-size: 14.5px; font-weight: 500; line-height: 1.35; color: #fff; text-align: center; }
.urun-serit.v5 small { display: block !important; margin-top: 5px; font-size: 12.5px; color: #8EA4BD; text-align: center; }
@media (max-width: 1180px) { .urun-serit.v5 .urun-serit-ic { grid-template-columns: repeat(3, 1fr); } .urun-serit.v5 .urun-kutu { border-bottom: 1px solid rgba(160,200,235,.12) !important; } .urun-serit.v5 .urun-kutu:nth-child(3) { border-right: 0 !important; } }
@media (max-width: 720px) {
  .urun-serit.v5 .urun-serit-ic { grid-template-columns: 1fr 1fr; }
  .urun-serit.v5 .urun-kutu { padding: 20px 10px; border-right: 1px solid rgba(160,200,235,.12) !important; }
  .urun-serit.v5 .urun-kutu:nth-child(2n) { border-right: 0 !important; }
  .urun-serit.v5 .urun-kutu:nth-child(3) { border-right: 1px solid rgba(160,200,235,.12) !important; }
  .urun-serit.v5 .urun-kutu:last-child:nth-child(odd) { grid-column: 1 / -1; border-right: 0 !important; border-bottom: 0 !important; }
  .urun-serit.v5 small { display: none !important; }
  .urun-serit.v5 b { font-size: 13px; }
  .urun-serit.v5 .urun-serit-bas span::before, .urun-serit.v5 .urun-serit-bas span::after { width: 28px; }
}
.referans-bolum.v2 { padding-bottom: 96px; }
.referans-bolum.v2 .ref-kayan-ic { animation-duration: 110s; }

/* Referans şeridi: sürüklenebilir + ok butonları (JS ile kayar) */
.ref-bant { position: relative; }
.referans-bolum.v2 .ref-kayan { cursor: grab; touch-action: pan-y; user-select: none; -webkit-user-select: none; }
.referans-bolum.v2 .ref-kayan.surukleniyor { cursor: grabbing; }
.referans-bolum.v2 .ref-kayan.js .ref-kayan-ic { animation: none; will-change: transform; }
.referans-bolum.v2 .ref-yuva img { pointer-events: none; -webkit-user-drag: none; }
.ref-ok { position: absolute; z-index: 3; top: 50%; width: 44px; height: 44px; margin-top: -22px; border-radius: 50%; display: grid; place-items: center; font-size: 20px; color: var(--murekkep); background: #fff; border: 1px solid var(--cizgi-2); box-shadow: 0 8px 20px -10px rgba(11,20,36,.35); transition: transform .25s var(--gecis), color .2s, border-color .2s, box-shadow .25s; }
.ref-ok:hover { color: var(--mavi-600); border-color: var(--mavi-200); transform: scale(1.06); box-shadow: 0 12px 26px -10px rgba(11,20,36,.4); }
.ref-ok.sol { left: max(16px, calc((100vw - var(--kap)) / 2)); }
.ref-ok.sag { right: max(16px, calc((100vw - var(--kap)) / 2)); }
@media (max-width: 720px) { .ref-ok { width: 36px; height: 36px; margin-top: -18px; font-size: 17px; } }
/* Ürün ailemiz şeridi kaldırıldı: giriş ekranı normal düzen */
.sinema-ic { padding-bottom: 150px; }
.sinema-asagi { display: block; bottom: 48px; }
.sinema + .referans-bolum.v2 { padding-top: 96px; }
@media (max-width: 720px) { .sinema-ic { padding-bottom: 96px; } .sinema-asagi { display: none; } .sinema + .referans-bolum.v2 { padding-top: 64px; } }

/* ==========================================================================
   Sayfa geneli uyum katmanı: giriş ekranının dili (Poppins, ince halkalar,
   çizgili etiketler, lacivert cam)
   ========================================================================== */
:root { --gece-3: #040B16; --halka-cizgi: rgba(42,128,183,.35); }

/* Bölüm başlıkları */
.bolum-bas .ust-etiket, .bolum-ust-sira .ust-etiket, .neden .ust-etiket, .talep-sol .ust-etiket, .ikili .ust-etiket {
  font-family: var(--yazi-baslik); font-size: 12px; font-weight: 600; letter-spacing: .24em; gap: 14px;
}
.bolum-bas .ust-etiket::before { width: 40px; height: 1px; background: linear-gradient(90deg, transparent, currentColor); }
.bolum-bas:not(.sol) .ust-etiket::after { content: ""; width: 40px; height: 1px; background: linear-gradient(90deg, currentColor, transparent); }
.b-buyuk { font-family: var(--yazi-baslik); font-weight: 600; letter-spacing: -.03em; }
.bolum { padding: 128px 0; }
.on-yazi { color: #5A6577; }

/* Ortak ince halka ikon */
.hizmet .ikon, .neden-madde .ikon, .e-kart .ikon, .vitrin-sekme .ikon {
  background: transparent !important; color: var(--u, var(--mavi-600)) !important;
  border: 1px solid color-mix(in srgb, var(--u, var(--mavi-500)) 40%, transparent) !important;
  box-shadow: 0 0 0 5px color-mix(in srgb, var(--u, var(--mavi-500)) 7%, transparent) !important;
  border-radius: 50% !important; transition: background-color .3s, color .3s, box-shadow .3s, border-color .3s;
}
.hizmet:hover .ikon, .neden-madde:hover .ikon, .e-kart:hover .ikon, .vitrin-sekme.aktif .ikon {
  background: var(--u, var(--mavi-500)) !important; color: #fff !important; border-color: var(--u, var(--mavi-500)) !important;
  box-shadow: 0 0 0 6px color-mix(in srgb, var(--u, var(--mavi-500)) 14%, transparent), 0 10px 22px -10px var(--u, var(--mavi-500)) !important;
}
.neden-madde:nth-child(1) { --u: var(--u-kumas); } .neden-madde:nth-child(2) { --u: var(--u-konfeksiyon); } .neden-madde:nth-child(3) { --u: var(--u-muhasebe); } .neden-madde:nth-child(4) { --u: var(--u-kartela); }
.neden-madde .ikon { width: 52px; height: 52px; }

/* Fotoğraflı çözüm kartları */
.foto-kart { border-radius: 20px; box-shadow: 0 1px 0 rgba(255,255,255,.04) inset, 0 24px 48px -28px rgba(6,26,48,.55); }
.foto-kart h3 { font-family: var(--yazi-baslik); font-weight: 600; }
.foto-kart .rozet { font-family: var(--yazi-baslik); letter-spacing: .12em; font-weight: 600; font-size: 11px; }

/* Rakamlar bandı: koyu lacivert cam */
.mavi-bant { background: var(--gece-3); padding: 96px 0; border-top: 1px solid rgba(160,200,235,.08); border-bottom: 1px solid rgba(160,200,235,.08); }
.mavi-bant::before { background-image: linear-gradient(to right, rgba(255,255,255,.04) 1px, transparent 1px), linear-gradient(to bottom, rgba(255,255,255,.04) 1px, transparent 1px); background-size: 56px 56px; -webkit-mask-image: radial-gradient(60% 90% at 50% 50%, #000, transparent); mask-image: radial-gradient(60% 90% at 50% 50%, #000, transparent); }
.mavi-bant::after { right: auto; left: 50%; top: -80%; width: 70%; height: 260%; transform: translateX(-50%); background: radial-gradient(closest-side, rgba(42,128,183,.28), transparent); }
.mavi-bant h2 { font-family: var(--yazi-baslik); font-weight: 600; }
.mavi-bant p { color: #93A9C2; }
.bant-rakamlar { border: 1px solid rgba(160,200,235,.16); border-radius: 18px; background: rgba(255,255,255,.03); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); overflow: hidden; }
.bant-rakamlar > div { padding: 28px 26px !important; border-left: 1px solid rgba(160,200,235,.12) !important; }
.bant-rakamlar > div:first-child { border-left: 0 !important; }
.bant-rakamlar i.ti { width: 40px; height: 40px; border-radius: 50%; display: grid !important; place-items: center; font-size: 19px !important; color: #7FC4EE !important; border: 1px solid rgba(127,196,238,.35); margin-bottom: 18px !important; }
.bant-rakamlar b { font-family: var(--yazi-baslik); font-weight: 600; font-size: clamp(2.2rem, 3.2vw, 3rem) !important; }
.bant-rakamlar b sup { color: #4FC3F7 !important; }
.bant-rakamlar div > span { color: #9DB3CB !important; font-size: 13px !important; letter-spacing: .1em; text-transform: uppercase; font-weight: 600 !important; }

/* Ürün vitrini */
.vitrin-sekme { border: 1px solid transparent; background: transparent; border-radius: 14px; }
.vitrin-sekme:hover { background: #fff; border-color: var(--cizgi); transform: none; }
.vitrin-sekme.aktif { background: #fff; border-color: var(--cizgi-2); box-shadow: 0 14px 30px -20px rgba(11,20,36,.35); }
.vitrin-sekme b { font-family: var(--yazi-baslik); font-weight: 600; }
.vitrin-panel-alan { background: #fff; border-radius: 22px; box-shadow: 0 30px 60px -40px rgba(11,20,36,.35); }
.vitrin-panel h3 { font-family: var(--yazi-baslik); font-weight: 600; }
.vitrin-panel::before { opacity: .6; }

/* e-Dönüşüm koyu bölümü: giriş tonları */
.koyu-foto { background: var(--gece-3); }
.cam-kart { border-radius: 18px; border-color: rgba(160,200,235,.18); }
.cam-kart .ikon { background: transparent; border: 1px solid rgba(127,196,238,.45); border-radius: 50%; color: #7FC4EE; box-shadow: 0 0 0 5px rgba(127,196,238,.08); transition: background-color .3s, color .3s; }
.cam-kart:hover .ikon { background: var(--mavi-500); color: #fff; border-color: var(--mavi-500); }
.cam-kart b { font-family: var(--yazi-baslik); font-weight: 600; }

/* Uygulama süreci: ince büyük numaralar ve bağlantı çizgisi */
.surec { gap: 0; border-top: 1px solid var(--cizgi-2); }
.surec::before { display: none; }
.surec-adim { background: transparent; border: 0; border-right: 1px solid var(--cizgi); border-radius: 0; padding: 40px 30px 10px; box-shadow: none !important; transform: none !important; }
.surec-adim:last-child { border-right: 0; }
.surec-adim::before { content: ""; position: absolute; left: 0; top: -1px; height: 2px; width: 0; background: var(--u); transition: width .5s var(--gecis); }
.surec-adim:hover::before { width: 100%; }
.surec-adim .no { width: auto; height: auto; background: none !important; box-shadow: none !important; font-family: var(--yazi-baslik); font-weight: 300; font-size: 56px; letter-spacing: -.04em; line-height: 1; color: var(--u); margin-bottom: 22px; display: flex; align-items: center; gap: 14px; }
.surec-adim .no i { position: static; width: 38px; height: 38px; border-radius: 50%; font-size: 17px; background: transparent; color: var(--u); border: 1px solid color-mix(in srgb, var(--u) 40%, transparent); box-shadow: none; }
.surec-adim b { font-family: var(--yazi-baslik); font-weight: 600; }

/* Hizmetler */
.hizmetler { border-radius: 22px; }
.hizmet b { font-family: var(--yazi-baslik); font-weight: 600; }
.hizmet::before { display: none; }
.hizmet:hover { background: #fff; box-shadow: inset 0 -2px 0 var(--u); }

/* Blog */
.yazi-kart { border-radius: 20px; }
.yazi-kart h3 { font-family: var(--yazi-baslik); font-weight: 600; }
.yazi-meta .kat { font-family: var(--yazi-baslik); letter-spacing: .04em; }

/* Talep formu: giriş tonları */
.talep { background: linear-gradient(135deg, #061426 0%, #0B2341 55%, #123F66 100%); border: 1px solid rgba(160,200,235,.14); }
.talep::before { background: radial-gradient(45% 70% at 0% 100%, rgba(42,128,183,.35), transparent 70%), radial-gradient(40% 60% at 100% 0%, rgba(79,195,247,.15), transparent 70%); }
.talep-sol h2 { font-family: var(--yazi-baslik); font-weight: 600; }
.talep-adimlar li span.n { border-radius: 50%; background: transparent; border-color: rgba(127,196,238,.45); color: #7FC4EE; font-family: var(--yazi-baslik); }
.talep-form { border-radius: 20px; }
.talep-form h3 { font-family: var(--yazi-baslik); font-weight: 600; }

@media (max-width: 1024px) {
  .surec { border-top: 0; }
  .surec-adim { border-right: 0; border-top: 1px solid var(--cizgi); padding: 28px 8px 18px; }
  .bant-rakamlar > div:nth-child(3) { border-left: 0 !important; }
  .bant-rakamlar > div:nth-child(-n+2) { border-bottom: 1px solid rgba(160,200,235,.12); }
}
@media (max-width: 720px) {
  .bolum { padding: 80px 0; }
  .surec-adim .no { font-size: 44px; }
}

/* ==========================================================================
   Açık kurumsal gövde (B)
   ========================================================================== */
.g-bolum { padding: 112px 0; background: #fff; }
.g-gri { background: var(--zemin-2); border-top: 1px solid var(--cizgi); border-bottom: 1px solid var(--cizgi); }
.g-etiket { display: inline-flex; align-items: center; gap: 10px; font-family: var(--yazi-baslik); font-size: 12px; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: var(--mavi-600); }
.g-etiket::before { content: ""; width: 24px; height: 2px; border-radius: 2px; background: var(--mavi-500); }
.g-bolum h2 { font-family: var(--yazi-baslik); font-weight: 600; font-size: clamp(1.9rem, 3vw, 2.6rem); letter-spacing: -.03em; line-height: 1.15; color: var(--murekkep); margin: 16px 0 0; }
.g-bas { display: grid; grid-template-columns: 1.1fr 1fr; gap: 48px; align-items: end; margin-bottom: 56px; }
.g-bas p, .g-on { margin: 0; font-size: 17px; line-height: 1.65; color: #5A6577; }
.g-on { margin: 18px 0 0; max-width: 520px; }

/* Ortak halka ikon */
.g-halka { width: 48px; height: 48px; flex: none; border-radius: 50%; display: grid; place-items: center; font-size: 22px; color: var(--u, var(--mavi-600)); border: 1px solid color-mix(in srgb, var(--u, var(--mavi-500)) 35%, #fff); background: color-mix(in srgb, var(--u, var(--mavi-500)) 7%, #fff); transition: background-color .3s, color .3s, border-color .3s; }

/* Ürün kartları: 3 + 2 */
.g-urunler { display: grid; grid-template-columns: repeat(6, 1fr); gap: 20px; }
.g-urun { grid-column: span 2; position: relative; display: flex; flex-direction: column; padding: 30px; border-radius: 20px; background: #fff; border: 1px solid var(--cizgi); box-shadow: 0 1px 2px rgba(11,20,36,.04); transition: transform .35s var(--gecis), box-shadow .35s var(--gecis), border-color .3s; overflow: hidden; }
.g-urun:nth-child(4), .g-urun:nth-child(5) { grid-column: span 3; }
.g-urun::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 3px; background: var(--u); transform: scaleX(0); transform-origin: left; transition: transform .45s var(--gecis); }
.g-urun:hover { transform: translateY(-4px); box-shadow: 0 24px 48px -28px rgba(11,20,36,.35); border-color: color-mix(in srgb, var(--u) 30%, var(--cizgi)); }
.g-urun:hover::before { transform: scaleX(1); }
.g-urun:hover .g-halka { background: var(--u); color: #fff; border-color: var(--u); }
.g-urun-ust { display: flex; align-items: center; justify-content: space-between; margin-bottom: 22px; }
.g-sayi { font-size: 12px; font-weight: 600; color: var(--silik); }
.g-urun h3 { font-family: var(--yazi-baslik); font-size: 19px; font-weight: 600; letter-spacing: -.02em; line-height: 1.3; color: var(--murekkep); margin-bottom: 10px; }
.g-urun p { margin: 0 0 18px; font-size: 14.5px; line-height: 1.6; color: var(--soluk); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.g-urun ul { list-style: none; margin: 0 0 22px; padding: 16px 0 0; border-top: 1px solid var(--cizgi); display: grid; gap: 8px; }
.g-urun li { display: flex; align-items: center; gap: 8px; font-size: 13.5px; color: var(--metin); }
.g-urun li i { font-size: 15px; color: var(--u); }
.g-link { margin-top: auto; display: inline-flex; align-items: center; gap: 6px; font-size: 14px; font-weight: 600; color: var(--mavi-600); }
.g-urun .g-link { color: var(--u); }
.g-link i { transition: transform .3s var(--gecis); }
.g-urun:hover .g-link i, .g-link:hover i { transform: translateX(4px); }

/* İnce koyu rakam bandı */
.g-rakam { background: #040B16; position: relative; overflow: hidden; }
.g-rakam::before { content: ""; position: absolute; inset: 0; background: radial-gradient(50% 120% at 50% 50%, rgba(42,128,183,.22), transparent 70%); }
.g-rakam-ic { position: relative; display: grid; grid-template-columns: repeat(4, 1fr); }
.g-rakam-ic > div { padding: 44px 24px; text-align: center; border-left: 1px solid rgba(160,200,235,.12); }
.g-rakam-ic > div:first-child { border-left: 0; }
.g-rakam-ic b { display: block; font-family: var(--yazi-baslik); font-size: clamp(2.2rem, 3.4vw, 3rem); font-weight: 600; letter-spacing: -.03em; color: #fff; line-height: 1; }
.g-rakam-ic b span { display: inline; color: inherit; font-size: inherit; letter-spacing: inherit; text-transform: none; font-weight: inherit; margin: 0; }
.g-rakam-ic > div > span { display: block; margin-top: 10px; font-size: 12px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: #8EA9C6; }

/* Neden biz + e-Dönüşüm */
.g-iki { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: start; }
.g-neden { list-style: none; margin: 36px 0 0; padding: 0; display: grid; gap: 22px; }
.g-neden li { display: flex; gap: 16px; align-items: flex-start; font-size: 14.5px; line-height: 1.55; color: var(--soluk); }
.g-neden li b { display: block; font-family: var(--yazi-baslik); font-size: 16px; font-weight: 600; color: var(--murekkep); margin-bottom: 3px; }
.g-neden li:hover .g-halka { background: var(--u); color: #fff; border-color: var(--u); }
.g-edon { background: #fff; border: 1px solid var(--cizgi); border-radius: 22px; padding: 32px; box-shadow: 0 24px 50px -36px rgba(11,20,36,.35); }
.g-edon-bas { display: flex; align-items: center; gap: 16px; margin-bottom: 14px; }
.g-edon-bas h3 { font-family: var(--yazi-baslik); font-size: 20px; font-weight: 600; letter-spacing: -.02em; color: var(--murekkep); margin-top: 6px; }
.g-edon > p { margin: 0 0 20px; color: var(--soluk); font-size: 14.5px; }
.g-edon-liste { display: grid; gap: 6px; margin-bottom: 22px; }
.g-edon-liste a { display: flex; align-items: center; gap: 14px; padding: 14px; border-radius: 14px; border: 1px solid var(--cizgi); transition: background-color .2s, border-color .2s; }
.g-edon-liste a:hover { background: var(--zemin-2); border-color: var(--cizgi-2); }
.g-edon-liste a > i:first-child { width: 38px; height: 38px; border-radius: 10px; display: grid; place-items: center; font-size: 19px; color: var(--mavi-600); background: var(--mavi-50); flex: none; }
.g-edon-liste b { display: block; font-size: 14.5px; font-weight: 600; color: var(--murekkep); }
.g-edon-liste small { display: block; font-size: 12.5px; color: var(--soluk); margin-top: 2px; }
.g-edon-liste .ok { margin-left: auto; color: var(--silik); transition: transform .25s, color .2s; }
.g-edon-liste a:hover .ok { color: var(--mavi-600); transform: translateX(3px); }

/* Referanslar: beyaz */
.referans-bolum.v2 { background: #fff; }
.ref-bant { background: #fff; }

/* Demo formu: açık */
.g-talep { background: var(--zemin-2); }
.g-talep .talep { background: #fff; border: 1px solid var(--cizgi); box-shadow: 0 30px 60px -40px rgba(11,20,36,.35); color: var(--soluk); }
.g-talep .talep::before { display: none; }
.g-talep .talep-sol h2 { color: var(--murekkep); font-size: clamp(1.8rem, 2.6vw, 2.3rem); }
.g-talep .talep-sol p { color: var(--soluk); }
.g-talep .talep-sol .ust-etiket { color: var(--mavi-600); }
.g-talep .talep-adimlar b { color: var(--murekkep); }
.g-talep .talep-adimlar small { color: var(--soluk); }
.g-talep .talep-adimlar li span.n { color: var(--mavi-600); border-color: var(--mavi-200); background: var(--mavi-50); }
.g-talep .talep-iletisim a { color: var(--murekkep); background: var(--zemin-2); border-color: var(--cizgi); }
.g-talep .talep-iletisim a:hover { background: var(--zemin-3); }
.g-talep .talep-iletisim i { color: var(--mavi-500); }
.g-talep .talep-form { background: var(--zemin-2); box-shadow: none; border: 1px solid var(--cizgi); }
.g-talep .alan input, .g-talep .alan select, .g-talep .alan textarea { background: #fff; }

@media (max-width: 1024px) {
  .g-bas, .g-iki { grid-template-columns: 1fr; gap: 24px; }
  .g-iki { gap: 48px; }
  .g-urunler { grid-template-columns: 1fr 1fr; }
  .g-urun, .g-urun:nth-child(4), .g-urun:nth-child(5) { grid-column: span 1; }
  .g-urun:nth-child(5) { grid-column: 1 / -1; }
  .g-rakam-ic { grid-template-columns: 1fr 1fr; }
  .g-rakam-ic > div:nth-child(3) { border-left: 0; }
  .g-rakam-ic > div:nth-child(-n+2) { border-bottom: 1px solid rgba(160,200,235,.12); }
}
@media (max-width: 720px) {
  .g-bolum { padding: 72px 0; }
  .g-bolum h2 br { display: none; }
  .g-urunler { grid-template-columns: 1fr; }
  .g-urun:nth-child(5) { grid-column: auto; }
  .g-urun { padding: 24px; }
  .g-edon { padding: 22px; }
  .g-rakam-ic > div { padding: 30px 12px; }
}

/* ==========================================================================
   Çözümlerimiz: bento ızgara + ürün başına mini arayüz önizlemesi
   ========================================================================== */
.g-bento { display: grid; grid-template-columns: repeat(6, 1fr); gap: 20px; }
.g-kart { grid-column: span 2; display: flex; flex-direction: column; border-radius: 22px; background: #fff; border: 1px solid var(--cizgi); overflow: hidden; position: relative; box-shadow: 0 1px 2px rgba(11,20,36,.04); transition: transform .4s var(--gecis), box-shadow .4s var(--gecis), border-color .3s; }
.g-kart:nth-child(2) { grid-column: span 2; }
.g-kart.genis { grid-column: span 4; flex-direction: row; }
.g-kart:hover { transform: translateY(-5px); box-shadow: 0 30px 60px -34px rgba(11,20,36,.4); border-color: color-mix(in srgb, var(--u) 28%, var(--cizgi)); }
.g-kart:hover .g-halka { background: var(--u); color: #fff; border-color: var(--u); }
.g-kart-gorsel { position: relative; padding: 26px 26px 0; background: linear-gradient(180deg, color-mix(in srgb, var(--u) 9%, #fff), color-mix(in srgb, var(--u) 3%, #fff)); border-bottom: 1px solid color-mix(in srgb, var(--u) 12%, var(--cizgi)); overflow: hidden; min-height: 196px; display: flex; align-items: flex-end; }
.g-kart-gorsel::before { content: ""; position: absolute; inset: 0; background-image: radial-gradient(color-mix(in srgb, var(--u) 22%, transparent) 1px, transparent 1px); background-size: 16px 16px; -webkit-mask-image: linear-gradient(180deg, #000, transparent 80%); mask-image: linear-gradient(180deg, #000, transparent 80%); opacity: .6; }
.g-kart.genis .g-kart-gorsel { width: 52%; flex: none; border-bottom: 0; border-right: 1px solid color-mix(in srgb, var(--u) 12%, var(--cizgi)); padding: 32px 0 0 32px; min-height: 0; align-items: flex-end; }
.g-kart-govde { padding: 26px 28px 28px; display: flex; flex-direction: column; flex: 1; }
.g-kart.genis .g-kart-govde { padding: 34px; }
.g-kart-ust { display: flex; align-items: center; justify-content: space-between; margin-bottom: 18px; }
.g-kart h3 { font-family: var(--yazi-baslik); font-size: 19px; font-weight: 600; letter-spacing: -.02em; line-height: 1.3; color: var(--murekkep); margin-bottom: 10px; }
.g-kart.genis h3 { font-size: 24px; }
.g-kart p { margin: 0 0 20px; font-size: 14.5px; line-height: 1.6; color: var(--soluk); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.g-kart ul { list-style: none; margin: 0 0 24px; padding: 18px 0 0; border-top: 1px solid var(--cizgi); display: grid; grid-template-columns: 1fr 1fr; gap: 9px 16px; }
.g-kart li { display: flex; align-items: center; gap: 8px; font-size: 13.5px; color: var(--metin); }
.g-kart li i { color: var(--u); font-size: 15px; }
.g-kart .g-link { color: var(--u); margin-top: auto; }
.g-kart:hover .g-link i { transform: translateX(4px); }

/* Mini arayüz kartı */
.oz { position: relative; z-index: 1; width: 100%; background: #fff; border: 1px solid var(--cizgi); border-bottom: 0; border-radius: 14px 14px 0 0; padding: 14px 16px 16px; box-shadow: 0 -2px 0 rgba(255,255,255,.6) inset, 0 20px 40px -24px rgba(11,20,36,.35); transform: translateY(8px); transition: transform .5s var(--gecis); font-size: 12px; }
.g-kart:hover .oz { transform: translateY(0); }
.g-kart.genis .oz { border-radius: 14px 0 0 0; border-right: 0; }
.oz-bas { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.oz-bas span { font-weight: 600; color: var(--murekkep); font-size: 12.5px; }
.oz-bas em { font-style: normal; display: inline-flex; align-items: center; gap: 5px; font-size: 11px; font-weight: 600; color: var(--u); background: color-mix(in srgb, var(--u) 9%, #fff); padding: 3px 8px; border-radius: 999px; }
.oz-bas em i { width: 6px; height: 6px; border-radius: 50%; background: currentColor; animation: yanip 1.8s infinite; }
.oz-satir { display: grid; grid-template-columns: 112px 1fr 34px; align-items: center; gap: 10px; padding: 7px 0; border-top: 1px solid var(--zemin-3); }
.oz-satir b { font-weight: 550; color: var(--metin); font-size: 12px; white-space: nowrap; }
.oz-satir small { text-align: right; font-weight: 650; color: var(--murekkep); }
.cb { height: 6px; border-radius: 6px; background: var(--zemin-3); overflow: hidden; }
.cb i, .oz-ilerleme i { display: block; height: 100%; width: calc(var(--w) * .7); border-radius: 6px; background: linear-gradient(90deg, color-mix(in srgb, var(--u) 60%, #fff), var(--u)); transition: width 1s var(--gecis); }
.g-kart:hover .cb i, .g-kart:hover .oz-ilerleme i { width: var(--w); }
/* ===== Kumaş kartı: profesyonel üretim & fire paneli ===== */
.oz-kumas { padding: 15px 16px 16px; }
.oz-kumas .cb.f i { background: linear-gradient(90deg, #F7C06B, #E8822E); }
.fp-bas { display: flex; align-items: center; gap: 9px; padding-bottom: 12px; border-bottom: 1px solid var(--zemin-3); margin-bottom: 12px; }
.fp-logo { width: 30px; height: 30px; border-radius: 9px; display: inline-flex; align-items: center; justify-content: center; background: color-mix(in srgb, var(--u) 12%, #fff); color: var(--u); font-size: 17px; flex: none; }
.fp-bas-m { display: flex; flex-direction: column; line-height: 1.25; margin-right: auto; min-width: 0; }
.fp-bas-m b { font-size: 12.5px; color: var(--murekkep); font-weight: 650; }
.fp-bas-m small { font-size: 10px; color: var(--silik); }
.fp-canli { font-style: normal; display: inline-flex; align-items: center; gap: 5px; font-size: 10px; font-weight: 600; color: #0B7A51; background: #E7F7F0; padding: 3px 8px; border-radius: 999px; flex: none; }
.fp-canli i { width: 6px; height: 6px; border-radius: 50%; background: #16B477; animation: yanip 1.8s infinite; }
.fp-ozet { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; margin-bottom: 14px; }
.fp-tile { padding: 9px 11px; border-radius: 11px; background: var(--zemin-2); border: 1px solid var(--zemin-3); }
.fp-tile > small { display: block; font-size: 10px; color: var(--silik); margin-bottom: 3px; }
.fp-tile-d { display: flex; align-items: baseline; justify-content: space-between; gap: 6px; }
.fp-tile-d b { font-family: var(--yazi-baslik); font-size: 16px; color: var(--murekkep); line-height: 1; }
.fp-tile-d b i { font-style: normal; font-size: 10px; font-weight: 500; color: var(--silik); margin-left: 2px; }
.fp-tile-d em { font-style: normal; display: inline-flex; align-items: center; gap: 2px; font-size: 10px; font-weight: 650; color: #0B7A51; }
.fp-tile-d em i { font-size: 12px; }
.fp-grup { font-size: 9.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--silik); margin: 0 0 7px; }
.fp-grup ~ .fp-grup, .fp-row + .fp-grup { margin-top: 12px; }
.fp-row { padding: 6px 0; }
.fp-row + .fp-row { border-top: 1px solid var(--zemin-3); }
.fp-row-ust { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 7px; }
.fp-et { display: inline-flex; align-items: center; gap: 6px; font-size: 11.5px; font-weight: 550; color: var(--metin); min-width: 0; }
.fp-et i { font-size: 14px; color: var(--silik); flex: none; }
.fp-row small { font-weight: 650; font-size: 11.5px; color: var(--murekkep); white-space: nowrap; }
.fp-row .cb { display: block; width: 100%; height: 6px; }
.oz-kpi { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-top: 12px; }
.oz-kpi div { padding: 10px; border-radius: 10px; background: var(--zemin-2); }
.oz-kpi small { display: block; font-size: 10.5px; color: var(--silik); }
.oz-kpi b { font-family: var(--yazi-baslik); font-size: 15px; color: var(--murekkep); }
.oz-asama { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; margin-bottom: 12px; }
.oz-asama span { display: flex; flex-direction: column; align-items: center; gap: 5px; padding: 8px 4px; border-radius: 10px; background: var(--zemin-2); font-size: 11px; font-weight: 600; color: var(--silik); }
.oz-asama span i { font-size: 17px; }
.oz-asama .tamam { color: var(--u); background: color-mix(in srgb, var(--u) 8%, #fff); }
.oz-asama .aktif { color: #fff; background: var(--u); box-shadow: 0 8px 18px -8px var(--u); }
.oz-ilerleme { height: 8px; border-radius: 8px; background: var(--zemin-3); overflow: hidden; }
.oz-not { display: block; margin-top: 8px; font-size: 11px; color: var(--silik); font-weight: 550; }
.oz-muh svg { width: 100%; height: 56px; display: block; margin-bottom: 8px; }
.oz-muh .alan { fill: color-mix(in srgb, var(--u) 14%, transparent); }
.oz-muh .cz { fill: none; stroke: var(--u); stroke-width: 2; stroke-dasharray: 260; stroke-dashoffset: 120; transition: stroke-dashoffset 1.2s var(--gecis); }
.g-kart:hover .oz-muh .cz { stroke-dashoffset: 0; }
.oz-fatura { display: grid; grid-template-columns: 1fr auto auto; gap: 10px; align-items: center; padding: 7px 0; border-top: 1px solid var(--zemin-3); }
.oz-fatura span { color: var(--soluk); font-weight: 550; }
.oz-fatura b { color: var(--murekkep); }
.oz-fatura em { font-style: normal; font-size: 10.5px; font-weight: 650; padding: 2px 8px; border-radius: 999px; color: #A06A06; background: #FDF3E2; }
.oz-fatura em.ok { color: #0B7A51; background: #E7F7F0; }
.oz-renkler { display: grid; grid-template-columns: repeat(6, 1fr); gap: 6px; }
.oz-renkler i { aspect-ratio: 1; border-radius: 8px; box-shadow: inset 0 0 0 1px rgba(0,0,0,.06); transition: transform .4s var(--gecis); }
.g-kart:hover .oz-renkler i:nth-child(odd) { transform: translateY(-3px); }
.g-kart:hover .oz-renkler i:nth-child(even) { transform: translateY(2px); }
.oz-barkod { position: relative; display: flex; align-items: stretch; gap: 2px; height: 58px; padding: 0 6px; overflow: hidden; }
.oz-barkod i { display: block; background: var(--murekkep); border-radius: 1px; }
.oz-barkod .tarama { position: absolute; left: 0; right: 0; top: 0; height: 2px; background: #E5484D; box-shadow: 0 0 10px 2px rgba(229,72,77,.55); animation: tara 2.4s ease-in-out infinite; }
@keyframes tara { 0%, 100% { top: 4%; } 50% { top: 92%; } }

@media (max-width: 1024px) {
  .g-bento { grid-template-columns: 1fr 1fr; }
  .g-kart, .g-kart:nth-child(2) { grid-column: span 1; }
  .g-kart.genis { grid-column: 1 / -1; }
  .g-kart:last-child:nth-child(even) { grid-column: 1 / -1; }
}
@media (max-width: 720px) {
  .g-bento { grid-template-columns: 1fr; }
  .g-kart.genis { flex-direction: column; }
  .g-kart.genis .g-kart-gorsel { width: auto; border-right: 0; border-bottom: 1px solid var(--cizgi); padding: 22px 22px 0; }
  .g-kart.genis .oz { border-radius: 14px 14px 0 0; border-right: 1px solid var(--cizgi); }
  .g-kart ul { grid-template-columns: 1fr; }
  .g-kart-govde, .g-kart.genis .g-kart-govde { padding: 22px; }
  .oz-satir { grid-template-columns: 96px 1fr 30px; }
}
@media (hover: none) { .oz { transform: none; } .cb i, .oz-ilerleme i { width: var(--w); } .oz-muh .cz { stroke-dashoffset: 0; } }
.g-kart.genis .g-kart-gorsel { align-items: center; padding: 34px; }
.g-kart.genis .oz { border-radius: 14px; border: 1px solid var(--cizgi); transform: none; box-shadow: 0 24px 50px -28px rgba(11,20,36,.4); }
.g-kart.genis:hover .oz { transform: translateY(-4px); }
@media (max-width: 720px) { .g-kart.genis .g-kart-gorsel { padding: 22px; } }

/* Logo parıltısı: yalnızca logo şeklinin üzerinden geçen ışık */
.nav-logo { position: relative; display: inline-flex; isolation: isolate; }
.nav-logo::after {
  content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: linear-gradient(105deg, transparent 0%, transparent 38%, rgba(160,225,255,.95) 48%, rgba(255,255,255,1) 50%, rgba(160,225,255,.95) 52%, transparent 62%, transparent 100%);
  background-size: 300% 100%; background-position: 120% 0; background-repeat: no-repeat;
  -webkit-mask: url('/assets/yeni/logo-beyaz.png') left center / contain no-repeat; mask: url('/assets/yeni/logo-beyaz.png') left center / contain no-repeat;
  mix-blend-mode: screen; animation: logoParilti 6s 1.2s ease-in-out infinite;
}
.nav-logo:hover::after { animation: logoParilti 1.1s ease-in-out 1; }
@keyframes logoParilti { 0% { background-position: 120% 0; } 22%, 100% { background-position: -20% 0; } }
.nav-logo img { filter: drop-shadow(0 0 0 rgba(79,195,247,0)); transition: filter .4s; }
.nav-logo:hover img { filter: drop-shadow(0 0 10px rgba(79,195,247,.45)); }
@media (prefers-reduced-motion: reduce) { .nav-logo::after { animation: none; display: none; } }
/* Logo orijinal renklerinde: 'is' mavi, 'tek' ve 'soft' gri */
.nav-logo .logo-beyaz { display: none !important; }
.nav-logo .logo-renkli, .seffaf-nav .nav:not(.kaydi):not(.menu-acik) .nav-logo .logo-renkli, .nav.menu-acik .nav-logo .logo-renkli { display: block !important; height: 34px; width: auto; }
.nav-logo::after { -webkit-mask-image: url('/assets/yeni/logo.png'); mask-image: url('/assets/yeni/logo.png'); }
.yan-foto { height: 128px; background-position: center 40%; }
.yan-foto::after { background: linear-gradient(180deg, rgba(6,26,48,0) 35%, rgba(6,26,48,.55)); }
.yan-foto { background-position: center 38%; background-size: 160%; }
/* Menüde öne çıkan ürün: mini arayüz önizlemesi */
.acilir .acilir-yan .yan-onizleme { position: relative; display: flex !important; flex-direction: column; gap: 7px; padding: 30px 12px 12px !important; border-radius: 12px !important; background: linear-gradient(180deg, color-mix(in srgb, var(--u) 9%, #fff), #fff) !important; border: 1px solid color-mix(in srgb, var(--u) 18%, var(--cizgi)); box-shadow: 0 12px 24px -18px rgba(11,20,36,.4); }
.yan-rozet { position: absolute; left: 10px; top: 9px; font-size: 10px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #fff; background: var(--mavi-500); padding: 2px 7px; border-radius: 5px; }
.yo-bas { display: flex; align-items: center; justify-content: space-between; }
.yo-bas b { font-size: 12px !important; font-weight: 600; color: var(--murekkep); font-family: var(--yazi) !important; }
.yo-bas em { font-style: normal; display: inline-flex; align-items: center; gap: 4px; font-size: 10px; font-weight: 600; color: var(--u); }
.yo-bas em i { width: 5px; height: 5px; border-radius: 50%; background: currentColor; animation: yanip 1.8s infinite; }
.yo-satir { display: grid; grid-template-columns: 32px 1fr 30px; align-items: center; gap: 8px; }
.yo-satir small { font-size: 10.5px !important; color: var(--soluk) !important; margin: 0 !important; }
.yo-satir b { font-size: 10.5px !important; text-align: right; color: var(--murekkep); font-family: var(--yazi) !important; }
.yan-onizleme .cb i { width: var(--w); }
.yo-kpi { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; margin-top: 3px; }
.yo-kpi > span { padding: 6px 8px; border-radius: 8px; background: var(--zemin-2); }
.yo-kpi small { display: block; font-size: 9.5px !important; color: var(--silik) !important; margin: 0 !important; }
.yo-kpi b { font-size: 12.5px !important; color: var(--murekkep); font-family: var(--yazi-baslik) !important; }
.yan-onizleme .cb { display: block; height: 6px; border-radius: 6px; background: var(--zemin-3); overflow: hidden; }
.yan-onizleme .cb i { display: block; height: 100%; border-radius: 6px; background: linear-gradient(90deg, color-mix(in srgb, var(--u) 55%, #fff), var(--u)); }
.yo-bas { gap: 8px; margin-top: 2px; }
.yo-bas b { white-space: nowrap; }
.acilir .acilir-yan .yan-onizleme { align-items: stretch; }

/* Neden İstek Yazılım: 2x2 numaralı özellik karoları */
.g-neden2 { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 34px; }
.g-neden2 > div { position: relative; padding: 24px 22px 22px; border-radius: 18px; background: #fff; border: 1px solid var(--cizgi); overflow: hidden; transition: transform .35s var(--gecis), box-shadow .35s var(--gecis), border-color .3s; }
.g-neden2 > div::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: var(--u); transform: scaleY(0); transform-origin: top; transition: transform .45s var(--gecis); }
.g-neden2 > div:hover { transform: translateY(-3px); box-shadow: 0 20px 40px -28px rgba(11,20,36,.4); border-color: color-mix(in srgb, var(--u) 28%, var(--cizgi)); }
.g-neden2 > div:hover::before { transform: scaleY(1); }
.g-neden2 > div:hover .g-halka { background: var(--u); color: #fff; border-color: var(--u); }
.g-neden2 .no { position: absolute; right: 18px; top: 14px; font-family: var(--yazi-baslik); font-size: 34px; font-weight: 300; letter-spacing: -.04em; color: color-mix(in srgb, var(--u) 22%, #fff); line-height: 1; transition: color .3s; }
.g-neden2 > div:hover .no { color: color-mix(in srgb, var(--u) 45%, #fff); }
.g-neden2 .g-halka { width: 44px; height: 44px; font-size: 20px; margin-bottom: 16px; }
.g-neden2 b { display: block; font-family: var(--yazi-baslik); font-size: 16px; font-weight: 600; color: var(--murekkep); letter-spacing: -.01em; margin-bottom: 6px; }
.g-neden2 p { margin: 0; font-size: 13.5px; line-height: 1.55; color: var(--soluk); }
@media (max-width: 720px) { .g-neden2 { grid-template-columns: 1fr; } }
.yan-foto { height: 132px; background-size: cover !important; background-position: 30% 55% !important; }
.yan-foto::after { background: linear-gradient(180deg, rgba(6,26,48,0) 45%, rgba(6,26,48,.5)); }
.g-talep + .referans-bolum.v2 { padding-top: 96px; }
.sinema + .g-bolum { padding-top: 112px; }

/* ==========================================================================
   Demo bölümü v2
   ========================================================================== */
.talep.v2 { display: grid; grid-template-columns: 1fr 1.05fr; padding: 0; overflow: hidden; border-radius: 26px; background: #fff; border: 1px solid var(--cizgi); box-shadow: 0 40px 80px -50px rgba(11,20,36,.45); }
.talep-sol.v2 { position: relative; isolation: isolate; padding: 52px 48px; background: #061426; color: #A9BCD2; overflow: hidden; display: flex; flex-direction: column; }
.talep-sol.v2::before { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(60% 50% at 0% 100%, rgba(42,128,183,.38), transparent 70%), radial-gradient(50% 40% at 100% 0%, rgba(79,195,247,.16), transparent 70%); }
.talep-sol.v2::after { content: ""; position: absolute; inset: 0; z-index: -1; background-image: linear-gradient(to right, rgba(255,255,255,.04) 1px, transparent 1px), linear-gradient(to bottom, rgba(255,255,255,.04) 1px, transparent 1px); background-size: 40px 40px; -webkit-mask-image: linear-gradient(160deg, #000, transparent 70%); mask-image: linear-gradient(160deg, #000, transparent 70%); }
.t-etiket { display: inline-flex; align-items: center; gap: 10px; font-family: var(--yazi-baslik); font-size: 12px; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: #7FC4EE; }
.t-etiket::before { content: ""; width: 24px; height: 2px; border-radius: 2px; background: #4FC3F7; }
.talep-sol.v2 h2 { font-family: var(--yazi-baslik); font-weight: 600; font-size: clamp(1.8rem, 2.6vw, 2.35rem); letter-spacing: -.03em; line-height: 1.15; color: #fff; margin: 18px 0 14px; }
.talep-sol.v2 > p { margin: 0 0 30px; font-size: 15.5px; line-height: 1.65; color: #A9BCD2; }
.t-alt-baslik { font-size: 12px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: #6F8FB0; margin-bottom: 14px; }
.t-liste { list-style: none; margin: 0 0 34px; padding: 0; display: grid; gap: 12px; }
.t-liste li { display: flex; align-items: center; gap: 12px; font-size: 15px; color: #DCE6F1; }
.t-liste i { font-size: 20px; color: #4FC3F7; flex: none; }
.t-iletisim { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: auto; }
.t-iletisim a { display: flex; align-items: center; gap: 12px; padding: 14px; border-radius: 14px; background: rgba(255,255,255,.05); border: 1px solid rgba(160,200,235,.16); transition: background-color .25s, border-color .25s; }
.t-iletisim a:hover { background: rgba(255,255,255,.09); border-color: rgba(160,210,245,.4); }
.t-iletisim a > span:first-child { width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; font-size: 18px; color: #7FC4EE; border: 1px solid rgba(127,196,238,.4); flex: none; }
.t-iletisim small { display: block; font-size: 11.5px; color: #7F95AF; }
.t-iletisim b { display: block; font-size: 14.5px; font-weight: 600; color: #fff; }
.t-guven { display: flex; align-items: center; gap: 12px; margin-top: 24px; padding-top: 22px; border-top: 1px solid rgba(160,200,235,.12); }
.t-guven small { font-size: 13px; color: #93A9C2; }
.t-guven b { color: #fff; font-weight: 600; }
.talep.v2 .talep-form { margin: 0; padding: 52px 48px; border-radius: 0; background: #fff; border: 0; box-shadow: none; }
.talep.v2 .talep-form h3 { font-family: var(--yazi-baslik); font-size: 24px; font-weight: 600; letter-spacing: -.02em; color: var(--murekkep); margin-bottom: 8px; }
.talep.v2 .talep-form > p { display: flex; align-items: center; gap: 6px; font-size: 13.5px; color: var(--silik); margin-bottom: 28px; }
.talep.v2 .form-izgara { gap: 16px 14px; }
.talep.v2 .alan label { font-size: 12.5px; font-weight: 600; color: var(--metin); margin-bottom: 7px; }
.talep.v2 .alan input, .talep.v2 .alan select, .talep.v2 .alan textarea { height: 50px; border-radius: 12px; background: var(--zemin-2); border: 1px solid var(--cizgi); font-size: 15px; }
.talep.v2 .alan textarea { height: 104px; }
.talep.v2 .alan input:focus, .talep.v2 .alan select:focus, .talep.v2 .alan textarea:focus { background: #fff; border-color: var(--mavi-400); box-shadow: 0 0 0 4px rgba(42,128,183,.12); }
.talep.v2 .onay { margin: 18px 0 22px; }
.talep.v2 .talep-form .btn { height: 56px; border-radius: 14px; font-size: 15.5px; background: linear-gradient(135deg, #2F7FD8, #2A80B7 50%, #1F9BCF); box-shadow: 0 14px 30px -14px rgba(42,128,183,.8); }
.talep.v2 .talep-form .btn:hover { filter: brightness(1.06); transform: translateY(-1px); }

/* ==========================================================================
   Footer v2
   ========================================================================== */
.f-alt { position: relative; isolation: isolate; background: #040B16; color: #8EA4BD; padding: 88px 0 0; font-size: 14.5px; overflow: hidden; }
.f-alt::before { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(45% 60% at 15% 0%, rgba(42,128,183,.22), transparent 70%); }
.f-alt::after { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 1px; background: linear-gradient(90deg, transparent, rgba(79,195,247,.5), transparent); }
.f-izgara { display: grid; grid-template-columns: 1.5fr repeat(4, 1fr); gap: 40px; padding-bottom: 64px; }
.f-logo img { height: 40px; width: auto; }
.f-marka p { margin: 22px 0 24px; max-width: 340px; line-height: 1.65; color: #8EA4BD; }
.f-iletisim { list-style: none; margin: 0 0 26px; padding: 0; display: grid; gap: 10px; }
.f-iletisim li { display: flex; gap: 10px; align-items: flex-start; }
.f-iletisim i { color: #4FC3F7; font-size: 17px; margin-top: 2px; }
.f-iletisim a { color: #C9D6E4; transition: color .2s; }
.f-iletisim a:hover { color: #fff; }
.f-sosyal { display: flex; gap: 8px; }
.f-sosyal a { width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; font-size: 18px; color: #A9BCD2; border: 1px solid rgba(160,200,235,.2); transition: color .2s, border-color .2s, background-color .2s, transform .3s var(--gecis); }
.f-sosyal a:hover { color: #fff; border-color: rgba(79,195,247,.6); background: rgba(42,128,183,.2); transform: translateY(-2px); }
.f-sutun h4 { font-family: var(--yazi-baslik); font-size: 13px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: #fff; margin-bottom: 20px; }
.f-sutun ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 11px; }
.f-sutun a { color: #8EA4BD; display: inline-flex; align-items: center; gap: 4px; transition: color .2s, transform .25s var(--gecis); }
.f-sutun a:hover { color: #fff; transform: translateX(3px); }
.f-sutun a i { font-size: 13px; }
.f-taban { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; padding: 24px 0 30px; border-top: 1px solid rgba(160,200,235,.1); font-size: 13px; color: #6F86A1; }
.f-taban nav { display: flex; flex-wrap: wrap; gap: 6px 22px; }
.f-taban a { color: #8EA4BD; transition: color .2s; }
.f-taban a:hover { color: #fff; }
.referans-bolum.v2 + .f-alt, .f-alt { margin-top: 0; }

@media (max-width: 1024px) {
  .talep.v2 { grid-template-columns: 1fr; }
  .f-izgara { grid-template-columns: 1fr 1fr 1fr; }
  .f-marka { grid-column: 1 / -1; }
}
@media (max-width: 720px) {
  .talep-sol.v2, .talep.v2 .talep-form { padding: 32px 22px; }
  .t-iletisim { grid-template-columns: 1fr; }
  .f-alt { padding-top: 64px; }
  .f-izgara { grid-template-columns: 1fr 1fr; gap: 32px; }
  .f-taban { flex-direction: column; align-items: flex-start; }
}
/* Neden İstek Yazılım: sütun altları hizalı, karolar eşit yükseklikte */
.g-iki { align-items: stretch; }
.g-iki > div:first-child { display: flex; flex-direction: column; }
.g-neden2 { flex: 1; grid-auto-rows: 1fr; }
.g-edon { display: flex; flex-direction: column; }
.g-edon-liste { flex: 1; align-content: start; }
.g-edon > .g-link { margin-top: auto; }
@media (max-width: 1024px) { .g-neden2 { flex: none; } }
/* Logo: 'is' mavi, 'tek' ve 'soft' beyaz (koyu menü ve footer için) */
.nav-logo .logo-renkli, .seffaf-nav .nav:not(.kaydi):not(.menu-acik) .nav-logo .logo-renkli, .nav.menu-acik .nav-logo .logo-renkli { display: none !important; }
.nav-logo .logo-beyaz, .seffaf-nav .nav .nav-logo .logo-beyaz { display: block !important; height: 34px; width: auto; }
.nav-logo::after { -webkit-mask-image: url('/assets/yeni/logo-beyaz.png'); mask-image: url('/assets/yeni/logo-beyaz.png'); }

/* Özel seçim kutusu: ilgilendiğiniz çözüm */
.c-yerel.gizli { position: absolute !important; width: 1px !important; height: 1px !important; opacity: 0; pointer-events: none; }
.c-secim { position: relative; }
.c-dugme { width: 100%; display: flex; align-items: center; gap: 12px; min-height: 62px; padding: 9px 14px 9px 10px; border-radius: 12px; border: 1px solid var(--cizgi); background: var(--zemin-2); font: inherit; color: var(--murekkep); text-align: left; cursor: pointer; transition: border-color .2s, box-shadow .2s, background-color .2s; }
.c-dugme:hover { border-color: var(--cizgi-2); background: #fff; }
.c-dugme:focus-visible, .c-secim.acik .c-dugme { outline: 0; background: #fff; border-color: var(--mavi-400); box-shadow: 0 0 0 4px rgba(42,128,183,.12); }
.c-secim .c-ikon { flex: none; width: 40px; height: 40px; border-radius: 10px; display: grid; place-items: center; font-size: 20px; color: var(--u, var(--mavi-500)); background: color-mix(in srgb, var(--u, var(--mavi-500)) 11%, #fff); border: 1px solid color-mix(in srgb, var(--u, var(--mavi-500)) 22%, #fff); }
.c-secim .c-metin { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.c-secim .c-metin b { font-size: 14.5px; font-weight: 600; color: var(--murekkep); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.c-secim .c-metin small { font-size: 12.5px; color: var(--silik); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.c-secim .c-metin small:empty { display: none; }
.c-ok { flex: none; font-size: 18px; color: var(--silik); transition: color .2s; }
.c-secim.acik .c-ok { color: var(--mavi-500); }
.c-liste { position: absolute; z-index: 30; left: 0; right: 0; top: calc(100% + 8px); margin: 0; padding: 6px; list-style: none; max-height: 340px; overflow-y: auto; background: #fff; border: 1px solid var(--cizgi); border-radius: 14px; box-shadow: 0 28px 60px -24px rgba(11,20,36,.35), 0 6px 16px -8px rgba(11,20,36,.12); opacity: 0; visibility: hidden; transform: translateY(-6px) scale(.985); transform-origin: top center; transition: opacity .18s ease, transform .22s cubic-bezier(.2,.8,.2,1), visibility 0s .22s; }
.c-secim.acik .c-liste { opacity: 1; visibility: visible; transform: none; transition: opacity .18s ease, transform .22s cubic-bezier(.2,.8,.2,1), visibility 0s; }
.c-liste li { display: flex; align-items: center; gap: 12px; padding: 9px 10px; border-radius: 10px; cursor: pointer; transition: background-color .15s; }
.c-liste li + li { margin-top: 2px; }
.c-liste li .c-ikon { width: 36px; height: 36px; font-size: 18px; }
.c-liste li.aktif { background: var(--zemin-2); }
.c-liste li[aria-selected="true"] { background: color-mix(in srgb, var(--u) 7%, #fff); }
.c-liste li[aria-selected="true"] .c-metin b { color: var(--u); }
.c-tik { flex: none; font-size: 18px; color: var(--u); opacity: 0; transform: scale(.6); transition: opacity .15s, transform .2s; }
.c-liste li[aria-selected="true"] .c-tik { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .c-liste, .c-secim.acik .c-liste { transition: none; } }
.talep.v2 { overflow: visible; }
.talep.v2 .talep-sol.v2 { border-radius: 25px 0 0 25px; }
@media (max-width: 1024px) { .talep.v2 .talep-sol.v2 { border-radius: 25px 25px 0 0; } }

/* ==========================================================================
   Footer v3
   ========================================================================== */
.f-alt.v3 { padding-top: 72px; background: #030A14; }
.f-alt.v3::before { background: radial-gradient(40% 50% at 12% 0%, rgba(42,128,183,.20), transparent 70%), radial-gradient(35% 45% at 92% 100%, rgba(79,195,247,.08), transparent 70%); }
.f-alt.v3::after { display: none; }
.f-kartlar { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; padding-bottom: 56px; margin-bottom: 56px; border-bottom: 1px solid rgba(160,200,235,.09); }
.f-kart { position: relative; display: flex; align-items: center; gap: 14px; padding: 18px 18px; border-radius: 16px; background: linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.015)); border: 1px solid rgba(160,200,235,.12); color: #8EA4BD; overflow: hidden; transition: border-color .3s, background-color .3s, transform .35s var(--gecis); }
.f-kart::before { content: ""; position: absolute; inset: 0; background: radial-gradient(120% 120% at 0% 0%, rgba(79,195,247,.14), transparent 55%); opacity: 0; transition: opacity .35s; }
.f-kart:hover { border-color: rgba(79,195,247,.4); transform: translateY(-3px); }
.f-kart:hover::before { opacity: 1; }
.f-kart > span:not(.f-kart-ikon) { position: relative; display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.f-kart small { font-size: 12px; letter-spacing: .02em; color: #6F86A1; }
.f-kart b { font-family: var(--yazi-baslik); font-size: 15px; font-weight: 600; color: #fff; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.f-kart-ikon { position: relative; flex: none; width: 44px; height: 44px; border-radius: 12px; display: grid; place-items: center; font-size: 21px; color: #4FC3F7; background: rgba(42,128,183,.16); border: 1px solid rgba(79,195,247,.22); }
.f-kart-ikon.wp-renk { color: #4ADE80; background: rgba(34,197,94,.12); border-color: rgba(74,222,128,.22); }
.f-kart-ok { position: relative; margin-left: auto; flex: none; font-size: 17px; color: #4E6580; transition: color .25s, transform .3s var(--gecis); }
.f-kart:hover .f-kart-ok { color: #fff; transform: translate(2px,-2px); }

.f-alt.v3 .f-izgara { grid-template-columns: 1.45fr 1.15fr 1.1fr .8fr 1fr; gap: 44px; padding-bottom: 40px; }
.f-alt.v3 .f-marka p { margin: 22px 0 14px; }
.f-alt.v3 .f-marka address { font-style: normal; font-size: 13.5px; line-height: 1.6; color: #6F86A1; max-width: 300px; margin-bottom: 24px; }
.f-alt.v3 .f-sutun h4 { position: relative; padding-bottom: 14px; margin-bottom: 20px; font-size: 12.5px; color: #E6EEF7; }
.f-alt.v3 .f-sutun h4::after { content: ""; position: absolute; left: 0; bottom: 0; width: 22px; height: 2px; border-radius: 2px; background: linear-gradient(90deg, #4FC3F7, #2A80B7); }
.f-alt.v3 .f-sutun a { line-height: 1.45; }
.f-alt.v3 .f-sutun li a::before { content: ""; width: 0; height: 1px; background: #4FC3F7; margin-right: 0; transition: width .25s var(--gecis), margin-right .25s var(--gecis); }
.f-alt.v3 .f-sutun li a:hover { transform: none; }
.f-alt.v3 .f-sutun li a:hover::before { width: 10px; margin-right: 6px; }
.f-portal { margin-top: 24px; display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 14px; border: 1px solid rgba(79,195,247,.25); background: rgba(42,128,183,.12); color: #fff; transition: background-color .25s, border-color .25s; }
.f-portal:hover { background: rgba(42,128,183,.24); border-color: rgba(79,195,247,.5); }
.f-portal > i:first-child { font-size: 21px; color: #4FC3F7; }
.f-portal span { display: flex; flex-direction: column; line-height: 1.25; }
.f-portal b { font-size: 14px; font-weight: 600; }
.f-portal small { font-size: 12px; color: #8EA4BD; }
.f-portal > i:last-child { margin-left: auto; font-size: 16px; color: #8EA4BD; }

.f-filigran { font-family: var(--yazi-baslik); font-weight: 700; font-size: clamp(3.4rem, 13.2vw, 13rem); line-height: .8; letter-spacing: -.035em; text-align: center; white-space: nowrap; user-select: none; pointer-events: none; margin-top: 8px; color: transparent; background: linear-gradient(180deg, rgba(160,200,235,.13) 0%, rgba(160,200,235,.02) 85%); -webkit-background-clip: text; background-clip: text; transform: translateY(14%); }
.f-taban-dis { position: relative; background: rgba(3,10,20,.85); border-top: 1px solid rgba(160,200,235,.09); backdrop-filter: blur(6px); }
.f-alt.v3 .f-taban { border-top: 0; padding-top: 22px; padding-bottom: 22px; }
.f-yukari { width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; font-size: 18px; color: #A9BCD2; border: 1px solid rgba(160,200,235,.2); transition: color .2s, border-color .2s, transform .3s var(--gecis); }
.f-yukari:hover { color: #fff; border-color: rgba(79,195,247,.6); transform: translateY(-3px); }

@media (max-width: 1200px) { .f-kartlar { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 1024px) {
  .f-alt.v3 .f-izgara { grid-template-columns: 1fr 1fr 1fr; }
}
@media (max-width: 720px) {
  .f-kartlar { grid-template-columns: 1fr; padding-bottom: 40px; margin-bottom: 40px; }
  .f-alt.v3 .f-izgara { grid-template-columns: 1fr 1fr; gap: 32px; }
  .f-alt.v3 .f-taban { flex-direction: column; align-items: flex-start; }
  .f-yukari { position: absolute; right: 16px; top: 18px; }
}
.f-kartlar { grid-template-columns: 1fr 1fr 1.3fr 1fr; }
.f-alt.v3 .f-sutun li a { gap: 0; }
@media (max-width: 1200px) { .f-kartlar { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 720px) { .f-kartlar { grid-template-columns: 1fr; } }
@media (min-width: 1201px) { .f-kartlar { display: flex; } .f-kart { flex: 1 1 auto; } }

/* ==========================================================================
   Ana sayfa blog bölümü
   ========================================================================== */
.g-blog { background: #fff; }
.g-blog-bas { display: flex; align-items: flex-end; justify-content: space-between; gap: 32px; margin-bottom: 44px; }
.g-blog-bas h2 { font-family: var(--yazi-baslik); font-size: clamp(1.8rem, 2.8vw, 2.5rem); line-height: 1.15; letter-spacing: -.02em; color: var(--murekkep); margin: 14px 0 12px; }
.g-blog-bas p { color: var(--soluk); max-width: 520px; margin: 0; }
.g-blog-bas .g-link { flex: none; display: inline-flex; align-items: center; gap: 8px; padding: 12px 20px; border-radius: 999px; border: 1px solid var(--cizgi); font-weight: 600; font-size: 14.5px; color: var(--murekkep); transition: border-color .25s, color .25s, background-color .25s; }
.g-blog-bas .g-link:hover { border-color: var(--mavi-400); color: var(--mavi-600); background: var(--mavi-50); }
.g-blog-izgara { display: grid; grid-template-columns: repeat(3, 1fr); gap: 26px; }
.b-kart { display: flex; flex-direction: column; border-radius: 20px; background: #fff; border: 1px solid var(--cizgi); overflow: hidden; color: inherit; transition-delay: var(--gecikme, 0ms); transition: transform .45s var(--gecis), box-shadow .45s var(--gecis), border-color .3s; }
.b-kart:hover { transform: translateY(-6px); border-color: transparent; box-shadow: 0 34px 60px -30px rgba(11,20,36,.35), 0 0 0 1px rgba(42,128,183,.18); }
.b-gorsel { position: relative; display: block; aspect-ratio: 16 / 9.4; overflow: hidden; background: var(--zemin-2); }
.b-gorsel img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s var(--gecis); }
.b-gorsel::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(4,11,22,0) 55%, rgba(4,11,22,.35)); }
.b-kart:hover .b-gorsel img { transform: scale(1.06); }
.b-kategori { position: absolute; z-index: 1; left: 16px; top: 16px; padding: 6px 12px; border-radius: 999px; font-size: 12px; font-weight: 600; color: var(--mavi-700, #1A5E92); background: rgba(255,255,255,.92); backdrop-filter: blur(6px); box-shadow: 0 4px 12px -4px rgba(11,20,36,.25); }
.b-icerik { flex: 1; display: flex; flex-direction: column; padding: 22px 24px 24px; }
.b-meta { display: flex; align-items: center; gap: 6px; font-size: 12.5px; color: var(--silik); margin-bottom: 12px; }
.b-meta i { font-size: 15px; }
.b-nokta { width: 3px; height: 3px; border-radius: 50%; background: currentColor; margin: 0 6px; opacity: .6; }
.b-icerik b { font-family: var(--yazi-baslik); font-size: 18.5px; font-weight: 600; line-height: 1.35; letter-spacing: -.01em; color: var(--murekkep); transition: color .25s; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.b-kart:hover .b-icerik b { color: var(--mavi-600); }
.b-ozet { margin-top: 10px; font-size: 14.5px; line-height: 1.6; color: var(--soluk); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.b-devam { margin-top: auto; padding-top: 20px; display: inline-flex; align-items: center; gap: 6px; font-size: 14px; font-weight: 600; color: var(--mavi-600); }
.b-devam i { transition: transform .3s var(--gecis); }
.b-kart:hover .b-devam i { transform: translateX(4px); }
@media (max-width: 1024px) { .g-blog-izgara { grid-template-columns: repeat(2, 1fr); } .g-blog-izgara .b-kart:nth-child(3) { display: none; } }
@media (max-width: 720px) {
  .g-blog-bas { flex-direction: column; align-items: flex-start; gap: 20px; margin-bottom: 30px; }
  .g-blog-izgara { grid-template-columns: 1fr; gap: 18px; }
  .g-blog-izgara .b-kart:nth-child(3) { display: flex; }
}

/* Blog kartları v2: öne çıkan + yatay liste (dergi düzeni) */
.g-blog-izgara.v2 { grid-template-columns: 1.25fr 1fr; grid-template-rows: 1fr 1fr; gap: 24px; }
.g-blog-izgara.v2 .b-kart { border-radius: 22px; }
.g-blog-izgara.v2 .b-kart:hover { transform: translateY(-4px); }
.g-blog-izgara.v2 .b-gorsel::after { display: none; }
.g-blog-izgara.v2 .b-ust { display: flex; align-items: center; flex-wrap: wrap; gap: 10px 12px; margin-bottom: 14px; }
.g-blog-izgara.v2 .b-kategori { position: static; padding: 5px 11px; font-size: 11.5px; letter-spacing: .04em; text-transform: uppercase; color: var(--mavi-600); background: var(--mavi-50); border: 1px solid var(--mavi-100); box-shadow: none; backdrop-filter: none; }
.g-blog-izgara.v2 .b-meta { margin: 0; font-size: 12.5px; color: var(--silik); }
.g-blog-izgara.v2 .b-devam { gap: 10px; color: var(--murekkep); font-size: 14px; }
.g-blog-izgara.v2 .b-devam i { width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; font-size: 16px; border: 1px solid var(--cizgi); transition: background-color .3s, border-color .3s, color .3s, transform .35s var(--gecis); }
.g-blog-izgara.v2 .b-kart:hover .b-devam i { transform: rotate(45deg); background: var(--mavi-500); border-color: var(--mavi-500); color: #fff; }

/* Öne çıkan: tam görsel, alt kısımda koyu degrade üzerinde metin */
.g-blog-izgara.v2 .one-cikan { grid-row: 1 / span 2; position: relative; min-height: 520px; border: 0; background: #061426; }
.g-blog-izgara.v2 .one-cikan .b-gorsel { position: absolute; inset: 0; aspect-ratio: auto; }
.g-blog-izgara.v2 .one-cikan .b-gorsel::after { display: block; background: linear-gradient(180deg, rgba(4,11,22,.05) 20%, rgba(4,11,22,.55) 55%, rgba(4,11,22,.95) 100%); }
.g-blog-izgara.v2 .one-cikan .b-icerik { position: relative; z-index: 1; margin-top: auto; flex: none; padding: 34px 36px 34px; }
.g-blog-izgara.v2 .one-cikan .b-kategori { color: #fff; background: rgba(255,255,255,.14); border-color: rgba(255,255,255,.22); backdrop-filter: blur(8px); }
.g-blog-izgara.v2 .one-cikan .b-meta { color: rgba(220,232,245,.8); }
.g-blog-izgara.v2 .one-cikan b { color: #fff; font-size: clamp(1.4rem, 2vw, 1.8rem); line-height: 1.25; -webkit-line-clamp: 3; }
.g-blog-izgara.v2 .one-cikan:hover b { color: #fff; }
.g-blog-izgara.v2 .one-cikan .b-ozet { color: rgba(220,232,245,.82); max-width: 560px; -webkit-line-clamp: 2; }
.g-blog-izgara.v2 .one-cikan .b-devam { color: #fff; padding-top: 24px; }
.g-blog-izgara.v2 .one-cikan .b-devam i { border-color: rgba(255,255,255,.3); }
.g-blog-izgara.v2 .one-cikan:hover { box-shadow: 0 40px 70px -34px rgba(4,11,22,.6); }

/* Yan kartlar: solda görsel, sağda metin */
.g-blog-izgara.v2 .b-kart:not(.one-cikan) { flex-direction: row; }
.g-blog-izgara.v2 .b-kart:not(.one-cikan) .b-gorsel { flex: none; width: 40%; aspect-ratio: auto; }
.g-blog-izgara.v2 .b-kart:not(.one-cikan) .b-icerik { padding: 24px 26px; }
.g-blog-izgara.v2 .b-kart:not(.one-cikan) b { font-size: 17.5px; }
.g-blog-izgara.v2 .b-kart:not(.one-cikan) .b-ozet { -webkit-line-clamp: 2; font-size: 14px; }
.g-blog-izgara.v2 .b-kart:not(.one-cikan) .b-devam { padding-top: 16px; }

@media (max-width: 1024px) {
  .g-blog-izgara.v2 { grid-template-columns: 1fr; grid-template-rows: none; }
  .g-blog-izgara.v2 .one-cikan { grid-row: auto; min-height: 440px; }
  .g-blog-izgara.v2 .b-kart:nth-child(3) { display: flex; }
}
@media (max-width: 600px) {
  .g-blog-izgara.v2 .one-cikan { min-height: 400px; }
  .g-blog-izgara.v2 .one-cikan .b-icerik { padding: 24px 22px; }
  .g-blog-izgara.v2 .b-kart:not(.one-cikan) { flex-direction: column; }
  .g-blog-izgara.v2 .b-kart:not(.one-cikan) .b-gorsel { width: 100%; aspect-ratio: 16 / 9; }
  .g-blog-izgara.v2 .b-kart:not(.one-cikan) .b-icerik { padding: 20px 22px 22px; }
}

/* Blog şeridi: sağa sola kaydırılabilir kartlar */
.b-kontrol { flex: none; display: flex; align-items: center; gap: 10px; }
.b-ok { width: 46px; height: 46px; border-radius: 50%; display: grid; place-items: center; font-size: 19px; color: var(--murekkep); background: #fff; border: 1px solid var(--cizgi); cursor: pointer; transition: background-color .25s, border-color .25s, color .25s, opacity .25s; }
.b-ok:hover:not(:disabled) { background: var(--mavi-500); border-color: var(--mavi-500); color: #fff; }
.b-ok:disabled { opacity: .4; cursor: default; }
.b-kontrol .g-link { margin-left: 6px; }
.b-ray { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 2 * 24px) / 3); gap: 24px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; overscroll-behavior-x: contain; scrollbar-width: none; padding: 6px 2px 34px; margin: -6px -2px -34px; cursor: grab; }
.b-ray::-webkit-scrollbar { display: none; }
.b-ray.surukleniyor { cursor: grabbing; }
/* Sürükleme ve ok animasyonu sırasında kart hizalaması kapalı (JS konumu kendisi yönetir) */
.b-ray.kayiyor { scroll-snap-type: none; scroll-behavior: auto; }
.b-ray.surukleniyor .b-kart { pointer-events: none; }
.b-ray .b-kart { scroll-snap-align: start; border-radius: 22px; user-select: none; -webkit-user-drag: none; }
.b-ray .b-kart img { -webkit-user-drag: none; }
.b-ray .b-kart:hover { transform: translateY(-4px); }
.b-ray .b-gorsel::after { display: none; }
.b-ray .b-ust { display: flex; align-items: center; flex-wrap: wrap; gap: 10px 12px; margin-bottom: 14px; }
.b-ray .b-kategori { position: static; padding: 5px 11px; font-size: 11.5px; letter-spacing: .04em; text-transform: uppercase; color: var(--mavi-600); background: var(--mavi-50); border: 1px solid var(--mavi-100); box-shadow: none; backdrop-filter: none; }
.b-ray .b-meta { margin: 0; font-size: 12.5px; color: var(--silik); }
.b-ray .b-devam { gap: 10px; color: var(--murekkep); font-size: 14px; }
.b-ray .b-devam i { width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; font-size: 16px; border: 1px solid var(--cizgi); transition: background-color .3s, border-color .3s, color .3s, transform .35s var(--gecis); }
.b-ray .b-kart:hover .b-devam i { transform: rotate(45deg); background: var(--mavi-500); border-color: var(--mavi-500); color: #fff; }
.b-ilerleme { margin-top: 28px; height: 3px; border-radius: 3px; background: var(--cizgi); overflow: hidden; }
.b-ilerleme span { display: block; height: 100%; width: 30%; border-radius: 3px; background: linear-gradient(90deg, var(--mavi-400), var(--mavi-600)); will-change: transform; }
@media (max-width: 1024px) { .b-ray { grid-auto-columns: calc((100% - 24px) / 2); } .b-ray .b-kart:nth-child(3) { display: flex; } }
@media (max-width: 720px) {
  .b-ray { grid-auto-columns: 84%; gap: 16px; }
  .b-kontrol .b-ok { display: none; }
  .b-kontrol .g-link { margin-left: 0; }
}
/* Filigran: İ harfinin noktası kırpılmasın */
.f-filigran { line-height: 1.05; padding-top: .12em; transform: translateY(22%); }
/* Filigran İ noktası: logodaki i noktası gibi yuvarlatılmış kare */
.f-i { position: relative; display: inline-block; }
.f-i::before { content: ""; position: absolute; left: 50%; top: -.06em; width: .2em; height: .17em; border-radius: .055em; transform: translateX(-50%); background: linear-gradient(180deg, rgba(79,195,247,.32), rgba(42,128,183,.16)); }

/* Rakamlar v2: beyaz kart */
.g-rakam.v2 { background: transparent; overflow: visible; padding: 8px 0 24px; }
.g-rakam.v2::before { display: none; }
.g-rakam.v2 .g-rakam-ic { background: #fff; border: 1px solid var(--cizgi); border-radius: 24px; box-shadow: 0 30px 60px -40px rgba(11,20,36,.30), 0 2px 6px -2px rgba(11,20,36,.05); }
.g-rakam.v2 .g-rakam-ic > div { display: flex; align-items: center; justify-content: center; gap: 18px; padding: 34px 24px; text-align: left; border-left: 1px solid var(--cizgi); }
.g-rakam.v2 .g-rakam-ic > div:first-child { border-left: 0; }
.g-rakam.v2 .r-ikon { flex: none; width: 54px; height: 54px; border-radius: 16px; display: grid; place-items: center; font-size: 26px; color: var(--u); background: color-mix(in srgb, var(--u) 9%, #fff); border: 1px solid color-mix(in srgb, var(--u) 20%, #fff); transition: transform .4s var(--gecis); }
.g-rakam.v2 .g-rakam-ic > div:hover .r-ikon { transform: translateY(-3px) rotate(-4deg); }
.g-rakam.v2 .r-metin { display: flex; flex-direction: column; }
.g-rakam.v2 .g-rakam-ic b { color: var(--murekkep); font-size: clamp(2rem, 3vw, 2.6rem); }
.g-rakam.v2 .g-rakam-ic b em { font-style: normal; color: var(--u); margin-left: 2px; }
.g-rakam.v2 .r-metin small { display: block; margin-top: 8px; font-size: 13.5px; font-weight: 500; color: var(--soluk); letter-spacing: 0; text-transform: none; }
@media (max-width: 1024px) {
  .g-rakam.v2 .g-rakam-ic > div:nth-child(3) { border-left: 0; }
  .g-rakam.v2 .g-rakam-ic > div:nth-child(-n+2) { border-bottom: 1px solid var(--cizgi); }
}
@media (max-width: 720px) {
  .g-rakam.v2 .g-rakam-ic > div { flex-direction: column; text-align: center; gap: 12px; padding: 26px 12px; }
  .g-rakam.v2 .r-ikon { width: 46px; height: 46px; font-size: 22px; }
}
/* Rakamlar v3: giriş hücresi + üst renk çizgisi */
.g-rakam.v2 .g-rakam-ic { grid-template-columns: 1.25fr repeat(4, 1fr); overflow: hidden; }
.g-rakam.v2 .g-rakam-ic > div { position: relative; flex-direction: column; align-items: flex-start; justify-content: flex-start; gap: 18px; padding: 32px 28px 30px; }
.g-rakam.v2 .g-rakam-ic > div:not(.r-giris)::before { content: ""; position: absolute; left: 28px; right: 28px; top: 0; height: 3px; border-radius: 0 0 3px 3px; background: var(--u); opacity: .85; transform: scaleX(.18); transform-origin: left; transition: transform .6s var(--gecis); }
.g-rakam.v2 .g-rakam-ic > div:not(.r-giris):hover::before { transform: scaleX(1); }
.g-rakam.v2 .r-ikon { width: 44px; height: 44px; border-radius: 12px; font-size: 22px; }
.g-rakam.v2 .g-rakam-ic b { font-size: clamp(2.3rem, 3.4vw, 3rem); letter-spacing: -.035em; }
.g-rakam.v2 .r-metin small { margin-top: 10px; font-size: 14px; }
.g-rakam.v2 .r-giris { justify-content: center !important; gap: 0 !important; background: linear-gradient(160deg, #F4F8FC, #fff 70%); }
.g-rakam.v2 .r-giris b { font-family: var(--yazi-baslik); font-size: 1.45rem !important; font-weight: 600; letter-spacing: -.02em; color: var(--murekkep); margin: 12px 0 10px; line-height: 1.2; }
.g-rakam.v2 .r-giris p { margin: 0; font-size: 14px; line-height: 1.6; color: var(--soluk); max-width: 240px; }
@media (max-width: 1200px) {
  .g-rakam.v2 .g-rakam-ic { grid-template-columns: repeat(4, 1fr); }
  .g-rakam.v2 .r-giris { grid-column: 1 / -1; border-bottom: 1px solid var(--cizgi); }
  .g-rakam.v2 .r-giris p { max-width: none; }
  .g-rakam.v2 .g-rakam-ic > div:nth-child(2) { border-left: 0; }
}
@media (max-width: 1024px) {
  .g-rakam.v2 .g-rakam-ic { grid-template-columns: 1fr 1fr; }
  .g-rakam.v2 .g-rakam-ic > div:nth-child(3) { border-left: 1px solid var(--cizgi); }
  .g-rakam.v2 .g-rakam-ic > div:nth-child(4) { border-left: 0; }
  .g-rakam.v2 .g-rakam-ic > div:nth-child(-n+3) { border-bottom: 1px solid var(--cizgi); }
}
@media (max-width: 720px) {
  .g-rakam.v2 .g-rakam-ic > div { align-items: flex-start; text-align: left; padding: 24px 20px; }
}
.g-rakam.v2 .g-rakam-ic > div:not(.r-giris)::before { display: none; }
.g-rakam.v2 .g-rakam-ic > div:not(.r-giris) { transition: background-color .35s; }
.g-rakam.v2 .g-rakam-ic > div:not(.r-giris):hover { background: color-mix(in srgb, var(--u) 4%, #fff); }
/* İ noktası: Poppins 700 'I' gövdesine ölçülerek oturtuldu (gövde .171em, merkez .1475em, büyük harf üstü .173em) */
.f-i::before { left: .062em; top: -.035em; width: .171em; height: .155em; border-radius: .045em; transform: none; }
/* İ noktası: harflerle aynı ton (degradenin o yükseklikteki değeri) */
.f-i::before { background: rgba(160,200,235,.11); }
.f-alt.v3 { padding-top: 80px; }

/* Blog v3: referans bölümüyle aynı dil */
.g-blog { padding-bottom: 64px; }
.g-blog + .referans-bolum.v2 { padding-top: 56px; border-top: 1px solid var(--cizgi); }
.g-blog .ref-etiket { margin-bottom: 18px; }
.g-blog-bas.v2 { display: block; text-align: center; margin: 0 auto 44px; max-width: 640px; }
.g-blog-bas.v2 h2 { margin: 0 0 12px; }
.g-blog-bas.v2 p { margin: 0 auto; }
.b-sahne { position: relative; container-type: inline-size; }
/* Kenar solması: daha fazla kart olan kenarda içerik yumuşakça kaybolur (JS .sol-var / .sag-var ekler) */
.b-sahne::before, .b-sahne::after { content: ""; position: absolute; z-index: 2; top: -6px; bottom: -6px; width: 72px; pointer-events: none; opacity: 0; transition: opacity .35s ease; }
.b-sahne::before { left: -2px; background: linear-gradient(90deg, #fff 8%, rgba(255,255,255,0)); }
.b-sahne::after { right: -2px; background: linear-gradient(270deg, #fff 8%, rgba(255,255,255,0)); }
.b-sahne.sol-var::before, .b-sahne.sag-var::after { opacity: 1; }
@media (max-width: 720px) { .b-sahne::before, .b-sahne::after { width: 28px; } }
.b-ray { will-change: scroll-position; }
.b-sahne .ref-ok.b-ok { position: absolute; z-index: 3; width: 44px; height: 44px; margin-top: -22px; font-size: 20px; color: var(--murekkep); background: #fff; border: 1px solid var(--cizgi-2); box-shadow: 0 8px 20px -10px rgba(11,20,36,.35); top: calc((100cqw - 48px) / 3 * .5875 / 2 + 6px); }
.b-sahne .ref-ok.b-ok.sol { left: -22px; right: auto; }
.b-sahne .ref-ok.b-ok.sag { right: -22px; left: auto; }
.b-sahne .ref-ok.b-ok:hover:not(:disabled) { background: #fff; color: var(--mavi-600); border-color: var(--mavi-200); transform: scale(1.06); }
.b-sahne .ref-ok.b-ok:disabled { opacity: 0; pointer-events: none; }
.b-ray .b-kart { border-radius: 16px; border-color: var(--cizgi-2); }
.b-ray .b-kart:hover { border-color: var(--mavi-200); box-shadow: 0 26px 50px -30px rgba(11,20,36,.35); }
.b-ray .b-gorsel { border-bottom: 1px solid var(--cizgi); }
.b-ray .b-kategori { letter-spacing: .14em; font-size: 11px; font-weight: 600; background: transparent; border: 0; padding: 0; color: var(--mavi-600); }
.b-ray .b-meta::before { content: ""; width: 1px; height: 12px; background: var(--cizgi-2); margin-right: 10px; }
.b-alt { display: flex; flex-direction: column; align-items: center; gap: 28px; margin-top: 30px; }
.b-alt .b-ilerleme { width: 100%; max-width: 280px; margin: 0; }
.b-tum { display: inline-flex; align-items: center; gap: 8px; padding: 12px 22px; border-radius: 999px; border: 1px solid var(--cizgi-2); background: #fff; font-weight: 600; font-size: 14.5px; color: var(--murekkep); transition: border-color .25s, color .25s, box-shadow .25s; }
.b-tum:hover { border-color: var(--mavi-200); color: var(--mavi-600); box-shadow: 0 10px 24px -14px rgba(11,20,36,.35); }
.b-tum i { transition: transform .3s var(--gecis); }
.b-tum:hover i { transform: translateX(3px); }
@media (max-width: 1024px) { .b-sahne .ref-ok.b-ok { top: calc((100cqw - 24px) / 2 * .5875 / 2 + 6px); } }
@media (max-width: 1320px) { .b-sahne .ref-ok.b-ok.sol { left: -12px; } .b-sahne .ref-ok.b-ok.sag { right: -12px; } }
@media (max-width: 720px) { .b-sahne .ref-ok.b-ok { display: none; } .g-blog-bas.v2 { margin-bottom: 30px; } }

/* ==========================================================================
   Kaydırma animasyonları
   ========================================================================== */
:root { --akis: cubic-bezier(.16, 1, .3, 1); }

/* İlerleme çubuğu */
.kaydirma-cubugu { position: fixed; z-index: 1000; left: 0; top: 0; width: 100%; height: 2px; transform-origin: 0 50%; transform: scaleX(0); background: linear-gradient(90deg, #2A80B7, #4FC3F7 60%, #A5E4FF); box-shadow: 0 0 12px rgba(79,195,247,.55); pointer-events: none; }

/* Genel giriş: yükselme + netleşme */
.hareket .gor { transform: translateY(42px) scale(.985); filter: blur(6px); transition: opacity 1.1s var(--akis), transform 1.2s var(--akis), filter 1s var(--akis); }
.hareket .gor.gorundu { transform: none; filter: none; }

/* Sinema çıkışı: içerik yukarı süzülür ve solar, video yavaşça yakınlaşır */
.hareket .sinema { --hp: 0; }
.hareket .sinema-ic { translate: 0 calc(var(--hp) * -90px); opacity: calc(1 - var(--hp) * 1.35); }
.hareket .sinema-video, .hareket .sinema-foto { scale: calc(1 + var(--hp) * .12); }
.hareket .sinema-ag { opacity: calc(1 - var(--hp) * 1.5); }

/* Başlık perdesi: alttan yukarı açılan maske + yükselme */
.hareket .perde { clip-path: inset(0 0 100% 0); translate: 0 .35em; transition: clip-path 1.1s var(--akis), translate 1.1s var(--akis); }
.hareket .perde.acildi { clip-path: inset(-12% -2% -18% -2%); translate: 0 0; }

/* Kademeli kart girişi */
.hareket .kademe { opacity: 0; translate: 0 34px; scale: .97; transition: opacity .9s var(--akis), translate 1s var(--akis), scale 1s var(--akis); transition-delay: calc(var(--k, 0) * 90ms + 80ms); }
.hareket .kademe.acildi { opacity: 1; translate: 0 0; scale: 1; }
.hareket .b-ray .kademe { transition-delay: calc(var(--k, 0) * 110ms + 120ms); }

/* Görsel derinliği (parallaks) */
.hareket .b-gorsel img { height: calc(100% + 32px); margin-top: -16px; translate: 0 var(--py, 0px); }

/* Footer filigranı aşağı inildikçe yükselir ve belirginleşir */
.hareket .f-filigran { --fp: 0; translate: 0 calc((1 - var(--fp)) * 60px); opacity: calc(.35 + var(--fp) * .65); }

@media (max-width: 720px) {
  .hareket .gor { transform: translateY(28px); filter: none; }
  .hareket .sinema-ic { translate: 0 calc(var(--hp) * -50px); }
}
.perde-gozcu { display: block; height: 1px; margin-bottom: -1px; pointer-events: none; }

/* Referans şeridi sayfa genişliğinde, kenarlı kutu */
.ref-bant.kutu { border: 1px solid var(--cizgi-2); border-radius: 18px; background: #fff; }
.ref-bant.kutu .ref-kayan { border-radius: 17px; overflow: hidden; }
.ref-bant.kutu .ref-ok.sol { left: -22px; }
.ref-bant.kutu .ref-ok.sag { right: -22px; }
@media (max-width: 1320px) { .ref-bant.kutu .ref-ok.sol { left: -12px; } .ref-bant.kutu .ref-ok.sag { right: -12px; } }

/* Yumuşak kaydırma (Lenis) */
html.yumusak { scroll-behavior: auto; }
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-smooth [data-lenis-prevent] { overscroll-behavior: contain; }
.lenis.lenis-stopped { overflow: hidden; }

/* Kelime kelime aydınlanan paragraf */
.isikli { --ip: 0; }
.isikli .kelime-isik { opacity: clamp(.16, calc(var(--ip) * (var(--n) + 4) - var(--w)), 1); transition: opacity .25s linear; }

/* Kaydırmaya bağlı 3D giriş */
.g-bento, .g-rakam, .g-iki, .g-blog .kap { perspective: 1600px; }
.hareket .derin { --e: 1; transform-origin: 50% 100%; rotate: x calc((1 - var(--e)) * 16deg); translate: 0 calc((1 - var(--e)) * 50px); }
.hareket .g-rakam-ic.derin { rotate: x calc((1 - var(--e)) * 10deg); scale: calc(.94 + var(--e) * .06); translate: none; }
@media (max-width: 720px) { .hareket .derin { rotate: x calc((1 - var(--e)) * 8deg); translate: 0 calc((1 - var(--e)) * 24px); } }
/* "Yukarı çık" sırasında kaydırma efektleri donar: kartlar düz, yazılar tam parlak; geçiş animasyonları devre dışı */
.tepeye .derin { --e: 1 !important; }
.tepeye .isikli { --ip: 1 !important; }
.tepeye .isikli .kelime-isik { transition: none; }
/* Degradeli "dijital": j harfinin kuyruğu kutunun dışına taşıyordu; degrade alanı aşağı uzatıldı */
.sinema-baslik.v2 .vurgu > span { padding-bottom: .2em; margin-bottom: -.2em; }

/* ==========================================================================
   İç sayfa başlık bandı
   ========================================================================== */
.s-bas { position: relative; isolation: isolate; overflow: hidden; margin-top: calc(-1 * var(--nav-h)); padding: calc(var(--nav-h) + 72px) 0 76px; background: #040B16; color: #A9BCD2; }
.s-bas::before { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(42% 80% at 82% 0%, rgba(42,128,183,.38), transparent 70%), radial-gradient(30% 60% at 8% 100%, rgba(79,195,247,.12), transparent 70%); }
.s-bas::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: linear-gradient(90deg, transparent, rgba(79,195,247,.45), transparent); }
.s-bas-desen { position: absolute; inset: 0; z-index: -1; background-image: linear-gradient(rgba(160,200,235,.06) 1px, transparent 1px), linear-gradient(90deg, rgba(160,200,235,.06) 1px, transparent 1px); background-size: 56px 56px; -webkit-mask-image: radial-gradient(70% 90% at 70% 10%, #000, transparent 75%); mask-image: radial-gradient(70% 90% at 70% 10%, #000, transparent 75%); }
.s-bas-ic { position: relative; }
.s-yol { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 30px; font-size: 13px; color: #6F86A1; }
.s-yol a { color: #8EA4BD; display: inline-flex; align-items: center; transition: color .2s; }
.s-yol a:hover { color: #fff; }
.s-yol .ti-home { font-size: 16px; }
.s-yol .ayrac { font-size: 12px; opacity: .6; }
.s-yol [aria-current] { color: #DCE8F5; }
.gizli-metin { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.s-etiket { display: inline-flex; align-items: center; gap: 12px; font-family: var(--yazi-baslik); font-size: 12px; font-weight: 600; letter-spacing: .22em; text-transform: uppercase; color: #4FC3F7; }
.s-etiket::before { content: ""; width: 28px; height: 1px; background: currentColor; }
.s-bas h1 { margin: 18px 0 0; max-width: 820px; font-family: var(--yazi-baslik); font-size: clamp(2.2rem, 4.4vw, 3.6rem); font-weight: 600; line-height: 1.08; letter-spacing: -.03em; color: #fff; }
.s-bas h1 em { font-style: normal; background: linear-gradient(100deg, #3E8EF0, #4FC3F7 50%, #A5E4FF); -webkit-background-clip: text; background-clip: text; color: transparent; padding-bottom: .1em; }
.s-bas p { margin: 20px 0 0; max-width: 620px; font-size: 17px; line-height: 1.65; color: #A9BCD2; }
.hareket .s-bas-ic > * { animation: sBasGel 1s var(--akis) both; }
.hareket .s-bas-ic > *:nth-child(2) { animation-delay: .06s; } .hareket .s-bas-ic > *:nth-child(3) { animation-delay: .14s; } .hareket .s-bas-ic > *:nth-child(4) { animation-delay: .22s; } .hareket .s-bas-ic > *:nth-child(5) { animation-delay: .3s; }
@keyframes sBasGel { from { opacity: 0; transform: translateY(26px); filter: blur(6px); } to { opacity: 1; transform: none; filter: none; } }
@media (max-width: 720px) { .s-bas { padding: calc(var(--nav-h) + 40px) 0 52px; } .s-bas p { font-size: 15.5px; } .s-yol { margin-bottom: 22px; } }

/* İç sayfa genel gövde */
.s-govde { padding: 88px 0 104px; background: #fff; }
.s-govde.gri { background: var(--zemin-2); }
@media (max-width: 720px) { .s-govde { padding: 56px 0 72px; } }

/* ==========================================================================
   İletişim sayfası
   ========================================================================== */
.i-kanal-bolum { padding-bottom: 0; }
.i-kanallar { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; margin-top: -150px; position: relative; z-index: 2; }
.i-kanal { position: relative; display: flex; flex-direction: column; padding: 26px 24px 24px; border-radius: 20px; background: #fff; border: 1px solid var(--cizgi); box-shadow: 0 30px 60px -36px rgba(11,20,36,.35); color: inherit; overflow: hidden; transition: transform .45s var(--gecis), box-shadow .45s var(--gecis), border-color .3s; }
.i-kanal::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 3px; background: var(--u); transform: scaleX(0); transform-origin: left; transition: transform .5s var(--gecis); }
.i-kanal:hover { transform: translateY(-5px); border-color: color-mix(in srgb, var(--u) 30%, #fff); box-shadow: 0 36px 64px -34px rgba(11,20,36,.42); }
.i-kanal:hover::before { transform: scaleX(1); }
.i-ikon { width: 48px; height: 48px; border-radius: 14px; display: grid; place-items: center; font-size: 23px; color: var(--u); background: color-mix(in srgb, var(--u) 10%, #fff); border: 1px solid color-mix(in srgb, var(--u) 22%, #fff); margin-bottom: 22px; }
.i-kanal small { font-size: 12px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--silik); }
.i-kanal b { margin-top: 8px; font-family: var(--yazi-baslik); font-size: 18px; font-weight: 600; color: var(--murekkep); letter-spacing: -.01em; overflow-wrap: anywhere; }
.i-alt { margin-top: 6px; font-size: 13.5px; color: var(--soluk); }
.i-ok { position: absolute; right: 20px; top: 24px; width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; font-size: 16px; color: var(--silik); border: 1px solid var(--cizgi); transition: background-color .3s, color .3s, border-color .3s, transform .35s var(--gecis); }
.i-kanal:hover .i-ok { background: var(--u); border-color: var(--u); color: #fff; transform: rotate(45deg); }
.s-bas + .i-kanal-bolum { padding-top: 0; }
.s-bas:has(+ .i-kanal-bolum) { padding-bottom: 200px; }
.i-kanal-bolum + .g-talep { padding-top: 88px; }
.capa { position: absolute; margin-top: calc(-1 * var(--nav-h) - 20px); }

.i-ofis-bolum { padding-top: 0; }
.i-ofis { display: grid; grid-template-columns: .9fr 1.1fr; border-radius: 26px; overflow: hidden; border: 1px solid var(--cizgi); background: #fff; box-shadow: 0 40px 80px -50px rgba(11,20,36,.4); }
.i-ofis-bilgi { padding: 52px 48px; display: flex; flex-direction: column; }
.i-ofis-bilgi h2 { font-family: var(--yazi-baslik); font-size: clamp(1.7rem, 2.4vw, 2.2rem); font-weight: 600; letter-spacing: -.02em; color: var(--murekkep); margin: 14px 0 28px; }
.i-ofis-bilgi ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 22px; }
.i-ofis-bilgi li { display: flex; gap: 14px; align-items: flex-start; font-size: 15px; line-height: 1.6; color: var(--soluk); }
.i-ofis-bilgi li > i { flex: none; width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; font-size: 19px; color: var(--mavi-600); background: var(--mavi-50); border: 1px solid var(--mavi-100); }
.i-ofis-bilgi li b { display: block; font-size: 13px; font-weight: 600; color: var(--murekkep); margin-bottom: 2px; }
.i-ofis-bilgi li a { color: var(--soluk); transition: color .2s; }
.i-ofis-bilgi li a:hover { color: var(--mavi-600); }
.i-ofis-alt { margin-top: auto; padding-top: 34px; display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.i-sosyal a { color: var(--soluk); border-color: var(--cizgi-2); }
.i-sosyal a:hover { color: #fff; background: var(--mavi-500); border-color: var(--mavi-500); }
.i-harita { position: relative; min-height: 460px; background: var(--zemin-2); }
.i-harita iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; filter: grayscale(.25) contrast(1.02); }

@media (max-width: 1024px) {
  .i-kanallar { grid-template-columns: 1fr 1fr; }
  .i-ofis { grid-template-columns: 1fr; }
  .i-harita { min-height: 340px; }
}
@media (max-width: 720px) {
  .i-kanallar { grid-template-columns: 1fr; gap: 14px; margin-top: -120px; }
  .s-bas:has(+ .i-kanal-bolum) { padding-bottom: 160px; }
  .i-ofis-bilgi { padding: 34px 24px; }
}

/* İletişim: süreç adımları */
.i-surec { margin-top: 72px; padding: 44px 44px 40px; border-radius: 24px; background: var(--zemin-2); border: 1px solid var(--cizgi); }
.i-surec-bas { display: flex; align-items: baseline; justify-content: space-between; gap: 20px; flex-wrap: wrap; margin-bottom: 30px; }
.i-surec-bas h2 { font-family: var(--yazi-baslik); font-size: clamp(1.5rem, 2.2vw, 1.9rem); font-weight: 600; letter-spacing: -.02em; color: var(--murekkep); margin: 10px 0 0; flex-basis: 100%; }
.i-adimlar { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; counter-reset: adim; }
.i-adimlar li { position: relative; padding: 0 26px 0 0; }
.i-adimlar li + li { padding-left: 26px; border-left: 1px solid var(--cizgi-2); }
.i-no { position: absolute; right: 22px; top: 2px; font-family: var(--yazi-baslik); font-size: 13px; font-weight: 600; color: var(--silik); letter-spacing: .04em; }
.i-adim-ikon { width: 46px; height: 46px; border-radius: 14px; display: grid; place-items: center; font-size: 22px; color: var(--mavi-600); background: #fff; border: 1px solid var(--cizgi-2); box-shadow: 0 8px 18px -12px rgba(11,20,36,.3); margin-bottom: 18px; }
.i-adimlar b { display: block; font-family: var(--yazi-baslik); font-size: 16.5px; font-weight: 600; color: var(--murekkep); margin-bottom: 8px; }
.i-adimlar p { margin: 0; font-size: 14px; line-height: 1.6; color: var(--soluk); }

/* İletişim: sık sorulan sorular */
.i-sss-bolum { padding-top: 0; }
.i-sss-izgara { display: grid; grid-template-columns: .8fr 1.2fr; gap: 64px; align-items: start; }
.i-sss-bas { position: sticky; top: calc(var(--nav-h) + 32px); }
.i-sss-bas h2 { font-family: var(--yazi-baslik); font-size: clamp(1.8rem, 2.6vw, 2.4rem); font-weight: 600; letter-spacing: -.02em; line-height: 1.15; color: var(--murekkep); margin: 14px 0 14px; }
.i-sss-bas p { color: var(--soluk); margin: 0 0 26px; line-height: 1.65; }
.i-sss { display: grid; gap: 12px; }
.i-soru { border: 1px solid var(--cizgi); border-radius: 16px; background: #fff; transition: border-color .3s, box-shadow .3s; }
.i-soru[open] { border-color: var(--mavi-200); box-shadow: 0 20px 40px -30px rgba(11,20,36,.35); }
.i-soru summary { list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 20px 22px; font-family: var(--yazi-baslik); font-size: 16px; font-weight: 600; color: var(--murekkep); }
.i-soru summary::-webkit-details-marker { display: none; }
.i-soru summary i { flex: none; width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; font-size: 16px; color: var(--mavi-600); background: var(--mavi-50); transition: transform .35s var(--gecis), background-color .3s, color .3s; }
.i-soru[open] summary i { transform: rotate(45deg); background: var(--mavi-500); color: #fff; }
.i-soru summary:hover span { color: var(--mavi-600); }
.i-cevap { padding: 0 22px 20px; }
.i-cevap p { margin: 0; font-size: 15px; line-height: 1.7; color: var(--soluk); max-width: 640px; }
.i-soru[open] .i-cevap { animation: cevapAc .45s var(--akis); }
@keyframes cevapAc { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }

@media (max-width: 1024px) {
  .i-adimlar { grid-template-columns: 1fr 1fr; row-gap: 30px; }
  .i-adimlar li:nth-child(3) { padding-left: 0; border-left: 0; }
  .i-sss-izgara { grid-template-columns: 1fr; gap: 32px; }
  .i-sss-bas { position: static; }
}
@media (max-width: 720px) {
  .i-surec { padding: 30px 22px; margin-top: 48px; }
  .i-adimlar { grid-template-columns: 1fr; }
  .i-adimlar li, .i-adimlar li + li { padding: 0; border-left: 0; }
  .i-adimlar li + li { padding-top: 24px; border-top: 1px solid var(--cizgi-2); }
  .i-no { right: 0; }
  .i-adimlar li + li .i-no { top: 26px; }
}
.i-kanallar { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 1024px) { .i-kanallar { grid-template-columns: 1fr 1fr; } }
@media (max-width: 720px) { .i-kanallar { grid-template-columns: 1fr; } }

/* ==========================================================================
   Hakkımızda sayfası
   ========================================================================== */
.h-hikaye-izgara { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: center; }
.h-gorseller { position: relative; padding: 0 0 70px 0; }
.h-foto { border-radius: 24px; overflow: hidden; background: var(--zemin-2); box-shadow: 0 40px 80px -46px rgba(11,20,36,.5); }
.h-foto img { width: 100%; height: 100%; object-fit: cover; display: block; }
.h-foto.ana { aspect-ratio: 4 / 4.4; width: 84%; }
.h-foto.kucuk { position: absolute; right: 0; bottom: 0; width: 46%; aspect-ratio: 1; border: 8px solid #fff; border-radius: 26px; }
.h-rozet { position: absolute; left: -24px; bottom: 120px; display: flex; align-items: center; gap: 14px; padding: 18px 22px; border-radius: 18px; background: #061426; color: #A9BCD2; box-shadow: 0 30px 50px -24px rgba(4,11,22,.6); }
.h-rozet b { font-family: var(--yazi-baslik); font-size: 2.4rem; font-weight: 600; letter-spacing: -.03em; color: #fff; line-height: 1; }
.h-rozet b span { display: inline; font: inherit; color: inherit; }
.h-rozet > span { font-size: 13px; line-height: 1.35; }
.h-metin h2 { font-family: var(--yazi-baslik); font-size: clamp(1.9rem, 2.8vw, 2.6rem); font-weight: 600; line-height: 1.15; letter-spacing: -.025em; color: var(--murekkep); margin: 14px 0 22px; }
.h-metin p { color: var(--soluk); font-size: 16px; line-height: 1.75; margin: 0 0 16px; }
.h-metin .h-giris { font-size: 17.5px; color: var(--murekkep); }
.h-imza { margin-top: 30px; display: flex; gap: 16px; padding: 22px 24px; border-radius: 18px; background: var(--zemin-2); border: 1px solid var(--cizgi); border-left: 3px solid var(--mavi-500); }
.h-imza-ikon { flex: none; width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; font-size: 20px; color: var(--mavi-600); background: #fff; border: 1px solid var(--cizgi-2); }
.h-imza p { margin: 0; font-family: var(--yazi-baslik); font-size: 16px; font-weight: 500; line-height: 1.6; color: var(--murekkep); }
.h-hikaye + .g-rakam { padding-bottom: 0; }

.h-mv-izgara { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.h-mv-kart { position: relative; padding: 34px 32px 32px; border-radius: 22px; background: #fff; border: 1px solid var(--cizgi); overflow: hidden; transition: transform .45s var(--gecis), box-shadow .45s var(--gecis), border-color .3s; }
.h-mv-kart::after { content: ""; position: absolute; right: -60px; top: -60px; width: 180px; height: 180px; border-radius: 50%; background: radial-gradient(circle, color-mix(in srgb, var(--u) 14%, transparent), transparent 70%); }
.h-mv-kart:hover { transform: translateY(-5px); border-color: color-mix(in srgb, var(--u) 30%, #fff); box-shadow: 0 34px 60px -38px rgba(11,20,36,.4); }
.h-mv-ikon { width: 52px; height: 52px; border-radius: 15px; display: grid; place-items: center; font-size: 25px; color: #fff; background: var(--u); box-shadow: 0 14px 26px -12px color-mix(in srgb, var(--u) 70%, transparent); }
.h-mv-etiket { display: block; margin: 24px 0 10px; font-size: 12px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--u); }
.h-mv-kart h3 { font-family: var(--yazi-baslik); font-size: 19px; font-weight: 600; line-height: 1.35; color: var(--murekkep); margin: 0 0 12px; }
.h-mv-kart p { margin: 0; font-size: 14.5px; line-height: 1.65; color: var(--soluk); }

.h-guvence-bolum { padding: 0 0 8px; background: #fff; }
.h-guvence { position: relative; isolation: isolate; overflow: hidden; display: grid; grid-template-columns: .8fr 2fr; gap: 56px; align-items: center; padding: 56px 56px; border-radius: 28px; background: #061426; color: #A9BCD2; }
.h-guvence::before { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(50% 90% at 0% 0%, rgba(42,128,183,.35), transparent 70%), radial-gradient(40% 80% at 100% 100%, rgba(79,195,247,.12), transparent 70%); }
.h-guvence-bas h2 { font-family: var(--yazi-baslik); font-size: clamp(1.6rem, 2.4vw, 2.1rem); font-weight: 600; line-height: 1.2; letter-spacing: -.02em; color: #fff; margin: 16px 0 0; }
.h-guvence-liste { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.h-guvence-oge { padding: 26px 24px; border-radius: 18px; background: rgba(255,255,255,.04); border: 1px solid rgba(160,200,235,.14); transition: background-color .3s, border-color .3s; }
.h-guvence-oge:hover { background: rgba(255,255,255,.07); border-color: rgba(79,195,247,.35); }
.h-g-ikon { width: 46px; height: 46px; border-radius: 13px; display: grid; place-items: center; font-size: 23px; color: #4FC3F7; background: rgba(42,128,183,.18); border: 1px solid rgba(79,195,247,.28); margin-bottom: 18px; }
.h-guvence-oge b { display: block; font-family: var(--yazi-baslik); font-size: 17px; font-weight: 600; color: #fff; margin-bottom: 8px; }
.h-guvence-oge p { margin: 0; font-size: 14px; line-height: 1.6; color: #A9BCD2; }

.h-neden-izgara { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; border: 1px solid var(--cizgi); border-radius: 22px; overflow: hidden; background: #fff; }
.h-neden-kart { padding: 34px 32px; border-right: 1px solid var(--cizgi); border-bottom: 1px solid var(--cizgi); transition: background-color .35s; }
.h-neden-kart:nth-child(3n) { border-right: 0; }
.h-neden-kart:nth-last-child(-n+3) { border-bottom: 0; }
.h-neden-kart:hover { background: color-mix(in srgb, var(--u) 4%, #fff); }
.h-neden-kart .g-halka { margin-bottom: 20px; }
.h-neden-kart b { display: block; font-family: var(--yazi-baslik); font-size: 17px; font-weight: 600; color: var(--murekkep); margin-bottom: 8px; }
.h-neden-kart p { margin: 0; font-size: 14.5px; line-height: 1.65; color: var(--soluk); }

.h-surec-bas { display: flex; align-items: flex-end; justify-content: space-between; gap: 32px; margin-bottom: 56px; }
.h-surec-bas h2 { font-family: var(--yazi-baslik); font-size: clamp(1.8rem, 2.6vw, 2.4rem); font-weight: 600; line-height: 1.15; letter-spacing: -.02em; color: var(--murekkep); margin: 14px 0 0; max-width: 620px; }
.h-zaman { position: relative; list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 28px; }
.h-zaman::before { content: ""; position: absolute; left: 24px; right: 24px; top: 24px; height: 2px; background: linear-gradient(90deg, var(--mavi-300), var(--mavi-100)); }
.h-zaman-adim { position: relative; }
.h-zaman-nokta { position: relative; width: 50px; height: 50px; border-radius: 50%; display: grid; place-items: center; font-size: 22px; color: #fff; background: var(--mavi-500); box-shadow: 0 0 0 6px var(--zemin-2), 0 12px 24px -10px rgba(42,128,183,.6); margin-bottom: 24px; }
.h-zaman-no { display: block; font-size: 12px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--mavi-600); margin-bottom: 8px; }
.h-zaman-adim b { display: block; font-family: var(--yazi-baslik); font-size: 18px; font-weight: 600; color: var(--murekkep); margin-bottom: 10px; }
.h-zaman-adim p { margin: 0; font-size: 14.5px; line-height: 1.65; color: var(--soluk); }

.h-alan { display: grid; grid-template-columns: 1fr 1.1fr; gap: 64px; align-items: center; }
.h-alan h2 { font-family: var(--yazi-baslik); font-size: clamp(1.8rem, 2.6vw, 2.4rem); font-weight: 600; line-height: 1.15; letter-spacing: -.02em; color: var(--murekkep); margin: 14px 0 16px; }
.h-alan p { margin: 0; color: var(--soluk); line-height: 1.7; }
.h-alan-liste { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.h-alan-liste li { display: flex; align-items: center; gap: 14px; padding: 18px 20px; border-radius: 16px; border: 1px solid var(--cizgi); background: #fff; font-family: var(--yazi-baslik); font-size: 15.5px; font-weight: 600; color: var(--murekkep); transition: border-color .3s, box-shadow .3s, transform .35s var(--gecis); }
.h-alan-liste li:hover { border-color: var(--mavi-200); box-shadow: 0 18px 36px -26px rgba(11,20,36,.4); transform: translateY(-2px); }
.h-alan-liste i { flex: none; width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; font-size: 20px; color: var(--mavi-600); background: var(--mavi-50); }
.h-alan-bolum { padding-bottom: 40px; }
.h-alan-bolum + .referans-bolum.v2 { padding-top: 40px; }

@media (max-width: 1024px) {
  .h-hikaye-izgara, .h-alan { grid-template-columns: 1fr; gap: 48px; }
  .h-gorseller { max-width: 560px; }
  .h-mv-izgara { grid-template-columns: 1fr; }
  .h-guvence { grid-template-columns: 1fr; gap: 32px; padding: 40px 32px; }
  .h-neden-izgara { grid-template-columns: 1fr 1fr; }
  .h-neden-kart:nth-child(3n) { border-right: 1px solid var(--cizgi); }
  .h-neden-kart:nth-child(2n) { border-right: 0; }
  .h-neden-kart:nth-last-child(-n+3) { border-bottom: 1px solid var(--cizgi); }
  .h-neden-kart:nth-last-child(-n+2) { border-bottom: 0; }
  .h-zaman { grid-template-columns: 1fr 1fr; row-gap: 40px; }
  .h-zaman::before { display: none; }
  .h-surec-bas { flex-direction: column; align-items: flex-start; }
}
@media (max-width: 720px) {
  .h-rozet { left: 12px; bottom: 90px; padding: 14px 16px; }
  .h-rozet b { font-size: 1.9rem; }
  .h-guvence-liste { grid-template-columns: 1fr; }
  .h-guvence { padding: 32px 22px; }
  .h-neden-izgara { grid-template-columns: 1fr; }
  .h-neden-kart, .h-neden-kart:nth-child(3n) { border-right: 0; border-bottom: 1px solid var(--cizgi); }
  .h-neden-kart:last-child { border-bottom: 0; }
  .h-zaman { grid-template-columns: 1fr; }
  .h-alan-liste { grid-template-columns: 1fr; }
}
.h-guvence { grid-template-columns: 1fr; gap: 36px; }
.h-guvence-bas { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; }
.h-guvence-bas h2 { max-width: 560px; }
.h-guvence-bas { display: block; }
.kapanis-cta { margin-top: 96px; margin-bottom: 104px; }
.referans-bolum.v2 + .kapanis-cta { margin-top: 0; }
@media (max-width: 720px) { .kapanis-cta { margin-top: 64px; margin-bottom: 64px; } }
/* Üst menü logosu biraz büyütüldü */
.nav-logo .logo-beyaz, .seffaf-nav .nav .nav-logo .logo-beyaz { height: 38px !important; }
@media (max-width: 720px) { .nav-logo .logo-beyaz, .seffaf-nav .nav .nav-logo .logo-beyaz { height: 35px !important; } }

/* ==========================================================================
   Blog listesi
   ========================================================================== */
.bl-ara { margin-top: 34px; max-width: 560px; display: flex; align-items: center; gap: 10px; padding: 6px 6px 6px 18px; border-radius: 999px; background: rgba(255,255,255,.06); border: 1px solid rgba(160,200,235,.2); backdrop-filter: blur(8px); transition: border-color .25s, background-color .25s; }
.bl-ara:focus-within { border-color: rgba(79,195,247,.6); background: rgba(255,255,255,.09); }
.bl-ara > i { font-size: 19px; color: #8EA4BD; }
.bl-ara input { flex: 1; min-width: 0; height: 44px; border: 0; background: transparent; color: #fff; font: inherit; font-size: 15px; outline: 0; }
.bl-ara input::placeholder { color: #6F86A1; }
.bl-ara button { height: 44px; padding: 0 22px; border-radius: 999px; border: 0; background: linear-gradient(135deg, #2A80B7, #3E9BD6); color: #fff; font: inherit; font-weight: 600; font-size: 14.5px; cursor: pointer; transition: filter .2s; }
.bl-ara button:hover { filter: brightness(1.1); }

.bl-govde { padding-top: 56px; }
.bl-kategoriler { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 40px; }
.bl-kategoriler a { display: inline-flex; align-items: center; gap: 10px; padding: 10px 16px; border-radius: 999px; border: 1px solid var(--cizgi-2); background: #fff; font-size: 14.5px; font-weight: 600; color: var(--murekkep); transition: border-color .25s, color .25s, background-color .25s; }
.bl-kategoriler a span { min-width: 24px; height: 22px; padding: 0 7px; border-radius: 999px; display: grid; place-items: center; font-size: 12px; color: var(--soluk); background: var(--zemin-2); }
.bl-kategoriler a:hover { border-color: var(--mavi-200); color: var(--mavi-600); }
.bl-kategoriler a.secili { background: var(--murekkep); border-color: var(--murekkep); color: #fff; }
.bl-kategoriler a.secili span { background: rgba(255,255,255,.16); color: #fff; }
.bl-sonuc { margin: -16px 0 32px; color: var(--soluk); display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.bl-sonuc b { color: var(--murekkep); }
.bl-sonuc a { display: inline-flex; align-items: center; gap: 4px; font-size: 14px; font-weight: 600; color: var(--mavi-600); }

.bl-one { display: grid; grid-template-columns: 1.15fr 1fr; margin-bottom: 40px; border-radius: 24px; overflow: hidden; border: 1px solid var(--cizgi-2); background: #fff; color: inherit; transition: box-shadow .45s var(--gecis), border-color .3s, transform .45s var(--gecis); }
.bl-one:hover { border-color: var(--mavi-200); box-shadow: 0 36px 70px -40px rgba(11,20,36,.4); transform: translateY(-3px); }
.bl-one-gorsel { position: relative; min-height: 380px; overflow: hidden; background: var(--zemin-2); }
.bl-one-gorsel img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .9s var(--gecis); }
.bl-one:hover .bl-one-gorsel img { transform: scale(1.04); }
.bl-one-icerik { display: flex; flex-direction: column; justify-content: center; padding: 48px 48px; }
.bl-one-etiket { align-self: flex-start; display: inline-flex; align-items: center; gap: 6px; margin-bottom: 22px; padding: 6px 12px; border-radius: 999px; font-size: 12.5px; font-weight: 600; color: var(--mavi-600); background: var(--mavi-50); border: 1px solid var(--mavi-100); }
.bl-one .b-ust { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 14px; }
.bl-one .b-kategori { position: static; padding: 0; background: none; border: 0; box-shadow: none; font-size: 11.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--mavi-600); }
.bl-one .b-meta { margin: 0; font-size: 13px; color: var(--silik); }
.bl-one .b-meta::before { content: ""; width: 1px; height: 12px; background: var(--cizgi-2); margin-right: 10px; }
.bl-one b { font-family: var(--yazi-baslik); font-size: clamp(1.5rem, 2.2vw, 2rem); font-weight: 600; line-height: 1.25; letter-spacing: -.02em; color: var(--murekkep); }
.bl-one:hover b { color: var(--mavi-600); }
.bl-one .b-ozet { margin-top: 14px; font-size: 15.5px; line-height: 1.7; color: var(--soluk); }
.bl-one .b-devam { margin-top: 28px; display: inline-flex; align-items: center; gap: 10px; font-weight: 600; font-size: 14.5px; color: var(--murekkep); }
.bl-one .b-devam i { width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; border: 1px solid var(--cizgi-2); transition: transform .35s var(--gecis), background-color .3s, color .3s, border-color .3s; }
.bl-one:hover .b-devam i { transform: rotate(45deg); background: var(--mavi-500); border-color: var(--mavi-500); color: #fff; }

/* Kart ızgarası: ana sayfa şeridiyle aynı kart dili */
.bl-izgara, .by-ilgili-izgara { display: grid; grid-template-columns: repeat(3, 1fr); gap: 26px; }
:is(.bl-izgara, .by-ilgili-izgara) .b-kart { border-radius: 16px; border-color: var(--cizgi-2); }
:is(.bl-izgara, .by-ilgili-izgara) .b-kart:hover { transform: translateY(-4px); border-color: var(--mavi-200); box-shadow: 0 26px 50px -30px rgba(11,20,36,.35); }
:is(.bl-izgara, .by-ilgili-izgara) .b-gorsel { border-bottom: 1px solid var(--cizgi); }
:is(.bl-izgara, .by-ilgili-izgara) .b-gorsel::after { display: none; }
:is(.bl-izgara, .by-ilgili-izgara) .b-ust { display: flex; align-items: center; flex-wrap: wrap; gap: 10px 12px; margin-bottom: 14px; }
:is(.bl-izgara, .by-ilgili-izgara) .b-kategori { position: static; letter-spacing: .14em; font-size: 11px; font-weight: 600; text-transform: uppercase; background: transparent; border: 0; padding: 0; box-shadow: none; backdrop-filter: none; color: var(--mavi-600); }
:is(.bl-izgara, .by-ilgili-izgara) .b-meta { margin: 0; font-size: 12.5px; color: var(--silik); }
:is(.bl-izgara, .by-ilgili-izgara) .b-meta::before { content: ""; width: 1px; height: 12px; background: var(--cizgi-2); margin-right: 10px; }
:is(.bl-izgara, .by-ilgili-izgara) .b-devam { gap: 10px; color: var(--murekkep); font-size: 14px; }
:is(.bl-izgara, .by-ilgili-izgara) .b-devam i { width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; font-size: 16px; border: 1px solid var(--cizgi); transition: background-color .3s, border-color .3s, color .3s, transform .35s var(--gecis); }
:is(.bl-izgara, .by-ilgili-izgara) .b-kart:hover .b-devam i { transform: rotate(45deg); background: var(--mavi-500); border-color: var(--mavi-500); color: #fff; }

.bl-bos { text-align: center; padding: 72px 24px; border: 1px dashed var(--cizgi-2); border-radius: 24px; background: var(--zemin-2); }
.bl-bos-ikon { width: 64px; height: 64px; margin: 0 auto 20px; border-radius: 18px; display: grid; place-items: center; font-size: 30px; color: var(--mavi-600); background: #fff; border: 1px solid var(--cizgi-2); }
.bl-bos b { display: block; font-family: var(--yazi-baslik); font-size: 19px; color: var(--murekkep); margin-bottom: 8px; }
.bl-bos p { color: var(--soluk); margin: 0 0 24px; }
.bl-sayfalar { display: flex; justify-content: center; gap: 8px; margin-top: 56px; }
.bl-sayfalar a { min-width: 44px; height: 44px; padding: 0 12px; border-radius: 12px; display: grid; place-items: center; font-weight: 600; color: var(--murekkep); border: 1px solid var(--cizgi-2); background: #fff; transition: border-color .25s, color .25s; }
.bl-sayfalar a:hover { border-color: var(--mavi-300); color: var(--mavi-600); }
.bl-sayfalar a.secili { background: var(--mavi-500); border-color: var(--mavi-500); color: #fff; }

@media (max-width: 1024px) {
  .bl-izgara, .by-ilgili-izgara { grid-template-columns: 1fr 1fr; }
  .bl-one { grid-template-columns: 1fr; }
  .bl-one-gorsel { min-height: 280px; }
  .bl-one-icerik { padding: 34px 32px; }
}
@media (max-width: 720px) {
  .bl-izgara, .by-ilgili-izgara { grid-template-columns: 1fr; gap: 18px; }
  .bl-one-gorsel { min-height: 220px; }
  .bl-one-icerik { padding: 26px 22px; }
  .bl-kategoriler { flex-wrap: nowrap; overflow-x: auto; margin: 0 -16px 32px; padding: 0 16px 4px; scrollbar-width: none; }
  .bl-kategoriler a { flex: none; }
  .bl-ara button { padding: 0 16px; }
}

/* ==========================================================================
   Blog yazısı
   ========================================================================== */
.by-meta { margin-top: 26px; display: flex; flex-wrap: wrap; align-items: center; gap: 10px 22px; font-size: 14px; color: #A9BCD2; }
.by-meta span { display: inline-flex; align-items: center; gap: 7px; }
.by-meta i { font-size: 16px; color: #6F86A1; }
.by-kategori { padding: 6px 13px; border-radius: 999px; font-size: 12px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: #fff; background: rgba(79,195,247,.16); border: 1px solid rgba(79,195,247,.35); transition: background-color .25s; }
.by-kategori:hover { background: rgba(79,195,247,.28); }
.s-bas:has(.by-meta) h1 { font-size: clamp(2rem, 3.8vw, 3.1rem); max-width: 900px; }

.by-ilerleme { position: sticky; top: var(--nav-h); z-index: 40; height: 3px; margin-bottom: -3px; background: transparent; }
.by-ilerleme span { display: block; height: 100%; width: 100%; transform-origin: 0 50%; transform: scaleX(0); background: linear-gradient(90deg, #2A80B7, #4FC3F7); }

.by-govde { padding-top: 64px; }
.by-izgara { display: grid; grid-template-columns: minmax(0, 1fr) 330px; gap: 64px; align-items: start; }
.by-yazi { min-width: 0; max-width: 780px; }
.by-kapak { margin: 0 0 44px; border-radius: 22px; overflow: hidden; aspect-ratio: 16 / 8.6; background: var(--zemin-2); box-shadow: 0 34px 70px -46px rgba(11,20,36,.5); }
.by-kapak img { width: 100%; height: 100%; object-fit: cover; display: block; }

.by-icerik { font-size: 17.5px; line-height: 1.85; color: #33445A; }
.by-icerik > *:first-child { margin-top: 0; }
.by-icerik p { margin: 0 0 1.3em; }
.by-icerik h2 { font-family: var(--yazi-baslik); font-size: clamp(1.4rem, 2vw, 1.75rem); font-weight: 600; line-height: 1.3; letter-spacing: -.015em; color: var(--murekkep); margin: 2.2em 0 .8em; scroll-margin-top: calc(var(--nav-h) + 28px); }
.by-icerik h3 { font-family: var(--yazi-baslik); font-size: 1.25rem; font-weight: 600; color: var(--murekkep); margin: 1.8em 0 .6em; }
.by-icerik strong, .by-icerik b { color: var(--murekkep); font-weight: 600; }
.by-icerik a { color: var(--mavi-600); text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--mavi-200); }
.by-icerik a:hover { text-decoration-color: currentColor; }
.by-icerik hr { border: 0; height: 1px; margin: 2.4em 0; background: linear-gradient(90deg, var(--cizgi-2), transparent); }
.by-icerik ul, .by-icerik ol { margin: 0 0 1.4em; padding-left: 1.3em; }
.by-icerik li { margin: .35em 0; }
.by-icerik li::marker { color: var(--mavi-500); }
.by-icerik blockquote { margin: 1.8em 0; padding: 22px 26px; border-left: 3px solid var(--mavi-500); border-radius: 0 16px 16px 0; background: var(--zemin-2); font-family: var(--yazi-baslik); font-size: 1.1em; color: var(--murekkep); }
.by-icerik img { max-width: 100%; height: auto; border-radius: 16px; }
.by-icerik table { width: 100%; border-collapse: collapse; margin: 1.6em 0; font-size: 15px; }
.by-icerik th, .by-icerik td { border: 1px solid var(--cizgi); padding: 10px 14px; text-align: left; }
.by-icerik th { background: var(--zemin-2); color: var(--murekkep); }

.by-son { margin-top: 48px; padding-top: 28px; border-top: 1px solid var(--cizgi); }
.by-paylas { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; }
.by-paylas b { font-family: var(--yazi-baslik); font-size: 15px; color: var(--murekkep); margin-right: 8px; }
.by-paylas a, .by-paylas button { height: 42px; min-width: 42px; padding: 0 12px; border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; font: inherit; font-size: 14px; font-weight: 600; color: var(--murekkep); background: #fff; border: 1px solid var(--cizgi-2); cursor: pointer; transition: border-color .25s, color .25s, background-color .25s; }
.by-paylas a i, .by-paylas button i { font-size: 18px; }
.by-paylas a:hover, .by-paylas button:hover { border-color: var(--mavi-300); color: var(--mavi-600); }
.by-paylas button.kopyalandi { background: var(--u-muhasebe); border-color: var(--u-muhasebe); color: #fff; }

.by-gezinti { margin-top: 36px; display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.by-gezinti a { display: flex; flex-direction: column; gap: 8px; padding: 20px 22px; border-radius: 16px; border: 1px solid var(--cizgi); background: #fff; transition: border-color .25s, box-shadow .3s; }
.by-gezinti a:hover { border-color: var(--mavi-200); box-shadow: 0 18px 36px -28px rgba(11,20,36,.4); }
.by-gezinti .sonraki { text-align: right; align-items: flex-end; }
.by-gezinti small { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--silik); }
.by-gezinti b { font-family: var(--yazi-baslik); font-size: 15.5px; font-weight: 600; line-height: 1.4; color: var(--murekkep); }
.by-gezinti a:hover b { color: var(--mavi-600); }

.by-yan { position: sticky; top: calc(var(--nav-h) + 28px); display: grid; gap: 20px; }
.by-kutu { border-radius: 20px; border: 1px solid var(--cizgi); background: #fff; padding: 24px; }
.by-toc > b { display: block; font-size: 12px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--silik); margin-bottom: 14px; }
.by-toc ol { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; counter-reset: toc; border-left: 2px solid var(--cizgi); }
.by-toc li a { position: relative; display: block; margin-left: -2px; padding: 7px 0 7px 16px; border-left: 2px solid transparent; font-size: 14px; line-height: 1.45; color: var(--soluk); transition: color .2s, border-color .2s; }
.by-toc li a:hover { color: var(--murekkep); }
.by-toc li a.aktif { color: var(--mavi-600); border-left-color: var(--mavi-500); font-weight: 600; }
.by-cta { position: relative; overflow: hidden; isolation: isolate; background: #061426; border-color: #0E2238; color: #A9BCD2; padding: 28px 26px; }
.by-cta::before { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(80% 60% at 100% 0%, rgba(42,128,183,.45), transparent 70%); }
.by-cta-ikon { width: 46px; height: 46px; border-radius: 13px; display: grid; place-items: center; font-size: 23px; color: #4FC3F7; background: rgba(42,128,183,.2); border: 1px solid rgba(79,195,247,.3); margin-bottom: 18px; }
.by-cta b { display: block; font-family: var(--yazi-baslik); font-size: 19px; font-weight: 600; line-height: 1.3; color: #fff; margin-bottom: 10px; }
.by-cta p { margin: 0 0 22px; font-size: 14px; line-height: 1.6; }
.by-cta-btn { display: flex; align-items: center; justify-content: center; gap: 8px; height: 48px; border-radius: 12px; background: linear-gradient(135deg, #2A80B7, #3E9BD6); color: #fff; font-weight: 600; font-size: 14.5px; transition: filter .2s; }
.by-cta-btn:hover { filter: brightness(1.1); }
.by-cta-wp { margin-top: 10px; display: flex; align-items: center; justify-content: center; gap: 8px; height: 44px; border-radius: 12px; border: 1px solid rgba(160,200,235,.2); color: #DCE8F5; font-size: 14px; font-weight: 600; transition: border-color .2s, background-color .2s; }
.by-cta-wp:hover { border-color: rgba(74,222,128,.5); background: rgba(34,197,94,.1); }

.by-ilgili-bas { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 32px; }
.by-ilgili-bas h2 { font-family: var(--yazi-baslik); font-size: clamp(1.6rem, 2.4vw, 2.1rem); font-weight: 600; letter-spacing: -.02em; color: var(--murekkep); margin: 0; }

@media (max-width: 1024px) {
  .by-izgara { grid-template-columns: 1fr; gap: 48px; }
  .by-yazi { max-width: none; }
  .by-yan { position: static; grid-template-columns: 1fr 1fr; }
  .by-toc { display: none; }
  .by-yan { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
  .by-icerik { font-size: 16.5px; }
  .by-kapak { margin-bottom: 30px; border-radius: 16px; }
  .by-gezinti { grid-template-columns: 1fr; }
  .by-gezinti .sonraki { text-align: left; align-items: flex-start; }
  .by-ilgili-bas { flex-direction: column; align-items: flex-start; }
}
.s-yol [aria-current] { max-width: 48ch; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media (max-width: 720px) { .s-yol [aria-current]:not(:nth-child(2)), .s-yol .ayrac:has(+ [aria-current]:not(:nth-child(2))) { display: none; } }
/* Üst menü: en üstte de kaydırınca olduğu gibi koyu (tek ton) */
.nav, .seffaf-nav .nav, .seffaf-nav .nav:not(.kaydi), .seffaf-nav .nav:not(.kaydi):not(.menu-acik), .nav.kaydi, .seffaf-nav .nav.kaydi {
  background: rgba(16,26,40,.96); border-bottom-color: rgba(255,255,255,.06); box-shadow: 0 10px 30px -12px rgba(0,0,0,.45);
  backdrop-filter: saturate(160%) blur(14px); -webkit-backdrop-filter: saturate(160%) blur(14px);
}
/* Menü öğeleri logonun görsel merkezine hizalı ("istek" gövdesi görselin alt %80'inde) */
.nav-logo { transform: translateY(-3px); }
@media (max-width: 720px) { .nav-logo { transform: translateY(-2px); } }

/* ==========================================================================
   Ürün / hizmet kategori sayfası
   ========================================================================== */
.u-bas { padding-bottom: 88px; }
.u-bas::before { background: radial-gradient(45% 80% at 85% 10%, color-mix(in srgb, var(--u) 45%, transparent), transparent 70%), radial-gradient(30% 60% at 5% 100%, rgba(79,195,247,.12), transparent 70%); }
.u-bas-izgara { display: grid; grid-template-columns: 1.02fr 1fr; gap: 64px; align-items: center; }
.u-bas h1 { font-size: clamp(2.2rem, 4vw, 3.4rem); }
.u-bas .u-slogan { margin-top: 14px; font-family: var(--yazi-baslik); font-size: 19px; font-weight: 500; color: #DCE8F5; }
.u-bas p + p { margin-top: 12px; }
.u-bas-alt { margin-top: 34px; }
.u-bas-butonlar { display: flex; flex-wrap: wrap; gap: 12px; }
.u-btn { display: inline-flex; align-items: center; gap: 8px; height: 50px; padding: 0 22px; border-radius: 12px; font-weight: 600; font-size: 15px; transition: filter .2s, background-color .25s, border-color .25s, color .25s, transform .3s var(--gecis); }
.u-btn.ana { background: linear-gradient(135deg, #2A80B7, #3E9BD6); color: #fff; box-shadow: 0 14px 30px -14px rgba(42,128,183,.8); }
.u-btn.ana:hover { filter: brightness(1.1); transform: translateY(-1px); }
.u-btn.ikincil { color: #fff; border: 1px solid rgba(160,200,235,.28); background: rgba(255,255,255,.05); }
.u-btn.ikincil:hover { background: rgba(255,255,255,.1); border-color: rgba(160,200,235,.5); }
.u-btn.hayalet { color: var(--murekkep); border: 1px solid var(--cizgi-2); background: #fff; }
.u-btn.hayalet:hover { border-color: var(--mavi-300); color: var(--mavi-600); }
.u-bas-ozet { list-style: none; margin: 34px 0 0; padding: 22px 0 0; display: flex; gap: 40px; border-top: 1px solid rgba(160,200,235,.14); }
.u-bas-ozet b { display: block; font-family: var(--yazi-baslik); font-size: 22px; font-weight: 600; color: #fff; }
.u-bas-ozet span { font-size: 13px; color: #8EA4BD; }
.u-bas-gorsel { position: relative; }
.u-cerceve { border-radius: 18px; overflow: hidden; background: #0B1A2C; border: 1px solid rgba(160,200,235,.18); box-shadow: 0 50px 90px -40px rgba(0,0,0,.7), 0 0 0 8px rgba(255,255,255,.03); }
.u-cerceve-ust { display: flex; align-items: center; gap: 7px; height: 36px; padding: 0 14px; background: rgba(255,255,255,.04); border-bottom: 1px solid rgba(160,200,235,.12); }
.u-cerceve-ust span { width: 9px; height: 9px; border-radius: 50%; background: rgba(160,200,235,.25); }
.u-cerceve-ust b { margin-left: 10px; font-size: 12px; font-weight: 500; color: #8EA4BD; }
.u-cerceve img { display: block; width: 100%; aspect-ratio: 16 / 10; object-fit: cover; }
.u-yuzen { position: absolute; left: -28px; bottom: -26px; display: flex; align-items: center; gap: 12px; padding: 14px 18px; border-radius: 16px; background: #fff; color: var(--murekkep); box-shadow: 0 30px 50px -24px rgba(0,0,0,.55); }
.u-yuzen-ikon { width: 42px; height: 42px; border-radius: 12px; display: grid; place-items: center; font-size: 21px; color: #fff; background: var(--u); }
.u-yuzen small { display: block; font-size: 12px; color: var(--soluk); }
.u-yuzen b { font-family: var(--yazi-baslik); font-size: 15px; }

.u-nav { position: sticky; top: var(--nav-h); z-index: 30; background: rgba(255,255,255,.92); backdrop-filter: saturate(180%) blur(14px); -webkit-backdrop-filter: saturate(180%) blur(14px); border-bottom: 1px solid var(--cizgi); }
.u-nav-ic { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; padding-top: 12px; padding-bottom: 12px; }
.u-nav-ic::-webkit-scrollbar { display: none; }
.u-nav a { flex: none; display: inline-flex; align-items: center; gap: 8px; padding: 9px 14px; border-radius: 10px; font-size: 14px; font-weight: 600; color: var(--soluk); transition: background-color .2s, color .2s; }
.u-nav a i { font-size: 17px; }
.u-nav a:hover { color: var(--murekkep); background: var(--zemin-2); }
.u-nav a.aktif { color: var(--mavi-600); background: var(--mavi-50); }

.u-genel { padding-bottom: 96px; }
.u-kartlar { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.u-kart { position: relative; display: flex; flex-direction: column; padding: 24px 22px 22px; border-radius: 18px; border: 1px solid var(--cizgi); background: #fff; color: inherit; transition: transform .4s var(--gecis), box-shadow .4s var(--gecis), border-color .3s; }
.u-kart:hover { transform: translateY(-4px); border-color: color-mix(in srgb, var(--u) 35%, #fff); box-shadow: 0 30px 56px -34px rgba(11,20,36,.4); }
.u-kart-ust { display: flex; align-items: center; justify-content: space-between; margin-bottom: 18px; }
.u-kart-ikon { width: 44px; height: 44px; border-radius: 13px; display: grid; place-items: center; font-size: 22px; color: var(--u); background: color-mix(in srgb, var(--u) 10%, #fff); border: 1px solid color-mix(in srgb, var(--u) 22%, #fff); }
.u-kart-no { font-family: var(--yazi-baslik); font-size: 13px; font-weight: 600; color: var(--silik); }
.u-kart b { font-family: var(--yazi-baslik); font-size: 16.5px; font-weight: 600; color: var(--murekkep); margin-bottom: 8px; line-height: 1.3; }
.u-kart-metin { font-size: 13.5px; line-height: 1.6; color: var(--soluk); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.u-kart-ok { margin-top: auto; padding-top: 16px; display: inline-flex; align-items: center; gap: 6px; font-size: 13.5px; font-weight: 600; color: var(--u); }

.u-modul { padding: 104px 0; background: #fff; scroll-margin-top: calc(var(--nav-h) + 60px); }
.u-modul.gri { background: var(--zemin-2); }
.u-modul-izgara { display: grid; grid-template-columns: 1fr 1.05fr; gap: 72px; align-items: center; }
.u-modul.ters .u-modul-metin { order: 2; }
.u-modul-etiket { display: inline-flex; align-items: center; gap: 12px; font-size: 12.5px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--u); }
.u-modul-ikon { width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; font-size: 20px; color: #fff; background: var(--u); letter-spacing: 0; box-shadow: 0 12px 24px -12px color-mix(in srgb, var(--u) 80%, transparent); }
.u-modul h2 { font-family: var(--yazi-baslik); font-size: clamp(1.8rem, 2.8vw, 2.5rem); font-weight: 600; line-height: 1.15; letter-spacing: -.025em; color: var(--murekkep); margin: 18px 0 10px; }
.u-modul-slogan { font-family: var(--yazi-baslik); font-size: 17px; font-weight: 500; color: var(--u) !important; margin: 0 0 16px !important; }
.u-modul-metin > p { margin: 0 0 14px; font-size: 16px; line-height: 1.75; color: var(--soluk); }
.u-maddeler { list-style: none; margin: 6px 0 4px; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.u-maddeler li { display: inline-flex; align-items: center; gap: 7px; padding: 7px 12px; border-radius: 999px; font-size: 13.5px; font-weight: 600; color: var(--murekkep); background: #fff; border: 1px solid var(--cizgi-2); }
.u-modul.gri .u-maddeler li { background: #fff; }
.u-maddeler i { font-size: 16px; color: var(--u); }
.u-ozellikler { margin-top: 24px; display: grid; grid-template-columns: 1fr 1fr; gap: 14px 22px; }
.u-ozellik { display: flex; gap: 12px; align-items: flex-start; }
.u-ozellik > span { flex: none; width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; font-size: 17px; color: var(--u); background: color-mix(in srgb, var(--u) 10%, #fff); }
.u-ozellik b { display: block; font-size: 14.5px; font-weight: 600; color: var(--murekkep); line-height: 1.35; margin-bottom: 3px; }
.u-ozellik small { display: block; font-size: 13px; line-height: 1.55; color: var(--soluk); }
.u-modul-butonlar { margin-top: 32px; display: flex; flex-wrap: wrap; gap: 12px; }
.u-modul-cerceve { position: relative; border-radius: 22px; overflow: hidden; background: #0B1A2C; aspect-ratio: 16 / 11; box-shadow: 0 46px 80px -48px rgba(11,20,36,.6); }
.u-modul-cerceve img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 1s var(--gecis); }
.u-modul-cerceve.ozgun img { object-fit: contain; background: #fff; }
.u-modul-cerceve:not(.ozgun)::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(4,11,22,0) 35%, rgba(4,11,22,.75)); }
.u-modul:hover .u-modul-cerceve img { transform: scale(1.03); }
.u-modul-rozet { position: absolute; z-index: 1; left: 24px; right: 24px; bottom: 22px; display: flex; align-items: center; gap: 14px; color: #fff; }
.u-modul-rozet span { width: 46px; height: 46px; border-radius: 13px; display: grid; place-items: center; font-size: 23px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.25); backdrop-filter: blur(8px); }
.u-modul-rozet b { font-family: var(--yazi-baslik); font-size: 18px; font-weight: 600; }
.u-modul-rozet small { margin-left: auto; font-size: 12.5px; color: rgba(220,232,245,.8); }

.u-diger-izgara { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.u-diger-kart { display: flex; flex-direction: column; border-radius: 18px; overflow: hidden; border: 1px solid var(--cizgi); background: #fff; color: inherit; transition: transform .4s var(--gecis), box-shadow .4s var(--gecis), border-color .3s; }
.u-diger-kart:hover { transform: translateY(-4px); border-color: color-mix(in srgb, var(--u) 35%, #fff); box-shadow: 0 30px 56px -34px rgba(11,20,36,.4); }
.u-diger-foto { aspect-ratio: 16 / 9; overflow: hidden; background: var(--zemin-2); }
.u-diger-foto img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s var(--gecis); }
.u-diger-kart:hover .u-diger-foto img { transform: scale(1.05); }
.u-diger-metin { position: relative; display: flex; flex-direction: column; padding: 34px 20px 22px; }
.u-diger-metin .u-kart-ikon { position: absolute; top: -22px; left: 20px; background: #fff; box-shadow: 0 10px 20px -10px rgba(11,20,36,.35); }
.u-diger-metin b { font-family: var(--yazi-baslik); font-size: 16px; font-weight: 600; color: var(--murekkep); line-height: 1.35; }
.u-diger-metin small { margin-top: 6px; font-size: 13.5px; color: var(--soluk); }
.u-diger + .referans-bolum.v2 { padding-top: 24px; }

@media (max-width: 1200px) { .u-kartlar { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 1024px) {
  .u-bas-izgara, .u-modul-izgara { grid-template-columns: 1fr; gap: 48px; }
  .u-modul.ters .u-modul-metin { order: 0; }
  .u-kartlar, .u-diger-izgara { grid-template-columns: 1fr 1fr; }
  .u-modul { padding: 72px 0; }
}
@media (max-width: 720px) {
  .u-yuzen { left: 12px; bottom: -22px; }
  .u-bas-ozet { gap: 28px; }
  .u-kartlar, .u-diger-izgara { grid-template-columns: 1fr; }
  .u-ozellikler { grid-template-columns: 1fr; }
  .u-modul { padding: 56px 0; }
}

/* ==========================================================================
   Modül detay sayfası
   ========================================================================== */
.md-govde { padding-top: 72px; }
.md-izgara { display: grid; grid-template-columns: minmax(0, 1fr) 330px; gap: 64px; align-items: start; }
.md-giris { display: flex; gap: 20px; align-items: flex-start; margin-bottom: 24px; }
.md-ikon { flex: none; width: 60px; height: 60px; border-radius: 18px; display: grid; place-items: center; font-size: 29px; color: #fff; background: var(--u); box-shadow: 0 18px 32px -14px color-mix(in srgb, var(--u) 80%, transparent); }
.md-giris h2, .md-ozellik-bas h2 { font-family: var(--yazi-baslik); font-size: clamp(1.6rem, 2.4vw, 2.1rem); font-weight: 600; line-height: 1.2; letter-spacing: -.02em; color: var(--murekkep); margin: 10px 0 0; }
.md-paragraf { font-size: 17px; line-height: 1.8; color: #33445A; margin: 0 0 16px; }
.md-maddeler { list-style: none; margin: 22px 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.md-maddeler li { display: flex; align-items: center; gap: 10px; padding: 16px 18px; border-radius: 14px; background: var(--zemin-2); border: 1px solid var(--cizgi); font-weight: 600; font-size: 14.5px; color: var(--murekkep); }
.md-maddeler i { font-size: 20px; color: var(--u); }
.md-gorsel { margin: 44px 0 0; border-radius: 22px; overflow: hidden; aspect-ratio: 16 / 9; background: var(--zemin-2); box-shadow: 0 40px 80px -50px rgba(11,20,36,.55); }
.md-gorsel img { width: 100%; height: 100%; object-fit: cover; display: block; }
.md-gorsel.ozgun img { object-fit: contain; background: #fff; }
.md-ozellik-bas { margin: 64px 0 26px; scroll-margin-top: calc(var(--nav-h) + 28px); }
.md-ozellikler { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.md-ozellik { position: relative; padding: 26px 24px 24px; border-radius: 18px; border: 1px solid var(--cizgi); background: #fff; transition: border-color .3s, box-shadow .35s, transform .35s var(--gecis); }
.md-ozellik:hover { border-color: color-mix(in srgb, var(--u) 30%, #fff); box-shadow: 0 26px 50px -34px rgba(11,20,36,.4); transform: translateY(-3px); }
.md-ozellik-no { position: absolute; right: 22px; top: 22px; font-family: var(--yazi-baslik); font-size: 13px; font-weight: 600; color: var(--silik); }
.md-ozellik-ikon { width: 44px; height: 44px; border-radius: 13px; display: grid; place-items: center; font-size: 22px; color: var(--u); background: color-mix(in srgb, var(--u) 10%, #fff); border: 1px solid color-mix(in srgb, var(--u) 22%, #fff); margin-bottom: 18px; }
.md-ozellik b { display: block; font-family: var(--yazi-baslik); font-size: 16.5px; font-weight: 600; line-height: 1.35; color: var(--murekkep); margin-bottom: 8px; padding-right: 26px; }
.md-ozellik p { margin: 0; font-size: 14.5px; line-height: 1.65; color: var(--soluk); }
/* Modül ek içeriği: nasıl çalışır adımları, örnek hesap tablosu, ilgili modül, sıkça sorulan sorular */
.md-ek-bas { margin: 56px 0 20px; }
.md-ek-bas h2 { font-family: var(--yazi-baslik); font-size: clamp(1.35rem, 2.2vw, 1.7rem); font-weight: 600; letter-spacing: -.02em; color: var(--murekkep); margin: 8px 0 10px; text-wrap: balance; }
.md-ek-bas p { margin: 0; font-size: 16px; line-height: 1.7; color: var(--soluk); max-width: 68ch; }
.md-adimlar { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; counter-reset: adim; }
.md-adimlar li { position: relative; padding: 20px 20px 18px 62px; border-radius: 16px; background: var(--zemin-2); border: 1px solid var(--cizgi); counter-increment: adim; }
.md-adimlar li::before { content: counter(adim); position: absolute; left: 18px; top: 18px; width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; font-family: var(--yazi-baslik); font-weight: 600; font-size: 14px; color: #fff; background: var(--u, var(--mavi-500)); }
.md-adimlar b { display: block; font-size: 15.5px; color: var(--murekkep); margin-bottom: 4px; }
.md-adimlar p { margin: 0; font-size: 14.5px; line-height: 1.6; color: var(--soluk); }
.md-tablo-kap { overflow-x: auto; border-radius: 16px; border: 1px solid var(--cizgi); background: #fff; }
.md-tablo-kap:focus-visible { outline: 2px solid var(--mavi-500); outline-offset: 3px; }
.md-tablo { width: 100%; border-collapse: collapse; font-size: 14.5px; font-variant-numeric: tabular-nums; min-width: 520px; }
.md-tablo th, .md-tablo td { padding: 12px 16px; text-align: left; border-bottom: 1px solid var(--cizgi); }
.md-tablo td:last-child, .md-tablo thead th:last-child { text-align: right; white-space: nowrap; }
.md-tablo thead th { font-size: 12.5px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--soluk); background: var(--zemin-2); }
.md-tablo tbody th { font-weight: 500; color: var(--murekkep); }
.md-tablo td { color: var(--metin); }
.md-tablo tfoot th, .md-tablo tfoot td { font-weight: 600; color: var(--murekkep); background: color-mix(in srgb, var(--u, var(--mavi-500)) 7%, #fff); border-bottom-color: color-mix(in srgb, var(--u, var(--mavi-500)) 18%, #fff); }
.md-tablo tfoot tr:last-child th, .md-tablo tfoot tr:last-child td { border-bottom: 0; }
.md-tablo-dipnot { margin: 10px 2px 0; font-size: 13px; color: var(--silik); }
.md-ek-not { display: flex; gap: 14px; align-items: flex-start; margin-top: 18px; padding: 18px 20px; border-radius: 14px; background: #FFF8E6; border: 1px solid #F3DFA8; }
.md-ek-not i { font-size: 22px; color: #B7791F; flex-shrink: 0; margin-top: 1px; }
.md-ek-not p { margin: 0; font-size: 15px; line-height: 1.65; color: #5C4413; }
.md-ek-baglanti { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 28px; padding: 20px 24px; border-radius: 16px; border: 1px solid var(--cizgi); background: #fff; color: var(--murekkep); transition: border-color .2s, transform .3s var(--gecis); }
.md-ek-baglanti span { display: grid; gap: 4px; }
.md-ek-baglanti b { font-size: 16px; }
.md-ek-baglanti small { font-size: 14px; color: var(--soluk); line-height: 1.5; }
.md-ek-baglanti i { font-size: 20px; color: var(--u, var(--mavi-500)); transition: transform .3s var(--gecis); flex-shrink: 0; }
.md-ek-baglanti:hover { border-color: var(--u, var(--mavi-500)); }
.md-ek-baglanti:hover i { transform: translateX(4px); }
.md-sss { display: grid; gap: 10px; }
.md-sss details { border: 1px solid var(--cizgi); border-radius: 14px; background: #fff; }
.md-sss summary { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 16px 20px; cursor: pointer; list-style: none; font-weight: 600; font-size: 15.5px; color: var(--murekkep); }
.md-sss summary::-webkit-details-marker { display: none; }
.md-sss summary i { color: var(--u, var(--mavi-500)); font-size: 18px; transition: transform .25s; flex-shrink: 0; }
.md-sss details[open] summary i { transform: rotate(45deg); }
.md-sss summary:focus-visible { outline: 2px solid var(--mavi-500); outline-offset: 2px; border-radius: 14px; }
.md-sss details p { margin: 0; padding: 0 20px 18px; font-size: 15px; line-height: 1.7; color: var(--soluk); }
/* Tablo içeriği ana sütunu genişletmesin (telefonda sayfa yana taşmasın) */
.md-ana { min-width: 0; }
@media (max-width: 720px) {
  .md-adimlar { grid-template-columns: 1fr; }
  .md-ek-bas { margin-top: 44px; }
  /* Telefonda tablo ekrana sığar: hücreler alt satıra geçer, tutar sütunu bölünmez */
  .md-tablo { min-width: 0; font-size: 13px; }
  .md-tablo th, .md-tablo td { padding: 10px 10px; vertical-align: top; }
  .md-tablo thead th { font-size: 11px; letter-spacing: .02em; }
}
.md-entegre { margin-top: 40px; display: flex; gap: 18px; align-items: flex-start; padding: 26px 28px; border-radius: 20px; background: #061426; color: #A9BCD2; position: relative; overflow: hidden; isolation: isolate; }
.md-entegre::before { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(60% 120% at 100% 0%, color-mix(in srgb, var(--u) 40%, transparent), transparent 70%); }
.md-entegre-ikon { flex: none; width: 46px; height: 46px; border-radius: 13px; display: grid; place-items: center; font-size: 23px; color: #4FC3F7; background: rgba(42,128,183,.2); border: 1px solid rgba(79,195,247,.3); }
.md-entegre b { display: block; font-family: var(--yazi-baslik); font-size: 17px; color: #fff; margin-bottom: 6px; }
.md-entegre p { margin: 0; font-size: 14.5px; line-height: 1.65; }

.md-yan { position: sticky; top: calc(var(--nav-h) + 28px); display: grid; gap: 20px; }
.md-liste > b { display: block; font-size: 12px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--silik); margin-bottom: 12px; }
.md-liste ul { list-style: none; margin: 0 -10px; padding: 0; display: grid; gap: 2px; }
.md-liste li a { display: flex; align-items: center; gap: 10px; padding: 9px 10px; border-radius: 10px; font-size: 14.5px; font-weight: 500; color: var(--soluk); transition: background-color .2s, color .2s; }
.md-liste li a i:first-child { font-size: 18px; color: var(--silik); transition: color .2s; }
.md-liste li a:hover { background: var(--zemin-2); color: var(--murekkep); }
.md-liste li a.aktif { background: color-mix(in srgb, var(--u) 9%, #fff); color: var(--murekkep); font-weight: 600; }
.md-liste li a.aktif i:first-child { color: var(--u); }
.md-liste .nokta { margin-left: auto; font-size: 14px; color: var(--u); }
.md-tum { margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--cizgi); display: flex; align-items: center; justify-content: space-between; font-size: 14px; font-weight: 600; color: var(--mavi-600); }

.md-sonraki-bolum { padding: 0 0 88px; background: #fff; }
.md-sonraki { display: flex; align-items: center; gap: 22px; padding: 28px 32px; border-radius: 22px; border: 1px solid var(--cizgi); background: var(--zemin-2); transition: border-color .3s, box-shadow .35s, background-color .3s; }
.md-sonraki:hover { background: #fff; border-color: color-mix(in srgb, var(--u) 30%, #fff); box-shadow: 0 30px 60px -40px rgba(11,20,36,.45); }
.md-sonraki-ikon { flex: none; width: 56px; height: 56px; border-radius: 16px; display: grid; place-items: center; font-size: 27px; color: var(--u); background: #fff; border: 1px solid var(--cizgi-2); }
.md-sonraki-metin { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.md-sonraki-metin small { font-size: 12px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--silik); }
.md-sonraki-metin b { font-family: var(--yazi-baslik); font-size: 20px; font-weight: 600; color: var(--murekkep); }
.md-sonraki-metin span { font-size: 14.5px; color: var(--soluk); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.md-sonraki-ok { flex: none; width: 50px; height: 50px; border-radius: 50%; display: grid; place-items: center; font-size: 21px; color: #fff; background: var(--u); transition: transform .35s var(--gecis); }
.md-sonraki:hover .md-sonraki-ok { transform: translateX(4px); }
.md-sonraki-bolum + .referans-bolum.v2 { padding-top: 24px; }

@media (max-width: 1024px) {
  .md-izgara { grid-template-columns: 1fr; gap: 48px; }
  .md-yan { position: static; }
}
@media (max-width: 720px) {
  .md-maddeler, .md-ozellikler { grid-template-columns: 1fr; }
  .md-giris { flex-direction: column; gap: 16px; }
  .md-sonraki { padding: 22px; gap: 16px; }
  .md-sonraki-metin span { display: none; }
  .md-entegre { flex-direction: column; }
}
/* Ölçüm: logo gövdesi ("soft" hariç, görselin 67–373. satırları) merkezi = menü küçük harf merkezi */
.nav-logo { transform: translateY(-2.25px); }

/* ==========================================================================
   Yasal metin sayfaları
   ========================================================================== */
.ys-izgara { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 64px; align-items: start; }
.ys-yan { position: sticky; top: calc(var(--nav-h) + 28px); display: grid; gap: 18px; }
.ys-menu > b { display: block; font-size: 12px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--silik); margin-bottom: 12px; }
.ys-menu ul { list-style: none; margin: 0 -10px; padding: 0; display: grid; gap: 2px; }
.ys-menu a { display: flex; align-items: center; gap: 10px; padding: 10px; border-radius: 10px; font-size: 14.5px; font-weight: 500; color: var(--soluk); transition: background-color .2s, color .2s; }
.ys-menu a i { font-size: 18px; color: var(--silik); }
.ys-menu a:hover { background: var(--zemin-2); color: var(--murekkep); }
.ys-menu a.aktif { background: var(--mavi-50); color: var(--mavi-700, #1A5E92); font-weight: 600; }
.ys-menu a.aktif i { color: var(--mavi-600); }
.ys-soru { background: var(--zemin-2); }
.ys-soru .by-cta-ikon { color: var(--mavi-600); background: #fff; border-color: var(--cizgi-2); }
.ys-soru b { display: block; font-family: var(--yazi-baslik); font-size: 17px; color: var(--murekkep); margin-bottom: 6px; }
.ys-soru p { margin: 0 0 14px; font-size: 14px; line-height: 1.6; color: var(--soluk); }
.ys-soru a { display: flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 600; color: var(--mavi-600); padding: 4px 0; overflow-wrap: anywhere; }
.ys-metin { max-width: 820px; font-size: 16px; }
.ys-metin h2 { font-size: 1.35rem; margin-top: 1.8em; }
.ys-metin h3 { font-size: 1.1rem; }
.ys-metin address { font-style: normal; padding: 18px 22px; border-radius: 14px; background: var(--zemin-2); border: 1px solid var(--cizgi); }
@media (max-width: 1024px) { .ys-izgara { grid-template-columns: 1fr; gap: 36px; } .ys-yan { position: static; order: 2; } }

/* 404 */
.yok-bas { padding-bottom: 96px; }
.yok-ic { position: relative; }
.yok-kod { position: absolute; right: 0; top: 50%; transform: translateY(-50%); font-family: var(--yazi-baslik); font-weight: 700; font-size: clamp(8rem, 22vw, 18rem); line-height: 1; letter-spacing: -.06em; color: transparent; -webkit-text-stroke: 1px rgba(160,200,235,.18); pointer-events: none; user-select: none; }
.yok-adres { display: inline-flex; align-items: center; gap: 8px; margin-top: 18px !important; padding: 8px 14px; border-radius: 10px; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 13.5px !important; color: #DCE8F5 !important; background: rgba(255,255,255,.05); border: 1px solid rgba(160,200,235,.15); }
.yok-ic .u-bas-butonlar { margin-top: 32px; }
.yok-baslik { font-family: var(--yazi-baslik); font-size: clamp(1.5rem, 2.2vw, 1.9rem); font-weight: 600; color: var(--murekkep); margin: 0 0 28px; }
.yok-izgara { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 1024px) { .yok-izgara { grid-template-columns: 1fr 1fr; } .yok-kod { opacity: .5; } }
@media (max-width: 720px) { .yok-izgara { grid-template-columns: 1fr; } .yok-kod { display: none; } }

/* Randevu */
.rv-kutu { display: grid; grid-template-columns: 1.3fr 1fr; gap: 0; border-radius: 24px; overflow: hidden; border: 1px solid var(--cizgi); box-shadow: 0 40px 80px -50px rgba(11,20,36,.4); }
.rv-adimlar { list-style: none; margin: 0; padding: 44px; display: grid; gap: 28px; background: #fff; }
.rv-adimlar li { display: flex; gap: 18px; }
.rv-adimlar li > span { flex: none; width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; font-family: var(--yazi-baslik); font-weight: 600; color: #fff; background: var(--mavi-500); }
.rv-adimlar b { display: block; font-family: var(--yazi-baslik); font-size: 17px; color: var(--murekkep); margin-bottom: 4px; }
.rv-adimlar p { margin: 0; font-size: 15px; color: var(--soluk); line-height: 1.6; }
.rv-adimlar a { color: var(--mavi-600); font-weight: 600; }
.rv-eylem { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; padding: 44px; background: #061426; color: #A9BCD2; }
.rv-ikon { width: 54px; height: 54px; border-radius: 15px; display: grid; place-items: center; font-size: 27px; color: #4FC3F7; background: rgba(42,128,183,.2); border: 1px solid rgba(79,195,247,.3); margin-bottom: 20px; }
.rv-eylem b { font-family: var(--yazi-baslik); font-size: 22px; color: #fff; margin-bottom: 8px; }
.rv-eylem p { margin: 0 0 24px; font-size: 15px; }
@media (max-width: 1024px) { .rv-kutu { grid-template-columns: 1fr; } .rv-adimlar, .rv-eylem { padding: 32px 24px; } }

/* Referanslar sayfası */
.rf-ust { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 28px; flex-wrap: wrap; }
.rf-ust p { margin: 0; color: var(--soluk); }
.rf-ust b { font-family: var(--yazi-baslik); font-size: 22px; color: var(--murekkep); }
.rf-izgara { display: grid; grid-template-columns: repeat(5, 1fr); border-top: 1px solid var(--cizgi); border-left: 1px solid var(--cizgi); border-radius: 18px; overflow: hidden; }
.rf-kart { margin: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; padding: 26px 18px 20px; border-right: 1px solid var(--cizgi); border-bottom: 1px solid var(--cizgi); background: #fff; transition: background-color .3s; }
.rf-logo { height: 80px; display: grid; place-items: center; }
.rf-logo img { max-height: 76px; max-width: 186px; width: auto; height: auto; object-fit: contain; filter: grayscale(1) contrast(.9); opacity: .6; mix-blend-mode: multiply; transition: filter .35s, opacity .35s, transform .35s var(--gecis); }
.rf-kart figcaption { font-size: 12.5px; color: var(--silik); text-align: center; line-height: 1.35; }
.rf-kart:hover { background: var(--zemin-2); }
.rf-kart:hover img { filter: none; opacity: 1; transform: scale(1.05); }
@media (max-width: 1024px) { .rf-izgara { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 720px) { .rf-izgara { grid-template-columns: repeat(2, 1fr); } }
/* Menü başlıkları çok az aşağıda */
#navMenu > li > a, #navMenu > li > button { position: relative; top: 2px; }
/* Referans şeridi: sağ altta tüm referanslar bağlantısı */
.ref-alt { display: flex; justify-content: flex-end; margin-top: 16px; }
.ref-tum { display: inline-flex; align-items: center; gap: 8px; padding: 9px 14px 9px 16px; border-radius: 999px; border: 1px solid var(--cizgi-2); background: #fff; font-size: 14px; font-weight: 600; color: var(--murekkep); transition: border-color .25s, color .25s, box-shadow .25s; }
.ref-tum span { min-width: 26px; height: 22px; padding: 0 7px; border-radius: 999px; display: grid; place-items: center; font-size: 12px; color: var(--mavi-600); background: var(--mavi-50); }
.ref-tum i { transition: transform .3s var(--gecis); }
.ref-tum:hover { border-color: var(--mavi-200); color: var(--mavi-600); box-shadow: 0 10px 24px -14px rgba(11,20,36,.35); }
.ref-tum:hover i { transform: translateX(3px); }
/* Performans: logolarda pahalı karıştırma efekti yok; boyut sabit, gri ton statik */
.ref-yuva img, .rf-logo img { mix-blend-mode: normal; }
.rf-kart { content-visibility: auto; contain-intrinsic-size: 140px; }
.rf-logo img { transition: opacity .3s, transform .3s var(--gecis); filter: grayscale(1); }
.rf-kart:hover img { filter: none; }

/* Mobil üst menü düzeni: logo solda, menü açma tuşu en sağda; Portal girişi menüye taşındı */
@media (max-width: 1024px) {
  .nav .kap { gap: 10px; }
  .nav-logo { order: 0; }
  .nav-ac { order: 1; margin-left: auto !important; margin-right: -12px; }
  .nav-portal { display: none !important; }
  /* Menü ikonunun arkasındaki kutu (arkaplan + çerçeve) kaldırıldı — yalnız ikon */
  .nav .nav-ac, .seffaf-nav .nav .nav-ac { background: transparent !important; border: 0 !important; box-shadow: none !important; }
  /* Logo ve menü ikonu mobilde çok az büyütüldü */
  .nav-logo img, .nav .nav-logo .logo-beyaz, .nav .nav-logo .logo-renkli { height: 37px !important; }
  .nav-ac-cizgi { left: 10px; right: 10px; }
  .nav-ac-cizgi:nth-child(1) { top: 15px; }
  .nav-ac-cizgi:nth-child(3) { top: 27px; }
  .nav-ac.acik .nav-ac-cizgi:nth-child(1) { transform: translateY(6px) rotate(45deg); }
  .nav-ac.acik .nav-ac-cizgi:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }
}

/* ==========================================================================
   Mobil menü: X'e dönüşen buton + soldan açılan çekmece (başlığın altından)
   ========================================================================== */
.nav-ac { position: relative; }
.nav-ac > i { display: none; }
.nav-ac-cizgi { position: absolute; left: 12px; right: 12px; height: 2px; border-radius: 2px; background: currentColor; transition: transform .32s cubic-bezier(.6,.05,.3,1), opacity .18s ease; }
.nav-ac-cizgi:nth-child(1) { top: 16px; }
.nav-ac-cizgi:nth-child(2) { top: 21px; }
.nav-ac-cizgi:nth-child(3) { top: 26px; }
.nav-ac.acik .nav-ac-cizgi:nth-child(1) { transform: translateY(5px) rotate(45deg); }
.nav-ac.acik .nav-ac-cizgi:nth-child(2) { opacity: 0; transform: scaleX(.3); }
.nav-ac.acik .nav-ac-cizgi:nth-child(3) { transform: translateY(-5px) rotate(-45deg); }

@media (max-width: 1024px) {
  /* Çekmece üst barı kaplamasın: menü başlığın altından başlar */
  .mobil-menu { top: var(--nav-h); }
  .mobil-menu .perde { background: rgba(4,11,22,.5); }
  .mobil-menu .cekmece {
    left: 0; right: 0; top: 0; bottom: 0;
    width: 100%; border-radius: 0; box-shadow: none;
    transform: translateY(100%); transition: transform .4s cubic-bezier(.22,1,.36,1);
  }
  .mobil-menu .perde { display: none; }
  .cekmece-govde { padding-left: 16px; padding-right: 16px; }
  .mobil-menu.acik .cekmece { transform: none; }
  /* Üst barda zaten logo ve X var; çekmecenin kendi başlığı gerekmez */
  .cekmece-bas { display: none; }
  .cekmece-govde { padding-top: 14px; }
  /* Menü öğeleri sırayla belirsin */
  .mobil-menu.acik .cekmece-govde > * { animation: cekmeceGel .45s both; }
  .mobil-menu.acik .cekmece-govde > *:nth-child(1) { animation-delay: .06s; }
  .mobil-menu.acik .cekmece-govde > *:nth-child(2) { animation-delay: .11s; }
  .mobil-menu.acik .cekmece-govde > *:nth-child(3) { animation-delay: .16s; }
  .mobil-menu.acik .cekmece-govde > *:nth-child(4) { animation-delay: .21s; }
  .mobil-menu.acik .cekmece-govde > *:nth-child(5) { animation-delay: .26s; }
  .mobil-menu.acik .cekmece-govde > *:nth-child(6) { animation-delay: .31s; }
  .mobil-menu.acik .cekmece-govde > *:nth-child(n+7) { animation-delay: .36s; }
}
@keyframes cekmeceGel { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) {
  .mobil-menu .cekmece { transition: none; }
  .mobil-menu.acik .cekmece-govde > * { animation: none; }
}

/* ==========================================================================
   Mobil ince ayarlar (ultra profesyonel)
   ========================================================================== */
@media (max-width: 720px) {
  /* Referans ızgarası: sütunlar içeriğe takılıp taşmasın */
  .rf-izgara { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .rf-kart { min-width: 0; padding: 20px 10px 16px; }
  .rf-logo { height: 78px; }
  .rf-logo img { max-width: 160px; max-height: 74px; }
  .rf-kart figcaption { font-size: 11px; overflow-wrap: anywhere; line-height: 1.3; }
}
@media (max-width: 560px) {
  /* Uzun başlıklar telefonda biraz daha dengeli */
  .s-bas h1 { font-size: clamp(1.9rem, 8vw, 2.4rem); }
  .u-bas h1 { font-size: clamp(1.8rem, 7.6vw, 2.3rem); }
  /* Metin taşmalarına karşı güvenlik */
  .s-bas p, .u-modul-metin > p, .md-paragraf, .by-icerik p, .h-metin p { overflow-wrap: break-word; }
  /* Butonlar telefonda tam genişlik, rahat dokunma */
  .u-bas-butonlar .u-btn, .u-modul-butonlar .u-btn, .i-sss-bas .b-tum, .bl-bos .b-tum { width: 100%; justify-content: center; }
  /* Footer "Destek portalı" kutusu taşmasın */
  .f-portal { align-items: center; }
  .f-portal span { min-width: 0; }
  .f-portal b, .f-portal small { white-space: normal; }
}

/* ==========================================================================
   Mobil menü düzeni (profesyonel) — tam genişlik çekmece
   ========================================================================== */
@media (max-width: 1024px) {
  .cekmece-govde { padding: 8px 16px 18px; }

  /* Başlık satırları (açılır gruplar + düz bağlantılar) */
  .cekmece-govde details { border-bottom: 1px solid var(--cizgi); }
  .cekmece-govde details:last-of-type { } /* */
  .cekmece-govde summary,
  .cekmece-govde > a {
    display: flex; align-items: center; justify-content: space-between;
    min-height: 56px; padding: 14px 4px; font-family: var(--yazi-baslik);
    font-size: 16.5px; font-weight: 600; color: var(--murekkep); cursor: pointer;
    border-bottom: 1px solid var(--cizgi);
  }
  .cekmece-govde details > summary { border-bottom: 0; }
  .cekmece-govde summary > i {
    width: 30px; height: 30px; flex: none; border-radius: 50%; background: var(--zemin-2);
    display: grid; place-items: center; font-size: 16px; color: var(--soluk);
    transition: transform .3s var(--gecis), background-color .3s, color .3s;
  }
  .cekmece-govde details[open] > summary > i { transform: rotate(180deg); background: var(--mavi-50); color: var(--mavi-600); }
  .cekmece-govde > a::after { content: "\ea61"; font-family: "tabler-icons"; font-size: 17px; color: var(--silik); font-weight: 400; }

  /* Alt menü: sade/kurumsal — ikon kutusu yok, nötr glyph, ince sol hiyerarşi rayı, kademeli açılış */
  .cekmece-govde .alt { margin: 2px 0 12px 19px !important; padding: 2px 0 2px 15px !important; display: grid; gap: 1px; border-left: 1.5px solid var(--cizgi-2); }
  .cekmece-govde .alt a {
    display: flex; align-items: center; gap: 12px; padding: 9px 10px; border-radius: 10px;
    font-size: 14.5px; font-weight: 500; color: var(--metin); line-height: 1.35;
    transition: background-color .2s ease, color .2s ease;
  }
  .cekmece-govde .alt a i {
    width: 20px; text-align: center; flex: none; background: transparent; border-radius: 0;
    font-size: 17px; color: var(--silik); transition: color .2s;
  }
  .cekmece-govde .alt a:active, .cekmece-govde .alt a:hover { background: var(--zemin-2); color: var(--mavi-600); }
  .cekmece-govde .alt a:active i, .cekmece-govde .alt a:hover i { color: var(--mavi-600); }
  /* Açılışta alt öğeler yumuşak ve kademeli belirir (premium accordion) */
  .cekmece-govde details[open] > .alt > a { animation: altOgeGel .34s cubic-bezier(.16,1,.3,1) both; }
  .cekmece-govde details[open] > .alt > a:nth-child(1) { animation-delay: .04s; }
  .cekmece-govde details[open] > .alt > a:nth-child(2) { animation-delay: .08s; }
  .cekmece-govde details[open] > .alt > a:nth-child(3) { animation-delay: .12s; }
  .cekmece-govde details[open] > .alt > a:nth-child(4) { animation-delay: .16s; }
  .cekmece-govde details[open] > .alt > a:nth-child(5) { animation-delay: .20s; }
  .cekmece-govde details[open] > .alt > a:nth-child(6) { animation-delay: .24s; }

  /* Alt aksiyonlar */
  .cekmece-alt { padding: 16px; border-top: 0; display: grid; gap: 10px; background: #fff; }
  .ck-portal { display: flex; align-items: center; justify-content: center; gap: 8px; height: 50px; border-radius: 12px; background: linear-gradient(135deg, #2A80B7, #3E9BD6); color: #fff; font-weight: 600; font-size: 15px; box-shadow: 0 14px 28px -14px rgba(42,128,183,.7); }
  .ck-portal i { font-size: 19px; }
  .ck-iletisim { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
  .ck-iletisim a { display: flex; align-items: center; justify-content: center; gap: 8px; height: 46px; border-radius: 12px; border: 1px solid var(--cizgi-2); background: #fff; font-weight: 600; font-size: 14px; color: var(--murekkep); }
  .ck-iletisim a i { font-size: 18px; color: var(--mavi-600); }
  .ck-iletisim .ck-wp i { color: #16A34A; }
}

/* Ana sayfada mobilde metin kırpma yok (tam görünür) */
@media (max-width: 720px) {
  .g-kart p, .g-urun p { -webkit-line-clamp: unset; display: block; overflow: visible; }
  .b-icerik b { -webkit-line-clamp: unset; display: block; overflow: visible; }
  .b-ozet { -webkit-line-clamp: unset; display: block; overflow: visible; }
  .duyuru-rozet > span:nth-child(2) { white-space: normal; }
  .duyuru-rozet { align-items: center; }
}

/* Çekmece açılışı: soldan kayarken hafif belirginleşir (daha yumuşak) */
@media (max-width: 1024px) {
  /* Kusursuz alttan-yukarı açılış: panel tek parça, yumuşak easing, GPU; öğe stagger yok */
  .mobil-menu .cekmece { opacity: 1; transition: transform .44s cubic-bezier(.16,1,.3,1); will-change: transform; backface-visibility: hidden; }
  .mobil-menu.acik .cekmece-govde > * { animation: none; }
}

/* Mobil menü alt başlık ikonu: + (kapalı) → − (açık) */
.cekmece-govde summary > i { display: none; }
.cekmece-govde summary .ck-arti { position: relative; flex: none; width: 30px; height: 30px; border-radius: 50%; background: transparent; transition: background-color .3s, transform .35s var(--gecis); }
.cekmece-govde summary .ck-arti::before, .cekmece-govde summary .ck-arti::after { content: ""; position: absolute; top: 50%; left: 50%; background: var(--soluk); border-radius: 2px; transition: transform .3s var(--gecis), opacity .3s, background-color .3s; }
.cekmece-govde summary .ck-arti::before { width: 13px; height: 2px; transform: translate(-50%, -50%); }
.cekmece-govde summary .ck-arti::after { width: 2px; height: 13px; transform: translate(-50%, -50%); }
.cekmece-govde details[open] > summary .ck-arti { background: transparent; }
.cekmece-govde details[open] > summary .ck-arti::before, .cekmece-govde details[open] > summary .ck-arti::after { background: var(--mavi-600); }
.cekmece-govde details[open] > summary .ck-arti::after { transform: translate(-50%, -50%) scaleY(0); opacity: 0; }

/* Mobil menü: profesyonel dokunma geri bildirimi */
@media (max-width: 1024px) {
  .cekmece-govde summary, .cekmece-govde > a, .cekmece-govde .alt a, .ck-iletisim a {
    -webkit-tap-highlight-color: transparent; user-select: none;
    transition: background-color .22s ease, color .22s ease;
  }
  /* Başlık satırları */
  .cekmece-govde summary, .cekmece-govde > a { border-radius: 12px; }
  /* Başlıkların altındaki ayraç çizgileri kaldırıldı */
  .cekmece-govde details, .cekmece-govde > a, .cekmece-govde details > summary { border: 0 !important; box-shadow: none !important; }
  /* Blog / Hakkımızda / İletişim başlık rengi, ok (>) rengiyle aynı */
  .cekmece-govde > a { color: var(--silik); }
  .cekmece-govde summary:active, .cekmece-govde > a:active { background: var(--mavi-50); color: var(--mavi-600); }
  .cekmece-govde summary:active .ck-arti { background: transparent; }
  .cekmece-govde summary:active .ck-arti::before, .cekmece-govde summary:active .ck-arti::after { background: var(--mavi-600); }
  .cekmece-govde > a:active::after { color: var(--mavi-600); }
  /* Alt maddeler */
  .cekmece-govde .alt a:active { background: var(--mavi-50); color: var(--mavi-600); }
  .cekmece-govde .alt a:active i { background: var(--mavi-500); color: #fff; }
  /* Alt aksiyon butonları */
  .ck-iletisim a:active { background: var(--zemin-2); border-color: var(--mavi-200); color: var(--mavi-600); }
}

/* ==========================================================================
   Mobil başlık ölçeği (profesyonel, dengeli) — tüm sayfalar
   ========================================================================== */
@media (max-width: 560px) {
  /* Hero başlıkları */
  .sinema-baslik.v2 { font-size: 2.2rem; line-height: 1.08; margin-bottom: 20px; }
  .sinema-baslik { font-size: 1.9rem; }
  .sinema-alt, .sinema-alt.v2 { font-size: 15px; }

  /* Sayfa (iç) başlıkları */
  .s-bas h1, .u-bas h1 { font-size: 1.6rem !important; line-height: 1.2; }
  .s-bas:has(.by-meta) h1 { font-size: 1.5rem !important; }
  .s-bas p, .u-bas p { font-size: 15px; }
  .u-slogan, .u-modul-slogan, .h-giris { font-size: 1rem !important; }

  /* Bölüm başlıkları (h2) — her sayfada tek ölçek */
  .g-bas h2, .g-iki h2, .g-blog-bas h2,
  .h-metin h2, .h-surec-bas h2, .h-alan h2, .h-guvence-bas h2,
  .i-sss-bas h2, .i-ofis-bilgi h2, .i-surec-bas h2,
  .u-modul h2, .by-ilgili-bas h2, .md-giris h2, .md-ozellik-bas h2,
  .rv-eylem b, .yok-baslik, .bl-one b {
    font-size: 1.4rem !important; line-height: 1.25; letter-spacing: -.01em;
  }
  .g-blog-bas h2, .g-bas h2 { font-size: 1.5rem !important; }

  /* Kart / küçük başlıklar */
  .h-mv-kart h3, .u-kart b, .i-kanal b, .b-icerik b { font-size: 1.05rem; }
  .md-giris { gap: 14px; }
  .md-ikon { width: 50px; height: 50px; font-size: 24px; }
}

/* ==========================================================================
   Footer üst düzen — profesyonel (marka + Ürünler/Hizmetler/e-Dönüşüm/Kurumsal/İletişim)
   ========================================================================== */
.f-alt.v3 .f-izgara { grid-template-columns: 1.6fr repeat(5, minmax(0, 1fr)); gap: 34px; align-items: start; }
.f-alt.v3 .f-marka { max-width: 340px; }
.f-alt.v3 .f-logo img { height: 46px; width: auto; }
.f-alt.v3 .f-marka p { margin: 20px 0 20px; max-width: 320px; font-size: 14.5px; line-height: 1.65; color: #8EA4BD; }
/* Marka içindeki Destek portalı */
.f-marka .f-portal { display: flex; align-items: center; gap: 12px; max-width: 320px; margin: 0 0 22px; padding: 12px 14px; border-radius: 14px; border: 1px solid rgba(79,195,247,.22); background: rgba(42,128,183,.1); color: #fff; transition: background-color .25s, border-color .25s, transform .3s var(--gecis); }
.f-marka .f-portal:hover { background: rgba(42,128,183,.22); border-color: rgba(79,195,247,.5); transform: translateY(-2px); }
.f-portal-ikon { width: 40px; height: 40px; flex: none; border-radius: 11px; display: grid; place-items: center; font-size: 21px; color: #4FC3F7; background: rgba(79,195,247,.14); border: 1px solid rgba(79,195,247,.2); }
.f-portal-yz { display: flex; flex-direction: column; line-height: 1.3; min-width: 0; }
.f-portal-yz b { font-size: 14px; font-weight: 600; color: #fff; }
.f-portal-yz small { font-size: 12px; color: #8EA4BD; }
.f-portal-ok { margin-left: auto; flex: none; font-size: 16px; color: #8EA4BD; }
/* İletişim sütunu */
.f-sutun-iletisim .f-iletisim { margin: 0; gap: 14px; }
.f-sutun-iletisim .f-iletisim li { display: flex; gap: 11px; align-items: flex-start; font-size: 14px; line-height: 1.55; color: #8EA4BD; }
.f-sutun-iletisim .f-iletisim i { flex: none; color: #4FC3F7; font-size: 18px; margin-top: 1px; }
.f-sutun-iletisim .f-iletisim a { color: #C9D6E4; transition: color .2s; }
.f-sutun-iletisim .f-iletisim a:hover { color: #fff; }

@media (max-width: 1180px) {
  .f-alt.v3 .f-izgara { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 30px 28px; }
  .f-alt.v3 .f-marka { grid-column: 1 / -1; max-width: none; }
  .f-marka .f-portal { max-width: 360px; }
}
@media (max-width: 680px) {
  .f-alt.v3 .f-izgara { grid-template-columns: 1fr 1fr; }
}

/* ==========================================================================
   Footer — profesyonel düzen v2 (üst marka bandı + 5 eşit sütun)
   ========================================================================== */
.f-alt.v3 .f-ust { display: flex; align-items: center; justify-content: space-between; gap: 28px; flex-wrap: wrap; padding-bottom: 32px; margin-bottom: 44px; border-bottom: 1px solid rgba(160,200,235,.1); }
.f-ust-marka { display: flex; align-items: center; gap: 26px; }
.f-ust-marka .f-logo img { height: 44px; width: auto; display: block; }
.f-ust-marka p { margin: 0; max-width: 480px; font-size: 14.5px; line-height: 1.6; color: #8EA4BD; position: relative; padding-left: 26px; }
.f-ust-marka p::before { content: ""; position: absolute; left: 0; top: 4px; bottom: 4px; width: 1px; background: rgba(160,200,235,.18); }
.f-alt.v3 .f-ust .f-sosyal { display: flex; gap: 10px; margin: 0; }

.f-alt.v3 .f-izgara { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 40px; align-items: start; padding-bottom: 56px; }
.f-alt.v3 .f-sutun h4 { margin-bottom: 18px; }

/* İletişim sütunu */
.f-sutun-iletisim .f-iletisim { margin: 0; gap: 14px; }
.f-sutun-iletisim .f-iletisim li { display: flex; gap: 11px; align-items: flex-start; font-size: 14px; line-height: 1.55; color: #8EA4BD; }
.f-sutun-iletisim .f-iletisim i { flex: none; color: #4FC3F7; font-size: 18px; margin-top: 1px; }
.f-sutun-iletisim .f-iletisim a { color: #C9D6E4; transition: color .2s; }
.f-sutun-iletisim .f-iletisim a:hover { color: #fff; }

@media (max-width: 1024px) {
  .f-alt.v3 .f-ust { flex-direction: column; align-items: flex-start; gap: 20px; }
  .f-ust-marka { flex-direction: column; align-items: flex-start; gap: 16px; }
  .f-ust-marka p { padding-left: 0; max-width: 520px; }
  .f-ust-marka p::before { display: none; }
  .f-alt.v3 .f-izgara { grid-template-columns: repeat(3, 1fr); gap: 30px 28px; }
}
@media (max-width: 680px) {
  .f-alt.v3 .f-izgara { grid-template-columns: 1fr 1fr; }
  .f-sutun-iletisim { grid-column: 1 / -1; }
}

/* ==========================================================================
   Footer — SADE KURUMSAL (Linear/Apple tarzı)
   ========================================================================== */
.f-min { background: #05080E; padding-top: 76px; }
.f-min::before, .f-min::after { display: none !important; }
.f-min-ic { display: flex; gap: 72px; padding-bottom: 56px; }
.f-min-marka { flex: 0 0 260px; }
.f-min-marka .f-logo img { height: 40px; width: auto; display: block; }
.f-min-marka p { margin: 22px 0 26px; max-width: 250px; font-size: 14px; line-height: 1.65; color: #65727F; }
.f-min .f-sosyal { display: flex; gap: 10px; }
.f-min .f-sosyal a { width: 38px; height: 38px; border-radius: 50%; border: 1px solid rgba(255,255,255,.1); background: transparent; color: #8A97A6; display: grid; place-items: center; font-size: 17px; transition: color .25s, border-color .25s, transform .3s var(--gecis); }
.f-min .f-sosyal a:hover { color: #fff; border-color: rgba(255,255,255,.32); transform: translateY(-2px); }

.f-min-linkler { flex: 1; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 32px; }
.f-min .f-sutun h4 { font-family: var(--yazi-baslik); font-size: 13px; font-weight: 600; letter-spacing: 0; text-transform: none; color: #CAD3DC; margin: 0 0 16px; padding: 0; }
.f-min .f-sutun h4::after { display: none !important; }
.f-min .f-sutun ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.f-min .f-sutun li { margin: 0; }
.f-min .f-sutun a { display: inline; padding: 0; font-size: 13.5px; line-height: 1.5; color: #6C7A88; transition: color .2s; }
.f-min .f-sutun a:hover { color: #fff; transform: none; }
.f-min .f-sutun li a::before { display: none !important; }
.f-min .f-sutun-iletisim .f-iletisim { gap: 12px; }
.f-min .f-sutun-iletisim .f-adres { font-size: 13px; line-height: 1.55; color: #65727F; }

/* Alt bar — ince, sade */
.f-min .f-taban-dis { background: transparent; border-top: 1px solid rgba(255,255,255,.06); }
.f-min .f-taban { display: flex; align-items: center; justify-content: space-between; gap: 18px; flex-wrap: wrap; padding-top: 24px; padding-bottom: 30px; }
.f-min .f-taban > span { font-size: 13px; color: #55626F; }
.f-min .f-taban nav { display: flex; flex-wrap: wrap; gap: 8px 22px; }
.f-min .f-taban nav a { font-size: 13px; color: #6C7A88; transition: color .2s; }
.f-min .f-taban nav a:hover { color: #fff; }

@media (max-width: 1024px) {
  .f-min-ic { flex-direction: column; gap: 44px; }
  .f-min-marka { flex: none; }
  .f-min-marka p { max-width: 420px; }
  .f-min-linkler { grid-template-columns: repeat(3, 1fr); gap: 34px 28px; }
}
@media (max-width: 600px) {
  .f-min { padding-top: 56px; }
  .f-min-linkler { grid-template-columns: 1fr 1fr; gap: 30px 24px; }
  .f-min .f-sutun-iletisim { grid-column: 1 / -1; }
  .f-min .f-taban { flex-direction: column; align-items: flex-start; gap: 14px; }
}

/* Referans şeridi: kutu/çerçeve yok (sade logolar) */
.referans-bolum.v2 .ref-bant, .referans-bolum.v2 .ref-bant.kutu { border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; }
.referans-bolum.v2 .ref-yuva { border: 0 !important; }
.referans-bolum.v2 .ref-kayan + .ref-kayan { border-top: 0 !important; }
/* Referans logoları masaüstünde de tam renkli (gri/soluk değil) */
.ref-yuva img, .rf-logo img { filter: none; opacity: 1; }
.ref-yuva:hover img { filter: none; opacity: 1; }

/* "Tüm referanslar": sade metin bağlantısı (kutu yok) */
.ref-tum { padding: 0 !important; border: 0 !important; background: transparent !important; box-shadow: none !important; color: var(--mavi-600) !important; font-weight: 600; }
.ref-tum:hover { background: transparent !important; color: var(--mavi-700, #1A5E92) !important; box-shadow: none !important; }
.ref-tum span { display: none; }

/* ==========================================================================
   Blog bölümü (ana sayfa) — sade (kutu/çerçeve yok, Linear tarzı)
   ========================================================================== */
/* Kurumsal yükseltilmiş kart görünümü */
.g-blog .b-ray .b-kart { border: 1px solid var(--cizgi-2) !important; background: #fff !important; border-radius: 16px !important; overflow: hidden; box-shadow: 0 1px 2px rgba(11,20,36,.04); transition: transform .45s var(--gecis), box-shadow .45s var(--gecis), border-color .3s; }
.g-blog .b-ray .b-kart:hover { transform: translateY(-6px); border-color: var(--mavi-200) !important; box-shadow: 0 30px 56px -30px rgba(11,20,36,.4) !important; }
.g-blog .b-gorsel { border: 0 !important; border-radius: 0; overflow: hidden; }
.g-blog .b-ray .b-gorsel { border-bottom: 1px solid var(--cizgi) !important; aspect-ratio: 16 / 9.4; }
.g-blog .b-icerik { padding: 20px 22px 22px !important; }
.g-blog .b-kategori { display: inline-flex; align-items: center; padding: 5px 11px !important; background: var(--mavi-50) !important; border: 1px solid var(--mavi-100) !important; border-radius: 999px; color: var(--mavi-600); font-size: 11px; font-weight: 650; letter-spacing: .04em; text-transform: uppercase; }
.g-blog .b-meta { color: var(--silik); }
.g-blog .b-meta i { font-size: 14px; opacity: .85; }
.g-blog .b-meta::before { background: var(--cizgi-2); }
.g-blog .b-devam { margin-top: 18px; }
/* "Tüm yazılar": kurumsal pill buton (temel .b-tum stilini koru) */
.g-blog .b-ilerleme { background: var(--cizgi); }

/* ==========================================================================
   Çözümlerimiz — sade / flat (Linear tarzı)
   ========================================================================== */
#cozumler .g-kart { box-shadow: none !important; border: 1px solid var(--cizgi) !important; border-radius: 16px; background: #fff; }
#cozumler .g-kart:hover { transform: translateY(-3px); box-shadow: none !important; border-color: color-mix(in srgb, var(--u) 30%, var(--cizgi)) !important; }
#cozumler .g-kart-gorsel::before { display: none !important; }
#cozumler .g-kart-gorsel { background: color-mix(in srgb, var(--u) 5%, #fff); border-bottom: 1px solid var(--cizgi); }
#cozumler .g-kart.genis .g-kart-gorsel { border-bottom: 0; border-right: 1px solid var(--cizgi); }
/* iç mini önizleme kutusu da daha sade */
#cozumler .oz { box-shadow: none !important; border: 1px solid var(--cizgi) !important; }

/* ==========================================================================
   Rakamlar + Neden İstek + e-Dönüşüm — sade / flat
   ========================================================================== */
.g-rakam.v2 .g-rakam-ic { box-shadow: none !important; }
.g-edon { box-shadow: none !important; }
.g-edon-liste li, .g-edon-liste a { box-shadow: none !important; }
.g-neden2 > div:hover { box-shadow: none !important; }

/* ==========================================================================
   Hero (giriş) — sola hizalı kurumsal yerleşim (Linear/Stripe çizgisi)
   ========================================================================== */
.sinema-ic { text-align: left; }
.sinema-isik { left: 42%; top: 40%; }

.duyuru-rozet { margin-bottom: 26px; }

.sinema-baslik.v2 {
  margin-left: 0; margin-right: 0; max-width: 15ch;
  font-size: clamp(2.9rem, 6.6vw, 6rem); margin-bottom: 26px;
}
.sinema-baslik.v2 .cizgi { left: 0; right: auto; width: 100%; }

.sinema-alt.v2 { margin: 0 0 40px; max-width: 600px; }

.sinema-buton.v2 { justify-content: flex-start; }

.guven-satir { justify-content: flex-start; margin-top: 40px; }

@media (max-width: 720px) {
  .sinema-baslik.v2 { max-width: none; }
  .sinema-alt.v2 { max-width: none; }
  .guven-satir { align-items: flex-start; }
}

/* ==========================================================================
   Yüzen aksiyonlar — WhatsApp sol altta (animasyonlu) + yukarı çık sağ altta
   ========================================================================== */
/* WhatsApp FAB — kurumsal/sade: solda, sabit (zıplama yok), yumuşak gölge, tek ince nabız, hover'da hafif kalkma */
.wp {
  left: 24px; right: auto; width: 60px; height: 60px;
  background: linear-gradient(145deg, #2BDD6C, #22C25F 58%, #1DB457);
  box-shadow: 0 12px 30px -10px rgba(29,180,87,.5), 0 4px 12px -4px rgba(11,20,36,.28);
  transition: transform .3s var(--gecis), box-shadow .3s var(--gecis);
  animation: none;
}
.wp::before { display: none; }
.wp::after { border-color: rgba(37,211,102,.5); animation: nabiz 3s ease-out infinite; }
.wp:hover { transform: translateY(-3px); box-shadow: 0 20px 42px -12px rgba(29,180,87,.58), 0 7px 16px -5px rgba(11,20,36,.34); }
.wp .wp-balon {
  position: absolute; left: calc(100% + 14px); top: 50%; transform: translateY(-50%) translateX(-6px);
  white-space: nowrap; padding: 9px 14px; border-radius: 12px;
  background: #0B1626; color: #EAF2FB; font-family: var(--yazi-baslik); font-size: 13px; font-weight: 500;
  box-shadow: 0 14px 34px -12px rgba(0,0,0,.6); border: 1px solid rgba(120,180,230,.18);
  opacity: 0; pointer-events: none; transition: opacity .25s var(--gecis), transform .3s var(--gecis);
}
.wp .wp-balon::before {
  content: ""; position: absolute; right: 100%; top: 50%; margin-top: -5px;
  border: 5px solid transparent; border-right-color: #0B1626;
}
.wp:hover .wp-balon { opacity: 1; transform: translateY(-50%) translateX(0); }
@keyframes wpSuzul { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }

/* Yukarı çık — scroll ilerleme halkalı, cam kurumsal buton */
.yukari {
  position: fixed; right: 24px; bottom: 24px; z-index: 40;
  width: 58px; height: 58px; border-radius: 50%; cursor: pointer;
  display: grid; place-items: center;
  background: rgba(10,22,40,.72); color: #EAF2FB; font-size: 24px;
  border: 1px solid rgba(120,180,230,.28);
  backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
  box-shadow: 0 14px 34px -12px rgba(0,0,0,.55);
  opacity: 0; transform: translateY(16px) scale(.9); pointer-events: none;
  transition: opacity .35s var(--gecis), transform .35s var(--gecis), background-color .25s, border-color .25s;
}
.yukari.gorunur { opacity: 1; transform: translateY(0) scale(1); pointer-events: auto; }
.yukari:hover { background: rgba(20,44,76,.82); border-color: rgba(160,210,245,.6); }
.yukari:hover i { transform: translateY(-2px); }
.yukari i { position: relative; z-index: 2; transition: transform .3s var(--gecis); }
.yukari-halka { position: absolute; inset: 0; width: 100%; height: 100%; transform: rotate(-90deg); pointer-events: none; }
.yukari-halka circle { fill: none; stroke-width: 2.5; }
.yukari-halka .iz { stroke: rgba(160,200,235,.18); }
.yukari-halka .dolum {
  stroke: #4FC3F7; stroke-linecap: round;
  stroke-dasharray: 131.95; stroke-dashoffset: 131.95;
  transition: stroke-dashoffset .1s linear;
  filter: drop-shadow(0 0 4px rgba(79,195,247,.5));
}
@media (max-width: 720px) {
  .wp { left: 16px; right: auto; bottom: 16px; }
  .wp .wp-balon { display: none; }
  .yukari { right: 16px; bottom: 16px; width: 52px; height: 52px; font-size: 22px; }
}
@media (prefers-reduced-motion: reduce) {
  .wp { animation: none; }
  .wp::before, .wp::after { animation: none; }
}

/* ==========================================================================
   Üst menü açılırları — profesyonel rafine (derinlik, accent hover, ferahlık)
   ========================================================================== */
.acilir {
  border-radius: 16px; padding: 10px;
  box-shadow:
    0 0 0 1px rgba(11,20,36,.045),
    0 6px 16px -6px rgba(11,20,36,.10),
    0 30px 64px -20px rgba(11,20,36,.34);
}
.acilir.zengin { border-radius: 16px; }

/* bölüm başlığı */
.acilir-baslik { letter-spacing: .16em; font-weight: 700; color: var(--soluk); }

/* liste satırları: accent tonlu hover + ince sol vurgu + ikon dolumu */
.acilir-sol a, .acilir > a:not(.acilir-alt) { position: relative; border-radius: 10px; }
/* Sol dikey accent bar kaldırıldı — sade/kurumsal seçim (yalnız arkaplan vurgusu) */
.acilir-sol a::after, .acilir > a:not(.acilir-alt)::after { content: none !important; }
/* Kurumsal sade: satır hover nötr gri, ikon dinginde düz/nötr, hover'da yumuşak mavi (büyüme yok) */
.acilir a > i:first-child { box-shadow: none !important; background: #EEF1F6 !important; color: #5B6B80 !important; transition: background-color .2s, color .2s !important; }
.acilir-sol a:hover, .acilir > a:not(.acilir-alt):hover {
  background: #F4F6F9 !important;
}
.acilir-sol a:hover > i:first-child, .acilir > a:not(.acilir-alt):hover > i:first-child {
  background: var(--mavi-50) !important; color: var(--mavi-600) !important; transform: none !important;
}

/* yan panel: hafif accent degrade + daha ferah */
.acilir-yan {
  padding: 20px; gap: 11px;
  background: linear-gradient(180deg, var(--zemin-2), color-mix(in srgb, var(--mavi-500) 5%, var(--zemin-2)));
}
.acilir .yan-buton { height: 40px; box-shadow: 0 10px 22px -12px color-mix(in srgb, var(--mavi-500) 90%, #000); }

/* alt CTA satırı: belirgin ve ferah */
.acilir-alt, .acilir.zengin > .acilir-alt { padding: 13px 16px !important; }

/* ==========================================================================
   Üst menü açılırları — kurumsal disiplin (sakin durağan hal, accent hoverda)
   ========================================================================== */
/* Panel: biraz daha ferah iç boşluk, daha hassas (az "glow") gölge */
.acilir {
  padding: 12px;
  box-shadow:
    0 0 0 1px rgba(11,20,36,.06),
    0 10px 24px -12px rgba(11,20,36,.14),
    0 28px 56px -24px rgba(11,20,36,.26);
}

/* Durağan ikon kutuları: nötr slate + ince ring (kurumsal sükunet) */
.acilir a > i:first-child,
.acilir.izgara-2 a > i:first-child {
  background: #EDF1F7 !important; color: #5A6B80 !important;
  box-shadow: inset 0 0 0 1px rgba(11,20,36,.05);
  transition: background-color .22s var(--gecis), color .22s var(--gecis), box-shadow .22s var(--gecis) !important;
}
/* Hover: accent rengi ortaya çıkar (çubuk zaten var) */
.acilir-sol a:hover > i:first-child,
.acilir > a:not(.acilir-alt):hover > i:first-child {
  background: var(--u, var(--mavi-500)) !important; color: #fff !important;
  box-shadow: 0 6px 14px -6px color-mix(in srgb, var(--u, var(--mavi-500)) 75%, transparent);
}
/* Hover zemini nötr ve hafif (renk ipucunu sol çubuk verir) */
.acilir-sol a:hover,
.acilir > a:not(.acilir-alt):hover {
  background: var(--zemin-2);
}

/* Tipografi: başlık daha net, açıklama sakin */
.acilir a b { letter-spacing: -.005em; }
.acilir a small { color: var(--silik); }

/* Satırlar: tutarlı 8px ritminde biraz daha ferah */
.acilir-sol a, .acilir > a:not(.acilir-alt) { padding: 11px 12px; gap: 13px; }
.acilir-sol a::after, .acilir > a:not(.acilir-alt)::after { left: 2px; }

/* Yan panel: nötr zemin + net üst ayraç; "öne çıkan" sakin kurumsal */
.acilir-yan {
  background: var(--zemin-2);
  border-left: 1px solid var(--cizgi);
}
.acilir-yan b { letter-spacing: -.01em; }
.yan-ikon { box-shadow: inset 0 0 0 1px rgba(11,20,36,.04); }

/* Alt CTA satırı: üst ayraç net, zemin nötr */
.acilir-alt, .acilir.zengin > .acilir-alt {
  background: var(--zemin-2) !important;
  border-top: 1px solid var(--cizgi) !important;
}
.acilir-alt:hover { background: var(--zemin-3) !important; }

/* Mobil hero başlık — daha küçük (sola hizalı blok clamp'ını ezer) */
@media (max-width: 720px) {
  .sinema-baslik.v2 { font-size: 2.4rem; line-height: 1.06; margin-bottom: 20px; }
}
@media (max-width: 480px) {
  .sinema-baslik.v2 { font-size: 2.05rem; letter-spacing: -.03em; }
  .sinema-alt.v2 { font-size: .96rem; margin-bottom: 28px; }
}

/* Mobil hero butonları — daha kompakt */
@media (max-width: 720px) {
  .sinema-buton.v2 { gap: 10px; }
  .cta-ana, .cta-ikincil { height: 52px; font-size: 15px; }
  .cta-not { font-size: 12.5px; }
}

/* ==========================================================================
   Mobil: WhatsApp gizli + Çözümlerimiz bölümü toparlandı
   ========================================================================== */
@media (max-width: 720px) {
  /* WhatsApp yüzen butonu mobilde gizli (webde kalır) */
  .wp { display: none !important; }

  /* Çözümlerimiz: başlık-kart arası boşluk ve kart ritmi daha derli toplu */
  #cozumler .g-bas { margin-bottom: 28px; gap: 16px; }
  #cozumler .g-bento { gap: 14px; }
  #cozumler .g-kart-gorsel { min-height: 0; padding: 18px 18px 0; }
  #cozumler .g-kart.genis .g-kart-gorsel { padding: 18px; }
  #cozumler .g-kart-govde,
  #cozumler .g-kart.genis .g-kart-govde { padding: 20px; }
  #cozumler .g-kart h3,
  #cozumler .g-kart.genis h3 { font-size: 18px; margin-bottom: 8px; }
  #cozumler .g-kart p { margin-bottom: 16px; font-size: 14px; }
  #cozumler .g-kart ul { margin-bottom: 18px; padding-top: 14px; gap: 8px; }
}

/* Mobil: Rakamlar kartlarını kompaktlaştır (seyrek dikey boşlukları topla) */
@media (max-width: 720px) {
  .g-rakam.v2 { padding-top: 0; }
  .g-rakam.v2 .g-rakam-ic > div:not(.r-giris) { gap: 10px; padding: 20px 16px; }
  .g-rakam.v2 .r-ikon { width: 40px; height: 40px; font-size: 20px; border-radius: 11px; }
  .g-rakam.v2 .g-rakam-ic b { font-size: 1.9rem; }
  .g-rakam.v2 .r-metin small { margin-top: 4px; font-size: 12.5px; }
}

/* Mobil: Neden İstek kartlarını derli toplu yap */
@media (max-width: 720px) {
  .g-neden2 { gap: 10px; margin-top: 22px; }
  .g-neden2 > div { padding: 18px 18px 16px; border-radius: 14px; }
  .g-neden2 .g-halka { width: 40px; height: 40px; font-size: 18px; margin-bottom: 12px; }
  .g-neden2 .no { font-size: 28px; right: 16px; top: 14px; }
  .g-neden2 b { font-size: 15.5px; margin-bottom: 5px; }
  .g-neden2 p { font-size: 13px; }
}

/* Mobil: e-Dönüşüm bölümünü derli toplu yap */
@media (max-width: 720px) {
  .g-edon { padding: 20px; border-radius: 18px; }
  .g-edon-bas { gap: 12px; margin-bottom: 12px; }
  .g-edon-bas h3 { font-size: 18px; }
  .g-edon > p { margin-bottom: 16px; font-size: 14px; }
  .g-edon-liste { gap: 8px; margin-bottom: 18px; }
  .g-edon-liste a { padding: 12px; gap: 12px; }
  .g-edon-liste a > i:first-child { width: 36px; height: 36px; font-size: 18px; }
  .g-edon-liste small {
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
    overflow: hidden; line-height: 1.45;
  }
}

/* Mobil: Blog karüselini derli toplu yap */
@media (max-width: 720px) {
  .g-blog .b-ray { grid-auto-columns: 83%; gap: 14px; }
  .g-blog .b-ray .b-kart { box-shadow: 0 14px 30px -20px rgba(11,20,36,.3) !important; }
  .g-blog .b-ray .b-gorsel { aspect-ratio: 16 / 9.4; }
  .g-blog .b-icerik { padding: 16px 16px 18px !important; }
  .g-blog .b-ust { margin-bottom: 10px; }
  .g-blog .b-icerik b { font-size: 16.5px; }
  .g-blog .b-ozet { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; margin-top: 8px; font-size: 13.5px; }
  .g-blog .b-devam { margin-top: auto; padding-top: 16px; font-size: 13.5px; }
  .b-alt { gap: 16px; }
}

/* Mobil: scroll reveal animasyonları daha akıcı/kusursuz —
   pahalı blur filtresi kaldırıldı, kısa mesafe + kısa süre, sadece transform/opacity (GPU dostu). */
@media (max-width: 720px) {
  .hareket .gor { transform: translateY(16px); filter: none; transition: opacity .5s var(--akis), transform .6s var(--akis); }
  .hareket .gor.gorundu { transform: none; filter: none; }
  .gor { transform: translateY(14px); transition: opacity .45s var(--akis), transform .55s var(--akis); }
  .gor.gorundu { transform: none; }
  .gor.g1, .gor.g2, .gor.g3, .gor.g4, .gor.g5 { transition-delay: 0s; }
  .hareket .kademe { translate: 0 16px; scale: 1; filter: none; transition: opacity .5s var(--akis), translate .6s var(--akis); transition-delay: calc(var(--k, 0) * 55ms + 40ms); }
  .hareket .kademe.acildi { translate: 0 0; scale: 1; }
  .hareket .b-ray .kademe { transition-delay: calc(var(--k, 0) * 65ms + 60ms); }
  .hareket .perde { translate: 0 .2em; transition: clip-path .6s var(--akis), translate .6s var(--akis); }
}

/* Mobil: footer'ı derli toplu yap (gevşek boşlukları topla) */
@media (max-width: 600px) {
  .f-min { padding-top: 44px; }
  .f-min-ic { gap: 32px; padding-bottom: 40px; }
  .f-min-marka p { margin: 16px 0 20px; font-size: 13.5px; }
  .f-min .f-sosyal a { width: 36px; height: 36px; font-size: 16px; }
  .f-min-linkler { gap: 26px 20px; }
  .f-min .f-sutun h4 { margin-bottom: 12px; font-size: 12.5px; }
  .f-min .f-sutun ul { gap: 9px; }
  .f-min .f-sutun a { font-size: 13px; line-height: 1.4; }
  .f-min .f-sutun-iletisim .f-iletisim { gap: 9px; }
  .f-min .f-taban { padding-top: 20px; padding-bottom: 26px; gap: 12px; }
}

/* Footer alt bar: sağ-sol boşluğu .kap hizasına getir (yatay padding geri) */
.f-alt.v3.f-min .f-taban { padding-left: 24px; padding-right: 24px; }
@media (max-width: 600px) {
  .f-alt.v3.f-min .f-taban { padding-left: 16px; padding-right: 16px; }
}

/* Mobil: Referanslar bölümünü derli toplu yap */
@media (max-width: 600px) {
  .referans-bolum.v2 { padding: 44px 0 40px; }
  .g-blog + .referans-bolum.v2 { padding-top: 40px; }
  .ref-etiket { margin-bottom: 20px; }
  .ref-alt { justify-content: flex-end; margin-top: 18px; }
}

/* Mobil: ürün sayfası modül çubuğu (u-nav) — kenar solması + kompakt */
@media (max-width: 720px) {
  .u-nav-ic {
    padding-top: 9px; padding-bottom: 9px; gap: 4px;
    -webkit-mask-image: linear-gradient(90deg, #000 86%, transparent);
    mask-image: linear-gradient(90deg, #000 86%, transparent);
  }
  .u-nav a { padding: 8px 11px; font-size: 13px; }
  .u-nav a i { font-size: 15px; }
}

/* Mobil: hizmet/ürün detay özellik kartları (md-ozellik) — kompakt */
@media (max-width: 720px) {
  .md-ozellik-bas { margin: 40px 0 18px; }
  .md-ozellikler { gap: 12px; }
  .md-ozellik { padding: 18px 18px 16px; border-radius: 14px; }
  .md-ozellik-ikon { width: 40px; height: 40px; font-size: 20px; margin-bottom: 12px; border-radius: 11px; }
  .md-ozellik-no { right: 16px; top: 16px; }
  .md-ozellik b { font-size: 15.5px; margin-bottom: 6px; padding-right: 22px; }
  .md-ozellik p { font-size: 13.5px; line-height: 1.55; }
}

/* Mobil: İletişim kanal kartları + süreç adımları — kompakt */
@media (max-width: 720px) {
  .i-kanallar { gap: 12px; }
  .i-kanal { padding: 18px 18px 16px; border-radius: 16px; }
  .i-ikon { width: 42px; height: 42px; font-size: 21px; margin-bottom: 12px; border-radius: 12px; }
  .i-ok { right: 16px; top: 16px; width: 32px; height: 32px; font-size: 15px; }
  .i-surec { padding: 24px 18px; margin-top: 36px; border-radius: 18px; }
  .i-surec-bas { margin-bottom: 20px; }
  .i-adim-ikon { width: 42px; height: 42px; font-size: 20px; margin-bottom: 12px; }
  .i-adimlar li + li { padding-top: 20px; }
  .i-adimlar li + li .i-no { top: 22px; }
  .i-adimlar b { font-size: 15.5px; }
}

/* Mobil menü açıkken üst nav'ı sabitle: sayfa kaydırılmışken overflow:hidden
   sticky nav'ı bozup üstte sayfa içeriğinin sızmasına yol açıyordu. */
@media (max-width: 1024px) {
  .menu-acik .nav { position: fixed; top: 0; left: 0; right: 0; }
}

/* Mobil: Hakkımızda güvence kartları (h-guvence-oge) — kompakt */
@media (max-width: 720px) {
  .h-guvence { padding: 26px 18px; }
  .h-guvence-liste { gap: 12px; }
  .h-guvence-oge { padding: 18px 18px 16px; border-radius: 14px; }
  .h-g-ikon { width: 40px; height: 40px; font-size: 20px; margin-bottom: 12px; border-radius: 11px; }
  .h-guvence-oge b { font-size: 15.5px; margin-bottom: 6px; }
  .h-guvence-oge p { font-size: 13.5px; line-height: 1.55; }
}

/* Mobil: Blog listesi — kart özetlerini 3 satıra kırp (uzun kartları topla) */
@media (max-width: 720px) {
  .bl-govde .b-ozet,
  .by-ilgili-izgara .b-ozet {
    display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3;
    overflow: hidden;
  }
  .by-ilgili-bas { margin-bottom: 20px; }
  .bl-kategoriler {
    -webkit-mask-image: linear-gradient(90deg, #000 88%, transparent);
    mask-image: linear-gradient(90deg, #000 88%, transparent);
  }
}

/* Mobil (dokunmatik): referans logolarını tam görünür yap — hover ile renklenme yok */
@media (max-width: 720px) {
  .rf-logo img, .ref-yuva img { filter: none !important; opacity: 1 !important; }
  .rf-kart { padding: 18px 10px 14px; }
}

/* ==========================================================================
   Ürünlerimiz (/urunlerimiz): üstte ürün şeridi; her ürün görsel + içerik, satır satır sağa/sola dönüşümlü
   ========================================================================== */
.uk-serit { position: sticky; top: var(--nav-h); z-index: 20; background: rgba(255,255,255,.94); backdrop-filter: saturate(160%) blur(12px); -webkit-backdrop-filter: saturate(160%) blur(12px); border-bottom: 1px solid var(--cizgi); }
.uk-serit .kap { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; padding-top: 12px; padding-bottom: 12px; }
.uk-serit .kap::-webkit-scrollbar { display: none; }
.uk-serit a { display: inline-flex; align-items: center; gap: 8px; flex-shrink: 0; height: 40px; padding: 0 16px; border-radius: 999px; font-size: 14px; font-weight: 500; color: var(--metin); border: 1px solid transparent; transition: background-color .2s, color .2s, border-color .2s; }
.uk-serit a i { font-size: 18px; color: var(--u); }
.uk-serit a:hover { background: var(--zemin-2); border-color: var(--cizgi); color: var(--murekkep); }
.uk-serit a.aktif { background: color-mix(in srgb, var(--u) 10%, #fff); border-color: color-mix(in srgb, var(--u) 35%, #fff); color: var(--murekkep); }

.uk-govde .kap { display: grid; gap: 0; }
.uk-urun { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 64px; align-items: center; padding: 72px 0; border-bottom: 1px solid var(--cizgi); scroll-margin-top: calc(var(--nav-h) + 72px); }
.uk-urun:first-child { padding-top: 48px; }
.uk-urun:last-child { border-bottom: 0; padding-bottom: 0; }
.uk-urun.ters .uk-gorsel { order: 2; }

.uk-gorsel { position: relative; display: block; aspect-ratio: 4 / 3; border-radius: 20px; overflow: hidden; background: var(--zemin-2); box-shadow: 0 30px 60px -30px rgba(11,20,36,.35); isolation: isolate; }
.uk-gorsel img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s var(--gecis); }
.uk-gorsel::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 45%, rgba(6,16,30,.55) 100%); pointer-events: none; }
.uk-urun:hover .uk-gorsel img { transform: scale(1.04); }
.uk-gorsel-ikon { position: absolute; z-index: 1; left: 22px; bottom: 22px; width: 52px; height: 52px; border-radius: 14px; display: grid; place-items: center; font-size: 26px; color: var(--u); background: #fff; box-shadow: 0 10px 24px -10px rgba(0,0,0,.45); }
.uk-gorsel-sayi { position: absolute; z-index: 1; right: 20px; bottom: 24px; padding: 7px 14px; border-radius: 999px; font-size: 13px; color: #fff; background: rgba(6,16,30,.55); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); border: 1px solid rgba(255,255,255,.18); }
.uk-gorsel-sayi b { font-weight: 700; }

.uk-ust { display: flex; align-items: center; gap: 12px; margin: 0 0 14px; font-size: 13px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--u); }
.uk-ust span { font-family: var(--yazi-baslik); color: var(--silik); letter-spacing: 0; padding-right: 12px; border-right: 1px solid var(--cizgi); }
.uk-icerik h2 { font-family: var(--yazi-baslik); font-size: clamp(1.6rem, 2.6vw, 2.15rem); font-weight: 600; line-height: 1.15; letter-spacing: -.025em; margin: 0 0 16px; }
.uk-icerik h2 a { color: var(--murekkep); transition: color .2s; }
.uk-icerik h2 a:hover { color: var(--u); }
.uk-metin { font-size: 16px; line-height: 1.7; color: var(--soluk); margin: 0 0 28px; }
.uk-moduller { list-style: none; margin: 0 0 32px; padding: 20px 0 0; border-top: 1px solid var(--cizgi); display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2px 24px; }
.uk-moduller a { display: flex; align-items: flex-start; gap: 10px; padding: 7px 0; font-size: 14.5px; line-height: 1.4; color: var(--metin); transition: color .2s; }
.uk-moduller a i { font-size: 17px; color: var(--u); flex-shrink: 0; margin-top: 0; }
.uk-moduller a:hover { color: var(--u); }
.uk-butonlar { display: flex; flex-wrap: wrap; gap: 10px; }
.uk-incele, .uk-demo { display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 48px; padding: 0 22px; border-radius: 10px; font-size: 14.5px; font-weight: 600; white-space: nowrap; transition: background-color .2s, color .2s, border-color .2s; }
.uk-incele { background: var(--murekkep); color: #fff; }
.uk-incele:hover { background: var(--u); }
.uk-incele i { transition: transform .3s var(--gecis); }
.uk-incele:hover i { transform: translateX(4px); }
.uk-demo { color: var(--murekkep); border: 1px solid var(--cizgi); }
.uk-demo:hover { border-color: var(--u); color: var(--u); }

.uk-cta { text-align: center; max-width: 680px; }
.uk-cta h2 { font-family: var(--yazi-baslik); font-size: clamp(1.5rem, 2.8vw, 2rem); font-weight: 600; letter-spacing: -.02em; color: var(--murekkep); margin: 0 0 12px; }
.uk-cta p { color: var(--soluk); line-height: 1.65; margin: 0 0 28px; }
.uk-cta-buton { display: inline-flex; align-items: center; gap: 10px; height: 54px; padding: 0 26px; border-radius: 10px; background: var(--mavi-500); color: #fff; font-family: var(--yazi-baslik); font-weight: 600; font-size: 15.5px; box-shadow: var(--golge-mavi); transition: background-color .2s, transform .3s var(--gecis); }
.uk-cta-buton:hover { background: var(--mavi-600); transform: translateY(-1px); }
.uk-cta-buton i { transition: transform .3s var(--gecis); }
.uk-cta-buton:hover i { transform: translateX(4px); }

@media (max-width: 960px) {
  .uk-urun { grid-template-columns: 1fr; gap: 32px; padding: 56px 0; }
  .uk-urun.ters .uk-gorsel { order: 0; }
  .uk-gorsel { aspect-ratio: 16 / 10; }
}
@media (max-width: 560px) {
  .uk-serit .kap { padding-top: 10px; padding-bottom: 10px; }
  .uk-serit a { height: 36px; padding: 0 12px; font-size: 13px; }
  .uk-urun { gap: 24px; padding: 44px 0; }
  .uk-gorsel { border-radius: 16px; }
  .uk-gorsel-ikon { left: 14px; bottom: 14px; width: 44px; height: 44px; font-size: 22px; border-radius: 12px; }
  .uk-gorsel-sayi { right: 14px; bottom: 18px; }
  .uk-moduller { grid-template-columns: 1fr; }
  .uk-butonlar { flex-direction: column; }
}

/* Ürünlerimiz: web uygulaması rozeti */
.uk-rozetler { display: flex; flex-wrap: wrap; gap: 8px; margin: -6px 0 16px; }
.uk-rozet { display: inline-flex; align-items: center; gap: 6px; margin: 0; padding: 5px 12px; border-radius: 999px; font-size: 13px; font-weight: 600; color: var(--u, var(--mavi-500)); background: color-mix(in srgb, var(--u, var(--mavi-500)) 10%, #fff); }
.uk-rozet i { font-size: 16px; }

}

/* Ürün sayfası: web ve mobil uygulama ("Her yerden erişim") bölümü
   Solda metin ve platform satırları, sağda ürün renginde hale önünde telefon görseli */
.u-platform { position: relative; padding: 104px 0; overflow: hidden; background: linear-gradient(180deg, color-mix(in srgb, var(--u, var(--mavi-500)) 6%, #F7F9FC), #F7F9FC); border-top: 1px solid var(--cizgi); border-bottom: 1px solid var(--cizgi); }
.u-platform-metin { max-width: none; }
.u-platform-metin h2, .u-platform-giris { max-width: 640px; }
.u-platform-metin h2 { font-family: var(--yazi-baslik); font-size: clamp(1.7rem, 3vw, 2.4rem); font-weight: 600; line-height: 1.15; letter-spacing: -.025em; color: var(--murekkep); margin: 12px 0 14px; text-wrap: balance; }
.u-platform-giris { margin: 0 0 32px; font-size: 17px; line-height: 1.65; color: var(--soluk); }
.u-platform-satirlar { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 0 48px; border-top: 1px solid var(--cizgi); }
.u-platform-satir { display: grid; grid-template-columns: 48px minmax(0, 1fr); gap: 18px; padding: 24px 0; border-bottom: 1px solid var(--cizgi); }
.u-platform-ikon { width: 48px; height: 48px; border-radius: 13px; display: grid; place-items: center; font-size: 24px; color: var(--u, var(--mavi-500)); background: #fff; box-shadow: 0 0 0 1px var(--cizgi), 0 8px 18px -12px rgba(11,20,36,.35); }
.u-platform-satir b { display: block; font-family: var(--yazi-baslik); font-size: 17px; font-weight: 600; color: var(--murekkep); margin: 2px 0 6px; }
.u-platform-satir p { margin: 0; font-size: 15px; line-height: 1.65; color: var(--soluk); }
.u-platform-etiketler { list-style: none; margin: 14px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.u-platform-etiketler li { padding: 5px 11px; border-radius: 999px; font-size: 12.5px; font-weight: 500; color: var(--metin); background: #fff; border: 1px solid var(--cizgi); }
.u-platform-link { display: inline-flex; align-items: center; gap: 8px; margin-top: 28px; font-weight: 600; font-size: 15px; color: var(--u, var(--mavi-600)); }
.u-platform-link i { transition: transform .3s var(--gecis); }
.u-platform-link:hover i { transform: translateX(4px); }
@media (max-width: 960px) {
  .u-platform { padding: 72px 0; }
}
@media (max-width: 560px) {
  .u-platform { padding: 56px 0; }
  .u-platform-giris { font-size: 16px; margin-bottom: 24px; }
  .u-platform-satir { grid-template-columns: 42px minmax(0, 1fr); gap: 14px; padding: 20px 0; }
  .u-platform-ikon { width: 42px; height: 42px; font-size: 21px; }
}

/* Ürün sayfası üst kısmı: masaüstü ekran görüntüsünün sağ alt köşesine bindirilmiş mobil uygulama ekranı */
.u-bas-gorsel { padding-bottom: 28px; }
.u-bas-telefon { position: absolute; z-index: 2; right: -4px; bottom: -36px; width: 25%; min-width: 118px; max-width: 168px; margin: 0; padding: 6px; border-radius: 26px; background: #0B1B2E; box-shadow: 0 30px 60px -22px rgba(0,0,0,.75), 0 0 0 1px rgba(160,200,235,.22); }
.u-bas-telefon img { display: block; width: 100%; height: auto; border-radius: 20px; }
@media (max-width: 1240px) { .u-bas-telefon { right: 22px; } }
@media (max-width: 1024px) { .u-bas-telefon { right: 8px; bottom: -40px; } }
@media (max-width: 560px) { .u-bas-telefon { width: 24%; min-width: 86px; right: 6px; bottom: -30px; border-radius: 18px; padding: 4px; } .u-bas-telefon img { border-radius: 14px; } }

/* Ürün sayfası üst kısmı: gerçek program ekranı çerçevesi.
   Programın açık renkli araç çubuğuyla bütünleşen açık pencere başlığı, renkli pencere düğmeleri,
   kırpılmadan kendi oranında görüntü ve ince, katmanlı gölge */
.u-cerceve.gercek { border-radius: 14px; background: #20262F; border: 1px solid rgba(255,255,255,.07); box-shadow: 0 2px 6px rgba(0,0,0,.25), 0 40px 80px -30px rgba(0,0,0,.75), 0 0 0 6px rgba(255,255,255,.04); }
.u-cerceve.gercek .u-cerceve-ust { height: 30px; padding: 0 12px; gap: 7px; background: linear-gradient(180deg, #F4F6F9, #E8ECF1); border-bottom: 1px solid #D9DFE7; }
.u-cerceve.gercek .u-cerceve-ust span { width: 10px; height: 10px; background: #FF5F57; box-shadow: inset 0 0 0 .5px rgba(0,0,0,.15); }
.u-cerceve.gercek .u-cerceve-ust span:nth-child(2) { background: #FEBC2E; }
.u-cerceve.gercek .u-cerceve-ust span:nth-child(3) { background: #28C840; }
.u-cerceve.gercek .u-cerceve-ust b { flex: 1; margin: 0 52px 0 0; text-align: center; font-size: 11.5px; font-weight: 600; color: #5A6B80; letter-spacing: .01em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.u-cerceve.gercek img { aspect-ratio: auto; height: auto; object-fit: contain; background: #20262F; }

/* Ürün sayfası üst kısmı: cihaz grubu (masaüstü penceresi + telefon + rozet).
   Grup tek parça halinde üç boyutlu eğik durur; telefon ve rozet pencerenin önünde (derinlik).
   Açılışta grup birlikte yerine oturur, fareyle üzerine gelince birlikte düzleşir.
   Saydamlık animasyonu kapsayıcıda (.u-bas-gorsel), dönme grupta: saydamlığı değişen öğe üç boyutu
   düzleştirir; ikisi aynı öğede olsaydı animasyon bitince telefon ve rozet birden büyürdü. */
.u-bas-gorsel { perspective: 1800px; perspective-origin: 35% 50%; animation: cihazBelir 1s .1s ease-out backwards; }
@keyframes cihazBelir { from { opacity: 0; } }
.u-cihazlar { position: relative; transform-style: preserve-3d; transform: rotateY(-7deg) rotateX(2.5deg); transition: transform .9s cubic-bezier(.2, .7, .2, 1); animation: cihazGiris 1.3s .1s cubic-bezier(.16, 1, .3, 1) backwards; }
.u-bas-gorsel:hover .u-cihazlar { transform: rotateY(0) rotateX(0); }
.u-cihazlar .u-bas-telefon { transform: translateZ(70px); }
.u-cihazlar .u-yuzen { transform: translateZ(45px); }
@keyframes cihazGiris { from { transform: translateY(44px) rotateY(-16deg) rotateX(8deg); } }
@media (max-width: 1024px) {
  /* Dokunmatik ve dar ekran: eğim yok, açılışta grup birlikte aşağıdan gelir */
  .u-cihazlar, .u-bas-gorsel:hover .u-cihazlar { transform: none; animation-name: cihazGirisDuz; }
  .u-cihazlar .u-bas-telefon, .u-cihazlar .u-yuzen { transform: none; }
}
@keyframes cihazGirisDuz { from { transform: translateY(32px); } }
@media (prefers-reduced-motion: reduce) {
  .u-bas-gorsel, .u-cihazlar { animation: none; transition: none; }
}

/* Üst kısımdaki telefon: iPhone görünümü. Ekranın üst ortasında Dynamic Island (siyah çentik),
   ince siyah çerçeve ve metalik kenar. Ölçüler genişliğe oranlı (iPhone 15: ada 126×37, üstten 11 pt). */
.u-bas-telefon { padding: 5px; border-radius: 30px; background: #05070A; box-shadow: 0 0 0 1.5px #3A4452, 0 0 0 2.5px #12161C, 0 30px 60px -22px rgba(0,0,0,.75); }
.u-bas-telefon img { border-radius: 25px; }
.u-bas-telefon::before { content: ""; position: absolute; z-index: 2; top: 0; left: 50%; width: 30%; aspect-ratio: 126 / 37; margin-top: calc(5px + 2.6%); transform: translateX(-50%); border-radius: 999px; background: #000; box-shadow: inset 0 0 0 1px rgba(255,255,255,.04); }
@media (max-width: 560px) {
  .u-bas-telefon { padding: 3px; border-radius: 18px; }
  .u-bas-telefon img { border-radius: 15px; }
  .u-bas-telefon::before { margin-top: calc(3px + 2.6%); }
}

/* Eğik duran cihazlarda kenarların pürüzsüz çizilmesi (alt kenarda tırtıklı ince çizgi oluşmasın).
   Çerçeve zemini ekran görüntüsünün alt kenarıyla aynı renkte (#20262F): olası alt-piksel boşluk görünmez. */
.u-cihazlar .u-cerceve, .u-cihazlar .u-bas-telefon, .u-cihazlar .u-yuzen { backface-visibility: hidden; -webkit-backface-visibility: hidden; outline: 1px solid transparent; }
.u-cihazlar .u-cerceve img { transform: translateZ(0); }

/* Mobil alt menü: öğe kademeli açılış */
@keyframes altOgeGel { from { opacity: 0; transform: translateX(-7px); } to { opacity: 1; transform: none; } }