/* ====================================
   CONTAINER
==================================== */

.contact-page .container{
    max-width:1140px;
}


/* HERO */

.contact-hero{

    min-height:500px;
    display:flex;
    align-items:center;
    background:
    linear-gradient(
        rgba(7,26,51,.75),
        rgba(7,26,51,.75)
    ),
    url('../img/contact-hero.jpg');

    background-size:cover;
    background-position:center;
	
	display:flex;

    align-items:center;

    background-size:cover;

    background-position:center;
}


.hero-content{
    max-width:1000px;
    color:#fff;
}

.hero-subtitle{
	
    display:inline-block;

    margin-bottom:15px;

    color:#23b5c9;

    font-weight:700;

    letter-spacing:2px;

    text-transform:uppercase;
}

.contact-hero h1{
	
    font-size:50px;
    line-height:1.05;
    margin-bottom:25px;
    color:#fff;
	max-width:800px;
}

.contact-hero p{

    font-size:20px;
    line-height:1.7;
    color:#d7e2eb;
    margin-bottom:35px;
}

/* CONTACT */

.contact-section{

    padding:80px 0;
}

.contact-grid{

    display:grid;

    grid-template-columns:1fr 1fr;

    gap:60px;
}

.contact-info h2,
.contact-form-box h2{

    margin-bottom:30px;
}

.section-number{

    color:#22c7dd;

    font-weight:700;

    display:block;

    margin-bottom:10px;
}

.contact-item{

    margin-bottom:35px;
}

.contact-item h3{

    color:#071a33;

    margin-bottom:8px;
}

.contact-item a{

    color:#22c7dd;

    text-decoration:none;

    font-weight:600;
}

/* FORMULARZ */

.contact-form-box{

    background:#f7f9fb;

    padding:40px;

    border-radius:14px;
}

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

    width:100%;

    padding:14px;

    margin-bottom:15px;

    border:1px solid #ddd;

    border-radius:8px;
}

.contact-form-box input[type="submit"]{

    background:#22c7dd;

    color:#fff;

    border:none;

    cursor:pointer;

    font-weight:700;
}

/* OBSZAR */

.contact-area{

    padding:80px 0;

    background:#f5f7fa;
}

.countries-grid{

    display:grid;

    grid-template-columns:repeat(4,1fr);

    gap:25px;
}

.country-card{

    background:#fff;

    padding:30px;

    text-align:center;

    border-radius:12px;

    font-weight:600;

    box-shadow:
    0 8px 20px rgba(0,0,0,.05);
}

/* CTA */

.contact-cta{

    padding:80px 0;

    background:#02152d;

    text-align:center;
}

.contact-cta h2{

    color:#fff;

    margin-bottom:20px;
}

.contact-cta p{

    color:#d8e2ec;

    margin-bottom:30px;
}

/* CONTACT FORM 7 */

.wpcf7{
    width:100%;
}

.cf7-row{
    margin-bottom:20px;
}

.cf7-row label{

    display:block;

    margin-bottom:8px;

    font-weight:600;

    color:#071a33;
}

.wpcf7 input,
.wpcf7 textarea{

    width:100%;

    padding:14px 16px;

    border:1px solid #d8dce0;

    border-radius:8px;

    font-size:16px;

    transition:.3s;
}

.wpcf7 textarea{

    min-height:180px;

    resize:vertical;
}

.wpcf7 input:focus,
.wpcf7 textarea:focus{

    outline:none;

    border-color:#22c7dd;
}

.wpcf7-submit{

    background:#22c7dd !important;

    color:#fff !important;

    border:none !important;

    padding:16px 30px !important;
	
	min-height:54px;

    border-radius:8px !important;

    font-weight:700 !important;

    cursor:pointer;

    transition:.3s;
}

.wpcf7-submit:hover{

    background:#18b4c9 !important;
}

/* ====================================
   RESPONSIVE
==================================== */

@media(max-width:992px){

    .contact-grid{
        grid-template-columns:1fr;
        gap:40px;
    }

    .countries-grid{
        grid-template-columns:repeat(2,1fr);
    }

    .contact-hero h1{
        font-size:42px;
    }

    .contact-form-box{
        padding:30px;
    }

}

@media(max-width:768px){

    .contact-hero{
        min-height:420px;
        padding-bottom:50px;
    }

    .contact-hero h1{
        font-size:34px;
        line-height:1.1;
    }

    .contact-hero p{
        font-size:18px;
    }

    .contact-section{
        padding:60px 0;
    }

    .contact-info h2,
    .contact-form-box h2{
        margin-bottom:20px;
    }

    .contact-form-box{
        padding:25px;
    }

    .contact-cta h2{
        font-size:32px;
    }

}

@media(max-width:480px){

    .contact-hero{
        min-height:280px;
        padding-bottom:40px;
    }

    .contact-hero h1{
        font-size:28px;
    }

    .contact-hero p{
        font-size:16px;
    }

    .countries-grid{
        grid-template-columns:1fr;
    }

    .country-card{
        padding:20px;
        font-size:18px;
    }

    .contact-form-box{
        padding:20px;
    }

    .wpcf7 input,
    .wpcf7 textarea{
        padding:12px;
    }

    .contact-cta{
        padding:60px 0;
    }

    .contact-cta h2{
        font-size:28px;
    }

    .contact-cta p{
        font-size:16px;
    }

    .btn-primary,
    .btn-secondary,
    .wpcf7-submit{
        width:100%;
        text-align:center;
    }

}