/* CEDX brand layer. The original Webflow layout and animations remain untouched. */
.mega-nav { display: none !important; }

/* =========================================================================
 * Global header — bar, flyout menus, product directory, mobile drawer.
 * Markup is generated by cedx_header.py; behaviour lives in cedx-header.js.
 * Editing the header inside _overlay/index.html does not survive build_home.py.
 * ========================================================================= */
:root {
  --cedx-h: 4rem;                 /* bar height; the directory, the scrim and
                                     scroll-padding all key off this one value */
  --cedx-blue: #2861ed;
  --cedx-blue-ink: #1b48bd;
  --cedx-ink: #101427;
  --cedx-muted: #5c6478;
  --cedx-faint: #676f82;  /* 5.0:1 on white — it carries 11px eyebrows and counts */
  --cedx-line: #e4e8f0;
  --cedx-line-soft: #eef1f7;
  --cedx-surface: #f6f8fc;
  --cedx-pop: 0 1.5rem 3.5rem -1rem rgba(13,24,56,.24), 0 0 0 1px rgba(13,24,56,.05);
}

/* Anchored sections (/solutions/#trace and friends) must not land under the
   fixed bar. */
html { scroll-padding-top: calc(var(--cedx-h) + 1.25rem); }
html.cedx-no-scroll { overflow: hidden; }

.cedx-global-header,
.cedx-global-header * { box-sizing: border-box; }
.cedx-sprite { position: absolute; width: 0; height: 0; overflow: hidden; }

.cedx-i {
  width: 1.125rem;
  height: 1.125rem;
  flex: none;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.cedx-i--sm { width: .875rem; height: .875rem; stroke-width: 1.8; }

.cedx-global-header {
  position: fixed;
  z-index: 9998;
  inset: 0 0 auto;
  height: var(--cedx-h);
  color: var(--cedx-ink);
  background: rgba(255,255,255,.9);
  border-bottom: 1px solid var(--cedx-line);
  font-family: Inter, Arial, sans-serif;
  -webkit-backdrop-filter: blur(20px) saturate(180%);
  backdrop-filter: blur(20px) saturate(180%);
  transition: background .24s, box-shadow .24s;
}
/* Two states: at rest, and opaque while a menu is down so the bar and the
   panel below it read as one sheet.

   There is deliberately no scroll-driven "lifted" variant. The page runs GSAP
   ScrollTrigger, which swallows `scroll` events before a listener sees them,
   and a CSS scroll timeline competes with this rule for `background` — the
   animation wins the cascade and the menu-open state stops applying. A header
   that is always legible beats one that is sometimes prettier. */
.cedx-global-header.is-menu-open {
  background: #fff;
  box-shadow: none;
}

.cedx-global-bar {
  display: flex;
  align-items: center;
  gap: clamp(1rem, 2.4vw, 2.25rem);
  width: min(100%, 1600px);
  height: 100%;
  margin: 0 auto;
  padding: 0 clamp(1.1rem, 3vw, 2.5rem);
}

.cedx-global-brand {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
  gap: .6rem;
  color: var(--cedx-ink);
  text-decoration: none;
}
.cedx-global-brand img { width: 1.75rem; height: 1.75rem; object-fit: contain; }
.cedx-global-brand strong {
  font: 660 1.0625rem/1 Inter, Arial, sans-serif;
  letter-spacing: -.034em;
  white-space: nowrap;
}
/* "CEDX" carries the weight, "Systems" qualifies it — one lockup, two ranks. */
.cedx-global-brand strong span {
  margin-left: .34em;
  color: var(--cedx-muted);
  font-weight: 420;
  letter-spacing: -.012em;
}

.cedx-global-links { display: flex; align-items: center; gap: .125rem; }
.cedx-nav__trigger {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: .3rem;
  height: 2.25rem;
  margin: 0;
  padding: 0 .75rem;
  color: var(--cedx-ink);
  background: none;
  border: 0;
  border-radius: .5rem;
  font: 500 .875rem/1 Inter, Arial, sans-serif;
  letter-spacing: -.009em;
  white-space: nowrap;
  cursor: pointer;
  transition: background .18s, color .18s;
}
.cedx-nav__trigger:hover,
.cedx-nav__trigger[aria-expanded="true"] { color: var(--cedx-blue); background: rgba(40,97,237,.07); }
.cedx-nav__chevron { width: .75rem; height: .75rem; stroke-width: 2; opacity: .45; transition: transform .22s, opacity .22s; }
.cedx-nav__trigger[aria-expanded="true"] .cedx-nav__chevron { opacity: 1; transform: rotate(180deg); }
.cedx-nav__trigger[aria-current]::after {
  content: "";
  position: absolute;
  inset: auto .75rem -.85rem;
  height: 2px;
  border-radius: 2px;
  background: var(--cedx-blue);
}

.cedx-global-actions { display: flex; align-items: center; gap: .25rem; margin-left: auto; }
.cedx-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .4rem;
  height: 2.25rem;
  padding: 0 .625rem;
  color: var(--cedx-ink);
  background: transparent;
  border: 0;
  border-radius: .5rem;
  font: 500 .8125rem/1 Inter, Arial, sans-serif;
  text-decoration: none;
  transition: background .18s, color .18s, box-shadow .18s, transform .18s;
}
.cedx-action--icon { width: 2.25rem; padding: 0; color: var(--cedx-muted); cursor: pointer; }
.cedx-action--icon:hover { color: var(--cedx-ink); background: var(--cedx-surface); }
.cedx-global-language { color: var(--cedx-muted); cursor: default; }
.cedx-action__rule { width: 1px; height: 1.25rem; margin: 0 .375rem; background: var(--cedx-line); }
.cedx-action--cta {
  padding: 0 .95rem;
  color: #fff;
  background: var(--cedx-blue);
  font-weight: 560;
  box-shadow: 0 1px 2px rgba(30,64,160,.24), inset 0 1px 0 rgba(255,255,255,.16);
}
.cedx-action--cta:hover {
  color: #fff;
  background: var(--cedx-blue-ink);
  transform: translateY(-1px);
  box-shadow: 0 .5rem 1rem -.4rem rgba(30,64,160,.5), inset 0 1px 0 rgba(255,255,255,.16);
}
.cedx-action--cta:active { transform: translateY(0); }
.cedx-global-menu { display: none; }
.cedx-global-menu__close { display: none; }
.cedx-global-header.is-drawer-open .cedx-global-menu__open { display: none; }
.cedx-global-header.is-drawer-open .cedx-global-menu__close { display: block; }

.cedx-global-header :focus-visible {
  outline: 2px solid var(--cedx-blue);
  outline-offset: 2px;
  border-radius: .4rem;
}

/* --- Flyout menus ---------------------------------------------------------
   cedx-header.js sets each panel's horizontal position with transform, so the
   drop-in animation rides the independent `translate` property instead. */
.cedx-flyouts { position: absolute; inset: 100% 0 auto; height: 0; }
.cedx-flyout {
  position: absolute;
  top: .5rem;
  left: 0;
  width: min(51rem, calc(100vw - 2rem));
  overflow: hidden;
  background: #fff;
  border: 1px solid var(--cedx-line);
  border-radius: .875rem;
  box-shadow: var(--cedx-pop);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  translate: 0 -.5rem;
  transition: opacity .18s ease, translate .26s cubic-bezier(.22,1,.36,1), visibility .18s;
}
.cedx-flyout.is-open { opacity: 1; visibility: visible; pointer-events: auto; translate: 0 0; }
/* Moving between two open menus is a swap, not a re-entrance. */
.cedx-flyout.is-swap { translate: 0 0; transition-duration: .12s; }

.cedx-flyout__inner { display: grid; grid-template-columns: minmax(0,1fr) 17.5rem; }
.cedx-flyout__main { padding: 1.4rem 1.4rem 1.15rem; }
.cedx-flyout__eyebrow {
  margin: 0;
  color: var(--cedx-faint);
  font: 600 .6875rem/1 Inter, Arial, sans-serif;
  letter-spacing: .11em;
  text-transform: uppercase;
}
.cedx-flyout__lead {
  margin: .5rem 0 1rem;
  color: var(--cedx-ink);
  font: 500 .9375rem/1.35 Inter, Arial, sans-serif;
  letter-spacing: -.015em;
}
.cedx-flyout__grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .125rem; }
.cedx-flyout__item {
  display: flex;
  gap: .75rem;
  padding: .65rem .7rem;
  color: inherit;
  border-radius: .625rem;
  text-decoration: none;
  transition: background .16s;
}
.cedx-flyout__item:hover { background: var(--cedx-surface); }
.cedx-flyout__icon {
  display: grid;
  place-items: center;
  flex: none;
  width: 2.125rem;
  height: 2.125rem;
  color: var(--cedx-blue);
  background: #fff;
  border: 1px solid var(--cedx-line);
  border-radius: .5rem;
  transition: border-color .18s, box-shadow .18s;
}
.cedx-flyout__item:hover .cedx-flyout__icon {
  border-color: rgba(40,97,237,.34);
  box-shadow: 0 .25rem .625rem -.25rem rgba(40,97,237,.45);
}
.cedx-flyout__icon--lg { width: 2.5rem; height: 2.5rem; border-radius: .625rem; }
.cedx-flyout__icon--lg .cedx-i { width: 1.25rem; height: 1.25rem; }
.cedx-flyout__body strong {
  display: block;
  color: var(--cedx-ink);
  font: 570 .875rem/1.3 Inter, Arial, sans-serif;
  letter-spacing: -.014em;
}
.cedx-flyout__body small {
  display: block;
  margin-top: .2rem;
  color: var(--cedx-muted);
  font: 420 .78125rem/1.45 Inter, Arial, sans-serif;
}

/* --- Featured card ---------------------------------------------------------
   A photograph carrying the panel's closing thought, with the type sitting on
   a bottom-up scrim. The fade does two jobs: it holds contrast for white text
   over an unpredictable frame, and it pulls four different photographs into one
   house treatment so the menus read as a set. */
.cedx-flyout__aside { padding: 0; border-left: 1px solid var(--cedx-line-soft); }
.cedx-feature {
  position: relative;
  display: flex;
  align-items: flex-end;
  height: 100%;
  min-height: 15rem;
  overflow: hidden;
  color: #fff;
  text-decoration: none;
  isolation: isolate;
}
.cedx-feature__img {
  position: absolute;
  inset: 0;
  z-index: -2;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(.72) contrast(1.05);
  transition: transform .6s cubic-bezier(.22,1,.36,1);
}
.cedx-feature:hover .cedx-feature__img { transform: scale(1.045); }
.cedx-feature__scrim {
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    linear-gradient(180deg,rgba(10,16,34,.16) 0%,rgba(10,16,34,.62) 46%,rgba(10,16,34,.93) 100%),
    linear-gradient(120deg,rgba(255,92,53,.2) 0%,transparent 58%);
  transition: opacity .3s;
}
.cedx-feature:hover .cedx-feature__scrim { opacity: .92; }
.cedx-feature__body { position: relative; padding: 1.3rem 1.3rem 1.35rem; }
.cedx-feature__eyebrow {
  display: block;
  color: #ffb59c;
  font: 700 .625rem/1 Inter, Arial, sans-serif;
  letter-spacing: .13em;
  text-transform: uppercase;
}
.cedx-feature strong {
  display: block;
  margin: .55rem 0 .35rem;
  font: 650 1.0625rem/1.25 Inter, Arial, sans-serif;
  letter-spacing: -.028em;
  text-shadow: 0 1px 16px rgba(6,11,26,.5);
}
.cedx-feature small {
  display: block;
  color: #cfd8ea;
  font: 420 .78125rem/1.5 Inter, Arial, sans-serif;
}
.cedx-feature .cedx-flyout__more { margin-top: .8rem; color: #ff9c7d; }
.cedx-feature:hover .cedx-flyout__more .cedx-i { transform: translateX(.2rem); }
.cedx-flyout__more {
  display: inline-flex;
  align-items: center;
  gap: .3rem;
  margin-top: .85rem;
  color: var(--cedx-blue);
  font: 600 .78125rem/1 Inter, Arial, sans-serif;
}
.cedx-flyout__more .cedx-i { transition: transform .2s; }

.cedx-flyout__foot {
  display: flex;
  align-items: center;
  gap: 1.25rem;
  padding: .75rem 1.4rem;
  background: #fbfcfe;
  border-top: 1px solid var(--cedx-line-soft);
}
.cedx-flyout__foot a {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  color: var(--cedx-muted);
  font: 500 .8125rem/1 Inter, Arial, sans-serif;
  text-decoration: none;
  transition: color .16s;
}
.cedx-flyout__foot a:hover { color: var(--cedx-blue); }
.cedx-flyout__foot-cta { margin-left: auto; color: var(--cedx-blue); font-weight: 600; }

/* --- Products mega panel ----------------------------------------------------
   Full-bleed, anchored under the bar. Plain grouped links on the left, one big
   photograph on the right that swaps as the pointer moves down them. No icon
   per row and no two-line blurb: at thirteen rows the icons became noise and
   the descriptions became a wall. */
.cedx-mega {
  position: absolute;
  inset: var(--cedx-h) 0 auto;
  background: #fff;
  border-top: 1px solid var(--cedx-line);
  box-shadow: 0 1.75rem 4rem -1rem rgba(13,24,56,.22);
  opacity: 0;
  visibility: hidden;
  transform: translateY(-.5rem);
  transition: opacity .2s, transform .28s cubic-bezier(.22,1,.36,1), visibility .2s;
}
.cedx-mega.is-open { opacity: 1; visibility: visible; transform: none; }
.cedx-mega__in {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0,1.05fr) minmax(0,.95fr);
  gap: clamp(1.5rem,4vw,4rem);
  width: min(100%, 1600px);
  margin: 0 auto;
  padding: clamp(1.75rem,3vw,2.75rem) clamp(1.1rem,3vw,2.5rem) clamp(1.5rem,2.5vw,2.25rem);
}
.cedx-mega__side { display: flex; flex-direction: column; min-width: 0; }

.cedx-mega__search {
  display: flex;
  align-items: center;
  gap: .6rem;
  height: 2.75rem;
  padding: 0 .85rem;
  color: var(--cedx-faint);
  background: var(--cedx-surface);
  border: 1px solid transparent;
  border-radius: .6rem;
  transition: border-color .16s, background .16s, box-shadow .16s;
}
.cedx-mega__search:focus-within {
  background: #fff;
  border-color: var(--cedx-blue);
  box-shadow: 0 0 0 3px rgba(40,97,237,.12);
}
.cedx-mega__search input {
  width: 100%;
  padding: 0;
  color: var(--cedx-ink);
  background: transparent;
  border: 0;
  outline: none;
  font: 450 .90625rem/1 Inter, Arial, sans-serif;
}

.cedx-mega__cols {
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: clamp(1rem,2.5vw,2.25rem);
  margin-top: clamp(1.5rem,3vw,2.25rem);
}
.cedx-mega__label {
  margin: 0 0 .85rem;
  color: var(--cedx-faint);
  font: 600 .6875rem/1 Inter, Arial, sans-serif;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.cedx-mega__col a {
  display: flex;
  align-items: baseline;
  gap: .5rem;
  padding: .42rem 0;
  color: var(--cedx-ink);
  font: 500 1rem/1.35 Inter, Arial, sans-serif;
  letter-spacing: -.017em;
  text-decoration: none;
  transition: color .16s;
}
.cedx-mega__col a small {
  color: var(--cedx-faint);
  font: 500 .75rem/1 ui-monospace, SFMono-Regular, Menlo, monospace;
  font-variant-numeric: tabular-nums;
}
.cedx-mega__col a:hover,
.cedx-mega__col a.is-active { color: var(--cedx-blue); }
.cedx-mega__col a.is-active small { color: var(--cedx-blue); }

/* Search results replace the columns in place. */
.cedx-mega__results { margin-top: clamp(1.5rem,3vw,2.25rem); overflow: auto; max-height: 22rem; }
.cedx-mega__results[hidden] { display: none; }
.cedx-mega__results a {
  display: flex;
  align-items: baseline;
  gap: .6rem;
  padding: .5rem .6rem;
  border-radius: .45rem;
  color: var(--cedx-ink);
  text-decoration: none;
}
.cedx-mega__results a:hover,
.cedx-mega__results a.is-cursor { background: var(--cedx-surface); }
.cedx-mega__results strong { font: 550 .9375rem/1.3 Inter, Arial, sans-serif; letter-spacing: -.015em; }
.cedx-mega__results small { color: var(--cedx-muted); font: 420 .8125rem/1.4 Inter, Arial, sans-serif; }
.cedx-mega__empty { padding: 1.5rem .6rem; color: var(--cedx-muted); font-size: .875rem; }

.cedx-mega__foot {
  display: flex;
  flex-wrap: wrap;
  gap: 1.5rem;
  margin-top: auto;
  padding-top: clamp(1.25rem,2.5vw,2rem);
}
.cedx-mega__foot a {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  color: var(--cedx-blue);
  font: 600 .84375rem/1 Inter, Arial, sans-serif;
  text-decoration: none;
}
.cedx-mega__foot a:hover .cedx-i { transform: translateX(.2rem); }
.cedx-mega__foot .cedx-i { transition: transform .2s; }

/* The stage. One frame visible, the rest stacked underneath at zero opacity. */
.cedx-mega__stage {
  position: relative;
  overflow: hidden;
  min-height: clamp(17rem, 30vw, 24rem);
  border-radius: 1rem;
  background: var(--cedx-navy, #0d1730);
  isolation: isolate;
}
.cedx-stage__item { position: absolute; inset: 0; margin: 0; opacity: 0; transition: opacity .36s ease; }
.cedx-stage__item.on { opacity: 1; }
.cedx-stage__item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(.74) contrast(1.04);
  transform: scale(1.01);
  transition: transform .7s cubic-bezier(.22,1,.36,1);
}
.cedx-stage__item.on img { transform: scale(1.045); }
.cedx-stage__item figcaption {
  position: absolute;
  inset: auto 0 0;
  padding: 1.5rem 1.6rem 1.5rem;
  color: #fff;
  text-align: left;
  background: linear-gradient(180deg,transparent 0%,rgba(9,15,34,.72) 46%,rgba(9,15,34,.95) 100%);
}
.cedx-stage__item strong {
  display: block;
  font: 650 1.25rem/1.2 Inter, Arial, sans-serif;
  letter-spacing: -.03em;
  text-shadow: 0 1px 18px rgba(6,11,26,.55);
}
.cedx-stage__item figcaption small {
  display: block;
  margin-top: .4rem;
  max-width: 38ch;
  color: #c8d2e6;
  font: 420 .84375rem/1.5 Inter, Arial, sans-serif;
}
.cedx-stage__item figcaption span {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  margin-top: .8rem;
  color: #ff9c7d;
  font: 600 .78125rem/1 Inter, Arial, sans-serif;
}

.cedx-mega__close {
  position: absolute;
  top: 1rem;
  right: 1rem;
  display: grid;
  place-items: center;
  width: 2rem;
  height: 2rem;
  color: var(--cedx-muted);
  background: transparent;
  border: 0;
  border-radius: .5rem;
  cursor: pointer;
}
.cedx-mega__close:hover { color: var(--cedx-ink); background: var(--cedx-surface); }

.cedx-directory-scrim { position: fixed; z-index: 9997; inset: var(--cedx-h) 0 0; visibility: hidden; background: rgba(12,20,40,.28); opacity: 0; transition: opacity .25s, visibility .25s; }
.cedx-directory-scrim.is-open { visibility: visible; opacity: 1; }

/* --- Mobile drawer --------------------------------------------------------
   <details>/<summary> is the accordion. No script owns open state here. */
.cedx-mobile-menu { display: none; }
.cedx-drawer__group summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: .95rem .25rem;
  color: var(--cedx-ink);
  border-bottom: 1px solid var(--cedx-line-soft);
  font: 570 1rem/1 Inter, Arial, sans-serif;
  letter-spacing: -.018em;
  list-style: none;
  cursor: pointer;
}
.cedx-drawer__group summary::-webkit-details-marker { display: none; }
.cedx-drawer__chevron { width: .875rem; height: .875rem; color: var(--cedx-faint); stroke-width: 2; transition: transform .2s; }
.cedx-drawer__group[open] summary { color: var(--cedx-blue); }
.cedx-drawer__group[open] .cedx-drawer__chevron { color: var(--cedx-blue); transform: rotate(180deg); }
.cedx-drawer__links { display: grid; padding: .35rem 0 .75rem; }
.cedx-drawer__links a { padding: .55rem .25rem; color: var(--cedx-muted); font: 450 .90625rem/1.3 Inter, Arial, sans-serif; text-decoration: none; }
.cedx-drawer__links a:hover { color: var(--cedx-blue); }

/* The bar needs ~1024px to hold five triggers plus the actions without the
   nav sliding under them; below that it is the drawer's job. */
@media (max-width: 1023px) {
  .cedx-global-links,
  .cedx-global-language,
  .cedx-action__rule,
  .cedx-global-actions > .cedx-action--icon:not(.cedx-global-menu) { display: none; }
  .cedx-global-menu { display: inline-flex; }
  .cedx-flyouts,
  .cedx-mega,
  .cedx-directory-scrim { display: none; }
  /* Absolute, not fixed: the header carries backdrop-filter, which makes it
     the containing block for fixed descendants — `inset: var(--cedx-h) 0 0`
     resolved against a 3.5rem-tall header and collapsed the drawer to a
     sliver. The header is itself fixed, so absolute against it is viewport
     anchored anyway. */
  .cedx-mobile-menu {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    height: calc(100svh - var(--cedx-h));
    display: flex;
    flex-direction: column;
    background: #fff;
    border-top: 1px solid var(--cedx-line);
    opacity: 0;
    translate: 0 -.5rem;
    transition: opacity .2s, translate .24s cubic-bezier(.22,1,.36,1);
  }
  .cedx-mobile-menu.is-open { opacity: 1; translate: 0 0; }
  .cedx-drawer__scroll { flex: 1; overflow: auto; padding: .5rem clamp(1.1rem,4vw,2rem) 1.5rem; -webkit-overflow-scrolling: touch; }
  .cedx-drawer__foot {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: .9rem clamp(1.1rem,4vw,2rem);
    padding-bottom: max(.9rem, env(safe-area-inset-bottom));
    background: #fbfcfe;
    border-top: 1px solid var(--cedx-line);
  }
  .cedx-drawer__cta {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    height: 2.5rem;
    padding: 0 1.1rem;
    color: #fff;
    background: var(--cedx-blue);
    border-radius: .5rem;
    font: 600 .875rem/1 Inter, Arial, sans-serif;
    text-decoration: none;
  }
  .cedx-drawer__quiet { margin-left: auto; color: var(--cedx-muted); font: 500 .875rem/1 Inter, Arial, sans-serif; text-decoration: none; }
}

@media (max-width: 560px) {
  :root { --cedx-h: 3.5rem; }
  /* "Systems" stays. CEDX runs two entities and the wordmark is what tells a
     visitor which one they are on — shrink it, never drop it. */
  .cedx-global-brand strong { font-size: .9375rem; }
  .cedx-global-brand strong span { margin-left: .28em; }
  .cedx-global-actions > .cedx-action--cta { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .cedx-global-header *,
  .cedx-flyout,
  .cedx-directory,
  .cedx-mobile-menu { transition-duration: .01ms !important; }
  .cedx-directory-card:hover { transform: none; }
}

.mega-nav__bar-logo,
.footer_logo-link {
  display: inline-flex !important;
  align-items: center;
  gap: .55rem;
  width: auto !important;
  text-decoration: none;
}

.mega-nav__bar-logo .mega-nav__svg,
.footer_logo-link .footer_logo-svg {
  display: block !important;
  width: 2.7rem !important;
  height: 1.55rem !important;
  flex: 0 0 2.7rem;
  object-fit: contain;
  border-radius: 0;
  box-shadow: none;
}

.mega-nav__bar-logo::before,
.footer_logo-link::before {
  content: none;
  display: none;
}

.mega-nav__bar-logo::after,
.footer_logo-link::after {
  content: "CEDX SYSTEMS";
  color: currentColor;
  font: 720 1.18rem/1 Inter, Arial, sans-serif;
  letter-spacing: -.045em;
}

.mega-nav__bar-logo::after { color: #171932; }
.footer_logo-link .footer_logo-svg {
  box-sizing: content-box;
  padding: .24rem .32rem;
  border-radius: .45rem;
  background: #fff;
}

.footer_logo-link::after { color: #fff; }

.home-tab_image-wrap { position: relative; }
.home-tab_image-wrap::after {
  content: none;
  display: none;
}

.home-tab_image {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: top center !important;
}

.hero_marquee_img {
  object-fit: contain !important;
  border-radius: .55rem;
}

/* A pure-white T9 mark in the blue flow badge. */
.hero_icon-wrap {
  overflow: visible !important;
  background: transparent !important;
  border: 0 !important;
  outline: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.hero_icon-inner {
  overflow: hidden !important;
  box-sizing: border-box;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: linear-gradient(145deg, #4f7ff7 0%, #2459e8 100%) !important;
  border: 2px solid rgba(255, 255, 255, .3) !important;
  outline: 1px solid rgba(38, 87, 224, .18) !important;
  border-radius: 1.45rem !important;
  box-shadow: 0 1rem 2.2rem rgba(35, 88, 232, .3), inset 0 1px 0 rgba(255, 255, 255, .34) !important;
}

.hero_icon-wrap::before,
.hero_icon-wrap::after,
.hero_icon-inner::before,
.hero_icon-inner::after {
  content: none !important;
  display: none !important;
}

.hero_icon-svg {
  display: block !important;
  /* Was 112% — overflowed the blue badge; size down so mark fits with padding */
  width: 68% !important;
  max-width: 68% !important;
  height: 68% !important;
  flex: 0 0 68% !important;
  margin: auto !important;
  object-fit: contain !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  filter: brightness(0) invert(1) drop-shadow(0 .1rem .14rem rgba(5, 28, 92, .2));
}

.extention_icon {
  object-fit: contain !important;
  border-radius: 1rem;
  filter: drop-shadow(0 18px 30px rgba(34, 90, 234, .24));
}

#services .blog-card_img-wrap {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  background: #eef3fb;
}

#services .blog-card_img-wrap::before {
  content: none;
  display: none;
}

#services .blog-card_img-wrap::after {
  content: none;
  display: none;
}

#services .blog-card_img {
  opacity: 1 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: top center !important;
}

.grid-slider_item:nth-child(6) .card-image-slot {
  position: relative;
}

.grid-slider_item:nth-child(6) .card-image-slot::after {
  content: "";
  position: absolute;
  z-index: 4;
  left: 50%;
  top: 49%;
  width: 2.7rem;
  height: 1.8rem;
  transform: translate(-50%, -50%);
  border-radius: .55rem;
  background: #fff url("cedx-assets/cedxsystems-logo.png") center / 88% auto no-repeat;
  box-shadow: 0 6px 14px rgba(20,22,48,.18);
}

/* Showcase captures. The slot was 1.46:1 against a 1.60:1 screenshot, so
   `cover` shaved ~5% off each side and cut the left nav rail and the right
   panel out of both cards. Matching the box to the capture shows the whole
   screen with no crop and no letterbox. */
.slider_item .card-image-slot .image-wrap {
  aspect-ratio: 16 / 10;
  height: auto;
  overflow: hidden;
  border-radius: .75rem .75rem 0 0;
  box-shadow: 0 -1px 0 rgba(15,23,42,.06), 0 1.25rem 2.5rem -1.5rem rgba(15,23,42,.45);
}
.slider_item .card-image-slot .image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top center;
}

.footer_social-link-list {
  display: none !important;
}

@media (max-width: 767px) {
  .mega-nav__bar-logo::after { font-size: 1rem; }
  .home-tab_image { min-height: 15rem; }
}


/* Real product logos in hero marquee / CTA / directory */
img.hero_marquee_img,
img.cta_icon-img,
img.home-tab-link-image,
.cedx-directory-card__top img {
  object-fit: contain !important;
  border-radius: 0.65rem;
  background: var(--cedx-tile-bg, #fff);
}
.hero_marquee_img-wrap {
  overflow: hidden;
  border-radius: 0.75rem;
  background: #fff;
}


/* Home product strip autoplay — make active logo clearly move */
.home-tab-list .home-tab-item {
  transition: width .45s cubic-bezier(.34,1.56,.64,1), transform .45s cubic-bezier(.34,1.56,.64,1) !important;
}
.home-tab-list .home-tab-item.active {
  width: 6.5rem !important;
  transform: translateY(-6px) scale(1.08);
  z-index: 3;
}
.home-tab-list .home-tab-item.sibling-close {
  width: 4.75rem !important;
}
.home-tab-list .home-tab-item.sibling-far {
  width: 3.75rem !important;
  opacity: .85;
}
.home-tab-list .home-tab-item.active .home-tab-item__tooltip {
  opacity: 1 !important;
  transform: translateY(-120%) !important;
}
.home-tab-list .home-tab-link-image {
  transition: transform .45s cubic-bezier(.34,1.56,.64,1), box-shadow .45s ease !important;
}
.home-tab-list .home-tab-item.active .home-tab-link-image {
  box-shadow: 0 10px 28px rgba(15,23,42,.18);
}
@keyframes cedx-tab-pulse {
  0% { transform: translateY(-6px) scale(1.02); }
  40% { transform: translateY(-10px) scale(1.14); }
  100% { transform: translateY(-6px) scale(1.08); }
}
.home-tab-list .home-tab-item.cedx-tab-pulse.active {
  animation: cedx-tab-pulse .55s cubic-bezier(.34,1.56,.64,1);
}

/* =========================================================================
 * CEDX Systems institutional footer
 * Template: cedx.org Footer layout · Brand: Systems navy + orange
 * ========================================================================= */
/* Host product pages ship bare `nav { sticky + white glass }`. Footer columns
   use <nav> too — without a hard reset they paint frosted boxes on the navy shell.
   !important wins over host inline stylesheets regardless of cascade order. */
.sys-footer :where(ul, ol, li, section, article, header, aside, div, p,
                   h1, h2, h3, h4, dl, dt, dd, span, a, form, table, figure) {
  background: transparent;
}

.sys-footer nav,
.sys-footer .sys-footer__nav,
.sys-footer details,
.sys-footer summary {
  position: static !important;
  top: auto !important;
  z-index: auto !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  transform: none !important;
  overflow: visible !important;
}

.sys-footer .sys-footer__acc {
  border-bottom: 1px solid var(--sf-line) !important;
  background: transparent !important;
}
.sys-footer .sys-footer__acc summary {
  padding: 0.95rem 0 !important;
  list-style: none !important;
  cursor: pointer;
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  font-size: 0.95rem;
  font-weight: 600;
  color: #fff !important;
  background: transparent !important;
}

/* Desktop columns only ≥900px; never show accordion + grid together */
@media (min-width: 900px) {
  .sys-footer .sys-footer__map--mobile { display: none !important; }
  .sys-footer .sys-footer__map--desktop { display: grid !important; }
}
@media (max-width: 899.98px) {
  .sys-footer .sys-footer__map--desktop { display: none !important; }
  .sys-footer .sys-footer__map--mobile { display: block !important; }
}

.sys-footer {
  --sf-navy: #0c1428;
  --sf-navy-2: #121c3e;
  --sf-line: rgba(255, 255, 255, 0.1);
  --sf-kicker: rgba(255, 255, 255, 0.42);
  --sf-soft: rgba(255, 255, 255, 0.62);
  --sf-text: rgba(255, 255, 255, 0.88);
  --sf-orange: #e85d04;
  --sf-orange-glow: rgba(232, 93, 4, 0.22);
  background: var(--sf-navy);
  color: var(--sf-text);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  -webkit-font-smoothing: antialiased;
  isolation: isolate;
}
.sys-footer a {
  color: var(--sf-soft);
  text-decoration: none;
  transition: color .18s ease;
}
.sys-footer a:hover,
.sys-footer a:focus-visible {
  color: #fff;
}
.sys-footer a:focus-visible {
  outline: 2px solid rgba(255,255,255,.55);
  outline-offset: 3px;
}
.sys-footer__shell {
  max-width: 72rem;
  margin: 0 auto;
  padding: 0 clamp(1.1rem, 3vw, 1.75rem);
}
.sys-footer__sr {
  position: absolute;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); border: 0;
}
.sys-footer__band {
  border-bottom: 1px solid var(--sf-line);
  padding: 2.75rem 0;
}
.sys-footer__band--slim { padding: 1.15rem 0; }
.sys-footer__band--disclose { padding: 1.75rem 0; }
.sys-footer__band--contact { padding: 2.5rem 0 2.25rem; border-bottom: 0; }
.sys-footer__band--news {
  padding: 3rem 0 2.75rem;
  background:
    radial-gradient(48% 90% at 8% 0%, rgba(232, 93, 4, 0.12), transparent 60%),
    radial-gradient(40% 80% at 92% 20%, rgba(79, 127, 247, 0.1), transparent 55%);
}

/* Newsletter */
.sys-footer__news-grid {
  display: grid;
  gap: 1.5rem;
  align-items: end;
}
@media (min-width: 860px) {
  .sys-footer__news-grid {
    grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.95fr);
    gap: 3rem;
  }
}
.sys-footer__kicker {
  margin: 0 0 0.55rem;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--sf-kicker);
}
.sys-footer__h2 {
  margin: 0;
  max-width: 28rem;
  font-family: "Plus Jakarta Sans", Inter, ui-sans-serif, system-ui, sans-serif;
  font-size: clamp(1.45rem, 2.4vw, 1.9rem);
  font-weight: 600;
  line-height: 1.22;
  letter-spacing: -0.025em;
  color: #fff;
}
.sys-footer__lede {
  margin: 0.65rem 0 0;
  max-width: 26rem;
  font-size: 0.9rem;
  line-height: 1.55;
  color: rgba(255,255,255,0.52);
}
.sys-footer__form {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
  width: 100%;
}
@media (min-width: 520px) {
  .sys-footer__form { flex-direction: row; align-items: stretch; }
}
.sys-footer__field {
  flex: 1;
  min-width: 0;
  border: 1px solid rgba(255,255,255,0.18);
  background: rgba(255,255,255,0.07);
  color: #fff;
  padding: 0.78rem 1rem;
  font-size: 0.9rem;
  border-radius: 2px;
  outline: none;
  transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
}
.sys-footer__field::placeholder { color: rgba(255,255,255,0.38); }
.sys-footer__field:focus {
  border-color: color-mix(in srgb, var(--sf-orange) 55%, white);
  background: rgba(255,255,255,0.1);
  box-shadow: 0 0 0 3px var(--sf-orange-glow);
}
.sys-footer__submit {
  border: 0;
  background: #fff;
  color: var(--sf-navy-2);
  font-size: 0.9rem;
  font-weight: 600;
  padding: 0.78rem 1.25rem;
  border-radius: 2px;
  cursor: pointer;
  white-space: nowrap;
  transition: background .18s ease, color .18s ease, transform .18s ease;
}
.sys-footer__submit:hover {
  background: var(--sf-orange);
  color: #fff;
}
.sys-footer__submit:active { transform: translateY(1px); }

/* Site map */
.sys-footer__map--desktop {
  display: none;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 2rem 1.75rem;
}
@media (min-width: 900px) {
  .sys-footer__map--desktop { display: grid; }
  .sys-footer__map--mobile { display: none; }
}
.sys-footer__nav-title {
  margin: 0 0 1.1rem;
  padding-bottom: 0.55rem;
  border-bottom: 1px solid var(--sf-line);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--sf-kicker);
}
.sys-footer__nav-title a { color: inherit; }
.sys-footer__nav-title a:hover { color: #fff; }
.sys-footer__group + .sys-footer__group { margin-top: 1.35rem; }
.sys-footer__group-h {
  margin: 0 0 0.55rem;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.28);
}
.sys-footer__group ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.4rem;
}
.sys-footer__group a {
  display: inline-block;
  font-size: 13px;
  line-height: 1.35;
  color: var(--sf-soft);
}
.sys-footer__group a:hover { color: #fff; }
.sys-footer__emph {
  color: #fff !important;
  font-weight: 600;
}
.sys-footer__emph:hover { color: var(--sf-orange) !important; }

/* Mobile accordion */
.sys-footer__map--mobile { display: block; }
.sys-footer__acc {
  border-bottom: 1px solid var(--sf-line);
}
.sys-footer__acc summary {
  list-style: none;
  cursor: pointer;
  padding: 0.95rem 0;
  font-size: 0.95rem;
  font-weight: 600;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.sys-footer__acc summary::-webkit-details-marker { display: none; }
.sys-footer__acc summary::after {
  content: "+";
  font-weight: 400;
  color: rgba(255,255,255,0.45);
  font-size: 1.1rem;
}
.sys-footer__acc[open] summary::after { content: "−"; }
.sys-footer__acc ul {
  list-style: none;
  margin: 0;
  padding: 0 0 1rem;
  display: grid;
  gap: 0.45rem;
}
.sys-footer__acc a { font-size: 13px; color: var(--sf-soft); }

/* Inline rows */
.sys-footer__inline {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem 0.15rem;
}
.sys-footer__inline > li {
  display: inline-flex;
  align-items: center;
  gap: 0.7rem;
}
.sys-footer__inline:not(.sys-footer__inline--plain) > li:not(:last-child)::after {
  content: "·";
  color: rgba(255,255,255,0.22);
  margin-right: 0.15rem;
}
.sys-footer__inline a,
.sys-footer__inline span {
  font-size: 0.875rem;
  color: var(--sf-soft);
}
.sys-footer__inline--sm a,
.sys-footer__inline--sm span {
  font-size: 0.75rem;
  color: rgba(255,255,255,0.48);
}
.sys-footer__inline--sm a:hover { color: rgba(255,255,255,0.85); }
.sys-footer__inline--plain > li::after { content: none !important; }
.sys-footer__inline--plain { gap: 0.85rem 1.35rem; }

/* Disclosure */
.sys-footer__band--disclose p {
  margin: 0 auto;
  max-width: 48rem;
  font-size: 12px;
  line-height: 1.65;
  color: rgba(255,255,255,0.42);
  text-align: left;
}
@media (min-width: 900px) {
  .sys-footer__band--disclose p { text-align: center; }
}
.sys-footer__band--disclose strong {
  color: rgba(255,255,255,0.62);
  font-weight: 600;
}
.sys-footer__band--disclose a {
  color: rgba(255,255,255,0.58);
  text-decoration: underline;
  text-underline-offset: 2px;
}
.sys-footer__band--disclose a:hover { color: #fff; }

/* Contact */
.sys-footer__band--contact {
  display: grid;
  gap: 2rem 1.75rem;
  border-top: 1px solid var(--sf-line);
}
@media (min-width: 760px) {
  .sys-footer__band--contact {
    grid-template-columns: 1.35fr 1fr 1.15fr;
  }
  .sys-footer__follow { grid-column: 1 / -1; }
}
@media (min-width: 1100px) {
  .sys-footer__band--contact {
    grid-template-columns: 1.4fr 0.95fr 1.15fr 0.8fr;
  }
  .sys-footer__follow { grid-column: auto; }
}
.sys-footer__mark {
  display: inline-flex;
  align-items: center;
  gap: 0.8rem;
  color: #fff !important;
  margin-bottom: 0.9rem;
}
.sys-footer__mark-tile {
  display: grid;
  place-items: center;
  width: 2.65rem;
  height: 2.65rem;
  border-radius: 0.7rem;
  background: #fff;
  box-shadow: 0 8px 22px rgba(0,0,0,0.22);
  overflow: hidden;
}
.sys-footer__mark-tile img {
  width: 1.7rem;
  height: 1.7rem;
  object-fit: contain;
}
.sys-footer__mark-text {
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
}
.sys-footer__mark-text strong {
  font-size: 0.98rem;
  letter-spacing: -0.015em;
  font-weight: 650;
}
.sys-footer__mark-text span {
  font-size: 11px;
  color: var(--sf-kicker);
  font-weight: 500;
}
.sys-footer__brand-block > p {
  margin: 0;
  max-width: 22rem;
  font-size: 0.875rem;
  line-height: 1.55;
  color: rgba(255,255,255,0.52);
}
.sys-footer__meta {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.4rem;
}
.sys-footer__meta li {
  font-size: 13px;
  line-height: 1.45;
  color: var(--sf-soft);
}
.sys-footer__meta span {
  display: inline-block;
  min-width: 5.5rem;
  color: rgba(255,255,255,0.38);
  margin-right: 0.35rem;
}
.sys-footer__meta a { color: var(--sf-soft); }
.sys-footer__meta a:hover { color: #fff; }

/* Bottom */
.sys-footer__bottom {
  display: flex;
  flex-direction: column;
  gap: 0.9rem;
  border-top: 1px solid var(--sf-line);
  padding: 1.25rem 0 1.85rem;
  font-size: 12px;
  color: rgba(255,255,255,0.38);
}
@media (min-width: 760px) {
  .sys-footer__bottom {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
  }
}
.sys-footer__bottom p { margin: 0; }
.sys-footer__lang {
  letter-spacing: 0.06em;
  font-weight: 600;
  color: rgba(255,255,255,0.5);
}

/* Hide legacy / product footers once institutional Systems footer is present */
body:has(.sys-footer) .footer_component,
body:has(.sys-footer) .footer_top-wrap,
body:has([data-systems-footer]) footer:not([data-systems-footer]) {
  display: none !important;
}


/* corp mega dropdowns */
.cedx-global-links .cedx-dd { position: relative; height: 100%; display: flex; align-items: center; }
.cedx-global-links .cedx-dd-trigger { display: inline-flex; align-items: center; gap: .48rem; }
.cedx-dd-panel {
  display: none;
  position: absolute;
  left: 0; top: calc(100% - 4px);
  min-width: 420px;
  padding: 1.1rem 1.15rem .9rem;
  background: #fff;
  border: 1px solid var(--cedx-line, #e2e7f0);
  border-radius: 1rem;
  box-shadow: 0 24px 60px -20px rgba(15,23,42,.28);
  grid-template-columns: 1fr 1fr;
  gap: .35rem 1.25rem;
  z-index: 10000;
}
.cedx-dd-panel--wide { min-width: 640px; grid-template-columns: 1fr 1fr 1fr; }
.cedx-dd:hover .cedx-dd-panel,
.cedx-dd:focus-within .cedx-dd-panel { display: grid; }
.cedx-dd:hover .cedx-dd-trigger,
.cedx-dd:focus-within .cedx-dd-trigger { color: var(--cedx-blue, #2861ed); background: #f1f5ff; }
.cedx-dd-col h4 {
  grid-column: 1 / -1;
  margin: .35rem 0 .4rem;
  font: 700 .68rem/1 Inter, Arial, sans-serif;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: #83899a;
}
.cedx-dd-col { display: contents; }
.cedx-dd-col a {
  display: block !important;
  height: auto !important;
  padding: .55rem .65rem !important;
  border-radius: .65rem !important;
  text-decoration: none;
  color: var(--cedx-ink, #15182e) !important;
  background: transparent !important;
}
.cedx-dd-col a:hover { background: #f1f5ff !important; color: var(--cedx-blue, #2861ed) !important; }
.cedx-dd-col a strong { display: block; font: 600 .9rem/1.25 Inter, Arial, sans-serif; }
.cedx-dd-col a span { display: block; margin-top: .15rem; font: 400 .78rem/1.3 Inter, Arial, sans-serif; color: #83899a; }
.cedx-dd-foot {
  grid-column: 1 / -1;
  display: flex;
  justify-content: flex-end;
  margin-top: .55rem;
  padding-top: .7rem;
  border-top: 1px solid var(--cedx-line, #e2e7f0);
}
.cedx-dd-cta {
  display: inline-flex !important;
  height: 2.35rem !important;
  padding: 0 1rem !important;
  border-radius: 999px !important;
  background: var(--cedx-blue, #2861ed) !important;
  color: #fff !important;
  font: 600 .85rem/1 Inter, Arial, sans-serif !important;
  text-decoration: none !important;
}
.cedx-dd-cta:hover { filter: brightness(1.06); }
@media (max-width: 960px) {
  .cedx-dd-panel { display: none !important; }
}


/* =========================================================================
 * Homepage billboard panels
 * The artwork is the surface, not a picture in a box under a paragraph. Type
 * sits on it, the message is four lines, and there is no body copy to read —
 * the whole panel has to land in about three seconds.
 * ========================================================================= */
.cedx-bb-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.25rem;
}
.cedx-bb {
  position: relative;
  display: block;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  border-radius: 1.25rem;
  background: #070c1c;
  text-decoration: none;
  isolation: isolate;
  transition: transform .5s cubic-bezier(.22,1,.36,1), box-shadow .5s;
  box-shadow: 0 1.5rem 3rem -1.5rem rgba(7,12,28,.55);
}
.cedx-bb:hover {
  transform: translateY(-4px);
  box-shadow: 0 2.5rem 4.5rem -2rem rgba(7,12,28,.7);
}
.cedx-bb .cedx-art {
  position: absolute;
  inset: 0;
  z-index: -2;
  width: 100%;
  height: 100%;
  transition: transform .7s cubic-bezier(.22,1,.36,1);
}
.cedx-bb:hover .cedx-art { transform: scale(1.05); }
/* Bottom-weighted so the type never fights the artwork's focal point. */
.cedx-bb__scrim {
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(180deg,
    rgba(7,12,28,.05) 0%, rgba(7,12,28,.25) 40%,
    rgba(7,12,28,.82) 76%, rgba(7,12,28,.96) 100%);
}
.cedx-bb__body {
  position: absolute;
  inset: auto 0 0;
  display: grid;
  padding: clamp(1.5rem, 3vw, 2.75rem);
  color: #fff;
}
.cedx-bb__eyebrow {
  color: #b6a8ff;
  font: 700 .6875rem/1 Inter, Arial, sans-serif;
  letter-spacing: .16em;
  text-transform: uppercase;
}
/* Billboard type: as large as the panel will carry. */
.cedx-bb__head {
  margin-top: .7rem;
  font: 650 clamp(1.75rem, 3.4vw, 3rem)/1.04 Inter, Arial, sans-serif;
  letter-spacing: -.045em;
  text-wrap: balance;
  text-shadow: 0 2px 30px rgba(7,12,28,.6);
}
.cedx-bb__line {
  margin-top: .75rem;
  max-width: 34ch;
  color: #c3cce4;
  font: 450 .9375rem/1.5 Inter, Arial, sans-serif;
}
.cedx-bb__cta {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  margin-top: 1.25rem;
  color: #fff;
  font: 600 .875rem/1 Inter, Arial, sans-serif;
}
.cedx-bb__cta svg { width: 1rem; height: 1rem; transition: transform .25s; }
.cedx-bb:hover .cedx-bb__cta svg { transform: translateX(.25rem); }

@media (max-width: 860px) {
  .cedx-bb-grid { grid-template-columns: 1fr; }
  .cedx-bb { aspect-ratio: 3 / 2; }
}
@media (prefers-reduced-motion: reduce) {
  .cedx-bb, .cedx-bb .cedx-art, .cedx-bb__cta svg { transition: none; }
  .cedx-bb:hover { transform: none; }
  .cedx-bb:hover .cedx-art { transform: none; }
}
