/* homepage hero */
.ba4xq-hero {
  padding: var(--sp-96) 0 var(--sp-80);
  background: var(--col-ink);
  color: var(--col-white);
  position: relative;
  overflow: hidden;
}

.ba4xq-hero::after {
  content: '';
  position: absolute;
  top: 0; right: 0;
  width: 40%;
  height: 100%;
  background: rgba(244,163,0,.04);
  clip-path: polygon(20% 0%, 100% 0%, 100% 100%, 0% 100%);
  pointer-events: none;
}

.ba4xq-hero-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: var(--sp-8);
  margin-bottom: var(--sp-24);
}

.ba4xq-hero-dot {
  width: 8px;
  height: 8px;
  background: var(--col-amber);
  border-radius: 50%;
  animation: pulse-amber 2s ease-in-out infinite;
}

.ba4xq-hero-eyebrow span {
  font-family: var(--font-display);
  font-size: var(--text-xs);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgba(255,255,255,.55);
  font-weight: 700;
}

.ba4xq-hero h1 {
  font-size: var(--text-5xl);
  color: var(--col-white);
  max-width: 820px;
  margin-bottom: var(--sp-24);
  line-height: 1.05;
}

.ba4xq-hero h1 em {
  font-style: normal;
  color: var(--col-amber);
}

.ba4xq-hero-sub {
  font-size: var(--text-md);
  color: rgba(255,255,255,.65);
  max-width: 560px;
  margin-bottom: var(--sp-40);
  line-height: 1.7;
}

.ba4xq-hero-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--sp-16);
  margin-bottom: var(--sp-64);
}

.ba4xq-hero-actions .note {
  font-size: var(--text-xs);
  color: rgba(255,255,255,.4);
  font-family: var(--font-display);
  letter-spacing: 0.04em;
}

.ba4xq-hero-logos {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--sp-32);
  padding-top: var(--sp-32);
  border-top: 1px solid rgba(255,255,255,.1);
}

.ba4xq-hero-logos span {
  font-size: var(--text-xs);
  color: rgba(255,255,255,.35);
  font-family: var(--font-display);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-weight: 700;
}

.ba4xq-hero-logos .logo-pill {
  padding: var(--sp-8) var(--sp-16);
  border: 1px solid rgba(255,255,255,.15);
  border-radius: var(--r-pill);
  font-size: var(--text-xs);
  color: rgba(255,255,255,.55);
  font-family: var(--font-display);
  letter-spacing: 0.06em;
  font-weight: 600;
}

/* homepage problem selector section */
.ba4xq-selector-layout {
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-48);
  align-items: flex-start;
}

.ba4xq-selector-copy {
  flex: 1 1 280px;
  max-width: 340px;
}

.ba4xq-selector-copy h2 { margin-bottom: var(--sp-16); }
.ba4xq-selector-copy p { color: var(--col-muted); font-size: var(--text-base); }

.ba4xq-selector-widget { flex: 1 1 400px; }

/* counters section */
.ba4xq-counters-section { background: var(--col-white); }

/* how it works */
.ba4xq-process-layout {
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-64);
  align-items: flex-start;
}

.ba4xq-process-copy {
  flex: 1 1 260px;
  max-width: 300px;
  position: sticky;
  top: calc(var(--header-h) + var(--sp-32));
}

.ba4xq-process-steps { flex: 2 1 360px; }

/* testimonials */
.ba4xq-testimonials-section { background: var(--col-white); }

/* homepage blog preview */
.ba4xq-field-notes-section {}

/* page hero generic */
.ba4xq-page-hero {
  background: var(--col-ink);
  color: var(--col-white);
  padding: var(--sp-64) 0;
}

.ba4xq-page-hero .ba4xq-label { color: rgba(255,255,255,.4); margin-bottom: var(--sp-16); }
.ba4xq-page-hero h1 { color: var(--col-white); max-width: 640px; margin-bottom: var(--sp-16); }
.ba4xq-page-hero .sub { color: rgba(255,255,255,.65); font-size: var(--text-md); max-width: 520px; }

/* what we do page */
.ba4xq-services-section {}

.ba4xq-services-cta {
  background: var(--col-surface);
  border-top: 1px solid var(--col-rule);
  padding: var(--sp-64) 0;
  text-align: center;
}
.ba4xq-services-cta h2 { margin-bottom: var(--sp-16); }
.ba4xq-services-cta p { color: var(--col-muted); margin: 0 auto var(--sp-32); }

/* how it works page */
.ba4xq-howto-hero-detail {
  font-size: var(--text-sm);
  color: rgba(255,255,255,.5);
  margin-top: var(--sp-24);
  font-style: italic;
}

/* about / our story */
.ba4xq-story-section {}

.ba4xq-story-founders {
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-32);
  margin-top: var(--sp-48);
}

.ba4xq-founder-card {
  flex: 1 1 260px;
  border: 1px solid var(--col-rule);
  border-radius: var(--r-md);
  padding: var(--sp-32);
  background: var(--col-white);
}

.ba4xq-founder-card h3 { font-size: var(--text-lg); margin-bottom: var(--sp-4); }
.ba4xq-founder-card .role {
  font-size: var(--text-xs);
  font-family: var(--font-display);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--col-amber-dim);
  font-weight: 700;
  margin-bottom: var(--sp-16);
  display: block;
}
.ba4xq-founder-card p {
  font-size: var(--text-sm);
  color: var(--col-muted);
  line-height: 1.7;
  margin-bottom: 0;
}

.ba4xq-team-section {
  background: var(--col-white);
}

.ba4xq-values-list {
  display: flex;
  flex-direction: column;
  gap: 1px;
  background: var(--col-rule);
  border: 1px solid var(--col-rule);
  border-radius: var(--r-md);
  overflow: hidden;
}

.ba4xq-value-item {
  background: var(--col-white);
  padding: var(--sp-24) var(--sp-32);
  display: flex;
  gap: var(--sp-24);
  align-items: flex-start;
}

.ba4xq-value-num {
  font-family: var(--font-display);
  font-size: var(--text-xl);
  font-weight: 700;
  color: var(--col-amber);
  flex-shrink: 0;
  line-height: 1.3;
}

.ba4xq-value-item h4 { margin-bottom: var(--sp-4); }
.ba4xq-value-item p {
  font-size: var(--text-sm);
  color: var(--col-muted);
  margin-bottom: 0;
}

/* contact / get in touch */
.ba4xq-contact-layout {
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-64);
  align-items: flex-start;
}

.ba4xq-contact-info { flex: 1 1 240px; max-width: 320px; }
.ba4xq-contact-info h2 { margin-bottom: var(--sp-16); }
.ba4xq-contact-info p { color: var(--col-muted); margin-bottom: var(--sp-32); }

.ba4xq-contact-detail {
  display: flex;
  flex-direction: column;
  gap: var(--sp-16);
  margin-bottom: var(--sp-32);
}

.ba4xq-contact-item {
  display: flex;
  gap: var(--sp-12);
  align-items: flex-start;
}

.ba4xq-contact-item svg { flex-shrink: 0; margin-top: 2px; }
.ba4xq-contact-item .detail-label {
  font-size: var(--text-xs);
  font-family: var(--font-display);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--col-muted);
  display: block;
  margin-bottom: var(--sp-2);
}
.ba4xq-contact-item .detail-val {
  font-size: var(--text-sm);
  color: var(--col-ink);
}

.ba4xq-contact-form-wrap { flex: 1 1 400px; }

/* field notes hub */
.ba4xq-hub-grid {
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-32);
}
.ba4xq-hub-grid .ba4xq-card-link { flex: 1 1 280px; }

/* article / post page */
.ba4xq-article-layout {
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-64);
  align-items: flex-start;
}

.ba4xq-article-main { flex: 3 1 480px; }
.ba4xq-article-sidebar { flex: 1 1 220px; position: sticky; top: calc(var(--header-h) + var(--sp-32)); }

.ba4xq-article-hero-img {
  width: 100%;
  aspect-ratio: 16/9;
  object-fit: cover;
  border-radius: var(--r-md);
  margin-bottom: var(--sp-40);
  background: var(--col-rule);
}

.ba4xq-article-meta {
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-16);
  align-items: center;
  margin-bottom: var(--sp-32);
}

.ba4xq-article-body {
  font-size: var(--text-md);
  line-height: 1.8;
  color: var(--col-ink);
}

.ba4xq-article-body h2 {
  font-size: var(--text-xl);
  margin-top: var(--sp-48);
  margin-bottom: var(--sp-16);
}

.ba4xq-article-body h3 {
  font-size: var(--text-lg);
  margin-top: var(--sp-32);
  margin-bottom: var(--sp-12);
}

.ba4xq-article-body p { margin-bottom: var(--sp-24); max-width: var(--max-w-text); }

.ba4xq-article-body ul,
.ba4xq-article-body ol {
  margin-bottom: var(--sp-24);
  padding-left: var(--sp-24);
  display: flex;
  flex-direction: column;
  gap: var(--sp-8);
}

.ba4xq-article-body ul li { list-style: disc; }
.ba4xq-article-body ol li { list-style: decimal; }
.ba4xq-article-body li { font-size: var(--text-md); max-width: var(--max-w-text); }

/* TOC sidebar */
.ba4xq-toc {
  background: var(--col-white);
  border: 1px solid var(--col-rule);
  border-radius: var(--r-md);
  padding: var(--sp-24);
}

.ba4xq-toc h4 {
  font-size: var(--text-xs);
  font-family: var(--font-display);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--col-muted);
  margin-bottom: var(--sp-16);
  font-weight: 700;
}

.ba4xq-toc ol {
  display: flex;
  flex-direction: column;
  gap: var(--sp-8);
}

.ba4xq-toc ol li {
  counter-increment: toc;
  display: flex;
  gap: var(--sp-8);
}

.ba4xq-toc ol li::before {
  content: counter(toc, decimal-leading-zero);
  font-family: var(--font-display);
  font-size: var(--text-xs);
  color: var(--col-rule);
  font-weight: 700;
  flex-shrink: 0;
  margin-top: 2px;
}

.ba4xq-toc a {
  font-size: var(--text-sm);
  color: var(--col-muted);
  transition: color var(--t-fast);
  line-height: 1.4;
}

.ba4xq-toc a:hover,
.ba4xq-toc a.active { color: var(--col-amber-dim); }

/* legal pages */
.ba4xq-legal-body {
  max-width: var(--max-w-text);
  margin: 0 auto;
  padding: var(--sp-64) 0;
}

.ba4xq-legal-body h2 {
  font-size: var(--text-xl);
  margin-top: var(--sp-48);
  margin-bottom: var(--sp-12);
}

.ba4xq-legal-body p { margin-bottom: var(--sp-16); color: var(--col-muted); }
.ba4xq-legal-body p:first-of-type { color: var(--col-ink); }

.ba4xq-legal-body ul {
  margin-bottom: var(--sp-16);
  padding-left: var(--sp-24);
  display: flex;
  flex-direction: column;
  gap: var(--sp-8);
}

.ba4xq-legal-body ul li { list-style: disc; font-size: var(--text-base); color: var(--col-muted); }

/* thank you page */
.ba4xq-thankyou {
  min-height: calc(100vh - var(--header-h));
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.ba4xq-thankyou-inner { max-width: 520px; margin: 0 auto; }

.ba4xq-thankyou-icon {
  width: 64px;
  height: 64px;
  background: rgba(244,163,0,.12);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto var(--sp-24);
}

.ba4xq-thankyou h1 { font-size: var(--text-2xl); margin-bottom: var(--sp-16); }
.ba4xq-thankyou p { color: var(--col-muted); margin-bottom: var(--sp-32); margin-left: auto; margin-right: auto; }

.ba4xq-thankyou-links {
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-16);
  justify-content: center;
}

/* responsive layout overrides */
@media (max-width: 1024px) {
  .ba4xq-hero h1 { font-size: var(--text-3xl); }
  .ba4xq-process-copy { position: static; }
  .ba4xq-article-sidebar { display: none; }
}

@media (max-width: 640px) {
  .ba4xq-hero { padding: var(--sp-64) 0; }
  .ba4xq-hero h1 { font-size: var(--text-2xl); }
  .ba4xq-selector-copy { max-width: 100%; }
  .ba4xq-contact-info { max-width: 100%; }
  .ba4xq-step { flex-direction: column; gap: var(--sp-12); }
  .ba4xq-step-num { width: auto; font-size: var(--text-2xl); }
  .ba4xq-service-label { flex: 0 0 100%; }
}