/* ==========================================================================
   Arete Jiu Jitsu Collective — Brand Design Tokens
   Drop-in stylesheet for mockups. Load AFTER the Google Fonts <link> below:

   <link rel="preconnect" href="https://fonts.googleapis.com">
   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
   <link href="https://fonts.googleapis.com/css2?family=Cinzel:wght@400;600;700&family=Libre+Baskerville:ital,wght@0,400;0,700;1,400&family=Inter:wght@400;500;600&display=swap" rel="stylesheet">

   Then either <link rel="stylesheet" href="/brief/tokens.css"> or copy the
   :root block into your mockup. Brand assets live at /assets/.
   ========================================================================== */

:root {
  /* --- Primary palette --- */
  --obsidian:      #0E0E0E;  /* strength, grounding, contrast   */
  --arete-olive:   #3F4A2A;  /* discipline, earth, tradition    */
  --xiphos-gold:   #B08A3C;  /* honor, mastery — earned accents */

  /* --- Secondary / support --- */
  --bone-white:    #F4F2EE;  /* backgrounds, text relief        */
  --muted-bronze:  #8C6A3A;  /* dividers, subtle highlights     */
  --stone-gray:    #6E6E6E;  /* secondary text, UI              */

  /* --- Convenience aliases --- */
  --bg:            var(--obsidian);
  --fg:            var(--bone-white);
  --accent:        var(--xiphos-gold);
  --surface:       #171712;   /* slightly lifted dark surface   */

  /* --- Typography --- */
  --font-display:  "Cinzel", Georgia, serif;          /* headlines, ALL CAPS */
  --font-body:     "Libre Baskerville", Georgia, serif;/* copy, manifestos    */
  --font-ui:       "Inter", system-ui, sans-serif;    /* buttons, forms, nav */

  /* --- Rhythm --- */
  --maxw:          1120px;
  --radius:        4px;       /* keep it restrained, not bubbly */
}

/*
  Color use ratio (recommended): 60% dark / 25% olive / 10% white / 5% gold.
  Gold should feel earned, not flashy — reserve it for the primary CTA.
*/