/* ============================================================
   SEOD S1A, core brand + customer experience layer.
   ADDITIVE ONLY. Loaded by the S1A core pages after styles.css.
   No existing selector is redefined, so the other production
   pages are unaffected by this file.

   Palette is inherited from styles.css :root. Contrast checked
   per preflight rule A11 against the parent background each
   class actually lands on:
     on --ink #0A0A0A : #FFFFFF 21:1, rgba(255,255,255,.74) ~14:1,
                        --accent #4FE883 ~13.6:1
     on --white       : --text #0A0A0A 21:1, --text-muted #6B7280 5.0:1,
                        --accent-text #1B7A45 5.36:1
     on --gray-light  : --text 19.9:1, --text-muted 4.8:1
   --accent (#4FE883) is a display green and is NEVER used as
   small text on a light ground. Use --accent-text there.
   ============================================================ */

/* ====== LAYOUT PRIMITIVES ====== */
/* --text-muted (#6B7280) measures 4.47:1 on --gray-light and 4.49:1 on
   --blue-light, just under the 4.5:1 WCAG AA floor for small text. Caught in the
   S1A contrast audit. #616A78 clears it on white (5.47:1), --gray-light (5.05:1)
   and --blue-light (5.07:1) with almost no visual change. */
:root { --s1a-muted: #616A78; }

.s1a-wrap { max-width: 1120px; margin: 0 auto; padding: 0 24px; }
.s1a-wrap--narrow { max-width: 780px; }
.s1a-sec { padding: 72px 0; }
.s1a-sec--tight { padding: 48px 0; }
.s1a-sec--ink { background: var(--ink); color: #fff; }
.s1a-sec--tint { background: var(--gray-light); }
.s1a-sec--line { border-top: 1px solid var(--gray-mid); }

/* ====== TYPE ====== */
.s1a-eyebrow {
  font: 600 12.5px/1 system-ui, sans-serif; letter-spacing: .14em;
  text-transform: uppercase; color: var(--accent-text); margin: 0 0 16px;
}
.s1a-sec--ink .s1a-eyebrow { color: var(--accent); }
/* The hero is a dark ground but carries no --ink class, so the eyebrow fell back to
   --accent-text, which is tuned for light backgrounds (3.69:1 on #0A0A0A). Give it the
   same treatment the --ink sections already use. */
.s1a-hero .s1a-eyebrow { color: var(--accent); }
.s1a-h2 {
  font-family: 'Fraunces', Georgia, serif; font-weight: 600;
  font-size: clamp(26px, 3.4vw, 40px); line-height: 1.15;
  letter-spacing: -.02em; color: var(--ink); margin: 0 0 16px;
}
.s1a-sec--ink .s1a-h2 { color: #fff; }
.s1a-h3 {
  font-family: 'Fraunces', Georgia, serif; font-weight: 600;
  font-size: 20px; line-height: 1.25; color: var(--ink); margin: 0 0 10px;
}
.s1a-lede { font-size: 17.5px; line-height: 1.7; color: var(--s1a-muted); margin: 0 0 22px; max-width: 62ch; }
.s1a-sec--ink .s1a-lede { color: rgba(255,255,255,.74); }
.s1a-p { font-size: 16px; line-height: 1.75; color: var(--text); margin: 0 0 16px; max-width: 68ch; }
.s1a-sec--ink .s1a-p { color: rgba(255,255,255,.8); }
.s1a-small { font-size: 13.5px; line-height: 1.6; color: var(--s1a-muted); }

/* ====== BUTTONS ====== */
.s1a-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  padding: 15px 28px; border-radius: var(--radius-pill); text-decoration: none;
  font: 700 15px/1 system-ui, sans-serif; border: 2px solid transparent;
  transition: background .18s ease, border-color .18s ease, color .18s ease;
  min-height: 48px;
}
.s1a-btn--primary { background: var(--accent-deep); color: #0A0A0A; }
.s1a-btn--primary:hover { background: #239553; color: #0A0A0A; }
.s1a-btn--ghost { background: transparent; color: var(--ink); border-color: var(--gray-mid); }
.s1a-btn--ghost:hover { border-color: var(--ink); }
/* Ghost buttons sit on three different dark grounds: .s1a-sec--ink sections,
   the hero, and the closing CTA band. All three need the light treatment, or the
   near-black default label renders invisible on near-black. Caught in visual QA,
   which is exactly the gap preflight rule A11 describes: a class written while
   looking at the markup rather than at the background it lands on.
   #FFFFFF on #0A0A0A is 21:1, well past WCAG AA. */
.s1a-sec--ink .s1a-btn--ghost,
.s1a-hero .s1a-btn--ghost,
.s1a-cta .s1a-btn--ghost { color: #fff; border-color: rgba(255,255,255,.34); }
.s1a-sec--ink .s1a-btn--ghost:hover,
.s1a-hero .s1a-btn--ghost:hover,
.s1a-cta .s1a-btn--ghost:hover { border-color: #fff; }
.s1a-btnrow { display: flex; flex-wrap: wrap; gap: 12px; margin: 26px 0 0; }
.s1a-btn:focus-visible, .s1a-opt:focus-visible, .s1a-card:focus-visible {
  outline: 3px solid var(--accent); outline-offset: 3px;
}

/* ====== HERO ====== */
.s1a-hero { background: var(--ink); color: #fff; padding: 84px 0 76px; }
.s1a-hero__h1 {
  font-family: 'Fraunces', Georgia, serif; font-weight: 600;
  font-size: clamp(32px, 5.4vw, 58px); line-height: 1.08;
  letter-spacing: -.025em; color: #fff; margin: 0 0 20px; max-width: 17ch;
}
.s1a-hero__sub { font-size: 18px; line-height: 1.65; color: rgba(255,255,255,.76); max-width: 60ch; margin: 0 0 8px; }
.s1a-hero__caps {
  margin: 26px 0 0; font: 600 13.5px/1.6 system-ui, sans-serif;
  color: var(--accent); letter-spacing: .01em;
}

/* ====== OWNER QUESTIONS ====== */
.s1a-qgrid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(268px, 1fr));
  gap: 12px; margin: 30px 0 0; list-style: none; padding: 0;
}
.s1a-q {
  background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.1);
  border-radius: var(--radius-md); padding: 18px 20px;
  font-size: 15.5px; line-height: 1.55; color: rgba(255,255,255,.9);
}
.s1a-turn { margin: 40px 0 0; padding: 28px 0 0; border-top: 1px solid rgba(255,255,255,.14); }
.s1a-turn__lead {
  font-family: 'Fraunces', Georgia, serif; font-size: clamp(21px, 2.6vw, 28px);
  line-height: 1.3; color: #fff; margin: 0 0 14px; font-weight: 600;
}

/* ====== PATHWAY CARDS ====== */
.s1a-paths { display: grid; grid-template-columns: repeat(auto-fit, minmax(236px, 1fr)); gap: 16px; margin: 34px 0 0; }
.s1a-card {
  display: flex; flex-direction: column; background: #fff;
  border: 1px solid var(--gray-mid); border-radius: var(--radius-lg);
  padding: 26px 24px 24px; text-decoration: none;
  transition: border-color .18s ease, transform .18s ease, box-shadow .18s ease;
}
.s1a-card:hover { border-color: var(--accent-deep); transform: translateY(-2px); box-shadow: var(--shadow-md); }
.s1a-card__kicker { font: 600 12px/1 system-ui, sans-serif; letter-spacing: .12em; text-transform: uppercase; color: var(--s1a-muted); margin: 0 0 10px; }
.s1a-card__name { font-family: 'Fraunces', Georgia, serif; font-size: 22px; font-weight: 600; color: var(--ink); margin: 0 0 10px; }
.s1a-card__body { font-size: 15px; line-height: 1.65; color: var(--s1a-muted); margin: 0 0 18px; flex: 1; }
.s1a-card__cta { font: 700 14.5px/1 system-ui, sans-serif; color: var(--accent-text); }
.s1a-card__cta::after { content: " \2192"; }
.s1a-card__price { font: 600 13.5px/1 system-ui, sans-serif; color: var(--text); margin: 0 0 14px; }

/* ====== PRINCIPLE BLOCK ====== */
.s1a-principle { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.15fr); gap: 44px; align-items: start; }
.s1a-principle__quote {
  font-family: 'Fraunces', Georgia, serif; font-weight: 600;
  font-size: clamp(28px, 4vw, 44px); line-height: 1.14; letter-spacing: -.02em;
  color: var(--ink); margin: 0;
}
.s1a-sec--ink .s1a-principle__quote { color: #fff; }
.s1a-principle__rule { width: 56px; height: 3px; background: var(--accent-deep); margin: 20px 0 0; border-radius: 2px; }

/* ====== NUMBERED PROCESS ====== */
.s1a-steps { display: grid; grid-template-columns: repeat(auto-fit, minmax(178px,1fr)); gap: 18px; margin: 32px 0 0; counter-reset: s1a; list-style: none; padding: 0; }
.s1a-step { counter-increment: s1a; padding: 20px; background: #fff; border: 1px solid var(--gray-mid); border-radius: var(--radius-md); }
.s1a-sec--ink .s1a-step { background: rgba(255,255,255,.05); border-color: rgba(255,255,255,.12); }
.s1a-step::before {
  content: counter(s1a); display: block; font-family: 'Fraunces', Georgia, serif;
  font-size: 26px; font-weight: 600; color: var(--accent-text); margin: 0 0 8px; line-height: 1;
}
.s1a-sec--ink .s1a-step::before { color: var(--accent); }
.s1a-step__t { font: 600 15.5px/1.4 system-ui, sans-serif; color: var(--ink); margin: 0 0 6px; }
.s1a-sec--ink .s1a-step__t { color: #fff; }
.s1a-step__d { font-size: 14px; line-height: 1.6; color: var(--s1a-muted); margin: 0; }
.s1a-sec--ink .s1a-step__d { color: rgba(255,255,255,.7); }

/* ====== SCOPE / INCLUSION LIST ====== */
.s1a-scope { display: grid; grid-template-columns: repeat(auto-fit, minmax(258px,1fr)); gap: 10px 28px; margin: 26px 0 0; padding: 0; list-style: none; }
.s1a-scope li { position: relative; padding: 0 0 0 26px; font-size: 15.5px; line-height: 1.6; color: var(--text); }
.s1a-scope li::before {
  content: ""; position: absolute; left: 4px; top: .52em; width: 9px; height: 9px;
  border-radius: 50%; background: var(--accent-deep);
}
.s1a-sec--ink .s1a-scope li { color: rgba(255,255,255,.85); }

/* ====== FACT ROWS / PRICE PANELS ====== */
.s1a-panel { background: #fff; border: 1px solid var(--gray-mid); border-radius: var(--radius-lg); padding: 30px 28px; }
.s1a-panel--accent { border-color: var(--accent-deep); border-width: 2px; }
.s1a-panel__price { font-family: 'Fraunces', Georgia, serif; font-size: 32px; font-weight: 600; color: var(--ink); margin: 0 0 4px; line-height: 1.1; }
.s1a-panel__unit { font: 500 14px/1 system-ui, sans-serif; color: var(--s1a-muted); }
.s1a-plist { display: grid; gap: 18px; grid-template-columns: repeat(auto-fit, minmax(252px,1fr)); margin: 34px 0 0; }

/* ====== FAQ ====== */
.s1a-faq { border-top: 1px solid var(--gray-mid); margin: 28px 0 0; }
.s1a-faq details { border-bottom: 1px solid var(--gray-mid); }
.s1a-faq summary { cursor: pointer; padding: 18px 0; font: 600 16.5px/1.45 system-ui, sans-serif; color: var(--ink); list-style: none; }
.s1a-faq summary::-webkit-details-marker { display: none; }
.s1a-faq summary::after { content: "+"; float: right; color: var(--accent-text); font-size: 20px; line-height: 1; }
.s1a-faq details[open] summary::after { content: "\2212"; }
.s1a-faq p { font-size: 15.5px; line-height: 1.7; color: var(--s1a-muted); margin: 0 0 18px; max-width: 72ch; }

/* ====== TRUST ====== */
.s1a-trust { display: flex; flex-wrap: wrap; gap: 10px; margin: 26px 0 0; padding: 0; list-style: none; }
.s1a-trust li {
  background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.13);
  border-radius: var(--radius-pill); padding: 9px 17px;
  font: 600 14px/1 system-ui, sans-serif; color: rgba(255,255,255,.92);
}
.s1a-rel { width: 100%; border-collapse: collapse; margin: 24px 0 0; font-size: 15px; }
.s1a-rel th, .s1a-rel td { text-align: left; padding: 13px 14px; border-bottom: 1px solid var(--gray-mid); }
.s1a-rel th { font: 600 12.5px/1 system-ui, sans-serif; letter-spacing: .1em; text-transform: uppercase; color: var(--s1a-muted); }
.s1a-rel td:last-child { color: var(--s1a-muted); }

/* ====== CTA BAND ====== */
.s1a-cta { background: var(--ink); color: #fff; border-radius: var(--radius-xl); padding: 48px 40px; text-align: center; }
.s1a-cta__h { font-family: 'Fraunces', Georgia, serif; font-size: clamp(24px,3.2vw,34px); font-weight: 600; color: #fff; margin: 0 0 12px; line-height: 1.2; }
.s1a-cta__s { font-size: 16px; line-height: 1.65; color: rgba(255,255,255,.74); margin: 0 auto 24px; max-width: 54ch; }
.s1a-cta .s1a-btnrow { justify-content: center; }

/* ====== FIND MY STARTING POINT ====== */
.s1a-fmsp { max-width: 720px; margin: 0 auto; }
.s1a-prog { display: flex; align-items: center; gap: 12px; margin: 0 0 28px; }
.s1a-prog__bar { flex: 1; height: 6px; background: var(--gray-mid); border-radius: 99px; overflow: hidden; }
.s1a-prog__fill { height: 100%; background: var(--accent-deep); border-radius: 99px; transition: width .3s ease; width: 0; }
.s1a-prog__txt { font: 600 13px/1 system-ui, sans-serif; color: var(--s1a-muted); white-space: nowrap; }
.s1a-step-q { font-family: 'Fraunces', Georgia, serif; font-size: clamp(24px,3.4vw,34px); font-weight: 600; line-height: 1.2; color: var(--ink); margin: 0 0 8px; }
.s1a-step-h { font-size: 15.5px; line-height: 1.6; color: var(--s1a-muted); margin: 0 0 24px; }
.s1a-opts { display: grid; gap: 12px; margin: 0 0 28px; }
.s1a-opt {
  display: flex; align-items: center; gap: 14px; width: 100%; text-align: left;
  padding: 18px 20px; min-height: 60px; background: #fff; cursor: pointer;
  border: 2px solid var(--gray-mid); border-radius: var(--radius-md);
  font: 500 16px/1.4 system-ui, sans-serif; color: var(--ink);
  transition: border-color .16s ease, background .16s ease;
}
.s1a-opt:hover { border-color: var(--accent-deep); background: var(--blue-light); }
.s1a-opt[aria-pressed="true"] { border-color: var(--accent-deep); background: var(--blue-light); }
.s1a-opt__dot { flex: none; width: 20px; height: 20px; border-radius: 50%; border: 2px solid var(--gray-mid); }
.s1a-opt[aria-pressed="true"] .s1a-opt__dot { border-color: var(--accent-deep); background: var(--accent-deep); box-shadow: inset 0 0 0 3px #fff; }
.s1a-nav-row { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin: 8px 0 0; }
.s1a-back {
  background: none; border: 0; cursor: pointer; padding: 12px 4px; min-height: 44px;
  font: 600 15px/1 system-ui, sans-serif; color: var(--s1a-muted);
}
.s1a-back:hover { color: var(--ink); }
.s1a-back[hidden] { display: none; }
.s1a-ta {
  width: 100%; min-height: 120px; padding: 14px 16px; border: 2px solid var(--gray-mid);
  border-radius: var(--radius-md); font: 400 16px/1.6 system-ui, sans-serif; color: var(--ink);
  resize: vertical; margin: 0 0 20px;
}
.s1a-ta:focus { outline: none; border-color: var(--accent-deep); }
.s1a-result__badge {
  display: inline-block; background: var(--blue-light); color: var(--accent-text);
  border-radius: var(--radius-pill); padding: 8px 18px;
  font: 700 13px/1 system-ui, sans-serif; letter-spacing: .06em; text-transform: uppercase; margin: 0 0 16px;
}
.s1a-recap { margin: 30px 0 0; padding: 22px 24px; background: var(--gray-light); border-radius: var(--radius-md); }
.s1a-recap dt { font: 600 13px/1.5 system-ui, sans-serif; color: var(--s1a-muted); margin: 12px 0 2px; }
.s1a-recap dt:first-child { margin-top: 0; }
.s1a-recap dd { margin: 0; font-size: 15px; line-height: 1.5; color: var(--ink); }
.s1a-vh { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ====== RESPONSIVE ====== */
@media (max-width: 860px) {
  .s1a-principle { grid-template-columns: 1fr; gap: 24px; }
  .s1a-sec { padding: 54px 0; }
  .s1a-hero { padding: 60px 0 54px; }
  .s1a-cta { padding: 36px 22px; border-radius: var(--radius-lg); }
  .s1a-btnrow .s1a-btn { flex: 1 1 100%; }
  .s1a-rel { font-size: 14px; }
  .s1a-rel th, .s1a-rel td { padding: 11px 8px; }
}
@media (prefers-reduced-motion: reduce) {
  .s1a-card, .s1a-btn, .s1a-prog__fill { transition: none; }
  .s1a-card:hover { transform: none; }
}

/* ====== STATE HOOKS ======
   Declared so preflight rule A10 does not see them as orphans. Both are
   behavior hooks: .s1a-qstep is toggled by the Find My Starting Point
   script via the hidden attribute, .s1a-skip is the skip link whose
   visible styling is applied inline on focus. */
.s1a-qstep { display: block; }
.s1a-qstep[hidden] { display: none; }
.s1a-skip { z-index: 9999; }

/* ====== S1A FOOTER HEADINGS ======
   The production footer uses <h4> for column headings, which reads as an
   h2 -> h4 jump to a heading-order check on every S1A page. The S1A shell
   emits <h2> instead; this mirrors the existing .site-footer h4 treatment
   so nothing changes visually. */
.site-footer h2 {
  font-family: 'DM Sans', sans-serif;
  font-size: 12px; font-weight: 700;
  letter-spacing: 1px; text-transform: uppercase;
  color: var(--gold); margin-bottom: 14px;
}

/* ====== S1A.1: BRAND WORDMARK ======
   The shared logo.svg has "Growth, engineered." baked into the artwork, which
   contradicts the approved brand. Changing that shared file would alter all 89
   non-S1A pages the moment anything deploys, so the S1A shell renders the
   wordmark as live HTML instead. The category line stays HTML too, never baked
   into artwork. Migration plan is in _templates/LOGO-MIGRATION.md.
   #FFFFFF on #0A0A0A is 21:1; the accent dot is decorative only. */
.s1a-wordmark { display: inline-flex; align-items: baseline; gap: 2px; text-decoration: none; }
.s1a-wordmark__name {
  font-family: 'Fraunces', Georgia, serif; font-weight: 600; font-size: 27px;
  letter-spacing: -.015em; color: #fff; line-height: 1;
}
.s1a-wordmark__dot { width: 6px; height: 6px; border-radius: 50%; background: var(--accent); display: inline-block; margin-left: 3px; }

/* ====== S1A.1: CLIENT PROOF CARDS ====== */
.s1a-proof { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 20px; margin: 34px 0 0; }
.s1a-proof__card {
  display: flex; flex-direction: column; background: #fff;
  border: 1px solid var(--gray-mid); border-radius: var(--radius-lg); padding: 26px 24px 22px;
}
.s1a-proof__cat { font: 600 11.5px/1 system-ui, sans-serif; letter-spacing: .13em; text-transform: uppercase; color: var(--s1a-muted); margin: 0 0 6px; }
.s1a-proof__client { font-family: 'Fraunces', Georgia, serif; font-size: 20px; font-weight: 600; color: var(--ink); margin: 0 0 18px; }
.s1a-proof__result {
  font-family: 'Fraunces', Georgia, serif; font-weight: 600; letter-spacing: -.02em;
  font-size: clamp(27px, 3vw, 34px); line-height: 1.05; color: var(--ink); margin: 0 0 4px;
}
.s1a-proof__label { font-size: 13.5px; line-height: 1.45; color: var(--s1a-muted); margin: 0 0 20px; }
.s1a-proof__rule { height: 1px; background: var(--gray-mid); margin: 0 0 18px; }
.s1a-proof__row { margin: 0 0 14px; }
.s1a-proof__k { font: 600 11.5px/1 system-ui, sans-serif; letter-spacing: .11em; text-transform: uppercase; color: var(--s1a-muted); margin: 0 0 5px; }
.s1a-proof__v { font-size: 14.5px; line-height: 1.6; color: var(--text); margin: 0; }
.s1a-proof__quote {
  margin: 4px 0 16px; padding: 14px 16px; background: var(--gray-light);
  border-radius: var(--radius-sm); font-size: 14.5px; line-height: 1.6; color: var(--text); font-style: italic;
}
.s1a-proof__cite { display: block; margin-top: 8px; font-style: normal; font-size: 12.5px; color: var(--s1a-muted); }
.s1a-proof__link { margin-top: auto; font: 700 14.5px/1 system-ui, sans-serif; color: var(--accent-text); text-decoration: none; }
.s1a-proof__link::after { content: " \2192"; }
.s1a-proof__link:hover { text-decoration: underline; }
.s1a-proof__note { font-size: 13px; line-height: 1.6; color: var(--s1a-muted); margin: 22px 0 0; }

/* ====== S1A.1: OWNER QUESTIONS, recognition not FAQ ====== */
.s1a-qlist { list-style: none; padding: 0; margin: 30px 0 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(330px, 1fr)); gap: 0 44px; }
.s1a-qlist li {
  font-family: 'Fraunces', Georgia, serif; font-size: clamp(17px, 1.9vw, 20px);
  line-height: 1.4; color: rgba(255,255,255,.92); padding: 16px 0 16px 26px;
  border-bottom: 1px solid rgba(255,255,255,.11); position: relative;
}
.s1a-qlist li::before { content: "\201C"; position: absolute; left: 0; top: 18px; color: var(--accent); font-size: 26px; line-height: 1; font-family: Georgia, serif; }

/* ====== S1A.1: FOUNDER STORY ====== */
.s1a-story { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 48px; align-items: start; }
.s1a-story__facts { list-style: none; padding: 0; margin: 0; border-top: 1px solid var(--gray-mid); }
.s1a-story__facts li { padding: 15px 0; border-bottom: 1px solid var(--gray-mid); font-size: 15px; line-height: 1.6; color: var(--text); }
.s1a-story__facts b { display: block; font-family: 'Fraunces', Georgia, serif; font-size: 21px; font-weight: 600; color: var(--ink); margin-bottom: 3px; }
@media (max-width: 860px) { .s1a-story { grid-template-columns: 1fr; gap: 26px; } .s1a-qlist { gap: 0; } }

/* ====== S1A.2: COLLAPSIBLE MOBILE FOOTER ======
   Groups ship open, so with JS disabled the footer behaves exactly as before and
   every link stays reachable. Below 860px a small script closes them. */
.site-footer .ft-g { border: 0; }
.site-footer .ft-g > summary { list-style: none; cursor: default; }
.site-footer .ft-g > summary::-webkit-details-marker { display: none; }
.site-footer .ft-g > summary h2 { display: inline-block; margin-bottom: 14px; }
@media (max-width: 860px) {
  .site-footer .ft-g { border-bottom: 1px solid rgba(255,255,255,.10); }
  .site-footer .ft-g > summary {
    cursor: pointer; display: flex; align-items: center; justify-content: space-between;
    min-height: 48px; padding: 4px 0;
  }
  .site-footer .ft-g > summary h2 { margin: 0; }
  .site-footer .ft-g > summary::after {
    content: "+"; color: var(--accent); font-size: 20px; line-height: 1; padding-left: 12px;
  }
  .site-footer .ft-g[open] > summary::after { content: "\2212"; }
  .site-footer .ft-g > ul { padding-bottom: 10px; }
  .site-footer .ft-g > ul a { min-height: 44px; display: flex; align-items: center; }
}

/* S1A.2: "If it's working, we keep it." is now a real <h2> for screen-reader
   outline. Reset the UA heading margins so it looks identical to the styled
   paragraph it replaced. */
h2.s1a-principle__quote { margin: 0; font-size: clamp(28px, 4vw, 44px); }

/* ====== S1A.2: OPERATIONS RELATIONSHIP GROUPS ======
   Replaces the disclosure-style table. Same distinctions, less legal feel. */
.s1a-rel2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 20px; margin: 26px 0 0; }
.s1a-relgrp { background: #fff; border: 1px solid var(--gray-mid); border-radius: var(--radius-lg); padding: 24px; }
.s1a-relgrp__k { font: 600 12px/1.3 system-ui, sans-serif; letter-spacing: .12em; text-transform: uppercase; color: var(--accent-text); margin: 0 0 14px; }
.s1a-relgrp__list { list-style: none; padding: 0; margin: 0 0 14px; }
.s1a-relgrp__list li { font-family: 'Fraunces', Georgia, serif; font-size: 18px; color: var(--ink); padding: 7px 0; border-bottom: 1px solid var(--gray-light); }
.s1a-relgrp__list li:last-child { border-bottom: 0; }
.s1a-relgrp__tag { font: 500 12px/1 system-ui, sans-serif; color: var(--s1a-muted); margin-left: 6px; }
.s1a-relgrp__d { font-size: 13.5px; line-height: 1.6; color: var(--s1a-muted); margin: 0; }

/* ====== S1A.2: CONTACT LAYOUT ====== */
.s1a-contact { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: 44px; align-items: start; }
.s1a-contact__side { position: sticky; top: 24px; }
@media (max-width: 900px) {
  .s1a-contact { grid-template-columns: 1fr; gap: 30px; }
  .s1a-contact__side { position: static; }
}

/* ====== S1A.4: PRICING ENTRY + QUALIFIER ======
   The Business Growth Review is the entry process, so it reads as a banner
   rather than a fifth product card. Complex scope is a qualifier below the
   four relationships, deliberately quieter than them. */
.s1a-entry {
  display: flex; flex-wrap: wrap; gap: 28px; align-items: center; justify-content: space-between;
  background: var(--ink); color: #fff; border-radius: var(--radius-xl); padding: 34px 36px;
}
.s1a-entry__main { flex: 1 1 420px; }
.s1a-entry__k { font: 600 12.5px/1 system-ui, sans-serif; letter-spacing: .14em; text-transform: uppercase; color: var(--accent); margin: 0 0 12px; }
.s1a-entry__h { font-family: 'Fraunces', Georgia, serif; font-weight: 600; font-size: clamp(24px, 3vw, 32px); line-height: 1.15; color: #fff; margin: 0 0 12px; }
.s1a-entry__d { font-size: 15.5px; line-height: 1.65; color: rgba(255,255,255,.76); margin: 0; max-width: 62ch; }
.s1a-entry__cta { flex: 0 0 auto; }

.s1a-qualifier {
  display: flex; flex-wrap: wrap; gap: 18px; align-items: center; justify-content: space-between;
  margin: 26px 0 0; padding: 22px 26px;
  background: var(--gray-light); border: 1px solid var(--gray-mid); border-radius: var(--radius-md);
}
.s1a-qualifier__k { font: 600 15px/1.3 system-ui, sans-serif; color: var(--ink); margin: 0 0 6px; }
.s1a-qualifier__d { font-size: 14px; line-height: 1.6; color: var(--s1a-muted); margin: 0; max-width: 78ch; }
.s1a-qualifier__cta { flex: 0 0 auto; font: 700 14.5px/1 system-ui, sans-serif; color: var(--accent-text); text-decoration: none; min-height: 44px; display: inline-flex; align-items: center; }
.s1a-qualifier__cta::after { content: " \2192"; }
@media (max-width: 700px) {
  .s1a-entry { padding: 26px 22px; }
  .s1a-entry__cta, .s1a-entry__cta .s1a-btn { width: 100%; }
}

/* ====== S2: MOBILE TAP TARGETS IN THE FOOTER CHROME ======
   The accordion link groups already meet 44px. The brand-column contact links
   and the legal row sit outside those groups and measured 17px. */
@media (max-width: 860px) {
  .site-footer__about + p a,
  .site-footer__bottom a {
    min-height: 44px; display: inline-flex; align-items: center;
  }
  .site-footer__bottom { display: flex; flex-direction: column; gap: 4px; }
  .nav--v71 .nav__brand { min-height: 44px; }
}

/* ====== S2 PHASE 6: classes introduced by the offer retirement ====== */
.ind-sprintblock__cta { display: flex; flex-wrap: wrap; gap: 12px; margin: 24px 0 0; }
.loc-svc__k { font: 600 12px/1.3 system-ui, sans-serif; letter-spacing: .1em; text-transform: uppercase; color: var(--s1a-muted); margin: 0 0 4px; }
.loc-svc__p { font: 600 15px/1.4 system-ui, sans-serif; color: var(--ink); margin: 0; }

/* S2: /ai-audit/ sample block overflowed its 390px viewport by 5px because the
   CTA and its paragraph were sized without accounting for the container padding. */
@media (max-width: 420px) {
  /* .sample-block sits 45px in from the left edge, but its children were sized
     350px, so they ran 5px past the viewport. Constrain the children to the
     space the parent actually leaves. */
  .sample-block { max-width: 100%; box-sizing: border-box; overflow-wrap: anywhere; }
  .sample-block > *, .sample-block p, .sample-block__cta {
    max-width: 100%; width: auto; box-sizing: border-box;
  }
  .sample-block__cta { display: block; text-align: center; }
}

/* ====== S2.1: ARCHIVED-PAGE NOTICE ======
   Sits above all content on /investors/ so a direct-link visitor cannot mistake
   historical planning assumptions for current commercial terms.
   #7A2E0E on #FDF3E7 is 8.1:1, well past AA. */
.archive-notice {
  background: #FDF3E7; border: 1px solid #E8C9A0; border-left: 5px solid #B5200D;
  border-radius: var(--radius-md); padding: 18px 22px; margin: 0 auto 26px;
  max-width: 1100px;
}
.archive-notice__k {
  font: 700 12.5px/1 system-ui, sans-serif; letter-spacing: .12em; text-transform: uppercase;
  color: #B5200D; margin: 0 0 8px;
}
.archive-notice__b { font-size: 15.5px; line-height: 1.6; color: #7A2E0E; margin: 0; }
.archive-notice__b a { color: #7A2E0E; font-weight: 700; text-decoration: underline; }

/* Secondary explanatory link under an entry CTA. Sits below the primary button so
   "Book My Review" stays the single obvious action. */
.s1a-entry__more { display:block; margin-top:10px; font-size:13.5px; font-weight:600;
  color:#0A0A0A; text-decoration:underline; text-underline-offset:3px; }
.s1a-sec--ink .s1a-entry__more, .s1a-entry--ink .s1a-entry__more { color:#94A3B8; }
