.elementor-5739 .elementor-element.elementor-element-13e19f7{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:center;--gap:20px 20px;--row-gap:20px;--column-gap:20px;--padding-top:250px;--padding-bottom:50px;--padding-left:70px;--padding-right:70px;}.elementor-5739 .elementor-element.elementor-element-13e19f7:not(.elementor-motion-effects-element-type-background), .elementor-5739 .elementor-element.elementor-element-13e19f7 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://eternalbenefit.com/wp-content/uploads/Bg-Contact-1.png");background-position:center center;background-repeat:no-repeat;background-size:cover;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-5739 .elementor-element.elementor-element-1733585 .elementor-heading-title{font-family:"Pragmatica", Sans-serif;font-size:72px;font-weight:400;color:#F8FAE2;}.elementor-5739 .elementor-element.elementor-element-bfd46d7 .elementor-heading-title{font-family:"Kepler Std", Sans-serif;font-size:84px;font-weight:400;font-style:italic;color:#F8FAE2;}.elementor-5739 .elementor-element.elementor-element-a3207e1{width:var( --container-widget-width, 620px );max-width:620px;--container-widget-width:620px;--container-widget-flex-grow:0;text-align:center;}.elementor-5739 .elementor-element.elementor-element-a3207e1.elementor-element{--align-self:center;}.elementor-5739 .elementor-element.elementor-element-a3207e1 .elementor-heading-title{font-family:"Pragmatica", Sans-serif;font-size:20px;font-weight:400;line-height:140%;color:#F8FAE2;}.elementor-5739 .elementor-element.elementor-element-a26da97{--spacer-size:10px;}.elementor-5739 .elementor-element.elementor-element-6d65b0d{width:var( --container-widget-width, 1020px );max-width:1020px;--container-widget-width:1020px;--container-widget-flex-grow:0;}.elementor-5739 .elementor-element.elementor-element-6d65b0d > .elementor-widget-container{background-color:#F8FAE2;padding:50px 100px 50px 100px;border-radius:27px 27px 27px 27px;}.elementor-5739 .elementor-element.elementor-element-264095d{--spacer-size:10px;}@media(max-width:1024px){.elementor-5739 .elementor-element.elementor-element-13e19f7{--padding-top:200px;--padding-bottom:50px;--padding-left:40px;--padding-right:40px;}.elementor-5739 .elementor-element.elementor-element-1733585 .elementor-heading-title{font-size:65px;}.elementor-5739 .elementor-element.elementor-element-bfd46d7 .elementor-heading-title{font-size:75px;}.elementor-5739 .elementor-element.elementor-element-6d65b0d > .elementor-widget-container{padding:50px 30px 50px 30px;}}@media(max-width:767px){.elementor-5739 .elementor-element.elementor-element-13e19f7{--padding-top:200px;--padding-bottom:50px;--padding-left:20px;--padding-right:20px;}.elementor-5739 .elementor-element.elementor-element-1733585{width:100%;max-width:100%;text-align:left;}.elementor-5739 .elementor-element.elementor-element-1733585 .elementor-heading-title{font-size:38px;}.elementor-5739 .elementor-element.elementor-element-bfd46d7{width:100%;max-width:100%;text-align:left;}.elementor-5739 .elementor-element.elementor-element-bfd46d7 .elementor-heading-title{font-size:48px;}.elementor-5739 .elementor-element.elementor-element-a3207e1{text-align:left;}.elementor-5739 .elementor-element.elementor-element-a3207e1 .elementor-heading-title{font-size:18px;}.elementor-5739 .elementor-element.elementor-element-6d65b0d > .elementor-widget-container{padding:0px 20px 20px 20px;}.elementor-5739 .elementor-element.elementor-element-6d65b0d{--container-widget-width:100%;--container-widget-flex-grow:0;width:var( --container-widget-width, 100% );max-width:100%;}}/* Start custom CSS for heading, class: .elementor-element-a3207e1 */.elementor-5739 .elementor-element.elementor-element-a3207e1 p {
    text-align: center  !important;
}/* End custom CSS */
/* Start custom CSS */span#gform_ajax_spinner_12 {
    display: none !important;
}

.gform_wrapper.gravity-theme .gfield textarea {
    border: 1px solid #000 !important;
}

/* --- SUBMIT BUTTON --- */
#gform_submit_button_12 {
    background-color: rgba(59, 72, 56, 1) !important;
    color: rgba(248, 250, 226, 1);
    font-size: 18px;
    font-weight: 700;
    margin-top: 80px !important;
    text-transform: uppercase;
    transition: .3s;
    border-radius: 12px;
}

#gform_submit_button_12:hover {
    background-color: rgba(22, 31, 19, 1) !important;
    color: rgba(248, 250, 226, 1);
}

/* --- GLOBAL LABELS --- */
.gfield .gfield_label {
    font-family: "Kepler std";
    font-style: italic;
    color: #000;
    font-size: 24px !important;
}

/* --- ADDRESS SUB-LABELS --- */
.ginput_complex .gform-field-label--type-sub {
    font-family: "Kepler std" !important;
    font-style: italic !important;
    color: #000 !important;
    font-size: 24px !important;
    display: block !important; /* Ensures the label doesn't blend with the input */
    margin-bottom: 8px !important; /* A little breathing room between the label and the input line */
    font-weight: normal !important;
}

#field_12_9 {
    color: #000;
    font-family: "Kepler std" !important;
    font-style: italic;
    font-size: 24px !important;
}

/* --- INPUTS, TEXTAREAS AND SELECTS (Normal states) --- */
.gfield input[type="text"],
.gfield input[type="email"],
.gfield input[type="tel"],
.gfield input[type="number"],
.gfield input[type="password"],
.gfield textarea,
.gfield select { 
    border: none !important;
    border-bottom: 1px solid rgba(59, 72, 56, 1) !important;
    border-radius: 0 !important; 
    box-shadow: none !important; 
    background-color: transparent !important; 
    padding: 0;
    color: #000 !important; /* Color when typing */
    font-weight: 600 !important;
    font-family: 'Pragmatica', sans-serif;
}

/* Visual cleanup for the Select */
.gfield select {
    appearance: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
}

/* Fake Placeholder fix for Select (State) */
.gfield select {
    color: rgba(53, 65, 51, 1) !important;
    font-weight: 400 !important;
    font-size: 18px !important;
}

.gfield select option {
    color: #000;
    font-size: 16px !important; /* A normal size so the list doesn't look giant */
    font-weight: 500 !important;
}

/* --- GLOBAL PLACEHOLDERS --- */
.gfield input::placeholder,
.gfield textarea::placeholder {
    font-family: 'Pragmatica', sans-serif;
    color: rgba(53, 65, 51, 1) !important;
    font-size: 18px !important;
    opacity: 1 !important;
    font-weight: 400 !important;
}

/* --- TEXTAREA HEIGHT --- */
.gfield textarea {
    height: 140px !important;
    min-height: 140px !important; /* Vital so Gravity Forms doesn't stretch it by default */
}

/* --- CUSTOM SQUARE CHECKBOX --- */
/* Correctly align the checkbox square with the text */
.gfield_checkbox .gchoice {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important; 
}

/* --- LABEL STYLING (Kepler) --- */
.gfield_checkbox .gchoice label {
    font-family: "Kepler std" !important;
    font-style: italic !important;
    color: #000 !important;
    font-size: 20px !important;
    margin: 0 !important; /* Remove default margins for proper alignment */
    padding: 0 !important;
    cursor: pointer !important; /* Shows the pointer hand on hover */
    font-weight: normal !important;
}

/* 1. Clear default design and create your square */
.gfield_checkbox .gfield-choice-input[type="checkbox"] {
    -webkit-appearance: none !important; /* For Safari/Chrome */
    -moz-appearance: none !important; /* For Firefox */
    appearance: none !important; /* Modern standard */
    width: 24px !important;
    height: 24px !important;
    border: 1px solid rgba(59, 72, 56, 1) !important;
    border-radius: 0 !important; /* Guarantees a perfect square without rounded borders */
    background-color: transparent !important;
    margin: 0 !important;
    cursor: pointer !important;
    display: inline-block !important;
    flex-shrink: 0 !important; /* Prevents the square from shrinking if the adjacent text is too long */
}

/* 2. Style for when the checkbox is CHECKED */
.gfield_checkbox .gfield-choice-input[type="checkbox"]:checked {
    background-color: rgba(59, 72, 56, 1) !important; /* Fill the background with your dark green color */
    
    /* Draw a checkmark in the center using a Base64 SVG */
    /* The color %23F8FAE2 equals the rgba(248, 250, 226, 1) of your button */
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23F8FAE2' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E") !important;
    background-size: 18px !important; /* Checkmark size */
    background-position: center !important;
    background-repeat: no-repeat !important;
}

/* Margin reset for the address field */
.gform_wrapper.gravity-theme .ginput_container_address {
    margin-left: 0% !important;
    margin-right: 0% !important;
}

#field_12_10, #field_12_12 {
    width: 100%;
}


/* ==========================================================================
   2. DESKTOP / TABLET STRUCTURE (768px and up)
   ========================================================================== */
@media (min-width: 768px) {
    /* General Fields 50/50 */
    .gform_wrapper .gform_fields {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 30px 100px !important; /* 30px top to bottom, 100px left to right */
    }

    .gform_wrapper .gfield--width-half {
        /* Keep the calculation because horizontal gap is still 100px */
        width: calc(50% - 50px) !important; 
        flex-basis: calc(50% - 50px) !important;
        max-width: calc(50% - 50px) !important;
        margin-bottom: 0 !important; /* Important so it doesn't add extra margin to the 30px gap */
    }

    /* Address 100% Top / 33% Bottom */
    .ginput_container_address {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 30px 20px !important; 
    }

    .ginput_container_address .address_line_1 {
        width: 100% !important;
        flex-basis: 100% !important;
        max-width: 100% !important;
        margin: 0 !important; padding: 0 !important;
    }

    .ginput_container_address .address_city,
    .ginput_container_address .address_state,
    .ginput_container_address .address_zip {
        width: calc(33.33% - 14px) !important; 
        flex-basis: calc(33.33% - 14px) !important;
        max-width: calc(33.33% - 14px) !important;
        margin: 0 !important; padding: 0 !important;
    }

    /* Checkboxes (2x2 Grid, Forced width and negative margin) */
    .gfield_checkbox {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important; /* Creates exactly 2 equal columns (50% and 50%) */
        gap: 20px 40px !important; 
        width: 520px !important; /* Forced width ONLY on Desktop */
        margin-left: -140px !important; /* Negative margin ONLY on Desktop */
    }
    
    /* Submit button Desktop size */
    #gform_submit_button_12 {
        width: 280px !important;
    }
}


/* ==========================================================================
   3. MOBILE STRUCTURE (Up to 767px)
   ========================================================================== */
@media (max-width: 767px) {
    
    #gform_submit_button_12 {
        margin-top: 30px !important;
    }
    /* Reset columns to 100% */
    .gform_wrapper .gform_fields {
        gap: 30px !important; /* On mobile we only leave 30px between each field downwards */
    }
    .gform_wrapper .gfield--width-half {
        width: 100% !important;
        flex-basis: 100% !important;
        max-width: 100% !important;
    }

    /* Reset address to 100% */
    .ginput_container_address {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 30px !important;
    }
    .ginput_container_address span {
        width: 100% !important;
        flex-basis: 100% !important;
        max-width: 100% !important;
        margin: 0 !important; padding: 0 !important;
    }

    /* Reset Checkboxes to 1 single column and 100% width */
    .gfield_checkbox {
        display: grid !important;
        grid-template-columns: 1fr !important; /* Reverts to 1 single column at 100% */
        gap: 20px !important;
        width: 100% !important; /* Prevents screen overflow */
        margin-left: 0 !important; /* Removes the negative margin that breaks mobile */
    }
    
    /* Submit button 100% on mobile (Optional, but looks better) */
    #gform_submit_button_12 {
        width: 100% !important;
    }
}

.gfield input[type="text"],
.gfield input[type="email"],
.gfield input[type="tel"],
.gfield input[type="number"],
.gfield input[type="password"],
.gfield textarea,
.gfield select {
    box-sizing: border-box !important; /* Forces the 100% width to respect the box limit */
    width: 100% !important;
    max-width: 100% !important;
}

/* Optional but recommended: cuts off any micro-overflow of the container on mobile */
.gform_wrapper {
    box-sizing: border-box !important;
    max-width: 100% !important;
    overflow-x: hidden !important; 
}

/* --- TABLET FIX: Stack HTML Title and Checkboxes (768px to 1024px) --- */
@media (min-width: 768px) and (max-width: 1154px) {
    
    /* Remove the negative margin and return checkboxes to 100% */
    .gfield_checkbox {
        width: 100% !important;
        margin-left: 0 !important;
    }
    

    .gform_wrapper #field_12_9,
    .gform_wrapper #field_12_8 {
        width: 100% !important;
        flex-basis: 100% !important;
        max-width: 100% !important;
        margin-left: 0 !important;
    }
}

.gfield_required {
    display: none;
}/* End custom CSS */
/* Start Custom Fonts CSS */@font-face {
	font-family: 'Pragmatica';
	font-style: normal;
	font-weight: normal;
	font-display: auto;
	src: url('https://eternalbenefit.com/wp-content/uploads/Pragmatica.ttf') format('truetype');
}
@font-face {
	font-family: 'Pragmatica';
	font-style: normal;
	font-weight: 200;
	font-display: auto;
	src: url('https://eternalbenefit.com/wp-content/uploads/Pragmatica-1.ttf') format('truetype');
}
/* End Custom Fonts CSS */
/* Start Custom Fonts CSS */@font-face {
	font-family: 'Kepler Std';
	font-style: normal;
	font-weight: normal;
	font-display: auto;
	src: url('https://eternalbenefit.com/wp-content/uploads/KeplerStd-SemiboldCnSubh.woff2') format('woff2');
}
/* End Custom Fonts CSS */