/* The current home page has two entry points. Let their existing container
   place them, rather than inheriting old percentage widths and pixel offsets.
   Keep the established mobile stack, type, imagery, colours and hover states. */
body.home #main .lgbt_frontpage_top .homepage_tabs {
    --lgbt-entry-min-height: 700px;
    height: auto;
    min-height: var(--lgbt-entry-min-height);
}

body.home #main .lgbt_frontpage_top .homepage_tabs > .elementor-container {
    height: auto;
    min-height: var(--lgbt-entry-min-height);
}

body.home #main .lgbt_frontpage_top .homepage_tabs > .elementor-container > .elementor-column > .elementor-widget-wrap {
    margin-left: 0;
    margin-right: 0;
    /* The container owns the outside rails; do not double them per entry. */
    border-left-width: 0;
    border-right-width: 0;
}

body.home #main .lgbt_frontpage_top .homepage_tabs .elementor-button-text {
    min-width: 0;
    white-space: normal;
    overflow-wrap: anywhere;
    -webkit-hyphens: auto;
    hyphens: auto;
}

@media screen and (min-width: 768px) {
    body.home #main .lgbt_frontpage_top .homepage_tabs {
        --lgbt-entry-min-height: 515px;
    }

    body.home #main .lgbt_frontpage_top .homepage_tabs > .elementor-container {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.home #main .lgbt_frontpage_top .homepage_tabs > .elementor-container > .elementor-column {
        width: auto;
        min-width: 0;
    }

    /* One shared divider, centred on the join. */
    body.home #main .lgbt_frontpage_top .homepage_tabs > .elementor-container > .elementor-column:first-child::after {
        content: "";
        position: absolute;
        inset: 0 -1px 0 auto;
        border-right: 2px solid #000;
        pointer-events: none;
        z-index: 1;
    }
}

@media screen and (min-width: 1366px) {
    body.home #main .lgbt_frontpage_top .homepage_tabs {
        --lgbt-entry-min-height: 890px;
    }
}

/* The section already supplies the 176px side gutters at these widths.
   Filling its content box avoids applying the 68% desktop measure twice. */
@media screen and (min-width: 768px) and (max-width: 1365px) {
    body.home #main .lgbt_frontpage_top .homepage_tabs > .elementor-container {
        width: 100%;
    }
}
