/* ==========================================================================
   HUMANAMP — brand tokens v2.0 (2026-08-08, "the wet note")
   Part of the ProblemSmith family; the human, friendlier, listening face.
   "Human intelligence, amplified." — IDEO-style AI transformation for SMEs.

   IDENTITY
   - Mark: "the wet note" — a folded paper/sticky-note shape tilted -4deg,
     with a diagonal fold at the bottom-right revealing a paler underside.
     The face carries a warm gradient bloom (bloom -> spread -> dry-edge ->
     paper-face). Legacy --ha-berry/--ha-vermilion/--ha-gold names are kept
     as aliases of --ha-bloom/--ha-spread/--ha-dry-edge for backward compat.
   - Wordmark: "HumanAmp" in Archivo (scoped to the wordmark lockup only —
     the rest of the site stays IBM Plex Sans/Serif/Mono per Lee's call,
     2026-08-08). "Human" weight 500, "Amp" weight 800. ™ stays live
     (not registered yet) even though the brand sheet mocks up ®.
   - Palette: bloom anchor (was berry), a spread of living accents used only
     for highlights — never all at once. Warm paper, ink.

   GOVERNANCE
   - No hardcoded hex in pages. Pages consume var(--ha-*) only.
   - Mono is for technical labels (kickers, captions, tags) — never body,
     buttons, headings, or nav.
   - Bloom is the active system colour. Accents are restrained to phase
     legends, section marks, and per-person highlights.
   - One dominant motion per axis: native scroll/swipe owns carousel x and page
     scroll owns y; card effects may rotate, recede and scale, never translate x/y.
   - Carousel snap targets use stable, untransformed geometry; each gesture
     settles one adjacent card exactly centred, with horizontal overscroll contained.
   - In motion systems, hover, focus and selection use non-geometric affordances;
     they never replace or reset the active position, scale or rotation model.
   - Direct-touch carousels keep browser-native finger scrolling; scripts may
     observe scroll or drive paddles, never intercept drag or correct native settle.
   - Reduced motion: consumers must honour prefers-reduced-motion.
   ========================================================================== */

:root{
  /* ---- type (Plex family: Serif display, Sans body, Mono labels) */
  --ha-font-display: 'IBM Plex Sans', system-ui, -apple-system, Arial, sans-serif;
  --ha-font-numeral: 'IBM Plex Serif', Georgia, serif;
  --ha-font-sans: 'IBM Plex Sans', system-ui, -apple-system, Arial, sans-serif;
  --ha-font-mono: 'IBM Plex Mono', ui-monospace, monospace;
  --ha-font-weight-medium: 500;

  /* ---- base neutrals ("the wet note": ink + paper) */
  --ha-ink: #2B2A28;
  --ha-surface-dark: #2B2A28;
  --ha-ink-raised: #3B3936;   /* cards on dark, the Lee/Dave panels     */
  --ha-ink-soft: #6E645E;     /* muted-on-light · secondary copy        */
  --ha-ink-faint: #9A8F88;    /* eyebrow labels, quiet meta             */
  --ha-paper: #F7F1EE;
  --ha-bone: var(--ha-paper);
  --ha-bone-alt: #EFEAE6;
  --ha-paper-face: #F2E2C6;   /* warm fills, highlight blocks           */
  --ha-card: #FBF7F4;
  --ha-hairline: #E4DAD5;
  --ha-line: var(--ha-hairline);
  --ha-white: #FFFFFF;
  --ha-ink-rgb: 43, 42, 40;

  /* ---- brand + accent spectrum ("the wet note", 2026-08-08) */
  --ha-bloom: #DE4E7C;        /* anchor · the mark · primary accent, CTAs, links */
  --ha-bloom-deep: #B03D62;   /* pressed / hover                        */
  --ha-bloom-rgb: 222, 78, 124;
  --ha-spread: #E86F5E;       /* gradient mid, hover states             */
  --ha-spread-rgb: 232, 111, 94;
  --ha-dry-edge: #E4A874;     /* secondary accent, stats, figures       */
  --ha-dry-edge-rgb: 228, 168, 116;
  --ha-dry-edge-text: #8F5A30; /* darkened dry-edge for text on paper (AA) */
  --ha-underside: #D2A472;    /* icon fold only — not a UI colour       */
  /* legacy aliases — kept so existing var(--ha-*) usage across pages
     repaints automatically; prefer the names above in new work */
  --ha-berry: var(--ha-bloom);
  --ha-berry-deep: var(--ha-bloom-deep);
  --ha-berry-rgb: var(--ha-bloom-rgb);
  --ha-vermilion: var(--ha-spread);
  --ha-vermilion-rgb: var(--ha-spread-rgb);
  --ha-gold: var(--ha-dry-edge);
  --ha-gold-rgb: var(--ha-dry-edge-rgb);
  --ha-gold-text: var(--ha-dry-edge-text);
  --ha-mustard: #A8894C;
  --ha-blue: #5E7382;         /* muted signal blue — not in the wet-note brief, left as-is */
  --ha-blue-rgb: 94, 115, 130;
  --ha-petrol: #4F6F73;
  --ha-petrol-rgb: 79, 111, 115;
  --ha-emerald: #7C8A67;
  --ha-emerald-rgb: 124, 138, 103;
  --ha-teal: #667C78;
  --ha-violet: #6F5266;       /* smoked plum · build / AI energy        */
  --ha-violet-rgb: 111, 82, 102;
  --ha-copper: #B5651D;       /* founder accent · Lee                   */
  --ha-copper-rgb: 181, 101, 29;
  --ha-copper-light: #E3A05A; /* lightened copper for text on dark      */

  /* ---- action / emphasis gradients ("the wet note") */
  --ha-grad-action: linear-gradient(95deg, var(--ha-bloom), var(--ha-spread));
  --ha-grad-emphasis: linear-gradient(95deg, var(--ha-bloom), var(--ha-dry-edge));

  /* ---- role legend (Listen -> Innovate -> Amplify) */
  --ha-listen:   var(--ha-berry);
  --ha-innovate: var(--ha-violet);
  --ha-amplify:  var(--ha-gold);
  --ha-method:   var(--ha-teal);

  /* ---- wordmark subsystem
     "the wet note" (2026-08-08): "HumanAmp" set in Archivo, scoped to the
     wordmark lockup only — the rest of the site stays IBM Plex per Lee.
     "Human" weight 500, "Amp" weight 800 — the split is the point, per the
     brand sheet's own rule ("Don't set the wordmark in one weight").
     The mark sits inline at the cap-height of the H. Values below are the
     on-light tones. */
  --ha-font-wordmark: 'Archivo', system-ui, -apple-system, Arial, sans-serif;
  --ha-wordmark-weight: 500;          /* "Human" */
  --ha-wordmark-weight-amp: 800;      /* "Amp" */
  --ha-wordmark-tracking: -.025em;
  --ha-wordmark-human: #3A3A3D;            /* "Human" — darker grey        */
  --ha-wordmark-amp:   #3A3A3D;            /* "Amp" — same dark grey       */
  --ha-wordmark-tm:    var(--ha-wordmark-amp); /* matches the wordmark text */
  --ha-wordmark-human-on-dark: var(--ha-bone);
  --ha-wordmark-tm-text: "\2122";          /* ™ — swap to ® on registration */

  /* ---- call-to-action (the Amp grey — graphite CTA that ties to "Amp";
     bloom stays the mark + accent, grey carries the action) */
  --ha-cta: var(--ha-surface-dark);   /* deep ink surface (wordmark stays #3A3A3D) */
  --ha-cta-deep: var(--ha-ink-raised); /* pressed / hover */

  /* ---- signature devices */
  --ha-strip: var(--ha-dry-edge);
  --ha-mark-highlight: linear-gradient(transparent 66%, rgba(var(--ha-dry-edge-rgb),.40) 66%);
  --ha-hl-warm: linear-gradient(transparent 56%, rgba(var(--ha-dry-edge-rgb),.42) 56%);
  --ha-hl-lee:  linear-gradient(transparent 66%, rgba(var(--ha-copper-rgb),.26) 66%);
  --ha-hl-dave: linear-gradient(transparent 66%, rgba(var(--ha-petrol-rgb),.24) 66%);
  --ha-caption-bg: var(--ha-bone);
  --ha-caption-ink: var(--ha-ink);
  --ha-tilt-1: -1.6deg;
  --ha-tilt-2: 1.1deg;
  --ha-grain-opacity: 0.05;

  /* ---- dark surfaces */
  --ha-band: var(--ha-surface-dark);
  --ha-bone-on-dark: var(--ha-paper);
  --ha-soft-on-dark: #B9B2AC;

  /* ---- shape & shadow */
  --ha-radius-card: 8px;
  --ha-radius-photo: 10px;
  --ha-shadow-caption: 0 3px 14px rgba(var(--ha-ink-rgb), 0.18);
  --ha-shadow-photo: 0 12px 40px rgba(var(--ha-ink-rgb), 0.16);

  /* ---- motion */
  --ha-ease: cubic-bezier(0.16, 1, 0.3, 1);
  --ha-ease-quart: cubic-bezier(0.25, 1, 0.5, 1);
  --ha-motion-fast: 180ms;
  --ha-motion-reveal: 700ms;
}

@media (prefers-reduced-motion: reduce){
  :root{
    --ha-motion-fast: 1ms;
    --ha-motion-reveal: 1ms;
  }
}