/* Design Tokens cho Softfolio - Bảng màu xanh bụi, trắng ngà, xanh đậm */
:root {
  /* Bảng màu chính */
  --ink: #253f50;            /* Xanh đậm tạo tương phản */
  --ink-rgb: 37, 63, 80;
  --ink-light: #3a5c72;
  --ink-deep: #192a36;

  --paper: #faf8f2;          /* Trắng ngà ấm áp */
  --paper-card: #f4f1e8;
  --paper-elevated: #ffffff;

  --dusty-blue: #7093a6;     /* Xanh bụi dịu mắt */
  --dusty-blue-dark: #557588;
  --dusty-blue-light: #8daab9;

  --mint: #d2e1e7;           /* Xanh bạc hà nhẹ */
  --lavender: #dbe3ee;       /* Tím xanh pastel */
  --peach: #ebe3d7;          /* Be đào ấm */
  --blue-soft: #d0dddf;      /* Xanh khói nhạt */

  --text-muted: #627887;
  --text-dim: #8496a3;
  --border-subtle: #cddade;
  --border-strong: #9bb5bf;

  --success: #3e885b;
  --danger: #be4b49;
  --warning: #c28828;

  /* Typography */
  --font-sans: Nunito, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-serif: Georgia, 'Times New Roman', serif;

  /* Bo góc (Border Radius) */
  --radius-sm: 8px;
  --radius-md: 14px;
  --radius-lg: 20px;
  --radius-xl: 32px;
  --radius-full: 9999px;

  /* Bóng đổ (Box Shadow) */
  --shadow-sm: 0 2px 6px rgba(37, 63, 80, 0.05);
  --shadow-md: 0 8px 24px rgba(37, 63, 80, 0.08);
  --shadow-lg: 16px 20px 32px rgba(37, 63, 80, 0.12);
  --shadow-hard: 12px 14px 0 rgba(37, 63, 80, 0.08);

  /* Chuyển động (Transitions) */
  --ease-smooth: cubic-bezier(0.16, 1, 0.3, 1);
  --transition-fast: 0.15s ease;
  --transition-normal: 0.28s var(--ease-smooth);
  --transition-slow: 0.5s var(--ease-smooth);

  /* Layout */
  --max-width: 1360px;
  --content-padding: 5%;
}