.protected-segment-stack {
  display: block;
  width: 100%;
}

.protected-segment-stack > img {
  display: block;
  width: 100%;
  height: auto;
  margin: 0;
}

.portfolio-protection-host {
  position: relative !important;
}

.portfolio-protection-layer {
  position: absolute;
  z-index: 6;
  overflow: hidden;
  pointer-events: none;
  contain: strict;
  user-select: none;
  -webkit-user-select: none;
}

.portfolio-protection-mark {
  position: absolute;
  left: var(--mark-x);
  top: var(--mark-y);
  color: rgba(255, 255, 255, .27);
  font-family: Outfit, "Segoe UI", sans-serif;
  font-size: clamp(9px, 1.05vw, 14px);
  font-weight: 500;
  line-height: 1;
  letter-spacing: .025em;
  white-space: nowrap;
  text-shadow: 0 1px 2px rgba(0, 0, 0, .25);
  transform: translate3d(-50%, -50%, 0);
  animation: portfolio-watermark-drift 16s ease-in-out infinite alternate;
  animation-delay: var(--mark-delay);
}

.portfolio-protection-mark:nth-child(2n) {
  animation-direction: alternate-reverse;
}

img,
video {
  -webkit-user-drag: none;
}

@keyframes portfolio-watermark-drift {
  from { transform: translate3d(calc(-50% - 4px), calc(-50% - 2px), 0); opacity: .78; }
  to { transform: translate3d(calc(-50% + 4px), calc(-50% + 2px), 0); opacity: 1; }
}

@media (max-width: 560px) {
  .portfolio-protection-mark { font-size: 9px; }
  .portfolio-protection-mark:nth-child(n + 6) { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .portfolio-protection-mark { animation: none; }
}
