/*
 * Quick Links — grid responsive de quick-link-card.
 */

.quick-links {
  position: relative;
}

.ql-bg-white     { background-color: #ffffff; }
.ql-bg-gray      { background-color: #f5f5f5; }
.ql-bg-brand-bg  { background-color: rgb(var(--neutral-bg, 245 247 250)); }
.ql-bg-default   { background-color: #ffffff; }

.ql-title {
  font-size: clamp(1.875rem, 4vw, 3rem);
  letter-spacing: -0.025em;
  color: rgb(var(--brand-primary, 4 36 64));
  line-height: 1.1;
}

/* Grid base: 1 col mobile, configurable mobile/desktop columns via class */
.ql-grid {
  display: grid;
  gap: 2rem;
  text-align: center;
}

/* Mobile columns */
.ql-mobile-cols-1 .ql-grid { grid-template-columns: 1fr; }
.ql-mobile-cols-2 .ql-grid { grid-template-columns: repeat(2, 1fr); gap: 1rem; }
@media (min-width: 640px) {
  .ql-mobile-cols-1 .ql-grid,
  .ql-mobile-cols-2 .ql-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 2rem;
  }
}

/* Desktop columns (lg+) */
@media (min-width: 1024px) {
  .ql-cols-2 .ql-grid { grid-template-columns: repeat(2, 1fr); }
  .ql-cols-3 .ql-grid { grid-template-columns: repeat(3, 1fr); }
  .ql-cols-4 .ql-grid { grid-template-columns: repeat(4, 1fr); }
}