.trx-approach { padding-block: clamp(var(--space-8), 10vw, var(--space-10)); background: var(--brand-primary); color: var(--bg-base); position: relative; overflow: hidden; }
.trx-approach::before {
  content: ''; position: absolute; inset: 0; pointer-events: none; opacity: 0.06;
  background-image: linear-gradient(rgba(245,241,234,0.6) 1px, transparent 1px), linear-gradient(90deg, rgba(245,241,234,0.6) 1px, transparent 1px);
  background-size: 64px 64px;
  mask-image: radial-gradient(ellipse at 80% 30%, #000 25%, transparent 75%);
  -webkit-mask-image: radial-gradient(ellipse at 80% 30%, #000 25%, transparent 75%);
}
.trx-approach > * { position: relative; }
.trx-approach .trx-eyebrow--light .trx-eyebrow__label { color: var(--secondary-soft); }
.trx-approach .trx-eyebrow--light .trx-eyebrow__rule  { background: var(--accent); opacity: 1; }

/* ── Head ─────────────────────────────────────────────────────────── */
.trx-approach__head { max-width: 64ch; margin-bottom: var(--space-8); padding-bottom: var(--space-6); border-bottom: 1px solid rgba(245,241,234,0.18); }
.trx-approach__head .trx-eyebrow { display: inline-flex; align-items: center; gap: var(--space-3); margin: 0; }
.trx-approach__num { font-family: var(--font-display); font-weight: 600; font-size: clamp(2.2rem, 4.4vw, 3.2rem); line-height: 1; color: var(--accent); letter-spacing: -0.03em; }
.trx-approach__title { font-family: var(--font-display); font-weight: 600; font-size: clamp(2rem, 4vw, 3rem); line-height: 1.05; letter-spacing: -0.025em; margin: var(--space-4) 0 var(--space-4); color: var(--bg-base); max-width: 24ch; }
.trx-approach__lede { font-size: var(--fs-400); line-height: 1.6; color: rgba(245,241,234,0.86); margin: 0; max-width: 56ch; }
.trx-approach__lede::before { content: ''; display: inline-block; width: 32px; height: 1px; background: var(--accent); vertical-align: middle; margin-right: var(--space-3); }

/* ── Layout ───────────────────────────────────────────────────────── */
.trx-approach__layout { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr); gap: clamp(var(--space-6), 4vw, var(--space-8)); align-items: start; }
@media (max-width: 960px) { .trx-approach__layout { grid-template-columns: 1fr; gap: var(--space-6); } }

/* ── Decisions timeline ───────────────────────────────────────────── */
.trx-approach__decisions { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--space-5); position: relative; }
.trx-approach__decisions::before {
  content: ''; position: absolute;
  left: 32px; top: 24px; bottom: 24px; width: 1px;
  background: linear-gradient(180deg, var(--accent), rgba(232,117,26,0.2));
}
@media (max-width: 640px) { .trx-approach__decisions::before { left: 22px; } }

.trx-approach__decision { display: grid; grid-template-columns: 64px 1fr; gap: var(--space-4); align-items: start; opacity: 0; transform: translateY(16px); transition: opacity 700ms var(--ease-out), transform 700ms var(--ease-out); transition-delay: calc(var(--i, 0) * 120ms); }
.trx-approach[data-revealed="true"] .trx-approach__decision { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .trx-approach__decision { opacity: 1; transform: none; transition: none; } }
@media (max-width: 640px) { .trx-approach__decision { grid-template-columns: 44px 1fr; gap: var(--space-3); } }

.trx-approach__decision-num {
  display: inline-flex; align-items: center; justify-content: center;
  width: 64px; height: 64px; border-radius: 999px;
  background: var(--accent); color: #fff;
  font-family: var(--font-display); font-weight: 600; font-size: var(--fs-600); line-height: 1; letter-spacing: -0.02em;
  box-shadow: 0 0 0 6px rgba(232,117,26,0.12);
  position: relative; z-index: 1;
}
@media (max-width: 640px) { .trx-approach__decision-num { width: 44px; height: 44px; font-size: var(--fs-500); box-shadow: 0 0 0 4px rgba(232,117,26,0.12); } }

.trx-approach__decision-body { padding: var(--space-4) var(--space-5); background: rgba(245,241,234,0.04); border: 1px solid rgba(245,241,234,0.16); border-radius: var(--radius-md); display: flex; flex-direction: column; gap: var(--space-2); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
.trx-approach__decision-label { font-family: var(--font-mono); font-size: var(--fs-100); letter-spacing: 0.14em; text-transform: uppercase; color: var(--secondary-soft); margin: 0; display: inline-flex; align-items: center; gap: 8px; }
.trx-approach__decision-label > span { color: var(--accent); font-size: 8px; }
.trx-approach__decision-text { font-family: var(--font-display); font-weight: 500; font-size: clamp(1.15rem, 1.8vw, 1.4rem); line-height: 1.35; letter-spacing: -0.01em; color: var(--bg-base); margin: 0; }

.trx-approach__decisions-empty { padding: var(--space-5); background: rgba(245,241,234,0.04); border: 1px dashed rgba(245,241,234,0.24); border-radius: var(--radius-md); color: var(--secondary-soft); font-size: var(--fs-300); }

/* ── Owner card ───────────────────────────────────────────────────── */
.trx-approach__owner { display: flex; flex-direction: column; gap: var(--space-3); padding: var(--space-5); background: var(--bg-base); color: var(--ink-primary); border-radius: var(--radius-md); position: sticky; top: 100px; box-shadow: 0 24px 60px rgba(0,0,0,0.18); }
@media (max-width: 960px) { .trx-approach__owner { position: relative; top: auto; } }
.trx-approach__owner-label { display: inline-flex; align-items: center; gap: 8px; font-family: var(--font-mono); font-size: var(--fs-100); letter-spacing: 0.16em; text-transform: uppercase; color: var(--ink-muted); margin: 0; }
.trx-approach__owner-label-dot { width: 7px; height: 7px; border-radius: 999px; background: var(--accent); box-shadow: 0 0 0 3px rgba(232,117,26,0.18); }
.trx-approach__owner-media { margin: 0; aspect-ratio: 3/4; overflow: hidden; border-radius: var(--radius-sm); background: var(--secondary-soft); max-height: 280px; }
.trx-approach__owner-media img { width: 100%; height: 100%; object-fit: cover; filter: grayscale(0.1); transition: filter var(--dur-base) var(--ease-out); }
.trx-approach__owner:hover .trx-approach__owner-media img { filter: grayscale(0); }
.trx-approach__owner-body { display: flex; flex-direction: column; gap: 4px; }
.trx-approach__owner-name { font-family: var(--font-display); font-weight: 600; font-size: clamp(1.3rem, 2vw, 1.55rem); line-height: 1.15; letter-spacing: -0.015em; color: var(--ink-primary); margin: 4px 0 0; }
.trx-approach__owner-role { font-family: var(--font-mono); font-size: var(--fs-100); letter-spacing: 0.1em; text-transform: uppercase; color: var(--accent); margin: 0; }
.trx-approach__owner-contact { display: inline-flex; align-items: center; gap: 8px; margin-top: var(--space-3); padding: 8px 12px; border: 1px solid var(--line-strong); border-radius: var(--radius-pill); color: var(--ink-primary); text-decoration: none; font-family: var(--font-mono); font-size: var(--fs-100); letter-spacing: 0.06em; align-self: flex-start; transition: border-color var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out), background var(--dur-fast) var(--ease-out); }
.trx-approach__owner-contact:hover { background: var(--ink-primary); color: var(--bg-base); border-color: var(--ink-primary); }
.trx-approach__owner-note { margin: var(--space-3) 0 0; display: flex; align-items: flex-start; gap: 8px; font-size: var(--fs-200); line-height: 1.5; color: var(--ink-muted); padding-top: var(--space-3); border-top: 1px dashed var(--line); }
.trx-approach__owner-note > span:first-child { color: var(--accent); font-family: var(--font-display); font-style: italic; font-size: var(--fs-400); line-height: 1; }

/* ── Bridge ───────────────────────────────────────────────────────── */
.trx-approach__bridge { margin-top: var(--space-9); padding-top: var(--space-6); border-top: 1px solid rgba(245,241,234,0.18); display: flex; align-items: center; gap: var(--space-5); }
.trx-approach__bridge-line { display: inline-block; height: 1px; flex: 1; background: rgba(245,241,234,0.24); }
.trx-approach__bridge-text { margin: 0; display: inline-flex; flex-direction: column; gap: 2px; }
.trx-approach__bridge-kicker { font-family: var(--font-mono); font-size: var(--fs-100); letter-spacing: 0.16em; text-transform: uppercase; color: var(--secondary-soft); }
.trx-approach__bridge-link { font-family: var(--font-display); font-size: clamp(1.4rem, 2.4vw, 1.8rem); line-height: 1; color: var(--bg-base); text-decoration: none; display: inline-flex; align-items: center; gap: 12px; transition: color var(--dur-fast) var(--ease-out); }
.trx-approach__bridge-link:hover { color: var(--accent); }
.trx-approach__bridge-link span { transition: transform var(--dur-fast) var(--ease-out); }
.trx-approach__bridge-link:hover span { transform: translateX(6px); }

/* Reveal */
.trx-approach[data-reveal] { opacity: 0; transform: translateY(16px); transition: opacity 700ms var(--ease-out), transform 700ms var(--ease-out); }
.trx-approach[data-reveal].is-revealed { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .trx-approach[data-reveal] { opacity: 1; transform: none; transition: none; } }