/*
    Enchanted Garden Shop
    css/meet-mark.css
    Meet Mark page.

    shared.css is loaded first on every page and defines the full design
    system (colors, type, spacing, buttons, cards, forms, header/footer).
    Only page-specific adjustments belong here.
*/

/* A smaller version of .article-photo (shared.css) that floats beside
   the text instead of sitting full width above it. Falls back to full
   width, stacked above the text, on narrow screens where floating a
   photo next to only a couple words per line reads poorly. */
.article-photo-float {
    width: 260px;
    float: right;
    margin: 0 0 var(--space-md) var(--space-md);
}

@media (max-width: 780px) {
    .article-photo-float {
        float: none;
        width: 100%;
        margin: 0 0 var(--space-lg);
    }
}

/* Makes sure the button row below the bio always starts on its own
   line, clear of the floated photo, even if the bio text is ever
   shortened enough that it would otherwise still be running alongside
   the photo. */
.text-center.mt-md {
    clear: both;
}