.container {
   display: flex;
   flex-wrap: wrap;
   gap: 20px;
   padding: 20px;
   justify-content: center;
   background-color: #f5f5f5;
}

.div-1, .div-2, .div-3 {
   flex: 1 1 200px;
   min-width: 200px;
   max-width: 300px;
   height: 150px;
   color: white;
   font-size: 20px;
   font-weight: bold;
   display: flex;
   align-items: center;
   justify-content: center;
   border-radius: 10px;
   box-shadow: 0 4px 10px rgba(0,0,0,0.1);
   transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.div-1 { background: rgb(255, 0, 0); }
.div-2 { background: rgb(185, 255, 10); }
.div-3 { background: rgb(27, 234, 9); color: #333; }

.div-1:hover,
.div-2:hover,
.div-3:hover {
   transform: translateY(-5px);
   box-shadow: 0 8px 20px rgba(0,0,0,0.15);
}