section.contact-section {
  margin-bottom: 100px;
}
section.contact-section .contact-row {
  display: flex;
  flex-wrap: wrap;
}

section.contact-section .contact-row .left-col {
  width: 45.51%;
  padding-right: 48px;
}
section.contact-section .contact-row .right-col {
  width: 54.49%;
  border: 1px solid #e4e8f0;
  box-shadow: 0px 18px 48px -24px #0e172638;
  padding: 40px;
  border-radius: 12px;
  height: 100%;
}
section.contact-section .contact-row .left-col .info-card {
  border-top: 1px solid #e4e8f0;
  box-shadow: 0 0 0 1px #e4e8f0;
  transition: all 0.25s ease;
  padding: 28px;
  border-radius: 12px;
  margin-bottom: 24px;
}
section.contact-section .contact-row .left-col .info-card:hover {
  box-shadow:
    0 0 0 1px #f5822059,
    0 4px 16px -4px rgba(245, 130, 32, 0.2);
}

section.contact-section .contact-row .left-col .info-card:last-child {
  margin-bottom: 0;
}

section.contact-section .contact-row .left-col .info-card img {
  width: 48px;
  height: 48px;
  margin-bottom: 16px;
}
section.contact-section .contact-row .left-col .info-card .info-heading {
  display: block;
  font-size: 18px;
  line-height: 28px;
  font-weight: 800;
  font-family: var(--font-heading);
  color: var(--color-heading);
  margin-bottom: 4px;
}
section.contact-section .contact-row .left-col .info-card .info-link {
  display: block;
  font-size: 17px;
  line-height: 27px;
  font-weight: 600;
  color: #3b5e96;
  margin-bottom: 4px;
}

section.contact-section .contact-row .left-col .info-card p {
  font-size: 16px;
  line-height: 26px;
}
section.contact-section .contact-row .left-col .info-card a.btn-dir {
  font-size: 15px;
  line-height: 25px;
  font-weight: 600;
  padding-right: 22px;
  position: relative;
}
section.contact-section .contact-row .left-col .info-card a.btn-dir::before {
  content: "";
  position: absolute;
  background-image: url('data:image/svg+xml,<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M4.66504 11.33L11.33 4.66504" stroke="%233B5E96" stroke-width="1.06639" stroke-linecap="round" stroke-linejoin="round"/><path d="M5.33203 4.66504H11.3305V10.6635" stroke="%233B5E96" stroke-width="1.06639" stroke-linecap="round" stroke-linejoin="round"/></svg>');
  background-size: cover;
  width: 16px;
  height: 16px;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  background-repeat: no-repeat;
  transition: all 0.4s ease;
}

section.contact-section
  .contact-row
  .left-col
  .info-card
  a.btn-dir:hover::before {
  background-image: url('data:image/svg+xml,<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M4.66504 11.33L11.33 4.66504" stroke="%23F58220" stroke-width="1.06639" stroke-linecap="round" stroke-linejoin="round"/><path d="M5.33203 4.66504H11.3305V10.6635" stroke="%23F58220" stroke-width="1.06639" stroke-linecap="round" stroke-linejoin="round"/></svg>');
}

.contact-form .contact-form-field {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 24px 20px;
}
.contact-form .contact-form-field .row-field {
  width: calc(50% - 10px);
}
.contact-form p {
  margin-bottom: 0;
}
.contact-form .contact-form-field label {
  color: #0e1726;
  font-size: 15px;
  font-weight: 600;
  line-height: 24px;
  margin-bottom: 8px;
  display: block;
}
.contact-form .contact-form-field label span {
  color: #f58220;
}
.wpcf7-form-control-wrap {
  display: flex;
}
.contact-form .contact-form-field input,
.contact-form .contact-form-field textarea,
.contact-form .contact-form-field select {
  width: 100%;
  max-width: 100%;
  transition: 0.5s;
  padding: 16px 20px;
  outline: none;
  color: #55617a;
  font-size: 16px;
  font-weight: 400;
  line-height: 26px;
  letter-spacing: 0px;
  border-radius: 12px;
  border: 1px solid #bcc1cc;
  height: 48px;
}

.contact-form .contact-form-field input::placeholder,
.contact-form .contact-form-field textarea::placeholder,
.contact-form .contact-form-field select::placeholder {
  color: #55617ab2;
}
.contact-form .contact-form-field .row-field.width-full {
  width: 100%;
}
.contact-form .contact-form-field textarea {
  resize: none;
  min-height: 120px !important;
}
.contact-form .contact-form-field .textarea-field {
  width: 100%;
}
.contact-form .contact-form-field input:focus,
.contact-form .contact-form-field textarea:focus,
.contact-form .contact-form-field select:focus {
  border-color: #f58220;
}
.wpcf7-not-valid {
  border: 1px solid #e7171a !important;
}
span.badge-pill.cf-7 {
  background: #fdeee3;
  color: #d95e17;
}
.contact-button {
  margin-top: 32px;
}
.contact-form > .contact-button > p {
  width: 100%;
  position: relative;
}
.contact-button input[type="submit"] {
  font-family: "Inter", sans-serif;
  font-size: 17px;
  line-height: 27px;
  font-weight: 600;
  padding: 13px 27px;
  border-radius: 12px;
  text-decoration: none;
  transition: all 0.3s ease;
  gap: 10px;
  background-color: #f58220;
  color: #ffffff;
  width: 100%;
  cursor: pointer;
  border: 1px solid #f58220;
  text-align: center;
}
.contact-button input[type="submit"]:hover,
.contact-button input[type="submit"]:focus {
  background-color: #ffffff;
  color: #f58220;
}
.wpcf7-spinner {
  visibility: hidden;
  display: inline-block;
  background-color: #072566;
  opacity: 0.75;
  width: 24px;
  height: 24px;
  border: none;
  border-radius: 100%;
  padding: 0;
  margin: 0;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: auto;
  right: 20px;
}
.wpcf7-spinner::before {
  content: "";
  position: absolute;
  background-color: #fdaa22;
  top: 4px;
  left: 4px;
  width: 6px;
  height: 6px;
  border: none;
  border-radius: 100%;
  transform-origin: 8px 8px;
  animation-name: spin;
  animation-duration: 1000ms;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
}
.contact-form .wpcf7-not-valid-tip,
.wpcf7-response-output {
  display: none;
}
section.iframe-section iframe {
  width: 100%;
  height: 405px;
  display: flex;
}

/* 404 and Thank you page CSS */
.error-page-main {
  padding: 100px 0;
}
.error-page-content h1 {
  padding-bottom: 18px;
}
section.error-page-main .row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}
.error-page-left {
  width: 40%;
}
.error-page-right {
  width: 60%;
  padding-left: 70px;
}
.error-page-left img {
  display: block;
}
.btn-box a.btn-orange:hover {
  background-color: #14213d;
  color: #fff;
}
.error-page-right .btn-box {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 30px;
}
.error-page-right .btn-box a {
  font-size: 16px;
  padding: 9.81px 20px;
}
body.page-template-quick-books-api section.inner-banner {
  margin-bottom: 0;
}
body.page-template-quick-books-api .cta-content {
  max-width: 820px;
}

section.how-it-works.inner-page .how-it-works__grid {
  grid-template-columns: repeat(3, 1fr);
}
section.features.inner-page .features__head-left {
  flex: 1;
}
section.features.inner-page h2,
section.banks-section.inner-page h2 {
  margin: 0px auto 16px auto;
}
section.features.inner-page .card:hover {
  box-shadow: 0 0 0 1px #e4e8f0;
}
.faq-sec {
  background: #f6f8fb;
}

.faq-sec .faq-row {
  display: flex;
  flex-wrap: wrap;
}
.faq-sec .faq-row .faq-left {
  width: 38.6%;
  padding-right: 46px;
}
.faq-sec .faq-row .faq-right {
  width: 61.4%;
} /* ---------- FAQ accordion ---------- */
.faq {
  background: #fff;
  border: 1px solid #e2e7eb;
  border-radius: 18px;
}
.faq__item {
  padding-inline: 24px;
}
.faq__item + .faq__item {
  border-top: 1px solid #e2e7eb;
}
.faq__q {
  font: inherit;
  letter-spacing: 0;
}
.faq__trigger {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 25px;
  width: 100%;
  padding-block: 20px;
  font-size: 16px;
  font-weight: 600;
  line-height: 26px;
  cursor: pointer;
  text-align: left;
}
.faq__icon {
  flex: none;
  width: 16px;
  height: 16px;
  transition: rotate 0.25s ease;
}
.faq__trigger[aria-expanded="true"] .faq__icon {
  rotate: 45deg;
}
.faq__a {
  padding-bottom: 20px;
}
.accordion__item.faq__item.is-open {
  pointer-events: none;
}
.form-box {
  border: 1px solid #e4e8f0;
  box-shadow: 0px 18px 48px -24px #0e172638;
  padding: 40px;
  border-radius: 12px;
  max-width: 1000px;
  margin: 0 auto;
}
section.Internal-page {
  margin-bottom: 100px;
}
.payment-detail-review {
  display: flex;
  flex-wrap: wrap;
  row-gap: 20px;
}

.payment-detail-review .pdr-row {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  gap: 2px;
  color: #0e1726;
}
.payment-detail-review .pdr-row .pdr-left {
  font-weight: 600;
}
.cta-content p {
  color: #ffffffb2;
}
.cta-content p a {
  color: #f58220b2;
}
.cta-content p a:hover {
  color: #ffffffb2;
}

section.how-work-sec {
  margin-bottom: 40px;
}
section.how-work-sec .how-work-row {
  display: flex;
  flex-wrap: wrap;
}
section.how-work-sec .how-work-row .how-work-left {
  width: 48.13%;
  padding-right: 33px;
}
section.how-work-sec .how-work-row .how-work-right {
  width: 51.87%;
}
section.how-work-sec .how-work-row .how-work-left .btn-orange:hover {
  background: #14213d;
  color: #fff;
}

section.how-work-sec .how-work-row .how-work-left .btn-orange svg {
  filter: brightness(0) invert(1);
}
section.how-work-sec .how-work-row .how-work-left .btn-orange {
  margin-top: 12px;
}
ol.timeline {
  background: linear-gradient(#e4e8f0, #e4e8f0) 15.5px 0 / 1px 100% no-repeat;

}
.timeline__item {
  counter-increment: tl;
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr);
  column-gap: 20px;
  padding-bottom: 32px;
  /* background: linear-gradient(#e4e8f0, #e4e8f0) 15.5px 0 / 1px 100% no-repeat; */
}
.timeline__item:last-child {
  padding-bottom: 0;
  background-size: 1px 16px;
}
.timeline__item::before {
  content: counter(tl);
  grid-row: 1 / span 2;
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: #14213d;
  box-shadow: 0 0 0 4px #fff;
  font-size: 14px;
  line-height: 14px;
  font-weight: 700;
  color: #fff;
   font-family: "JetBrains Mono", monospace;
}
.timeline__title {
  font-size: 20px;
  line-height: 30px;
  letter-spacing: -0.4px;
}
.timeline__text {
  margin-top: 8px;
  color: #55617a;
  font-size: 16px;
  line-height: 26px;
}

/* ---------- QuickBooks: 3-column steps, headed bank strip ---------- */
.steps--3 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.steps--3 .step {
  min-height: 199px;
}

@media screen and (max-width: 1375px) {
}
@media screen and (max-width: 1199px) {
  section.contact-section .contact-row .left-col {
    padding-right: 40px;
  }
  section.contact-section {
    margin-bottom: 70px;
  }
  section.iframe-section iframe {
    height: 360px;
  }
  section.contact-section .contact-row .left-col .info-card {
    padding: 24px;
    margin-bottom: 20px;
  }
  section.contact-section .contact-row .left-col .info-card img {
    width: 40px;
    height: 40px;
    margin-bottom: 12px;
  }
  section.contact-section .contact-row .left-col .info-card .info-heading {
    font-size: 17px;
    line-height: 27px;
  }
  section.contact-section .contact-row .left-col .info-card .info-link {
    font-size: 16px;
    line-height: 26px;
  }
  section.contact-section .contact-row .left-col .info-card p {
    font-size: 15px;
    line-height: 25px;
  }
  section.contact-section .contact-row .right-col {
    padding: 30px;
  }
  .contact-form .contact-form-field {
    gap: 16px 16px;
  }
  .contact-form .contact-form-field .row-field {
    width: calc(50% - 8px);
  }
  .contact-form .contact-form-field label {
    margin-bottom: 5px;
  }
  .contact-form .contact-form-field input,
  .contact-form .contact-form-field textarea,
  .contact-form .contact-form-field select {
    height: 44px;
    font-size: 15px;
    line-height: 25px;
    padding: 13px 15px;
  }
  .contact-button {
    margin-top: 30px;
  }
  .contact-button input[type="submit"] {
    font-size: 16px;
    line-height: 26px;
    padding: 11px 19px;
  }
  /* 404 thank you page */
  .error-page-main {
    padding: 70px 0;
  }
  .error-page-content h1 {
    padding-bottom: 14px;
  }
  .error-page-right {
    padding-left: 50px;
  }
  .error-page-right .btn-box {
    margin-top: 24px;
  }
  section.features.inner-page h2,
  section.banks-section.inner-page h2 {
    margin-bottom: 10px;
  }
  .faq-sec .faq-row .faq-left {
    padding-right: 40px;
    width: 35%;
  }
  .faq-sec .faq-row .faq-right {
    width: 65%;
  }
  .faq__item {
    padding-inline: 20px;
  }
  .faq__trigger {
    padding-block: 15px;
    font-size: 15px;
    line-height: 25px;
  }
  .faq__a {
    padding-bottom: 15px;
  }
  section.Internal-page {
    margin-bottom: 70px;
  }
  .form-box {
    padding: 30px;
  }
  .payment-detail-review {
    row-gap: 15px;
  }
  .timeline__item {
    column-gap: 20px;
    padding-bottom: 26px;
    /* background: linear-gradient(#e4e8f0, #e4e8f0) 14px 0 / 1px 100% no-repeat; */
  }
  ol.timeline {
    background: linear-gradient(#e4e8f0, #e4e8f0) 14px 0 / 1px 100% no-repeat;
  }
  .timeline__title {
    font-size: 18px;
    line-height: 28px;
  }
  .timeline__text {
    margin-top: 6px;
    color: #55617a;
    font-size: 15px;
    line-height: 25px;
  }
  section.how-work-sec {
    margin-bottom: 0;
  }
}
@media screen and (max-width: 991px) {
  section.contact-section .contact-row .left-col {
    width: 100%;
    padding-right: 0;
  }
  section.contact-section .contact-row .right-col {
    width: 100%;
  }
  section.contact-section .contact-row {
    flex-direction: column-reverse;
    gap: 40px;
  }
  section.how-it-works.inner-page .how-it-works__grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .faq-sec .faq-row .faq-right {
    width: 100%;
  }
  .faq-sec .faq-row .faq-left {
    padding-right: 0;
    width: 100%;
  }
  .faq-sec .faq-row {
    gap: 30px;
  }

  section.how-work-sec .how-work-row .how-work-left {
    width: 100%;
    padding-right: 0;
  }
  section.how-work-sec .how-work-row .how-work-right {
    width: 100%;
  }
  section.how-work-sec .how-work-row {
    gap: 40px;
  }
}
@media screen and (max-width: 767px) {
  section.contact-section {
    margin-bottom: 60px;
  }
  section.iframe-section iframe {
    height: 320px;
  }
  section.contact-section .contact-row .left-col .info-card {
    padding: 20px;
    margin-bottom: 16px;
  }
  section.contact-section .contact-row .left-col .info-card img {
    width: 34px;
    height: 34px;
    margin-bottom: 8px;
  }
  section.contact-section .contact-row .left-col .info-card .info-heading {
    font-size: 16px;
    line-height: 26px;
  }
  section.contact-section .contact-row .left-col .info-card .info-link {
    font-size: 15px;
    line-height: 25px;
  }
  section.contact-section .contact-row .left-col .info-card p {
    font-size: 14px;
    line-height: 24px;
  }
  section.contact-section .contact-row .left-col .info-card a.btn-dir {
    font-size: 14px;
    line-height: 24px;
  }
  section.contact-section .contact-row .left-col .info-card a.btn-dir::before {
    width: 14px;
    height: 14px;
  }
  section.contact-section .contact-row .right-col {
    padding: 20px;
  }
  .contact-form .contact-form-field {
    gap: 14px 14px;
  }
  .contact-form .contact-form-field .row-field {
    width: calc(50% - 7px);
  }
  .contact-form .contact-form-field label {
    font-size: 14px;
    line-height: 23px;
  }
  .contact-form .contact-form-field input,
  .contact-form .contact-form-field textarea,
  .contact-form .contact-form-field select {
    height: 40px;
    padding: 10px 12px;
  }
  .contact-button {
    margin-top: 25px;
  }
  section.contact-section .contact-row {
    gap: 30px;
  }
  .contact-button input[type="submit"] {
    font-size: 15px;
    line-height: 25px;
    padding: 9px 17px;
  }

  /* 404 thank you page */
  .error-page-main {
    padding: 60px 0;
  }
  .error-page-left {
    width: 100%;
    max-width: 350px;
    margin: 0 auto;
    display: flex;
    justify-content: center;
  }
  .error-page-right {
    padding-left: 0;
    width: 100%;
    margin-top: 40px;
  }
  .error-page-content {
    text-align: center;
  }
  .error-page-right .btn-box {
    justify-content: center;
    margin-top: 25px;
  }
  .error-page-right .btn-box a {
    font-size: 15px;
    padding: 9px 15px;
  }
  section.features.inner-page h2,
  section.banks-section.inner-page h2 {
    margin-bottom: 8px;
  }
  .faq-sec .faq-row {
    gap: 20px;
  }
  .faq__item {
    padding-inline: 15px;
  }
  .faq__trigger {
    padding-block: 12px;
  }
  .faq__a {
    padding-bottom: 12px;
  }
  section.Internal-page {
    margin-bottom: 60px;
  }
  .form-box {
    padding: 20px;
  }
  section.how-work-sec .how-work-row {
    gap: 30px;
  }
  .timeline__title {
    font-size: 16px;
    line-height: 26px;
  }
  .timeline__item {
    column-gap: 15px;
    padding-bottom: 20px;
  }
}
@media screen and (max-width: 576px) {
  .contact-form .contact-form-field .row-field {
    width: 100%;
  }
  section.how-it-works.inner-page .how-it-works__grid {
    grid-template-columns: 1fr;
  }
}
@media screen and (max-width: 479px) {
}