/* ==================================================================
   MARKA LOGO SERIDI (views/partials/logo-marquee.ejs)
   Karamel Noir: beyaz tek renk logolar, 1px ince cizgili hucreler,
   iki sira ters yonde yavas akis, kenarlarda solma. Uzerine gelinen
   sira durur, diger logolar kisilir. Azaltilmis harekette sabit izgara.
   ================================================================== */
.kd-lm {
  position: relative;
  padding-block: var(--sp-lg, clamp(4rem, 7.5vw, 6rem));
}
.kd-lm__head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 1rem;
  padding-inline: var(--kr-pad);
  margin-bottom: clamp(1.4rem, 2.6vw, 2.2rem);
}
.kd-lm__head .kr-micro { margin: 0; display: block; }
.kd-lm__count {
  font-family: var(--f-mono);
  font-size: max(0.72rem, 11px);
  font-weight: 500;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--n-600);
  white-space: nowrap;
}
.kd-lm__count b { font-weight: 500; color: var(--accent); }

.kd-lm__rows { border-top: 1px solid var(--hair); }
.kd-lm__row {
  position: relative;
  overflow: hidden;
  border-bottom: 1px solid var(--hair);
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 9%, #000 91%, transparent 100%);
  mask-image: linear-gradient(90deg, transparent 0, #000 9%, #000 91%, transparent 100%);
}
.kd-lm__track {
  display: flex;
  width: max-content;
  animation: kdLmAkis var(--lm-dur, 60s) linear infinite;
  will-change: transform;
}
.kd-lm__row[data-dir="sag"] .kd-lm__track { animation-direction: reverse; }
.kd-lm__row:hover .kd-lm__track,
.kd-lm__row:focus-within .kd-lm__track { animation-play-state: paused; }
@keyframes kdLmAkis { to { transform: translate3d(-50%, 0, 0); } }

.kd-lm__group {
  display: flex;
  align-items: stretch;
  flex-shrink: 0;
  margin: 0;
  padding: 0;
  list-style: none;
}
.kd-lm__item {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  height: clamp(5.5rem, 8vw, 6.75rem);
  padding-inline: clamp(1.75rem, 3.2vw, 2.9rem);
  border-right: 1px solid var(--hair-soft);
}
.kd-lm__logo {
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0.68;
  color: var(--n-900);
  text-decoration: none;
  transition: opacity 0.45s var(--ap-spring, cubic-bezier(0.32, 0.72, 0, 1));
}
.kd-lm__logo img {
  display: block;
  width: auto;
  max-width: none;
  height: var(--lh, 32px);
  /* yuklenen ham logo da beyaz tek renge doner; islenmis logolar zaten beyaz */
  filter: brightness(0) invert(1);
  -webkit-user-drag: none;
  user-select: none;
}
.kd-lm__name {
  font-family: var(--f-sans);
  font-size: 1.15rem;
  font-weight: 600;
  letter-spacing: -0.01em;
  white-space: nowrap;
}
@media (hover: hover) {
  .kd-lm__row:hover .kd-lm__logo { opacity: 0.34; }
  .kd-lm__row:hover .kd-lm__logo:hover { opacity: 1; }
}
.kd-lm__logo:focus-visible { opacity: 1; outline-offset: 6px; }

@media (max-width: 640px) {
  .kd-lm__item { height: 4.6rem; padding-inline: 1.35rem; }
  .kd-lm__logo img { height: calc(var(--lh, 32px) * 0.78); }
  .kd-lm__row {
    -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent 100%);
    mask-image: linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent 100%);
  }
}

@media (prefers-reduced-motion: reduce) {
  .kd-lm__row { -webkit-mask-image: none; mask-image: none; }
  .kd-lm__track { animation: none; width: auto; }
  .kd-lm__group { flex-wrap: wrap; justify-content: center; }
  .kd-lm__group[aria-hidden="true"],
  .kd-lm__item[aria-hidden="true"] { display: none; }
}

/* Optik dengeleme: ince cizgili logolar alan esitlemesine ragmen soluk kalir
   (kaplama orani dusuk: tek cizgi yazi, oval cerceve). Hafif buyutme. */
.kd-lm__item[data-marka="twenty-two-project"] img,
.kd-lm__item[data-marka="lumina-design-london"] img { height: calc(var(--lh) * 1.22); }
.kd-lm__item[data-marka="pelin-saray"] img,
.kd-lm__item[data-marka="olympos-lodge"] img,
.kd-lm__item[data-marka="the-ivy-co-studio"] img { height: calc(var(--lh) * 1.2); }
@media (max-width: 640px) {
  .kd-lm__item[data-marka="twenty-two-project"] img,
  .kd-lm__item[data-marka="lumina-design-london"] img,
  .kd-lm__item[data-marka="pelin-saray"] img,
  .kd-lm__item[data-marka="olympos-lodge"] img,
  .kd-lm__item[data-marka="the-ivy-co-studio"] img { height: calc(var(--lh) * 0.94); }
}

/* ==================================================================
   MARKA LOGOSU KUTULARI (marka sayfasi + proje sayfasi)
   Logolar beyaz tek renk; eski beyaz kare kart Noir'da beyaz uzerine
   beyaz kaliyordu. Koyu, 1px cizgili, logonun oranina gore genisleyen kutu.
   ================================================================== */
.krp-brand__logo {
  width: auto;
  max-width: min(340px, 82vw);
  height: clamp(4.25rem, 7vw, 5.5rem);
  aspect-ratio: auto;
  padding: clamp(0.85rem, 1.4vw, 1.15rem) clamp(1.1rem, 2vw, 1.6rem);
  background: var(--n-100);
  border: 1px solid var(--hair);
  border-radius: 1rem;
  box-shadow: none;
  transform: none;
  display: flex;
  align-items: center;
  justify-content: center;
}
.krp-brand__logo img {
  height: 100%;
  width: auto;
  max-width: 100%;
  object-fit: contain;
  filter: brightness(0) invert(1);
}
.krp-project__brand-logo {
  width: auto;
  min-width: 7rem;
  max-width: 15rem;
  height: 5.5rem;
  padding: 1rem 1.3rem;
  background: var(--n-100);
  border: 1px solid var(--hair);
}
.krp-project__brand-logo img {
  height: 100%;
  width: auto;
  max-width: 100%;
  object-fit: contain;
  filter: brightness(0) invert(1);
}
.krp-project__brandchip img { filter: brightness(0) invert(1); max-height: 18px; }
@media (max-width: 640px) {
  .krp-brand__logo { height: 3.75rem; transform: none; }
}