/* ripa rörelser – alla avstängda vid prefers-reduced-motion. Klasser används på elementen som anges i README.
   Redesign (Beta 2): designkitet oförändrat, utom att reduced-motion-regeln avgränsas till kitets egna klasser
   så att appens övriga animationer (karta, startscen) inte ändrar beteende. */
@property --n{syntax:'<integer>';inherits:false;initial-value:0}
.cnt{counter-reset:n var(--n);animation:cnt 1s cubic-bezier(.2,.8,.2,1) .35s both}
.cnt::after{content:counter(n)}
@keyframes cnt{from{--n:0}to{--n:var(--to)}}
.e-push{animation:push .32s cubic-bezier(.2,.8,.2,1) both}
@keyframes push{from{transform:translateX(44px);opacity:0}}
.e-pop{animation:pop .28s cubic-bezier(.2,.8,.2,1) both}
@keyframes pop{from{transform:translateX(-32px);opacity:0}}
.e-tab{animation:fade .25s ease both}
@keyframes fade{from{opacity:0}}
.e-sheet{animation:sheet .55s cubic-bezier(.6,0,.2,1) both}
@keyframes sheet{from{clip-path:inset(69% 3% 13% 3% round 26px)}to{clip-path:inset(0 0 0 0 round 0)}}
.hrise .mtn path{animation:rise .7s cubic-bezier(.2,.8,.2,1) both}
.hrise .mtn path:nth-of-type(1){--ry:70px;animation-delay:.25s}
.hrise .mtn path:nth-of-type(2),.hrise .mtn path:nth-of-type(3),.hrise .mtn path:nth-of-type(4){--ry:100px;animation-delay:.35s}
.hrise .mtn path:nth-of-type(5){--ry:130px;animation-delay:.45s}
.hrise .mtn path:nth-of-type(6){animation:none}
@keyframes rise{from{transform:translateY(var(--ry,90px))}}
.hrise h1{animation:up .5s cubic-bezier(.2,.8,.2,1) .5s both}
@keyframes up{from{transform:translateY(24px);opacity:0}}
.pinglide{animation:glide .38s cubic-bezier(.65,0,.35,1) both}
@keyframes glide{0%{transform:translate(var(--dx),0)}50%{transform:translate(calc(var(--dx) / 2),-10px)}100%{transform:none}}
.pindrop{animation:drop .5s cubic-bezier(.34,1.56,.64,1) .75s both}
@keyframes drop{from{transform:translateY(-26px);opacity:0}}
.sl-r{animation:slr .35s cubic-bezier(.2,.8,.2,1) both}
@keyframes slr{from{transform:translateX(40px);opacity:0}}
.sl-l{animation:sll .35s cubic-bezier(.2,.8,.2,1) both}
@keyframes sll{from{transform:translateX(-40px);opacity:0}}
.grow{transform-origin:50% 100%;animation:grow .6s cubic-bezier(.2,.8,.2,1) both}
@keyframes grow{from{transform:scaleY(0)}}
.capgrow{transform-box:fill-box;transform-origin:50% 0;animation:capg .9s cubic-bezier(.2,.8,.2,1) .45s both}
@keyframes capg{from{transform:scaleY(0)}}
.ringfill{animation:ringf .9s cubic-bezier(.2,.8,.2,1) both}
@keyframes ringf{from{stroke-dasharray:0 113.1}}
.draw{stroke-dasharray:1;animation:draw 1.1s cubic-bezier(.4,0,.2,1) .3s both}
.draw.slow{animation-duration:20s;animation-timing-function:linear}
@keyframes draw{from{stroke-dashoffset:1}}
.ripple{position:absolute;left:50%;bottom:150px;width:40px;height:40px;margin-left:-20px;border-radius:50%;background:#E0342A;animation:rip .75s cubic-bezier(.4,0,.2,1) both;pointer-events:none;z-index:5}
@keyframes rip{0%{transform:scale(1);opacity:1}65%{transform:scale(48);opacity:1}100%{transform:scale(48);opacity:0}}
.dotpulse{animation:pulse 1.4s ease-in-out infinite}
@keyframes pulse{50%{box-shadow:0 0 0 11px rgba(224,52,42,.08)}}
.climb{animation:climb 2.2s cubic-bezier(.65,0,.35,1) .6s both}
@keyframes climb{0.0%{transform:translate(60.0px,86.0px)}28.8%{transform:translate(120.0px,70.0px)}47.5%{transform:translate(82.0px,56.0px)}75.4%{transform:translate(140.0px,40.0px)}91.5%{transform:translate(108.0px,26.0px)}100.0%{transform:translate(124.9px,19.1px)}}
@media (prefers-reduced-motion: reduce){
  :is(.cnt,.e-push,.e-pop,.e-tab,.e-sheet,.hrise .mtn path,.hrise h1,.pinglide,.pindrop,.sl-r,.sl-l,.grow,.capgrow,.ringfill,.draw,.ripple,.dotpulse,.climb){animation:none !important}
  /* cnt utan animation: siffran visas direkt (--n sätts till slutvärdet). */
  .cnt{--n:var(--to)}
}