/* Edgecore 2026 brand tokens for the Claude fork (RA site v3).
   Source: collateral/edgecore-brand-guidelines-v1.5.pdf, section 04 Color.
   Rules: no blue anywhere; red #CC2200 only inside gradients; orange is an accent,
   never a large background fill. Rand is the only typeface (Elliot, 2026-11-03). */

@font-face { font-family: "Rand"; font-weight: 400; font-style: normal; font-display: swap; src: url("fonts/Rand-400.woff2") format("woff2"); }
@font-face { font-family: "Rand"; font-weight: 500; font-style: normal; font-display: swap; src: url("fonts/Rand-500.woff2") format("woff2"); }
@font-face { font-family: "Rand"; font-weight: 700; font-style: normal; font-display: swap; src: url("fonts/Rand-700.woff2") format("woff2"); }

:root {
  /* Brand palette */
  --ec-orange: #E86820;
  --ec-red: #CC2200;         /* gradients only */
  --ec-white: #FFFFFF;
  --ec-gray-50: #F5F5F5;     /* page, host fills */
  --ec-gray-500: #666666;    /* secondary text, captions */
  --ec-charcoal: #111111;    /* body text, VERIFIED */
  --ec-brass: #C2A46E;       /* INFERRED, gated */
  --ec-brass-ink: #7A6437;   /* brass at text weight, for contrast on white */
  --ec-platinum: #B8C4CC;    /* NVIDIA, UNKNOWN, hairlines */

  /* Derived neutrals */
  --ec-gray-100: #EDEDED;
  --ec-gray-200: #DADADA;
  --ec-gray-800: #1C1C1C;
  --ec-gray-700: #2A2A2A;

  /* Gradients */
  --ec-grad-hero: linear-gradient(90deg, #E86820 0%, #CC2200 100%);
  --ec-grad-metal: linear-gradient(180deg, #E86820 0%, #C2A46E 55%, #B8C4CC 100%);

  /* Rail ramp: 8 GPU rails, orange through brass to platinum */
  --rail-0: #E86820; --rail-1: #E07A33; --rail-2: #D68C47; --rail-3: #CC9A5A;
  --rail-4: #C2A46E; --rail-5: #BDAE8E; --rail-6: #BAB9AE; --rail-7: #B8C4CC;

  /* Type */
  --font-sans: "Rand", "Carlito", "Calibri", ui-sans-serif, sans-serif;
  --fs-display: clamp(2.6rem, 1.4rem + 4.6vw, 5.6rem);
  --fs-h1: clamp(2rem, 1.4rem + 2.4vw, 3.4rem);
  --fs-h2: clamp(1.5rem, 1.2rem + 1.2vw, 2.1rem);
  --fs-h3: 1.2rem;
  --fs-body: 1.0625rem;      /* 17px */
  --fs-small: 0.875rem;      /* 14px */
  --fs-label: 0.75rem;       /* 12px */
  --lh-body: 1.62;
  --track-label: 0.08em;

  /* Space and shape */
  --gutter: 16px;
  --radius: 6px;
  --hair: 1px solid var(--ec-gray-200);
  --ease-out: cubic-bezier(.2,.7,.1,1);
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}