/* 04 — PROJECTS STRIP (V3). Section Y 2342.84..3101 (h 759.26). */
.s-projects { height: 762px; }

.s-projects .proj-bg {
  position: absolute;
  left: 3px; top: 0;
  width: 1912px; height: 759.26px;
  border-radius: 40px;
  background: var(--c-lav);
}

.s-projects .proj-strip {
  position: absolute;
  left: 3px; top: 115px;   /* strip y2458 - 2343 */
  width: 1912px; height: 533px;
  overflow: hidden;
  cursor: grab;
}
.s-projects .proj-strip.is-dragging { cursor: grabbing; }

.s-projects .proj-track {
  display: flex;
  gap: 16px;
  padding: 0 16px;
  width: max-content;
  height: 100%;
  will-change: transform;
}

.s-projects .proj-card {
  position: relative;
  flex: none;
  width: 405px; height: 533px;
  margin: 0;
  border-radius: 16px;
  overflow: hidden;
  background: #cfd4e2;
}
.s-projects .proj-card > img {
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
  pointer-events: none;
  user-select: none;
  -webkit-user-drag: none;
}

/* glass tags (app slide) */
.s-projects .glass-tag {
  position: absolute;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  height: 33.2px;
  padding: 0 14px;
  border-radius: 10.9px;
  border: 0.44px solid #aeaeae;
  background: linear-gradient(3.4deg, rgba(255, 255, 255, 0.1) 0%, rgba(243, 243, 243, 0.06) 100%);
  -webkit-backdrop-filter: blur(21.8px);
  backdrop-filter: blur(21.8px);
  font-family: "GeneralSans";
  font-weight: 400;
  font-size: 11.46px;
  color: #fff;
  white-space: nowrap;
}
.s-projects .glass-tag img { width: 23px; height: 23px; }
.s-projects .glass-tag--1 { left: 20px;  top: 266px; }
.s-projects .glass-tag--2 { left: 194px; top: 191px; }
.s-projects .glass-tag--3 { left: 229px; top: 333px; }

/* glass stat cards (SKYN slide) */
.s-projects .glass-stat {
  position: absolute;
  width: 174.4px;
  border-radius: 19.3px;
  border: 0.49px solid #aeaeae;
  background: linear-gradient(20deg, rgba(255, 255, 255, 0.1) 0%, rgba(243, 243, 243, 0.06) 100%);
  -webkit-backdrop-filter: blur(3px);
  backdrop-filter: blur(3px);
  overflow: hidden;
  font-family: "GeneralSans";
  color: #fff;
}
.s-projects .glass-stat--a { left: 72px;  top: 200px; height: 223.8px; }
.s-projects .glass-stat--b { left: 160px; top: 100px; height: 216.4px; }
.s-projects .stat-head {
  position: absolute;
  left: 12px; right: 12px; top: 12px;
  display: flex;
  justify-content: space-between;
  font-size: 9.7px;
  letter-spacing: -0.097px;
  text-transform: uppercase;
  color: #aeaeae;
}
.s-projects .stat-droplet {
  position: absolute;
  left: 12px; top: 12px;
  width: 13.3px; height: 13.3px;
}
.s-projects .glass-stat--a .stat-head { left: 40px; }
.s-projects .stat-note {
  position: absolute;
  left: 14px; right: 8px; bottom: 12px;
  font-size: 9.7px;
  line-height: 13.6px;
  letter-spacing: -0.097px;
}
.s-projects .stat-ring {
  position: absolute;
  left: 50%; top: 47%;
  transform: translate(-50%, -50%);
  width: 120px; height: 120px;
}
.s-projects .stat-ring img { width: 100%; height: 100%; display: block; }
.s-projects .stat-ring b {
  position: absolute;
  left: 50%; top: 56%;
  transform: translate(-50%, -50%);
  font-weight: 400;
  font-size: 24px;
}



/* design-intended crops for the zoomed campaign shots */
.s-projects .proj-card img[src*="slide-work2-dragged"] { object-position: 55% 50%; }
.s-projects .proj-card img[src*="slide-lelo-dot"] { object-position: 65% 45%; }

/* lookbook collage pages (landscape, white ground): show the WHOLE page
   instead of a blown-up crop — the white letterbox reads as the page */
.s-projects .proj-card img[src*="slide-work2.jpg"],
.s-projects .proj-card img[src*="slide-work3.jpg"],
.s-projects .proj-card img[src*="slide-work8.jpg"] {
  object-fit: contain;
  object-position: 50% 50%;
  background: #fff;
}

/* video slides */
.s-projects .proj-card--video { background: #0d0d0d; }
.s-projects .proj-card--video video {
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
  pointer-events: none;
}