/* ===== Contact page ===== */
.sub-hero{padding:56px 0;border-bottom:1px solid var(--line)}
.breadcrumbs{color:var(--muted);font-size:.95rem;margin-bottom:8px}
.breadcrumbs a{color:var(--muted)} .breadcrumbs a:hover{color:var(--text)}
.page-title{margin:0;font-size:clamp(26px,4vw,42px);font-weight:800}
.page-lead{color:#b9c2ea;max-width:860px}

/* Methods */
.contact-methods{display:grid;gap:20px;margin-top:24px}
@media(min-width:900px){.contact-methods{grid-template-columns:repeat(3,1fr)}}
.method{
  background:var(--card);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow);
  text-align:center;padding:28px 20px;transition:.3s ease
}
.method:hover{transform:translateY(-5px);border-color:var(--gold)}
.method i{font-size:2.4rem;color:var(--gold);margin-bottom:10px}
.method h3{margin:8px 0;font-weight:800}
.method p{color:#cfe0ff;margin-bottom:16px;font-size:.95rem}

/* Form */
.form-wrap{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:18px;box-shadow:var(--shadow);margin-top:18px}
.form-grid{display:grid;gap:12px}
@media(min-width:900px){.form-grid{grid-template-columns:repeat(2,1fr)}}
.form-grid .full{grid-column:1/-1}
.form-row{display:grid;gap:8px}
.form-row label{font-weight:700}
.hint{font-size:.92rem;color:#9bb0d3}
.form-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:8px}
.form-actions .btn{padding:12px 22px}

/* Honeypot */
.hp{position:absolute !important;left:-9999px !important;opacity:0 !important;height:0 !important;width:0 !important;pointer-events:none}

/* Alerts */
.alert{display:none;margin-top:12px;padding:12px;border-radius:12px;border:1px solid #2e7d32;background:#0f2a17;color:#d9ffdf}
.alert.show{display:block}
.alert.err{border-color:#904040;background:#2a1111;color:#ffd9d9}

/* Map */
.mapbox{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:10px;box-shadow:var(--shadow);margin-top:18px}
.map-embed{width:100%;aspect-ratio:16/9;border:0;border-radius:12px;filter:grayscale(20%) saturate(105%)}

/* CTA — يمكن توحيد الخلفية عبر override */
.contact .cta-section{
  border:1px solid var(--line);border-radius:14px;padding:18px;
  background:linear-gradient(0deg,rgba(11,16,32,.45),rgba(11,16,32,.45)),url('/img/programing.jpg') center/cover no-repeat;
  text-align:center
}

/* Small tweak for social links row if لزم */
.social-row{display:flex;flex-wrap:wrap;gap:12px;margin-top:10px}
.social-row a{color:#fff}
.social-row a:hover{color:var(--gold)}


