html, body {
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%;
    overflow-x: hidden;
}

/* scroll container */
.image-container {
    position: relative;       /* 🔑 anchor for absolute button */
    width: 100vw;
    min-height: 100vh;
    overflow-y: auto;
}

/* image fits width, scrolls vertically */
.image-container img {
    width: 100vw;
    max-width: 100%;
    height: auto;
    display: block;
}

/* overlay button */
.downloadBtn {
    position: absolute;       /* 🔑 moves with image */
    top: 31%;
    left: 20%;

    width: 60%;
    height: 10%;

    background: rgba(0,0,0,1);
    color: #fff;

    opacity: 0;               /* 👻 hidden by default */
     z-index: 2;
}

.dynamicVideo {
    position: absolute;
    top: -29.4%;
    left: 0;

    width: 100%;
    height: 100%;

    object-fit: contain; /* or cover depending on your design */
    z-index: 1;
}





