.dynamic-div {
    margin-top:20px;
    width: 100%;
    border-radius: 6px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    overflow: visible;
}


.dynamic-div img {
    order: 0;
    cursor: pointer;
    border-radius: 6px;
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    object-fit: contain;
    transition: transform 0.2s ease;
}

.dynamic-div img:hover {
    transform: scale(1.03);
}

.big-block {
  width: 100%;
  aspect-ratio: 16 / 9; 
  display: flex;
  flex-wrap: wrap;
}

/* Responsive reorder at 980px or less */
@media (max-width: 980px) {
  .big-block {
    aspect-ratio: unset;
    width: 90%;
    margin-left: auto;  /* add */
    margin-right: auto; /* add */
  }

  .dynamic-div {
    flex-wrap: wrap;
    height: auto; /* changed from 50% to auto */
  }

  .dynamic-div img:nth-child(1),
  .dynamic-div img:nth-child(3) {
    order: 1; /* first and third image side by side */
    flex: 48%;
    max-width: 48%;
    height: auto;
    margin-bottom: 0; /* reset if any */
  }

  .dynamic-div img:nth-child(2) {
    order: 2; /* second image below */
    flex-basis: 100%;
    max-width: 100%;
    margin-top: 1rem;
    height: auto;
  }
}
