.header {
    background-image: linear-gradient(rgba(0, 0, 0, .4), rgba(0, 0, 0, .4)), url(/assets/img/kontakt-header.webp);
    height: 80vh;
    background-color: #000;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    display: flex;
    justify-content: center;
    align-items: center;
    padding-top: 98px
}

@media (max-width:768px) {
    .header {
        height: 60vh
    }
}

.header__content {
    max-width: 220px
}

@media (min-width:768px) {
    .header__content {
        max-width: 600px
    }
}

.header__content h1 {
    margin-bottom: 2rem;
    font-size: 2.4rem;
    font-weight: 600;
    line-height: 4rem;
    color: #fff
}

.header__content h4 {
    font-size: .9rem;
    color: var(--def)
}

@media (min-width:600px) {
    .header__content h1 {
        font-size: 3.2rem;
        line-height: 5rem
    }
}

@media (min-width:900px) {
    .header__content h1 {
        font-size: 4rem;
        line-height: 6rem
    }

    .header__content h4 {
        font-size: 1.1rem
    }
}