/* ============================================================================
   NCPC Design System — design tokens
   New Covenant Presbyterian Church (PCA), Johns Creek GA
   Drop this file in first. Everything else depends on it.
   ========================================================================= */

:root {

  /* --- Core ink ---------------------------------------------------------- */
  --ncpc-ink:        #16181C;  /* body text, headlines, the 2.5px major rule  */
  --ncpc-slate:      #3E444C;  /* lede paragraphs, secondary body             */
  --ncpc-mute:       #5F656D;  /* captions, descriptions, helper text         */
  --ncpc-quiet:      #9A9DA4;  /* timestamps, sub-labels, disabled            */

  /* --- Blues ------------------------------------------------------------- */
  --ncpc-blue:       #2F6690;  /* PRIMARY. links, buttons, eyebrows, chips    */
  --ncpc-blue-deep:  #24506F;  /* hover / pressed                            */
  --ncpc-blue-soft:  #DCE7F0;  /* selected rows, own-signup highlight         */
  --ncpc-signal:     #0674B8;  /* LOGO BLUE. the mark, and highlights on navy */
  --ncpc-sky:        #7FA8CC;  /* labels on navy                              */
  --ncpc-pale:       #AFC0D2;  /* body copy on navy                           */

  /* --- Navy surface ------------------------------------------------------ */
  --ncpc-navy:       #0C1322;  /* the one dark panel per page                 */
  --ncpc-navy-2:     #1E2A3D;  /* raised element inside a navy panel          */

  /* --- Paper and lines --------------------------------------------------- */
  --ncpc-paper:      #FBFAF8;  /* page background. never pure white           */
  --ncpc-card:       #FAF9F7;  /* illustration wells, quiet fills             */
  --ncpc-white:      #FFFFFF;
  --ncpc-line:       #E2DFDA;  /* 1px rule between rows                       */
  --ncpc-hairline:   #EDEAE6;  /* the faintest divider                        */
  --ncpc-border:     #D6D2CC;  /* input borders                               */

  /* --- Categorical accents ------------------------------------------------
     For ministries, tags, event types, chart series. Never for body text.
     Ordered. Use in sequence so two systems built months apart still match. */
  --ncpc-clay:       #BE5A50;  /* 1 */
  --ncpc-ochre:      #C98A45;  /* 2 */
  --ncpc-teal:       #3E8E8E;  /* 3 */
  --ncpc-moss:       #4E8069;  /* 4 */
  --ncpc-plum:       #7A5A78;  /* 5 */
  --ncpc-stone:      #A7ABB1;  /* neutral / not-applicable                    */

  /* Tinted fills for the accents, for wells and pill backgrounds */
  --ncpc-clay-soft:  #FAF1F0;
  --ncpc-ochre-soft: #F8F0E4;
  --ncpc-teal-soft:  #E8F2F3;
  --ncpc-moss-soft:  #EAF1EC;

  /* --- Semantic ---------------------------------------------------------- */
  --ncpc-need:       #BE5A50;  /* short, unfilled, action required            */
  --ncpc-met:        #4E8069;  /* filled, confirmed, complete                 */
  --ncpc-notice:     #C98A45;  /* heads up, deadline near                     */

  /* --- Type -------------------------------------------------------------- */
  --ncpc-font-display: 'Inter Display', 'Inter', -apple-system, BlinkMacSystemFont,
                       'Segoe UI', Helvetica, Arial, sans-serif;
  --ncpc-font-text:    'Inter', -apple-system, BlinkMacSystemFont,
                       'Segoe UI', Helvetica, Arial, sans-serif;

  --ncpc-tracking-display: -0.030em;  /* 40px and up      */
  --ncpc-tracking-title:   -0.022em;  /* 20 to 39px       */
  --ncpc-tracking-body:     0;
  --ncpc-tracking-eyebrow:  0.16em;   /* uppercase labels */
  --ncpc-tracking-pill:     0.09em;

  /* --- Space ------------------------------------------------------------- */
  --ncpc-s1:  4px;
  --ncpc-s2:  8px;
  --ncpc-s3:  12px;
  --ncpc-s4:  16px;
  --ncpc-s5:  22px;
  --ncpc-s6:  30px;
  --ncpc-s7:  44px;
  --ncpc-s8:  64px;
  --ncpc-s9:  96px;

  /* --- Measure ----------------------------------------------------------- */
  --ncpc-measure-read:  760px;   /* forms, lists, anything you read down      */
  --ncpc-measure-page: 1120px;   /* marketing and multi-column                */
  --ncpc-gutter:         20px;

  /* --- Radius. Small and consistent. Nothing is a lozenge. ---------------- */
  --ncpc-r-sm:  5px;   /* inputs, name chips        */
  --ncpc-r-md:  7px;   /* buttons, wells            */
  --ncpc-r-lg:  9px;   /* navy panels               */
  --ncpc-r-pill: 10px; /* taxonomy pills            */

  /* --- Rules ------------------------------------------------------------- */
  --ncpc-rule-major: 2.5px;  /* under a page header, above a footer block     */
  --ncpc-rule-row:   1px;    /* between list rows                             */
  --ncpc-rule-accent: 7px;   /* the short blue tick above an eyebrow          */
}

/* There is no shadow scale on purpose. Depth comes from the navy panel and
   from white space. The only shadow in the system is on a modal. */
:root { --ncpc-shadow-modal: 0 24px 70px rgba(12, 19, 34, .30); }