/* =========================================================
   Özsal Teknik — Hero altı, tam genişlik marka logosu şeridi
   itfirm-child / assets/css/ozsal-brands-strip.css

   - Başlıksız, sade, premium bir "carousel" şeridi.
   - Arka plan beyaz; her logo kendi beyaz çerçeveli kartında.
   - Masaüstünde fare ile, mobilde parmakla sağa/sola sürüklenir.
   - Boşta iken çok hafif otomatik akış vardır (mouse/parmak
     değince veya üzerine gelince otomatik akış durur, sürükleme
     her zaman serbesttir).
   - Kartlar asla alt alta düşmez (flex-wrap: nowrap), yalnızca
     yatayda kayar.
   ========================================================= */

/* Ebeveyn içerik kapsayıcısının max-width'inden bağımsız olarak
   şeridin tam ekran genişliğinde (full-bleed) görünmesini sağlar. */
body{ overflow-x:hidden; }

.oz-brands-strip{
  position:relative;
  left:50%;
  right:50%;
  margin-left:-50vw;
  margin-right:-50vw;
  width:100vw;
  background:#fff;
  padding:38px 0 40px;
  overflow:hidden;
  isolation:isolate;
}

.oz-brands-track{
  position:relative;
  width:100%;
  overflow:hidden;
  cursor:grab;
  touch-action:pan-y;
  outline:none;
}
.oz-brands-track.is-dragging{ cursor:grabbing; }
.oz-brands-track.is-dragging .oz-brand-card{ transition:none; }

.oz-brands-track-inner{
  display:flex;
  align-items:center;
  flex-wrap:nowrap;
  gap:18px;
  width:max-content;
  padding:4px clamp(20px,6vw,64px);
  will-change:transform;
  transform:translate3d(0,0,0);
  user-select:none;
  -webkit-user-select:none;
}
.oz-brands-track-inner img{
  -webkit-user-drag:none;
  user-drag:none;
  pointer-events:none;
  draggable:false;
}

/* ---------- Marka kartı ---------- */
.oz-brand-card{
  flex:0 0 auto;
  display:flex;
  align-items:center;
  justify-content:center;
  width:clamp(150px,17vw,196px);
  height:104px;
  padding:0 28px;
  background:#fff;
  border:1px solid rgba(16,24,32,.08);
  border-radius:18px;
  box-shadow:0 10px 28px -20px rgba(16,24,32,.28), 0 1px 0 rgba(16,24,32,.02);
  transition:transform .35s cubic-bezier(.22,.9,.28,1), box-shadow .35s ease, border-color .35s ease;
}
.oz-brand-card:hover{
  transform:translateY(-5px);
  border-color:rgba(252,56,31,.28);
  box-shadow:0 20px 40px -18px rgba(16,24,32,.32);
}
.oz-brand-card img{
  max-width:100%;
  max-height:38px;
  width:auto;
  height:auto;
  object-fit:contain;
  display:block;
  transition:transform .35s cubic-bezier(.22,.9,.28,1);
}
.oz-brand-card:hover img{ transform:scale(1.06); }

/* ---------- Kenar solması (şeridin akışına premium bir bitiş verir) ---------- */
.oz-brands-strip::before,
.oz-brands-strip::after{
  content:"";
  position:absolute;
  top:0; bottom:0;
  width:clamp(28px,7vw,120px);
  z-index:2;
  pointer-events:none;
}
.oz-brands-strip::before{
  left:0;
  background:linear-gradient(90deg, #fff 0%, rgba(255,255,255,0) 100%);
}
.oz-brands-strip::after{
  right:0;
  background:linear-gradient(270deg, #fff 0%, rgba(255,255,255,0) 100%);
}

/* ---------- Mobil ---------- */
@media (max-width:760px){
  .oz-brands-strip{ padding:26px 0 28px; }
  .oz-brands-track-inner{ gap:12px; padding:2px clamp(16px,5vw,28px); }
  .oz-brand-card{
    width:132px;
    height:84px;
    padding:0 18px;
    border-radius:14px;
  }
  .oz-brand-card img{ max-height:28px; }
  .oz-brands-strip::before,
  .oz-brands-strip::after{ width:22px; }
}

/* ---------- Hareket azaltma ---------- */
@media (prefers-reduced-motion:reduce){
  .oz-brand-card{ transition:none; }
  .oz-brand-card:hover{ transform:none; }
  .oz-brand-card:hover img{ transform:none; }
}