.impact-dashboard {
    position: relative;
    overflow: hidden;
    background: linear-gradient(135deg, #f4f8f2 0%, #fff 55%, #f7f9f5 100%);
}

.impact-dashboard::before {
    position: absolute;
    width: 360px;
    height: 360px;
    top: -180px;
    right: -120px;
    border-radius: 50%;
    background: rgba(87, 179, 62, .1);
    content: "";
}

.impact-dashboard__heading { max-width: 760px; margin-inline: auto; }
.impact-dashboard__heading > p { margin: 15px auto 12px; max-width: 650px; }
.impact-dashboard__status { color: var(--body-color); font-size: 14px; font-weight: 600; }
.impact-dashboard__status i { display: inline-block; width: 8px; height: 8px; margin-right: 7px; border-radius: 50%; background: var(--theme-color); box-shadow: 0 0 0 5px rgba(87,179,62,.13); }

.impact-dashboard__grid { position: relative; z-index: 20; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 18px; }
/* glassimophic kpi */
.impact-kpi { display: flex; flex-direction: column; align-items: center; padding: 25px 20px 20px; border-radius: 15px; color: var(--title-color); background: rgba(255,255,255,.5); box-shadow: 0 15px 40px rgba(14,18,29,.14); backdrop-filter: blur(10px); transition: all .3s ease-in-out; }
.impact-kpi:hover { transform: translateY(-5px); box-shadow: 0 16px 40px rgba(14,18,29,.1); }
.impact-kpi__icon { display: grid; width: 43px; height: 43px; margin-bottom: 20px; place-items: center; border-radius: 50%; color: #fff; background: var(--theme-color); }
.impact-kpi__label { min-height: 44px; margin-bottom: 8px; font-size: 14px; line-height: 1.45; }
.impact-kpi__value { margin: 0; color: var(--title-color); font-family: var(--title-font); font-size: clamp(20px, 2vw, 27px); font-weight: 700; white-space: nowrap; text-align: center; }
.impact-chart { position: relative; z-index: 10; margin-top: 25px; padding: 25px 30px 20px; border-radius: 15px; color: #fff; background: var(--title-color); box-shadow: 0 15px 40px rgba(14,18,29,.14); }
.impact-chart__header { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.impact-chart .sub-title { margin-bottom: 2px; }
.impact-chart .box-title { margin: 0; color: #fff; }
.impact-chart__updated { color: rgba(255,255,255,.65); font-size: 13px; }
.impact-chart__canvas { position: relative; height: 190px; margin-top: 12px; }
.impact-chart canvas { width: 100%; height: 100%; }

.impact-dashboard__overlay { position: absolute; width: 100%; height: 100%; top: -16rem; left: 0; z-index: 1; pointer-events: none; }
.impact-dashboard__overlay img { width: 100%; height: 100%; object-fit:contain; opacity: .10; }

@media (max-width: 1199px) { .impact-dashboard__grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 767px) { .impact-dashboard__grid { grid-template-columns: repeat(2, 1fr); } .impact-chart { padding-inline: 18px; } }
@media (max-width: 575px) { .impact-dashboard__grid { grid-template-columns: 1fr; } .impact-kpi { display: flex; align-items: center; gap: 16px; padding: 18px; } .impact-kpi__icon { flex: 0 0 43px; margin: 0; } .impact-kpi__label { min-height: 0; } .impact-chart__header { align-items: flex-start; flex-direction: column; gap: 5px; } }
@media (prefers-reduced-motion: reduce) { .impact-kpi { transition: none; } }