/* Hoisted from the design's inline styles. Declarations are copied
   verbatim; only the :hover rules are new, because the export's
   `style-hover` attribute has no inline equivalent. */

/* --- design base (from the export's <helmet>) --- */
*{box-sizing:border-box}
/* The design export's <helmet> reset. `font-family` reads the TOKEN rather than
   the literal it was exported with: SiteShell loads all 42 sheets on EVERY page,
   so this `body` rule applied site-wide and a hardcoded 'Poppins' here silently
   overrode `--font-body` — meaning no whitelabel could change its body font on
   any SiteShell-routed page (its checkout rendered in Poppins while its own
   landing rendered in Helvneue55). --font-body IS Poppins on the main
   storefront, so nothing changes there.
   `background`/`color` stay as exported for now; they are the same class of
   duplication and want the same treatment, but changing them moves the main
   storefront's ground and copy colour, which is a separate decision. */
    body{margin:0;background:#fff;font-family:var(--font-body);color:#211A46}
    a{color:var(--color-primary)}a:hover{color:var(--color-primary-deep)}

/* --- element rules --- */
.sf-reviews-1 { font-family:'Poppins',sans-serif;background:#fff; }
.sf-reviews-2 { background:linear-gradient(90deg,var(--color-primary) 0%,var(--color-secondary) 100%);padding:48px 24px 44px; }
.sf-reviews-3 { max-width:1140px;margin:0 auto; }
.sf-reviews-4 { display:block;font-size: var(--text-md);font-weight:300;color:rgba(255,255,255,.85);margin-bottom:6px; }
.sf-reviews-5 { font-size: var(--text-h1);font-weight:500;color:#fff;margin:0; }
.sf-reviews-6 { font-size: var(--text-sm);color:#fff;display:flex;align-items:center;gap:8px;margin-top:18px; }
.sf-reviews-7 { color:#fff;text-decoration:none; }
.sf-reviews-8 { font-size: var(--text-base);opacity:.7; }
.sf-reviews-9 { color:rgba(255,255,255,.85); }
.sf-reviews-10 { padding:56px 24px;background:#fff; }
.sf-reviews-11 { max-width:940px;margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);gap:24px; }
.sf-reviews-12 { background:#fff;border:1px solid var(--line-card);border-radius: var(--r-2xl);box-shadow:5px 15px 40px 0 rgba(0,0,0,.04);padding:30px 24px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:14px; }
.sf-reviews-13 { height:34px;max-width:160px;object-fit:contain; }
.sf-reviews-14 { font-size: var(--text-2xl);font-weight:600;color: var(--ink-800); }
.sf-reviews-15 { color:var(--color-star);font-size: var(--text-lg);letter-spacing:2px; }
.sf-reviews-16 { font-size: var(--text-sm);font-weight:500;color:var(--color-primary);text-decoration:none; }
.sf-reviews-17 { padding:24px 24px 80px;background:#fff; }
.sf-reviews-18 { text-align:center;margin-bottom:44px; }
.sf-reviews-19 { columns:3;column-gap:24px; }
.sf-reviews-20 { break-inside:avoid;background:#fff;border:1px solid var(--line-card);border-radius: var(--r-xl);box-shadow:5px 15px 40px 0 rgba(0,0,0,.04);padding:26px 24px;margin-bottom:24px;display:inline-block;width:100%; }
.sf-reviews-21 { color:var(--color-star);font-size: var(--text-md);letter-spacing:2px;margin-bottom:14px; }
.sf-reviews-22 { font-size: var(--text-base);color: var(--ink-700);line-height:1.6;margin:0 0 18px; }
.sf-reviews-23 { display:flex;align-items:center;gap:12px;padding-top:16px;border-top:1px solid var(--line-hair); }
.sf-reviews-24 { width:40px;height:40px;flex-shrink:0;border-radius:50%;background:#EDE6FE;color:var(--color-primary);font-weight:700;font-size:var(--text-base);font-family:'Poppins';line-height:normal;display:flex;align-items:center;justify-content:center; }
.sf-reviews-25 { font-size: var(--text-sm);font-weight:600;color: var(--ink-800); }
.sf-reviews-26 { font-size: var(--text-xs);color: var(--ink-400); }

/* --- white links keep their colour on hover (see the port pipeline) --- */
.sf-reviews-4:hover { color: rgba(255,255,255,.85); }
.sf-reviews-5:hover { color: #fff; }
.sf-reviews-6:hover { color: #fff; }
.sf-reviews-7:hover { color: #fff; }
.sf-reviews-9:hover { color: rgba(255,255,255,.85); }

/* The export computes these two in its logic block rather than as classes. */
.sf-reviews-sec-title { font-size: var(--text-h2);font-weight:500;letter-spacing:-.3px;margin:0;line-height:1.15;color: var(--ink-800); }
.sf-reviews-sec-sub { font-size: var(--text-lg);font-weight:400;color: var(--ink-600);margin:12px 0 0;line-height:1.3; }

/* --- Mobile: the 3-column platform cards + 3-column masonry become single
   columns; the platforms drop to a phone-friendly stack instead of squeezing
   three cards side-by-side. */
@media (max-width: 992px) {
  .sf-reviews-11 { grid-template-columns: 1fr 1fr; }
  .sf-reviews-19 { columns: 2; }
}

@media (max-width: 640px) {
  .sf-reviews-2 { padding: 32px 20px 28px; }
  .sf-reviews-10 { padding: 40px 20px; }
  .sf-reviews-11 { grid-template-columns: 1fr; }
  .sf-reviews-17 { padding: 16px 20px 56px; }
  .sf-reviews-19 { columns: 1; }
  .sf-reviews-18 { margin-bottom: 24px; }
  .sf-reviews-20 { padding: 20px 18px; }
}