.tiansheng_related_solution_main {
  padding: 6.25rem 0;
}

:root{
  --tiansheng-power-shape-small: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 458 376'%3E%3Cpath d='M457.15 289C457.15 300.046 448.196 309 437.15 309H399.594C388.548 309 379.594 317.954 379.594 329V356C379.594 367.046 370.639 376 359.594 376H19.5937C8.54805 376 -0.40625 367.046 -0.40625 356V20C-0.40625 8.9543 8.54806 0 19.5938 0H437.15C448.196 0 457.15 8.95431 457.15 20V289Z' fill='black'/%3E%3C/svg%3E");
  --tiansheng-power-shape-large: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 948 376'%3E%3Cpath d='M918 0C934.569 0 948 13.4315 948 30V279C948 295.569 934.569 309 918 309H890C878.954 309 870 317.954 870 329V346C870 362.569 856.569 376 840 376H30C13.4315 376 0 362.569 0 346V30C0 13.4315 13.4315 0 30 0H918Z' fill='black'/%3E%3C/svg%3E");
  --tiansheng-power-shape: var(--tiansheng-power-shape-small);
}

.tiansheng_related_solution_main .tiansheng-related-solution-title {
  margin: 0 0 2.5rem;
  color: #000000;
  font-size: var(--font-60);
  font-weight: 600;
  line-height: normal;
}

.tiansheng_related_solution_main .tiansheng-related-solution-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 4.6875rem;
}

.tiansheng_related_solution_main .tiansheng-related-solution-card {
  min-width: 0;
}

.tiansheng_related_solution_main .tiansheng-related-solution-card-link {
  position: relative;
  display: block;
}

.tiansheng_related_solution_main .tiansheng-related-solution-card-media {
  position: relative;
  width: 100%;
  aspect-ratio: 211/132;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  z-index: 2;
}
.tiansheng-related-solution-card-shell{
  position: relative;
  width: 100%;
  aspect-ratio: 458 / 376;
  overflow: hidden;
  background: #ebeffa;
  -webkit-mask: var(--tiansheng-power-shape) center / 100% 100% no-repeat;
  mask: var(--tiansheng-power-shape) center / 100% 100% no-repeat;
}

.tiansheng_related_solution_main .tiansheng-related-solution-card-media img {
  width: 54%;
  aspect-ratio: 29/25;
  object-fit: cover;
  display: block;
  transition: transform 0.5s ease;
}

.tiansheng_related_solution_main .tiansheng-related-solution-card-link:hover .tiansheng-related-solution-card-media img {
  transform: scale(1.05);
}

.tiansheng_related_solution_main .tiansheng-related-solution-card-foot {
  padding: 2.1875rem 17% 0 1.25rem;
  position: absolute;
  bottom: 0.25rem;
  left: 0;
  width: 100%;
}

.tiansheng_related_solution_main .tiansheng-related-solution-card-title {
  color: #333333;
  font-size: var(--font-20);
  font-weight: 400;
  line-height: 1.5;
  max-height: calc(1.5 * 4 * var(--font-20));
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
}


.tiansheng-related-solution-card-arrow {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 15.81%;
  height: auto;
  display: block;
}

.tiansheng_related-solution_item_desc{
    color: #FFF;
    font-size:var(--font-22);
    font-weight: 400;
    line-height: 1.5;
    text-transform: capitalize;
    margin-bottom: 1.5rem;
    opacity: 0;
    transition: all 0.5s ease;
}

.tiansheng-related-solution-card:hover .tiansheng_related-solution_item_desc{
    opacity: 1;
}

.tiansheng-related-solution-card:hover .tiansheng-related-solution-card-title{
    color: #FFF;
}
.tiansheng-related-solution-card:hover .tiansheng-related-solution-card-arrow rect{
    fill:var(--color-primary);
}
.tiansheng-related-solution-card:hover .tiansheng-related-solution-card-arrow path{
    stroke: #fff;
}

.tiansheng_related-solution_item-overlay{
  position: absolute;
  inset: 0;
  background: transparent;
  z-index: 0;
  transition: background 0.28s ease;
}

.tiansheng-related-solution-card:hover .tiansheng_related-solution_item-overlay{
  background: linear-gradient(180deg, #6b9cf0 0%, #2f69d8 100%);
}
.tiansheng-related-solution-card:hover .tiansheng-related-solution-card-media{
    opacity: 0.2;
}

@media screen and (max-width: 992px) {
  .tiansheng_related_solution_main .tiansheng-related-solution-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media screen and (max-width: 576px) {
  .tiansheng_related_solution_main .tiansheng-related-solution-grid {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
}
