/* ===========================
   STRONA KONTAKT
=========================== */

.contact-page{
    max-width:900px;
    margin:60px auto;
    padding:0 25px;
    text-align:center;
}

.contact-intro{
    max-width:650px;
    margin:0 auto 50px;
    color:#d7d7d7;
    line-height:1.9;
    font-size:1.05rem;
}

/* ===========================
   FORMULARZ
=========================== */

.contact-form{
    max-width:700px;
    margin:0 auto;
}

.contact-form input,
.contact-form textarea{

    width:100%;
    padding:18px 20px;
    margin-bottom:22px;

    background:#161616;
    color:#fff;

    border:1px solid rgba(212,175,55,.25);
    border-radius:8px;

    font-size:1rem;
    font-family:'Montserrat',sans-serif;

    transition:
        border-color .3s,
        box-shadow .3s,
        background-color .3s;

}

.contact-form input::placeholder,
.contact-form textarea::placeholder{

    color:#9a9a9a;

}

.contact-form input:focus,
.contact-form textarea:focus{

    outline:none;

    background:#1b1b1b;

    border-color:#d4af37;

    box-shadow:0 0 10px rgba(212,175,55,.25);

}

.contact-form textarea{

    resize:vertical;

    min-height:220px;

}

/* ===========================
   PRZYCISK
=========================== */

.contact-form button{

    margin-top:10px;

    padding:16px 55px;

    background:#d4af37;

    color:#111;

    border:none;

    border-radius:40px;

    font-family:'Cinzel',serif;

    font-size:1rem;

    letter-spacing:2px;

    cursor:pointer;

    transition:all .35s ease;

}

.contact-form button:hover{

    background:#e6bf45;

    transform:translateY(-2px);

    box-shadow:0 10px 30px rgba(212,175,55,.35);

}

.contact-form button:active{

    transform:translateY(0);

}

/* ===========================
   KOMUNIKATY
=========================== */

.success-message{

    max-width:700px;

    margin:30px auto;

    padding:18px;

    background:#183a20;

    border:1px solid #46b35f;

    border-radius:8px;

    color:#c8ffd3;

    text-align:center;

}

.error-message{

    max-width:700px;

    margin:30px auto;

    padding:18px;

    background:#401b1b;

    border:1px solid #c44747;

    border-radius:8px;

    color:#ffd2d2;

    text-align:center;

}

/* ===========================
   DOLNA CZĘŚĆ
=========================== */

.contact-bottom{

    margin-top:60px;

    text-align:center;

}

.contact-bottom p{

    color:#999;

    font-size:1rem;

    letter-spacing:2px;

    margin-bottom:18px;

}

.contact-bottom a{

    color:#fff;

    text-decoration:none;

    font-size:1.25rem;

    display:inline-flex;

    align-items:center;

    gap:12px;

    transition:.3s;

}

.contact-bottom a:hover{

    color:#d4af37;

}

.contact-bottom i{

    color:#d4af37;

}

/* ==========================================
   RESPONSYWNOŚĆ
========================================== */

@media (max-width:768px){

    .contact-page{

        margin:40px auto;
        padding:0 18px;

    }

    .contact-intro{

        font-size:1rem;
        margin-bottom:35px;

    }

    .contact-form{

        max-width:100%;

    }

    .contact-form input,
    .contact-form textarea{

        padding:16px;

    }

    .contact-form textarea{

        min-height:180px;

    }

    .contact-form button{

        width:100%;

    }

    .contact-bottom{

        margin-top:45px;

    }

    .contact-bottom a{

        font-size:1rem;
        word-break:break-word;

    }

}