/*
Theme Name: BitBeam for Divi
Theme URI: https://bitbeam.space
Author: BitBeam
Author URI: https://bitbeam.space
Description: BitBeam brand child theme for Divi — the business OS for digital operations. Applies the canonical BitBeam dark design system (Webflow source) to the Divi theme.
Template: Divi
Version: 2.0.0
License: GPL v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: bitbeam-divi
Tags: child-theme, divi, bitbeam, dark, responsive
*/

/* ================================================================
   BITBEAM DESIGN SYSTEM — canonical dark Webflow design
   Source: bitbeam_webflow_io/_assets/.../bitbeam.webflow.shared.css
   ================================================================ */

:root {
  /* Core neutral colors */
  --bb-neutral-primary: #121212;     /* main background */
  --bb-neutral-secondary: #171717;   /* secondary surface */
  --bb-neutral-inverse: #ffffff;     /* text on dark */

  /* Core accent colors */
  --bb-accent-primary: #6872ff;      /* purple */
  --bb-accent-primary-hover: #3f4cff;
  --bb-accent-secondary: transparent;
  --bb-accent-tertiary: transparent;

  /* Background colors */
  --bb-bg-primary: var(--bb-neutral-primary);
  --bb-bg-secondary: var(--bb-neutral-secondary);
  --bb-bg-inverse: var(--bb-neutral-inverse);
  --bb-bg-accent-primary: var(--bb-accent-primary);

  /* Text colors */
  --bb-text-primary: var(--bb-neutral-inverse);
  --bb-text-on-accent: #ffffff;
  --bb-text-inverse: var(--bb-neutral-primary);

  /* Border colors (white at opacity) */
  --bb-border-primary: rgba(255, 255, 255, 0.1);
  --bb-border-secondary: rgba(255, 255, 255, 0.2);
  --bb-border-accent: var(--bb-accent-primary);

  /* Accent tints */
  --bb-accent-a05: rgba(104, 114, 255, 0.05);
  --bb-accent-a10: rgba(104, 114, 255, 0.1);
  --bb-accent-a20: rgba(104, 114, 255, 0.2);
  --bb-accent-a60: rgba(104, 114, 255, 0.6);

  /* Typography */
  --bb-font-heading: 'Syne', sans-serif;
  --bb-font-body: 'Inter', sans-serif;
  --bb-font-button: 'Inter', sans-serif;

  /* Heading sizes */
  --bb-h0-size: 5.61rem;
  --bb-h1-size: 4.21rem;
  --bb-h2-size: 2.37rem;
  --bb-h3-size: 1.78rem;
  --bb-h4-size: 1.33rem;
  --bb-h5-size: 1rem;
  --bb-h6-size: 0.75rem;

  /* Text sizes */
  --bb-text-xxl: 2rem;
  --bb-text-xl: 1.5rem;
  --bb-text-lg: 1.13rem;
  --bb-text-base: 1rem;
  --bb-text-sm: 0.88rem;
  --bb-text-tag: 0.75rem;
  --bb-text-eyebrow: 0.9rem;

  /* Spacing scale */
  --bb-space-1x: 1rem;
  --bb-space-1-25x: 1.25rem;
  --bb-space-1-5x: 1.5rem;
  --bb-space-2x: 2rem;
  --bb-space-3x: 3rem;
  --bb-space-4x: 4rem;
  --bb-space-5x: 5rem;
  --bb-space-6x: 6rem;
  --bb-space-7x: 7rem;
  --bb-space-8x: 8rem;

  /* Component sizes */
  --bb-container-width: 1280px;
  --bb-container-sm-width: 1000px;
  --bb-container-padding: var(--bb-space-1x);
  --bb-section-padding: var(--bb-space-8x);
  --bb-card-radius: 0.75rem;
  --bb-card-padding: var(--bb-space-2x);
  --bb-card-padding-sm: var(--bb-space-1-5x);
  --bb-button-radius: 0.5rem;
  --bb-button-padding-v: 1em;
  --bb-button-padding-h: 1.5em;

  /* Shadows */
  --bb-shadow-medium: 0 0 0 1px rgba(0, 0, 0, 0.1), 0 1px 3px rgba(0, 0, 0, 0.1);
}

/* ================================================================
   FONTS — self-hosted Inter + Google Fonts Syne
   ================================================================ */

@font-face{font-family:Inter;font-style:normal;font-weight:100 900;font-display:swap;src:url(assets/fonts/ba9851c3c22cd980-s.woff2) format("woff2");unicode-range:u+0460-052f,u+1c80-1c8a,u+20b4,u+2de0-2dff,u+a640-a69f,u+fe2e-fe2f}
@font-face{font-family:Inter;font-style:normal;font-weight:100 900;font-display:swap;src:url(assets/fonts/21350d82a1f187e9-s.woff2) format("woff2");unicode-range:u+0301,u+0400-045f,u+0490-0491,u+04b0-04b1,u+2116}
@font-face{font-family:Inter;font-style:normal;font-weight:100 900;font-display:swap;src:url(assets/fonts/c5fe6dc8356a8c31-s.woff2) format("woff2");unicode-range:u+1f??}
@font-face{font-family:Inter;font-style:normal;font-weight:100 900;font-display:swap;src:url(assets/fonts/19cfc7226ec3afaa-s.woff2) format("woff2");unicode-range:u+0370-0377,u+037a-037f,u+0384-038a,u+038c,u+038e-03a1,u+03a3-03ff}
@font-face{font-family:Inter;font-style:normal;font-weight:100 900;font-display:swap;src:url(assets/fonts/df0a9ae256c0569c-s.woff2) format("woff2");unicode-range:u+0102-0103,u+0110-0111,u+0128-0129,u+0168-0169,u+01a0-01a1,u+01af-01b0,u+0300-0301,u+0303-0304,u+0308-0309,u+0323,u+0329,u+1ea0-1ef9,u+20ab}
@font-face{font-family:Inter;font-style:normal;font-weight:100 900;font-display:swap;src:url(assets/fonts/8e9860b6e62d6359-s.woff2) format("woff2");unicode-range:u+0100-02ba,u+02bd-02c5,u+02c7-02cc,u+02ce-02d7,u+02dd-02ff,u+0304,u+0308,u+0329,u+1d00-1dbf,u+1e00-1e9f,u+1ef2-1eff,u+2020,u+20a0-20ab,u+20ad-20c0,u+2113,u+2c60-2c7f,u+a720-a7ff}
@font-face{font-family:Inter;font-style:normal;font-weight:100 900;font-display:swap;src:url(assets/fonts/e4af272ccee01ff0-s.p.woff2) format("woff2");unicode-range:u+00??,u+0131,u+0152-0153,u+02bb-02bc,u+02c6,u+02da,u+02dc,u+0304,u+0308,u+0329,u+2000-206f,u+20ac,u+2122,u+2191,u+2193,u+2212,u+2215,u+feff,u+fffd}
@font-face{font-family:"Inter Fallback";src:local("Arial");ascent-override:90.44%;descent-override:22.52%;line-gap-override:0.00%;size-adjust:107.12%}

/* Syne — loaded from Google Fonts (heading font) */
@import url('https://fonts.googleapis.com/css2?family=Syne:wght@400;500;600;700;800&display=swap');

/* ================================================================
   BASE — apply dark design to all elements
   ================================================================ */

body {
  font-family: var(--bb-font-body) !important;
  font-size: var(--bb-text-base) !important;
  color: var(--bb-text-primary) !important;
  background-color: var(--bb-bg-primary) !important;
  line-height: 1.6 !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--bb-font-heading) !important;
  color: var(--bb-text-primary) !important;
  font-weight: 700;
  letter-spacing: -0.02em;
}

a {
  color: var(--bb-accent-primary) !important;
  text-decoration: none;
}

a:hover {
  color: var(--bb-accent-primary-hover) !important;
}

/* ================================================================
   DIVI OVERRIDES — dark surfaces
   ================================================================ */

.et_pb_section {
  background-color: var(--bb-bg-primary) !important;
  color: var(--bb-text-primary) !important;
}

/* Secondary section (slightly lighter) */
.et_pb_section.is-secondary,
.et_pb_section:nth-child(even) {
  background-color: var(--bb-bg-secondary) !important;
}

.et_pb_row {
  max-width: var(--bb-container-width) !important;
}

.et_pb_text {
  color: var(--bb-text-primary) !important;
}

.et_pb_text h1, .et_pb_text h2, .et_pb_text h3,
.et_pb_text h4, .et_pb_text h5, .et_pb_text h6 {
  color: var(--bb-text-primary) !important;
}

/* ================================================================
   DIVI BUTTONS — purple accent, Inter font
   ================================================================ */

.et_pb_button {
  display: inline-flex !important;
  align-items: center !important;
  padding: var(--bb-button-padding-v) var(--bb-button-padding-h) !important;
  border: 1px solid transparent !important;
  border-radius: var(--bb-button-radius) !important;
  background-color: var(--bb-accent-a10) !important;
  color: var(--bb-text-primary) !important;
  font-family: var(--bb-font-button) !important;
  font-size: var(--bb-text-base) !important;
  font-weight: 500 !important;
  text-transform: none !important;
  letter-spacing: normal !important;
  box-shadow: none !important;
  transition: all 0.2s ease !important;
}

.et_pb_button:hover {
  background-color: var(--bb-accent-a20) !important;
  border-color: transparent !important;
  color: var(--bb-text-primary) !important;
}

.et_pb_button:focus {
  outline-color: var(--bb-accent-primary) !important;
}

/* Primary accent button (solid purple) */
.et_pb_button.bb-btn-primary {
  background-color: var(--bb-accent-primary) !important;
  color: var(--bb-text-on-accent) !important;
  border-color: transparent !important;
}

.et_pb_button.bb-btn-primary:hover {
  background-color: var(--bb-accent-primary-hover) !important;
  color: var(--bb-text-on-accent) !important;
}

/* ================================================================
   DIVI CARDS — dark card style
   ================================================================ */

.bb-card,
.et_pb_column .et_pb_module.bb-card {
  border: 1px solid var(--bb-border-secondary) !important;
  border-radius: var(--bb-card-radius) !important;
  background-color: var(--bb-bg-primary) !important;
  color: var(--bb-text-primary) !important;
  padding: var(--bb-card-padding) !important;
  box-shadow: var(--bb-shadow-medium) !important;
  transition: all 0.3s ease !important;
}

.bb-card:hover {
  border-color: var(--bb-accent-primary) !important;
}

/* Secondary card (slightly lighter bg) */
.bb-card.is-secondary {
  background-color: var(--bb-bg-secondary) !important;
}

/* Accent card (solid purple) */
.bb-card.is-accent {
  background-color: var(--bb-accent-primary) !important;
  color: var(--bb-text-on-accent) !important;
  border-color: transparent !important;
}

/* ================================================================
   HEADING CLASSES — match Webflow sizes
   ================================================================ */

.bb-heading-hero {
  font-family: var(--bb-font-heading) !important;
  font-size: var(--bb-h0-size) !important;
  line-height: 1.05 !important;
  font-weight: 700 !important;
  letter-spacing: -0.03em !important;
}

.bb-heading-primary {
  font-family: var(--bb-font-heading) !important;
  font-size: var(--bb-h1-size) !important;
  line-height: 1.1 !important;
  font-weight: 700 !important;
}

.bb-heading-secondary {
  font-family: var(--bb-font-heading) !important;
  font-size: var(--bb-h2-size) !important;
  line-height: 1.15 !important;
  font-weight: 700 !important;
}

.bb-heading-tertiary {
  font-family: var(--bb-font-heading) !important;
  font-size: var(--bb-h3-size) !important;
  line-height: 1.2 !important;
  font-weight: 600 !important;
}

.bb-subheading {
  font-family: var(--bb-font-body) !important;
  font-size: var(--bb-text-lg) !important;
  color: rgba(255, 255, 255, 0.7) !important;
  max-width: var(--bb-container-sm-width) !important;
}

.bb-eyebrow {
  font-family: var(--bb-font-body) !important;
  font-size: var(--bb-text-eyebrow) !important;
  color: rgba(255, 255, 255, 0.6) !important;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-weight: 500;
}

/* ================================================================
   HEADER — dark, compact, brand lockup + nav + CTA
   ================================================================ */

/* Custom BitBeam header (header.php — not Divi Theme Builder) */
#bb-header {
  background-color: var(--bb-bg-primary) !important;
  border-bottom: 1px solid var(--bb-border-primary) !important;
  box-shadow: none !important;
  min-height: 64px !important;
  max-height: 64px !important;
  line-height: 1 !important;
  position: sticky !important;
  top: 0 !important;
  z-index: 99998 !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

.bb-shell {
  width: min(92%, 1180px) !important;
  max-width: 1180px !important;
  margin: 0 auto !important;
  box-sizing: border-box !important;
}

.bb-header-inner {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  min-height: 64px !important;
  max-height: 64px !important;
  padding: 0 !important;
  gap: 16px !important;
}

.bb-logo {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  text-decoration: none !important;
  flex-shrink: 0 !important;
}

.bb-logo-icon {
  width: 28px !important;
  height: 28px !important;
  max-height: none !important;
  max-width: none !important;
  margin: 0 !important;
}

.bb-site-title {
  margin: 0 !important;
  padding: 0 !important;
  color: var(--bb-text-primary) !important;
  font-family: var(--bb-font-heading) !important;
  font-size: 1.5rem !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em !important;
  text-decoration: none !important;
  white-space: nowrap !important;
}

#bb-nav {
  flex: 1 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.bb-top-menu {
  display: flex !important;
  align-items: center !important;
  gap: 2px !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.bb-top-menu > li {
  padding: 0 !important;
  margin: 0 !important;
}

.bb-top-menu li a {
  font-family: var(--bb-font-body) !important;
  font-size: 0.875rem !important;
  font-weight: 500 !important;
  color: rgba(255, 255, 255, 0.7) !important;
  padding: 8px 12px !important;
  line-height: 1.4 !important;
  text-decoration: none !important;
  transition: color 0.2s !important;
  display: block !important;
}

.bb-top-menu li a:hover {
  color: var(--bb-accent-primary) !important;
}

/* Dropdown indicator */
.bb-top-menu > .menu-item-has-children > a::after {
  content: '';
  display: inline-block;
  width: 0;
  height: 0;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-top: 4px solid currentColor;
  margin-left: 6px;
  vertical-align: middle;
  opacity: 0.5;
  transition: transform 0.2s !important;
}

.bb-top-menu > .menu-item-has-children:hover > a::after,
.bb-top-menu > .menu-item-has-children.open > a::after {
  transform: rotate(180deg) !important;
}

/* Dropdown menu — positioned under each menu item, not full-viewport */
.bb-top-menu > .menu-item-has-children {
  position: relative !important;
}

.bb-top-menu .sub-menu {
  display: none !important;
  position: absolute !important;
  top: 100% !important;
  left: 0 !important;
  min-width: 220px !important;
  width: auto !important;
  max-width: 320px !important;
  background-color: var(--bb-bg-secondary) !important;
  border: 1px solid var(--bb-border-primary) !important;
  border-radius: 0 0 10px 10px !important;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.4) !important;
  padding: 6px !important;
  margin: 0 !important;
  list-style: none !important;
  z-index: 99997 !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transform: translateY(-4px) !important;
  transition: opacity 0.15s ease, transform 0.15s ease !important;
}

/* Bridge to prevent hover gap */
.bb-top-menu .menu-item-has-children > a::before {
  content: "" !important;
  position: absolute !important;
  bottom: -8px !important;
  left: 0 !important;
  right: 0 !important;
  height: 8px !important;
  z-index: 99998 !important;
}

.bb-top-menu .menu-item-has-children:hover > .sub-menu,
.bb-top-menu .menu-item-has-children.open > .sub-menu {
  display: block !important;
  opacity: 1 !important;
  transform: translateY(0) !important;
  pointer-events: auto !important;
}

/* Sub-menu item styling — compact, not stretched */
.bb-top-menu .sub-menu li {
  margin: 0 !important;
  padding: 0 !important;
}

.bb-top-menu .sub-menu li a {
  display: block !important;
  padding: 10px 14px !important;
  border-radius: 8px !important;
  background: transparent !important;
  border: none !important;
  transition: background 0.15s, color 0.15s !important;
  font-size: 0.875rem !important;
  font-weight: 500 !important;
  color: rgba(255, 255, 255, 0.8) !important;
  line-height: 1.4 !important;
  white-space: nowrap !important;
}

.bb-top-menu .sub-menu li a::after {
  display: none !important;
}

.bb-top-menu .sub-menu li a:hover {
  background-color: var(--bb-accent-a10) !important;
  color: var(--bb-accent-primary) !important;
  transform: none !important;
}

.bb-top-menu .sub-menu li a:hover::after {
  display: none !important;
}

.bb-header-cta {
  flex-shrink: 0 !important;
  display: flex !important;
  align-items: center !important;
}

.bb-cta-button {
  display: inline-block !important;
  background-color: var(--bb-accent-primary) !important;
  color: var(--bb-text-on-accent) !important;
  border-radius: var(--bb-button-radius) !important;
  padding: 8px 16px !important;
  font-weight: 600 !important;
  font-size: 0.875rem !important;
  font-family: var(--bb-font-body) !important;
  text-decoration: none !important;
  line-height: 1.4 !important;
  box-shadow: none !important;
  transition: all 0.2s !important;
  white-space: nowrap !important;
}

.bb-cta-button:hover {
  background-color: var(--bb-accent-primary-hover) !important;
  color: var(--bb-text-on-accent) !important;
  transform: translateY(-1px) !important;
}

#bb-mobile-toggle {
  display: none !important;
  background: none !important;
  border: none !important;
  cursor: pointer !important;
  padding: 8px !important;
  flex-direction: column !important;
  gap: 4px !important;
  z-index: 99999 !important;
}

#bb-mobile-toggle span {
  display: block !important;
  width: 22px !important;
  height: 2px !important;
  background-color: var(--bb-text-primary) !important;
  border-radius: 1px !important;
  transition: all 0.3s !important;
}

#bb-mobile-toggle[aria-expanded="true"] span:nth-child(1) {
  transform: rotate(45deg) translate(4px, 4px) !important;
}
#bb-mobile-toggle[aria-expanded="true"] span:nth-child(2) {
  opacity: 0 !important;
}
#bb-mobile-toggle[aria-expanded="true"] span:nth-child(3) {
  transform: rotate(-45deg) translate(4px, -4px) !important;
}

/* Mobile responsive header */
@media (max-width: 980px) {
  #bb-mobile-toggle {
    display: flex !important;
  }

  #bb-nav {
    position: fixed !important;
    top: 66px !important;
    left: 0 !important;
    right: 0 !important;
    background-color: var(--bb-bg-primary) !important;
    border-bottom: 1px solid var(--bb-border-primary) !important;
    padding: 0 !important;
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    max-height: 0 !important;
    overflow: hidden !important;
    transition: max-height 0.3s ease !important;
    z-index: 99997 !important;
  }

  #bb-nav.open {
    max-height: 90vh !important;
    overflow-y: auto !important;
  }

  .bb-top-menu {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 0 !important;
    width: 100% !important;
  }

  .bb-top-menu > li {
    width: 100% !important;
  }

  .bb-top-menu li a {
    padding: 14px 20px !important;
    font-size: 1rem !important;
    border-bottom: 1px solid var(--bb-border-primary) !important;
    border-radius: 0 !important;
    background: transparent !important;
    border-left: none !important;
    border-right: none !important;
    border-top: none !important;
  }

  /* Mobile dropdown: collapsible, not 100vw */
  .bb-top-menu .sub-menu {
    position: static !important;
    display: none !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    background-color: rgba(0, 0, 0, 0.2) !important;
    border: none !important;
    box-shadow: none !important;
    opacity: 1 !important;
    transform: none !important;
    pointer-events: auto !important;
    grid-template-columns: 1fr !important;
    gap: 0 !important;
  }

  .bb-top-menu .menu-item-has-children.open > .sub-menu {
    display: block !important;
  }

  .bb-top-menu .sub-menu li a {
    padding: 12px 32px !important;
    font-size: 0.9rem !important;
    color: rgba(255, 255, 255, 0.6) !important;
    border-radius: 0 !important;
    background: transparent !important;
    border-bottom: 1px solid var(--bb-border-primary) !important;
  }

  .bb-top-menu .sub-menu li a:hover {
    background: var(--bb-accent-a05) !important;
    color: var(--bb-accent-primary) !important;
    transform: none !important;
  }

  .bb-top-menu .sub-menu li a::after {
    display: none !important;
  }

  .bb-header-cta {
    display: none !important;
  }

  .bb-site-title {
    font-size: 1.15rem !important;
  }
}

/* Divi default header (fallback — used when Theme Builder is active) */
#main-header {
  background-color: var(--bb-bg-primary) !important;
  border-bottom: 1px solid var(--bb-border-primary) !important;
  box-shadow: none !important;
  min-height: 66px !important;
  max-height: 66px !important;
  line-height: 1 !important;
}

#main-header[data-height-onload] {
  height: 66px !important;
  max-height: 66px !important;
}

#main-header .container {
  min-height: 66px !important;
  max-height: 66px !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  display: flex !important;
  align-items: center !important;
  width: min(92%, 1180px) !important;
  max-width: 1180px !important;
}

/* Theme Builder header overrides — compact 66px header */
body .et-l--header .et_pb_section,
body .et-l--header .et_pb_section_0_tb_header,
body .et-l--header section.et_pb_section {
  background-color: var(--bb-bg-primary) !important;
  padding: 0 !important;
  margin: 0 !important;
  min-height: 66px !important;
  border-bottom: 1px solid var(--bb-border-primary) !important;
}

body .et-l--header .et_pb_row,
body .et-l--header .et_pb_row_0_tb_header {
  padding: 0 16px !important;
  min-height: 66px !important;
  display: flex !important;
  align-items: center !important;
  width: min(92%, 1180px) !important;
  max-width: 1180px !important;
}

.et-l--header .et_pb_column {
  display: flex !important;
  align-items: center !important;
  padding: 0 !important;
}

.et-l--header .et_pb_image {
  margin: 0 !important;
  padding: 0 !important;
}

.et-l--header .et_pb_menu {
  background-color: transparent !important;
  padding: 0 !important;
}

.et-l--header .et_pb_button {
  margin: 0 !important;
  padding: 8px 16px !important;
}

#et-top-navigation {
  height: 66px !important;
  display: flex !important;
  align-items: center !important;
  padding-left: 32px !important;
  margin-left: auto !important;
}

#top-menu {
  display: flex !important;
  align-items: center !important;
  gap: 2px !important;
}

#top-menu > li {
  padding-right: 0 !important;
}

#top-menu li a {
  font-family: var(--bb-font-body) !important;
  font-size: 0.875rem !important;
  font-weight: 500 !important;
  color: rgba(255, 255, 255, 0.7) !important;
  padding: 0 12px !important;
  line-height: 66px !important;
  transition: color 0.2s !important;
}

#top-menu li a:hover {
  color: var(--bb-accent-primary) !important;
}

/* CTA button in nav */
#top-menu li.bb-nav-cta a {
  background-color: var(--bb-accent-primary) !important;
  color: var(--bb-text-on-accent) !important;
  border-radius: var(--bb-button-radius) !important;
  padding: 8px 16px !important;
  font-weight: 600 !important;
  font-size: 0.875rem !important;
  line-height: 1.4 !important;
  margin-left: 8px !important;
  box-shadow: none !important;
  transition: all 0.2s !important;
}

#top-menu li.bb-nav-cta a:hover {
  background-color: var(--bb-accent-primary-hover) !important;
  color: var(--bb-text-on-accent) !important;
  transform: translateY(-1px) !important;
}

#top-menu li.bb-nav-signin a {
  color: var(--bb-accent-primary) !important;
  font-weight: 600 !important;
}

/* Remove stray Divi header elements */
#top-header,
#et-secondary-nav,
#et-info,
#et-secondary-menu,
#et_top_search,
.et-search-form,
.et-cart-info {
  display: none !important;
}

#et-top-navigation select {
  display: none !important;
}

/* ================================================================
   LOGO — animated SVG brand lockup
   ================================================================ */

.et_header_style_left .logo_container {
  position: static !important;
  flex: 0 0 auto !important;
  height: 66px !important;
  display: flex !important;
  align-items: center !important;
}

.logo_container > a {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px;
  height: 66px !important;
  text-decoration: none !important;
  line-height: 1 !important;
}

.logo_container #logo.bb-logo-svg,
.et_pb_svg_logo #logo.bb-logo-svg,
.et_header_style_left #logo.bb-logo-svg {
  width: 32px !important;
  height: 30px !important;
  max-height: none !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  flex: 0 0 32px;
  object-fit: contain;
  background: transparent !important;
  display: inline-block !important;
  float: none !important;
  vertical-align: middle !important;
  -webkit-transform: none !important;
  transform: none !important;
}

.bb-site-title {
  margin: 0 !important;
  padding: 0 !important;
  color: var(--bb-text-primary) !important;
  font-family: var(--bb-font-heading) !important;
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1;
  letter-spacing: -0.04em;
  white-space: nowrap;
  display: inline-block;
  vertical-align: middle !important;
}

@media (max-width: 980px) {
  #et-top-navigation {
    height: 66px !important;
  }
  #top-menu li a {
    line-height: 66px !important;
  }
  .et_mobile_menu li a {
    font-family: var(--bb-font-body) !important;
    font-size: 0.875rem !important;
    font-weight: 500 !important;
    color: rgba(255, 255, 255, 0.7) !important;
    padding: 10px 15px !important;
    line-height: 1.4 !important;
    transition: color 0.2s !important;
  }
  .et_mobile_menu li a:hover {
    color: var(--bb-accent-primary) !important;
  }
  .et_mobile_menu li.bb-nav-cta a {
    background-color: var(--bb-accent-primary) !important;
    color: var(--bb-text-on-accent) !important;
    border-radius: var(--bb-button-radius) !important;
    padding: 10px 16px !important;
    font-weight: 600 !important;
    font-size: 0.875rem !important;
    margin: 8px 15px !important;
  }
  .et_mobile_menu li.bb-nav-signin a {
    color: var(--bb-accent-primary) !important;
    font-weight: 600 !important;
  }
  .et_mobile_menu_menu_bar a {
    color: var(--bb-accent-primary) !important;
  }
}

@media (max-width: 480px) {
  .logo_container #logo.bb-logo-svg,
  .et_pb_svg_logo #logo.bb-logo-svg,
  .et_header_style_left #logo.bb-logo-svg {
    width: 26px !important;
    height: 24px !important;
    flex: 0 0 26px;
  }
  .bb-site-title {
    font-size: 1.15rem;
  }
}

/* Respect reduced-motion preferences */
@media (prefers-reduced-motion: reduce) {
  .bb-logo-svg animate {
    display: none;
  }
}

/* ================================================================
   FOOTER — dark (same as body, with border-top)
   ================================================================ */

/* Custom BitBeam footer (footer.php — not Divi Theme Builder) */
#bb-footer {
  background-color: var(--bb-bg-secondary) !important;
  color: rgba(255, 255, 255, 0.7) !important;
  border-top: 1px solid var(--bb-border-primary) !important;
  padding: 48px 0 24px !important;
  margin-top: 0 !important;
}

.bb-footer-inner {
  display: flex !important;
  flex-direction: column !important;
  gap: 32px !important;
}

.bb-footer-grid {
  display: grid !important;
  grid-template-columns: 2fr 1fr 1fr 1fr !important;
  gap: 40px !important;
  align-items: start !important;
}

.bb-footer-brand {
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
}

.bb-footer-logo {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}

.bb-footer-icon {
  width: 32px !important;
  height: 30px !important;
  flex-shrink: 0 !important;
}

.bb-footer-icon svg {
  width: 32px !important;
  height: 30px !important;
}

.bb-footer-title {
  font-family: var(--bb-font-heading) !important;
  font-size: 1.5rem !important;
  font-weight: 700 !important;
  color: var(--bb-text-primary) !important;
  letter-spacing: -0.02em !important;
}

.bb-footer-brand p {
  font-size: 0.875rem !important;
  line-height: 1.6 !important;
  color: rgba(255, 255, 255, 0.5) !important;
  margin: 0 !important;
  max-width: 280px !important;
}

.bb-footer-col {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
}

.bb-footer-col h4 {
  font-family: var(--bb-font-heading) !important;
  font-size: 0.8rem !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
  color: var(--bb-text-primary) !important;
  margin: 0 0 4px 0 !important;
}

.bb-footer-col a {
  font-family: var(--bb-font-body) !important;
  font-size: 0.875rem !important;
  font-weight: 400 !important;
  color: rgba(255, 255, 255, 0.6) !important;
  text-decoration: none !important;
  transition: color 0.2s !important;
  line-height: 1.5 !important;
}

.bb-footer-col a:hover {
  color: var(--bb-accent-primary) !important;
}

.bb-footer-bottom {
  border-top: 1px solid var(--bb-border-primary) !important;
  padding-top: 20px !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
}

.bb-footer-bottom p {
  font-size: 0.8rem !important;
  color: rgba(255, 255, 255, 0.4) !important;
  margin: 0 !important;
}

.bb-footer-bottom a {
  color: var(--bb-accent-primary) !important;
  text-decoration: none !important;
  font-weight: 600 !important;
}

.bb-footer-bottom a:hover {
  color: var(--bb-accent-primary-hover) !important;
}

/* Footer responsive */
@media (max-width: 768px) {
  .bb-footer-grid {
    grid-template-columns: 1fr 1fr !important;
    gap: 28px !important;
  }

  .bb-footer-brand {
    grid-column: 1 / -1 !important;
  }
}

@media (max-width: 480px) {
  .bb-footer-grid {
    grid-template-columns: 1fr !important;
    gap: 24px !important;
  }
}

/* Divi default footer (fallback — used when Theme Builder is active) */
#main-footer,
.et-l--footer .et_pb_section_0_tb_footer {
  background-color: var(--bb-bg-secondary) !important;
  color: rgba(255, 255, 255, 0.7) !important;
  border-top: 1px solid var(--bb-border-primary) !important;
}

#main-footer h4,
.et-l--footer h4 {
  color: var(--bb-text-primary) !important;
  font-family: var(--bb-font-heading) !important;
}

#main-footer a,
.et-l--footer a {
  color: rgba(255, 255, 255, 0.7) !important;
}

#main-footer a:hover,
.et-l--footer a:hover {
  color: var(--bb-accent-primary) !important;
}

#footer-bottom {
  background-color: rgba(0, 0, 0, 0.2) !important;
}

/* ================================================================
   SSO LOGIN PAGE — dark branded
   ================================================================ */

body.login {
  background-color: var(--bb-bg-primary) !important;
}

.login h1 a {
  background-image: none !important;
  width: auto !important;
  height: auto !important;
  text-indent: 0 !important;
  font-family: var(--bb-font-heading) !important;
  font-size: 1.75rem !important;
  font-weight: 800 !important;
  color: var(--bb-accent-primary) !important;
}

.login form {
  background-color: var(--bb-bg-secondary) !important;
  border: 1px solid var(--bb-border-secondary) !important;
  border-radius: var(--bb-card-radius) !important;
  box-shadow: var(--bb-shadow-medium) !important;
}

.login form label {
  color: var(--bb-text-primary) !important;
}

.login form .input {
  background-color: var(--bb-bg-primary) !important;
  border: 1px solid var(--bb-border-secondary) !important;
  border-radius: var(--bb-button-radius) !important;
  color: var(--bb-text-primary) !important;
}

.login .button-primary {
  background-color: var(--bb-accent-primary) !important;
  border: none !important;
  border-radius: var(--bb-button-radius) !important;
  color: var(--bb-text-on-accent) !important;
  font-family: var(--bb-font-button) !important;
  font-weight: 600 !important;
  box-shadow: none !important;
}

.login .button-primary:hover {
  background-color: var(--bb-accent-primary-hover) !important;
}

.bitbeam-sso-footer {
  text-align: center;
  padding: 1rem;
  font-size: 0.85rem;
  color: rgba(255, 255, 255, 0.5);
}

.bitbeam-sso-footer a {
  color: var(--bb-accent-primary);
  font-weight: 600;
}

/* ================================================================
   BADGES
   ================================================================ */

.bb-badge {
  display: inline-block;
  padding: 0.25rem 0.75rem;
  border-radius: 999px;
  font-size: var(--bb-text-tag);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.bb-badge-accent {
  background-color: var(--bb-accent-a10);
  color: var(--bb-accent-primary);
  border: 1px solid var(--bb-accent-a20);
}

.bb-badge-proven {
  background-color: rgba(16, 185, 129, 0.1);
  color: #10b981;
  border: 1px solid rgba(16, 185, 129, 0.3);
}

/* ================================================================
   SEMANTIC DIVI HOMEPAGE STYLES
   Target real Divi modules via semantic classes on sections,
   rows, and modules. No .bb-pilot-home wrapper, no nth-child hacks.
   The Divi hierarchy carries meaning:
     et_pb_section.bb-hero-section
       et_pb_row.bb-hero-row
         et_pb_text.bb-hero
         et_pb_text.bb-hero-sub
         et_pb_button.bb-cta-primary
     et_pb_section.bb-features-section
       et_pb_row.bb-feature-grid
         et_pb_text.bb-card
     et_pb_section.bb-proof-section
       et_pb_row.bb-reading-width
     et_pb_section.bb-final-cta-section
   ================================================================ */

body.home #main-content,
body.home article.et_pb_post,
body.home .entry-content {
  margin: 0 !important;
  padding: 0 !important;
}

body.home .entry-content::after {
  content: '';
  display: table;
  clear: both;
}

/* --- HERO SECTION --- */
.et_pb_section.bb-hero-section {
  min-height: min(82svh, 60rem);
  display: flex;
  align-items: center;
  justify-content: center;
  padding-block: clamp(4rem, 9vw, 9rem) !important;
  position: relative;
  overflow: hidden;
  background: var(--bb-neutral-primary) !important;
}

/* Animated hero background — light radial gradients + grid */
.et_pb_section.bb-hero-section::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 60% 50% at 30% 20%, rgba(104, 114, 255, 0.12), transparent 60%),
    radial-gradient(ellipse 50% 40% at 70% 60%, rgba(63, 76, 255, 0.08), transparent 60%),
    radial-gradient(ellipse 40% 30% at 50% 80%, rgba(104, 114, 255, 0.06), transparent 60%);
  animation: bb-hero-pulse 8s ease-in-out infinite alternate;
  pointer-events: none;
  z-index: 0;
}

.et_pb_section.bb-hero-section::after {
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(104, 114, 255, 0.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(104, 114, 255, 0.03) 1px, transparent 1px);
  background-size: 60px 60px;
  mask-image: radial-gradient(ellipse 70% 60% at 50% 50%, black 30%, transparent 80%);
  -webkit-mask-image: radial-gradient(ellipse 70% 60% at 50% 50%, black 30%, transparent 80%);
  pointer-events: none;
  z-index: 0;
}

@keyframes bb-hero-pulse {
  0%   { opacity: 0.6; transform: scale(1); }
  50%  { opacity: 1;   transform: scale(1.05); }
  100% { opacity: 0.7; transform: scale(1.02); }
}

@keyframes bb-hero-float {
  0%, 100% { transform: translateY(0); }
  50%      { transform: translateY(-8px); }
}

.et_pb_row.bb-hero-row {
  width: min(92vw, 70rem) !important;
  max-width: none !important;
  position: relative;
  z-index: 1;
}

.et_pb_text.bb-hero {
  max-width: min(92vw, 70rem);
  margin-inline: auto;
  text-align: center;
  position: relative;
  z-index: 1;
}

.et_pb_text.bb-hero h1 {
  max-width: 17ch;
  margin-inline: auto;
  font-size: clamp(2.5rem, 1.5rem + 4vw, 5.5rem) !important;
  font-weight: 700 !important;
  line-height: 0.96 !important;
  text-wrap: balance;
  color: var(--bb-text-primary) !important;
  text-shadow: 0 0 40px rgba(104, 114, 255, 0.15);
  animation: bb-hero-float 6s ease-in-out infinite;
}

.et_pb_text.bb-hero-sub {
  max-width: 58rem;
  margin: clamp(1.5rem, 3vw, 2.5rem) auto 0;
  text-align: center;
  position: relative;
  z-index: 1;
}

.et_pb_text.bb-hero-sub p {
  font-size: clamp(1.05rem, 0.95rem + 0.35vw, 1.35rem) !important;
  line-height: 1.6 !important;
  color: rgba(255, 255, 255, 0.7) !important;
}

/* --- HERO CTA BUTTON --- */
/* Force center alignment regardless of Divi's button alignment class */
.et_pb_button_module_wrapper.bb-cta-primary,
.et_pb_button_module_wrapper.bb-cta-primary.et_pb_button_alignment_left,
.et_pb_button_module_wrapper.bb-cta-primary.et_pb_button_alignment_right,
.et_pb_button_module_wrapper .et_pb_button.bb-cta-primary {
  display: block !important;
  text-align: center !important;
  margin-top: clamp(1.5rem, 3vw, 2.5rem) !important;
  margin-bottom: 0 !important;
  position: relative;
  z-index: 1;
}

.et_pb_button.bb-cta-primary {
  display: inline-block !important;
  width: auto !important;
  max-width: none !important;
  background: var(--bb-accent-primary) !important;
  border: 0 !important;
  color: #fff !important;
  padding: 0.7em 1.5em !important;
  font-size: 0.95rem !important;
  font-weight: 600 !important;
  font-family: var(--bb-font-button) !important;
  border-radius: 0.5rem !important;
  box-shadow: 0 4px 16px rgba(104, 114, 255, 0.2);
  transition: background 0.2s, transform 0.15s, box-shadow 0.2s !important;
  cursor: pointer !important;
  text-decoration: none !important;
  line-height: 1.4 !important;
  letter-spacing: 0 !important;
  margin: 0 auto !important;
}

.et_pb_button.bb-cta-primary:hover {
  background: var(--bb-accent-primary-hover) !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 6px 20px rgba(104, 114, 255, 0.3);
}

.et_pb_button.bb-cta-primary:active {
  transform: translateY(0) !important;
}

/* --- SECTION HEADING --- */
.et_pb_text.bb-section-heading {
  text-align: center;
}

.et_pb_text.bb-section-heading h2 {
  font-size: var(--bb-heading) !important;
  font-weight: 600 !important;
  color: var(--bb-text-primary) !important;
  margin-bottom: clamp(1rem, 2vw, 1.5rem) !important;
}

.et_pb_text.bb-section-heading p {
  font-size: var(--bb-body) !important;
  color: rgba(255, 255, 255, 0.7) !important;
  line-height: 1.7 !important;
}

/* --- FEATURE CARDS GRID --- */
.et_pb_row.bb-feature-grid {
  width: min(94vw, 96rem) !important;
  max-width: none !important;
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 19rem), 1fr));
  gap: clamp(1rem, 2vw, 2rem);
}

.et_pb_row.bb-feature-grid::after {
  display: none;
}

.et_pb_row.bb-feature-grid > .et_pb_column {
  width: auto !important;
  margin: 0 !important;
}

.et_pb_text.bb-card {
  height: 100%;
  padding: clamp(1.5rem, 2.5vw, 2.5rem) !important;
  background: rgba(255, 255, 255, 0.025) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  border-radius: clamp(0.75rem, 1vw, 1.25rem) !important;
  transition: border-color 0.3s, transform 0.3s !important;
}

.et_pb_text.bb-card:hover {
  border-color: var(--bb-accent-primary) !important;
  transform: translateY(-0.125rem) !important;
}

.et_pb_text.bb-card h3 {
  font-size: clamp(1.35rem, 1.1rem + 0.6vw, 1.8rem) !important;
  font-weight: 600 !important;
  color: var(--bb-text-primary) !important;
  margin-bottom: 1rem !important;
}

.et_pb_text.bb-card p {
  font-size: clamp(1rem, 0.94rem + 0.15vw, 1.15rem) !important;
  line-height: 1.65 !important;
  color: rgba(255, 255, 255, 0.65) !important;
  margin: 0 !important;
}

/* --- READING WIDTH SECTION (Why different / proof) --- */
.et_pb_section.bb-proof-section {
  background-color: var(--bb-bg-secondary) !important;
}

.et_pb_row.bb-reading-width {
  width: min(90vw, 68rem) !important;
  max-width: 68rem !important;
}

.et_pb_row.bb-reading-width h2 {
  font-size: var(--bb-heading) !important;
  font-weight: 600 !important;
  text-align: center;
  margin-bottom: 1.5rem !important;
}

.et_pb_row.bb-reading-width p {
  font-size: var(--bb-body) !important;
  color: rgba(255, 255, 255, 0.7) !important;
  line-height: 1.7 !important;
  text-align: center;
}

/* --- FINAL CTA SECTION --- */
.et_pb_section.bb-final-cta-section {
  text-align: center;
}

.et_pb_section.bb-final-cta-section .et_pb_button_module_wrapper {
  text-align: center;
}

/* --- RESPONSIVE --- */
@media (max-width: 980px) {
  #top-menu {
    display: none !important;
  }

  #et-top-navigation {
    padding-left: 0 !important;
  }

  .et_pb_section.bb-hero-section {
    min-height: min(70svh, 50rem);
    padding-block: clamp(3rem, 6vw, 6rem) !important;
  }

  .et_pb_row.bb-feature-grid {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr));
  }
}

@media (max-width: 767px) {
  #bb-pilot-banner {
    min-height: 54px;
  }

  .bb-site-title {
    font-size: 1.1rem !important;
  }

  .et_pb_section.bb-hero-section {
    min-height: min(60svh, 40rem);
    padding-block: clamp(2.5rem, 5vw, 4rem) !important;
  }

  .et_pb_text.bb-hero h1 {
    font-size: clamp(2rem, 1.2rem + 3vw, 3.5rem) !important;
  }

  .et_pb_row.bb-feature-grid {
    grid-template-columns: 1fr;
  }
}

/* ================================================================
   FULL-WIDTH PAGE LAYOUT — remove right sidebar on all pages
   ================================================================ */

/* Pilot page styles — raw HTML pages (Products, Pricing, etc.) */
.bb-pilot-page {
  max-width: 1180px !important;
  margin: 0 auto !important;
  padding: 80px min(4vw, 60px) !important;
  color: rgba(255, 255, 255, 0.8) !important;
}

.bb-pilot-page h1 {
  font-family: var(--bb-font-heading) !important;
  font-size: 2.5rem !important;
  font-weight: 800 !important;
  color: var(--bb-text-primary) !important;
  margin: 0 0 16px 0 !important;
  letter-spacing: -0.02em !important;
}

.bb-pilot-page h2,
.bb-pilot-page h3 {
  font-family: var(--bb-font-heading) !important;
  color: var(--bb-text-primary) !important;
  margin: 32px 0 12px 0 !important;
}

.bb-pilot-page h3 {
  font-size: 1.25rem !important;
  font-weight: 700 !important;
}

.bb-pilot-page p {
  font-size: 1rem !important;
  line-height: 1.7 !important;
  color: rgba(255, 255, 255, 0.7) !important;
  margin: 0 0 16px 0 !important;
}

.bb-pilot-page a {
  color: var(--bb-accent-primary) !important;
  text-decoration: none !important;
  font-weight: 600 !important;
}

.bb-pilot-page a:hover {
  color: var(--bb-accent-primary-hover) !important;
}

/* Grid layout for pricing/product cards */
.bb-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)) !important;
  gap: 24px !important;
  margin: 32px 0 !important;
}

.bb-grid .bb-card {
  background-color: var(--bb-bg-secondary) !important;
  border: 1px solid var(--bb-border-primary) !important;
  border-radius: var(--bb-card-radius) !important;
  padding: 28px !important;
  transition: all 0.2s !important;
}

.bb-grid .bb-card:hover {
  border-color: var(--bb-accent-primary) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.3) !important;
}

.bb-grid .bb-card h3 {
  margin: 0 0 8px 0 !important;
  font-size: 1.15rem !important;
}

/* Solutions page */
.bb-solutions-hero {
  text-align: center;
  margin-bottom: 3rem !important;
}

.bb-solutions-hero h1 {
  font-family: var(--bb-font-heading) !important;
  font-size: clamp(2rem, 4vw, 3rem) !important;
  font-weight: 800 !important;
  color: var(--bb-text-primary) !important;
  margin: 0 0 1rem 0 !important;
  letter-spacing: -0.02em !important;
}

.bb-solutions-hero p {
  font-size: 1.125rem !important;
  line-height: 1.6 !important;
  color: rgba(255, 255, 255, 0.6) !important;
  max-width: 640px;
  margin: 0 auto !important;
}

.bb-card-icon {
  font-size: 2rem !important;
  margin-bottom: 0.75rem !important;
  line-height: 1 !important;
}

.bb-card-link {
  display: inline-block !important;
  margin-top: 0.75rem !important;
  color: var(--bb-accent-primary) !important;
  font-size: 0.875rem !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  transition: color 0.2s !important;
}

.bb-card-link:hover {
  color: var(--bb-accent-primary-hover) !important;
}

.bb-solutions-features {
  margin-top: 4rem !important;
}

.bb-solutions-features h2 {
  text-align: center;
  font-family: var(--bb-font-heading) !important;
  font-size: 1.75rem !important;
  font-weight: 700 !important;
  color: var(--bb-text-primary) !important;
  margin: 0 0 2rem 0 !important;
}

.bb-solutions-cta {
  text-align: center;
  margin-top: 3rem !important;
  display: flex !important;
  justify-content: center !important;
  gap: 1rem !important;
  flex-wrap: wrap !important;
}

.bb-cta-secondary {
  background: transparent !important;
  border: 1px solid var(--bb-border-secondary) !important;
  color: rgba(255, 255, 255, 0.8) !important;
}

.bb-cta-secondary:hover {
  border-color: var(--bb-accent-primary) !important;
  color: var(--bb-accent-primary) !important;
  background: var(--bb-accent-a10) !important;
}

/* Status badges */
.bb-status-proven,
.bb-status-structural,
.bb-status-dev {
  display: inline-block !important;
  margin-top: 0.75rem !important;
  padding: 0.25rem 0.625rem !important;
  border-radius: 999px !important;
  font-size: 0.75rem !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.03em !important;
}

.bb-status-proven {
  background: rgba(37, 211, 102, 0.12) !important;
  color: #25d366 !important;
  border: 1px solid rgba(37, 211, 102, 0.3) !important;
}

.bb-status-structural {
  background: rgba(255, 169, 77, 0.12) !important;
  color: #ffa94d !important;
  border: 1px solid rgba(255, 169, 77, 0.3) !important;
}

.bb-status-dev {
  background: rgba(77, 171, 247, 0.12) !important;
  color: #4dabf7 !important;
  border: 1px solid rgba(77, 171, 247, 0.3) !important;
}

/* Contact page */
.bb-contact-page,
.entry-content > .bb-contact-page {
  max-width: 760px !important;
  margin: 0 auto !important;
  padding: 80px min(4vw, 60px) !important;
}

.bb-contact-page h1 {
  font-family: var(--bb-font-heading) !important;
  font-size: 2.5rem !important;
  font-weight: 800 !important;
  color: var(--bb-text-primary) !important;
  margin: 0 0 8px 0 !important;
}

.bb-contact-page h2 {
  font-family: var(--bb-font-heading) !important;
  font-size: 1.15rem !important;
  font-weight: 700 !important;
  color: var(--bb-text-primary) !important;
  margin: 32px 0 8px 0 !important;
}

.bb-contact-page p {
  font-size: 1rem !important;
  line-height: 1.7 !important;
  color: rgba(255, 255, 255, 0.7) !important;
}

.bb-contact-page a {
  color: var(--bb-accent-primary) !important;
  text-decoration: none !important;
  font-weight: 600 !important;
}

/* Generic page content wrapper — for pages without bb-pilot-page */
body.page:not(.home) .entry-content {
  max-width: 1180px !important;
  margin: 0 auto !important;
  padding: 60px min(4vw, 60px) !important;
}

body.page:not(.home) .entry-content h1 {
  font-family: var(--bb-font-heading) !important;
  font-size: 2.5rem !important;
  font-weight: 800 !important;
  color: var(--bb-text-primary) !important;
  letter-spacing: -0.02em !important;
  margin: 0 0 16px 0 !important;
}

body.page:not(.home) .entry-content h2 {
  font-family: var(--bb-font-heading) !important;
  color: var(--bb-text-primary) !important;
  margin: 32px 0 12px 0 !important;
}

body.page:not(.home) .entry-content h3 {
  font-family: var(--bb-font-heading) !important;
  font-size: 1.25rem !important;
  font-weight: 700 !important;
  color: var(--bb-text-primary) !important;
  margin: 24px 0 8px 0 !important;
}

body.page:not(.home) .entry-content p {
  font-size: 1rem !important;
  line-height: 1.7 !important;
  color: rgba(255, 255, 255, 0.7) !important;
}

body.page:not(.home) .entry-content a {
  color: var(--bb-accent-primary) !important;
  text-decoration: none !important;
  font-weight: 600 !important;
}

body.page:not(.home) #sidebar,

body.page:not(.home) #left-area,
body.page-template-default:not(.home) #left-area {
  width: 100% !important;
  max-width: 100% !important;
  float: none !important;
  padding-right: 0 !important;
}

body.page:not(.home) #main-content .container,
body.page:not(.home) #main-content .et_pb_row {
  max-width: var(--bb-container-width) !important;
}

/* Page title — suppress on Divi builder pages */
body.page:not(.home) h1.entry-title {
  display: none !important;
}

/* ================================================================
   DIVI SECTION OVERFLOW — prevent horizontal scroll
   ================================================================ */

body {
  overflow-x: hidden;
}

.et_pb_section {
  overflow-x: hidden;
}

.et_pb_section_fullwidth .et_pb_row {
  width: 100% !important;
  max-width: 100% !important;
  padding: 0 !important;
}

/* ================================================================
   CAPABILITY CARD — icon and typography
   ================================================================ */

.bb-capability-card {
  background-color: var(--bb-bg-primary) !important;
  border: 1px solid var(--bb-border-secondary) !important;
  border-radius: var(--bb-card-radius) !important;
  padding: var(--bb-card-padding) !important;
  box-shadow: var(--bb-shadow-medium) !important;
  transition: all 0.3s !important;
  height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
}

.bb-capability-card:hover {
  border-color: var(--bb-accent-primary) !important;
  transform: translateY(-2px) !important;
}

.bb-capability-card-icon {
  width: 3rem !important;
  height: 3rem !important;
  max-width: 3rem !important;
  max-height: 3rem !important;
  color: var(--bb-accent-primary) !important;
  margin-bottom: 1rem !important;
  flex-shrink: 0 !important;
}

.bb-capability-card-icon svg {
  width: 100% !important;
  height: 100% !important;
  max-width: 3rem !important;
  max-height: 3rem !important;
}

.bb-capability-card h3,
.bb-capability-card .bb-capability-card-title {
  font-family: var(--bb-font-heading) !important;
  font-size: var(--bb-h4-size) !important;
  font-weight: 600 !important;
  margin: 0 0 0.5rem !important;
  color: var(--bb-text-primary) !important;
}

.bb-capability-card p,
.bb-capability-card .bb-capability-card-description {
  color: rgba(255, 255, 255, 0.7) !important;
  margin: 0 0 1rem !important;
  line-height: 1.6 !important;
  flex-grow: 1 !important;
}

.bb-capability-card-cta {
  display: inline-flex !important;
  align-items: center !important;
  color: var(--bb-accent-primary) !important;
  font-weight: 600 !important;
  font-size: var(--bb-text-sm) !important;
  text-decoration: none !important;
  margin-top: auto !important;
}

.bb-capability-card-cta:hover {
  color: var(--bb-accent-primary-hover) !important;
}

/* ================================================================
   WOOCOMMERCE — dark theme for commerce pages
   ================================================================ */

.woocommerce-page #main-content .container,
.woocommerce-page #main-content .et_pb_row {
  max-width: var(--bb-container-width) !important;
}

.woocommerce ul.products li.product {
  background-color: var(--bb-bg-secondary);
  border: 1px solid var(--bb-border-secondary);
  border-radius: var(--bb-card-radius);
  padding: 1.5rem;
  transition: border-color 0.2s, transform 0.2s;
}

.woocommerce ul.products li.product:hover {
  border-color: var(--bb-accent-primary);
  transform: translateY(-2px);
}

.woocommerce ul.products li.product .woocommerce-loop-product__title {
  font-family: var(--bb-font-heading) !important;
  font-weight: 600;
  color: var(--bb-text-primary) !important;
}

.woocommerce ul.products li.product .price {
  color: var(--bb-accent-primary) !important;
  font-weight: 700;
}

.woocommerce ul.products li.product .button,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit {
  background-color: var(--bb-accent-primary) !important;
  color: var(--bb-text-on-accent) !important;
  border: none !important;
  border-radius: var(--bb-button-radius) !important;
  font-family: var(--bb-font-button) !important;
  font-weight: 600 !important;
  padding: var(--bb-button-padding-v) 1.5rem !important;
  text-transform: none !important;
  letter-spacing: normal !important;
  font-size: var(--bb-text-sm) !important;
  transition: background-color 0.2s !important;
}

.woocommerce ul.products li.product .button:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover {
  background-color: var(--bb-accent-primary-hover) !important;
}

.woocommerce-cart table.cart {
  border-radius: var(--bb-card-radius);
  overflow: hidden;
  border: 1px solid var(--bb-border-secondary);
}

.woocommerce-cart table.cart th {
  background-color: var(--bb-bg-secondary);
  color: var(--bb-text-primary) !important;
  font-family: var(--bb-font-body) !important;
  font-weight: 600;
}

.woocommerce-cart table.cart td {
  border-top: 1px solid var(--bb-border-secondary);
}

.woocommerce-checkout .woocommerce {
  max-width: 1200px;
  margin: 0 auto;
}

.woocommerce-checkout h1,
.woocommerce-checkout .woocommerce-billing-fields h3,
.woocommerce-checkout .woocommerce-shipping-fields h3,
.woocommerce-checkout #order_review_heading {
  font-family: var(--bb-font-heading) !important;
  font-weight: 700;
  color: var(--bb-text-primary) !important;
}

.woocommerce-checkout .form-row label {
  font-family: var(--bb-font-body) !important;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.7) !important;
  font-size: var(--bb-text-sm) !important;
}

.woocommerce-checkout .form-row input.input-text,
.woocommerce-checkout .form-row textarea,
.woocommerce-checkout .form-row select {
  border: 1px solid var(--bb-border-secondary) !important;
  border-radius: var(--bb-button-radius) !important;
  padding: 0.75rem 1rem !important;
  font-family: var(--bb-font-body) !important;
  font-size: var(--bb-text-sm) !important;
  background-color: var(--bb-bg-primary) !important;
  color: var(--bb-text-primary) !important;
  transition: border-color 0.2s !important;
}

.woocommerce-checkout .form-row input.input-text:focus,
.woocommerce-checkout .form-row textarea:focus,
.woocommerce-checkout .form-row select:focus {
  border-color: var(--bb-accent-primary) !important;
}

.woocommerce-checkout-review-order-table {
  border: 1px solid var(--bb-border-secondary) !important;
  border-radius: var(--bb-card-radius) !important;
  overflow: hidden;
}

.woocommerce-checkout-review-order-table th {
  background-color: var(--bb-bg-secondary) !important;
  font-family: var(--bb-font-body) !important;
  font-weight: 600;
}

.woocommerce #payment #place_order,
.woocommerce-page #payment #place_order {
  background-color: var(--bb-accent-primary) !important;
  color: var(--bb-text-on-accent) !important;
  border: none !important;
  border-radius: var(--bb-button-radius) !important;
  font-family: var(--bb-font-button) !important;
  font-weight: 700 !important;
  font-size: var(--bb-text-base) !important;
  padding: 1rem 2rem !important;
  width: 100% !important;
  text-transform: none !important;
  letter-spacing: normal !important;
  transition: background-color 0.2s !important;
}

.woocommerce #payment #place_order:hover,
.woocommerce-page #payment #place_order:hover {
  background-color: var(--bb-accent-primary-hover) !important;
}

.woocommerce .woocommerce-message,
.woocommerce .woocommerce-info {
  border-top-color: var(--bb-accent-primary) !important;
  background-color: var(--bb-accent-a05) !important;
  font-family: var(--bb-font-body) !important;
}

.woocommerce .woocommerce-error {
  border-top-color: #ef4444 !important;
  background-color: rgba(239, 68, 68, 0.05) !important;
  font-family: var(--bb-font-body) !important;
}

.woocommerce .woocommerce-breadcrumb {
  font-family: var(--bb-font-body) !important;
  color: rgba(255, 255, 255, 0.5) !important;
  font-size: var(--bb-text-sm) !important;
}

.woocommerce .woocommerce-breadcrumb a {
  color: var(--bb-accent-primary) !important;
}

.woocommerce div.product .product_title {
  font-family: var(--bb-font-heading) !important;
  font-weight: 700;
  color: var(--bb-text-primary) !important;
}

.woocommerce div.product p.price,
.woocommerce div.product span.price {
  color: var(--bb-accent-primary) !important;
  font-weight: 700;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
  color: var(--bb-accent-primary) !important;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul li {
  font-family: var(--bb-font-body) !important;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active a {
  color: var(--bb-accent-primary);
  font-weight: 600;
}

.woocommerce-account .woocommerce-MyAccount-content a {
  color: var(--bb-accent-primary);
}

@media (max-width: 768px) {
  .woocommerce-checkout .woocommerce {
    padding: 0 1rem;
  }
  .woocommerce ul.products li.product {
    width: 100% !important;
    margin: 0 0 1.5rem 0 !important;
  }
}

/* ================================================================
   PILOT MODE BANNER
   ================================================================ */

#bb-pilot-banner {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 8px 16px;
  background-color: var(--bb-accent-primary);
  color: var(--bb-text-on-accent);
  font-size: 14px;
  font-family: var(--bb-font-body);
  text-align: center;
  width: 100%;
  box-sizing: border-box;
  z-index: 99999;
  position: relative;
  min-height: 40px;
  box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.22);
}

.bb-pilot-badge {
  display: inline-block;
  background: rgba(255, 255, 255, 0.2);
  border: 1px solid rgba(255, 255, 255, 0.4);
  border-radius: 4px;
  padding: 2px 8px;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.bb-pilot-text {
  flex: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.bb-pilot-link {
  color: var(--bb-text-on-accent);
  text-decoration: underline;
  font-weight: 600;
  white-space: nowrap;
}

.bb-pilot-link:hover {
  color: var(--bb-text-on-accent);
  opacity: 0.85;
}

@media (max-width: 768px) {
  #bb-pilot-banner {
    flex-wrap: wrap;
    gap: 6px;
    padding: 6px 12px;
    font-size: 12px;
    min-height: 54px;
  }
  .bb-pilot-text {
    white-space: normal;
    flex-basis: 100%;
    order: 3;
  }
  .bb-pilot-badge {
    order: 1;
  }
  .bb-pilot-link {
    order: 2;
  }
}

/* ================================================================
   RESPONSIVE — tablet and mobile
   ================================================================ */

@media (max-width: 980px) {
  .bb-heading-hero {
    font-size: 3rem !important;
  }
  .bb-heading-primary {
    font-size: 2.5rem !important;
  }
  .et_pb_row .et_pb_column_1_3 {
    width: 50% !important;
  }
}

@media (max-width: 767px) {
  .bb-heading-hero {
    font-size: 2.25rem !important;
  }
  .bb-heading-primary {
    font-size: 2rem !important;
  }
  .et_pb_row .et_pb_column_1_3,
  .et_pb_row .et_pb_column_1_2 {
    width: 100% !important;
    margin-bottom: 1.5rem !important;
  }
}

@media (max-width: 480px) {
  .bb-heading-hero {
    font-size: 1.75rem !important;
  }
  .bb-heading-primary {
    font-size: 1.5rem !important;
  }
}