/* SM Ad-Link — lightweight Elementor-free promotional creative. Journal creatives use journal-features.css. */
.smal {
    --smal-gold: #c8a96a;
    --smal-border: #e6e3de;

    margin: 24px auto;
    padding: 18px 22px;
	
    width: calc(100% - 108px);
    max-width: 1118px;

    background: #fff;

    border: 1px solid var(--smal-border);
    border-left: 3px solid var(--smal-gold);
    border-radius: 12px;

    box-sizing: border-box;
    font-family: inherit;
}
.smal *, .smal *::before, .smal *::after { box-sizing: border-box; }
.smal__content { display: flex; flex-direction: column; gap: 7px; min-width: 0; }
.smal__eyebrow { color: #877045; font-size: 10px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.smal__title { margin: 0; font-size: 18px; line-height: 1.35; font-weight: 600; }
.smal__title a, .smal__link { color: inherit; text-decoration: none; }
.smal__title a:hover, .smal__link:hover { text-decoration: underline; text-decoration-color: var(--smal-gold); }
.smal__text { font-size: 13px; line-height: 1.5; color: #626262; margin: 0; }
.smal__link { align-self: flex-start; font-weight: 700; font-size: 12px; margin-top: 3px; }
.smal__link span { color: var(--smal-gold); }
.smal--featured, .smal--city { margin-top: 24px; margin-bottom: 24px; padding: 28px; }
.smal--strip, .smal--compact { margin: 12px 68px; padding: 12px 14px; }
.smal--strip .smal__content { gap: 3px; }
.smal--strip .smal__text { display: none; }
.smal--xs .smal__title { font-size: 13px; }
.smal--sm .smal__title { font-size: 14px; }
.smal--lg .smal__title { font-size: 21px; }

/*
|--------------------------------------------------------------------------
| SM Ad-Link - Mobile Layout
|--------------------------------------------------------------------------
*/


/*
|--------------------------------------------------------------------------
| SM Ad-Link - Mobile Layout
|--------------------------------------------------------------------------
|
| Maintain consistent horizontal spacing on mobile.
| Override desktop max-width and centre the Ad-Link.
|
|--------------------------------------------------------------------------
*/

@media (max-width: 767px) {

    .smal {
        width: calc(100% - 32px);
        max-width: 100%;

        margin: 20px auto;
    }

    /*
    | Strip and Compact Layouts
    */

    .smal--strip,
    .smal--compact {
        width: calc(100% - 32px);
        max-width: 100%;

        margin: 12px auto;
    }

    /*
    | Search Feed - Full Width
    */

    .smal--in-feed {
        grid-column: 1 / -1;

        width: 100%;
        max-width: 100%;

        margin: 12px 0;
    }

}