.dbi-main-container-hero {
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

.dbi-main-container-inside {
    background-size: contain;
    min-height: 600px;
}

.dbi-content-and-form-section {
    padding: 84.57px 0 90.24px;
}

.inner-container {
    max-width: 1255px !important;
    margin: 0 auto;
}

.dbi-title {
    font-family: 'Gilroy-bold';
    font-style: normal;
    font-weight: 700;
    font-size: 65px;
    line-height: 110%;
    letter-spacing: -0.02em;
    color: #000000;
    max-width: 578.12px;
    margin-bottom: 0;
    margin: 0px;
}

.dbi-description {
    max-width: 528.93px;
    font-family: 'Gilroy-Regular';
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 160%;
    color: #000000;
    margin: 0px;

}

.heading-and-descrition-section {
    display: flex;
    gap: 30px;
    flex-direction: column;
}

.dbi-text-and-form {
    display: flex;
    gap: 64.88px;
    align-items: flex-start;
}

@media only screen and (max-width: 1400px) {
    .inner-container {
        padding-left: 30px;
        padding-right: 30px;
        max-width: 100%;
    }
}

@media only screen and (max-width: 1280px) {
    .dbi-text-and-form {
        flex-direction: column;
    }

    .dbi-title,
    .dbi-description,
    .dbi-form-container {
        max-width: 100% !important;
    }
}

@media only screen and (max-width: 1280px) {
    .inner-container {
        padding-left: 20px;
        padding-right: 20px;
        max-width: 100%;
    }

    .heading-and-descrition-section {
        gap: 13.41px;
    }

    .dbi-title {
        margin-bottom: 0;


        font-family: 'Gilroy-bold';
        font-style: normal;
        font-weight: 700;
        font-size: 45px;
        line-height: 110%;
        letter-spacing: -0.02em;
        color: #000000;
    }

    .dbi-description {


        font-family: 'Gilroy-Regular';
        font-style: normal;
        font-weight: 400;
        font-size: 16px;
        line-height: 162%;
        color: #000000;
    }

    .dbi-description {
        max-width: 100%;
    }

    .dbi-text-and-form {
        gap: 43.59px;
    }

    .dbi-content-and-form-section {
        padding: 50.41px 0 79.57px;
    }

    

    .dbi-main-container-inside {
        min-height: 500px;
    }
}






/* Form Section */
.form-section {
    background-color: #e9f2f4;
    padding: 35.16px 135.37px 40.49px 134.63px;
}

.form-title {
    font-family: 'gilroy-bold';
    font-style: normal;
    font-size: 36px;
    line-height: 44px;
    letter-spacing: -0.01em;
    color: #231F20;
    margin-bottom: 12px;
}

.form-subtitle {
    font-family: 'gilroy-regular';
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: #231F20;
    margin-bottom: 10px;
}

.form-row {
    display: flex;
    gap: 25px;
    margin-bottom: 20px;
}

.form-group {
    flex: 1;
    position: relative;
    outline: 1px solid rgba(0, 0, 0, 0.15);
    border: 1px solid transparent;
    border-radius: 8px;
    max-height: 56px;
    min-height: 56px;
    transition: 0.3s ease-out;
}

.form-group input::placeholder,
.form-group textarea::placeholder {
    font-family: "Gilroy";
    font-weight: 400;
    font-size: 16px;
    color: #000000;
    display: block;
}

.form-control {
    width: 100%;
    padding: 0px 16px 0px;
    background-color: transparent;
    box-sizing: border-box;
    transition: border-color 0.3s;
    font-family: 'gilroy-medium';
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 100%;
    max-height: 16px;
    color: #000;
    position: absolute;
    box-shadow: unset !important;
    background-color: unset !important;
    border: 0px !important;
    bottom: 10px;
}

/* .form-control:focus {
    color: #007481;
} */

.form-control::placeholder {
    opacity: 1 !important;
    color: #000 !important;
    font-family: 'gilroy-regular' !important;
}

.form-text-area {
    min-height: 109px !important;
    max-height: 109px !important;
    padding-bottom: 11px;
}

.form-text-area .form-control {
    padding-top: 25px;
    max-height: 57px !important;
    height: 57px !important;
    box-sizing: border-box;
    scrollbar-width: none;
    min-height: 0px !important;
    overflow: scroll;
    padding-top: 0px;
    position: absolute;
    padding-bottom: 0px;
    top: 29px;
    padding-bottom: 0px;
}

.form-text-area .form-control::-webkit-scrollbar {
    width: 0px;
}

.form-control.disabled,
.form-control:disabled {
    background-color: #f5f5f5;
    cursor: not-allowed;
}

.form-group .form-control:-webkit-autofill {
    transition: background-color 115000s ease-in-out 0s;
    box-shadow: unset !important;
    -webkit-box-shadow: unset !important;
    outline: 0px !important;
    
}

.checkbox-group {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin: 25px 0 30px 0;
}

.checkbox-container {
    display: flex;
    align-items: flex-start;
    cursor: pointer;
    user-select: none;
    margin-bottom: 25px;
}

.checkbox-input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
}

.checkbox-input:disabled {
    cursor: not-allowed;
}

.checkbox-input:disabled+.checkbox-custom {
    cursor: not-allowed;
}

.checkbox-custom {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 12px;
    width: 12px;
    height: 12px;
    background-color: transparent;
    border: 1px solid #B3B3B3;
    border-radius: 2px;
    margin-right: 5px;
    flex-shrink: 0;
    transition: all 0.2s ease;
    margin-top: 4px;
}


.checkbox-icon {
    display: none;
    width: 8px;
    height: 5px;
}

.checkbox-input:checked+.checkbox-custom .checkbox-icon {
    display: block;
}

.checkbox-label {
    font-family: "Gilroy";
    font-weight: 400;
    font-size: 13px;
    line-height: 150%;
    color: #000000;
}

.checkbox-label-text {
    font-family: 'gilroy-regular';
    font-style: normal;
    font-weight: 400;
    font-size: 13px;
    line-height: 20px;
    color: rgba(0, 0, 0, 0.8);
}

.checkbox-container:hover .checkbox-custom {
    border-color: #999;
}

.required-mark {
    color: #E3000F !important;
}

#message+label {
    top: 15px;
}

.form-error {
    position: absolute;
    bottom: -23px;
    right: 0;
    margin: 0px !important;
    font-size: 12px !important;
    font-weight: 600;
    color: #e53c3c;
}

.error-active,
.error-active:hover {
    outline: 2px solid #e53c3c !important;
    border: 0px !important;
}

/* Custom Button CSS */
.custom-btn {
    background-color: #e53c3c !important;
    border-radius: 100px !important;
    padding: 15px 28px 12px !important;
    width: fit-content !important;
    position: relative !important;
    line-height: 1 !important;
    cursor: pointer;
    max-height: 49px;
    min-height: 49px;
}

.custom-btn a,
.lower_section .custom-btn,
.custom-load-more {
    font-family: 'Gilroy-Bold' !important;
    font-weight: 400 !important;
    font-size: 16px !important;
    color: white !important;
    text-decoration: none !important;
    line-height: 140% !important;
    letter-spacing: -0.005em;
    display: block;
    transform: translateX(0px);
}

.custom-btn a,
.custom-load-more span {
    margin-top: -2px;
}

#estimateForm .custom-btn {
    padding: 15px 25px 12px 23px !important;
    font-family: 'Gilroy-Bold' !important;
    font-weight: 400 !important;
    font-size: 16px !important;
    color: white;
    text-decoration: none !important;
    line-height: 140% !important;
    letter-spacing: -0.005em;
    display: block;
    transform: translateX(0px);
}

.custom-btn::before {
    content: "" !important;
    background: #e53c3c;
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    display: block !important;
    width: 20px !important;
    height: 20px !important;
    position: absolute !important;
    right: 0px !important;
    top: 0px !important;
    border: 2px solid white;
    border-radius: 100px;
    box-sizing: border-box;
    transition: 0.5s cubic-bezier(0.34, 1.56, 0.64, 1) !important;
}

.custom-btn::after {
    content: "";
    background-image: url('data:image/svg+xml,<svg width="6" height="6" viewBox="0 0 6 6" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M0.125528 5.87447C-0.0418396 5.70711 -0.0418396 5.43575 0.125528 5.26838L5.26838 0.125528C5.43575 -0.0418396 5.70711 -0.0418396 5.87447 0.125528C6.04184 0.292895 6.04184 0.564252 5.87447 0.731619L0.731619 5.87447C0.564252 6.04184 0.292895 6.04184 0.125528 5.87447Z" fill="white"/><path fill-rule="evenodd" clip-rule="evenodd" d="M5.57143 5.14258C5.33474 5.14258 5.14286 4.9507 5.14286 4.71401L5.14286 0.856866L1.28572 0.856865C1.04902 0.856865 0.857146 0.664988 0.857146 0.428294C0.857146 0.191601 1.04902 -0.000277006 1.28572 -0.000276985L5.57143 -0.000276604C5.80812 -0.000276583 6 0.191601 6 0.428295L6 4.71401C6 4.9507 5.80812 5.14258 5.57143 5.14258Z" fill="white"/></svg>');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    display: block;
    position: absolute;
    right: 7px;
    z-index: 1111;
    width: 6px;
    height: 6px;
    top: 7px;
    transition: 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
    box-sizing: border-box;
    z-index: 1;
}

/* Third step specific form styles */
.checkbox-container {
    margin-bottom: 0px;
}

.checkbox-group {
    margin-bottom: 27px;
    margin-top: 23.85px;
}

.form-group {
    height: fit-content;
    display: flex;
    align-items: center;
    position: relative;
}

.form-group label {
    position: absolute;
    left: 16px !important;
    font-family: 'Gilroy-Medium';
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    letter-spacing: -0.005em;

    color: rgba(5, 58, 64, 0.9);
    transition: 0.5s;
    top: 16px;
}

.form-group input:focus+label,
.form-group textarea:focus+label,
.form-group .active-input+label {
    top: 12px !important;
    font-family: 'Gilroy-Medium';
    font-weight: 400;
    font-size: 10px;
    line-height: 100%;
    letter-spacing: -0.005em;


}

.form-group input:focus+label,
.form-group textarea:focus+label {
    color: rgba(5, 58, 64, 0.9);
}

.form-section .form-title {
    margin-bottom: 11px !important;
}

.form-group-focused {
    background: white;
}

/* Hover states (min-width: 1025px) */
@media (min-width: 1025px) {
    .custom-btn:hover::before {
        transform: rotate(-136deg);
        width: 49px !important;
        height: 49px !important;
        right: -30px !important;
    }

    .custom-btn:hover::after {
        transform: rotate(-136deg);
        width: 12.73px !important;
        height: 12.73px !important;
        right: -12px !important;
        top: 18px;
    }

    .custom-btn:hover a {
        transform: translateX(-3px);
    }

    .form-group:hover {
        outline: 1px solid #053A40;
        border: 1px solid #053A40;
    }

    .form-group-focused label,
    .form-group .form-group-active {
        top: 12px !important;
        font-size: 10px !important;
        font-family: 'Gilroy-Medium' !important;
    }


    #estimateForm .form-group-active:hover label,
    #estimateForm .form-group-focused:hover label {
        line-height: 24px !important;
    }
}

#estimateForm .form-group label {
    transition: color 0.3s ease-out, top 0.3s ease-out;
}

#estimateForm input,
#estimateForm textarea {
    -webkit-tap-highlight-color: transparent !important;
}

#estimateForm textarea,
#estimateForm textarea:focus,
#estimateForm textarea:hover,
#estimateForm textarea:active {
    background: transparent !important;
    outline: unset !important;
    border: 0px !important;
}

#estimateForm input,
#estimateForm input:focus,
#estimateForm input:hover,
#estimateForm input:active {
    background: transparent !important;
    outline: unset !important;
    border: 0px !important;
}

/* Mobile hover states */
@media (max-width: 1024px) {
    .custom-btn:hover::after {
        content: "";
        background-image: url('data:image/svg+xml,<svg width="6" height="6" viewBox="0 0 6 6" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M0.125528 5.87447C-0.0418396 5.70711 -0.0418396 5.43575 0.125528 5.26838L5.26838 0.125528C5.43575 -0.0418396 5.70711 -0.0418396 5.87447 0.125528C6.04184 0.292895 6.04184 0.564252 5.87447 0.731619L0.731619 5.87447C0.564252 6.04184 0.292895 6.04184 0.125528 5.87447Z" fill="white"/><path fill-rule="evenodd" clip-rule="evenodd" d="M5.57143 5.14258C5.33474 5.14258 5.14286 4.9507 5.14286 4.71401L5.14286 0.856866L1.28572 0.856865C1.04902 0.856865 0.857146 0.664988 0.857146 0.428294C0.857146 0.191601 1.04902 -0.000277006 1.28572 -0.000276985L5.57143 -0.000276604C5.80812 -0.000276583 6 0.191601 6 0.428295L6 4.71401C6 4.9507 5.80812 5.14258 5.57143 5.14258Z" fill="white"/></svg>');
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
        display: block;
        position: absolute;
        right: 7px !important;
        z-index: 1111;
        width: 6px !important;
        height: 6px !important;
        top: 7px !important;
        transition: 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
        transform: rotate(0deg) !important;
    }

    .form-error {
        font-size: 11px !important;
        bottom: -14px !important;
        line-height: 100%;
    }

    .form-group {
        border-radius: 8px !important;
        min-height: 56px;
        max-height: 56px;
    }

    .custom-btn:hover:before {
        display: block !important;
        width: 20px !important;
        height: 20px !important;
        position: absolute !important;
        right: 0px !important;
        transform: rotate(0deg) !important;
    }

    .custom-btn:hover a {
        transform: translateX(0px) !important;
    }



    .form-title {
        font-size: 27px;
        line-height: 33px;
        margin-bottom: 14.05px;
    }

    .form-subtitle {
        margin-bottom: 18.95px;
        font-size: 14px;
        line-height: 21px;
    }

    .form-row {
        flex-direction: column;
        gap: 16px;
        margin-bottom: 16px;
    }

    .dbi-form-container .cf-btn {
        margin-top: 20px;
    }

    .form-group input:focus+label,
    .form-group textarea:focus+label,
    .form-group .active-input+label {
        top: 11.75px !important;
    }

    .form-control {
        max-height: unset !important;
        min-height: unset !important;
        padding: 0px 16px 0px !important;
        font-size: 14px;
        line-height: 21px;
        border-radius: 8px;
        bottom: 6.46px;
    }

    .form-text-area .form-control {
        top: 30px !important;
        max-height: 90px !important;
        height: 90px !important;
    }

    .dbi-form-container {
        max-width: 100% !important;
    }

    .form-text-area {
        min-height: 143px !important;
        max-height: 143px !important;

    }

    .form-control label {
        line-height: 18px;
    }

    .checkbox-group {
        margin-top: 29px;
        margin-bottom: 36.07px;
    }

    .form-group label {
        top: 16px;
        font-size: 14px;
        line-height: 150%;
    }

    .form-group textarea:focus+label,
    .form-group textarea.active-input+label {
        top: 12px;
    }

    .form-group input:focus,
    .form-group textarea:focus,
    .form-group .active-input {
        margin-top: 0px !important;
    }

    input {
        padding-top: 24.54px;
        margin-top: 0px !important;
    }

    .form-section .form-title {
        margin-bottom: 13.05px !important;
    }

    .form-section {
        padding: 46.77px 20px 72.93px;
    }
}


.dbi-form-container {
    max-width: 617px;
    width: 100%;
}

.dbi-form-container .cf-btn {
    margin-top: 25px;
}



.form-group-focused {
    outline: 1px solid #053A40;
    border: 1px solid #053A40;
}

.cf-btn.disabled {
    opacity: 0.5 !important;
    pointer-events: none !important;
}

submission-error-message {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 16px 20px;
    margin-top: 20px;
    background-color: #FEE;
    border: 1px solid #E53C3C;
    border-radius: 8px;
    animation: slideDown 0.3s ease-out;
}

.submission-error-message .error-icon {
    flex-shrink: 0;
    margin-top: 2px;
}

.submission-error-message .error-content {
    flex: 1;
}

.submission-error-message .error-content strong {
    display: block;
    color: #e53c3c;
    font-size: 16px;
    margin-bottom: 4px;
    font-family: "Gilroy-bold";
}

.submission-error-message .error-content p {
    color: #D32F2F;
    font-size: 14px;
    font-family: "Gilroy-Regular";
    margin: 0;
    line-height: 1.5;
}

/* Error details (debug info) */
.submission-error-message .error-details {
    margin-top: 12px;
    padding: 12px;
    background-color: #FFF;
    border: 1px solid #FFCDD2;
    border-radius: 4px;
}

.submission-error-message .error-details summary {
    color: #e53c3c;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    user-select: none;
}



.submission-error-message .error-details pre {
    margin: 8px 0 0 0;
    padding: 8px;
    background-color: #F5F5F5;
    border-radius: 4px;
    font-size: 12px;
    color: #424242;
    overflow-x: auto;
    white-space: pre-wrap;
    word-wrap: break-word;
}


/* Mobile responsive */
@media (max-width: 768px) {
    .submission-error-message {

        gap: 10px;
    }

    .submission-error-message .error-content strong {
        font-size: 15px;
    }

    .submission-error-message .error-content p {
        font-size: 13px;
    }
}

.dbi-main-container-hero {
    
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.dbi-hero-logo {
    max-width: 250px;
    
    height: 100%;
    margin-bottom: 40px;
}

.dbi-main-container-inside {

    display: flex;
    flex-direction: column;
        justify-content: flex-end;
    gap: 50px;
}

.dbi-logo-text {
    max-width: 530px;
    margin-top: 20px;
}



.dbi-img-mobile {
    display: none;
}

@media(max-width: 1280px) {

    .dbi-main-container-hero {
        
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
    }

    .dbi-hero-logo {
        display: none;
    }

    .dbi-img-desktop {
        display: none;
    }

    .dbi-img-mobile {
        display: block;
    }

    .dbi-logo-text {
    margin-top: 80px;
    }

    .dbi-main-container-inside
    {
        justify-content: flex-start;
    }

    
}

footer#main_footer
{
    border-top: 1px solid #E5E5E5;
}