.f-contact-form {
    --column-gap: 30px;
    --column-gap-mobile: 16px;
    margin-top: 60px;
    margin-bottom: 60px
}

@media screen and (max-width: 767px) {
    .f-contact-form {
        margin-top: 40px;
        margin-bottom: 40px
    }
}

.f-contact-form .f-row {
    display: flex;
    flex-wrap: wrap
}

@media screen and (max-width: 1279px) {
    .f-contact-form .f-row {
        flex-wrap: wrap-reverse
    }
}

.f-contact-form .form-field form-field--input {
    vertical-align: middle
}

.f-contact-form__heading {
    font-size: 24px;
    line-height: 1.333;
    font-weight: 500;
    margin-bottom: 10px
}

.f-contact-form__description {
    color: rgb(var(--color-foreground-secondary));
    margin-bottom: 40px
}

@media screen and (max-width: 1023px) {
    .f-contact-form__description {
        margin-bottom: 24px
    }
}

.f-contact-form__message {
    margin-bottom: 20px;
    margin-top: calc(var(--column-gap))
}

@media screen and (max-width: 1023px) {
    .f-contact-form__message {
        margin-top: var(--column-gap-mobile)
    }
}

.f-contact-form__save {
    display: flex;
    align-items: start;
    margin-bottom: 30px
}

.f-contact-form__save input {
    width: 14px;
    height: 14px
}

.f-contact-form__main {
    margin-left: auto;
    margin-right: auto
}

@media screen and (min-width: 1280px) {
    .f-contact-form__main {
        padding-right: 100px
    }

    .f-contact-form__main--full {
        padding-right: 0
    }
}

.f-contact-form__info {
    --column-gap: 30px;
    margin-bottom: 10px
}

@media screen and (min-width: 1280px) {
    .f-contact-form__info {
        --column-gap: 0;
        flex-direction: column
    }
}

@media screen and (max-width: 767px) {
    .f-contact-form__info {
        flex-direction: column
    }
}

.f-contact-form .f-info-box {
    margin-bottom: 30px
}

.f-contact-information {
    margin-top: 50px;
    margin-bottom: 50px
}

.f-contact-information .f-row {
    --column-gap: 60px
}

@media screen and (max-width: 1023px) {
    .f-contact-information .f-row {
        --column-gap: 30px
    }
}

@media screen and (max-width: 767px) {
    .f-contact-information .f-row {
        --column-gap: 0;
        --row-gap-mobile: 30px;
        flex-direction: column
    }
}

.f-contact-information h3 {
    margin-bottom: 10px
}

.f-contact-information__text {
    color: rgb(var(--color-foreground-secondary))
}

.social-media-links {
    display: flex;
    align-items: center;
    column-gap: 24px;
    row-gap: 12px;
    flex-wrap: wrap
}

.social-media-links--item {
    display: flex;
    align-items: center
}

.social-media-links--label {
    padding-left: 10px
}