/* ==========================================================================
   BACKGROUNDS MODULAR CONFIGURATION (KEEPING MAIN CSS CLEAN)
   ========================================================================== */

/* Universal performance properties applied across all targeted sections */
#section-onboarding{
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    position: relative;
    z-index: 1;
}

/* ==========================================================================
   INDIVIDUAL IMAGES WITH BUILT-IN DARK ACCENT OVERLAYS FOR HIGH CONTRAST
   ========================================================================== */
/* Section 1: Hero Setup */
#section-onboarding {
    background-image: linear-gradient(rgba(11, 14, 17, 0.80), rgba(11, 14, 17, 0.85)), 
                      url('../img/herobg.webp');
}