/* ==========================================================================
   MARQUEE (KAYAN ŞERİT) BİLEŞENİ
   ========================================================================== */

.marquee-container {
  width: 100%;
  max-width: var(--container-max-width);
  margin: 0 auto;
  overflow: hidden;
  padding: var(--marquee-padding-y-desktop, 64px) 0;
  background-color: var(--bg-page);
  position: relative;
  user-select: none;
  pointer-events: none;
  
  /* Sol ve sağ kenarda 80px yumuşak fade maskesi */
  -webkit-mask-image: linear-gradient(to right, transparent 0px, black 80px, black calc(100% - 80px), transparent 100%);
  mask-image: linear-gradient(to right, transparent 0px, black 80px, black calc(100% - 80px), transparent 100%);
}

.marquee-track {
  display: flex;
  width: max-content;
  will-change: transform;
}

.marquee-group {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  animation: marqueeLoop 38s linear infinite;
}

.marquee-item {
  display: flex;
  align-items: center;
  flex-shrink: 0;
}

.marquee-text {
  font-family: var(--font-family);
  font-size: var(--font-size-marquee-desktop);
  font-weight: 300;
  font-style: italic;
  color: var(--color-text-muted);
  white-space: nowrap;
  letter-spacing: -0.01em;
  padding: 0 var(--marquee-gap-desktop);
  line-height: 1.1;
}

.marquee-star {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: var(--star-size-marquee-desktop);
  height: var(--star-size-marquee-desktop);
  flex-shrink: 0;
  user-select: none;
}

.marquee-star path {
  fill: var(--color-primary, #0033ff);
}

@keyframes marqueeLoop {
  0% {
    transform: translate3d(0, 0, 0);
  }
  100% {
    transform: translate3d(-100%, 0, 0);
  }
}

/* Tablet Uyumu */
@media (max-width: 1199px) and (min-width: 810px) {
  .marquee-text {
    font-size: var(--font-size-marquee-tablet);
    padding: 0 var(--marquee-gap-tablet);
  }

  .marquee-star {
    width: var(--star-size-marquee-tablet);
    height: var(--star-size-marquee-tablet);
  }
  
  .marquee-container {
    padding: var(--marquee-padding-y-tablet, 48px) 0;
    -webkit-mask-image: linear-gradient(to right, transparent 0px, black 60px, black calc(100% - 60px), transparent 100%);
    mask-image: linear-gradient(to right, transparent 0px, black 60px, black calc(100% - 60px), transparent 100%);
  }
}

/* Mobil Uyumu */
@media (max-width: 809px) {
  .marquee-text {
    font-size: var(--font-size-marquee-mobile);
    padding: 0 var(--marquee-gap-mobile);
    letter-spacing: 0;
  }

  .marquee-star {
    width: var(--star-size-marquee-mobile);
    height: var(--star-size-marquee-mobile);
  }

  .marquee-container {
    padding: var(--marquee-padding-y-mobile, 32px) 0;
    -webkit-mask-image: linear-gradient(to right, transparent 0px, black 28px, black calc(100% - 28px), transparent 100%);
    mask-image: linear-gradient(to right, transparent 0px, black 28px, black calc(100% - 28px), transparent 100%);
  }
}
