/* Style for the why-choose-us section */
#why-choose-us {
    background-color: #f9f9f900; /* Soft background */
    padding: 60px 20px; /* Padding around the section */
    margin: 0 auto; /* Center the section */
    font-family: 'Arial', sans-serif; /* Clean, professional font */
    text-align: left; /* Align text to the left for list style */
}

/* Style for the main heading */

#why-choose-us h2 {
    color: #000; /* Black color for contrast */
    font-size: 42px; /* Larger font for emphasis */
    font-weight: bold; /* Only the Why Choose Us title is bold */
    text-align: center; /* Center the main heading */
    margin-bottom: 40px; /* Space below the main heading */
}

/* List styling for the subheadings */
#why-choose-us ul {
    list-style-type: none; /* Remove default bullet points */
    padding: 0; /* Remove padding */
}

#why-choose-us ul li {
    margin-bottom: 30px; /* Space between each list item */
    position: relative; /* To position the custom bullet */
}

/* Custom bullet for subheadings */
#why-choose-us ul li::before {
    content: "\2022"; /* Unicode for bullet */
    color: #ff6600; /* Custom orange color for the bullet */
    font-size: 30px; /* Size of the bullet */
    position: absolute; /* Position the bullet */
    left: -30px; /* Align bullet to the left of the text */
    top: 5px; /* Adjust bullet vertically */
}

/* Style for the subheadings */
#why-choose-us ul li h3 {
    color: #333; /* Slightly lighter than black for subheadings */
    font-size: 24px; /* Adequate size for subheadings */
    font-weight: normal; /* Not bold */
    display: inline; /* Keep the heading inline with the bullet */
}

/* Style for paragraphs */
#why-choose-us ul li p {
    color: #666; /* Grey color for paragraph text */
    font-size: 18px; /* Readable font size */
    line-height: 1.6; /* Line spacing for readability */
    margin-top: 10px; /* Space below each heading */
}

/* Make the section responsive for smaller screens */
@media (max-width: 768px) {
    #why-choose-us {
        padding: 40px 20px; /* Reduce padding for smaller screens */
        max-width: 90%; /* Adjust width to be responsive */
    }

    #why-choose-us h2 {
        font-size: 36px; /* Adjust font size on smaller screens */
    }

    #why-choose-us ul li h3 {
        font-size: 22px; /* Adjust subheading size */
    }

    #why-choose-us ul li p {
        font-size: 16px; /* Smaller paragraph font for mobile */
    }
}