/* ============================================================
   variables.css — S.C. Kincaid Author Website
   All custom properties: colors, fonts, spacing, transitions
   ============================================================ */

:root {

  /* --- Color System --- */
  --iron-dark:       #1a1a1f;   /* Primary dark background */
  --hollow-black:    #0d0d0f;   /* Deepest black */
  --dusk-charcoal:   #2e2e38;   /* Secondary dark surface */
  --predawn-blue:    #1c2540;   /* Hero gradient start */
  --frost-silver:    #c8cdd6;   /* Secondary text, labels */
  --ash-gray:        #8a8f9a;   /* Tertiary text, metadata */
  --vellum:          #f0ead8;   /* Primary light text */
  --ember-red:       #8b2020;   /* Primary CTA, accent */
  --forge-gold:      #c9a84c;   /* World-building accent */
  --starlight-gold:  #e8d48b;   /* Aurora gradient end */
  --aurora-teal:     #4a9b8e;   /* Aurora gradient middle */
  --swan-silver:     #d4d8e0;   /* Library accent */

  /* --- Derived Colors --- */
  --ember-red-dark:  #6f1919;   /* Hover state for ember red */
  --ember-red-hover: rgba(139, 32, 32, 0.12); /* Ghost hover bg */

  /* --- Font Stacks --- */
  --font-cinzel:    'Cinzel', serif;
  --font-cormorant: 'Cormorant Garamond', serif;
  --font-jost:      'Jost', sans-serif;
  --font-fell:      'IM Fell English', serif;
  --font-palatino:  Palatino, 'Palatino Linotype', 'Book Antiqua', serif;

  /* --- Letter Spacing --- */
  --tracking-cinzel:   0.12em;
  --tracking-caps-sm:  0.08em;
  --tracking-caps-md:  0.15em;
  --tracking-caps-lg:  0.2em;
  --tracking-btn:      0.06em;

  /* --- Spacing Scale --- */
  --space-xs:   8px;
  --space-sm:   16px;
  --space-md:   24px;
  --space-lg:   40px;
  --space-xl:   64px;
  --space-xxl:  80px;
  --space-hero: 120px;

  /* --- Layout --- */
  --container-max:    1200px;
  --container-narrow: 720px;
  --nav-height:       64px;

  /* --- Transitions --- */
  --transition-fast:   0.2s ease;
  --transition-base:   0.3s ease;

  /* --- Aurora Line --- */
  --aurora-gradient: linear-gradient(
    to right,
    var(--predawn-blue),
    var(--aurora-teal),
    var(--starlight-gold)
  );

  /* --- Breakpoints (reference only — use in @media queries) ---
     --bp-sm:  640px
     --bp-md:  768px
     --bp-lg:  1024px
     --bp-xl:  1280px
  --- */
}