/* VL- ja VA-etusivujen "Markkinoinnissa nyt" -laskuri (src/live-counts.mjs). Lohko on heron päällä.
   Värit tulevat heron roolitokeneista (public/klik-tokens.css): A:ssa sininen hero ja valkoinen teksti,
   B:ssä vaalea hero ja tumma teksti. */
.klik-uusi .ku-live{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:6px 16px;width:fit-content;max-width:100%;margin:28px 0 0;padding:16px 20px 16px 18px;border-radius:16px;background:var(--klik-hero-chip-bg);border:1px solid var(--klik-hero-chip-line);color:var(--klik-on-hero-text);font-family:Lato,sans-serif}
.klik-uusi .ku-live-label{grid-column:1/-1;display:flex;align-items:center;gap:8px;margin:0;color:var(--klik-hero-accent);font-size:13px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;line-height:1.2}
.klik-uusi .ku-live-dot{position:relative;flex:none;width:10px;height:10px;border-radius:50%;background:var(--klik-hero-accent)}
.klik-uusi .ku-live-dot::after{content:"";position:absolute;inset:-4px;border-radius:50%;border:2px solid var(--klik-hero-accent);opacity:0;animation:ku-live-pulse 2.4s ease-out infinite}
@keyframes ku-live-pulse{0%{transform:scale(.6);opacity:.8}100%{transform:scale(1.5);opacity:0}}
@media (prefers-reduced-motion:reduce){.klik-uusi .ku-live-dot::after{animation:none}}
.klik-uusi .ku-live-total{margin:0;font-size:17px;font-weight:700;line-height:1.1;white-space:nowrap}
.klik-uusi .ku-live-total strong{display:block;color:var(--klik-on-hero);font-size:44px;font-weight:900;line-height:1;font-variant-numeric:tabular-nums}
.klik-uusi .ku-live-total a{display:block;color:var(--klik-on-hero);text-decoration:none}
.klik-uusi .ku-live-total a:hover{color:var(--klik-hero-accent)}
.klik-uusi .ku-live-total a:hover strong{color:inherit}
.klik-uusi .ku-live-total a::after{content:" →";font-weight:800}
.klik-uusi .ku-live-parts{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0}
.klik-uusi .ku-live-parts a{display:inline-flex;align-items:baseline;gap:5px;padding:6px 12px;border-radius:999px;background:#fff;color:var(--klik-ink);box-shadow:inset 0 0 0 1px var(--klik-hero-chip-line);font-size:15px;font-weight:700;line-height:1.25;text-decoration:none;transition:background-color .15s}
.klik-uusi .ku-live-parts a:hover{background:var(--klik-hero-btn-bg);color:var(--klik-hero-btn-text)}
.klik-uusi .ku-live-parts strong{font-weight:900}
.klik-uusi .ku-live-note{grid-column:1/-1;margin:2px 0 0;font-size:13px;line-height:1.4;opacity:.85}
@media screen and (max-width:479px){
.klik-uusi .ku-live{grid-template-columns:minmax(0,1fr);width:100%;padding:12px 14px}
.klik-uusi .ku-live-total strong{display:inline;margin-right:4px;font-size:38px}
}