/* =====================================================================
   JMS MEDIA • 01 — DESIGN TOKENS  ("THE KNOBS")
   ---------------------------------------------------------------------
   This is the ONE place to change the look of the whole site.
   Every color, the gold, the spacing, the yellow highlight, the button
   shape — all defined here once, used everywhere else by name.

   Want the gold warmer? change --jms-gold.
   Borders heavier? change --jms-line.
   More breathing room? change --jms-space or --jms-radius.

   White is the native default here — there is NO dark theme to fight.
   ===================================================================== */

:root{

  /* ---- INK / TEXT ------------------------------------------------- */
  --jms-ink:        #0b0c0f;                /* primary body text       */
  --jms-ink-2:      #151821;                /* headings / emphasis     */
  --jms-muted:      rgba(11,12,15,.72);     /* secondary text          */

  /* ---- SURFACES --------------------------------------------------- */
  --jms-panel:      #ffffff;                /* card / panel background */
  --jms-panel-2:    #f6f7f9;                /* subtle alt surface      */
  --jms-page-bg:    #ffffff;                /* site background (WHITE) */

  /* ---- LINES / BORDERS -------------------------------------------- */
  --jms-line:        rgba(11,12,15,.22);    /* default borders         */
  --jms-line-strong: rgba(11,12,15,.35);    /* emphasized borders      */
  --jms-line-ink:    rgba(11,12,15,.85);    /* strong black keyline    */

  /* ---- BRAND GOLD ------------------------------------------------- */
  --jms-gold:       #c49a49;                /* brand gold              */
  --jms-gold-2:     #b98934;                /* gold hover / deeper     */
  --jms-gold-wash:  rgba(196,154,73,.18);   /* faint gold hover fill   */

  /* ---- YELLOW HIGHLIGHTS (the marker look) ------------------------ */
  --jms-hl:         #ffd400;                /* title highlight + icon  */
  --jms-hl-soft:    #fcb900;                /* softer inline highlight */
  --jms-btn-face:   #fff8b8;                /* CTA button default fill */
  --jms-btn-hover:  #ffd400;                /* CTA button hover fill   */

  /* ---- SHADOWS ---------------------------------------------------- */
  --jms-shadow:     0 8px 18px rgba(0,0,0,.10);
  --jms-shadow-sm:  0 6px 12px rgba(0,0,0,.08);
  --jms-shadow-lg:  0 14px 26px rgba(0,0,0,.14);

  /* ---- SHAPE ------------------------------------------------------ */
  --jms-radius:     16px;                   /* cards / panels          */
  --jms-radius-btn: 14px;                   /* buttons                 */
  --jms-radius-sm:  10px;                   /* inputs                  */

  /* ---- LAYOUT LANES ---------------------------------------------- */
  --jms-lane:       980px;                  /* main content width      */
  --jms-lane-wide:  1080px;                 /* rule / CTA width        */
  --jms-lane-form:  760px;                  /* form width              */
  --jms-pad-x:      14px;                    /* horizontal page padding */
  --jms-pad-x-sm:   10px;                    /* mobile padding          */

  /* ---- BUTTONS (CTA system) -------------------------------------- */
  --jms-btn-h:      52px;                    /* button height           */
  --jms-btn-min:    200px;                   /* button min-width        */

  /* ---- INLINE LINKS ---------------------------------------------- */
  --jms-link:        var(--jms-ink);
  --jms-link-hover:  var(--jms-gold-2);
  --jms-uline:       rgba(196,154,73,.78);
  --jms-uline-hover: rgba(185,137,52,.98);

  /* ---- TYPE (Olympus loads the actual families; sizes are clamps) - */
  --jms-h1:   clamp(32px, 4.2vw, 52px);
  --jms-h2:   clamp(22px, 2.6vw, 34px);
  --jms-line-height: 1.7;

  /* -----------------------------------------------------------------
     LEGACY ALIASES — the old pages still use these names. Kept as
     pointers so nothing breaks during migration; remove once every
     page is on jms-* tokens. (See 03-components.css legacy section.)
     ----------------------------------------------------------------- */
}