body {
  background: radial-gradient(circle at center, #0A0A0C 0%, #050505 60%, #1a0202 100%);
  color: white;
  font-family: 'JetBrains Mono', monospace;
  min-height: 100vh;
  margin: 0;
  overflow-x: hidden;
}
::selection { background-color: #E50914; color: white; }

.scanline-effect::after {
  content: "";
  position: fixed; top: 0; left: 0;
  width: 100%; height: 10px;
  background: linear-gradient(to bottom, transparent, rgba(229,9,20,0.04), transparent);
  animation: scanline 10s linear infinite;
  pointer-events: none; z-index: 100;
}
@keyframes scanline {
  0%   { transform: translateY(-100%); }
  100% { transform: translateY(100vh); }
}

.category-label {
  font-size: 0.65rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: #E50914;
  margin-bottom: 1.5rem;
  padding-bottom: 0.75rem;
  border-bottom: 1px solid #2B2B30;
}
.category-label-plain {
  border-bottom: none;
  margin-bottom: 0.5rem;
}

.integration-card {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1rem 1.25rem;
  border: 1px solid #2B2B30;
  background: rgba(20, 20, 23, 0.6);
  backdrop-filter: blur(8px);
  transition: border-color 0.3s ease;
}
.integration-card:hover {
  border-color: rgba(229,9,20,0.4);
}

.integration-icon {
  width: 36px;
  height: 36px;
  border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 0.65rem;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  flex-shrink: 0;
}
.integration-icon img {
  width: 20px;
  height: 20px;
  object-fit: contain;
}

.integration-name {
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  color: #fff;
}
.integration-type {
  font-size: 0.6rem;
  color: #8A8A93;
  margin-top: 2px;
  text-transform: uppercase;
  letter-spacing: 0.1em;
}

.category-count {
  font-size: 0.6rem;
  color: #8A8A93;
  letter-spacing: 0.1em;
  float: right;
}

.stat-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.75rem 1.5rem;
  border: 1px solid #2B2B30;
  background: rgba(20,20,23,0.6);
}
.stat-badge-value {
  font-family: 'Clash Display', sans-serif;
  font-size: 1.5rem;
  font-weight: 700;
  color: #E50914;
}
.stat-badge-label {
  font-size: 0.6rem;
  color: #8A8A93;
  letter-spacing: 0.15em;
  text-transform: uppercase;
}

/* Icon color variants */
.icon-black       { background: #000;    color: #fff; }
.icon-sendgrid    { background: #1A82E2; color: #fff; }
.icon-mailgun     { background: #F06B54; color: #fff; }
.icon-postmark    { background: #FFDE00; color: #000; }
.icon-brevo       { background: #0B3694; color: #fff; }
.icon-mailjet     { background: #9B59B6; color: #fff; }
.icon-sparkpost   { background: #FA6423; color: #fff; }
.icon-aws         { background: #FF9900; color: #000; }
.icon-muted       { background: #2B2B30; color: #8A8A93; }
.icon-hubspot     { background: #FF7A59; color: #fff; }
.icon-salesforce  { background: #00A1E0; color: #fff; }
.icon-pipedrive   { background: #1D1D1B; color: #21D17E; }
.icon-zoho        { background: #D8272E; color: #fff; }
.icon-close       { background: #2B2B30; color: #6FD1AB; }
.icon-intercom    { background: #286EFA; color: #fff; }
.icon-apollo      { background: #6C3FEB; color: #fff; }
.icon-clearbit    { background: #3576E8; color: #fff; }
.icon-pdl         { background: #1B60DB; color: #fff; }
.icon-primary     { background: #E50914; color: #fff; }
.icon-enrich      { background: #00C896; color: #fff; }
.icon-hunter      { background: #FF6934; color: #fff; }
.icon-lusha       { background: #3688FF; color: #fff; }
.icon-zerobounce  { background: #33CC66; color: #fff; }
.icon-neverbounce { background: #1CA4FC; color: #fff; }
.icon-million     { background: #FFB800; color: #000; }
.icon-cloudflare  { background: #F48120; color: #fff; }
.icon-godaddy     { background: #1BDBDB; color: #000; }
.icon-namecheap   { background: #DE3723; color: #fff; }
.icon-digitalocean{ background: #0080FF; color: #fff; }
.icon-google      { background: #4285F4; color: #fff; }
.icon-mailchimp   { background: #FFE01B; color: #000; }
.icon-activecampaign { background: #356AE6; color: #fff; }
.icon-convertkit  { background: #FB6970; color: #fff; }
.icon-microsoft   { background: #0078D4; color: #fff; }
.icon-stripe      { background: #635BFF; color: #fff; }
.icon-sociavault  { background: #7C3AED; color: #fff; }
.icon-sociallinks { background: #2563EB; color: #fff; }
.icon-apify       { background: #00D2A3; color: #000; }
.icon-github      { background: #24292E; color: #fff; }
.icon-anthropic   { background: #D97757; color: #fff; }
.icon-openai      { background: #10A37F; color: #fff; }
.icon-mistral     { background: #F7931E; color: #000; }
.icon-azure       { background: #0078D4; color: #fff; }

.disclaimer {
  font-size: 0.6rem;
  color: #8A8A93;
  letter-spacing: 0.05em;
  line-height: 1.8;
  border-top: 1px solid #2B2B30;
  padding-top: 1.5rem;
}
