/* ===========================================================================
   actual. — Base reset + brand helpers
   Arabic-first: default direction is RTL. Use [dir="ltr"] to opt out.
   =========================================================================== */

*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  font: var(--type-body);
  color: var(--text-primary);
  background: var(--bg-base);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* Arabic numerals stay Arabic-Indic only where intended; keep Latin default */
h1, h2, h3, h4, h5, h6 { margin: 0; font-weight: var(--fw-bold); }

a { color: inherit; text-decoration: none; }
button { font-family: inherit; }

::selection { background: var(--accent-soft); color: var(--warm-white); }

:focus-visible {
  outline: none;
  box-shadow: var(--glow-focus);
  border-radius: var(--radius-sm);
}

/* --- The spark mark (✦) used as a typographic bullet ------------------ */
.spark-bullet { color: var(--accent); font-weight: var(--fw-bold); }

/* --- Eyebrow / overline label ---------------------------------------- */
.overline {
  font: var(--type-caption);
  font-weight: var(--fw-bold);
  letter-spacing: var(--ls-caps);
  text-transform: uppercase;
  color: var(--accent);
}

/* --- Spark gradient text --------------------------------------------- */
.text-spark {
  background: var(--grad-spark);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

/* --- The wordmark: lowercase Latin + spark period -------------------- */
.wordmark {
  font-family: var(--font-latin);
  font-weight: var(--fw-bold);
  letter-spacing: -0.03em;
  color: var(--text-primary);
}
.wordmark .dot { color: var(--accent); }