/* ==========================================================
   Salient Advanced Button Module  v2.0
   ========================================================== */

/* ── CSS Variables (defaults) ──────────────────────────── */
.sab-btn {
  --sab-bg:           #3b5de7;
  --sab-bg2:          #45cafc;
  --sab-text:         #ffffff;
  --sab-border-color: #3b5de7;
  --sab-bg-hover:     #2a4bc7;
  --sab-text-hover:   #ffffff;
  --sab-border-hover: #2a4bc7;
  --sab-border-width: 2px;
  --sab-border-style: solid;
  --sab-radius:       4px;
  --sab-transition:   300ms ease-out;
  --sab-opacity:      1;
  --sab-icon-size:    1em;
  --sab-icon-color:   inherit;
  --sab-px:           auto;
  --sab-py:           auto;
}

/* ── Wrapper ────────────────────────────────────────────── */
.sab-wrap {
  display: block;
  width: 100%;
  line-height: 1;
}

/* ── Base Button ─────────────────────────────────────────── */
.sab-btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5em;
  font-family: inherit;
  text-decoration: none;
  cursor: pointer;
  overflow: hidden;
  border-radius: var(--sab-radius);
  border-width: var(--sab-border-width);
  border-style: var(--sab-border-style);
  transition:
    background var(--sab-transition),
    color var(--sab-transition),
    border-color var(--sab-transition),
    box-shadow var(--sab-transition),
    transform var(--sab-transition),
    opacity var(--sab-transition);
  -webkit-tap-highlight-color: transparent;
  user-select: none;
  white-space: nowrap;
  vertical-align: middle;
  appearance: none;
  -webkit-appearance: none;
}

.sab-btn:focus-visible {
  outline: 3px solid var(--sab-bg);
  outline-offset: 3px;
}

.sab-btn.sab-disabled,
.sab-btn[disabled] {
  opacity: 0.45;
  pointer-events: none;
  cursor: not-allowed;
}

/* ══════════════════════════════════════════════════════════
   SIZES
   ══════════════════════════════════════════════════════════ */
.sab-size-xs  { font-size: 0.7rem;  padding: 0.35em 0.75em; }
.sab-size-sm  { font-size: 0.85rem; padding: 0.5em  1.1em;  }
.sab-size-md  { font-size: 1rem;    padding: 0.65em 1.5em;  }
.sab-size-lg  { font-size: 1.15rem; padding: 0.75em 1.9em;  }
.sab-size-xl  { font-size: 1.35rem; padding: 0.85em 2.3em;  }
.sab-size-xxl { font-size: 1.7rem;  padding: 1em    2.8em;  }
.sab-size-full {
  font-size: 1rem;
  padding: 0.75em 1.5em;
  width: 100%;
  display: flex;
}

/* Custom padding override */
.sab-btn[style*="--sab-px"] {
  padding-left:  var(--sab-px, 1.5em);
  padding-right: var(--sab-px, 1.5em);
}
.sab-btn[style*="--sab-py"] {
  padding-top:    var(--sab-py, 0.65em);
  padding-bottom: var(--sab-py, 0.65em);
}

/* ══════════════════════════════════════════════════════════
   STYLES
   ══════════════════════════════════════════════════════════ */

/* Solid */
.sab-style-solid {
  background-color: var(--sab-bg);
  color:            var(--sab-text);
  border-color:     var(--sab-border-color);
  opacity:          var(--sab-opacity);
}
.sab-style-solid:hover {
  background-color: var(--sab-bg-hover);
  color:            var(--sab-text-hover);
  border-color:     var(--sab-border-hover);
}

/* Outline */
.sab-style-outline {
  background-color: transparent;
  color:            var(--sab-bg);
  border-color:     var(--sab-border-color);
}
.sab-style-outline:hover {
  background-color: var(--sab-bg-hover);
  color:            var(--sab-text-hover);
  border-color:     var(--sab-border-hover);
}

/* Ghost */
.sab-style-ghost {
  background-color: transparent;
  color:            var(--sab-text);
  border-color:     transparent;
}
.sab-style-ghost:hover {
  background-color: rgba(255,255,255,.12);
  color:            var(--sab-text-hover);
}

/* Gradient poziomy */
.sab-style-gradient-h {
  background: linear-gradient(90deg, var(--sab-bg), var(--sab-bg2));
  color:       var(--sab-text);
  border:      none;
}
.sab-style-gradient-h:hover {
  background: linear-gradient(90deg, var(--sab-bg2), var(--sab-bg));
}

/* Gradient ukośny */
.sab-style-gradient-d {
  background: linear-gradient(135deg, var(--sab-bg), var(--sab-bg2));
  color:       var(--sab-text);
  border:      none;
}
.sab-style-gradient-d:hover {
  background: linear-gradient(135deg, var(--sab-bg2), var(--sab-bg));
}

/* Gradient pionowy */
.sab-style-gradient-v {
  background: linear-gradient(180deg, var(--sab-bg), var(--sab-bg2));
  color:       var(--sab-text);
  border:      none;
}
.sab-style-gradient-v:hover {
  background: linear-gradient(180deg, var(--sab-bg2), var(--sab-bg));
}

/* Neon Glow */
.sab-style-neon {
  background-color: transparent;
  color:            var(--sab-bg);
  border-color:     var(--sab-bg);
  box-shadow:
    0 0 6px  var(--sab-bg),
    0 0 20px var(--sab-bg),
    inset 0 0 6px var(--sab-bg);
  text-shadow: 0 0 8px var(--sab-bg);
}
.sab-style-neon:hover {
  background-color: var(--sab-bg);
  color:            #000;
  box-shadow:
    0 0 12px var(--sab-bg),
    0 0 40px var(--sab-bg),
    0 0 80px var(--sab-bg);
}

/* Duotone */
.sab-style-duotone {
  background: linear-gradient(90deg, var(--sab-bg) 50%, var(--sab-bg2) 50%);
  color:       var(--sab-text);
  border:      none;
}
.sab-style-duotone:hover {
  background: linear-gradient(90deg, var(--sab-bg2) 50%, var(--sab-bg) 50%);
}

/* Neumorphism */
.sab-style-neumorphic {
  background:       #e0e5ec;
  color:            var(--sab-bg);
  border:           none;
  box-shadow:
    6px 6px 12px #b8bec7,
    -6px -6px 12px #ffffff;
}
.sab-style-neumorphic:hover {
  box-shadow:
    inset 4px 4px 8px #b8bec7,
    inset -4px -4px 8px #ffffff;
}

/* Glassmorphism */
.sab-style-glass {
  background:       rgba(255,255,255,0.15);
  color:            var(--sab-text);
  border-color:     rgba(255,255,255,0.35);
  backdrop-filter:  blur(10px);
  -webkit-backdrop-filter: blur(10px);
  box-shadow:       0 4px 24px rgba(0,0,0,0.12);
}
.sab-style-glass:hover {
  background: rgba(255,255,255,0.28);
}

/* Retro 3D */
.sab-style-retro {
  background-color: var(--sab-bg);
  color:            var(--sab-text);
  border:           none;
  box-shadow:       4px 4px 0 var(--sab-bg-hover);
}
.sab-style-retro:hover {
  transform:   translate(2px, 2px);
  box-shadow:  2px 2px 0 var(--sab-bg-hover);
}
.sab-style-retro:active {
  transform:  translate(4px, 4px);
  box-shadow: none;
}

/* Flat shadow */
.sab-style-flat-shadow {
  background-color: var(--sab-bg);
  color:            var(--sab-text);
  border:           none;
  box-shadow:       0 6px 0 var(--sab-bg-hover);
}
.sab-style-flat-shadow:hover {
  transform:  translateY(3px);
  box-shadow: 0 3px 0 var(--sab-bg-hover);
}
.sab-style-flat-shadow:active {
  transform:  translateY(6px);
  box-shadow: none;
}

/* 3D Wytłoczony */
.sab-style-3d {
  background: linear-gradient(to bottom, color-mix(in srgb, var(--sab-bg) 85%, #fff), var(--sab-bg));
  color:      var(--sab-text);
  border:     none;
  box-shadow:
    0 2px 0 var(--sab-bg-hover),
    0 4px 6px rgba(0,0,0,0.3);
}
.sab-style-3d:hover {
  transform: translateY(1px);
  box-shadow:
    0 1px 0 var(--sab-bg-hover),
    0 2px 3px rgba(0,0,0,0.2);
}
.sab-style-3d:active {
  transform:  translateY(2px);
  box-shadow: none;
}

/* Text only */
.sab-style-text-only {
  background: transparent;
  color:      var(--sab-bg);
  border:     none;
  padding-left: 0;
  padding-right: 0;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.sab-style-text-only:hover {
  color: var(--sab-bg-hover);
  text-decoration-color: var(--sab-bg-hover);
}

/* Pill */
.sab-style-pill {
  background-color: var(--sab-bg);
  color:            var(--sab-text);
  border-color:     var(--sab-border-color);
  border-radius:    9999px !important;
}
.sab-style-pill:hover {
  background-color: var(--sab-bg-hover);
  color:            var(--sab-text-hover);
}

/* Pill Outline */
.sab-style-pill-outline {
  background:   transparent;
  color:        var(--sab-bg);
  border-color: var(--sab-border-color);
  border-radius: 9999px !important;
}
.sab-style-pill-outline:hover {
  background-color: var(--sab-bg-hover);
  color:            var(--sab-text-hover);
  border-color:     var(--sab-border-hover);
}

/* Sharp */
.sab-style-sharp {
  background-color: var(--sab-bg);
  color:            var(--sab-text);
  border-color:     var(--sab-border-color);
  border-radius:    0 !important;
}
.sab-style-sharp:hover {
  background-color: var(--sab-bg-hover);
}

/* Double border */
.sab-style-double-border {
  background:     transparent;
  color:          var(--sab-bg);
  border:         var(--sab-border-width) var(--sab-border-style) var(--sab-border-color);
  box-shadow:     inset 0 0 0 calc(var(--sab-border-width) * 2) var(--sab-border-color);
}
.sab-style-double-border:hover {
  background:  var(--sab-bg-hover);
  color:       var(--sab-text-hover);
  box-shadow:  inset 0 0 0 calc(var(--sab-border-width) * 2) var(--sab-border-hover);
  border-color: var(--sab-border-hover);
}

/* Split */
.sab-style-split {
  background: linear-gradient(90deg, var(--sab-bg) 0%, var(--sab-bg) 50%, var(--sab-bg2) 50%, var(--sab-bg2) 100%);
  color:       var(--sab-text);
  border:      none;
}
.sab-style-split .sab-text { mix-blend-mode: difference; }

/* Underline */
.sab-style-underline {
  background:     transparent;
  color:          var(--sab-bg);
  border:         none;
  border-bottom:  var(--sab-border-width) var(--sab-border-style) var(--sab-border-color);
  border-radius:  0 !important;
  padding-left:   0;
  padding-right:  0;
}
.sab-style-underline:hover {
  color:        var(--sab-bg-hover);
  border-color: var(--sab-border-hover);
}

/* ══════════════════════════════════════════════════════════
   BOX SHADOW PRESETS
   ══════════════════════════════════════════════════════════ */
.sab-shadow-sm      { box-shadow: 0 1px 3px  rgba(0,0,0,0.14) !important; }
.sab-shadow-md      { box-shadow: 0 4px 10px rgba(0,0,0,0.18) !important; }
.sab-shadow-lg      { box-shadow: 0 8px 20px rgba(0,0,0,0.22) !important; }
.sab-shadow-xl      { box-shadow: 0 14px 35px rgba(0,0,0,0.28) !important; }
.sab-shadow-colored { box-shadow: 0 8px 24px var(--sab-bg) !important; opacity: 0.8; }
.sab-shadow-neon    { box-shadow: 0 0 15px var(--sab-bg), 0 0 30px var(--sab-bg) !important; }
.sab-shadow-inset   { box-shadow: inset 0 2px 6px rgba(0,0,0,0.25) !important; }

/* ══════════════════════════════════════════════════════════
   HOVER ANIMATIONS
   ══════════════════════════════════════════════════════════ */

/* Scale up */
.sab-hover-scale-up:hover  { transform: scale(1.06); }
/* Scale down */
.sab-hover-scale-down:hover{ transform: scale(0.94); }
/* Lift */
.sab-hover-lift:hover      { transform: translateY(-3px); box-shadow: 0 10px 24px rgba(0,0,0,0.2); }
/* Press */
.sab-hover-press:hover     { transform: scale(0.96) translateY(2px); }
/* Bounce */
.sab-hover-bounce:hover    { animation: sab-bounce-h .4s ease; }
/* Jitter */
.sab-hover-jitter:hover    { animation: sab-jitter .3s linear; }
/* Rotate-skew */
.sab-hover-rotate-skew:hover { transform: rotate(-2deg) skewX(-4deg); }
/* Glow pulse */
.sab-hover-glow-pulse:hover { animation: sab-glow-pulse 1s ease-in-out infinite alternate; }

/* Fill animations – require pseudo element */
.sab-hover-fill-left::before,
.sab-hover-fill-right::before,
.sab-hover-fill-bottom::before,
.sab-hover-fill-top::before,
.sab-hover-fill-diagonal::before,
.sab-hover-sweep::before,
.sab-hover-shutter::before,
.sab-hover-outline-grow::before {
  content: '';
  position: absolute;
  background: var(--sab-bg-hover);
  z-index: 0;
  transition: transform var(--sab-transition);
}
.sab-btn > * { position: relative; z-index: 1; }

.sab-hover-fill-left::before  { inset: 0; transform: scaleX(0); transform-origin: left;   }
.sab-hover-fill-right::before { inset: 0; transform: scaleX(0); transform-origin: right;  }
.sab-hover-fill-bottom::before{ inset: 0; transform: scaleY(0); transform-origin: bottom; }
.sab-hover-fill-top::before   { inset: 0; transform: scaleY(0); transform-origin: top;    }
.sab-hover-fill-diagonal::before { inset: 0; transform: scale(0) rotate(45deg); transform-origin: center; }

.sab-hover-fill-left:hover::before,
.sab-hover-fill-right:hover::before,
.sab-hover-fill-bottom:hover::before,
.sab-hover-fill-top:hover::before { transform: scale(1); }
.sab-hover-fill-diagonal:hover::before { transform: scale(2) rotate(45deg); }

.sab-hover-fill-left:hover,
.sab-hover-fill-right:hover,
.sab-hover-fill-bottom:hover,
.sab-hover-fill-top:hover,
.sab-hover-fill-diagonal:hover { color: var(--sab-text-hover); border-color: var(--sab-border-hover); }

/* Sweep */
.sab-hover-sweep::before {
  inset: 0;
  transform: translateX(-110%);
  transform-origin: left;
  border-radius: inherit;
}
.sab-hover-sweep:hover::before { transform: translateX(0); }
.sab-hover-sweep:hover { color: var(--sab-text-hover); border-color: var(--sab-border-hover); }

/* Shutter (vertical) */
.sab-hover-shutter::before {
  left: 0; right: 0; top: 0; bottom: 0;
  transform: scaleY(0);
  transform-origin: top;
  border-radius: inherit;
}
.sab-hover-shutter:hover::before { transform: scaleY(1); }
.sab-hover-shutter:hover { color: var(--sab-text-hover); border-color: var(--sab-border-hover); }

/* Outline grow */
.sab-hover-outline-grow::before {
  inset: -4px;
  background: transparent;
  border: 3px solid var(--sab-bg-hover);
  border-radius: inherit;
  transform: scale(0.8);
  opacity: 0;
}
.sab-hover-outline-grow:hover::before {
  transform: scale(1);
  opacity: 1;
}

/* Ripple */
.sab-ripple-container {
  position: absolute;
  inset: 0;
  overflow: hidden;
  border-radius: inherit;
  pointer-events: none;
}
.sab-ripple {
  position: absolute;
  border-radius: 50%;
  background: rgba(255,255,255,0.38);
  transform: scale(0);
  animation: sab-ripple-anim 0.6s linear;
  pointer-events: none;
}

/* ══════════════════════════════════════════════════════════
   ICON
   ══════════════════════════════════════════════════════════ */
.sab-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: var(--sab-icon-size, 1em);
  color: var(--sab-icon-color, currentColor);
  line-height: 1;
  flex-shrink: 0;
}

.sab-icon-circle {
  width:  1.8em;
  height: 1.8em;
  border-radius: 50%;
  background: rgba(255,255,255,0.2);
  font-size: calc(var(--sab-icon-size, 1em) * 0.85);
}

/* Icon animations */
.sab-icon-anim-slide-right:hover .sab-icon  { animation: sab-slide-right 0.35s ease forwards; }
.sab-icon-anim-slide-left:hover  .sab-icon  { animation: sab-slide-left  0.35s ease forwards; }
.sab-icon-anim-rotate:hover      .sab-icon  { animation: sab-rotate      0.4s  ease forwards; }
.sab-icon-anim-spin:hover        .sab-icon  { animation: sab-spin        0.6s  linear; }
.sab-icon-anim-scale:hover       .sab-icon  { animation: sab-scale-icon  0.3s  ease forwards; }
.sab-icon-anim-shake:hover       .sab-icon  { animation: sab-shake       0.4s  ease; }
.sab-icon-anim-pulse             .sab-icon  { animation: sab-pulse-icon  1.2s  ease-in-out infinite; }
.sab-icon-anim-bounce            .sab-icon  { animation: sab-bounce-v    0.7s  ease-in-out infinite; }

/* ══════════════════════════════════════════════════════════
   ENTRANCE ANIMATIONS
   ══════════════════════════════════════════════════════════ */
.sab-entrance-pending { opacity: 0; }

/* ══════════════════════════════════════════════════════════
   BADGE
   ══════════════════════════════════════════════════════════ */
.sab-badge {
  position: absolute;
  top:   -0.55em;
  right: -0.6em;
  min-width: 1.4em;
  height: 1.4em;
  padding: 0 0.3em;
  border-radius: 9999px;
  font-size: 0.6em;
  font-weight: 700;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  animation: sab-badge-pop 0.4s cubic-bezier(0.34,1.56,0.64,1) both;
  z-index: 2;
}

/* ══════════════════════════════════════════════════════════
   LOADER
   ══════════════════════════════════════════════════════════ */
.sab-loader {
  display: none;
  width:  1em;
  height: 1em;
  border: 2px solid rgba(255,255,255,0.4);
  border-top-color: #fff;
  border-radius: 50%;
  animation: sab-spin-anim 0.7s linear infinite;
  flex-shrink: 0;
}
.sab-btn.is-loading .sab-loader { display: inline-block; }
.sab-btn.is-loading .sab-text   { opacity: 0.6; }
.sab-btn.is-loading .sab-icon   { opacity: 0; }

/* ══════════════════════════════════════════════════════════
   ATTENTION PULSE
   ══════════════════════════════════════════════════════════ */
.sab-attention-pulse {
  animation: sab-attention 2.5s ease-in-out infinite;
}

/* ══════════════════════════════════════════════════════════
   RESPONSIVE
   ══════════════════════════════════════════════════════════ */
@media (max-width: 767px) {
  .sab-full-mobile {
    display: flex !important;
    width: 100% !important;
  }
  .sab-size-xl,
  .sab-size-xxl {
    font-size: 1.1rem;
  }
}

/* ══════════════════════════════════════════════════════════
   KEYFRAMES
   ══════════════════════════════════════════════════════════ */
@keyframes sab-slide-right  { 0%{transform:translateX(0)}50%{transform:translateX(5px)}100%{transform:translateX(0)} }
@keyframes sab-slide-left   { 0%{transform:translateX(0)}50%{transform:translateX(-5px)}100%{transform:translateX(0)} }
@keyframes sab-rotate       { to{transform:rotate(360deg)} }
@keyframes sab-spin         { to{transform:rotate(360deg)} }
@keyframes sab-scale-icon   { 0%{transform:scale(1)}50%{transform:scale(1.3)}100%{transform:scale(1)} }
@keyframes sab-shake        { 0%,100%{transform:rotate(0)}20%,60%{transform:rotate(-12deg)}40%,80%{transform:rotate(12deg)} }
@keyframes sab-pulse-icon   { 0%,100%{opacity:1;transform:scale(1)}50%{opacity:.6;transform:scale(0.85)} }
@keyframes sab-bounce-v     { 0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)} }
@keyframes sab-bounce-h     { 0%{transform:translateX(0)}30%{transform:translateX(6px)}60%{transform:translateX(-4px)}80%{transform:translateX(3px)}100%{transform:translateX(0)} }
@keyframes sab-jitter       { 0%,100%{transform:translate(0,0)}20%{transform:translate(-2px,1px)}40%{transform:translate(2px,-1px)}60%{transform:translate(-1px,2px)}80%{transform:translate(1px,-2px)} }
@keyframes sab-glow-pulse   { from{box-shadow:0 0 5px var(--sab-bg-hover)}to{box-shadow:0 0 20px var(--sab-bg-hover),0 0 40px var(--sab-bg-hover)} }
@keyframes sab-spin-anim    { to{transform:rotate(360deg)} }
@keyframes sab-ripple-anim  { to{transform:scale(4);opacity:0} }
@keyframes sab-badge-pop    { 0%{transform:scale(0)}80%{transform:scale(1.2)}100%{transform:scale(1)} }
@keyframes sab-attention    { 0%,100%{transform:scale(1)}50%{transform:scale(1.04);box-shadow:0 0 0 6px rgba(var(--sab-bg),0.3)} }

/* Entrance keyframes */
@keyframes sab-fadeIn         { from{opacity:0}to{opacity:1} }
@keyframes sab-fadeInUp       { from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)} }
@keyframes sab-fadeInDown     { from{opacity:0;transform:translateY(-24px)}to{opacity:1;transform:translateY(0)} }
@keyframes sab-fadeInLeft     { from{opacity:0;transform:translateX(-24px)}to{opacity:1;transform:translateX(0)} }
@keyframes sab-fadeInRight    { from{opacity:0;transform:translateX(24px)}to{opacity:1;transform:translateX(0)} }
@keyframes sab-zoomIn         { from{opacity:0;transform:scale(0.6)}to{opacity:1;transform:scale(1)} }
@keyframes sab-zoomInUp       { from{opacity:0;transform:scale(0.7) translateY(30px)}to{opacity:1;transform:scale(1) translateY(0)} }
@keyframes sab-bounceIn       { 0%{transform:scale(.3);opacity:0}50%{transform:scale(1.08)}70%{transform:scale(.95)}100%{transform:scale(1);opacity:1} }
@keyframes sab-bounceInUp     { 0%{transform:translateY(80px);opacity:0}60%{transform:translateY(-10px)}80%{transform:translateY(5px)}100%{transform:translateY(0);opacity:1} }
@keyframes sab-slideInUp      { from{transform:translateY(50px);opacity:0}to{transform:translateY(0);opacity:1} }
@keyframes sab-slideInLeft    { from{transform:translateX(-60px);opacity:0}to{transform:translateX(0);opacity:1} }
@keyframes sab-slideInRight   { from{transform:translateX(60px);opacity:0}to{transform:translateX(0);opacity:1} }
@keyframes sab-rotateIn       { from{transform:rotate(-180deg);opacity:0}to{transform:rotate(0);opacity:1} }
@keyframes sab-flipInX        { from{transform:perspective(400px) rotateX(90deg);opacity:0}to{transform:perspective(400px) rotateX(0);opacity:1} }
@keyframes sab-flipInY        { from{transform:perspective(400px) rotateY(90deg);opacity:0}to{transform:perspective(400px) rotateY(0);opacity:1} }
@keyframes sab-lightSpeedIn   { from{transform:translateX(100%) skewX(-30deg);opacity:0}60%{transform:skewX(20deg)}80%{transform:skewX(-5deg)}to{transform:none;opacity:1} }
@keyframes sab-jackInTheBox   { from{transform:scale(.1) rotate(30deg) translateY(-80%);opacity:0}50%{transform:rotate(-10deg)}70%{transform:rotate(3deg)}to{transform:scale(1);opacity:1} }
@keyframes sab-rollIn         { from{opacity:0;transform:translateX(-100%) rotate(-120deg)}to{opacity:1;transform:translateX(0) rotate(0)} }
@keyframes sab-wobble         { 0%{transform:none}15%{transform:translateX(-12%) rotate(-5deg)}30%{transform:translateX(10%) rotate(3deg)}45%{transform:translateX(-8%) rotate(-3deg)}60%{transform:translateX(6%) rotate(2deg)}75%{transform:translateX(-4%) rotate(-1deg)}to{transform:none} }