/* ==========================================================================
   PUBLICATIONS — editorial rows on hairlines, hover wash without reflow
   ========================================================================== */

.articles-section { background: var(--bg-warm); padding: var(--space-section) 0; border-top: 1px solid var(--rule-hairline); }

.articles-list { border-top: 1px solid var(--rule-strong); isolation: isolate; }
.article-row {
  position: relative;
  display: grid; grid-template-columns: 1fr auto; column-gap: var(--space-md); row-gap: var(--space-xs); align-items: start;
  padding: var(--space-xl) 0;
  border-bottom: 1px solid var(--rule-hairline);
}
.article-row::before { content: ""; position: absolute; inset: 0 calc(-1 * var(--space-md)); z-index: -1; border-radius: var(--radius-sm); background: var(--brand-green-tint); opacity: 0; transition: opacity var(--motion-state) var(--ease); }
.article-row:hover::before, .article-row:focus-visible::before { opacity: 1; }
@media (min-width: 768px) {
  .article-row { grid-template-columns: 9rem minmax(0, 1fr) 10rem 24px; column-gap: var(--space-xl); padding: var(--space-2xl) 0; }
}
.article-date { font-size: var(--text-xs); font-weight: 600; letter-spacing: var(--tracking-label); text-transform: uppercase; color: var(--ink-muted); padding-top: 6px; grid-column: 1; }
.article-info { grid-column: 1 / -1; }
@media (min-width: 768px) { .article-info { grid-column: 2; } }
.article-info h3 { font-size: var(--text-2xl); margin-bottom: var(--space-2xs); transition: color var(--motion-state) var(--ease); }
@media (min-width: 768px) { .article-info h3 { font-size: var(--text-3xl); } }
.article-row:hover .article-info h3 { color: var(--brand-green-accent); }
.article-info p { max-width: var(--measure); font-size: var(--text-sm); color: var(--ink-secondary); }
.article-pub { font-size: var(--text-xs); font-weight: 600; letter-spacing: var(--tracking-label); text-transform: uppercase; color: var(--ink-muted); padding-top: 6px; grid-column: 1; }
@media (min-width: 768px) { .article-pub { grid-column: 3; text-align: right; } }
.article-arrow { grid-column: 2; justify-self: end; grid-row: 1; color: var(--ink-muted); transition: transform var(--motion-move) var(--ease), color var(--motion-state) var(--ease); }
@media (min-width: 768px) { .article-arrow { grid-column: 4; padding-top: 4px; } }
.article-arrow svg { width: 20px; height: 20px; }
.article-row:hover .article-arrow { transform: translate(3px, -3px); color: var(--brand-green-accent); }

/* ==========================================================================
   COMPANIES WORKED WITH — a slow logo ribbon below the writing.
   Two identical lists slide by half the track width, so the loop has no seam.
   Hover or keyboard focus pauses it; reduced motion shows one still row.
   ========================================================================== */
.partners { margin-top: var(--space-3xl); } /* the last article row's hairline is the divider */
.partners-label { margin-bottom: var(--space-xl); font-size: var(--text-2xs); font-weight: 600; letter-spacing: var(--tracking-caps); text-transform: uppercase; color: var(--ink-muted); }
.partners-marquee {
  position: relative; overflow: hidden;
  -webkit-mask-image: linear-gradient(to right, transparent, #000 8%, #000 92%, transparent);
          mask-image: linear-gradient(to right, transparent, #000 8%, #000 92%, transparent);
}
.partners-track { display: flex; width: max-content; animation: partners-slide var(--partners-duration, 42s) linear infinite; }
.partners-marquee:hover .partners-track, .partners-marquee:focus-within .partners-track { animation-play-state: paused; }
.partners-list { display: flex; align-items: center; gap: clamp(3rem, 6vw, 5.5rem); padding-right: clamp(3rem, 6vw, 5.5rem); list-style: none; }
@keyframes partners-slide { to { transform: translateX(-50%); } }

.partner { display: flex; align-items: center; justify-content: center; height: 72px; border-radius: var(--radius-sm); }
a.partner:focus-visible { outline: 2px solid var(--brand-green-sage); outline-offset: 6px; }
.partner img { display: block; width: auto; height: var(--logo-h, 36px); max-width: none; filter: grayscale(1) contrast(1.05); mix-blend-mode: multiply; opacity: 0.7; transition: opacity var(--motion-state) var(--ease), filter var(--motion-state) var(--ease); }
a.partner:hover img, a.partner:focus-visible img { opacity: 1; filter: none; }
@media (max-width: 767.98px) {
  .partner { height: 60px; }
  .partner img { height: calc(var(--logo-h, 36px) * 0.82); }
}

@media (prefers-reduced-motion: reduce) {
  .partners-marquee { -webkit-mask-image: none; mask-image: none; }
  .partners-track { width: auto; animation: none; }
  .partners-list { flex-wrap: wrap; justify-content: center; gap: var(--space-lg) var(--space-3xl); padding-right: 0; }
  .partners-list[aria-hidden="true"] { display: none; }
}