#site-case-study {
    .content {
        background-size: cover;
        background-position: center;
        padding: 50px;
        position: relative;
        background-color: var(--site-background);
        background: linear-gradient(to top, var(--site-background), transparent);
        border: 1px solid var(--site-border);
        border-radius: 50px;
        overflow: hidden;
        display: grid;
        gap: 30px;

        img {
            border-radius: 30px;
            max-height: 500px;
            object-fit: cover;
            display: none;
        }

        .list {
            display: grid;
            grid-template-columns: repeat(2, 1fr);
            gap: 30px;

            .item {
                position: relative;
                border-radius: 16px;
                display: grid;
                gap: 10px;

                svg {
                    height: 20px;                  
                }

                span {
                    text-transform: uppercase;
                    border-radius: 50px;
                    height: fit-content;
                    width: fit-content;
                    clear: both;
                    display: inline-flex;
                    gap: 5px;
                    align-items: center;
                    color: #fff;
                }
            }

            @media only screen and (max-width: 980px) {
                grid-template-columns: 1fr;
            }            
        }
    }
}