.chart-section{

margin-top:48px;

}

.chart-section h2{

font-size:28px;

font-weight:700;

margin-bottom:24px;

color:#111827;

}

.chart-grid{

display:grid;

grid-template-columns:repeat(auto-fit,minmax(260px,1fr));

gap:24px;

}

.chart-card{

background:#ffffff;

border-radius:18px;

padding:24px;

border:1px solid #e5e7eb;

box-shadow:0 10px 30px rgba(0,0,0,.05);

transition:.25s;

cursor:pointer;

}

.chart-card:hover{

transform:translateY(-6px);

box-shadow:0 18px 40px rgba(0,0,0,.12);

}

.chart-card h3{

font-size:18px;

margin-bottom:18px;

color:#111827;

}

.metric-value{

font-size:34px;

font-weight:800;

color:#2563eb;

margin-bottom:18px;

}

.chart-card p{

font-size:14px;

line-height:1.7;

color:#6b7280;

}

@media(max-width:900px){

.chart-grid{

grid-template-columns:1fr;

}

}