<div class="banner-container">
    <div class="banner-content">
        <div class="banner-text-wrapper">
            <div class="banner-heading">
                Introducing DeepL AI Labs
            </div>
            <div class="desc">
              See what the DeepL R&D teams are building next!
            </div>
        </div>
        <div class="banner-btn-container">
            <a href="https://www.deepl.com/ai-labs" target="_blank" class="dark-btn">Learn more</a>
        </div>
    </div>
    <div class="banner-image-wrapper">
        <img src="https://8349564.fs1.hubspotusercontent-na1.net/hubfs/8349564/labs-cubes-v07.3.1-Green%20(00052).png" alt="" class="banner-img">
    </div>
</div>

<style>
    .banner-container {
        display: flex;
        gap: 20px;
        background: #1FCF9A;
        padding: 32px;
        border-radius: 8px;

    }
    .banner-content, .banner-image-wrapper {
        flex-basis: 50%;
    }
    .banner-content {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
    }
    .banner-heading {   
        font-size: 56px;
        font-weight: 300;
        line-height: 80px;
        letter-spacing: -0.015em;
        text-align: left;
        margin-bottom: 32px;
    }
    .desc {
        font-size: 18px;
        font-weight: 400;
        line-height: 25.2px;
    }
    .banner-img {
        width: 100%;
        max-width: 440px;
        height: fit-content;
    }
    .banner-image-wrapper {
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .banner-btn-container {
        display: flex;
        margin-top: 10%;
    }
</style>