/* ============================================================
 * KING Studios — CENTER MODE
 * ------------------------------------------------------------
 * A single override sheet that flips the page from
 * left-aligned editorial to a centered composition.
 *
 * Loads AFTER styles.css / sections.css / enhance.css so it
 * takes precedence via cascade order alone (no !important
 * spam). Delete this file's <link> tag to revert.
 * ============================================================ */

/* ------------------------------------------------------------
 * 1 · Global text alignment
 *   Center all block text by default; a few spots below
 *   explicitly re-anchor to keep read-order sane.
 * ------------------------------------------------------------ */
body { text-align: center; }

.section,
.hero,
.hero-inner,
.section-head,
.section-head-body,
footer,
.footer-inner {
  text-align: center;
}

/* Inline-block flexy elements re-center */
.eyebrow          { justify-content: center; }
.section-head-body { align-items: center; }

/* Mirror the eyebrow's amber lead-line on the right, so the
 * eyebrow reads as truly centered (line — LABEL — line). */
.eyebrow::after {
  content: '';
  width: 24px; height: 1px;
  background: var(--ember);
}
.eyebrow.no-mark::after { display: none; }

/* Capability matrix: hide the lettered badges (A B C D E F).
 * Kept in the source in case they're wanted back later. */
.cap-mark { display: none; }

/* ------------------------------------------------------------
 * 2 · Section heads
 *   Original grid has an index gutter on the left; flatten
 *   to a single centered column.
 * ------------------------------------------------------------ */
.section-head {
  grid-template-columns: 1fr !important;
  margin-left: auto;
  margin-right: auto;
  justify-items: center;
  text-align: center;
}
.section-head-body {
  max-width: 900px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.section-lead,
.body-lg,
.body {
  margin-left: auto;
  margin-right: auto;
}

/* ------------------------------------------------------------
 * 3 · Hero
 * ------------------------------------------------------------ */
.hero-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.hero-tag { align-self: center; }
.hero-title,
.hero-sub-wrap { margin-left: auto; margin-right: auto; text-align: center; }
.hero-sub-wrap {
  grid-template-columns: 1fr !important;   /* collapse the 180 + 1fr split */
  max-width: 720px;
}
.hero-mono { padding-top: 0; }
.hero-ctas { justify-content: center; }

/* ------------------------------------------------------------
 * 4 · Cards — center card meta rows and captions
 * ------------------------------------------------------------ */
.ind-card,
.craft-card,
.ret-card,
.step-card {
  text-align: center;
}
.ind-body,
.craft-body,
.ret-body,
.step-body {
  align-items: center;
  text-align: center;
}
.ind-body .mono,
.craft-body .mono,
.ret-body .mono {
  align-self: center;
}

/* ------------------------------------------------------------
 * 5 · Capability matrix
 * ------------------------------------------------------------ */
.cap-item,
.cap-body {
  text-align: center;
}
.cap-item ul,
.cap-item ol,
.cap-body ul,
.cap-body ol {
  list-style-position: inside;
  padding-left: 0;
}

/* ------------------------------------------------------------
 * 6 · Process / Why / Retainer — inline lists, kicker rows,
 * pull-quotes, and prose blocks.
 * ------------------------------------------------------------ */
.proc-list,
.why-body,
.ret-grid,
.faq-list {
  text-align: center;
}
.faq-item summary {
  justify-content: center;
  text-align: center;
}
.faq-item .fq-a {
  text-align: center;
  max-width: 800px;
  margin: 0 auto;
}

/* ------------------------------------------------------------
 * 7 · Brief form
 *   The form ITSELF stays left-aligned inside its card so
 *   labels + inputs read naturally, but the intro copy
 *   above it and the card itself center within the section.
 * ------------------------------------------------------------ */
.sec-brief .brief-grid,
.sec-brief .brief-grid-centered {
  justify-items: center;
  text-align: center;
}
.sec-brief .brief-intro {
  text-align: center;
  max-width: 780px;
  margin: 0 auto;
}
.sec-brief .brief-value-tag { justify-content: center; }
.sec-brief .brief-form {
  margin-left: auto;
  margin-right: auto;
  text-align: left;                        /* keep inputs left-anchored */
}
.sec-brief .brief-form .bf-title-block,
.sec-brief .brief-form .wiz-heading {
  text-align: center;
}
.sec-brief .brief-form .bf-l { text-align: left; }
.sec-brief .brief-form .bf-chips { justify-content: center; }

/* ------------------------------------------------------------
 * 8 · Footer
 *   Center columns, but keep the logo lockup and column
 *   headings visually anchored so links stay readable.
 * ------------------------------------------------------------ */
.footer-inner {
  justify-items: center;
  text-align: center;
}
.ft-brand,
.ft-col {
  align-items: center;
  text-align: center;
}
.ft-brand .brand-logo { justify-content: center; }
.ft-tag { max-width: 420px; margin-left: auto; margin-right: auto; }
.ft-col a { justify-content: center; }
.ft-bottom { justify-content: center; text-align: center; }

/* ------------------------------------------------------------
 * 9 · Final CTA
 * ------------------------------------------------------------ */
.final-cta {
  text-align: center;
}
.final-cta .btn-row { justify-content: center; }