/* Lazy Day Expert Team — alleen hovereffect en grote letter. */

/* De kolom blijft volledig door Divi opgemaakt; dit maakt alleen lagen mogelijk. */
.crispy-expert-team .crispy-team-row > .et_pb_column {
  position: relative;
  isolation: isolate;
  overflow: hidden;
}
.crispy-expert-team .crispy-team-row > .et_pb_column {
  display: flex;
  flex-direction: column;
}

.crispy-expert-team .crispy-team-image {
  position: relative;
  z-index: 1;
  margin-top: auto !important;
  margin-bottom: 0 !important;
}

.crispy-expert-team .crispy-team-letter {
  position: absolute !important;
  z-index: 20 !important;
  top: auto !important;
  left: auto !important;
  right: -.04em !important;
  bottom: 4 !important;
  height: auto !important;
}

/* Uitbreidende achtergrondkleur bij hover. */
.crispy-expert-team .crispy-team-row > .et_pb_column::before {
  content: "";
  position: absolute;
  z-index: 0;
  top: 30%;
  left: 50%;
  width: max(90%, 400px);
  aspect-ratio: 1;
  border-radius: 50%;
  background: var(--lazyday-accent, #02afb7);
  pointer-events: none;
  transform: translate(-50%, -50%) scale(0);
  transition: transform .4s cubic-bezier(.3, 0, .3, 1);
}

.crispy-expert-team .crispy-team-row > .et_pb_column:hover::before,
.crispy-expert-team .crispy-team-row > .et_pb_column:focus-within::before {
  transform: translate(-50%, -50%) scale(1);
}

/* Divi bepaalt formaat en positie van de afbeelding; CSS voegt alleen hover toe. */
.crispy-expert-team .crispy-person .et_pb_team_member_image img {
  filter: grayscale(1);
  transform-origin: center bottom;
  transition: filter .4s cubic-bezier(.3, 0, .3, 1),
    transform .4s cubic-bezier(.3, 0, .3, 1);
}
.crispy-expert-team .crispy-team-image {
  position: relative;
  z-index: 1;
}

.crispy-expert-team .crispy-team-row > .et_pb_column:hover
  .crispy-person .et_pb_team_member_image img,
.crispy-expert-team .crispy-team-row > .et_pb_column:focus-within
  .crispy-person .et_pb_team_member_image img {
  filter: grayscale(0);
  transform: scale(1.05);
}

/* Grote achtergrondletter; lettertype en gewicht erven uit de Divi-tekstmodule. */
.crispy-expert-team .crispy-team-letter {
  position: absolute !important;
  z-index: 20 !important;

  top: auto !important;
  left: auto !important;
  right: -.04em !important;
  bottom: -.08em !important;

  height: auto !important;
  pointer-events: none;
  opacity: 1;
  visibility: visible;
  transition: opacity .28s ease, visibility 0s linear 0s;
}

.crispy-expert-team .crispy-team-letter .et_pb_text_inner,
.crispy-expert-team .crispy-team-letter p {
  font-size: clamp(320px, 30vw, 620px);
  line-height: .72;
  color: #fff;
  -webkit-text-stroke: 1.5px var(--lazyday-ink, #161616);
}

.crispy-expert-team .crispy-team-row > .et_pb_column:hover .crispy-team-letter,
.crispy-expert-team .crispy-team-row > .et_pb_column:focus-within .crispy-team-letter {
  opacity: 0;
  visibility: hidden;
  transition: opacity .28s ease, visibility 0s linear .28s;
}

@media (prefers-reduced-motion: reduce) {
  .crispy-expert-team .crispy-team-row > .et_pb_column::before,
  .crispy-expert-team .crispy-person .et_pb_team_member_image img,
  .crispy-expert-team .crispy-team-letter {
    transition: none;
  }
}