.text-container h2 {
  margin-bottom: 8px;
}
.text-container .project-meta {
  font-size: clamp(12px, 1vw, 14px);
  line-height: 1.6;
  text-align: left;
  margin-bottom: clamp(16px, 2vh, 22px);
}
.text-container .interaction-hint {
  margin-top: 1.8em;
  font-size: clamp(14px, 1.2vw, 16px);
  line-height: 1.8;
  color: #888;
  text-align: left;
}
.giraffe-installation {
  position: relative;
  width: 100%;
  aspect-ratio: 1905 / 1071;
  overflow: visible;
  cursor: pointer;
  pointer-events: none;
  user-select: none;
  -webkit-user-select: none;
  -webkit-touch-callout: none;
  touch-action: pan-y pinch-zoom;
}
.giraffe-installation:focus-visible {
  outline: 1px solid #999;
  outline-offset: 4px;
}
.giraffe-artwork {
  position: absolute;
  top: 0;
  left: 50%;
  height: 100%;
  aspect-ratio: 1113 / 898;
  transform: translateX(-50%);
  isolation: isolate;
}
.giraffe-screen {
  position: absolute;
  left: 46.945193%;
  top: 50%;
  width: 35.489668%;
  aspect-ratio: 5 / 3;
  transform: translate(-50%, -50%);
  overflow: hidden;
  background: #f6f6f6;
}
.giraffe-screen .giraffe-motion {
  position: absolute;
  left: 0;
  top: 0;
  width: 200%;
  height: 100%;
  max-width: none;
  display: block;
  box-shadow: none;
  pointer-events: none;
  transform: translateX(0);
  transition: none;
}
.giraffe-installation.is-raining .giraffe-motion {
  transform: translateX(-50%);
}
.giraffe-installation .giraffe-frame {
  position: absolute;
  left: -26.504942%;
  top: -3.452116%;
  width: 150.224618%;
  height: 104.788419%;
  max-width: none;
  box-shadow: none;
  pointer-events: none;
  z-index: 2;
  filter: brightness(113%) contrast(91%) saturate(10%) sepia(0%) hue-rotate(0deg);
  opacity: 1;
}
.giraffe-hit-area {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 3;
}
.giraffe-hit-area path {
  fill: transparent;
  pointer-events: fill;
  cursor: pointer;
}
.giraffe-installation.is-laid-out .giraffe-artwork {
  left: var(--cloud-left);
  top: var(--cloud-top);
  width: var(--cloud-width);
  height: var(--cloud-height);
  transform: none;
}
