/**
 * =====================================================================
 * PARTNERS MARQUEE COMPONENT — STYLES
 * =====================================================================
 * Copied verbatim from the actual uploaded style.css (the same file
 * this whole project has been using as its authoritative CSS source),
 * not reconstructed from memory this time — an earlier version of
 * this file guessed at the styling and got several things wrong:
 * wrong font (--font-mono small-caps instead of the correct
 * --font-display at 24px), missing the ".partner:hover" color
 * transition entirely, and ".partner__mark" was built as a filled
 * circle when it's actually a rotated square/diamond OUTLINE. Fixed
 * to match the real source exactly.
 *
 * @keyframes marquee is NOT redefined here — it already lives in
 * assets/css/global.css, shared with the original marquee component.
 *
 * Tag qualifiers and font-family !important still applied (these are
 * genuinely necessary regardless of source — confirmed repeatedly on
 * this project's other components — even though the property values
 * themselves are now corrected to match the real design).
 * =====================================================================
 */

section.partners { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); overflow: hidden; }
div.partners__track {
  display: flex; gap: 80px; padding: 40px 0;
  /*
   * Duration doubled from the original 30s to 60s: template.php now
   * repeats the list twice per half (4 total copies) instead of once
   * (2 total copies), to fix a reported "truncate and restart" feel
   * with a small number of real partners. Since the track is now
   * twice as long, the duration needed to double too — otherwise the
   * same 30s would just make everything visually scroll twice as
   * fast, rather than actually feeling more continuous. If
   * $repeats_per_half in template.php is raised further, this should
   * scale up proportionally too (e.g. 3x repeats -> ~90s) to keep the
   * same visual speed.
   */
  animation: marquee 60s linear infinite;
  width: max-content;
  align-items: center;
}
span.partner {
  font-family: var(--font-display) !important; font-size: 24px; font-weight: 500;
  color: var(--slate); letter-spacing: -0.01em;
  transition: color 0.3s var(--ease);
  white-space: nowrap; display: inline-flex; align-items: center; gap: 12px;
}
.partner:hover { color: var(--ink); }
.partner__mark {
  width: 12px; height: 12px; border: 1.5px solid var(--red);
  transform: rotate(45deg);
  flex-shrink: 0;
}

/*
 * Image-mode logos: .partner__logo is the class applied via
 * wp_get_attachment_image() in component.php. This wasn't part of the
 * original design (which only ever showed text logos) — sized to sit
 * comfortably at roughly the same visual weight as the 24px text
 * wordmark it replaces in image mode.
 */
.partner__logo {
  height: 32px;
  width: auto;
  display: block;
}