/* The same timing and movement used on TIFA Growth, within Overnhill's layout. */
.hero-headline-window{overflow:hidden}
.motion-ready .hero-art :is(.plane-a,.plane-b,.plane-c){animation-duration:24s;animation-timing-function:ease-in-out;animation-iteration-count:infinite;animation-direction:normal;animation-play-state:paused;will-change:transform}
.motion-ready .plane-a{animation-name:growth-plane-left}
.motion-ready .plane-b{animation-name:growth-plane-centre}
.motion-ready .plane-c{animation-name:growth-plane-edge}
.motion-ready [data-hero-playing=true] .hero-art g{animation-play-state:running}
@keyframes growth-plane-left{0%,100%{transform:translateX(-75px)}50%{transform:translateX(65px)}}
@keyframes growth-plane-centre{0%,100%{transform:translateX(90px)}50%{transform:translateX(-60px)}}
@keyframes growth-plane-edge{0%,100%{transform:translateX(100px)}50%{transform:translateX(-35px)}}
.motion-ready.intro-motion[data-motion=running] .hero h1{animation:growth-headline-in .85s cubic-bezier(.16,1,.3,1) both}
.motion-ready.intro-motion[data-motion=running] .hero .intro{animation:growth-content-in .8s .3s cubic-bezier(.2,.7,.2,1) both}
.motion-ready.intro-motion[data-motion=running] .hero .actions{animation:growth-content-in .7s .43s cubic-bezier(.2,.7,.2,1) both}
.motion-ready.intro-motion[data-motion=running] .hero .status-note{animation:growth-content-in .6s .5s ease-out both}
@keyframes growth-headline-in{from{transform:translateY(110%);opacity:.2}to{transform:translateY(0);opacity:1}}
@keyframes growth-content-in{from{transform:translateY(16px);opacity:0}to{transform:translateY(0);opacity:1}}
.motion-ready [data-reveal]{opacity:0;transform:translateY(25px);transition:opacity .75s ease,transform .75s cubic-bezier(.2,.7,.2,1);transition-delay:var(--reveal-delay,0ms)}
.motion-ready [data-reveal].is-revealed,.motion-ready [data-reveal]:focus-within{opacity:1;transform:none}
.motion-ready[data-motion=paused] [data-reveal]{opacity:1;transform:none;transition:none}

/* A travelling marker follows the existing process lines; it does not change any record. */
.teaser-flow,.edition-route,.delivery-line{position:relative}
.motion-ready :is(.teaser-flow,.edition-route)::after{content:'';position:absolute;left:-4px;top:5%;width:7px;height:7px;border-radius:50%;background:var(--red);animation:growth-workflow-vertical 12s linear infinite;animation-play-state:paused;pointer-events:none;opacity:0}
.motion-ready .delivery-line::after{content:'';position:absolute;left:0;top:-4px;width:7px;height:7px;border-radius:50%;background:var(--red);animation:growth-workflow-horizontal 12s linear infinite;animation-play-state:paused;pointer-events:none;opacity:0}
.motion-ready :is(.teaser-flow,.edition-route,.delivery-line)[data-workflow-playing=true]::after{animation-play-state:running}
@keyframes growth-workflow-vertical{0%{top:5%;opacity:0}4%{opacity:1}28%,34%{top:36%}59%,65%{top:66%}91%{top:95%;opacity:1}96%,100%{top:95%;opacity:0}}
@keyframes growth-workflow-horizontal{0%{left:0;opacity:0}4%{opacity:1}28%,34%{left:33.333%}59%,65%{left:66.666%}91%{left:100%;opacity:1}96%,100%{left:100%;opacity:0}}
.motion-ready .edition-flow>div::before{animation:growth-workflow-node 12s ease-in-out infinite;animation-play-state:paused}
.motion-ready .edition-flow>div:nth-child(2)::before{animation-delay:3s}
.motion-ready .edition-flow>div:nth-child(3)::before{animation-delay:6s}
.motion-ready .edition-flow[data-workflow-playing=true]>div::before{animation-play-state:running}
@keyframes growth-workflow-node{0%,32%,100%{transform:scale(1);opacity:.6}8%,24%{transform:scale(1.5);opacity:1;background:var(--red)}}
@media(max-width:700px){.motion-ready .delivery-line::after{display:none}}
@media(prefers-reduced-motion:reduce){
 .motion-ready .hero-art g,.motion-ready.intro-motion .hero h1,.motion-ready.intro-motion .hero .intro,.motion-ready.intro-motion .hero .actions,.motion-ready.intro-motion .hero .status-note{animation:none!important;transform:none!important;opacity:1!important;will-change:auto}
 .motion-ready [data-reveal]{opacity:1;transform:none;transition:none}
 .motion-ready :is(.teaser-flow,.edition-route,.delivery-line)::after{display:none;animation:none}
 .motion-ready .edition-flow>div::before{animation:none}
}
@media print{[data-reveal]{opacity:1!important;transform:none!important}.hero-art g{animation:none!important}.teaser-flow::after,.edition-route::after,.delivery-line::after{display:none!important}}