/* ============ TRUST TICKER (inside the hero, below the in-stock strip) ============
   Ham 2026-11-07: scrolling trust ticker matching LIVE (surgronic.com).
   Measured from LIVE (DESIGN-TOKENS.md, browser task 37220409):
   - Bar bg #0A1629, 1px hairline top/bottom.
   - Bold white label ~14px + muted #94A3B8 description, blue #2589F5 dot
     separators, ~16px blue outline icons on LIVE (icons omitted here — the
     claims are text; the bullet separators carry the rhythm).
   - Continuous horizontal loop moving LEFT, ~74px/s on LIVE, pauses on hover.
   Content: ONLY claims DEV already makes, exact wording from DEV pages
   (hero trust-strip + trust.quote + why.specT). No LIVE claims imported.
   CSS-only seamless loop: the 5 items are duplicated once (10 total) and the
   track translates -50% (exactly one set), so it never jumps. Pause on hover,
   static + horizontally scrollable under prefers-reduced-motion, RTL-safe. */

.rd-ticker{margin-top:64px;
  background:#0A1629;
  border-top:1px solid rgba(255,255,255,.07);
  border-bottom:1px solid rgba(255,255,255,.07);
  overflow:hidden;
}
.rd-ticker-track{
  display:flex;align-items:center;width:max-content;
  animation:rdTicker 37.5s linear infinite;
  /* Force the two sets LTR so the -50% seamless loop works in RTL (Arabic).
     The sets/items keep the page direction so Arabic text reads correctly. */
  direction:ltr;
}
[dir="rtl"] .rd-ticker-set{direction:rtl}
[dir="rtl"] .rd-ticker-item{direction:rtl}
.rd-ticker-set{display:flex;align-items:center;flex:none}
/* Owner directive: the ticker keeps sliding even on hover. Do not re-add a hover pause. */
@keyframes rdTicker{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.rd-ticker-item{
  display:flex;align-items:center;gap:8px;white-space:nowrap;
  padding:15px 0;font-size:14px;line-height:1.4;
}
/* Small blue outline icons before each claim (LIVE has ~16px blue icons;
   Ham 2026-11-07: the banner must have icons, small ones). */
.rd-ticker-item svg{flex:none;width:16px;height:16px;color:#2589F5}
.rd-ticker-item b{color:#fff;font-weight:700}
.rd-ticker-item span{color:#94A3B8}
.rd-ticker-sep{color:#2589F5;font-size:14px;padding:0 22px;flex:none}
@media (prefers-reduced-motion:reduce){
  /* Owner directive: the ticker keeps sliding. Do not re-add animation:none here. */
  .rd-ticker{overflow-x:auto}
}

/* Ticker sits between sections: 56px above it (margin) and the hero's normal
   56px bottom padding below it, so it reads as a band in the middle. */