/* Fix the Gallery v7 aspect ratio issue on mobile
- Confluence documentation: https://apptegy.atlassian.net/wiki/x/HoCGIAE 
*/
@media (max-width: 980px) {
    #home .gallery-v7 {
        height: auto;

        .image-wrapper {
            height: 0;
            padding-top: 56.25%;
        }

        .responsive-image img {
            height: 100%;
        }

        .gallery-content {
            max-width: 100%;
            box-sizing: border-box;

            h1 {
                font-size: clamp(1.5rem, -0.8684rem + 6.3158vw, 3rem);
                line-height: 1.1;
            }

            .description,
            .title {
                margin-bottom: 20px;
            }

            .description p {
                font-size: clamp(1rem, 0.4079rem + 1.5789vw, 1.375rem);
                line-height: 1.1;
            }

            .button-link button {
                padding: 15px 25px;
                font-size: 15px;
                line-height: 1;
            }
        }
    }
}

@media (max-width: 760px) {
    #home .gallery-v7 {

        .gallery-content {
            overflow: auto;

            .description,
            .title {
                margin-bottom: 10px;
            }

            .button-link {
                margin-inline: auto;

                button {
                    font-size: 12px;
                    padding: 10px 15px;
                }
            }
        }

        .gallery-controls {
            padding: 10px 15px;
        }
    }
}

@media (max-width: 760px) {
    #home .gallery-v7 {
        .gallery-controls {
            padding: 5px;
        }
    }
}
/* END - Fix the Gallery v7 aspect ratio issue on mobile */