/*
 * small-batch-production.preview.css · auto-generated by apply_audit_to_preview.py
 *
 * Per-page layout primitives ported from the wireframe's <style> block.
 * Every rule below appeared as `missing` in the v2 audit manifest — i.e. the
 * wireframe declared the layout but brand.preview.css does not. Without this
 * file the section collapses to single-column flow (the Stage 13 bug).
 *
 * DO NOT add decoration here (colors, shadows, typography). That belongs in
 * brand.preview.css. Layout primitives only.
 *
 * Source manifest: C:/Users/james/Desktop/Claude Agent/projects/3dpe-website/research/audit-small-batch-production.json
 * Source wireframe: C:/Users/james/Desktop/Claude Agent/projects/3dpe-website/design-previews/wireframes/small-batch-production.html
 */


/* ===== Section 02 · HERO ===== */

.hero {
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  gap: 36px;
  align-items: center;
  position: relative;
}


/* ===== Section 02½ · QUANTIFIED TRUST ===== */

.trust-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}


/* ===== Section 04 · COMPARISON BAND ===== */

.cmp {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
}


/* ===== Section 04 · WHO THIS IS FOR ===== */

.icp-card {
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  gap: 28px;
  align-items: start;
}


/* ===== Section 05 · WHY 3DPE FOR BATCH ===== */

.why-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}


/* ===== Section 06 · OUR BATCH PROCESS ===== */

.step {
  position: relative;
}

.steps {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  position: relative;
}


/* ===== Section 07 · MATERIALS RANKED FOR BATCH ===== */

.mat-row {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
}


/* ===== Section 09 · PRICING FRAMEWORK ===== */

.pricing-band {
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  gap: 36px;
  align-items: center;
}

.pricing-drivers {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px 14px;
}


/* ===== Section 10 · OBJECTIONS ===== */

.obj-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}


/* ===== Section 11 · RISK REVERSAL ===== */

.risk-band {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}


/* ===== Section 12 · TURNKEY + FULFILMENT TEASER ===== */

.fulfil-teaser {
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: 28px;
  align-items: center;
}


/* ===== Section 15 · FOOTER ===== */

.footer {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
}


/* ===== Mobile breakpoint · ported from wireframe @media (max-width: 860px) ===== */

@media (max-width: 860px) {

  .hero {
  grid-template-columns: 1fr;
  }

  .trust-grid {
  grid-template-columns: 1fr;
  }

  .why-grid {
  grid-template-columns: 1fr;
  }

  .obj-grid {
  grid-template-columns: 1fr;
  }

  .risk-band {
  grid-template-columns: 1fr;
  }

  .mat-row {
  grid-template-columns: 1fr;
  grid-template-columns: repeat(2, 1fr);
  }

  .cmp {
  grid-template-columns: 1fr;
  }

  .icp-card {
  grid-template-columns: 1fr;
  }

  .pricing-band {
  grid-template-columns: 1fr;
  }

  .fulfil-teaser {
  grid-template-columns: 1fr;
  }

  .steps {
  grid-template-columns: 1fr;
  }

  .footer {
  grid-template-columns: 1fr 1fr;
  }

}

/* SBP keyword H2 band - added 2026-06-01 for SEO/topical authority */
.sbp-kw-band { padding: 40px 24px 20px; text-align: center; background: transparent; }
.sbp-kw-h2 { font-size: clamp(20px, 2.2vw, 28px); font-weight: 700; line-height: 1.25; margin: 0 0 14px; max-width: 880px; margin-left: auto; margin-right: auto; }
.sbp-kw-sub { font-size: 15px; line-height: 1.6; max-width: 760px; margin: 0 auto; color: var(--ink-700, #334155); }
.sbp-kw-sub a { color: inherit; text-decoration: underline; text-decoration-color: var(--accent, #10b981); text-underline-offset: 3px; }
.sbp-kw-sub a:hover { color: var(--accent, #10b981); }
@media (max-width: 640px) {
  .sbp-kw-band { padding: 28px 16px 14px; }
  .sbp-kw-h2 { font-size: 18px; }
  .sbp-kw-sub { font-size: 14px; }
}

/* Tighten the gap between the keyword band and the stats band - James 2026-06-05.
   (Root cause of the ~270px void: the inner div carried the page-level
   `.page-wrap` 120px bottom padding; that class removed from the markup.
   Here we also trim the generic 56px section margin + 40px padding on the
   stats section so the two bands sit closer.) */
.sbp-kw-band { padding-bottom: 12px; }
section.wf#sec-025 { margin-top: 16px; padding-top: 22px; }
@media (max-width: 640px) {
  section.wf#sec-025 { margin-top: 10px; padding-top: 16px; }
}