.section.contact-banner {
  max-width: 100% !important;
  margin: auto;
  padding: 0;
}

.section.contact-banner .default-content-wrapper h1 {
  margin: 20px 0;
}

.contact-banner .columns-wrapper {
  width: 100vw;
  margin-left: calc(50% - 50vw);
}

.contact-banner .columns-wrapper {
  max-width: 100%;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background: linear-gradient(213.03deg, #4e0004, #c00109 52%, #D04B28 39.64%, #B1282F 74.73%);
}

.contact-banner .columns-wrapper .columns-img-col {
  flex: none;
  width: 65%;
}

.contact-banner .columns-img-col img {
  width: auto;
  height: 100%;
}

.contact-banner .columns-wrapper .columns>div {
  /* justify-content: center; */
  justify-content: space-between;
  gap: 0;
  /* height: 360px; */
  width: 100%;
  max-width: 1248px;
  position: relative;
  margin: auto;
  align-items: center;
}

.contact-banner .columns-wrapper .columns>div>div:nth-child(2) {
  /* background: linear-gradient(to bottom, #4E0004, #8E0006); */
  padding: 35px 40px;
  width: 35%;
  flex: none;
  height: 100%;
}

.contact-banner .columns-wrapper div .button-container .btn-call-icon::before {
  content: url("/icons/call-white.svg");
  display: inline-block;
  margin-right: 8px;
  vertical-align: middle;
}


.contact-banner .columns-wrapper div .button-container a.button {
  font-size: 22px;
  font-family: var(--body-font-family-semibold);
  margin-top: 30px;
  color: white;
}

.contact-banner .columns-wrapper div h1 {
  font-size: 40px;
  line-height: 130%;
  letter-spacing: -1%;
  font-weight: 600;
  color: white;
  font-family: var(--body-font-family-semibold);
  max-width: 332px;
}

.contact-banner .columns-wrapper div p{
  color: white;
  font-size: 20px;
}

@media (max-width : 1024px) {
  .contact-banner .columns-wrapper .columns>div>div:nth-child(2) {
    width: 35%;
  }

  .contact-banner .columns-wrapper .columns-img-col {
    flex: 1;
    height: 100%;
  }
}


@media screen and (max-width : 767px) {
  .contact-banner .columns-wrapper .columns>div>div:nth-child(2) {
    width: 45%;
    /* background: linear-gradient(to bottom, #4E0004, #8E0006); */
  }
}


@media (max-width: 820px) {
  .contact-banner .columns-wrapper .columns {
    flex-direction: column;
    /* stack image and text */
    height: auto;
    /* remove fixed desktop height */
    padding-bottom: 0;
  }

  .contact-banner .columns-wrapper {
        background: linear-gradient(180deg, #4e0004, #c00109 36%, #D04B28 46.64%, #B1282F 74.73%);  }

  .contact-banner .columns-wrapper .columns>div {
    height: auto;
    gap: 0;
    flex-direction: column-reverse;
  }

  .contact-banner #contact-us {
    padding-bottom: 8px;
    font-size: var(--heading-font-size-h1);
  }

  /* Image section full width */
  .contact-banner .columns-wrapper .columns-img-col {
    width: 100% !important;
    flex: none;
    /* background: linear-gradient(205.03deg, #F46F24 18.61%, #D04B28 44.64%, #B1282F 74.73%); */
  }

  .contact-banner .columns-wrapper .columns-img-col img {
    width: 100%;
    height: 220px;
    object-fit: cover;
  }

  /* Gradient box full width below image */
  .contact-banner .columns-wrapper .columns>div>div:nth-child(2) {
    width: 100% !important;
    padding: 24px 24px 40px;
    height: auto;
    /* text-align: center; */
  }

  /* Headings inside gradient box */
  .contact-banner .columns-wrapper div h1 {
    font-size: 24px;
    font-weight: 500;
    font-family: var(--body-font-family-medium);
    line-height: 140%;
    letter-spacing: 0;
    /* margin: 0 0 20px 0; */
    max-width: unset;
  }

  /* Phone button */
  /* .contact-banner .button-container {
    text-align: center;
  } */

  .contact-banner .button-container .button {
    /* display: inline-block; */
    color: #fff;
    /* padding: 10px 20px; */
    font-size: 16px;
    font-weight: 600;
    font-family: var(--body-font-family-semibold);
  }

  .contact-banner .columns-wrapper div .button-container a.button {
    font-size: 16px;
    margin-top: 16px;
  }
}