.container6 {
    margin: 0 auto;
}

    .story3 {
    margin: 0 auto;
    color: black;
    font-weight: bold;
    font-size: 40px;
    text-align: center;
    padding: 10px;
    
}

.story2 {
    margin-left: 50px;
    margin-right: 50px;
    padding: 10px;
    text-align: justify;
    font-size: 18px;
}
p, h2{
    text-align: left;

}
img{
    border-radius: 8px;
}



.container5 {
    width: 100px;
   
    margin: 0;
    overflow: hidden;
    position: relative;
}

.container5 img {
   
    width: 100%;
    height: 100px;
    object-fit: cover; /* Ensures the image covers the entire container */
    display: block;
}

.image-overlay::after {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 399px; /* Ensures the overlay matches the image size */
background: rgba(0, 0, 0, 0.5); /* Adjust the opacity to make the image dimmer */
z-index: 1;
margin-bottom: 30px;
}
.heading20 {
position: absolute;
top: 50%; /* Centers the text vertically */
left: 50%; /* Centers the text horizontally */
transform: translate(-50%, -50%); /* Adjusts the centering */
color: white;
background: transparent; /* Remove background color */
font-size: 80px;
font-weight: bold;
text-align: center;
margin: 0;
z-index: 2; /* Ensure the heading appears above the overlay */
}

body {
    -webkit-user-select: none; /* Safari */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* IE10+/Edge */
    user-select: none; /* Standard */
}

.roles {
    margin: 15px 15px;
    align-items: center;
}

.role2 {
    text-align: center;
    color: purple;
}

.activities {
    margin: 0 auto;
    text-align: justify;
    padding-left: 20px;
    padding-right: 20px;
}

.content1 {
    color: blueviolet;
    font-weight: bold;
    font-size: 50px;
}

.text-white img {
    margin-left: 2px;
    padding: 10px;
    width: 50px;
    height: 50px;
    border-radius: 20px;
}

.about-impact-section {
    background: #f6f0fb;
    padding: 60px 0;
}

.impact-card {
    background: #ffffff;
    border-radius: 16px;
    padding: 24px 16px;
    box-shadow: 0 12px 30px rgba(24, 8, 51, 0.08);
    height: 100%;
}

.impact-number {
    font-size: 32px;
    font-weight: 700;
    color: #3b0b5a;
    margin-bottom: 8px;
}

.impact-label {
    font-size: 14px;
    letter-spacing: 0.4px;
    text-transform: uppercase;
    color: #6b6b6b;
}

.about-approach-section {
    padding: 70px 0;
}

.approach-title {
    font-size: 36px;
    font-weight: 700;
    color: #2d0a43;
    margin-bottom: 12px;
}

.approach-lead {
    font-size: 18px;
    color: #444444;
    line-height: 1.7;
}

.value-card {
    background: #ffffff;
    border-radius: 16px;
    padding: 20px;
    box-shadow: 0 10px 24px rgba(24, 8, 51, 0.08);
    height: 100%;
}

.value-title {
    font-size: 18px;
    font-weight: 700;
    color: #4a1172;
    margin-bottom: 6px;
}

.value-text {
    font-size: 14px;
    color: #555555;
    line-height: 1.6;
}

.about-timeline-section {
    background: #f8f8f8;
    padding: 70px 0;
}

.timeline-title {
    text-align: center;
    font-size: 32px;
    font-weight: 700;
    margin-bottom: 32px;
    color: #2d0a43;
}

.timeline {
    display: grid;
    gap: 16px;
}

.timeline-item {
    background: #ffffff;
    border-radius: 14px;
    padding: 18px 20px;
    display: grid;
    grid-template-columns: 80px 1fr;
    gap: 16px;
    align-items: center;
    box-shadow: 0 10px 22px rgba(24, 8, 51, 0.06);
}

.timeline-year {
    font-size: 20px;
    font-weight: 700;
    color: #4a1172;
}

.timeline-body {
    color: #4d4d4d;
    line-height: 1.6;
}

.about-cta-section {
    padding: 70px 0;
}

.cta-card {
    background: linear-gradient(120deg, #4a1172, #7a2bbf);
    border-radius: 20px;
    padding: 32px 36px;
    color: #ffffff;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
}

.cta-card h2 {
    color: #ffffff;
    font-size: 30px;
    margin-bottom: 10px;
}

.cta-card p {
    color: rgba(255, 255, 255, 0.85);
    margin: 0;
}

.cta-action .btn {
    padding: 10px 20px;
    font-weight: 600;
}

.vision-section {
    padding: 70px 0;
    background: #ffffff;
}

.vision-title {
    font-size: 34px;
    font-weight: 700;
    color: #2d0a43;
    margin-bottom: 12px;
}

.vision-lead {
    font-size: 18px;
    color: #444444;
    line-height: 1.7;
    margin-bottom: 24px;
}

.vision-cards {
    display: grid;
    gap: 16px;
    margin-bottom: 24px;
}

.vision-card {
    background: #f8f4ff;
    border-radius: 16px;
    padding: 18px 20px;
    box-shadow: 0 10px 22px rgba(24, 8, 51, 0.06);
}

.vision-card h3 {
    font-size: 18px;
    font-weight: 700;
    color: #4a1172;
    margin-bottom: 6px;
}

.vision-card p {
    margin: 0;
    color: #4d4d4d;
    line-height: 1.6;
}

.motto-text {
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.6px;
}

.vision-highlights h4 {
    font-size: 18px;
    font-weight: 700;
    color: #2d0a43;
    margin-bottom: 10px;
}

.vision-highlights ul {
    padding-left: 18px;
    margin: 0 0 20px;
    color: #4d4d4d;
}

.vision-highlights li {
    margin-bottom: 6px;
}

.vision-quote {
    background: #2d0a43;
    color: #ffffff;
    padding: 16px 20px;
    border-radius: 14px;
    font-style: italic;
}

.vision-image {
    margin: 0;
    text-align: center;
}

.vision-image img {
    border-radius: 16px;
    box-shadow: 0 14px 30px rgba(24, 8, 51, 0.16);
}

.vision-image figcaption {
    margin-top: 10px;
    font-size: 13px;
    color: #6b6b6b;
}

@media (max-width: 768px) {
    .approach-title {
        font-size: 28px;
    }

    .vision-title {
        font-size: 26px;
    }

    .timeline-item {
        grid-template-columns: 1fr;
        text-align: left;
    }

    .cta-card {
        text-align: left;
    }
}