/* Mobile view fixes for the Notre Association section */
@media (max-width: 767.98px) {
    /* Align the title to the right to show the woman's face */
    .ftco-volunteer .img-volunteer .row.no-gutters {
        justify-content: flex-start !important;
    }
    
    .ftco-volunteer .img-volunteer .col-lg-7 {
        width: 100%;
        text-align: right;
        padding-right: 15px;
    }
    
    /* Make text darker for better readability */
    .ftco-volunteer .img-volunteer .text p {
        color: #000000;
        font-weight: 500;
        text-shadow: 0px 0px 3px rgba(255, 255, 255, 0.8);
    }
    
    .ftco-volunteer .img-volunteer .text h2 {
        text-shadow: 0px 0px 3px rgba(255, 255, 255, 0.8);
    }
}

/* White navigation bar for mobile view */
@media (max-width: 991.98px) {
    /* Change navbar background to white */
    .ftco-navbar-light {
        background: #ffffff !important;
        box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    }
    
    /* Fix for hero section movement/parallax on mobile */
    .hero-wrap {
        background-attachment: scroll !important;
        transform: none !important;
        background-position: center center !important;
        background-size: cover !important;
        position: relative !important;
    }
    
    /* Disable all Stellar.js effects on mobile */
    [data-stellar-background-ratio] {
        background-attachment: scroll !important;
        background-position: center !important;
        background-size: cover !important;
    }
    
    /* Disable all Scrollax effects on mobile */
    [data-scrollax-parent], 
    [data-scrollax] {
        transform: none !important;
        transition: none !important;
        will-change: auto !important;
    }
    
    /* Make sure the hero has proper height without JS manipulation */
    .js-fullheight {
        height: 100vh !important;
        min-height: 600px !important;
    }
    
    /* Change text colors for better contrast on white background */
    .ftco-navbar-light .navbar-brand {
        color: #000000;
    }
    
    .ftco-navbar-light .navbar-nav > .nav-item > .nav-link {
        color: #333333;
    }
    
    .ftco-navbar-light .navbar-nav > .nav-item > .nav-link:hover {
        color: #ff0a54;
    }
    
    .ftco-navbar-light .navbar-nav > .nav-item.active > a {
        color: #ff0a54;
    }
    
    /* Change hamburger menu color */
    .ftco-navbar-light .navbar-toggler {
        color: #333333 !important;
    }
}