/* Scoped experiment: portrait registration > evidence rail > editorial margin. */
.hero{position:relative}
.hero .portrait{position:relative;isolation:isolate}
.motion-register{position:absolute;inset:-16px;pointer-events:none;overflow:visible;width:calc(100% + 32px);height:calc(100% + 32px);color:var(--red)}
.motion-register path,.motion-register circle{vector-effect:non-scaling-stroke;fill:none;stroke:currentColor;stroke-width:1}
.motion-register .register-secondary{color:var(--ink);opacity:.28}
.motion-register .register-node{fill:var(--bg);stroke-width:1.5}
.motion-replay{position:absolute;width:44px;height:44px;border:1px solid var(--line);border-radius:50%;background:var(--bg);color:var(--ink);cursor:pointer;display:grid;place-items:center;z-index:1;transition:color .2s,border-color .2s}
.motion-replay svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.3}
.motion-replay:hover{color:var(--red);border-color:var(--red)}
.motion-replay:focus-visible{outline:3px solid var(--red);outline-offset:5px}
.motion-replay:disabled{cursor:default;opacity:.5}
.hero h1 em{position:relative}
.hero h1 em::after{content:"";display:block;position:absolute;bottom:-12px;left:0;width:76px;height:1px;background:var(--red);transform:scaleX(var(--motion-rule,1));transform-origin:left}
.proof.motion-evidence{position:relative;--rail:0}
.proof.motion-evidence::before{content:"";position:absolute;left:0;top:-1px;height:1px;width:100%;background:var(--red);transform:scaleX(var(--rail));transform-origin:left;pointer-events:none}
.motion-evidence .wrap>div{position:relative}
.motion-evidence .wrap>div::before{content:"";position:absolute;top:-26px;left:0;width:7px;height:7px;border:1px solid var(--red);background:var(--bg);transform:rotate(45deg);opacity:var(--marker,0)}
.motion-strategy .content-copy{position:relative}
.motion-strategy .content-copy::before{content:"";position:absolute;left:4px;top:24px;bottom:0;width:1px;background:var(--red);transform:scaleY(var(--margin,0));transform-origin:top;opacity:.6}
.motion-strategy .content-copy::after{content:"";position:absolute;left:0;top:24px;width:9px;height:1px;background:var(--red);opacity:var(--margin,0)}
@media(max-width:900px){
 .motion-register{inset:-10px;width:calc(100% + 20px);height:calc(100% + 20px)}
 .motion-evidence .wrap>div::before{left:-12px;top:5px;width:5px;height:5px}
 .motion-strategy .content-copy::before{left:9px}
 .motion-strategy .content-copy::after{left:5px}
}
@media(prefers-reduced-motion:reduce){
 .motion-replay{transition:none}
 .hero h1 em::after{transform:none}
 .proof.motion-evidence::before{transform:none}
 .motion-evidence .wrap>div::before{opacity:1}
 .motion-strategy .content-copy::before{transform:none}
 .motion-strategy .content-copy::after{opacity:1}
}