.transition-container { 
    display: flex;
    justify-content: center;
    width: 100%;
    align-items: center;
    z-index: 100;
    position: relative;
    } 
  

    /* .home-list {
      transition: transform 1s ease;
      display: flex;
      justify-content: center;
      padding-left: 2%;
      padding-right: 2%;
      padding-bottom: 2%;
      flex: 1;
      margin-top: 20%;
      width: 75%;
      position: fixed;
      top: 0;
      left: 50%; 
      transform: translateX(-50%); 
    }
    
    .home-list.active {
      transform: translateX(-50%) translateY(-150%) scaleX(1.333); 
    }
     */

     .home-list {
      transition: transform 1s ease;
      display: flex;
      justify-content: center;
      padding-left: 2%;
      padding-right: 2%;
      padding-bottom: 2%;
      flex: 1;
      margin-top: 20%;
      width: 75%;
      position: fixed;
      top: 0;
      left: 50%; /* Center horizontally */
      transform: translateX(-50%); /* Center horizontally */
    }
    
    /* Default active state for smaller screens */
    .home-list.active {
      transform: translateX(-50%) translateY(-105%) scaleX(1.1); /* Adjusted Move for smaller screens */
      
    }
    .home-menu li{
      font-size: x-large;
    }
    
    /* Adjustments for screens wider than 600px (e.g., tablets and desktops) */
    @media (min-width: 800px) {
      .home-list.active {
        transform: translateX(-50%) translateY(-175%) scaleX(1.333); /* Original Move for larger screens */
      }
      .home-menu li{
        font-size: xx-large;
      }
    }
    
     
  .home-detail {
    transition: transform 0.1s ease, opacity 1s ease-in;
    visibility: hidden;
    opacity: 0;
    position: absolute;
    right: 0;
    transform: translateX(100%); /* Start off-screen */
    width: 100%;
    height: auto;
  }
  
  .home-detail.active {
    visibility: visible;
    opacity: 1;
    transform: translateX(0); /* Slide into view */
    /* margin-right: 5%; */
    /* padding: 5%; */
    /* margin: 5%; */
    width: 100%;
    height: 99%;
  }
  


    /* .home-list {
    transition: margin-top 1s ease-out;
    display: flex;
    justify-content: center;
    padding-left: 2%;
    padding-right: 2%;
    padding-bottom: 2%;
    flex: 1;
    margin-top: 0;
  }
  
  .home-list.active {
    position: fixed;
    top: 0;
    left: 0;
    margin-top: 0;
    width: 100%;
  } */