/* ====== Keyspace Area Insights - Layout & Cards ====== */
.ks-ai-wrap{max-width:980px;margin:0 auto;padding:8px 16px;}
.ks-ai-wrap h3{margin:22px 0 10px;font-size:18px;letter-spacing:.02em;text-transform:uppercase;color:#444;}
.ks-ai-cards { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; }
/* Card */
.ks-ai-card{
  border:1px solid #e5e7eb;
  border-radius:14px;
  padding:14px 16px;
  background:#fff;
  box-shadow:0 1px 2px rgba(0,0,0,.03);
  text-align: center;
}
.ks-ai-card h4{margin:0 0 6px;font-size:18px;}
.ks-ai-card .ks-ai-foot{margin-top:6px;font-size:12px;color:#666;}

/* OMI: full-width con badge coerente */
.ks-ai-omi{margin:26px 0 6px;}
.ks-ai-omi .ks-ai-badge{
  display:inline-block;background:#f3f4f6;border:1px solid #e5e7eb;
  padding:2px 8px;border-radius:999px;font-size:12px;color:#374151
}

/* Tipografia unità (se servono hook futuri) */
.ks-ai-card [data-metric="area_kmq"] h4::after{content:"";}
.ks-ai-card [data-metric="density_ab_kmq"] h4::after{content:"";}

@media (max-width: 1000px) {
.ks-ai-cards {display:grid; grid-template-columns:repeat(1,minmax(0,1fr)) !important; gap:15px; }
}

@media (min-width: 1000px) {
.ks-ai-cards { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; }
.ks-ai-wrap > .ks-ai-cards{grid-template-columns:repeat(2,minmax(0,1fr));}
.ks-ai-scores .ks-ai-cards{grid-template-columns:repeat(4,minmax(0,1fr));}
}