/* GLOBAL RESET STYLE SHEET CONTROL */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: Arial, Helvetica, sans-serif;
}

body {
    background-color: #ffffff;
    color: #333333;
    overflow-x: hidden;
}

.site-container {
    width: 95%;
    max-width: 1220px;
    margin: 0 auto;
}

.text-center { text-align: center; }
.background-soft-gray { background-color: #f8fafc; }
.block-section-padding { padding: 50px 0; }
.flex-space { display: flex; justify-content: space-between; align-items: center; }

/* 1. TOP UTILITY STRIP STYLE BAR */
.top-header-strip {
    background-color: #012042;
    color: #ffffff;
    padding: 8px 0;
    font-size: 12.5px;
}
.contact-meta-info span { margin-right: 18px; }
.contact-meta-info i { color: #2e7d32; margin-right: 5px; }
.social-meta-info { display: flex; align-items: center; gap: 14px; }
.social-meta-info a { color: #ffffff; text-decoration: none; font-size: 13px; }
.btn-donate-top-nav { background-color: #2e7d32; padding: 4px 12px; border-radius: 4px; font-weight: bold; font-size: 11px; }

/* 2. MAIN NAVBAR CONTROLS STYLE Layout */
.main-site-navbar {
    background: #ffffff;
    box-shadow: 0 3px 10px rgba(0,0,0,0.05);
    position: sticky;
    top: 0;
    z-index: 999;
}
.brand-identity-logo { display: flex; align-items: center; gap: 10px; }
.brand-identity-logo img { max-height: 52px; display: block; }
.brand-logo-text { font-size: 18px; font-weight: 800; color: #03346e; letter-spacing: 0.3px; }
.navigation-menu-links ul { display: flex; list-style: none; gap: 18px; }
.navigation-menu-links a { text-decoration: none; color: #444444; font-weight: bold; font-size: 12.5px; padding-bottom: 4px; display: inline-block; }
.navigation-menu-links a:hover, .navigation-menu-links a.current-active-page { color: #2e7d32; border-bottom: 3px solid #2e7d32; }
.navigation-menu-links .login-nav-btn {
    background: linear-gradient(135deg, #2e7d32, #4caf50);
    color: #ffffff !important;
    padding: 8px 13px;
    border-radius: 4px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border-bottom: none !important;
}
.navigation-menu-links .login-nav-btn:hover { color: #ffffff !important; border-bottom: none !important; }

/* 3. HERO BLUE TITLE BANNER */
.about-main-hero {
    background: linear-gradient(rgba(2, 35, 71, 0.93), rgba(3, 52, 110, 0.96)), 
                url('https://via.placeholder.com/1200x300?text=Children+Classroom+Blur+BG') no-repeat center center;
    background-size: cover;
    color: #ffffff;
    padding: 55px 0;
}
.about-main-hero h1 { font-size: 30px; font-weight: bold; margin-bottom: 12px; letter-spacing: 0.5px; }
.hero-orange-tagline { color: #ff9100; font-size: 16px; font-weight: bold; margin-bottom: 15px; }
.hero-description-paragraph { font-size: 14px; max-width: 850px; margin: 0 auto; opacity: 0.9; line-height: 1.5; }

.breadcrumb-row-indicator { padding: 15px 0; font-size: 13px; color: #666666; border-bottom: 1px solid #edf2f7; }
.breadcrumb-row-indicator a { color: #666666; text-decoration: none; }
.active-crumb-page { color: #2e7d32; font-weight: bold; }

/* 4. WHO WE ARE / VISION / MISSION CARD STYLES */
.dynamic-triple-grid {
    display: grid;
    grid-template-columns: 1.2fr 0.9fr 0.9fr;
    gap: 25px;
}
.who-we-are-content-box h2 { color: #03346e; font-size: 18px; margin-bottom: 15px; border-bottom: 2px solid #edf2f7; padding-bottom: 6px; }
.who-we-are-content-box p { font-size: 13.5px; line-height: 1.6; color: #555; margin-bottom: 15px; text-align: justify; }
.action-btn-blue { background: #03346e; color: white; text-decoration: none; padding: 8px 14px; border-radius: 4px; font-size: 11.5px; font-weight: bold; display: inline-block; border: none; cursor: pointer; }

.our-vision-card-box { background-color: #f0fdf4; border: 1px dashed #bbf7d0; padding: 20px; border-radius: 6px; }
.card-header-flex { display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px; }
.our-vision-card-box h3 { color: #166534; font-size: 16px; }
.conceptual-icon-vision { font-size: 32px; color: #2e7d32; opacity: 0.6; }
.our-vision-card-box p { font-size: 13.5px; line-height: 1.6; color: #14532d; }

.our-mission-card-box { background-color: #f0f7ff; border: 1px dashed #bfdbfe; padding: 20px; border-radius: 6px; }
.our-mission-card-box h3 { color: #1e40af; font-size: 16px; margin-bottom: 12px; }
.mission-checklist-items { list-style: none; }
.mission-checklist-items li { font-size: 12.5px; line-height: 1.5; color: #1e3a8a; margin-bottom: 10px; display: flex; align-items: flex-start; gap: 8px; text-align: left; }
.mission-checklist-items i { color: #2e7d32; margin-top: 2px; }

/* 5. OUR CORE VALUES STYLING GRID */
.centered-section-main-title { font-size: 18px; color: #03346e; font-weight: bold; margin-bottom: 30px; letter-spacing: 0.5px; text-transform: uppercase; }
.core-values-six-column-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 15px; }
.value-card-node { background: white; border: 1px solid #e2e8f0; padding: 20px 10px; border-radius: 6px; box-shadow: 0 2px 5px rgba(0,0,0,0.02); }
.value-card-node i { font-size: 26px; margin-bottom: 10px; }
.value-card-node h4 { font-size: 13.5px; color: #333; }

.text-color-blue { color: #0076f5; } .text-color-green { color: #2e7d32; } .text-color-red { color: #d32f2f; }
.text-color-teal { color: #00796b; } .text-color-orange { color: #f57c00; } .text-color-purple { color: #7b1fa2; }

/* 6. OBJECTIVES & FOCUS TWIN COLUMN LAYOUT */
.twin-column-split-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; }
.sub-block-heading-line { font-size: 16px; color: #03346e; font-weight: bold; margin-bottom: 20px; text-transform: uppercase; border-bottom: 2px solid #f1f5f9; padding-bottom: 8px; }

.objectives-arrow-list-style { list-style: none; }
.objectives-arrow-list-style li { font-size: 13px; color: #444; margin-bottom: 12px; display: flex; align-items: center; gap: 10px; }
.objectives-arrow-list-style i { color: #2e7d32; font-size: 14px; }

.focus-areas-eight-tile-matrix { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.focus-matrix-tile { border: 1px solid #e2e8f0; padding: 14px; border-radius: 6px; display: flex; align-items: center; gap: 12px; background: #ffffff; }
.focus-matrix-tile i { font-size: 20px; color: #03346e; }
.focus-matrix-tile p { font-size: 12.5px; font-weight: bold; color: #444; }

/* 7. OUR JOURNEY HORIZONTAL TIMELINE */
.horizontal-timeline-axis-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; margin-top: 15px; }
.timeline-individual-node { background: white; border: 1px solid #e2e8f0; padding: 20px 15px; border-radius: 6px; text-align: left; }
.node-year-badge { display: inline-block; padding: 3px 10px; color: white; font-weight: bold; font-size: 12px; border-radius: 3px; margin-bottom: 10px; }
.badge-yellow { background: #ff9100; } .badge-blue { background: #0076f5; } .badge-orange { background: #e65100; } .badge-purple { background: #7b1fa2; }
.timeline-individual-node h4 { font-size: 14px; color: #03346e; margin-bottom: 8px; }
.timeline-individual-node p { font-size: 12px; color: #666; line-height: 1.4; }

/* 8. FOUNDER & MANAGEMENT PROFILE CONTROLS */
.chairman-avatar-flex-info { display: flex; gap: 20px; align-items: flex-start; margin-bottom: 15px; }
.chairman-avatar-flex-info img { border-radius: 6px; border: 1px solid #ddd; object-fit: cover; }
.chairman-credentials h3 { font-size: 16px; color: #03346e; margin-bottom: 4px; }
.chairman-credentials strong { font-size: 12.5px; color: #555; display: block; margin-bottom: 8px; line-height: 1.4; }
.chairman-credentials p { font-size: 13px; color: #666; line-height: 1.4; }

.chairman-quote-text-box { background: #f8fafc; border-left: 4px solid #2e7d32; padding: 12px; font-size: 12.5px; font-style: italic; color: #4a5568; margin-bottom: 15px; line-height: 1.5; }
.chairman-quote-text-box cite { display: block; text-align: right; font-weight: bold; margin-top: 6px; font-size: 11.5px; color: #333; }
.action-btn-green { background: #2e7d32; color: white; border: none; padding: 8px 15px; border-radius: 4px; font-size: 12px; font-weight: bold; cursor: pointer; }

.team-brief-para { font-size: 13px; color: #666; margin-bottom: 15px; text-align: left; }
.team-six-block-photo-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.team-photo-item-node { background: white; border: 1px solid #e2e8f0; border-radius: 4px; padding: 6px; text-align: center; }
.team-photo-item-node img { width: 100%; border-radius: 3px; height: 85px; object-fit: cover; }
.team-photo-item-node h5 { font-size: 11.5px; color: #03346e; margin-top: 6px; }

/* 9. LIVE METRICS QUANTITATIVE COUNTER BAR */
.live-metrics-counter-bar { background: #f0f4f8; padding: 35px 0; border-top: 1px solid #d0dbe5; border-bottom: 1px solid #d0dbe5; }
.live-counter-grid-eight-columns { display: grid; grid-template-columns: repeat(8, 1fr); gap: 10px; }
.counter-card-item h3 { font-size: 22px; color: #2e7d32; font-weight: bold; margin-bottom: 4px; }
.counter-card-item p { font-size: 11.5px; color: #444; font-weight: 600; }

/* WHY CHOOSE US & PARTNERS GRID */
.why-choose-us-two-column-checks { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; font-size: 12.5px; color: #444; text-align: left; }
.why-choose-us-two-column-checks i { margin-right: 6px; font-size: 11px; }
.icon-check-green { color: #2e7d32; }

.corporate-brand-logos-six-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.corporate-brand-logos-six-grid img { width: 100%; border: 1px solid #edf2f7; padding: 8px; border-radius: 4px; background: white; }
.view-all-redirect-links { text-decoration: none; font-size: 12px; font-weight: bold; color: #03346e; }

/* 10. TRANSPARENCY TILES & CERTIFICATE STRIPS */
.transparency-six-tile-row-layout { display: grid; grid-template-columns: repeat(6, 1fr); gap: 12px; margin-bottom: 15px; }
.transparency-individual-card { background: white; border: 1px solid #cbd5e1; padding: 15px 5px; border-radius: 4px; }
.transparency-individual-card i { font-size: 22px; color: #03346e; margin-bottom: 8px; }
.transparency-individual-card p { font-size: 11px; font-weight: bold; color: #555; }
.view-more-governance-btn { text-decoration: none; font-size: 12px; font-weight: bold; color: #03346e; display: inline-block; }

.awards-certificates-row-strip { display: flex; justify-content: center; gap: 15px; flex-wrap: wrap; margin-top: 15px; }
.awards-certificates-row-strip img { border: 1px solid #cbd5e1; padding: 4px; background: white; border-radius: 4px; max-height: 95px; }

/* 11. PILLS CALL TO ACTION STRIP */
.footer-call-to-action-panel { background: #011d3a; color: white; padding: 35px 0; }
.footer-call-to-action-panel h2 { font-size: 20px; margin-bottom: 8px; letter-spacing: 0.5px; }
.footer-call-to-action-panel p { font-size: 13px; max-width: 900px; margin: 0 auto 20px auto; opacity: 0.85; line-height: 1.5; }
.action-buttons-pills-row { display: flex; justify-content: center; gap: 12px; flex-wrap: wrap; }
.individual-pill { text-decoration: none; padding: 10px 18px; color: white; font-weight: bold; border-radius: 4px; font-size: 12.5px; display: inline-block; }
.pill-green { background: #2e7d32; } .pill-red { background: #c62828; } .pill-orange { background: #ef6c00; } .pill-blue { background: #0066cc; }

/* 12. DEEP SYSTEM ORGANIZATIONAL FOOTER MAP */
.system-corporate-deep-footer { background: #011226; color: #cbd5e1; font-size: 13px; padding: 40px 0 0 0; border-top: 4px solid #2e7d32; text-align: left; }
.deep-footer-four-column-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 35px; padding-bottom: 30px; }
.system-corporate-deep-footer h3 { color: white; font-size: 14px; margin-bottom: 15px; border-bottom: 1px solid #13273d; padding-bottom: 6px; font-weight: bold; }
.footer-contact-line { margin-bottom: 10px; line-height: 1.4; opacity: 0.9; font-size: 12.5px; }
.system-corporate-deep-footer i { margin-right: 6px; color: #2e7d32; }

.footer-social-circular-icons { display: flex; gap: 10px; margin-top: 10px; }
.footer-social-circular-icons a { width: 30px; height: 30px; background: #13273d; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: white; text-decoration: none; font-size: 12px; transition: 0.2s; }
.footer-social-circular-icons a:hover { background: #2e7d32; }

.footer-navigation-vertical-list { list-style: none; }
.footer-navigation-vertical-list li { margin-bottom: 8px; }
.footer-navigation-vertical-list a { color: #cbd5e1; text-decoration: none; font-size: 12.5px; }
.footer-navigation-vertical-list a:hover { color: white; text-decoration: underline; }

.footer-newsletter-inline-form { display: flex; margin-top: 10px; }
.footer-newsletter-inline-form input { padding: 8px; border: none; border-radius: 4px 0 0 4px; width: 70%; font-size: 12px; outline: none; }
.footer-newsletter-inline-form button { background: #2e7d32; color: white; border: none; padding: 8px 12px; font-size: 11px; font-weight: bold; border-radius: 0 4px 4px 0; cursor: pointer; }

.footer-base-copyright-strip { border-top: 1px solid #13273d; padding: 20px 0; font-size: 11.5px; opacity: 0.8; }
.footer-base-copyright-strip a { color: #cbd5e1; text-decoration: none; }

/* RESPONSIVE DISPLAYS CONTROL FOR MOBILE RESPONSIVENESS */
@media (max-width: 992px) {
    .dynamic-triple-grid, .twin-column-split-layout, .horizontal-timeline-axis-row, .live-counter-grid-eight-columns, .transparency-six-tile-row-layout, .deep-footer-four-column-grid, .core-values-six-column-grid {
        grid-template-columns: 1fr !important;
    }
    .live-counter-grid-eight-columns { text-align: center; gap: 15px; }
    .chairman-avatar-flex-info { flex-direction: column; align-items: center; text-align: center; }
    .corporate-brand-logos-six-grid { grid-template-columns: 1fr 1fr 1fr; }
}