/* LuperIQ blocks shared styles */
.lq-section {
  box-sizing: border-box;
}
.lq-section-inner {
  box-sizing: border-box;
  padding-left: 16px;
  padding-right: 16px;
}

/* Shadows (token-friendly, can be themed later) */
.lq-shadow-none { box-shadow: none !important; }
.lq-shadow-sm { box-shadow: 0 1px 2px rgba(0,0,0,0.08) !important; }
.lq-shadow-md { box-shadow: 0 4px 12px rgba(0,0,0,0.10) !important; }
.lq-shadow-lg { box-shadow: 0 10px 24px rgba(0,0,0,0.14) !important; }

/* Row & Column */
.lq-row {
  display: flex;
  flex-wrap: wrap;
  padding: var(--lq-row-py, 0) var(--lq-row-px, 0);
  margin-top: var(--lq-row-my, 0);
  margin-bottom: var(--lq-row-my, 0);
}
.lq-col {
  box-sizing: border-box;
  padding: var(--lq-col-p, 0);
  margin-top: var(--lq-col-my, 0);
  margin-bottom: var(--lq-col-my, 0);
}

/* Responsive adjustments */
@media (max-width: 1024px) {
  .lq-row {
    padding: var(--lq-row-py-tablet, var(--lq-row-py, 0)) var(--lq-row-px-tablet, var(--lq-row-px, 0));
    margin-top: var(--lq-row-my-tablet, var(--lq-row-my, 0));
    margin-bottom: var(--lq-row-my-tablet, var(--lq-row-my, 0));
  }
  .lq-col {
    padding: var(--lq-col-p-tablet, var(--lq-col-p, 0));
    margin-top: var(--lq-col-my-tablet, var(--lq-col-my, 0));
    margin-bottom: var(--lq-col-my-tablet, var(--lq-col-my, 0));
    flex: 0 0 var(--lq-col-w-tablet, var(--lq-col-w, auto));
    max-width: var(--lq-col-w-tablet, var(--lq-col-w, 100%));
  }
}
@media (max-width: 768px) {
  .lq-row {
    padding: var(--lq-row-py-mobile, var(--lq-row-py-tablet, var(--lq-row-py, 0))) var(--lq-row-px-mobile, var(--lq-row-px-tablet, var(--lq-row-px, 0)));
    margin-top: var(--lq-row-my-mobile, var(--lq-row-my-tablet, var(--lq-row-my, 0)));
    margin-bottom: var(--lq-row-my-mobile, var(--lq-row-my-tablet, var(--lq-row-my, 0)));
  }
  .lq-col {
    padding: var(--lq-col-p-mobile, var(--lq-col-p-tablet, var(--lq-col-p, 0)));
    margin-top: var(--lq-col-my-mobile, var(--lq-col-my-tablet, var(--lq-col-my, 0)));
    margin-bottom: var(--lq-col-my-mobile, var(--lq-col-my-tablet, var(--lq-col-my, 0)));
    flex: 0 0 var(--lq-col-w-mobile, var(--lq-col-w-tablet, var(--lq-col-w, auto)));
    max-width: var(--lq-col-w-mobile, var(--lq-col-w-tablet, var(--lq-col-w, 100%)));
  }
  .lq-row.lq-stack-mobile .lq-col {
    flex: 0 0 100% !important;
    max-width: 100% !important;
  }
}

/* Container block */
.lq-container {
  box-sizing: border-box;
}
.lq-container-inner {
  box-sizing: border-box;
}