/* =============================================================================
   Icon Columns — [icon_columns] shortcode
   ============================================================================= */

.icols {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0 56px;
}

.icols[data-count="1"] { grid-template-columns: 1fr; }
.icols[data-count="2"] { grid-template-columns: repeat(2, 1fr); }
.icols[data-count="4"] { grid-template-columns: repeat(2, 1fr); gap: 40px 56px; }
.icols[data-count="5"],
.icols[data-count="6"] { grid-template-columns: repeat(3, 1fr); }

/* ---- Item ---- */

.icols-item {
  border-top: 1px solid rgba(116, 140, 164, 0.3);
  padding-top: 28px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  opacity: 0;
  transform: translateY(8px);
}

.icols.is-visible .icols-item {
  animation: icols-fade-in 0.7s ease forwards;
}

@keyframes icols-fade-in {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ---- Icon ---- */

.icols-icon {
  height: 40px;
  display: flex;
  align-items: flex-start;
  color: #0C244A;
  margin-bottom: -10px;
}

.icols-icon svg {
  height: 38px;
  width: auto;
  display: block;
}

.icols-icon img {
  height: 38px;
  width: auto;
  display: block;
}

.icols-icon i,
.icols-icon .dashicons {
  font-size: 38px;
  width: 38px;
  height: 38px;
  line-height: 1;
}

/* ---- Text ---- */

.icols-heading {
  font-size: 1.4rem;
  margin: 0;
  line-height: 1.3;
}

.icols-body,
.icols-body p,
.icols-body li {
  font-size: 0.875rem;
  color: rgba(12, 36, 74, 0.6);
  line-height: 1.65;
  margin: 0;
}

/* ---- Responsive ---- */

@media (max-width: 767px) {
  .icols {
    grid-template-columns: 1fr;
    gap: 32px 0;
  }
}
