/* Design tokens — Kang Kang / Noah Margolese portfolio.
   This file is the single source of truth for colors/fonts/spacing —
   every other stylesheet references these variables rather than
   hardcoding values. admin.html is the one exception (it duplicates
   the palette in its own inline <style>, being a standalone tool page). */
:root {
  /* Colors */
  --bg-primary: #f8f5ee;     /* soft warm white — the page background */
  --bg-tint: rgba(248, 245, 238, 0.9); /* translucent banner fill */
  --bg-warm: #efe7d4;        /* deeper warm tone for decorative washes */
  --text-primary: #1a1a1a;   /* headings, body text */
  --text-secondary: #555;    /* bio text, descriptions */
  --text-muted: #666;        /* metadata, sub-items (AA on cream) */
  --accent: #c9a3c7;         /* soft purple tint — hover, dividers, borders */
  --accent-deep: #884f86;    /* rgb(136,79,134) — deep purple for links/labels — AA (5.5:1) on cream */
  --border: rgba(0, 0, 0, 0.07);
  --card-bg: #1a1a1a;        /* gallery card background */
  --card-text: #ffffff;

  /* Typography */
  --font-display: Palatino, "Palatino Linotype", "Book Antiqua", Georgia, serif;
  --font-body: "DM Sans", system-ui, -apple-system, "Segoe UI", sans-serif;

  /* Shape & motion */
  --radius: 4px;             /* sharp, nearly square */
  --ease: cubic-bezier(0.22, 0.61, 0.36, 1);
  --speed: 0.35s;

  /* Motion */
  --ease-swing: cubic-bezier(0.34, 1.32, 0.44, 1); /* gentle overshoot — the lilt */
  --ease-glide: cubic-bezier(0.22, 0.61, 0.36, 1);  /* calm, for hovers/UI */
  --dur-micro: 0.3s;
  --dur-1: 0.45s;   /* entrances */
  --dur-2: 0.6s;    /* page transitions */

  /* Soft-glow palette (AA-safe under #1a1a1a text) */
  --glow-photo: rgba(224, 176, 96, 0.42);   --wash-photo: rgba(224, 176, 96, 0.12);
  --glow-research: rgba(132, 158, 118, 0.34); --wash-research: rgba(132, 158, 118, 0.10);
  --glow-clinical: rgba(201, 135, 120, 0.34); --wash-clinical: rgba(201, 135, 120, 0.10);
  --glow-cv: rgba(120, 144, 184, 0.32);      --wash-cv: rgba(120, 144, 184, 0.10);

  /* Layout */
  --content-max: 1400px;
  --content-width: 92vw;
}