/* Shared IXM/DNSai component library — brand-neutral: every colour is var(--ixm-token, var(--dnsai-token)) so the same file
   recolours under ixm.ai's site.css or app.dnsai.com's theme.css. Source of truth: /home/dnsai/static/css/. */
.stats-wall { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; margin: 8px 0 0; }
.stats-wall .stat { padding: 20px 14px; border: 1px solid var(--border, var(--border-default)); border-radius: 14px; background: var(--surface, var(--bg-card)); display: flex; flex-direction: column; gap: 6px; }
.stats-wall .stat:nth-child(even) .stat-value { background: var(--gradient-spectrum, var(--brand-gradient)); -webkit-background-clip: text; background-clip: text; }
.stats-wall .stat-value { font-family: var(--font-display, inherit); font-weight: 700; font-size: clamp(18px, 1.55vw, 22px); white-space: nowrap; letter-spacing: -0.01em; font-variant-numeric: tabular-nums; background: linear-gradient(135deg,var(--accent),var(--accent-solid, var(--brand-blue))); -webkit-background-clip: text; background-clip: text; color: transparent; line-height: 1.05; }
.stats-wall .stat-label { color: var(--muted, var(--text-muted)); font-size: 13px; line-height: 1.35; }
@media (max-width: 1100px) { .stats-wall { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.integrations { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
@media (max-width: 900px) { .integrations { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 520px) { .integrations { grid-template-columns: 1fr; } }
.integration { display: grid; grid-template-columns: 40px 1fr; grid-template-rows: auto auto; column-gap: 12px; align-items: center; padding: 14px 16px; border: 1px solid var(--border, var(--border-default)); border-radius: 14px; background: var(--surface, var(--bg-card)); color: inherit; text-decoration: none; transition: border-color .18s, transform .18s; }
.integration:hover { border-color: var(--accent, var(--brand-cyan)); transform: translateY(-2px); }
.integration img, .integration-icon { grid-row: 1 / span 2; width: 40px; height: 40px; border-radius: 10px; background: #fff; object-fit: cover; }
.integration-icon { fill: none; stroke: var(--accent, var(--brand-cyan)); stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; background: color-mix(in srgb, var(--accent, var(--brand-cyan)) 8%, transparent); padding: 8px; }
.integration strong { font-size: 15px; }
.integration span { color: var(--muted, var(--text-muted)); font-size: 13.5px; }
.section-tight { padding-block: 48px; }
.acct-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.acct { display: flex; flex-direction: column; gap: 14px; padding: 20px; border: 1px solid var(--border, var(--border-default)); border-radius: 14px; background: var(--surface, var(--bg-card)); }
.acct-head { display: flex; align-items: center; gap: 12px; }
.acct-logo { width: 44px; height: 44px; border-radius: 10px; object-fit: cover; flex: none; border: 1px solid var(--border, var(--border-default)); }
.acct-name { margin: 0; font-size: 1.05rem; line-height: 1.2; }
.acct-domain { display: block; color: var(--muted, var(--text-muted)); font-size: var(--fs-caption, 13px); font-family: var(--font-mono, ui-monospace, monospace); }
.acct-count { margin-left: auto; flex: none; }
.acct-facts { display: flex; flex-wrap: wrap; gap: 6px 12px; padding-bottom: 12px; border-bottom: 1px solid var(--border, var(--border-default)); font-size: var(--fs-caption, 13px); color: var(--ink, var(--text-primary)); }
.acct-fact b { color: var(--muted, var(--text-muted)); font-weight: 500; margin-right: 5px; }
.acct-fact b::after { content: "·"; margin-left: 5px; }
.acct-group { display: grid; gap: 6px; }
.acct-cat { font-size: 11px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--accent, var(--brand-cyan)); }
.acct-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.acct-chip { display: inline-flex; align-items: center; gap: 7px; padding: 4px 10px 4px 5px; border: 1px solid var(--border, var(--border-default)); border-radius: 999px; background: var(--bg, var(--bg-body)); font-size: 13px; color: var(--ink, var(--text-primary)); white-space: nowrap; }
.acct-chip img { width: 20px; height: 20px; border-radius: 5px; background: #fff; object-fit: cover; }
.acct-foot { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-top: auto; padding-top: 12px; border-top: 1px solid var(--border, var(--border-default)); font-size: var(--fs-caption, 13px); color: var(--muted, var(--text-muted)); }
.acct-foot a { color: var(--accent, var(--brand-cyan)); font-weight: 600; white-space: nowrap; }
@media (max-width: 1000px) { .acct-grid { grid-template-columns: 1fr; } .acct { max-width: 640px; } }
/* self-contained badge for the account cards (DNSai theme has no .badge-verified) */
.acct-count { display: inline-flex; align-items: center; gap: 6px; padding: 3px 10px; border-radius: 999px; font-size: 12px; font-weight: 600; color: var(--accent, var(--brand-cyan)); border: 1px solid color-mix(in srgb, var(--accent, var(--brand-cyan)) 40%, transparent); background: color-mix(in srgb, var(--accent, var(--brand-cyan)) 10%, transparent); }
.acct-count::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }