/* =========================================
   ABOUT US SECTION - IMAGE BACKGROUND + WHITE/GOLD TEXT
   Uses About-Us.png with maroon overlay
   FORCES background through multiple selectors
   ========================================= */

/* About Us Section - Force Image Background via class */
.about-us-section {
    background:
        linear-gradient(135deg, rgba(128, 0, 32, 0.90), rgba(10, 10, 20, 0.95)),
        url('../images/About-Us.png') center/cover fixed !important;
    position: relative !important;
}

/* ALSO target by content - "The Home of Integrity" text */
section:has(h2:contains("Integrity")):has(h2:contains("Justice")),
section:has([style*="About Us"]),
.wka-front-page-content section:has(span:contains("About Us")),
.wka-front-page-content>.wp-block-html:nth-of-type(5)>section,
.wka-page-content section:has([style*="About Us"]),
.page-template-page-about .wka-page-content {
    background:
        linear-gradient(135deg, rgba(128, 0, 32, 0.90), rgba(10, 10, 20, 0.95)),
        url('../images/About-Us.png') center/cover fixed !important;
    position: relative !important;
}

/* Target inline style with linear gradient (About Us has this specific pattern) */
section[style*="linear-gradient(135deg, rgba(128,0,32,0.90)"][style*="About-Us.png"],
section[style*="About-Us.png"] {
    background:
        linear-gradient(135deg, rgba(128, 0, 32, 0.90), rgba(10, 10, 20, 0.95)),
        url('../images/About-Us.png') center/cover fixed !important;
}

/* ALL Headings in About Us Section - WHITE */
.about-us-section h2,
section[style*="About-Us.png"] h2,
section:has(span[style*="About Us"]) h2 {
    color: #ffffff !important;
    text-shadow: 0 2px 10px rgba(0, 0, 0, 0.3) !important;
}

/* Title accent spans - GOLD */
.about-us-section h2 span,
section[style*="About-Us.png"] h2 span {
    color: #FFD700 !important;
}

/* H4 headings (Vision/Mission) - GOLD */
.about-us-section h4,
section[style*="About-Us.png"] h4 {
    color: #FFD700 !important;
}

/* ALL Paragraphs - WHITE */
.about-us-section p,
section[style*="About-Us.png"] p {
    color: rgba(255, 255, 255, 0.9) !important;
}

/* Strong/Bold text - GOLD */
.about-us-section strong,
section[style*="About-Us.png"] strong {
    color: #FFD700 !important;
}

/* Section Tag badge - GOLD */
.about-us-section span[style*="border-radius: 50px"],
section[style*="About-Us.png"] span[style*="border-radius"] {
    background: rgba(255, 215, 0, 0.15) !important;
    color: #FFD700 !important;
    border: 1px solid rgba(255, 215, 0, 0.35) !important;
}

/* Icons - GOLD */
.about-us-section i,
section[style*="About-Us.png"] i {
    color: #FFD700 !important;
}

/* Vision/Mission Cards - Glass Effect */
.about-us-section [style*="backdrop-filter"],
section[style*="About-Us.png"] [style*="backdrop-filter"] {
    background: rgba(255, 255, 255, 0.08) !important;
    backdrop-filter: blur(15px) !important;
    -webkit-backdrop-filter: blur(15px) !important;
    border: 1px solid rgba(255, 215, 0, 0.25) !important;
}

/* Responsive */
@media (max-width: 1024px) {

    .about-us-section [style*="grid-template-columns: 1fr 1fr"],
    section[style*="About-Us.png"] [style*="grid-template-columns: 1fr 1fr"] {
        grid-template-columns: 1fr !important;
    }
}

@media (max-width: 768px) {

    .about-us-section h2,
    section[style*="About-Us.png"] h2 {
        font-size: 1.75rem !important;
    }
}
/* Page Template Support */
.page-template-page-about .wka-page-content {
    background:
        linear-gradient(135deg, rgba(128, 0, 32, 0.90), rgba(10, 10, 20, 0.95)),
        url('../images/About-Us.png') center/cover fixed !important;
    position: relative !important;
    padding: 80px 0 !important;
}
