/* ============================
   Contact Page Styles (Standalone)
   ============================ */

:root{
  --navy:#05103A;
  --ink:#0d1b2a;
  --muted:#5b6b82;
  --accent:#ffb367;
  --accent-2:#4f8cff;
  --paper:#ffffff;
  --sheet:#f7f8fb;
  --line:#e6e9f0;
  --shadow:0 12px 28px rgba(5,16,58,.06);

  --hero-min-h: 360px;
  --row1-min-h: clamp(320px, 34vw, 460px);
}

/* ====== HERO ====== */
.sd-hero{
  position:relative;
  min-height:var(--hero-min-h);
  color:#fff;
  background-image:
    linear-gradient(180deg, rgba(0,0,0,.35), rgba(0,0,0,.6)),
    var(--sd-hero, url('/assets/images/hero-contact.jpg'));
  background-position:center;
  background-size:cover;
  background-repeat:no-repeat;
  display:grid;
  place-items:center;
  text-align:center;
}
.sd-hero-inner{
  position:relative;
  z-index:2;
  width:min(1200px,92%);
  padding:42px 0;
}
.sd-breadcrumb{
  display:flex; gap:8px; justify-content:center;
  opacity:.9; font-size:14px; margin-bottom:6px;
}
.sd-breadcrumb a{ color:#fff; text-decoration:none; border-bottom:1px solid transparent; }
.sd-breadcrumb a:hover{ border-color:#fff; }
.sd-title{ margin:8px 0 6px; font-size: clamp(28px,4.8vw,46px); font-weight:900; letter-spacing:.02em; }
.sd-lead{ margin:0 auto 14px; font-size:clamp(14px,2.2vw,18px); max-width:820px; opacity:.95; }

/* ====== PAGE WRAP ====== */
.sd-wrap{ background:var(--sheet); padding: clamp(28px,5vw,60px) 0; }

/* ====== GRID LAYOUT (Contact) ====== */
.sd-matrix{
  width:min(1200px,92%);
  margin:0 auto;
  display:grid;
  grid-template-columns: 1.25fr 1fr 0.95fr;
  gap: clamp(14px,2.2vw,22px);
  grid-template-areas:
    "media media aside"
    "text  text  aside"
    "off   off   aside"
    "cta   cta   empty";
  align-items:start;
}
.sd-media     { grid-area: media; }
.sd-text-card { grid-area: text;  }
.sd-aside     { grid-area: aside; }
.sd-offices   { grid-area: off;   }
.sd-cta       { grid-area: cta;   }

/* موبايل */
@media (max-width:1060px){
  .sd-matrix{
    grid-template-columns:1fr;
    grid-template-areas:
      "media"
      "text"
      "aside"
      "off"
      "cta";
  }
}

/* ====== MEDIA BLOCK ====== */
.sd-media{
  margin:0;
  border-radius:16px; overflow:hidden; border:1px solid var(--line);
  background:#eef1f6; box-shadow: var(--shadow);
  height: var(--row1-min-h);
  min-height: var(--row1-min-h);
}
.sd-media img{ width:100%; height:100%; object-fit:cover; display:block; }
.sd-media.noimg{ display:grid; place-items:center; color:#94a3b8; font-size:48px; }

/* ====== CARDS ====== */
.sd-card{
  background:var(--paper);
  border:1px solid var(--line);
  border-radius:16px;
  padding:16px;
  box-shadow: var(--shadow);
}
.sd-card h2, .sd-card h3{
  margin:0 0 12px; color:var(--navy);
  font-weight:900; font-size: clamp(18px,2vw,20px);
  display:flex; align-items:center; gap:10px;
}
.sd-card h3 i, .sd-card h2 i{
  width:28px; height:28px; border-radius:50%;
  display:grid; place-items:center;
  background:#0d1b2a; color:#fff; font-size:14px;
}

/* ====== CONTACT FORM ====== */
.sd-text-card{
  background:
    linear-gradient(90deg, rgba(79,140,255,.18), rgba(79,140,255,0)) 0 0/6px 100% no-repeat,
    var(--paper);
  border-left:6px solid rgba(79,140,255,.28);
}
[dir="rtl"] .sd-text-card{
  background:
    linear-gradient(-90deg, rgba(79,140,255,.18), rgba(79,140,255,0)) 100% 0/6px 100% no-repeat,
    var(--paper);
  border-left:1px solid var(--line);
  border-right:6px solid rgba(79,140,255,.28);
}

.contact-form{
  display:block;
}
.contact-form label span{
  font-size:13px; color:#334155; font-weight:700;
}
.contact-form input[type="text"],
.contact-form input[type="email"],
.contact-form textarea{
  border:1px solid var(--line);
  border-radius:10px;
  padding:10px 12px;
  font-size:15px;
  outline:none;
  background:#fff;
  transition:border-color .15s ease, box-shadow .15s ease;
}
.contact-form input:focus,
.contact-form textarea:focus{
  border-color:#c0d4ff;
  box-shadow:0 0 0 3px rgba(79,140,255,.15);
}
.sd-btn{
  display:inline-flex; align-items:center; gap:8px;
  background:linear-gradient(90deg, var(--accent-2), #6aa2ff);
  color:#fff; border-radius:10px; padding:11px 14px; text-decoration:none;
  border:1px solid #7aa8ff;
  font-weight:800; transition: transform .15s ease, filter .15s ease;
}
.sd-btn:hover{ transform:translateY(-2px); filter:brightness(1.04); }
.sd-btn.outline{
  background:transparent; color:#0d1b2a;
  border:1px solid var(--line);
}

/* ====== ASIDE (Support + Hours + Map) ====== */
.sd-aside{
  display:flex; flex-direction:column; gap:12px;
  position:sticky; top:18px;
}
.sd-social{ display:flex; gap:10px; margin-top:10px; flex-wrap:wrap; }
.sd-social a{
  width:38px; height:38px; border-radius:50%;
  display:grid; place-items:center; background:#0d1b2a; color:#fff;
  border:1px solid var(--line);
  transition: transform .15s ease, filter .15s ease;
}
.sd-social a:hover{ transform: translateY(-2px); filter: brightness(1.06); }
.sd-social .fa-whatsapp{ color:#25D366 } .sd-social .fa-facebook{ color:#1778f2 }
.sd-social .fa-x-twitter{ color:#fff } .sd-social .fa-instagram{ color:#ff5aa5 }
.sd-social .fa-linkedin{ color:#0a66c2 }
.sd-steps{ list-style:none; margin:0; padding:0; display:grid; gap:10px; }
.sd-steps li{
  display:flex; align-items:center; gap:10px;
  background:#f9fbff; border:1px solid var(--line);
  border-radius:12px; padding:10px 12px;
}
.sd-step-num{
  width:28px; height:28px; border-radius:50%;
  display:grid; place-items:center;
  background:var(--accent); color:#05103A; font-weight:900;
}

.sd-map iframe{
  display:block; width:100%; height:260px;
  border:0; border-radius:12px; overflow:hidden;
}

/* ====== OFFICES LIST ====== */
.sd-offices .sd-list{
  list-style:none; margin:0; padding:0;
  display:grid; gap:12px;
  grid-template-columns: repeat(2, minmax(0,1fr));
}
@media (max-width:920px){
  .sd-offices .sd-list{ grid-template-columns: 1fr; }
}
.sd-offices .sd-list li{
  display:flex; gap:12px; align-items:flex-start;
  border:1px solid var(--line); border-radius:12px; padding:12px;
  background:#fff;
}
.sd-offices .sd-list li i{
  width:28px; height:28px; border-radius:50%;
  display:grid; place-items:center; margin-top:2px;
  background:#eef2ff; color:#1d4ed8;
}
.sd-offices .sd-list strong{ color:var(--navy); font-weight:900; }
.sd-offices .sd-list span{ color:#334155; line-height:1.6; white-space:pre-line; }

/* ====== CTA ====== */
.sd-cta{
  display:flex; gap:16px; align-items:center; justify-content:space-between;
  background:linear-gradient(90deg,#05103A,#0d1b2a);
  color:#fff; border-radius:16px; padding:18px;
  box-shadow: var(--shadow);
}
.sd-cta h3{ margin:0 0 4px; font-size:22px; }
.sd-cta p{ margin:0; opacity:.95; }
.sd-cta-btn{
  display:inline-flex; align-items:center; gap:10px;
  background:var(--accent); color:#05103A; border-radius:999px;
  padding:12px 18px; text-decoration:none; border:1px solid var(--accent);
  font-weight:900; transition: transform .15s ease, filter .15s ease;
}
.sd-cta-btn:hover{ transform:translateY(-2px); filter:brightness(1.06); }

/* ====== RTL small fix ====== */
[dir="rtl"] .sd-breadcrumb{ direction:rtl; }