/*
 * About page — "Meet Our Teams" centering, remotesensors.it child theme.
 *
 * Scope: only the [about-team] shortcode output
 * (section[data-block-id="about-team"]) on the About page.
 *
 * Root cause: the block is a Swiper carousel with data-preview="4"
 * (slidesPerView: 4). With fewer members than the 4-column track, Swiper
 * lays slides out from the left edge of `.swiper-wrapper` (a flex
 * container), so a partial group looks shifted left.
 *
 * Fix: center the slide group inside the wrapper. `safe center` centers
 * the group only while the content fits (1-4 slides); on overflow (5+)
 * it falls back to flex-start, keeping Swiper's translate math intact.
 * The plain `center` line is a fallback for browsers that do not yet
 * support the `safe` alignment keyword. Card widths, gaps, pagination
 * and Swiper options are untouched.
 */

[data-block-id="about-team"] .tf-swiper > .swiper-wrapper {
    justify-content: center;
    justify-content: safe center;
}

/*
 * Swiper applies `spaceBetween` as an inline `margin-right` on every slide,
 * including the last one. Flex centering counts that trailing margin, which
 * would shift the visible card group left by half a gap. Strip it on the
 * last slide so the group is truly centered. `!important` is required here:
 * the margin is an inline style, so no selector specificity can beat it.
 */
[data-block-id="about-team"] .tf-swiper > .swiper-wrapper > .swiper-slide:last-child {
    margin-right: 0 !important;
}
