
.heda-bangui-case{
    --orange:#f47721;
    --blue:#165fa8;
    --dark:#202b36;
    --text:#424a52;
    --muted:#717981;
    --light:#f5f7f8;
    --line:#e2e5e8;
    max-width:1160px;
    margin:0 auto;
    padding:8px 18px 60px;
    font-family:Arial,Helvetica,sans-serif;
    color:var(--text);
    line-height:1.72;
}

.heda-bangui-case *{box-sizing:border-box;}
.heda-bangui-case h1,.heda-bangui-case h2,.heda-bangui-case h3,.heda-bangui-case p{margin-top:0;}

.bg-intro{
    padding:25px 30px;
    margin-bottom:20px;
    background:var(--light);
    border-left:4px solid var(--orange);
}

.bg-label,.bg-kicker{
    display:block;
    margin-bottom:7px;
    color:var(--orange) !important;
    font-size:11px;
    font-weight:700;
    letter-spacing:1.2px;
    text-transform:uppercase;
}

.bg-intro h1{color:var(--dark) !important;font-size:30px;}
.bg-intro p{color:var(--muted) !important;font-size:15px;margin-bottom:0;}

.bg-meta{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    margin-bottom:32px;
    border:1px solid var(--line);
}

.bg-meta-item{padding:16px 19px;border-right:1px solid var(--line);}
.bg-meta-item:last-child{border-right:0;}

.bg-meta-label{
    display:block;
    color:var(--orange) !important;
    font-size:10px;
    font-weight:700;
    text-transform:uppercase;
}

.bg-meta-value{
    display:block;
    margin-top:4px;
    color:var(--dark) !important;
    font-size:14px;
    font-weight:700;
}

.bg-image{margin:28px 0 38px;}
.bg-image img{display:block;width:100%;height:auto;}
.bg-caption{margin:9px 0 0 !important;color:#899098 !important;text-align:center;font-size:12px;}

.bg-section{margin:38px 0;}
.bg-heading{max-width:850px;margin-bottom:20px;}

.bg-section h2,
.bg-progress h2,
.bg-install h2{
    color:var(--dark) !important;
    font-size:26px;
}

.bg-section p,
.bg-progress p,
.bg-install p{
    color:var(--text) !important;
}

.bg-two-col{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:20px;
}

.bg-card{
    padding:25px 27px;
    border:1px solid var(--line);
}

.bg-card:first-child{border-top:3px solid var(--blue);}
.bg-card:last-child{border-top:3px solid var(--orange);}
.bg-card h3{color:var(--dark) !important;}
.bg-card p{color:var(--muted) !important;font-size:14px;}


/* =========================================================
   DARK STATS — HIGH PRIORITY CONTRAST FIX
========================================================= */

.bg-stats{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    margin:38px 0;
    background:#202b36 !important;
    color:#ffffff !important;
}

.bg-stat{
    padding:28px 26px;
    border-right:1px solid rgba(255,255,255,.17);
    color:#ffffff !important;
}

.bg-stat:last-child{border-right:0;}

.bg-stats .bg-stat-value{
    display:block;
    margin-bottom:5px;
    color:#f47721 !important;
    font-size:29px;
    line-height:1.15;
    font-weight:700;
}

.bg-stats .bg-stat-title{
    display:block;
    margin-bottom:5px;
    color:#ffffff !important;
    font-size:13px;
    font-weight:700;
}

.bg-stats .bg-stat-text{
    display:block;
    color:#d1d7dc !important;
    font-size:12px;
    line-height:1.5;
}


/* PLANNING */

.bg-planning{
    padding:30px 32px;
    background:var(--light);
    border-left:4px solid var(--blue);
}

.bg-planning h2{color:var(--dark) !important;}
.bg-planning > p{color:var(--text) !important;}

.bg-planning-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:16px;
    margin-top:22px;
}

.bg-planning-item{
    padding:22px;
    background:#fff;
    border:1px solid var(--line);
}

.bg-planning-num{color:var(--orange) !important;font-size:11px;font-weight:700;}
.bg-planning-item h3{color:var(--dark) !important;}
.bg-planning-item p{color:var(--muted) !important;font-size:14px;}


/* =========================================================
   DARK SYSTEM — FIXED
========================================================= */

.bg-system{
    display:grid;
    grid-template-columns:.9fr 1.1fr;
    margin:38px 0;
    background:#202b36 !important;
    color:#ffffff !important;
}

.bg-system-title{
    padding:30px;
    background:#165fa8 !important;
    color:#fff !important;
}

.bg-system-title .bg-kicker{
    color:#dce8f3 !important;
}

.bg-system-title h2{
    margin:0;
    color:#ffffff !important;
    font-size:24px;
}

.bg-system-copy{
    padding:30px 34px;
    color:#ffffff !important;
}

.bg-system-copy p{
    color:#d6dce1 !important;
}

.bg-system-list{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:11px 18px;
}

.bg-system-point{
    position:relative;
    padding-left:17px;
    color:#ffffff !important;
    font-size:13px;
}

.bg-system-point::before{
    content:"✓";
    position:absolute;
    left:0;
    color:#f47721 !important;
}


/* TYPES */

.bg-types{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:20px;
}

.bg-type{
    padding:25px;
    border:1px solid var(--line);
}

.bg-type-head{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:12px;
}

.bg-type h3{color:var(--dark) !important;}

.bg-type-count{
    padding:5px 9px;
    background:var(--light);
    color:var(--blue) !important;
    font-size:12px;
    font-weight:700;
}

.bg-type p{color:var(--muted) !important;font-size:14px;}


/* INSTALL */

.bg-install{
    padding:29px 32px;
    margin:38px 0;
    border:1px solid var(--line);
    border-left:4px solid var(--orange);
}

.bg-install-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    margin-top:22px;
    border:1px solid var(--line);
    background:var(--light);
}

.bg-install-item{
    padding:19px;
    border-right:1px solid var(--line);
}

.bg-install-item:last-child{border-right:0;}
.bg-install-item strong{display:block;color:var(--dark) !important;}
.bg-install-item span{display:block;margin-top:5px;color:var(--muted) !important;font-size:12px;}

.bg-details{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:16px;
}

.bg-detail{padding:22px;background:var(--light);}
.bg-detail strong{color:var(--dark) !important;}
.bg-detail span{display:block;margin-top:5px;color:var(--muted) !important;font-size:13px;}

.bg-progress{
    padding:29px 32px;
    margin:38px 0;
    background:var(--light);
}

.bg-progress-badge{
    display:inline-block;
    padding:6px 10px;
    margin-bottom:13px;
    background:#fff3e9;
    color:#c85e14 !important;
    font-size:11px;
    font-weight:700;
    text-transform:uppercase;
}

.bg-progress-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    margin-top:22px;
    border:1px solid var(--line);
    background:#fff;
}

.bg-progress-item{padding:18px;border-right:1px solid var(--line);}
.bg-progress-item:last-child{border-right:0;}
.bg-check{color:var(--orange) !important;font-weight:700;}
.bg-progress-item strong{display:block;color:var(--dark) !important;}
.bg-progress-item span{display:block;margin-top:4px;color:var(--muted) !important;font-size:12px;}


/* =========================================================
   DARK CTA FIX
========================================================= */

.bg-cta{
    margin-top:44px;
    padding:34px 28px;
    text-align:center;
    background:#202b36 !important;
    color:#fff !important;
    border-top:4px solid var(--orange);
}

.bg-cta h2{
    color:#ffffff !important;
    font-size:25px;
}

.bg-cta p{
    max-width:750px;
    margin:0 auto 20px;
    color:#d1d7dc !important;
    font-size:14px;
}

.bg-cta-btn{
    display:inline-block;
    padding:13px 31px !important;
    background:#f47721 !important;
    color:#ffffff !important;
    text-decoration:none !important;
    font-weight:700 !important;
}

@media(max-width:900px){
    .bg-meta,.bg-install-grid,.bg-progress-grid{grid-template-columns:repeat(2,1fr);}
    .bg-planning-grid,.bg-details{grid-template-columns:1fr;}
    .bg-system{grid-template-columns:1fr;}
}

@media(max-width:640px){
    .bg-meta,.bg-stats,.bg-two-col,.bg-types,.bg-install-grid,.bg-progress-grid{grid-template-columns:1fr;}
    .bg-system-list{grid-template-columns:1fr;}
}
