.hero-title-line{display:block;overflow:hidden;padding-bottom:.12em;margin-bottom:-.12em}.hero h1 .hero-title-line:first-child{color:inherit}.hero h1 .hero-line-inner{display:block;color:inherit}
.ruta-motion .hero-intro-ready:not(.hero-intro-done) .hero-line-inner{opacity:0;transform:translate3d(0,112%,0)}
.ruta-motion .hero-intro-ready:not(.hero-intro-done) .hero-image{opacity:.5;transform:scale(1.08)}
.ruta-motion .hero-intro-ready:not(.hero-intro-done) .hero-content>.eyebrow,.ruta-motion .hero-intro-ready:not(.hero-intro-done) .hero-lead,.ruta-motion .hero-intro-ready:not(.hero-intro-done) .hero-content>.button,.ruta-motion .hero-intro-ready:not(.hero-intro-done) .hero-bottom,.ruta-motion .hero-intro-ready:not(.hero-intro-done) .image-note{opacity:0}
.ruta-motion .hero-intro-playing .hero-image{animation:ruta-hero-photo 1900ms cubic-bezier(.2,.65,.25,1) both}
.ruta-motion .hero-intro-playing .hero-content>.eyebrow{animation:ruta-hero-copy 750ms cubic-bezier(.2,.75,.25,1) 80ms both}
.ruta-motion .hero-intro-playing .hero-title-line:first-child .hero-line-inner{animation:ruta-hero-title 1150ms cubic-bezier(.16,1,.3,1) 180ms both}
.ruta-motion .hero-intro-playing .hero-title-line:nth-child(2) .hero-line-inner{animation:ruta-hero-title 1150ms cubic-bezier(.16,1,.3,1) 420ms both}
.ruta-motion .hero-intro-playing .hero-lead{animation:ruta-hero-copy 800ms cubic-bezier(.2,.75,.25,1) 920ms both}
.ruta-motion .hero-intro-playing .hero-content>.button{animation:ruta-hero-action 700ms ease 1140ms both}
.ruta-motion .hero-intro-playing .hero-bottom{animation:ruta-hero-footer 750ms cubic-bezier(.2,.75,.25,1) 1450ms both}
.ruta-motion .hero-intro-playing .image-note{animation:ruta-hero-action 650ms ease 1400ms both}
@keyframes ruta-hero-title{from{opacity:.1;transform:translate3d(0,112%,0)}to{opacity:1;transform:translate3d(0,0,0)}}
@keyframes ruta-hero-photo{from{opacity:.5;transform:scale(1.08)}to{opacity:1;transform:scale(1)}}
@keyframes ruta-hero-copy{from{opacity:0;transform:translate3d(0,20px,0)}to{opacity:1;transform:translate3d(0,0,0)}}
@keyframes ruta-hero-action{from{opacity:0}to{opacity:1}}
@keyframes ruta-hero-footer{from{opacity:0;transform:translate3d(0,14px,0)}to{opacity:1;transform:translate3d(0,0,0)}}
.ruta-motion [data-ruta-motion]{transition:opacity var(--motion-duration,850ms) cubic-bezier(.22,.72,.2,1),transform var(--motion-duration,850ms) cubic-bezier(.22,.72,.2,1);transition-delay:var(--motion-delay,0ms)}
.ruta-motion [data-ruta-motion]:not(.motion-visible){opacity:0;transform:translate3d(0,var(--motion-distance,24px),0)}
.ruta-motion [data-ruta-motion="photo"]:not(.motion-visible){opacity:.2;transform:scale(1.055)}
.ruta-motion [data-ruta-motion="visual"]:not(.motion-visible){transform:translate3d(0,18px,0) scale(.985)}
.ruta-motion [data-ruta-motion="static"]{transform:none!important}
.ruta-motion [data-ruta-motion].motion-visible{opacity:1;transform:none}
.hmi-top{position:relative}.hmi-top::after{content:"";position:absolute;pointer-events:none;left:0;right:0;bottom:-1px;height:2px;background:linear-gradient(90deg,transparent,#6fe3ea,transparent);transform:scaleX(0);opacity:0;transform-origin:left}
.ruta-motion .hmi.motion-welcomed .hmi-top::after{animation:ruta-welcome-line 1150ms cubic-bezier(.22,.72,.2,1) both}
@keyframes ruta-welcome-line{0%{opacity:0;transform:scaleX(0)}20%{opacity:1}75%{opacity:.85;transform:scaleX(1)}100%{opacity:0;transform:scaleX(1)}}
@media(max-width:650px){.ruta-motion [data-ruta-motion]:not(.motion-visible){--motion-distance:16px}}
@media(prefers-reduced-motion:reduce){[data-ruta-motion],.hero-line-inner,.hero-image,.hero-content>.eyebrow,.hero-lead,.hero-content>.button,.hero-bottom,.image-note{opacity:1!important;transform:none!important;transition:none!important;animation:none!important}.hmi-top::after{animation:none!important;opacity:0!important}}