/* ============================================================
   Tribunal → Slot B — Chris Weaver Construction
   All selectors scoped to [data-design="b"]
   Keyframes: tb-* prefix retained per design contract
   ============================================================ */

/* ── Design token exposure ────────────────────────────────── */
[data-design="b"] {
  --design-b-primary: #F5E600;

  /* Tribunal color tokens */
  --tb-ink:        #0E0E0C;
  --tb-ink-soft:   #1A1A18;
  --tb-bone:       #F4F2EC;
  --tb-bone-soft:  #E6E2D7;
  --tb-mute:       #7A766C;
  --tb-signal:     #F5E600;
  --tb-signal-deep:#C9BC00;
  --tb-blood:      #C8201E;
  --tb-rule:       rgba(244,242,236,.22);
  --tb-rule-bone:  rgba(14,14,12,.22);

  /* Tribunal spacing */
  --tb-hair:    1px;
  --tb-tight:   4px;
  --tb-snug:    8px;
  --tb-margin:  16px;
  --tb-gutter:  24px;
  --tb-bay:     40px;
  --tb-stanza:  64px;
  --tb-chapter: 96px;
  --tb-folio:   144px;

  /* Tribunal motion */
  --tb-ease-hard:   cubic-bezier(.6,0,.4,1);
  --tb-ease-march:  linear;
  --tb-ease-settle: cubic-bezier(.2,.7,.3,1);
  --tb-d-snap:      120ms;
  --tb-d-press:     100ms;
  --tb-d-register:  200ms;
  --tb-d-settle:    400ms;

  /* Tribunal typography */
  --tb-sans:   "Inter", system-ui, sans-serif;
  --tb-display:"Archivo Black", "Inter Display", system-ui, sans-serif;
  --tb-mono:   "JetBrains Mono", "Fira Mono", monospace;

  /* Tribunal radius */
  --tb-r-0: 0;
  --tb-r-1: 2px;
}

/* ── Layout containment (h-scroll guard) ──────────────────── */
[data-design="b"].dq-design,
[data-design="b"] .dq-design {
  max-width: 100%;
  overflow-x: clip;
}
[data-design="b"].dq-design * { min-width: 0; }
[data-design="b"].dq-design img,
[data-design="b"].dq-design svg:not([data-keep-size]) {
  max-width: 100%;
  height: auto;
}

/* ── Google Fonts (display only in slice context; assembler provides) ─ */
@import url('https://fonts.googleapis.com/css2?family=Archivo+Black&family=Inter:wght@400;500;700&family=JetBrains+Mono:wght@400;500&display=swap');

/* ── Base ─────────────────────────────────────────────────── */
[data-design="b"].dq-design {
  font-family: var(--tb-sans);
  background: var(--tb-ink);
  color: var(--tb-bone);
  -webkit-font-smoothing: antialiased;
}

/* ── E1: HEADER ───────────────────────────────────────────── */
[data-design="b"] .tb-header {
  position: sticky; top: 0; z-index: 40;
  background: var(--tb-ink);
  border-bottom: 1px solid var(--tb-rule);
  isolation: isolate;
}
[data-design="b"] .tb-header__marquee {
  position: absolute; left: 0; right: 0; bottom: -1px; height: 3px;
  overflow: hidden;
}
[data-design="b"] .tb-header__marquee::after {
  content: ""; position: absolute; top: 0; bottom: 0;
  width: 240px; left: 0;
  background: linear-gradient(90deg, transparent, var(--tb-signal) 40%, var(--tb-signal) 60%, transparent);
  transform: translateX(-240px);
  animation: tb-header-marquee 27s var(--tb-ease-march) infinite;
}
@keyframes tb-header-marquee {
  0%   { transform: translateX(-240px); }
  85%  { transform: translateX(calc(100vw + 240px)); }
  100% { transform: translateX(calc(100vw + 240px)); }
}
[data-design="b"] .tb-header__bar {
  position: relative; z-index: 2;
  display: flex; align-items: center; justify-content: space-between;
  padding: 20px clamp(20px,4vw,56px);
  max-width: 1480px; margin: 0 auto;
}
[data-design="b"] .tb-logo {
  text-decoration: none; color: var(--tb-bone);
  display: inline-flex; align-items: baseline; gap: 16px;
  white-space: nowrap; overflow: hidden;
}
[data-design="b"] .tb-logo__mark {
  font-family: var(--tb-display); font-weight: 400;
  font-size: clamp(16px,2vw,22px); letter-spacing: -.01em; text-transform: uppercase;
}
[data-design="b"] .tb-logo__kind {
  font-family: var(--tb-mono); font-size: 10.5px; letter-spacing: .28em;
  color: var(--tb-mute); text-transform: uppercase;
}
@media (max-width: 560px) { [data-design="b"] .tb-logo__kind { display: none; } }

[data-design="b"] .tb-menu-btn {
  appearance: none; background: var(--tb-bone); color: var(--tb-ink); border: 0;
  display: inline-flex; align-items: center; gap: 10px;
  padding: 0 18px; height: 44px; min-width: 44px; cursor: pointer;
  font-family: var(--tb-sans); font-size: 12px; font-weight: 700;
  letter-spacing: .18em; text-transform: uppercase;
  transition: background var(--tb-d-snap) var(--tb-ease-hard),
              color var(--tb-d-snap) var(--tb-ease-hard);
  flex-shrink: 0;
}
[data-design="b"] .tb-menu-btn:hover { background: var(--tb-signal); color: var(--tb-ink); }
[data-design="b"] .tb-menu-btn:focus-visible { outline: 2px solid var(--tb-signal); outline-offset: 3px; }
[data-design="b"] .tb-menu-btn__mark {
  width: 12px; height: 12px; background: var(--tb-signal); display: inline-block; flex-shrink: 0;
}
[data-design="b"] .tb-menu-btn:hover .tb-menu-btn__mark { background: var(--tb-ink); }

/* Drawer */
[data-design="b"] .tb-drawer {
  position: fixed; inset: 0; z-index: 35; background: var(--tb-ink);
  transform: translateY(-100%);
  transition: transform var(--tb-d-settle) var(--tb-ease-hard);
  padding-top: 92px; overflow-y: auto;
}
[data-design="b"] .tb-drawer[data-open="true"] { transform: translateY(0); }
[data-design="b"] .tb-drawer__inner {
  max-width: 1480px; margin: 0 auto;
  padding: clamp(32px,5vw,72px) clamp(20px,4vw,56px);
  display: grid; gap: 4px;
}
[data-design="b"] .tb-drawer a {
  display: grid; grid-template-columns: 80px 1fr; gap: 24px; align-items: baseline;
  padding: 20px 0; color: var(--tb-bone); text-decoration: none;
  border-bottom: 1px solid var(--tb-rule); position: relative;
  font-family: var(--tb-display); font-size: clamp(32px,5.5vw,64px);
  text-transform: uppercase; letter-spacing: -.02em; line-height: 1;
}
[data-design="b"] .tb-drawer a::before {
  content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 100%;
  background: var(--tb-signal);
  clip-path: inset(0 100% 0 0);
  transition: clip-path var(--tb-d-snap) var(--tb-ease-hard); z-index: -1;
}
[data-design="b"] .tb-drawer a:hover { color: var(--tb-ink); }
[data-design="b"] .tb-drawer a:hover::before { clip-path: inset(0 0 0 0); }
@media (hover: hover) and (pointer: fine) {
  [data-design="b"] .tb-drawer a:hover .tb-drawer__num,
  [data-design="b"] .tb-drawer a:hover .tb-drawer__label { transform: translateX(24px); }
}
[data-design="b"] .tb-drawer__num,
[data-design="b"] .tb-drawer__label {
  transition: transform var(--tb-d-snap) var(--tb-ease-hard);
}
[data-design="b"] .tb-drawer__num {
  font-family: var(--tb-mono); font-size: 14px; color: var(--tb-mute);
}

/* ── E3: HERO — Ken-Burns ambient substrate ───────────────── */
[data-design="b"] .tb-hero {
  position: relative; isolation: isolate; overflow: hidden;
  background: var(--tb-ink); color: var(--tb-bone);
  padding: clamp(64px,9vw,128px) clamp(20px,4vw,56px) clamp(96px,12vw,160px);
  border-bottom: 1px solid var(--tb-rule);
  min-height: 60vh;
}

/* Ken-Burns animated backdrop — real portfolio photo as hero substrate */
[data-design="b"] .tb-hero__kenburns {
  position: absolute; inset: 0; z-index: 0; overflow: hidden;
}
[data-design="b"] .tb-hero__kb-img {
  position: absolute; inset: -8%; /* extra room for Ken-Burns travel */
  background-image: url('https://chrisweaverconstruction.weebly.com/uploads/2/2/3/5/2235861/2948297.jpg');
  background-size: cover; background-position: center;
  animation: tb-kenburns 14s var(--tb-ease-march) infinite alternate;
  will-change: transform;
}
@keyframes tb-kenburns {
  0%   { transform: scale(1.06) translate(0%, 0%); }
  50%  { transform: scale(1.10) translate(-2%, 1%); }
  100% { transform: scale(1.06) translate(2%, -1%); }
}
[data-design="b"] .tb-hero__kb-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(
    135deg,
    rgba(14,14,12,0.88) 0%,
    rgba(14,14,12,0.72) 50%,
    rgba(14,14,12,0.55) 100%
  );
}

/* Traversing signal rule (ambient marker atop photo) */
[data-design="b"] .tb-hero__rule {
  position: absolute; left: 0; right: 0; top: 38%; height: 2px; z-index: 1;
  overflow: hidden;
}
[data-design="b"] .tb-hero__rule::after {
  content: ""; position: absolute; top: 0; bottom: 0;
  width: 320px; left: 0;
  background: linear-gradient(90deg, transparent, var(--tb-signal) 40%, var(--tb-signal) 60%, transparent);
  transform: translateX(-320px);
  animation: tb-hero-rule 27s var(--tb-ease-march) infinite;
}
@keyframes tb-hero-rule {
  0%   { transform: translateX(-320px); }
  70%  { transform: translateX(calc(100vw + 320px)); }
  100% { transform: translateX(calc(100vw + 320px)); }
}

[data-design="b"] .tb-hero__inner {
  position: relative; z-index: 2;
  max-width: 1480px; margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0,1fr) minmax(0,320px);
  gap: clamp(40px,6vw,96px);
  align-items: end;
}
@media (max-width: 880px) {
  [data-design="b"] .tb-hero__inner { grid-template-columns: 1fr; }
}

[data-design="b"] .tb-eyebrow {
  font-family: var(--tb-mono); font-size: 11px; letter-spacing: .28em;
  color: var(--tb-mute); text-transform: uppercase;
  display: inline-flex; align-items: center; gap: 12px;
  margin-bottom: var(--tb-bay);
}
[data-design="b"] .tb-eyebrow__sq {
  width: 10px; height: 10px; background: var(--tb-signal); display: inline-block; flex-shrink: 0;
}

[data-design="b"] .tb-hero__title {
  font-family: var(--tb-display); font-weight: 400;
  font-size: clamp(64px,10vw,140px); line-height: .92; letter-spacing: -.04em;
  margin: 0 0 var(--tb-stanza); text-transform: uppercase;
  max-width: 10ch;
}
[data-design="b"] .tb-hero__title em { color: var(--tb-signal); font-style: normal; }

[data-design="b"] .tb-hero__lede {
  font-family: var(--tb-sans); font-size: clamp(17px,1.4vw,20px); line-height: 1.55;
  color: var(--tb-bone-soft); margin: 0 0 var(--tb-stanza); max-width: 52ch; font-weight: 400;
}

[data-design="b"] .tb-hero__actions {
  display: flex; flex-wrap: wrap; gap: 18px; align-items: center;
}
[data-design="b"] .tb-hero__meta {
  font-family: var(--tb-mono); font-size: 11px; letter-spacing: .18em;
  color: var(--tb-bone-soft); text-transform: uppercase;
  padding-left: 18px; border-left: 1px solid var(--tb-rule); line-height: 1.8;
}

/* Hero docket (project specialties panel) */
[data-design="b"] .tb-hero__docket {
  border: 1px solid var(--tb-rule); padding: 24px;
  background: rgba(14,14,12,0.6);
}
[data-design="b"] .tb-hero__docket-label {
  font-family: var(--tb-display); font-size: 13px; letter-spacing: .12em;
  text-transform: uppercase; margin-bottom: 18px; padding-bottom: 12px;
  border-bottom: 1px solid var(--tb-rule);
}
[data-design="b"] .tb-hero__docket-row {
  display: grid; grid-template-columns: 56px 1fr auto; gap: 12px;
  padding: 12px 0; border-bottom: 1px solid var(--tb-rule);
  font-family: var(--tb-mono); font-size: 10.5px; letter-spacing: .12em;
  text-transform: uppercase; color: var(--tb-bone-soft);
  align-items: baseline;
}
[data-design="b"] .tb-hero__docket-row:last-child { border-bottom: 0; }
[data-design="b"] .tb-hero__docket-num { color: var(--tb-signal); }
[data-design="b"] .tb-hero__docket-status { color: var(--tb-mute); font-size: 9.5px; white-space: nowrap; }

/* ── E2: CTA ──────────────────────────────────────────────── */
[data-design="b"] .tb-cta {
  position: relative; display: inline-flex; align-items: center; gap: 14px;
  padding: 18px 28px 21px;
  background: var(--tb-bone); color: var(--tb-ink);
  font-family: var(--tb-sans); font-size: 13px; font-weight: 700; letter-spacing: .22em;
  text-transform: uppercase; text-decoration: none; cursor: pointer; border: 0;
  transition: transform var(--tb-d-press) var(--tb-ease-hard),
              background var(--tb-d-snap) var(--tb-ease-hard);
  min-height: 44px; min-width: 44px;
}
[data-design="b"] .tb-cta__arrow {
  font-size: 10px; line-height: 1; color: var(--tb-ink);
  transition: transform var(--tb-d-snap) var(--tb-ease-hard);
}
[data-design="b"] .tb-cta__rule {
  position: absolute; left: 0; right: 0; bottom: 0; height: 3px;
  background: var(--tb-signal); overflow: hidden;
}
[data-design="b"] .tb-cta__rule::after {
  content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 60px;
  background: var(--tb-ink);
  animation: tb-cta-march 4.4s var(--tb-ease-march) infinite;
}
[data-design="b"] .tb-cta:hover { background: var(--tb-signal); }
@media (hover: hover) and (pointer: fine) {
  [data-design="b"] .tb-cta:hover .tb-cta__arrow { transform: translateX(4px); }
}
[data-design="b"] .tb-cta:active { transform: translateY(1px); }
[data-design="b"] .tb-cta:focus-visible { outline: 2px solid var(--tb-signal); outline-offset: 3px; }
@keyframes tb-cta-march {
  0%   { transform: translateX(-100%); }
  100% { transform: translateX(calc(100vw)); }
}
/* Dark/ink variant */
[data-design="b"] .tb-cta--ink { background: var(--tb-ink); color: var(--tb-bone); border: 1px solid var(--tb-rule); }
[data-design="b"] .tb-cta--ink .tb-cta__arrow { color: var(--tb-signal); }
[data-design="b"] .tb-cta--ink:hover { background: var(--tb-ink-soft); }

/* ── E6: POINTER ──────────────────────────────────────────── */
[data-design="b"] .tb-pointer {
  position: relative; z-index: 5;
  background: var(--tb-ink);
  padding: 48px clamp(20px,4vw,56px) 48px;
  display: flex; justify-content: flex-start;
  pointer-events: none;
}
[data-design="b"] .tb-pointer__inner {
  display: flex; flex-direction: column; align-items: flex-start; gap: 14px;
  pointer-events: auto;
}
[data-design="b"] .tb-pointer__label {
  font-family: var(--tb-mono); font-size: 11px; letter-spacing: .28em;
  color: var(--tb-bone-soft); text-transform: uppercase;
  opacity: 1;
  animation: tb-pointer-label-in 200ms 1600ms var(--tb-ease-hard) both;
}
[data-design="b"] .tb-pointer__bar {
  position: relative; width: 6px; height: 120px;
  background: var(--tb-signal);
  opacity: 1; transform-origin: top center;
  animation: tb-pointer-snap 120ms 1400ms var(--tb-ease-hard) both;
}
[data-design="b"] .tb-pointer__tick {
  position: absolute; left: 0; right: 0; top: 0; height: 12px;
  background: var(--tb-ink);
  animation: tb-pointer-tick 4.4s 2000ms var(--tb-ease-march) infinite;
}
/* Use 'both' fill-mode so bar is visible at first paint (opacity:1 at end-state) */
@keyframes tb-pointer-label-in {
  from { opacity: 0; }
  to   { opacity: 1; }
}
@keyframes tb-pointer-snap {
  from { opacity: 1; transform: scaleY(0); }
  to   { opacity: 1; transform: scaleY(1); }
}
@keyframes tb-pointer-tick {
  0%   { transform: translateY(0); }
  100% { transform: translateY(calc(120px - 12px)); }
}

/* ── E5: FUNNEL ───────────────────────────────────────────── */
[data-design="b"] .tb-funnel-section {
  background: var(--tb-ink); color: var(--tb-bone);
  padding: clamp(80px,11vw,144px) clamp(20px,4vw,56px);
  border-bottom: 1px solid var(--tb-rule);
}
[data-design="b"] .tb-funnel-section__head {
  max-width: 760px; margin: 0 auto var(--tb-stanza); text-align: left;
}
[data-design="b"] .tb-funnel-section__head h2 {
  font-family: var(--tb-display); font-weight: 400;
  font-size: clamp(40px,6vw,72px); line-height: .94; letter-spacing: -.03em;
  margin: 0 0 16px; text-transform: uppercase;
}
[data-design="b"] .tb-funnel-section__head h2 em { color: var(--tb-signal); font-style: normal; }
[data-design="b"] .tb-funnel-section__head p {
  font-family: var(--tb-sans); font-size: 17px; color: var(--tb-bone-soft); margin: 0; max-width: 50ch;
}
[data-design="b"] .tb-funnel {
  max-width: 720px; margin: 0 auto;
  background: var(--tb-bone); color: var(--tb-ink);
  box-shadow: 3px 3px 0 var(--tb-signal), 6px 6px 0 var(--tb-ink-soft);
}
[data-design="b"] .tb-funnel__progress {
  display: flex; align-items: center; gap: 24px; padding: 18px 28px;
  border-bottom: 1px solid var(--tb-rule-bone);
}
[data-design="b"] .tb-funnel__progress-num {
  font-family: var(--tb-mono); font-size: 11px; letter-spacing: .22em;
  color: var(--tb-mute); text-transform: uppercase;
}
[data-design="b"] .tb-funnel__progress-blocks {
  display: inline-flex; gap: 4px; flex: 1; max-width: 220px;
}
[data-design="b"] .tb-funnel__progress-blocks span {
  flex: 1; height: 6px; background: rgba(14,14,12,.12);
  transition: background 100ms var(--tb-ease-hard);
}
[data-design="b"] .tb-funnel__progress-blocks span.tb-on { background: var(--tb-signal); }
[data-design="b"] .tb-funnel__steps {
  position: relative; padding: clamp(28px,5vw,56px); min-height: 460px; overflow: hidden;
}
[data-design="b"] .tb-funnel__step {
  position: absolute; inset: clamp(28px,5vw,56px);
  opacity: 0; pointer-events: none; transform: translateX(12px);
  transition: opacity 200ms var(--tb-ease-hard), transform 100ms var(--tb-ease-hard);
  border: 0; background: transparent; padding: 0; margin: 0;
}
[data-design="b"] .tb-funnel__step[data-active="true"] {
  opacity: 1; pointer-events: auto; transform: translateX(0);
}
[data-design="b"] .tb-funnel__legend {
  display: contents;
}
[data-design="b"] .tb-funnel__step h3 {
  font-family: var(--tb-display); font-weight: 400;
  font-size: clamp(26px,3.4vw,36px); line-height: 1.0; letter-spacing: -.02em;
  margin: 0 0 8px; text-transform: uppercase;
}
[data-design="b"] .tb-funnel__step p {
  font-family: var(--tb-sans); font-size: 15px; color: var(--tb-ink-soft); margin: 0 0 24px;
}
[data-design="b"] .tb-funnel__options { display: grid; gap: 0; border: 1px solid var(--tb-ink); }
[data-design="b"] .tb-opt {
  appearance: none; background: transparent; color: var(--tb-ink);
  border: 0; border-bottom: 1px solid var(--tb-rule-bone);
  padding: 16px 20px; text-align: left;
  font-family: var(--tb-sans); font-size: 15px; font-weight: 500;
  display: grid; grid-template-columns: 50px 1fr; align-items: baseline; gap: 14px;
  cursor: pointer; transition: background var(--tb-d-snap) var(--tb-ease-hard);
  min-height: 44px;
}
[data-design="b"] .tb-opt:last-child { border-bottom: 0; }
[data-design="b"] .tb-opt:hover { background: var(--tb-signal); }
[data-design="b"] .tb-opt:focus-visible { outline: 2px solid var(--tb-signal); outline-offset: -2px; }
[data-design="b"] .tb-opt__num {
  font-family: var(--tb-mono); font-size: 11px; letter-spacing: .14em;
  color: var(--tb-mute); text-transform: uppercase;
}
[data-design="b"] .tb-opt:hover .tb-opt__num { color: var(--tb-ink); }

/* Contact step fields */
[data-design="b"] .tb-funnel__field { display: grid; gap: 6px; margin-bottom: 16px; }
[data-design="b"] .tb-funnel__field label {
  font-family: var(--tb-mono); font-size: 10.5px; letter-spacing: .22em;
  color: var(--tb-mute); text-transform: uppercase;
}
[data-design="b"] .tb-funnel__field input,
[data-design="b"] .tb-funnel__field textarea {
  background: transparent; color: var(--tb-ink); border: 0;
  border-bottom: 1px solid var(--tb-ink);
  padding: 10px 0; font-family: var(--tb-sans); font-size: 16px; outline: none;
  transition: border-color var(--tb-d-snap) var(--tb-ease-hard);
  width: 100%;
}
[data-design="b"] .tb-funnel__field input:focus,
[data-design="b"] .tb-funnel__field textarea:focus {
  border-bottom-width: 2px; border-color: var(--tb-signal);
}
[data-design="b"] .tb-funnel__actions {
  display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 24px;
  flex-wrap: wrap;
}
[data-design="b"] .tb-funnel__back {
  appearance: none; background: transparent; border: 0; color: var(--tb-mute);
  font-family: var(--tb-sans); font-size: 11px; font-weight: 700;
  letter-spacing: .22em; text-transform: uppercase; cursor: pointer; padding: 8px 0;
  min-height: 44px;
}
[data-design="b"] .tb-funnel__back:hover { color: var(--tb-ink); }

/* Confirmation */
[data-design="b"] .tb-funnel__done { text-align: left; }
[data-design="b"] .tb-funnel__matter {
  display: flex; align-items: baseline; gap: 14px; padding: 14px 18px;
  background: var(--tb-signal); color: var(--tb-ink); margin-bottom: 24px;
  font-family: var(--tb-mono); font-size: 14px; font-weight: 500;
  letter-spacing: .12em; text-transform: uppercase;
}
[data-design="b"] .tb-funnel__matter strong { font-weight: 700; }
[data-design="b"] .tb-funnel__done h3 {
  font-family: var(--tb-display); font-weight: 400;
  font-size: clamp(28px,3.6vw,40px); margin: 0 0 12px;
  text-transform: uppercase; letter-spacing: -.02em;
}
[data-design="b"] .tb-funnel__done p {
  font-family: var(--tb-sans); color: var(--tb-ink-soft); margin: 0 0 24px;
}
[data-design="b"] .tb-funnel__writ {
  display: grid; grid-template-columns: 1fr 1fr; gap: 24px;
  border-top: 1px solid var(--tb-ink); padding-top: 24px;
}
[data-design="b"] .tb-funnel__writ a {
  font-family: var(--tb-display); font-size: 18px; color: var(--tb-ink);
  text-decoration: none; text-transform: uppercase;
  display: grid; gap: 4px; letter-spacing: -.01em;
  word-break: break-word;
}
[data-design="b"] .tb-funnel__writ a small {
  font-family: var(--tb-mono); font-size: 10.5px; letter-spacing: .22em;
  color: var(--tb-mute); text-transform: uppercase;
}
@media (max-width: 560px) { [data-design="b"] .tb-funnel__writ { grid-template-columns: 1fr; } }

/* Below-funnel trust line */
[data-design="b"] .tb-funnel-trust {
  max-width: 720px; margin: 32px auto 0;
  display: flex; flex-wrap: wrap; gap: 8px 16px; align-items: center;
  font-family: var(--tb-mono); font-size: 11px; letter-spacing: .18em;
  color: var(--tb-mute); text-transform: uppercase;
}
[data-design="b"] .tb-funnel-trust a { color: var(--tb-bone-soft); text-decoration: none; }
[data-design="b"] .tb-funnel-trust a:hover { color: var(--tb-signal); }

/* ── PORTFOLIO ─────────────────────────────────────────────── */
[data-design="b"] .tb-portfolio {
  background: var(--tb-bone); color: var(--tb-ink);
  padding: clamp(64px,11vw,144px) clamp(20px,4vw,56px);
  border-bottom: 1px solid var(--tb-rule-bone);
}
[data-design="b"] .tb-portfolio__head {
  max-width: 1480px; margin: 0 auto var(--tb-chapter);
}
[data-design="b"] .tb-portfolio__project {
  max-width: 1480px; margin: 0 auto var(--tb-chapter);
}
[data-design="b"] .tb-portfolio__project:last-of-type { margin-bottom: 0; }
[data-design="b"] .tb-portfolio__project-head { margin-bottom: 24px; }
[data-design="b"] .tb-portfolio__project-head h3 {
  font-family: var(--tb-display); font-weight: 400;
  font-size: clamp(28px,4vw,44px); line-height: .96; letter-spacing: -.025em;
  margin: 8px 0 4px; text-transform: uppercase;
}
[data-design="b"] .tb-portfolio__scope {
  font-family: var(--tb-sans); font-size: 16px; color: var(--tb-ink-soft);
  margin: 0 0 24px; max-width: 60ch;
}
[data-design="b"] .tb-portfolio__provenance {
  font-family: var(--tb-mono); font-size: 9.5px; letter-spacing: .18em;
  color: var(--tb-mute); text-transform: uppercase; margin: 4px 0 0;
}
[data-design="b"] .tb-portfolio__grid {
  display: grid; gap: 12px;
}
[data-design="b"] .tb-portfolio__grid--3 { grid-template-columns: repeat(3,1fr); }
[data-design="b"] .tb-portfolio__grid--2 { grid-template-columns: 1fr 1fr; }
[data-design="b"] .tb-portfolio__grid--1 { grid-template-columns: 1fr; max-width: 720px; }
@media (max-width: 760px) {
  [data-design="b"] .tb-portfolio__grid--3 { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 560px) {
  [data-design="b"] .tb-portfolio__grid--3,
  [data-design="b"] .tb-portfolio__grid--2 { grid-template-columns: 1fr; }
}
[data-design="b"] .tb-portfolio__fig {
  margin: 0; display: flex; flex-direction: column; gap: 8px;
}
[data-design="b"] .tb-portfolio__fig img {
  width: 100%; height: auto; aspect-ratio: 4/3; object-fit: cover; display: block;
}
[data-design="b"] .tb-portfolio__fig figcaption {
  font-family: var(--tb-mono); font-size: 10.5px; letter-spacing: .14em;
  color: var(--tb-mute); text-transform: uppercase;
}

/* E4: Mid-page ambient — process phase strip */
[data-design="b"] .tb-portfolio__mid-ambient {
  max-width: 1480px; margin: var(--tb-chapter) auto;
  background: var(--tb-ink); padding: 40px clamp(20px,4vw,56px);
  overflow: hidden;
}
[data-design="b"] .tb-phase-strip {
  display: flex; flex-wrap: wrap; gap: 0; align-items: center; justify-content: space-between;
  max-width: 860px;
}
[data-design="b"] .tb-phase-step {
  font-family: var(--tb-display); font-size: clamp(18px,2.4vw,28px);
  text-transform: uppercase; letter-spacing: -.01em; color: var(--tb-bone);
  opacity: 0;
  transition: opacity 400ms var(--tb-ease-hard);
}
[data-design="b"] .tb-phase-step[data-phase-lit] { opacity: 1; color: var(--tb-signal); }
[data-design="b"] .tb-phase-sep {
  font-family: var(--tb-mono); font-size: 14px; color: var(--tb-rule);
  padding: 0 12px;
}

/* Repeated funnel CTA */
[data-design="b"] .tb-portfolio__cta-repeat {
  max-width: 1480px; margin: var(--tb-chapter) auto 0;
  padding-top: var(--tb-stanza); border-top: 1px solid var(--tb-rule-bone);
}

/* ── SERVICES (practice section) ──────────────────────────── */
[data-design="b"] .tb-practice {
  background: var(--tb-bone); color: var(--tb-ink);
  padding: clamp(80px,11vw,144px) clamp(20px,4vw,56px);
  border-bottom: 1px solid var(--tb-rule-bone);
}
[data-design="b"] .tb-practice__head {
  max-width: 1480px; margin: 0 auto var(--tb-stanza);
  display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: end;
}
@media (max-width: 760px) {
  [data-design="b"] .tb-practice__head { grid-template-columns: 1fr; }
}
[data-design="b"] .tb-practice__no {
  font-family: var(--tb-mono); font-size: 11px; letter-spacing: .28em;
  color: var(--tb-mute); text-transform: uppercase;
  margin-bottom: 16px; display: inline-flex; align-items: center; gap: 10px;
}
[data-design="b"] .tb-practice__sq { width: 8px; height: 8px; background: var(--tb-signal); flex-shrink: 0; }
[data-design="b"] .tb-practice__title {
  font-family: var(--tb-display); font-weight: 400;
  font-size: clamp(40px,6vw,80px); line-height: .94; letter-spacing: -.03em;
  margin: 0; text-transform: uppercase; max-width: 14ch;
}
[data-design="b"] .tb-practice__title em { color: var(--tb-signal); font-style: normal; }
[data-design="b"] .tb-practice__note {
  font-family: var(--tb-sans); font-size: 16px; line-height: 1.55;
  color: var(--tb-ink-soft); max-width: 50ch;
}
[data-design="b"] .tb-stack {
  max-width: 1480px; margin: 0 auto;
  display: grid; grid-template-columns: repeat(3,1fr); gap: 24px;
}
@media (max-width: 880px) { [data-design="b"] .tb-stack { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { [data-design="b"] .tb-stack { grid-template-columns: 1fr; } }
[data-design="b"] .tb-stack__card {
  background: var(--tb-ink); color: var(--tb-bone);
  padding: clamp(28px,3.4vw,40px); position: relative; min-height: 260px;
  display: flex; flex-direction: column; gap: 14px;
}
[data-design="b"] .tb-stack__card::before {
  content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 6px;
  background: var(--tb-signal); transform: scaleX(0); transform-origin: left center;
  transition: transform 100ms var(--tb-ease-hard);
}
[data-design="b"] .tb-stack__card[data-in="true"]::before { transform: scaleX(1); }
[data-design="b"] .tb-stack__num {
  font-family: var(--tb-mono); font-size: 11px; letter-spacing: .22em;
  color: var(--tb-signal); text-transform: uppercase; margin: 0;
}
[data-design="b"] .tb-stack__title {
  font-family: var(--tb-display); font-weight: 400;
  font-size: clamp(20px,2.2vw,26px); line-height: 1.05; letter-spacing: -.02em;
  margin: 0; text-transform: uppercase;
}
[data-design="b"] .tb-stack__body {
  font-family: var(--tb-sans); font-size: 15px; line-height: 1.5;
  color: var(--tb-bone-soft); margin: 0;
}

/* ── PROCESS ──────────────────────────────────────────────── */
[data-design="b"] .tb-process {
  background: var(--tb-ink); color: var(--tb-bone);
  padding: clamp(80px,11vw,144px) clamp(20px,4vw,56px);
  border-bottom: 1px solid var(--tb-rule);
}
[data-design="b"] .tb-process__head {
  max-width: 1480px; margin: 0 auto var(--tb-stanza);
}
[data-design="b"] .tb-process__title {
  font-family: var(--tb-display); font-weight: 400;
  font-size: clamp(40px,6vw,80px); line-height: .94; letter-spacing: -.03em;
  margin: 8px 0 0; text-transform: uppercase;
}
[data-design="b"] .tb-process__title em { color: var(--tb-signal); font-style: normal; }
[data-design="b"] .tb-process__steps {
  max-width: 1480px; margin: 0 auto;
  display: grid; gap: 0;
}
[data-design="b"] .tb-process__step {
  display: grid; grid-template-columns: 80px 1fr; gap: 32px; align-items: start;
  padding: 36px 0; border-bottom: 1px solid var(--tb-rule);
  opacity: 0; transform: translateX(-8px);
  transition: opacity 300ms var(--tb-ease-hard), transform 200ms var(--tb-ease-hard);
}
[data-design="b"] .tb-process__step[data-in="true"] { opacity: 1; transform: translateX(0); }
[data-design="b"] .tb-process__step:last-child { border-bottom: 0; }
@media (max-width: 560px) {
  [data-design="b"] .tb-process__step { grid-template-columns: 56px 1fr; gap: 16px; }
}
[data-design="b"] .tb-process__num {
  font-family: var(--tb-mono); font-size: 14px; letter-spacing: .18em;
  color: var(--tb-signal); text-transform: uppercase; padding-top: 6px;
}
[data-design="b"] .tb-process__step h3 {
  font-family: var(--tb-display); font-weight: 400;
  font-size: clamp(22px,2.8vw,32px); letter-spacing: -.02em; line-height: 1.0;
  margin: 0 0 8px; text-transform: uppercase;
}
[data-design="b"] .tb-process__step p {
  font-family: var(--tb-sans); font-size: 16px; line-height: 1.55;
  color: var(--tb-bone-soft); margin: 0; max-width: 65ch;
}

/* ── ABOUT ────────────────────────────────────────────────── */
[data-design="b"] .tb-about {
  background: var(--tb-bone); color: var(--tb-ink);
  padding: clamp(80px,11vw,144px) clamp(20px,4vw,56px);
  border-bottom: 1px solid var(--tb-rule-bone);
}
[data-design="b"] .tb-about__inner {
  max-width: 1480px; margin: 0 auto;
}
[data-design="b"] .tb-about__text { max-width: 680px; }
[data-design="b"] .tb-about__title {
  font-family: var(--tb-display); font-weight: 400;
  font-size: clamp(40px,6vw,72px); line-height: .94; letter-spacing: -.03em;
  margin: 8px 0 var(--tb-stanza); text-transform: uppercase;
}
[data-design="b"] .tb-about__title em { color: var(--tb-signal); font-style: normal; }
[data-design="b"] .tb-about__text p {
  font-family: var(--tb-sans); font-size: 17px; line-height: 1.65;
  color: var(--tb-ink-soft); margin: 0 0 20px; max-width: 60ch;
}
[data-design="b"] .tb-about__contact {
  margin-top: var(--tb-stanza); display: flex; flex-direction: column; gap: 16px; align-items: flex-start;
}
[data-design="b"] .tb-about__email a {
  font-family: var(--tb-mono); font-size: 12px; letter-spacing: .14em;
  color: var(--tb-mute); text-transform: lowercase; text-decoration: none;
}
[data-design="b"] .tb-about__email a:hover { color: var(--tb-signal); }

/* ── FOOTER ───────────────────────────────────────────────── */
[data-design="b"] .tb-footer {
  background: var(--tb-ink); color: var(--tb-bone);
  padding: clamp(64px,9vw,120px) clamp(20px,4vw,56px) clamp(40px,5vw,64px);
}
[data-design="b"] .tb-footer__inner {
  max-width: 1480px; margin: 0 auto;
  display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: 48px;
  padding-bottom: var(--tb-stanza); border-bottom: 1px solid var(--tb-rule);
}
@media (max-width: 960px) {
  [data-design="b"] .tb-footer__inner { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 560px) {
  [data-design="b"] .tb-footer__inner { grid-template-columns: 1fr; }
}
[data-design="b"] .tb-footer__name {
  display: block; font-family: var(--tb-display); font-size: clamp(22px,2.8vw,36px);
  text-transform: uppercase; letter-spacing: -.02em; margin-bottom: 8px;
}
[data-design="b"] .tb-footer__loc {
  display: block; font-family: var(--tb-mono); font-size: 11px; letter-spacing: .24em;
  color: var(--tb-mute); text-transform: uppercase;
}
[data-design="b"] .tb-footer__col {
  display: flex; flex-direction: column; gap: 10px;
}
[data-design="b"] .tb-footer__label {
  font-family: var(--tb-display); font-size: 13px; letter-spacing: .1em;
  text-transform: uppercase; margin-bottom: 4px; color: var(--tb-signal);
}
[data-design="b"] .tb-footer__col a,
[data-design="b"] .tb-footer__col span {
  font-family: var(--tb-sans); font-size: 14px; color: var(--tb-bone-soft);
  text-decoration: none; line-height: 1.5;
}
[data-design="b"] .tb-footer__col a:hover { color: var(--tb-bone); }
[data-design="b"] .tb-footer__fine {
  max-width: 1480px; margin: var(--tb-gutter) auto 0;
  display: flex; flex-wrap: wrap; gap: 8px 24px;
  font-family: var(--tb-mono); font-size: 10.5px; letter-spacing: .14em;
  color: var(--tb-mute); text-transform: uppercase;
}

/* ── REDUCED MOTION ───────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  [data-design="b"] .tb-header__marquee::after { animation: none !important; transform: translateX(0) !important; opacity: .6; }
  [data-design="b"] .tb-hero__kb-img    { animation: none !important; transform: scale(1.08) !important; }
  [data-design="b"] .tb-hero__rule::after { animation: none !important; transform: translateX(0) !important; opacity: .5; }
  [data-design="b"] .tb-cta__rule::after { animation: none !important; transform: translateX(0) !important; width: 100%; opacity: .3; }
  [data-design="b"] .tb-pointer__label  { animation: none !important; opacity: 1 !important; }
  [data-design="b"] .tb-pointer__bar    { animation: none !important; opacity: 1 !important; transform: scaleY(1) !important; }
  [data-design="b"] .tb-pointer__tick   { animation: none !important; }
  [data-design="b"] .tb-funnel__step    { transition-duration: 100ms !important; transform: none !important; }
  [data-design="b"] .tb-stack__card::before { transition: none !important; transform: scaleX(1) !important; }
  [data-design="b"] .tb-process__step   { transition: none !important; opacity: 1 !important; transform: none !important; }
  [data-design="b"] .tb-phase-step      { transition: none !important; opacity: 1 !important; }
}

/* Phase-3.4 hero visibility floor (forge_assemble) */
[data-design="b"] [data-mf-role="hero"] :is(h1,h2,p,.headline,.subtitle,.proof,[class*="headline"],[class*="subtitle"],[class*="proof"]),
[data-design="b"] [data-mf-role="cta"] { opacity: 1 !important; }