.contact-section{

max-width:1000px;
margin:100px auto;
text-align:center;

}

.contact-section h1{

font-size:42px;
color:#60a5fa;
margin-bottom:10px;

}

.contact-sub{

color:#94a3b8;
margin-bottom:50px;

}

.contact-container{

display:grid;
grid-template-columns:1fr 1fr;
gap:40px;

}

.contact-form{

background:#020617;
padding:30px;
border-radius:12px;

border:1px solid rgba(255,255,255,0.08);

display:flex;
flex-direction:column;
gap:15px;

}

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

background:#0f172a;

border:none;

padding:12px;

border-radius:8px;

color:white;

}

.contact-form textarea{

min-height:120px;
resize:none;

}

.contact-form button{

background:linear-gradient(135deg,#3b82f6,#2563eb);

border:none;

padding:12px;

border-radius:8px;

color:white;

cursor:pointer;

transition:0.3s;

}

.contact-form button:hover{

transform:translateY(-2px);

box-shadow:0 0 12px rgba(59,130,246,0.6);

}

.contact-info{

background:#020617;
padding:30px;
border-radius:12px;

border:1px solid rgba(255,255,255,0.08);

text-align:left;

}

.contact-info h3{

color:#60a5fa;
margin-bottom:15px;

}

.contact-info p{

margin-bottom:10px;
color:#cbd5f5;

}

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

@media (max-width: 768px) {

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

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

}

/* små mobil */
@media (max-width: 480px) {

    .contact-form,
    .contact-info {
        padding: 20px;
    }

}