@charset "UTF-8";
/* ============================================================================
   RESET — Elementor defaults that the design system is allowed to override.
   Loaded BEFORE design.css on purpose: every rule here is written at the same
   specificity the design system uses, so whichever the mockup declares wins on
   source order. Rules that must BEAT the design system live in bridge.css.
   ========================================================================= */

/* Elementor does NOT set `display` on a container — it sets `.e-con{display:
   var(--display)}` at (0,1,0) and then writes `--display:flex` per element in
   post-<id>.css at (0,3,0). Overriding `display` therefore does nothing; the
   variable has to be beaten, and only at (0,3,0) or better. `.e-con.e-con`
   repeats the class to reach (0,3,0) and wins on source order, since
   post-<id>.css is enqueued before this file.
   Every class that genuinely needs flex/grid declares it directly in design.css
   at (0,2,0), which outranks the (0,1,0) `display:var(--display)` rule — so the
   design system keeps full control and the rest fall back to block flow.      */
body.site .e-con.e-con,
body.site .e-con.e-con > .e-con-inner {
  --display: block;
  /* Elementor applies `.e-con{width:var(--width)}` with `--width:100%`, so every
     container is width:100%. Inside a flex row that stops .logo / .hdr__end from
     shrink-to-fit and each one blows out to the full bar (the header stacked to
     211px instead of 66px). `auto` gives block containers the full width they
     already had and lets flex items size to content.                           */
  --width: auto;
  --padding-block-start: 0px;  --padding-block-end: 0px;
  --padding-inline-start: 0px; --padding-inline-end: 0px;
  --container-max-width: none;
  --gap: 0px; --row-gap: 0px; --column-gap: 0px;
  /* Elementor's container default is a COLUMN, applied as
     `flex-direction:var(--flex-direction)`. CSS's own default is row, which is
     what the mockup assumes — only `.work` asks for column, and it says so in
     design.css at (0,2,0), outranking the `:where()` rule that reads this
     variable. Without this every flex row (hero CTAs, chips, the footer bar)
     silently stacked. */
  --flex-direction: row;
}
/* NOTE: only the variables are set above. Elementor applies the gap through
   `.elementor-element:where(.e-con-full,.elementor-widget){gap:var(--row-gap)
   var(--column-gap)}` — `:where()` adds no specificity, so that rule is (0,1,0)
   and the design system's own 59 gap declarations at (0,2,0) already beat it.
   Writing a literal `gap:0` here would sit at (0,3,0) and silently erase all of
   them (it flattened the footer grid and every stepped section). Same reasoning
   for max-width: don't declare it, just neutralise --width.                    */

/* NOTE: no `max-width:none` here. At (0,3,0) it outranked design.css and wiped
   every design-system max-width — `.lead` stretched from 68ch to the full 1340px
   column. Elementor's own `.e-con>.elementor-widget{max-width:100%}` sits at
   (0,4,0), so the design system's values are re-emitted above it by the
   generated block at the end of bridge.css. */

/* `.e-con .elementor-widget.elementor-widget{margin-block-end:0}` is (0,3,0)
   and silently erases design-system margins — neutralise it at (0,3,0) here so
   design.css can still set margins on its own classes.                        */
body.site .e-con .elementor-widget.elementor-widget { margin-block-end: 0; }

/* widget wrappers are layout-transparent: the design system styles the inner
   element, so the wrapper must not introduce a box of its own                  */
body.site .elementor-widget-heading,
body.site .elementor-widget-text-editor,
body.site .elementor-widget-html,
body.site .elementor-widget-button,
body.site .elementor-widget-image { display: block; }

/* Elementor's Kit types headings through
   `.elementor-widget-heading .elementor-heading-title` at (0,2,0)              */
body.site .elementor-widget-heading .elementor-heading-title {   /* (0,3,0) */
  font-family: inherit; font-size: inherit; font-weight: inherit;
  line-height: inherit; color: inherit; letter-spacing: inherit;
  margin: 0;
}

/* --- generated: heading tag defaults, moved onto marker classes
   because Elementor splits a heading into wrapper + inner --- */
body.site .mim-h1, body.site .mim-h2, body.site .mim-h3, body.site .mim-h4, body.site .mim-h5, body.site .mim-h6{font-family: var(--f-display);
  color: var(--steel);
  font-weight: 500;
  line-height: 1.1;
  letter-spacing: -.01em;
  margin: 0;
  text-wrap: balance;}