/*--------------------------------------------------------------
# Design tokens
The single source of truth for colour, shape, depth, layout and motion.
The StyleGuide project reads this file to build its colour pages, so give every
new token a comment and document it in the guide.

Font variables (--font-brand, --font-display, --font-heading, --font-body)
are defined by Astro's Fonts API from fonts.config.mjs, not here.
--------------------------------------------------------------*/
:root {
  /* Navy: the night sea. Page and section backgrounds, darkest first. */
  --navy-950: #050e19; /* Footer, mobile-nav overlay */
  --navy-900: #081a2c; /* Default page background */
  --navy-800: #0c2338; /* Alternate sections, panels */
  --navy-700: #12304c; /* Wave layers, raised panels */
  --navy-600: #1a4166; /* Bottom of the hero gradient */
  --sea: #2a6f97; /* "Auto" badges, ticks on parchment */

  /* Parchment and ink: anything people read closely. */
  --parchment: #f4e7c8; /* Card and page surface; display text on navy */
  --parchment-deep: #e6d2a4; /* Darker parchment for shading */
  --parchment-edge: #c8a868; /* Card borders, ledger dots, rules */
  --ink: #3a2a16; /* Text on parchment */
  --ink-soft: #6b5434; /* Secondary text on parchment */
  --leather: #8a5a2b; /* "Manual" badges, links on parchment */

  /* Gold: actions and highlights. */
  --gold: #e3a93b; /* Primary buttons, icons, accents */
  --gold-light: #f5c96a; /* Links on navy, button gradient top, hover */
  --gold-deep: #9c6a16; /* Pressed edge under gold buttons */

  /* Text on navy. */
  --white: #ffffff; /* Headings and emphasis on navy */
  --text: #dbe5ee; /* Body text on navy */
  --text-muted: #93a9be; /* Secondary text on navy */

  /* Status and partner colours. */
  --success: #3f7d3a; /* "Save 33%" and other positive badges */
  --online: #3ba55d; /* Live/online indicator dot */
  --danger: #c2453a; /* Errors and destructive actions (reserved: not used on the site yet) */
  --discord: #5865f2; /* Discord blurple: Discord buttons and cards only */
  --discord-light: #6d79f5; /* Discord hover */
  --discord-deep: #3c4fb8; /* Discord card gradient start */

  /* Translucent layers on navy. */
  --line: rgba(227, 169, 59, 0.18); /* Default border and divider on navy */
  --line-strong: rgba(227, 169, 59, 0.5); /* Hover/open border on navy */
  --line-subtle: rgba(255, 255, 255, 0.07); /* Row dividers inside panels */
  --surface-glass: rgba(255, 255, 255, 0.04); /* Cards and rows on navy */
  --gold-tint: rgba(227, 169, 59, 0.1); /* Icon discs */
  --gold-ring: rgba(227, 169, 59, 0.15); /* Halo around featured items */

  /* Shape. */
  --radius-sm: 6px; /* Buttons */
  --radius-md: 10px; /* Rows, small cards, FAQ items */
  --radius-lg: 12px; /* Cards, panels, video */
  --radius-pill: 999px; /* Badges, pills */

  /* Depth. */
  --shadow-card: 0 10px 30px rgba(0, 0, 0, 0.35);
  --shadow-raised: 0 16px 40px rgba(0, 0, 0, 0.45);
  --shadow-header: 0 4px 20px rgba(0, 0, 0, 0.3);
  --shadow-parchment-inset: inset 0 0 40px rgba(140, 100, 40, 0.25);

  /* Layout. */
  --header-height: 72px;
  --section-padding: 90px;

  /* Motion. */
  --duration-fast: 0.25s; /* Buttons, pills */
  --duration: 0.3s; /* Cards, borders, colour changes */
  --duration-slow: 0.4s; /* Header, back-to-top */
}
