/* ==========================================================================
   Partners — two eyebrow-headed groups ("Our digital partners", "Our
   traditional media partners"), each with a short green rule and two
   full-bleed logo marquees. Figma "Home Page": y 8056 → 9007 (desktop).
   "Mobile Home": y 6127 → 6549 (no rules on mobile).
   Uses the shared .marquee / .marquee__track component (and its keyframes)
   from base.css; nothing here is animated on its own.

   Logo exports (assets/, 2x, shown at half size), in marquee order:
     Row 1 (digital, scrolls left)          Row 3 (traditional, scrolls left)
       Rectangle_216 TikTok                   Rectangle_229_full Foxtel *
       Rectangle_194 Ahrefs                   Rectangle_222 Spotify
       Rectangle_210 Google Partner (300×120) Rectangle_233 QMS (300×120)
       Rectangle_201 Meta                     Rectangle_228 oOh!media
       Rectangle_209 LinkedIn                 Rectangle_232 GoTransit Media Group
       Rectangle_215 Zoho                     Rectangle_236 JCDecaux ("logo 2")
                                              Rectangle_237 Weatherzone
     Row 2 (digital, scrolls right)         Row 4 (traditional, scrolls right)
       Rectangle_197_full YouTube *           Rectangle_225_full news.com.au *
       Rectangle_195 Pinterest                Rectangle_223 Mamamia
       Rectangle_214 Reddit                   Rectangle_235 Civic Outdoor
       Rectangle_196 Snapchat                 Rectangle_224 LiSTNR
       Rectangle_208 Screaming Frog           Rectangle_231 Hope 103.2
       Rectangle_218 ChatGPT                  Rectangle_239 Nova
                                              Rectangle_234_full SBS (300×120) *

   *  "_full" files are NOT straight Figma exports (see DEPENDENCIES.md,
      "Derived assets"): those logo boxes sit partly outside the Figma frame,
      so the real exports are edge-clipped. They were rebuilt at 2x from the
      original image fills in the .fig file with the same FIT / FILL scaling
      Figma uses. Replace with proper exports if the design is re-exported.
   Not built: Rectangle 241 (edge-clipped second TikTok, the loop covers it)
   and Rectangle 221 (a sliver of the Aston Homes CLIENT logo at the right
   edge of the digital row — a designer leftover).

   Each row's <ul> is exactly one Figma repeat cycle, with Figma's own
   (uneven) gaps between the logo boxes, so the first frame is pixel-exact and
   the loop is seamless:
     row 1  TikTok −207 → TikTok 1553   = 1760px  (6 logos)
     row 2  YouTube −101 → YouTube 1787 = 1888px  (6 logos)
     row 3  Foxtel −234 → Foxtel 1847   = 2081px  (7 logos)
     row 4  news −71 … SBS 1748 + 49px closing gap = 2168px (7 logos; the
            Figma row has no second news.com.au, 49px repeats its last gaps)
   ========================================================================== */

.section--partners {
  --logo-gap: 21px;   /* uniform gap used below 1024px (desktop uses --g1…--g7) */
  --row-h: 120px;     /* row box = tallest logo (Google Partner / QMS / SBS, 300×120) */
  /* Industries ends at 7788: (8056 − 7788) / 2 = 134.
     Comparison starts at 9295: (9295 − 9007) / 2 = 144. */
  padding-top: 134px;
  padding-bottom: 144px;
}

/* ---- Group headings (inside .container, dot x = 101, text x = 122) -------- */
.section--partners .eyebrow {
  font-weight: 400;                 /* it is an <h2>; Europa Regular, 20/1.24 */
}

.section--partners .partners__rule {
  margin-top: 46px;                 /* eyebrow bottom 8081 → Line 60 at 8127 */
  border-top-width: 2px;            /* Line 60 / 62: 125 × 2px, #63f9a2 */
}

/* Second group: row-2 box bottom 8460 → eyebrow 8581 */
.section--partners .partners__group--traditional { margin-top: 121px; }

/* ---- Logo rows (full-bleed marquees) -------------------------------------- */
.section--partners .partners__rows {
  display: flex;
  flex-direction: column;
  gap: 62px;                        /* row-1 box bottom 8278 → row-2 box top 8340 */
  margin-top: 29px;                 /* line bottom 8129 → row-1 box top 8158 */
}
.section--partners .partners__group--traditional .partners__rows {
  gap: 74px;                        /* row-3 box bottom 8813 → row-4 box top 8887 */
  margin-top: 39px;                 /* line bottom 8654 → row-3 box top 8693 */
}

.section--partners .partners__track {
  height: var(--row-h);
  align-items: center;
  /* base.css slides the track by −50% per loop. A cycle (1760–2168px) is
     narrower than 1920 + the starting offset, so each track carries FOUR
     copies of its list (half the track = two cycles). Durations are per row
     (see below) so every row moves at the same ≈39px/s as the clients strip. */
  animation-duration: 90s;
}

/* One <ul> = one loop cycle; the three aria-hidden copies keep the loop
   seamless. Every <li> — including the last — carries its own right margin,
   so the <ul> width is exactly one cycle and translateX(-50%) lands on a seam. */
.section--partners .partners__logos {
  display: flex;
  align-items: center;
  flex: none;
}
.section--partners .partners__logos li { flex: none; }
.section--partners .partners__logos li:nth-child(1) { margin-right: var(--g1); }
.section--partners .partners__logos li:nth-child(2) { margin-right: var(--g2); }
.section--partners .partners__logos li:nth-child(3) { margin-right: var(--g3); }
.section--partners .partners__logos li:nth-child(4) { margin-right: var(--g4); }
.section--partners .partners__logos li:nth-child(5) { margin-right: var(--g5); }
.section--partners .partners__logos li:nth-child(6) { margin-right: var(--g6); }
.section--partners .partners__logos li:nth-child(7) { margin-right: var(--g7); }
.section--partners .partners__logo { display: block; }

/* Gaps between the logo boxes, straight from the Figma x positions. */
.section--partners .partners__row--1 { --g1: 40px; --g2: 25px; --g3: 11px; --g4: 21px; --g5: 3px;  --g6: 27px; }
.section--partners .partners__row--2 { --g1: 49px; --g2: 29px; --g3: 28px; --g4: 48px; --g5: 68px; --g6: 69px; }
.section--partners .partners__row--3 { --g1: 67px; --g2: 25px; --g3: 0px;  --g4: 19px; --g5: 16px; --g6: 27px; --g7: 27px; }
.section--partners .partners__row--4 { --g1: 19px; --g2: 29px; --g3: 28px; --g4: 48px; --g5: 49px; --g6: 49px; --g7: 49px; }

/* Starting phase: the first logo box sits where the Figma draws it. */
.section--partners .partners__row--1 .partners__track { margin-left: -207px; }
.section--partners .partners__row--2 .partners__track { margin-left: -101px; }
.section--partners .partners__row--3 .partners__track { margin-left: -234px; }
.section--partners .partners__row--4 .partners__track { margin-left: -71px; }

/* Same px/s on every row: duration ∝ 2 × cycle (the −50% travel). */
.section--partners .partners__row--2 .partners__track { animation-duration: 97s; }
.section--partners .partners__row--3 .partners__track { animation-duration: 106s; }
.section--partners .partners__row--4 .partners__track { animation-duration: 111s; }

/* Rows 1 and 3 hold a 300×120 logo; Figma bottom-aligns the 105px logos 3px
   above its baseline (8275 vs 8278, 8810 vs 8813) rather than centring them.
   A few boxes sit higher still (--mb per <li>): TikTok 8164, LinkedIn 8165,
   Foxtel / GoTransit 8700, Weatherzone 8699. */
.section--partners .partners__row--1,
.section--partners .partners__row--3 { --mb: 3px; }
.section--partners .partners__row--1 .partners__logos,
.section--partners .partners__row--3 .partners__logos { align-items: flex-end; }
.section--partners .partners__row--1 .partners__logo:not(.partners__logo--lg),
.section--partners .partners__row--3 .partners__logo:not(.partners__logo--lg) { margin-bottom: var(--mb); }
/* :where() keeps these at class-level specificity so the tablet / mobile
   resets below (plain `li`) win without repeating the selectors. */
.section--partners .partners__row--1 :where(li:nth-child(1)) { --mb: 9px; }   /* TikTok 8164 */
.section--partners .partners__row--1 :where(li:nth-child(5)) { --mb: 7px; }   /* LinkedIn 8165 */
.section--partners .partners__row--3 :where(li:nth-child(1)) { --mb: 8px; }   /* Foxtel (Rectangle 238) 8700 */
.section--partners .partners__row--3 :where(li:nth-child(5)) { --mb: 7px; }   /* GoTransit 8700 */
.section--partners .partners__row--3 :where(li:nth-child(7)) { --mb: 9px; }   /* Weatherzone 8699 */
/* The Figma draws its two Foxtel boxes at different heights: Rectangle 229
   (the first one, x −234) sits at 8705, Rectangle 238 (x 1847) at 8700. Only
   the first list's Foxtel takes the 8705 position. */
.section--partners .partners__row--3 :where(.partners__logos:first-child li:nth-child(1)) { --mb: 3px; }

/* ---- Tablet ---------------------------------------------------------------- */
@media (max-width: 1024px) {
  .section--partners {
    --logo-gap: 16px;
    --row-h: 96px;
    padding-top: 96px;
    padding-bottom: 104px;
  }
  .section--partners .partners__rule { margin-top: 36px; }
  .section--partners .partners__group--traditional { margin-top: 96px; }
  .section--partners .partners__rows { gap: 48px; margin-top: 24px; }
  .section--partners .partners__group--traditional .partners__rows { gap: 56px; margin-top: 32px; }
  .section--partners .partners__logo { width: auto; height: 85px; }
  .section--partners .partners__logo--lg { height: 96px; }
  /* Scaled logos → uniform gaps per row instead of the Figma desktop gaps. */
  .section--partners .partners__row { --g1: var(--logo-gap); --g2: var(--logo-gap); --g3: var(--logo-gap); --g4: var(--logo-gap); --g5: var(--logo-gap); --g6: var(--logo-gap); --g7: var(--logo-gap); }
  .section--partners .partners__row--1 li,
  .section--partners .partners__row--3 li { --mb: 2px; }
  .section--partners .partners__row--1 .partners__track { margin-left: -160px; }
  .section--partners .partners__row--2 { --logo-gap: 38px; }
  .section--partners .partners__row--2 .partners__track { margin-left: -81px; }
  .section--partners .partners__row--3 { --logo-gap: 14px; }
  .section--partners .partners__row--3 .partners__track { margin-left: -148px; }
  .section--partners .partners__row--4 { --logo-gap: 26px; }
  .section--partners .partners__row--4 .partners__track { margin-left: -54px; }   /* news first: Mamamia at ≈184 */
}

/* ---- Mobile (Figma "Mobile Home", 402 wide) -------------------------------- */
@media (max-width: 640px) {
  .section--partners {
    --logo-gap: 13px;               /* ~165px pitch for 153px logos */
    --row-h: 69px;                  /* digital rows: large logo at mobile scale (173 × 69) */
    padding-top: 44px;              /* (6127 − 6040) / 2 */
    padding-bottom: 44px;           /* (6645 − 6549) / 2, less the 3.5px box overshoot */
  }
  .section--partners .eyebrow { gap: 16px; }                  /* dot x = 20, text x = 42 */
  .section--partners .partners__rule { display: none; }       /* no rules in the mobile frame */
  .section--partners .partners__group--traditional {
    --row-h: 65px;                  /* traditional rows are drawn ~5% smaller (142 × 57 / 161 × 64) */
    margin-top: 43px;               /* row-2 box bottom 6320 → eyebrow 6363 */
  }
  .section--partners .partners__rows {
    gap: 16px;                      /* row centres 84px apart (6201 → 6285) */
    margin-top: 19px;               /* eyebrow bottom 6147 → row-1 box top 6166 */
  }
  .section--partners .partners__group--traditional .partners__rows {
    gap: 15px;                      /* row-3 box bottom 6473 → row-4 box top 6488 (centre 6520) */
    margin-top: 25px;               /* eyebrow bottom 6383 → row-3 box top 6408 (Nova 6409, Spotify bottom 6472) */
  }
  .section--partners .partners__logo { width: auto; height: 61px; }                            /* 267×105 → 155×61 */
  .section--partners .partners__logo--lg { height: 69px; }                                      /* 300×120 → 173×69 */
  .section--partners .partners__group--traditional .partners__logo { height: 57px; }           /* 267×105 → 145×57 */
  .section--partners .partners__group--traditional .partners__logo--lg { height: 65px; }       /* 300×120 → 163×65 */
  .section--partners .partners__row--1 li,
  .section--partners .partners__row--3 li { --mb: 1px; }                                        /* 6234 vs 6235 */
  /* The mobile frame draws Meta as the large digital logo (173 × 69) and
     Google Partner at the small size (153 × 61) — the reverse of desktop. */
  .section--partners .partners__row--1 .partners__logo--lg { height: 61px; }
  .section--partners .partners__row--1 li:nth-child(4) .partners__logo { height: 69px; }
  .section--partners .partners__row--1 li:nth-child(4) { --mb: 0px; }
  .section--partners .partners__row--2,
  .section--partners .partners__row--3,
  .section--partners .partners__row--4 { --logo-gap: 13px; }
  .section--partners .partners__row--1 .partners__track { margin-left: -379px; }  /* Google Partner at x = −44, Meta at 122 (Figma −44 / 123) */
  .section--partners .partners__row--2 .partners__track { margin-left: -146px; }  /* Reddit at x = 185 */
  .section--partners .partners__row--3 .partners__track { margin-left: -186px; }  /* Spotify at x = −28 */
  .section--partners .partners__row--4 .partners__track { margin-left: -120px; }  /* Mamamia at x = 35 */
}