/* ===============================
   FIX GAP BETWEEN HEADER AND CONTENT & ENSURE MIDDLE ALIGNMENT
   =============================== */

/* Single source: gap from header bottom border line -> red banner (5px or 10px only) */
:root {
    --glrcf-header-banner-gap: 5px;
    --glrcf-banner-content-gap: 10px;
}

/* Vertical offset under the fixed header is owned by adjustHeaderSpacer() in header.php (inline + !important).
   Do NOT set body { padding-top } here -- it fights the spacer and causes double gaps or drift. */
html {
    scroll-padding-top: 0 !important;
}

body {
    margin-top: 0 !important;
}

/* Ensure header container does not add hidden spacing */
#mainHeader {
    margin-bottom: 0 !important;
}

.page-container {
    height: 0 !important;
    min-height: 0 !important;
    max-height: 0 !important;
    overflow: visible !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
}

/* All main wrappers start immediately below header/banner */
.page-container,
.main-content,
main,
.page-content,
#content,
.content,
.sales-container,
.browse-pages-container,
.trove-showcase-wrap,
.map-explorer-container {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Red Crisis Alert Banner */
#redBannerWrapper {
    margin-top: 5px !important;
    margin-bottom: var(--glrcf-banner-content-gap, 10px) !important;
}
#redCrisisBanner {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

/* Main 3-column layout wrapper - centered in middle section */
.main-layout-wrapper {
    margin-top: 0 !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-top: 0 !important;
}

#redBannerWrapper ~ .main-layout-wrapper,
#redBannerWrapper + .main-layout-wrapper {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Middle column + side ads: pin to top of layout row */
.main-layout-wrapper > .sidebar-left,
.main-layout-wrapper > .sidebar-right,
.main-layout-wrapper > .content-area {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

.main-layout-wrapper .content-area > :first-child {
    margin-top: 0 !important;
}

.sidebar-left .sidebar-content,
.sidebar-right .sidebar-content,
.sidebar-left .am-ad-stack,
.sidebar-right .am-ad-stack,
.sidebar-left .ad-block,
.sidebar-right .ad-block {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Hero & Feature Sections on standalone pages - compact padding right below header */
.hero-section,
.services-hero,
.reports-hero,
.stories-hero,
.impact-hero,
.nikahfinder-hero,
.geno-hero,
.annual-reports,
.success-stories {
    margin-top: 0 !important;
    padding-top: 24px !important;
    padding-bottom: 24px !important;
}

/* Ensure containers in hero sections are horizontally centered in the middle section */
.hero-section .container,
.services-hero .hero-inner,
.reports-hero .container,
.stories-hero .container,
.impact-hero .container {
    margin-left: auto !important;
    margin-right: auto !important;
}

/* Eliminate gap from hidden or empty elements between header and content */
header ~ div[style*="display:none"],
header ~ div[style*="display: none"],
header ~ span[style*="display:none"],
header ~ div:empty:not(.ufo-control-panel):not(footer):not(.freebies-sidebar) {
    margin: 0 !important;
    padding: 0 !important;
    height: 0 !important;
}
