@import url('variables.css');

:root{
    --marginBottom-m-desk: 20px;
}

#contact{
    display: flex;
    gap: var(--gap-l-desk);
    padding-top: 160px;     
    padding-bottom: 160px;  
}

.kontakt-img img{
    width: 280px;
    height: 380px;
    object-fit: cover;
    border-radius: var(--img-borderRadius);
}

.kontakt-p p{
    font-size: var(--p-m-lap);
    color: var(--black);
    font-family: Inter;
    font-weight: var(--fontWeight-extraLight);
    margin-bottom: var(--marginBottom-m-desk);
    line-height: 1.4;
}

/*   -----   TABLET   -----     TABLET     -----     TABLET      -----  */
@media screen and (max-width: 1280px){
    .kontakt-p p{
        font-size: var(--p-m-tab);
    }
}

/*   -----   MOBILE   -----     MOBILE     -----     MOBILE      -----  */
@media screen and (max-width: 767px){
    .kontakt-p p{
        font-size: var(--p-m-mob);
    }

    #contact{
        gap: 0;
    }

    .kontakt-img img{
        display: none;
    }
}