/**
 * Sapp Sponsors — front-end banner styles.
 *
 * Goals:
 *  - Centered, full-bleed-within-max-width banner at every breakpoint.
 *  - No layout shift: images maintain natural aspect ratio.
 *  - Sensible vertical breathing room.
 *  - Max display width per slot (leaderboard 970 px, others fluid).
 */

/* -----------------------------------------------------------------------
   Base block
   ----------------------------------------------------------------------- */
.sapp-banner {
    display: block;
    width: 100%;
    text-align: center;
    margin-top: 1.25rem;
    margin-bottom: 1.25rem;
}

/* -----------------------------------------------------------------------
   Slot-specific max widths
   ----------------------------------------------------------------------- */
.sapp-banner--leaderboard {
    max-width: 970px;
    margin-left: auto;
    margin-right: auto;
}

.sapp-banner--in-content {
    max-width: 728px;
    margin-left: auto;
    margin-right: auto;
}

.sapp-banner--footer {
    max-width: 970px;
    margin-left: auto;
    margin-right: auto;
}

/* -----------------------------------------------------------------------
   Link wrapper — block so it doesn't leave inline whitespace
   ----------------------------------------------------------------------- */
.sapp-banner__link {
    display: block;
    line-height: 0; /* remove bottom gap caused by inline baseline */
}

/* -----------------------------------------------------------------------
   <picture> and <img>
   Responsive: image scales down on narrow viewports, never overflows.
   height:auto keeps aspect ratio. display:block + margin:auto centres it.
   ----------------------------------------------------------------------- */
.sapp-banner picture {
    display: block;
}

.sapp-banner__img {
    display: block;
    width: auto;
    max-width: 100%;
    height: auto;
    margin: 0 auto;
}

/* -----------------------------------------------------------------------
   Accessibility: keyboard-focus ring on the link
   ----------------------------------------------------------------------- */
.sapp-banner__link:focus-visible {
    outline: 3px solid #0073aa;
    outline-offset: 2px;
}
