@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@100;300;400;700;900&family=Spectral:wght@200;400;600;700&display=swap");
@import url("https://kunversion-frontend-custom.s3.amazonaws.com/templates/help/ps.css");
@import url("https://kunversion-frontend-custom.s3.amazonaws.com/overwrites/template/ps.css");
@import url("https://kunversion-frontend-custom.s3.amazonaws.com/overwrites/template/agent/2/ps.css");
@import url("https://kunversion-frontend-custom.s3.amazonaws.com/overwrites/search-bar/minimal.v2.css");
@import url("https://kunversion-frontend-custom.s3.amazonaws.com/components/listings/new/ps.css");

/* Custom CSS */
:root {
  --primary-brand-color: #334e87;
  --secondary-brand-color: #ffd608;
  --heading-font: "Spectral", serif;
  --text-font: "Open Sans", sans-serif;
  --flex-row-gap: 3rem;
}

/* Custom CSS */
#home-bodycontent .hero-wrapper h1 {
  font-size: 3.6rem !important;
}
@media only screen and (max-width: 992px) {
  #home-bodycontent .hero-wrapper h1 {
    font-size: 3.2rem !important;
  }
}
@media only screen and (max-width: 767px) {
  #home-bodycontent .hero-wrapper h1 {
    font-size: 2.8rem !important;
  }
}
@media only screen and (max-width: 544px) {
  #home-bodycontent .hero-wrapper h1 {
    font-size: 2.3rem !important;
  }
}
#home-bodycontent .hero-wrapper h1 span {
  display: block;
  font-size: 60%;
}
#home-bodycontent #kv-about-agent {
  background-image: unset !important;
}
.flex-row {
  display: flex;
  gap: var(--flex-row-gap);
  justify-content: center;
  align-items: stretch;
}
.flex-row.reverse {
  flex-direction: row-reverse;
}
.flex-row > * {
  width: calc(50% - var(--flex-row-gap));
}
.flex-row img {
  object-fit: cover;
}
.flex-row-content {
  padding-top: 2rem;
  padding-bottom: 2rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.flex-row-content h2 {
  font-weight: 700;
  font-size: 2.3rem;
}
.flex-row-content p {
  font-size: 1.1rem;
}
@media only screen and (max-width: 992px) {
  .flex-row,.flex-row.reverse {
    flex-direction: column-reverse;
    gap: 1rem;
  }
  .flex-row > * {
    width: 100%;
  }
  .flex-row-content {
    text-align: center;
  }
}
@media only screen and (max-width: 544px) {
  .flex-row-content h2 {
    font-size: 1.6rem;
  }
  .flex-row-content p {
    font-size: 1rem;
  }
}
