.contact-form { }
.contact-form .inner { display: flex; }
.contact-form .form { flex-basis: 60%; background-color: #FFF; padding: 2rem; border-radius: 0.5rem; box-shadow: 0rem 0rem 1rem -0.5rem black; position: relative; z-index: 5; }
.contact-form .f-name,
.contact-form .f-subject,
.contact-form .dsgvo
 { flex-basis: 100%; }
.contact-form .title { color: var(--clr-accent-400); }
.contact-form .submit-btn { margin-left: auto; }

.contact-form .contacts { flex-basis: 40%; margin-left: auto; background-color: var(--clr-primary-400); border-top-right-radius: 0.5rem; border-bottom-right-radius: 0.5rem; position: relative; z-index: 2; padding: 4rem 2rem; height: -moz-fit-content; height: fit-content; margin-top: 2rem; }
.contact-form .item { display: flex; margin-bottom: 3rem; }
.contact-form .item:last-of-type { margin-bottom: 0rem; }
.contact-form .item .icon { width: 3rem; height: 3rem; margin: auto 0; margin-right: 2rem; margin-left: 1rem; background-size: contain; background-repeat: no-repeat; background-position: center; }
.contact-form .item .text { color: #FFF; display: block; margin-right: auto; }
.contact-form .item .text:hover { opacity: .8; }
.contact-form .item .type { font-size: var(--fs-600); display: block; margin-bottom: 0.5rem; }
.contact-form .item .value { }


@media(max-width: 1150px){
    .contact-form .contacts { padding: 3rem 1.5rem; }
    .contact-form .item .icon { margin-left: 0; }
}

@media(max-width: 1000px){
    .contact-form .contacts { padding: 3rem 1rem; }
}
@media(max-width: 900px){
    .contact-form .inner { flex-wrap: wrap; flex-direction: column-reverse; }
    .contact-form .contacts { flex-basis: 100%; width: 100%; max-width: 32.5rem; margin: auto; margin-bottom: 4rem;  border-radius: 0.5rem; padding: 4rem 2rem; box-shadow: 0rem 0rem 1rem -0.5rem black; }
    .contact-form .item .icon { margin-left: 3rem; }
    .contact-form .form { flex-basis: 100%; }
}
@media(max-width: 700px){
    .contact-form .split.split-2 > * { flex-basis: 100%; padding: 0; }
}
@media(max-width: 500px){
    .contact-form .form { padding: 1.5rem; }
    .contact-form .item .icon { margin-left: 0rem;  }
}
@media(max-width: 500px){
    .contact-form .submit-btn { width: 100%; }
}