/* ROBOWALL - Sürekli kayan, odaktaki görseli renklendiren uygulama galerisi */
.projects-section{overflow:hidden;background:radial-gradient(circle at 85% 18%,rgba(0,174,255,.10),transparent 30%),radial-gradient(circle at 12% 78%,rgba(0,92,255,.08),transparent 34%),rgba(1,6,13,.55)}
.section-heading-row{display:flex;align-items:flex-end;justify-content:space-between;gap:32px}
.project-marquee{width:100%;overflow:hidden;margin-top:48px;padding:12px 0 34px;position:relative}
.project-marquee::before,.project-marquee::after{content:"";position:absolute;z-index:5;top:0;bottom:0;width:min(9vw,130px);pointer-events:none}
.project-marquee::before{left:0;background:linear-gradient(90deg,#020812,transparent)}
.project-marquee::after{right:0;background:linear-gradient(270deg,#020812,transparent)}
.project-marquee-track{display:flex;width:max-content;gap:18px;will-change:transform;transform:translate3d(0,0,0)}
.project-slide{position:relative;flex:0 0 clamp(260px,27vw,430px);height:clamp(300px,34vw,500px);overflow:hidden;border-radius:4px;background:#0a111a;border:1px solid rgba(255,255,255,.08);box-shadow:0 18px 50px rgba(0,0,0,.25);transform:scale(.965);transition:transform .55s ease,border-color .55s ease,box-shadow .55s ease}
.project-slide img{display:block;width:100%;height:100%;object-fit:contain;filter:grayscale(1) saturate(.2) brightness(.64);opacity:.86;transform:scale(1.035);transition:filter .75s ease,opacity .75s ease,transform .9s ease}
.project-slide::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.04) 45%,rgba(0,5,12,.74) 100%);transition:opacity .6s ease}
.project-slide span{position:absolute;z-index:2;left:22px;bottom:20px;color:#fff;font-size:clamp(16px,1.35vw,21px);font-weight:800;letter-spacing:.02em;text-shadow:0 2px 18px rgba(0,0,0,.75);opacity:.72;transition:opacity .55s ease,transform .55s ease}
.project-slide.is-active{transform:scale(1);border-color:rgba(64,190,255,.42);box-shadow:0 22px 65px rgba(0,0,0,.38),0 0 30px rgba(0,145,255,.10)}
.project-slide.is-active img{filter:grayscale(0) saturate(1.06) brightness(1);opacity:1;transform:scale(1)}
.project-slide.is-active::after{opacity:.68}
.project-slide.is-active span{opacity:1;transform:translateY(-2px)}
@media(max-width:700px){.section-heading-row{align-items:flex-start;flex-direction:column}.project-marquee{margin-top:34px}.project-marquee-track{gap:12px}.project-slide{flex-basis:72vw;height:92vw;max-height:460px}.project-marquee::before,.project-marquee::after{width:32px}.project-slide span{left:17px;bottom:16px}}


/* Görsel henüz eklenmediyse kart görünür kalsın. */
.project-slide.is-placeholder{
  background:
    radial-gradient(circle at 72% 22%,rgba(0,178,255,.18),transparent 35%),
    linear-gradient(145deg,#07111e,#030914 68%,#06182b);
}
.project-slide.is-placeholder img{opacity:0;visibility:hidden}
.project-slide.is-placeholder::before{
  content:"GÖRSEL HAZIRLANIYOR";
  position:absolute;
  z-index:1;
  left:22px;
  top:22px;
  color:rgba(91,203,255,.72);
  font-size:10px;
  font-weight:800;
  letter-spacing:.18em;
}
.project-slide.is-placeholder::after{
  background:
    linear-gradient(180deg,rgba(0,0,0,0) 38%,rgba(0,5,12,.76) 100%),
    repeating-linear-gradient(135deg,rgba(255,255,255,.018) 0 1px,transparent 1px 18px);
}
.project-slide.is-placeholder.is-active{
  border-color:rgba(64,190,255,.34);
  box-shadow:0 22px 65px rgba(0,0,0,.38),0 0 34px rgba(0,145,255,.12)
}


/* Hover davranisi: kart hareket etmeye devam ederken uzerine gelinen gorsel aninda renklenir. */
.project-slide:hover{
  transform:scale(1);
  border-color:rgba(64,190,255,.55);
  box-shadow:0 22px 65px rgba(0,0,0,.38),0 0 34px rgba(0,145,255,.16);
  z-index:3;
}
.project-slide:hover img{
  filter:grayscale(0) saturate(1.08) brightness(1) !important;
  opacity:1 !important;
  transform:scale(1) !important;
  transition:filter .12s ease,opacity .12s ease,transform .22s ease;
}
.project-slide:hover::after{
  opacity:.58;
}
.project-slide:hover span{
  opacity:1;
  transform:translateY(-2px);
}

/* Hover, merkezdeki aktif karttan daha onceliklidir; marquee asla durmaz. */
.project-marquee:hover .project-marquee-track{
  animation-play-state:running !important;
}
