/*****************/
/** Theme Section */
/*****************/

/* Section Main */
.section {
  /* Check if multiple padding is needed or just per page or 2 to 3 custom padding. */
  --se-base-pd: 170px;
  --se-short-pd: var(--space-m);
  --se-medium-pd: var(--space-xl);
  --se-large-pd: var(--space-5xl);
  --se-x-large-pd: var(--space-8xl);

  --sec--pd: var(--se-base-pd) 0;
  --sec--bg: var(--bg-light);
  /* --sec--mg: 0; */
  /* --sec--pos: relative; */
  /* --sec--zi: 1; */
  /* --sec--mxw: 100%; */
  /* --sec--w: 100%; */
  /* --sec--h: 100%; */

  /* .section-head */
  --se-head-mb: 54px;
  --se-hd--txt-ali: left;
  --se-hd--d: flex;
  --se-hd--flx-wrp: nowrap;
  --se-hd--ali-itm: start;
  --se-hd--jus-cnt: start;
  --se-hd--flx-dir: column;
  --se-hd--pd: 0;
  --se-hd--mg: 0 0 var(--se-head-mb);
  --se-hd--mxw: 100%;
  /* --se-hd--mnw: 100%; */

  /* .sec-hd-col */
  --se-hd-col--d: flex;
  --se-hd-col--txt-ali: left;
  --se-hd-col--flx-wrp: nowrap;
  --se-hd-col--ali-itm: start;
  --se-hd-col--jus-cnt: start;
  --se-hd-col--flx-dir: column;
  --se-hd-col--pd: 0;
  --se-hd-col--mg: 0;
  --se-hd-col--mxw: 100%;
  /* --se-hd-col--mnw: 100%; */

  --se-head-inside-col-mb: var(--space-section-head-inside-col-mb);
  --se-head-mb-sm: var(--space-xs); /* To be deleted */
  --se-head-wrap-mxw: 950px;
  --se-head-wrap-text-mxw: 950px;
  --se-head-wrap-mxw__on-l: 650px;
  --se-head-wrap-text-mxw__on-l: 850px;
  --se-head-wrap-mxw__on-m: 650px;
  --se-head-wrap-text-mxw__on-m: 850px;

  /* .sec-hd__icon */
  --se-hd-icon--clr: var(--accent);
  --se-hd-icon--size: var(--icon-m);
  --se-hd-icon--h: auto;
  --se-hd-icon--w: 58px;
  --se-hd-icon--mg: 0;
  --se-hd-icon--pd: 0;

  /* H4 .section-head__label */
  --se-head-label--color: var(--accent-two);
  --se-head-label--font-size: 18px;
  --se-head-label--font: var(--font-custom-1);
  --se-head-label--font-weight: 700;
  --se-head-label--tex-trans: uppercase;
  --se-head-label--let-spcing: 0.33em;
  --se-head-label--line-height: var(--default-text-line-height);
  --se-head-label--mxw: 100%;
  --se-head-label--mb: 6px;

  /* H2 - .section-head__title */
  --se-head-title--color: var(--text-title);
  --se-head-title--font-size: var(--section-title-size); /* uncomment if custom */
  --se-head-title--font: var(--font-heading);
  --se-head-title--font-weight: 700;
  --se-head-title--tex-trans: Uppercase;
  --se-head-title--line-height: 0.81;
  --se-head-title--let-spcing: 0;
  --se-head-title--mb: var(--space-section-head-title-mb);

  /* H3 - .section-head__subtitle */
  --se-head-subtitle--color: var(--text-title);
  --se-head-subtitle--font-size: var(--section-subtitle-size);
  --se-head-subtitle--font: var(--font-body);
  --se-head-subtitle--font-weight: 700;
  --se-head-subtitle--tex-trans: capitalize;
  --se-head-subtitle--line-height: var(--default-title-line-height);
  --se-head-subtitle--let-spcing: 0;
  --se-head-subtitle--mb: var(--space-xs);

  /* Text - .section-head--text-wrap */
  --se-head-text-wrap--mb: var(--space-m);
  --se-hd-txt-wra--txt-ali: left;
  --se-head-text--color: var(--text-body);
  --se-head-text--font-size: var(--font-p);
  /* // --se-head-text--font-size: var(--font-section-text); // Uncomment for custom */
  --se-head-text--font-weight: 400;
  --se-head-text--tex-trans: none;
  --se-head-text--let-spcing: 0;
  --se-head-text--mb: var(--space-xs);

  /* Btn Wrap */
  --se-head-btn-wrap--mt: var(--space-m);

  /* Section Content */
  --se-content-h3--color: var(--text-title);
  --se-content-h3--font-size: var(--font-h3);
  --se-content-h3--font-weight: 400;
  --se-content-h3--text-case: none;
  --se-content-h3--let-spcing: 0;
  --se-content-h3--mb: var(--space-xs);

  --se-content-p--mb: var(--space-default-p-mb); /* Uncomment if custom */

  /* .sec-hd--btn-wrap */
  --sec-hd-btn-wrap--d: flex;
  --sec-hd-btn-wrap--w: 100%;
  --sec-hd-btn-wrap--mnw: 100%;
  --sec-hd-btn-wrap--mxw: auto;
  --sec-hd-btn-wrap--mg: var(--space-xs) 0 0;
  --sec-hd-btn-wrap--pd: 0;
  --sec-hd-btn-wrap--flx-wrp: wrap;
  --sec-hd-btn-wrap--flx-dir: column;
  --sec-hd-btn-wrap--ali-itm: start;
  --sec-hd-btn-wrap--jus-cnt: start;
  --sec-hd-btn-wrap--gap-col: var(--space-2xs);
  --sec-hd-btn-wrap--gap-row: var(--space-2xs);
  --sec-hd-btn-wrap--h: 100%;

  /* Section Body - Footer */ /* To be deleted */
  --se-footer-btn-mt: 52px;
  --se-footer-btn-sbs-col-gap: var(--space-se-f-btn-sbs-col-gap);
  --se-footer-btn-sbs-row-gap: var(--space-se-f-btn-sbs-row-gap);

  &.se--head-wrap {
    --se-hd--mxw: 800px;
    margin-left: auto;
    margin-right: auto;
  }

  &.sec-bg--light-gray {
    --sec--bg: var(--bg-gray-two);
  }
}
/* Section Main - Row */
.section {
  /* .section-row */
  --se-row--d: flex;
  --se-row--h: 100%;
  --se-row--w: 100%;
  --se-row--mxw: 100%;
  --se-row--mg: 0;
  --se-row--pd: 0;
  --se-row--flx-wrp: wrap;
  --se-row--flx-dir: column;
  --se-row--gap-col: 0;
  --se-row--gap-row: 0;
  --se-row--ali-itm: start;
  --se-row--jus-cnt: start;
  --se-row--ovf: visible;
}
/* Section Main - Row / Columns */
.section {
  /* .section-col */
  --se-col--d: flex;
  --se-col--bg: none;
  --se-col--h: 100%;
  --se-col--w: 100%;
  --se-col--mxw: 100%;
  --se-col--mg: 0;
  --se-col--pd: var(--se-base-pd) 0;
  --se-col--flx-wrp: wrap;
  --se-col--flx-dir: column;
  --se-col--ali-itm: start;
  --se-col--jus-cnt: start;
  /* --se-col--ali-self: start; */
  /* --se-col--grid-col: span 2; */
  --se-col--ovf: visible;

  /* .section-col--inner */
  --se-col-inner--d: flex;
  --se-col-inner--w: 100%;
  --se-col-inner--mxw: 100%;
  /* --se-col-inner--mnw: 100%; */
  --se-col-inner--mg: 0;
  --se-col-inner--pd: 0;
  --se-col-inner--flx-wrp: wrap;
  --se-col-inner--flx-dir: column;
  --se-col-inner--ali-itm: start;
  --se-col-inner--jus-cnt: start;
  --se-col-inner--grd-tpl-col: 1fr;
  --se-col-inner--gap-col: 0;
  --se-col-inner--gap-row: 0;
}
/* Section Main - Content */
.section {
  /* .section-content */
  --se-cnt--d: flex;
  --se-cnt--pd: 0;
  --se-cnt--mg: 0;
  --se-cnt--ali-ite: start;
  --se-cnt--jus-con: start;
  --se-cnt--gap-row: 0;
  --se-cnt--gap-col: 0;
  --se-cnt--w: 100%;
  --se-cnt--mxw: 100%;
  /* --se-cnt--mnw: 100%; */

  --se-content-base--display: flex;
  --se-content-base--padding: 0;
  --se-content-base--margin: 0 0 var(--space-xs);
  /* --se-content-base--align-items: ; */
  /* --se-content-base--justify-content: ; */
  --se-cnt-base--txt-ali: left;
  --se-cnt-base--gap-row: 0;
  --se-cnt-base--gap-col: 0;
  --se-content-base--width: 100%;
  --se-content-base--mxw: 100%;
  --se-cnt-base--flx-dir: column;
  /* --se-content-base--mnw: ; */

  --se-content-base-h3--color: var(--text-title);
  --se-content-base-h3--font-family: var(--font-heading);
  --se-content-base-h3--font-size: var(--font-h3);
  --se-content-base-h3--font-weight: 400;
  --se-content-base-h3--text-case: normal;
  --se-content-base-h3--line-height: var(--default-title-line-height);
  --se-content-base-h3--let-spcing: 0;
  --se-content-base-h3--margin: 0 0 var(--space-xs);

  --se-content-base-h4--color: var(--text-title);
  --se-content-base-h4--font-family: var(--font-heading);
  --se-content-base-h4--font-size: var(--font-h4);
  --se-content-base-h4--font-weight: 400;
  --se-content-base-h4--text-case: normal;
  --se-content-base-h4--line-height: var(--default-title-line-height);
  --se-content-base-h4--let-spcing: 0;
  --se-content-base-h4--margin: 0 0 var(--space-xs);

  --se-content-base-h5--color: var(--text-title);
  --se-content-base-h5--font-family: var(--font-heading);
  --se-content-base-h5--font-size: var(--font-h5);
  --se-content-base-h5--font-weight: 400;
  --se-content-base-h5--text-case: normal;
  --se-content-base-h5--line-height: var(--default-title-line-height);
  --se-content-base-h5--let-spcing: 0;
  --se-content-base-h5--margin: 0 0 var(--space-xs);

  --se-content-base-p--color: var(--text-title);
  --se-content-base-p--font-family: var(--font-p);
  --se-content-base-p--font-size: var(--font-p);
  --se-content-base-p--font-weight: 400;
  --se-content-base-p--text-case: normal;
  --se-content-base-p--line-height: var(--default-text-line-height);
  --se-content-base-p--let-spcing: 0;
  --se-content-base-p--margin: 0 0 var(--space-xs);
}
.section-content--base-wrap {
  --se-content-base-wrap--display: flex;
  --se-content-base-wrap--flex-direction: row;
  --se-content-base-wrap--grid-cols: 1fr;
  --se-content-base-wrap--justify-content: start;
  --se-content-base-wrap--align-items: start;
  --se-content-base-wrap--gap-col: var(--space-2xs);
  --se-content-base-wrap--gap-row: 0;
  --se-content-base-wrap--mxw: 100%;
  --se-content-base-wrap--mnw: ;
  --se-content-base-wrap--width: 100%;
}
/* Section Main - Body */
.section {
  /* .section--main */
  --se-main--d: flex;
  --se-main--w: 100%;
  /* --se-main--mnw: 100%; */
  --se-main--mxw: 100%;
  --se-main--mg: 0;
  --se-main--pd: 0;
  --se-main--flx-wrp: wrap;
  --se-main--flx-dir: column;
  --se-main--ali-itm: start;
  --se-main--jus-cnt: start;
  --se-main--grd-tpl-col: 1fr;
  --se-main--gap-col: 0;
  --se-main--gap-row: 0;
  --se-main--bg: none;
  --se-main--bd-clr: var(--border-light-gray);
  --se-main--bd-w: 0;
  --se-main--bd-rad: 0;
  --se-main--bx-sh: 0;

  --se-body--d: flex;
  --se-body--w: 100%;
  /* --se-body--mnw: 100%; */
  --se-body--mxw: 100%;
  --se-body--mg: 0;
  --se-body--pd: 0;
  --se-body--flx-wrp: wrap;
  --se-body--flx-dir: column;
  --se-body--ali-itm: start;
  --se-body--jus-cnt: start;
  --se-body--grd-tpl-col: 1fr;
  --se-body--gap-col: 0;
  --se-body--gap-row: 0;
  --se-body--bg: transparent;
  --se-body--bd-clr: var(--border-light-gray);
  --se-body--bd-w: 0;
  --se-body--bd-rad: 0;
  --se-body--bx-sh: 0;
}
/* Section Main - Base */
.section {
  /* .section-body--wrap */
  --sec-body-wrap--d: flex;
  --sec-body-wrap--w: 100%;
  /* --sec-body-wrap--mnw: 100%; */
  --sec-body-wrap--mxw: 100%;
  --sec-body-wrap--mg: 0;
  --sec-body-wrap--pd: 0;
  --sec-body-wrap--flx-wrp: wrap;
  --sec-body-wrap--flx-dir: column;
  --sec-body-wrap--ali-itm: start;
  --sec-body-wrap--jus-cnt: start;
  --sec-body-wrap--grd-tpl-col: 1fr;
  --sec-body-wrap--gap-col: 0;
  --sec-body-wrap--gap-row: 0;
  --sec-body-wrap--bg: transparent;
  --sec-body-wrap--border-color: var(--border-light-gray);
  --sec-body-wrap--border-width: 0;
  --sec-body-wrap--border-radius: 0;
  --sec-body-wrap--box-shadow: 0;
  /* --sec-body-wrap--h: 100%; */

  /* .section-footer */
  --sec-ftr-wrap--d: flex;
  --sec-ftr-wrap--w: 100%;
  --sec-ftr-wrap--mnw: 100%;
  /* --sec-ftr-wrap--mxw: auto; */
  --sec-ftr-wrap--mg: var(--space-l) 0 0;
  --sec-ftr-wrap--pd: 0;
  --sec-ftr-wrap--flx-wrp: wrap;
  --sec-ftr-wrap--flx-dir: column;
  --sec-ftr-wrap--ali-itm: start;
  --sec-ftr-wrap--jus-cnt: start;
  --sec-ftr-wrap--grd-tpl-col: 1fr;
  --sec-ftr-wrap--gap-col: var(--space-2xs);
  --sec-ftr-wrap--gap-row: var(--space-2xs);
  --sec-ftr-wrap--bg: transparent;
  --sec-ftr-wrap--bd-clr: var(--border-light-gray);
  --sec-ftr-wrap--bd-w: 0;
  --sec-ftr-wrap--bd-rad: 0;
  --sec-ftr-wrap--bx-sh: 0;
  /* --sec-ftr-wrap--h: 100%; */
}
.section-footer.sec-ftr--btn-sbs {
  --sec-ftr-wrap--flx-dir: row;
  --sec-ftr-wrap--gap-col: var(--space-2xs);
  --sec-ftr-wrap--gap-row: var(--space-2xs);
}
/* Section Template */
/* Section - Boxed */
.sec-body--boxed-v1 {
  --se-body--pd: var(--space-m);
  --se-body--bg: #fff;
  --se-body--mg: 0;
  --se-body--bx-sh: var(--def-card--bx-sh);
  --se-body--h: 100%;
}
/* Section Grid */
/* Section Grid - Single */
.section-col-single {
  /* --sec-col-single--col-no: 1fr; */
  --sec-col-single--col-gap: 0;
  --sec-col-single--row-gap: 0;
}
/* Section Grid - Column 2 */
.section-col-2 {
  /* --sec-col-2--col-no: repeat(2, 1fr); */
  --sec-col-2--col-no__on-l: 1fr;
  --sec-col-2--col-no__on-m: var(--sec-col-2--col-no__on-l);
  --sec-col-2--col-gap: 0;
  --sec-col-2--row-gap: 0;

  &.sec-col--w-gap {
    --sec-col-2--col-gap: var(--space-2xs);
    --sec-col-2--row-gap: var(--space-2xs);
  }
  &.sec-col--w-gap-col {
    --sec-col-2--col-gap: var(--space-2xs);
  }
  &.sec-col--w-gap-row {
    --sec-col-2--row-gap: var(--space-2xs);
  }
}
/* Section Grid - Column 3 */
.section-col-3 {
  /* --sec-col-3--col-no: repeat(3, 1fr); */
  --sec-col-3--col-no__on-xl: repeat(3, 1fr);
  --sec-col-3--col-no__on-l: 1fr;
  --sec-col-3--col-no__on-m: var(--sec-col-3--col-no__on-l);
  --sec-col-3--col-gap: var(--space-se-col-2-col-gap);
  --sec-col-3--row-gap: var(--space-se-col-2-row-gap);
}
/* Section Grid - Column 4 */
.section-col-4 {
  /* --sec-col-4--col-no__on-xl: repeat(4, 1fr); */
  --sec-col-4--col-no__on-l: 1fr;
  --sec-col-4--col-no__on-m: var(--sec-col-4--col-no__on-l);
  --sec-col-4--col-gap: var(--space-se-col-2-col-gap);
  --sec-col-4--row-gap: var(--space-se-col-2-row-gap);
}
/* Section Grid - Column 5 */
.section-col-5 {
  /* --sec-col-5--col-no__on-xl: repeat(5, 1fr); */
  --sec-col-5--col-no__on-l: 1fr;
  --sec-col-5--col-no__on-m: var(--sec-col-5--col-no__on-l);
  --sec-col-5--col-gap: var(--space-se-col-2-col-gap);
  --sec-col-5--row-gap: var(--space-se-col-2-row-gap);
}
/* Section Grid - Column 6 */
.section-col-6 {
  /* --sec-col-6--col-no__on-xl: repeat(6, 1fr); */
  --sec-col-6--col-no__on-l: 1fr;
  --sec-col-6--col-no__on-m: var(--sec-col-6--col-no__on-l);
  --sec-col-6--col-gap: var(--space-se-col-2-col-gap);
  --sec-col-6--row-gap: var(--space-se-col-2-row-gap);
}

/******** Additional *********/

.section--page-carousel {
  --sec--pd: 80px;
  --sec--bg: #f8f9fd;
}

/* Custom */

.section-head {
  .section-head__label {
    position: relative;
    &::after {
      content: "";
      display: block;
      position: absolute;
      height: 2px;
      width: 60px;
      background-color: var(--accent-two);
      right: -74px;
      transform: translateY(-50%);
      top: calc(50% - 3px);
    }

    &.section-head__label--double {
      &::after {
        content: "";
        display: block;
        position: absolute;
        height: 2px;
        width: 60px;
        background-color: var(--accent-two);
        right: -74px;
        transform: translateY(-50%);
        top: calc(50% - 3px);
      }
      &::before {
        content: "";
        display: block;
        position: absolute;
        height: 2px;
        width: 60px;
        background-color: var(--accent-two);
        left: -74px;
        transform: translateY(-50%);
        top: calc(50% - 3px);
      }
    }

    &.section-head__label--left {
      &::after {
        content: none;
      }

      &::before {
        content: "";
        display: block;
        position: absolute;
        height: 2px;
        width: 60px;
        background-color: var(--accent-two);
        left: -74px;
        transform: translateY(-50%);
        top: calc(50% - 3px);
      }
    }

    &.section-head__label--alt-color {
      --se-head-label--color: var(--primary);

      &::after {
        background-color: var(--primary);
      }
      &::before {
        background-color: var(--primary);
      }
    }
  }

  .section-head__title {
    background-image: linear-gradient(110deg, #009fe3 0%, #1d3292 100%);
    /* 2. Clip the background image to the text shape */
    -webkit-background-clip: text;
    background-clip: text;

    /* 3. Make the foreground text transparent to reveal the gradient underneath */
    -webkit-text-fill-color: transparent;
    color: transparent; /* Fallback */
    padding-bottom: 0.15em;
    margin-bottom: -0.15em;

    &.sh-title--alt-pattern {
      background-image: linear-gradient(180deg, #009fe3 0%, #1d3292 100%);
    }

    &.sh-title--sm-size {
      --se-head-title--font-size: 68px;
    }
    &.sh-title--narrow-spacing {
      --se-head-title--let-spcing: -0.05em;
    }

    &.sh-title--light {
      background-image: unset;
      -webkit-background-clip: text;
      background-clip: unset;
      -webkit-text-fill-color: unset;
      color: #fff;
    }
  }

  .section-head__title-alt1 {
    --se-head-title--color: var(--primary);
    --se-head-title--font-size: 84px;
    --se-head-title--font: var(--font-custom-1);
    padding-top: 0.15em;
    margin-bottom: -0.07em;
  }
}

/* home custome 2 col section */
.section-2-col-fw-left-01 {
  position: relative;
  .sec-col-2-fw-bg--left-fw {
    --se-col--bg: var(--bg-gray-one);
    --se-col--ali-itm: end;
    position: relative;

    .accent-text {
      position: absolute;
      top: 176px;
      right: 20px;
      writing-mode: vertical-rl;
      transform: rotate(180deg);
      white-space: nowrap;
      width: fit-content;
      height: fit-content;

      p {
        font-size: 14px;
        margin-bottom: 0;
      }
    }

    .section-col--inner {
      --se-col-inner--w: calc(var(--body-container-w) / 2);
      --se-col-inner--mxw: var(--body-container-mw);
    }

    .section-head {
      --se-hd--mxw: 400px;
    }

    .sec-img-accent {
      position: absolute;
      width: fit-content;
      height: fit-content;
      bottom: -12px;
      right: 0;
    }
  }

  .sec-col-2-fw-bg--right {
    position: relative;

    .section-col--inner {
      --se-col-inner--mxw: 83%;
      --se-col-inner--mg: 0 0 74px;
    }

    .accent-text {
      position: absolute;
      font-size: 18px;
      top: 250px;
      right: 80px;
      writing-mode: vertical-rl;
      transform: rotate(180deg);
      white-space: nowrap;
      width: fit-content;
      height: fit-content;

      p {
        margin-bottom: 0;
      }
    }

    .section-content--scroll {
      height: 306px;
      overflow-y: scroll;

      &::-webkit-scrollbar {
        display: none;
      }
    }

    .section-content--scroll-wrap {
      margin-bottom: 48px;

      &:last-child {
        margin-bottom: 0;
      }
    }
    .section-head {
      --se-hd--mg: 0 0 26px;
      .section-head__title-alt1 {
        margin-bottom: 26px;
      }
    }

    .section-content--base-wrap {
      --se-content-base-wrap--mxw: 478px;
    }
  }
}
/* desktop-1440 | __on-3xl */
@media (max-width: 1440px) {
  .section-2-col-fw-left-01 {
    .sec-col-2-fw-bg--left-fw {
      .section-col--inner {
        --se-col-inner--w: calc(var(--body-container-w__on-3xl) / 2);
        --se-col-inner--mxw: var(--body-container-mw);
      }
    }

    /* .sec-col-2-fw-bg--right {

    } */
  }
}

.section-2-col-fw-lr-01 {
  --se-col-inner--pd: var(--sec--pd);
  position: relative;

  .accent-text {
    position: absolute;
    font-size: 14px;
    top: 208px;
    right: 13px;
    writing-mode: vertical-rl;
    transform: rotate(180deg);
    white-space: nowrap;
    width: fit-content;
    height: fit-content;
    z-index: 6;

    p {
      font-size: 14px;
      font-weight: 300;
      color: var(--text-light);
      margin-bottom: 0;
    }
  }

  .sec-col-2-fw-bg--left-fw,
  .sec-col-2-fw-bg--right-fw {
    position: relative;
    --se-col--pd: 0;

    .sec-img--bg {
      position: absolute;

      figure {
        width: 100%;
        height: 100%;

        img {
          width: 100%;
          height: 100%;
          object-fit: cover;
        }
      }
    }

    .sec-img--accent {
      position: absolute;
      bottom: -62px;
      right: 2px;
      height: fit-content;
      width: fit-content;
    }

    .section-col--inner {
      --se-col-inner--w: calc(var(--body-container-w) / 2);
      --se-col-inner--mxw: var(--body-container-mw);
    }

    .section-content {
      z-index: 6;
    }
  }

  .sec-col-2-fw-bg--left-fw {
    --se-col--ali-itm: end;
    --se-content-base--mxw: 560px;
    --se-col-inner--jus-cnt: center;
    .sec-img--bg {
      position: absolute;

      figure {
        img {
          filter: grayscale(100%);
        }
      }

      &::after {
        content: "";
        background: rgba(0, 0, 0, 0.65);
        height: 100%;
        width: 100%;
        display: block;
        position: absolute;
      }
    }
  }

  .sec-col-2-fw-bg--right-fw {
    --se-col--ali-itm: start;

    --se-hd--ali-itm: end;
    --se-col-inner--ali-itm: end;
    --se-cnt--mxw: 84%;
    overflow: visible;

    .section-head {
      height: 214px;
      position: relative;

      .section-head__title {
        position: absolute;
        white-space: nowrap;
        right: 166px;
        top: 46px;
      }
    }
  }
}

/* home custome 2 col section */
.section-1-col--w-spit-head-bg {
  --sec--w: 100%;

  &::before {
    content: "";
    display: block;
    background: url("/wp-content/uploads/home-sec-two-head-bg.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    position: absolute;
    top: 0;
    left: 0;
    width: 79%;
    height: 484px;
    /* z-index: 0; */
  }

  &::after {
    content: "";
    display: block;
    background: var(--bg-gray-one);
    position: absolute;
    top: 0;
    right: 0;
    width: 21%;
    height: 484px;
    /* z-index: 0; */
  }

  position: relative;
  .section-head {
    max-width: 800px;
    margin-bottom: 0;
    z-index: 6;

    .section-head__label,
    .section-head__title {
      z-index: 8;
    }
  }

  .section-body {
    z-index: 6;
  }
}

.section-3-col--imgs-v1 {
  --sec--w: 100%;
  --sec--bg: var(--bg-gray-one);
  --se-footer-btn-mt: 66px;
  margin-top: -28px;

  .section-body {
    z-index: 4;
  }

  .card-item--img-content {
    .card-item--img {
      --card-item--img-aspect-ratio: 16/12;
      position: relative;

      figure {
        width: 100%;
      }

      .card-item--head-title {
        position: absolute;
        bottom: 18px;
        left: 26px;
        line-height: 1;
        --ci-head-title--color: var(--text-light);
        --ci-head-title--font-weight: 700;
        --ci-head-title--font-size: 24px;

        a {
          color: var(--text-light);
          font-size: 24px;
        }

        &::after {
          content: "";
          display: inline-block;
          position: absolute;
          right: -54px;
          top: 50%;
          transform: translateY(calc(-50% + 2px));
          width: 38px;
          height: 18px;
          background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 38 18' fill='none' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M 3 2 L 10 9 L 3 16' stroke='%23ffffff' opacity='1.0'/%3E%3Cpath d='M 15 2 L 22 9 L 15 16' stroke='%23ffffff' opacity='0.6'/%3E%3Cpath d='M 27 2 L 34 9 L 27 16' stroke='%23ffffff' opacity='0.3'/%3E%3C/svg%3E");
          background-repeat: no-repeat;
          background-position: center;
          background-size: contain;
          flex-shrink: 0;
        }
      }
    }
  }
}

.section-2-col--right-fw-img-v1 {
  position: relative;

  .sec-col--float {
    position: absolute;
    top: 0;
    max-width: clamp(28.5rem, calc(2.122rem + 42.503vw), 53.125rem); /* min: 456px, max: 850px */
    right: 0;
    height: 100%;
    width: 100%;

    figure {
      height: 100%;
      width: 100%;

      img {
        object-fit: cover;
      }
    }

    .section-content {
      position: absolute;
      bottom: 0;
      right: 8px;
      writing-mode: vertical-rl;
      transform: rotate(180deg);
      white-space: nowrap;
      width: fit-content;
    }
  }
}

.section-2-col-fw-left-uneven-01 {
  padding-top: 118px;
  padding-bottom: 166px;
  position: relative;

  .accent-text {
    position: absolute;
    font-size: 14px;
    top: 278px;
    right: 13px;
    writing-mode: vertical-rl;
    transform: rotate(180deg);
    white-space: nowrap;
    width: fit-content;
    height: fit-content;

    p {
      font-size: 14px;
      font-weight: 300;
      color: var(--text-light);
      margin-bottom: 0;
    }
  }

  .section-col-2 {
    display: grid;
    /* grid-template-columns: 766fr 370fr; Automatically scales proportionally at 1136px, 1334px, and beyond */
    grid-template-columns: 781fr 355fr;
    width: 100%;
    /* max-width: 1334px; */
  }

  .section-col--left-fw-item {
    position: relative;

    .se--col-inner {
      position: absolute;
      top: -210px;
      right: 31px;
    }

    .section-content--img {
      transform: scale(1.07);
      overflow-y: scroll;
      height: 100%;
      max-height: 790px;

      figure {
        aspect-ratio: 950 / 795;
        height: 100%;
        width: 100%;
        margin-bottom: 36px;
        position: relative;

        img {
          height: 100%;
          width: 100%;
          object-fit: cover;
        }

        &::after {
          content: "";
          display: block;
          position: absolute;
          width: 20%;
          height: 100%;
          background-image: linear-gradient(
            to left,
            #1413139f 0%,
            /* Opaque dark color on the far-right */ transparent 100% /* Fully transparent on the far-left */
          );
          z-index: 6;
          top: 0;
          right: 0;
        }

        &:last-child {
          margin-bottom: 0;
        }
      }

      &::-webkit-scrollbar {
        display: none;
      }
    }
  }

  .section-col--right {
    overflow: visible;
    --se-col-inner--ali-itm: end;
    --se-cnt--mxw: 330px;
    --se-footer-btn-mt: 30px;
    /* --se-content-base--mxw: 430px; */

    .section-head {
      height: 228px;
      position: relative;

      .section-head__title {
        position: absolute;
        top: 31px;
        left: -139px;
        white-space: nowrap;
      }
    }

    .section-content--base {
      padding-left: 18px;

      .brxe-list {
        li {
          margin-bottom: 32px;

          .content {
            align-items: end;

            .title {
              font-weight: 700;
              font-family: var(--font-custom-1);
              letter-spacing: 0.33em;
              margin-right: 0;
              line-height: 0.7;
            }

            .meta {
              margin-left: 0;
              font-weight: 300;
              line-height: 1;
            }
          }
        }
      }
    }

    .section-content--footer-btn {
      padding-left: 18px;
    }
  }
}

/****** Responsive ********/
/* desktop-1440 | __on-3xl */
@media (max-width: 1440px) {
  .section-2-col-fw-left-uneven-01 {
    .section-col--left-fw-item {
      .se--col-inner {
        top: -184px;
        right: 38px;
      }

      .section-content--img {
        transform: scale(1.07);
        overflow-y: scroll;
        height: 100%;
        max-height: 780px;

        figure {
          aspect-ratio: 827 / 795;
          height: 100%;
          width: 100%;
          margin-bottom: 36px;
          position: relative;
        }
      }
    }

    .section-col--right {
      .section-head {
        height: 228px;

        .section-head__title {
          top: 31px;
          left: -90px;
        }
      }
    }
  }
}

.section-2-col-fw-right-02 {
  position: relative;

  .accent-text {
    position: absolute;
    font-size: 14px;
    top: 164px;
    left: 18px;
    writing-mode: vertical-rl;
    transform: rotate(180deg);
    white-space: nowrap;
    width: fit-content;
    height: fit-content;

    p {
      font-size: 14px;
      font-weight: 300;
      margin-bottom: 0;
    }
  }

  .sec-img--badge {
    position: absolute;
    width: fit-content;
    right: 36px;
    top: 36px;
    z-index: 1;
    max-width: 484px;
  }

  &::after {
    content: "";
    display: block;
    position: absolute;
    width: 586px;
    height: 100%;
    background: #fff;
    z-index: 0;
    top: 0;
    right: 0;
  }

  .sec-col-2-fw-bg--left {
    --se-content-base--mxw: 430px;
    padding: 202px 0 174px;
    z-index: 6;

    .section-col--inner {
      margin-bottom: 110px;
    }

    /* .section-content {
      z-index: 10;
    } */
  }

  .section-col--right-fw-item {
    --se-col--jus-cnt: center;
    position: relative;

    .sec-img--arrow-down {
      position: absolute;
      bottom: 70px;
      right: 324px;
      width: fit-content;
      z-index: 6;
    }

    .section-col--inner {
      width: calc(100% + 150px);
      position: absolute;
      right: 0;
      max-width: none;
    }

    .section-content {
      height: 680px;
      overflow-y: scroll;
      padding-left: 40px;
      padding-bottom: 40px;
      padding-top: 40px;
      z-index: 4;

      &::-webkit-scrollbar {
        display: none;
      }
    }

    .card-item--content-img {
      display: grid;
      --ci-content-img--default-mxh: 600px;
      --card-item-bg: #fff;
      --card-item--ali-itm: center;
      --card-item--w: calc(100% + 20px);
      --card-item-box-shadow: 0 0 50px 0 rgba(202, 207, 234, 0.51);
      --card-item--grd-tpl-col: 70fr 30fr;
      --card-item--content-pd: 0;
      --card-item--content-title-size: 84px;
      --card-item--content-title-ff: var(--font-custom-1);
      --card-item--content-title-weight: 700;
      --card-item--content-title-line-height: 1;
      --card-item--content-title-mb: 12px;
      --card-item-cnt--ali-itm: center;
      --card-item-content-subtitle--size: 24px;
      --card-item-content-subtitle--weight: 700;
      --card-item-content-subtitle--mg: 0 0 20px;
      --card-item--img-aspect-ratio: auto;
      --card-item--img-trf_hov: none;
      max-height: var(--ci-content-img--default-mxh);
      margin-bottom: 120px;

      &:last-child {
        margin-bottom: 0;
      }

      .card-item--img {
        width: 100%;

        figure {
          width: 100%;
          max-height: var(--ci-content-img--default-mxh);

          img {
            max-height: var(--ci-content-img--default-mxh);
          }
        }
      }

      .card-item--content {
        .card-item--content-wrap {
          max-width: 460px;
          margin-left: 30px;
        }
      }
    }
  }
}