/* ---- Container ---- */
.iti-row {
    display: flex;
    flex-wrap: wrap;
    margin-left: -0.5rem;
    margin-right: -0.5rem;
    box-sizing: border-box;
  }
  
  /* ---- Base column ---- */
  [class*="iti-col"] {
    padding-left: 0.5rem;
    padding-right: 0.5rem;
    box-sizing: border-box;
    flex: 1 0 100%; /* default: full width on mobile */
  }
  
  /* ---- Mobile (default) ---- */
  .iti-col-1 { flex: 0 0 100%; max-width: 100%; }
  .iti-col-2 { flex: 0 0 50%; max-width: 50%; }
  .iti-col-3 { flex: 0 0 33.333%; max-width: 33.333%; }
  
  /* ---- Tablet ≥640px ---- */
  @media (min-width: 640px) {
    .iti-col-md-1 { flex: 0 0 100%; max-width: 100%; }
    .iti-col-md-2 { flex: 0 0 50%; max-width: 50%; }
    .iti-col-md-3 { flex: 0 0 33.333%; max-width: 33.333%; }
  }
  
  /* ---- Desktop ≥1024px ---- */
  @media (min-width: 1024px) {
    .iti-col-lg-1 { flex: 0 0 100%; max-width: 100%; }
    .iti-col-lg-2 { flex: 0 0 50%; max-width: 50%; }
    .iti-col-lg-3 { flex: 0 0 33.333%; max-width: 33.333%; }
  }
  
  /* Optional card styling */
  .iti-box {
    background: #fff;
    border-radius: 6px;
    box-shadow: 0 1px 2px rgba(0,0,0,0.08);
    padding: 1rem;
    margin-bottom: 1rem;
  }