/* Converted from src/components/site/profiles/ProfilePage.module.css (CSS Module): local classes are prefixed "profiles-profile-page__". */
/*
 * Client profile pages (ex-Elementor pages 228050, 227914, 228242).
 * Measurements from the original at 1440px and 390px: Elementor containers sit 4px inside the
 * theme container (content at 120.8px at 1440px, 20px on mobile), 20px gap between widgets.
 */

/* ----- Page headline over a photo ----- */
.profiles-profile-page__hero {
  position: relative;
}

.profiles-profile-page__hero .profiles-profile-page__heroHeader h1 {
  font-family: var(--font-display);
  font-weight: 400;
  color: #fff;
}

/* Mobile: the content starts on a rounded panel overlapping the photo by 16px. */
@media (max-width: 768px) {
  .profiles-profile-page__hero {
    margin-bottom: -16px;
  }

  .profiles-profile-page__crumbs {
    position: relative;
    padding-top: 16px;
    background-color: var(--color-bg);
    border-radius: var(--radius-lg) var(--radius-lg) 0 0;
  }
}

/* ----- Layout ----- */
.profiles-profile-page__inner {
  width: 100%;
  max-width: var(--container-width);
  margin-inline: auto;
  padding-inline: calc(var(--container-gutter) + 4px);
}

/* Two 50% columns from 768px (Elementor containers), stacked below. */
.profiles-profile-page__row {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  column-gap: 20px;
  padding-block: 10px;
}

.profiles-profile-page__col {
  display: flex;
  flex-direction: column;
  gap: 20px;
  min-width: 0;
  padding-block: 10px;
}

/* Elementor spacers above the columns (7vh text, 9vh image), followed by the 20px widget gap. */
.profiles-profile-page__introText,
.profiles-profile-page__feature .profiles-profile-page__col {
  padding-top: calc(10px + 7vh + 20px);
}

.profiles-profile-page__introMedia {
  align-items: center;
  padding-top: calc(10px + 9vh + 20px);
}

@media (min-width: 768px) {
  .profiles-profile-page__row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 767px) {
  /* the spacer above the intro heading is hidden on mobile */
  .profiles-profile-page__introText {
    padding-top: 10px;
  }
}

/* ----- Typography ----- */
.profiles-profile-page__heading {
  margin: 0;
  padding-top: 0.15em;
  font-family: var(--font-display);
  font-size: var(--h2-size);
  font-weight: 400;
  line-height: var(--h2-leading);
  letter-spacing: -0.04em;
  color: var(--color-heading);
}

.profiles-profile-page__text {
  display: flow-root;
  font-size: 19px;
  line-height: 1.6;
}

.profiles-profile-page__text p {
  margin: 1em 0;
}

.profiles-profile-page__featureText > p:first-child {
  margin-top: 0;
}

.profiles-profile-page__action {
  align-self: flex-start;
}

.profiles-profile-page__introImage {
  display: block;
  max-width: 100%;
  height: auto;
  border-radius: 5px;
}

/* ----- Typed statement ----- */
.profiles-profile-page__tagline {
  min-height: var(--tagline-min-h, 40vh);
  padding-block: calc(20px + 5vh + 20px) 20px;
}

/* ----- Cases of Studies ----- */
.profiles-profile-page__cases {
  padding-top: calc(4vh + 20px);
  padding-bottom: calc(8vh + 20px);
}

.profiles-profile-page__casesEyebrow {
  margin: 0;
  font-size: 0.9em;
  font-weight: 500;
  line-height: 1.6;
}

.profiles-profile-page__uppercase {
  text-transform: uppercase;
}

.profiles-profile-page__casesTitle {
  margin: 0;
  padding-top: 0.15em;
  font-family: var(--font-display);
  font-size: var(--h3-size);
  font-weight: 500;
  line-height: var(--h3-leading);
  letter-spacing: -0.035em;
  color: var(--color-heading);
}

.profiles-profile-page__cases .profiles-profile-page__casesGrid {
  margin: 20px 4px 0;
}

.profiles-profile-page__casesMore {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  min-height: 33px;
  margin-top: calc(60px + 2vh);
}

.profiles-profile-page__casesMore .profiles-profile-page__casesMoreLink {
  font-size: 19px;
}

/* One column: the theme resets the button alignment (left) and drops the 20px padding under the
   last card (theme breakpoint: ≤768px, measured on the original at 768 / 769px). */
@media (max-width: 768px) {
  .profiles-profile-page__casesMore {
    justify-content: flex-start;
    margin-top: calc(40px + 2vh);
  }
}

/* ----- "Ready to work together ?" band ----- */
.profiles-profile-page__contact {
  position: relative;
  overflow: hidden;
  padding-inline: 50px;
}

.profiles-profile-page__contactInner {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 20px;
  max-width: 1300px;
  min-height: 481px;
  margin-inline: auto;
  padding-inline: 16px;
}

.profiles-profile-page__contactEyebrow {
  margin: 0;
  font-size: 19px;
  font-weight: 500;
  line-height: 1.6;
  color: #fff;
}

.profiles-profile-page__contactTitle {
  margin: 0;
  padding-top: 0.15em;
  font-family: var(--font-display);
  font-size: var(--h2-size);
  font-weight: 400;
  line-height: var(--h2-leading);
  letter-spacing: -0.04em;
  color: #fff;
}

@media (max-width: 767px) {
  .profiles-profile-page__contact {
    padding: 20px;
  }

  .profiles-profile-page__contactInner {
    padding-inline: 0;
  }
}