:root {
  --uc-index-review-bg: #262626;
  --uc-index-review-bg-item: #222222;
  --uc-index-review-percent: #FFE269; }

@media (min-width: 992px) {
  .urbanconstruct-index-review .container {
    max-width: 100%;
    padding-left: 20px;
    padding-right: 20px; } }

@media (min-width: 1200px) {
  .urbanconstruct-index-review .container {
    max-width: 1170px; } }

@media (min-width: 1366px) {
  .urbanconstruct-index-review .container {
    max-width: 1290px; } }

@media (min-width: 1600px) {
  .urbanconstruct-index-review .container {
    max-width: 1410px; }
  .urbanconstruct-index-review .container-fluid {
    max-width: 1800px; } }

.urbanconstruct-index-review .counter-num {
  letter-spacing: 0.125rem;
  line-height: 1;
  position: relative;
  display: flex;
  justify-content: start;
  overflow: hidden;
  align-items: center;
  height: 3.125rem;
  font-size: 3.125rem;
  font-weight: 600;
  color: var(--uc-index-slide-color-counter); }
  .urbanconstruct-index-review .counter-num > span {
    z-index: 1;
    display: flex;
    flex-direction: column;
    height: 100%;
    transition: transform 2s ease;
    transform: translateY(0);
    line-height: 1; }
    .urbanconstruct-index-review .counter-num > span span {
      flex: 0 0 100%;
      height: 100%; }

.urbanconstruct-index-review {
  padding: 80px 0;
  background: var(--uc-index-review-bg);
  color: #ffffff;
  position: relative; }
  .urbanconstruct-index-review:before {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 40%;
    height: 100%;
    background: radial-gradient(circle at center, rgba(255, 255, 255, 0.1) 0, rgba(255, 255, 255, 0) 55%) no-repeat; }
  .urbanconstruct-index-review .heading-title .desc {
    color: rgba(255, 255, 255, 0.6); }
  .urbanconstruct-index-review .review-item {
    background: var(--uc-index-review-bg-item);
    padding: 50px 40px;
    border-radius: 16px;
    position: relative; }
    .urbanconstruct-index-review .review-item .item-left .logo {
      margin-bottom: 15px; }
      .urbanconstruct-index-review .review-item .item-left .logo img {
        opacity: 0.6;
        transition: all 0.3s;
        max-height: 60px;
        width: auto; }
        .urbanconstruct-index-review .review-item .item-left .logo img:hover {
          opacity: 1; }
    .urbanconstruct-index-review .review-item .item-left .title {
      font-size: 18px;
      font-weight: 600;
      margin-bottom: 10px; }
    .urbanconstruct-index-review .review-item .item-left .desc {
      color: rgba(255, 255, 255, 0.6);
      margin-bottom: 30px; }
    .urbanconstruct-index-review .review-item .item-left .info {
      display: flex;
      align-items: center;
      gap: 8px; }
      .urbanconstruct-index-review .review-item .item-left .info .img img {
        max-width: 70px;
        border-radius: 50%; }
      .urbanconstruct-index-review .review-item .item-left .info .detail .name {
        font-size: 18px;
        font-weight: 600;
        margin-bottom: 5px; }
      .urbanconstruct-index-review .review-item .item-left .info .detail .position {
        font-size: 14px;
        color: rgba(255, 255, 255, 0.6); }
    .urbanconstruct-index-review .review-item .item-right .title {
      font-size: 24px; }
    .urbanconstruct-index-review .review-item .item-right .percent,
    .urbanconstruct-index-review .review-item .item-right .percent .counter-num {
      color: var(--uc-index-review-percent); }
    .urbanconstruct-index-review .review-item .item-right .percent .p-desc {
      font-size: 18px;
      font-weight: 600;
      margin-top: 10px;
      display: inline-block; }
  .urbanconstruct-index-review .swiper-pagination .swiper-pagination-bullet {
    background: rgba(255, 255, 255, 0.5); }
    .urbanconstruct-index-review .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
      background: #ffffff; }
  @media (min-width: 1200px) {
    .urbanconstruct-index-review .review-item .item-left {
      padding-right: 40px;
      border-right: 1px solid rgba(255, 255, 255, 0.1); }
    .urbanconstruct-index-review .review-item .item-right {
      padding-left: 30px;
      height: 100%;
      display: flex;
      flex-flow: wrap;
      align-items: center; }
      .urbanconstruct-index-review .review-item .item-right > div {
        flex: 0 0 100%; } }
  @media (max-width: 991px) {
    .urbanconstruct-index-review:before {
      width: 100%; }
    .urbanconstruct-index-review .review-item .row {
      gap: 20px; } }
  @media (max-width: 767px) {
    .urbanconstruct-index-review {
      padding: 40px 0; }
      .urbanconstruct-index-review .review-item {
        padding: 30px 15px; }
        .urbanconstruct-index-review .review-item .item-left .logo img {
          max-height: 45px; }
        .urbanconstruct-index-review .review-item .item-left .title, .urbanconstruct-index-review .review-item .item-left .info .detail .name {
          font-size: 16px; }
        .urbanconstruct-index-review .review-item .item-right .title {
          font-size: 18px; }
        .urbanconstruct-index-review .review-item .item-right .percent {
          margin: 20px 0; }
          .urbanconstruct-index-review .review-item .item-right .percent .counter-num {
            height: rem(30px);
            font-size: rem(30px); }
          .urbanconstruct-index-review .review-item .item-right .percent .p-desc {
            font-size: 16px; } }