/* =====================================================================
   SEKTOREL KULLANIM  —  /sektorler  ve  /sektorler/<slug>
   ---------------------------------------------------------------------
   TASARIM KURALLARI (Nurkan, 2026-09-07):
     1. KUTULARDA SOL BORDER YOK. Renkli sol serit, border-left ile
        aksan — hicbiri kullanilmaz.
     2. KUTULAR GLASSMORPH. Cerceve dort tarafi saydam beyaz, zemin
        yariseffaf, arkasi bulanik. main.css'teki receteyle ayni.
     3. HOVER'DA KABARMA YOK. transform, scale, buyuyen golge yok;
        yalnizca kenar ve zemin tonu degisir.
     4. SAYFA YAZI DUVARI DEGIL. Her vakada medya (video ya da
        gorsel), firma logosu ve kisi fotografi alani var; metin
        kisa tutulur: tek cumlelik "onceden / simdi" ve tek buyuk
        alinti.
   Cam efektinin gorunmesi icin bolumun arkasina yumusak renk
   lekeleri konuyor (.b2b-sek::before / ::after).

   Ust alan yuksekligi iki degerli (durgun ~128px, kaydirilmis 84px):
   tepe padding-top masaustunde 176px, mobilde 150px (2-cms tuzak 11).
   ===================================================================== */

.b2b-sek {
  --sek-zemin: #F1F6FF;
  --sek-metin: #0F172A;
  --sek-soluk: #56637A;
  --sek-mavi: #2563EB;
  --sek-cam: rgba(255, 255, 255, .62);
  --sek-cam-koyu: rgba(255, 255, 255, .78);
  --sek-cam-kenar: rgba(255, 255, 255, .58);
  --sek-cam-kenar-uyanik: rgba(255, 255, 255, .92);
  --sek-bulanik: blur(22px) saturate(180%);
  --sek-golge: 0 18px 44px -26px rgba(11, 38, 102, .42), inset 0 1px 0 rgba(255, 255, 255, .72);

  position: relative;
  isolation: isolate;
  background: var(--sek-zemin);
  color: var(--sek-metin);
  overflow: hidden;
}

.b2b-sek::before,
.b2b-sek::after {
  content: "";
  position: absolute;
  z-index: -1;
  pointer-events: none;
  border-radius: 50%;
  filter: blur(90px);
}
.b2b-sek::before {
  top: -180px; left: -140px; width: 620px; height: 620px;
  background: radial-gradient(circle, rgba(37, 99, 235, .22) 0%, rgba(37, 99, 235, 0) 70%);
}
.b2b-sek::after {
  top: 42%; right: -200px; width: 680px; height: 680px;
  background: radial-gradient(circle, rgba(99, 160, 255, .20) 0%, rgba(99, 160, 255, 0) 70%);
}

/* Ortak cam kutu — dort tarafi ayni, sol border YOK. */
.b2b-sek-cam {
  border: 1px solid var(--sek-cam-kenar);
  background: var(--sek-cam);
  backdrop-filter: var(--sek-bulanik);
  -webkit-backdrop-filter: var(--sek-bulanik);
  box-shadow: var(--sek-golge);
}
@supports not ((backdrop-filter: blur(2px)) or (-webkit-backdrop-filter: blur(2px))) {
  .b2b-sek-cam { background: rgba(255, 255, 255, .94); }
}

/* ---------- 1. TEPE ---------- */

.b2b-sek-tepe { padding: 176px 0 52px; }
.b2b-sek-ic {
  position: relative;
  width: 100%;
  max-width: 1180px;
  margin: 0 auto;
  padding: 0 24px;
}
.b2b-sek-iz {
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px;
  margin: 0 0 18px; font-size: .82rem; color: var(--sek-soluk);
}
.b2b-sek-iz a { color: var(--sek-soluk); text-decoration: none; }
.b2b-sek-iz a:hover { color: var(--sek-mavi); }
.b2b-sek-iz span { opacity: .5; }

.b2b-sek-etiket {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 7px 15px; margin-bottom: 18px;
  border-radius: 999px;
  border: 1px solid var(--sek-cam-kenar);
  background: var(--sek-cam);
  backdrop-filter: var(--sek-bulanik);
  -webkit-backdrop-filter: var(--sek-bulanik);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .8);
  color: var(--sek-mavi);
  font-size: .78rem; font-weight: 700; letter-spacing: .02em;
}
.b2b-sek-etiket svg { width: 16px; height: 16px; }

.b2b-sek-baslik {
  margin: 0 0 14px;
  font-size: clamp(1.95rem, 4.2vw, 3.1rem);
  line-height: 1.14; font-weight: 800; letter-spacing: -.02em;
}
.b2b-sek-alt {
  margin: 0; max-width: 720px;
  font-size: clamp(1rem, 1.6vw, 1.12rem);
  line-height: 1.7; color: var(--sek-soluk);
}

/* ---------- 2. DIZIN KARTLARI ---------- */

.b2b-sek-liste { padding: 8px 0 72px; }
.b2b-sek-izgara {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 18px;
}
.b2b-sek-kart {
  display: flex; flex-direction: column; gap: 12px;
  padding: 26px 24px 24px;
  border-radius: 18px;
  text-decoration: none; color: inherit;
  /* Hover'da KABARMA YOK. */
  transition: border-color .2s ease, background-color .2s ease;
}
.b2b-sek-kart:hover,
.b2b-sek-kart:focus-visible {
  border-color: var(--sek-cam-kenar-uyanik);
  background: var(--sek-cam-koyu);
}
.b2b-sek-kart-ikon {
  display: inline-flex; align-items: center; justify-content: center;
  width: 46px; height: 46px; border-radius: 13px;
  border: 1px solid rgba(255, 255, 255, .7);
  background: rgba(37, 99, 235, .10);
  color: var(--sek-mavi);
}
.b2b-sek-kart-ikon svg { width: 24px; height: 24px; }
.b2b-sek-kart-ad { margin: 0; font-size: 1.08rem; font-weight: 700; letter-spacing: -.01em; }
.b2b-sek-kart-ozet { margin: 0; font-size: .92rem; line-height: 1.62; color: var(--sek-soluk); }
.b2b-sek-kart-dip {
  display: inline-flex; align-items: center; gap: 6px;
  margin-top: auto; padding-top: 6px;
  font-size: .86rem; font-weight: 700; color: var(--sek-mavi);
}
.b2b-sek-kart-dip svg { width: 16px; height: 16px; }

/* ---------- 3. BOLUM ---------- */

.b2b-sek-bolum { padding: 20px 0 64px; }
.b2b-sek-bolum--ust { padding-top: 56px; }
.b2b-sek-bolum-baslik {
  margin: 0 0 10px;
  font-size: clamp(1.4rem, 2.6vw, 1.9rem);
  font-weight: 800; letter-spacing: -.015em;
}
.b2b-sek-bolum-alt { margin: 0 0 28px; max-width: 700px; color: var(--sek-soluk); line-height: 1.7; }

/* ---------- 4. VAKA KARTI ---------- */

.b2b-sek-vaka { border-radius: 24px; overflow: hidden; }
.b2b-sek-vaka + .b2b-sek-vaka { margin-top: 28px; }

/* Medya varsa iki sutun: solda video/gorsel, sagda ozet. */
.b2b-sek-vaka-govde { display: grid; grid-template-columns: 1fr; }
.b2b-sek-vaka--medyali .b2b-sek-vaka-govde { grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); }

/* --- medya alani --- */
.b2b-sek-medya {
  position: relative;
  aspect-ratio: 16 / 9;
  background: rgba(15, 44, 107, .06);
  border-right: 1px solid rgba(255, 255, 255, .7);
  overflow: hidden;
}
.b2b-sek-medya iframe,
.b2b-sek-medya img,
.b2b-sek-medya video {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  border: 0; object-fit: cover; display: block;
}

/* --- sag sutun --- */
.b2b-sek-vaka-ic { padding: 30px 32px 32px; display: flex; flex-direction: column; }

/* firma satiri: logo + ad + kunye */
.b2b-sek-firma { display: flex; align-items: center; gap: 14px; margin: 0 0 6px; }
.b2b-sek-logo {
  flex: 0 0 auto;
  display: inline-flex; align-items: center; justify-content: center;
  height: 46px; min-width: 46px; padding: 6px 10px;
  border-radius: 12px;
  border: 1px solid rgba(255, 255, 255, .78);
  background: rgba(255, 255, 255, .72);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .8);
}
.b2b-sek-logo img { max-height: 30px; max-width: 120px; width: auto; height: auto; display: block; }
.b2b-sek-firma-ad { margin: 0; font-size: 1.24rem; font-weight: 800; letter-spacing: -.015em; line-height: 1.25; }
.b2b-sek-kunye {
  display: flex; flex-wrap: wrap; gap: 5px 13px;
  margin: 0 0 22px; font-size: .84rem; color: var(--sek-soluk);
}
.b2b-sek-kunye span { display: inline-flex; align-items: center; gap: 6px; }
.b2b-sek-kunye span::before { content: ""; width: 4px; height: 4px; border-radius: 50%; background: #9AAAC4; }

/* --- onceden -> simdi seridi: tek cumle, yan yana --- */
.b2b-sek-akis {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: stretch;
  gap: 10px;
  margin: 0 0 22px;
}
.b2b-sek-akis-kutu {
  padding: 14px 16px;
  border-radius: 14px;
  border: 1px solid rgba(255, 255, 255, .74);
  backdrop-filter: blur(14px) saturate(160%);
  -webkit-backdrop-filter: blur(14px) saturate(160%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .7);
  font-size: .92rem; line-height: 1.55;
}
.b2b-sek-akis-kutu--once  { background: rgba(253, 240, 236, .58); color: #6B4038; }
.b2b-sek-akis-kutu--simdi { background: rgba(232, 243, 255, .62); color: var(--sek-metin); }
.b2b-sek-akis-etiket {
  display: block; margin-bottom: 5px;
  font-size: .68rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase;
}
.b2b-sek-akis-kutu--once  .b2b-sek-akis-etiket { color: #A85A49; }
.b2b-sek-akis-kutu--simdi .b2b-sek-akis-etiket { color: var(--sek-mavi); }
.b2b-sek-akis-ok {
  align-self: center;
  display: flex; align-items: center; justify-content: center;
  width: 26px; height: 26px; color: #9AAAC4;
}
.b2b-sek-akis-ok svg { width: 20px; height: 20px; }

/* --- buyuk alinti + kisi --- */
.b2b-sek-alinti { margin: 0 0 22px; }
.b2b-sek-alinti p {
  margin: 0 0 16px;
  font-size: clamp(1.08rem, 1.7vw, 1.28rem);
  line-height: 1.55;
  font-weight: 600;
  letter-spacing: -.01em;
  color: var(--sek-metin);
}
.b2b-sek-kisi { display: flex; align-items: center; gap: 12px; }
.b2b-sek-kisi-foto,
.b2b-sek-kisi-harf {
  flex: 0 0 auto;
  width: 46px; height: 46px;
  border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, .85);
  box-shadow: 0 4px 12px -6px rgba(11, 38, 102, .5);
}
.b2b-sek-kisi-foto { object-fit: cover; display: block; filter: grayscale(1) contrast(1.04); }
.b2b-sek-kisi-harf {
  display: inline-flex; align-items: center; justify-content: center;
  background: rgba(37, 99, 235, .12); color: var(--sek-mavi);
  font-size: .92rem; font-weight: 800;
}
.b2b-sek-kisi-ad { display: block; font-size: .96rem; font-weight: 700; line-height: 1.3; }
.b2b-sek-kisi-unvan { display: block; font-size: .83rem; color: var(--sek-soluk); line-height: 1.4; }

/* --- sonuc rakamlari --- */
.b2b-sek-sonuc {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin: 0 0 20px;
}
.b2b-sek-sonuc-kutu {
  padding: 15px 16px;
  border-radius: 15px;
  border: 1px solid rgba(255, 255, 255, .74);
  background: rgba(255, 255, 255, .52);
  backdrop-filter: blur(14px) saturate(160%);
  -webkit-backdrop-filter: blur(14px) saturate(160%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .7);
}
.b2b-sek-sonuc-sayi {
  display: block;
  font-size: clamp(1.3rem, 2.2vw, 1.72rem);
  font-weight: 800; letter-spacing: -.025em; line-height: 1.15;
  color: var(--sek-mavi);
}
.b2b-sek-sonuc-yazi {
  display: block; margin-top: 5px;
  font-size: .82rem; line-height: 1.45; color: var(--sek-soluk);
}

/* --- modul rozetleri --- */
.b2b-sek-moduller {
  display: flex; flex-wrap: wrap; gap: 8px;
  margin: auto 0 0; padding: 18px 0 0;
  border-top: 1px solid rgba(255, 255, 255, .7);
}
.b2b-sek-moduller-etiket {
  width: 100%; margin: 0 0 4px;
  font-size: .72rem; font-weight: 800; letter-spacing: .07em;
  text-transform: uppercase; color: var(--sek-soluk);
}
.b2b-sek-modul {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 7px 13px; border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, .74);
  background: rgba(255, 255, 255, .5);
  backdrop-filter: blur(12px) saturate(160%);
  -webkit-backdrop-filter: blur(12px) saturate(160%);
  font-size: .82rem; font-weight: 600;
  color: var(--sek-metin); text-decoration: none;
  transition: border-color .2s ease, background-color .2s ease, color .2s ease;
}
a.b2b-sek-modul:hover,
a.b2b-sek-modul:focus-visible {
  border-color: var(--sek-cam-kenar-uyanik);
  background: rgba(255, 255, 255, .78);
  color: var(--sek-mavi);
}

/* ---------- 5. DIGER SEKTORLER ---------- */

.b2b-sek-diger { display: flex; flex-wrap: wrap; gap: 10px; }
.b2b-sek-diger a {
  padding: 10px 17px; border-radius: 999px;
  border: 1px solid var(--sek-cam-kenar);
  background: var(--sek-cam);
  backdrop-filter: var(--sek-bulanik);
  -webkit-backdrop-filter: var(--sek-bulanik);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .72);
  font-size: .9rem; font-weight: 600;
  color: var(--sek-metin); text-decoration: none;
  transition: border-color .2s ease, background-color .2s ease, color .2s ease;
}
.b2b-sek-diger a:hover,
.b2b-sek-diger a:focus-visible {
  border-color: var(--sek-cam-kenar-uyanik);
  background: var(--sek-cam-koyu);
  color: var(--sek-mavi);
}

/* ---------- 6. DIPNOT ----------
   GERCEK REFERANSLAR GIRILINCE icerikListesi.php icindeki
   $b2bSekDipnot bosaltilir; bu kutu o zaman hic basilmaz. */
.b2b-sek-dipnot {
  margin: 26px 0 0;
  font-size: .8rem; line-height: 1.6; color: #7C8899;
}

/* ---------- 7. DIP CAGRI (koyu) ---------- */

.b2b-sek-cagri {
  position: relative; padding: 64px 0;
  background: linear-gradient(135deg, #0F2C6B 0%, #14387F 55%, #1D4CA8 100%);
  color: #FFFFFF;
}
.b2b-sek-cagri-baslik {
  margin: 0 0 12px;
  font-size: clamp(1.5rem, 3vw, 2.1rem);
  font-weight: 800; letter-spacing: -.015em;
}
.b2b-sek-cagri-yazi { margin: 0 0 26px; max-width: 640px; line-height: 1.7; color: rgba(255, 255, 255, .82); }
.b2b-sek-cagri-satir { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
/* .b2b-buton--cam'in margin-top:32px'i yanindaki butonu gerer
   (2-cms tuzak 6) — sifirlaniyor. */
.b2b-sek-cagri-satir .b2b-buton--cam { margin-top: 0; }

/* ---------- 8. DUYARLI ---------- */

@media (max-width: 1024px) {
  .b2b-sek-vaka--medyali .b2b-sek-vaka-govde { grid-template-columns: 1fr; }
  .b2b-sek-medya { border-right: 0; border-bottom: 1px solid rgba(255, 255, 255, .7); }
}
@media (max-width: 720px) {
  .b2b-sek-akis { grid-template-columns: 1fr; gap: 8px; }
  .b2b-sek-akis-ok { transform: rotate(90deg); margin: 0 auto; height: 20px; }
  .b2b-sek-sonuc { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .b2b-sek-tepe { padding: 150px 0 40px; }
  .b2b-sek-ic { padding: 0 18px; }
  .b2b-sek-liste { padding: 8px 0 52px; }
  .b2b-sek-bolum { padding: 16px 0 46px; }
  .b2b-sek-bolum--ust { padding-top: 40px; }
  .b2b-sek-vaka-ic { padding: 24px 20px 26px; }
  .b2b-sek-cagri { padding: 48px 0; }
  .b2b-sek::before { width: 420px; height: 420px; left: -180px; }
  .b2b-sek::after { width: 420px; height: 420px; right: -180px; }
}

@media (prefers-reduced-motion: reduce) {
  .b2b-sek-kart, .b2b-sek-modul, .b2b-sek-diger a { transition: none; }
}

/* ---------- 9. DIZINDE GRUP BASLIKLARI (2026-09-07, 15 sektor) ---------- */
.b2b-sek-grup-ad {
  margin: 34px 0 14px;
  font-size: .74rem;
  font-weight: 800;
  letter-spacing: .13em;
  text-transform: uppercase;
  color: #8FA3C4;
}
.b2b-sek-grup-ad:first-child { margin-top: 8px; }