.city-hero::after{content:"";position:absolute;pointer-events:none;right:-90px;top:-80px;width:min(74vw,620px);height:460px;background:radial-gradient(ellipse at 60% 30%,#dfbe805e,transparent 68%),radial-gradient(ellipse at 20% 70%,#84adc74a,transparent 62%);animation:hero-daylight 9s ease-in-out infinite;transform-origin:center;z-index:0}
.city-hero__inner{z-index:1}.city-hero__main{animation:hero-arrive .8s ease-out both}
.hero-motion-line{position:relative;display:inline-block;padding-bottom:7px}.hero-motion-line::after{content:"";position:absolute;left:0;bottom:0;height:4px;width:46%;border-radius:5px;background:linear-gradient(90deg,#b68c44,#dac28e);transform-origin:left;animation:hero-underline 4.8s ease-in-out infinite}
.hero-motion-arrow{display:inline-block;margin-left:3px;animation:hero-arrow 2.8s ease-in-out infinite}
@keyframes hero-daylight{0%,100%{transform:translate(-12px,0) scale(1);opacity:.65}50%{transform:translate(20px,20px) scale(1.06);opacity:1}}
@keyframes hero-arrive{from{opacity:.55;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
@keyframes hero-underline{0%,100%{transform:scaleX(.8);opacity:.7}50%{transform:scaleX(1);opacity:1}}
@keyframes hero-arrow{0%,35%,100%{transform:translateY(0)}55%{transform:translateY(4px)}75%{transform:translateY(1px)}}
.city-hero.hero-resting::after,.city-hero.hero-resting .hero-motion-line::after,.city-hero.hero-resting .hero-motion-arrow{animation-play-state:paused}
@media(max-width:600px){.city-hero::after{right:-55px;top:-25px;width:320px;height:400px}.hero-motion-line{padding-bottom:6px}.hero-motion-line::after{height:3px;width:52%}}
@media(prefers-reduced-motion:reduce){.city-hero::after,.city-hero__main,.hero-motion-line::after,.hero-motion-arrow{animation:none!important;transition:none!important;transform:none!important}.city-hero__main{opacity:1}.city-hero::after{opacity:.7}}
