/* tt360/newsletter-story, ported from the prototype's .nid-story
   (html/assets/css/layout/newsletter-issue-detail.css). The narrower 758px
   reading width (.nid-body) is the surrounding template's own job, not this
   block's — see render.php's own header comment. */

.nid-story {
    margin-top: 56px;
}

/* Every plain h3 on the site is 32px on desktop (the same standing rule
   article-detail.html's own subheads follow); .wp-block-heading is core's own
   stable class, not the prototype's "title" class, which this block never
   renders. */
.nid-story .wp-block-heading {
    margin: 0;
    font-size: 32px;
}

.nid-story p {
    margin: 16px 0 0;
    font-size: 16px;
    line-height: 26px;
}

/* Core's own .wp-block-buttons/.wp-block-button wrapper divs size themselves by their own
   inherited 16px/24px body line-box, not by the 14px link actually inside them (the link's
   own smaller line-height, set in components/button-block-styles.css, only shrinks the link
   itself, not the two divs wrapping it) — so the visible "Read more" text was sitting lower
   inside its own 24px-tall wrapper than this 12px margin alone would suggest, measured
   directly by Elisa, not assumed. Scoped to this block specifically (not a sitewide
   .wp-block-button reset), since a future solid cta-button style may want its own real
   padding/line-height here, not this tight wrap. Both wrapper divs become flex so each one's
   own height comes from its actual child (the link), not an inherited line-box. */
.nid-story .wp-block-buttons {
    display: flex;
    margin: 12px 0 0;
}

.nid-story .wp-block-buttons .wp-block-button {
    display: flex;
}

/* sm */
@media (max-width: 575.98px) {
    .nid-story {
        margin-top: 40px;
    }
}