.portada { position: relative; min-height: 100vh; overflow: hidden; }
.portada-nombre {
  position: relative; z-index: 2; width: fit-content;
  font-size: clamp(80px, 18vw, 260px); font-weight: 900; letter-spacing: -0.04em; line-height: .85;
}
.portada-sub { position: relative; z-index: 2; margin-top: 16px; font-size: 13px; }

.collage { position: absolute; inset: 0; z-index: 1; }
.objeto { position: absolute; cursor: pointer; transition: transform .2s ease-out; }
.objeto img, .objeto .sin-imagen {
  transform: rotate(var(--giro));
  transition: transform .35s cubic-bezier(.2,.8,.2,1), filter .35s;
  filter: drop-shadow(0 4px 6px rgba(0,0,0,.15));
}
.objeto:hover { z-index: 5; }
.objeto:hover img, .objeto:hover .sin-imagen {
  transform: rotate(0deg) scale(1.1);
  filter: drop-shadow(0 16px 18px rgba(0,0,0,.25));
}
.objeto .etiqueta {
  position: absolute; left: 50%; bottom: -28px; transform: translateX(-50%);
  font-family: var(--f-mono); font-size: 12px; white-space: nowrap;
  background: var(--texto); color: var(--fondo); padding: 3px 8px;
  opacity: 0; transition: opacity .25s;
}
.objeto:hover .etiqueta { opacity: 1; }
.objeto .sin-imagen {
  display: block; padding: 18px 22px; border: 1px dashed currentColor;
  background: var(--fondo); font-family: var(--f-mono); font-size: 13px;
}