/* ============================================================
   Media + text side-by-side (desktop + mobile) + page responsive
   Loaded last so it wins over page-specific flex stacks.
   ============================================================ */

.cms-page-items,
.cms-plugin-stack,
.about-story-stack,
.minimal-doc-stack,
.eservice-stack,
.board-stack,
.contact-stack,
.fields-stack {
    display: grid !important;
    grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr) !important;
    column-gap: clamp(0.85rem, 2.2vw, 1.75rem) !important;
    row-gap: clamp(1rem, 2.2vw, 1.5rem) !important;
    align-items: stretch !important;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}

.cms-page-items > *,
.cms-plugin-stack > *,
.about-story-stack > *,
.minimal-doc-stack > *,
.eservice-stack > *,
.board-stack > *,
.contact-stack > *,
.fields-stack > * {
    grid-column: 1 / -1 !important;
    min-width: 0 !important;
    max-width: 100%;
}

/* Image + following text/content → side by side */
.cms-page-items > .cms-media-block:has(+ .cms-item--content),
.cms-page-items > .cms-media-block:has(+ .cms-prose-block),
.cms-plugin-stack > .cms-media-block:has(+ .cms-item--content),
.cms-plugin-stack > .cms-media-block:has(+ .cms-prose-block),
.about-story-stack > .cms-media-block:has(+ .cms-item--content),
.minimal-doc-stack > .cms-media-block:has(+ .cms-item--content),
.eservice-stack > .cms-media-block:has(+ .cms-item--content),
.cms-page-items > .cms-item--content + .cms-media-block,
.cms-plugin-stack > .cms-item--content + .cms-media-block,
.cms-page-items > .cms-prose-block + .cms-media-block,
.cms-plugin-stack > .cms-prose-block + .cms-media-block {
    grid-column: 2 !important;
    max-width: none !important;
    margin-inline: 0 !important;
    width: 100% !important;
    height: 100%;
    align-self: stretch;
}

.cms-page-items > .cms-media-block + .cms-item--content,
.cms-page-items > .cms-media-block + .cms-prose-block,
.cms-plugin-stack > .cms-media-block + .cms-item--content,
.cms-plugin-stack > .cms-media-block + .cms-prose-block,
.about-story-stack > .cms-media-block + .cms-item--content,
.minimal-doc-stack > .cms-media-block + .cms-item--content,
.eservice-stack > .cms-media-block + .cms-item--content,
.cms-page-items > .cms-item--content:has(+ .cms-media-block),
.cms-plugin-stack > .cms-item--content:has(+ .cms-media-block),
.cms-page-items > .cms-prose-block:has(+ .cms-media-block),
.cms-plugin-stack > .cms-prose-block:has(+ .cms-media-block) {
    grid-column: 1 !important;
    align-self: stretch;
    display: flex !important;
    flex-direction: column;
    justify-content: center;
    margin: 0 !important;
    width: 100%;
}

/* Paired image crop */
.cms-media-block:has(+ .cms-item--content),
.cms-media-block:has(+ .cms-prose-block),
.cms-item--content + .cms-media-block,
.cms-prose-block + .cms-media-block {
    overflow: hidden;
}

.cms-media-block:has(+ .cms-item--content) .cms-media-block__frame,
.cms-media-block:has(+ .cms-prose-block) .cms-media-block__frame,
.cms-item--content + .cms-media-block .cms-media-block__frame,
.cms-prose-block + .cms-media-block .cms-media-block__frame {
    height: 100%;
    min-height: 200px;
}

.cms-media-block:has(+ .cms-item--content) .cms-media-block__img,
.cms-media-block:has(+ .cms-prose-block) .cms-media-block__img,
.cms-item--content + .cms-media-block .cms-media-block__img,
.cms-prose-block + .cms-media-block .cms-media-block__img {
    width: 100% !important;
    height: 100% !important;
    min-height: 200px;
    max-height: none !important;
    object-fit: cover !important;
    aspect-ratio: 4 / 5;
    margin: 0 !important;
    float: none !important;
}

.cms-media-block + .cms-item--content .cms-item__inner,
.cms-item--content:has(+ .cms-media-block) .cms-item__inner {
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

/* ---------- Narrow phones: keep side-by-side, tighter image ---------- */
@media (max-width: 639.98px) {
    .cms-page-items,
    .cms-plugin-stack,
    .about-story-stack,
    .minimal-doc-stack,
    .eservice-stack,
    .board-stack,
    .contact-stack,
    .fields-stack {
        grid-template-columns: minmax(0, 1.25fr) minmax(96px, 36%) !important;
        column-gap: 0.75rem !important;
        row-gap: 0.9rem !important;
        padding-inline: 0 !important;
    }

    .cms-media-block:has(+ .cms-item--content) .cms-media-block__img,
    .cms-media-block:has(+ .cms-prose-block) .cms-media-block__img,
    .cms-item--content + .cms-media-block .cms-media-block__img,
    .cms-prose-block + .cms-media-block .cms-media-block__img {
        min-height: 140px;
        aspect-ratio: 3 / 4;
        border-radius: 12px;
    }

    .cms-media-block + .cms-item--content .cms-item__body,
    .cms-media-block + .cms-item--content .cms-fancy-box__body {
        padding: 0.75rem !important;
    }

    .cms-media-block + .cms-item--content .cms-fancy-box-text,
    .cms-media-block + .cms-item--content .cms-prose-block,
    .cms-media-block + .cms-item--content p {
        font-size: 0.875rem !important;
        line-height: 1.7 !important;
    }
}

@media (min-width: 640px) {
    .cms-media-block:has(+ .cms-item--content) .cms-media-block__img,
    .cms-media-block:has(+ .cms-prose-block) .cms-media-block__img,
    .cms-item--content + .cms-media-block .cms-media-block__img,
    .cms-prose-block + .cms-media-block .cms-media-block__img {
        min-height: 260px;
    }
}

/* ---------- Global page responsive ---------- */

.page-content-section--items,
.doc-content,
.story-content {
    overflow-x: clip;
}

.container--page {
    width: 100%;
    max-width: 72rem;
    padding-inline: clamp(0.85rem, 3.5vw, 1.25rem);
    box-sizing: border-box;
}

.cms-table-wrap,
.table-responsive,
.generic-table-card {
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.cms-item,
.cms-item__inner,
.cms-fancy-box,
.alert,
.accordion,
.user-cards-section,
.quick-access {
    max-width: 100%;
}

.footer-bottom {
    flex-wrap: wrap;
    justify-content: center;
    text-align: center;
    gap: 10px 18px;
}

@media (max-width: 767.98px) {
    .site-footer .row > [class*="col"] {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .doc-hero__title,
    .story-hero__title,
    .page-inner-hero__title {
        font-size: clamp(1.25rem, 5.5vw, 1.65rem) !important;
        line-height: 1.35 !important;
        word-wrap: break-word;
    }

    .cms-plugin-stack {
        padding: 0.75rem 0 !important;
    }

    .cms-table {
        min-width: 520px;
    }

    .quick-access-item,
    .cms-plugin-stack .btn {
        width: 100%;
        justify-content: center;
    }
}

/* Prevent lone lead images from stretching awkwardly when NOT paired */
.cms-plugin-stack > .cms-media-block:not(:has(+ .cms-item--content)):not(:has(+ .cms-prose-block)) {
    grid-column: 1 / -1 !important;
    max-width: 42rem;
    margin-inline: auto;
}

.cms-plugin-stack > .cms-media-block:not(:has(+ .cms-item--content)):not(:has(+ .cms-prose-block)) .cms-media-block__img {
    max-height: 420px;
    width: 100%;
    object-fit: cover;
}