/* ============================================================
   CBRE AI TOOLS — DESIGN TOKENS
   Palette mirrors cbre-business-card/app/globals.css :root.
   These are the ONLY colors used anywhere in this project.
   ============================================================ */
:root {
  /* ---- PRIMARY ---- */
  --cbre-green:   #003F2D;
  --dark-green:   #012A2D;
  --accent-green: #17E88F; /* RESERVED: Line of Sight + focus rings only */
  --dark-grey:    #435254;
  --light-grey:   #CAD1D3;

  /* ---- SECONDARY ---- */
  --midnight: #032842;
  --sage:     #538184;
  --celadon:  #80BBAD;
  --wheat:    #DBD99A;
  --cement:   #7F8480;

  /* ---- TINTS ---- */
  --midnight-tint: #778F9C;
  --sage-tint:     #96B3B6;
  --celadon-tint:  #C0D4CB;
  --wheat-tint:    #EFECD2;
  --cement-tint:   #CBCDCB;

  /* ---- NEUTRALS ---- */
  --white: #FFFFFF;
  --ink:   #012A2D; /* default body text on light surfaces */

  /* ============================================================
     TYPOGRAPHY
     ============================================================ */
  --font-financier: "Financier Display", Georgia, "Times New Roman", serif;
  --font-calibre:   "Calibre", "Helvetica Neue", Arial, sans-serif;
  --font-mono:      "Space Mono", "SF Mono", ui-monospace, "Roboto Mono", monospace;

  /* Fluid scale — oversized editorial. */
  --fs-mega:    clamp(4rem, 13vw, 13rem);     /* catalog numbers / hero numerals */
  --fs-display: clamp(2.75rem, 7.5vw, 6.5rem);/* big serif statements */
  --fs-h1:      clamp(2.25rem, 5.5vw, 4.75rem);
  --fs-h2:      clamp(1.6rem, 3.6vw, 2.85rem);
  --fs-h3:      clamp(1.2rem, 2vw, 1.6rem);
  --fs-lead:    clamp(1.1rem, 1.55vw, 1.45rem);
  --fs-body:    clamp(1rem, 1.05vw, 1.1rem);
  --fs-label:   0.8125rem;
  --fs-mono:    0.75rem;

  --tracking-eyebrow: 0.2em;
  --tracking-label:   0.08em;
  --leading-tight: 1.02;
  --leading-body:  1.55;

  /* ============================================================
     LAYOUT / SPACE
     ============================================================ */
  --pad-stage: clamp(1.4rem, 5vw, 5.5rem);
  --maxw: 1640px;
  --rule: 1px;
  --los-weight: 2px; /* Line of Sight stroke width */
  --gap-tile: clamp(2px, 0.4vw, 6px); /* hairline gaps between mosaic tiles */

  /* ---- Z LAYERS ---- */
  --z-bg: 0;
  --z-scene: 10;
  --z-los: 30;
  --z-chrome: 40;
  --z-controls: 45;
  --z-overlay: 60;

  /* ============================================================
     MOTION
     ============================================================ */
  --dur-xfast: 0.18s;
  --dur-fast:  0.28s;
  --dur:       0.6s;
  --dur-slow:  0.9s;
  --dur-draw:  1.05s; /* line-of-sight draw */
  /* Mirrors the JS CustomEase "cbre" (expo-out feel). */
  --ease-cbre: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-inout: cubic-bezier(0.65, 0, 0.35, 1);
}