:root {
  /* Brand */
  --orange: #FF8400;
  --orange-dark: #D97000;
  --white: #FFFFFF;
  --almost-black: #0A0A0A;
  --black: #000000;
  --card-bg: #0A0A0A;
  --card-border: #3A2800;

  /* Typography */
  --font-sans: 'Geist', sans-serif;
  --font-mono: 'Geist Mono', monospace;
  --font-pixel-square:   'GeistPixelSquare',   monospace;
  --font-pixel-grid:     'GeistPixelGrid',     monospace;
  --font-pixel-circle:   'GeistPixelCircle',   monospace;
  --font-pixel-triangle: 'GeistPixelTriangle', monospace;
  --font-pixel-line:     'GeistPixelLine',     monospace;
  --font-pixel: var(--font-pixel-square);

  /* Layout */
  --col-width: 1252px;
  /* Faint vertical tram lines sit on their own (wider) box so they can be
     pushed toward the edges without moving the content column. */
  --rail-width: 1500px;
  /* Inset of a tram line from the viewport centre, for corner brackets that
     must sit ON the lines. Clamps to the screen edge just like the lines'
     own max-width:100%, so brackets never drift off-screen on narrow viewports.
     Use as `left:` or `right:` on a bracket inside a centred column box. */
  --rail-edge: calc(50% - min(var(--rail-width) / 2, 50vw));

  /* Horizontal inset of page CONTENT from the viewport edge. Content does NOT
     run all the way out to the vertical tram lines (--rail-edge); it sits
     inside the centred content column (--col-width) plus the section padding,
     which is exactly where the hero text begins. Use this (as left/right
     padding on a full-bleed section's inner) to line content up with the hero.
     On 1512px → 130px column gutter + 38px = 168px. */
  --content-pad: 38px;
  --content-edge: calc(50% - min(var(--col-width) / 2, 50vw) + var(--content-pad));
  --nav-height: 64px;


  /* Corner bracket size */
  --bracket: 10px;
  --bracket-w: 4px;
}

/* Note: the content column (--col-width) and tram lines (--rail-width) are held
   at their base sizes on all screens >=1920px too — the column stays centred and
   the side margins simply widen, matching the sub-1920 look. (Earlier this grew
   the column to 1845px, but that left too little gutter near 1920 and felt too
   wide overall.) */
