/**
 * DBF Website — Custom CSS Overrides
 *
 * All custom styles go here. This file is loaded AFTER all Webflow CSS:
 *   <link href="../_src/css/design-tokens.css" rel="stylesheet">
 *   <link href="../_src/css/overrides.css" rel="stylesheet">
 *
 * Rules:
 * - Use --dbf- CSS custom properties (from design-tokens.css), not hardcoded values
 * - Use existing Webflow classes where possible; override only when necessary
 * - Add section comments to organise overrides by feature/page
 * - NEVER import or duplicate Webflow's CSS here — only add or override
 */

/* ─────────────────────────────────────────────────────────────
   Global overrides
   ───────────────────────────────────────────────────────────── */

/* Add global overrides here */


/* ─────────────────────────────────────────────────────────────
   Homepage — Capabilities section
   Align "Discover more" buttons to the bottom of each card
   ───────────────────────────────────────────────────────────── */

.collection-list-11-landing .container---s {
  flex: 1;
  display: flex;
  flex-direction: column;
}

.collection-list-11-landing .heading-card.heading-card-landing {
  min-height: auto;
  margin-bottom: 0.5rem;
}

.collection-list-11-landing .container---s .rows {
  flex: 1;
  grid-template-rows: 1fr auto;
}

.collection-list-11-landing .container---s .rows .info-paragraph {
  height: 100%;
  box-sizing: border-box;
}

/* ─────────────────────────────────────────────────────────────
   Homepage — Hero CTA: centre single button
   ───────────────────────────────────────────────────────────── */

.div-block-1580 {
  justify-content: center;
  margin-top: 1rem;
}

/* ─────────────────────────────────────────────────────────────
   Page-specific overrides (add per page as needed)
   ───────────────────────────────────────────────────────────── */

/* Example:
.hero-custom-title {
  font-family: var(--dbf-font-mono);
  color: var(--dbf-color-primary);
}
*/


/* Bridge the 26px margin-top gap on dropdown lists so the mouse hover
   area is continuous from the toggle through to the list items. */
.nav-link-2.w-dropdown > .w-dropdown-toggle {
  position: relative;
}
.nav-link-2.w-dropdown > .w-dropdown-toggle::after {
  content: '';
  position: absolute;
  bottom: -30px;
  left: -20px;
  right: -20px;
  height: 30px;
}