/* kept exactly as approved: Archivo throughout */
.manifesto, .manifesto h2, .manifesto h3 { font-family: var(--font-keep); }
.manifesto {
  background: var(--black); color: var(--white);
  padding: var(--section-y) 0;
  overflow: hidden;
}
.manifesto__list {
  list-style: none; margin: 0 auto; padding: 0 var(--gutter); max-width: var(--max);
  display: grid; gap: clamp(10px, 2vw, 22px);
}
.manifesto__item a {
  display: inline-block; text-decoration: none;
  font-size: clamp(2rem, .8rem + 4.4vw, 5.4rem); font-weight: 900; max-width: 18ch; letter-spacing: -.035em; line-height: .92;
}
/* alternate widths: the variable font's stretch axis does the talking */
.manifesto__item:nth-child(odd) a { font-stretch: 125%; }
.manifesto__item:nth-child(even) a { font-stretch: 62%; font-size: clamp(2.4rem, 1rem + 5.4vw, 6.6rem); }
.manifesto__item:nth-child(3n) { justify-self: end; text-align: right; }
.manifesto__item a:hover .word, .manifesto__item a:focus-visible .word { color: var(--lit); }
.manifesto__item .word { transition: color var(--t-fast); }
.manifesto__hint {
  display: block; margin-top: 8px; font-family: var(--mono); font-size: .6875rem; font-stretch: 100%;
  letter-spacing: .02em; font-weight: 400; color: var(--muted-on-black);
  line-height: 1.5; /* the slogan's tight leading squashed a caption that wraps onto two lines */
}

.marquee { overflow: hidden; margin-top: clamp(48px, 6vw, 80px); border-block: 1px solid #3a3835; padding: 18px 0; }
.marquee__track { display: flex; width: max-content; will-change: transform; animation: marquee var(--marquee-time, 70s) linear infinite; }
/* pause under the mouse, or while someone tabs through it with the keyboard */
@media (hover: hover) { .marquee:hover .marquee__track { animation-play-state: paused; } }
.using-keys .marquee:has(a:focus) .marquee__track { animation-play-state: paused; }
@keyframes marquee { to { transform: translateX(-50%); } }
.marquee__track a {
  flex: none; padding-right: 2.2em; white-space: nowrap; text-decoration: none;
  font-size: clamp(1.25rem, .9rem + 1.6vw, 2.2rem); font-weight: 800; font-stretch: 112%; color: var(--concrete-light);
  transition: color var(--t-fast);
}
.marquee__track a:hover, .marquee__track a:focus-visible { color: var(--lit); }
.marquee__track a::after { content: "✷"; margin-left: 2.2em; color: var(--lit); }
@media (prefers-reduced-motion: reduce) {
  .marquee { overflow-x: auto; }
  .marquee__track { animation: none; }
}

.manifesto__cta { display: flex; justify-content: center; margin-top: clamp(40px, 5vw, 64px); padding: 0 var(--gutter); }