/* ===== Contact page (1:1 to design) ===== */
.contact-hero{position:relative; height:560px;}
.contact-hero::after{content:''; position:absolute; inset:0; background:linear-gradient(0deg,rgba(0,0,0,.18),rgba(0,0,0,.18));}
.contact-hero h1{position:absolute; left:72px; bottom:92px; z-index:2; font-size:56px; line-height:1.1; font-weight:800; color:#fff; letter-spacing:.5px;}
@media (max-width:1024px){.contact-hero{height:300px;} .contact-hero h1{left:40px; bottom:72px; font-size:44px;}}
@media (max-width:767.98px){.contact-hero{height:240px;} .contact-hero h1{left:24px; bottom:48px; font-size:34px;}}

.contact-wrap{max-width:1180px; margin:0 auto; padding:48px 24px 80px;}
.contact-grid{display:grid; grid-template-columns:1fr 1fr; gap:32px;}
@media (max-width:991.98px){.contact-grid{gap:24px;}}
@media (max-width:767.98px){.contact-grid{grid-template-columns:1fr;}}

.contact-card{background:#fff; border-radius:2px; box-shadow:0 10px 22px rgba(0,0,0,.08); overflow:hidden;}
.contact-card .card-head{background:#f18900; color:#fff; font-weight:700; padding:16px 22px; font-size:16px;}
.contact-card .card-body{padding:22px;}
.contact-card .row{display:flex; padding:6px 0;}
.contact-card .label{width:68px; color:#777;}
.contact-card .value{color:#222;}
.contact-card .value a{color:#222; text-decoration:none}
.contact-card .value a:hover{color:#f18900}
