/* ---------- teletext ticker (footer) ---------- */
.ticker{display:flex;align-items:stretch;margin:16px calc(var(--gutter)*-1) 0;background:var(--vcr-blue);color:#fff;
  font-size:24px;line-height:24px;height:44px;overflow:hidden;border-top:2px solid var(--vcr-navy);text-transform:uppercase}
.ticker .tag{flex:none;display:flex;align-items:center;gap:12px;background:var(--vcr-navy);padding:0 16px;z-index:2}
.ticker .tag .clock{color:#8dffa8}
.ticker .track{flex:1;overflow:hidden;position:relative;display:flex;align-items:center}
.ticker .run{display:flex;white-space:nowrap;animation:crawl 60s linear infinite}
.ticker .track:hover .run,.ticker .track:focus-within .run{animation-play-state:paused}
.ticker .seq{display:flex;flex:none}
.ticker .it{display:inline-flex;gap:10px;padding-right:10px}
.ticker .it i{font-style:normal;color:#ffe75a}
.ticker .it b{font-weight:normal;padding:0 2px}
.ticker .it em{font-style:normal;color:#8888ff}
.ticker .it:hover b,.ticker .it a:focus-visible{background:var(--red)}
.ticker .gap{display:inline-block;width:160px}
.ticker a{text-decoration:none;outline:none}
/* flashing words are staggered across one 1.8s cycle so they never light together */
.ticker .it b.blink{animation:tflash 1.8s linear infinite}
.ticker .it b.bl-2{animation-delay:-1.2s}
.ticker .it b.blink-blue{animation:tflash-blue 1.8s linear infinite;animation-delay:-.6s}
.ticker .it b.fade{animation:tfade 5s ease-in-out infinite}
@keyframes tflash{0%,33%{background:var(--red)}34%,100%{background:transparent}}
@keyframes tflash-blue{0%,33%{background:#7cc8ff;color:var(--vcr-navy)}34%,100%{background:transparent;color:#fff}}
@keyframes tfade{0%,15%,100%{opacity:1}50%,60%{opacity:0}}
@keyframes crawl{to{transform:translateX(-50%)}}