/* =========================================
           1. CORE VARIABLES & RESET
           ========================================= */
        :root {
            --mwsg-gold: #FFC107;
            --mwsg-orange: #FF9800;
            --mwsg-bg-gradient: radial-gradient(circle at top center, #ffffff 0%, #f4f7f6 100%);
            --mwsg-text-main: #2c3e50;
            --mwsg-text-muted: #6c757d;
            --mwsg-border: rgba(0, 0, 0, 0.08);
            --mwsg-shadow: 0 10px 30px rgba(0,0,0,0.05);
            --mwsg-shadow-hover: 0 20px 50px rgba(255, 152, 0, 0.25);
            --mwsg-ease: cubic-bezier(0.25, 1, 0.5, 1);
        }

        /* Reset specifically for this section wrapper to avoid conflicts */
        .mwsg-wrapper { font-family: 'Poppins', sans-serif; margin: 0; padding: 0; box-sizing: border-box; }
        .mwsg-wrapper * { box-sizing: border-box; }

        .mwsg-main-section {
            background: var(--mwsg-bg-gradient);
            color: var(--mwsg-text-main);
/*            padding: 4rem 2rem;*/
            min-height: 100vh;
            overflow-x: hidden;
            width: 100%;
            position: relative;
        }

        /* =========================================
           2. NAVIGATION TABS
           ========================================= */
        .mwsg-tabs-container {
            display: flex; justify-content: center; gap: 15px; margin-bottom: 3rem;
            flex-wrap: wrap; position: sticky; top: 15px; z-index: 100;
        }
        .mwsg-tab-btn {
            background: rgba(255, 255, 255, 0.9);
            border:solid 3px;
            color: var(--mwsg-text-muted);
            padding: 12px 28px;
            border-radius: 50px;
            cursor: pointer;
            font-weight: 600;
            font-size: 0.95rem;
            transition: all 0.3s ease;
            display: flex; align-items: center; gap: 8px;
            box-shadow: 0 4px 10px rgba(0,0,0,0.05);
            backdrop-filter: blur(5px);
        }
        .mwsg-tab-btn:hover { background: #fff; transform: translateY(-3px); color: var(--mwsg-orange); }
        .mwsg-tab-btn.active {
            background: linear-gradient(135deg, var(--mwsg-orange), var(--mwsg-gold));
            color: #fff; border-color: transparent; 
            box-shadow: 0 8px 25px rgba(255, 193, 7, 0.4);
            transform: scale(1.05);
        }
        .mwsg-tab-btn.active i { color: #fff; }

        /* Content Visibility */
        .mwsg-tab-content { display: none; width: 100%; animation: mwsgSlideUp 0.6s var(--mwsg-ease); }
        .mwsg-tab-content.active { display: block; }
        @keyframes mwsgSlideUp { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }

        /* Headers */
        .mwsg-section-header { text-align: center; margin-bottom: 3rem; }
        .mwsg-section-header h2 {
            font-size: clamp(2rem, 5vw, 3rem);
            background: linear-gradient(to right, #222, var(--mwsg-orange));
            -webkit-background-clip: text; -webkit-text-fill-color: transparent;
            font-weight: 800;
        }
        .mwsg-section-header p { color: black; max-width: 600px; margin: 10px auto 0; font-size: 1.1rem;}

        /* =========================================
           3. TAB: MAHAUTSAV (Timeline)
           ========================================= */
        .mwsg-timeline-grid {
            display: grid; grid-template-columns: 1fr 0.8fr 1fr; gap: 2rem;
            align-items: center; max-width: 1200px; margin: 0 auto;
        }
        .mwsg-step-card {
            background: #fff; padding: 1.5rem; border-radius: 20px;
            margin-bottom: 1.5rem; position: relative; z-index: 1;
            box-shadow: var(--mwsg-shadow); border: 1px solid rgba(0,0,0,0.03);
            transition: 0.4s var(--mwsg-ease);
        }
        .mwsg-step-card:hover { transform: translateY(-8px); border-color: var(--mwsg-gold); box-shadow: var(--mwsg-shadow-hover); }
        .mwsg-step-icon {
            width: 45px; height: 45px; background: linear-gradient(135deg, var(--mwsg-orange), var(--mwsg-gold));
            border-radius: 50%; display: flex; align-items: center; justify-content: center;
            color: #fff; font-weight: bold; margin-bottom: 15px; font-size: 1.2rem;
            box-shadow: 0 4px 15px rgba(255, 193, 7, 0.4);
        }
        .mwsg-step-card h3 { font-size: 1.2rem; margin-bottom: 5px; color: #333; }
        .mwsg-step-card p { font-size: 0.9rem; color: #777; }

        .mwsg-phone-mockup {
            width: 100%; max-width: 280px; display: block; margin: 0 auto;
            border-radius: 35px; border: 8px solid #333;
            box-shadow: 0 20px 50px rgba(0,0,0,0.2);
            animation: mwsgFloat 6s ease-in-out infinite;
        }
        @keyframes mwsgFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-15px); } }

        /* =========================================
           4. TAB: EMPOWER (Impact & Mission)
           ========================================= */
        
        /* --- Mission Cards (Zoom BG) --- */
        .mwsg-mission-grid {
            display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
            gap: 2rem; max-width: 1200px; margin: 0 auto 5rem;
        }
        .mwsg-mission-card {
            position: relative; height: 350px; border-radius: 20px; overflow: hidden;
            box-shadow: var(--mwsg-shadow); cursor: default;
        }
        /* Background Image Layer */
        .mwsg-mission-bg {
            position: absolute; top: 0; left: 0; width: 100%; height: 100%;
            background-size: cover; background-position: center;
            transition: transform 0.8s var(--mwsg-ease);
        }
        .mwsg-mission-card:hover .mwsg-mission-bg { transform: scale(1.15); }
        
        /* Images */
        .mwsg-bg-1 { background-image: url('../../assets/img/myprftimg/myprft12.jpg'); }
        .mwsg-bg-2 { background-image: url('../../assets/img/myprftimg/myprft9.jpg'); }
        .mwsg-bg-3 { background-image: url('../../assets/img/myprftimg/myprft10.jpg'); }

        /* Overlay & Content */
        .mwsg-mission-content {
            position: absolute; top: 0; left: 0; width: 100%; height: 100%;
            background: linear-gradient(to top, rgba(0,0,0,0.9), rgba(0,0,0,0.3));
            display: flex; flex-direction: column; justify-content: flex-end;
            padding: 2rem; color: #e59d02;
        }
        .mwsg-mission-icon {
            font-size: 3rem;#e59d02; margin-bottom: auto; margin-top: 2rem;
            filter: drop-shadow(0 2px 4px rgba(0,0,0,0.5));
        }
        .mwsg-mission-content h3 { font-size: 1.5rem; margin-bottom: 0.5rem;font-weight:900;color:white; }
        .mwsg-mission-content p { font-size: 0.95rem; opacity: 0.9;color:white; }

        /* --- NEW IMPACT STORY SECTION --- */
.mwsg-impact-container {
    background: #fff;
    border-radius: 30px;
    box-shadow: 0 20px 60px rgba(0,0,0,0.08);
    max-width: 1100px;
    margin: 0 auto 4rem;
    overflow: hidden;
    display: flex;
    flex-wrap: wrap;
}

/* Left Side: Story Text with Background Image */
.mwsg-impact-text {
    flex: 1 1 400px;
    padding: 3rem;
    position: relative;
    background-image: url('../../assets/img/family.png');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    color: #fff;
}

/* Overlay for readability */
.mwsg-impact-text::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        to bottom,
        rgba(0,0,0,0.25),
        rgba(0,0,0,0.7)
    );
    z-index: 1;
}

/* Bring content above overlay */
.mwsg-impact-text * {
    position: relative;
    z-index: 2;
}

/* Tag */
.mwsg-impact-tag {
    display: inline-block;
    background: #e59d02;
    color: #000;
    padding: 6px 16px;
    border-radius: 20px;
    font-weight: 700;
    font-size: 0.8rem;
    margin-bottom: 1rem;
}

/* Text styles */
.mwsg-impact-text h3 {
    font-size: 2rem;
    font-weight: 700;
    line-height: 1.3;
    margin-bottom: 1rem;
    color: #fff;
}

.mwsg-impact-text p {
    font-size: 1rem;
    line-height: 1.7;
    color: #f1f1f1;
}

.mwsg-impact-text p strong {
    color: #ffd166 !important;
}

/* Right Side: Interactive Stats */
.mwsg-impact-visual {
    flex: 1 1 400px;
    padding: 3rem;
    background: #222;
    color: #fff;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

/* Decorative Background Pattern */
.mwsg-impact-visual::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image: radial-gradient(var(--mwsg-orange) 1px, transparent 1px);
    background-size: 20px 20px;
    opacity: 0.1;
}

/* Stats Rows */
.mwsg-stat-row {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-bottom: 25px;
    position: relative;
    z-index: 2;
}

.mwsg-stat-circle {
    width: 70px;
    height: 70px;
    border-radius: 50%;
    background: rgba(255,255,255,0.1);
    border: 1px solid rgba(255,255,255,0.2);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    color: #e59d02;
    transition: 0.3s ease;
}

.mwsg-stat-row:hover .mwsg-stat-circle {
    background: var(--mwsg-gold);
    color: #000;
    transform: scale(1.1);
}

.mwsg-stat-info h4 {
    font-size: 2rem;
    font-weight: 800;
    margin: 0;
    color: #fff;
}

.mwsg-stat-info span {
    font-size: 0.9rem;
    color: #aaa;
    text-transform: uppercase;
    letter-spacing: 1px;
}

/* Mobile Responsive */
@media (max-width: 768px) {
    .mwsg-impact-text,
    .mwsg-impact-visual {
        padding: 2rem;
    }

    .mwsg-impact-text h3 {
        font-size: 1.6rem;
    }
}

        /* =========================================
           5. TAB: GALLERY (Masonry & Auto-Update)
           ========================================= */
        .mwsg-masonry-grid {
            column-count: 3; column-gap: 20px; max-width: 1200px; margin: 0 auto;
        }
        .mwsg-gallery-item {
            break-inside: avoid; margin-bottom: 20px; border-radius: 15px; overflow: hidden;
            position: relative; background: #000; width: 100%; cursor: pointer;
            transition: all 0.5s ease;
        }
        .mwsg-gallery-item img {
            width: 100%; display: block; transition: transform 0.8s; opacity: 0.9; min-height: 200px; object-fit: cover;
        }
        .mwsg-gallery-item:hover { transform: translateY(-5px); box-shadow: 0 15px 35px rgba(0,0,0,0.2); }
        .mwsg-gallery-item:hover img { transform: scale(1.1); opacity: 1; }

        .mwsg-gallery-overlay {
            position: absolute; bottom: 0; left: 0; width: 100%;
            background: linear-gradient(to top, rgba(0,0,0,0.9), transparent);
            padding: 20px; color: #fff; transform: translateY(100%); transition: 0.4s ease;
        }
        .mwsg-gallery-item:hover .mwsg-gallery-overlay { transform: translateY(0); }
        .mwsg-gallery-tag {
            background: var(--mwsg-gold); color: #000; padding: 4px 10px; border-radius: 4px;
            font-size: 0.7rem; font-weight: 700; text-transform: uppercase;
        }

        /* Helper: Fade Out for Swap */
        .mwsg-fade-out { opacity: 0.2; transform: scale(0.95); }

        /* =========================================
           6. RESPONSIVE
           ========================================= */
        @media (max-width: 900px) {
            .mwsg-timeline-grid { grid-template-columns: 1fr; }
            .mwsg-col-center { order: -1; margin-bottom: 2rem; }
            .mwsg-masonry-grid { column-count: 2; }
            .mwsg-impact-container { flex-direction: column; }
        }
        @media (max-width: 600px) {
            .mwsg-masonry-grid { column-count: 1; }
            .mwsg-section-header h2 { font-size: 1.8rem; }
        }

        /* Scroll Animation Utility */
        .mwsg-reveal { opacity: 0; transform: translateY(30px); transition: 0.8s ease; }
        .mwsg-reveal.active { opacity: 1; transform: translateY(0); }