/* Apply to both frontend & backend */
.custom-scrollblock, .scrollblock {
    display: flex;
    /* flex-wrap: wrap; */
    gap: 80px;
    align-items: flex-start;
    max-width: 1200px;
    margin: 0 auto;
    justify-content: space-between;
    margin-bottom:80px;
    margin-top:60px;
  }
  
  .custom-scrollblock .custom-image-upload,
  .scrollblock img {
    flex: 1 1 40%;
    max-width: 40%;
    height:600px !important;
    object-fit:cover;
  }
  .scrollblock_content{
    height: 600px;
    overflow-y: auto;
    flex: 1 1 60%;
    max-width: 60%;
  }
  .scrollblock figure img{
    max-width:unset !important;
  }
  
  .custom-scrollblock .scrollblock-title,
  .custom-scrollblock .scrollblock-content,
  .scrollblock .scrollblock-title,
  .scrollblock .scrollblock-content {
    flex: 1 1 60%;
    max-width: 60%;
  }
  
  /* Make sure images scale nicely */
  .custom-scrollblock img,
  .scrollblock img {
    width: 100%;
    height: auto;
    display: block;
  }
  

  @media (max-width: 900px) {
  .custom-scrollblock, .scrollblock {
        gap: 40px;
    }
  }
  /* Responsive fallback for small screens */
  @media (max-width: 768px) {
    .custom-scrollblock {
      flex-direction: column;
    }
  
    .custom-scrollblock .custom-image-upload,
    .scrollblock img,
    .custom-scrollblock .scrollblock-title,
    .custom-scrollblock .scrollblock-content {
      flex: 1 1 100%;
      max-width: 100%;
    }
  }