/* Logo de Rently: se dibuja al aparecer, la flecha sube, la llave gira al pasar el cursor y un brillo recorre el degradado */
.rl { display: inline-flex; align-items: center; gap: .32em; line-height: 1; color: inherit; text-decoration: none; }
.rl-mark { flex: none; overflow: visible; }
.rl-txt { display: grid; gap: .28em; }
.rl-word { font-family: Montserrat, system-ui, sans-serif; font-weight: 800; letter-spacing: .04em; font-size: 1em; }
.rl-tag { font-family: Montserrat, system-ui, sans-serif; font-weight: 600; letter-spacing: .14em; font-size: .36em; text-transform: uppercase; opacity: .75; }
.rl-mark .rl-r { stroke-dasharray: 1; stroke-dashoffset: 1; animation: rlDraw 1.1s cubic-bezier(.65, 0, .35, 1) forwards; }
.rl-mark .rl-arrow .rl-r { animation-delay: .45s; }
.rl-mark .rl-arrow .rl-h { animation-delay: .8s; animation-duration: .5s; }
.rl-mark .rl-key .rl-r { animation-delay: .7s; animation-duration: .6s; }
.rl-mark .rl-arrow { transform-origin: 50px 70px; animation: rlLift 2.6s ease-in-out 1.4s infinite; }
.rl-mark .rl-key { transform-box: fill-box; transform-origin: 0 0; transition: transform .5s cubic-bezier(.34, 1.56, .64, 1); }
.rl:hover .rl-key, .rl-mark:hover .rl-key { transform: rotate(-18deg); }
.rl:hover .rl-arrow, .rl-mark:hover .rl-arrow { animation-duration: 1.1s; }
@keyframes rlDraw { to { stroke-dashoffset: 0; } }
@keyframes rlLift { 0%, 100% { transform: translate(0, 0); } 50% { transform: translate(3px, -3px); } }
@media (prefers-reduced-motion: reduce) {
  .rl-mark .rl-r { animation: none; stroke-dashoffset: 0; }
  .rl-mark .rl-arrow { animation: none; }
}
/* la R crece con el tamaño de letra del lugar donde va */
.rl .rl-mark { width: 1.45em; height: 1.45em; margin: -.12em 0; }