/* Accessible team profile pop-ups and founder scheduling invitation. */
.hf-team-collage-shell {
  position: relative;
  overflow: visible !important;
  isolation: isolate;
}

.hf-team-collage-shell > img {
  display: block;
  border-radius: inherit;
}

.hf-team-hotspot {
  position: absolute;
  z-index: 2;
  margin: 0;
  border: 0;
  border-radius: 22px;
  padding: 0;
  background: transparent;
  color: inherit;
  cursor: help;
  font: inherit;
  appearance: none;
  -webkit-tap-highlight-color: transparent;
}

.hf-team-hotspot--vanessa { top: 49%; left: 35.5%; width: 31%; height: 41%; }
.hf-team-hotspot--christian { top: 8.5%; left: 35.5%; width: 30.5%; height: 36%; }
.hf-team-hotspot--paula { top: 8.5%; left: 72%; width: 24%; height: 48%; }
.hf-team-hotspot--cecille { top: 17%; left: 4.5%; width: 27%; height: 67%; }
.hf-team-hotspot--erica { top: 62%; left: 73%; width: 23%; height: 31%; }

.hf-team-hotspot:hover,
.hf-team-hotspot:focus-visible,
.hf-team-hotspot.is-open {
  z-index: 30;
}

.hf-team-collage-shell:has(.hf-team-hotspot:hover) .hf-team-hotspot:not(:hover),
.hf-team-collage-shell:has(.hf-team-hotspot:focus-visible) .hf-team-hotspot:not(:focus-visible),
.hf-team-collage-shell:has(.hf-team-hotspot.is-open) .hf-team-hotspot:not(.is-open) {
  z-index: 1;
}

.hf-team-outline-layer {
  position: absolute;
  inset: 0;
  z-index: 3;
  display: block;
  width: 100%;
  height: 100%;
  overflow: visible;
  pointer-events: none;
}

.hf-team-outline {
  fill: rgba(0, 111, 215, 0.035);
  stroke: rgba(0, 123, 230, 0.9);
  stroke-width: 4;
  vector-effect: non-scaling-stroke;
  opacity: 0;
  filter: drop-shadow(0 0 5px rgba(0, 111, 215, 0.22));
  transition: opacity 180ms cubic-bezier(0.23, 1, 0.32, 1);
}

.hf-team-collage-shell:has(.hf-team-hotspot--vanessa:hover) .hf-team-outline--vanessa,
.hf-team-collage-shell:has(.hf-team-hotspot--vanessa:focus-visible) .hf-team-outline--vanessa,
.hf-team-collage-shell:has(.hf-team-hotspot--vanessa.is-open) .hf-team-outline--vanessa,
.hf-team-collage-shell:has(.hf-team-hotspot--christian:hover) .hf-team-outline--christian,
.hf-team-collage-shell:has(.hf-team-hotspot--christian:focus-visible) .hf-team-outline--christian,
.hf-team-collage-shell:has(.hf-team-hotspot--christian.is-open) .hf-team-outline--christian,
.hf-team-collage-shell:has(.hf-team-hotspot--paula:hover) .hf-team-outline--paula,
.hf-team-collage-shell:has(.hf-team-hotspot--paula:focus-visible) .hf-team-outline--paula,
.hf-team-collage-shell:has(.hf-team-hotspot--paula.is-open) .hf-team-outline--paula,
.hf-team-collage-shell:has(.hf-team-hotspot--cecille:hover) .hf-team-outline--cecille,
.hf-team-collage-shell:has(.hf-team-hotspot--cecille:focus-visible) .hf-team-outline--cecille,
.hf-team-collage-shell:has(.hf-team-hotspot--cecille.is-open) .hf-team-outline--cecille,
.hf-team-collage-shell:has(.hf-team-hotspot--erica:hover) .hf-team-outline--erica,
.hf-team-collage-shell:has(.hf-team-hotspot--erica:focus-visible) .hf-team-outline--erica,
.hf-team-collage-shell:has(.hf-team-hotspot--erica.is-open) .hf-team-outline--erica {
  opacity: 1;
}

.hf-team-hotspot:focus-visible {
  outline: none;
}

.hf-team-hotspot-indicator {
  position: absolute;
  right: 10px;
  bottom: 10px;
  z-index: 2;
  display: grid;
  width: 29px;
  height: 29px;
  place-items: center;
  border: 2px solid rgba(255, 255, 255, 0.94);
  border-radius: 50%;
  background: rgba(5, 25, 49, 0.86);
  box-shadow: 0 8px 18px rgba(5, 25, 49, 0.22);
  color: #fff;
  font-family: Georgia, serif;
  font-size: 15px;
  font-style: italic;
  font-weight: 700;
  line-height: 1;
  transition: transform 160ms cubic-bezier(0.23, 1, 0.32, 1), background-color 160ms ease;
}

.hf-team-hotspot:hover .hf-team-hotspot-indicator,
.hf-team-hotspot:focus-visible .hf-team-hotspot-indicator,
.hf-team-hotspot.is-open .hf-team-hotspot-indicator {
  transform: translateY(-2px) scale(1.06);
  background: var(--hf-blue, #006fd7);
}

.hf-team-profile {
  position: absolute;
  z-index: 40;
  display: block;
  width: min(310px, 72vw);
  border: 1px solid rgba(255, 255, 255, 0.13);
  border-radius: 18px;
  padding: 21px 22px 22px;
  background: linear-gradient(145deg, rgba(16, 31, 51, 0.98), rgba(7, 20, 35, 0.985));
  box-shadow: 0 24px 55px rgba(8, 27, 51, 0.28);
  color: #fff;
  opacity: 0;
  pointer-events: none;
  text-align: left;
  transform: translateY(8px) scale(0.97);
  transition: opacity 180ms cubic-bezier(0.23, 1, 0.32, 1), transform 180ms cubic-bezier(0.23, 1, 0.32, 1);
}

.hf-team-hotspot:hover .hf-team-profile,
.hf-team-hotspot:focus-visible .hf-team-profile,
.hf-team-hotspot.is-open .hf-team-profile {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0) scale(1);
}

.hf-team-profile-kicker,
.hf-founder-invite-kicker {
  display: block;
  margin-bottom: 8px;
  color: #43c7cb;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.hf-team-profile > strong {
  display: block;
  color: #fff;
  font-size: 18px;
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1.15;
}

.hf-team-profile-role {
  display: block;
  margin-top: 5px;
  color: rgba(255, 255, 255, 0.6);
  font-size: 11px;
  font-weight: 700;
  line-height: 1.35;
}

.hf-team-profile-reflection {
  display: block;
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid rgba(255, 255, 255, 0.11);
  color: rgba(255, 255, 255, 0.83);
  font-size: 12px;
  font-weight: 500;
  line-height: 1.58;
}

.hf-team-hotspot--vanessa .hf-team-profile {
  right: 0;
  bottom: calc(100% + 12px);
}

.hf-team-hotspot--christian .hf-team-profile {
  top: calc(100% + 12px);
  left: 50%;
  transform: translate(-50%, 8px) scale(0.97);
}

.hf-team-hotspot--christian:hover .hf-team-profile,
.hf-team-hotspot--christian:focus-visible .hf-team-profile,
.hf-team-hotspot--christian.is-open .hf-team-profile {
  transform: translate(-50%, 0) scale(1);
}

.hf-team-hotspot--paula .hf-team-profile {
  top: 12%;
  right: calc(100% + 12px);
}

.hf-team-hotspot--cecille .hf-team-profile {
  top: 11%;
  left: calc(100% + 12px);
}

.hf-team-hotspot--erica .hf-team-profile {
  right: calc(100% + 12px);
  bottom: 0;
}

.hf-team-collage-hint {
  display: flex;
  align-items: center;
  gap: 9px;
  margin: 13px 3px 0;
  color: #667085;
  font-size: 11px;
  font-weight: 650;
  line-height: 1.45;
}

.hf-team-collage-hint > span {
  display: grid;
  width: 19px;
  height: 19px;
  flex: 0 0 auto;
  place-items: center;
  border-radius: 50%;
  background: #102034;
  color: #fff;
  font-family: Georgia, serif;
  font-size: 11px;
  font-style: italic;
}

.hf-founder-conversation {
  display: block;
  border-radius: var(--hf-radius-lg, 28px);
  color: inherit;
  text-decoration: none;
}

.hf-founder-conversation:focus-visible {
  outline: 3px solid rgba(67, 199, 203, 0.62);
  outline-offset: 5px;
}

.hf-founder-conversation .hf-founder-portrait-frame {
  cursor: pointer;
}

.hf-founder-conversation .hf-founder-portrait,
.hf-founder-conversation .hf-founder-id {
  transition: transform 280ms cubic-bezier(0.23, 1, 0.32, 1), opacity 180ms cubic-bezier(0.23, 1, 0.32, 1);
}

.hf-founder-invite {
  position: absolute;
  inset: 0;
  z-index: 4;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: clamp(24px, 5vw, 38px);
  background: linear-gradient(to top, rgba(4, 15, 30, 0.98) 6%, rgba(4, 15, 30, 0.89) 58%, rgba(0, 73, 142, 0.58));
  color: #fff;
  opacity: 0;
  transform: translateY(12px);
  transition: opacity 220ms cubic-bezier(0.23, 1, 0.32, 1), transform 220ms cubic-bezier(0.23, 1, 0.32, 1);
}

.hf-founder-invite > strong {
  display: block;
  max-width: 390px;
  color: #fff;
  font-size: clamp(22px, 2.6vw, 31px);
  letter-spacing: -0.03em;
  line-height: 1.12;
}

.hf-founder-invite > span:not(.hf-founder-invite-kicker):not(.hf-founder-invite-cta) {
  display: block;
  max-width: 390px;
  margin-top: 13px;
  color: rgba(255, 255, 255, 0.76);
  font-size: 13px;
  font-weight: 550;
  line-height: 1.58;
}

.hf-founder-invite-cta {
  display: inline-flex;
  align-self: flex-start;
  align-items: center;
  gap: 9px;
  margin-top: 22px;
  border-radius: 8px;
  padding: 11px 15px;
  background: #fff;
  color: #0b4e91;
  font-size: 12px;
  font-weight: 800;
  line-height: 1;
}

.hf-founder-conversation:hover .hf-founder-invite,
.hf-founder-conversation:focus-visible .hf-founder-invite {
  opacity: 1;
  transform: translateY(0);
}

.hf-founder-conversation:hover .hf-founder-id,
.hf-founder-conversation:focus-visible .hf-founder-id {
  opacity: 0;
  transform: translateY(8px);
}

.hf-founder-conversation:hover .hf-founder-portrait,
.hf-founder-conversation:focus-visible .hf-founder-portrait {
  transform: scale(1.025);
}

.hf-about-actions--note-only {
  margin-top: 30px;
}

.hf-about-actions--note-only .hf-founder-note {
  color: rgba(255, 255, 255, 0.72);
  font-size: 11px;
  letter-spacing: 0.065em;
}

@media (max-width: 700px) {
  .hf-team-profile {
    position: fixed;
    top: 50% !important;
    right: auto !important;
    bottom: auto !important;
    left: 50% !important;
    z-index: 1000;
    width: min(340px, calc(100vw - 32px));
    transform: translate(-50%, -47%) scale(0.97) !important;
  }

  .hf-team-hotspot:hover .hf-team-profile,
  .hf-team-hotspot:focus-visible .hf-team-profile,
  .hf-team-hotspot.is-open .hf-team-profile {
    transform: translate(-50%, -50%) scale(1) !important;
  }

  .hf-team-hotspot-indicator {
    right: 6px;
    bottom: 6px;
    width: 25px;
    height: 25px;
    font-size: 13px;
  }
}

@media (hover: none) {
  .hf-founder-invite {
    top: auto;
    min-height: 52%;
    padding: 22px;
    opacity: 1;
    transform: none;
  }

  .hf-founder-invite > strong {
    font-size: clamp(20px, 6vw, 27px);
  }

  .hf-founder-invite > span:not(.hf-founder-invite-kicker):not(.hf-founder-invite-cta) {
    display: none;
  }

  .hf-founder-invite-cta {
    margin-top: 15px;
  }

  .hf-founder-id {
    opacity: 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  .hf-team-outline,
  .hf-team-hotspot-indicator,
  .hf-team-profile,
  .hf-founder-invite,
  .hf-founder-conversation .hf-founder-portrait,
  .hf-founder-conversation .hf-founder-id {
    transition: none;
  }
}