.fc_split_content {
  display: flex;
  flex-direction: column;
  gap: var(--gap-xxl);
  overflow: hidden;

  &.landscape {
    gap: clamp(24px, 10.458vw + -36.235px, 152px);
  }

  .content,
  .image_graphic_container {
    flex-basis: 100%;
  }

  .content_graphic {
    &::before {
      content: "";
      display: block;
      width: 56px;
      height: 33px;
      margin-bottom: var(--gap-s);
    }

    &.green {
      &::before {
        background: center / contain no-repeat
          url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 224 132'%3E%3Cpath fill='%2382bf39' d='M86 0h52L52 132H0z'/%3E%3Cpath fill='%23bad98a' d='M139 0h-35l86 132h34z'/%3E%3Cpath fill='%2382bf39' d='M86 0h52L52 132H0z'/%3E%3Cpath fill='%23bad98a' d='M139 0h-35l86 132h34z'/%3E%3C/svg%3E");
      }
    }
    &.teal {
      &::before {
        background: center / contain no-repeat
          url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 224 132'%3E%3Cpath fill='%23139990' d='M86 0h52L52 132H0z'/%3E%3Cpath fill='%237bcac5' d='M139 0h-35l86 132h34z'/%3E%3Cpath fill='%23139990' d='M86 0h52L52 132H0z'/%3E%3Cpath fill='%237bcac5' d='M139 0h-35l86 132h34z'/%3E%3C/svg%3E");
      }
    }
    &.orange {
      &::before {
        background: center / contain no-repeat
          url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 224 132'%3E%3Cpath fill='%23e76925' d='M86 0h52L52 132H0z'/%3E%3Cpath fill='%23f89b66' d='M139 0h-35l86 132h34z'/%3E%3Cpath fill='%23e76925' d='M86 0h52L52 132H0z'/%3E%3Cpath fill='%23f89b66' d='M139 0h-35l86 132h34z'/%3E%3C/svg%3E");
      }
    }
  }

  .image_graphic_container {
    .image {
      display: block;
      width: 100%;
      aspect-ratio: 4 / 3;
      border-radius: var(--border-radius-l);
      z-index: 1;
    }

    .graphic {
      display: none;
    }
  }

  /* responsive */
  @media (width >= 992px) {
    flex-direction: row;
    align-items: center;

    &.landscape {
      .content {
        flex-basis: 45%;
      }

      .image_graphic_container {
        flex-basis: 55%;
      }
    }

    .content {
      flex-basis: 40%;
    }

    .image_graphic_container {
      position: relative;
      flex-basis: 60%;

      .image {
        aspect-ratio: 1;
      }

      .graphic {
        display: inline-block;
        position: absolute;
        z-index: 2;
        pointer-events: none;
        bottom: -22.4475124%;
        left: 37%;
        width: 132.8412246%;
        aspect-ratio: 905.42 / 486;

        &.green {
          background: bottom right / contain no-repeat
            url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 3622 1944'%3E%3Cpath fill='%23c3c9c6' d='M1569 0h393l-701 1089H861z'/%3E%3Cpath fill='%2374837c' d='M1964 0h-175l220 357h185z'/%3E%3Cpath fill='%23bad98a' d='M682 631H575l226 357h107z'/%3E%3Cpath fill='%2382bf39' d='M2075 468h589l-964 1476h-584z'/%3E%3Cpath fill='%23bad98a' d='M2676 468h-399l964 1476h381z'/%3E%3Cpath fill='%2382bf39' fill-rule='evenodd' d='M220 1332H0l456-701h220z' clip-rule='evenodd'/%3E%3C/svg%3E");
        }

        &.teal {
          background: bottom right / contain no-repeat
            url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 3622 1944'%3E%3Cpath fill='%23006761' d='M1569 0h393l-701 1089H861z'/%3E%3Cpath fill='%2364c1bb' d='M1964 0h-175l220 357h185z'/%3E%3Cpath fill='%237bcac5' d='M682 631H575l226 357h107z'/%3E%3Cpath fill='%23139990' d='M2075 468h589l-964 1476h-584z'/%3E%3Cpath fill='%237bcac5' d='M2676 468h-399l964 1476h381z'/%3E%3Cpath fill='%23139990' fill-rule='evenodd' d='M220 1332H0l456-701h220z' clip-rule='evenodd'/%3E%3C/svg%3E");
        }

        &.orange {
          background: bottom right / contain no-repeat
            url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 3622 1944'%3E%3Cpath fill='%23dd1a32' d='M1569 0h393l-701 1089H861z'/%3E%3Cpath fill='%23f4795e' d='M1964 0h-175l220 357h185z'/%3E%3Cpath fill='%23b80b4b' d='M682 631H575l226 357h107z'/%3E%3Cpath fill='%23e76925' d='M2075 468h589l-964 1476h-584z'/%3E%3Cpath fill='%23f89b66' d='M2676 468h-399l964 1476h381z'/%3E%3Cpath fill='%23f26925' fill-rule='evenodd' d='M220 1332H0l456-701h220z' clip-rule='evenodd'/%3E%3C/svg%3E");
        }
      }

      &.landscape {
        .image {
          aspect-ratio: 1.43 / 1;
        }
      }
    }

    &.right {
      flex-direction: row-reverse;

      .image_graphic_container {
        .graphic {
          left: auto;
          right: 37%;
          transform: scaleX(-1);
        }
      }
    }

    &.padding_l {
      .image_graphic_container {
        .graphic {
          width: 111.2886466%;
          bottom: -18.8055409%;
          left: 48%;
        }
      }

      &.right {
        .image_graphic_container {
          .graphic {
            left: auto;
            right: 48%;
          }
        }
      }
    }
  }
}