/* Global Styles */
body {
    font-family: 'Poppins', sans-serif;
    font-size: 16px; /* Base font size */
    line-height: 1.6; /* Improve readability */
    color: #181C14; /* Text color from your palette */
}

/* Style for headings (h1, h2, h3, etc.) */
h1, h2, h3, h4, h5, h6 {
    font-family: 'Poppins', sans-serif;
    font-weight: 700; /* Bold weight for headlines */
    color: #5433FF; /* Primary color from your palette */
    margin-top: 20px;
    margin-bottom: 10px;
}

/* Optional: Style for buttons */
/*button, .btn {
    font-family: 'Poppins', sans-serif;
    font-weight: 700;
}*/

button, .btn {
    background-color: #5433FF !important;
    color: #FFFFFF !important; /* White text for contrast */
    border: none;
    padding: 10px 20px;
    border-radius: 5px;
    cursor: pointer;
}

button:hover, .btn:hover {
    background-color: #3A24CC !important; /* Slightly darker shade for hover effect */
}


/* Existing Hero Section Styles */
.hero-section {
    padding: 4rem 0;
    background: rgba(198, 133, 214, 0.1); /* Glass effect */
    border-radius: 1rem;
    margin: 2rem 0;
}

.headline {
    color: #5433FF;
}

/* Style for footer links */
footer a {
    color: #5433FF; /* Matches the top navigation link color */
    text-decoration: none; /* Removes underline */
}

/* Hover effect for footer links */
footer a:hover {
    color: #3A24CC; /* Slightly darker shade for hover */
    text-decoration: underline; /* Adds underline on hover */
}

/* Custom primary text color */
.text-primary-custom {
    color: #5433FF !important; /* Matches the primary color */
}

/* Custom Tag Styling */
.tag-custom {
    background-color: #5433FF; /* Matches your primary color */
    color: #FFFFFF; /* White text for contrast */
    padding: 5px 10px; /* Adjust padding as needed */
    border-radius: 5px; /* Rounded corners */
    font-size: 14px; /* Adjust font size */
    text-decoration: none; /* Remove underline */
    display: inline-block; /* Ensure proper alignment */
    margin: 2px; /* Space between tags */
}

.tag-custom:hover {
    background-color: #3A24CC; /* Slightly darker shade for hover */
}



#feature-comparison td, #feature-comparison th {
    text-align: center !important; /* Horizontally center all table cells */
  }