/*
Elementor container-conversion fixes.

The V1 stylesheet (style.css) positions a few repeating elements using
:nth-child (marquee alternating colour, architecture map nodes, process step
highlight). Elementor wraps every atomic widget in its own element/container
div, which breaks direct-sibling :nth-child counting -- each converted
element becomes the sole child of its own wrapper, so :nth-child no longer
resolves the way it did against the old flat HTML. These rules restore the
identical intended visual result using explicit classes assigned directly in
the Elementor template JSON instead of relying on sibling position.

Disclosed correction: the original `.node:nth-child(1..5)` rules assumed 5
direct .node siblings, but a `.map-line` div sits before them as an extra
sibling, silently shifting every rule by one position. That left "Seriteq
Core" (clearly meant to be the centred, highlighted hub node, given its
centred/highlighted rule and its role in the copy) unstyled in the live
site, and "Voice + Teams" with no position at all. The classes below apply
the evident original intent (all 5 nodes positioned, Seriteq Core centred +
highlighted) rather than reproducing that incidental off-by-one bug.
*/

.marquee-item-alt { color: var(--blue-digital); }

.node-1 { top: 65px; left: 70px; }
.node-2 { top: 90px; right: 104px; }
.node-3 { top: 260px; left: 50%; transform: translateX(-50%); background: rgba(252,196,0,.92); color: var(--ink); }
.node-4 { bottom: 86px; left: 100px; }
.node-5 { bottom: 68px; right: 128px; }

.process-step-featured { background: rgba(252,196,0,.94); color: var(--ink); }

@media (max-width: 760px) {
  .node-1 { top: 46px; left: 24px; }
  .node-2 { top: 50px; right: 26px; }
  .node-3 { top: 215px; }
  .node-4 { bottom: 58px; left: 28px; }
  .node-5 { bottom: 46px; right: 24px; }
}

/*
Checkmark icon technology swap: the V1 feature-grid icons were inline SVG
checkmarks (targeted by `.feature svg`). The Elementor-native Icon widget
used in the atomic conversion renders a FontAwesome <i> icon instead, so
`.feature svg` no longer matches anything. This restores identical
size/colour/spacing on the new element so the feature cards look unchanged.
*/
.feature .elementor-icon,
.feature i.fas {
  width: 24px;
  height: 24px;
  margin-bottom: 12px;
  color: var(--blue-digital);
  font-size: 24px;
  line-height: 24px;
  display: inline-block;
}

/* Neutralise Elementor's default button/form chrome so the original .btn,
   .tab-btn, .nav-link, .lead-form styling is the only thing controlling
   appearance on converted Button/Form widgets. */
.elementor-widget-button .elementor-button,
.elementor-widget-form .elementor-button {
  min-height: 0;
}

/*
V2: content width fed into Elementor's OWN native computation, from one
shared source of truth, instead of duplicating Elementor's formula here.

Elementor Containers compute their boxed width as:
  --content-width: min(100%, var(--container-max-width, 1140px));
(elementor/assets/css/frontend.css) -- so overriding the INPUT variable
lets Elementor's own formula do the work, rather than this stylesheet
recomputing max-width itself and risking drifting out of sync if Elementor
changes that formula in a future version (confirmed against a real
Elementor 4.1.4 install). The value comes from --container-max (style.css
:root), itself measured from the client's reference site
(intellegereholdings.com/seriteq/, `.wgl-container { width: 1170px }`) --
one number, defined once, consumed by both the theme's own layout and by
Elementor's Containers.

Editors can still make any individual container edge-to-edge (hero
banners, background-colour dividers, etc.) via that container's own
Content Width > "Full Width" setting in Elementor: .e-con-full never reads
--container-max-width (it isn't wrapped in the .e-con-inner element that
consumes it), so it's unaffected by this rule.

!important is required because Elementor's own per-post generated CSS
(setting --container-max-width from its Kit's Content Width setting,
default 1140px) is loaded after this stylesheet at equal specificity.

The legacy Section/Column widget system doesn't use a CSS variable for
this -- Elementor bakes a literal max-width per Kit setting instead -- so
it still needs its own direct override, kept here for defensive
compatibility with any older imported Elementor content.
*/
.e-con {
  --container-max-width: var(--container-max) !important;
}

.elementor-section.elementor-section-boxed > .elementor-container {
  max-width: min(100%, var(--container-max)) !important;
}