/* Client Marquee — tunable sizing & motion tokens */
.cm-section {
  /* Taller boxes so vertical logos (Makeen, AIKA) center cleanly */
  --cm-card-w: clamp(220px, 20vw, 320px);
  --cm-card-ratio: 1.55 / 1;
  --cm-gap: 16px;
  --cm-row-gap: 14px;
  --cm-radius: 16px;

  --cm-pad-y: clamp(56px, 10vw, 120px);
  --cm-pad-x: max(16px, env(safe-area-inset-left, 0px));

  --cm-bg: #050505;
  --cm-card-face: #ffffff;
  --cm-text: #f5f0e8;
  --cm-text-dim: rgba(245, 240, 232, 0.55);
  --cm-brass: #9ba44a;
  --cm-brass-bright: #b1b765;

  --cm-font-ar: "Cairo", sans-serif;
  --cm-font-en: "Montserrat", sans-serif;

  --cm-rise: 90px;
}

@media (max-width: 1023px) {
  .cm-section {
    --cm-card-w: clamp(200px, 34vw, 270px);
    --cm-card-ratio: 1.5 / 1;
    --cm-gap: 14px;
    --cm-row-gap: 12px;
  }
}

@media (max-width: 767px) {
  .cm-section {
    --cm-card-w: 200px;
    --cm-card-ratio: 1.45 / 1;
    --cm-gap: 12px;
    --cm-row-gap: 12px;
    --cm-radius: 14px;
    --cm-rise: 40px;
    --cm-pad-y: 0px;
  }
}