.cta-form {
    position: relative;
    padding: 0;

    .container {
        position: relative;
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 40px;
        z-index: 2;

        @media only screen and (min-width: 992px) {
            gap: 89px;
        }

        .two-column-wrapper {
            display: flex;
            flex-direction: column;
            gap: 40px;
            width: 100%;
            background-color: #F6F3EC;

            @media only screen and (min-width: 992px) {
                flex-direction: row;
                align-items: stretch;
                gap: 89px;
            }

            .image-column {
                flex: 1;
                display: flex;
                justify-content: center;

                @media only screen and (min-width: 992px) {
                    flex: 0 0 55.32%;
                    max-width: 55.32%;
                }

                .image-wrapper {
                    position: relative;
                    width: 100%;
                    height: 100%;
                    min-height: 300px;

                    @media only screen and (min-width: 992px) {
                        min-height: 400px;
                    }

                    .image {
                        position: relative;
                        width: 100%;
                        height: 100%;
                        min-height: 300px;

                        @media only screen and (min-width: 992px) {
                            min-height: 400px;
                        }

                        .img {
                            width: 100%;
                            height: 100%;
                            object-fit: cover;
                        }
                    }

                    .headline-overlay {
                        position: absolute;
                        bottom: 0;
                        left: 0;
                        right: 0;
                        color: #F6F3EC;
                        font-family: 'League Spartan';
                        font-style: normal;
                        font-weight: 800;
                        font-size: 40px;
                        line-height: 110%;
                        text-transform: capitalize;
                        margin: 0;
                        padding: 2rem 2rem 41px 2rem;
                        background: linear-gradient(transparent, rgba(0, 0, 0, 0.7));
                        text-align: left;

                        @media only screen and (min-width: 992px) {
                            font-size: clamp(40px, calc(40px + (80 - 40) * ((100vw - 992px) / (1600 - 992))), 80px);
                            padding: 3rem 3rem 41px 3rem;
                        }

                        @media only screen and (min-width: 1600px) {
                            font-size: 80px;
                        }

                        /* Text wrapper to limit content width */
                        .headline-text {
                            max-width: 600px;
                            display: block;
                            margin: 0 auto;
                        }
                    }
                }
            }

            .form-column {
                padding-left: 16px;
                padding-right: 16px;
                padding-top: 0;
                padding-bottom: 32px;

                @media only screen and (min-width: 992px) {
                    max-width: calc(100% - 55.32% - 89px);
                    padding-top: calc(40px + 63.83px);
                    padding-right: 99px;
                    padding-bottom: 66px;
                    padding-left: 0;
                }

                .form-wrapper {
                    width: 100%;
                    max-width: 500px;
                    margin: 0 auto;

                    @media only screen and (min-width: 992px) {
                        max-width: none;
                        margin: 0;
                    }

                    /* Gravity Forms styling based on Figma design */
                    .gform_wrapper {
                        width: 100%;
                        display: flex;
                        flex-direction: column;
                        align-items: flex-start;
                        padding: 0px;

                        .gform_fields {
                            display: flex;
                            flex-direction: column;
                            align-items: flex-start;
                            padding: 0px;
                            gap: 16px;
                            width: 100%;

                            .gfield {
                                margin: 0;
                                display: flex;
                                flex-direction: column;
                                align-items: flex-start;
                                padding: 0px;
                                gap: 4px;
                                width: 100%;

                                .gfield_label {
                                    width: 100%;
                                    height: 22px;
                                    font-family: 'League Spartan';
                                    font-style: normal;
                                    font-weight: 500;
                                    font-size: 16px;
                                    line-height: 140%;
                                    color: #727272;
                                    margin: 0;
                                    padding: 0;
                                }

                                .ginput_container {
                                    width: 100%;
                                    height: 50px;
                                    background: #FFFFFF;

                                    input[type="text"],
                                    input[type="email"],
                                    input[type="tel"],
                                    input[type="url"],
                                    select {
                                        display: flex;
                                        flex-direction: row;
                                        justify-content: center;
                                        align-items: center;
                                        padding: 0px 16px;
                                        gap: 8px;
                                        width: 100%;
                                        height: 50px;
                                        background: #FFFFFF;
                                        border: none;
                                        border-radius: 6px;
                                        font-family: 'Dosis';
                                        font-style: normal;
                                        font-weight: 400;
                                        font-size: 16px;
                                        line-height: 140%;
                                        color: rgba(0, 0, 0, 0.5);

                                        &:focus {
                                            outline: none;
                                            color: #000000;
                                        }

                                        &::placeholder {
                                            color: rgba(0, 0, 0, 0.5);
                                        }
                                    }

                                    textarea {
                                        display: flex;
                                        flex-direction: row;
                                        align-items: flex-start;
                                        padding: 16px;
                                        width: 100%;
                                        height: 54px;
                                        background: #FFFFFF;
                                        border: none;
                                        border-radius: 6px;
                                        font-family: 'Dosis';
                                        font-style: normal;
                                        font-weight: 400;
                                        font-size: 16px;
                                        line-height: 140%;
                                        color: rgba(0, 0, 0, 0.5);
                                        resize: vertical;
                                        min-height: 54px;

                                        &:focus {
                                            outline: none;
                                            color: #000000;
                                        }

                                        &::placeholder {
                                            color: rgba(0, 0, 0, 0.5);
                                        }
                                    }
                                }

                                .gfield_description {
                                    color: #727272;
                                    font-family: 'Dosis';
                                    font-size: 16px;
                                    line-height: 140%;
                                    margin: 0;
                                    padding: 0;
                                }

                                &.gfield_error {
                                    .gfield_label {
                                        color: #BE1616;
                                    }

                                    .ginput_container {
                                        input,
                                        textarea,
                                        select {
                                            border: 1px solid #BE1616;
                                        }
                                    }

                                    .validation_message {
                                        color: #BE1616;
                                        font-family: 'Dosis';
                                        font-size: 16px;
                                        line-height: 140%;
                                        margin: 0;
                                        padding: 0;
                                    }
                                }
                            }
                        }

                        .gform_footer {
                            margin-top: 16px;
                            display: flex;
                            flex-direction: row;
                            flex-wrap: wrap;
                            align-items: flex-start;
                            align-content: flex-start;
                            padding: 0px;
                            gap: 16px;
                            width: 100%;

                            .gform_button {
                                display: flex;
                                flex-direction: row;
                                justify-content: center;
                                align-items: center;
                                padding: 0px 40px;
                                gap: 8px;
                                width: 135px;
                                height: 50px;
                                background: #D62624;
                                border: none;
                                border-radius: 0px;
                                cursor: pointer;
                                font-family: 'League Spartan';
                                font-style: normal;
                                font-weight: 800;
                                font-size: 16px;
                                line-height: 15px;
                                text-transform: uppercase;
                                color: #FFFFFF;
                                transition: background-color 0.3s ease;

                                &:hover {
                                    background: #B51F1D;
                                }

                                &:focus {
                                    outline: none;
                                }
                            }
                        }

                        .gform_validation_errors {
                            color: #BE1616;
                            font-family: 'Dosis';
                            font-size: 16px;
                            line-height: 140%;
                            margin: 0;
                            padding: 0;
                        }

                        .gform_confirmation_message {
                            color: #000000;
                            font-family: 'Dosis';
                            font-size: 16px;
                            line-height: 140%;
                            margin: 0;
                            padding: 0;
                        }

                        .gform_required_legend {
                            display: none !important;
                        }

                        /* Side by side fields at 992px and above */
                        @media only screen and (min-width: 992px) {
                            .gform_fields {
                                display: block !important;
                            }

                            /* Create a wrapper for left and right half fields */
                            .gfield.gf_left_half,
                            .gfield.gf_right_half {
                                display: inline-block !important;
                                width: calc(50% - 8px) !important;
                                vertical-align: top !important;
                            }

                            .gfield.gf_left_half {
                                margin-right: 8px !important;
                            }

                            .gfield.gf_right_half {
                                margin-left: 8px !important;
                            }
                        }

                        /* Ensure other fields take full width and stack vertically */
                        .gfield:not(.gf_left_half):not(.gf_right_half) {
                            width: 100% !important;
                        }

                        /* Add margin top to email and textarea fields */
                        .gfield--type-email,
                        .gfield--type-textarea {
                            margin-top: 16px !important;
                        }

                        /* Add margin top to checkbox field */
                        .gfield--type-checkbox {
                            margin-top: 40px !important;
                        }

                        /* Remove background and height from checkbox container */
                        .ginput_container_checkbox {
                            background: none !important;
                            height: auto !important;
                        }

                        /* Style consent description */
                        .gfield_consent_description {
                            margin-top: 16px !important;
                            border: none !important;
                            font-family: 'Dosis' !important;
                            font-style: normal !important;
                            font-weight: 500 !important;
                            font-size: 16px !important;
                            line-height: 140% !important;
                            color: #727272 !important;
                        }

                        /* Style link inside consent description */
                        .gfield_consent_description a {
                            font-family: 'Dosis' !important;
                            font-style: normal !important;
                            font-weight: 500 !important;
                            font-size: 16px !important;
                            line-height: 140% !important;
                            text-decoration-line: underline !important;
                            color: #727272 !important;
                        }

                        /* Style consent input container */
                        .ginput_container_consent {
                            margin-top: 16px !important;
                            background: none !important;
                            height: auto !important;
                        }

                        /* Style consent label */
                        .gfield_consent_label {
                            font-family: 'Dosis' !important;
                            font-style: normal !important;
                            font-weight: 400 !important;
                            font-size: 16px !important;
                            line-height: 140% !important;
                            color: #727272 !important;
                            margin-bottom: 0 !important;
                        }

                        /* Hide reCAPTCHA iframe */
                        iframe[title="reCAPTCHA"] {
                            display: none !important;
                        }

                        /* Hide reCAPTCHA container */
                        .form-recaptcha-to-be-hidden {
                            display: none !important;
                        }

                        /* Style checkbox input */
                        input[type="checkbox"] {
                            box-sizing: border-box !important;
                            width: 20px !important;
                            height: 20px !important;
                            background: #FFFFFF !important;
                            border: 1px solid #727272 !important;
                            border-radius: 0px !important;
                        }

                        /* Style form footer */
                        .gform_footer {
                            margin-top: 40px !important;
                        }

                        /* Style form button */
                        .gform_button {
                            margin: 0 !important;
                        }
                    }
                }
            }
        }
    }
} 