/**
 * UI Harmony Layer
 * Aggregator for design tokens and shared component modules.
 */

@import url("./base/tokens.css");
@import url("./layout/sections.css");
@import url("./components/cards.css");
@import url("./components/buttons.css");
@import url("./components/forms.css");
@import url("./admin/harmony.css");

/* Optional helper classes for future templates */
.kp-stack-sm > * + * { margin-top: var(--kp-space-2); }
.kp-stack-md > * + * { margin-top: var(--kp-space-4); }
.kp-stack-lg > * + * { margin-top: var(--kp-space-6); }

.kp-grid-2 {
  display: grid;
  gap: var(--kp-space-5);
  grid-template-columns: repeat(1, minmax(0, 1fr));
}

@media (min-width: 768px) {
  .kp-grid-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}