/* =========================================================
   b2bNet — moduller-sayfa.css
   /moduller — tum modullerin tek sayfada anlatimi.
   main.css'ten SONRA yuklenir.

   NOT: ana sayfadaki modul bolumunun dosyasi moduller.css;
   sinif adlari cakismasin diye burada b2b-mdl- oneki kullanildi.

   Yaklasim: sayfa koyu bir tepeyle aciliyor (urunun tamami
   burada, ek ucret yok mesaji), sonra acik zeminde uc ana
   modul, ardindan modul dizini, sonra tekrar koyu bir bantta
   rakiplerde olmayan yerler. Koyu-acik-koyu ritmi sayfanin
   uzunlugunu tasiyor.
   ========================================================= */

.b2b-mdl{
  --b2b-mdl-cizgi:#E4EBF7;
  --b2b-mdl-solgun:#8296B5;
  --b2b-mdl-zemin:#F6F9FF;
  background:var(--b2b-mdl-zemin);
}


/* =========================================================
   1. TEPE — KOYU
   ========================================================= */
.b2b-mdl-tepe{
  position:relative; overflow:hidden;
  background:
    radial-gradient(120% 85% at 12% 0%, rgba(70,130,255,.30) 0%, rgba(70,130,255,0) 58%),
    linear-gradient(160deg,#12327A 0%,#0B2050 52%,#071531 100%);
  color:#fff;
}
.b2b-mdl-tepe-ic{
  position:relative;
  max-width:1160px; margin-inline:auto;
  padding:calc(84px + 62px) 20px 64px;
}
@media (min-width:768px){
  .b2b-mdl-tepe-ic{ padding:calc(84px + 96px) 20px 84px; }
}
@media (max-width:767px){
  .b2b-mdl-tepe-ic{ padding-top:calc(104px + 56px); }
}

.b2b-mdl-rozet{
  display:inline-flex; align-items:center; gap:9px;
  padding:7px 15px 7px 11px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.2);
  background:rgba(255,255,255,.09);
  font-size:12.5px; font-weight:600; letter-spacing:.01em;
  color:#DCE8FF;
}
.b2b-mdl-rozet svg{ width:15px; height:15px; color:#8FB6FF; }

.b2b-mdl-baslik{
  max-width:17ch; margin:22px 0 0;
  font-size:clamp(2.1rem,5.2vw,3.6rem);
  font-weight:700; line-height:1.06; letter-spacing:-.04em;
}
.b2b-mdl-baslik em{
  font-style:normal;
  background:linear-gradient(100deg,#8FB6FF,#CFE0FF);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.b2b-mdl-giris{
  max-width:56ch; margin:20px 0 0;
  font-size:clamp(1rem,1.4vw,1.13rem);
  line-height:1.7; color:rgba(220,232,255,.86);
}

.b2b-mdl-eylem{
  display:flex; flex-wrap:wrap; align-items:center; gap:12px;
  margin-top:30px;
}
.b2b-mdl-eylem-not{
  margin:14px 0 0;
  font-size:13px; color:rgba(198,216,250,.72);
}

/* ---- hero gorseli / videosu ----
   Icerik Nurkan tarafindan konulacak; olcu simdiden sabit ki
   dosya gelince duzen oynamasin. */
.b2b-mdl-sahne{
  position:relative;
  margin-top:44px;
  aspect-ratio:16/9;
  border-radius:22px; overflow:hidden;
  border:1px solid rgba(255,255,255,.16);
  background:
    radial-gradient(110% 80% at 50% 0%, rgba(120,170,255,.18), rgba(120,170,255,0) 70%),
    rgba(255,255,255,.05);
  box-shadow:0 50px 90px -60px rgba(0,0,0,.9);
}
.b2b-mdl-sahne > img,
.b2b-mdl-sahne > video,
.b2b-mdl-sahne > iframe{
  display:block; width:100%; height:100%;
  object-fit:cover; border:0;
}
/* gorsel gelmeden once yerini tutan iz */
.b2b-mdl-sahne-bos{
  position:absolute; inset:0;
  display:flex; align-items:center; justify-content:center;
  gap:10px;
  font-size:13px; color:rgba(190,212,252,.5);
}
.b2b-mdl-sahne-bos svg{ width:18px; height:18px; }

/* koyu bantta sayilar */
.b2b-mdl-serit{
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr));
  gap:2px 0;
  margin-top:46px; padding-top:28px;
  border-top:1px solid rgba(255,255,255,.14);
}
@media (min-width:820px){ .b2b-mdl-serit{ grid-template-columns:repeat(4,minmax(0,1fr)); } }
.b2b-mdl-serit-deger{
  display:block;
  font-size:clamp(1.5rem,2.6vw,2rem);
  font-weight:700; letter-spacing:-.03em; color:#fff;
  font-variant-numeric:tabular-nums;
}
.b2b-mdl-serit-yazi{
  display:block; margin-top:5px;
  font-size:13px; line-height:1.5; color:rgba(198,216,250,.7);
}


/* =========================================================
   2. UC ANA MODUL — ACIK
   ========================================================= */
.b2b-mdl-ic{
  max-width:1160px; margin-inline:auto;
  padding:74px 20px 0;
}
@media (min-width:768px){ .b2b-mdl-ic{ padding-top:100px; } }

.b2b-mdl-bolum-ustluk{
  display:block;
  font-size:11.5px; font-weight:700; letter-spacing:.14em;
  text-transform:uppercase; color:var(--b2b-mavi-600);
}
.b2b-mdl-bolum-baslik{
  max-width:24ch; margin:14px 0 0;
  font-size:clamp(1.7rem,3.4vw,2.4rem);
  font-weight:700; line-height:1.14; letter-spacing:-.032em;
  color:var(--b2b-lacivert);
}
.b2b-mdl-bolum-yazi{
  max-width:60ch; margin:16px 0 0;
  font-size:clamp(.98rem,1.3vw,1.06rem);
  line-height:1.68; color:var(--b2b-gri);
}

.b2b-mdl-ana{
  display:grid; grid-template-columns:1fr; gap:18px;
  margin-top:40px;
}
@media (min-width:960px){
  .b2b-mdl-ana{ grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
}

.b2b-mdl-ana-kart{
  display:flex; flex-direction:column;
  padding:28px 26px 26px;
  border-radius:22px;
  background:#fff;
  border:1px solid var(--b2b-mdl-cizgi);
  transition:border-color .2s ease, box-shadow .25s ease, transform .2s ease;
}
.b2b-mdl-ana-kart:hover{
  border-color:var(--b2b-mavi-200);
  box-shadow:0 34px 60px -46px rgba(11,38,102,.6);
  transform:translateY(-3px);
}
.b2b-mdl-ana-ikon{
  display:flex; align-items:center; justify-content:center;
  width:46px; height:46px;
  border-radius:14px;
  background:#EDF3FF; color:var(--b2b-mavi-700);
}
.b2b-mdl-ana-ikon svg{ width:23px; height:23px; }
.b2b-mdl-ana-ad{
  margin:18px 0 0;
  font-size:1.3rem; font-weight:700; letter-spacing:-.024em;
  color:var(--b2b-lacivert);
}
.b2b-mdl-ana-yazi{
  margin:10px 0 0;
  font-size:15px; line-height:1.65; color:var(--b2b-gri);
}
.b2b-mdl-ana-liste{
  list-style:none; margin:20px 0 0; padding:0;
  border-top:1px solid var(--b2b-mdl-cizgi);
}
.b2b-mdl-ana-liste li{ border-bottom:1px solid var(--b2b-mdl-cizgi); }
.b2b-mdl-ana-liste a,
.b2b-mdl-ana-liste span{
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  padding:11px 2px;
  font-size:14.5px; font-weight:600; color:#42567B;
  transition:color .2s ease;
}
.b2b-mdl-ana-liste a:hover{ color:var(--b2b-mavi-700); }
.b2b-mdl-ana-liste svg{ width:15px; height:15px; color:#B7C6DE; flex-shrink:0; }
.b2b-mdl-ana-liste a:hover svg{ color:var(--b2b-mavi-600); }
.b2b-mdl-yakinda{
  font-size:10.5px; font-weight:700; letter-spacing:.08em;
  text-transform:uppercase; color:var(--b2b-mdl-solgun);
  white-space:nowrap;
}
.b2b-mdl-ana-alt{ margin-top:auto; padding-top:20px; }
.b2b-mdl-ana-bag{
  display:inline-flex; align-items:center; gap:7px;
  font-size:14px; font-weight:700; color:var(--b2b-mavi-700);
}
.b2b-mdl-ana-bag svg{ width:15px; height:15px; transition:transform .2s ease; }
.b2b-mdl-ana-kart:hover .b2b-mdl-ana-bag svg{ transform:translateX(4px); }


/* =========================================================
   3. MODUL DIZINI
   Menudeki her sey burada; kullanici tek ekranda gorsun.
   ========================================================= */
.b2b-mdl-dizin{
  display:grid; grid-template-columns:1fr;
  margin-top:40px;
  border-top:1px solid var(--b2b-mdl-cizgi);
}
@media (min-width:760px){ .b2b-mdl-dizin{ grid-template-columns:repeat(2,minmax(0,1fr)); column-gap:44px; } }
@media (min-width:1080px){ .b2b-mdl-dizin{ grid-template-columns:repeat(3,minmax(0,1fr)); column-gap:36px; } }

.b2b-mdl-grup{
  padding:24px 2px 22px;
  border-bottom:1px solid var(--b2b-mdl-cizgi);
}
.b2b-mdl-grup-bas{
  display:flex; align-items:center; gap:11px;
}
.b2b-mdl-grup-ikon{
  display:flex; align-items:center; justify-content:center;
  flex:0 0 auto; width:34px; height:34px;
  border-radius:11px; background:#fff;
  border:1px solid var(--b2b-mdl-cizgi);
  color:var(--b2b-mavi-700);
}
.b2b-mdl-grup-ikon svg{ width:17px; height:17px; }
.b2b-mdl-grup-ad{
  font-size:16px; font-weight:700; letter-spacing:-.016em;
  color:var(--b2b-lacivert);
}
.b2b-mdl-grup-ad a:hover{ color:var(--b2b-mavi-700); }
.b2b-mdl-grup-liste{
  list-style:none; margin:14px 0 0; padding:0 0 0 45px;
}
.b2b-mdl-grup-liste li{ margin-bottom:9px; }
.b2b-mdl-grup-liste li:last-child{ margin-bottom:0; }
.b2b-mdl-grup-liste a{
  display:inline-flex; align-items:center; gap:8px;
  font-size:14px; line-height:1.5; color:var(--b2b-gri);
  transition:color .2s ease;
}
.b2b-mdl-grup-liste a:hover{ color:var(--b2b-mavi-700); }
.b2b-mdl-grup-liste a::before{
  content:''; flex:0 0 auto;
  width:5px; height:5px; border-radius:999px; background:#C3D3EE;
  transition:background-color .2s ease;
}
.b2b-mdl-grup-liste a:hover::before{ background:var(--b2b-mavi-600); }


/* =========================================================
   4. AYIRAN YERLER — KOYU
   ========================================================= */
.b2b-mdl-fark{
  position:relative; overflow:hidden;
  margin-top:84px;
  background:
    radial-gradient(100% 80% at 85% 0%, rgba(70,130,255,.24) 0%, rgba(70,130,255,0) 60%),
    linear-gradient(165deg,#102B69 0%,#0B2050 45%,#071531 100%);
  background-color:#0B2050;
  color:#fff;
}
.b2b-mdl-fark-ic{
  max-width:1160px; margin-inline:auto;
  padding:74px 20px 80px;
}
@media (min-width:768px){ .b2b-mdl-fark-ic{ padding:100px 20px 108px; } }

.b2b-mdl-fark .b2b-mdl-bolum-ustluk{ color:#8FB6FF; }
.b2b-mdl-fark .b2b-mdl-bolum-baslik{ color:#fff; }
.b2b-mdl-fark .b2b-mdl-bolum-yazi{ color:rgba(214,228,255,.8); }

.b2b-mdl-fark-izgara{
  display:grid; grid-template-columns:1fr; gap:2px;
  margin-top:42px;
  border-radius:22px; overflow:hidden;
  background:rgba(255,255,255,.1);
}
@media (min-width:720px){ .b2b-mdl-fark-izgara{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (min-width:1060px){ .b2b-mdl-fark-izgara{ grid-template-columns:repeat(3,minmax(0,1fr)); } }

.b2b-mdl-fark-hucre{
  padding:28px 26px 30px;
  background:#0C2255;
  transition:background-color .25s ease;
}
.b2b-mdl-fark-hucre:hover{ background:#123071; }
.b2b-mdl-fark-ikon{
  display:flex; align-items:center; justify-content:center;
  width:42px; height:42px;
  border-radius:13px;
  background:rgba(143,182,255,.14);
  border:1px solid rgba(143,182,255,.22);
  color:#A9C6FF;
}
.b2b-mdl-fark-ikon svg{ width:21px; height:21px; }
.b2b-mdl-fark-ad{
  margin:17px 0 0;
  font-size:1.05rem; font-weight:700; letter-spacing:-.018em; color:#fff;
}
.b2b-mdl-fark-yazi{
  margin:9px 0 0;
  font-size:14.5px; line-height:1.65; color:rgba(206,222,252,.78);
}
.b2b-mdl-fark-alt{
  display:flex; flex-wrap:wrap; align-items:center; gap:12px;
  margin-top:34px;
}
.b2b-mdl-fark-alt .b2b-buton--cam{ margin-top:0; }


/* =========================================================
   5. UCRETSIZ VURGUSU + CAGRI
   ========================================================= */
.b2b-mdl-paket{
  max-width:1160px; margin-inline:auto;
  padding:74px 20px 0;
}
@media (min-width:768px){ .b2b-mdl-paket{ padding-top:100px; } }

.b2b-mdl-paket-kutu{
  display:grid; grid-template-columns:1fr; gap:26px;
  padding:32px 26px 34px;
  border-radius:24px;
  background:#fff;
  border:1px solid var(--b2b-mdl-cizgi);
}
@media (min-width:900px){
  .b2b-mdl-paket-kutu{
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    gap:44px; padding:44px 44px 46px; align-items:center;
  }
}
.b2b-mdl-paket-baslik{
  margin:0;
  font-size:clamp(1.5rem,2.8vw,2rem);
  font-weight:700; letter-spacing:-.03em; line-height:1.16;
  color:var(--b2b-lacivert);
}
.b2b-mdl-paket-yazi{
  margin:13px 0 0;
  font-size:15.5px; line-height:1.68; color:var(--b2b-gri);
}
.b2b-mdl-paket-liste{
  list-style:none; margin:0; padding:0;
}
.b2b-mdl-paket-liste li{
  display:grid; grid-template-columns:22px minmax(0,1fr);
  gap:11px; align-items:start;
  padding:10px 0;
  border-bottom:1px solid var(--b2b-mdl-cizgi);
  font-size:14.5px; line-height:1.55; color:#3A4C6E;
}
.b2b-mdl-paket-liste li:last-child{ border-bottom:0; }
.b2b-mdl-paket-liste svg{ width:22px; height:22px; color:var(--b2b-mavi-600); }

.b2b-mdl-cagri{
  max-width:1160px; margin-inline:auto;
  padding:52px 20px 100px;
}
@media (min-width:768px){ .b2b-mdl-cagri{ padding-bottom:130px; } }
.b2b-mdl-cagri-kutu{
  text-align:center;
  padding-top:38px;
  border-top:1px solid var(--b2b-mdl-cizgi);
}
.b2b-mdl-cagri-baslik{
  max-width:22ch; margin:0 auto;
  font-size:clamp(1.5rem,3vw,2.1rem);
  font-weight:700; letter-spacing:-.03em; line-height:1.16;
  color:var(--b2b-lacivert);
}
.b2b-mdl-cagri-yazi{
  max-width:52ch; margin:14px auto 0;
  font-size:15.5px; line-height:1.68; color:var(--b2b-gri);
}
.b2b-mdl-cagri-eylem{
  display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:12px;
  margin-top:26px;
}
.b2b-mdl-cagri-eylem .b2b-buton--cam{
  margin-top:0;
  background:#EEF4FF; color:var(--b2b-mavi-700);
  border:1px solid #DCE7FF;
}
.b2b-mdl-cagri-eylem .b2b-buton--cam:hover{
  background:#E2ECFF; border-color:var(--b2b-mavi-200);
}


/* =========================================================
   6. DUZELTMELER + FIYAT
   ========================================================= */

/* main.css'teki .b2b-buton--cam'in margin-top:32px'i flex
   satirini sisirip yanindaki butonu stretch ile geriyordu. */
.b2b-mdl-eylem .b2b-buton--cam{ margin-top:0; }

/* ---- tepe: metin solda, fiyat karti sagda ---- */
@media (min-width:1000px){
  .b2b-mdl-tepe-duzen{
    display:grid;
    grid-template-columns:minmax(0,1fr) 330px;
    gap:0 56px; align-items:start;
  }
}

.b2b-mdl-fiyat{
  margin-top:38px;
  padding:26px 24px 24px;
  border-radius:22px;
  border:1px solid rgba(255,255,255,.18);
  background:rgba(255,255,255,.07);
  -webkit-backdrop-filter:blur(14px);
  backdrop-filter:blur(14px);
}
@media (min-width:1000px){ .b2b-mdl-fiyat{ margin-top:6px; } }

.b2b-mdl-fiyat-ustluk{
  display:block;
  font-size:11.5px; font-weight:700; letter-spacing:.13em;
  text-transform:uppercase; color:#8FB6FF;
}
.b2b-mdl-fiyat-tutar{
  display:flex; align-items:baseline; gap:5px;
  margin:12px 0 0;
  color:#fff;
}
.b2b-mdl-fiyat-para{
  font-size:1.5rem; font-weight:700; line-height:1;
}
.b2b-mdl-fiyat-sayi{
  font-size:clamp(2.4rem,5vw,3.1rem);
  font-weight:700; letter-spacing:-.04em; line-height:1;
  font-variant-numeric:tabular-nums;
}
.b2b-mdl-fiyat-donem{
  margin-left:4px;
  font-size:14px; font-weight:600; color:rgba(198,216,250,.75);
}
.b2b-mdl-fiyat-yazi{
  margin:12px 0 0;
  font-size:13.5px; line-height:1.6; color:rgba(206,222,252,.8);
}
.b2b-mdl-fiyat-liste{
  list-style:none; margin:16px 0 0; padding:16px 0 0;
  border-top:1px solid rgba(255,255,255,.14);
}
.b2b-mdl-fiyat-liste li{
  display:grid; grid-template-columns:17px minmax(0,1fr);
  gap:9px; align-items:start;
  margin-bottom:9px;
  font-size:13.5px; line-height:1.5; color:rgba(214,228,255,.86);
}
.b2b-mdl-fiyat-liste li:last-child{ margin-bottom:0; }
.b2b-mdl-fiyat-liste svg{ width:17px; height:17px; color:#8FB6FF; }
.b2b-mdl-fiyat-bag{
  display:inline-flex; align-items:center; gap:7px;
  margin-top:18px;
  font-size:13.5px; font-weight:700; color:#BBD3FF;
}
.b2b-mdl-fiyat-bag svg{ width:14px; height:14px; transition:transform .2s ease; }
.b2b-mdl-fiyat-bag:hover svg{ transform:translateX(4px); }

/* ---- paket bolumundeki fiyat ---- */
.b2b-mdl-paket-fiyat{
  display:flex; align-items:baseline; gap:5px;
  margin:16px 0 0; color:var(--b2b-lacivert);
}
.b2b-mdl-paket-para{ font-size:1.25rem; font-weight:700; }
.b2b-mdl-paket-sayi{
  font-size:clamp(2rem,4vw,2.6rem);
  font-weight:700; letter-spacing:-.04em; line-height:1;
  font-variant-numeric:tabular-nums;
}
.b2b-mdl-paket-donem{
  margin-left:4px;
  font-size:14px; font-weight:600; color:var(--b2b-mdl-solgun);
}
.b2b-mdl-paket-bag{
  display:inline-flex; align-items:center; gap:7px;
  margin-top:16px;
  font-size:14px; font-weight:700; color:var(--b2b-mavi-700);
}
.b2b-mdl-paket-bag svg{ width:15px; height:15px; transition:transform .2s ease; }
.b2b-mdl-paket-bag:hover svg{ transform:translateX(4px); }