/* Sticky belongs to the composed single-post layout, not a TagDiv row. */
@media (min-width: 1019px) {
    /* Newspaper's outer page shell otherwise becomes the sticky containing
       block before the composed article/related grid can take effect. */
    body.single-post .cnv-site {
        overflow: clip !important;
    }

    body.single-post .td-theme-wrap {
        overflow: visible !important;
    }

    .cnv-single-post-layout__related {
        position: static !important;
        align-self: stretch;
        min-height: 0 !important;
    }

    .cnv-single-post-layout__related .cnv-related-smart {
        position: sticky !important;
        top: 20px !important;
        align-self: start;
    }

    body.admin-bar .cnv-single-post-layout__related .cnv-related-smart {
        top: 52px !important;
    }

    .cnv-single-post-layout__related .cnv-related-smart-sticky-host {
        position: static !important;
        top: auto !important;
    }
}

@media (max-width: 1018px) {
    .cnv-single-post-layout__related {
        position: static !important;
    }
}

/* Mobile uses the same compact two-column card rhythm as Featured Recent. */
@media (max-width: 767px) {
    .cnv-single-post-layout__related .cnv-related-smart {
        margin-bottom: 0;
    }

    .cnv-single-post-layout__related .cnv-related-smart__title {
        margin-bottom: 22px !important;
        text-align: left !important;
    }

    .cnv-single-post-layout__related .cnv-related-smart__list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 24px 16px;
    }

    .cnv-single-post-layout__related .cnv-related-smart__link,
    .cnv-single-post-layout__related .cnv-related-smart__item:first-child .cnv-related-smart__link {
        gap: 12px;
    }

    .cnv-single-post-layout__related .cnv-related-smart__thumb,
    .cnv-single-post-layout__related .cnv-related-smart__item:first-child .cnv-related-smart__thumb {
        aspect-ratio: 16 / 10;
        border-radius: 10px;
    }

    .cnv-single-post-layout__related .cnv-related-smart__headline,
    .cnv-single-post-layout__related .cnv-related-smart__item:first-child .cnv-related-smart__headline {
        font-size: 14px !important;
        line-height: 1.28 !important;
    }
}