.about-us-image-card::before {
    bottom: 0.5rem;
    inset-inline-end: -2.1875rem;
    width: 4.375rem;
    height: calc(100% - 50px);
    background-image: url(../images/about-us-image-card-pattern.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: left bottom;
}

.about-us-image-card::before, .about-us-image-card::after {
    content: "";
    position: absolute;
    z-index: -1;
}

.vision-and-mission-image-card::after {
    bottom: -3.4375rem;
    inset-inline-start: -4.25rem;
    width: 23.75rem;
    height: 28.75rem;
    background-color: rgba(145, 182, 187, 0.24);
    border-end-start-radius: 2.5rem;
}




.vision-and-mission-image-card > img {
    width: 100%;
    height: 31.25rem !important;
    object-fit: cover;
    border-start-start-radius: 2.5rem;
}

.about-us-image-card > img {
    width: 100%;
    height: 28.125rem !important;
    object-fit: cover;
    border-radius: 0.875rem;
}

.clr-light {
    color: #161616 !important;
}

.section-description {
    font-size: 18px;
    color: var(--clr-secondary);
    text-align: start;
    margin-bottom: 0;
}

/* Button states for this page come from the global DGA ramp (styles.min.css
   .btn-primary/.btn-outline-primary, StyleSheet.css .btn-cta-*/a.btn-ssp-style).
   The dead .btn-green copy, the bootstrap-identical .btn:hover copy and the
   transparent .btn-primary:hover override were removed in the 2026-09-14
   CTA-unification round. No .btn-green/.btn-primary markup exists on the
   sitemap pages, so this is zero-visual-change. */

.py-2 {
    padding-top: .5rem !important;
    padding-bottom: .5rem !important;
}

.px-3 {
    padding-right: 1rem !important;
    padding-left: 1rem !important;
}

/* Scoped to page content: a bare `ul` rule leaks into the master
   header dropdown sub-items on site-map pages, painting disc markers
   and 40px indentation onto the chrome. */
#main-content ul {
    display: block;
    list-style-type: disc;
    margin-block-start: 1em;
    margin-block-end: 1em;
    padding-inline-start: 40px;
    unicode-bidi: isolate;
}

tbody, td, tfoot, th, thead, tr {
    border-color: inherit;
    border-style: solid;
    border-width: 0;
    font-family: boldFont;
    font-size: 13px !important;
    padding: 5px;
}

.toc-layout-main .dfwp-list li a {
    position: relative;
    z-index: 1;
    display: inline-block;
    padding: 0.3em 1em 0.7em;
    border-radius: 4px;
    background: #f3fcf6;
    font-weight: normal;
    text-decoration: none;
    color: var(--clr-primary);
    font-size: 15px !important;
    transition: all 0.2s linear;
}

.toc-layout-main .dfwp-list li a:hover {
    background-color: #1B8354;
    color: #fff;
    outline: 0;
    box-shadow: none;
}

.toc-layout-main .dfwp-list li a::before {
    content: "";
    height: 100%;
    inset-inline-start: 0;
    position: absolute;
    inset-inline-end: 100%;
    bottom: 0;
    z-index: -1;
    border-radius: 4px;
    background-color: #1B8354;
    transition: all 0.2s linear;
}

@media (max-width: 768px) {
    .toc-layout-main .dfwp-list .level-section > ul > li {
        padding-bottom: 15px;
        margin: 0 1em;
    }

    .toc-layout-main .dfwp-list {
        flex-flow: row column;
        padding: 20px !important;
        position: relative;
        margin-bottom: 1em;
        display: flex;
        flex-direction: column;
    }
}

hr {
    margin: 0px !important;
    color: #f3fcf6 !important;
    border: 0;
    border-top: var(--bs-border-width) solid;
    opacity: .25;
}

.section-title {
    font-size: calc(1.75rem + 0.8vw);
    color: #161616;
    text-align: right !important;
    margin-bottom: 0.5rem;
}

.breadcrumb {
    direction: rtl;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    font-size: 14px;
    color: #333;
    padding: 8px 12px;
    background: #f3fcf6 !important;
    padding-right: 5%;
}

.breadcrumb {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    font-size: 14px;
    color: #333;
    padding: 8px 12px;
    background: #f3fcf6 !important;
    padding-right: 5%;
}
    

.vision-and-mission-image-card::before, .vision-and-mission-image-card::after {
    content: "";
    position: absolute;
    z-index: -1;
}