/* RentGuarantor CSS: content-2-5-column.css (source: src/assets/scss/_content-2-5-column.scss) */
@media (max-width: 991.98px) {
  #content-2-5-column-our-approach {
    padding-right: 0 !important;
  }
}

.content-2-5-column-section--white {
  background-color: var(--surface-general-tertiary);
}

.content-2-5-column {
  padding: var(--spacing-1300) 0;
}
@media (max-width: 991.98px) {
  .content-2-5-column {
    padding-right: 0 !important;
    overflow: hidden;
  }
}
.content-2-5-column__tiles {
  margin-bottom: var(--spacing-600);
}
@media (min-width: 992px) {
  .content-2-5-column__tiles {
    margin-bottom: var(--spacing-800);
  }
}
@media (max-width: 991.98px) {
  .content-2-5-column__header {
    margin-right: 20px !important;
  }
}
.content-2-5-column__grid {
  position: relative;
}
.content-2-5-column__grid-inner {
  display: flex;
  gap: var(--spacing-700);
  flex-wrap: wrap;
}
.content-2-5-column__tile {
  padding: var(--spacing-800);
  border-radius: var(--spacing-700);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
  flex: 1 1 100%;
  max-width: 100%;
  min-width: 0;
}
.content-2-5-column__tile--blue {
  background-color: var(--surface-general-tertiary);
}
.content-2-5-column__tile--grey {
  background-color: var(--surface-general-fifth);
}
.content-2-5-column__tile--white {
  background-color: var(--surface-general-primary);
}
@media (min-width: 576px) {
  .content-2-5-column .content-2-5-column__tile {
    flex: 1 1 calc(50% - var(--spacing-700) / 2);
    max-width: calc(50% - var(--spacing-700) / 2);
  }
}
@media (min-width: 768px) {
  .content-2-5-column .content-2-5-column__grid[data-columns="2"] .content-2-5-column__tile {
    flex: 1 1 calc(50% - var(--spacing-700) / 2);
    max-width: calc(50% - var(--spacing-700) / 2);
  }
  .content-2-5-column .content-2-5-column__grid[data-columns="3"] .content-2-5-column__tile,
  .content-2-5-column .content-2-5-column__grid[data-columns="4"] .content-2-5-column__tile,
  .content-2-5-column .content-2-5-column__grid[data-columns="5"] .content-2-5-column__tile {
    flex: 1 1 calc(33.333% - var(--spacing-700) * 2 / 3);
    max-width: calc(33.333% - var(--spacing-700) * 2 / 3);
  }
}
@media (min-width: 992px) {
  .content-2-5-column .content-2-5-column__grid[data-columns="2"] .content-2-5-column__tile {
    flex: 1 1 calc(50% - var(--spacing-700) / 2);
    max-width: calc(50% - var(--spacing-700) / 2);
  }
  .content-2-5-column .content-2-5-column__grid[data-columns="3"] .content-2-5-column__tile {
    flex: 1 1 calc(33.333% - var(--spacing-700) * 2 / 3);
    max-width: calc(33.333% - var(--spacing-700) * 2 / 3);
  }
  .content-2-5-column .content-2-5-column__grid[data-columns="4"] .content-2-5-column__tile,
  .content-2-5-column .content-2-5-column__grid[data-columns="5"] .content-2-5-column__tile {
    flex: 1 1 calc(25% - var(--spacing-700) * 3 / 4);
    max-width: calc(25% - var(--spacing-700) * 3 / 4);
  }
}
@media (min-width: 1200px) {
  .content-2-5-column .content-2-5-column__grid[data-columns="2"] .content-2-5-column__tile {
    flex: 1 1 calc(50% - var(--spacing-700) / 2);
    max-width: calc(50% - var(--spacing-700) / 2);
  }
  .content-2-5-column .content-2-5-column__grid[data-columns="3"] .content-2-5-column__tile {
    flex: 1 1 calc(33.333% - var(--spacing-700) * 2 / 3);
    max-width: calc(33.333% - var(--spacing-700) * 2 / 3);
  }
  .content-2-5-column .content-2-5-column__grid[data-columns="4"] .content-2-5-column__tile {
    flex: 1 1 calc(25% - var(--spacing-700) * 3 / 4);
    max-width: calc(25% - var(--spacing-700) * 3 / 4);
  }
  .content-2-5-column .content-2-5-column__grid[data-columns="5"] .content-2-5-column__tile {
    flex: 1 1 calc(20% - var(--spacing-700) * 4 / 5);
    max-width: calc(20% - var(--spacing-700) * 4 / 5);
  }
}
.content-2-5-column__tile-icon {
  line-height: 0;
}
.content-2-5-column__tile-icon-inner {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100px;
  height: 100px;
  border-radius: 100%;
  background-color: var(--color-light-blue-200);
}
@media (max-width: 991.98px) {
  .content-2-5-column {
    padding: var(--spacing-1100) 0;
  }
  .content-2-5-column__mobile {
    overflow: visible;
    margin-bottom: var(--spacing-800);
    margin-left: calc(var(--spacing-700) * -1);
    margin-right: calc(var(--spacing-700) * -1);
    padding-left: var(--spacing-700);
    padding-right: 0;
  }
  .content-2-5-column__mobile .swiper-wrapper {
    padding-bottom: var(--spacing-1200);
    display: flex;
  }
  .content-2-5-column__mobile .swiper-slide {
    height: auto;
    display: flex;
    align-items: stretch;
    transition: transform 0.3s ease;
  }
  .content-2-5-column__mobile .swiper-slide > .content-2-5-column__tile {
    width: 100%;
  }
  .content-2-5-column__mobile .swiper-slide.swiper-slide-active {
    z-index: 2;
  }
  .content-2-5-column__tile--mobile {
    padding: var(--spacing-800);
    min-height: 100%;
    display: flex;
    flex-direction: column;
    transform: scale(0.95);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
  }
  .content-2-5-column__tile--mobile .content-2-5-column__tile-icon-inner {
    width: 80px;
    height: 80px;
    background-color: var(--color-light-blue-200);
  }
  .content-2-5-column__tile--mobile h3 {
    font-size: var(--font-size-s);
    line-height: var(--line-height-s);
    letter-spacing: -0.16px;
  }
  .content-2-5-column__tile--mobile p {
    margin-bottom: 0;
  }
  .content-2-5-column__mobile .swiper-slide-active .content-2-5-column__tile--mobile {
    transform: scale(1);
  }
  .content-2-5-column__mobile .swiper-slide-next .content-2-5-column__tile--mobile, .content-2-5-column__mobile .swiper-slide-prev .content-2-5-column__tile--mobile {
    transform: scale(0.85);
  }
  .content-2-5-column__mobile-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: var(--spacing-600);
    margin-top: calc(var(--spacing-1000) * -1);
    padding: 0 !important;
    position: relative;
    z-index: 2;
    min-height: 43px;
  }
  .content-2-5-column__mobile-button {
    flex: 0 0 auto;
  }
  .content-2-5-column__mobile-actions--pagination-only {
    justify-content: flex-start;
  }
  .content-2-5-column__mobile-actions--pagination-only .content-2-5-column__mobile-pagination {
    margin-left: 0;
    justify-content: flex-start;
  }
  .content-2-5-column__mobile-pagination {
    display: flex;
    justify-content: flex-end;
    gap: var(--spacing-100);
    margin-top: 0;
    margin-left: auto;
    min-width: 80px;
    position: static;
    right: 20px !important;
  }
  .content-2-5-column__mobile-pagination .swiper-pagination-bullet {
    width: 16px;
    height: 16px;
    background-color: var(--color-light-blue-200);
    opacity: 1;
  }
  .content-2-5-column__mobile-pagination .swiper-pagination-bullet-active {
    background-color: var(--button-primary-default);
  }
  .content-2-5-column h2 {
    font-size: var(--font-size-xl);
    line-height: var(--line-height-xl);
    margin-bottom: var(--spacing-800);
  }
}