/* Visual refresh only: shared palette, typography and layout. */
:root {
  --primary: #2563eb !important; --primary-hover: #1d4ed8 !important;
  --bg: #f5f7fb !important; --panel: #fff !important; --border: #e4e9f2 !important;
  --text: #172033 !important; --text-2: #5d6b82 !important; --text-3: #98a2b3 !important;
  --up: #ef4444 !important; --down: #16a34a !important;
  --nav-bg: #0f172a !important; --nav-text: #aeb9ca !important; --nav-active: #60a5fa !important;
  --ui-shadow: 0 1px 2px rgba(15,23,42,.04), 0 8px 24px rgba(15,23,42,.05);
  --ui-shadow-lg: 0 24px 64px rgba(15,23,42,.18);
}
html { color-scheme: light; }
body { font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", "Noto Sans CJK SC", sans-serif !important; background: var(--bg) !important; color: var(--text) !important; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
button, input, select, textarea { font: inherit; }

/* Shell */
.topbar { height: 64px !important; padding: 0 24px !important; gap: 30px !important; border-bottom: 1px solid var(--border) !important; box-shadow: 0 1px 0 rgba(15,23,42,.02); }
.topbar .logo { color: #1d4ed8 !important; font-size: 18px !important; letter-spacing: -.2px !important; }
.topbar .logo span { color: #7b879b !important; font-weight: 500 !important; }
.topbar .topnav a { border-radius: 8px !important; color: #667085 !important; }
.topbar .topnav a:hover { background: #f2f5fa !important; color: #344054 !important; }
.topbar .topnav a.on { color: #1d4ed8 !important; background: #eff6ff !important; }
.topbar .avatar, .sidebar-user .user-avatar { background: linear-gradient(135deg,#3b82f6,#1d4ed8) !important; box-shadow: 0 0 0 3px #eff6ff; }
.layout { min-height: calc(100vh - 64px); }
.sidebar { width: 232px !important; padding: 16px 10px 18px !important; background: radial-gradient(circle at 10% 0%,rgba(59,130,246,.18),transparent 28%), linear-gradient(180deg,#111c34 0%,#0f172a 55%,#0b1220 100%) !important; box-shadow: 8px 0 28px rgba(15,23,42,.08); overflow-y: auto; scrollbar-width: thin; scrollbar-color: rgba(255,255,255,.15) transparent; }
.nav-section { margin-top: 2px !important; }
.nav-title { padding: 14px 14px 8px !important; color: #65738b !important; font-size: 11px !important; font-weight: 700; letter-spacing: 1.4px !important; }
.nav-parent, .nav-child, .nav-leaf { position: relative; border-left: 0 !important; border-radius: 9px; line-height: 20px; }
.nav-parent { min-height: 42px; padding: 11px 12px !important; gap: 10px !important; color: #bac5d6 !important; font-weight: 550; }
.nav-parent:hover, .nav-parent.open { color: #fff !important; background: rgba(255,255,255,.075) !important; }
.nav-parent.open { box-shadow: inset 0 0 0 1px rgba(148,163,184,.08); }
.nav-arrow { width: 12px !important; color: #718099 !important; transform-origin: center; }
.nav-arrow.open { transform: rotate(90deg) !important; color: #dbeafe !important; }
.nav-children { background: transparent !important; }
.nav-child { min-height: 38px; margin: 2px 0; padding: 9px 12px 9px 38px !important; color: #92a0b5 !important; }
.nav-child:hover, .nav-child.active { color: #eaf2ff !important; background: rgba(255,255,255,.05) !important; }
.nav-leaf { min-height: 36px; margin: 2px 0; padding: 8px 12px 8px 50px !important; color: #8795aa !important; }
.nav-leaf:hover { color: #f1f5f9 !important; background: rgba(255,255,255,.05) !important; }
.nav-leaf.active { color: #fff !important; background: linear-gradient(90deg,rgba(37,99,235,.72),rgba(37,99,235,.4)) !important; box-shadow: inset 3px 0 0 #93c5fd, 0 6px 16px rgba(2,6,23,.12); }

/* Reliable menu icons: SVG masks avoid Emoji/font rendering differences. */
.nav-icon { width: 18px !important; height: 18px !important; flex: 0 0 18px; border-radius: 0 !important; background: currentColor !important; color: #8291a8; font-size: 0 !important; line-height: 0; -webkit-mask: var(--nav-svg) center / 18px 18px no-repeat; mask: var(--nav-svg) center / 18px 18px no-repeat; }
.nav-parent:hover .nav-icon, .nav-parent.open .nav-icon { color: #93c5fd; }
.nav-icon--creator { --nav-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m3 11 18-5-5 18-3.5-8.5L3 11Z'/%3E%3Cpath d='m12.5 15.5 3-3'/%3E%3C/svg%3E"); }
.nav-icon--management { --nav-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M4 20V10M10 20V4M16 20v-7M22 20H2'/%3E%3C/svg%3E"); }
.nav-icon--automation { --nav-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v3M12 18v3M3 12h3M18 12h3M5.64 5.64l2.12 2.12M16.24 16.24l2.12 2.12M18.36 5.64l-2.12 2.12M7.76 16.24l-2.12 2.12'/%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3C/svg%3E"); }
.nav-icon--logs { --nav-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 5h10a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H9a2 2 0 0 1-2-2V7a2 2 0 0 1 2-2Z'/%3E%3Cpath d='M9 5a2 2 0 0 0-4 0v12M11 10h6M11 14h6M11 18h4'/%3E%3C/svg%3E"); }
.nav-icon--settings { --nav-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3Cpath d='M19.4 15a1.7 1.7 0 0 0 .34 1.88l.06.06-2.83 2.83-.06-.06A1.7 1.7 0 0 0 15 19.4a1.7 1.7 0 0 0-1 .6 1.7 1.7 0 0 0-.4 1.1V21H9.6v-.1A1.7 1.7 0 0 0 8.5 19.4a1.7 1.7 0 0 0-1.88.34l-.06.06-2.83-2.83.06-.06A1.7 1.7 0 0 0 4.6 15a1.7 1.7 0 0 0-.6-1 1.7 1.7 0 0 0-1.1-.4H3V9.6h.1A1.7 1.7 0 0 0 4.6 8.5a1.7 1.7 0 0 0-.34-1.88l-.06-.06 2.83-2.83.06.06A1.7 1.7 0 0 0 9 4.6a1.7 1.7 0 0 0 1-.6 1.7 1.7 0 0 0 .4-1.1V3h4v.1A1.7 1.7 0 0 0 15.5 4.6a1.7 1.7 0 0 0 1.88-.34l.06-.06 2.83 2.83-.06.06A1.7 1.7 0 0 0 19.4 9c.16.38.37.72.6 1 .3.35.7.55 1.1.6h.1v4h-.1A1.7 1.7 0 0 0 19.4 15Z'/%3E%3C/svg%3E"); }
.nav-icon--users { --nav-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='9' cy='7' r='4'/%3E%3Cpath d='M22 21v-2a4 4 0 0 0-3-3.87M16 3.13a4 4 0 0 1 0 7.75'/%3E%3C/svg%3E"); }
.nav-leaf--root { padding-left: 14px !important; gap: 10px !important; }

/* Main surfaces */
.main { background: var(--bg) !important; }
.card, .adm-toolbar, .adm-table-wrap, .adm-pagination, .filter-bar, .view { border: 1px solid var(--border) !important; border-radius: 12px !important; box-shadow: var(--ui-shadow) !important; }
.card { padding: 22px !important; margin-bottom: 18px !important; }
.card-title, .page-header h2 { color: #1d2939 !important; font-weight: 650 !important; letter-spacing: -.15px; }
.page-header p { color: #8995a8 !important; }
.btn, .btn-adm-query, .btn-adm-reset, .btn-adm-coltoggle { min-height: 34px; border-radius: 7px !important; font-weight: 550; transition: background .16s ease,border-color .16s ease,color .16s ease,box-shadow .16s ease !important; }
.btn-primary, .btn-adm-query { background: linear-gradient(180deg,#3b82f6,#2563eb) !important; border-color: #2563eb !important; box-shadow: 0 3px 8px rgba(37,99,235,.22); }
.btn-primary:hover, .btn-adm-query:hover { background: #1d4ed8 !important; box-shadow: 0 5px 12px rgba(37,99,235,.28); }
.btn-default, .btn-secondary, .btn-outline, .btn-adm-reset, .btn-adm-coltoggle { border-color: #d5dce7 !important; }
input:not([type="checkbox"]):not([type="radio"]), select, textarea, .finput, .control { border-color: #d5dce7 !important; border-radius: 7px !important; color: #344054 !important; background-color: #fff !important; }
input:focus, select:focus, textarea:focus, .finput:focus { border-color: #3b82f6 !important; box-shadow: 0 0 0 3px rgba(59,130,246,.12); outline: none !important; }
.table, .adm-table, table { color: #344054; }
.table th, .adm-table th, thead th { background: #f8fafc !important; color: #667085 !important; font-weight: 650 !important; border-bottom-color: var(--border) !important; }
.table td, .adm-table td, tbody td { border-bottom-color: #edf0f5 !important; }
.table tr:hover td, .adm-table tr:hover td, tbody tr:hover { background: #f7faff !important; }
.tag, .status-tag, .status-badge { border-radius: 999px !important; font-weight: 600 !important; }
.modal, .adm-dialog, .adm-col-panel { border: 1px solid rgba(228,233,242,.9) !important; border-radius: 14px !important; box-shadow: var(--ui-shadow-lg) !important; }
.modal-overlay, .modal-mask, .adm-dialog-mask { backdrop-filter: blur(4px); }

/* Embedded automation pages */
body > .header, #app > .header { min-height: 64px; padding: 0 28px !important; background: #fff !important; color: #1d2939 !important; border-bottom: 1px solid var(--border); box-shadow: none !important; }
body > .header h1, #app > .header h1 { font-size: 18px !important; font-weight: 650 !important; letter-spacing: -.2px; }
body > .header a, #app > .header a { color: #667085 !important; }
body > .header a:hover, #app > .header a:hover { color: #2563eb !important; }
body > .container, #app > .container { max-width: 1440px !important; padding: 24px 28px 32px !important; }
body > .container > table, #app > .container > table { border: 1px solid var(--border) !important; border-radius: 12px !important; box-shadow: var(--ui-shadow) !important; }
.toolbar { gap: 16px; }
.toolbar-left { flex-wrap: wrap; }
.rule-card { border-color: var(--border) !important; background: #f8fafc !important; border-radius: 10px !important; }
.section-title { border-bottom-color: #dbe3ef !important; color: #344054 !important; }
@media (max-width:1100px) { .sidebar { width: 216px !important; } .topbar { padding: 0 18px !important; } body > .container, #app > .container { padding: 20px !important; } }

/* White launch page and clickable SPARK brand */
.topbar .brand-home {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  min-height: 40px;
  padding: 5px 8px;
  margin-left: -8px;
  border-radius: 10px;
  cursor: pointer;
  user-select: none;
  transition: background .16s ease, box-shadow .16s ease;
}
.topbar .brand-home:hover { background: #f5f8fc; }
.topbar .brand-home:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(59,130,246,.16); }
.topbar .brand-mark {
  width: 27px !important;
  height: 27px !important;
  margin: 0 !important;
  flex: 0 0 27px;
  display: inline-block;
  background: linear-gradient(145deg,#fbbf24 0%,#f59e0b 45%,#ea580c 100%);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M16 1.5l3.1 10.1L30.5 16l-11.4 4.4L16 30.5l-3.1-10.1L1.5 16l11.4-4.4L16 1.5Z'/%3E%3Ccircle cx='16' cy='16' r='3.4'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M16 1.5l3.1 10.1L30.5 16l-11.4 4.4L16 30.5l-3.1-10.1L1.5 16l11.4-4.4L16 1.5Z'/%3E%3Ccircle cx='16' cy='16' r='3.4'/%3E%3C/svg%3E") center / contain no-repeat;
  filter: drop-shadow(0 3px 5px rgba(245,158,11,.24));
}
.topbar .brand-home strong {
  color: #2A6EF2;
  font-size: 19px;
  line-height: 1;
  font-weight: 900;
  letter-spacing: -.6px;
  white-space: nowrap;
  font-family: 'Inter', 'Manrope', -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", sans-serif;
}
.topbar .brand-home .brand-subtitle {
  color: #7b879b !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  margin-left: 2px !important;
  letter-spacing: 0 !important;
  white-space: nowrap;
}

.welcome-page {
  background:
    radial-gradient(circle at 50% 22%, rgba(255,247,237,.58) 0, rgba(245,247,251,0) 27%),
    radial-gradient(circle at 86% 80%, rgba(231,240,253,.68) 0, rgba(245,247,251,0) 34%),
    var(--bg) !important;
  color: #172033;
  isolation: isolate;
}
.welcome-page::before {
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  background:
    linear-gradient(rgba(37,99,235,.028) 1px, transparent 1px),
    linear-gradient(90deg, rgba(37,99,235,.028) 1px, transparent 1px) !important;
  background-size: 40px 40px !important;
  animation: none !important;
  z-index: 0;
  pointer-events: none;
  -webkit-mask-image: linear-gradient(to bottom,rgba(0,0,0,.55),transparent 85%);
  mask-image: linear-gradient(to bottom,rgba(0,0,0,.55),transparent 85%);
}
.welcome-watermark {
  position: absolute;
  inset: -12% -8%;
  z-index: 0;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-template-rows: repeat(3, 1fr);
  align-items: center;
  justify-items: center;
  gap: 30px 54px;
  overflow: hidden;
  pointer-events: none;
  transform: rotate(-15deg) scale(1.08);
}
.welcome-watermark span {
  color: #1d4ed8;
  opacity: .085;
  font-size: clamp(18px, 1.7vw, 28px);
  line-height: 1;
  font-weight: 750;
  letter-spacing: 2px;
  white-space: nowrap;
  text-transform: uppercase;
}
.welcome-logo {
  width: 142px !important;
  height: 142px !important;
  margin: 0 0 14px !important;
  filter: drop-shadow(0 14px 22px rgba(245,158,11,.13));
}
.welcome-title {
  color: #172033 !important;
  font-size: 38px !important;
  margin-bottom: 7px !important;
  letter-spacing: 4px !important;
  text-shadow: none !important;
}
.welcome-title-accent {
  background: linear-gradient(135deg,#f59e0b,#ea580c) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
}
.welcome-subtitle {
  color: #7b879b !important;
  margin-bottom: 24px !important;
  font-weight: 500 !important;
  letter-spacing: 7px !important;
}
.welcome-divider {
  width: 54px !important;
  height: 3px !important;
  margin-bottom: 30px !important;
  background: linear-gradient(90deg,#f59e0b,#2563eb) !important;
  box-shadow: 0 2px 8px rgba(37,99,235,.16);
}
.welcome-features { gap: 18px !important; }
.welcome-feature {
  min-width: 168px !important;
  padding: 22px 22px 20px !important;
  background: rgba(255,255,255,.9) !important;
  border: 1px solid #e4e9f2 !important;
  border-radius: 14px !important;
  box-shadow: 0 8px 24px rgba(15,23,42,.055) !important;
  backdrop-filter: blur(6px);
}
.welcome-feature:hover {
  transform: translateY(-5px) !important;
  background: #fff !important;
  border-color: #bfdbfe !important;
  box-shadow: 0 16px 34px rgba(37,99,235,.12) !important;
}
.welcome-feature .feature-icon {
  width: 46px !important;
  height: 46px !important;
  margin-bottom: 13px !important;
  border-radius: 12px !important;
  color: #2563eb;
  background: #eff6ff !important;
  box-shadow: inset 0 0 0 1px rgba(37,99,235,.07);
}
.welcome-feature:nth-child(1) .feature-icon { color: #ea580c; background: #fff7ed !important; }
.welcome-feature:nth-child(2) .feature-icon { color: #2563eb; background: #eff6ff !important; }
.welcome-feature:nth-child(3) .feature-icon { color: #0f766e; background: #ecfdf5 !important; }
.welcome-feature .feature-icon::before {
  content: '';
  width: 23px;
  height: 23px;
  background: currentColor;
  -webkit-mask: var(--feature-svg) center / contain no-repeat;
  mask: var(--feature-svg) center / contain no-repeat;
}
.feature-icon--create { --feature-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 10.5v3l4 1.5 2.5 5h3l-1.5-4.5 8-3.5v-2L7 5v4.5l-4 1Z'/%3E%3C/svg%3E"); }
.feature-icon--management { --feature-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 3h2v18H3V3Zm4 10h4v8H7v-8Zm6-6h4v14h-4V7Zm6 3h4v11h-4V10Z'/%3E%3C/svg%3E"); }
.feature-icon--automation { --feature-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m19.14 12.94.04-.94-.04-.94 2.03-1.58-2-3.46-2.49 1a7.5 7.5 0 0 0-1.63-.94L14.68 3h-4l-.37 3.08c-.58.24-1.13.55-1.63.94l-2.49-1-2 3.46 2.03 1.58-.04.94.04.94-2.03 1.58 2 3.46 2.49-1c.5.39 1.05.7 1.63.94l.37 3.08h4l.37-3.08a7.5 7.5 0 0 0 1.63-.94l2.49 1 2-3.46-2.03-1.58ZM12.68 15.5a3.5 3.5 0 1 1 0-7 3.5 3.5 0 0 1 0 7Z'/%3E%3C/svg%3E"); }
.welcome-feature .feature-name { color: #263348 !important; font-weight: 650 !important; }
.welcome-feature .feature-desc { color: #7b879b !important; }
.welcome-tip { color: #7b879b !important; margin-top: 28px !important; }
.welcome-tip .arrow { color: #2563eb !important; }

@media (max-height: 800px) {
  .welcome-logo { width: 112px !important; height: 112px !important; }
  .welcome-title { font-size: 32px !important; }
  .welcome-feature { padding: 18px 20px 16px !important; }
  .welcome-tip { margin-top: 20px !important; }
}

/* ===================================================================
 * DeepBid brand refresh — header logo + landing (hero / cards / stats)
 * =================================================================== */
:root {
  --brand-blue: #4A6CF7;
  --brand-blue-deep: #3056D3;
  --brand-blue-soft: #EEF2FF;
  --brand-ink: #0E1735;
  --brand-night-1: #0A1230;
  --brand-night-2: #142259;
  --brand-night-3: #1B2E7A;
}

/* --- Header brand logo image (used in .topbar and standalone .header) --- */
.brand-home .brand-logo-img {
  height: 30px;
  width: auto;
  display: inline-block;
  border-radius: 6px;
  background: #fff;
  padding: 0 4px;
  margin: 0;
  flex: 0 0 auto;
  box-shadow: 0 2px 6px rgba(15,23,42,.06);
}
.topbar .brand-home .brand-logo-img { height: 30px; }
.header .brand-home .brand-logo-img { height: 32px; }

/* Brand name "DeepBid" — primary blue (overrides dark strong color) */
.topbar .brand-home strong,
.header .brand-home strong {
  color: var(--brand-blue) !important;
  font-size: 20px !important;
  font-weight: 760 !important;
  letter-spacing: -.4px;
  line-height: 1;
  white-space: nowrap;
}

/* When brand-home is used standalone inside a flex .header, keep spacing tidy */
.header .brand-home { text-decoration: none; }

/* --- Welcome page: hero gradient fills the whole main area, hero itself is transparent --- */
.welcome-page {
  position: relative;
  flex: 1;
  background:
    radial-gradient(ellipse 70% 60% at 15% 12%, rgba(74,108,247,.10) 0%, rgba(255,255,255,0) 55%),
    radial-gradient(ellipse 60% 55% at 88% 88%, rgba(74,108,247,.08) 0%, rgba(255,255,255,0) 55%),
    linear-gradient(180deg, #ffffff 0%, #f5f8ff 100%);
  color: var(--brand-ink);
  isolation: isolate;
  min-height: 100%;
}
.welcome-page::before { display: none !important; }

/* --- Light hero: transparent so the welcome-page gradient shows through --- */
.db-hero {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 360px;
  padding: 72px 32px;
  color: var(--brand-ink);
  overflow: hidden;
  isolation: isolate;
  background: transparent;
  z-index: 1;
}
.db-hero::after { display: none; }
@keyframes dbHeroGrid {
  from { background-position: 0 0, 0 0; }
  to   { background-position: 48px 48px, 48px 48px; }
}
.db-hero__inner { max-width: 1200px; margin: 0 auto; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 20px; }
.db-hero__logo-pill {
  display: inline-flex;
  align-items: center;
  background: transparent;
  border-radius: 0;
  padding: 0;
  box-shadow: none;
}
.db-hero__logo-pill img { height: 64px; width: auto; display: block; }
.db-hero__title {
  font-family: 'Inter', 'Manrope', ui-sans-serif, -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", sans-serif;
  font-size: clamp(38px, 4.8vw, 60px);
  font-weight: 900;
  letter-spacing: -1.5px;
  line-height: 1.05;
  margin: 6px 0 0;
  color: #2A6EF2;
}
.db-hero__title .accent {
  color: #1A1A1A;
  font-weight: 700;
  margin-left: 12px;
  letter-spacing: -0.5px;
}
.db-hero__sub {
  font-size: 17px;
  line-height: 1.6;
  color: #5d6b82;
  max-width: 760px;
  font-weight: 500;
  margin: 0;
}
.db-hero__ctas { display: flex; gap: 14px; margin-top: 14px; flex-wrap: wrap; justify-content: center; }
.db-hero__cta {
  min-height: 44px;
  padding: 0 22px;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 650;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
  border: 1px solid var(--border);
  background: #fff;
  color: var(--brand-ink);
  transition: background .16s ease, border-color .16s ease, transform .16s ease;
  text-decoration: none;
  font-family: inherit;
}
.db-hero__cta:hover { background: #f5f8ff; border-color: rgba(74,108,247,.45); transform: translateY(-1px); }
.db-hero__cta--primary {
  background: linear-gradient(135deg, #4A6CF7 0%, #3056D3 100%);
  border-color: transparent;
  color: #fff;
  box-shadow: 0 10px 28px rgba(74,108,247,.32);
}
.db-hero__cta--primary:hover { background: linear-gradient(135deg, #5E7CFF 0%, #3D63E0 100%); }

/* --- Capability cards --- */
.db-cap { padding: 72px 32px 56px; max-width: 1200px; margin: 0 auto; background: transparent; position: relative; z-index: 1; }
.db-cap__title { text-align: center; font-size: 30px; font-weight: 720; color: var(--brand-ink); margin: 0 0 12px; letter-spacing: -.4px; }
.db-cap__sub { text-align: center; color: #5d6b82; font-size: 15px; line-height: 1.6; max-width: 680px; margin: 0 auto 44px; }
.db-cap__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
@media (max-width: 1024px) { .db-cap__grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px)  { .db-cap__grid { grid-template-columns: 1fr; } }
.db-cap__card {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 26px 24px;
  box-shadow: 0 1px 2px rgba(15,23,42,.04);
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
  display: flex;
  flex-direction: column;
  gap: 12px;
  cursor: pointer;
  user-select: none;
}
.db-cap__card:hover {
  transform: translateY(-4px);
  border-color: #bfdbfe;
  box-shadow: 0 18px 40px rgba(37,99,235,.12);
}
.db-cap__icon {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--brand-blue-soft);
  color: var(--brand-blue);
  flex: 0 0 44px;
}
.db-cap__icon svg { width: 22px; height: 22px; display: block; }
.db-cap__name { font-size: 17px; font-weight: 700; color: var(--brand-ink); letter-spacing: -.15px; }
.db-cap__desc { font-size: 13.5px; line-height: 1.65; color: #5d6b82; }
.db-cap__link { margin-top: auto; color: var(--brand-blue); font-size: 13px; font-weight: 600; display: inline-flex; align-items: center; gap: 4px; }

/* --- Stats section --- */
.db-stats { padding: 56px 32px; background: transparent; border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); position: relative; z-index: 1; }
.db-stats__grid { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; }
@media (max-width: 900px) { .db-stats__grid { grid-template-columns: repeat(2, 1fr); } }
.db-stats__item { text-align: center; }
.db-stats__num {
  font-size: clamp(34px, 4vw, 48px);
  font-weight: 780;
  color: var(--brand-blue);
  line-height: 1;
  letter-spacing: -1px;
  font-variant-numeric: tabular-nums;
}
.db-stats__label { font-size: 13.5px; color: #5d6b82; margin-top: 10px; font-weight: 500; }

/* --- Landing footer --- */
.db-landing-foot { padding: 28px 32px 36px; text-align: center; color: #98a2b3; font-size: 12.5px; position: relative; z-index: 1; }
.db-landing-foot strong { color: var(--brand-blue); font-weight: 600; }
