* {
  margin: 0;
  padding: 0;
  line-height: calc(0.5rem + 1em);
}

*,
::before,
::after {
  box-sizing: border-box;
}

*:where(:not(fieldset, progress, meter)) {
  border-width: 0;
  border-style: solid;
  background-origin: border-box;
  background-repeat: no-repeat;
}

html {
  block-size: 100%;
  -webkit-text-size-adjust: none;
}

@media (prefers-reduced-motion: no-preference) {
  html,
  html:focus-within {
    scroll-behavior: smooth;
  }
}
body {
  -webkit-font-smoothing: subpixel-antialiased;
  text-rendering: optimizeSpeed;
  min-block-size: 100%;
  font-family: "Montserrat", sans-serif;
}

:where(img, svg, video, canvas, audio, iframe, embed, object) {
  display: block;
}

:where(img, svg, video) {
  block-size: auto;
  max-inline-size: 100%;
}

:where(img) {
  inline-size: 100%;
}

:where(svg) {
  stroke: none;
  fill: currentColor;
}

:where(svg):where(:not([fill])) {
  stroke: currentColor;
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
}

:where(input, button, textarea, select),
:where(input[type="file"])::-webkit-file-upload-button {
  color: inherit;
  font: inherit;
  font-size: inherit;
  letter-spacing: inherit;
  word-spacing: inherit;
}

:where(textarea) {
  resize: vertical;
}

@supports (resize: block) {
  :where(textarea) {
    resize: block;
  }
}
:where(ul, ol)[role="list"] {
  list-style: none;
}

a:not([class]) {
  text-decoration-skip-ink: auto;
}

:where(a[href], area, button, label[for], select, summary, textarea, [tabindex]:not([tabindex*="-"])) {
  cursor: pointer;
  touch-action: manipulation;
}

:where(input[type="file"]) {
  cursor: auto;
}

:where(input[type="file"])::-webkit-file-upload-button,
:where(input[type="file"])::file-selector-button {
  cursor: pointer;
}

:where(:focus-visible) {
  outline-style: dotted;
  outline-width: 0.1875rem;
  outline-color: currentColor;
}

:where(:focus-visible):not(:active) {
  outline-offset: 0.125rem;
  transition-duration: 0.25s;
}

@media (prefers-reduced-motion: no-preference) {
  :where(:focus-visible) {
    transition: outline-offset 145ms cubic-bezier(0.25, 0, 0.4, 1);
  }
}
:where(button, button[type], input[type="button"], input[type="submit"], input[type="reset"]),
:where(input[type="file"])::-webkit-file-upload-button,
:where(input[type="file"])::file-selector-button {
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  user-select: none;
  text-align: center;
}

:where(button, button[type], input[type="button"], input[type="submit"], input[type="reset"])[disabled] {
  cursor: not-allowed;
}

:where(button) {
  background: none;
}

@property --gradient-light {
  syntax: "<color>";
  inherits: false;
  initial-value: #f86202;
}
@property --gradient-dark {
  syntax: "<color>";
  inherits: false;
  initial-value: #cd47a4;
}
:root {
  --rtl: 1;

  --mouse-x: 0.5;
  --mouse-y: 0;

  --bg-main: rgb(2, 18, 30);
  --bg-main-rgb: 2 18 30;
  --bg-main-hover: var(--bg-main);
  --bg-inverse-rgb: 226 241 253;
  --bg-footer: #e7ebed;
  --bg-menu: #e7ebed;
  --bg-menu-mobile: white;
  --bg-popup: rgb(247 248 250 / 0.9);
  --bg-soft: hsl(209deg 57% 14%);
  --bg-black: black;
  --bg-white: white;
  --grey-lightest: #f3f4f6;
  --grey-lighter: #e4e9eb;
  --grey-light: #cbd4d8;
  --grey-medium: #b3b9c8;
  --grey-dark: #919fa9;
  --grey-darker: #7d8a91;

  --text-white: white;

  --text-black: black;
  --text-subdued: var(--grey-dark);
  --text-dark: #444;

  --text-link-hover: var(--theme-light-blue);
  --text-link-visited: var(--theme-magenta);

  --cta-pressed: var(--grey-medium);

  --theme-blue: #22517b;
  --theme-blue-rgb: 37 81 123;
  --theme-grey: #7e8493;
  --theme-green: #00856c;
  --theme-green-blue: #045c64;
  --theme-orange: #f86202;
  --error-msg: rgb(212 67 67);

  --theme-magenta: #cd47a4;
  --theme-alt-blue: #5289b4;
  --theme-dark-blue: #001d32;

  --theme-blue-darker: #12324f;
  --theme-green-darker: #008f74;
  --theme-dark-orange: #f86202;
  --theme-orange-darker: #de9109;
  --theme-purple-darker: #60508f;
  --theme-magenta-darker: #8c276f;
  --theme-alt-blue-darker: #12589e;
  --theme-dark-blue-darker: #0c192d;
  --theme-light-blue-darker: #318eb3;
  --theme-light-green-darker: #82b542;

  --theme-blue-lighter: #2a5e8a;
  --theme-green-lighter: #14c1a0;
  --theme-orange-lighter: #f8d402;
  --theme-purple-lighter: #8977c1;
  --theme-magenta-lighter: #9d2c7c;
  --theme-alt-blue-lighter: #1c82e7;
  --theme-dark-blue-lighter: #243d62;
  --theme-light-blue-lighter: #44a2c7;
  --theme-light-green-lighter: #b7e252;

  --theme: var(--theme-orange);
  --theme-not-blue: var(--bg-inverse-rgb);

  --gradient-light: var(--theme-orange);
  --gradient-dark: var(--theme-magenta);

  --angle: 0deg;

  --max-container-width: 85rem;

  --container-padding: clamp(2rem, 3vw, 3rem);
  /* PADDING and MARGIN where they need to extend beyond the mainContainer (for carousel, hero, etc)
  calculates excess up to 2 x section gap */
  --inline-reverse-padding: clamp(
    var(--container-padding),
    var(--container-padding) + 0.5 * (100vw - var(--max-container-width)),
    2 * 18rem
  );
  --inline-reverse-margin: calc(-1 * var(--inline-reverse-padding));

  --inline-container-excess: max(var(--container-padding), (100vw - var(--max-container-width)) / 2 + 3rem);

  --letter-spacing: 0.05ch;
  --text-size-h1: clamp(2.7rem, 1.54rem + 3.16vw, 5rem);
  --text-size-h2: clamp(2.4rem, 1rem + 3vw, 3.5rem);
  --text-size-h3: clamp(1.2rem, 1rem + 1vw, 1.65rem);
  --text-size-h3-dynamic: var(--text-size-h3);
  --text-size-tiny: 0.8rem;
  --text-size-small: 0.9rem;
  --text-size-standard: clamp(1rem, 0.9rem + 0.5vw, 1.1875rem);
  --text-size-testimonial: clamp(1.25rem, 1rem + 1vw, 1.6rem);
  --text-size-larger: clamp(1.2rem, 1rem + 0.7vw, 1.4rem);
  --text-size-large: clamp(1.5rem, 1.25rem + 1.2vw, 1.7rem);
  --text-size-menu: 1rem;
  --text-size-label: 1rem;
  --text-size-tag: 0.75rem;
  --text-size-cta: var(--text-size-standard);
  --text-size-icon: 1.125rem;
  --text-size-callout: clamp(2rem, 5vw, 5rem);
  --text-size-micro: 0.75rem;
  --text-size-lang: clamp(0.5rem, 0.75vw, 0.75rem);
  --max-text-width: 52rem;

  --text-weight-bold: 700;
  --text-weight-medium: 500;
  --text-weight-regular: 300;

  --gap-tiny: 0.5rem;
  --gap-small: 1rem;

  --gap: 2rem;

  --gap-large: 4rem;
  --gap-larger: 6rem;
  --gap-section: 8rem;

  --gap-dynamic-small: clamp(1rem, 2vw, 2rem);
  --gap-dynamic: clamp(1rem, 2vw, 2rem);
  --gap-dynamic-large: clamp(1rem, 6vw, 4rem);
  --gap-section-collapsible: clamp(0rem, 8vw, 8rem);

  --box-padding: 0.8rem;
  --box-padding-shallow: 0.4rem 0.8rem;
  --box-padding-small: 0.4rem;
  /* box-padding-large maintains a gradual shift from 1.25 to 2rem as the screen size reduces.
  2.5vw instead of 2vw to keep the larger size until a small desktop size */
  --box-padding-large: clamp(1.25rem, 2.5vw, 2rem);
  --box-padding-xlarge: calc(2 * var(--box-padding-large));

  --btn-padding-block: 0.75rem;
  --btn-padding-inline: 1.4rem;
  --padding-ch: 0.35ch 1ch;

  --border-soft: 1px solid rgb(var(--bg-inverse-rgb) / 0.25);
  --border-medium: 1px solid rgb(var(--bg-inverse-rgb) / 0.5);
  --border-hard: 1px solid rgb(var(--bg-inverse-rgb) / 1);
  --border-blue-thick: 5px solid rgb(var(--theme-blue-rgb) / 0.5);

  --border-theme-hard: 1px solid var(--theme-not-blue, rgb(var(--bg-inverse-rgb) / 0.25));
  --border-theme-medium: 1px solid rgb(var(--theme-not-blue, var(--bg-inverse-rgb)) / 0.5);
  --border-theme-soft: 1px solid rgb(var(--theme-not-blue, var(--bg-inverse-rgb)) / 0.25);
  --arrow-width: 0.125rem;
  --arrow-width-large: 0.25rem;
  --border-width-tiny: 1px;
  --border-width-thin: 0.25rem;
  --border-width-thinner: 0.375rem;
  --border-width: 0.75rem;
  --border-width-large: 1.5rem;
  --border-width-testimonial: 0.1875rem;
  --border-width-button: 0.0625rem;
  --icon-border-width: 0.25rem;
  --border-radius-small: 0.25rem;
  --border-radius-standard: 0.4rem;
  --border-radius-large: 1rem;
  --border-radius-huge: 2rem;

  --s: 0.25rem;
  --m: 0.5rem;
  --l: 0.75rem;
  --shadow-opacity: 0.05;
  --shadow-color: rgb(0 0 0 / 0.1);
  --shadow-outline: 0 0 var(--s) var(--shadow-color);
  --shadow-standard: var(--s) var(--s) var(--m) var(--shadow-color);
  --shadow-large: var(--m) var(--m) var(--l) var(--shadow-color);
  --shadow-extra-top: 0 -1px 0px rgb(0 0 0 / 0.3);

  --shadow-inset-light: inset 0 0 var(--s) var(--shadow-color);
  --shadow-emboss: inset 0px 1px 0px rgb(255 255 255 / 0.2), inset 0px -1px 0px rgb(0 0 0 / 0.5);
  --bg-white-glow: radial-gradient(ellipse at bottom center, rgb(255 255 255 / 0.8) 0%, rgb(255 255 255 / 0) 75%);
  --bg-blue-glow: radial-gradient(ellipse at bottom center, rgb(23 110 199 / 0.1) 0%, rgb(23 110 199 / 0) 75%);

  --icon-upper-header: clamp(1.25rem, 1.5vw, 1.5rem);
  --icon-size-tiny: 1.5rem;
  --icon-size-small: 2rem;
  --icon-size-standard: 4rem;
  --icon-size-larger: 6rem;
  --icon-size-large: 8rem;
  --icon-size-huge: 16rem;

  --transition-out-quadratic: cubic-bezier(0.25, 0.46, 0.45, 0.94);
  --transition-out-quartic: cubic-bezier(0.165, 0.84, 0.44, 1);
  --transition-in-out-quadratic: cubic-bezier(0.455, 0.03, 0.515, 0.955);
  --transition-bounce: cubic-bezier(0.45, 0.04, 0.37, 1.74);

  --blur-small: 3px;
  --blur-medium: 6px;
  --blur-large: 15px;
  --blur-very-large: 25px;
  --blend-default: normal;
  --blur-underlay-opacity: 0.4;

  --scrollbar-width: 0.5rem;
  --bg-scrollbar-track: rgb(from var(--theme-orange) r g b / 20%);
  --bg-scrollbar-thumb: var(--theme-orange);
  --bg-scrollbar-thumb-outline: transparent;

  --disabled-opacity: 0.24;
}

@supports (container-type: inline-size) {
  :root {
    --text-size-h3: clamp(1.2rem, 0.85rem + 4cqi, 1.65rem);
    --text-size-large: clamp(1.4rem, 0.5rem + 5cqi, 1.7rem);
  }
}
/* only applies on mouse interfaces, as hover effects are not viable on mobiles */
@media (pointer: fine) and (prefers-reduced-motion: no-preference) {
  :root {
    --distance-x: calc(-2 * (var(--mouse-x, 0.5) - 0.5));
    --distance-y: calc(-2 * (var(--mouse-y, 0.25) - 0.5));
    --shadow-standard: calc(var(--distance-x) * var(--s)) calc(var(--distance-y) * var(--s)) var(--m)
      var(--shadow-color);
    --shadow-large: calc(var(--distance-x) * var(--m)) calc(var(--distance-y) * var(--m)) var(--l) var(--shadow-color);
  }
}
@media (prefers-contrast: more) {
  :root {
    --bg-main: black;
    --bg-main-rgb: 0 0 0;
    --bg-main-hover: rgb(0 18 40);
    --bg-inverse-rgb: 255 255 255;
    --bg-footer: white;
    --bg-menu: black;
    --bg-menu-mobile: black;
    --bg-menu-shade: 0 0 0;
    --bg-soft: transparent;
    --bg-popup: white;
    --bg-black: black;
    --bg-white: white;
    --grey-lightest: white;
    --grey-lighter: white;
    --grey-light: white;
    --grey-medium: white;
    --grey-dark: white;
    --grey-darker: white;
    --text-white: white;
    --text-black: black;
    --text-subdued: white;
    --text-dark: black;
    --blur-underlay-opacity: 0;
    --contrast: 50%;
  }
}
:root,
:where(
    .blue,
    .blue-alt,
    .blue-lighter,
    .blue-green,
    .green,
    .orange,
    .orange-alt,
    .gradient,
    .purple,
    .magenta,
    .call-to-action,
    .news-showcase__cta,
    .hero-container-image-wrapper,
    .news-summary-categories > li
  ) {
  --theme-gradient: linear-gradient(in srgb, var(--gradient-light) 0%, var(--gradient-dark) 100%);
  /* --gradient-light-lighter: lch(from var(--gradient-light) calc(l + 10) c h);
  --gradient-dark-lighter: lch(from var(--gradient-dark) calc(l + 10) c h); */
  --theme-gradient-lighter: linear-gradient(
    in srgb,
    lch(from var(--gradient-light) calc(l + 10) c h) 0%,
    lch(from var(--gradient-dark) calc(l + 10) c h) 100%
  );
  --theme-gradient-triple: linear-gradient(
    in srgb,
    var(--gradient-light) 0%,
    rgb(var(--bg-main-rgb) / 0) 45%,
    var(--gradient-light) 100%
  );
  --border-theme-hard: 1px solid var(--theme-not-blue, rgb(var(--bg-inverse-rgb) / 0.25));
  --border-theme-medium: 1px solid rgb(var(--theme-not-blue, var(--bg-inverse-rgb)) / 0.5);
  --border-theme-soft: 1px solid rgb(var(--theme-not-blue, var(--bg-inverse-rgb)) / 0.25);
  --gradient-border: linear-gradient(var(--bg-main-hover), var(--bg-main-hover)) padding-box,
    var(--theme-gradient) border-box;
}

/* problem with inheriting the blur on short headers */
:where(.shortHeader) {
  --blur-small: 3px;
}

:root {
  --icon-down: polygon(16% 36%, 84% 36%, 50% 70%);
  --icon-arrow-down: polygon(44% 12%, 56% 12%, 56% 64%, 74% 46%, 83% 54%, 50% 88%, 16% 54%, 25% 46%, 44% 64%);
  --icon-cross: polygon(
    28% 19%,
    19% 28%,
    41% 50%,
    19% 71%,
    28% 81%,
    50% 59%,
    72% 81%,
    81% 72%,
    59% 50%,
    81% 28%,
    72% 19%,
    50% 41%
  );
  --icon-tick: polygon(13% 41%, 38% 66%, 88% 16%, 97% 25%, 38% 84%, 4% 50%);
  --icon-external: polygon(
    88% 11%,
    88% 43%,
    77% 43%,
    78% 29%,
    47% 60%,
    47% 60%,
    72% 53%,
    83% 53%,
    83% 84%,
    16% 84%,
    16% 17%,
    47% 17%,
    47% 27%,
    27% 27%,
    27% 73%,
    73% 73%,
    72% 53%,
    47% 60%,
    47% 60%,
    39% 53%,
    70% 22%,
    57% 22%,
    57% 12%
  );
  --icon-download: polygon(
    50% 74%,
    63% 62%,
    87% 61%,
    87% 85%,
    14% 85%,
    14% 62%,
    37% 61%,
    50% 74%,
    50% 68%,
    75% 43%,
    68% 37%,
    55% 51%,
    55% 12%,
    45% 12%,
    45% 50%,
    32% 37%,
    25% 44%,
    50% 68%
  );
  --icon-video: polygon(88% 50%, 20% 14%, 20% 86%);
  --icon-magnify: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M416 208c0 45.9-14.9 88.3-40 122.7L486.6 441.4 509.3 464 464 509.3l-22.6-22.6L330.7 376c-34.4 25.2-76.8 40-122.7 40C93.1 416 0 322.9 0 208S93.1 0 208 0S416 93.1 416 208zM208 352c79.5 0 144-64.5 144-144s-64.5-144-144-144S64 128.5 64 208s64.5 144 144 144z'/%3E%3C/svg%3E");
}

.magnifying-glass {
  background-color: rgba(0, 0, 0, 0);
  display: grid;
  position: relative;
  aspect-ratio: 1;
}
.magnifying-glass::before {
  content: "";
  display: block;
  aspect-ratio: 1;
  inline-size: calc(var(--icon-size) - var(--thickness, 0.1875rem));
  block-size: calc(var(--icon-size) - var(--thickness, 0.1875rem));
  border-radius: 100vmax;
  border: var(--thickness, 0.1875rem) solid currentColor;
  transition: all var(--speed-standard) var(--transition-out-quadratic);
  cursor: pointer;
}
.magnifying-glass::after {
  content: "";
  display: inline-block;
  position: absolute;
  right: 0;
  bottom: 0;
  border-width: 0;
  background: currentColor;
  inline-size: clamp(var(--handle, 0.25rem) * 2, 0.1vw + var(--handle, 0.25rem) * 1.9, var(--handle, 0.25rem) * 2.3);
  height: var(--thickness, 0.1875rem);
  rotate: 53deg;
  transition: all var(--speed-standard) var(--transition-out-quadratic);
  cursor: pointer;
}
.magnifying-glass:hover::before {
  scale: 1.25;
}
.magnifying-glass:hover::after {
  scale: 1.25;
  right: calc(var(--thickness, 0.1875rem) * -0.5);
  bottom: calc(var(--thickness, 0.1875rem) * -0.5);
}

:where(select, textarea, input:not([type="checkbox"]):not([type="radio"])) {
  color: black;
  border-radius: var(--border-radius-small);
  display: block;
  font-weight: var(--text-weight-medium);
  margin-block: var(--gap-tiny) var(--gap-small);
  padding: var(--padding-ch);
  text-overflow: ellipsis;
  box-shadow: var(--shadow-outline);
  inline-size: min(100%, 30ch);
  outline-width: 0.125rem;
  outline-color: RGB(var(--bg-inverse-rgb));
  border: var(--border-soft);
}
:where(select, textarea, input:not([type="checkbox"]):not([type="radio"]))::placeholder {
  font-weight: var(--text-weight-regular);
}

select:not([multiple]) {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  --arrow: 0.3125rem;
  --arrow-size: 1.25rem;
  --line: 1px;
  background-image: linear-gradient(45deg, transparent 50%, var(--text-dark) 50%),
    linear-gradient(135deg, var(--text-dark) 50%, transparent 50%),
    linear-gradient(to right, var(--grey-light), var(--grey-light));
  --select-start: 50% + 50% * var(--rtl, 1) - var(--rtl, 1) * var(--arrow-size);
  background-position: calc(var(--select-start)) 50%, calc(var(--select-start) + var(--arrow)) 50%,
    calc(var(--select-start) - var(--rtl, 1) * var(--arrow-size)) 0;
  background-size: var(--arrow) var(--arrow), var(--arrow) var(--arrow), var(--line) 100%;
  background-repeat: no-repeat;
}

input:where([type="checkbox"], [type="radio"]) {
  display: grid;
  place-items: center;
  grid-template-areas: "stack";
  width: 1.3lh;
  height: 1.3lh;
  translate: 0% -0.1lh;
  aspect-ratio: 1;
  position: relative;
  border: 1px solid lightgray;
  border-radius: var(--border-radius-small);
  vertical-align: middle;
  appearance: none;
  outline: none;
  color: var(--text-white);
  transition: background-color var(--speed-standard) var(--transition-in-out-quadratic);
}
input:where([type="checkbox"], [type="radio"]):where(:focus, :focus-visible) {
  outline-style: dotted;
}
input:where([type="checkbox"], [type="radio"]):where(:active, :hover, :focus, :focus-visible) {
  background-color: rgb(var(--bg-inverse-rgb) / 0.2);
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), inset 0px 1px 3px rgba(0, 0, 0, 0.1);
}
input:where([type="checkbox"], [type="radio"]):where(:active) {
  background-color: rgb(var(--bg-inverse-rgb) / 0.2);
}
input:where([type="checkbox"], [type="radio"])::after {
  grid-area: stack;
  background-color: currentColor;
  animation-timing-function: var(--transition-bounce);
  animation-duration: var(--speed-standard);
  animation-name: zoomIn;
  animation-fill-mode: both;
}
input:where([type="checkbox"], [type="radio"]):checked::after {
  content: "";
  clip-path: var(--icon-tick);
  width: 80%;
  height: 80%;
  color: var(--theme-orange) !important;
}

input[type="radio"] {
  border-radius: 100vmax;
}
input[type="radio"]:not(:checked):hover::before {
  clip-path: circle(50%);
  content: "";
  opacity: 0.5;
  width: 30%;
  height: 30%;
  grid-area: stack;
  background-color: currentColor;
  animation-timing-function: var(--transition-bounce);
  animation-duration: var(--speed-standard);
  animation-name: zoomIn;
  animation-fill-mode: both;
}
input[type="radio"]:checked::after {
  content: "";
  clip-path: var(--icon-tick);
  width: 70%;
  height: 70%;
}

html {
  font-size: clamp(0.875rem, 0.875rem + 0.125 * (100vw - 37.5em) / 25, 1rem);
  scroll-padding-block-start: 5rem;
}

body:not([data-edit-mode]) :where(h1, h2, h3, h4, h5, h6, p, ul, ol, li, a):empty {
  display: none;
}

h1 {
  font-size: var(--text-size-h1);
  font-weight: var(--text-weight-regular);
  line-height: 1;
}

h2,
.visual-h2 {
  font-size: var(--text-size-h2);
  font-weight: var(--text-weight-regular);
  line-height: 1.15;
}

h3,
.visual-h3 {
  font-size: var(--text-size-h3);
  font-weight: var(--text-weight-bold);
  line-height: 1.3;
}
h3:is(.large, .larger),
.visual-h3:is(.large, .larger) {
  font-size: var(--text-size-h2);
}

h4 {
  font-size: var(--text-size-h4);
  font-weight: var(--text-weight-bold);
  line-height: 1.7;
}

p,
li {
  line-height: 1.7;
  max-width: var(--max-text-width);
}

:where(h1, h2, h3, h4, h5, h6, .visual-h3, .visual-h3, .large, .larger) {
  text-wrap: pretty;
}

[data-no-balancing] :where(h1, h2, h3, h4, h5, h6) {
  text-wrap: revert;
}

.unbalance-lines {
  overflow-wrap: normal;
}

:where(p, h1, h2, h3, h4, h5, h6) + :where(p, ul, ol, img, h4, h5, h6) {
  margin-block-start: var(--gap-small);
}

:where(p, ul, ol) + :where(h1, h2, h3) {
  margin-block-start: var(--gap);
}

:where(.sub-heading) + :where(h2, h3, h4, h5, h6) {
  margin-block-start: unset;
}

:where(a) {
  color: inherit;
}
:where(a):where(:hover, :focus-visible) {
  text-decoration-color: var(--text-link-hover);
  text-decoration-thickness: 2px;
}
:where(a):visited {
  text-decoration-color: var(--text-link-visited);
}

p:has(img[style*="float"]) {
  max-width: unset;
}

p.large {
  font-size: var(--text-size-large);
  line-height: 1.3;
}
p.larger {
  font-size: var(--text-size-larger);
  line-height: 1.2;
}
p.bold {
  font-weight: var(--text-weight-bold);
}

.size1 {
  font-size: clamp(1.063rem, 1.9vw, 1.186rem);
}

.size2 {
  font-size: clamp(1.125rem, 2.04vw, 1.275rem);
}

.size3 {
  font-size: clamp(1.188rem, 2.19vw, 1.366rem);
}

.size4 {
  font-size: clamp(1.25rem, 2.33vw, 1.458rem);
}

.size5 {
  font-size: clamp(1.313rem, 2.49vw, 1.553rem);
}

.size6 {
  font-size: clamp(1.375rem, 2.64vw, 1.65rem);
}

.size7 {
  font-size: clamp(1.438rem, 2.8vw, 1.749rem);
}

.size8 {
  font-size: clamp(1.5rem, 2.96vw, 1.85rem);
}

.size9 {
  font-size: clamp(1.563rem, 3.13vw, 1.953rem);
}

.size10 {
  font-size: clamp(1.625rem, 3.29vw, 2.058rem);
}

.size11 {
  font-size: clamp(1.688rem, 3.47vw, 2.166rem);
}

.size12 {
  font-size: clamp(1.75rem, 3.64vw, 2.275rem);
}

.size13 {
  font-size: clamp(1.813rem, 3.82vw, 2.386rem);
}

.size14 {
  font-size: clamp(1.875rem, 4vw, 2.5rem);
}

:where(
    .text-content,
    .text-container,
    .feature-item__text,
    .news-showcase__content,
    .text,
    .contentcarouselslide,
    .intro__content,
    .copy-container,
    .hero-banner-content
  )
  :where(ul, ol) {
  padding-inline-start: 2ch;
}
:where(
    .text-content,
    .text-container,
    .feature-item__text,
    .news-showcase__content,
    .text,
    .contentcarouselslide,
    .intro__content,
    .copy-container,
    .hero-banner-content
  )
  :where(ul, ol)
  li {
  padding-inline-start: 0.5ch;
  padding-block-end: 1ch;
}

:where(blockquote) {
  padding: var(--gap-small) var(--gap);
  margin: var(--gap) 0;
  border-inline-start: 0.3rem solid var(--theme);
}

span[style*="font-weight: normal"] {
  font-weight: inherit !important;
}

details[open] summary {
  border-block-end: var(--border-soft);
  margin-block-end: var(--gap-tiny);
}

/* =–=–=–=–=–=–=–=–=–=–=–=–=–=–=–=–=–=– */
/*    Utility classes */
/* =–=–=–=–=–=–=–=–=–=–=–=–=–=–=–=–=–=– */
.object-fit-cover {
  overflow: hidden;
}
.object-fit-cover > * {
  object-fit: cover;
  block-size: 100%;
  inline-size: 100%;
}

.hidden-overflow {
  overflow: hidden;
}

.scroll-y {
  overflow-y: scroll;
}

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  border: 0;
  padding: 0;
  white-space: nowrap;
  clip-path: inset(100%);
  clip: rect(0 0 0 0);
  overflow: hidden;
}

.gradient,
.heading-ruled,
.component-short-header .content-holder h1,
.hero-slide h2,
.blog-entry-header__title,
.stickyPanel section > :is(h2, h3, .visual-h2, .visual-h3) {
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  background-image: var(--theme-gradient);
}

:where(span.quotes)::before {
  content: open-quote;
}
:where(span.quotes)::after {
  content: close-quote;
}

.allow-full-width {
  max-width: unset;
}

:where(.limit-width) {
  max-inline-size: var(--max-text-width);
}

.tabular-nums {
  font-variant-numeric: tabular-nums;
}

:where(.medium) {
  font-weight: var(--text-weight-medium);
}

:where(.bold) {
  font-weight: var(--text-weight-bold);
}

.balance-lines {
  text-wrap: balance;
}

:where(.sub-heading) {
  text-transform: uppercase;
  font-size: var(--text-size-small);
}

.compact-list li {
  padding-block: 0;
}

.line-clamp {
  --lines: 3;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: var(--lines, 3);
  text-overflow: ellipsis;
  overflow: hidden;
}

.clamp-2 {
  --lines: 2;
}

.clamp-4 {
  --lines: 4;
}

.clamp-5 {
  --lines: 5;
}

/* allows text to split into auto columns, approx 460px wide */
.multi-column {
  columns: auto 27rem;
  column-gap: var(--gap-large);
}

/* can be set around elements that shouldn't break within a column */
.no-break :where(h3, li, ol, p) {
  break-inside: avoid-column;
}

.float-right {
  max-inline-size: unset;
}
.float-right img {
  float: right;
  float: inline-end;
  margin-inline-start: var(--gap);
  inline-size: clamp(250px, 50vw, 40rem);
}
.float-right + * {
  margin-block-start: unset;
}

@container (max-width: 50rem) {
  .float-right img {
    float: unset;
    margin-inline: unset;
    margin-block-end: var(--gap);
    inline-size: 100%;
  }
}
/* =–=–=–=–=–=–=–=–=–=–=–=–=–=–=–=–=–=– */
/*    Display, margin and padding */
/* =–=–=–=–=–=–=–=–=–=–=–=–=–=–=–=–=–=– */
:where(.flex) {
  display: flex;
}

:where(.space-evenly) {
  justify-content: space-evenly;
}

:where(.space-around) {
  justify-content: space-around;
}

:where(.space-between) {
  justify-content: space-between;
}

:where(.margin-top) {
  margin-block-start: var(--gap-small);
}

:where(.margin-bottom) {
  margin-block-end: var(--gap-small);
}

:where(.margin-top-large) {
  margin-block-start: var(--gap);
}

:where(.margin-bottom-large) {
  margin-block-end: var(--gap);
}

.margin-section-bottom {
  margin-block-end: var(--gap-section);
}

:where(.padding-small) {
  padding: var(--gap-tiny);
}

:where(.padding-standard) {
  padding: var(--gap-small);
}

:where(.padding-bottom) {
  padding-block-end: var(--gap-small);
}

:where(.block-padding) {
  padding-block: var(--box-padding);
}
:where(.block-padding):where(.large) {
  padding-block: var(--box-padding-large);
}

/* .grid has already been in use on the content on the site, so continue to support this particular configuration */
:where(.grid) {
  display: grid;
  --cols: 1;
  grid-template-columns: repeat(var(--cols), 1fr);
}

:where(.grid-auto-columns) {
  display: grid;
  grid-auto-flow: column;
}

:where(.grid-fixed-columns) {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(var(--col-width, 25rem), 1fr));
}

:where(.gap) {
  gap: var(--gap);
}

:where(.nogap) {
  gap: unset;
}

.col2 {
  --cols: 2;
}

.col3 {
  --cols: 3;
}

.col-fixed-7 {
  --col-width: 8rem;
}

.col-fixed-6 {
  --col-width: 9rem;
}

.col-fixed-5 {
  --col-width: 12rem;
}

.col-fixed-4 {
  --col-width: 15rem;
}

.col-fixed-3 {
  --col-width: 20rem;
}

:where(.fit-content, .fit-width) {
  width: fit-content;
}

/* --bg-img is leveraged on several components so this class would allow the image to be utilised on some custom element if ever required */
.use-bg {
  background-image: var(--bg-img);
}

:where(.bg-img-cover) {
  background-size: cover;
}

/* for when vendor logos need to be manually added to a component */
/* works in conjunction with "grid-auto-columns gap" */
.vendor-logo-sizing img {
  max-inline-size: 10rem;
}
.vendor-logo-sizing.grid-auto-columns img {
  margin-inline: auto;
}

/* special new type of small box, presented similar to the feature/text+image */
.mini-features > * {
  background-color: var(--bg-white-if-light, rgb(var(--bg-inverse-rgb) / 0.08));
  border: var(--is-light, var(--border-theme-hard));
  padding: var(--box-padding);
  border-radius: var(--border-radius-large);
  box-shadow: var(--shadow-standard);
}

:where(.border-soft) {
  border: var(--border-soft);
}

:where(.border-medium) {
  border: var(--border-medium);
}

:where(.border-hard) {
  border: var(--border-hard);
}

:where(.border-separator) {
  border-block-end: var(--border-medium);
}

/* =–=–=–=–=–=–=–=–=–=–=–=–=–=–=–=–=–=– */
/*    Tables */
/* =–=–=–=–=–=–=–=–=–=–=–=–=–=–=–=–=–=– */
.alternating-rows tr:nth-child(even) {
  background-color: var(--bg-white-if-light, rgb(var(--bg-inverse-rgb) / 0.08));
}
.alternating-rows.extended {
  margin: 0 -0.5rem;
}

.padded-cells td,
.padded-cells th {
  padding: 0.3rem 0.5rem;
}

.vertical-align-top,
.vertical-align-top :where(td, th) {
  vertical-align: top;
}

.vertical-align-middle,
.vertical-align-middle :where(td, th) {
  vertical-align: middle;
}

.vertical-align-bottom,
.vertical-align-bottom :where(td, th) {
  vertical-align: bottom;
}

.vertical-align-middle,
.vertical-align-middle :where(td, th) {
  vertical-align: middle;
}

.table-padding-standard,
.table-padding-standard :where(td, th) {
  padding: var(--gap-tiny);
}

.table-left-headings th {
  text-align: left;
}

/* A script adds error attribute to images on failure to load */
img[data-error="true"] {
  visibility: hidden;
}

.blue-alt {
  --theme: var(--theme-blue);
  --gradient-light: #3f9bbf;
  --gradient-dark: #0f3448;
}

.blue-green,
.green {
  --theme: var(--theme-green);
  --gradient-light: #00a082;
  --gradient-dark: #9e2b7c;
}

.blue,
.orange,
.heading-ruled,
.gradient {
  --theme: var(--theme-orange);
  --gradient-light: #f86202;
  --gradient-dark: #cd47a4;
}

.blue-lighter,
.purple {
  --theme: var(--theme-purple);
  --gradient-light: #9e2b7c;
  --gradient-dark: #172b49;
}

.magenta {
  --theme: var(--theme-magenta);
  --gradient-light: #f86202;
  --gradient-dark: #9e2b7c;
}

:where(.call-to-action, .news-showcase__cta, .partnerCentralLink a, .textimagewithcta .cta-with-arrow) {
  display: inline-block;
  position: relative;
  background: white;
  border: var(--border-width-button) solid transparent;
  border-radius: var(--border-radius-standard);
  font-weight: var(--text-weight-bold);
  padding: var(--btn-padding-block) var(--btn-padding-inline);
  appearance: none;
  text-decoration: none;
  text-transform: none;
  user-select: none;
  touch-action: manipulation;
  cursor: pointer;
  word-break: keep-all;
  z-index: 0;
  transition: all var(--speed-slow) var(--transition-out-quadratic);
}
:where(.call-to-action, .news-showcase__cta, .partnerCentralLink a, .textimagewithcta .cta-with-arrow):not(
    :disabled
  ):hover {
  scale: 1.015;
  background-color: transparent;
  color: white;
  border-color: white;
  filter: brightness(1.2);
}
:where(.call-to-action, .news-showcase__cta, .partnerCentralLink a, .textimagewithcta .cta-with-arrow):not(
    :disabled
  ):active {
  scale: 1;
  transition-duration: 0;
  color: var(--cta-pressed);
}
:where(.call-to-action, .news-showcase__cta, .partnerCentralLink a, .textimagewithcta .cta-with-arrow):disabled {
  cursor: default;
  opacity: var(--disabled-opacity);
}
:where(.call-to-action, .news-showcase__cta, .partnerCentralLink a, .textimagewithcta .cta-with-arrow) br {
  display: none;
}

:is(.call-to-action, .news-showcase__cta) {
  color: black;
}

:where(.call-to-action.reduced-padding) {
  padding-block: calc(0.5 * var(--btn-padding-block));
}

.primary-link {
  background: var(--theme-gradient);
  border-color: var(--bg-main);
  color: white;
  text-shadow: 0px 0px 1rem rgba(0, 0, 0, 0.5), 0px 0px 0.25rem rgba(0, 0, 0, 0.5);
}
.primary-link:is(:hover, :active, :focus-visible) {
  border-color: var(--theme, white);
}

:is(.secondary-link, .textimagewithcta .cta-with-arrow) {
  background-color: transparent;
  color: white;
  border-color: white;
}
:is(.secondary-link, .textimagewithcta .cta-with-arrow):is(:hover, :active, :focus-visible) {
  background-color: white;
  color: black;
}

:where(.icon-video, .icon-external, .icon-download, .icon-email, .icon-phone, .icon-down) {
  display: grid;

  grid-template: "a b"/24px 1fr;
  align-items: center;
  padding-left: calc(var(--btn-padding-inline) - 12px);
  gap: 1ch;
  inline-size: fit-content;
}
:where(.icon-video, .icon-external, .icon-download, .icon-email, .icon-phone, .icon-down)::before {
  grid-area: a;
  content: "";
  aspect-ratio: 1;
  border: 1px solid currentColor;
  border-radius: 100vmax;
}
:where(.icon-video, .icon-external, .icon-download, .icon-email, .icon-phone, .icon-down)::after {
  grid-area: a;
  content: "";
  background-color: currentColor;
  width: 60%;
  aspect-ratio: 1;
  margin: auto;
  clip-path: var(--icon);
}

.icon-video {
  --icon: var(--icon-video);
}

.icon-external {
  --icon: var(--icon-external);
}

.icon-download {
  --icon: var(--icon-download);
}

.icon-email {
  --icon: var(--icon-email);
}

.icon-phone {
  --icon: var(--icon-phone);
}

.icon-down {
  --icon: var(--icon-down);
}

p:has(:is(.call-to-action, .news-showcase__cta):nth-child(2)) {
  display: flex;
  flex-wrap: wrap;
  gap: var(--gap-small) var(--gap);
}

p > :is(.call-to-action, .news-showcase__cta) {
  margin-block-start: var(--gap-small) var(--gap);
}

/* dialog initially used for YouTube but plan is to also leverage for future Marketo form integration */
/* with native HTML support for backdrop, etc */
dialog {
  padding: var(--box-padding-large);
  inline-size: calc(100vw - 2 * var(--container-padding));
  position: fixed;
  margin: auto;
  border: var(--border-hard);
  background: var(--bg-main);
}
dialog::backdrop {
  background-color: rgba(0, 0, 0, 0.6);
  -webkit-backdrop-filter: blur(var(--blur-medium));
  backdrop-filter: blur(var(--blur-medium));
}
dialog iframe {
  inline-size: 100%;
}
dialog .close-dialog {
  width: 1.25rem;
  height: 1.25rem;
  translate: -50% 50%;
  position: absolute;
  inset-block-start: 0;
  inset-inline-end: 0;
  cursor: pointer;
  background-color: rgb(var(--bg-inverse-rgb));
  clip-path: var(--icon-cross);
}

@media screen and (prefers-reduced-motion: no-preference) {
  :root {
    --speed-gradual: 3s;
    --speed-snail: 1s;
    --speed-slower: 0.75s;
    --speed-slow: 0.5s;
    --speed-standard: 0.25s;
    --speed-fast: 0.1s;
    --pending: fadeIn var(--speed-slow) var(--transition-bounce) infinite alternate-reverse;
  }
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes fadeInShallow {
  from {
    opacity: 0.5;
  }
  to {
    opacity: 1;
  }
}
@keyframes riseUp {
  from {
    translate: 0% 100%;
  }
  to {
    translate: 0% 0%;
  }
}
@keyframes zoomIn {
  from {
    scale: 0.8;
  }
  to {
    scale: 1;
  }
}
@keyframes zoomInShallow {
  from {
    scale: 0.95;
    opacity: 0.7;
  }
}
@keyframes slideRight {
  from {
    transform: translateX(-4rem);
  }
  to {
    transform: translateX(0rem);
  }
}
@keyframes slideLeft {
  from {
    transform: translateX(4rem);
  }
  to {
    transform: translateX(0rem);
  }
}
@keyframes menuOpensUp {
  from {
    opacity: 0;
    scale: 0.5 0.9;
  }
  to {
    opacity: 1;
    scale: 1 1;
  }
}
@keyframes caretPulsingDown {
  from {
    translate: 0rem -0.125rem;
  }
  to {
    translate: 0rem 0rem;
  }
}
@keyframes placeHolderShimmer {
  from {
    background-position: -30rem 0;
  }
  to {
    background-position: 30rem 0;
  }
}
body {
  color: var(--text-white);
  font-family: "Montserrat", sans-serif;
  font-size: var(--text-size-standard);
  font-weight: var(--text-weight-regular);

  letter-spacing: var(--letter-spacing);
  overflow-x: clip;
  max-width: 100vw;
  background: var(--bg-main);
}
body.menu-open {
  overflow-y: hidden;
  margin-right: 14px;
}

.mainContainer {
  inline-size: min(100%, var(--max-container-width));
  padding-inline: var(--container-padding);
  margin: 0 auto;
  position: relative;
  background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZlcnNpb249IjEuMSIgdmlld0JveD0iMCAwIDIwMTQgMjAxNCI+CiAgPHBhdGggZD0iTTEwMDcsNy42TDcuNiwxMDA3bDk5OS40LDk5OS40LDk5OS40LTk5OS40TDEwMDcsNy42Wk01MDcuMywxMDA3bDQ5OS43LTQ5OS43LDQ5OS43LDQ5OS43LTQ5OS43LDQ5OS43LTQ5OS43LTQ5OS43WiIgZmlsbD0iIzAzMTcyNyIgc3Ryb2tlLXdpZHRoPSIwIi8+Cjwvc3ZnPg==");
  background-position: 150% 0%;
  background-size: 90%;
  background-repeat: no-repeat;
}

/* exception to limit the width of a general content component if it's used first after a Hero for primary page */
body:has(.hero-slide-v2) .content-wrapper > .oneColumnContent:first-child {
  inline-size: min(100%, 40rem);
}

/* disable background image if not less contrast and reduced data not set */
@media (prefers-reduced-data: reduced), (prefers-contrast: more) {
  .mainContainer {
    background-image: unset;
  }
}
body[dir="rtl"] {
  --rtl: -1;
}
body[dir="rtl"] .mainContainer {
  background-position: 0% 0%;
}
body[dir="rtl"] .carousel-slide__content-container::before,
body[dir="rtl"] .carousel-slide__content-container::after {
  display: none;
}

.skip-nav-link {
  position: absolute;
  transform: translateY(-120%);
  transition: transform var(--speed-standard) ease;
  background: var(--bg-main);
  color: var(--text-white);
  padding: 2ch;
  left: 0.5rem;
  z-index: 10;
}
.skip-nav-link:focus-visible {
  transform: translateY(0);
}

@supports not (scrollbar-color: auto) {
  .scrollbar-h::-webkit-scrollbar {
    height: var(--scrollbar-width);
  }
  .scrollbar-h::-webkit-scrollbar-track {
    background: var(--bg-scrollbar-track);
    border-radius: var(--scrollbar-width);
  }
  .scrollbar-h::-webkit-scrollbar-thumb {
    background-color: var(--bg-scrollbar-thumb);
    border-radius: 6px;
  }
}
.scrollbar-h {
  scrollbar-color: var(--bg-scrollbar-thumb) var(--bg-scrollbar-track);
  scrollbar-width: var(--scrollbar-width);
  scrollbar-gutter: stable;
}

.disabled {
  opacity: var(--disabled-opacity);
}

a.cta-with-arrow {
  display: block;
  text-decoration: none;
}

.cta-with-arrow {
  position: relative;
}
.cta-with-arrow::after {
  display: block;
  position: absolute;
  content: "";
  inline-size: 0.5rem;
  block-size: 0.5rem;
  bottom: 0;
  right: 0;
  border: solid currentColor;
  border-width: 0 var(--arrow-width, 0.125rem) var(--arrow-width, 0.125rem) 0;
  transform: translate(0, -100%) rotate(-45deg);
  transition: transform var(--speed-standard) var(--transition-out-quadratic);
}
.cta-with-arrow:is(:hover, :focus-visible) span {
  background-size: 100% var(--arrow-width, 0.125rem);
}
.cta-with-arrow:is(:hover, :focus-visible)::after {
  transform: translate(0.25rem, -100%) rotate(-45deg);
}
.cta-with-arrow span {
  background-size: 0% var(--arrow-width, 0.125rem);
  background-position: calc(var(--rtl, 0) * -100%) 100%;
  background-repeat: no-repeat;
  background-image: var(--theme-gradient-lighter);
  transition: background var(--speed-slow) var(--transition-out-quadratic);
}

.accordion-heading,
.accordion-description {
  margin-block-end: calc(0.5 * var(--gap-dynamic-large));
}

.accordion-container {
  display: grid;
  gap: var(--gap-small);
  margin-block-end: var(--gap-large);
  --bp: calc(1.5 * var(--box-padding));
  max-inline-size: calc(var(--max-text-width) + 2 * var(--bp));
}
.accordion-container details {
  border: var(--border-medium);
  border-radius: var(--border-radius-large);
}
.accordion-container details:not([open]) summary {
  border-radius: calc(var(--border-radius-large) - 1px);
}
.accordion-container details[open] summary {
  background-image: var(--theme-gradient);
  color: white;
}
.accordion-container details[open] summary > div span {
  transform: rotate(45deg);
}
.accordion-container details > div {
  max-inline-size: var(--max-text-width);
  margin-block: var(--gap);
  padding-inline: var(--bp);
}
.accordion-container details:has(summary:focus-visible) {
  outline-style: dotted;
  outline-width: 0.1875rem;
  outline-color: currentColor;
}
.accordion-container summary {
  display: block;
  padding: var(--bp);
  border-radius: calc(var(--border-radius-large) - 1px) calc(var(--border-radius-large) - 1px) 0 0;
  position: relative;
  font-weight: var(--text-weight-bold);
  transition: background-color var(--speed-standard) var(--transition-out-quadratic);
}
.accordion-container summary:is(:focus-visible, :hover) {
  background-color: rgb(var(--bg-inverse-rgb) / 0.1);
}
.accordion-container summary > div {
  display: inline-flex;
  inline-size: calc(100% - 2rem);
  position: relative;
}
.accordion-container summary span {
  position: absolute;
  background-color: var(--theme);
  display: grid;
  place-items: center;
  right: -1.25lh;
  top: -0.125lh;
  inline-size: 1.25lh;
  block-size: 1.25lh;
  border-radius: 100vmax;
  transition: transform var(--speed-standard) var(--transition-out-quadratic);
  will-change: transform;
}
.accordion-container summary span::after,
.accordion-container summary span::before {
  position: absolute;
  content: "";
  width: 0.8lh;
  border-radius: 0.2rem;
  height: 0.125rem;
  background-color: currentColor;
}
.accordion-container summary span::after {
  transform: rotate(90deg);
}

@supports (block-size: calc-size(auto, size)) {
  .accordion-container details > div {
    margin: 0;
  }
  details:not([data-lab-type]) {
    overflow: hidden;
  }
  details:not([data-lab-type]) summary {
    margin: 0;
  }
  details:not([data-lab-type])::details-content {
    transition: block-size var(--speed-slow), content-visibility var(--speed-slow), padding var(--speed-slow);
    transition-behavior: allow-discrete;
    block-size: 0;
    margin: 0;
    padding-block: 0;
  }
  details:not([data-lab-type])[open]::details-content {
    block-size: auto;
    padding-block: 1rem;
  }
  details:not([data-lab-type])[open]::details-content > div {
    margin-block: 0;
  }
}

.angled-container {
  margin-block: var(--gap-section);
}
.angled-container:not([style*="#E8EDEF"], [style*="#FFF"]) {
  background-color: var(--bg-color, transparent);
  margin-inline: var(--inline-reverse-margin);
  padding-inline: var(--inline-reverse-padding);
}
.angled-container:not([style*="#E8EDEF"], [style*="#FFF"]) .angled-container__content {
  padding-block: var(--box-padding-large);
}
.angled-container:not([style*="#E8EDEF"], [style*="#FFF"]) .angled-container__content > .scroller:last-child {
  margin-block: 0;
}

.angled-container__title {
  margin-block-end: var(--gap-small);
}

.angled-container__title:not(:has(+ .angled-container__content > .oneColumnContent:first-child)) {
  margin-block-end: var(--gap-dynamic);
}
.component-call-to-action {
  display: grid;
  background: var(--gradient-border);
  border: var(--border-width-thin) solid transparent;
  border-radius: var(--border-radius-standard);
  padding: var(--box-padding-large);
  gap: var(--gap);
  display: grid;
  grid-auto-rows: min-content min-content auto;
}
.component-call-to-action .text {
  display: contents;
}
.component-call-to-action .text > :is(h2, h3, h4, div:first-of-type:not(:only-child)) {
  grid-column: var(--stack);
}
.component-call-to-action .text > :is(div:last-of-type:not(:only-child), p) {
  grid-column: var(--stack);
}
.component-call-to-action .image img[alt*="icon"] {
  inline-size: clamp(9rem, 50%, 20rem);
}
.component-call-to-action .action-link {
  display: none;
}

@media (pointer: fine) {
  .callToAction {
    --clip: circle(0% at center);
    --stack: 1/1;
    overflow: hidden;
    --hover-position: translateY(calc(100% + 2 * var(--box-padding)));
  }
  .callToAction .action-link {
    display: block;
    grid-row: 2;
    grid-column: 1;
    align-self: flex-end;
    padding: 0.75ch 2ch;
    border: var(--border-medium);
    inline-size: fit-content;
    border-radius: 100vmax;
    text-decoration: none;
    margin-block-start: auto;
    pointer-events: none;
  }
  .callToAction .image {
    grid-column: 1;
    grid-row: 3;
    z-index: 1;
  }
  .callToAction .image img {
    inline-size: 100%;
  }
  .callToAction .image + .text > :is(div:last-of-type:not(:only-child), p) {
    grid-row: 1/4;
  }
  .callToAction .text > :is(h2, h3, h4, div:first-of-type:not(:only-child)) {
    grid-row: 1;
    grid-column: 1;
  }
  .callToAction .text > :is(div:last-of-type:not(:only-child), p) {
    grid-row: 1/-1;
    grid-column: 1;
    background: var(--theme-gradient);
    color: white;
    padding: var(--box-padding-large);
    margin-block: calc(-1 * var(--box-padding-large));
    margin-inline: calc(-1 * var(--box-padding-large) - 1px);

    clip-path: var(--clip, circle(0% at center));
    transition: all var(--speed-slower) var(--transition-out-quartic);
    will-change: clip-path;
    user-select: none;
    visibility: var(--visibility, hidden);
  }
  .callToAction:hover {
    --clip: circle(75% at center);
    --visibility: visible;
  }
  .component-call-to-action {
    grid-template-areas: "stack" "button";
    grid-template-rows: 1fr min-content;
  }
}
@supports (container-type: inline-size) {
  .callToAction {
    container-type: inline-size;
    container-name: callToAction;
  }
}
@container callToAction (min-width: 40em) {
  .callToAction .action-link {
    display: none;
  }
  .callToAction .text > :is(div:last-of-type:not(:only-child), p) {
    --clip: circle(75% at center);
    --visibility: visible;
    margin-inline: calc(-1 * var(--box-padding-large) - 1px);
    margin-inline-start: 0;
    background: var(--theme-gradient);
    color: white;
    padding: var(--box-padding-large);
    margin-block: calc(-1 * var(--box-padding-large));
  }
  .component-call-to-action {
    display: flex;
  }
}
.feature-slide-up {
  display: flex;
  flex-direction: column;
  border-radius: var(--border-radius-large) var(--border-radius-large) 0 0;
  background: var(--theme-gradient);
  container-type: inline-size;
  overflow: hidden;
}
.feature-slide-up .image {
  aspect-ratio: 1.2;
  overflow: hidden;
}
.feature-slide-up .image img {
  object-fit: cover;
  block-size: 100%;
  inline-size: 100%;
}
.feature-slide-up .visible-content {
  padding: var(--box-padding-large);
  line-height: 1.4;
}
.feature-slide-up .visible-title {
  margin: 0;
  font-size: var(--text-size-large);
  line-height: 1.4;
}
.feature-slide-up .description {
  padding-inline: var(--box-padding-large);
  padding-block-end: var(--box-padding-large);
}
.feature-slide-up .description ul {
  margin-inline: 1.2rem;
}

@media (pointer: fine) {
  .feature-slide-up {
    display: grid;
    grid-template-rows: auto 1fr;
    grid-template-columns: 1fr;
    block-size: 100%;
    isolation: isolate;
    position: relative;
  }
  .feature-slide-up::before {
    content: "";
    inset: 0;
    position: absolute;
    background: var(--theme-gradient);
    opacity: 0.95;
    translate: 0 var(--ee, 100%);
    z-index: 0;
    transition: translate var(--speed-slow) var(--transition-in-out-quadratic);
  }
  .feature-slide-up .image {
    grid-column: 1;
    grid-row: 1/2;
    z-index: -1;
  }
  .feature-slide-up .visible-content {
    z-index: 1;
    grid-column: 1;
    grid-row: 2/-1;
    transition: translate var(--speed-slow) var(--transition-in-out-quadratic);
    box-shadow: 0 -3px 4px rgba(0, 0, 0, 0.3);
    position: relative;
    padding-inline-end: calc(var(--box-padding-large) + 3rem);
  }
  .feature-slide-up .visible-content::after {
    content: "+";
    position: absolute;

    inset-inline-end: var(--box-padding-large);
    inset-block-end: 50%;
    transform: translateY(-50%);
    line-height: 0;
    font-weight: var(--text-weight-regular);
    font-size: 3rem;
    transition: 0.5s ease-in-out;
  }
  .feature-slide-up .description {
    z-index: 1;
    translate: 0 150%;
    grid-column: 1;
    grid-row: 1/-1;
    clip-path: polygon(0 100%, 100% 100%, 100% 100%, 0 100%);
    transition: translate var(--speed-slow) var(--transition-in-out-quadratic);
    padding-inline-end: var(--box-padding);
    overflow: auto;
    container-type: size;
  }
  .feature-slide-up .description > div {
    padding-bottom: var(--box-padding-large);
    max-block-size: calc(var(--box-padding-large) + var(--ee, 100%) - var(--border-width-thinner));
    overflow: auto;
  }
  .feature-slide-up:is(:hover, :focus-visible)::before {
    translate: 0 0;
  }
  .feature-slide-up:is(:hover, :focus-visible) .visible-content {
    translate: 0 calc(-1 * var(--ee, 0));
  }
  .feature-slide-up:is(:hover, :focus-visible) .visible-content::after {
    rotate: 45deg;
    color: transparent;
  }
  .feature-slide-up:is(:hover, :focus-visible) .description {
    translate: 0 calc(100% - var(--ee, 100%));
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
  }
}
@supports (container-type: inline-size) {
  .careerProfileItem {
    --ee: 83.3333cqi;
  }
}

.ctaImageBox {
  box-shadow: var(--shadow-standard);
}

.cta-image-box {
  display: grid;
  grid-template-areas: "stack";
  position: relative;
  align-items: end;
  justify-items: center;
  text-decoration: none;
  isolation: isolate;
  border-radius: var(--border-radius-small);
  block-size: 100%;
  overflow: hidden;
}
.cta-image-box :where(picture, img, div) {
  block-size: 100%;
}
.cta-image-box img {
  transition: transform var(--speed-standard) var(--transition-out-quartic);
}
.cta-image-box:hover img {
  transform: scale(1.04);
}
.cta-image-box button {
  grid-area: stack;
  margin-bottom: var(--gap);
  z-index: 2;

  --bg-main-hover: white;
  --text-white: var(--text-dark);
}

.cta-image-box__image-container {
  grid-area: stack;
  position: relative;
}

.cta-image-box__image-overlay {
  z-index: 1;
  inline-size: 100%;
  position: absolute;
}
@property --dc-num {
  syntax: "<integer>";
  initial-value: 0;
  inherits: true;
}
@property --dc-from {
  syntax: "<integer>";
  initial-value: 0;
  inherits: true;
}
@property --dc-delay {
  syntax: "<time>";
  initial-value: 0s;
  inherits: true;
}
@property --dc-duration {
  syntax: "<time>";
  initial-value: 3s;
  inherits: true;
}
.dynamic-counter {
  aspect-ratio: 1;
  margin-inline: auto;
  border-radius: var(--border-radius-large);
  background: var(--theme-gradient);
  display: grid;
  place-content: center;
  font-size: var(--text-size-callout);
  font-weight: var(--text-weight-bold);
  inline-size: min(var(--icon-size-huge), 100%);
  color: white;
  box-shadow: var(--is-dark, var(--shadow-standard));
}
.dynamic-counter[data-size="smaller"] {
  font-size: calc(0.75 * var(--text-size-callout));
}
.dynamic-counter + p {
  text-align: center;
}

@supports (counter-reset: num 0) {
  .dynamic-counter[data-type="integer"] {
    transition-timing-function: cubic-bezier(0.46, 0.03, 0.25, 0.98);
    transition-duration: var(--dc-duration, 3s);
    transition-property: --dc-num;
    transition-delay: var(--dc-delay, 0s);
    counter-reset: dc-num var(--dc-num);
    will-change: counter-reset;
  }
  .dynamic-counter[data-type="integer"] span::after {
    content: attr(data-before) counter(dc-num) attr(data-after);
  }
  .dynamic-counter[data-type="integer"] span > span {
    display: none;
  }
  .dynamic-counter[data-type="integer"][data-visible="0"] {
    transition-duration: var(--speed-standard);
    transition-delay: 0s;
    --dc-num: var(--dc-from, 0) !important;
    counter-reset: dc-num var(--dc-num);
  }
}
/* disable in safari */
@supports (-webkit-appearance: none) and (stroke-color: transparent) {
  .dynamic-counter[data-type="integer"] {
    transition-duration: unset !important;
    transition-delay: unset !important;
  }
}
@supports (container-type: inline-size) {
  .dynamicCounter {
    --text-size-callout: clamp(2rem, 22cqi, 5rem);
    container-type: inline-size;
  }
}
.featureItem {
  display: grid;
}

.feature-item {
  display: flex;
  flex-wrap: wrap;
  gap: var(--gap-small);
  border-style: solid;
  border-width: var(--border-width-tiny);
  border-image-slice: 1;
  border-image-source: var(--theme-gradient);
  padding: var(--box-padding-large);
}
.feature-item[data-icon-position="top"] {
  flex-direction: column;
  text-align: center;
}
.feature-item[data-icon-position="top"] .feature-item__icon {
  inline-size: var(--icon-size-large);
  block-size: var(--icon-size-large);
  margin: 0 auto;
}
.feature-item[data-exclude-border] {
  border: unset;
  padding: 0;
}

.feature-item__icon {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  inline-size: var(--icon-size-larger);
  block-size: var(--icon-size-larger);
}

.feature-item__content {
  display: flex;
  flex-direction: column;
  gap: var(--gap-small);
}

.feature-item__text {
  flex: 1;
}

.feature-item__link {
  padding-block-end: var(--gap);
  font-size: 87.5%;
}
.feature-item__link .feature-item__link a {
  --btn-padding-block: 0.35rem;
  --btn-padding-inline: 1rem;
  --bg-main-hover: transparent;
}
.feature-item-v2 {
  padding: var(--gap-small);
}
.feature-item-v2:hover a .feature-item-v2__image {
  background: linear-gradient(rgb(var(--bg-main-rgb) / 0.5), rgb(var(--bg-main-rgb) / 0.5)) padding-box,
    var(--theme-gradient) border-box;
}
.feature-item-v2:hover a span {
  background-size: 100% 0.125rem;
}

.feature-item-v2__content {
  text-decoration: none;
  margin: 0;
  position: relative;

  display: block;
}

.feature-item-v2__image {
  display: block;
  inline-size: var(--icon-size-larger);
  block-size: var(--icon-size-larger);
  margin: 0 auto var(--gap-tiny);
  background: var(--gradient-border);
  border: var(--icon-border-width) solid transparent;
  border-radius: 100vmax;

  display: grid;
  place-items: center;
}

.feature-item-v2__name {
  font-weight: var(--text-weight-medium);
  display: block;
  text-align: center;
  background-size: 0% 0.125rem;
  background-position: 50% 100%;
  background-repeat: no-repeat;
  background-image: var(--theme-gradient-lighter);
  transition: background var(--speed-standard) var(--transition-out-quartic);
}
.component-features {
  container-type: inline-size;
  container-name: featurescontainer;
}
.component-features .text-container {
  margin-block-end: var(--gap-dynamic-large);
}

.features-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(20rem, 1fr));
  gap: var(--gap) var(--gap-large);
}
.features-list .featureItem:nth-child(n + 2) {
  border-block-start: var(--border-hard);
  padding-block-start: var(--gap);
}

/* width breakpoints are number of columns multiplied by 20rem + 4rem (gap-large) */
@container featurescontainer (min-width: 44rem) {
  .features-list .featureItem:nth-child(-n + 2) {
    border-block-start: unset;
    padding-block-start: unset;
  }
}
@container featurescontainer (min-width: 68rem) {
  .features-list .featureItem:nth-child(-n + 3) {
    border-block-start: unset;
    padding-block-start: unset;
  }
}
@container featurescontainer (min-width: 92rem) {
  .features-list .featureItem:nth-child(-n + 4) {
    border-block-start: unset;
    padding-block-start: unset;
  }
}
.features-v2__list {
  display: flex;
  flex-wrap: wrap;
}

.features-v2__description {
  margin-block-end: var(--gap-large);
}

.features-v2__image {
  display: none;
}

.featureItemv2 {
  padding: var(--box-padding);
  flex: 0 0 33.3333%;
}

.featureItemv2:first-child:nth-last-child(1) {
  flex: 1;
}

.featureItemv2:first-child:nth-last-child(2),
.featureItemv2:first-child:nth-last-child(2) ~ .featureItemv2 {
  flex: 0 0 50%;
}
.featureItemv2:first-child:nth-last-child(3),
.featureItemv2:first-child:nth-last-child(3) ~ .featureItemv2,
.featureItemv2:first-child:nth-last-child(6),
.featureItemv2:first-child:nth-last-child(6) ~ .featureItemv2,
.featureItemv2:first-child:nth-last-child(9),
.featureItemv2:first-child:nth-last-child(9) ~ .featureItemv2 {
  flex: 0 0 33.3333%;
}
.featureItemv2:first-child:nth-last-child(4),
.featureItemv2:first-child:nth-last-child(4) ~ .featureItemv2,
.featureItemv2:first-child:nth-last-child(7),
.featureItemv2:first-child:nth-last-child(7) ~ .featureItemv2,
.featureItemv2:first-child:nth-last-child(8),
.featureItemv2:first-child:nth-last-child(8) ~ .featureItemv2,
.featureItemv2:first-child:nth-last-child(11),
.featureItemv2:first-child:nth-last-child(11) ~ .featureItemv2 {
  flex: 0 0 25%;
}
.featureItemv2:first-child:nth-last-child(5),
.featureItemv2:first-child:nth-last-child(5) ~ .featureItemv2,
.featureItemv2:first-child:nth-last-child(10),
.featureItemv2:first-child:nth-last-child(10) ~ .featureItemv2,
.featureItemv2:first-child:nth-last-child(12),
.featureItemv2:first-child:nth-last-child(12) ~ .featureItemv2 {
  flex: 0 0 20%;
}

@media only screen and (max-width: 87em) {
  .featureItemv2:first-child:nth-last-child(5),
  .featureItemv2:first-child:nth-last-child(5) ~ .featureItemv2 {
    flex: 0 0 33.3333333%;
  }
  .featureItemv2:first-child:nth-last-child(10),
  .featureItemv2:first-child:nth-last-child(10) ~ .featureItemv2,
  .featureItemv2:first-child:nth-last-child(12),
  .featureItemv2:first-child:nth-last-child(12) ~ .featureItemv2 {
    flex: 0 0 25%;
  }
}
@media only screen and (max-width: 62.5em) {
  .featureItemv2:first-child:nth-last-child(4),
  .featureItemv2:first-child:nth-last-child(4) ~ .featureItemv2 {
    flex: 0 0 50%;
  }
  .featureItemv2:first-child:nth-last-child(7),
  .featureItemv2:first-child:nth-last-child(7) ~ .featureItemv2,
  .featureItemv2:first-child:nth-last-child(8),
  .featureItemv2:first-child:nth-last-child(8) ~ .featureItemv2,
  .featureItemv2:first-child:nth-last-child(10),
  .featureItemv2:first-child:nth-last-child(10) ~ .featureItemv2,
  .featureItemv2:first-child:nth-last-child(12),
  .featureItemv2:first-child:nth-last-child(12) ~ .featureItemv2 {
    flex: 0 0 33.3333%;
  }
}
@media only screen and (max-width: 44em) {
  .featureItemv2 {
    flex: 1 0 50% !important;
  }
}
.flexibleRowContainer {
  margin-block-end: var(--gap-large);
}

.flexible-row-container {
  display: grid;
  grid-auto-flow: dense;
  gap: var(--gap);
  --grid-columns: 1;
  grid-template-columns: repeat(var(--grid-columns, 1), 1fr);
}
.flexible-row-container > * {
  margin: 0;
}

[data-max-items="1"] {
  --grid-columns: 1 !important;
}

[data-max-items="flex"] {
  display: flex;
  gap: var(--gap);
  flex-wrap: wrap;
}
[data-max-items="flex"] > .flexibleRowContainer {
  flex: 1;
}

[data-max-items="1-2"] > :nth-child(even) {
  grid-column: span min(2, var(--grid-columns) - 1);
}

[data-max-items="2-1"] > :nth-child(odd) {
  grid-column: span min(2, var(--grid-columns) - 1);
}

[data-max-items="1-3"] > :nth-child(even) {
  grid-column: span min(3, max(1, var(--grid-columns) - 1));
}

[data-max-items="3-1"] > :nth-child(odd) {
  grid-column: span min(3, max(1, var(--grid-columns) - 1));
}

/* ------------------------------------------------------ */
/* container queries are preferred, with browser support */
/* ------------------------------------------------------ */
@supports (container-type: inline-size) {
  .flexibleRowContainer {
    container-type: inline-size;
    container-name: flexcontainer;
  }
}
@container flexcontainer (min-width: 25em) {
  [data-max-items="5"],
  [data-max-items="4"],
  [data-max-items="4321"],
  [data-max-items="3"],
  [data-max-items="2"] {
    --grid-columns: 2;
  }
  :is([data-max-items="5"], [data-max-items="4"], [data-max-items="3"], [data-max-items="2"]):not(
      :has(> :nth-child(2))
    ) {
    --grid-columns: 1;
  }
}
@container flexcontainer (min-width: 37em) {
  [data-max-items="5"],
  [data-max-items="4321"],
  [data-max-items="3"] {
    --grid-columns: 3;
  }
  :is([data-max-items="2"], [data-max-items="3"], [data-max-items="4"], [data-max-items="5"]):not(
      :has(> :nth-child(3))
    ) {
    --grid-columns: 2;
  }
  [data-max-items="1-2"],
  [data-max-items="2-1"],
  [data-max-items="4"],
  [data-max-items="2"] {
    --grid-columns: 2;
  }
  [data-max-items]:not(:has(> :nth-child(2))) {
    --grid-columns: 1;
  }

  [data-max-items="1-3"],
  [data-max-items="3-1"] {
    --grid-columns: 1;
  }
}
@container flexcontainer (min-width: 50em) {
  [data-max-items="1-3"],
  [data-max-items="3-1"],
  [data-max-items="1-2"],
  [data-max-items="2-1"] {
    --grid-columns: 3;
  }
  :is([data-max-items="4"], [data-max-items="3"], [data-max-items="2"]):not(:has(> :nth-child(2))) {
    --grid-columns: 1;
  }
}
@container flexcontainer (min-width: 62em) {
  [data-max-items="5"] {
    --grid-columns: 5;
  }
  :is(
      [data-max-items="1-3"],
      [data-max-items="3-1"],
      [data-max-items="4"],
      [data-max-items="4321"],
      [data-max-items="5"]:not(:has(> :nth-child(5)))
    ) {
    --grid-columns: 4;
  }
  [data-max-items="3"],
  :is([data-max-items="4"], [data-max-items="5"]):not(:has(> :nth-child(4))),
  :is([data-max-items="1-2"], [data-max-items="2-1"], [data-max-items="1-3"], [data-max-items="3-1"]):not(
      :has(> :nth-child(3))
    ) {
    --grid-columns: 3;
  }
  :is([data-max-items="3"], [data-max-items="4"], [data-max-items="5"]):not(:has(> :nth-child(3))) {
    --grid-columns: 2;
  }
  [data-max-items]:not(:has(> :nth-child(2))) {
    --grid-columns: 1;
  }
}
/* ---------------------------------------------------- */
/* fall back if container queries are NOT supported */
/* ---------------------------------------------------- */
@supports not (container-type: inline-size) {
  @media only screen and (max-width: 44em) {
    [data-max-items="5"] {
      --grid-columns: 2;
    }
  }
  @media only screen and (min-width: 44em) {
    [data-max-items="5"],
    [data-max-items="1-2"],
    [data-max-items="2-1"] {
      --grid-columns: 3;
    }
    [data-max-items="4"],
    [data-max-items="3"],
    [data-max-items="2"] {
      --grid-columns: 2;
    }

    [data-max-items] [data-max-items="5"] {
      --grid-columns: 5;
    }
    [data-max-items] [data-max-items="4"] {
      --grid-columns: 4;
    }
    [data-max-items] [data-max-items="3"],
    [data-max-items] [data-max-items="1-2"],
    [data-max-items] [data-max-items="2-1"] {
      --grid-columns: 3;
    }
    [data-max-items] [data-max-items="2"] {
      --grid-columns: 2;
    }
    [data-max-items="1-2"] > :nth-child(even) {
      grid-column: span min(2, var(--grid-columns));
    }
    [data-max-items="2-1"] > :nth-child(odd) {
      grid-column: span min(2, var(--grid-columns));
    }
  }
  @media only screen and (min-width: 71em) {
    [data-max-items="5"] {
      --grid-columns: 5;
    }
    [data-max-items="4"] {
      --grid-columns: 4;
    }
    [data-max-items="3"],
    [data-max-items="1-2"],
    [data-max-items="2-1"] {
      --grid-columns: 3;
    }
    [data-max-items="2"] {
      --grid-columns: 2;
    }
  }

  @media only screen and (max-width: 62.5em) {
    [data-max-items="2"]:has(.wistiaVideo, .video) {
      --grid-columns: 1;
    }
  }
}
.gradient-border {
  display: block;
  color: var(--text-white);
  text-decoration: none;

  container-type: inline-size;

  block-size: 100%;
}
.gradient-border:hover .gradient-border__content {
  border-image-source: var(--theme-gradient-lighter);
}
.gradient-border:hover .gradient-border__content:hover span {
  background-size: 100% var(--arrow-width, 0.125rem);
}
.gradient-border:hover .gradient-border__content:hover::after {
  transform: translate(0.25rem, -100%) rotate(-45deg);
}
.gradient-border u {
  text-decoration: underline;
}

.gradient-border__content {
  padding: var(--box-padding-large);
  block-size: 100%;
  background-color: var(--bg-white-if-light);
  border: var(--border-width) solid;
  border-image-slice: 1;
  border-image-source: var(--theme-gradient);
}

/* only apply this if the gradient border is a valid href, not a div */
/* gradient border reverts to a div if no HREF is specified in CMS */
a.gradient-border .gradient-border__content::after {
  display: block;
  position: absolute;
  content: "";
  inline-size: 0.5rem;
  block-size: 0.5rem;
  inset-block-end: calc(0.5rem + var(--border-width));
  inset-inline-end: calc(1rem + var(--border-width));
  border: solid currentColor;
  border-width: 0 var(--arrow-width, 0.125rem) var(--arrow-width, 0.125rem) 0;
  transform: translate(0, -100%) rotate(-45deg);
  transition: transform var(--speed-standard) var(--transition-out-quadratic);
}
.hero-banner {
  display: grid;
  grid-template: "content image" 1fr/1.5fr 1fr;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
  background: var(--theme-gradient);
  --overlap-top: 8rem;
  margin-block: var(--gap-large) 0;
  margin-inline: var(--inline-reverse-margin);
  padding-inline: var(--inline-reverse-padding);
}
.hero-banner[data-align="right"] {
  grid-template: "image content" 1fr/1fr 1.5fr;
}
.hero-banner[data-align="right"] :is(.hero-banner__image__overlay, .hero-banner__image_bg) {
  margin-inline-end: 0;
  margin-inline-start: var(--inline-reverse-margin);
}
.hero-banner .sub-heading + h2 {
  margin-block-start: 0;
}

.hero-banner__image__overlay,
.hero-banner__image_bg {
  user-select: none;
  pointer-events: none;
  block-size: calc(100% + var(--overlap-top));
  margin-block-start: calc(-1 * var(--overlap-top));
  margin-inline-end: var(--inline-reverse-margin);
}

.hero-banner__image__overlay {
  grid-area: image;
  display: grid;
  place-items: center;
  position: relative;
}
.hero-banner__image__overlay div {
  position: absolute;
  inset: 0;
  overflow: hidden;
}
.hero-banner__image__overlay img {
  margin-inline: auto;
  inline-size: clamp(10rem, 100%, 30rem);
  filter: drop-shadow(0.25rem 0.25rem 0.5rem rgba(0, 0, 0, 0.5));
}

.hero-banner__image_bg {
  grid-area: image;
  overflow: hidden;
  position: relative;
}
.hero-banner__image_bg div {
  position: absolute;
  inset: 0;
}
.hero-banner__image_bg img {
  object-fit: cover;
  block-size: 100%;
  object-position: var(--bg-align);
}

.hero-banner-content {
  grid-area: content;
  padding-block: clamp(3.5rem, 7vw, 6rem);
  color: white;
}
.hero-banner-content .sub-content {
  margin-block: 2rem;
}
.hero-banner-content .contents {
  margin-block-start: var(--gap-small);
}
.hero-banner-content .contents:not(:has(:nth-child(1))) {
  display: none;
}

@media only screen and (max-width: 40em) {
  .hero-banner {
    grid-template-columns: 1fr;
    grid-template-rows: 1fr minmax(10rem, auto);
    grid-template-areas: "content" "image";
  }
  .hero-banner__image_bg {
    clip-path: none;
    grid-row: 2;
    grid-column: 1;
    margin-top: 2rem;
  }
  .hero-banner__image__overlay img {
    inline-size: clamp(10rem, 50%, 30rem);
  }
}
:is(.oneColumnContent):has(+ .hero) {
  inline-size: 66%;
}

:is(.angledContainer):has(+ .hero) {
  margin-block-end: 8rem;
}

.hero-slide {
  margin-block-end: var(--gap-large);
}

.hero-feature-content .text-image-with-cta {
  --o: 100%;
}
.hero-feature-content div.contents {
  display: grid;
  gap: 2rem;
}
.hero-feature-content > :not(div.contents) {
  display: grid;
  gap: 1rem;
  margin-bottom: var(--gap);
}

.hero-feature-image {
  display: none;
}

@media (max-width: 40em) {
  .hero-feature-bg {
    display: none;
  }
}
@media (min-width: 40em) {
  .hero-feature {
    display: grid;
    --excess: clamp(0rem, 4vw, 4rem);
    grid-template-columns: var(--excess) 0.5fr 1fr var(--excess);
    align-items: start;
  }
  .hero-feature-content {
    grid-column: 2/4;
    grid-row: 1;
    display: grid;
    gap: 1rem;
    grid-template-columns: 1fr 1fr;
  }
  .hero-feature-content > :not(div.contents) {
    grid-column: 1;
    grid-row: 1;
    position: sticky;

    inset-block-start: 6rem;
    block-size: fit-content;
    padding: var(--box-padding);
    margin-block-start: var(--gap-large);
    background-color: rgb(var(--bg-main-rgb) / 0.6);
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
  }
  .hero-feature-content div.contents {
    grid-column: 2;
    grid-row: 1;
    padding-block-start: calc(var(--gap-large) + var(--box-padding));
  }
  .hero-feature-bg {
    position: sticky;
    top: 0;
    grid-column: 3/-1;
    grid-row: 1;
  }
}
@property --a {
  syntax: "<integer>";
  inherits: false;
  initial-value: 0;
}
@property --b {
  syntax: "<integer>";
  inherits: false;
  initial-value: 0;
}
@property --offset1 {
  syntax: "<number>";
  inherits: false;
  initial-value: 0;
}
@property --offset2 {
  syntax: "<number>";
  inherits: false;
  initial-value: 0.3;
}
.hero-slide-v2 {
  display: grid;
  --overflow: clamp(4rem, 12vw, 12rem);
  padding-block-end: var(--overflow);
  margin-block-end: calc(-1 * var(--overflow) + 4rem);
  min-width: 100%;
}

:where(.hero-carousel-item) {
  --theme: rgb(141 31 154);
}

.hero-carousel-item {
  display: grid;
  align-items: center;
  grid-template: "content image" 1fr/1fr 1fr;
  margin-inline: var(--inline-reverse-margin);
  padding-inline: var(--inline-reverse-padding);
  --blue: 3 30 82;
  --orange: 248 98 2;
  --purple: 141 31 154;
  background: radial-gradient(
      calc(31vw - 4vw * var(--offset1)) 50% at calc(16% - 10% * var(--mouse-x) + var(--offset2) * 15%)
        calc(100% - var(--offset1) * 10%) in srgb,
      rgb(var(--blue) / 58%) 20%,
      rgb(var(--blue) / 0)
    ),
    radial-gradient(
      calc(45vw + 10vw * (1 - var(--mouse-x)) + var(--offset1) * var(--offset2) * 27vw)
        calc(37% + 10% * (1 - var(--mouse-x))) at calc(10% - 5% * var(--mouse-x)) 0% in srgb,
      rgb(var(--blue) / 60%) 0%,
      rgb(var(--blue) / 0)
    ),
    radial-gradient(23vw 60% at 41% 8% in srgb, rgb(var(--blue) / 35%) 0%, rgb(var(--blue) / 0)),
    radial-gradient(
      circle clamp(20rem, 33vw + var(--offset2) * 8vw, 41rem) at 90% 50% in srgb,
      rgb(var(--orange)) 20%,
      rgb(var(--orange) / 0)
    ),
    radial-gradient(
      circle 17vw at calc(60% - 10% * (0.5 - var(--mouse-x))) calc(10% + 5% * (var(--offset1) - var(--offset2))) in srgb,
      rgba(251, 31, 154, 0.5) 20%,
      rgb(var(--purple) / 0)
    ),
    radial-gradient(
      19vw at calc(90% - 10% * (0.5 - var(--mouse-x)) * var(--offset1)) calc(20% * var(--mouse-y)) in srgb,
      rgb(251, 31, 154) 50%,
      rgb(var(--purple) / 0)
    ),
    linear-gradient(in srgb, rgb(var(--purple)), rgb(var(--purple)));
}

@media only screen and (orientation: landscape) {
  .hero-carousel-item {
    min-block-size: calc(100vh - 4rem);
  }
}
@supports (-webkit-appearance: none) and (stroke-color: transparent) {
  .hero-carousel-item {
    animation-name: unset;
  }
}
@keyframes shift-offset {
  0% {
    --offset1: 0;
    --offset2: 0.3;
  }
  25% {
    --offset1: 1;
    --offset2: 0;
  }
  50% {
    --offset1: 0.6;
    --offset2: 0.2;
  }
  75% {
    --offset1: 0.3;
    --offset2: 0.8;
  }
  100% {
    --offset1: 0;
    --offset2: 0.3;
  }
}
.hero-carousel-item__bg {
  grid-area: image;
  display: grid;
  position: relative;
  background-image: none !important;
  block-size: calc(100% + var(--overflow));
  margin-block-end: calc(var(--overflow) * -1);
  margin-inline-end: var(--inline-reverse-margin);
}
.hero-carousel-item__bg img {
  pointer-events: none;
  user-select: none;
  block-size: 100%;
  inline-size: 100%;
  object-fit: cover;
  object-position: left;
  mix-blend-mode: overlay;
}
.hero-carousel-item__bg > div {
  display: contents;
}
.hero-carousel-item__bg span {
  display: none;
}

.hero-container__video {
  overflow: hidden;
  display: flex;
  flex-direction: column;
  align-items: center;
  pointer-events: none;
}
.hero-container__video iframe {
  aspect-ratio: 16/9;
  block-size: 100%;
  object-fit: cover;
}

.hero-carousel-item__content-wrapper {
  grid-area: content;
  padding-block: clamp(4rem, 10vw, 8rem);
}
.hero-carousel-item__content-wrapper > div {
  max-width: 70ch;
  margin-right: auto;
}

.hero-carousel-item__title,
.vendor-header__title {
  --length: 34;
  --cLength: var(--length);

  font-size: calc(var(--text-size-h1) * clamp(0.75, (100 - (var(--cLength) - 30)) / 100 + 0.1, 1.2));
}
.hero-carousel-item__title:has(strong),
.vendor-header__title:has(strong) {
  --cLength: calc(var(--length) - 17);
}

.hero-carousel-item__description {
  font-size: var(--text-size-larger);
}

@media only screen and (max-width: 44em) {
  .hero-carousel-item {
    grid-template-columns: 2fr 1fr;
  }
}
.introAndQuicklinks {
  margin-block-end: var(--gap-large);
}

.intro__inner {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
  gap: var(--gap-large);
}

.intro__content {
  flex: 1;
  min-inline-size: 20ch;
}

.intro__quick-links {
  padding: var(--box-padding-large);
  border: 0.1875rem solid var(--theme-green);
  border-radius: var(--border-radius-large);
  background-color: rgb(var(--bg-main-rgb) / 0.8);
  -webkit-backdrop-filter: blur(var(--blur-medium));
  backdrop-filter: blur(var(--blur-medium));
  margin-block-end: var(--gap);
}

.quick-links__title {
  font-size: var(--text-size-h3);
  margin-bottom: var(--gap-small);
}

.quick-links__list {
  min-inline-size: 1rem;
  display: grid;
  gap: var(--gap-small);
}
.quick-links__list .link:not(.partnerCentralLink) a {
  display: block;
  padding: var(--padding-ch);
  padding-left: 2ch;

  background-color: rgb(var(--bg-inverse-rgb) / 0.1);
  border-radius: var(--border-radius-small);
  text-decoration: none;
  overflow: hidden;
  position: relative;
  width: fit-content;
  max-width: 24ch;
}
.quick-links__list .link:not(.partnerCentralLink) a::before {
  display: block;
  position: absolute;
  content: "";
  inline-size: 0.5ch;
  block-size: 0.5ch;
  top: 1.125ch;
  left: 0.8ch;
  border: solid currentColor;
  border-width: 0 0.125rem 0.125rem 0;
  transform: rotate(45deg);
  transition: transform var(--speed-standard) var(--transition-out-quadratic);
}
.quick-links__list .link:not(.partnerCentralLink) a::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  block-size: 0.125rem;
  background-size: 0% 0.125rem;
  background-position: calc(var(--rtl, 0) * -100%) 100%;
  background-repeat: no-repeat;
  background-image: var(--theme-gradient-lighter);
  transition: background var(--speed-slow) ease;
}
.quick-links__list .link:not(.partnerCentralLink) a:where(:hover, :focus-visible)::before {
  transform: translateY(0.125ch) scale(1.1) rotate(45deg);
}
.quick-links__list .link:not(.partnerCentralLink) a:where(:hover, :focus-visible)::after {
  background-size: 100% 0.125rem;
}

@media only screen and (max-width: 44em) {
  .intro__quick-links {
    inline-size: 100%;
  }
  .quick-links__list {
    display: block;
    columns: 2 18ch;
    column-gap: var(--gap-large);
    padding-block: var(--gap);
    column-rule: var(--border-soft);
  }
  .quick-links__list .link:not(:last-of-type) {
    margin-block-end: var(--gap-small);
  }
  .quick-links__list .link a {
    max-width: unset;
  }
}
/* * adds extra margin if the news showcase is part of the normal page flow */
:where(.oneColumnContent, .newsShowcase) + :where(.newsShowcase, .scroller, .flexibleRowContainer) {
  margin-block-start: var(--gap-large);
}

:is(.scroller, .flexibleRowContainer) :is(.newsShowcase, .news-showcase, .news-showcase__inner) {
  margin-block-start: unset;
}
:is(.scroller, .flexibleRowContainer) :is(.news-showcase, .news-showcase__inner) {
  block-size: 100%;
}

:is(main, .content-container) > div > .newsShowcase .news-showcase__image-container {
  margin-inline-start: var(--inline-reverse-margin);
}
:is(main, .content-container) > div > .newsShowcase .news-showcase__content-container {
  flex: 0 1 calc(100% - var(--flex-ns));
}

.news-showcase__inner {
  display: flex;
  gap: var(--gap);
  --flex-ns: 50%;
  block-size: 100%;
}

@media only screen and (min-width: 50em) {
  [data-width="75"] .news-showcase__inner {
    --flex-ns: 75%;
  }
  [data-width="66"] .news-showcase__inner {
    --flex-ns: 66.66666%;
  }
  [data-width="50"] .news-showcase__inner {
    --flex-ns: 50%;
  }
  [data-width="33"] .news-showcase__inner {
    --flex-ns: 33.333%;
  }
  [data-width="25"] .news-showcase__inner {
    --flex-ns: 25%;
  }
  [data-width="20"] .news-showcase__inner {
    --flex-ns: 20%;
  }
  [data-width="12"] .news-showcase__inner {
    --flex-ns: 12%;
  }
}
[data-reduce-margin] .news-showcase__inner {
  gap: var(--gap-small);
}

[data-image-position="right"] .news-showcase__inner {
  flex-direction: row-reverse;
}

.news-showcase__image-container {
  flex: 1 1 calc(var(--flex-ns));
}

[data-remove-border]:is([data-display-style="background"], [data-display-style="inline"])
  .news-showcase__image-container {
  border-width: 0;
}
[data-remove-border]:is([data-display-style="background"], [data-display-style="inline"])
  .news-showcase__image-container
  img {
  border-width: 0;
}

[data-display-style="inline"] .news-showcase__image-container img {
  inline-size: 100%;
}

/* get rid of the image when the image should be the background style */
[data-display-style="background"] .news-showcase__image-container {
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  background-image: var(--bg-img);
}
[data-display-style="background"] .news-showcase__image-container img {
  display: none;
}

[data-vertically-center] .news-showcase__inner {
  align-items: center;
}
[data-vertically-center] .news-showcase__content-container {
  padding-block: var(--gap);
}

.news-showcase__content-container {
  flex: 1 1 calc(100% - var(--flex-ns) + var(--border-width-thinner));
  display: flex;
  flex-wrap: wrap;
  gap: var(--gap-small);
  align-items: flex-start;
  align-content: flex-start;
}
.news-showcase__content-container > *:not(a) {
  flex: 1 0 100%;
}
.news-showcase__content-container > a {
  height: fit-content;
}
.news-showcase__content-container .news-showcase__cta {
  margin-block-start: var(--gap-small);
}

.news-showcase__author {
  display: flex;
  align-items: center;
  padding-block-end: var(--gap-small);
}

h2 ~ .news-showcase__author {
  border-block-start: var(--border-soft);
  padding-block-start: var(--gap-small);
}

.news-showcase__author:has(~ h3) {
  border-block-end: var(--border-soft);
  padding-block-end: var(--gap-small);
}

.news-showcase__author-image {
  overflow: hidden;
  inline-size: var(--icon-size-standard);
  block-size: var(--icon-size-standard);
  border-radius: 50%;
  flex-shrink: 0;
  margin-inline-end: var(--gap-small);
}

.news-showcase__author-name {
  font-weight: var(--text-weight-bold);
  margin: 0;
}

.news-showcase__author-title {
  margin: 0;
}

@media only screen and (max-width: 31em) {
  [data-mobile-hide-image]:not([data-media-mode="video"]) .news-showcase__image-container {
    display: none;
  }
}
@media only screen and (max-width: 50em) {
  .news-showcase:not([data-mobile-no-stack]) .news-showcase__inner {
    flex-direction: column;
  }
  [data-display-style="background"] .news-showcase__image-container {
    max-block-size: 50vmax;
  }
  [data-display-style="background"] .news-showcase__image-container img {
    opacity: 0;
    display: block;
  }
}
.oneColumnContent {
  transform-origin: left center;
}

:dir(rtl) .oneColumnContent {
  transform-origin: right center;
}

/* add extra padding if one component follows another */
:where(.oneColumnContent + .oneColumnContent) {
  margin-block-start: var(--gap);
}

/* add consistent full height to elements if inside scroller */
.mainContainer:not(.editmode) .scroller :where(.oneColumnContent, .oneColumnContent .tile) {
  block-size: 100%;
}

.one-column-content {
  display: flex;
  flex-direction: column;
  gap: var(--gap);
  block-size: 100%;
}
.one-column-content[data-bg] {
  background-image: var(--bg-img);
  background-size: cover;
  background-position: center;
}
.one-column-content[data-bg] > div {
  padding: var(--box-padding-large);
}
.one-column-content[data-separator-line] {
  margin-block: var(--gap-large);
  border-block-end: var(--border-medium);
}

/* avoid the top margin if the horizontal line is within flex container or scroller */
:is(.flexible-row-container, .scroller) > .oneColumnContent > [data-separator-line] {
  margin-block-start: 0;
}

/* ! css stored in introAndQuicklinks */
.download-resource {
  align-items: center;
  justify-content: space-between;
  block-size: 100%;
  gap: var(--gap-small);
  --icon: var(--icon-download);
}
.download-resource div {
  display: grid;
  grid-template: unset;
  grid-template-areas: "stack";
  place-items: center;
  gap: 0;
  padding: 0;
}
.download-resource div::before {
  content: "";
  aspect-ratio: 1;
  width: var(--icon-size-standard);
  height: var(--icon-size-standard);
  grid-area: stack;
  border: var(--border-width-thin) solid currentColor;
  border-radius: 100vmax;
}
.download-resource div::after {
  content: "";
  aspect-ratio: 1;
  width: var(--icon-size-small);
  height: var(--icon-size-small);
  grid-area: stack;
  background-color: currentColor;
  clip-path: var(--icon);
}
.download-resource p {
  text-align: center;
}

.scroller {
  margin-block-end: var(--gap-large);
}

/* required to ensure sub items are 100% height */
.scroller-component {
  display: grid;
  margin-inline-end: var(--inline-reverse-margin);
  padding-inline-end: var(--inline-reverse-padding);
  container-type: inline-size;
  container-name: scroller;
  --s-item-width: 100%;
}

.scroller-component__slides {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: calc(var(--s-item-width) - var(--peeking-adjust, 0%));
  gap: var(--gap);
  scroll-snap-type: x mandatory;
  overflow-x: auto;
  overflow-y: clip;
  overscroll-behavior-x: contain;
  anchor-name: var(--anchor-name);

  padding-block: 0.5rem var(--gap);
  padding-inline-end: calc(var(--container-padding) + var(--inline-container-excess));
  margin-inline-end: calc(-1 * (var(--container-padding) + var(--inline-container-excess)));
  scroll-padding-inline: var(--container-padding);
  --quarter: calc(25% - 0.75 * var(--gap));
  --third: calc(33.333333% - 0.666666 * var(--gap));
  --half: calc(50% - 0.5 * var(--gap));
  counter-reset: item;
}
@media (prefers-reduced-motion: no-preference) {
  .scroller-component__slides {
    scroll-behavior: smooth;
  }
}
.scroller-component__slides:focus-visible {
  outline-color: rgb(var(--bg-inverse-rgb) / 0.4);
}
.scroller-component__slides[data-max-items="4"] {
  --peeking-adjust: calc(var(--gap) * 0.25);
}
.scroller-component__slides[data-max-items="3"] {
  --peeking-adjust: calc(var(--gap) * 0.3333333);
}
.scroller-component__slides[data-max-items="2"] {
  --peeking-adjust: calc(var(--gap) * 0.5);
}
.scroller-component__slides[data-max-items="1"] {
  --peeking-adjust: var(--gap);
}
.scroller-component__slides[data-max-items="auto"] {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(18rem, 1fr);
}
.scroller-component__slides > * {
  scroll-snap-align: start;
  margin-block: unset;
}
.scroller-component__slides > .tile {
  display: grid;
}

@supports (scroll-marker-group: after) {
  .scroller-component__slides {
    padding-inline: 5vmin;
    padding-block: var(--gap-small);
    margin-block-end: var(--gap-large);
    scroll-padding-inline-end: 5vmin;
    scrollbar-width: none;
    container-type: inline-size scroll-state;
  }
  .scroller-component__slides:before,
  .scroller-component__slides:after {
    content: "";
    display: block;
    inline-size: 85cqi;
  }
  .scroller-component__slides > *:not(.flexibleRowContainer) {
    container-type: scroll-state;
    animation: offscreen-inert linear both;
    animation-timeline: view(x);
  }
  .scroller-component__slides::scroll-button(left),
  .scroller-component__slides::scroll-button(right) {
    position-area: var(--_inner);
  }
  .scroll-markers {
    scroll-marker-group: after;
  }
  .scroll-markers::scroll-marker-group {
    position: absolute;
    position-anchor: var(--anchor-name);
    container: marker-group/inline-size;
    display: grid;
    gap: var(--gap-small);
    place-content: safe center;
    box-sizing: border-box;
    scrollbar-width: none;
    scroll-behavior: smooth;
    inline-size: 100%;
    max-inline-size: 80cqi;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    overscroll-behavior-x: contain;
    padding: 0.3125rem 0.625rem;
    scroll-padding-inline: 0.625rem;
    top: anchor(bottom);
    left: calc(anchor(left) - 10%);
    right: calc(anchor(right) - 10%);
    margin-block: var(--gap-small);
    grid-auto-columns: var(--gap-small);
    grid-auto-flow: column;
    justify-self: center;
  }
  .scroll-markers > *::scroll-marker {
    content: " ";
    color: currentColor;
    scroll-snap-align: center;
    aspect-ratio: 1;
    border: var(--border-medium);
    border-radius: 100vmax;
    cursor: pointer;
    text-decoration: none;
    -webkit-tap-highlight-color: transparent;
    transition: transform var(--speed-standard) ease, outline-offset var(--speed-standard) ease;
    animation: scale-in-and-out linear both;
    animation-timeline: view(x);
    interactivity: auto;
  }
  .scroll-markers > *::scroll-marker:target-current {
    background: currentColor;
  }
  .scroll-markers > *::scroll-marker:not(:active):hover {
    transform: scale(1.25);
  }
  .scroll-markers > *::scroll-marker:focus-visible {
    outline-color: rgb(var(--bg-inverse-rgb) / 0.4);
    outline-offset: 0.125rem;
    outline-style: dotted;
    outline-width: 0.1875rem;
  }
  @media (forced-colors: active) {
    .scroll-markers > *::scroll-marker:target-current {
      background: Highlight;
      border-color: Highlight;
    }
  }
  .scroll-buttons::scroll-button(*) {
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    position: absolute;
    z-index: 1;
    position-anchor: var(--anchor-name);
    font-size: 130%;
    font-family: system-ui;
    inline-size: 2.5rem;
    line-height: 1;
    display: flex;
    place-items: center;
    place-content: center;
    aspect-ratio: 1;
    background: rgb(var(--bg-main-rgb) / 0.6);
    border: var(--border-medium);
    border-radius: 100vmax;
    color: currentColor;
    transform-origin: center;
    transition: transform var(--speed-standard) ease, opacity var(--speed-standard) ease,
      background-color var(--speed-standard) ease, outline-offset var(--speed-standard) ease;
  }
  @media (forced-colors: active) {
    .scroll-buttons::scroll-button(*) {
      background: Canvas;
    }
  }
  .scroll-buttons:where(:not([data-vertical-mode="true"]))::scroll-button(right) {
    --_inner: center span-inline-start;
    --_inner-under: block-end span-inline-start;
    --_inner-over: block-start span-inline-start;
    --_outer: inline-end center;
    --_outer-under: end;
    --_outer-over: block-start inline-end;
    position-area: var(--_outer-under);
    content: "→"/"Scroll Right";
  }
  .scroll-buttons:where(:not([data-vertical-mode="true"]))::scroll-button(left) {
    --_inner: center span-inline-end;
    --_inner-under: block-end span-inline-end;
    --_inner-over: block-start span-inline-end;
    --_outer: inline-start center;
    --_outer-under: block-end inline-start;
    --_outer-over: start;
    position-area: var(--_outer-under);
    content: "←"/"Scroll Left";
  }
  @container (inline-size >= calc(100cqi - 120px)) {
    .scroll-buttons:where(:not([data-vertical-mode="true"]))::scroll-button(right),
    .scroll-buttons:where(:not([data-vertical-mode="true"]))::scroll-button(left) {
      position-area: var(--_inner-under);
    }
  }
  .scroll-buttons::scroll-button(*):not(:disabled):is(:hover, :focus-visible) {
    transform: scale(1.1);
  }
  .scroll-buttons::scroll-button(*):not(:active):focus-visible {
    outline-color: currentColor;
    outline-offset: 0.125rem;
    outline-style: dotted;
    outline-width: 0.1875rem;
  }
  .scroll-buttons::scroll-button(right):not(:disabled):active {
    transform: translate(0.3125rem) scale(0.95);
  }
  .scroll-buttons::scroll-button(left):not(:disabled):active {
    transform: translate(-0.3125rem) scale(0.95);
  }
  .scroll-buttons::scroll-button(up):not(:disabled):active {
    transform: translateY(-0.3125rem) scale(0.95);
  }
  .scroll-buttons::scroll-button(down):not(:disabled):active {
    transform: translateY(0.3125rem) scale(0.95);
  }
  .scroll-buttons::scroll-button(*):disabled {
    opacity: 25%;
    cursor: not-allowed;
  }
  .full-width {
    scroll-padding-inline-start: var(--inline-reverse-padding);
    margin-inline: var(--inline-reverse-margin);
    padding-inline: var(--inline-reverse-padding);
    inline-size: calc(100cqi + 2 * var(--inline-reverse-padding));
  }
  .full-width::scroll-button(left) {
    translate: var(--inline-reverse-padding) 0;
  }
  .full-width::scroll-button(right) {
    translate: var(--inline-reverse-margin) 0;
  }
  .panels .full-width {
    margin-inline-start: unset;
    padding-inline-start: unset;
    inline-size: calc(100% + var(--inline-reverse-padding));
    scroll-padding-inline-start: unset;
  }
  .panels .full-width::scroll-button(left) {
    translate: 0;
  }
  .panels .full-width::scroll-marker-group {
    translate: calc(0.5 * var(--inline-reverse-margin));
  }
  .card-carousel {
    padding-block: var(--gap) var(--gap-large);
    margin-block-end: var(--gap-section);
    scroll-padding-inline-end: 0;
    --bg-white-if-light: var(--bg-main);
    --card-container-range: cover -75cqi contain 10cqi;
  }
  .card-carousel:before,
  .card-carousel:after {
    content: "";
    display: block;
  }
  .card-carousel:before {
    order: 0;
    inline-size: 25cqi;
  }
  .card-carousel:after {
    order: 21;
    inline-size: 90cqi;
  }
  .card-carousel::scroll-button(*) {
    z-index: 21;
  }
  .card-carousel > * {
    scroll-snap-align: start;
    box-shadow: calc(var(--distance-x) * var(--m) + 0.5rem) calc(var(--distance-y) * var(--m)) var(--l)
      rgba(0, 0, 0, 0.2);
    transition: unset;
  }
  .card-carousel > *:nth-child(1) {
    z-index: 20;
  }
  .card-carousel > *:nth-child(2) {
    z-index: 19;
  }
  .card-carousel > *:nth-child(3) {
    z-index: 18;
  }
  .card-carousel > *:nth-child(4) {
    z-index: 17;
  }
  .card-carousel > *:nth-child(5) {
    z-index: 16;
  }
  .card-carousel > *:nth-child(6) {
    z-index: 15;
  }
  .card-carousel > *:nth-child(7) {
    z-index: 14;
  }
  .card-carousel > *:nth-child(8) {
    z-index: 13;
  }
  .card-carousel > *:nth-child(9) {
    z-index: 12;
  }
  .card-carousel > *:nth-child(10) {
    z-index: 11;
  }
  .card-carousel > *:nth-child(11) {
    z-index: 10;
  }
  .card-carousel > *:nth-child(12) {
    z-index: 9;
  }
  .card-carousel > *:nth-child(13) {
    z-index: 8;
  }
  .card-carousel > *:nth-child(14) {
    z-index: 7;
  }
  .card-carousel > *:nth-child(15) {
    z-index: 6;
  }
  .card-carousel > *:nth-child(16) {
    z-index: 5;
  }
  .card-carousel > *:nth-child(17) {
    z-index: 4;
  }
  .card-carousel > *:nth-child(18) {
    z-index: 3;
  }
  .card-carousel > *:nth-child(19) {
    z-index: 2;
  }
  .card-carousel > *:nth-child(20) {
    z-index: 1;
  }
  @supports (animation-timeline: view()) {
    @media (prefers-reduced-motion: no-preference) {
      .card-carousel > * {
        animation: card-slide-in linear both;
        animation-range: var(--card-container-range);
        animation-timeline: view(x);
      }
    }
  }
}
@container scroller (width >= 32em) {
  :is([data-max-items="4"], [data-max-items="3"], [data-max-items="2"]) {
    --card-container-range: cover -75cqi contain 20cqi;
    --s-item-width: var(--half);
  }
}
@container scroller (width >= 58em) {
  :is([data-max-items="4"], [data-max-items="3"]):not(:has(> *:nth-child(3))) {
    --s-item-width: var(--half);
  }
  :is([data-max-items="4"], [data-max-items="3"]) {
    --s-item-width: var(--third);
  }
  [data-max-items="2"] {
    --s-item-width: var(--half);
  }
}
@container scroller (width >= 71em) {
  [data-max-items="4"]:not(:has(> *:nth-child(4))) {
    --s-item-width: var(--third);
  }

  :is([data-max-items="4"], [data-max-items="3"]):not(:has(> *:nth-child(3))) {
    --s-item-width: var(--half);
  }
  [data-max-items="4"] {
    --s-item-width: var(--quarter);
  }
  [data-max-items="3"] {
    --s-item-width: var(--third);
  }
  [data-max-items="2"] {
    --s-item-width: var(--half);
  }
}
/* fallback for no container queries */
@supports not (container-type: inline-size) {
  @media only screen and (min-width: 24em) {
    [data-max-items="4"],
    [data-max-items="3"],
    [data-max-items="2"] {
      --s-item-width: var(--half);
    }
  }
  @media only screen and (min-width: 62.5em) {
    [data-max-items="4"],
    [data-max-items="3"] {
      --s-item-width: var(--third);
    }
    [data-max-items="2"] {
      --s-item-width: var(--half);
    }
  }
  @media only screen and (min-width: 87em) {
    [data-max-items="4"] {
      --s-item-width: var(--quarter);
    }
    [data-max-items="3"] {
      --s-item-width: var(--third);
    }
    [data-max-items="2"] {
      --s-item-width: var(--half);
    }
  }
}
/* Header for PartnerCentral */
.secondary-header {
  min-block-size: clamp(20rem, 60vh, 35rem);
  margin-block: var(--gap-large);
  isolation: isolate;
  display: grid;
  grid-template-columns: 1fr 0.5fr;
  gap: var(--gap);
  align-items: start;
  justify-items: start;
  position: relative;
}
.secondary-header.margin-top:not(:has(div, p)) {
  margin-block-start: 0;
}

.secondary-header-content {
  display: grid;
  gap: var(--gap-small);
  margin-inline-start: calc(-1 * var(--box-padding));
  padding: var(--box-padding-large);
  background-color: rgba(0, 10, 26, 0.7);
  color: white;
  -webkit-backdrop-filter: blur(var(--blur-medium));
  backdrop-filter: blur(var(--blur-medium));
}
.secondary-header-content h1 {
  margin: 0;
}

.secondary-header-bg {
  z-index: -1;
  position: absolute;
  inset-block: calc(-1 * var(--gap));
  inset-inline: var(--inline-reverse-margin);
  grid-column: 1/-1;
  overflow: hidden;
}
.secondary-header-bg div {
  block-size: 100%;
}
.secondary-header-bg img {
  object-fit: cover;
  block-size: 100%;
  object-position: var(--bg-align);
  pointer-events: none;
}

.secondary-header-cta-area {
  padding: clamp(1.25rem, 4vw, 4rem);
  border: 0.1875rem solid var(--theme);
  background-color: rgb(var(--bg-main-rgb) / 0.8);
  -webkit-backdrop-filter: blur(var(--blur-medium));
  backdrop-filter: blur(var(--blur-medium));
  border-radius: var(--border-radius-large);
}
.secondary-header-cta-area .quick-links__list {
  padding: unset;
  display: grid;
}

@media only screen and (max-width: 34em) {
  .secondary-header {
    grid-template-columns: 1fr;
  }
}
.component-short-header {
  margin-inline-end: calc(-1 * var(--inline-container-excess));
  margin-block-end: var(--gap-large);
  position: relative;
  isolation: isolate;
}

.hero-container {
  display: grid;
  grid-template-columns: 1.5fr 1fr var(--inline-container-excess);
  grid-template-rows: auto;
  align-items: center;
  justify-content: space-between;
}
.hero-container .wrapper {
  grid-row: 1;
  grid-column: 1;
  padding-block-start: min(var(--gap) + 6vw, 6rem);
  color: white;
  font-weight: var(--text-weight-medium);
}
.hero-container .wrapper :is(h1, h2, .visual-h2) {
  overflow-wrap: break-word;
  hyphens: auto;
}
.hero-container .wrapper h1 {
  /* inherits styling from .ribbon-heading-inverse in _general.scss
  length helps to reduce long titles - threshold is 34 characters where more than that gets scaled down linearly */
  --cLength: var(--length, 34);
  font-size: calc(var(--text-size-h1) * clamp(0.75, (100 - (var(--cLength) - 30)) / 100 + 0.1, 1.2));
  margin-block-end: var(--gap);
  line-height: 1.2; /* fixes an issue where baseline characters are clipped (for instance the 'g' on a word) */
  filter: drop-shadow(0 0 0.5rem var(--bg-main));
}
.hero-container .wrapper h1:has(strong) {
  --cLength: calc(var(--length) - 17);
}
.hero-container .brand-logo {
  inline-size: clamp(8rem, 50%, 14rem);
}
.hero-container .brand-logo[src*="/short-hero"] {
  display: none;
}
.hero-container[data-full-width] {
  position: relative;
  display: grid;

  grid-template-columns: var(--inline-container-excess) min(15rem + 30vw, 100%) 1fr var(--inline-container-excess);
  grid-template-rows: 1fr;
  gap: unset;
  padding: unset;
}
.hero-container[data-full-width] :is(.component-short-header, .hero-container) {
  display: contents;
}
.hero-container[data-full-width] .wrapper {
  grid-column: 2;
  grid-row: 1;
  padding-block: clamp(var(--gap), var(--gap-large) + 2vw, var(--gap-section));
  z-index: 0;
}
.hero-container[data-full-width] .hero-container-image-wrapper {
  grid-column: 3/-1;
  grid-row: 1;
  border: unset;
  background-image: var(--bg-img);
  background-size: cover;
  background-position: var(--bg-align, center);
  clip-path: polygon(8rem 0%, 100% 0, 100% 100%, 0% 100%);
}
.hero-container[data-full-width] .hero-container-image-wrapper img {
  /* the image is displayed as background as it should be prioritised download
  anyway and more reliable way to  fill the space available */
  display: none;
}

.hero-container-image-wrapper {
  --gradient-light: var(--grey-lightest);
  --gradient-dark: var(--grey-light);
  user-select: none;
  pointer-events: none;
  inline-size: 100%;
  grid-column: 2;
  grid-row: 1;
  position: relative;
  block-size: 100%;
  z-index: -1;
}
.hero-container-image-wrapper img {
  position: absolute;
  inset: 0;
}
.hero-container-image-wrapper:empty {
  display: none;
}

@media only screen and (max-width: 40em) {
  .hero-container {
    grid-template-columns: 1fr 0 0 var(--inline-container-excess);
  }

  .hero-container-image-wrapper {
    display: none;
  }
}

.textWistiaVideo {
  margin-block-end: var(--gap-large);
}

.two-column-wistia {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 400px), 1fr));
  gap: var(--gap);
}
.two-column-wistia[data-video-align="right"] .video-container {
  order: 2;
}

@property --o {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 0%;
}
.textimagewithcta {
  display: grid;
  container-type: inline-size;
}

.text-image-with-cta {
  border-width: var(--border-width-tiny);
  border-style: solid;
  border-image-slice: 1;
  border-image-source: var(--theme-gradient);
  padding: clamp(1rem, 2vw, 1.5rem);
  display: flex;
  flex-direction: column;
  --o: 0%;
  background: linear-gradient(rgb(248, 98, 2, var(--o)), rgb(205, 71, 164, var(--o)));
  transition: --o var(--speed-standard) var(--transition-out-quadratic);
}
.text-image-with-cta:has(a:is(:focus-within, :hover)) {
  --o: 100%;
}
.text-image-with-cta .text-container {
  padding: calc(0.5 * var(--box-padding));
  display: flex;
  flex-direction: column;
  gap: var(--gap-tiny);
  flex-grow: 1;
}
.text-image-with-cta .text-container p:last-of-type {
  margin-block-end: var(--gap-small);
}
.text-image-with-cta .cta-with-arrow {
  inline-size: fit-content;
  margin-top: auto;
}
.text-image-with-cta .cta-with-arrow span {
  background-size: 0%;
}
.text-image-with-cta .cta-with-arrow br {
  display: none;
}
.text-image-with-cta .cta-with-arrow::after {
  display: none;
}

@supports (color: rgb(from red r g b)) {
  .text-image-with-cta {
    background: linear-gradient(
      rgb(from var(--gradient-light) r g b/var(--o)),
      rgb(from var(--gradient-dark) r g b/var(--o))
    );
  }
}
.text-image-with-cta__image {
  margin-block-end: var(--gap-small);
  overflow: hidden;
}
.text-image-with-cta__image:empty {
  display: none;
}
.text-image-with-cta__image img {
  inline-size: 100%;
  inline-size: -webkit-fill-available;
}
.text-image-with-cta__image img[src*="/icons/"][src*=".svg"] {
  inline-size: var(--icon-size-large);
  block-size: var(--icon-size-large);
}
/* .tile:not(.cq-Editable-dom) {
  display: contents;
} */

.tile {
  margin-top: 2rem;
}

.tile-component {
  display: grid;
  place-items: center;
  overflow: hidden;
  container-type: inline-size;
}
.tile-component .larger {
  font-size: min(var(--text-size-h2), 12cqw);
}
.tile-component[data-apply-padding] {
  --fitting: contain;
  --tile-block-padding: var(--box-padding-large);
  --tile-inline-padding: var(--box-padding-large);
}
.tile-component[data-apply-padding] .tile-vertical {
  --tile-block-padding: 0 var(--box-padding-large);
}
.tile-component[data-apply-padding] .tile-vertical.tile-picture-first {
  --tile-block-padding: var(--box-padding-large) 0;
}
.tile-component[data-apply-padding] .tile-horizontal {
  --tile-inline-padding: 0 var(--box-padding-large);
}
.tile-component[data-apply-padding] .tile-horizontal.tile-picture-first {
  --tile-inline-padding: var(--box-padding-large) 0;
}
.tile-component:not(.tile-theme-bordered) {
  background-color: rgb(var(--bg-inverse-rgb) / 0.08);
}
.tile-component:not(.tile-theme-image) {
  border-radius: var(--border-radius-standard);
}
.tile-component:not(.tile-theme-image) .object-fit-cover {
  display: contents;
}
.tile-component.tile-theme-image {
  isolation: isolate;
  color: white;
}
.tile-component.tile-theme-image .object-fit-cover {
  position: absolute;
  z-index: -1;
  inline-size: 100%;
  block-size: 100%;
}
.tile-component.tile-theme-image.tile-full-width {
  background: none;
  margin-inline: var(--inline-reverse-margin);
}
.tile-component.tile-theme-image .tile-content {
  display: grid;
  grid-template-areas: "stack";
  inline-size: 100%;
  position: relative;
}
.tile-component.tile-theme-image .tile-content > .media-container {
  grid-area: stack;
  padding: unset;
  margin: unset;
}
.tile-component.tile-theme-image .tile-content > .copy-container {
  grid-area: stack;
  margin-inline: auto;
  margin-block-start: var(--tile-padding, var(--gap-section-collapsible));
  -webkit-backdrop-filter: blur(var(--blur-very-large));
  backdrop-filter: blur(var(--blur-very-large));
  padding-inline: var(--box-padding-xlarge);
  flex: 1 0 50%;

  background: rgba(0, 0, 0, 0.5);
  border-start-start-radius: var(--border-radius-huge);
  border-start-end-radius: var(--border-radius-huge);

  box-shadow: 0 0 var(--border-radius-huge) rgba(255, 255, 255, 0.3),
    inset 0 0 var(--border-radius-huge) rgba(0, 0, 0, 0.3);
}
.tile-component.tile-theme-image .media-container img {
  block-size: 100%;
  object-fit: cover;
  object-position: center;
}
.tile-component.tile-theme-bordered {
  background: linear-gradient(var(--bg-main-hover), var(--bg-main-hover)) padding-box, var(--theme-gradient) border-box;
  border: var(--border-width-thin) solid transparent;
}
.tile-component .copy-container {
  padding-block: var(--box-padding-xlarge);
  padding-inline: var(--box-padding-xlarge);
  inline-size: min(var(--max-text-width), 100%);
  overflow-wrap: break-word;
  hyphens: auto;

  margin-block: auto;
}
.tile-component .copy-container:has(.allow-full-width) {
  --max-text-width: 100rem;
}
.tile-component .copy-container:empty {
  display: none;
}
.tile-component .media-container {
  display: grid;
  place-items: center;
  padding-block: var(--tile-block-padding);
  padding-inline: var(--tile-inline-padding);
}
.tile-component .media-container img {
  inline-size: 100%;
  object-fit: var(--fitting, cover);
  object-position: bottom;
  block-size: 100%;
}
.tile-component .media-container:empty {
  display: none;
}

/* solid background gradient applied to the tile */
.tile-theme-dark {
  background-image: var(--theme-gradient);
  font-weight: var(--text-weight-medium);
  color: white;
}

/* forces the tile to cover all columns in a flexible row container. */
/* ignored in any other instance. */
.tile-full-width {
  grid-column: 1/-1;
}

/* allows the tile to span two columns */
.tile-double-width {
  grid-column: span min(2, var(--grid-columns, 1));
}

.tile-triple-width {
  grid-column: span min(3, var(--grid-columns, 1));
}

.tile-double-height {
  grid-row: span 2;
}

.tile-triple-height {
  grid-row: span 3;
}

.tile-full-height {
  grid-row: 1/-1;
}

.tile-content {
  display: flex;
  flex: 1;
  block-size: 100%;
  inline-size: 100%;
}

.tile-picture-first {
  flex-direction: row-reverse;
}

.tile-horizontal {
  align-items: center;
}
.tile-horizontal .media-container {
  flex: 1 0 50%;
  block-size: 100%;
}
.tile-horizontal .media-container img {
  object-position: right;
}
.tile-horizontal.tile-picture-first .media-container img {
  object-position: left;
}

.tile-vertical {
  flex-direction: column;
}
.tile-vertical.tile-picture-first {
  flex-direction: column-reverse;
}
.tile-vertical.tile-picture-first .media-container img {
  object-position: top;
}
.tile-vertical .media-container img {
  object-position: bottom;
}

.scroller-component__slides > .tile {
  display: grid;
}

@container (max-width: 100rem) {
  .tile-component {
    --box-padding-large: clamp(1.25rem, 5cqw, 2rem);
  }
  .tile-component .copy-container {
    padding-inline: min(var(--box-padding-xlarge), 14cqw);
  }
  .tile-content {
    inline-size: 100cqw;
  }
}
@container (max-width: 31rem) {
  .tile-horizontal {
    flex-direction: column;
    inline-size: 100%;
  }
  .tile-horizontal.tile-picture-first {
    flex-direction: column-reverse;
  }
  .tile-horizontal .tile-component .copy-container {
    inline-size: 100%;
    text-align: center;
  }
}

.timelineContainer {
  margin-block: var(--gap-section);
  isolation: isolate;
}

.timeline-container__title {
  margin-block-end: var(--gap-large);
}

.timeline-container__listing {
  list-style: none;
  margin: 0 auto;
  padding: 0;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: var(--gap);
  inline-size: fit-content;
  max-inline-size: var(--max-text-width);
  position: relative;
}

.timeline-container__item {
  display: contents;
}
.timeline-container__item::before {
  content: "";
  width: var(--icon-size-standard);
  height: var(--icon-size-standard);
  background: var(--theme-gradient);
  grid-column: 1;
  border-radius: 100vmax;
  z-index: 1;
}
.timeline-container__item::after {
  content: "";
  border: var(--border-width-tiny) solid;
  border-image-slice: 1;
  border-image-source: var(--theme-gradient);
  position: absolute;
  height: 100%;
  grid-column: 1;
  transform: translateX(calc(0.5 * var(--icon-size-standard) - 0.5 * var(--icon-border-width)));
  z-index: 0;
}

.timeline-container__item-inner {
  grid-column: 2;
  padding-bottom: var(--gap);
}
.timeline-container__item-inner h3 {
  font-weight: var(--text-weight-bold);
}
.twoColumnsContent {
  margin-block: var(--gap);
}
.twoColumnsContent + .twoColumnsContent {
  margin-block-start: var(--gap-large);
}

:is(.scroller-component__slides, .flexible-row-container) > .twoColumnsContent {
  margin-block-start: var(--gap);
}

.two-columns-content {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  grid-template-rows: var(--gap-large) 1fr var(--gap-large);
}
.two-columns-content .content-holder {
  grid-row: 1/3;
  grid-column: 1/4;
}
.two-columns-content .img-holder {
  grid-column: 3/-1;
  grid-row: 2/-1;
}
.two-columns-content[data-image-style="inline"] .img-holder {
  background-image: var(--theme-gradient);
  block-size: fit-content;
}
.two-columns-content[data-image-style="background"] .img-holder {
  background-image: var(--bg-img), var(--theme-gradient);
}
.two-columns-content[data-image-style="background"] .img-holder img {
  display: none;
}
.two-columns-content[data-image-position="left"] .content-holder {
  grid-column: 3/-1;
}
.two-columns-content[data-image-position="left"] .img-holder {
  grid-column: 1/-3;
  background-position: right;
}
.two-columns-content .headline {
  margin-block-end: var(--gap-small);
}
.two-columns-content .call-to-action {
  margin-block-start: var(--gap-small);
}
.two-columns-content .content-holder {
  grid-column: 1/4;
  grid-row: 2;
  -webkit-backdrop-filter: blur(var(--blur-very-large));
  backdrop-filter: blur(var(--blur-very-large));
  padding: var(--box-padding-large) calc(2 * var(--gap-large)) var(--box-padding-large) var(--box-padding-large);
  border-left-width: var(--border-width-thin);
  border-left-style: solid;
  border-image-slice: 1;
  border-image-source: var(--theme-gradient);
  background-color: rgb(var(--bg-main-rgb) / calc(var(--is-dark, 20%) + 60% + var(--contrast, 0%)));
  position: relative;
}
.two-columns-content .content-holder::before {
  content: "";
  inset: 0;
  background: var(--theme-gradient);
  position: absolute;
  z-index: -1;
  opacity: 0.2;
  mix-blend-mode: color;
}
.two-columns-content .img-holder {
  grid-column: 3/-1;
  grid-row: 1/-1;
  background-position: left;
  background-size: cover;
}

@media only screen and (max-width: 71em) {
  .two-columns-content[data-image-position="left"] .content-holder {
    grid-column: 2/-1;
  }
  .two-columns-content[data-image-position="left"] .img-holder {
    grid-column: 1/-2;
  }
  .two-columns-content .content-holder {
    grid-column: 1/5;
    grid-row: 2;
  }
  .two-columns-content .img-holder {
    grid-column: 2/-1;
    grid-row: 1/-1;
  }
}
@media only screen and (max-width: 50em) {
  .two-columns-content {
    grid-template-rows: var(--gap-section) auto var(--gap);
    grid-template-columns: var(--gap-section) auto var(--gap-section);
  }
  .two-columns-content[data-image-position="left"] .content-holder {
    grid-column: 1/-2;
  }
  .two-columns-content[data-image-position="left"] .img-holder {
    grid-column: 2/-1;
  }
  .two-columns-content .content-holder {
    grid-column: 1/-2;
    grid-row: 2/-1;
    border-width: 0;
    padding: var(--box-padding);
  }
  .two-columns-content .img-holder {
    grid-column: 2/-1;
    grid-row: 1/3;
  }
}
@media only screen and (max-width: 30em) {
  [data-mobile-hide-image] .img-holder {
    display: none;
  }
  .two-columns-content {
    display: block;
    gap: var(--gap);
  }
  .two-columns-content .content-holder {
    background: unset;
    padding: 0;
  }
  .two-columns-content .content-holder::before {
    display: none;
  }
  .two-columns-content .img-holder {
    margin-block-end: var(--gap);
  }
  .two-columns-content[data-image-style="background"] .img-holder img {
    display: block;
  }
}

.component-video {
  display: grid;
  grid-template-areas: "stack";
}
.component-video > :where(img, figure) {
  grid-area: stack;
  inline-size: 100%;
  aspect-ratio: 16/9;
}
.component-video figcaption {
  aspect-ratio: 16/9;
  place-items: center;
  display: grid;
  font-weight: var(--text-weight-bold);
  backdrop-filter: invert(0.1);
}
.component-video .v-play {
  display: none;
}

.v-play-btn-container {
  color: white;
  grid-area: stack;
  display: grid;
  grid-template-areas: "stack";
  place-items: center;
  filter: drop-shadow(0px 0px 1rem black);
  cursor: pointer;
  opacity: 0.5;
  transition: all var(--speed-standard) var(--transition-out-quartic);
}
.v-play-btn-container::after,
.v-play-btn-container::before {
  content: "";
  grid-area: stack;
  aspect-ratio: 1;
  inline-size: clamp(5rem, 33%, 10rem);
}
.v-play-btn-container::after {
  background-color: currentColor;
  clip-path: var(--icon-video);
  transform: translateX(5%) scale(0.7);
}
.v-play-btn-container::before {
  border: var(--border-width) solid currentColor;
  border-radius: 100vmax;
  opacity: 0.5;
}
.v-play-btn-container:hover {
  opacity: 1;
  scale: 1.05;
}

.wistiaVideo {
  max-inline-size: 100%;
  aspect-ratio: 16/9;
  background-color: rgb(var(--bg-inverse-rgb) / 0.1);
}

.blogcontent .wistiaVideo {
  margin-block: var(--gap);
  max-inline-size: var(--max-text-width);
}

.wistia_responsive_padding {
  block-size: 100%;
  padding: 56.25% 0 0 0;
  position: relative;
}

.wistia_responsive_wrapper {
  inset: 0;
  position: absolute;
}

.wistia_embed {
  display: inline-block;
  height: 100%;
  width: 100%;
  position: relative;
}

.component-brand-logo {
  margin-block-end: var(--gap);
  inline-size: min(100%, 11rem);
}

:where(footer) {
  background-color: var(--bg-footer);
  border-block-start: var(--border-medium);
  padding-block: var(--box-padding-large);
  color: black;

  box-shadow: 0 0 0 100vmax var(--bg-footer);
  clip-path: inset(0 -100vmax);

  display: flex;
  flex-direction: column;
}
:where(footer) ul {
  list-style: none;
}
:where(footer) li {
  padding-block: 0.25rem;
}
:where(footer) li:empty {
  display: none;
}
:where(footer) li:has(a:empty) {
  display: none;
}
:where(footer) a {
  color: inherit;
  text-decoration: none;
  background-size: 0% 0.125rem;
  background-position: calc(var(--rtl, 0) * -100%) 100%;
  background-repeat: no-repeat;
  background-image: var(--theme-gradient-lighter);
  transition: background-size var(--speed-slow) var(--transition-out-quadratic);
}
:where(footer) a:is(:hover, :focus-visible) {
  background-size: 100% 0.125rem;
}
:where(footer) a:empty {
  display: none;
}
:where(footer) a[href="#top"] {
  color: var(--theme-orange);
  font-weight: var(--text-weight-bold);
}

:is(footer nav, .new-footer__inner) {
  display: contents;
}

.new-footer__row {
  grid-area: summary;
  display: grid;
  gap: var(--gap);
  grid-template-columns: repeat(auto-fit, minmax(25ch, 1fr));
}

.new-footer__column--hidden {
  display: none;
}

.new-footer__copywrite {
  margin-block: var(--gap-large) var(--gap);
  padding-block: var(--gap);
  border-block: 1px solid rgb(var(--bg-main-rgb) / 0.5);
  display: flex;
  gap: var(--gap);
}

.new-footer__copywrite-links {
  display: flex;
  flex-wrap: wrap;
  flex: 1;
  gap: var(--gap-small) var(--gap);
}

@media only screen and (max-width: 37.5em) {
  .new-footer__copywrite {
    flex-direction: column;
  }
}

.component-header {
  display: grid;
  grid-template-areas: "logo lower upper";
  grid-template-columns: 15vw 1fr auto;
  align-items: center;
  gap: 0 2rem;
  margin-inline: var(--inline-reverse-margin);
  padding-inline: var(--inline-reverse-padding);
  padding-bottom: 1rem;
  position: relative;
}
.component-header::after {
  position: absolute;
  content: "";
  inset: 100% -50vmax -0.25rem -50vmax;
  background: linear-gradient(-90deg in srgb, #f86202 calc(50% - 50vw), #cd47a4 calc(50% + 50vw));
}
.component-header .wrapper {
  display: contents;
}
.component-header .wrapper > a {
  grid-area: logo;
  inline-size: clamp(7rem, 10rem, 100%);
  z-index: 3;
  user-select: none;
  position: relative;
  touch-action: none;
}

@media only screen and (min-width: 71em) and (min-height: 500px) {
  .component-header {
    position: sticky;
    top: 0;
    z-index: 10;
    background-color: var(--bg-main);
    border-top: 0.5rem solid var(--bg-main);
  }
}
@media only screen and (max-width: 63em) {
  .component-header {
    grid-template-areas: "logo upper" "lower lower";
    grid-template-columns: minmax(13rem, 15vw) auto;
  }
  .header-lower-navigation {
    margin-top: var(--gap);
  }
}
.header-upper-navigation {
  grid-area: upper;
  display: flex;
  gap: var(--gap-small);
  background-color: var(--bg-black);
  border-radius: 2rem;
  padding: var(--box-padding-shallow);
  user-select: none;
  inline-size: fit-content;
  list-style-type: none;
  justify-self: flex-end;
  z-index: 3;
  box-shadow: var(--shadow-standard);
}
.header-upper-navigation .mobile-menu-item {
  max-inline-size: var(--icon-upper-header);
}
.header-upper-navigation a.mobile-menu-item:not(:hover) {
  text-decoration: none;
}

light-switch {
  display: none;
}

.header-lower-navigation {
  grid-area: lower;
  padding-block-start: 0.25rem;
}
.header-lower-navigation ul {
  display: flex;
  flex-wrap: wrap;
  gap: var(--gap);
  align-items: center;
  font-size: var(--text-size-menu);
  list-style-type: none;
}

.menu-open .header-lower-navigation {
  z-index: 1;
}
.menu-open .menu-open-overlay {
  background-color: RGB(var(--bg-main-rgb) / 0.8);
  inset: 0;
}

.menu-open-overlay {
  position: fixed;
  -webkit-backdrop-filter: blur(var(--blur-small));
  backdrop-filter: blur(var(--blur-small));
  z-index: -1;
  transition: background-color var(--speed-slow) var(--transition-out-quadratic);
}

.header-lower-navigation-item {
  display: flex;
  position: relative;
}

.primary-nav-link {
  display: flex;
  text-decoration: none;
  color: var(--text-white);
  font-weight: var(--text-weight-medium);
  cursor: pointer;
  user-select: none;
  background: none;
}
.primary-nav-link[aria-expanded="false"] div:hover .caret-down {
  animation-name: caretPulsingDown;
}
.primary-nav-link[aria-expanded="true"] + .mega-menu {
  display: flex;
}
.primary-nav-link[aria-expanded="true"] .caret-down {
  translate: 0rem 0rem;
  rotate: 225deg;
}
.primary-nav-link[aria-expanded="true"] div::after {
  background-color: var(--theme);
  translate: 0 0.25rem;
}

.header-lower-navigation-item-text {
  position: relative;
  display: flex;
  gap: 0.5rem;
  align-items: center;
  inline-size: max-content;
  position: relative;
}
.header-lower-navigation-item-text .caret-down {
  display: block;
  inline-size: 0.5rem;
  height: 0.5rem;
  border: solid rgb(var(--bg-inverse-rgb));
  border-width: 0 0.125rem 0.125rem 0;
  display: inline-block;
  padding: 0.125rem;
  rotate: 45deg;
  translate: 0rem -0.125rem;
  animation-fill-mode: both;
  animation-iteration-count: infinite;
  animation-duration: var(--speed-slow);
  animation-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95);
}
.header-lower-navigation-item-text::after {
  content: "";
  inline-size: 100%;
  position: absolute;
  bottom: 0;
  background-color: transparent;
  height: 0.125rem;
  pointer-events: none;
  transition: all var(--speed-fast) var(--transition-out-quadratic);
  translate: 0 0;
}

@media only screen and (max-width: 37.5em), only screen and (max-height: 30em) and (max-width: 71em) {
  .mobile-burger-menu {
    display: grid;
  }
  body:not(.menu-open) :is(.header-lower-navigation, .header-upper-navigation) {
    display: none;
  }
  .component-header::after {
    inset: 100% 0% -0.25rem 0%;
  }
  body.menu-open a:has(> .header-logo):not(:focus-visible) > .header-logo {
    translate: 0 -200%;
  }
  body.menu-open .header-upper-navigation {
    --icon-upper-header: 2rem;
    --text-size-lang: clamp(0.75rem, 2vw, 2rem);
    --menu-shift-right: auto;
    --menu-shift-left: calc(var(--border-radius-standard) - 2 * var(--box-padding));
    --menu-shift-left-triangle: calc(var(--border-radius-standard) + var(--box-padding));
    display: flex;
    grid-area: logo;
    justify-self: auto;
    translate: -1rem;
  }
  body.menu-open .search-container {
    position: fixed;
    --menu-shift-left: 0rem;
    translate: 0 1rem;
    inline-size: calc(100vw - var(--container-padding));
  }
  body.menu-open .search-container::before {
    inset-inline-start: 10rem;
  }
}

@media only screen and (max-width: 37.5em), only screen and (max-height: 30em) and (max-width: 62.5em) {
  body.menu-open {
    overflow-y: auto;
    margin-right: unset;
  }
  .header-upper-navigation {
    display: none;
  }
  .menu-open .header-upper-navigation {
    animation-name: slideRight;
    animation-duration: var(--speed-snail);
    animation-fill-mode: both;
  }
  .menu-open-overlay {
    display: none;
  }
  .header-lower-navigation ul {
    outline-color: var(--theme);
    margin-inline: var(--inline-reverse-margin);
    inline-size: 100vw;
    flex-direction: column;
    background-color: var(--bg-menu-mobile);
  }
  .header-lower-navigation-item {
    flex-direction: column;
    gap: 0;
    inline-size: calc(100vw - 2rem);
  }
  .header-lower-navigation-item:last-of-type .primary-nav-link {
    border-block-end: unset;
  }
  .header-lower-navigation-item.open .mega-menu {
    display: block;
  }
  .primary-nav-link {
    outline-color: var(--theme);
  }
  .header-lower-navigation-item-text {
    padding: var(--box-padding);
    font-size: var(--text-size-h3);
    font-weight: var(--text-weight-bold);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    background-image: var(--theme-gradient);
  }
  .header-lower-navigation-item-text::after {
    background-color: transparent !important;
  }
  .header-lower-navigation-item-text .caret-down {
    border-color: var(--theme);
  }
}

/* .search-bar is the icon in the upper menu */
.search-bar {
  display: none;
}

.results-qty {
  padding: var(--padding-ch);
  background-color: var(--bg-main);
}

.articles-container article {
  padding-block-end: var(--gap);
  border-block-end: var(--border-soft);
  margin-block-end: var(--gap);
}
.articles-container article h2 {
  font-size: var(--text-size-h3);
}

#mktoForm {
  margin-top: 2rem;
}

.mktoForm {
  width: 100% !important;
}

.mktoForm .mktoLabel {
  display: block !important;
  color: white !important;
  font-size: 1rem !important;
  padding-bottom: 0.3rem !important;
  padding-top: 0px !important;
  width: 100% !important;
  & a {
    color: white;
  }
}

.mktoHtmlText.mktoHasWidth {
  width: min(100%, 37rem) !important;
}

.mktoForm input[type="text"],
.mktoForm input[type="url"],
.mktoForm input[type="email"],
.mktoForm input[type="tel"],
.mktoForm input[type="number"],
.mktoForm input[type="date"],
.mktoForm textarea.mktoField,
.mktoForm select.mktoField {
  width: min(100%, 37rem) !important;
  -webkit-transition: all 0.3s ease-out !important;
  transition: all 0.3s ease-out !important;
  border: 1px solid #ccc !important;
  color: #202020 !important;
  font-size: 1rem !important;
  font-weight: 500 !important;
  padding: 1rem 0.5rem 0.5rem 0.5rem !important;
  margin: 0 !important;
  outline: none !important;
  border-radius: 0.1875rem !important;
  background-color: white !important;
}
.mktoForm input[type="text"]:focus,
.mktoForm input[type="url"]:focus,
.mktoForm input[type="email"]:focus,
.mktoForm input[type="tel"]:focus,
.mktoForm input[type="number"]:focus,
.mktoForm input[type="date"]:focus,
.mktoForm textarea.mktoField:focus,
.mktoForm select.mktoField:focus {
  outline: none !important;
  border-color: #f86202 !important;
}
.mktoForm input[type="text"]:hover,
.mktoForm input[type="url"]:hover,
.mktoForm input[type="email"]:hover,
.mktoForm input[type="tel"]:hover,
.mktoForm input[type="number"]:hover,
.mktoForm input[type="date"]:hover,
.mktoForm textarea.mktoField:hover,
.mktoForm select.mktoField:hover {
  outline: none !important;
  border-color: #919fa9 !important;
}
.mktoFormCol,
.mktoFieldWrap {
  width: 100% !important;
}
.mktoForm .mktoRequiredField label.mktoLabel {
  font-weight: normal !important;
}
.mktoButtonWrap {
  margin-left: 0 !important;
}
.mktoButtonRow {
  width: 100% !important;
}
.mktoButton {
  border: 2px solid #f86202 !important;
  border-radius: 3px !important;
  padding: 18px 26px !important;
  margin-top: 20px !important;
  display: inline-block !important;
  -ms-flex-item-align: start;
  align-self: flex-start !important;
  text-transform: uppercase !important;
  font-weight: 500 !important;
  text-align: center !important;
  text-decoration: none !important;
  -webkit-transition: all 0.3s ease-out !important;
  transition: all 0.3s ease-out !important;
  font-size: 1rem !important;
  width: -webkit-max-content !important;
  width: -moz-max-content !important;
  width: max-content !important;
  cursor: pointer !important;
}
.mktoForm button.mktoButton:hover,
.mktoForm .mktoButtonWrap.mktoSimple .mktoButton:hover {
  color: #fff !important;
  background-color: #f86202 !important;
}
.mktoForm .mktoButtonWrap.mktoSimple .mktoButton {
  float: left !important;
  background-image: none !important;
  background-color: #fff !important;
  color: black !important;
}
.mktoForm .mktoCheckboxList > input {
  border: 2px solid #ccc !important;
  width: 1.5em !important;
  height: 1.5em !important;
  background: #fff !important;
  border-radius: 4px !important;
  box-shadow: inset 0 1px 3px rgb(0 0 0 / 10%) !important;
}
.mktoForm .mktoCheckboxList > label:hover .mktoForm .mktoCheckboxList > input[type="checkbox"] {
  border: 2px solid #cd47a4 !important;
}
.mktoForm .mktoRadioList,
.mktoForm .mktoCheckboxList {
  float: left !important;
  border: 1px solid #ccc !important;
  border-radius: 5px !important;
  background-color: white !important;
  padding: 18px 8px 4px 8px !important;
  margin-top: 5px !important;
  margin-bottom: 5px !important;
  width: min(100%, 37rem) !important;
}
.mktoForm .mktoRadioList > label,
.mktoForm .mktoCheckboxList > label {
  position: relative !important;
  margin-left: 2.3em !important;
  margin-top: 0.1em;
  margin-bottom: 1em !important;
  line-height: 1.2em;
  display: block;
  min-height: 12px;
  cursor: pointer !important;
}

[type="checkbox"] + label::after {
  content: "" !important;
}

.mktoCheckboxList input:checked + label:before {
  content: "\2713" !important;
  position: absolute !important;
  left: -1.9rem !important;
  top: -0.2rem !important;
  line-height: 0.8 !important;
  color: var(--theme-orange) !important;
  transition: all var(--speed-fast) !important;
  font-size: 1em !important;
  text-align: end !important;
}

.mktoCheckboxList input + label:before {
  content: "" !important;
  position: absolute !important;
  left: -1.9rem !important;
  top: -0.2rem !important;
  width: 1.35em !important;
  height: 1.35em !important;
  border: 1px solid var(--grey-light) !important;
  background: #fff !important;
  border-radius: 0.5ch !important;
  box-shadow: inset 0 1px 3px rgb(0 0 0 / 10%) !important;
  font-size: 1em !important;
}

.mktoForm input[type="checkbox"]:hover + label:before {
  border: 2px solid #9e2b7c !important;
}

.mktoForm input[type="checkbox"]:focus + label:before {
  border: 2px dotted #9e2b7c !important;
}

.mktoForm .mktoCheckboxList > input {
  height: 0px !important;
  display: none !important;
}
.mktoForm .mktoRequiredField .mktoAsterix {
  display: inline !important;
  color: var(--error-msg); /* optional: to visually stand out */
}

.mktoFieldWrap:has(.mktoRangeField) {
  & label {
    left: 0;
    top: 0;
    position: relative;
    display: grid;
    margin-bottom: 5px;
    z-index: unset;
  }
  :is(.mktoRangeField.mktoHasWidth, input[type="range"]) {
    width: 300px !important;
  }
  & :is(.mktoRangeValueText, .mktoRangeValueArrow) {
    background-color: #25517b !important;
    background-image: linear-gradient(#4f87bd 43%, #1d4164 100%) !important;
    border-color: #25517b !important;
  }
}

/*********** Baseline, reset styles ***********/
input[type="range"] {
  -webkit-appearance: none;
  appearance: none;
  background: transparent;
  border: unset;
  cursor: pointer;
  width: 25rem;
}

/* Removes default focus */
input[type="range"]:focus {
  outline: none;
}

/******** Chrome, Safari, Opera and Edge Chromium styles ********/
/* slider track */
input[type="range"]::-webkit-slider-runnable-track {
  background-color: color-mix(in srgb, var(--theme-orange), var(--bg-main));
  border-radius: 0.5rem;
  height: 1rem;
}

/* slider thumb */
input[type="range"]::-webkit-slider-thumb {
  -webkit-appearance: none; /* Override default look */
  appearance: none;
  margin-top: -4px; /* Centers thumb on the track */
  background-color: var(--theme-orange);
  border-radius: 1rem;
  height: 1.5rem;
  width: 1.5rem;
}

input[type="range"]:focus::-webkit-slider-thumb {
  outline: 3px solid var(--theme-orange);
  outline-offset: 0.125rem;
}

/*********** Firefox styles ***********/
/* slider track */
input[type="range"]::-moz-range-track {
  background-color: #a3cdf5;
  border-radius: 0.5rem;
  height: 1rem;
}

/* slider thumb */
input[type="range"]::-moz-range-thumb {
  background-color: var(--theme-orange);
  border: none; /*Removes extra border that FF applies*/
  border-radius: 1rem;
  height: 1.5rem;
  width: 1.5rem;
}

input[type="range"]:focus::-moz-range-thumb {
  outline: 3px solid var(--theme-orange);
  outline-offset: 0.125rem;
}

.mktoRequiredField label[for="leadaccepttermsandconditions"] {
  translate: calc(min(100%, 37rem) - 1rem) 1.4ch;
  position: absolute;
}
/* Animation */

.mktoForm .mktoError .mktoErrorMsg {
  display: block;
  box-shadow: rgba(0, 0, 0, 0.65) 0 2px 7px, inset var(--error-msg) 0 1px 0px;
  line-height: 1.2em;
  max-width: 16em;
  padding: 0.4em 0.6em;
  animation: alternate-reverse;
  animation: bounce 2s infinite;
  background-color: transparent !important;
  background-image: none !important;
  border: 0px !important;
  box-shadow: none !important;
  text-shadow: none !important;
  font-size: 85% !important;
  color: var(--theme-orange) !important;
  font-weight: bold;
  translate: 0 -1ch;
}

@keyframes bounce {
  0%,
  20%,
  50%,
  80%,
  100% {
    transform: translateY(0);
  }
  40% {
    transform: translateY(-0.125rem);
  }
  60% {
    transform: translateY(-0.005rem);
  }
}

.mktoForm .mktoError {
  position: absolute !important;
  z-index: 99 !important;
  font-weight: bold;
  color: var(--error-msg) !important;
  left: 0px !important;
  width: 100% !important;
}

.mktoForm .mktoError .mktoErrorArrowWrap {
  display: none !important;
}
#snackbar {
  color: white;
  &:not(.show) {
    display: none;
  }
  & .mktoButton {
    padding: 9px 16px !important;
    color: white !important;
  }
}
/*Cache Function - Email Instruction */
span#InstructEmail {
  display: block !important;
  color: white;
  & span label {
    color: white !important;
  }
}
label#LblEmail,
input#Email {
  float: unset;
}