:root {
            /* Colors */
            --iyeg-primary: #0A2540;        /* Dark blue for headings */
            --iyeg-text-body: #425466;       /* Body text color */
            --iyeg-text-white: #FFFFFF;
            --iyeg-text-white-70: rgba(255, 255, 255, 0.7);
            --iyeg-text-white-50: rgba(255, 255, 255, 0.5);
            
            /* Backgrounds */
            --iyeg-bg-white: #FFFFFF;
            --iyeg-bg-light: #F8FAFC;
            /*--iyeg-bg-footer: #0A2540;*/
            
            /* Font Families */
            --iyeg-font-primary: 'Inter', sans-serif;
            
            /* Font Sizes */
            --iyeg-text-xs: 0.75rem;    /* 12px */
            --iyeg-text-sm: 0.875rem;   /* 14px */
            --iyeg-text-base: 1rem;      /* 16px */
            --iyeg-text-md: 1.125rem;    /* 18px */
            --iyeg-text-lg: 1.25rem;     /* 20px */
            --iyeg-text-xl: 1.5rem;      /* 24px */
            --iyeg-text-2xl: 1.625rem;   /* 26px */
            --iyeg-text-3xl: 2rem;       /* 32px */
            --iyeg-text-4xl: 2.5rem;     /* 40px */
            
            /* Hero Size */
            --iyeg-text-hero: clamp(2rem, 5vw, 3rem);
            
            /* Spacing */
            --iyeg-space-1: 0.5rem;
            --iyeg-space-2: 1rem;
            --iyeg-space-3: 1.5rem;
            --iyeg-space-4: 2rem;
            --iyeg-space-5: 2.5rem;
            --iyeg-space-6: 3rem;
            --iyeg-space-8: 4rem;
            --iyeg-space-10: 5rem;
            
            /* Layout */
            --iyeg-container-padding: 5%;
            --iyeg-container-max-width: 1280px;
            --iyeg-header-total-height: calc(2.5rem + 5rem);
            
            /* Transitions */
            --iyeg-transition-fast: 0.2s ease;
            --iyeg-transition-base: 0.3s ease;
            
            /* Borders */
            --iyeg-radius-sm: 4px;
            --iyeg-radius-md: 8px;
            --iyeg-radius-lg: 12px;
            
            /* Shadows */
            --iyeg-shadow-sm: 0 2px 4px rgba(0, 0, 0, 0.05);
            --iyeg-shadow-md: 0 4px 6px rgba(0, 0, 0, 0.1);
        }

        /* ===== RESET STYLES ===== */
        * {
            box-sizing: border-box;
            margin: 0;
            padding: 0;
        }

        body {
            font-family: var(--iyeg-font-primary);
            background-color: var(--iyeg-bg-white);
            color: var(--iyeg-text-body);
            line-height: 1.5;
            overflow-x: hidden;
        }

        /* Screen Reader Only */
        .sr-only {
            position: absolute;
            width: 1px;
            height: 1px;
            padding: 0;
            margin: -1px;
            overflow: hidden;
            clip: rect(0, 0, 0, 0);
            white-space: nowrap;
            border-width: 0;
        }

        /* ===== UTILITY CLASSES ===== */
        
        /* Typography Utilities */
        .ig-font-primary { font-family: var(--iyeg-font-primary); }
        .ig-fw-400 { font-weight: 400; }
        .ig-fw-500 { font-weight: 500; }
        .ig-fw-600 { font-weight: 600; }
        .ig-fw-700 { font-weight: 700; }
        
        .ig-text-xs { font-size: var(--iyeg-text-xs); }
        .ig-text-sm { font-size: var(--iyeg-text-sm); }
        .ig-text-base { font-size: var(--iyeg-text-base); }
        .ig-text-md { font-size: var(--iyeg-text-md); }
        .ig-text-lg { font-size: var(--iyeg-text-lg); }
        .ig-text-xl { font-size: var(--iyeg-text-xl); }
        .ig-text-2xl { font-size: var(--iyeg-text-2xl); }
        .ig-text-3xl { font-size: var(--iyeg-text-3xl); }
        .ig-text-4xl { font-size: var(--iyeg-text-4xl); }
        
        .ig-lh-normal { line-height: 1.5; }
        .ig-lh-heading { line-height: 1.8; } /* 46.8px / 26px ≈ 1.8 */
        
        .ig-text-primary { color: var(--iyeg-primary); }
        .ig-text-body { color: var(--iyeg-text-body); }
        .ig-text-white { color: var(--iyeg-text-white); }
        .ig-text-white-70 { color: var(--iyeg-text-white-70); }
        
        .ig-text-center { text-align: center; }
        .ig-text-left { text-align: left; }
        .ig-text-right { text-align: right; }

        /* Title Utilities */
        .iyeg-title-page {
            font-family: var(--iyeg-font-primary);
            font-size: var(--iyeg-text-hero);
            font-weight: 700;
            line-height: 1.2;
            color: var(--iyeg-text-white);
        }
        
        .iyeg-title-section {
            font-family: var(--iyeg-font-primary);
            font-size: var(--iyeg-text-2xl);
            font-weight: 700;
            line-height: 1.8;
            color: var(--iyeg-primary);
            margin-bottom: var(--iyeg-space-2);
        }

        .iyeg-body-text {
            font-family: var(--iyeg-font-primary);
            font-size: var(--iyeg-text-md);
            font-weight: 400;
            line-height: 1.5;
            color: var(--iyeg-text-body);
            margin-bottom: var(--iyeg-space-3);
        }

        /* Section Utilities */
        .iyeg-section {
            padding: var(--iyeg-space-10) 0;
        }
        .iyeg-section--sm {
            padding: var(--iyeg-space-6) 0;
        }
        
        .iyeg-bg-image {
            background-size: cover;
            background-position: center;
            position: relative;
        }
        .iyeg-bg-image::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: rgba(10, 37, 64, 0.8); /* --iyeg-primary with opacity */
            z-index: 1;
        }
        .iyeg-bg-image > * {
            position: relative;
            z-index: 2;
        }
        
        .iyeg-container {
            max-width: var(--iyeg-container-max-width);
            margin: 0 auto;
            padding: 0 var(--iyeg-container-padding);
        }
        .iyeg-container--full-right {
            margin-right: 0;
            padding-right: 0;
        }

        /* Grid Utilities */
        .ig-grid {
            display: grid;
            gap: var(--iyeg-space-5);
        }
        .ig-grid-cols-2 {
            grid-template-columns: repeat(2, 1fr);
        }

        /* Spacing Utilities */
        .ig-mt-2 { margin-top: var(--iyeg-space-2); }
        .ig-mt-3 { margin-top: var(--iyeg-space-3); }
        .ig-mt-4 { margin-top: var(--iyeg-space-4); }
        .ig-mb-2 { margin-bottom: var(--iyeg-space-2); }
        .ig-mb-3 { margin-bottom: var(--iyeg-space-3); }
        .ig-mb-4 { margin-bottom: var(--iyeg-space-4); }
        .ig-mb-8 { margin-bottom: var(--iyeg-space-8); }
        .ig-mx-auto { margin-left: auto; margin-right: auto; }
        .ig-p-0 { padding: 0; }
        .ig-p-4 { padding: var(--iyeg-space-4); }
        .ig-pr-0 { padding-right: 0; }

        /* Flex Utilities */
        .ig-flex { display: flex; }
        .ig-flex-col { flex-direction: column; }
        .ig-items-center { align-items: center; }
        .ig-items-start { align-items: flex-start; }
        .ig-items-end { align-items: flex-end; }
        .ig-justify-between { justify-content: space-between; }
        .ig-justify-center { justify-content: center; }
        .ig-justify-end { justify-content: flex-end; }
        .ig-gap-2 { gap: var(--iyeg-space-2); }
        .ig-gap-4 { gap: var(--iyeg-space-4); }

        /* Image Utilities */
        .ig-image-full {
            width: 100%;
            height: 100%;
            object-fit: cover;
        }


        /* ===== HERO SECTION ===== */
        .hero-section {
            height: 50vh;
            min-height: 300px;
            margin-top: 6.5rem;
            background-image: linear-gradient(rgba(10, 37, 64, 0.7), rgba(10, 37, 64, 0.7)), url('/assets/images/pages/about/iyeg-about-bg.png');
            background-size: cover;
            background-position: center;
            display: flex;
            align-items: center;
            justify-content: center;
            text-align: center;
        }

       

        @media (max-width: 480px) {
            
            .hero-section {
                height: 40vh;
            }
        }
        
        /* ===== MISSION & VISION SECTION (BEM) ===== */
.iyeg-mission {
    padding: 5rem 0;
    background-color: var(--iyeg-bg-light);
    width: 100%;
}

.iyeg-mission__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4rem;
    align-items: center;
}

/* Image styling */
.iyeg-mission__image img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: var(--iyeg-radius-xl);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
    object-fit: cover;
}

/* Content wrapper */
.iyeg-mission__content {
    display: flex;
    flex-direction: column;
    gap: 2.5rem;
}

/* Individual Block (Mission or Vision) */
.iyeg-mission__title {
    font-size: 2.25rem;
    font-weight: 700;
    color: var(--iyeg-primary);
    margin-bottom: 1rem;
}

.iyeg-mission__text {
    font-size: 1.125rem;
    color: var(--iyeg-text-body);
    line-height: 1.7;
    margin: 0;
}

/* Responsive adjustments */
@media (max-width: 1024px) {
    .iyeg-mission__grid {
        grid-template-columns: 1fr;
        gap: 3rem;
    }
    
    .iyeg-mission__image {
        max-width: 800px;
        margin: 0 auto;
    }

    .iyeg-mission__content {
        text-align: center;
    }
}

@media (max-width: 768px) {
    .iyeg-mission {
        padding: 3rem 0;
    }
    
    .iyeg-mission__title {
        font-size: 1.85rem;
    }
    
    .iyeg-mission__text {
        font-size: 1rem;
    }
}