/* lets make header fonts slimmer */
h1, h2, h3, h4, h5 {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    font-weight: 300;
    line-height: 1.2;
}

h1 {
    font-size: 2.5rem;
}

h2 {
    font-size: 2rem;
}

h3 {
    font-size: 1.75rem;
}

h4 {
    font-size: 1.5rem;
}

h5 {
    font-size: 1.25rem;
}


/* Style for form container */
.signup-form-container {
    max-width: 600px; /* Adjust the maximum width of the form container */
    margin: 0 auto; /* Center the form container */
    padding: 20px; /* Add some padding */
    border: 1px solid #ddd; /* Add border */
    border-radius: 10px; /* Add rounded corners */
    background-color: #f9f9f9; /* Set background color */
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); /* Add a subtle shadow */
}

/* Style for form fields */
.signup-form-container .form-field {
    margin-bottom: 15px; /* Add some space between fields */
}

.signup-form-container .form-field label {
    display: block; /* Make labels block elements */
    margin-bottom: 5px; /* Add some space below labels */
    font-weight: bold; /* Make labels bold */
    color: #333; /* Set label color */
}

.signup-form-container .form-field input[type="text"],
.signup-form-container .form-field input[type="email"],
.signup-form-container .form-field input[type="password"] {
    width: 100%; /* Make input fields full width */
    padding: 10px; /* Add padding inside input fields */
    border: 1px solid #ccc; /* Add border */
    border-radius: 5px; /* Add rounded corners */
    box-sizing: border-box; /* Ensure padding doesn't affect total width */
    font-size: 14px; /* Set font size */
    color: #555; /* Set text color */
}

.signup-form-container .form-field input[type="text"]:focus,
.signup-form-container .form-field input[type="email"]:focus,
.signup-form-container .form-field input[type="password"]:focus {
    border-color: #007bff; /* Change border color on focus */
    outline: none; /* Remove outline */
}

/* Style for turnstile */
.signup-form-container .form-field .turnstile {
    margin-top: 10px; /* Add some space above the turnstile */
}

/* Style for submit and reset buttons */
.signup-form-container .form-buttons {
    display: flex; /* Use flexbox for buttons */
    justify-content: space-between; /* Space buttons evenly */
}

.signup-form-container .form-buttons button {
    padding: 10px 20px; /* Add padding inside buttons */
    border: none; /* Remove border */
    border-radius: 5px; /* Add rounded corners */
    background-color: #007bff; /* Set background color */
    color: #fff; /* Set text color */
    cursor: pointer; /* Change cursor on hover */
    font-size: 14px; /* Set font size */
    transition: background-color 0.3s; /* Add transition effect */
}

.signup-form-container .form-buttons button[type="reset"] {
    background-color: #6c757d; /* Set different background color for reset button */
}

.signup-form-container .form-buttons button:hover {
    background-color: #0056b3; /* Darken background color on hover */
}

.signup-form-container .form-buttons button[type="reset"]:hover {
    background-color: #5a6268; /* Darken background color for reset button on hover */
}


/* Pricing Page Styles */