/* =========================================================
   variables.css
   Design tokens for Quality Control Engineering (QCEBD).
   Every other stylesheet reads colors/type/spacing from here —
   change a brand value once, it updates the whole site.
   ========================================================= */
:root{
  /* Brand navy scale (site background/surfaces) */
  --navy-950:#00132D;
  --navy-900:#00193B;
  --navy-800:#001E45;
  --navy-700:#002657;
  --navy-600:#002D67;
  --navy-500:#00377E;

  /* Accents */
  --red:#E53935;
  --yellow:#FFD54F;
  --green:#00C853;
  --white:#FFFFFF;
  --text:#DCE6F2;
  --text-dim:#8FA3C2;

  /* Legacy tri-color brand wordmark (was inline style="color:" in the
     original markup — moved here as reusable classes, see style.css) */
  --brand-green:#39d353;
  --brand-red:#E53935;
  --brand-blue:#3b82f6;

  /* Surfaces */
  --glass-bg:rgba(0,38,87,0.35);
  --glass-bg-strong:rgba(0,25,59,0.85);
  --glass-border:rgba(220,230,242,0.10);

  /* Type */
  --font-display:'Poppins', sans-serif;
  --font-label:'Raleway', sans-serif;
  --font-body:'Open Sans', sans-serif;

  /* Motion */
  --ease:cubic-bezier(.16,.84,.44,1);
  --dur-fast:.25s;
  --dur:.4s;
  --dur-slow:.7s;

  /* Layout */
  --container-max:1240px;
  --radius-sm:8px;
  --radius-md:14px;
  --radius-lg:20px;
  --header-h:82px;
}

/* Light theme override — toggled by js/darkmode.js via
   documentElement[data-theme="light"] */
:root[data-theme="light"]{
  --navy-950:#F4F7FB;
  --navy-900:#EAF0F8;
  --navy-800:#DCE6F2;
  --navy-700:#C7D6EA;
  --glass-bg:rgba(255,255,255,0.55);
  --glass-bg-strong:rgba(255,255,255,0.9);
  --glass-border:rgba(0,38,87,0.12);
  --text:#00132D;
  --text-dim:#3A4C66;
}
