:root {
  --ys-orange: #FF6B2C;
  --ys-navy: #0E1B2C;
  --ys-sand: #F6EFE4;
  --ys-saffron: #FFB020;
  --ys-ember: #C2410C;
  --ys-lagoon: #0F9B8E;
  --ys-slate: #5B6675;
  --ys-cloud: #FBF8F3;
  --ys-font-display: 'Plus Jakarta Sans', system-ui, sans-serif;
  --ys-font-body: 'Inter', system-ui, sans-serif;
  --ys-font-arabic: 'IBM Plex Sans Arabic', 'Noto Kufi Arabic', sans-serif;
  --ys-radius: 14px;
}

/* App additions (task 5): from the brand guidelines and the mockup. */
:root {
  --ys-radius-button: 12px;
  --ys-radius-pill: 9999px;
  --ys-shadow: 0 8px 24px rgba(14, 27, 44, 0.08); /* Gulf Navy at 8% */
  --ys-tracking-display: -0.03em;
  --ys-whatsapp: #1FA855; /* WhatsApp buttons only (mockup.html .btn.wa) */
  /* Message preview on the prospect's WhatsApp tab (mockup.html .wa-shell, .wa-bubble). */
  --ys-whatsapp-chat: #ECE5DD;
  --ys-whatsapp-bubble: #DCF8C6;
  --ys-whatsapp-ink: #111B21;
  --ys-whatsapp-chat-dark: #0B141A;
  --ys-whatsapp-bubble-dark: #005C4B;
  --ys-whatsapp-ink-dark: #E9EDEF;
}