.st-img-reg-container {
    position: relative;
    overflow: hidden;
     width: 100%;
    margin-top: 30px;
    height: auto;
  }
  
  /* The image fills its container and maintains aspect ratio */
  .st-reg-img{
    width: 100%;
    aspect-ratio: 3/1.2 ;
    object-fit: cover;
    transition: transform 0.5s ease-in-out, padding 0.5s ease-in-out;
    padding: 0; /* Ensure no padding initially */
  }
  
  /* Zoom effect on smaller screens */
  @media (max-width: 950px) {
    .st-reg-img {
        transform: scale(1.1); /* Increase the zoom level */
        padding: 1%; /* Adds padding for a more dynamic effect */
    }
    .st-img-reg-container {
 
        margin-top: 90px;
 
      }
  }
  
  @media screen and (max-width:830px){
     .st-reg-img{
      height: 100%;  
     }
  }

  /* @media screen and (max-width: 767px) {
    .st-reg-img{
      }
} */