/* ==========================================================================
   RESTORED BASE THEME HERO STYLING
   ========================================================================== */

#hero, 
.hero-carousel {
    position: relative !important;
    display: block !important;
    visibility: visible !important;
    width: 100% !important;
}

#heroCarousel,
#heroCarousel .carousel-inner,
#heroCarousel .carousel-item {
    width: 100% !important;
    height: 100% !important;
}

#heroCarousel .image-wrapper {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    background-attachment: scroll !important;
    z-index: 1 !important;
}

/* Lighter overlay gradient for background photos */
#heroCarousel .image-wrapper.bg-overlay:before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    background: linear-gradient(180deg, rgba(10, 12, 16, 0.4) 0%, rgba(10, 12, 16, 0.2) 50%, rgba(10, 12, 16, 0.55) 100%) !important;
    opacity: 1 !important;
    z-index: 1 !important;
}

#heroCarousel .bg-content {
    position: relative !important;
    z-index: 2 !important;
    height: 100% !important;
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* Desktop Hero Height */
@media (min-width: 992px) {
    #heroCarousel .hero-caption {
        height: calc(100vh - 2.5rem) !important;
        min-height: 520px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }
}

/* Mobile Responsive Hero Height */
@media (max-width: 767.98px) {
    #hero, 
    .hero-carousel {
        height: 100vh !important;
        min-height: 480px !important;
    }

    #heroCarousel .hero-caption {
        height: 100vh !important;
        min-height: 480px !important;
        padding-top: 2rem !important;
        padding-bottom: 2rem !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }
    
    #heroCarousel h4.display-4 {
        font-size: 2.1rem !important;
        line-height: 1.25 !important;
    }
}


/* ==========================================================================
   HERO LOCATION BELOW TITLE & ABOUT MOBILE HEADING FIX
   ========================================================================== */

.hero-sub-location {
    font-size: 0.85rem !important;
    letter-spacing: 0.18em !important;
    color: #C6A664 !important;
    text-shadow: 0px 2px 8px rgba(0, 0, 0, 0.9) !important;
}

@media (max-width: 767.98px) {
    .hero-sub-location {
        font-size: 0.72rem !important;
        letter-spacing: 0.12em !important;
    }

    /* Make About section heading smaller on mobile to prevent overflow */
    .hero-about-heading {
        font-size: 1.35rem !important;
        line-height: 1.3 !important;
        margin-bottom: 1.25rem !important;
    }

    #about p.text-primary {
        font-size: 0.78rem !important;
        letter-spacing: 0.12em !important;
        margin-bottom: 0.75rem !important;
    }
}


/* ==========================================================================
   PERFECT ABOUT SECTION MOBILE DISPLAY & RESPONSIVE TYPOGRAPHY
   ========================================================================== */

#about {
    padding-top: 6rem !important;
    padding-bottom: 6rem !important;
}

.hero-about-heading {
    font-size: 2.3rem !important;
    line-height: 1.25 !important;
    letter-spacing: 0.03em !important;
    color: #FFFFFF !important;
}

@media (max-width: 767.98px) {
    #about {
        padding-top: 5.5rem !important;
        padding-bottom: 5.5rem !important;
    }
    
    .hero-about-heading {
        font-size: 1.45rem !important;
        line-height: 1.35 !important;
        margin-bottom: 1.25rem !important;
        word-break: normal !important;
        overflow-wrap: break-word !important;
    }
    
    #about .lead {
        font-size: 1.02rem !important;
        line-height: 1.65 !important;
        margin-bottom: 1.25rem !important;
    }
    
    #about p {
        font-size: 0.92rem !important;
        line-height: 1.65 !important;
        margin-bottom: 1.75rem !important;
    }

    #about .pe-lg-6 {
        padding-right: 0 !important;
    }
}