/* Слой современных анимаций PolitWorld: живёт поверх базовых стилей и ничего в них не ломает.
   Всё, что двигается, отключается при prefers-reduced-motion. */

/* ---------- полоса прочтения страницы ---------- */
#prog {
  position: fixed; left: 0; top: 0; height: 3px; width: 0; z-index: 120;
  background: linear-gradient(90deg, var(--gold), var(--gold2));
  box-shadow: 0 0 18px rgba(242, 193, 78, .7);
  transition: width .08s linear;
}

/* ---------- шапка ---------- */
#hdr { transition: padding .35s var(--ease), backdrop-filter .35s var(--ease), background .35s var(--ease); }
#hdr.sm { backdrop-filter: saturate(1.3) blur(14px); }

/* подсветка пунктов меню — одна «капля», которая перетекает от кнопки к кнопке */
.links { position: relative; }
.links a { position: relative; z-index: 1; }
.links a:hover { background: transparent; }        /* фон рисует капля, а не сама ссылка */
.links .glide {
  position: absolute; top: 4px; bottom: 4px; left: 0; width: 0; z-index: 0; opacity: 0;
  border-radius: 999px; pointer-events: none;
  background: rgba(242, 193, 78, .28);
  box-shadow: inset 0 0 0 1px rgba(242, 193, 78, .45);
  transition: transform .42s var(--ease), width .42s var(--ease), opacity .25s var(--ease);
}

/* ---------- карточки: лёгкий наклон под курсор, без светового пятна ---------- */
.rank, .pcard { transform-style: preserve-3d; will-change: transform; }
.rank.tilt, .pcard.tilt {
  transform: perspective(900px) rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg)) translateY(-6px);
  transition: transform .18s var(--ease);
}
.rank.tilt { box-shadow: 0 30px 60px rgba(4, 8, 20, .2); }

/* ---------- клики: волна от точки нажатия ---------- */
.btn, .ip, .cartBtn { position: relative; overflow: hidden; }
.rip {
  position: absolute; border-radius: 50%; pointer-events: none; transform: translate(-50%, -50%) scale(0);
  background: radial-gradient(circle, rgba(255, 255, 255, .55), rgba(255, 255, 255, 0) 70%);
  animation: rip .55s var(--ease) forwards;
}
.btn.gold .rip { background: radial-gradient(circle, rgba(27, 36, 51, .28), rgba(27, 36, 51, 0) 70%); }
@keyframes rip { to { transform: translate(-50%, -50%) scale(1); opacity: 0; } }

/* ---------- корзина: пружинка и летящий значок ---------- */
.cartBtn.bump { animation: bump .5s var(--ease); }
@keyframes bump { 0% { transform: scale(1); } 35% { transform: scale(1.18); } 65% { transform: scale(.94); } 100% { transform: scale(1); } }
.fly {
  position: fixed; z-index: 140; width: 26px; height: 26px; border-radius: 50%; pointer-events: none;
  background: linear-gradient(140deg, var(--gold2), var(--gold));
  box-shadow: 0 8px 22px rgba(242, 193, 78, .55);
  transition: transform .62s cubic-bezier(.35, .8, .35, 1), opacity .62s ease;
}

/* ---------- цифры счётчиков не прыгают при пересчёте ---------- */
.counter b, .onbar b, #cartGrand, #paySum { font-variant-numeric: tabular-nums; }

/* ---------- всплывающее окно: мягкое появление ---------- */
.modal { backdrop-filter: blur(0); transition: backdrop-filter .3s var(--ease); }
.modal.on { backdrop-filter: blur(6px); }
.modal .box { animation: boxIn .38s var(--ease) both; }
@keyframes boxIn { from { opacity: 0; transform: translateY(18px) scale(.97); } to { opacity: 1; transform: none; } }

/* ---------- кнопка «наверх»: вырастает, а не появляется рывком ---------- */
.toTop { opacity: 0; transform: translateY(10px) scale(.9); transition: opacity .3s var(--ease), transform .3s var(--ease); }
.toTop.on { opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
  #prog { display: none; }
  .rank.tilt, .pcard.tilt { transform: none; }
  .links .glide { transition: none; }
  .rip, .fly { display: none; }
}