/* TrakCorp colour tokens — lifted from the live site (public/site/*.dc.html).
   Dark is the ONLY theme. Near-black canvas, one green accent, everything else
   is white at a measured opacity. */

:root {
  /* ---- Canvas ------------------------------------------------------- */
  --bg-void: #0a0a0a;          /* default page + hero, footer, method */
  --bg-panel: #111111;         /* alternating sections (work, contact) */
  --bg-elevated: #0f0f10;      /* device / browser mock interiors */
  --bg-inset: #131315;         /* mock chrome bar */
  --bg-rail: #141414;          /* mock sidebar rail */
  --bg-row: #17171a;           /* list rows inside mocks */
  --card: hsl(240 3.7% 10.2%); /* app card surface */
  --card-foreground: #F5F5F0;

  /* ---- Text --------------------------------------------------------- */
  --text-primary: #F5F5F0;              /* warm off-white — never pure #fff */
  --text-soft: hsl(0 0% 100% / 0.68);   /* lead paragraphs */
  --text-quiet: hsl(0 0% 100% / 0.62);  /* section subtitles */
  --text-ui: hsl(0 0% 100% / 0.88);     /* list items, form labels */
  --text-nav: hsl(0 0% 100% / 0.7);     /* nav + footer links */
  --text-muted: #8A9088;                /* the signature warm-grey caption */

  /* ---- Accent (the only chromatic voice) ---------------------------- */
  --accent-green: #34D399;              /* headline highlight, links, hover */
  --accent-green-soft: #6ee7b7;         /* icon glyphs, small labels on dark */
  --accent-green-mid: #22c55e;          /* charts, progress fills */
  --accent-green-deep: #16a34a;         /* gradient start */
  --accent-green-dim: #1F5C46;
  --brand-green: hsl(142 76% 36%);      /* the alpha base for tints + glows */
  --accent-tint: hsl(142 76% 36% / 0.12);
  --accent-tint-border: hsl(142 76% 36% / 0.3);

  /* ---- Status (used only inside product mocks) ---------------------- */
  --status-blue: #93c5fd;
  --status-blue-solid: #3b82f6;
  --status-teal: #5eead4;
  --status-teal-solid: #2dd4bf;
  --status-amber: #fbbf24;
  --status-red: #f87171;
  --status-purple: #c4b5fd;
  --status-purple-solid: #a78bfa;
  --status-neutral: #3f3f46;

  /* ---- Lines -------------------------------------------------------- */
  --border-hairline: hsl(0 0% 100% / 0.07);  /* section dividers, list rules */
  --border-soft: hsl(0 0% 100% / 0.08);      /* card + panel edges */
  --border-glass: hsl(0 0% 100% / 0.12);     /* glass card edge */
  --border-strong: hsl(0 0% 100% / 0.15);    /* outline buttons, inputs */
  --border-accent: hsl(142 76% 36% / 0.35);  /* hovered work card */

  /* ---- Editorial "paper" (client-work previews, print collateral) --- */
  --paper: #F4F1EA;
  --paper-ink: #191919;
  --paper-ink-soft: #6b675e;

  /* ---- Gradients ---------------------------------------------------- */
  --gradient-accent: linear-gradient(135deg, hsl(142 76% 36%), hsl(174 62% 47%)); /* @kind color */
  --gradient-rule: linear-gradient(90deg, #16a34a, #34d399); /* @kind color */
  --glow-radial: radial-gradient(56% 44% at 50% 0%, hsl(142 76% 36% / 0.16), transparent 70%); /* @kind color */

  /* ---- shadcn-compatible aliases (the site's app mocks read these) --- */
  --background: var(--bg-void);
  --foreground: var(--text-primary);
  --primary: hsl(0 0% 100%);
  --primary-foreground: hsl(0 0% 6.7%);
  --secondary: hsl(240 3.7% 15.9%);
  --secondary-foreground: hsl(0 0% 100%);
  --muted: hsl(240 3.7% 15.9%);
  --muted-foreground: hsl(0 0% 80%);
  --accent: hsl(134 50% 40%);
  --accent-foreground: hsl(0 0% 100%);
  --destructive: hsl(0 62.8% 60.2%);
  --destructive-foreground: hsl(0 0% 100%);
  --border: hsl(0 0% 20%);
  --input: hsl(240 3.7% 15.9%);
  --ring: hsl(134 50% 40%);
}