/** Hero section home **/  
  .ar-hero-section {
    display: grid;
    grid-template-columns: 8% auto 15% 4% auto 10%;
    grid-template-rows: 7% auto 7% repeat(2, auto) 8%;
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    max-width: 1320px;
    width: 100%;
    margin: 0 auto !important;
  }

  .ar-hero-section .wp-block-button__link  {
    background-color: var(--wp--preset--color--black)!important;
    color: var(--wp--preset--color--white);
  }

  .ar-hero-section .wp-block-button__link:hover {
    background-color: transparent!important;
    color: var(--wp--preset--color--black);
  }
  
  .violet-block h1 {
    font-size: clamp(2.8125rem, 2.25rem + 2.8125vw, 5.625rem) !important;
    line-height: 1;
    margin-bottom: 10px;
  }
  .violet-block {
    grid-area: 1 / 1 / 5 / 4;
    width: 100%;
    position: relative;
    top: 0;
    left: 0;
    z-index: 3;
  }
  .violet-block .wp-block-button__link {
    background-color: var(--wp--preset--color--section-bg);
  }
  .violet-block .wp-block-button__link:hover {
    background-color: var(--wp--preset--color--black);
  }
  .orange-block {
    grid-area: 3 / 2 / 7 / 5;
    min-width: 645px;
    width: 100%;
  }
  .image-block {
    grid-area: 4 / 3 / 6 / 7;
    width: 100%;
    position: relative;
    top: 30px;
    left: 0;
    z-index: 4;
  }
  .text-block {
    grid-area: 2 / 3 / 4 / 7;
    position: relative;
    top: 0;
    left: 0;
    z-index: 5;
  }
  
  @media (max-width: 1023px) {
    .ar-hero-section-container {
      padding: 60px 0;
    }
    .ar-hero-section {
      padding-left: 15px;
      padding-right: 15px;
    }
    .ar-hero-section .image-block {
      display: none;
    }
    .violet-block {
      grid-area: 1 / 1 / 4 / 6;
      top: -35px;
      left: -25px;
    }
    .violet-block .wp-block-group {
      padding-bottom: 70px !important;
    }
    .orange-block {
      grid-area: 2 / 1 / 5 / 7;
    }
    .text-block {
      grid-area: 5 / 3 / 7 / 6;
      top: 20px;
      left: 40px;
    }
  }
  @media (max-width: 781px) {
    .ar-hero-section {
      display: flex !important;
      flex-direction: column;
      justify-content: center;
      padding-left: 0 !important;
      padding-right: 0 !important;
    }
  
    .violet-block {
      position: relative;
      top: 0 !important;
      left: 0 !important;
      width: 100% !important;
    }
  
    .violet-block .wp-block-group {
      padding: 50px 6vw !important;
    }
  
    .text-block {
      position: relative;
      top: 10px !important;
      left: 0 !important;
      z-index: 5;
    }
  
    .text-block .wp-block-group {
      padding-left: 0 !important;
    }
  }
  