.brand-journey { position: relative; isolation: isolate; background: #000; }
.journey-ribbon { position: absolute; inset: 0; z-index: 1; pointer-events: none; overflow: clip; }
.journey-ribbon svg { display: block; width: 100%; height: 100%; }
.journey-ribbon path { fill: none; stroke: url(#journey-ink); stroke-linecap: round; stroke-linejoin: round; }
.legal-intro > *, .brand-journey .benefits-stage { position: relative; z-index: 2; }
.brand-journey .legal-intro { background: transparent; padding-bottom: 70px; }
.legal-story__heading { max-width: 1100px; margin-bottom: 72px; }
.legal-intro .legal-story__heading h2 { font-size: clamp(40px, 6.2vw, 100px); line-height: 1.1; }
.legal-story__heading p { max-width: 60ch; margin-top: 28px; color: #a7aaab; font-size: clamp(15px,1.3vw,19px); line-height: 1.7; }
.legal-story__heading p, .legal-intro > .eyebrow { background: transparent; }
.scroll01__copy h3 { white-space: pre-line; }
.scroll01 { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(36px,7vw,110px); align-items: start; }
.scroll01__media { position: sticky; top: max(130px, 20svh); height: min(62svh, 620px); border-radius: 24px; overflow: hidden; background: #111; }
.scroll01__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: opacity 250ms var(--ease); }
.scroll01__chapter { min-height: 74svh; display: flex; flex-direction: column; justify-content: center; }
.scroll01__copy { position: relative; padding: 28px 0; }
.scroll01__copy h3 { font-family: var(--font-display); font-size: clamp(28px,3.2vw,51px); line-height: 1.2; letter-spacing: -.04em; text-wrap: balance; }
.scroll01__copy p { margin-top: 24px; max-width: 42ch; color: #b8babc; font-size: clamp(15px,1.3vw,19px); line-height: 1.7; }
.scroll01__number { display: block; margin-bottom: 24px; font: 500 11px/1.5 var(--font-body); letter-spacing: .15em; color: #82cce6; }
.scroll01__copy .text-link { margin-top: 32px; font-size: 14px; }
.scroll01__chapter > img { display: none; }
.legal-story-fallback .scroll01__media img { position: static; }
.brand-journey .legal-intro__facts { background: #000; margin-top: 48px; }
.brand-journey .legal-intro__note { background: #000; }
.brand-journey .benefits-stage { position: sticky; background: transparent; }
.brand-journey .benefits__head h2 { background: #000; }
.brand-journey .location__stage { z-index: 2; background: transparent; }
.brand-journey .location, .brand-journey .benefits { z-index: 2; background: transparent; }
@media (max-width: 760px), (prefers-reduced-motion: reduce) {
  .scroll01, .scroll01--static { display: block; }
  .scroll01__media { display: none; }
  .scroll01__chapter { min-height: 0; margin-bottom: 56px; }
  .scroll01__chapter > img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 18px; }
  .scroll01__copy { padding: 24px 0; }
  .scroll01__copy h3 { font-size: clamp(27px,5vw,48px); }
  .legal-story__heading { margin-bottom: 32px; }
}
@media (max-width: 760px) {
  .brand-journey .legal-intro { padding-top: 110px; }
  .legal-intro .legal-story__heading h2 { font-size: clamp(32px,8vw,58px); }
  .brand-journey .benefits-stage { position: relative; }
}
@media (prefers-reduced-motion: reduce) {
  .journey-ribbon { display: none; }
  .scroll01__media img { transition: none; }
}