@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;600;700&family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap');

:root {
  --bg-slate: #F1F5F9;
  --surface: #FFFFFF;
  --carbon: #0F172A;
  --carbon-soft: #1E293B;
  --ink: #0F172A;
  --ink-muted: #475569;
  --amber: #EA580C;
  --amber-hover: #C2410C;
  --cobalt: #2563EB;
  --border: #CBD5E1;
}

html {
  scroll-behavior: smooth;
}

body {
  font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, sans-serif;
  background-color: var(--bg-slate);
  color: var(--ink);
  -webkit-font-smoothing: antialiased;
}

.font-mono-tech {
  font-family: 'JetBrains Mono', monospace;
  font-variant-numeric: tabular-nums;
}

.tech-blueprint-bg {
  background-image:
    linear-gradient(to right, rgba(15, 23, 42, 0.04) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(15, 23, 42, 0.04) 1px, transparent 1px);
  background-size: 32px 32px;
}

.tech-blueprint-dark {
  background-image:
    linear-gradient(to right, rgba(255, 255, 255, 0.04) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(255, 255, 255, 0.04) 1px, transparent 1px);
  background-size: 36px 36px;
}

.b2b-card {
  background: var(--surface);
  border: 1px solid #E2E8F0;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
  transition: border-color 0.2s ease, box-shadow 0.25s ease, transform 0.2s ease;
}

.b2b-card:hover {
  border-color: rgba(234, 88, 12, 0.45);
  box-shadow: 0 14px 32px -16px rgba(15, 23, 42, 0.16);
}

.btn-signal {
  background: var(--amber);
  color: #FFFFFF;
  transition: background-color 0.2s ease, transform 0.15s ease, box-shadow 0.2s ease;
}

.btn-signal:hover {
  background: var(--amber-hover);
  box-shadow: 0 8px 20px -8px rgba(234, 88, 12, 0.55);
}

.btn-carbon {
  background: var(--carbon);
  color: #FFFFFF;
  transition: background-color 0.2s ease;
}

.btn-carbon:hover {
  background: var(--carbon-soft);
}

.line-clamp-2 {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}