.hero_slider {
  position: relative;
  z-index: 0;
  isolation: isolate;

  .glide__track {
    overflow: hidden;
  }

  .glide__slides {
    display: inline-flex;
    align-items: stretch;
    padding: 0;
    margin-top: 0;
    width: 100%;
  }

  .glide-flex-wrap {
    flex-wrap: wrap;
  }

  .glide__slide {
    position: relative;
    width: 100% !important;
    min-height: 570px;
    overflow: hidden;

    /* display: flex; */
    .image {
      height: 100%;
      left: 0;
      position: absolute;
      top: 0;
      width: 100%;

      &::before {
        background: linear-gradient(to right, rgba(0, 0, 0, 0.5), 50%, rgba(0, 0, 0, 0));
    
        bottom: 0;
        content: "";
        height: 100%;
        left: 0;
        position: absolute;
        width: 100%;
        z-index: 1;
      }

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

    .slide_contents_wrapper {
      margin-left: auto;
      margin-right: auto;
      padding-left: 45px;
      padding-right: 45px;
      max-width: 73.125rem;
      position: relative;
      top: 0;
      padding-top: 202px;
      display: flex;
      flex-direction: column;
      z-index: 2;
      color: var(--color-white);

      padding-bottom: 260px;

      .overline {
        margin: 2rem 1rem;
        color: var(--color-white);
        font-size: 0.8rem;
        font-weight: 700;
        letter-spacing: 1px;
        line-height: 16px;
      }

      .subtext-slide {
        font-weight: 300;
        font-size: 1.5rem;
        margin-bottom: 32px;
        margin-top: 42px;
        line-height: 32px;
        letter-spacing: 0;
        max-width: 500px;
        padding: 0 16px;
      }

      .h_title {
        max-width: 500px;
        padding: 0 16px;
        margin: 0;
      }

      .h_title .alert-heading {
        color: var(--color-white);
        font-size: 3rem;
        font-weight: 300;
        letter-spacing: 0;
        line-height: 60px;
        text-align: start;
      }

      .h_title h2 {
        color: var(--color-white);
        font-size: 3rem;
        font-weight: 300;
        letter-spacing: 0;
        line-height: 60px;
      }

      .cta_button {
        display: block;

        .field__item {
          display: flex;
          padding: 0 16px;
        }
      }
    }
  }

  .glide__arrows {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    pointer-events: none;
    z-index: 3;
  }

  .glide__arrow {
    pointer-events: all;
    display: flex !important;
    position: absolute;
    background: var(--color-white);
    border-radius: 50%;
    box-shadow: 0 10px 40px 0 rgba(0, 0, 0, 0.1);
    height: 40px;
    width: 40px;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: none;
    cursor: pointer;
    top: 50%;
    transform: translateY(-50%);
  }

  .glide__arrow--left {
    left: 0.3em;
  }

  .glide__arrow--right {
    right: 0.3em;
  }

  .glide__arrow::before {
    content: none !important;
  }

  .glide__arrow::after {
    background-image: url("/themes/custom/generali/images/icons/arrow_right_red.svg");
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    display: block;
    height: 24px;
    width: 24px;
  }

  .glide__arrow--left::after {
    transform: rotate(180deg);
  }

  .glide__bullets {
    display: flex;
    justify-content: center;
    margin-top: 20px;
    bottom: 0.01rem;

    button {
      width: 10px;
      height: 10px;
      margin: 0 4px;
      border-radius: 50%;
      border: none;
      background: var(--color-gray);
      cursor: pointer;

      &.glide__bullet--active {
        background: var(--color-red);
      }
    }
  }
}

@media (max-width: 1024px) {
  .hero_slider {
    .glide__arrow {
      top: 56%;
    }
  }
}

@media (max-width: 1024px) {
  .hero_slider {
    .glide__slide {
      min-height: 0;
      aspect-ratio: 3 / 4;

      .image {
        &::before {
          background: linear-gradient(to right, rgba(0, 0, 0, 0.5), 75%, rgba(0, 0, 0, 0));
        }
      }
    }
        background-color: #f5f5f5;
  }
}

@media (max-width: 768px) {
  .hero_slider {
    .glide__slide {
      min-height: 0;
      aspect-ratio: 3 / 4;
      position: relative;

      .image img {
        height: 100%;
        width: 100%;
        position: absolute;
        top: 0;
        left: 0;
        object-fit: cover;
      }

      .slide_contents_wrapper {
        position: relative;
        top: auto;
        transform: none;
        z-index: 2;
        flex-direction: column;
        text-align: left;

        .h_title .alert-heading {
          font-size: 2rem;
          line-height: 110%;
          font-weight: 300;
        }

        .subtext-slide {
          font-size: 1.25rem;
          line-height: 28px;
        }

        .cta_button {
          margin-top: 0;
          align-self: flex-start;

          .button {
            white-space: wrap;
            letter-spacing: 0;
          }
        }

        .overline {
          margin: 0.5rem 1rem;
        }

        .subtext-slide {
          margin-top: 32px;
        }
      }

      .image {
        height: 100%;
        left: 0;
        position: absolute;
        top: 0;
        width: 100%;

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

    .glide__bullets {
      margin-top: 40px;
    }

    .glide__arrow {
      top: 51%;
    }

  }
}

@media (max-width: 479px) {
  .hero_slider {
    .glide__slide {
      min-height: 0;
      aspect-ratio: 3 / 4;

      .slide_contents_wrapper {
        position: absolute;
        top: 0;
        bottom: auto;
        left: 0;
        right: 0;
        padding: 40px 35px 0 35px;
        margin: 0;
        z-index: 2;
        max-width: 100%;
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
      }
    }

    .glide__arrow {
      top: 55%;
    }
  }
}

.hero_slider .glide .glide__bullets {
  bottom: 0.01rem;
}