/* Premium buttons v2 — flat colours, no glow, no gradients. Active only under <html class="kvb">
   (now: the owner's test page; to release, add the class, this stylesheet and js/buttons-premium.js to the public page).
   Hover: a solid circle spreads from the point where the cursor came in (and shrinks back to where it left);
   the button lifts by 2 px. Press: the button sinks a little and a soft wave runs from the touch point.
   Position of the circle comes from js/buttons-premium.js (--kx/--ky/--kd); without the script it grows from the centre.
   `translate`/`scale` are used instead of `transform`, so buttons that are centred with transform keep their place. */
.kvb{--kvb-gold:#D4AF37;--kvb-gold-l:#EBCB6B;--kvb-navy:#0F1D4A;--kvb-blue:#13245C;
  --kvb-out:cubic-bezier(.22,1,.36,1);--kvb-spring:cubic-bezier(.34,1.56,.64,1)}

/* ── shared: the spreading fill + the press wave ── */
.kvb :is(.btn-gold,.press-btn,.shop-btn,.icon-btn,.back-to-top,.qty-btn,.shop-step button,.press-pill,
  #galleryPrev,#galleryNext,#galleryPlayToggle,#lightboxPrev,#lightboxNext,a.kvb-map){
  overflow:hidden;isolation:isolate;z-index:0;
  box-shadow:none !important;animation:none !important;-webkit-tap-highlight-color:transparent;
}
.kvb :is(.icon-btn:not(.back-to-top),.qty-btn,.shop-step button,#galleryPrev,#galleryNext,#galleryPlayToggle,.press-btn){position:relative}
.kvb :is(.btn-gold,.press-btn,.shop-btn,.icon-btn,.back-to-top,.qty-btn,.shop-step button,.press-pill,
  #galleryPrev,#galleryNext,#galleryPlayToggle,#lightboxPrev,#lightboxNext,a.kvb-map)::before{
  content:"";position:absolute;z-index:-1;inset:auto;
  left:var(--kx,50%);top:var(--ky,50%);width:var(--kd,300%);height:auto;aspect-ratio:1;border-radius:50%;
  background:var(--kvb-fill);transform:translate(-50%,-50%) scale(var(--kvb-s,0));
  transition:transform .6s var(--kvb-out) !important;pointer-events:none;
}
.kvb :is(.press-btn,.shop-btn,.press-pill)::after{content:none}
.kvb .kvb-ripple{position:absolute;z-index:-1;border-radius:50%;pointer-events:none;background:var(--kvb-wave);
  transform:translate(-50%,-50%) scale(0);opacity:.55;animation:kvb-wave .65s var(--kvb-out) forwards}
@keyframes kvb-wave{to{transform:translate(-50%,-50%) scale(1);opacity:0}}

/* ── primary: every «Купить билет», «Купить», form submit, the event button, the shop's main button ── */
.kvb :is(.btn-gold,.press-btn,.shop-btn:not(.ghost)){
  --kvb-fill:var(--kvb-navy);--kvb-wave:rgba(255,255,255,.38);
  background:var(--kvb-gold) !important;border:1px solid var(--kvb-gold) !important;
  color:var(--kvb-blue) !important;font-weight:600;letter-spacing:.03em;outline:none;
  transition:color .4s var(--kvb-out),translate .45s var(--kvb-out),scale .5s var(--kvb-spring) !important;
}
@media (hover:hover){
  .kvb :is(.btn-gold,.press-btn:not(:disabled),.shop-btn:not(.ghost):not(:disabled)):hover{--kvb-s:1;color:var(--kvb-gold-l) !important;translate:0 -2px}
}

/* ── secondary: round icon buttons, «Поделиться», back to top, steppers, gallery arrows, map link, shop ghost ── */
.kvb :is(.icon-btn,.back-to-top,.qty-btn,.shop-step button,.shop-btn.ghost,#galleryPrev,#galleryNext,#galleryPlayToggle,#lightboxPrev,#lightboxNext,a.kvb-map){
  --kvb-fill:var(--kvb-gold);--kvb-wave:rgba(255,255,255,.45);outline:none;
  transition:color .35s var(--kvb-out),border-color .35s var(--kvb-out),translate .45s var(--kvb-out),scale .5s var(--kvb-spring),opacity .35s var(--kvb-out) !important;
}
.kvb :is(.icon-btn:not(.back-to-top),.qty-btn,.shop-step button,#galleryPrev,#galleryNext,#galleryPlayToggle){background-color:transparent !important}
@media (hover:hover){
  .kvb :is(.icon-btn,.back-to-top,.qty-btn:not(:disabled),.shop-step button:not(:disabled),.shop-btn.ghost,#galleryPrev,#galleryNext,#galleryPlayToggle,#lightboxPrev,#lightboxNext,a.kvb-map):hover{
    --kvb-s:1;border-color:var(--kvb-gold) !important;color:var(--kvb-blue) !important;translate:0 -2px}
}
/* the back-to-top button appears with its own transform — leave it alone, lift with translate only */
.kvb .back-to-top{background:var(--void,#0B0F19) !important}

/* ── press: sink a little (spring back on release) ── */
.kvb :is(.btn-gold,.press-btn,.shop-btn,.icon-btn,.back-to-top,.qty-btn,.shop-step button,.press-pill,
  #galleryPrev,#galleryNext,#galleryPlayToggle,#lightboxPrev,#lightboxNext,a.kvb-map):not(:disabled):active{
  scale:.95;translate:0 0;transition-duration:.12s !important}

/* ── close buttons: the cross turns a quarter and becomes gold ── */
.kvb :is(.shop-x,[data-close-modal]){transition:color .3s var(--kvb-out),scale .5s var(--kvb-spring) !important}
.kvb :is(.shop-x,[data-close-modal]) svg{transition:rotate .5s var(--kvb-out)}
@media (hover:hover){
  .kvb :is(.shop-x,[data-close-modal]):hover{color:var(--kvb-gold-l) !important}
  .kvb :is(.shop-x,[data-close-modal]):hover svg{rotate:90deg}
}
.kvb :is(.shop-x,[data-close-modal]):active{scale:.88;transition-duration:.12s !important}

/* ── keyboard focus: a plain gold ring (no glow) ── */
.kvb :is(.btn-gold,.press-btn,.shop-btn,.icon-btn,.back-to-top,.qty-btn,.shop-step button,.press-pill,.shop-x,[data-close-modal],
  #galleryPrev,#galleryNext,#galleryPlayToggle,#lightboxPrev,#lightboxNext,a.kvb-map):focus-visible{outline:2px solid var(--kvb-gold-l);outline-offset:3px}

/* ── the event block: flat badge, hero pill with a soft gold fill ── */
.kvb .press-badge,.kvb .shop-badge{background:var(--kvb-gold) !important;animation:none !important;color:var(--kvb-blue)}
.kvb .press-pill{--kvb-fill:rgba(212,175,55,.2);--kvb-wave:rgba(212,175,55,.35);
  background:rgba(212,175,55,.07) !important;border-color:rgba(212,175,55,.55);
  transition:border-color .35s var(--kvb-out),translate .45s var(--kvb-out),scale .5s var(--kvb-spring) !important}
.kvb .press-pill-star{background:#9A6F18 !important;box-shadow:none !important;transition:rotate .6s var(--kvb-out)}
@media (hover:hover){
  .kvb .press-pill:hover{--kvb-s:1;border-color:var(--kvb-gold);background:rgba(212,175,55,.07) !important;translate:0 -2px}
  .kvb .press-pill:hover .press-pill-star{rotate:-8deg}
}
.kvb .press-bar span{background:var(--kvb-gold) !important;animation:none !important}

@media (prefers-reduced-motion:reduce){
  .kvb :is(.btn-gold,.press-btn,.shop-btn,.icon-btn,.back-to-top,.qty-btn,.shop-step button,.press-pill,
    #galleryPrev,#galleryNext,#galleryPlayToggle,#lightboxPrev,#lightboxNext,a.kvb-map)::before{transition:none !important}
  .kvb .kvb-ripple{display:none}
  .kvb :is(.btn-gold,.press-btn,.shop-btn,.icon-btn,.back-to-top,.qty-btn,.shop-step button,.press-pill){translate:none !important}
}
