/* Simbatch Growth V4.3 — route-scoped presentation foundation. */

.sbx-v43,
.sbx-v43 *,
.sbx-v43 *::before,
.sbx-v43 *::after {
  box-sizing: border-box;
}

.sbx-v43 {
  background: var(--sbx-color-bg, #f8faf8);
  color: var(--sbx-color-text, #14213d);
  font-family: var(--sbx-font-sans, sans-serif);
  line-height: var(--sbx-leading-body, 1.7);
  overflow-x: clip;
}

.sbx-v43 .sbx-container {
  margin-inline: auto;
  max-width: var(--sbx-container, 1200px);
  padding-inline: var(--sbx-container-pad, clamp(1rem, 4vw, 2rem));
  width: 100%;
}

.sbx-v43 h1,
.sbx-v43 h2,
.sbx-v43 h3,
.sbx-v43 p {
  margin-block-start: 0;
}

.sbx-v43 h1,
.sbx-v43 h2,
.sbx-v43 h3 {
  color: var(--sbx-navy-800, #14213d);
  line-height: var(--sbx-leading-tight, 1.15);
  text-wrap: balance;
}

.sbx-v43 h1 {
  font-size: var(--sbx-text-h1, clamp(2rem, 4vw, 2.75rem));
  max-width: 21ch;
}

.sbx-v43 h2 {
  font-size: var(--sbx-text-h2, clamp(1.5rem, 2.6vw, 2rem));
}

.sbx-v43 h3 {
  font-size: var(--sbx-text-h3, 1.25rem);
}

.sbx-v43 a {
  color: var(--sbx-color-link, #0e7a7c);
  text-underline-offset: 0.2em;
}

.sbx-v43__hero {
  background: var(--sbx-soft-blue, #e8f1f5);
  border-bottom: 1px solid var(--sbx-color-border, #e3e9ec);
  padding-block: clamp(3.5rem, 8vw, 6rem);
}

.sbx-v43__hero-inner {
  max-width: var(--sbx-measure-hero, 62rem);
}

.sbx-v43__eyebrow {
  color: var(--sbx-teal-700, #0b5f61);
  font-size: var(--sbx-text-label, 0.75rem);
  font-weight: 750;
  letter-spacing: 0.09em;
  margin-bottom: var(--sbx-space-3, 0.75rem);
  text-transform: uppercase;
}

.sbx-v43__lead {
  color: var(--sbx-color-text-muted, #52606d);
  font-size: var(--sbx-text-lead, clamp(1rem, 2vw, 1.25rem));
  max-width: var(--sbx-measure-lead, 44em);
}

.sbx-v43__disclosure,
.sbx-v43__boundary,
.sbx-v43__notice {
  background: var(--sbx-soft-yellow, #fff4d6);
  border-left: 4px solid #9b7510;
  border-radius: var(--sbx-radius-sm, 8px);
  color: #4f3b00;
  margin-top: var(--sbx-space-5, 1.5rem);
  max-width: var(--sbx-measure-text, 52em);
  padding: var(--sbx-space-4, 1rem);
}

.sbx-v43__section {
  padding-block: var(--sbx-section-y, clamp(4rem, 8vw, 6.5rem));
}

.sbx-v43__section + .sbx-v43__section {
  border-top: 1px solid var(--sbx-color-border, #e3e9ec);
}

.sbx-v43__section--accent {
  background: var(--sbx-navy-800, #14213d);
  color: var(--sbx-text-invert, #f4f7fa);
}

/* Scoped with .sbx-v43 so the inverse heading colour outranks the site-wide
   `.sbx-site h1, .sbx-site h2, .sbx-site h3` rule, which loads after this file
   at equal specificity and would otherwise win on source order. */
.sbx-v43 .sbx-v43__section--accent h2 {
  color: var(--sbx-text-invert, #f4f7fa);
}

.sbx-v43__section-heading,
.sbx-v43__narrow {
  max-width: var(--sbx-measure-block, 56rem);
}

.sbx-v43__section-heading {
  margin-bottom: var(--sbx-space-6, 2rem);
}

.sbx-v43__card-grid {
  display: grid;
  gap: var(--sbx-grid-gap, clamp(1rem, 2vw, 1.5rem));
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.sbx-v43__card,
.sbx-v43__panel,
.sbx-v43__empty-state,
.sbx-v43__unavailable {
  background: var(--sbx-color-surface, #fff);
  border: 1px solid var(--sbx-color-border, #e3e9ec);
  border-radius: var(--sbx-radius-lg, 16px);
  min-width: 0;
  padding: var(--sbx-card-pad, clamp(1.25rem, 2.5vw, 2rem));
}

.sbx-v43__card p,
.sbx-v43__panel p {
  overflow-wrap: anywhere;
}

.sbx-v43__status {
  background: var(--sbx-status-dev-bg, #fff4d6);
  border: 1px solid #b58b18;
  border-radius: var(--sbx-radius-pill, 999px);
  color: #5c4300;
  display: inline-flex;
  font-size: var(--sbx-text-sm, 0.875rem);
  font-weight: 700;
  margin-bottom: var(--sbx-space-4, 1rem);
  padding: 0.35rem 0.8rem;
}

.sbx-v43__actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: var(--sbx-space-3, 0.75rem);
  margin-top: var(--sbx-space-5, 1.5rem);
}

.sbx-v43__cta {
  align-items: center;
  border: 2px solid transparent;
  border-radius: var(--sbx-radius-pill, 999px);
  display: inline-flex;
  font-weight: 750;
  justify-content: center;
  min-height: 44px;
  padding: 0.65rem 1.2rem;
  text-decoration: none;
}

/* Scoped with .sbx-v43 so the on-accent label colour outranks the generic
   `.sbx-v43 a` link colour declared above, which would otherwise render the
   label in the link teal on the teal button surface. */
.sbx-v43 .sbx-v43__cta--primary {
  background: var(--sbx-teal-600, #0e7a7c);
  color: #fff;
}

.sbx-v43__cta--secondary {
  background: transparent;
  border-color: currentColor;
  color: var(--sbx-teal-700, #0b5f61);
}

.sbx-v43__section--accent .sbx-v43__cta--secondary {
  color: var(--sbx-teal-200, #a8dcdd);
}

.sbx-v43__cta--text {
  border-radius: var(--sbx-radius-sm, 8px);
  justify-content: flex-start;
  margin-inline-start: -0.75rem;
  padding-inline: 0.75rem;
  text-decoration: underline;
}

.sbx-v43__two-column {
  align-items: start;
  display: grid;
  gap: clamp(2rem, 5vw, 4rem);
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}

.sbx-v43__list {
  margin: 0;
  padding-inline-start: 1.25rem;
}

.sbx-v43__list li + li {
  margin-top: var(--sbx-space-3, 0.75rem);
}