/* Custom nav additions: mega menu featured cards, AI tags, sub-headings, 5-col layout */
.clb-mega-4col.sub-menu-wide > li{width:20% !important;}

.clb-mega-featured-card{
  background:#24262B;
  border-radius:var(--clb-border-radius-large,16px);
  padding:1.5rem;
  height:100%;
  display:flex;
  flex-direction:column;
  gap:0.75rem;
  box-sizing:border-box;
}
.clb-mega-card-title{
  color:#fff;
  font-family:'Bricolage Grotesque', sans-serif;
  font-weight:600;
  font-size:1.1rem;
  line-height:1.3;
}
.clb-mega-card-text{
  color:#c7c9ce;
  font-size:0.85rem;
  line-height:1.5;
  margin:0;
}
.clb-mega-card-tags{
  display:flex;
  flex-wrap:wrap;
  gap:0.4rem;
  margin-top:0.25rem;
}
.clb-mega-tag{
  display:inline-block;
  background:#32353C;
  color:#e5e5e5;
  font-size:0.72rem;
  line-height:1;
  padding:0.4rem 0.6rem;
  border-radius:999px;
  white-space:nowrap;
}
.clb-mega-card-btn{
  margin-top:auto;
  display:inline-block;
  background:#e5652f;
  color:#fff !important;
  text-align:center;
  font-size:0.85rem;
  font-weight:600;
  padding:0.65rem 1rem;
  border-radius:999px;
  text-decoration:none;
  transition:opacity .2s ease;
}
.clb-mega-card-btn:hover{opacity:0.85;}

.sub-sub-menu li.clb-mega-subheading{
  margin-top:0.6rem;
  padding-top:0.6rem;
  border-top:1px solid rgba(0,0,0,0.08);
}
.sub-sub-menu li.clb-mega-subheading > span{
  font-weight:700;
  opacity:1;
  font-size:var(--clb-font-size-extra-small, 13px);
  text-transform:uppercase;
  letter-spacing:0.04em;
}

@media (max-width: 1024px){
  .clb-mega-4col.sub-menu-wide > li{width:100% !important;}
}

/* digitally scaled logo sizing */
.logo img.svg-logo,
.logo-sticky img.svg-logo,
.logo-dynamic img.svg-logo{
  height:26px;
  min-height:26px;
  max-height:26px;
  width:auto;
  display:block;
  transition:all var(--clb-transition-function,ease) var(--clb-transition-duration,0.2s);
}
.logo-dynamic img.svg-logo{
  min-height:26px;
  max-height:26px;
  max-height:unset;
}
.footer-logo{
  height:34px;
  width:auto;
  display:block;
  margin-bottom:0.75rem;
}

/* Inline SVG replacements for broken bootstrap-icon-font glyphs */
.icon-svg-replace{
  display:block;
  flex-shrink:0;
}
.icon-group .icon-svg-replace{
  color:inherit;
}

/* Mega-menu hover-intent buffer: keeps dropdown open while cursor crosses
   the gap between the nav link and the panel, via JS-managed delayed close */
.header:not(.-mobile) .menu > li.force-open-submenu > ul,
.header:not(.-mobile) .menu > li.force-open-submenu > ul > *{
  opacity:1 !important;
  visibility:visible !important;
  transform:none !important;
}
.header:not(.-mobile) .menu > li.force-open-submenu .sub-menu-wide ul{
  opacity:1 !important;
  visibility:visible !important;
}
.header:not(.-mobile) .menu > li.force-open-submenu > a .menu-chevron{
  transform:rotate3d(1,0,0,180deg);
}

/* Keep top-level nav item labels on a single line (e.g. "Software Solutions", "AI Solutions") */
#menu-primary > li.nav-item > a.menu-link{
  white-space:nowrap;
}
#menu-primary > li.nav-item > a.menu-link > span{
  white-space:nowrap;
}
#menu-primary{
  flex-wrap:nowrap;
}

/* Keep the logo the same small size in the sticky/scrolled header state.
   The theme's own ".header.-sticky .branding img" rule (min-height:38px)
   has higher specificity than our earlier logo-sizing rule, so it was
   winning once the header became sticky, making the logo visibly grow
   on scroll. */
.header.-sticky .branding img.svg-logo{
  height:26px;
  min-height:26px;
  max-height:26px;
  width:auto;
}

/* Footer tagline ("Software, AI, and digital solutions built to last.") is
   marked up as a raw <h3>, so it was inheriting the theme's default H3
   size (a large, responsive heading size meant for page content, not a
   small footer blurb). At that size it made the "Software, AI..." column
   much taller than the other footer columns, which -- because the footer
   widgets sit in a row that stretches to match its tallest item -- left
   visible empty space at the bottom of the shorter columns next to it. */
#block-16 h3{
  font-size:1.05rem;
  line-height:1.4;
  font-weight:600;
}

/* On narrow mobile widths, the header logo, hamburger icon, and the
   "Book an Appointment" button don't leave enough combined room -- the
   button never shrinks, so the logo gets squeezed/compressed instead,
   making it look cut off or overlapping the button. Shrink the button on
   small screens so the logo can render at its natural size. */
@media (max-width: 480px){
  .header .button-group .button.btn-optional{
    font-size:0.8rem;
    padding:0 0.85rem;
    min-height:2.25rem;
  }
}
@media (max-width: 390px){
  .header .button-group .button.btn-optional{
    font-size:0.72rem;
    padding:0 0.65rem;
  }
}
@media (max-width: 340px){
  .header .button-group .button.btn-optional{
    font-size:0.65rem;
    padding:0 0.5rem;
  }
}

/* The "Industries we serve" logo row uses the theme's flex layout with a
   fixed column width that's too narrow for longer labels like "Retail &
   E-commerce" and "Logistics & Warehousing" -- they wrap to two lines
   while the shorter labels stay on one, making the row look uneven and
   leaving extra vertical space below it. Prevent wrapping and let each
   item size to fit its own label instead of a fixed column width. */
.elementor-element-5d049b8 .ohio-widget.logo,
.elementor-element-806d09d .ohio-widget.logo{
  white-space:nowrap;
}
.elementor-element-5d049b8,
.elementor-element-806d09d{
  flex-wrap:wrap;
  row-gap:1.5rem;
  column-gap:2rem;
}
.elementor-element-13db335,
.elementor-element-4244c08,
.elementor-element-5cadce9,
.elementor-element-9dd2dbc,
.elementor-element-3ca6806,
.elementor-element-11ad5d9,
.elementor-element-894c4d8,
.elementor-element-ff322d1{
  width:auto !important;
  flex:0 0 auto !important;
}
@media (max-width: 767px){
  .elementor-element-5d049b8,
  .elementor-element-806d09d{
    width:100% !important;
  }
}