.elementor-6700 .elementor-element.elementor-element-e25f627{padding:50px 50px 50px 50px;}.elementor-6700 .elementor-element.elementor-element-4c0f768 > .elementor-widget-container{padding:0px 0px 50px 0px;}.elementor-6700 .elementor-element.elementor-element-4c0f768{text-align:center;}.elementor-6700 .elementor-element.elementor-element-4c0f768 .elementor-heading-title{font-family:"Prata", Sans-serif;font-size:41px;font-weight:400;}.elementor-6700 .elementor-element.elementor-element-fd50b30 .elementor-button{background-color:rgba(12,12,12,0);font-family:"Karla", Sans-serif;font-size:14px;font-weight:700;text-transform:uppercase;letter-spacing:1px;fill:#222428;color:#222428;border-radius:2px 2px 2px 2px;padding:10px 10px 10px 10px;}.elementor-6700 .elementor-element.elementor-element-fd50b30 > .elementor-widget-container{padding:0px 0px 0px 0px;}@media(max-width:767px){.elementor-6700 .elementor-element.elementor-element-e25f627{padding:30px 20px 0px 20px;}.elementor-6700 .elementor-element.elementor-element-4c0f768 > .elementor-widget-container{padding:0px 0px 20px 0px;}.elementor-6700 .elementor-element.elementor-element-4c0f768 .elementor-heading-title{font-size:29px;line-height:1.1em;}}/* Start custom CSS *//* ---------- Contact Form 7 Conversational Styles ---------- */

/* Apply "Prata" font and reduce size on the conversational question titles */
.uacf7-conv-intro-title,
.uacf7-conv-title {
    font-family: 'Prata', serif !important;
    font-size: 28px !important; /* Reduced from 36px */
    font-weight: 400 !important;
}

/* Add padding inside and around the text areas */
.wpcf7-form-control.wpcf7-textarea {
    padding: 18px !important; /* Adjust this value to increase/decrease inner spacing */
    margin-top: 10px !important; /* Adds a little breathing room above the box */
    margin-bottom: 10px !important; /* Adds breathing room below the box */
    box-sizing: border-box !important; /* Ensures the padding doesn't make the box wider than its container */
}

/* Optional: If you also want to add padding to standard single-line text inputs to match */
.wpcf7-form-control.wpcf7-text,
.wpcf7-form-control.wpcf7-email {
    padding: 18px !important;
    box-sizing: border-box !important;
}

/* Reduce the heavy 100px padding on the conversational form containers */
.uacf7-conv-single-intro-wrap,
.uacf7-conv-single-step-wrap {
    padding: 30px !important;
}

/* Increase the size of the field labels */
.wpcf7 label {
    font-size: 12pt !important;
}

/* Increase the size of the text typed inside the input fields and text areas */
.wpcf7-form-control.wpcf7-text,
.wpcf7-form-control.wpcf7-email,
.wpcf7-form-control.wpcf7-textarea {
    font-size: 18px !important; 
}


/* Un-bold the Prata font on the intro title */
.uacf7-conv-intro-title {
    font-weight: 400 !important;
}

/* Add space above the Start, Next (Ok), and Submit buttons */
.uacf7-conv-start-btn,
.uacf7-conv-next-step,
.uacf7-conv-submit {
    margin-top: 30px !important; /* Pushes the button down away from the fields */
}


/* ---------- Form Validation "Modal/Toast" Styling ---------- */
span.wpcf7-not-valid-tip {
    position: fixed !important;
    bottom: 40px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    background-color: #f8e1b4 !important; /* Soft yellow to match your current theme */
    color: #000000 !important;
    padding: 12px 24px !important;
    border-radius: 6px !important;
    box-shadow: 0 10px 25px rgba(0,0,0,0.15) !important;
    z-index: 99999 !important; /* Ensures it pops over everything else */
    font-size: 14px !important;
    font-weight: 500 !important;
    letter-spacing: 1px !important;
    text-align: center !important;
    width: auto !important;
    white-space: nowrap !important;
}

/* ---------- Conversational Form Button Styling ---------- */
.uacf7-conv-start-btn,
.uacf7-conv-next-step,
.uacf7-conv-submit {
    background-color: #222222 !important;
    color: #ffffff !important;
    border: none !important; /* Removes the default plugin border */
    border-radius: 4px !important; /* Slight rounding, adjust to 0px if you want sharp corners */
    padding: 14px 32px !important; /* Plumps up the button size */
    font-size: 16px !important;
    font-weight: 500 !important;
    transition: all 0.3s ease !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* Ensure the little double-arrows inside the buttons turn white too */
.uacf7-conv-start-btn i,
.uacf7-conv-next-step i,
.uacf7-conv-submit i,
.uacf7-conv-start-btn svg,
.uacf7-conv-next-step svg,
.uacf7-conv-submit svg {
    color: #ffffff !important;
    fill: #ffffff !important;
}

/* Add a subtle hover effect for desktop users */
.uacf7-conv-start-btn:hover,
.uacf7-conv-next-step:hover,
.uacf7-conv-submit:hover {
    background-color: #000000 !important;
    transform: translateY(-2px) !important; /* Slight lift effect on hover */
}

/* Fix the hanging indent on radio and checkbox text */
.wpcf7-list-item label {
    display: flex !important;
    align-items: flex-start !important;
    gap: 12px !important; /* Adds a clean gap between the radio input and the text */
    margin-bottom: 15px !important; /* Adds breathing room between the different options */
}

/* Add spacing between the checkmark/radio icon and the label text */
.wpcf7-list-item-label::before,
.wpcf7-list-item-label::after,
.wpcf7-list-item i,
.wpcf7-list-item svg {
    margin-right: 12px !important;
}

/* Ensure the text block stays aligned */
span.wpcf7-list-item-label {
    display: block !important;
    line-height: 1.5 !important;
}

/* Keeps the invisible input in place */
.wpcf7-list-item label input {
    margin-top: 5px !important;
    flex-shrink: 0 !important;
}

/* Force the Submit button to match the Ok buttons and override theme defaults */
input.wpcf7-submit {
    background-color: #222222 !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 4px !important; 
    padding: 14px 32px !important;
    font-size: 16px !important;
    font-weight: 500 !important;
    transition: all 0.3s ease !important;
    cursor: pointer !important;
    text-decoration: none !important; /* Removes the thin underline */
    box-shadow: none !important; 
    -webkit-appearance: none !important; /* Strips browser-default styling */
    appearance: none !important;
    margin-top: 30px !important;
}

/* Hover effect for the Submit button */
input.wpcf7-submit:hover {
    background-color: #000000 !important;
    transform: translateY(-2px) !important; 
}

/* Reduce the size of the intro body text */
.uacf7-conv-single-intro-wrap p {
    font-size: 18px !important; /* Reduced from 22px */
    line-height: 1.6 !important; /* Keeps the line spacing comfortable */
}


/* Fix the hanging indent on conversational checkboxes/multi-selects */
span.wpcf7-list-item-label {
    display: flex !important;
    align-items: flex-start !important;
    text-align: left !important;
}

/* Ensure the checkmark icon doesn't shrink and stays locked in place */
span.wpcf7-list-item-label::before,
span.wpcf7-list-item-label i,
span.wpcf7-list-item-label svg {
    flex-shrink: 0 !important;
    margin-top: 3px !important; /* Nudges the checkmark down slightly so it centers with the first line of text */
}

/* Apply Prata font to the Thank You screen title */
h4.uacf7-conv-thankyou-title {
    font-family: 'Prata', serif !important;
    font-weight: 400 !important;
}

/* Redesign the CF7 status box to match the CI */
div.wpcf7-response-output {
    border: none !important; /* Kills the default green/red borders */
    background-color: #F5F3EF !important; /* Soft beige background */
    color: #222222 !important; /* Dark text */
    border-radius: 4px !important;
    padding: 16px 24px !important;
    text-align: center !important;
    font-size: 16px !important;
    margin-top: 30px !important;
}


/* ---------- Desktop Form Width Adjustments ---------- */
@media only screen and (min-width: 769px) {
    
    /* Strip the massive purple padding AND green margins the plugin uses to squash the content */
    .uacf7-conv-form-wrap,
    div.uacf7-conv-single-intro,
    div.uacf7-conv-single-step,
    div.uacf7-conv-single-thankyou {
        padding-left: 0 !important;
        padding-right: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        max-width: 100% !important;
        width: 100% !important;
    }

    /* Allow the inner wrapper to stretch naturally to fill your Elementor container */
    div.uacf7-conv-single-intro-wrap,
    div.uacf7-conv-single-step-wrap,
    div.uacf7-conv-single-thankyou-wrap {
        padding-left: 20px !important; /* A tiny safety buffer from the screen edge */
        padding-right: 20px !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        max-width: 100% !important; 
        width: 100% !important;
    }
}


/* Ensure titles and subheadings use the full available width */
.uacf7-conv-title,
.uacf7-conv-single-step-wrap p {
    max-width: 100% !important;
    width: 100% !important;
}

/* Force text inputs and textareas to perfectly match the width of the text */
.wpcf7-form-control.wpcf7-text,
.wpcf7-form-control.wpcf7-email,
.wpcf7-form-control.wpcf7-textarea {
    width: 100% !important;
    max-width: 100% !important;
}

/* Style the Intro "Let's Get started!" button to match the others */
button.uacf7-conv-intro-button {
    background-color: #222222 !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 4px !important; /* Change to 0px if you want sharp corners */
    padding: 14px 32px !important;
    font-size: 16px !important;
    font-weight: 500 !important;
    transition: all 0.3s ease !important;
    cursor: pointer !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin-top: 20px !important;
}

/* Ensure the little double-arrow inside the intro button turns white */
button.uacf7-conv-intro-button i,
button.uacf7-conv-intro-button svg {
    color: #ffffff !important;
    fill: #ffffff !important;
    margin-left: 10px !important;
}

/* Add the hover lift effect */
button.uacf7-conv-intro-button:hover {
    background-color: #000000 !important;
    transform: translateY(-2px) !important; 
}

/* Ensure the little double-arrow inside the intro button turns white */
button.uacf7-conv-intro-btn i,
button.uacf7-conv-intro-btn svg {
    color: #ffffff !important;
    fill: #ffffff !important;
    margin-left: 10px !important;
}

/* Add the hover lift effect */
button.uacf7-conv-intro-btn:hover {
    background-color: #000000 !important;
    transform: translateY(-2px) !important; 
}


/* ---------- 2-Column Form Layout (Safe for JS) ---------- */
@media only screen and (min-width: 769px) {
    
    /* Make the labeled fields sit side-by-side */
    label.cf7-half-col {
        display: inline-block !important;
        width: calc(50% - 12px) !important; /* 50% width minus half the gap */
        margin-right: 20px !important; /* The gap between columns */
        vertical-align: top !important;
        box-sizing: border-box !important;
    }
    
    /* Remove the right margin from the right-hand column so it stays flush */
    label.cf7-half-col:nth-of-type(even) {
        margin-right: 0 !important;
    }

    /* Ensure the final LinkedIn field spans the full width at the bottom */
    label.cf7-full-col {
        display: block !important;
        width: 100% !important;
        clear: both !important;
    }
}

/* ---------- Missing Purple Highlight Fix ---------- */

/* 1. Add padding to all options so they form a proper block shape */
.wpcf7-list-item label {
    padding: 14px 20px !important;
    border-radius: 4px !important;
    width: 100% !important;
    box-sizing: border-box !important;
    transition: background-color 0.2s ease !important;
}

/* 2. When the option is clicked (checked), turn the whole block purple */
.wpcf7-list-item label:has(input:checked) {
    background-color: #C4CCE8 !important; /* Soft purple matching the other page */
}

/* ---------- Fix Narrow Checkbox/Radio Options ---------- */

/* 1. Force the master container for the checkboxes to be a full-width block */
span.wpcf7-form-control.wpcf7-checkbox,
span.wpcf7-form-control.wpcf7-radio {
    display: block !important;
    width: 100% !important;
}

/* 2. Force each individual list item parent to stretch across the full screen */
span.wpcf7-list-item {
    display: block !important;
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* 3. Ensure the text itself is allowed to stretch into that newly opened space */
span.wpcf7-list-item-label {
    width: 100% !important;
    display: flex !important;
    align-items: flex-start !important;
    text-align: left !important;
    white-space: normal !important; /* Prevents weird line-break rules */
}
/* ---------- Mobile Adjustments for Conversational Form ---------- */
@media only screen and (max-width: 768px) {
    
    /* 1. Reclaim the missing 60px from the absolute highest plugin wrappers */
    .uacf7-conv-wrapper,
    form.wpcf7-form,
    .uacf7-conv-form-wrap,
    div.uacf7-conv-single-intro,
    div.uacf7-conv-single-step,
    div.uacf7-conv-single-thankyou {
        padding-left: 0 !important;
        padding-right: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        max-width: 100% !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    /* 2. Shrink the main container safety buffer slightly to maximize space */
    div.uacf7-conv-single-intro-wrap,
    div.uacf7-conv-single-step-wrap,
    div.uacf7-conv-single-thankyou-wrap {
        padding: 10px !important; 
        margin-left: 0 !important;
        margin-right: 0 !important;
        max-width: 100% !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    /* 3. Reduce the thick side-padding inside the clickable blocks to let text stretch */
    .wpcf7-list-item label {
        padding: 12px 10px !important; /* Reduced from 20px */
    }

    /* 4. Force the list items and their containers to use 100% of this newly opened space */
    span.wpcf7-form-control.wpcf7-checkbox,
    span.wpcf7-form-control.wpcf7-radio,
    span.wpcf7-list-item,
    span.wpcf7-list-item-label {
        display: block !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    /* Restore the checkmark alignment after forcing full width */
    span.wpcf7-list-item-label {
        display: flex !important;
        align-items: flex-start !important;
        white-space: normal !important;
    }

    /* Shrink the large question titles on mobile */
    .uacf7-conv-intro-title,
    .uacf7-conv-title {
        font-size: 22px !important; 
        line-height: 1.3 !important;
    }

    /* Increase the text input size specifically for mobile */
    .wpcf7-form-control.wpcf7-text,
    .wpcf7-form-control.wpcf7-email,
    .wpcf7-form-control.wpcf7-textarea {
        font-size: 18px !important; 
        width: 100% !important;
        max-width: 100% !important;
    }
    
    /* Remove padding from the innermost field wrapper */
    .uacf7-conv-single-field-inner {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    
    /* Lift the warning toast higher on mobile so it clears the OK button */
    span.wpcf7-not-valid-tip {
        bottom: 120px !important; 
    }
}/* End custom CSS */