/* قواعد صفحة مركز الأعمال فقط.
   المشترك (الهيدر/الناف/الفوتر + بطاقة الرؤية/الرسالة) في css/site.css
   ويُحمَّل قبل هذا الملف.

   الفكرة نفسها المستخدمة في صفحة التوجهات الاستراتيجية: بطاقتا رؤية
   ورسالة بمكوّن site.css المشترك، ثم شبكات بطاقات بأيقونة دائرية 48px
   بخلفية #f3fcf6. عدد الأعمدة يتبع عدد العناصر في كل قسم (5 قيم،
   4 ركائز، 6 أهداف) كما تعرضها الصفحة الرسمية. */

.bc-section {
    padding: 40px 0 72px;
}

/* بطاقتا الرؤية والرسالة تستخدمان مكوّن site.css؛ نلغي مسافته الرأسية
   لأنها مضمّنة داخل قسم يحمل المسافة أصلاً. */
.vm-embedded {
    padding: 0;
    margin-bottom: 8px;
}

.bc-heading {
    margin: 40px 0 24px;
    font-size: 1.25rem;
    font-weight: 700;
    color: #161616;
}

.bc-grid {
    display: grid;
    gap: 24px;
    margin: 0;
    padding: 0;
}

.bc-grid--5 { grid-template-columns: repeat(5, 1fr); }
.bc-grid--4 { grid-template-columns: repeat(4, 1fr); }
.bc-grid--3 { grid-template-columns: repeat(3, 1fr); }

.bc-card {
    display: grid;
    gap: 12px;
    align-content: start;
    padding: 24px 20px;
    border: 1px solid #e5e7eb;
    border-radius: 16px;
    background: #fff;
}

.bc-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: #f3fcf6;
    color: #1b8354;
    flex: 0 0 auto;
}

.bc-icon svg {
    width: 24px;
    height: 24px;
    display: block;
}

.bc-title {
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.7;
    color: #161616;
}

/* ===== قنوات التواصل ===== */
.bc-contacts {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px;
    margin: 0;
    padding: 0;
    max-width: 720px;
}

.bc-contact {
    display: flex;
    gap: 16px;
    align-items: center;
    padding: 20px;
    border: 1px solid #e5e7eb;
    border-radius: 16px;
    background: #fff;
}

.bc-contact__text {
    display: grid;
    gap: 4px;
    min-width: 0;
}

.bc-contact__label {
    font-size: .875rem;
    font-weight: 700;
    color: #6c737f;
}

.bc-contact__value {
    font-size: 1rem;
    color: #166a45;
    overflow-wrap: anywhere;
}

@media (max-width: 1199.98px) {
    .bc-grid--5 { grid-template-columns: repeat(3, 1fr); }
    .bc-grid--4 { grid-template-columns: repeat(2, 1fr); }
    .bc-grid--3 { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 767.98px) {
    .bc-grid--5,
    .bc-grid--4,
    .bc-grid--3 { grid-template-columns: repeat(2, 1fr); }

    .bc-grid { gap: 16px; }

    .bc-card { padding: 20px 16px; }

    .bc-contacts { grid-template-columns: 1fr; }
}

@media (max-width: 479.98px) {
    .bc-grid--5,
    .bc-grid--4,
    .bc-grid--3 { grid-template-columns: 1fr; }
}