main {
    --container: 1420px;
}

.section-heading {
    padding-block: 3.5rem;

    .container {
        display: flex;
        align-items: center;
        justify-content: center;
        text-align: center;
    }

    .section-titles {
        gap: 1.5rem;
    }
}

.section-form {
    padding-block: 3rem 8rem;

    .bg-wrapper {
        display: flex;
        flex-direction: column;
        gap: 4.75rem;
        background-color: hsl(var(--gold) / 0.05);
        padding: 4.25rem;
        padding-block-end: 3rem;
    }

    .top {
        display: flex;
        gap: 4rem;
    }

    .right {
        display: flex;
        flex-direction: column;
        gap: 1.75rem;
        padding-block-start: 3.25rem;
        font-size: var(--text-18px);

        .description {
            border-bottom: 1px solid var(--color-gold);
            padding-block-end: 1.75rem;

            h2 {
                font-size: var(--text-30px);
            }

            a:hover {
                color: var(--color-gold);
            }
        }

        .follow-us {
            display: inline-flex;
            align-items: center;
            gap: 1.5rem;

            .links {
                display: flex;
                align-items: center;
                gap: 1rem;
            }
        }
    }

    .left {
        flex: 1;

        .form-container {
            padding: 3rem 2rem;
            color: var(--color-white);
            position: relative;
            background-color: black;

            &::before {
                content: '';
                position: absolute;
                inset: 0;
                background-image: var(--bg-image);
                opacity: 0.15;
                pointer-events: none;
            }

            .form-wrapper {
                display: flex;
                flex-direction: column;
                gap: 1.5rem;
                max-width: 570px;
                margin: auto;
                position: relative;
            }

            .form-heading {
                text-align: center;

                .title {
                    font-size: var(--text-30px);
                }

                .subtitle {
                    font-size: var(--text-18px);
                }
            }

            form {
                display: flex;
                flex-direction: column;
                gap: 1rem;
            }

            .fields-wrapper {
                display: grid;
                grid-template-columns: repeat(2, 1fr);
                gap: 0.5rem 0.625rem;
            }

            .full-row {
                grid-column: span 2;
            }

            .wpcf7-form-control-wrap {
                display: flex;
                flex-direction: column;
                gap: 0.25rem;
            }

            input.wpcf7-text {
                height: 40px;
            }

            .wpcf7 input[type="tel"] {
                direction: rtl;
            }

            textarea {
                padding-block: 1rem;
                height: 100px;
                min-height: 100px;
                max-height: 200px;
            }

            .wpcf7-list-item {
                margin: 0;
            }

            .wpcf7-checkbox label {
                display: flex;
                align-items: center;
            }

            .cf7-row-two {
                display: flex;
                gap: 0.5rem;
            }

            .cf7-col {
                flex: 1;
            }

            .cf7-row textarea {
                width: 100%;
            }

            .submit-wrapper {
                display: flex;
                align-items: center;
                justify-content: center;
                padding-block-start: 1rem;
            }

            .submit {
                max-width: 240px;
                width: 100%;
            }
        }
    }
}

@media (max-width: 1366px) {
    .section-form {
        .top {
            flex-direction: column;
        }
    }
}

@media (max-width: 1023px) {
    .section-form {
        .bg-wrapper {
            padding: 1rem;
        }

        .right .description {
            word-break: break-word;
        }

        .left .form-container {
            padding: 2rem 1rem;
        }
    }
}