/*
 * Co-Intelligence design tokens (mirrors tokens.json — edit both together)
 * Greyscale-only system. Pure white = logo only. Pure black = never.
 * Import this file in any web codebase. Never hard-code brand values in components.
 */
:root {
  /* Color — the greyscale ladder */
  --co-white: #FFFFFF;        /* RESERVED: logo mark only */
  --co-grey-bright: #E6E6E6;  /* major words: wordmark, headlines, nav */
  --co-grey-text: #C9C9C9;    /* body text (proposed — tune in build) */
  --co-grey-sub: #9C9C9C;     /* subtext, captions, fine print (proposed) */
  --co-grey-line: #707070;    /* rules, borders, texture link tone */
  --co-charcoal: #141414;         /* page background — the brand's "black"; #000000 forbidden */
  --co-charcoal-raised: #202020;  /* nearer surfaces: hero/header bg, asset backgrounds, rare minimal trims */

  --co-color-text: var(--co-grey-text);
  --co-color-background: var(--co-charcoal);

  /* Typography — single typeface, hierarchy via weight + tracking */
  --co-font: 'Helvetica Neue', Helvetica, Arial, sans-serif;
  --co-weight-light: 300;     /* wordmark + display */
  --co-weight-regular: 400;   /* body */
  --co-weight-bold: 700;      /* names, emphasis */
  --co-tracking-wordmark: 0.08em;

  /* Texture — atmosphere, not architecture: soft-edged, sparse, whisper-faint.
     Not flat: tonal gradients run ACROSS the mesh (links lighter where light falls,
     darker elsewhere) so the pattern can be felt, and each link carries a faint
     metallic sheen. Master: masters/texture/co-texture-milanese-master.ai (v2 —
     larger seamless field; the v1 tile showed stitching and is retired). */
  --co-texture-opacity: 0.10;       /* 8–12% base range: just past subliminal — the pattern is felt */
  --co-texture-opacity-peak: 0.14;  /* where the whisper breathes at edges of open dark space */
  --co-texture-opacity-focal: 0.18; /* 16–20%: the 2–3 focal reveals per page — noticed, soft-edged, never behind text */
  --co-texture-opacity-hero: 0.16;  /* reserved for rare raised cover assets; the current website hero is unmeshed */
  /* Mesh tiers (link outer Ø): asset ~19px (assets only, rare) | side ~10px (site side trims) | micro ~4.5px (behind logo/text — reads as tone; lighter/mid-grey links). Matte-shine baked in. Never upscale. */

  /* Imagery — WEBSITE ONLY. The mist is a per-pixel procedural light field,
     never a bitmap sheet, CSS circle, discrete blob, hard-edged plate, beam, or
     stepped opacity band. One boundaryless, page-spanning field folds several
     unrelated counter-currents into diffuse banks, vapor, and rare soft glints.
     It has no horizon, source, or privileged direction. The canvas stays
     transparent, so charcoal remains dominant and the mesh survives beneath it.
     Concentration varies gradually through the scroll and recedes over mesh. */
  --co-imagery-max-opacity: 0.20;   /* legible atmospheric peaks; near-black remains the dominant perception */
  --co-mist-layers: 1;              /* one continuously recomputed field for the entire page */
  --co-mist-drift-duration: 85s;    /* approximate cadence; perceptible whispers without flicker or a visible loop */

  /* Metallic sheen for display titles only (PROPOSED) — body text stays flat */
  --co-sheen: linear-gradient(180deg, #F2F2F2 0%, #C9C9C9 100%);

  /* Type scale */
  --co-text-display: 3.5rem;
  --co-text-h1: 2.5rem;
  --co-text-h2: 1.75rem;
  --co-text-h3: 1.25rem;
  --co-text-body: 1rem;
  --co-text-small: 0.875rem;
  --co-text-fineprint: 0.75rem;
}
