/* ═══════════════════════════════════════════════
   HAFIZ PUBLICATIONS — DESIGN TOKENS (BOLD & DYNAMIC)
   ═══════════════════════════════════════════════ */
:root{
  /* — Colour (Deep Midnight & Vibrant Orange) — */
  --c-void: #050814;     /* Deep Midnight Blue/Black */
  --c-ink: #0A0F24;      /* Elevated panels */
  --c-ink-2: #111833;
  --c-ink-3: #1A2447;
  
  --c-paper: #FFFFFF;    /* Crisp White Text */
  --c-paper-2: #A0A8C0;  /* Cool grey secondary text */
  --c-mute: #5A658A;     
  
  --c-brass: #FF5E00;    /* Bold Electric Orange */
  --c-brass-hi: #FF8533;
  --c-brass-dim: #B34200;
  --c-seal: #FF0055;     /* Hot pink accent */
  --c-shadow: #000000;   
  
  --line: rgba(255, 255, 255, 0.08);
  --line-2: rgba(255, 255, 255, 0.15);
  --line-brass: rgba(255, 94, 0, 0.35);

  /* — Type — */
  --f-display: "Outfit", sans-serif;
  --f-sans: "Inter", sans-serif;
  --f-mono: "IBM Plex Mono", monospace;

  /* Framed Sizes - Carefully constrained so they don't overflow! */
  --fs-display: clamp(3rem, 8vw, 8rem);   
  --fs-h2:      clamp(2.5rem, 5vw, 5rem);
  --fs-h3:      clamp(1.4rem, 2.5vw, 2.2rem);
  --fs-lede:    clamp(1.1rem, 1.5vw, 1.35rem);
  --fs-body:    clamp(1rem, 1.1vw, 1.125rem);
  --fs-label:   .75rem;

  --lh-tight: .95;  --lh-snug: 1.15;  --lh-body: 1.6;
  --ls-tight: -0.03em; --ls-label: .15em; --ls-mono: .05em;
  --w-display: 800;  --w-body: 400; /* Extra bold headings */

  /* — Space & Effects — */
  --gutter: clamp(1.5rem, 4vw, 2.5rem);
  --sec-y: clamp(4rem, 8vh, 6rem);
  --maxw: 1440px;
  --measure: 55ch;

  --z-grain: 9000; --z-cursor: 9500; --z-pre: 9800; --z-nav: 8000; --z-bg: -10;
  --shadow-book: 0 40px 100px -20px rgba(0,0,0,1), 0 20px 40px -20px rgba(0,0,0,0.8), 0 0 0 1px rgba(255,255,255,0.1) inset;
  --glow-brass: 0 0 0 1px var(--line-brass), 0 15px 50px -10px rgba(255, 94, 0, 0.5);
}