:root {
            --primary-red: #CF2027;
            --primary-black: #000;
            --primary-white: #fff;
            --secondary-gray: #4E4E4E;
            --tertiary-purple: #783B88;
        }

        /* Font Styles */
        h1 {
            font-family: 'Times New Roman', serif;
            color: var(--primary-white);
            /* Assuming h1 is in the header, which is white text */
        }

        /* Sub-headings (e.g., h2, h3, or specific classes) */
        .sub-heading {
            font-family: 'Mulish', sans-serif;
            font-weight: 600;
            /* Mulish SemiBold for sub-headings */
            color: var(--primary-black);
            /* Default for sub-headings */
        }

        .sub-heading.text-white {
            color: var(--primary-white) !important;
        }

        /* Paragraphs */
        p {
            font-family: 'Mulish', sans-serif;
            font-weight: 400;
            /* Mulish Regular for paragraphs */
            color: var(--secondary-gray);
            /* Default for paragraphs */
        }

        p.text-white {
            color: var(--primary-white) !important;
        }

        /* Sub-paragraphs (e.g., smaller text, descriptions) */
        .sub-paragraph {
            font-family: 'Montserrat', sans-serif;
            font-weight: 400;
            /* Montserrat Regular for sub-paragraphs */
            font-size: 0.9rem;
            /* Slightly smaller font size */
            color: var(--secondary-gray);
            /* Default for sub-paragraphs */
        }

        .sub-paragraph.text-white {
            color: var(--primary-white) !important;
        }

        /* Header Section Styling */
        .header-section {
            padding: 80px 0;
            position: relative;
            overflow: hidden;
            /* To contain the absolute positioned image */
            min-height: 400px;
            /* Ensure enough height */
            display: flex;
            align-items: center;
            background: linear-gradient(90deg, var(--primary-red) 0%, var(--tertiary-purple) 100%);

        }

        .header-illustration {
            position: absolute;
            left: 0;
            top: 0;
            height: 100%;
            /* Cover the height of the section */
            width: auto;
            opacity: 0.2;
            /* Make it subtle */
            z-index: 1;
            transform: translateX(-20%);
            /* Adjust position */
        }

        .header-content {
            position: relative;
            z-index: 2;
            text-align: center;
            color: var(--primary-white);
        }

        .header-content svg {
            position: relative;
            top: -48px;
        }

        .header-content h1 {
            font-size: 10rem;
            /* Larger font for main heading */
            margin-bottom: 10px;
            font-weight: 700;
            max-width: 500px;
            text-align: left;
        }

        .header-content p {
            font-size: 1.2rem;
            max-width: 700px;
            color: var(--primary-white);
            text-align: left;
            /* Ensure paragraph text is white */
        }

        /* Values Section Styling */
        .values-section {
            padding: 80px 0;
            background-color: var(--primary-white);
        }

        .value-item {

            padding: 30px;
           
        }

        .value-item .sub-heading {
            margin-bottom: 5px;
            font-size: 1.3rem;
            color: var(--primary-red);
            /* Highlight value names */
        }

        .value-item .sub-paragraph {
            line-height: 1.6;
             max-width: 275px;
        }


   

        /* Responsive adjustments */
        @media (max-width: 768px) {
            .header-content h1 {
                font-size: 2.5rem;
            }

            .header-content p {
                font-size: 1rem;
            }

            .header-illustration {
                display: none;
                /* Hide illustration on smaller screens */
            }
             .header-section {
                padding: 40px 0;
             }
             .values-section{
                padding: 20px 0;
             }
        }