@layer public {
  .hs-employee__main {
    background: var(--hs-canvas);
  }

  .hs-employee__main h1,
  .hs-employee__main h2,
  .hs-employee__main p {
    margin: 0;
    overflow-wrap: anywhere;
  }

  .hs-employee__main h1,
  .hs-employee__main h2 {
    hyphens: none;
    overflow-wrap: normal;
  }

  .js.hs-motion-ok .hs-employee__main .hs-word-unit {
    white-space: nowrap;
  }

  .hs-employee__main a,
  .hs-employee__main summary {
    overflow-wrap: anywhere;
  }

  /* One continuous scene: hero, stations and closing share a single thread. */
  .hs-employee-scene {
    --hs-thread-graphite: rgba(154, 148, 136, 0.3);
    --hs-thread-bronze: #7d6136;
    --hs-thread-bronze-text: #a8854d;
    --hs-rail-x: 0.5rem;
    --hs-rail-indent: 2.25rem;
    position: relative;
    isolation: isolate;
    overflow-x: clip;
  }

  .hs-employee-scene > section {
    position: relative;
    z-index: 1;
  }

  /* The first paint after load or reload settles without transitions. */
  .hs-employee-scene.is-settling *,
  .hs-employee-scene.is-settling *::before,
  .hs-employee-scene.is-settling *::after {
    transition: none !important;
  }

  .hs-employee-thread {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 0;
    display: none;
    width: 100%;
    height: 100%;
    overflow: visible;
    pointer-events: none;
  }

  .hs-employee-scene.is-live .hs-employee-thread,
  .hs-employee-scene.is-static .hs-employee-thread {
    display: block;
  }

  .hs-employee-thread__line {
    fill: none;
    stroke-linecap: round;
    stroke-linejoin: round;
  }

  .hs-employee-thread__line--ahead {
    stroke: var(--hs-thread-graphite);
    stroke-width: 1px;
  }

  .hs-employee-thread__line--passed {
    stroke: var(--hs-thread-bronze);
    stroke-width: 1.25px;
  }

  .hs-employee-thread__line--current {
    stroke: url("#hs-employee-thread-glow");
    stroke-width: 1.75px;
  }

  .hs-employee-thread__stop--trail {
    stop-color: var(--hs-gold);
    stop-opacity: 0;
  }

  .hs-employee-thread__stop--tip {
    stop-color: #f2c457;
    stop-opacity: 1;
  }

  .hs-employee-scene.is-static .hs-employee-thread__line--passed {
    stroke: rgba(var(--hs-gold-rgb), 0.62);
  }

  .hs-employee-scene.is-static .hs-employee-thread__line--current {
    display: none;
  }

  /* A small soft halo only at the travelling tip, echoing the CTA glass edge. */
  .hs-employee-thread-tip {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
    display: none;
    width: 0.625rem;
    height: 0.625rem;
    margin: -0.3125rem 0 0 -0.3125rem;
    border-radius: 50%;
    background: radial-gradient(
      circle,
      rgba(255, 252, 230, 1) 0 22%,
      rgba(255, 232, 154, 0.92) 46%,
      rgba(var(--hs-gold-rgb), 0.38) 72%,
      rgba(var(--hs-gold-rgb), 0) 100%
    );
    box-shadow:
      0 0 0 1px rgba(255, 232, 154, 0.26),
      0 0 0.85rem 0.2rem rgba(var(--hs-gold-rgb), 0.3);
    pointer-events: none;
    will-change: transform;
  }

  .hs-employee-scene.is-live .hs-employee-thread-tip {
    display: block;
  }

  .hs-employee-thread-node,
  .hs-employee-chapter__node {
    position: absolute;
    z-index: 1;
    width: 0.75rem;
    height: 0.75rem;
    border: 1px solid rgba(var(--hs-gold-rgb), 0.62);
    border-radius: 50%;
    background: var(--hs-canvas);
    transform: translate(-50%, -50%);
    transition:
      background-color var(--hs-duration-line) var(--hs-ease),
      border-color var(--hs-duration-line) var(--hs-ease),
      box-shadow var(--hs-duration-line) var(--hs-ease);
  }

  .hs-employee-scene.is-static .hs-employee-thread-node,
  .hs-employee-scene.is-static .hs-employee-chapter__node {
    border-color: rgba(var(--hs-gold-rgb), 0.62);
    background: rgba(var(--hs-gold-rgb), 0.62);
  }

  .hs-employee-scene.is-live .hs-employee-thread-node--start {
    border-color: var(--hs-gold);
    background: var(--hs-gold);
  }

  /* Finale nodes are placed by the scene script beside the closing copy. */
  .hs-employee-thread-node--closing,
  .hs-employee-thread-node--faq {
    top: 0;
    left: 0;
    display: none;
  }

  .hs-employee-scene.is-live .hs-employee-thread-node--closing,
  .hs-employee-scene.is-live .hs-employee-thread-node--faq,
  .hs-employee-scene.is-static .hs-employee-thread-node--closing,
  .hs-employee-scene.is-static .hs-employee-thread-node--faq {
    display: block;
  }

  /* Like the finale route, its nodes only appear once the tip reaches them. */
  .hs-employee-scene.is-live .hs-employee-thread-node--closing,
  .hs-employee-scene.is-live .hs-employee-thread-node--faq {
    opacity: 0;
    transition:
      opacity 700ms var(--hs-ease),
      background-color var(--hs-duration-line) var(--hs-ease),
      border-color var(--hs-duration-line) var(--hs-ease),
      box-shadow var(--hs-duration-line) var(--hs-ease);
  }

  .hs-employee-scene.is-live .hs-employee-thread-node--closing.is-current,
  .hs-employee-scene.is-live .hs-employee-thread-node--closing.is-passed,
  .hs-employee-scene.is-live .hs-employee-thread-node--faq.is-current {
    opacity: 1;
  }

  .hs-employee-scene.is-live .hs-employee-thread-node--closing,
  .hs-employee-scene.is-live .hs-employee-thread-node--faq,
  .hs-employee-scene.is-live .is-ahead .hs-employee-chapter__node,
  .hs-employee-scene.is-live .is-near .hs-employee-chapter__node {
    border-color: rgba(154, 148, 136, 0.55);
    background: var(--hs-canvas);
  }

  .hs-employee-scene.is-live .is-current .hs-employee-chapter__node,
  .hs-employee-scene.is-live .hs-employee-thread-node.is-current {
    border-color: var(--hs-gold);
    background: var(--hs-gold);
    box-shadow: 0 0 0 0.3rem rgba(var(--hs-gold-rgb), 0.12);
  }

  .hs-employee-scene.is-live .is-passed .hs-employee-chapter__node,
  .hs-employee-scene.is-live .hs-employee-thread-node.is-passed {
    border-color: var(--hs-thread-bronze);
    background: var(--hs-thread-bronze);
  }

  /* Hero */
  .hs-employee-entry {
    display: grid;
    padding-block: 5rem 5.5rem;
  }

  .hs-employee-entry__copy {
    display: grid;
    min-width: 0;
    gap: 1rem;
  }

  .hs-employee-entry__copy .hs-eyebrow {
    margin-bottom: 0.25rem;
  }

  .hs-employee-entry h1 {
    max-width: 15ch;
    font-size: clamp(2.75rem, 13vw, 4.8rem);
    font-stretch: var(--hs-type-readable-stretch);
    font-weight: 580;
    letter-spacing: var(--hs-type-display-tracking);
    line-height: 0.98;
  }

  /* The heading's letters rise only a short way, so while they appear they
     never reach into the lead copy right below. */
  .js.hs-motion-ok
    .hs-employee-entry
    [data-hs-reveal].hs-is-prepared:not(.hs-is-visible)
    :is(.hs-char, .hs-word) {
    transform: translateY(1.25rem);
  }

  .hs-employee-entry__copy .hs-lead {
    margin-top: 0.75rem;
  }

  .hs-employee-entry__actions {
    position: relative;
    margin-top: 0.75rem;
  }

  .hs-employee-thread-node--start {
    top: calc(100% + 2.5rem);
    left: var(--hs-rail-x);
  }

  /* The hero steps back once, with a calm time-based transition. */
  .hs-employee-scene.is-live
    .hs-employee-entry__copy
    > :not(.hs-employee-entry__actions) {
    transform-origin: 0 0;
    transition:
      opacity 800ms var(--hs-ease),
      transform 900ms var(--hs-ease);
  }

  .hs-employee-scene.is-live
    .hs-employee-entry.is-receded
    .hs-employee-entry__copy
    > :not(.hs-employee-entry__actions) {
    opacity: 0.6;
    transform: translate3d(0, -0.75rem, 0);
  }

  /* Stations */
  .hs-employee-story__list {
    margin-block: 0;
    padding-block: 1.5rem 2.5rem;
    list-style: none;
  }

  .hs-employee-story__list > li {
    min-width: 0;
  }

  .hs-employee-chapter {
    position: relative;
    min-width: 0;
    padding: 2.75rem 0 2.75rem var(--hs-rail-indent);
  }

  .hs-employee-chapter__node {
    top: calc(2.75rem + 0.49rem);
    left: var(--hs-rail-x);
  }

  .hs-employee-chapter__copy {
    display: grid;
    min-width: 0;
    gap: 1rem;
    transform-origin: 0 0.5rem;
  }

  .hs-employee-section-index {
    color: var(--hs-text-muted);
    font-size: 0.72rem;
    font-variant-numeric: tabular-nums;
    font-weight: 650;
    letter-spacing: 0.14em;
    line-height: 1.35;
    text-transform: uppercase;
    overflow-wrap: anywhere;
    transition: color var(--hs-duration-line) var(--hs-ease);
  }

  /* Direct navigation lands a station just past the focal line, in focus. */
  .hs-employee-chapter h2 {
    max-width: 18ch;
    scroll-margin-top: 40vh;
    font-size: clamp(2.25rem, 10vw, 4rem);
    font-weight: 540;
    letter-spacing: var(--hs-type-display-tracking);
    line-height: 1.03;
  }

  .hs-employee-chapter .hs-prose {
    max-width: 54ch;
  }

  /* Stations change state only; the glide between states is time-based,
     so uneven scroll steps never make the copy wobble. */
  .hs-employee-scene.is-live .hs-employee-chapter__copy {
    transition:
      opacity 700ms var(--hs-ease),
      transform 850ms var(--hs-ease);
    will-change: transform, opacity;
  }

  .hs-employee-scene.is-live .is-ahead .hs-employee-chapter__copy {
    opacity: 0.42;
    transform: translate3d(0, 0.75rem, 0);
  }

  .hs-employee-scene.is-live .is-near .hs-employee-chapter__copy {
    opacity: 0.6;
    transform: translate3d(0, 0.35rem, 0);
  }

  .hs-employee-scene.is-live .is-passed .hs-employee-chapter__copy {
    opacity: 0.68;
  }

  .hs-employee-scene.is-live .is-current .hs-employee-section-index {
    color: var(--hs-gold);
  }

  .hs-employee-scene.is-live .is-passed .hs-employee-section-index {
    color: var(--hs-thread-bronze-text);
  }

  /* Closing */
  .hs-employee-finish {
    display: grid;
    padding-block: 5rem;
    gap: 4.5rem;
  }

  .hs-employee-closing {
    display: grid;
    min-width: 0;
    padding-left: var(--hs-rail-indent);
    align-content: start;
    gap: 1.5rem;
  }

  .hs-employee-closing h2 {
    max-width: 12ch;
    font-size: clamp(2.75rem, 12vw, 4.8rem);
    font-weight: 560;
    letter-spacing: var(--hs-type-display-tracking);
    line-height: 1;
  }

  .hs-employee-closing .hs-button {
    width: 100%;
    min-width: 0;
    white-space: normal;
    line-height: 1.25;
  }

  .hs-employee-faq {
    min-width: 0;
    padding-left: var(--hs-rail-indent);
  }

  /* Closing copy and questions appear only once the thread reaches them and
     then stay; keyboard focus anywhere in the finale shows all of it. */
  .hs-employee-scene.is-live .hs-employee-closing > *,
  .hs-employee-scene.is-live .hs-employee-faq details {
    opacity: 0;
    transition: opacity 700ms var(--hs-ease);
  }

  .hs-employee-scene.is-live .hs-employee-faq .hs-faq {
    border-top-color: transparent;
    transition: border-color 700ms var(--hs-ease);
  }

  .hs-employee-scene.is-live .hs-employee-closing:not(.is-revealed),
  .hs-employee-scene.is-live .hs-employee-faq:not(.is-revealed) {
    pointer-events: none;
  }

  .hs-employee-scene.is-live .hs-employee-closing.is-revealed > *,
  .hs-employee-scene.is-live .hs-employee-faq.is-revealed details,
  .hs-employee-scene.is-live
    .hs-employee-finish:focus-within
    .hs-employee-closing
    > *,
  .hs-employee-scene.is-live
    .hs-employee-finish:focus-within
    .hs-employee-faq
    details {
    opacity: 1;
  }

  .hs-employee-scene.is-live .hs-employee-faq.is-revealed .hs-faq,
  .hs-employee-scene.is-live .hs-employee-finish:focus-within .hs-faq {
    border-top-color: var(--hs-line);
  }

  .hs-employee-scene.is-live .hs-employee-closing.is-revealed > :nth-child(2),
  .hs-employee-scene.is-live .hs-employee-faq.is-revealed details:nth-child(2) {
    transition-delay: 90ms;
  }

  .hs-employee-scene.is-live .hs-employee-closing.is-revealed > :nth-child(3),
  .hs-employee-scene.is-live .hs-employee-faq.is-revealed details:nth-child(3) {
    transition-delay: 180ms;
  }

  .hs-employee-scene.is-live .hs-employee-faq.is-revealed details:nth-child(4) {
    transition-delay: 270ms;
  }

  .hs-employee-scene.is-live .hs-employee-faq.is-revealed details:nth-child(5) {
    transition-delay: 360ms;
  }
}

@media (min-width: 40.0625rem) {
  @layer public {
    .hs-employee-entry {
      padding-block: clamp(5rem, 10vh, 8rem) clamp(6rem, 12vh, 9rem);
    }

    .hs-employee-entry__copy {
      max-width: 78rem;
      gap: 1.5rem;
    }

    .hs-employee-entry h1 {
      max-width: 13ch;
      font-size: clamp(4.6rem, 8vw, 8.25rem);
      line-height: 0.98;
    }

    .hs-employee-chapter {
      padding-block: clamp(3.5rem, 7vw, 5rem);
    }

    .hs-employee-chapter__node {
      top: calc(clamp(3.5rem, 7vw, 5rem) + 0.49rem);
    }

    .hs-employee-chapter h2 {
      font-size: clamp(2.8rem, 5.6vw, 4.4rem);
    }

    .hs-employee-finish {
      padding-block: clamp(6rem, 10vw, 10rem);
    }

    .hs-employee-closing h2 {
      font-size: clamp(4rem, 7vw, 7rem);
    }

    .hs-employee-closing .hs-button {
      width: fit-content;
    }
  }
}

@media (min-width: 60rem) {
  @layer public {
    .hs-employee-entry {
      min-height: calc(100svh - var(--hs-header-height));
      align-content: center;
    }

    .hs-employee-entry__actions {
      flex-wrap: nowrap;
      gap: 1.75rem;
    }

    .hs-employee-thread-node--start {
      position: relative;
      top: auto;
      left: auto;
      flex: none;
      transform: none;
    }

    .hs-employee-scene.is-live
      .hs-employee-entry.is-receded
      .hs-employee-entry__copy
      > :not(.hs-employee-entry__actions) {
      opacity: 0.38;
      transform: translate3d(0, -2rem, 0) scale(0.97);
    }

    .hs-employee-story__list {
      padding-block: clamp(2rem, 6vh, 5rem) clamp(4rem, 10vh, 8rem);
    }

    .hs-employee-story__list > li:nth-child(odd) {
      --hs-thread-x: 64%;
    }

    .hs-employee-story__list > li:nth-child(even) {
      --hs-thread-x: 36%;
    }

    .hs-employee-chapter {
      min-height: clamp(22rem, 46vh, 36rem);
      padding: 0 0 3.5rem;
    }

    .hs-employee-chapter__node {
      top: 0.49rem;
      left: var(--hs-thread-x);
    }

    .hs-employee-chapter__copy {
      width: min(36rem, calc(100% - var(--hs-thread-x) - 2.25rem));
      margin-left: calc(var(--hs-thread-x) + 2.25rem);
      container-type: inline-size;
      gap: 1.25rem;
    }

    .hs-employee-story__list > li:nth-child(even) .hs-employee-chapter__copy {
      width: min(36rem, calc(var(--hs-thread-x) - 2.25rem));
      margin-left: calc(
        var(--hs-thread-x) - 2.25rem - min(36rem, var(--hs-thread-x) - 2.25rem)
      );
      transform-origin: 100% 0.5rem;
    }

    .hs-employee-chapter h2 {
      max-width: none;
      font-size: clamp(2.1rem, 3.2vw, 4.2rem);
      font-size: clamp(2.1rem, 10.5cqi, 4.2rem);
    }

    .hs-employee-chapter .hs-prose {
      max-width: 34rem;
      font-size: clamp(1rem, 1.15vw, 1.2rem);
    }

    .hs-employee-scene.is-live .is-ahead .hs-employee-chapter__copy {
      opacity: 0.12;
      transform: translate3d(0, 1.25rem, 0) scale(0.9);
    }

    .hs-employee-scene.is-live .is-near .hs-employee-chapter__copy {
      opacity: 0.34;
      transform: translate3d(0, 0.5rem, 0) scale(0.94);
    }

    .hs-employee-scene.is-live .is-passed .hs-employee-chapter__copy {
      opacity: 0.38;
      transform: scale(0.94);
    }

    .hs-employee-finish {
      column-gap: clamp(5rem, 10vw, 11rem);
      grid-template-columns: minmax(20rem, 0.8fr) minmax(0, 1.2fr);
      align-items: start;
    }

    .hs-employee-closing {
      padding-top: 3rem;
      padding-left: 0;
    }

    .hs-employee-faq {
      padding-top: 3rem;
      padding-left: 0;
    }
  }
}

@media (prefers-reduced-motion: reduce) {
  @layer public {
    .hs-employee__main *,
    .hs-employee__main *::before,
    .hs-employee__main *::after {
      animation-duration: 0.01ms !important;
      animation-iteration-count: 1 !important;
      scroll-behavior: auto !important;
      transition-duration: 0.01ms !important;
    }
  }
}
