/* ---------- brand logo marquee (home, under hero) ---------- */
.brand-marquee{
  position:relative;
  padding:26px 0 30px;
  background:rgba(255,255,255,.22);
}
.brand-marquee .eyebrow{
  text-align:center;
  margin:0 0 18px;
}
.brand-marquee__viewport{
  overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg, transparent 0, #000 9%, #000 91%, transparent 100%);
          mask-image:linear-gradient(90deg, transparent 0, #000 9%, #000 91%, transparent 100%);
}
.brand-marquee__track{
  display:flex;
  width:max-content;
  animation:brand-marquee-scroll 55s linear infinite;
}

.brand-marquee__group{
  list-style:none;
  margin:0;
  padding:0 64px 0 0;
  display:flex;
  align-items:center;
  gap:64px;
  flex-shrink:0;
}
.brand-marquee__group li{
  display:flex;
  align-items:center;
  height:52px;
}
.brand-marquee__group img{
  display:block;
  height:var(--h, 32px);
  width:auto;
  /* unify all brand colours into one warm, muted tone */
  filter:grayscale(1) sepia(.35) brightness(.55);
  opacity:.72;
  transition:opacity .3s ease;
}
.brand-marquee__word{
  font-family:'Jost', 'Helvetica Neue', Arial, sans-serif;
  font-weight:500;
  font-size:1.2rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  white-space:nowrap;
  color:var(--ink);
  opacity:.72;
  transition:opacity .3s ease;
}
.brand-marquee__word--serif{
  font-family:'Cormorant Garamond', Georgia, serif;
  font-size:1.55rem;
  letter-spacing:.3em;
}
.brand-marquee__word--lower{
  text-transform:none;
  font-weight:600;
  font-size:1.6rem;
  letter-spacing:-.01em;
}
.brand-marquee__word b{ font-weight:600; }
.brand-marquee__group li:hover img,
.brand-marquee__group li:hover .brand-marquee__word{ opacity:1; }

@keyframes brand-marquee-scroll{
  from{ transform:translateX(0); }
  to{ transform:translateX(-50%); }
}

@media (max-width:640px){
  .brand-marquee{ padding:20px 0 22px; }
  .brand-marquee .eyebrow{ margin-bottom:12px; }
  .brand-marquee__group{ gap:40px; padding-right:40px; }
  .brand-marquee__group li{ height:40px; }
  .brand-marquee__group img{ height:calc(var(--h, 32px) * .78); }
  .brand-marquee__word{ font-size:1rem; }
  .brand-marquee__word--serif{ font-size:1.25rem; }
  .brand-marquee__word--lower{ font-size:1.3rem; }
  .brand-marquee__track{ animation-duration:40s; }
}

