/* About-page editorial portrait preview. Scoped to this one transition only. */
.talkwise-site .about-experience-intro {
  position: relative;
  display: grid;
  grid-template-columns: minmax(230px, .72fr) minmax(0, 1.28fr);
  align-items: center;
  gap: clamp(46px, 7vw, 104px);
  max-width: 1280px;
  margin-inline: auto;
  padding-block: clamp(58px, 7vw, 88px);
  text-align: left;
  overflow: clip;
}

.talkwise-site .about-experience-intro > * {
  max-width: none;
  margin-inline: 0;
}

.talkwise-site .listening-editorial {
  position: relative;
  width: min(100%, 360px);
  height: clamp(350px, 36vw, 500px);
  margin: 0 0 0 clamp(-62px, -4vw, -28px);
  justify-self: end;
  overflow: hidden;
  isolation: isolate;
  -webkit-mask-image: linear-gradient(to right, #000 0%, #000 72%, rgba(0,0,0,.84) 84%, transparent 100%);
  mask-image: linear-gradient(to right, #000 0%, #000 72%, rgba(0,0,0,.84) 84%, transparent 100%);
}

.talkwise-site .listening-editorial::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 68%, rgba(255, 253, 249, .2));
  pointer-events: none;
}

.talkwise-site .listening-editorial img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 18%;
  display: block;
}

.talkwise-site .about-experience-intro__copy {
  width: min(100%, 680px);
}

.talkwise-site .about-experience-intro__copy h2 {
  margin-inline: 0;
}

.talkwise-site .about-experience-intro__copy > p:not(.section-label):not(.listening-editorial__line) {
  max-width: 57ch;
}

.talkwise-site .listening-editorial__line {
  position: relative;
  max-width: 29ch;
  margin: clamp(26px, 3vw, 38px) 0 0;
  padding-left: 34px;
  color: #795741;
  font-family: Lora, Georgia, serif;
  font-size: clamp(1.18rem, 1.65vw, 1.48rem);
  font-style: italic;
  line-height: 1.5;
  text-wrap: balance;
}

.talkwise-site .listening-editorial__line::before {
  content: "";
  position: absolute;
  top: .74em;
  left: 0;
  width: 22px;
  height: 1px;
  background: #b38a68;
}

@media (max-width: 760px) {
  .talkwise-site .about-experience-intro {
    grid-template-columns: 1fr;
    gap: 30px;
    padding-block: 48px 58px;
  }

  .talkwise-site .listening-editorial {
    width: min(82vw, 360px);
    height: auto;
    aspect-ratio: 960 / 1278;
    margin: 0 auto;
    justify-self: center;
    -webkit-mask-image: none;
    mask-image: none;
  }

  .talkwise-site .listening-editorial::after {
    display: block;
    background: transparent;
    box-shadow: inset 0 0 12px 5px rgba(255, 253, 249, .48);
  }

  .talkwise-site .listening-editorial img {
    height: auto;
    object-position: 50% 18%;
  }

  .talkwise-site .about-experience-intro__copy {
    text-align: left;
  }

  .talkwise-site .listening-editorial__line {
    padding-left: 28px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .talkwise-site .listening-editorial,
  .talkwise-site .listening-editorial img {
    animation: none;
    transition: none;
  }
}