/* Shop The Look — sahne + hotspot konteyneri */

.cc_jynh5jpp_GQfuaS2ZCZ .stl {
  width: 100%;
}

.cc_jynh5jpp_GQfuaS2ZCZ .stl-inner {
  max-width: var(--page-max, 1400px);
  margin: var(--section-gap, 40px) auto 0;
  padding: 0 16px;
}

.cc_jynh5jpp_GQfuaS2ZCZ .stl-head {
  margin-bottom: 20px;
}

.cc_jynh5jpp_GQfuaS2ZCZ .stl-title {
  margin: 0;
  font-size: 18px;
  font-weight: 700;
  line-height: 1;
  color: var(--ts-ink, #1a1a1a);
}

.cc_jynh5jpp_GQfuaS2ZCZ .stl-subtitle {
  margin: 6px 0 0;
  font-size: 13px;
  color: var(--ts-muted, #717171);
}

/* overflow: hidden YOK: balonun kenarı/gölgesi sahne sınırında kesiliyordu (balon JS ile zaten
   sahnenin içinde tutulur). Köşe yuvarlaklığı görsellerde (border-radius: inherit). */
.cc_jynh5jpp_GQfuaS2ZCZ .stl-scene {
  position: relative;
  width: 100%;
  border-radius: 16px;
  background: #e5e5e5;
  aspect-ratio: var(--asp-m, 3/4);
}

.cc_jynh5jpp_GQfuaS2ZCZ .stl-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: inherit;
}

.cc_jynh5jpp_GQfuaS2ZCZ .stl-img.desktop {
  display: none;
}

@media (min-width: 640px) {
  .cc_jynh5jpp_GQfuaS2ZCZ .stl-inner {
    padding: 0 20px;
  }
}

@media (min-width: 768px) {
  .cc_jynh5jpp_GQfuaS2ZCZ .stl-scene {
    aspect-ratio: var(--asp-d, 16/9);
  }
  .cc_jynh5jpp_GQfuaS2ZCZ .stl-img.mobile {
    display: none;
  }
  .cc_jynh5jpp_GQfuaS2ZCZ .stl-img.desktop {
    display: block;
  }
}

@media (min-width: 1024px) {
  .cc_jynh5jpp_GQfuaS2ZCZ .stl-inner {
  }
  .cc_jynh5jpp_GQfuaS2ZCZ .stl-title {
    font-size: 24px;
  }
}

/* sync 05:53:04 */

.cc_jynh5jpp_GQfuaS2ZCZ .stl-spot { position: absolute; }
/* Büyütülmüş dokunma alanı DÜĞMENİN kendi sözde öğesi: .stl-spot::after düğmenin üstüne
   biniyor ve tıklama/hover'ı yutuyordu (noktalar tıklanmıyordu). */
.cc_jynh5jpp_GQfuaS2ZCZ .stl-dot::after { content: ""; position: absolute; inset: -8px; border-radius: 50%; }/* sync11 05:15:49 */

/* sync 07:14:21 */

/* sync 07:20:00 */

/* sync 07:22:56 */

/* sync 07:44:13 */

/* sync 07:48:12 */

/* sync 08:29:24 */

/* ── Çoklu kombin (looks) — masaüstü ızgara (≤3 sütun), mobil yana kaydırmalı şerit ── */
.cc_jynh5jpp_GQfuaS2ZCZ .stl-looks {
  display: grid;
  grid-template-columns: repeat(var(--look-cols, 3), minmax(0, 1fr));
  gap: 12px;
}

.cc_jynh5jpp_GQfuaS2ZCZ .stl-looks .stl-scene {
  border-radius: 0;
  aspect-ratio: var(--look-asp, 3/4);
  background: #efece8;
}

.cc_jynh5jpp_GQfuaS2ZCZ .stl-looks-dots {
  display: none;
}

.cc_jynh5jpp_GQfuaS2ZCZ .stl-looks-wrap {
  position: relative;
}
.cc_jynh5jpp_GQfuaS2ZCZ .stl-arrow {
  display: none;
}

/* Masaüstü/tablet şerit (3'ten fazla kombin): 3,5 kart görünür, ok düğmeleriyle kaydırılır. */
@media (min-width: 768px) {
  .cc_jynh5jpp_GQfuaS2ZCZ .stl-looks-wrap.is-rail .stl-looks {
    display: flex;
    gap: 12px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    overscroll-behavior-x: contain;
  }
  .cc_jynh5jpp_GQfuaS2ZCZ .stl-looks-wrap.is-rail .stl-looks::-webkit-scrollbar {
    display: none;
  }
  .cc_jynh5jpp_GQfuaS2ZCZ .stl-looks-wrap.is-rail .stl-look {
    flex: 0 0 calc((100% - 3 * 12px) / 3.5);
    scroll-snap-align: start;
  }
  .cc_jynh5jpp_GQfuaS2ZCZ .stl-looks-wrap.is-rail .stl-arrow {
    position: absolute;
    top: calc(50% - 22px);
    z-index: 3;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.92);
    color: var(--ts-ink, #1a1a1a);
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.14);
    cursor: pointer;
    transition: transform 0.15s ease, opacity 0.15s ease;
  }
  .cc_jynh5jpp_GQfuaS2ZCZ .stl-looks-wrap.is-rail .stl-arrow:hover {
    transform: scale(1.06);
  }
  .cc_jynh5jpp_GQfuaS2ZCZ .stl-looks-wrap.is-rail .stl-arrow[hidden] {
    display: none;
  }
  .cc_jynh5jpp_GQfuaS2ZCZ .stl-arrow.prev {
    left: 10px;
  }
  .cc_jynh5jpp_GQfuaS2ZCZ .stl-arrow.next {
    right: 10px;
  }
}
@media (min-width: 768px) and (max-width: 1023px) {
  .cc_jynh5jpp_GQfuaS2ZCZ .stl-looks-wrap.is-rail .stl-look {
    flex-basis: calc((100% - 2 * 12px) / 2.5);
  }
}

@media (max-width: 767px) {
  .cc_jynh5jpp_GQfuaS2ZCZ .stl-looks {
    display: flex;
    gap: 10px;
    margin: 0 -16px;
    padding: 0 16px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-padding: 0 16px;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }
  .cc_jynh5jpp_GQfuaS2ZCZ .stl-looks::-webkit-scrollbar {
    display: none;
  }
  .cc_jynh5jpp_GQfuaS2ZCZ .stl-looks .stl-look {
    flex: 0 0 82%;
    scroll-snap-align: start;
  }
  .cc_jynh5jpp_GQfuaS2ZCZ .stl-looks .stl-scene {
    aspect-ratio: var(--look-asp, 3/4);
  }
  .cc_jynh5jpp_GQfuaS2ZCZ .stl-looks-dots {
    display: flex;
    justify-content: center;
    gap: 6px;
    margin-top: 14px;
  }
  .cc_jynh5jpp_GQfuaS2ZCZ .stl-looks-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #d4d4d4;
    transition: background 0.2s, width 0.2s;
  }
  .cc_jynh5jpp_GQfuaS2ZCZ .stl-looks-dot.on {
    width: 18px;
    border-radius: 3px;
    background: var(--ts-ink, #1a1a1a);
  }
}

/* sync 09:26:21 */

/* sync 09:44:11 */

/* sync 10:23:00 */

/* sync 12:56:23 */
/* sync 11:25:53 */

/* sync 03:06:26 */
/* sync 03:08:20 */
/* sync 03:26:07 */
/* sync 18:20:37 */
/* sync 19:22:22 */
