/* ==== Çift Sıra – Zıt Yön ==== */
:root{
  --bhs-h: 240px;      /* tek kart yüksekliği */
  --bhs-gap: 14px;     /* kart aralığı       */
  --bhs-speed: 28s;    /* üst sıra hızı      */
  --bhs-speed-2: 34s;  /* alt sıra hızı      */
  --bhs-opacity: .85;  /* kart opacity       */
  --bhs-padY: 14px;    /* yukarı-aşağı iç boşluk */
}

.below-hero-slider{
  position: relative;
  overflow: hidden;
  background: #000;
  padding: var(--bhs-padY) 0;
  line-height: 0; font-size: 0;
}

/* Kenarlarda fade maskesi (dikiş algısını siler) */
.below-hero-slider::before,
.below-hero-slider::after{
  content:""; position:absolute; top:0; bottom:0; width:9%;
  pointer-events:none; z-index:3;
}
.below-hero-slider::before{
  left:0; background:linear-gradient(90deg, #000 0%, rgba(0,0,0,0) 100%);
}
.below-hero-slider::after{
  right:0; background:linear-gradient(270deg, #000 0%, rgba(0,0,0,0) 100%);
}

/* İki sıra: .bhs-track üstte, JS ile eklenecek .bhs-track--rev altta */
.bhs-track,
.bhs-track--rev{
  display:flex; width:max-content;
  will-change: transform;
  gap: var(--bhs-gap);
}
.bhs-track{            /* ÜST SIRA */
  animation: bhsScroll var(--bhs-speed) linear infinite;
  margin-bottom: var(--bhs-gap);
}
.bhs-track--rev{       /* ALT SIRA (ters) */
  animation: bhsScrollRev var(--bhs-speed-2) linear infinite;
}

/* Kartlar */
.bhs-group{ display:inline-flex; gap: var(--bhs-gap); flex:0 0 auto; }
.bhs-group + .bhs-group{ margin-left: var(--bhs-gap); }

.below-hero-slider img{
  height: var(--bhs-h); width:auto; display:block;
  border-radius: 20px; 
  border: 1px solid rgba(255,255,255,.15);
  box-shadow: 0 10px 24px rgba(0,0,0,.25);
  object-fit: cover;
  opacity: var(--bhs-opacity);
  transition: opacity .2s ease, transform .25s ease, box-shadow .25s ease;
}
.below-hero-slider img:hover{
  opacity: 1; transform: translateY(-2px) scale(1.03);
  box-shadow: 0 16px 36px rgba(0,0,0,.35);
}

/* Dikişsiz akış */
@keyframes bhsScroll   { from{transform:translateX(0);}     to{transform:translateX(-50%);} }
@keyframes bhsScrollRev{ from{transform:translateX(-50%);}  to{transform:translateX(0);} }

/* Responsive yükseklik */
@media (max-width: 1024px){ :root{ --bhs-h: 200px; } }
@media (max-width: 640px) { :root{ --bhs-h: 150px; } }

/* Hareketi kapatmak isteyen kullanıcılar için */
@media (prefers-reduced-motion: reduce){
  .bhs-track, .bhs-track--rev{ animation:none; }
}
:root{
  --bhs-h: 260px;     /* kart yüksekliği */
  --bhs-gap: 14px;    /* kart aralığı   */
  --bhs-speed: 28s;   /* küçük = hızlı  */
}

/* ——— Premium üretim bandı ——— */
.below-hero-slider.prod-band{
  background:#0b0f16;
  padding:18px 0 22px;
  position:relative;
  overflow:hidden;
  isolation:isolate;
  line-height:0; font-size:0;
}

/* Üst/alt fade */
.below-hero-slider.prod-band::before,
.below-hero-slider.prod-band::after{
  content:""; position:absolute; left:0; right:0; height:18px; z-index:3; pointer-events:none;
}
.below-hero-slider.prod-band::before{
  top:0;  background:linear-gradient(180deg, rgba(0,0,0,.45), rgba(0,0,0,0));
}
.below-hero-slider.prod-band::after{
  bottom:0; background:linear-gradient(0deg, rgba(0,0,0,.45), rgba(0,0,0,0));
}

/* Sonsuz akış parçası */
.bhs-track{
  display:flex;
  width:max-content;
  will-change: transform;
  animation: bhsScroll var(--bhs-speed) linear infinite;
}
@keyframes bhsScroll{ from{transform:translateX(0)} to{transform:translateX(-50%)} }

.bhs-group{
  display:inline-flex; gap: var(--bhs-gap); flex:0 0 auto;
}
.bhs-group + .bhs-group{ margin-left: var(--bhs-gap); } /* grup dikişi açıklığı */

/* Kartlar */
.bhs-card{ position:relative; display:block; }
.bhs-card img{
  height: var(--bhs-h); width:auto; display:block;
  border-radius:18px; object-fit:cover;
  opacity:.88; filter:saturate(.98) contrast(1.02);
  border:1px solid rgba(255,255,255,.10);
  box-shadow:0 12px 28px rgba(0,0,0,.35);
  transition: transform .25s ease, opacity .25s ease, box-shadow .25s ease;
}
.bhs-card:hover img{
  opacity:1; transform:translateY(-2px) scale(1.02);
  box-shadow:0 18px 40px rgba(0,0,0,.45);
}

/* Hover başlık */
.bhs-cap{
  position:absolute; left:10px; right:10px; bottom:10px;
  padding:8px 10px; border-radius:12px;
  background:rgba(0,0,0,.40);
  border:1px solid rgba(255,255,255,.18);
  color:#fff; font:600 13px/1.2 "Exo 2", system-ui, -apple-system, "Segoe UI", Roboto, Arial, "Noto Sans", sans-serif;
  opacity:0; transform:translateY(6px);
  transition:opacity .22s ease, transform .22s ease;
  pointer-events:none;
}
.bhs-card:hover .bhs-cap{ opacity:1; transform:translateY(0); }

/* Baseline boşluğu ve kenar maskesi için güvenli ayarlar */
.below-hero-slider.prod-band img{ vertical-align: top; }
.below-hero-slider.prod-band + *{ border-top:0 !important; }

/* Responsive */
@media (max-width: 1280px){ :root{ --bhs-h: 220px; } }
@media (max-width: 768px) { :root{ --bhs-h: 160px; --bhs-gap: 10px; } }
@media (prefers-reduced-motion: reduce){ .bhs-track{ animation:none; } }

/* ——— Lightbox ——— */
.pb-lightbox{
  position:fixed; inset:0; background:rgba(0,0,0,.82);
  display:none; align-items:center; justify-content:center;
  z-index:4000; padding:18px;
}
.pb-lightbox.open{ display:flex; }
.pb-lightbox img{
  max-width:min(92vw, 1600px); max-height:90vh; border-radius:16px;
  box-shadow:0 24px 64px rgba(0,0,0,.6);
}
.pb-lightbox .pb-close, .pb-lightbox .pb-prev, .pb-lightbox .pb-next{
  position:absolute; width:44px; height:44px; border-radius:12px;
  display:grid; place-items:center; border:1px solid rgba(255,255,255,.28);
  background:rgba(255,255,255,.08); color:#fff; font-weight:800; cursor:pointer;
  backdrop-filter: blur(6px);
}
.pb-lightbox .pb-close{ top:18px; right:18px; }
.pb-lightbox .pb-prev { top:50%; left:18px;  transform:translateY(-50%); }
.pb-lightbox .pb-next { top:50%; right:18px; transform:translateY(-50%); }
.pb-lightbox .pb-close:hover,
.pb-lightbox .pb-prev:hover,
.pb-lightbox .pb-next:hover{ background:rgba(255,255,255,.16); }
