/* ==========================================================================
   Contact Us page — additive only, loaded after home.css + navbar-footer.css
   ========================================================================== */

/* ---------- breadcrumb ---------- */
.breadcrumb-section{background:#F3F2FB;padding:44px 0 36px;text-align:center}
.breadcrumb-section h1{font-size:clamp(26px,3.4vw,36px);font-weight:700}
.breadcrumb-section nav{margin-top:12px;font-size:13.5px;color:var(--ink-soft);display:flex;align-items:center;justify-content:center;gap:8px}
.breadcrumb-section nav a{color:var(--ink-soft)}
.breadcrumb-section nav a:hover{color:var(--primary)}
.breadcrumb-section nav i{font-size:10px}
.breadcrumb-section nav span{color:var(--ink);font-weight:600}

/* ---------- info cards ---------- */
.contact-cards{padding:48px 0 8px}
.contact-cards-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.contact-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);padding:28px}
.contact-card-icon{width:48px;height:48px;border-radius:12px;background:#EEEDFB;color:var(--primary);display:grid;place-items:center;font-size:20px;margin-bottom:16px}
.contact-card h4{font-family:'Sora',sans-serif;font-size:16px;font-weight:600}
.contact-card p{margin-top:8px;font-size:13.5px;color:var(--ink-soft);line-height:1.6}
.contact-card p a{color:var(--ink-soft)}

/* ---------- form + map ---------- */
.contact-main{padding:48px 0 90px}
.contact-main-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:stretch}

.contact-form-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);padding:32px}
.contact-form-card h3{font-family:'Sora',sans-serif;font-size:19px;font-weight:700}
.contact-form-sub{margin-top:6px;font-size:13.5px;color:var(--ink-soft)}

.contact-form-card form{margin-top:22px;display:flex;flex-direction:column;gap:14px}
.contact-form-card .form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.contact-form-card input,.contact-form-card select,.contact-form-card textarea{
  width:100%;padding:13px 14px;border:1px solid var(--border);border-radius:10px;
  background:#FAFAFC;font:inherit;font-size:14px;color:var(--ink);
}
.contact-form-card input:focus,.contact-form-card select:focus,.contact-form-card textarea:focus{
  outline:none;border-color:var(--primary);background:#fff;
}
.contact-form-card textarea{resize:vertical;min-height:96px}
.contact-form-card select{color:var(--ink-soft)}

.captcha-label{font-family:'Sora',sans-serif;font-weight:700;font-size:18px;margin-top:2px}
.captcha-input{max-width:220px}

.contact-submit{width:100%;margin-top:4px}

.form-alert{display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:10px;font-size:13.5px;margin-top:18px}
.form-alert.is-success{background:#E9F9EE;color:#15803D}
.form-alert.is-error{background:#FEEBEE;color:#B91C3C}

.contact-map{border-radius:var(--radius-lg);overflow:hidden;border:1px solid var(--border);box-shadow:var(--shadow-sm);min-height:420px}
.contact-map iframe{display:block}

@media (max-width:900px){
  .contact-cards-grid{grid-template-columns:1fr}
  .contact-main-grid{grid-template-columns:1fr}
  .contact-map{min-height:320px}
}
@media (max-width:600px){
  .contact-form-card .form-row{grid-template-columns:1fr}
}