/* ==========================================================
   AENIR STUDIO — DESIGN TOKENS
   Single source of truth
   Tokens ONLY — no selectors, no styling logic
   ========================================================== */

:root {

  /* ======================================================
     COLOR — STRUCTURAL SURFACES
     ====================================================== */

  --color-bg-main: #F3F1EC;        /* cool stone / light concrete */
  --color-bg-section: #F2F4F6;     /* technical surface */
  --color-bg-container: #FFFFFF;


  /* ======================================================
     COLOR — SURFACE GRADIENT (SHARED)
     Header + Footer frame
     ====================================================== */

  --color-surface-top: #F3F1EC;
  --color-surface-bottom: #E4E7EA;
  --color-surface-highlight: rgba(255, 255, 255, 0.35);

  /* Precision edges */
  --color-surface-hairline: rgba(255, 255, 255, 0.25);
  --color-surface-shadowline: rgba(0, 0, 0, 0.12);


  /* ======================================================
     MAIN CONTAINER — WORKBENCH MATERIAL (KEY PART)
     Tune THESE to escape “stone / boring”
     ====================================================== */

  /* Base machined surface (slightly cooler than page bg) */
  --color-workbench-base: #EFF1F3;

  /* Vertical light bias (overhead workshop light) */
  --color-workbench-top: #F4F6F8;
  --color-workbench-bottom: #E6EAEE;

  /* Precision separation edge (subtle) */
  --color-workbench-edge: rgba(0, 0, 0, 0.08);


  /* ======================================================
     COLOR — TEXT
     ====================================================== */

  --color-text-primary: #333333;
  --color-text-secondary: #444444;
  --color-text-muted: #555555;
  --color-text-title: #222222;


  /* ======================================================
     COLOR — ACCENTS
     ====================================================== */

  --color-accent-primary: #2F5D8A;       /* logo steel/cyan */
  --color-accent-secondary: #b08a6c;
  --color-accent-interaction: #B45F36;


  /* ======================================================
     TYPOGRAPHY
     ====================================================== */

  --font-family-primary: "Segoe UI", Arial, sans-serif;
  --font-size-base: 1rem;

  --font-scale-page-title: 2.2;
  --font-scale-section-title: 1.6;
  --font-scale-chapter-title: 1.25;
  --font-scale-entry-text: 1.1;
  --font-scale-caption: 1;
  --font-scale-toggle: 1;

  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-bold: 600;


  /* ======================================================
     SPACING RHYTHM
     ====================================================== */

  --space-xs: 4px;
  --space-sm: 8px;
  --space-md: 16px;
  --space-lg: 24px;
  --space-xl: 40px;


  /* ======================================================
     HEADER — LAYOUT
     ====================================================== */

  --header-height-desktop: 72px;
  --header-height-mobile: 60px;


  /* ======================================================
     HEADER — LOGO
     ====================================================== */

  --logo-header-height-desktop: 65px;
  --logo-header-height-mobile: 32px;
  --logo-header-max-width: 220px;


  /* ======================================================
     HEADER — BORDERS
     ====================================================== */

  --color-header-border: rgba(0, 0, 0, 0.06);


  /* ======================================================
     FOOTER — COLORS
     ====================================================== */

  --color-footer-bg: #DDE1E5;
  --color-footer-text: #555555;
  --color-footer-border: rgba(0, 0, 0, 0.05);


  /* ======================================================
     BACKGROUND — TECH MICRO STRUCTURE (READY, NOT FORCED)
     ====================================================== */

  --color-bg-grid-line: rgba(47, 93, 138, 0.04);
  --color-bg-noise: rgba(0, 0, 0, 0.015);

  --color-bg-grain-dark: rgba(0, 0, 0, 0.06);
  --color-bg-grain-light: rgba(255, 255, 255, 0.08);
  --color-bg-grain-accent: rgba(47, 93, 138, 0.015);
}
