/* ============================================================
   Axel Chase — Studio design tokens
   Cool, clean blue/white (old-Axel feel) · azure accent · dark bands
   ============================================================ */
:root {
  /* Page surfaces — cool soft white, never stark */
  --paper:    #eef3fb;   /* page background */
  --paper-2:  #e2eaf6;   /* deeper cool tint */
  --card:     #ffffff;   /* card */
  --card-2:   #f6f9fe;   /* soft card */

  /* Ink (cool navy-black) */
  --ink:        #0c1422;
  --ink-soft:   #46556d;
  --ink-faint:  #8593aa;
  --ink-dim:    rgba(12,20,34,0.5);
  --ink-rgb:    12, 20, 34;

  /* Dark contrast bands */
  --dark:       #070d1a;
  --dark-2:     #0d1729;
  --dark-text:  #eaf1fc;
  --dark-soft:  rgba(234,241,252,0.66);
  --dark-faint: rgba(234,241,252,0.40);
  --dark-line:  rgba(234,241,252,0.12);

  /* Accent — Axel azure (sampled from logo) */
  --accent:        #0a6ff0;
  --accent-2:      #2a8bff;
  --accent-bright: #2a8bff;
  --accent-soft:   #6aa8ff;
  --accent-deep:   #0a52c4;
  --halo:          rgba(10,111,240,0.22);

  /* Semantic text (default = on light) */
  --text:       var(--ink);
  --text-soft:  var(--ink-soft);
  --text-faint: var(--ink-faint);

  /* Lines on light */
  --line:    rgba(12,20,34,0.12);
  --line-2:  rgba(12,20,34,0.07);
  --line-3:  rgba(12,20,34,0.22);

  /* Typography */
  --display: "Clash Display", "Times New Roman", serif;
  --sans:    "Satoshi", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;

  /* Fluid type scale */
  --t-eyebrow: clamp(0.7rem, 0.66rem + 0.2vw, 0.78rem);
  --t-small:   clamp(0.82rem, 0.79rem + 0.15vw, 0.92rem);
  --t-body:    clamp(1rem, 0.96rem + 0.2vw, 1.1rem);
  --t-lead:    clamp(1.12rem, 1rem + 0.55vw, 1.45rem);
  --t-h3:      clamp(1.35rem, 1.05rem + 1.2vw, 2rem);
  --t-h2:      clamp(2.1rem, 1.35rem + 3vw, 3.9rem);
  --t-display: clamp(2.7rem, 1.5rem + 5.6vw, 6.2rem);
  --t-mega:    clamp(3.2rem, 1.2rem + 9vw, 8.8rem);

  /* Layout */
  --maxw:   1280px;
  --gutter: clamp(1.25rem, 5vw, 4.5rem);
  --radius:    14px;
  --radius-lg: 24px;
  --radius-xl: 34px;

  /* Motion */
  --ease:     cubic-bezier(0.22, 1, 0.36, 1);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
}