/* =========================================================
   b2bNet — moduller.css
   3. bolum: modul anlatimi + istatistik seridi + cagri.
   main.css'ten SONRA yuklenir.
   ========================================================= */

.b2b-moduller{
  background:#F6F9FF;
  padding:110px 20px 130px;
}
@media (min-width:768px){ .b2b-moduller{ padding:150px 20px 170px; } }

.b2b-moduller-ic{ max-width:var(--b2b-genislik); margin-inline:auto; }

/* ---------------------------------------------------------
   1. BOLUM BASLIGI
   --------------------------------------------------------- */
.b2b-bolum-tepe{ max-width:760px; margin:0 auto 72px; text-align:center; }

.b2b-bolum-baslik{
  margin:26px 0 0;
  font-size:clamp(1.9rem, 3.8vw, 3rem);
  font-weight:700; line-height:1.2; letter-spacing:-.028em;
  color:var(--b2b-lacivert);
}
.b2b-bolum-yazi{
  max-width:560px; margin:20px auto 0;
  font-size:clamp(1rem,1.35vw,1.12rem);
  line-height:1.7; color:var(--b2b-gri);
}

/* ---------------------------------------------------------
   2. MODUL IZGARASI
   Referanstaki gibi ince ayirici cizgilerle bolunur.
   --------------------------------------------------------- */
.b2b-modul-izgara{
  display:grid; grid-template-columns:1fr;
  border-top:1px solid #E2EAF7;
}
@media (min-width:900px){
  .b2b-modul-izgara{ grid-template-columns:1fr 1fr; }
}

.b2b-modul-hucre{
  display:block;
  padding:44px 8px 52px;
  border-bottom:1px solid #E2EAF7;
  color:inherit;
  transition:background-color .3s ease;
}
.b2b-modul-hucre:hover{ background:rgba(255,255,255,.6); }
@media (min-width:900px){
  .b2b-modul-hucre{ padding:52px 44px 60px; }
  /* sag sutundaki hucrelere dikey ayirici */
  .b2b-modul-hucre:nth-child(2n){ border-left:1px solid #E2EAF7; }
}

.b2b-modul-etiket{
  display:inline-flex; align-items:center; gap:8px;
  font-size:13.5px; font-weight:600; color:var(--b2b-mavi-600);
}
.b2b-modul-etiket svg{ width:16px; height:16px; }

.b2b-modul-baslik{
  display:flex; align-items:center; gap:10px;
  margin:14px 0 0;
  font-size:clamp(1.25rem,1.9vw,1.55rem);
  font-weight:700; letter-spacing:-.02em; color:var(--b2b-lacivert);
}

/* baslik altinda soldan saga acilan cizgi */
.b2b-modul-baslik-yazi{
  position:relative;
  display:inline-block;
  padding-bottom:3px;
}
.b2b-modul-baslik-yazi::after{
  content:''; position:absolute;
  left:0; right:0; bottom:0; height:2px;
  background:var(--b2b-mavi-600);
  border-radius:2px;
  transform:scaleX(0); transform-origin:left center;
  transition:transform .5s var(--b2b-gecis);
}
.b2b-modul-hucre:hover .b2b-modul-baslik-yazi::after,
.b2b-modul-hucre:focus-visible .b2b-modul-baslik-yazi::after{ transform:scaleX(1); }

/* uzerine gelince gorsel sahne hafifce yakinlasir */
.b2b-modul-sahne{ transition:transform .45s var(--b2b-gecis), border-color .3s ease; }
.b2b-modul-hucre:hover .b2b-modul-sahne{
  transform:translateY(-4px);
  border-color:#D8E5FB;
}
.b2b-modul-baslik svg{
  width:18px; height:18px; flex-shrink:0;
  color:#9DB2D4; transition:transform .25s var(--b2b-gecis), color .25s ease;
}
.b2b-modul-hucre:hover .b2b-modul-baslik svg{ transform:translateX(5px); color:var(--b2b-mavi-600); }

.b2b-modul-aciklama{
  max-width:400px; margin:12px 0 0;
  font-size:15.5px; line-height:1.65; color:var(--b2b-gri);
}

/* ---------------------------------------------------------
   3. HUCRE ICI GORSELLER
   --------------------------------------------------------- */
.b2b-modul-sahne{
  position:relative;
  margin-top:34px; height:230px;
  border-radius:18px; overflow:hidden;
  background:
    radial-gradient(120% 90% at 50% 0%, rgba(91,148,250,.10) 0%, rgba(91,148,250,0) 62%),
    linear-gradient(180deg,#FFFFFF 0%,#F7FAFF 100%);
  border:1px solid #EAF0FA;
}

/* icerideki yuzen bilgi kartlari */
.b2b-yuzen{
  position:absolute;
  background:#fff; border:1px solid #E9EFFA;
  border-radius:14px; padding:13px 15px;
  box-shadow:0 16px 34px -18px rgba(11,38,102,.42);
}
.b2b-yuzen-tepe{
  display:flex; align-items:center; gap:7px;
  font-size:12.5px; font-weight:600; color:#7A8DAE;
}
.b2b-yuzen-tepe svg{ width:14px; height:14px; }
.b2b-yuzen-deger{
  margin-top:6px;
  font-size:22px; font-weight:700; letter-spacing:-.02em;
  color:var(--b2b-lacivert);
}
.b2b-yuzen-not{ font-size:12px; color:#93A5C2; margin-top:2px; }

/* sahne icindeki yumusak yukari-asagi salinim */
.b2b-suzul{ animation:b2bSuzul 5.5s ease-in-out infinite; }
.b2b-suzul--gec{ animation-delay:-2.4s; }
@keyframes b2bSuzul{
  0%,100%{ transform:translateY(0) }
  50%    { transform:translateY(-9px) }
}

/* sahte tablo satirlari */
.b2b-mini-satir{
  height:7px; border-radius:999px; background:#EDF2FC; margin-bottom:8px;
}
.b2b-mini-satir--vurgu{ background:#C9DCFB; }

/* eslesme rozeti */
.b2b-eslesme{
  display:inline-flex; align-items:center; gap:6px;
  padding:5px 10px; border-radius:999px;
  background:#E9F7EF; color:#137A45;
  font-size:12px; font-weight:700;
}

/* ---------------------------------------------------------
   4. DIGER MODULLER SERIDI
   --------------------------------------------------------- */
.b2b-diger{
  margin-top:56px; text-align:center;
}
.b2b-diger-not{
  font-size:14px; font-weight:600; letter-spacing:.02em;
  color:#8FA3C4; margin:0 0 20px;
}
.b2b-diger-liste{
  display:flex; flex-wrap:wrap; justify-content:center; gap:10px;
  list-style:none; margin:0; padding:0;
}
.b2b-diger-liste li{
  padding:10px 17px; border-radius:999px;
  background:#fff; border:1px solid #E2EAF7;
  font-size:14px; font-weight:600; color:#445980;
  transition:transform .2s ease, border-color .2s ease, color .2s ease;
}
.b2b-diger-liste li:hover{
  transform:translateY(-2px);
  border-color:var(--b2b-mavi-300);
  color:var(--b2b-mavi-700);
}
.b2b-diger-liste li:last-child{
  background:var(--b2b-mavi-100); border-color:transparent;
  color:var(--b2b-mavi-700);
}

/* ---------------------------------------------------------
   5. ALT CAGRI
   --------------------------------------------------------- */
.b2b-moduller-cagri{ margin-top:64px; text-align:center; }
.b2b-buton--vurgu{
  min-height:54px; padding:0 34px; font-size:16px; font-weight:700;
  background:linear-gradient(135deg,var(--b2b-mavi-500),var(--b2b-mavi-700));
  color:#fff; box-shadow:0 14px 32px -12px rgba(29,78,216,.85);
}
.b2b-buton--vurgu:hover{
  transform:translateY(-2px);
  box-shadow:0 20px 40px -14px rgba(29,78,216,.95);
}

@media (prefers-reduced-motion: reduce){
  .b2b-suzul{ animation:none; }
}