/* HSRMed "Who we serve" detail pages (serve_*.html).
   Shared look for all nine audience pages. Uses the home page palette:
   navy #00283a, deep navy #012232, lime #92c500, green #6f9600.
   Header styles live in css/hsrnav.css; this file styles everything below the header. */

:root {
  --sv-navy: #00283a;
  --sv-navy-2: #012232;
  --sv-navy-3: #05374e;
  --sv-lime: #92c500;
  --sv-green: #6f9600;
  --sv-green-dk: #4e6a00;
  --sv-ink: #1d2b33;
  --sv-muted: #5b6b73;
  --sv-line: #e3e8ea;
  --sv-soft: #f3f6f8;
  --sv-red: #b42318;
  --sv-red-bg: #fde8e6;
  --sv-amber: #8a5300;
  --sv-amber-bg: #fff1d6;
  --sv-ok: #3f6a00;
  --sv-ok-bg: #ecf6d6;
  --sv-blue: #1f5f8b;
  --sv-blue-bg: #e4f0f8;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body.sv { margin: 0; background: #fff; color: var(--sv-ink); font-family: "Open Sans", Arial, Helvetica, sans-serif; font-size: 16px; line-height: 1.6; overflow-x: hidden; }
body.sv main img { max-width: 100%; height: auto; }
body.sv main a { color: var(--sv-green); }
body.sv main a:hover { color: var(--sv-green-dk); }
body.sv main a:focus-visible, body.sv main button:focus-visible, body.sv summary:focus-visible, body.sv tr:focus-visible { outline: 2px solid var(--sv-lime); outline-offset: 2px; }
.sv-wrap { max-width: 1140px; margin: 0 auto; padding-left: max(16px, env(safe-area-inset-left, 0px)); padding-right: max(16px, env(safe-area-inset-right, 0px)); }

/* Language notice (shown only when a language other than English is selected) */
.sv-langnote { display: none; background: #fff8e1; border-bottom: 1px solid #f0dca0; color: #5c4600; font-size: 14px; }
.sv-langnote.is-on { display: block; }
.sv-langnote .sv-wrap { padding-top: 8px; padding-bottom: 8px; }

/* Hero */
.sv-hero { background: var(--sv-navy) linear-gradient(135deg, #00283a 0%, #012232 55%, #05374e 100%); color: #fff; padding: 56px 0 64px; position: relative; overflow: hidden; }
.sv-hero::after { content: ""; position: absolute; right: -120px; top: -120px; width: 420px; height: 420px; border-radius: 50%; border: 60px solid rgba(146, 197, 0, 0.07); pointer-events: none; }
.sv-crumb { font-size: 13px; margin: 0 0 18px; color: rgba(255,255,255,0.65); }
.sv-crumb a, body.sv .sv-crumb a { color: rgba(255,255,255,0.85); text-decoration: none; border-bottom: 1px solid rgba(255,255,255,0.3); }
.sv-crumb a:hover { color: var(--sv-lime); border-color: var(--sv-lime); }
.sv-hero-grid { display: grid; grid-template-columns: 1.15fr 0.85fr; gap: 40px; align-items: center; position: relative; z-index: 1; }
.sv-eyebrow { display: inline-flex; align-items: center; gap: 10px; color: var(--sv-lime); font-weight: 700; font-size: 13px; letter-spacing: 0.08em; text-transform: uppercase; margin: 0 0 12px; }
.sv-eyebrow i { display: inline-block; width: 38px; height: 38px; line-height: 38px; border-radius: 50%; background: rgba(146,197,0,0.14); color: var(--sv-lime); text-align: center; font-size: 17px; }
.sv-hero h1 { font-size: clamp(2rem, 4vw, 3rem); line-height: 1.12; font-weight: 800; margin: 0 0 16px; letter-spacing: -0.01em; text-wrap: balance; }
.sv-hero .sv-lead { font-size: 1.1rem; color: #c9d6dc; margin: 0 0 26px; max-width: 640px; }
.sv-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.sv-btn, body.sv a.sv-btn { display: inline-block; padding: 12px 22px; border-radius: 3px; font-weight: 700; font-size: 14px; letter-spacing: 0.04em; text-transform: uppercase; text-decoration: none; transition: background 0.2s, color 0.2s, border-color 0.2s; border: 1px solid transparent; }
.sv-btn-primary, body.sv a.sv-btn-primary { background: var(--sv-lime); color: var(--sv-navy); border-color: var(--sv-lime); }
.sv-btn-primary:hover, body.sv a.sv-btn-primary:hover { background: #a8dc0a; color: var(--sv-navy); }
.sv-btn-ghost, body.sv a.sv-btn-ghost { color: #fff; border-color: rgba(255,255,255,0.55); }
.sv-btn-ghost:hover, body.sv a.sv-btn-ghost:hover { color: var(--sv-navy); background: #fff; border-color: #fff; }
.sv-hero-points { list-style: none; margin: 0; padding: 22px 24px; background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.12); border-top: 4px solid var(--sv-lime); border-radius: 3px; }
.sv-hero-points li { display: flex; gap: 12px; padding: 9px 0; color: #e6eef1; font-size: 15px; border-bottom: 1px solid rgba(255,255,255,0.08); }
.sv-hero-points li:last-child { border-bottom: 0; }
.sv-hero-points li::before { content: ""; flex: none; width: 8px; height: 8px; border-radius: 50%; background: var(--sv-lime); margin-top: 9px; }
.sv-hero-points strong { color: #fff; }

/* Sections */
.sv-section { padding: 64px 0; }
.sv-section.alt { background: var(--sv-soft); }
.sv-section.dark { background: var(--sv-navy); color: #fff; }
.sv-head { max-width: 780px; margin: 0 auto 34px; text-align: center; }
.sv-kicker { color: var(--sv-green); font-weight: 700; font-size: 13px; letter-spacing: 0.08em; text-transform: uppercase; margin: 0 0 6px; }
.sv-h2 { color: var(--sv-navy); font-size: clamp(1.6rem, 3vw, 2.2rem); line-height: 1.2; font-weight: 800; text-transform: uppercase; margin: 0 0 12px; text-wrap: balance; }
.sv-section.dark .sv-h2 { color: #fff; }
.sv-head p { color: var(--sv-muted); font-size: 1.05rem; margin: 0; }
.sv-section.dark .sv-head p { color: #c9d6dc; }

/* Challenge / value cards */
.sv-grid-3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.sv-grid-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; }
.sv-card { background: #fff; border: 1px solid var(--sv-line); border-radius: 3px; padding: 24px 22px; }
.sv-card h3 { color: var(--sv-navy); font-size: 1rem; font-weight: 700; text-transform: uppercase; margin: 14px 0 8px; letter-spacing: 0.01em; }
.sv-card p { color: var(--sv-muted); font-size: 0.94rem; margin: 0; }
.sv-card .sv-ic { display: inline-block; width: 48px; height: 48px; line-height: 48px; border-radius: 50%; background: var(--sv-navy); color: var(--sv-lime); text-align: center; font-size: 1.2em; }
.sv-card.problem { border-top: 4px solid #c9d1d5; }
.sv-card.value { border-top: 4px solid var(--sv-lime); }
.sv-card ul { margin: 10px 0 0; padding-left: 18px; color: var(--sv-muted); font-size: 0.92rem; }
.sv-card ul li { margin: 4px 0; }

/* Sample screen frame */
.sv-screen { background: #fff; border: 1px solid #cfd8dc; border-radius: 8px; box-shadow: 0 18px 40px rgba(0, 40, 58, 0.16); overflow: hidden; }
.sv-screen-bar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 10px 14px; background: var(--sv-navy); color: #fff; font-size: 13px; }
.sv-dots { display: inline-flex; gap: 6px; }
.sv-dots span { width: 10px; height: 10px; border-radius: 50%; background: rgba(255,255,255,0.25); }
.sv-screen-title { font-weight: 700; letter-spacing: 0.02em; }
.sv-screen-title b { color: var(--sv-lime); }
.sv-sample { margin-left: auto; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; color: var(--sv-navy); background: var(--sv-lime); border-radius: 3px; padding: 2px 8px; }
.sv-screen-body { padding: 18px; }
.sv-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0 0 14px; }
.sv-toolbar .sv-tb-label { font-size: 12px; font-weight: 700; text-transform: uppercase; color: var(--sv-muted); margin-right: 4px; letter-spacing: 0.05em; }
.sv-chip { font: inherit; font-size: 13px; font-weight: 600; color: var(--sv-navy); background: #fff; border: 1px solid #c8d2d7; border-radius: 999px; padding: 5px 12px; cursor: pointer; }
.sv-chip:hover { border-color: var(--sv-lime); }
.sv-chip[aria-pressed="true"] { background: var(--sv-navy); color: #fff; border-color: var(--sv-navy); }
.sv-chip .n { display: inline-block; min-width: 20px; margin-left: 6px; padding: 0 6px; border-radius: 999px; background: rgba(0,40,58,0.08); font-size: 11px; }
.sv-chip[aria-pressed="true"] .n { background: rgba(255,255,255,0.18); }
.sv-note { font-size: 12.5px; color: var(--sv-muted); margin: 12px 0 0; }
.sv-caption { text-align: center; font-size: 13px; color: var(--sv-muted); margin: 14px auto 0; max-width: 760px; }

/* KPI tiles */
.sv-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin: 0 0 16px; }
.sv-kpi { border: 1px solid var(--sv-line); border-radius: 6px; padding: 12px 14px; background: #fbfcfd; }
.sv-kpi .k-label { font-size: 12px; color: var(--sv-muted); font-weight: 600; }
.sv-kpi .k-value { font-size: 1.7rem; font-weight: 800; color: var(--sv-navy); line-height: 1.15; margin: 2px 0; font-variant-numeric: tabular-nums; }
.sv-kpi .k-delta { font-size: 12px; font-weight: 700; }
.k-up-good, .k-down-good { color: var(--sv-ok); }
.k-up-bad, .k-down-bad { color: var(--sv-red); }
.k-flat { color: var(--sv-muted); }

/* Data table */
.sv-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; border: 1px solid var(--sv-line); border-radius: 6px; }
.sv-table { width: 100%; border-collapse: collapse; font-size: 13.5px; font-variant-numeric: tabular-nums; min-width: 760px; }
.sv-table th { position: sticky; top: 0; background: #eef2f4; color: var(--sv-navy); font-size: 11.5px; text-transform: uppercase; letter-spacing: 0.04em; font-weight: 700; text-align: left; padding: 10px 10px; border-bottom: 1px solid #d6dee2; white-space: nowrap; }
.sv-table th[data-sort] { cursor: pointer; user-select: none; }
.sv-table th[data-sort]::after { content: " \2195"; color: #9aa9b0; font-weight: 400; }
.sv-table th[aria-sort="ascending"]::after { content: " \2191"; color: var(--sv-green); }
.sv-table th[aria-sort="descending"]::after { content: " \2193"; color: var(--sv-green); }
.sv-table td { padding: 10px; border-bottom: 1px solid #edf1f3; vertical-align: middle; white-space: nowrap; }
.sv-table tbody tr:hover td { background: #f7faf0; }
.sv-table tbody tr.is-selected td { background: #eef6dc; }
.sv-table tbody tr[data-row] { cursor: pointer; }
.sv-table td.num, .sv-table th.num { text-align: right; }
.sv-table .who { font-weight: 700; color: var(--sv-navy); }
.sv-table .sub { display: block; font-size: 11.5px; color: var(--sv-muted); font-weight: 400; }
.sv-table tr.is-hidden { display: none; }

/* Pills, flags and score badges */
.pill { display: inline-block; font-size: 11.5px; font-weight: 700; border-radius: 999px; padding: 2px 9px; white-space: nowrap; }
.pill.red { color: var(--sv-red); background: var(--sv-red-bg); }
.pill.amber { color: var(--sv-amber); background: var(--sv-amber-bg); }
.pill.green { color: var(--sv-ok); background: var(--sv-ok-bg); }
.pill.blue { color: var(--sv-blue); background: var(--sv-blue-bg); }
.pill.grey { color: #4a5960; background: #eceff1; }
.prio { display: inline-flex; align-items: center; gap: 6px; font-weight: 700; font-size: 12.5px; }
.prio::before { content: ""; width: 10px; height: 10px; border-radius: 50%; background: currentColor; }
.prio.p1 { color: var(--sv-red); }
.prio.p2 { color: #c27700; }
.prio.p3 { color: var(--sv-green); }
.score { display: inline-block; min-width: 38px; text-align: center; font-weight: 800; border-radius: 4px; padding: 2px 6px; color: #fff; }
.score.s-low { background: #b42318; }
.score.s-mid { background: #c27700; }
.score.s-high { background: #4e7d00; }
.delta { font-size: 12px; font-weight: 700; margin-left: 4px; }
.delta.dn { color: var(--sv-red); }
.delta.up { color: var(--sv-ok); }
.delta.eq { color: var(--sv-muted); }
.delta.warn { color: #a86400; }
.spark { display: inline-block; width: 84px; height: 24px; vertical-align: middle; }
.spark svg { display: block; width: 100%; height: 100%; overflow: visible; }

/* Split layout: list + detail panel */
.sv-split { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 16px; align-items: start; }
.sv-panel { border: 1px solid var(--sv-line); border-radius: 6px; padding: 16px; background: #fbfcfd; }
.sv-panel h4 { margin: 0; color: var(--sv-navy); font-size: 1.05rem; }
.sv-panel .p-sub { color: var(--sv-muted); font-size: 12.5px; margin: 2px 0 12px; }
.sv-panel dl { display: grid; grid-template-columns: auto 1fr; gap: 6px 12px; margin: 12px 0 0; font-size: 13px; }
.sv-panel dt { color: var(--sv-muted); }
.sv-panel dd { margin: 0; font-weight: 700; color: var(--sv-navy); text-align: right; font-variant-numeric: tabular-nums; }
.sv-panel .p-action { margin-top: 14px; padding: 10px 12px; border-left: 4px solid var(--sv-lime); background: #fff; font-size: 13px; color: var(--sv-ink); }
.sv-panel .p-action b { display: block; font-size: 11px; text-transform: uppercase; letter-spacing: 0.05em; color: var(--sv-green); }
.sv-chart { width: 100%; height: 150px; }
.sv-chart svg { display: block; width: 100%; height: 100%; }
.sv-chart-tall { height: 220px; }
.sv-legend { display: flex; flex-wrap: wrap; gap: 14px; font-size: 12px; color: var(--sv-muted); margin-top: 6px; }
.sv-legend span::before { content: ""; display: inline-block; width: 14px; height: 3px; border-radius: 2px; margin-right: 6px; vertical-align: middle; background: var(--c, var(--sv-navy)); }

/* Phone mockup (people and families) */
.sv-phones { display: flex; flex-wrap: wrap; justify-content: center; gap: 30px; }
.sv-phone { width: 290px; max-width: 100%; border: 10px solid #0d1b22; border-radius: 34px; background: #f6f8f9; box-shadow: 0 20px 44px rgba(0,40,58,0.22); overflow: hidden; }
.sv-phone-top { background: var(--sv-navy); color: #fff; padding: 14px 16px 16px; }
.sv-phone-top .hello { font-size: 12px; color: #c9d6dc; }
.sv-phone-top .name { font-weight: 700; font-size: 16px; }
.sv-phone-body { padding: 14px; display: grid; gap: 10px; }
.sv-tile { background: #fff; border-radius: 12px; padding: 12px 14px; box-shadow: 0 1px 2px rgba(0,0,0,0.06); font-size: 13px; }
.sv-tile h5 { margin: 0 0 6px; font-size: 11px; color: var(--sv-muted); text-transform: uppercase; letter-spacing: 0.06em; }
.sv-ring { display: flex; align-items: center; gap: 14px; }
.sv-ring svg { width: 82px; height: 82px; flex: none; }
.sv-ring .r-text b { display: block; font-size: 15px; color: var(--sv-navy); }
.sv-ring .r-text span { color: var(--sv-muted); font-size: 12.5px; }
.sv-tile .row { display: flex; justify-content: space-between; align-items: center; padding: 5px 0; border-bottom: 1px solid #f0f2f3; }
.sv-tile .row:last-child { border-bottom: 0; }
.sv-tile .msg { border-left: 3px solid var(--sv-lime); padding-left: 10px; color: var(--sv-ink); }
.sv-avatar { display: inline-grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: var(--sv-blue-bg); color: var(--sv-blue); font-size: 11px; font-weight: 800; margin-right: 8px; }

/* Map (rural) */
.sv-map { width: 100%; aspect-ratio: 1 / 0.82; background: #eef3ec; border-radius: 6px; border: 1px solid var(--sv-line); }
.sv-map svg { display: block; width: 100%; height: 100%; }

/* Heat grid (kidney) */
.sv-heat { width: 100%; border-collapse: separate; border-spacing: 4px; font-size: 13px; }
.sv-heat th { font-size: 11.5px; color: var(--sv-muted); font-weight: 700; text-align: center; padding: 4px; }
.sv-heat th.row-h { text-align: left; white-space: nowrap; }
.sv-heat td { text-align: center; font-weight: 800; padding: 10px 4px; border-radius: 4px; color: var(--sv-navy); font-variant-numeric: tabular-nums; }
.h0 { background: #dff0c4; } .h1 { background: #fbe9b0; } .h2 { background: #f8c98a; } .h3 { background: #f1a07a; } .h4 { background: #d8655b; color: #fff !important; }

/* Bars */
.sv-bars { display: grid; gap: 9px; }
.sv-bar { display: grid; grid-template-columns: 130px 1fr 52px; align-items: center; gap: 10px; font-size: 13px; }
.sv-bar .track { display: block; height: 12px; background: #edf1f3; border-radius: 999px; overflow: hidden; }
.sv-bar .fill { display: block; height: 100%; background: var(--sv-green); border-radius: 999px; }
.sv-bar .fill.navy { background: var(--sv-navy-3); }
.sv-bar .v { text-align: right; font-weight: 700; color: var(--sv-navy); font-variant-numeric: tabular-nums; }
.sv-stack { display: flex; height: 22px; border-radius: 4px; overflow: hidden; }
.sv-stack span { display: block; height: 100%; }

/* Steps */
.sv-steps { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 22px; counter-reset: st; }
.sv-steps li { background: #fff; border-top: 4px solid var(--sv-lime); padding: 22px 20px; box-shadow: 0 1px 3px rgba(0,0,0,0.12); counter-increment: st; }
.sv-steps li::before { content: counter(st); display: inline-block; width: 38px; height: 38px; line-height: 38px; border-radius: 50%; background: var(--sv-navy); color: var(--sv-lime); text-align: center; font-weight: 800; }
.sv-steps h3 { color: var(--sv-navy); font-size: 0.98rem; font-weight: 700; text-transform: uppercase; margin: 12px 0 6px; }
.sv-steps p { color: var(--sv-muted); font-size: 0.9rem; margin: 0; }

/* Measures */
.sv-measures { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.sv-measure { border-left: 4px solid var(--sv-lime); padding: 6px 0 6px 14px; }
.sv-measure b { display: block; color: #fff; font-size: 1rem; }
.sv-measure span { color: #c9d6dc; font-size: 0.9rem; }

/* FAQ */
.sv-faq { max-width: 860px; margin: 0 auto; }
.sv-faq details { border: 1px solid var(--sv-line); border-radius: 3px; background: #fff; margin: 0 0 10px; }
.sv-faq summary { cursor: pointer; list-style: none; padding: 16px 48px 16px 18px; font-weight: 700; color: var(--sv-navy); position: relative; }
.sv-faq summary::-webkit-details-marker { display: none; }
.sv-faq summary::after { content: "+"; position: absolute; right: 18px; top: 12px; font-size: 22px; color: var(--sv-green); font-weight: 400; }
.sv-faq details[open] summary::after { content: "\2212"; }
.sv-faq details > div { padding: 0 18px 16px; color: var(--sv-muted); font-size: 0.95rem; }

/* CTA band */
.sv-cta { background: var(--sv-lime); }
.sv-cta .sv-wrap { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 18px; padding-top: 36px; padding-bottom: 36px; }
.sv-cta h2 { margin: 0 0 4px; color: var(--sv-navy); font-size: 1.5rem; font-weight: 800; text-transform: uppercase; }
.sv-cta p { margin: 0; color: #1f3a12; }
.sv-cta .sv-btn-dark, body.sv .sv-cta a.sv-btn-dark { background: var(--sv-navy); color: #fff; border-color: var(--sv-navy); }
.sv-cta .sv-btn-dark:hover, body.sv .sv-cta a.sv-btn-dark:hover { background: #05374e; color: #fff; }
.sv-cta .sv-btn-line, body.sv .sv-cta a.sv-btn-line { color: var(--sv-navy); border-color: var(--sv-navy); }
.sv-cta .sv-btn-line:hover, body.sv .sv-cta a.sv-btn-line:hover { background: var(--sv-navy); color: #fff; }

/* Explore other audiences */
.sv-more { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
body.sv a.sv-more-card { display: flex; align-items: center; gap: 12px; padding: 14px; border: 1px solid var(--sv-line); border-radius: 3px; background: #fff; text-decoration: none; color: var(--sv-navy); font-weight: 700; font-size: 13.5px; text-transform: uppercase; letter-spacing: 0.01em; transition: border-color 0.2s, box-shadow 0.2s, transform 0.2s; }
body.sv a.sv-more-card:hover { border-color: var(--sv-lime); box-shadow: 0 2px 10px rgba(0,40,58,0.12); transform: translateY(-2px); color: var(--sv-navy); }
.sv-more-card i { flex: none; width: 36px; height: 36px; line-height: 36px; border-radius: 50%; background: var(--sv-navy); color: var(--sv-lime); text-align: center; font-size: 15px; }
.sv-more-card.is-current { display: none !important; }

/* Footer */
.sv-footer { background: var(--sv-navy-2); color: #8fa1a9; font-size: 13px; padding: 26px 0; }
.sv-footer .sv-wrap { display: grid; grid-template-columns: 1fr 1.4fr; gap: 20px; }
.sv-footer p { margin: 0; line-height: 1.6; }
body.sv .sv-footer a { color: #c9d6dc; }

/* Responsive */
@media (max-width: 1000px) {
  .sv-hero-grid, .sv-split { grid-template-columns: 1fr; }
  .sv-grid-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sv-steps, .sv-measures, .sv-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sv-more { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .sv-hero { padding: 36px 0 44px; }
  .sv-section { padding: 44px 0; }
  .sv-grid-3, .sv-grid-2, .sv-steps, .sv-measures, .sv-more, .sv-footer .sv-wrap { grid-template-columns: 1fr; }
  .sv-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sv-screen-body { padding: 12px; }
  .sv-bar { grid-template-columns: 100px 1fr 46px; }
  .sv-sample { margin-left: 0; }
}
@media (prefers-reduced-motion: reduce) { body.sv * { transition: none !important; } }
@media print { .hsrnav, .sv-cta, .sv-more-wrap { display: none; } .sv-hero { background: #fff; color: #000; } }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* Languages: Arabic (right to left) and Chinese fonts, same as the home page */
html.lang-ar body.sv, html.lang-ar body.sv button { font-family: "Noto Sans Arabic", "Open Sans", Tahoma, sans-serif; }
html.lang-zh body.sv, html.lang-zh body.sv button { font-family: "Open Sans", "PingFang SC", "Microsoft YaHei", "Noto Sans SC", sans-serif; }
html[dir=rtl] .sv-hero h1, html[dir=rtl] .sv-h2, html[dir=rtl] .sv-eyebrow, html[dir=rtl] .sv-kicker, html[dir=rtl] .sv-card h3,
html[dir=rtl] .sv-steps h3, html[dir=rtl] .sv-btn, html[dir=rtl] .sv-table th, html[dir=rtl] .sv-cta h2, html[dir=rtl] a.sv-more-card { letter-spacing: 0; }
html[dir=rtl] .sv-hero::after { right: auto; left: -120px; }
html[dir=rtl] .sv-sample { margin-left: 0; margin-right: auto; }
html[dir=rtl] .sv-table th, html[dir=rtl] .sv-table td { text-align: right; }
html[dir=rtl] .sv-table td.num, html[dir=rtl] .sv-table th.num { text-align: left; }
html[dir=rtl] .sv-panel dd { text-align: left; }
html[dir=rtl] .sv-panel .p-action, html[dir=rtl] .sv-measure, html[dir=rtl] .sv-tile .msg { border-left: 0; border-right: 4px solid var(--sv-lime); }
html[dir=rtl] .sv-measure { padding: 6px 14px 6px 0; }
html[dir=rtl] .sv-tile .msg { border-right-width: 3px; padding-left: 0; padding-right: 10px; }
html[dir=rtl] .sv-card ul { padding-left: 0; padding-right: 18px; }
html[dir=rtl] .sv-faq summary { padding: 16px 18px 16px 48px; }
html[dir=rtl] .sv-faq summary::after { right: auto; left: 18px; }
html[dir=rtl] .sv-legend span::before { margin-right: 0; margin-left: 6px; }
html[dir=rtl] .sv-avatar { margin-right: 0; margin-left: 8px; }
html[dir=rtl] .sv-chip .n { margin-left: 0; margin-right: 6px; }
html[dir=rtl] .sv-toolbar .sv-tb-label { margin-right: 0; margin-left: 4px; }
html[dir=rtl] .sv-bar .v { text-align: left; }
html[dir=rtl] .sv-heat th.row-h { text-align: right; }
/* charts, sparklines, maps and number columns keep left-to-right time axes */
.sv-chart, .spark, .sv-map, .sv-stack, .sv-kpi .k-value, .score, .delta { direction: ltr; }
html[dir=rtl] .sv-table .who, html[dir=rtl] .sv-panel h4 { unicode-bidi: plaintext; }
html[dir=rtl] .sv-table td.num, html[dir=rtl] .sv-panel dd { direction: ltr; text-align: left; }
html[dir=rtl] .sv-tile .row b, html[dir=rtl] .sv-kpi .k-delta, html[dir=rtl] .sv-bar .v { unicode-bidi: plaintext; }
body.sv h1, body.sv h2, body.sv h3, body.sv p, body.sv li { overflow-wrap: break-word; }
