{
    "$schema": "https://ui.shadcn.com/schema/registry-item.json",
    "name": "stats-band",
    "type": "registry:component",
    "title": "Stats band",
    "description": "A row of large headline numbers with labels.",
    "registryDependencies": [
        "tokens"
    ],
    "meta": {
        "category": "Marketing",
        "layout": "block"
    },
    "files": [
        {
            "path": "components/stats-band.html",
            "type": "registry:file",
            "target": "components/stats-band.html",
            "content": "<!-- Stats band\n     A row of headline numbers with labels. Marketing theme. -->\n\n<section class=\"dp-stats-band\">\n  <div class=\"dp-stat-big\">\n    <div class=\"dp-stat-big-val\">400M+</div>\n    <div class=\"dp-stat-big-label\">Domains tracked</div>\n  </div>\n  <div class=\"dp-stat-big\">\n    <div class=\"dp-stat-big-val\">99%</div>\n    <div class=\"dp-stat-big-label\">Of registered domains covered</div>\n  </div>\n  <div class=\"dp-stat-big\">\n    <div class=\"dp-stat-big-val\">Monthly</div>\n    <div class=\"dp-stat-big-label\">Full dataset refresh</div>\n  </div>\n  <div class=\"dp-stat-big\">\n    <div class=\"dp-stat-big-val\">700+</div>\n    <div class=\"dp-stat-big-label\">Data points per domain</div>\n  </div>\n</section>\n"
        },
        {
            "path": "components/stats-band.css",
            "type": "registry:file",
            "target": "components/stats-band.css",
            "content": "/* Stats band\n   A row of large headline numbers with labels. Colour and type from tokens.css\n   (marketing theme). */\n\n.dp-stats-band {\n  display: grid;\n  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));\n  gap: var(--dp-space-8);\n  max-width: 72rem;\n  margin: 0 auto;\n  padding: var(--dp-space-12) var(--dp-space-6);\n  text-align: center;\n}\n\n.dp-stat-big-val {\n  font-size: var(--dp-text-4xl);\n  font-weight: var(--dp-weight-extrabold);\n  line-height: 1;\n  color: var(--dp-navy);\n  font-variant-numeric: tabular-nums;\n}\n\n.dp-stat-big-label {\n  margin-top: var(--dp-space-2);\n  font-size: var(--dp-text-base);\n  color: var(--dp-text-muted);\n}\n"
        }
    ]
}
