.phone-email {
  --item-background-color: var(--color-white);
  --item-text-color: var(--color-main);
  --item-border: 1px solid transparent;
  --item-separator-color: rgba(0, 0, 0, 0.15);
  --item-icon-color: var(--color-primary);
}
.phone-email--email {
  --item-background-color: var(--color-primary);
  --item-text-color: var(--color-main);
  --item-icon-color: var(--color-primary-light);
  --item-separator-color: rgba(var(--color-primary-light-rgb), 0.4);
}
.phone-email:hover {
  --item-background-color: var(--color-primary-light);
  --item-text-color: var(--color-primary-dark);
  --item-icon-color: var(--color-primary-dark);
  --item-separator-color: rgba(var(--color-primary-dark-rgb), 0.2);
}
.phone-email__link {
  background-color: var(--item-background-color);
  padding: clamp(16px, 2cqw, 24px) clamp(20px, 4cqw, 40px);
  padding-left: clamp(18px, 3cqw, 24px);
  display: flex;
  align-items: center;
  color: var(--item-text-color);
  border-radius: var(--border-radius-smaller);
  margin: 0;
  gap: 16px;
  border: var(--item-border);
  text-decoration: none;
  transition: var(--transition);
}
.phone-email__icon {
  width: var(--font-size-42);
  display: inline-block;
  aspect-ratio: 1/1;
  mask: var(--item-icon) center/contain no-repeat;
  background-color: var(--item-icon-color);
  transition: var(--transition);
}
.phone-email__icon--phone {
  --item-icon: var(--icon-phone);
}
.phone-email__icon--email {
  --item-icon: var(--icon-email);
}
.phone-email__content {
  display: flex;
  flex-direction: column;
  gap: 0;
  border-left: 2px solid var(--item-separator-color);
  padding-left: 24px;
  transition: var(--transition);
  z-index: 2;
}
.phone-email__text {
  font-size: var(--font-size-14);
  font-weight: var(--font-weight-regular);
  color: var(--item-text-color);
  transition: var(--transition);
  margin-bottom: 0.2em;
}
.phone-email__number {
  font-family: var(--font-heading);
  font-weight: var(--font-weight-medium);
  font-optical-sizing: auto;
  letter-spacing: var(--letter-spacing);
  font-size: var(--font-size-24);
  letter-spacing: normal;
  color: var(--item-text-color);
  transition: var(--transition);
}
.phone-email + .phone-email {
  margin-top: 1em;
}