/* =====================================================================
   SYNCSALE — REDESIGN v3 (spójność graficzna / world-class SaaS)
   Warstwa NADRZĘDNA. Ładowana po style.css. W pełni odwracalna:
   usunięcie enqueue w functions.php = powrót do stanu sprzed v3.
   Inspiracja wizualna: selesto.pl. Light-first, jeden niebieski,
   jeden font (IBM Plex Sans), skala radius/cieni, system przycisków.
   ===================================================================== */

:root {
  /* — Ink / granat — */
  --ss-ink-900:#020b1c;
  --ss-ink-800:#0a1430;
  --ss-ink-700:#0f172a;
  --ss-ink-500:#5f6b85;
  --ss-ink-400:#8b97b3;

  /* — Niebieski (JEDEN akcent — koniec z #2563eb) — */
  --ss-blue-600:#2f66f3;
  --ss-blue-700:#1f51d6;
  --ss-blue-100:#e3edff;
  --ss-blue-50:#eef4ff;

  /* — Secondary (fiolet/indygo — używać oszczędnie; nie zielony/żółty) — */
  --ss-violet-500:#6d5cf5;
  --ss-violet-50:#efeafe;

  /* — Powierzchnie / neutrale — */
  --ss-bg:#ffffff;
  --ss-bg-soft:#f6f8fc;
  --ss-border:#e6eaf2;

  /* — Promień (3 + pill) — */
  --r-sm:10px;
  --r-md:16px;
  --r-lg:24px;
  --r-pill:999px;

  /* — Cienie (elevation) — */
  --sh-1:0 1px 2px rgba(15,23,42,.04), 0 4px 16px -8px rgba(15,23,42,.08);
  --sh-2:0 12px 32px -16px rgba(15,23,42,.16);
  --sh-3:0 24px 60px -24px rgba(2,11,28,.26);
  --sh-4:0 40px 90px -30px rgba(2,11,28,.45);

  /* — KILL Unbounded / Neometric: przekierowanie zmiennych fontów na IBM Plex — */
  --font-unbounded:'IBM Plex Sans', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  --font-sync1:'IBM Plex Sans', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;

  /* — Aliasy zgodne z inline v2 — */
  --ss-primary:#020b1c;
  --ss-accent:#2f66f3;
  --ss-accent-soft:#eef4ff;
  --ss-text-main:#0f172a;
  --ss-text-sub:#5f6b85;
  --ss-line:rgba(47,102,243,.14);
}

/* ===== TYPOGRAFIA — domyślnie IBM Plex w obrębie redesignu ===== */
.home6-banner-area, .home6-banner-area *,
.order-manager, .automatic-actions, .packaging-assistant,
.home-integration-section, .ss-process-section,
.ss-pricing, .ss-pricing *,
.header-area.style-6 .menu-list,
.ssmm-panel, .ssmm-panel * {
  font-family:'IBM Plex Sans', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
}

/* =====================================================================
   1) SYSTEM PRZYCISKÓW — jeden wygląd dla tego samego CTA
   ===================================================================== */
.prc-btn-primary,
.prc-btn-primary-dark,
.prc-btn-primary-mid-dark,
.prc-btn-outline,
.ss-cta-trial,
a.primary-btn2.ss-cta-trial {
  font-family:'IBM Plex Sans', system-ui, sans-serif !important;
  font-weight:600 !important;
  font-size:15px !important;
  line-height:1.1 !important;
  letter-spacing:0 !important;
  padding:13px 26px !important;
  border-radius:var(--r-pill) !important;
  transition:background .18s ease, transform .18s ease, box-shadow .18s ease !important;
  border:1px solid transparent;
}
.prc-btn-primary { background:var(--ss-blue-600) !important; color:#fff !important; }
.prc-btn-primary:hover { background:var(--ss-blue-700) !important; transform:translateY(-1px); box-shadow:var(--sh-2); }

.prc-btn-primary-dark { background:var(--ss-ink-900) !important; color:#fff !important; }
.prc-btn-primary-dark:hover { background:#0a1f44 !important; transform:translateY(-1px); box-shadow:var(--sh-2); }

.prc-btn-outline { background:#fff !important; border:1px solid var(--ss-border) !important; color:var(--ss-ink-700) !important; }
.prc-btn-outline:hover { background:var(--ss-bg-soft) !important; border-color:#d4dbe8 !important; }

/* header CTA „Przetestuj za darmo" → niebieski pill */
.ss-cta-trial, a.primary-btn2.ss-cta-trial {
  background:var(--ss-blue-600) !important;
  color:#fff !important;
  padding:11px 22px !important;
  white-space:nowrap;
}
.ss-cta-trial:hover { background:var(--ss-blue-700) !important; transform:translateY(-1px); box-shadow:var(--sh-2); }
.ss-cta-trial span { display:none !important; } /* legacy ::pseudo z primary-btn2 */
/* Mobile/tablet: w nagłówku zostaje samo logo + hamburger (CTA jest w menu bocznym, jak u Selesto).
   NIE wymuszamy display na .ss-cta-trial, żeby Bootstrapowe d-none/d-*-block działały. */
@media (max-width:991px){
  .header-area.style-6 .ss-cta-trial { display:none !important; }
  .header-area.style-6 .container { min-height:64px; }
  .header-area.style-6 .header-logo img { width:128px !important; }
}

/* sidebar (mobile) CTA */
.sidebar-area .primary-btn2 { background:var(--ss-blue-600) !important; color:#fff !important; border-radius:var(--r-pill) !important; }

:where(.prc-btn-primary,.prc-btn-primary-dark,.prc-btn-outline,.ss-cta-trial):focus-visible {
  outline:2px solid var(--ss-blue-600); outline-offset:2px;
}

/* =====================================================================
   2) HEADER — solidny jasny, ten sam stan na górze i przy scrollu
   ===================================================================== */
.header-area.style-6 { background:transparent; }
.header-area.style-6 .container { min-height:74px; align-items:center !important; }

.header-area.style-6.sticky {
  background:#fff !important;
  box-shadow:0 1px 0 var(--ss-border), 0 10px 30px -24px rgba(2,11,28,.45) !important;
}
/* linki menu — ciemne na jasnym hero */
.header-area.style-6 .menu-list > li > a,
.header-area.style-6 .menu-list .ssmm-trigger {
  color:var(--ss-ink-700) !important;
  font-weight:500 !important;
  font-size:15px !important;
  transition:color .15s ease;
}
.header-area.style-6 .menu-list > li > a:hover,
.header-area.style-6 .menu-list .ssmm-item:hover .ssmm-trigger { color:var(--ss-blue-600) !important; }

/* hotline na jasnym tle */
.header-area.style-6 .hotline-area .content span { color:var(--ss-ink-500) !important; }
.header-area.style-6 .hotline-area .content h6 a { color:var(--ss-ink-700) !important; }
.header-area.style-6 .hotline-area .icon svg { fill:var(--ss-blue-600) !important; }
/* hamburger mobilny ciemny */
.header-area.style-6 .sidebar-btn svg { fill:var(--ss-ink-700) !important; }

/* =====================================================================
   3) HERO — light-first (floating card jasny, H1 dwukolorowy)
   ===================================================================== */
.home6-banner-area {
  background:radial-gradient(1100px 460px at 50% -8%, var(--ss-blue-50) 0%, rgba(238,244,255,0) 70%), var(--ss-bg) !important;
  border-radius:28px !important;
}
/* „kartę" hero (border+cień) pokazujemy tylko na stronie głównej, gdzie hero ma treść */
body.home .home6-banner-area { border:1px solid var(--ss-border); box-shadow:var(--sh-1); }
@media (max-width:991px){ .home6-banner-area { border-radius:0 !important; border-left:0; border-right:0; } }

.home6-banner-area .banner-content-wrapper h1,
.home6-banner-area .banner-content-wrapper h1 b {
  color:var(--ss-ink-700) !important;
  font-family:'IBM Plex Sans', system-ui, sans-serif !important;
  font-weight:700 !important;
  letter-spacing:-0.02em !important;
}
.home6-banner-area #typed { color:var(--ss-blue-600) !important; font-weight:700 !important; }

/* podtytuł + trust-row na jasnym (override inline white z front-page) */
.home6-banner-area .hero-subtext { color:var(--ss-ink-500) !important; }
.home6-banner-area .hero-subtext b { color:var(--ss-ink-700) !important; }
.home6-banner-area .ss-hero-trust .ss-ht-item { color:var(--ss-ink-400) !important; }
.home6-banner-area .ss-hero-trust .ss-ht-item b { color:var(--ss-ink-700) !important; }
.home6-banner-area .ss-hero-trust .ss-ht-sep { background:#cfd8ea !important; }
/* gwarancja pod CTA — shield jak w Asystencie (niebieski) + czytelny tekst */
.home6-banner-area .ss-hero-trust .ss-ht-guarantee { color:var(--ss-ink-500) !important; font-size:14px; gap:8px; }
.home6-banner-area .ss-hero-trust .ss-ht-guarantee i.bi { color:var(--ss-blue-600) !important; font-size:16px; }

/* marquee logo — spójnie, lekka szarość */
.partner-area.four { background:var(--ss-bg); }

/* =====================================================================
   4) MEGA MENU — domknięcia spójności (reszta w megamenu.php)
   ===================================================================== */
.ssmm-panel { border-radius:var(--r-lg) !important; box-shadow:var(--sh-3) !important; border-color:var(--ss-border) !important; }
.ssmm-chev { color:var(--ss-ink-400); }
.ssmm-item:hover .ssmm-trigger .ssmm-chev { color:var(--ss-blue-600); }
/* FIX legacy: `.style-6 ...li svg{opacity:0;position:absolute;fill}` ukrywał chevron w spoczynku,
   a `li{position:relative}` centrował panel względem pojedynczej pozycji (Funkcje wjeżdżało w lewo).
   Nadpisujemy z wyższą specyficznością. */
.header-area.style-6 .menu-list .ssmm-item { position:static !important; }
.header-area.style-6 .menu-list .ssmm-trigger .ssmm-chev {
  position:static !important; right:auto !important; top:auto !important;
  opacity:1 !important; transform:none; fill:none !important;
  color:var(--ss-ink-400); width:11px; height:8px;
  transition:transform .25s ease, color .15s ease;
}
.header-area.style-6 .menu-list .ssmm-item:hover .ssmm-trigger .ssmm-chev,
.header-area.style-6 .menu-list .ssmm-item:focus-within .ssmm-trigger .ssmm-chev {
  opacity:1 !important; color:var(--ss-blue-600); transform:rotate(180deg);
}

/* =====================================================================
   5) KARTY / SEKCJE — radius i cienie wg skali
   ===================================================================== */
.ss-card { border-radius:var(--r-lg) !important; }
.single-integration { border-radius:var(--r-md) !important; }

/* końcowe CTA (jeden z 2 celowych ciemnych momentów) — radius spójny */
#home-cta-free-onboarding { border-radius:28px !important; }

/* =====================================================================
   6) STOPKA — radius spójny (kolory już granat + IBM Plex)
   ===================================================================== */
.ss-footer { border-top-left-radius:28px !important; border-top-right-radius:28px !important; }
.ss-footer .ss-f-cta { transition:background .18s ease, transform .18s ease; }
.ss-footer .ss-f-cta:hover { transform:translateY(-1px); }

/* =====================================================================
   8) MOCKUPY PRODUKTU — czyste UI w HTML/CSS zamiast PNG/zdjęć
   ===================================================================== */
.ss-mock{ background:#fff; border:1px solid var(--ss-border); border-radius:20px; box-shadow:var(--sh-3); padding:22px; max-width:440px; width:100%; font-family:'IBM Plex Sans',system-ui,sans-serif; }
.ss-mock *{ box-sizing:border-box; }
@media (max-width:991px){ .ss-mock{ margin:0 auto; } }

/* --- Asystent pakowania --- */
.ss-mock-pack{ max-width:560px; } /* równo z .ss-mock-orders → spójny odstęp lewo/prawo w sekcjach */
.ss-mock-pack .ss-mp-head{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:14px; }
.ss-mp-order{ font-size:15px; color:var(--ss-ink-500); }
.ss-mp-order b{ color:var(--ss-ink-700); font-weight:700; }
.ss-mp-badge{ font-size:12px; font-weight:600; color:var(--ss-blue-700); background:var(--ss-blue-50); border:1px solid #dbe6ff; padding:5px 12px; border-radius:999px; white-space:nowrap; }
.ss-mp-prog{ height:6px; border-radius:999px; background:#e6eaf2; overflow:hidden; margin-bottom:16px; }
.ss-mp-prog span{ display:block; height:100%; background:linear-gradient(90deg,#2f66f3,#5b86f7); border-radius:999px; }
.ss-mp-list{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:9px; }
.ss-mp-list li{ display:flex; align-items:center; gap:12px; padding:11px 12px; border:1px solid var(--ss-border); border-radius:13px; }
.ss-mp-list li .ss-mp-ic{ flex:0 0 30px; width:30px; height:30px; border-radius:8px; display:grid; place-items:center; font-size:16px; }
.ss-mp-list li .ss-mp-prod{ flex:1; min-width:0; }
.ss-mp-list li .ss-mp-prod b{ display:block; font-size:14px; color:var(--ss-ink-700); font-weight:600; line-height:1.2; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ss-mp-list li .ss-mp-prod span{ font-size:12px; color:var(--ss-ink-400); }
.ss-mp-list li .ss-mp-qty{ font-size:13px; font-weight:700; color:var(--ss-ink-500); white-space:nowrap; }
.ss-mp-list li.done .ss-mp-ic{ background:var(--ss-blue-600); color:#fff; }
.ss-mp-list li.done .ss-mp-qty{ color:var(--ss-blue-600); }
.ss-mp-list li.scan{ border-color:var(--ss-blue-600); background:var(--ss-blue-50); box-shadow:0 0 0 3px rgba(47,102,243,.10); }
.ss-mp-list li.scan .ss-mp-ic{ background:#fff; color:var(--ss-blue-600); border:1px solid #cdd9f5; }
.ss-mp-list li.pending{ opacity:.6; }
.ss-mp-list li.pending .ss-mp-ic{ background:#eef1f6; color:var(--ss-ink-400); }
.ss-mp-foot{ display:flex; align-items:center; gap:8px; margin-top:16px; font-size:13px; color:var(--ss-ink-500); }
.ss-mp-foot i{ color:var(--ss-blue-600); font-size:15px; }

/* --- Automatyczne akcje (flow) --- */
.ss-mock-flow{ max-width:384px; display:flex; flex-direction:column; align-items:stretch; box-shadow:none; border:0; background:transparent; padding:6px; }
.ss-fl-node{ display:flex; align-items:center; gap:12px; background:#fff; border:1px solid var(--ss-border); border-radius:14px; padding:13px 15px; box-shadow:var(--sh-1); }
.ss-fl-node .ss-fl-ic{ flex:0 0 36px; width:36px; height:36px; border-radius:10px; background:var(--ss-blue-50); color:var(--ss-blue-600); display:grid; place-items:center; font-size:18px; }
.ss-fl-node > div{ flex:1; min-width:0; }
.ss-fl-node b{ display:block; font-size:14px; font-weight:600; color:var(--ss-ink-700); line-height:1.2; }
.ss-fl-node span{ font-size:12px; color:var(--ss-ink-400); }
.ss-fl-tag{ font-size:10px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:var(--ss-blue-700); background:var(--ss-blue-50); border:1px solid #dbe6ff; padding:4px 9px; border-radius:999px; white-space:nowrap; }
.ss-fl-tag.done{ color:#fff; background:var(--ss-blue-600); border-color:var(--ss-blue-600); }
.ss-fl-trigger{ border-color:#cdd9f5; box-shadow:0 0 0 3px rgba(47,102,243,.08), var(--sh-1); }
.ss-fl-line{ width:2px; height:20px; background:#cdd9f5; margin:0 auto; }
.ss-fl-row{ display:flex; gap:12px; }
.ss-fl-row .ss-fl-node{ flex:1; }
.ss-fl-node.sm b{ font-size:13px; }

/* --- Menadżer zamówień (panel zamówień) --- */
.ss-mock-orders{ max-width:560px; padding:0; overflow:hidden; }
@media (min-width:992px){ .ss-mock-orders, .ss-mock-pack{ margin-left:auto; } }
.ss-mo-head{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:18px 22px 14px; }
.ss-mo-h-title{ font-size:17px; font-weight:700; color:var(--ss-ink-700); }
.ss-mo-h-badge{ display:inline-flex; align-items:center; gap:7px; font-size:12.5px; font-weight:600; color:var(--ss-ink-500); background:var(--ss-bg-soft); border:1px solid var(--ss-border); padding:5px 11px; border-radius:999px; }
.ss-mo-dot{ width:7px; height:7px; border-radius:50%; background:var(--ss-blue-600); box-shadow:0 0 0 3px rgba(47,102,243,.15); }
.ss-mo-tabs{ display:flex; gap:8px; padding:0 22px 14px; }
.ss-mo-tabs span{ font-size:12.5px; font-weight:600; color:var(--ss-ink-500); padding:6px 13px; border-radius:999px; }
.ss-mo-tabs span.on{ background:var(--ss-blue-50); color:var(--ss-blue-700); }
.ss-mo-list{ border-top:1px solid var(--ss-border); }
.ss-mo-row{ display:flex; align-items:center; gap:14px; padding:14px 22px; border-bottom:1px solid var(--ss-border); transition:background .15s ease; }
.ss-mo-row:last-child{ border-bottom:0; }
.ss-mo-row:hover{ background:#fafbfe; }
.ss-mo-av{ flex:0 0 42px; width:42px; height:42px; border-radius:50%; color:#fff; font-weight:700; font-size:14px; display:grid; place-items:center; letter-spacing:.02em; }
.ss-mo-main{ flex:1; min-width:0; }
.ss-mo-main b{ display:flex; align-items:center; gap:8px; font-size:14.5px; color:var(--ss-ink-700); font-weight:600; line-height:1.2; }
.ss-mo-flag{ width:18px; height:auto; border-radius:3px; flex:0 0 auto; }
.ss-mo-main > span{ display:block; font-size:12.5px; color:var(--ss-ink-400); margin-top:3px; }
.ss-mo-status{ flex:0 0 auto; font-size:12px; font-weight:600; padding:5px 12px; border-radius:999px; white-space:nowrap; }
.ss-mo-status.s-done{ background:#e3edff; color:#2f66f3; }
.ss-mo-status.s-proc{ background:#efeafe; color:#6d5cf5; }
.ss-mo-status.s-wait{ background:#eef1f6; color:#64748b; }
@media (max-width:520px){ .ss-mo-row{ padding:12px 16px; gap:11px; } .ss-mo-head,.ss-mo-tabs{ padding-left:16px; padding-right:16px; } .ss-mo-av{ flex-basis:38px; width:38px; height:38px; } .ss-mo-status{ font-size:11px; padding:4px 10px; } }

/* --- Menadżer zamówień: czyszczenie tabeli (zdjęcia→awatary, stonowane statusy) --- */
.order-table .avatar{ background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23fff'%3E%3Cpath d='M12 12a5 5 0 100-10 5 5 0 000 10zm0 2c-4.4 0-8 2.2-8 5v1h16v-1c0-2.8-3.6-5-8-5z'/%3E%3C/svg%3E") center/20px no-repeat, linear-gradient(135deg,#2f66f3,#5b86f7) !important; }
.order-table .avatar img{ display:none !important; }
.order-table .status{ font-weight:600 !important; }
.order-table .status.zrealizowane{ background-color:#e6f4ec !important; color:#15803d !important; }
.order-table .status.przetwarzanie{ background-color:#e3edff !important; color:#2f66f3 !important; }
.order-table .status.oczekujace{ background-color:#eef1f6 !important; color:#64748b !important; }
.order-table .tick-icon{ fill:#2f66f3 !important; }
.order-table .cross-icon{ fill:#94a3b8 !important; }
.ss-prod-txt b{ display:block; font-size:13.5px; color:#0f172a; font-weight:600; line-height:1.2; }
.ss-prod-txt span{ font-size:12px; color:#8b97b3; }

/* =====================================================================
   9) SEKCJA „WDROŻENIE / ENTERPRISE" — przebudowa na czytelny proces
   ===================================================================== */
.ss-impl{ padding:90px 0; }
.ss-impl-head{ text-align:center; max-width:720px; margin:0 auto 54px; }
.ss-impl-eyebrow{ font-size:13px; letter-spacing:.08em; text-transform:uppercase; color:var(--ss-blue-600); font-weight:700; margin-bottom:12px; display:inline-block; }
.ss-impl h2{ font-size:clamp(28px,3.6vw,44px); letter-spacing:-0.02em; color:var(--ss-ink-700); margin:0 0 14px; font-family:'IBM Plex Sans',system-ui,sans-serif; font-weight:700; }
.ss-impl-head p{ font-size:17px; color:var(--ss-ink-500); line-height:1.65; margin:0; }
.ss-impl-steps{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; max-width:1080px; margin:0 auto; }
.ss-impl-step{ position:relative; background:#fff; border:1px solid var(--ss-border); border-radius:20px; padding:38px 26px 26px; transition:box-shadow .18s ease, transform .18s ease; }
.ss-impl-step:hover{ box-shadow:0 18px 42px -26px rgba(15,23,42,.22); transform:translateY(-3px); }
.ss-impl-num{ position:absolute; top:-18px; left:26px; width:38px; height:38px; border-radius:50%; background:var(--ss-blue-600); color:#fff; font-weight:700; font-size:16px; display:grid; place-items:center; box-shadow:0 10px 22px -8px rgba(47,102,243,.65); }
.ss-impl-ic{ width:46px; height:46px; border-radius:12px; background:var(--ss-blue-50); color:var(--ss-blue-600); display:grid; place-items:center; font-size:22px; margin-bottom:16px; }
.ss-impl-step h3{ font-size:19px; font-weight:700; color:var(--ss-ink-700); margin:0 0 8px; font-family:'IBM Plex Sans',system-ui,sans-serif; }
.ss-impl-step p{ font-size:14.5px; color:var(--ss-ink-500); line-height:1.6; margin:0; }
.ss-impl-cta{ max-width:1080px; margin:46px auto 0; display:flex; align-items:center; justify-content:space-between; gap:24px; flex-wrap:wrap; background:var(--ss-bg-soft); border:1px solid var(--ss-border); border-radius:20px; padding:22px 28px; }
.ss-impl-trial{ display:flex; align-items:center; gap:14px; font-size:15px; color:var(--ss-ink-500); line-height:1.5; max-width:560px; }
.ss-impl-trial b{ color:var(--ss-ink-700); }
.ss-impl-trial-ic{ flex:0 0 44px; width:44px; height:44px; border-radius:12px; background:#fff; border:1px solid #dbe6ff; color:var(--ss-blue-600); display:grid; place-items:center; font-size:21px; }
.ss-impl-actions{ display:flex; align-items:center; gap:20px; }
.ss-impl-phone{ display:inline-flex; align-items:center; gap:7px; font-weight:600; color:var(--ss-ink-700); text-decoration:none; white-space:nowrap; }
.ss-impl-phone i{ color:var(--ss-blue-600); }
.ss-impl-phone:hover{ color:var(--ss-blue-600); }
.ss-impl-trialbar{ max-width:780px; margin:48px auto 0; display:flex; align-items:center; gap:14px; background:var(--ss-bg-soft); border:1px solid var(--ss-border); border-radius:16px; padding:18px 24px; font-size:15px; color:var(--ss-ink-500); line-height:1.5; }
.ss-impl-trialbar b{ color:var(--ss-ink-700); }
@media (max-width:991px){ .ss-impl-trialbar{ margin-top:36px; } }
@media (max-width:991px){
  .ss-impl{ padding:64px 0; }
  .ss-impl-steps{ grid-template-columns:1fr; gap:34px; max-width:480px; }
  .ss-impl-cta{ flex-direction:column; align-items:flex-start; }
  .ss-impl-actions{ width:100%; justify-content:space-between; }
}

/* =====================================================================
   7) Dostępność / ruch
   ===================================================================== */
@media (prefers-reduced-motion: reduce) {
  * { animation-duration:.001ms !important; transition-duration:.001ms !important; }
}
