/* ============================================================
   SMJ Marketplace — Layout Override (v4 — tight spacing)
   Load AFTER smj-pages.css in WordPress.
   ONLY spacing changes. Zero content changes.
   ============================================================ */

:root {
  --smj-max:    1100px;
  --smj-max-sm: 860px;
}

/* ── Kill WordPress block margins ── */
.smj-pg .wp-block-group,
.smj-pg .wp-block-group__inner-container,
.smj-pg .entry-content > *,
.smj-pg .wp-block-columns,
.smj-pg .wp-block-column,
.smj-pg p { margin-block-start: 0; margin-block-end: 0; }

/* ── Container ── */
.smj-pg .ctr     { max-width: 1100px; padding: 0 18px; }
.smj-pg .ctr-sm  { max-width: 860px;  padding: 0 18px; }
.smj-pg .doc-body{ max-width: 740px;  padding: 0 18px; }

/* ── Section spacing ── */
.smj-pg .sec     { padding: 32px 0; }
.smj-pg .sec-sm  { padding: 18px 0; }
.smj-pg .sec-head{ margin-bottom: 18px; }

/* ── Page hero ── */
.smj-pg .page-hero         { padding: 26px 0 22px; }
.smj-pg .page-hero h1      { font-size: clamp(18px, 2.8vw, 26px); margin-bottom: 6px; }
.smj-pg .page-hero p       { font-size: 13.5px; }
.smj-pg .page-hero .badge  { font-size: 10px; padding: 2px 10px; margin-bottom: 8px; }
.smj-pg .page-hero .meta   { margin-top: 10px; gap: 12px; font-size: 11.5px; }

/* ── Section labels & titles ── */
.smj-pg .sec-label  { font-size: 10px; padding: 2px 9px; margin-bottom: 5px; }
.smj-pg .sec-title  { font-size: clamp(16px, 2vw, 20px); margin-bottom: 5px; }
.smj-pg .sec-sub    { font-size: 13px; }

/* ── Cards ── */
.smj-pg .card       { padding: 14px; }
.smj-pg .feat-card  { padding: 14px; }
.smj-pg .feat-icon  { width: 34px; height: 34px; font-size: 17px; margin-bottom: 8px; border-radius: 8px; }
.smj-pg .feat-title { font-size: 13px; margin-bottom: 3px; }
.smj-pg .feat-desc  { font-size: 12.5px; line-height: 1.5; }

/* ── Steps ── */
.smj-pg .step-num   { width: 24px; height: 24px; font-size: 11px; flex-shrink: 0; margin-bottom: 0; }
.smj-pg .step-title { font-size: 13px; margin-bottom: 2px; }
.smj-pg .step-desc  { font-size: 12.5px; line-height: 1.5; }

/* ── Grid gaps ── */
.smj-pg .grid-2 { gap: 12px; }
.smj-pg .grid-3 { gap: 12px; }
.smj-pg .grid-4 { gap: 10px; }
.smj-pg .split  { gap: 24px; }

/* ── Value props ── */
.smj-pg .vp-list    { gap: 8px; }
.smj-pg .vp-icon    { width: 28px; height: 28px; font-size: 14px; border-radius: 6px; }
.smj-pg .vp-text h4 { font-size: 12.5px; }
.smj-pg .vp-text p  { font-size: 12px; }

/* ── Category cards ── */
.smj-pg .cat-card  { padding: 12px 8px; }
.smj-pg .cat-emoji { font-size: 24px; margin-bottom: 5px; }
.smj-pg .cat-name  { font-size: 12px; }
.smj-pg .cat-desc  { font-size: 10.5px; }

/* ── Stats bar ── */
.smj-pg .stat-item { padding: 12px 10px; }
.smj-pg .stat-val  { font-size: 18px; margin-bottom: 1px; }
.smj-pg .stat-lbl  { font-size: 10.5px; }

/* ── CTA band ── */
.smj-pg .cta-band    { padding: 26px 20px; border-radius: 10px; }
.smj-pg .cta-band h2 { font-size: clamp(16px, 2vw, 20px); margin-bottom: 5px; }
.smj-pg .cta-band p  { font-size: 13px; margin-bottom: 14px; }

/* ── Buttons ── */
.smj-pg .btn    { padding: 9px 16px; font-size: 12.5px; gap: 6px; }
.smj-pg .btn-lg { padding: 10px 20px; font-size: 13.5px; }

/* ── Notice boxes ── */
.smj-pg .notice      { padding: 9px 12px; font-size: 12.5px; gap: 8px; margin: 8px 0; }
.smj-pg .notice-icon { font-size: 15px; }

/* ── Info list ── */
.smj-pg .info-list    { gap: 6px; }
.smj-pg .info-list li { font-size: 12.5px; gap: 6px; }
.smj-pg .info-list li::before { width: 5px; height: 5px; margin-top: 6px; }

/* ── FAQ ── */
.smj-pg .faq-group       { margin-bottom: 16px; }
.smj-pg .faq-group-title { font-size: 11px; margin-bottom: 7px; padding-bottom: 5px; }
.smj-pg .faq-q           { padding: 10px 13px; font-size: 12.5px; }
.smj-pg .faq-a           { padding: 0 13px 10px; font-size: 12px; line-height: 1.6; }
.smj-pg .faq-chevron     { width: 14px; height: 14px; }

/* ── Legal doc ── */
.smj-pg .doc-toc           { padding: 12px 14px; margin-bottom: 16px; }
.smj-pg .doc-toc-title     { font-size: 10px; margin-bottom: 7px; }
.smj-pg .doc-toc li        { font-size: 11.5px; }
.smj-pg .doc-section       { margin-bottom: 18px; }
.smj-pg .doc-section-title { font-size: 13.5px; margin-bottom: 8px; padding-bottom: 5px; }
.smj-pg .doc-section-title .snum { width: 19px; height: 19px; font-size: 9.5px; }
.smj-pg .doc-section h3    { font-size: 12.5px; margin: 10px 0 4px; }
.smj-pg .doc-section p     { font-size: 13px; margin-bottom: 6px; line-height: 1.6; }
.smj-pg .doc-section li    { font-size: 13px; }
.smj-pg .doc-section ul,
.smj-pg .doc-section ol    { gap: 4px; margin: 5px 0 8px 16px; }

/* ── Contact card ── */
.smj-pg .contact-card    { padding: 16px; }
.smj-pg .contact-card h3 { font-size: 14px; margin-bottom: 3px; }
.smj-pg .contact-card p  { font-size: 12.5px; margin-bottom: 10px; }

/* ── Chip ── */
.smj-pg .chip { font-size: 10px; padding: 2px 8px; }

/* ── Breadcrumb ── */
.smj-pg .breadcrumb { font-size: 11px; margin-bottom: 8px; gap: 4px; }

/* ── Responsive ── */
@media (max-width: 900px) {
  .smj-pg .grid-3 { grid-template-columns: repeat(2,1fr); }
  .smj-pg .grid-4 { grid-template-columns: repeat(2,1fr); }
}
@media (max-width: 640px) {
  .smj-pg .split  { grid-template-columns: 1fr; gap: 14px; }
  .smj-pg .grid-2,
  .smj-pg .grid-3,
  .smj-pg .grid-4 { grid-template-columns: 1fr; }
  .smj-pg .sec    { padding: 20px 0; }
  .smj-pg .sec-sm { padding: 12px 0; }
  .smj-pg .ctr,
  .smj-pg .ctr-sm,
  .smj-pg .doc-body { padding: 0 12px; }
  .smj-pg .page-hero { padding: 18px 0 14px; }
}

/* Tab bar and .smj-page visibility — preview only, not used on live site */