/* Ярмарочная улица парка (разметка: roadmap/_src/fair.py). Подключается и на главной лендинга, и в роадмапе.
   Двигаются только части через transform и opacity; при «уменьшить движение» всё стоит. */
.fair{position:relative;display:flex;align-items:flex-end;justify-content:space-between;gap:12px;padding:0 6px;pointer-events:none}
.fair::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:linear-gradient(90deg,transparent,rgba(239,229,202,.35) 12%,rgba(239,229,202,.35) 88%,transparent)}
/* Тёплое свечение ярмарки у земли */
.fair::before{content:"";position:absolute;left:4%;right:4%;bottom:0;height:70%;background:radial-gradient(60% 100% at 50% 100%,rgba(246,201,40,.13),transparent 70%);pointer-events:none}
.fair-item{display:block;flex:none;height:var(--fh,120px);width:auto;overflow:visible}
.fair-booth{--fh:132px}
.fair-popcorn{--fh:146px}
.fair-carousel{--fh:148px}
.fair-ferris{--fh:208px}
.fair-cotton{--fh:144px}
.fair-balloons{--fh:162px}
.fair-lamp{--fh:118px}
.fair-halo{transform-origin:center;animation:fairHalo 2.2s ease-in-out infinite alternate}
.fair-lamp--1 .fair-glow,.fair-lamp--1 .fair-halo{animation-delay:-.7s}.fair-lamp--2 .fair-glow,.fair-lamp--2 .fair-halo{animation-delay:-1.4s}
@keyframes fairHalo{from{opacity:.5;transform:scale(.85)}to{opacity:1;transform:scale(1.1)}}
.fair-item *{transform-box:fill-box}

/* Огоньки и окно кассы мерцают */
.fair-glow{animation:fairGlow 2.6s ease-in-out infinite alternate}
.fair-bulb{animation:fairBulb 1.4s ease-in-out infinite alternate}
.fair-bulb--1{animation-delay:-.45s}.fair-bulb--2{animation-delay:-.9s}
@keyframes fairGlow{from{opacity:.55}to{opacity:1}}
@keyframes fairBulb{from{opacity:.35}to{opacity:1}}

/* Колесо обозрения крутится, лошадки карусели скачут, флажок машет */
.fair-wheel{transform-origin:center;animation:fairSpin 32s linear infinite}
@keyframes fairSpin{to{transform:rotate(360deg)}}
.fair-horse{animation:fairHorse 1.5s ease-in-out infinite alternate}
.fair-horse--2,.fair-horse--4{animation-delay:-.75s}
@keyframes fairHorse{from{transform:translateY(-6px)}to{transform:translateY(5px)}}
.fair-flag{transform-origin:0 50%;animation:fairFlag 1.2s ease-in-out infinite alternate}
@keyframes fairFlag{from{transform:scaleX(.7)}to{transform:scaleX(1.1)}}

/* Попкорн подлетает из котла */
.fair-kernel{opacity:0;animation:fairPop 2.4s ease-out infinite}
.fair-kernel--2{animation-delay:.8s}.fair-kernel--3{animation-delay:1.6s}
@keyframes fairPop{0%{opacity:0;transform:translateY(6px) scale(.4)}15%{opacity:1}70%{opacity:1;transform:translateY(-26px) scale(1)}100%{opacity:0;transform:translateY(-20px) scale(1)}}

/* Сладкая вата покачивается, шары парят */
.fair-candy{transform-origin:50% 100%;animation:fairCandy 2.2s ease-in-out infinite alternate}
.fair-candy--2{animation-delay:-.7s}.fair-candy--3{animation-delay:-1.4s}
@keyframes fairCandy{from{transform:rotate(-5deg)}to{transform:rotate(5deg)}}
.fair-bunch{transform-origin:50% 100%;animation:fairBunch 3.2s ease-in-out infinite alternate}
@keyframes fairBunch{from{transform:translateY(0) rotate(-3deg)}to{transform:translateY(-8px) rotate(3deg)}}

@media (max-width:900px){
  .fair{gap:6px}
  .fair-booth{--fh:84px}.fair-popcorn{--fh:92px}.fair-carousel{--fh:94px}.fair-ferris{--fh:132px}.fair-cotton{--fh:92px}.fair-balloons{--fh:102px}.fair-lamp{--fh:74px}
  .fair-lamp--2{display:none}
}
@media (max-width:560px){
  .fair-booth,.fair-carousel,.fair-lamp{display:none}
  .fair-popcorn{--fh:80px}.fair-ferris{--fh:112px}.fair-cotton{--fh:80px}.fair-balloons{--fh:90px}
}
@media (prefers-reduced-motion:reduce){
  .fair *{animation:none!important}
  .fair-kernel{opacity:0}
}