:root {
            --bg: #f8f9fb;
            --text: #1a1d23;
            --muted: #6b7280;
            --accent: #0055cc;
            --accent-light: #e3ecff;
            --card: #fff;
            --container: 1200px;
            font-family: Inter, ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial;
        }

        * {
            box-sizing: border-box;
            margin: 0;
            padding: 0
        }

        body {
          background: var(--bg);
          background-color: #f8f9fb;
          /* background-color: red; */
          /* background-color: rgb(235, 227, 227); */
          /* background-image: url("../images/About-us/main2.png"); */
          /* background-repeat: no-repeat; */
          /* background-size: cover; */
          /* background-position: center; */
          /* background-attachment: fixed; */
          color: var(--text);
          line-height: 1.6;
        }

        .wrap {
        /* width: 100vw; */
        margin: 0 auto;
        /* padding: 28px; */
        /* background-color: red; */
        }

        /* Container for each */
        .cards-container {
        width: 100%;
        /* background-color: brown; */
        text-align: center;
        /* padding: 40px 0; */
        margin-bottom: 40px;
        }

        .cards-container h2 {
        color: #0055cc;
        font-size: 1.8rem;
        font-weight: 500;
        margin-bottom: 20px;
        font-family: Georgia, 'Times New Roman', Times, serif;
        }

        /* Card Layout - 3 Columns */
        .card {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
        align-items: center;
        justify-items: center;
        /* gap: 20px; */
        width: 100%;
        /* background-color: #fff; */
        padding: 10px;
        /* border-radius: 12px; */
        }

        /* Image sections */
        .cardImage,
        .cardDesign {
        background-color: transparent;
        }

        .cardImage img {
        width: 100%;
        height: 550px;
        object-fit: cover;
        border-radius: 10px;
        }

        .cardDesign img {
        width: 100%;
        height: 550px;
        object-fit: cover;
        /* border-radius: 10px; */
        }

        /* Center text section */
        .card-title {
            top: 0;
        /* background-color: aqua; */
        color: #0055cc;
        font-size: 1.2rem;
        font-weight: 600;
        padding: 10px;
        line-height: 1.6;
        }

        h4 {
        text-align: left;
        color: #000;
        font-size: medium;
        font-weight: 200;
        }

        .card-list li {
        color: #000;
        font-size: medium;
        font-weight: 200;
        text-align: left;
        margin-left: 10%;
        /* margin-bottom: 0.4rem; */
        }

        /* Responsive Design */
        @media (max-width: 1024px) {
        .card {
            grid-template-columns: 1fr 1fr;
        }
        }

        @media (max-width: 768px) {
        .card {
            grid-template-columns: 1fr;
        }

        .cardImage img,
        .cardDesign img {
            height: 200px;
        }

        .card-title {
            font-size: 1rem;
            padding: 8px;
        }

        .cards-container h2 {
            font-size: 1.4rem;
        }
        }