/* =========================================================
   Elementor container reset.

   Enqueued AFTER Elementor's stylesheet and BEFORE the design system, and that order
   is the whole point. Elementor styles containers with single-class selectors (.e-con)
   and so does the design (.hero__visual, .marquee, .container). Equal specificity is
   decided by order, so sitting between the two lets this undo Elementor's defaults
   while every design rule still overrides it.

   Every selector here must stay at exactly one class. An earlier version also listed
   `.elementor-element.e-con`, which is two classes and therefore outranked the design —
   grids flattened to blocks and containers lost their max-width.
   ========================================================= */

.e-con,
.e-con-full {
  /* Elementor containers are flex; the design expects normal block flow unless it
     says otherwise, and a flex context changed how children sized themselves. */
  display: block;

  /* The important one. Every Elementor container is position:relative, which makes it
     the containing block for absolutely positioned descendants. The HUD chips, the
     airflow beam and the card overlays are positioned against a specific ancestor, and
     a nearer one silently took over — which is why they floated in the wrong place. */
  position: static;

  gap: 0;
  padding: 0;
}

/* Elementor's per-widget spacing; the design spaces everything itself. */
.elementor-widget {
  margin: 0;
}

/* -----------------------------------------------------------------
   The flex axis.

   Elementor lays every container out with a one-class rule —
   `.elementor-element:where(.e-con-full, .elementor-widget)` — which sets
   flex-direction, align-items, flex-wrap and justify-content from custom
   properties, alongside `.e-con { width: var(--width) }`. Its default direction
   is column and its default width is 100%.

   Because :where() contributes no specificity, those rules weigh exactly as much as
   the design's own single-class selectors. The design never declares flex-direction —
   a plain <div> is not a flex container to begin with — so Elementor's column had
   nothing to override it and survived on every container on the site.

   That one property caused most of the visible damage: the marquee track laid its two
   groups out vertically, so `width: max-content` measured one group and the strip
   rendered as two stacked rows instead of one seamless loop; the HUD chips and the
   airflow beam took width 100% of the wrong axis, 350px and 413px instead of 165px
   and 727px; section headings stretched instead of sitting on one line.

   Resetting these to their CSS initial values makes an Elementor container behave
   exactly like the <div> it replaced, which is the whole contract of the conversion.
   The design's own rules come later in the cascade and still win wherever they speak.

   Note for whoever edits this file: CSS comments do not nest. An earlier version of
   this block quoted Elementor's declarations with their own inline comments inside,
   which closed the comment early, so the browser discarded the rule below while the
   file still read correctly in an editor.
   ----------------------------------------------------------------- */
.e-con,
.e-con-full,
.elementor-widget {
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: normal;
  align-content: normal;
  justify-content: normal;
  width: auto;
  min-height: auto;
}

/* -----------------------------------------------------------------
   The default direction, set through Elementor's own custom property.

   `.e-con-full.e-flex { flex-direction: var(--flex-direction) }` carries two classes,
   so it cannot be beaten by a single-class rule here or in the design. What can be
   changed is the variable it reads: `.e-con.e-flex` sets it to column, and this sets
   it back to row at the same weight from a stylesheet that loads later.

   Row is the right default because it is what a plain <div> does, and the design was
   written against plain divs. Where the design asks for a different direction, or for
   a `flex` value, elementor-flex.css restates it at a weight that wins — it is
   generated from the design's own stylesheets so the two cannot drift apart.
   ----------------------------------------------------------------- */
.e-con.e-flex,
.e-con-full.e-flex {
  --flex-direction: row;
}

/* -----------------------------------------------------------------
   Elementor's default spacing between widgets.

   The kit sets `.elementor-widget:not(:last-child) { margin-block-end: 20px }`. A class
   plus a :not() is two classes, so the `.elementor-widget { margin: 0 }` rule above —
   one class — never beat it. Inside a container Elementor zeroes its own variable, so
   it only showed where a widget is a direct child of the document: the skip link at the
   top of the header template, which pushed every page down by 20px.

   The design owns spacing everywhere on this site, so the default is removed rather
   than adjusted.
   ----------------------------------------------------------------- */
.elementor-widget:not(:last-child) {
  margin-block-end: 0;
}