.featured-posts {
    width: var(--9col);
    margin-top: var(--header-height);
}

.featured-post {
    display: flex;
    flex-direction: column;
    position: relative;
}

.featured-post__thumb {
    width: var(--6col);

    position: relative;
    display: block;
}

.featured-post__thumb img {
    width: 100%;

    height: auto;
    display: block;
}

.featured-post__thumb iframe {
    width: 100%;
    position: relative;
    display: block;
    height: auto;
    aspect-ratio: 16 / 9;
}


.featured-post__content {
    display: none;
    background-color: var(--background);
    width: var(--9col);
    padding: var(--medium-marge) var(--big-marge);
}

.featured-post__content.is-fixed {
    position: fixed;
    left: 0;
    bottom: 0;
}

.featured-post__content.is-absolute {
    position: absolute;
    left: 0;
    bottom: 0;
}

/* MOBILE */

@media (max-width: 768px) {

    .site-main {
        overflow-x: hidden;
    }

    .featured-posts {
        width: 100%;
        margin-top: 0;
        margin-bottom: 60vh;
        overflow-x: hidden;
    }

    .featured-post {
        position: relative;
    }

    .featured-post__thumb {
        width: 100%;
        display: block;
        position: relative;
    }


    .featured-title-band {
        position: sticky;
        top: 0;
        z-index: 20;
        width: 100%;
        background: var(--primary);
        pointer-events: none;
        color: var(--background);
        padding: var(--big-marge);
    }

}