/* Raven brand design system — design tokens + typography only.
   Requires brand fonts (Libre Franklin + PP Valve) via fonts.css.
   Load before site.css. All layout/components live in site.css.
*/

/*
  Brand color usage:
  --pure-black:     html/body bg, hero/section backgrounds, navbar tint
  --umbra-black:    body text, try-section bg, btn-gray text, gradients, form focus
  --white:          primary/secondary button text, nav overlay, feature card text, error code
  --indigo-violet:  primary accent, .bg-indigo-violet, btn-indigo-violet, gradients, focus ring, docs border
  --indigo-violet-hover: btn-indigo-violet:hover
  --slate-gray:     .text-slate-gray utility
  --moon-silver:    subtitles, .text-moon-silver, secondary buttons, footer, docs content, carousel text
  --moon-silver-hover: btn-gray:hover bg
  --raven-red:      Raven brand accent red (reserved)
  --loading-gray:   3D model loading placeholder text
  --docs-code-text: docs code/pre text (migrated from hardcoded #e2e8f0 in docs.html)
  --glass-*:        cards, navbar, modals, overlays, buttons (see vars below)
  --glass-inset-subtle: docs sidebar/panel box-shadow inset (migrated from rgba(255,255,255,0.05))
  --glass-inset-muted: docs pre/callout box-shadow inset (migrated from rgba(255,255,255,0.04))
  --glass-bg-subtle: docs callout background (migrated from rgba(255,255,255,0.04))
  --glass-border-muted: docs callout border (migrated from rgba(255,255,255,0.1))
  --glass-border-accent: docs callout left border (migrated from rgba(255,255,255,0.15))
  --glass-shadow-soft: docs callout box-shadow (migrated from 0 8px 32px rgba(0,0,0,0.2))
  --glass-overlay-strong: docs offcanvas backdrop (migrated from rgba(0,0,0,0.5))
*/
:root {
  /* Core brand */
  --pure-black: #000;
  --umbra-black: #0D0D0D;
  --white: #fff;
  --indigo-violet: #8866DE;
  --indigo-violet-hover: #6B4FB8;
  --slate-gray: #5E6169;
  --moon-silver: #DADDE5;
  --moon-silver-hover: #C4C8D1;
  --raven-red: #DA3B26;
  --loading-gray: #666;
  /* Liquid glass (glassmorphism) – cards, navbar, modals */
  --glass-bg: rgba(255, 255, 255, 0.06);
  --glass-bg-strong: rgba(255, 255, 255, 0.12);
  --glass-bg-light: rgba(255, 255, 255, 0.18);
  --glass-border: rgba(255, 255, 255, 0.12);
  --glass-border-strong: rgba(255, 255, 255, 0.2);
  --glass-blur: 12px;
  --glass-blur-strong: 20px;
  --glass-shadow: 0 8px 32px rgba(0, 0, 0, 0.25);
  --glass-overlay: rgba(0, 0, 0, 0.25);
  --glass-overlay-strong: rgba(0, 0, 0, 0.5);
  --glass-btn-bg: rgba(0, 0, 0, 0.42);
  --glass-btn-bg-hover: rgba(0, 0, 0, 0.58);
  --glass-btn-border: rgba(255, 255, 255, 0.18);
  --glass-btn-border-hover: rgba(255, 255, 255, 0.28);
  /* Docs / glass variants (migrated from hardcoded values in docs.html) */
  --docs-code-text: #e2e8f0;
  --glass-inset-subtle: rgba(255, 255, 255, 0.05);
  --glass-inset-muted: rgba(255, 255, 255, 0.04);
  --glass-bg-subtle: rgba(255, 255, 255, 0.04);
  --glass-border-muted: rgba(255, 255, 255, 0.1);
  --glass-border-accent: rgba(255, 255, 255, 0.15);
  --glass-shadow-soft: 0 8px 32px rgba(0, 0, 0, 0.2);
}

html {
  scroll-behavior: smooth;
  background-color: var(--pure-black)!important;
}

body {
  font-family: 'Libre Franklin', sans-serif;
  font-size: 18px;
  font-weight: 400;
  line-height: 1.6;
  color: var(--umbra-black);
  background-color: var(--pure-black)!important;
}

/* Display Font - PPValve (never uppercase) */
.font-display {
  font-family: 'PPValve', sans-serif;
  text-transform: none !important;
  font-weight: 400;
}

/* Subtitle - Libre Franklin Regular 36px */
.subtitle {
  font-family: 'Libre Franklin', sans-serif;
  font-size: 36px;
  font-weight: 400;
}

/* Color Utilities */
.text-moon-silver {
  color: var(--moon-silver) !important;
}

.text-slate-gray {
  color: var(--slate-gray) !important;
}

.bg-indigo-violet {
  background-color: var(--indigo-violet) !important;
}

.bg-moon-silver {
  background-color: var(--moon-silver) !important;
}

.bg-umbra-black {
  background-color: var(--umbra-black) !important;
}