/*
  variables.css
  Central theme tokens for the Comrade brand. Every other stylesheet reads
  colors, spacing, radii, shadows, and transitions from here. Do not use a
  raw hex value anywhere else in the codebase; add or reuse a token instead.

  Colors are derived directly from the supplied logo and hero artwork
  (warm cream background, deep burgundy/magenta accent). The theme is
  intentionally locked to light: color-scheme: light below is the one
  declaration of that lock in the project — no other file should
  redeclare it, and no @media (prefers-color-scheme) rule should exist
  anywhere in the codebase.
*/

:root {
  color-scheme: light;

  /* Surfaces */
  --comrade-bg: #f9eee2;
  --comrade-surface: #ffffff;
  --comrade-surface-soft: #fdf6ee;
  --comrade-surface-deep: #f2e4d2; /* one step warmer/darker than
    --comrade-bg, for alternating section bands (see about.css) */

  /* Brand */
  --comrade-primary: #970747;
  --comrade-primary-hover: #7a0339;
  --comrade-primary-light: rgba(151, 7, 71, 0.04);
  --comrade-primary-light-strong: rgba(151, 7, 71, 0.08);

  /* Text */
  --comrade-text: #221a18;
  --comrade-text-muted: #6f6460;
  --comrade-text-on-primary: #fdf6ee;

  /* Structure */
  --comrade-border: #e9dccb;
  --comrade-border-strong: #ddccb4;
  --comrade-shadow: rgba(94, 47, 32, 0.14);
  --comrade-shadow-soft: rgba(94, 47, 32, 0.08);

  /* Radii */
  --comrade-radius-sm: 10px;
  --comrade-radius-md: 16px;
  --comrade-radius-lg: 28px;
  --comrade-radius-pill: 999px;

  /* Spacing scale */
  --comrade-space-xs: 0.5rem;
  --comrade-space-sm: 1rem;
  --comrade-space-md: 1.5rem;
  --comrade-space-lg: 2.5rem;
  --comrade-space-xl: 4rem;
  --comrade-space-xxl: 6rem;

  /* Typography */
  --comrade-font-body: "Plus Jakarta Sans", "Segoe UI", system-ui, -apple-system,
    sans-serif;

  /* Transitions
     - fast/normal/slow: general-purpose easing, unrelated to hover.
       slow is reserved for one-shot entrance reveals (scroll-in,
       orbit fade-in), never for a repeatedly-triggered interaction.
     - hover: the single timing every hover-triggered popup uses
       site-wide — buttons, cards, nav/footer links, contact icons,
       heading fills. One token here means "make hovers feel slower"
       is always a one-line change, and every hover across the site
       moves at the exact same speed instead of drifting apart as
       components are added. Press/active feedback intentionally stays
       on --comrade-transition-fast at its own call sites so clicking
       still feels immediate even though hovering-in is slow. */
  --comrade-transition-fast: 150ms cubic-bezier(0.4, 0, 0.2, 1);
  --comrade-transition-normal: 300ms cubic-bezier(0.4, 0, 0.2, 1);
  --comrade-transition-slow: 600ms cubic-bezier(0.4, 0, 0.2, 1);
  --comrade-transition-hover: 400ms cubic-bezier(0.4, 0, 0.2, 1);

  /* Navbar */
  --comrade-navbar-height: 110px;
  --comrade-navbar-height-scrolled: 80px;

  /* Glass surfaces: a translucent tint derived from existing tokens
     (not a new hardcoded color) for the scrolled navbar's floating-glass
     treatment. See navbar.css. */
  --comrade-glass-bg: color-mix(in srgb, var(--comrade-bg) 80%, transparent);
  --comrade-glass-border: color-mix(in srgb, var(--comrade-border) 65%, transparent);
  --comrade-glass-bg-fallback: #f6ecdf; /* opaque, slightly deeper than
    --comrade-bg; used only where backdrop-filter is unsupported */

  /* Layered z-index scale */
  --comrade-z-navbar: 100;
  --comrade-z-orbit-path: 10;
  --comrade-z-orbit-label: 20;

  /* Neumorphism: warm, sparing tactile depth for a few small
     interactive elements only (buttons, orbit dots, the footer social
     icon) — never large surfaces. Built from the same warm brown shadow
     hue already used site-wide (--comrade-shadow's rgb(94,47,32)), not
     a separate gray palette, and a warm off-white highlight rather than
     pure white/gray, so it reads as "this cream surface catching soft
     light" rather than a generic neumorphic dashboard. --raised/
     --raised-hover/--pressed are full box-shadow values so call sites
     never hand-tune offsets themselves; responsive.css scales them down
     for mobile in one place. */
  --comrade-neumo-shadow-dark: rgba(94, 47, 32, 0.16);
  --comrade-neumo-shadow-light: rgba(255, 252, 247, 0.9);
  --comrade-neumo-raised: 5px 5px 12px var(--comrade-neumo-shadow-dark),
    -5px -5px 12px var(--comrade-neumo-shadow-light);
  --comrade-neumo-raised-hover: 7px 7px 16px var(--comrade-neumo-shadow-dark),
    -7px -7px 16px var(--comrade-neumo-shadow-light);
  --comrade-neumo-pressed: inset 3px 3px 7px var(--comrade-neumo-shadow-dark),
    inset -3px -3px 7px var(--comrade-neumo-shadow-light);
}