/* What's next: the split-flap board in the header (assets/js/ticker.js). */
.ticker { margin-right: auto; margin-left: 28px; display: inline-flex; align-items: center; gap: 10px; min-height: 44px; font-size: 14px; font-weight: 600; white-space: nowrap; color: var(--navy); }
.ticker__k { color: var(--muted); font-weight: 500; }
.ticker__v { font-weight: 700; }
.ticker__d { color: var(--muted); font-weight: 500; }
.flaps { display: inline-flex; flex-wrap: wrap; gap: .18em .35em; font-variant-numeric: tabular-nums; font-size: 13px; }
.flaps__word { display: inline-flex; gap: .06em; }
.flap {
  position: relative; display: inline-grid; place-items: center; min-width: .74em; height: 1.3em; padding: 0 .08em;
  background: var(--navy); color: #fff; font-weight: 700; line-height: 1; overflow: clip; perspective: 6em;
}
.flap::after { content: ""; position: absolute; left: 0; right: 0; top: 50%; height: 1px; background: rgb(255 255 255 / .35); }
.flap__ch { display: block; transform-origin: 50% 50%; }
.flap.is-flip .flap__ch { animation: flap 90ms linear; }
@keyframes flap { from { transform: rotateX(80deg); filter: brightness(.6); } to { transform: none; } }
@media (hover: hover) and (pointer: fine) { .ticker:hover .flap { background: var(--bold-red, #D7263D); } .flap { transition: background-color 250ms; } }
@media (max-width: 1240px) { .ticker__d { display: none; } }
@media (max-width: 1060px) { .ticker { display: none; } }
/* On phones: one line in the homepage hero instead. */
.hero-next { display: none; margin-top: 14px; font-size: 15px; }
.hero-next a { font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 1060px) { .hero-next { display: block; } }
.photo-heading .hero-next { letter-spacing: 0 !important; text-transform: none !important; font-size: 15px !important; font-weight: 500; color: #fff; }
.photo-heading .hero-next a { color: #fff; }
