.contact-index-index {
    .form.contact {
        background: @color-neutral-50;
        border-radius: 16px;
        padding: 48px 16px;
        margin-bottom: 40px;
        margin-top: 60px;
        width: auto !important;
        html[lang="ar"] & {
            direction: rtl;
        }
        fieldset.fieldset {
            max-width: 480px;
            margin: 0 auto;
            float: none;
            text-align: center;
            legend.legend {
                margin: 0;
                text-align: center;
                width: 100%;
                font-family: @font-family__heading;
                margin-bottom: 24px;
                span {
                    font-size: 48px;
                    color: @color-neutral-950;
                    line-height: 56px;
                    font-weight: 400;
                    @media (max-width: 767px) {
                        font-size: 25px;
                    }
                }
            }
            .field.comment {
                margin-bottom: 16px;
            }
            .field.note.no-label {
                font-size: 16px;
                line-height: 24px;
                font-weight: 400;
                color: @color-neutral-950;
                font-family: @font-family__base;
                margin-bottom: 30px;
                html[lang="ar"] & {
                    direction: rtl;
                }
                &:before {
                    content: none !important;
                }
            }
            .field {
                margin-bottom: 16px;
                label.label {
                    width: 100% !important;
                    text-align: left !important;
                    line-height: 16px;
                    letter-spacing: 7% !important;
                    color: @color-neutral-950;
                    padding-top: 0;
                    display: block;
                    font-weight: 500;
                    text-transform: uppercase;
                    font-size: 14px;
                    margin-bottom: 5px;
                    font-family: @font-family__heading;
                    html[lang="ar"] & {
                        text-align: right !important; 
                        padding: 0;
                    }
                }
                .control {
                    .input-text {
                        height: 48px;
                        border: 1px solid @color-neutral-300;
                        font-size: 16px;
                        color: @color-neutral-600;
                    }
                }
            }
        }
        .actions-toolbar {
            max-width: 480px;
            margin: 0 auto !important;
            .primary {
                width: 100%;
                .action.submit.primary {
                    width: 100%;
                    font-family: @font-family__heading;
                }
            }
        }
    }
}