/* Block: content
 * Extracted from theme CSS by wp-arch-agent.
 * Classes: hp-content-row__inner, hp-content-row__img, dynamic-image__caption, hp-content-row__text, hp-link-arrow, content
 */

.hp-whoweare__text h2,
.hp-content-row__text h2,
.hp-offer__left h2,
.hp-locations__detail h3 {
  color: #230704;
  font-family: Poppins;
  font-size: 50px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  margin-bottom: 20px;
}

.hp-whoweare__text p,
.hp-content-row__text p,
.hp-offer__left p,
.hp-locations__detail p {
  color: #666;
  font-family: Poppins;
  font-size: 18px;
  font-style: normal;
  font-weight: 300;
  line-height: normal;
  margin-bottom: 30px;
}

.hp-whoweare__inner,
.hp-content-row__inner {
  display: flex;
  gap: 130px;
  padding: 90px 130px 90px;
  max-width: 1920px;
  margin: 0 auto;
  align-items: center;
}

.hp-whoweare__img-wrap,
.hp-content-row__img {
  flex: 0 0 54%;
  max-width: 54%;
}

.hp-whoweare__img-wrap img,
.hp-content-row__img img {
  width: 100%;
  height: auto;
  object-fit: cover;
  display: block;
}

.hp-whoweare__text,
.hp-content-row__text {
  flex: 1;
  padding: 20px 0;
}

.hp-link-arrow {
  display: inline-flex;
  align-items: center;
  gap: 20px;
  color: #230704;
  font-family: 'Poppins';
  font-size: 18px;
  font-weight: 400;
  text-decoration: none;
  margin-top: 40px;
  padding: 20px 10px;
  border-bottom: 1px solid transparent;
  transition: border-color 0.3s;
}

.hp-whoweare .hp-link-arrow,
.hp-content-row .hp-link-arrow {
  color: #230704;
}

.hp-whoweare .hp-link-arrow svg path,
.hp-content-row .hp-link-arrow svg path {
  stroke: #230704;
}

.hp-link-arrow:hover {
  border-bottom-color: currentColor;
}

.hp-link-arrow svg {
  flex-shrink: 0;
  transition: transform 0.3s;
}

.hp-link-arrow:hover svg {
  transform: translateX(5px);
}

.hp-content-row--img-right .hp-content-row__img {
  order: 2;
}

.hp-content-row--img-right .hp-content-row__text {
  order: 1;
}

/* content.php sets "reverse" as a per-row modifier directly on
 * .hp-content-row__inner (from the content_rows repeater's own "reverse"
 * sub-field) -- not on an ancestor -- so it needs a compound selector here,
 * not the descendant-combinator ".reverse .hp-content-row__inner" rule
 * extracted verbatim from the theme's original (single-row) CSS. */
.hp-content-row__inner.reverse {
  flex-flow: row-reverse;
}

@media (max-width: 991px) {
  .hp-content-row__inner.reverse {
    flex-flow: column;
  }
}

@media (max-width: 1200px) {
  .hp-whoweare__inner,
    .hp-content-row__inner {
    padding: 60px 60px 90px;
  }
}

@media (max-width: 991px) {
  .hp-whoweare__inner,
    .hp-content-row__inner {
    flex-direction: column;
    padding: 20px 30px;
    gap: 30px;
  }
  
  .hp-whoweare__img-wrap,
    .hp-content-row__img {
    flex: none;
    max-width: 100%;
  }
  
  .hp-whoweare__text h2,
    .hp-content-row__text h2,
    .hp-offer__left h2,
    .hp-locations__header h2,
    .hp-locations__detail h3,
    .hp-testimonials__inner h2 {
    font-size: 36px;
  }
  
  .hp-content-row--img-right .hp-content-row__img,
    .hp-content-row--img-right .hp-content-row__text {
    order: 0;
  }
}

@media (max-width: 600px) {
  .hp-whoweare__text h2,
    .hp-content-row__text h2,
    .hp-offer__left h2,
    .hp-locations__header h2,
    .hp-locations__detail h3,
    .hp-testimonials__inner h2 {
    font-size: 31px;
  }
  
  .hp-whoweare__inner,
    .hp-content-row__inner {
    padding: 20px 20px 0;
  }
  
  .hp-link-arrow {
    margin-top: 24px;
  }
}

