/* S3 Partners. Source: Paper 248-0 (heading) + 247-0 (grid) inside 20F-0/25O-0
   (desktop, lane 1200) and 3CO-0 + 3CP-0 inside 3CN-0 (mobile, 350),
   get_jsx / get_computed_styles. Mobile-first; desktop from 1024px.
   Lines: 1px ink at 35% (#24171059 on the canvas). */

/* 2026-10-24, human: no «giant» air above the logos now that the title sits
   below them: 24 / 32 of section padding on top of the section air. */
.partners {
  padding-top: 24px;
}

/* Foot (2026-10-24, human, variant V1 in one line): under the logos, the
   display line «The funds we work with.» in the hero italic (Inter italic
   800, 72/105% desktop) and a sub 20/140% at .78 (17/145% mobile), then
   96 / 64 of air before the next section. On mobile the line is sized to
   the lane so it stays one line (the text is 11.1× its font size wide),
   34 at most. */
.partners {
  padding-bottom: 64px;
}
.partners__foot {
  margin-top: 48px;
}
.partners__title {
  font-size: min(34px, calc((100vw - 2 * var(--gutter)) / 11.3));
  font-style: italic;
  font-weight: var(--font-weight-black);
  line-height: 105%;
  letter-spacing: var(--tracking-tight);
  white-space: nowrap;
}
.partners__sub {
  max-width: 560px;
  margin-top: 20px;
  font-size: 16px; /* audit 2026-10-24: one mobile body size (was 17) */
  line-height: var(--leading-body);
  opacity: 0.78;
}

/* Card index. Mobile (3HX-0): 5 × 6 cells of exactly 70 × 80 with 1px lines
   drawn over the cell edges (0, 70, 140 … / 0, 80, 160 …) and the outer
   right/bottom line inside the 350 × 480 box. Desktop (2D0-0): 6 × 5 cells
   of min-height 120 separated by 1px gaps (row pitch 121, total 606). Lines
   are inset box-shadows, so they never change the layout. */
.partners__grid {
  --line: color-mix(in srgb, var(--color-ink) 35%, transparent);
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  box-shadow: inset -1px -1px 0 var(--line);
  list-style: none;
}
.partners__cell {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 80px;
  padding: 8px;
  box-shadow: inset 1px 1px 0 var(--line);
}
/* Logos keep their own aspect ratio (width/height attributes) and fit a
   54 × 40 box on mobile, 150 × 60 on desktop; rasters never scale above
   their intrinsic size. */
.partners__cell img {
  width: auto;
  height: auto;
  max-width: min(96px, 100%); /* 2026-10-24, human: logos fill the mobile cell like on desktop, 75% of its width (was 54 × 40, then 64 × 48) */
  max-height: 56px;
}

@media (min-width: 1024px) {
  .partners {
    padding-top: 32px;
  }
  .partners {
    padding-bottom: 96px;
  }
  .partners__foot {
    margin-top: 64px;
  }
  .partners__title {
    font-size: var(--text-display); /* audit 2026-10-24: the h1 size, not above it (was 72) */
  }
  .partners__sub {
    margin-top: 24px;
    font-size: 20px;
    line-height: 140%;
  }
  .partners__grid {
    grid-template-columns: repeat(6, minmax(0, 1fr));
    box-shadow: none;
    border-right: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
  }
  .partners__cell {
    min-height: 121px;
    padding: 16px;
  }
  .partners__cell img {
    max-width: min(150px, 100%);
    max-height: 60px;
  }
}

/* Marquee (2026-10-24, human: «лента в 2 ряда, которая бесконечно крутится»):
   built by js/site.js out of the grid above: two rows on desktop, three on
   mobile, every second row offset by half a cell (brick pattern); each row
   holds its logos twice and moves one copy per loop. No lines, no hover
   pause (human). Geometry is explicit: every cell is absolutely positioned
   at index × cell width with inline px values set by the script, the list
   has an inline px width, and the loop animates `left` through the Web
   Animations API, so nothing depends on intrinsic (max-content) sizing, on
   flex-basis or on transforms, which overlapped the copies in the human's
   browser under body { zoom }. Speed 20px/s. Rows are full-bleed: the lane
   padding sits on the title and the grid wrapper, not on the section.
   Second R7 exception by the human (after the hero icon); without JS or
   under prefers-reduced-motion the static grid stays. */
.partners__marquee {
  --cell-w: 128px; /* 2026-10-24: mobile cells 128 × 96 for the larger logos (was 108 × 80) */
  --cell-h: 96px;
}
.partners__row {
  position: relative;
  overflow: hidden;
}
.partners__list {
  position: absolute;
  top: 0;
  left: 0;
  list-style: none;
}
.partners__list .partners__cell {
  position: absolute;
  top: 0;
  min-height: 0;
  padding: 8px;
  box-shadow: none;
}
@media (min-width: 1024px) {
  .partners__marquee {
    --cell-w: 200px;
    --cell-h: 121px;
  }
  .partners__list .partners__cell {
    padding: 16px;
  }
}