<div class="container">
  <img src="https://picsum.photos/id/193/800/800" alt="castle" style="transform-origin:50% 50%">
</div>
<div class="container">
  <img src="https://picsum.photos/id/193/800/800" alt="castle" style="transform-origin:70% 40%">
</div>
<div class="container">
  <img src="https://picsum.photos/id/193/800/800" alt="castle" style="transform-origin:20% 20%">
</div>

.container {
  display: inline-grid;
  outline: 2px solid green;
  overflow: hidden;
}
img {
  width: 200px;
  transform: scale(1.5);
}

.container:hover {
  overflow: visible;
  z-index: 2;
}

body {
  background: pink;
  margin: 0;
  height: 100vh;
  display: grid;
  grid-auto-flow: column;
  grid-gap:20px;
  place-content: center;
  overflow: hidden;
}