/* ==========================================================================
   King Nuggets — design tokens
   Transcribed from the design-system sheet (canvas 2d, "KN System").
   Nothing in this file paints anything; it only names values.
   ========================================================================== */

/* --------------------------------------------------------------------------
   Typefaces
   Sentient  — masthead, hero statement, research headlines only.
   Switzer   — body, UI, and every numeral (tabular lining figures).
   DM Mono   — instrument symbols, section identifiers, state labels only.
   The serif never sets a number; the mono never sets prose.
   -------------------------------------------------------------------------- */

@font-face {
  font-family: 'Sentient';
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  src: url('../fonts/Sentient-Regular.woff2') format('woff2');
}
@font-face {
  font-family: 'Sentient';
  font-weight: 500;
  font-style: normal;
  font-display: swap;
  src: url('../fonts/Sentient-Medium.woff2') format('woff2');
}

@font-face {
  font-family: 'Switzer';
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  src: url('../fonts/Switzer-Regular.woff2') format('woff2');
}
@font-face {
  font-family: 'Switzer';
  font-weight: 500;
  font-style: normal;
  font-display: swap;
  src: url('../fonts/Switzer-Medium.woff2') format('woff2');
}
@font-face {
  font-family: 'Switzer';
  font-weight: 600;
  font-style: normal;
  font-display: swap;
  src: url('../fonts/Switzer-Semibold.woff2') format('woff2');
}

/* latin-ext */
@font-face {
  font-family: 'DM Mono';
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  src: url('../fonts/DMMono-Regular-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'DM Mono';
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  src: url('../fonts/DMMono-Regular-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'DM Mono';
  font-weight: 500;
  font-style: normal;
  font-display: swap;
  src: url('../fonts/DMMono-Medium-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'DM Mono';
  font-weight: 500;
  font-style: normal;
  font-display: swap;
  src: url('../fonts/DMMono-Medium-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  --font-display: 'Sentient', Georgia, 'Times New Roman', serif;
  --font-sans: 'Switzer', -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;
  --font-mono: 'DM Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  /* ------------------------------------------------------------------------
     Colour — cool grey ground, one oxblood accent for data and links.
     No red, no green: direction is never encoded in colour.
     ------------------------------------------------------------------------ */
  --c-ground: #EDEEEB;        /* page ground */
  --c-paper: #F6F6F4;         /* alternating bands */
  --c-plate: #E4E5E2;         /* notices, disclaimer */
  --c-ink: #16171A;           /* text, dark bands */
  --c-oxblood: #6E1E28;       /* data and links only */
  --c-oxblood-deep: #4A131A;  /* link hover */

  --c-ink-soft: #1F2125;      /* lead paragraphs */
  --c-body: #2C2E33;          /* body text */
  --c-reading-prov: #4A4C50;  /* reading · provisional */
  --c-muted: #5A5C60;         /* captions — 7.0:1 on ground */
  --c-reading-review: #6E7075;/* reading · under review, withheld, pending */
  --c-placeholder: #7B7D80;   /* unresolved editorial slots */

  --c-rule: #D2D3D0;          /* hairline rule */
  --c-rule-mid: #BFC1BD;      /* heavier hairline, control borders */
  --c-withheld: #A9ABA7;      /* a withheld value, live weight retained */

  /* On the dark band */
  --c-on-dark: #F6F6F4;
  --c-on-dark-body: #C3C5C8;
  --c-on-dark-muted: #A3A5A9;
  --c-rule-dark: #32343A;
  --c-rule-dark-mid: #52545A;

  /* ------------------------------------------------------------------------
     Type scale — desktop values. Mobile values are applied at --bp-mobile.
     Body is 16px desktop; nothing meaningful sits below 13px.
     ------------------------------------------------------------------------ */
  --t-masthead: 22px;
  --t-display: 60px;
  --t-h2: 34px;
  --t-lead: 22px;
  --t-h3: 19px;
  --t-body: 16px;
  --t-small: 14px;
  --t-data: 17px;
  --t-label: 11.5px;

  --lh-display: 1.1;
  --lh-h2: 1.18;
  --lh-lead: 1.5;
  --lh-body: 1.65;

  --tr-display: -0.015em;   /* tracking */
  --tr-h2: -0.01em;
  --tr-h3: -0.005em;
  --tr-mast: 0.16em;
  --tr-descriptor: 0.24em;
  --tr-label: 0.2em;
  --tr-nav: 0.16em;
  --tr-symbol: 0.06em;
  --tr-date: 0.08em;

  /* ------------------------------------------------------------------------
     Spacing — base 4.
     ------------------------------------------------------------------------ */
  --s-1: 4px;
  --s-2: 8px;
  --s-3: 14px;
  --s-4: 22px;
  --s-5: 36px;
  --s-6: 56px;
  --s-7: 88px;

  --gutter: 96px;           /* page margin */
  --section-pad: 88px;      /* vertical section padding */
  --label-col: 260px;       /* section label column */
  --col-gap: 80px;
  --measure: 62ch;          /* body measure */

  --rule-w: 1px;
  --radius: 0;              /* radius is 0 everywhere */
  --hit: 44px;              /* mobile hit target */

  --page-max: 1440px;
}

/* Every breakpoint override of a token lives here, in ascending narrowness,
   so the last matching block wins. Layout rules that respond to the same
   breakpoints live in kingnuggets.css; values live here. */

/* The drawing is made at 1440. Below it, gutters tighten and the section
   identifier column narrows before anything folds. */
@media (max-width: 1280px) {
  :root {
    --gutter: 56px;
    --col-gap: 56px;
    --label-col: 220px;
  }
}

@media (max-width: 1100px) {
  :root {
    --gutter: 40px;
    --col-gap: 36px;
  }
}

/* Mobile scale and spacing. The mobile design is drawn at 390; 900px is the
   point at which the desktop section grid and inline nav stop earning their
   keep, so that is where the mobile drawing takes over wholesale. */
@media (max-width: 900px) {
  :root {
    --t-masthead: 17px;
    --t-display: 36px;
    --t-h2: 28px;
    --t-lead: 19px;
    --t-h3: 17px;
    --t-body: 15px;
    --t-small: 13px;
    --t-data: 20px;
    --t-label: 10.5px;

    --lh-display: 1.14;
    --lh-h2: 1.2;

    --gutter: 22px;
    --section-pad: 40px;
    --col-gap: 24px;
  }
}
