.campaign-path { display: flex; align-items: center; justify-content: center; position: absolute; inset: 70px 35px 75px; gap: 0; }
.campaign-path .path-node { margin: 0; flex: 0 1 77px; display: flex; flex-direction: column; align-items: center; gap: 10px; color: #eee; font-size: .875rem; font-weight: 600; text-align: center; }
.path-symbol { width: 45px; height: 45px; border: 1px solid #616161; border-radius: 50%; display: grid; place-items: center; font-size: 1.2rem; background: #242424; }
.path-node-highlight .path-symbol { background: #e01f1f; border-color: #e01f1f; }
.campaign-path .path-connector { flex: 1; min-width: 12px; height: 1px; background: #606060; margin: -29px 2px 0; position: relative; overflow: hidden; }
.path-connector::after { content: ''; position: absolute; width: 35%; height: 100%; background: white; transform: translateX(-120%); }
.is-visible .path-connector::after { animation: signal-flow 3.6s ease-in-out infinite; }
.is-visible .path-connector:nth-of-type(4)::after { animation-delay: .55s; }
@keyframes signal-flow { 0%, 20% { transform: translateX(-120%); } 75%, 100% { transform: translateX(420%); } }
.service-art-presence { background: #261516 !important; }
.channel-diagram { position: absolute; top: 74px; left: 30px; right: 30px; text-align: center; }
.channel-diagram .channel-origin { display: inline-block; padding: 10px 21px; background: #e01f1f; font-size: .875rem; font-weight: 700; margin: 0; border-radius: 3px; }
.channel-diagram .channel-branch { height: 28px; width: 68%; margin: 0 auto; border-bottom: 1px solid #895053; position: relative; }
.channel-branch::before { content: ''; position: absolute; top: 0; left: 50%; height: 100%; width: 1px; background: #895053; }
.channel-diagram .channel-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; margin: 12px 0 0; }
.channel-list span { position: relative; display: grid; place-items: center; padding: 9px 5px; border: 1px solid #674346; border-radius: 3px; color: #eee; font-size: .875rem; }
.channel-list span::before { content: ''; position: absolute; top: -13px; left: 50%; height: 12px; width: 1px; background: #895053; }
.is-visible .channel-list span { animation: channel-emphasis 6s ease-in-out infinite; }
.is-visible .channel-list span:nth-child(2) { animation-delay: 2s; }
.is-visible .channel-list span:nth-child(3) { animation-delay: 4s; }
@keyframes channel-emphasis { 0%, 35%, 100% { border-color: #674346; background: transparent; } 12%, 24% { border-color: #f37878; background: #4b2427; } }

.section.workflow-section { background: #f3f3f3; color: #101010; }
.workflow-section .section-head > p { color: #555; }
.workflow-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; position: relative; }
.workflow-card { min-width: 0; position: relative; }
.workflow-card .workflow-top { display: flex; align-items: center; gap: 14px; margin: 0 0 25px; position: relative; }
.workflow-top::after { content: ''; position: absolute; left: 53px; right: -24px; height: 1px; top: 25px; background: #ccc; }
.workflow-card:last-child .workflow-top::after { right: 0; }
.workflow-number { display: grid; place-items: center; flex: 0 0 51px; height: 51px; border: 1px solid #d3d3d3; border-radius: 50%; background: #f3f3f3; font-size: 1rem; font-weight: 800; }
.workflow-tag { position: relative; z-index: 1; background: #f3f3f3; padding: 5px 9px 5px 0; font-size: .75rem; letter-spacing: .05em; font-weight: 700; color: #666; }
.workflow-preview { height: 168px; background: #fff; border: 1px solid #e1e1e1; overflow: hidden; border-radius: 4px; display: grid; place-items: center; margin-bottom: 23px; }
.workflow-card h3 { margin: 0 0 13px; font-size: 1.6rem; line-height: 1.15; letter-spacing: -.04em; }
.workflow-card > p { font-size: 1rem; line-height: 1.65; color: #555; margin: 0; }
.workflow-preview .brief-map { width: calc(100% - 34px); display: grid; grid-template-columns: 1fr 1fr; gap: 22px 10px; margin: 0; text-align: center; font-size: .875rem; position: relative; }
.brief-map span { padding: 9px 2px; border: 1px solid #ddd; border-radius: 3px; position: relative; }
.brief-map span::after { content: ''; position: absolute; left: 50%; top: 100%; height: 12px; width: 1px; background: #ccc; }
.brief-map strong { grid-column: 1/-1; justify-self: center; padding: 8px 14px; border-radius: 3px; color: #b51818; background: #fce9e9; position: relative; }
.brief-map strong::before { content: ''; position: absolute; width: 115%; height: 11px; border-top: 1px solid #ccc; top: -11px; left: -7.5%; }
.workflow-preview .script-preview { width: calc(100% - 34px); display: grid; gap: 8px; margin: 0; }
.script-preview span { padding: 8px 9px; font-size: .75rem; background: #f3f3f3; border-left: 2px solid #ddd; }
.script-preview span:first-child { border-left-color: #e01f1f; }
.is-visible .script-preview span { animation: script-emphasis 6s ease-in-out infinite; }
.is-visible .script-preview span:nth-child(2) { animation-delay: 1.8s; }
.is-visible .script-preview span:nth-child(3) { animation-delay: 3.6s; }
@keyframes script-emphasis { 0%, 45%, 100% { transform: translateX(0); } 15%, 30% { transform: translateX(5px); border-left-color: #e01f1f; } }
.workflow-preview .shoot-preview { width: 100%; height: 100%; position: relative; overflow: hidden; }
.shoot-preview > figure { margin: 0; height: 100%; }
.shoot-preview img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 37%; }
.shoot-preview span { position: absolute; top: 12px; left: 12px; background: #111c; color: white; padding: 5px 9px; border-radius: 3px; font-size: .75rem; letter-spacing: .08em; }
.workflow-preview .edit-preview { width: calc(100% - 32px); position: relative; display: grid; gap: 9px; }
.edit-preview > div { display: flex; align-items: center; gap: 4px; height: 27px; }
.edit-preview span { flex: 0 0 49px; font-size: .75rem; color: #777; }
.edit-preview i { background: #e9abab; height: 24px; border-radius: 3px; flex: 1; }
.edit-preview > div:nth-child(2) i { background: #b6bfcd; }
.edit-preview > div:nth-child(3) i { background: #c2c8be; }
.edit-preview b { position: absolute; left: 63px; top: -9px; bottom: -7px; width: 2px; background: #c01818; }
.edit-preview b::before { content: ''; position: absolute; width: 8px; height: 8px; top: 0; left: -3px; background: #c01818; }
.is-visible .edit-preview b { animation: edit-playhead 7s ease-in-out infinite; }
@keyframes edit-playhead { 0%, 8%, 100% { left: 63px; } 75%, 88% { left: calc(100% - 9px); } }


@media(prefers-reduced-motion:reduce){.rv-section *, .rv-section *::before, .rv-section *::after{animation:none!important;transition:none!important;}}