.breadcrumb-container {
  display: flex;
  flex-direction: column;
  gap: 40px;
  padding: 24px 0;
  position: relative;
  transition: all 0.4s ease;

  .h2 {
    color: var(--black1);
  }
}
.breadcrumb-container::before {
  content: "";
  position: absolute;
  background: var(--blue2);
  width: 100vw;
  height: 100%;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  z-index: -1;
}
.breadcrumb {
  display: flex;
  align-items: center;
  gap: 24px;
  flex-wrap: wrap;

  .breadcrumb-item a {
    color: var(--blue1);
  }
  .breadcrumb-item span {
    color: var(--grey1);
  }
  .breadcrumb-item img {
    height: 18px;
    width: 18px;
  }
}

.breadcrumb-item {
  display: flex;
  align-items: center;
  gap: 4px;
  flex: 1 0 0;
}

/* VIN */
.breadcrumb-vin {
  color: var(--grey1);
  display: flex;
  align-items: center;
}

.breadcrumb-vin .vin-value {
  background: var(--blue1);
  display: flex;
  justify-content: center;
  align-items: center;
  color: #fff;
  height: 25px;
  padding: 4px 8px;
  border-radius: 2px;
  margin-left: 8px;
}

@media (max-width: 768px) {
  .breadcrumb-container {
    gap: 16px;
    padding: 16px 0;
  }
  .breadcrumb {
    gap: 6px;

    img {
      height: 16px;
      width: 16px;
    }
  }
}