/**
 * HERO SPACING FIX
 * Removes excessive white space after navbar
 * Ensures hero section starts immediately after navbar
 * OVERRIDES ALL OTHER CSS FILES
 */

/* Remove ALL spacing from html and body */
html,
body {
    margin: 0 !important;
    padding: 0 !important;
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Remove ALL spacing from main and sections */
main,
section,
#main-content {
    margin: 0 !important;
    padding: 0 !important;
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Hero Section - ZERO padding-top, only margin for navbar */
.hero,
#home,
section.hero,
section#home {
    margin-top: 60px !important;
    padding-top: 0 !important;
    padding-bottom: 80px !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
    margin-bottom: 0 !important;
    min-height: calc(100vh - 60px) !important;
}

/* Override ALL conflicting CSS files - MUST BE LAST */
.hero,
#home,
section.hero,
section#home,
.hero *,
#home * {
    padding-top: 0 !important;
}

/* Force override emergency fix CSS */
.hero[style*="padding"],
#home[style*="padding"] {
    padding-top: 0 !important;
}

/* Ensure no white space before hero - ZERO padding */
body > .hero:first-child,
body > #home:first-child,
main > .hero:first-child,
main > #home:first-child,
body > section:first-child.hero,
body > section:first-child#home {
    margin-top: 60px !important;
    padding-top: 0 !important;
}

/* Remove any spacing from body or main */
body {
    padding-top: 0 !important;
    margin-top: 0 !important;
}

main {
    padding-top: 0 !important;
    margin-top: 0 !important;
}

/* Ensure navbar is at top with no gap */
.navbar,
nav,
#navigation {
    top: 0 !important;
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Remove any gap between navbar and hero - ZERO padding */
.navbar + .hero,
.navbar + #home,
nav + .hero,
nav + #home,
#navigation + .hero,
#navigation + #home,
.navbar ~ .hero,
.navbar ~ #home,
nav ~ .hero,
nav ~ #home {
    margin-top: 60px !important;
    padding-top: 0 !important;
}

@media (max-width: 768px) {
    .navbar + .hero,
    .navbar + #home,
    nav + .hero,
    nav + #home,
    #navigation + .hero,
    #navigation + #home {
        margin-top: 56px !important;
        padding-top: 0 !important;
    }
    
    .hero,
    #home,
    section.hero,
    section#home {
        margin-top: 56px !important;
        padding-top: 0 !important;
    }
}