/* Native Elementor Welcome/Solutions overrides.
 * This file intentionally only changes presentation. It reuses the existing
 * widget IDs and leaves the Elementor data and widget tree untouched. */

/* Careers archive + Insights: use the shared navigation from the first paint.
 * The legacy script toggles .visible only after 100px; override both states so
 * scrolling through that threshold cannot hide or animate the header away.
 * Reserve its responsive height in normal flow to keep the hero unobscured. */
body.bf-persistent-header {
  --bf-header-height: 80px;
}

body.bf-persistent-header > .elementor-location-header {
  min-height: var(--bf-header-height);
}

body.bf-persistent-header .elementor-location-header .scroll-sticky-header {
  top: 0;
  transform: none;
  opacity: 1;
  visibility: visible;
  transition: none;
}

body.bf-persistent-header.admin-bar .elementor-location-header .scroll-sticky-header {
  top: var(--wp-admin--admin-bar--height, 32px);
}

/* Insights' page-owned logo/menu/search duplicates the shared header. Keep
 * its Elementor data intact and target only this stable container ID. */
body.bf-persistent-header .elementor[data-elementor-post-type="page"] > .elementor-element-227596c {
  display: none;
}

@media (max-width: 1024px) {
  body.bf-persistent-header {
    --bf-header-height: 65px;
  }
}

@media (max-width: 767px) {
  body.bf-persistent-header {
    --bf-header-height: 50px;
  }
}

/* Keep both halves of the native Solutions section on the same white canvas. */
html body #solutions,
html body .elementor-element-e9e60d8,
html body .elementor-element-a788bd0 {
  background-color: #fff !important;
}

/* Halve the space between the Solutions description and the card grid. */
html body #solutions,
html body .elementor-element-e9e60d8 {
  --padding-bottom: 60px !important;
  padding-bottom: 60px !important;
}

@media (max-width: 1024px) {
  html body #solutions,
  html body .elementor-element-e9e60d8 {
    --padding-bottom: 20px !important;
    padding-bottom: 20px !important;
  }
}

@media (max-width: 767px) {
  html body #solutions,
  html body .elementor-element-e9e60d8 {
    --padding-bottom: 15px !important;
    padding-bottom: 15px !important;
  }

  /* Match the other Solutions titles; this heading lacks a mobile size. */
  html body .elementor[data-elementor-type="wp-page"] .elementor-element-a788bd0 .elementor-element-75a6429 .elementor-heading-title {
    font-size: 16px;
  }
}

/* Remove the bottom padding from the native HOW WE WORK section. */
html body #how-we-work,
html body .elementor-element-f100001 {
  --padding-bottom: 0px !important;
  padding-bottom: 0 !important;
}

/* Keep the native Solutions card geometry independent from Elementor's
 * generated wrapper flex rules. Both rows span the full page width: two
 * half-width cards on the first row, three equal cards on the second. */
html body .elementor-element-a788bd0 {
  display: grid !important;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 0 !important;
}

html body .elementor-element-a788bd0 > .elementor-element-9671e36,
html body .elementor-element-a788bd0 > .elementor-element-d740437,
html body .elementor-element-a788bd0 > .elementor-element-085544f,
html body .elementor-element-a788bd0 > .elementor-element-d740437 > .e-con-inner {
  display: contents !important;
}

html body .elementor-element-a788bd0 .elementor-element-be5769f,
html body .elementor-element-a788bd0 .elementor-element-57a4c1c,
html body .elementor-element-a788bd0 .elementor-element-b5e59bd,
html body .elementor-element-a788bd0 .elementor-element-608031a,
html body .elementor-element-a788bd0 .elementor-element-897c7b1 {
  width: 100% !important;
  max-width: none !important;
}

/* The first row spans the full page width: FDE and GenAI each take half of
 * the six-column grid so both rows align edge to edge. Elementor's generated
 * page CSS retains more-specific legacy span-2 rules, so the desktop columns
 * and their responsive resets must remain important. */
html body .elementor-element-a788bd0 .elementor-element-be5769f {
  grid-column: 1 / span 3 !important;
  grid-row: 1;
}

html body .elementor-element-a788bd0 .elementor-element-57a4c1c {
  grid-column: 4 / span 3 !important;
  grid-row: 1;
}

html body .elementor-element-a788bd0 .elementor-element-b5e59bd {
  grid-column: 1 / span 2;
  grid-row: 2;
}

html body .elementor-element-a788bd0 .elementor-element-608031a {
  grid-column: 3 / span 2;
  grid-row: 2;
}

html body .elementor-element-a788bd0 .elementor-element-897c7b1 {
  grid-column: 5 / span 2;
  grid-row: 2;
}

html body .elementor-element-be5769f,
html body .elementor-element-57a4c1c {
  min-height: 500px !important;
}

html body .elementor-element-be5769f,
html body .elementor-element-57a4c1c {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) repeat(3, max-content) minmax(0, 1fr);
  align-content: start;
  align-items: start;
  justify-items: stretch;
  column-gap: 12px;
  row-gap: 12px;
}

html body .elementor-element-be5769f > .elementor-element-445188d,
html body .elementor-element-be5769f > .elementor-element-099e0de,
html body .elementor-element-be5769f > .elementor-element-e246135,
html body .elementor-element-57a4c1c > .elementor-element-5bd22ab,
html body .elementor-element-57a4c1c > .elementor-element-56b69cb,
html body .elementor-element-57a4c1c > .elementor-element-d475c3b {
  width: 100% !important;
  max-width: 100% !important;
  grid-column: 1 / -1;
  justify-self: stretch;
}

html body .elementor-element-be5769f > .elementor-element-e246135,
html body .elementor-element-57a4c1c > .elementor-element-d475c3b {
  display: flex !important;
  align-items: center;
  justify-content: center;
  margin-top: 4px;
  justify-self: center;
}

/* Preserve each source image's aspect ratio instead of letting Elementor's
 * generated width rule stretch it across the full card. */
html body .elementor-element-be5769f > .elementor-element-e246135 img,
html body .elementor-element-57a4c1c > .elementor-element-d475c3b img {
  display: block;
  width: auto !important;
  height: auto !important;
  max-width: 100% !important;
  max-height: 137px;
  aspect-ratio: auto !important;
  object-fit: contain !important;
}

/* Match the centered Learn More treatment used by the other solution cards. */
html body .elementor-element-be5769f > .elementor-element-50ee537,
html body .elementor-element-57a4c1c > .elementor-element-8f54f01 {
  right: auto !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
}

html body .elementor-element-sfd001a,
html body .elementor-element-sfd002a,
html body .elementor-element-sfd003a,
html body .elementor-element-sga001a,
html body .elementor-element-sga002a,
html body .elementor-element-sga003a {
  display: flex !important;
  width: auto !important;
  max-width: 100%;
  min-width: 0;
  margin: 0 !important;
  align-self: start;
}

/* Keep the first two skills on one row and move the third to the next on desktop. */
html body .elementor-element-sfd001a,
html body .elementor-element-sga001a {
  grid-column: 2;
  grid-row: 3;
  justify-self: center;
}

html body .elementor-element-sfd002a,
html body .elementor-element-sga002a {
  grid-column: 3;
  grid-row: 3;
  justify-self: center;
}

html body .elementor-element-sfd003a,
html body .elementor-element-sga003a {
  grid-column: 2 / 4;
  grid-row: 4;
  justify-self: center;
}

/* Tablet follows the mobile skill rhythm: one skill chip per row while the
 * existing two-column card layout remains intact. */
@media (min-width: 768px) and (max-width: 1024px) {
  html body .elementor-element-a788bd0 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  html body .elementor-element-a788bd0 .elementor-element-be5769f,
  html body .elementor-element-a788bd0 .elementor-element-57a4c1c,
  html body .elementor-element-a788bd0 .elementor-element-b5e59bd,
  html body .elementor-element-a788bd0 .elementor-element-608031a,
  html body .elementor-element-a788bd0 .elementor-element-897c7b1 {
    grid-column: auto !important;
    grid-row: auto;
    order: 0 !important;
  }

  html body .elementor-element-be5769f,
  html body .elementor-element-57a4c1c {
    min-height: 460px !important;
  }

  html body .elementor-element-sfd001a,
  html body .elementor-element-sfd002a,
  html body .elementor-element-sfd003a,
  html body .elementor-element-sga001a,
  html body .elementor-element-sga002a,
  html body .elementor-element-sga003a {
    grid-column: 1 / -1;
    grid-row: auto !important;
    justify-self: center;
  }
}

html body .elementor-element-sfd001a > .elementor-widget-container,
html body .elementor-element-sfd002a > .elementor-widget-container,
html body .elementor-element-sfd003a > .elementor-widget-container,
html body .elementor-element-sga001a > .elementor-widget-container,
html body .elementor-element-sga002a > .elementor-widget-container,
html body .elementor-element-sga003a > .elementor-widget-container {
  display: inline-flex;
  min-height: 32px;
  max-width: 100%;
  box-sizing: border-box;
  align-items: center;
  justify-content: center;
  padding: 7px 12px;
  border: 1px solid transparent;
  border-radius: 999px;
  box-shadow: 0 2px 10px rgb(0 0 0 / 12%);
}

html body .elementor-element-sfd001a > .elementor-widget-container,
html body .elementor-element-sfd002a > .elementor-widget-container,
html body .elementor-element-sfd003a > .elementor-widget-container {
  border-color: rgb(255 255 255 / 72%);
  background: #fff;
  color: #050505;
}

html body .elementor-element-sga001a > .elementor-widget-container,
html body .elementor-element-sga002a > .elementor-widget-container,
html body .elementor-element-sga003a > .elementor-widget-container {
  border-color: rgb(0 0 0 / 78%);
  background: #050505;
  color: #fff;
}

html body .elementor-element-sfd001a p,
html body .elementor-element-sfd002a p,
html body .elementor-element-sfd003a p,
html body .elementor-element-sga001a p,
html body .elementor-element-sga002a p,
html body .elementor-element-sga003a p {
  max-width: 100%;
  margin: 0;
  color: inherit;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: .01em;
  line-height: 1.25;
  text-align: center;
  white-space: nowrap;
}

/* welcome-new hero slide 2 (banner2): keep "The model is not the hardest
 * part." on a single line. The 52px display size needs ~870px while the 55%
 * text column only offers ~550px, so on desktop the split shifts from 45/55
 * to 38/62 (the Spline robot simply scales down) and the heading uses a fluid
 * size capped at 39px. white-space: nowrap only prevents the soft wrap; the
 * explicit <br> before "The last mile is." still breaks the second line.
 * Tablet and mobile keep their original Elementor behaviour. */
@media (min-width: 1025px) {
  html body .elementor-element-40bc1a1 {
    width: 38% !important;
  }

  html body .elementor-element-33aed3d {
    width: 62% !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
  }

  html body .elementor-element-fb7391f .elementor-heading-title {
    white-space: nowrap !important;
    font-size: clamp(30px, calc(3.72vw - 3.2px), 39px) !important;
  }
}

/* Welcome New hero banner 2: icon list matching the reference typography.
 * Migration 50 stores each point as icon + divider + stacked text, so the
 * layout is a three-column grid: circular gray badge, 1px vertical rule,
 * bold title over gray description. */
html body .elementor-element-23ef976 .elementor-element-bfhero301 {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0;
}

html body .elementor-element-23ef976 .elementor-element-bfhero301 .elementor-widget-container {
  width: 100%;
}

html body .elementor-element-23ef976 .bf-hero3-list {
  display: block;
  width: 100%;
  max-width: none;
  min-width: 0;
  margin: 26px 0 32px;
  padding: 0;
  box-sizing: border-box;
  list-style: none;
  font-family: "Open Sans", sans-serif;
}

html body .elementor-element-23ef976 .bf-hero3-list li {
  display: grid;
  min-width: 0;
  margin: 0;
  padding: 16px 0;
  box-sizing: border-box;
  grid-template-columns: 52px 1px minmax(0, 1fr);
  align-items: stretch;
  column-gap: 18px;
}

html body .elementor-element-23ef976 .bf-hero3-list li::before,
html body .elementor-element-23ef976 .bf-hero3-list li::marker {
  display: none !important;
  content: none !important;
}

html body .elementor-element-23ef976 .bf-hero3-list__icon {
  display: flex;
  width: 52px;
  height: 52px;
  align-items: center;
  align-self: center;
  justify-content: center;
  border-radius: 50%;
  background: #ececec;
  color: #141414;
}

html body .elementor-element-23ef976 .bf-hero3-list__icon svg {
  display: block;
  width: 24px;
  height: 24px;
}

html body .elementor-element-23ef976 .bf-hero3-list__divider {
  display: block;
  width: 1px;
  background: #d4d4d4;
}

html body .elementor-element-23ef976 .bf-hero3-list__text {
  display: block;
  min-width: 0;
  align-self: center;
  overflow-wrap: anywhere;
}

html body .elementor-element-23ef976 .bf-hero3-list li strong {
  display: block;
  color: #0b0b0b;
  font-size: 16px;
  font-weight: 700;
  letter-spacing: -.012em;
  line-height: 1.35;
}

html body .elementor-element-23ef976 .bf-hero3-list__description {
  display: block;
  margin: 3px 0 0;
  color: rgb(0 0 0 / 55%);
  font-size: 15px;
  line-height: 1.5;
}

/* Banner 2 CTA: match the reference full-pill black button with a trailing
 * arrow. The Widget settings already provide the black background, white
 * text and 27px radius; this only rounds it fully and appends the arrow. */
html body .elementor-element-b211cba .elementor-button {
  border-radius: 999px !important;
}

html body .elementor-element-b211cba .elementor-button-content-wrapper {
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
  gap: 10px;
}

html body .elementor-element-b211cba .elementor-button-content-wrapper::after {
  content: "→";
  font-size: 1.05em;
  line-height: 1;
}

/* Animate only after Swiper has initialized so the content remains readable
 * if carousel JavaScript is unavailable. Re-entering the slide restarts the
 * restrained, one-shot stagger without making static text look interactive. */
@media (prefers-reduced-motion: no-preference) {
  html body .elementor-element-c1e54fd .swiper-initialized .swiper-slide:not(.swiper-slide-active) .elementor-element-23ef976 .bf-hero3-list li {
    opacity: 0;
    transform: translate3d(0, 14px, 0);
  }

  html body .elementor-element-c1e54fd .swiper-initialized .swiper-slide-active .elementor-element-23ef976 .bf-hero3-list li {
    animation: bf-welcome-banner2-line-in 520ms cubic-bezier(.22, 1, .36, 1) both;
  }

  html body .elementor-element-c1e54fd .swiper-initialized .swiper-slide-active .elementor-element-23ef976 .bf-hero3-list li:nth-child(1) {
    animation-delay: 140ms;
  }

  html body .elementor-element-c1e54fd .swiper-initialized .swiper-slide-active .elementor-element-23ef976 .bf-hero3-list li:nth-child(2) {
    animation-delay: 220ms;
  }

  html body .elementor-element-c1e54fd .swiper-initialized .swiper-slide-active .elementor-element-23ef976 .bf-hero3-list li:nth-child(3) {
    animation-delay: 300ms;
  }

  html body .elementor-element-c1e54fd .swiper-initialized .swiper-slide-active .elementor-element-23ef976 .bf-hero3-list li:nth-child(4) {
    animation-delay: 380ms;
  }
}

@keyframes bf-welcome-banner2-line-in {
  from {
    opacity: 0;
    transform: translate3d(0, 14px, 0);
  }

  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

@media (prefers-reduced-motion: reduce) {
  html body .elementor-element-23ef976 .bf-hero3-list li {
    animation: none !important;
    opacity: 1 !important;
    transform: none !important;
  }
}

@media (max-width: 1024px) {
  html body .elementor-element-23ef976 .bf-hero3-list {
    margin: 18px 0 22px;
  }

  html body .elementor-element-23ef976 .bf-hero3-list li {
    padding: 14px 0;
    grid-template-columns: 44px 1px minmax(0, 1fr);
    column-gap: 14px;
  }

  html body .elementor-element-23ef976 .bf-hero3-list__icon {
    width: 44px;
    height: 44px;
  }

  html body .elementor-element-23ef976 .bf-hero3-list__icon svg {
    width: 20px;
    height: 20px;
  }

  html body .elementor-element-23ef976 .bf-hero3-list__description {
    font-size: 14px;
  }
}

@media (max-width: 767px) {
  html body .elementor-element-23ef976 .bf-hero3-list {
    margin: 14px 0 20px;
  }

  html body .elementor-element-23ef976 .bf-hero3-list li {
    width: 100%;
    max-width: 100%;
    padding: 12px 0;
    grid-template-columns: 40px minmax(0, 1fr);
    column-gap: 14px;
    text-align: left;
  }

  html body .elementor-element-23ef976 .bf-hero3-list__icon {
    width: 40px;
    height: 40px;
  }

  html body .elementor-element-23ef976 .bf-hero3-list__divider {
    display: none;
  }
}

@media (max-width: 767px) {
  html body .elementor-element-a788bd0 {
    grid-template-columns: 1fr;
  }

  html body .elementor-element-a788bd0 .elementor-element-be5769f,
  html body .elementor-element-a788bd0 .elementor-element-57a4c1c,
  html body .elementor-element-a788bd0 .elementor-element-b5e59bd,
  html body .elementor-element-a788bd0 .elementor-element-608031a,
  html body .elementor-element-a788bd0 .elementor-element-897c7b1 {
    grid-column: auto !important;
    grid-row: auto;
    order: 0 !important;
  }

  html body .elementor-element-be5769f,
  html body .elementor-element-57a4c1c {
    min-height: 340px !important;
  }

  html body .elementor-element-be5769f,
  html body .elementor-element-57a4c1c {
    grid-template-columns: 1fr;
    column-gap: 0;
    row-gap: 10px;
  }

  html body .elementor-element-sfd001a,
  html body .elementor-element-sfd002a,
  html body .elementor-element-sga001a,
  html body .elementor-element-sga002a {
    grid-column: auto;
    grid-row: auto !important;
    justify-self: center;
    margin-inline: 0 !important;
  }

  html body .elementor-element-sfd003a,
  html body .elementor-element-sga003a {
    grid-column: auto;
    grid-row: auto !important;
  }

  html body .elementor-element-sfd001a > .elementor-widget-container,
  html body .elementor-element-sfd002a > .elementor-widget-container,
  html body .elementor-element-sfd003a > .elementor-widget-container,
  html body .elementor-element-sga001a > .elementor-widget-container,
  html body .elementor-element-sga002a > .elementor-widget-container,
  html body .elementor-element-sga003a > .elementor-widget-container {
    padding-inline: 11px;
  }
}

/* Welcome New HOW WE WORK: render the 01-03 step numbers as display-size
 * numerals in a fixed, aligned column, vertically centred against each row's
 * copy. Security & Responsible AI is a separate cross-cutting principle, so
 * its standalone dark card intentionally has no sequence number. */
/* The 01-03 list container keeps Elementor's 10px default container padding,
 * which would misalign it against the 04 card; drop the horizontal padding so
 * every number, title and divider shares the same edges. */
html body .elementor-element-f100004 {
  padding-right: 0 !important;
  padding-left: 0 !important;
}

html body .elementor-element-f101001,
html body .elementor-element-f101002,
html body .elementor-element-f101003 {
  column-gap: clamp(28px, 3vw, 48px) !important;
  align-items: flex-start !important;
}

html body .elementor-element-f110001,
html body .elementor-element-f110002,
html body .elementor-element-f110003 {
  flex: 0 0 auto;
  width: clamp(72px, 6vw, 112px) !important;
  max-width: none !important;
  padding-right: 12px;
  padding-left: 12px;
}

html body .elementor-element-f110001 .elementor-heading-title,
html body .elementor-element-f110002 .elementor-heading-title,
html body .elementor-element-f110003 .elementor-heading-title {
  font-size: clamp(30px, 2.8vw, 52px) !important;
  font-weight: 600;
  letter-spacing: -.02em;
  line-height: 1;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}

html body .elementor-element-f110004 {
  display: none !important;
}

html body .elementor-element-f101004 {
  display: block !important;
  margin-top: 56px;
  padding: clamp(36px, 4vw, 64px) clamp(28px, 5vw, 72px) !important;
  border: 0 !important;
  border-radius: 24px;
  background: #0b0d0e;
}

html body .elementor-element-f120004 {
  display: grid !important;
  width: 100% !important;
  max-width: none !important;
  min-width: 0;
  padding: 0 !important;
  grid-template-columns: minmax(240px, .75fr) minmax(0, 1.5fr);
  align-items: start;
  gap: clamp(32px, 5vw, 80px) !important;
}

@media (min-width: 1025px) {
  html body .elementor-element-f120004 {
    max-width: 1200px !important;
    margin-inline: auto;
    grid-template-columns: 300px minmax(0, 760px);
    justify-content: center;
    gap: 48px !important;
  }
}

html body .elementor-element-f130004 .elementor-heading-title {
  max-width: 14ch;
  margin: 0;
  color: #fff !important;
  font-size: clamp(24px, 2.2vw, 34px) !important;
  line-height: 1.2;
}

html body .elementor-element-f140004 {
  width: 100% !important;
  max-width: 760px;
  min-width: 0;
}

html body .elementor-element-f140004 p {
  margin: 0;
  color: #b9c0c4;
  font-size: 15px;
  line-height: 1.65;
}

html body .elementor-element-f140004 p:first-child {
  margin-bottom: 16px;
  color: #fff;
  font-size: 17px;
  font-weight: 500;
}

/* ElementsKit measures the hidden desktop nav as 0px when the page first
 * loads below its 1024px breakpoint, then reuses that stale value after a
 * resize. Anchor top-position Mega Menus to the bottom edge of their owning
 * top-level item so mobile/tablet-to-desktop transitions remain aligned. */
@media (min-width: 1025px) {
  html body .elementor-widget-ekit-nav-menu .elementskit-navbar-nav > .elementskit-megamenu-has.top_position > .elementskit-megamenu-panel {
    top: 100% !important;
  }
}

/* Center each Mega Menu panel (and its pointer arrow) under its owning
 * top-level item instead of eyeballing it with hand-tuned margins.
 *
 * ElementsKit's top_position mode keeps the <li> static, so the panel is
 * positioned against the whole <ul> (left edge at "Welcome") and each mega
 * menu content template shifts its 712px root container with a hardcoded
 * margin-left (-100px / 50px). The pointer arrow lives in the content
 * template's Custom CSS as selector::after pinned to left:50% of that
 * container, so any navigation change silently misaligns the arrow.
 *
 * Fix: position the <li> relative, center the 712px panel on the <li>, and
 * neutralize the hardcoded container margins so the arrow (panel-centered)
 * always tracks the hovered item. translateY(-10px) -> translateY(0)
 * preserves ElementsKit's hover entrance animation. */
@media (min-width: 1025px) {
  html body .elementor-widget-ekit-nav-menu .elementskit-navbar-nav > .elementskit-megamenu-has.top_position {
    position: relative;
  }

  html body .elementor-widget-ekit-nav-menu .elementskit-navbar-nav > .elementskit-megamenu-has.top_position > .elementskit-megamenu-panel {
    left: 50% !important;
    /* !important: ElementsKit copies data-vertical-menu into an inline width. */
    width: 712px !important;
    transform: translateX(-50%) translateY(-10px) !important;
  }

  html body .elementor-widget-ekit-nav-menu .elementskit-navbar-nav-default.ekit-nav-dropdown-hover .elementskit-navbar-nav > .elementskit-megamenu-has.top_position:hover > .elementskit-megamenu-panel,
  html body .elementor-widget-ekit-nav-menu .elementskit-navbar-nav > .elementskit-megamenu-has.top_position > .elementskit-megamenu-panel.elementskit-dropdown-open {
    transform: translateX(-50%) translateY(0) !important;
  }

  /* Neutralize the per-template margin-left (-100px / 50px) on the mega menu
   * content's root container so it fills the centered panel exactly. */
  html body .elementor-widget-ekit-nav-menu .elementskit-megamenu-panel > .elementor > .e-con.e-parent {
    --margin-left: 0px !important;
    --margin-right: 0px !important;
    --width: 100% !important;
  }
}

/* Narrow desktop range (until ElementsKit switches to its tablet menu): the
 * Company panel centered on its item would poke past the right viewport edge
 * by up to ~15px and force a horizontal scrollbar. Slim the panel slightly;
 * it stays centered on the item, so the arrow remains aligned. */
@media (min-width: 1025px) and (max-width: 1136px) {
  html body .elementor-widget-ekit-nav-menu .elementskit-navbar-nav > .elementskit-megamenu-has.top_position > .elementskit-megamenu-panel {
    width: 660px !important;
  }
}

/* Keep the desktop header navigation on one row until ElementsKit switches to
 * its tablet menu at 1024px. Gradually tighten only the top-level link spacing
 * across the narrow desktop range so wider layouts retain the original 15px. */
@media (min-width: 1025px) and (max-width: 1136px) {
  html body .elementor-widget-ekit-nav-menu .elementskit-navbar-nav[id^="menu-beaconfire"] {
    flex-wrap: nowrap;
  }

  html body .elementor-widget-ekit-nav-menu .elementskit-navbar-nav[id^="menu-beaconfire"] > li > a {
    padding-right: clamp(9px, calc(5vw - 42px), 15px) !important;
    padding-left: clamp(9px, calc(5vw - 42px), 15px) !important;
    white-space: nowrap;
  }
}

/* Native service/industry pages legacy CTA (bf-fde-legacy-cta): restore the
 * hover inversion the pre-rebuild custom widget had. Migration 26 rebuilt the
 * button with class-based styling only and never ported the old
 * .bf-welcome__button:hover rule, so the white pill had no hover feedback.
 * This mirrors the Insights CTA hover: white pill -> black pill, white text. */
html body .bf-native-service-page .bf-fde-legacy-cta .bf-native-cta-button .elementor-button {
  transition: background-color .3s ease, color .3s ease;
}

html body .bf-native-service-page .bf-fde-legacy-cta .bf-native-cta-button .elementor-button:hover,
html body .bf-native-service-page .bf-fde-legacy-cta .bf-native-cta-button .elementor-button:focus {
  background: #000 !important;
  color: #fff !important;
}

/* Hero signal card: Elementor gives the container width: 100%, which adds to
 * the 20px margin (12px on mobile) and overflows the visual frame; the frame's
 * overflow: hidden then clips the card's right border/rounded corner and
 * covers the frame's own right edge, so the hero visual looks unclosed.
 * width: auto lets the card stretch inside its margins so both right borders
 * render properly. Applies to all native service/industry hero variants. */
html body .bf-native-service-page .bf-fde-hero__signal {
  width: auto !important;
}

/* -------------------------------------------------------------------------
 * Workflow Optimization flow layout (Insurance + Financial Services + Healthcare & Life
 * Sciences comparison grids, FDE workflow list).
 * Presentation-only: re-grid the cards as 3-3 / 2-2-2 / stacked (or widen
 * the FDE five-column gaps) with room for connectors, and style the SVG flow
 * layer injected by assets/js/native-service-flow.js. Scoped to page classes
 * so the other native service pages sharing these BEM classes stay
 * untouched. */

html body .bf-insurance-page .bf-fde-comparison-grid,
html body .bf-financial-services-page .bf-fde-comparison-grid,
html body .bf-healthcare-life-sciences-page .bf-fde-comparison-grid {
  position: relative;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  column-gap: 48px;
  row-gap: 88px;
}

@media (max-width: 1100px) {
  html body .bf-insurance-page .bf-fde-comparison-grid,
  html body .bf-financial-services-page .bf-fde-comparison-grid,
  html body .bf-healthcare-life-sciences-page .bf-fde-comparison-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 44px;
    row-gap: 88px;
  }
}

@media (max-width: 640px) {
  html body .bf-insurance-page .bf-fde-comparison-grid,
  html body .bf-financial-services-page .bf-fde-comparison-grid,
  html body .bf-healthcare-life-sciences-page .bf-fde-comparison-grid {
    display: block;
  }

  html body .bf-insurance-page .bf-fde-comparison-card,
  html body .bf-financial-services-page .bf-fde-comparison-card,
  html body .bf-healthcare-life-sciences-page .bf-fde-comparison-card {
    margin-bottom: 72px;
  }

  html body .bf-insurance-page .bf-fde-comparison-card:last-child,
  html body .bf-financial-services-page .bf-fde-comparison-card:last-child,
  html body .bf-healthcare-life-sciences-page .bf-fde-comparison-card:last-child {
    margin-bottom: 0;
  }
}

/* Forward-Deployed Engineering: keep the five-step row and open up the gaps
 * so the flow connectors sit between the cards. */
html body .bf-fde-page--fde .bf-fde-workflow-list {
  position: relative;
  column-gap: 48px;
}

/* Top-align the copy block so titles and descriptions line up across the
 * five cards (space-between lets the middle copy block drift with the
 * description length); the arrow stays pinned to the card bottom. */
html body .bf-fde-page--fde .bf-fde-workflow-list__item {
  justify-content: flex-start;
}

html body .bf-fde-page--fde .bf-fde-workflow-list__arrow {
  margin-top: auto;
}

@media (max-width: 1100px) {
  html body .bf-fde-page--fde .bf-fde-workflow-list {
    column-gap: 44px;
    row-gap: 88px;
  }
}

@media (max-width: 640px) {
  html body .bf-fde-page--fde .bf-fde-workflow-list__item {
    margin-bottom: 72px;
  }

  html body .bf-fde-page--fde .bf-fde-workflow-list__item:last-child {
    margin-bottom: 0;
  }
}

/* Forward-Deployed Engineering: keep the Why heading on one line. The shared
 * 11ch cap (native-service-pages.css) and the narrow two-col left track force
 * "Why Forward-Deployed Engineering?" onto three lines; drop the cap, forbid
 * wrapping, and scale the type down so the full line fits the column at every
 * desktop width. Below 768px the line cannot fit the viewport at a readable
 * size, so wrapping stays allowed there. */
html body .bf-fde-page--fde .bf-fde-why .bf-fde-section__heading h2 {
  max-width: none;
}

@media (min-width: 768px) {
  html body .bf-fde-page--fde .bf-fde-why .bf-fde-section__heading h2 {
    white-space: nowrap;
  }
}

@media (min-width: 901px) {
  html body .bf-fde-page--fde .bf-fde-why .bf-fde-section__heading h2 {
    font-size: clamp(18px, 1.8vw, 34px);
  }
}

/* SVG connector layer (injected by native-service-flow.js). The class only
 * exists where the script runs, so these rules stay page-agnostic. */
.bf-fin-flow {
  position: absolute;
  inset: 0;
  z-index: 3;
  width: 100%;
  height: 100%;
  overflow: visible;
  pointer-events: none;
}

.bf-fin-flow__segment {
  fill: none;
  stroke: #c4c4c0;
  stroke-width: 1.5;
  stroke-dasharray: 6 7;
  animation: bf-fin-flow-march 0.9s linear infinite;
}

.bf-fin-flow__pulse {
  fill: none;
  stroke: #161616;
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-dasharray: 12 88;
  animation: bf-fin-flow-pulse 2.6s linear infinite;
}

.bf-fin-flow__head {
  fill: none;
  stroke: #161616;
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}

@keyframes bf-fin-flow-march {
  to { stroke-dashoffset: -13px; }
}

@keyframes bf-fin-flow-pulse {
  to { stroke-dashoffset: -100px; }
}

@media (prefers-reduced-motion: reduce) {
  .bf-fin-flow__segment,
  .bf-fin-flow__pulse {
    animation: none;
  }

  .bf-fin-flow__pulse {
    opacity: 0;
  }
}

/* Never draw the flow layer inside the Elementor editor preview. */
body.elementor-editor-active .bf-fin-flow {
  display: none;
}

@media (max-width: 767px) {
  html body .elementor-element-f101001,
  html body .elementor-element-f101002,
  html body .elementor-element-f101003 {
    column-gap: 16px !important;
  }

  html body .elementor-element-f110001,
  html body .elementor-element-f110002,
  html body .elementor-element-f110003 {
    width: 64px !important;
  }

  html body .elementor-element-f110001 .elementor-heading-title,
  html body .elementor-element-f110002 .elementor-heading-title,
  html body .elementor-element-f110003 .elementor-heading-title {
    font-size: 22px !important;
  }

  html body .elementor-element-f101004 {
    margin-top: 36px;
    padding: 32px 24px !important;
    border-radius: 18px;
  }

  html body .elementor-element-f120004 {
    grid-template-columns: 1fr;
    gap: 18px !important;
  }

  html body .elementor-element-f130004 .elementor-heading-title {
    max-width: none;
  }

  html body .elementor-element-f140004 p {
    font-size: 16px;
  }
}

/* -------------------------------------------------------------------------
 * Header responsive nav (tablet & mobile, <=1024px): the hamburger icon in
 * the site header (template 164) opens Elementor popup 8446, which by
 * default renders as an 80%-black full-screen mask with a centred 640px
 * dialog. Restyle it into a dropdown panel that hangs directly below the
 * header bar — transparent overlay (keeps click-outside-to-close), panel
 * pinned to the top, full-width flush on phones and a right-aligned
 * floating card on tablets. Desktop never sees the popup (the trigger icon
 * is elementor-hidden-desktop); rules are still scoped to <=1024px.
 * ---------------------------------------------------------------------- */

@media (max-width: 1024px) {
  /* Elementor's mobile admin-bar rule makes lightboxes position: sticky.
   * This popup is appended after the footer, so sticky adds document height
   * and opening autofocus scrolls the page down to the menu. Keep this
   * navigation overlay anchored to the viewport in both login states. */
  html body #elementor-popup-modal-8446 {
    position: fixed;
    inset: 0;
    height: 100%;
    /* Keep click-outside / ESC dismissal without the dark mask. */
    background-color: transparent;
  }

  /* Pin the dialog right under the 65px header. Elementor positions
   * .dialog-widget-content with inline absolute centering, so every
   * placement property needs !important to beat the inline style. */
  html body #elementor-popup-modal-8446 {
    padding-top: 65px;
  }

  html body #elementor-popup-modal-8446 .dialog-widget-content {
    top: 65px !important;
    right: 24px !important;
    left: auto !important;
    width: min(420px, calc(100vw - 48px)) !important;
    max-height: calc(100vh - 65px - 34px);
    margin: 0 !important;
    overflow-y: auto;
    border-radius: 14px;
    box-shadow: 0 24px 48px rgba(0, 0, 0, .16), 0 2px 8px rgba(0, 0, 0, .08);
  }

  html body #elementor-popup-modal-8446 .dialog-message {
    width: 100% !important;
    max-width: none !important;
  }

  /* --- Menu item polish ------------------------------------------------ */
  /* Reserve a header strip at the top of the panel so the popup's
   * absolutely-positioned close X sits there instead of overlapping the
   * first menu item. */
  html body .elementor-8446 .elementor-element-dd93ea7 .elementor-nav-menu--dropdown {
    padding-top: 52px;
    padding-bottom: 8px;
  }

  html body #elementor-popup-modal-8446 .dialog-close-button {
    top: 12px !important;
    right: 14px !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    padding: 0;
    color: #5f6368;
    font-size: 12px;
    line-height: 1;
    background-color: #f0f1f3;
    border-radius: 50%;
    opacity: 1;
    z-index: 2;
    text-decoration: none !important;
    transition: background-color .2s ease, color .2s ease;
  }

  html body #elementor-popup-modal-8446 .dialog-close-button:hover {
    background-color: #e4e6ea;
    color: #14161a;
    text-decoration: none !important;
  }

  html body .elementor-8446 .elementor-element-dd93ea7 .elementor-nav-menu--dropdown .menu-item {
    border-top: 1px solid #f0f1f3;
  }

  html body .elementor-8446 .elementor-element-dd93ea7 .elementor-nav-menu--dropdown .menu-item:first-child {
    border-top: 0;
  }

  html body .elementor-8446 .elementor-element-dd93ea7 .elementor-nav-menu--dropdown .elementor-item {
    padding-right: 20px !important;
    padding-left: 20px !important;
    color: #14161a !important;
    font-size: 16px;
    font-weight: 500;
    line-height: 1.4;
  }

  html body .elementor-8446 .elementor-element-dd93ea7 .elementor-nav-menu--dropdown .elementor-item:hover,
  html body .elementor-8446 .elementor-element-dd93ea7 .elementor-nav-menu--dropdown .elementor-item:focus,
  html body .elementor-8446 .elementor-element-dd93ea7 .elementor-nav-menu--dropdown .elementor-item.highlighted {
    color: #000 !important;
    background-color: #f6f7f9 !important;
  }

  /* Current page: quiet but deliberate active state. */
  html body .elementor-8446 .elementor-element-dd93ea7 .elementor-nav-menu--dropdown .elementor-item.elementor-item-active {
    background-color: #f6f7f9 !important;
    font-weight: 600;
  }

  /* Caret rotates while its submenu accordion is open. */
  html body .elementor-8446 .elementor-element-dd93ea7 .elementor-nav-menu--dropdown .elementor-item .sub-arrow {
    transition: transform .25s ease;
  }

  html body .elementor-8446 .elementor-element-dd93ea7 .elementor-nav-menu--dropdown .elementor-item.highlighted .sub-arrow {
    transform: rotate(180deg);
  }

  /* Expanded submenu: light inset strip, indented child links. */
  html body .elementor-8446 .elementor-element-dd93ea7 .elementor-nav-menu--dropdown .sub-menu {
    background: #f7f8fa !important;
    border-top: 1px solid #eceef1;
  }

  html body .elementor-8446 .elementor-element-dd93ea7 .elementor-nav-menu--dropdown .sub-menu .menu-item {
    border-top: 0;
  }

  html body .elementor-8446 .elementor-element-dd93ea7 .elementor-nav-menu--dropdown .elementor-sub-item {
    padding: 12px 20px 12px 34px !important;
    color: #4b5560 !important;
    font-size: 15px;
    font-weight: 400;
  }

  html body .elementor-8446 .elementor-element-dd93ea7 .elementor-nav-menu--dropdown .elementor-sub-item:hover,
  html body .elementor-8446 .elementor-element-dd93ea7 .elementor-nav-menu--dropdown .elementor-sub-item:focus {
    color: #14161a !important;
    background-color: transparent !important;
  }
}

/* Phones (<=767px): header shrinks to 50px, panel is flush full-width. */
@media (max-width: 767px) {
  html body #elementor-popup-modal-8446 {
    padding-top: 50px;
    padding-right: 0;
    padding-left: 0;
  }

  html body #elementor-popup-modal-8446 .dialog-widget-content {
    top: 50px !important;
    right: 0 !important;
    left: 0 !important;
    width: 100% !important;
    max-height: calc(100vh - 50px - 16px);
    border-radius: 0 0 16px 16px;
  }
}

/* Tablets (768-1024px): floating card sits a touch below the header. */
@media (min-width: 768px) and (max-width: 1024px) {
  html body #elementor-popup-modal-8446 .dialog-widget-content {
    top: calc(65px + 10px) !important;
  }
}

/* -------------------------------------------------------------------------
 * GenAI & Agentic Systems FAQ: align the accordion answer with the question.
 * native-service-pages.css indents .elementor-tab-content 92px on the left,
 * a value copied from the retired custom widget whose summary grid had a
 * separate 44px number column (28px padding + 44px number + 20px gap). The
 * native accordion title has no number column, so the answer sat 64px deeper
 * than the question text. 28px matches the title row's left padding. The
 * mobile rule (0 20px 22px) already has no extra indent and stays untouched. */
html body .bf-native-service-page .bf-genai-faq .elementor-tab-content {
  padding-left: 54px;
}

/* -------------------------------------------------------------------------
 * Business Strategy / IT Professional Service / IT Strategy & Planning:
 * drop the forced ALL-CAPS on the service-card titles and the case-study
 * headings (PAST PROJECT / HOW BEACONFIRE HELPED / BENEFITS). The heading
 * text itself is stored in normal case; each heading widget only carries
 * Elementor's Typography > Transform = Uppercase setting, so the override
 * simply neutralizes that generated text-transform rule. Page-scoped by
 * body class plus the stable Elementor element IDs. */

/* business-strategy (page-id 17) */
html body.page-id-17 .elementor-element-d6bd3bd .elementor-heading-title,
html body.page-id-17 .elementor-element-0f29711 .elementor-heading-title,
html body.page-id-17 .elementor-element-249f321 .elementor-heading-title,
html body.page-id-17 .elementor-element-7381b3c .elementor-heading-title,
html body.page-id-17 .elementor-element-484241f .elementor-heading-title,
html body.page-id-17 .elementor-element-45d3848 .elementor-heading-title,

/* it-professional-service (page-id 19) */
html body.page-id-19 .elementor-element-5535e1e .elementor-heading-title,
html body.page-id-19 .elementor-element-8497db5 .elementor-heading-title,
html body.page-id-19 .elementor-element-fbcef3d .elementor-heading-title,
html body.page-id-19 .elementor-element-93d2560 .elementor-heading-title,
html body.page-id-19 .elementor-element-5832b98 .elementor-heading-title,
html body.page-id-19 .elementor-element-034756d .elementor-heading-title,

/* it-strategy-and-planning (page-id 23) */
html body.page-id-23 .elementor-element-690a081 .elementor-heading-title,
html body.page-id-23 .elementor-element-a2d5d6a .elementor-heading-title,
html body.page-id-23 .elementor-element-e9f5c40 .elementor-heading-title,
html body.page-id-23 .elementor-element-2d98f63 .elementor-heading-title,
html body.page-id-23 .elementor-element-0393d6d .elementor-heading-title,
html body.page-id-23 .elementor-element-c6f2401 .elementor-heading-title {
  text-transform: none !important;
}

/* -------------------------------------------------------------------------
 * Software & Hi-Tech / Telecommunication & Media / Professional Services /
 * Retail & E-commerce / Banking, Financial & Insurance / Public Sector:
 * same ALL-CAPS removal as the pages above. Each industry page forces
 * uppercase on four headings (service DETAILS / Industry Project / DETAILS /
 * result) via Elementor's Typography > Transform = Uppercase setting;
 * banking-financial-insurance repeats "service DETAILS" in a second case
 * block. The stored "DETAILS" title is already uppercase in the database
 * and is intentionally left untouched here. */

/* software-hi-tech (page-id 31) */
html body.page-id-31 .elementor-element-1c37c50 .elementor-heading-title,
html body.page-id-31 .elementor-element-7604e16 .elementor-heading-title,
html body.page-id-31 .elementor-element-e374281 .elementor-heading-title,
html body.page-id-31 .elementor-element-d364d03 .elementor-heading-title,

/* telecommunication-media (page-id 33) */
html body.page-id-33 .elementor-element-be3c3be .elementor-heading-title,
html body.page-id-33 .elementor-element-12dd047 .elementor-heading-title,
html body.page-id-33 .elementor-element-8d103a8 .elementor-heading-title,
html body.page-id-33 .elementor-element-c07fd4d .elementor-heading-title,

/* professional-services (page-id 35) */
html body.page-id-35 .elementor-element-3ea1786 .elementor-heading-title,
html body.page-id-35 .elementor-element-05ec435 .elementor-heading-title,
html body.page-id-35 .elementor-element-cd9483a .elementor-heading-title,
html body.page-id-35 .elementor-element-ae187fb .elementor-heading-title,

/* retail-e-commerce (page-id 37) */
html body.page-id-37 .elementor-element-008d76a .elementor-heading-title,
html body.page-id-37 .elementor-element-571cf22 .elementor-heading-title,
html body.page-id-37 .elementor-element-c09dda7 .elementor-heading-title,
html body.page-id-37 .elementor-element-14f5d14 .elementor-heading-title,

/* banking-financial-insurance (page-id 39) */
html body.page-id-39 .elementor-element-ed0a197 .elementor-heading-title,
html body.page-id-39 .elementor-element-efba5d0 .elementor-heading-title,
html body.page-id-39 .elementor-element-5c3bfce .elementor-heading-title,
html body.page-id-39 .elementor-element-9ff5adc .elementor-heading-title,
html body.page-id-39 .elementor-element-a4531ca .elementor-heading-title,

/* public-sector (page-id 41) */
html body.page-id-41 .elementor-element-73e8fc6 .elementor-heading-title,
html body.page-id-41 .elementor-element-3ddd026 .elementor-heading-title,
html body.page-id-41 .elementor-element-e20cdae .elementor-heading-title,
html body.page-id-41 .elementor-element-9d971d8 .elementor-heading-title {
  text-transform: none !important;
}

/* Say Hello: hide the placeholder text in the tablet/mobile contact section. */
html body .elementor[data-elementor-type="wp-page"] .elementor-element-ee6f548 .elementor-element-42cb474 {
  display: none !important;
}

/* Say Hello: keep the contact form clear of the decorative scene on phones. */
@media (max-width: 767px) {
  html body .elementor[data-elementor-type="wp-page"] > .elementor-element-b05baa9 {
    display: none !important;
  }

  html body .elementor[data-elementor-type="wp-page"] > .elementor-element-ee6f548 {
    margin-top: 0 !important;
  }
}

/* Home / Why Choose Us (migration 55): one set of five cards.
 * Flatten the presentation rows to let cards cross the old row boundary.
 * Desktop: 3 + 2 centered, equal-width cards. Mobile: 2 + 2 + 1, with the
 * last card centered at the same width as its peers. Also applies in preview.
 */
html body .elementor[data-elementor-type="wp-page"] .elementor-element-37b6114 .elementor-heading-title {
  text-transform: none !important;
}

html body .elementor[data-elementor-type="wp-page"] .elementor-element-37b6114 {
  display: grid !important;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 20px !important;
  align-items: stretch;
}

html body .elementor-element-37b6114 > .elementor-element-8bd693b,
html body .elementor-element-37b6114 > .elementor-element-cd9c74d {
  display: contents !important;
}

html body .elementor-element-37b6114 > .elementor-element-694e3a3,
html body .elementor-element-37b6114 > .elementor-element-bfwhy001 {
  grid-column: 1 / -1;
  width: 100%;
  min-width: 0;
}

html body .elementor-element-37b6114 :is(
  .elementor-element-a973c82,
  .elementor-element-7f96148,
  .elementor-element-6f2f7cb,
  .elementor-element-ad65954,
  .elementor-element-a9d600a
) {
  grid-column: span 2;
  width: 100% !important;
  max-width: none !important;
  min-width: 0;
  height: auto;
  align-self: stretch;
  order: 0 !important;
}

html body .elementor-element-37b6114 .elementor-element-ad65954 {
  grid-column: 2 / span 2;
}

html body .elementor-element-37b6114 .elementor-element-a9d600a {
  grid-column: 4 / span 2;
}

@media (max-width: 767px) {
  html body .elementor[data-elementor-type="wp-page"] .elementor-element-37b6114 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px !important;
  }

  html body .elementor-element-37b6114 .elementor-element-ad65954 {
    grid-column: span 2;
  }

  html body .elementor-element-37b6114 .elementor-element-a9d600a {
    grid-column: 2 / span 2;
  }

  /* Published pages that still have the legacy mobile-only cards must use
   * the same grid spans. Otherwise their percentage widths squeeze the text
   * into one track and let it overflow the page. */
  html body .elementor-element-37b6114 :is(.elementor-element-b7d9ae6, .elementor-element-aeea26d) {
    grid-column: span 2;
    width: 100% !important;
    max-width: none !important;
    min-width: 0;
  }

  html body .elementor-element-37b6114 .elementor-element-aeea26d {
    grid-column: 2 / span 2;
  }

  html body .elementor-element-37b6114 .elementor-element-a20cadd {
    width: 100% !important;
    max-width: none !important;
    min-width: 0;
  }
}

/* Keep the native home page's content and animated overflow within the
 * viewport, including Elementor previews. Unlike hidden, clip does not
 * create a scrolling ancestor or interfere with vertical sticky elements. */
html body .elementor[data-elementor-type="wp-page"]:has(> .elementor-element-ef2a5da) {
  overflow-x: clip;
}

/* Home hero: reserve a separate footer for pagination at tablet/mobile sizes.
 * The page's fixed 70px pagination offset otherwise intersects the first CTA. */
@media (max-width: 1024px) {
  html body .elementor[data-elementor-type="wp-page"] .elementor-element-ef2a5da {
    max-height: none !important;
  }

  html body .elementor-element-ef2a5da :is(.elementor-element-6a896e8, .elementor-element-23ef976) {
    padding-bottom: 64px !important;
  }

  html body .elementor-element-ef2a5da .elementor-element-c1e54fd {
    --e-n-carousel-swiper-padding-bottom: 0px;
  }

  html body .elementor-element-ef2a5da .elementor-element-c1e54fd .swiper-pagination {
    bottom: 20px !important;
  }
}

@media (max-width: 767px) {
  /* Remove both Spline scenes and their space, including the old 1180px
   * slide minimum. Swiper still stretches both slides to the taller copy. */
  html body .elementor-element-ef2a5da :is(.elementor-element-a2352c6, .elementor-element-40bc1a1) {
    display: none !important;
  }

  html body .elementor-element-ef2a5da :is(.elementor-element-6a896e8, .elementor-element-23ef976) {
    min-height: 0 !important;
    padding: 96px 40px 80px !important;
    justify-content: center !important;
    flex-wrap: nowrap !important;
  }

  html body .elementor-element-ef2a5da .elementor-element-33aed3d {
    padding: 0 !important;
  }

  /* Match the desktop carousel: arrows at the vertical midpoint, with the
   * existing 40px content gutters keeping text clear of both controls. */
  html body .elementor-element-ef2a5da .elementor-element-c1e54fd .elementor-swiper-button {
    top: 50% !important;
    bottom: auto !important;
    transform: translateY(-50%) !important;
  }

  html body .elementor-element-ef2a5da .elementor-element-c1e54fd .swiper-pagination {
    bottom: 30px !important;
    left: 50% !important;
    right: auto !important;
    width: max-content !important;
    transform: translateX(-50%) !important;
  }

  /* Home Industries: keep numbers in the title flow instead of using the
   * legacy absolute offset, which collides with labels around 650px. */
  html body .elementor[data-elementor-type="wp-page"] .elementor-element-8b0a0a3 .e-n-accordion-item-title {
    padding: 15px 20px !important;
  }

  html body .elementor-element-8b0a0a3 .e-n-accordion-item-title-header {
    flex: 1;
    min-width: 0;
  }

  html body .elementor-element-8b0a0a3 .e-n-accordion-item-title-text {
    display: flex;
    align-items: baseline;
    gap: 12px;
    min-width: 0;
  }

  html body .elementor-element-8b0a0a3 .e-n-accordion-item-title-text > span {
    position: static !important;
    flex: 0 0 28px;
    margin: 0 !important;
    text-align: center;
  }

  html body .elementor-element-8b0a0a3 .e-n-accordion-item-title-icon {
    flex-shrink: 0;
  }

  /* The home footer's narrow contact column must also fit small phones. */
  html body.home .elementor-location-footer .elementor-icon-list-text {
    min-width: 0;
    overflow-wrap: anywhere;
  }
}