/*
 * Gallery Cabinet — design tokens v1.0
 * Work package W1.
 *
 * Palette values were sampled from the accepted specimen PNGs, not estimated.
 * Text colours were then adjusted for WCAG AA against EVERY ground they sit on
 * (paper, stone and stone-light), which is stricter than the paper-only check in
 * the planning package. See the contrast table below.
 *
 * Geometry is square throughout: radius 0 is a property of the direction, not a default.
 */

:root {
  /* ---------------------------------------------------------------- grounds */
  --nc-paper: #f3f0e8;
  --nc-paper-raised: #f7f4ec;
  --nc-stone: #d9d3c7;
  --nc-stone-light: #e5e0d6;
  --nc-charcoal: #252a27;

  /* ------------------------------------------------------------------- text */
  --nc-ink: #1d211f;
  /* Valid on paper (6.18:1), stone (4.67:1) and stone-light (5.35:1).
     The specimen value #6C706A reached only 4.43:1 on paper and 3.71:1 on stone. */
  --nc-ink-muted: #565a54;

  /* ----------------------------------------------------------------- accent */
  /* Marks, rules and numerals at 24px+ only. Never small text: 3.98:1 on paper. */
  --nc-clay: #9b6b55;
  /* Metadata and eyebrow text. Valid on every light ground:
     paper 6.18:1, stone 4.67:1, stone-light 5.35:1. */
  --nc-clay-text: #7a4e3b;

  /* Homepage Interactive Professional Portfolio band only (2026-09-16 brief):
     clay mixed 15%/8% into paper -- a section ground, not a mark, so the
     4.5:1 text rule doesn't apply to the tint itself; --nc-ink on it stays
     >13:1 (near-identical to ink-on-paper) because the tint is this close to
     paper's own luminance. Mirrors the existing paper/paper-raised pairing. */
  --nc-clay-pale: #e6dcd2;
  --nc-clay-pale-raised: #ece3da;

  /* --------------------------------------------------------------- identity */
  /* The logo, and nothing else. The one saturated value in a muted system. */
  --nc-blue: #305371;

  /* ------------------------------------------------------------------ lines */
  --nc-rule: #b9b8ae;          /* decorative hairlines, compartment dividers */
  --nc-rule-light: #cdcbc2;    /* interior dividers within a panel */
  --nc-rule-strong: #8c8a80;   /* form-control borders — 3.04:1, meets non-text AA */

  /* -------------------------------------------------------------- inverse */
  --nc-on-dark: #f3f0e8;         /* 12.82:1 on charcoal */
  --nc-on-dark-meta: #98a096;    /* 5.43:1 on charcoal */
  --nc-on-dark-rule: #4a504b;

  /* ------------------------------------------------------------- reserved */
  /* Classification colours named in the brief but NOT exercised in any specimen.
     Proposed, unapproved, and not contrast-tested at metadata size.
     Do not use until Jacob approves them. */
  --nc-olive-proposed: #6e7355;
  --nc-slate-proposed: #56697a;

  /* ------------------------------------------------------------ typography */
  --nc-font-editorial: "Source Serif 4", Georgia, "Times New Roman", serif;
  --nc-font-operational: "IBM Plex Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  --nc-font-machine: "IBM Plex Mono", ui-monospace, "Courier New", monospace;
  /* Identity only. The wordmark is drawn in this face and nothing else is. */
  --nc-font-logo: "Libre Baskerville", Georgia, serif;

  --nc-size-display-xl: clamp(2.5rem, 4.4vw, 3.75rem);
  --nc-size-title-l: clamp(2.75rem, 5vw, 4.75rem);
  --nc-size-display-l: clamp(2rem, 3.2vw, 2.75rem);
  --nc-size-title-m: clamp(1.5rem, 2.2vw, 2.125rem);
  --nc-size-h3: clamp(1.25rem, 1.6vw, 1.5rem);
  --nc-size-body-l: 1.1875rem;
  --nc-size-body: 1rem;
  --nc-size-small: 0.875rem;
  --nc-size-meta: 0.75rem;

  --nc-leading-display: 1.05;
  --nc-leading-title: 1.02;
  --nc-leading-heading: 1.15;
  --nc-leading-body: 1.6;
  --nc-leading-meta: 1.2;

  --nc-tracking-meta: 0.08em;

  --nc-measure-body: 68ch;
  --nc-measure-body-l: 60ch;
  --nc-measure-standfirst: 56ch;

  /* --------------------------------------------------------------- spacing */
  /* 4px base. No value off this scale may be used anywhere. */
  /* Extra air between a small-caps label and the title directly beneath it.
     Applied once, site-wide, in base.css; stacks on each layout's own margin. */
  --nc-eyebrow-title-gap: var(--nc-space-2);

  --nc-space-1: 4px;
  --nc-space-2: 8px;
  --nc-space-3: 12px;
  --nc-space-4: 16px;
  --nc-space-5: 24px;
  --nc-space-6: 32px;
  --nc-space-7: 48px;
  --nc-space-8: 64px;
  --nc-space-9: 96px;
  --nc-space-10: 128px;
  --nc-space-11: 160px;

  /* Named applications, so components never pick a raw step by guesswork.
     Stepped down one tier from space-10 (2026-09-16 homepage-refinement brief
     density pass -- the page was elegant but longer than its content needed;
     this is the single dominant driver of total page height, so one token
     change here does most of the work instead of scattered per-section
     overrides). */
  --nc-section-padding: var(--nc-space-9);
  --nc-cell-padding: var(--nc-space-6);
  --nc-zone-gap-meta-title: var(--nc-space-7);
  --nc-zone-gap-title-body: var(--nc-space-5);
  --nc-zone-gap-rule-action: var(--nc-space-4);

  /* ---------------------------------------------------------------- layout */
  --nc-content-max: 1440px;
  --nc-gutter: 60px;
  --nc-column-gap: 24px;
  --nc-columns: 12;

  /* Hero split, measured from specimen 01 (left panel 807 of 1440).
     brand-tokens.json v0.6 recorded 0.45/0.55 — inverted. Corrected here. */
  --nc-hero-proposition: 56%;
  --nc-hero-ask: 44%;

  /* -------------------------------------------------------------- geometry */
  --nc-radius: 0;
  --nc-rule-width: 1px;
  --nc-focus-width: 2px;
  --nc-focus-offset: 2px;
  --nc-target-min: 44px;
  --nc-target-min-touch: 48px;

  /* ---------------------------------------------------------------- motion */
  --nc-motion-micro: 160ms;
  --nc-motion-reveal: 240ms;
  --nc-easing: cubic-bezier(0.2, 0, 0.2, 1);
}

@media (max-width: 1199px) {
  :root {
    --nc-gutter: 32px;
    --nc-section-padding: var(--nc-space-8);
  }
}

@media (max-width: 599px) {
  :root {
    --nc-gutter: 20px;
    --nc-section-padding: var(--nc-space-7);
    --nc-cell-padding: var(--nc-space-5);
    --nc-zone-gap-meta-title: var(--nc-space-5);
  }
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --nc-motion-micro: 0ms;
    --nc-motion-reveal: 0ms;
  }
}

/*
 * Contrast record — computed, not assumed. WCAG 2.1 AA needs 4.5:1 for normal
 * text, 3:1 for large text and non-text UI boundaries.
 *
 *   ink          on paper        14.30:1
 *   ink          on stone        10.80:1
 *   ink-muted    on paper         6.18:1
 *   ink-muted    on stone         4.67:1
 *   clay-text    on paper         6.18:1
 *   clay-text    on stone         4.67:1
 *   clay-text    on stone-light   5.35:1
 *   on-dark      on charcoal     12.82:1
 *   on-dark-meta on charcoal       5.43:1
 *   rule-strong  on paper          3.04:1  (non-text boundary)
 *
 * Failing values from the specimens, retained here so the correction is not
 * silently reverted by someone matching the mock-ups again:
 *   #9B6B55 clay  on paper   3.98:1  FAIL — kept as a mark colour only
 *   #6C706A muted on paper   4.43:1  FAIL
 *   #6C706A muted on stone   3.71:1  FAIL
 */