/* ==========================================================================
   6sMarketers — Design tokens
   Palette and type extracted from the live blog design.
   Change values here and the whole theme follows; nothing else hardcodes
   a colour. The four brand values are also exposed in
   Appearance → Customize → 6sMarketers → Brand & typography.
   ========================================================================== */

:root {
  /* --- Core ink ---------------------------------------------------------
     Near-black carries a purple cast so it sits with the accent family. */
  --sm-ink:          #1B1626;  /* headings, header text, footer bg */
  --sm-body:         #564E66;  /* body copy */
  --sm-muted:        #8B8398;  /* meta, captions, breadcrumbs */
  --sm-line:         #E5E1EC;  /* hairlines, card borders, inputs */
  --sm-subtle:       #F8F6FB;  /* alternating section bg */
  --sm-paper:        #FFFFFF;

  /* --- Primary: purple -------------------------------------------------- */
  --sm-accent:       #9333EA;  /* links, buttons, active states */
  --sm-accent-ink:   #6B21A8;  /* accent hover */
  --sm-accent-deep:  #581C87;  /* deep purple for emphasis */
  --sm-accent-lift:  #7C2BE0;  /* gradient / hover lift */
  --sm-accent-soft:  #E9E3F2;  /* tinted callout bg, pills */

  /* --- Secondary: orange ------------------------------------------------
     Used sparingly — highlights, warnings, one accent per screen. */
  --sm-highlight:      #F97316;
  --sm-highlight-ink:  #EA580C;
  --sm-warn-soft:      #FFF4EC;
  --sm-warn-line:      #F9A66C;

  --sm-on-ink:       #E5E1EC;  /* text on dark bg */
  --sm-on-ink-muted: #A79FB5;

  /* --- Type -------------------------------------------------------------
     Fraunces (soft serif) for display, Hanken Grotesk for body.
     Loaded via the Google Fonts URL in the Customizer. */
  --sm-font-display: "Fraunces", Georgia, "Times New Roman", serif;
  --sm-font-body:    "Hanken Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  --sm-font-mono:    ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;

  --sm-fs-body:   1.0625rem;
  --sm-fs-small:  0.875rem;
  --sm-fs-micro:  0.75rem;
  --sm-fs-lead:   1.1875rem;

  --sm-h1: clamp(2.05rem, 1.35rem + 2.7vw, 3.25rem);
  --sm-h2: clamp(1.55rem, 1.2rem + 1.3vw, 2.125rem);
  --sm-h3: clamp(1.1875rem, 1.05rem + 0.6vw, 1.4375rem);
  --sm-h4: 1.125rem;

  --sm-lh-tight: 1.14;
  --sm-lh-snug:  1.28;
  --sm-lh-body:  1.72;

  /* Fraunces is a soft serif — it wants far less negative tracking than a
     grotesk. Do not push these past -0.015em. */
  --sm-track-display: -0.012em;
  --sm-track-h1:      -0.018em;
  --sm-track-eyebrow:  0.09em;

  /* --- Space / shape ---------------------------------------------------- */
  --sm-shell:      1180px;
  --sm-measure:    720px;
  --sm-gutter:     clamp(1rem, 0.5rem + 2vw, 2rem);
  --sm-section:    clamp(2.75rem, 1.5rem + 4vw, 5rem);

  --sm-radius-sm:  8px;
  --sm-radius:     12px;
  --sm-radius-lg:  18px;
  --sm-radius-pill: 999px;

  --sm-shadow-sm:  0 1px 2px rgba(27, 22, 38, .06);
  --sm-shadow:     0 4px 16px -4px rgba(27, 22, 38, .10);
  --sm-shadow-lg:  0 18px 40px -18px rgba(88, 28, 135, .30);

  --sm-header-h:   68px;
  --sm-ease:       cubic-bezier(.4, 0, .2, 1);
}