/*
   Reversible zoom-safe layer
   --------------------------
   Keeps layouts stable when browser zoom or operating-system display scaling
   reduces the effective CSS viewport. Remove the link from _Layout.cshtml to
   roll this layer back without touching component styles.
*/

html {
    overflow-x: clip;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

body {
    min-width: 320px;
    overflow-x: clip;
}

img,
video,
canvas,
iframe,
svg {
    max-width: 100%;
}

/* Flex and grid children may shrink instead of forcing a horizontal overflow. */
.row > *,
.d-flex > *,
.swiper,
.swiper-wrapper,
.swiper-slide,
.content-slider,
.content-slider__shell,
.content-slider__card,
.content-slider__media {
    min-width: 0;
}

/* Long editorial titles, URLs and labels must wrap inside their containers. */
h1, h2, h3, h4, h5, h6,
p,
a,
button,
td,
th,
.line-hover {
    overflow-wrap: break-word;
}

table {
    display: block;
    width: max-content;
    max-width: 100%;
    overflow-x: auto;
}

/* Media always preserves its source ratio; portraits are cropped from the top, not through the face. */
.content-slider__media > img:first-child,
.impact-slide-img,
.annual-report-image,
.npd-gallery__slide > img,
.dementia-channel-card__image,
.dementia-editorial-image {
    object-fit: cover;
    object-position: center top;
}

/* At effective mid-size widths (including 110–125% browser zoom), let media cards grow with content. */
@media (max-width: 1599.98px) {
    .content-slider__card--media,
    .content-slider__card--media .row,
    .content-slider__card--media .content-slider__media {
        min-height: 0;
    }

    .content-slider__card--media .row.h-100 {
        height: auto !important;
    }

    .content-slider__media {
        aspect-ratio: 16 / 9;
    }

    .content-slider__media > img:first-child {
        width: 100%;
        height: 100%;
    }
}

/* Narrow layouts: no fixed content-card height that can clip enlarged text. */
@media (max-width: 991.98px) {
    .content-slider__card,
    .annual-report-card,
    .home-voice-card {
        height: auto !important;
    }

    .content-slider__card .p-30 {
        min-width: 0;
    }
}