/* =========================================================
   b2bNet — giris.css
   Sadece ana sayfaya (giris) ait stiller
   ========================================================= */

/* ---------------------------------------------------------
   1. KAHRAMAN BOLUMU (1. section)
   --------------------------------------------------------- */
.b2b-kahraman{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  min-height:100svh;
  padding-top:120px;
  background:linear-gradient(180deg,
    #2563EB 0%,
    #2A6BEE 20%,
    #3B82F6 40%,
    #6BA3FA 60%,
    #A9C9FF 76%,
    #DCE9FF 89%,
    #F6F9FF 100%);
}
@media (min-width:640px){ .b2b-kahraman{ padding-top:140px; } }

/* ince izgara dokusu — en altta */
.b2b-izgara{
  position:absolute; inset:0; z-index:0; pointer-events:none;
  background-image:
    linear-gradient(to right, rgba(255,255,255,.06) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(255,255,255,.06) 1px, transparent 1px);
  background-size:78px 78px;
  -webkit-mask-image:linear-gradient(180deg, rgba(0,0,0,.9), rgba(0,0,0,.2) 72%, transparent);
  mask-image:linear-gradient(180deg, rgba(0,0,0,.9), rgba(0,0,0,.2) 72%, transparent);
}

/* metin arkasi yumusak koyulastirma — tuvalin ALTINDA durur,
   boylece noktalari soldurmaz ama yazi kontrastini yukseltir */
.b2b-metin-halkasi{
  position:absolute; z-index:1; pointer-events:none;
  left:50%; top:46%; transform:translate(-50%,-50%);
  width:min(1200px,130vw); height:min(720px,80vh);
  background:radial-gradient(ellipse at center,
    rgba(9,32,86,.40) 0%,
    rgba(9,32,86,.24) 40%,
    rgba(9,32,86,.08) 62%,
    transparent 76%);
}

/* kurenin arkasindaki yumusak atmosfer isigi
   (giris.js icindeki MERKEZ_Y degeri ile ayni yerde durmali) */
.b2b-kahraman::after{
  content:''; position:absolute; z-index:1; pointer-events:none;
  left:50%; top:86%; transform:translate(-50%,-50%);
  width:min(92vw, 940px); aspect-ratio:1; border-radius:999px;
  background:radial-gradient(circle,
    rgba(255,255,255,.20) 0%,
    rgba(255,255,255,.08) 42%,
    rgba(255,255,255,0) 66%);
}

/* pixel dunya tuvali */
.b2b-dunya{
  position:absolute; inset:0; z-index:2;
  width:100%; height:100%;
  pointer-events:none;
}

/* ---------------------------------------------------------
   2. KAHRAMAN METNI
   --------------------------------------------------------- */
.b2b-kahraman-metin{
  position:relative; z-index:10;
  width:100%; max-width:940px;
  /* margin-block:auto -> bolum icinde dikeyde ortalanir,
     boylece yazi kurenin ust kismiyla ust uste biner */
  margin:auto; padding-inline:20px;
  text-align:center;
}

.b2b-kahraman-baslik{
  margin:0;
  font-size:clamp(1.95rem, 4.4vw, 3.4rem);
  font-weight:800; line-height:1.14; letter-spacing:-.028em;
  color:#fff;
  text-shadow:0 2px 30px rgba(9,32,86,.28);
}

.b2b-kahraman-yazi{
  max-width:640px; margin:24px auto 0;
  font-size:clamp(1.02rem,1.5vw,1.2rem);
  font-weight:500; line-height:1.65; color:#fff;
  text-shadow:0 1px 20px rgba(9,32,86,.35);
}

.b2b-kahraman-butonlar{
  display:flex; flex-direction:column; align-items:center;
  justify-content:center; gap:12px; margin-top:36px;
}
@media (min-width:640px){ .b2b-kahraman-butonlar{ flex-direction:row; } }

/* girise sirali acilis */
.b2b-acil{ opacity:0; transform:translateY(20px); animation:b2bAcil .85s var(--b2b-gecis) forwards; }
@keyframes b2bAcil{ to{ opacity:1; transform:translateY(0) } }
.b2b-acil--1{ animation-delay:.05s }
.b2b-acil--2{ animation-delay:.18s }
.b2b-acil--3{ animation-delay:.31s }
.b2b-acil--4{ animation-delay:.46s }

/* ---------------------------------------------------------
   3. KAHRAMAN ALTI MARKA SERIDI
   --------------------------------------------------------- */
.b2b-marka-alan{ position:relative; z-index:10; margin-top:64px; padding-bottom:52px; }
.b2b-marka-not{
  margin:0 0 26px; text-align:center;
  font-size:14.5px; font-weight:500; color:rgba(18,48,110,.66);
}

/* ---------------------------------------------------------
   4. 2. BOLUM — NEDEN b2bNet
   --------------------------------------------------------- */
.b2b-bolum-neden{
  background:linear-gradient(180deg,#F6F9FF 0%,#FFFFFF 55%,#F6F9FF 100%);
  padding:120px 20px 140px;
}
@media (min-width:768px){ .b2b-bolum-neden{ padding:160px 20px 180px; } }

.b2b-neden-ic{ max-width:960px; margin-inline:auto; text-align:center; }


.b2b-neden-baslik{
  margin:28px 0 0;
  font-size:clamp(1.75rem, 3.6vw, 2.9rem);
  font-weight:700; line-height:1.28; letter-spacing:-.025em;
  color:var(--b2b-lacivert);
}

.b2b-neden-yazi{
  max-width:620px; margin:28px auto 0;
  font-size:clamp(1rem,1.4vw,1.15rem);
  line-height:1.7; color:var(--b2b-gri);
}