/* stylelint-disable @stylistic/indentation */
:root {
  --eyebrow-color: var(--bg-dark-blue);
}

.section,
.fragment {
  display: flex;
  flex-flow: column nowrap;
  gap: var(--size-20);
  inline-size: 100%;
  position: relative;
  z-index: 1;
}

.section.section--align-left {
  text-align: start;
}

.section:not(.section--no-padding) {
  padding-block: var(--section-mobile-padding-block);
}

/* Full Bleed Sections */
.section--full-bleed {
  inline-size: 100vw;
  inset-inline: 50%;
  margin-inline: -50vw;
}

.section--full-bleed:not(.section--no-padding) {
  padding-inline: var(--size-2x);
}

/* Light and White Backgrounds */
.section--bg-white {
  --eyebrow-color: var(--bg-slate);

  background-color: var(--bg-white);
  color: var(--bg-slate);
}

.section--bg-light,
.section--bg-lightgradient-with-sprite {
  --eyebrow-color: var(--bg-slate);

  background-color: var(--bg-light);
  color: var(--bg-slate);
}

/* Dark Background */
.section--bg-dark {
  --eyebrow-color: var(--color-spindle);

  background-color: var(--bg-slate);
  color: var(--bg-white);
}

/* Dark Blue Background */
.section--bg-dark-blue {
  --eyebrow-color: var(--color-spindle);

  background-color: var(--bg-dark-blue);
  color: var(--bg-white);
}

/* Gradients */
.section--bg-darkgradient {
  --eyebrow-color: var(--color-spindle);

  background: var(--bg-gradient-dark);
  color: var(--bg-white);
}

.section--bg-lightgradient {
  --eyebrow-color: var(--color-spindle);

  background: var(--bg-gradient-light);
  color: var(--bg-white);
}

.section--bg-darkgradient-with-sprite,
.section--bg-darkgradient-with-sprite-lb {
  --eyebrow-color: var(--color-spindle);

  background: linear-gradient(246deg, #313f55 47.72%, #182436 78.83%);
  color: var(--bg-white);
}

.section--bg-slate-dark {
  --eyebrow-color: var(--color-spindle);

  background: var(--bg-slate-dark);
  color: var(--bg-white);
}

.section--bg-lightgradient-with-sprite::before {
  background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQzIiBoZWlnaHQ9IjQ2NCIgdmlld0JveD0iMCAwIDI0MyA0NjQiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxnIG9wYWNpdHk9IjAuMiI+CjxwYXRoIGQ9Ik0xMTIuNjEyIDQxOC44NzNMMTU1LjE3NiAzOTQuMjQ0TDEwNy4zNjIgMzExLjU5OEg1MC41NDkzTDExMi42MTIgNDE4Ljg3M1oiIGZpbGw9IiMzMTNGNTUiIGZpbGwtb3BhY2l0eT0iMC40Ii8+CjxwYXRoIGQ9Ik0xMTguMTQzIDMwMC4xMTZMMjAxLjMxOCAzNDguMDA3TDIyNS44NTYgMzA1LjM5TDExOC4xNDMgMjQzLjM3MVYzMDAuMTE2WiIgZmlsbD0iIzMxM0Y1NSIgZmlsbC1vcGFjaXR5PSIwLjQiLz4KPHBhdGggZD0iTTI0Mi44MDQgMjQyLjMxNFYxOTMuMjk5SDE3Ny43NTNIMTE4LjE0M1YyNDIuMzE0SDI0Mi44MDRaIiBmaWxsPSIjMzEzRjU1IiBmaWxsLW9wYWNpdHk9IjAuNCIvPgo8cGF0aCBkPSJNMjI1LjY3MyAxMzAuMTk1TDIwMS4wNDggODcuNjMwOUwxMTguMTQzIDEzNS41OTVWMTkyLjQwNkwyMjUuNjczIDEzMC4xOTVaIiBmaWxsPSIjMzEzRjU1IiBmaWxsLW9wYWNpdHk9IjAuNCIvPgo8cGF0aCBkPSJNMTU0LjgwOSA0MS40ODU0TDExMi4xOTIgMTYuOTQ3M0w1MC4zODg3IDEyNC4yODhIMTA3LjEzM0wxNTQuODA5IDQxLjQ4NTRaIiBmaWxsPSIjMzEzRjU1IiBmaWxsLW9wYWNpdHk9IjAuNCIvPgo8cGF0aCBkPSJNMC4yODk2MTIgNDM1Ljg4NUg0OS4wOTA5VjMxMS41OThIMC4yODk2MTJWMzQ3LjA2NlY0MzUuODg1WiIgZmlsbD0iIzMxM0Y1NSIgZmlsbC1vcGFjaXR5PSIwLjQiLz4KPHBhdGggZD0iTTQ5LjA5MDkgMEwwLjI4OTYxMiAwLjAwMTU1MDFWNjUuNDkwMVYxMjQuMjg3SDQ5LjA5MDlWMFoiIGZpbGw9IiMzMTNGNTUiIGZpbGwtb3BhY2l0eT0iMC40Ii8+CjwvZz4KPC9zdmc+Cg==');
  background-position: calc(0% - 110px) 80%;
  background-repeat: no-repeat;
  background-size: 436px 436px;
  block-size: 100%;
  content: '';
  inline-size: 100%;
  inset-block-start: 0;
  inset-inline-start: 0;
  pointer-events: none;
  position: absolute;
  z-index: -1;
}

.section--bg-darkgradient-with-sprite::before {
  background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA1NTQgNTU0Ij4KICA8cGF0aAogICAgZD0ibTE2NS4yMyAyMS44MS01NC4wOCAzMS4zIDYwLjczIDEwNC45MWg3Mi4yM3ptMjIzLjI2IDUxMC41OCA1NC4wOC0zMS4zLTYwLjgtMTA1LjA1aC03Mi4yM2w3OC44OCAxMzYuMzV6bTcuMDctMTUwLjg5IDEwNS43NCA2MC44NyAzMS4xNi01NC4xNS0xMzYuOTEtNzguODF2NzIuMDlaTTUyLjQ5IDExMS44NGwtMzEuMTYgNTQuMTUgMTM3LjE4IDc4Ljk0di03Mi4wOUw1Mi40OSAxMTEuODNaTTAgMjQ1Ljd2NjIuMzJoMTU4LjQ0VjI0NS43em01NTQgNjIuMzJWMjQ1LjdIMzk1LjU2djYyLjMyem0tMjEuNzQtMTQyLjUxLTMxLjMtNTQuMDgtMTA1LjQgNjAuOTR2NzIuMjNsMTM2LjctNzkuMDhaTTIxLjU0IDM4OC43bDMxLjMgNTQuMDggMTA1LjY4LTYxLjA4di03Mi4yM3ptOTAuMDkgMTEyLjc0IDU0LjE1IDMxLjE2IDc4LjY3LTEzNi41NmgtNzIuMTZ6TTQ0Mi4xNiA1Mi43N2wtNTQuMTUtMzEuMTYtNzguNiAxMzYuNDJoNzIuMTZ6TTI0NS43IDU1NGg2Mi4wNVYzOTYuMDRIMjQ1Ljd6TTMwNy43NSAwSDI0NS43djE1Ny45Nmg2Mi4wNXoiCiAgICBmaWxsPSIjMjkzNjRCIiAvPgo8L3N2Zz4=');
  background-position: calc(0% - 200px) 70%;
  background-repeat: no-repeat;
  background-size: 436px 408px;
  block-size: 100%;
  content: '';
  inline-size: 100%;
  inset-block-start: 0;
  inset-inline-start: 0;
  pointer-events: none;
  position: absolute;
  z-index: -1;
}

.section--bg-darkgradient-with-sprite-lb::before {
  background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA1NTQgNTU0Ij4KICA8cGF0aAogICAgZD0ibTE2NS4yMyAyMS44MS01NC4wOCAzMS4zIDYwLjczIDEwNC45MWg3Mi4yM3ptMjIzLjI2IDUxMC41OCA1NC4wOC0zMS4zLTYwLjgtMTA1LjA1aC03Mi4yM2w3OC44OCAxMzYuMzV6bTcuMDctMTUwLjg5IDEwNS43NCA2MC44NyAzMS4xNi01NC4xNS0xMzYuOTEtNzguODF2NzIuMDlaTTUyLjQ5IDExMS44NGwtMzEuMTYgNTQuMTUgMTM3LjE4IDc4Ljk0di03Mi4wOUw1Mi40OSAxMTEuODNaTTAgMjQ1Ljd2NjIuMzJoMTU4LjQ0VjI0NS43em01NTQgNjIuMzJWMjQ1LjdIMzk1LjU2djYyLjMyem0tMjEuNzQtMTQyLjUxLTMxLjMtNTQuMDgtMTA1LjQgNjAuOTR2NzIuMjNsMTM2LjctNzkuMDhaTTIxLjU0IDM4OC43bDMxLjMgNTQuMDggMTA1LjY4LTYxLjA4di03Mi4yM3ptOTAuMDkgMTEyLjc0IDU0LjE1IDMxLjE2IDc4LjY3LTEzNi41NmgtNzIuMTZ6TTQ0Mi4xNiA1Mi43N2wtNTQuMTUtMzEuMTYtNzguNiAxMzYuNDJoNzIuMTZ6TTI0NS43IDU1NGg2Mi4wNVYzOTYuMDRIMjQ1Ljd6TTMwNy43NSAwSDI0NS43djE1Ny45Nmg2Mi4wNXoiCiAgICBmaWxsPSIjMjkzNjRCIiAvPgo8L3N2Zz4=');
  background-position: left -155px bottom -157px;
  background-repeat: no-repeat;
  background-size: 553px 553px;
  block-size: 100%;
  content: '';
  inline-size: 100%;
  inset-block-start: 0;
  inset-inline-start: 0;
  pointer-events: none;
  position: absolute;
  z-index: -1;
}

/* ============================
   Breakpoints — Desktop Enhancements
=============================== */

@media screen and (min-width: 768px) {
  /* stylelint-disable-next-line rule-empty-line-before */
  .section,
  .fragment {
    gap: var(--size-5x);
  }

  .section:not(.section--no-padding) {
    padding-block: var(--section-desktop-padding-block);
  }

  .section--full-bleed:not(.section--no-padding) {
    padding-inline: var(--size-4x);
  }

  .section.section--align-center {
    text-align: center;
  }
}

@media screen and (min-width: 1344px) {
  /* stylelint-disable-next-line rule-empty-line-before */
  .section--full-bleed,
  .section--full-bleed:not(.section--no-padding) {
    padding-inline: 0;
  }
}

@media screen and (min-width: 1280px) {
  .section--limit-columns > [class$='-wrapper'] {
    inline-size: calc(
      (var(--grid-column-desktop-width) * 8) + (var(--gutter-width) * 7)
    );
    margin-inline: auto;
  }

  /* prettier-ignore */
  .section--full-bleed:not(.section--no-padding, .section--limit-columns)>[class$='-wrapper']:not(.quote-wrapper, .icons-wrapper) {
    inline-size: 100%;
    margin-inline: auto;
    max-inline-size: 1280px;
  }
}

@media screen and (min-width: 1024px) {
  .section {
    scroll-margin-top: 48px;
  }
}

/* stylelint-disable-next-line selector-max-compound-selectors */
.fragment>.default-content-wrapper>*:first-child,
/* stylelint-disable-next-line selector-max-compound-selectors */
.section>.default-content-wrapper>*:first-child {
  --default-heading-margin: 0 var(--size-4x);
  --default-element-margin: 0 var(--size-4x);
}

/* stylelint-disable-next-line selector-max-compound-selectors */
.fragment>.default-content-wrapper>*:last-child,
/* stylelint-disable-next-line selector-max-compound-selectors */
.section>.default-content-wrapper>*:last-child {
  --default-heading-margin: var(--size-20) 0;
  --default-element-margin: var(--size-4x) 0;
}

/* stylelint-disable-next-line selector-max-compound-selectors */
.fragment>.default-content-wrapper>*:only-child,
/* stylelint-disable-next-line selector-max-compound-selectors */
.section>.default-content-wrapper>*:only-child {
  --default-heading-margin: 0;
  --default-element-margin: 0;
}

/* stylelint-disable-next-line selector-max-compound-selectors */
.section
  > .default-content-wrapper
  > div[data-aue-behavior='component']
  > *:first-child {
  --default-heading-margin: 0 var(--size-4x);
  --default-element-margin: 0 var(--size-4x);
}

/* stylelint-disable-next-line selector-max-compound-selectors */
.section
  > .default-content-wrapper
  > div[data-aue-behavior='component']
  > *:last-child {
  --default-heading-margin: var(--size-20) 0;
  --default-element-margin: var(--size-4x) 0;
}

/* stylelint-disable-next-line selector-max-compound-selectors */
.section
  > .default-content-wrapper
  > div[data-aue-behavior='component']
  > *:only-child {
  --default-heading-margin: 0;
  --default-element-margin: 0;
}

/* stylelint-disable-next-line selector-max-compound-selectors */
.section > .default-content-wrapper > div[data-aue-behavior='component'] {
  margin-block-end: var(--size-4x);
}

/* stylelint-disable-next-line selector-max-compound-selectors */
.section
  > .default-content-wrapper
  > div[data-aue-behavior='component']:last-child {
  margin-block-end: 0;
}
