/* ===============================
        CONTACT PAGE MAIN
=============================== */

.contact-page{
max-width:1100px;
margin:60px auto;
padding:0 20px;
}

.contact-grid{
display:grid;
grid-template-columns:1fr 1fr;
gap:60px;
align-items:start;
}

.contact-info p{
margin-bottom:25px;
line-height:1.7;
color:#555;
}

.contact-info a{
color:#ec252f;
font-weight:bold;
text-decoration:none !important;
}

.contact-info a:hover{
text-decoration:underline;
}

.contact-note{
  display:inline-block;
  margin-top:10px;
  color:#777;
  font-size:14px;
  line-height:1.5;
}

/* ======= CONTACT HERO ======= */
.hero-contact{
height:350px;
background:url("../images/home/hero_contact4.webp") center/cover no-repeat;
display:flex;
align-items:center;
justify-content:center;
color:white;
text-align:center;
position:relative;
}

.hero-contact::before{
content:"";
position:absolute;
inset:0;
background:rgba(0,0,0,0.35);
}

.hero-contact h1{
font-size:60px;
font-weight:700;
position:relative;
z-index:1;
}

/* ======= CONTACT FORM ======= */
.contact-form{
background:#fff;
padding:35px;
border-radius:10px;
box-shadow:0 4px 15px rgba(0,0,0,0.08);
}

.contact-form input,
.contact-form textarea{
width:100%;
padding:12px;
margin-bottom:15px;
border:1px solid #ddd;
border-radius:6px;
font-size:14px;
font-family:Arial, Helvetica, sans-serif;
}

.contact-form textarea{
height:120px;
resize:vertical;
}

.contact-form select{
width:100%;
padding:12px;
margin-bottom:15px;
color:#777;
border:1px solid #ddd;
border-radius:6px;
font-size:14px;
font-family:Arial, Helvetica, sans-serif;
background:white;
}

.contact-form button{
cursor:pointer;
}

.contact-info .btn-black{
background:#e5e5e5;
color:#222 !important;
padding:10px 18px;
font-size:14px;
border-radius:6px;
display:inline-block;
margin-top:6px;
}

.contact-info .btn-black:hover{
  background:#d6d6d6;
  color:#222 !important;
}