/* =========================
   GALLERY SECTION
   Full-screen section + end divider
========================= */

.gallery-section{
  min-height: 100svh;            /* طول الشاشة بالكامل */
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 0;                    /* بدون مارجن/بادنج */
}

/* ===== Section title ===== */
.gallery-title{
  text-align: center;
  font-family: Poppins, Cairo, system-ui, sans-serif;
  font-weight: 800;
  letter-spacing: .5px;
  font-size: clamp(26px, 3vw, 42px);
  color: rgba(246,251,255,.92);
  margin-bottom: 18px;
  text-shadow: 0 14px 40px rgba(0,0,0,.35);
}

/* =========================
   TICKER CARD
========================= */

.gallery-ticker{
  position: relative;
  border-radius: 22px;
  border: 1px solid rgba(120, 210, 255, .14);
  background: linear-gradient(
    180deg,
    rgba(6, 30, 40, .42),
    rgba(2, 12, 18, .22)
  );
  box-shadow: 0 18px 45px rgba(0,0,0,.28);
  overflow: hidden;
  max-width: 1200px;
  margin: 0 auto;
}

/* ===== Track wrapper ===== */
.gallery-trackWrap{
  position: relative;
  overflow: hidden;
  padding: 16px 0;
}

/* Edge fade (يمين / شمال) */
.gallery-trackWrap::before,
.gallery-trackWrap::after{
  content:"";
  position:absolute;
  top:0;
  bottom:0;
  width: 120px;
  pointer-events:none;
  z-index: 2;
}

.gallery-trackWrap::before{
  left:0;
  background: linear-gradient(
    90deg,
    rgba(2,10,16,.95),
    transparent
  );
}

.gallery-trackWrap::after{
  right:0;
  background: linear-gradient(
    270deg,
    rgba(2,10,16,.95),
    transparent
  );
}

/* ===== Track ===== */
.gallery-track{
  display: flex;
  align-items: center;
  gap: 34px;
  width: max-content;
  will-change: transform;
  padding: 0 24px;
}

/* ===== Item ===== */
.gallery-item{
  flex: 0 0 auto;
  height: 64px;
  min-width: 150px;
  display: grid;
  place-items: center;
}

.gallery-item img{
  height: 42px;
  width: auto;
  max-width: 200px;
  object-fit: contain;

  opacity: .65;
  filter:
    grayscale(.15)
    brightness(.95)
    contrast(1.05)
    drop-shadow(0 12px 20px rgba(0,0,0,.35));

  pointer-events: none;
  user-select: none;
  transition: opacity .25s ease, filter .25s ease, transform .25s ease;
}

/* Hover اختياري */
@media (hover:hover){
  .gallery-item:hover img{
    opacity: .95;
    filter:
      grayscale(0)
      brightness(1.08)
      contrast(1.1)
      drop-shadow(0 18px 30px rgba(0,0,0,.4));
    transform: scale(1.05);
  }
}

/* =========================
   END DIVIDER (appears at scroll bottom)
========================= */

.gallery-section::after{
  content:"";
  position:absolute;
  left:50%;
  bottom:0;
  transform:translateX(-50%);
  width:100vw;
  height:1px;
  background: linear-gradient(
    90deg,
    rgba(50,214,255,0),
    rgba(50,214,255,.9),
    rgba(50,214,255,0)
  );
  pointer-events:none;
  z-index:5;
}

.gallery-section::before{
  content:"";
  position:absolute;
  left:50%;
  bottom:-6px;
  transform:translateX(-50%);
  width:100vw;
  height:12px;
  background: radial-gradient(
    60% 100% at 50% 50%,
    rgba(50,214,255,.18),
    rgba(50,214,255,0) 70%
  );
  filter: blur(2px);
  opacity:.9;
  pointer-events:none;
  z-index:4;
}

/* =========================
   Responsive
========================= */

@media (max-width: 980px){
  .gallery-track{ gap: 22px; }
  .gallery-item{ min-width: 130px; height: 56px; }
  .gallery-item img{ height: 36px; }
}

@media (max-width: 520px){
  .gallery-item{ min-width: 110px; }
  .gallery-item img{ height: 32px; }
}