:root {
  /* ============================================================
   * BRAND — Nondito Soft · Brand Option 2: Pure White + Nondito Orange
   * Primary:   #F69A37 (Pantone 715)   Black: #111111   White: #FFFFFF
   * Dark mode: [data-theme="dark"] below (Brand Option 1: Midnight Black)
   * ============================================================ */
  --brand-hue:    55;
  --brand-chroma: 0.15;

  /* paper — pure white */
  --color-paper:        #FFFFFF;
  --color-paper-2:      #F6F6F6;
  --color-paper-3:      #EDEDED;

  /* ink — Nondito Black */
  --color-ink:          #111111;
  --color-ink-2:        #444444;
  --color-muted:        #767676;  /* 4.54:1 on white ✓ AA */
  --color-dim:          #888888;

  /* rule / divider */
  --color-rule:         #E0E0E0;
  --color-rule-2:       #EEEEEE;

  /* accent — Nondito Orange */
  --color-accent:       #F69A37;
  --color-accent-2:     #EB800B;
  --color-accent-ink:   #FFFFFF;
  --color-accent-bloom: rgb(246 154 55 / 0.15);
  --color-accent-tint:  rgb(246 154 55 / 0.08);

  /* focus */
  --color-focus:        #EB800B;

  /* success — dark-tuned green for light bg */
  --color-success:        oklch(36% 0.18 150);
  --color-success-ring:   oklch(36% 0.18 150 / 0.4);
  --color-success-tint:   oklch(36% 0.18 150 / 0.07);

  /* nav scrolled */
  --color-paper-scrolled: rgb(255 255 255 / 0.90);

  /* type — variable Inter + JetBrains Mono */
  --font-display: 'Inter', system-ui, -apple-system, sans-serif;
  --font-body:    'Inter', system-ui, -apple-system, sans-serif;
  --font-mono:    'JetBrains Mono', ui-monospace, 'SF Mono', monospace;

  /* type scale (fluid) */
  --text-xs:       0.75rem;
  --text-sm:       0.875rem;
  --text-md:       1rem;
  --text-lg:       1.125rem;
  --text-body:     1.0625rem;
  --text-xl:       1.375rem;
  --text-2xl:      1.75rem;
  --text-3xl:      clamp(2rem, 3vw + 0.5rem, 2.75rem);
  --text-4xl:      clamp(2.5rem, 4vw + 0.5rem, 3.75rem);
  --text-display:  clamp(2.75rem, 6vw + 0.5rem, 5rem);
  --text-figure:   clamp(7.5rem, 18vw + 1rem, 17rem);

  /* tracking */
  --track-tight:   -0.035em;
  --track-figure:  -0.06em;
  --track-eyebrow: 0.16em;

  /* spacing — 4pt scale */
  --space-3xs: 0.25rem;
  --space-2xs: 0.5rem;
  --space-xs:  0.75rem;
  --space-sm:  1rem;
  --space-md:  1.5rem;
  --space-lg:  2rem;
  --space-xl:  3rem;
  --space-2xl: 4.5rem;
  --space-3xl: 7rem;

  /* radii */
  --radius-sm:   4px;
  --radius:      8px;
  --radius-lg:   12px;
  --radius-xl:   20px;
  --radius-pill: 999px;

  /* container */
  --container: 1240px;
  --gutter:    clamp(20px, 4vw, 48px);

  /* section rhythm */
  --section-py: clamp(96px, 12vw, 160px);

  /* page-specific sizes */
  --text-auth-title: 2.75rem;   /* 44px — sign-in / sign-up / contact h1 */

  /* motion */
  --ease-out:    cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in:     cubic-bezier(0.32, 0, 0.67, 0);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-short:   180ms;
  --dur-med:     320ms;
  --dur-long:    560ms;
}

[data-theme="dark"] {
  /* paper — Nondito Black (Brand Option 1: Midnight Black) */
  --color-paper:        #111111;
  --color-paper-2:      #1C1C1C;
  --color-paper-3:      #252525;

  /* ink — Nondito White */
  --color-ink:          #FFFFFF;
  --color-ink-2:        #D3D3D3;
  --color-muted:        #888888;
  --color-dim:          #666666;

  /* rule / divider */
  --color-rule:         #2E2E2E;
  --color-rule-2:       #252525;

  /* accent — Nondito Orange (same on dark) */
  --color-accent:       #F69A37;
  --color-accent-2:     #FDB563;
  --color-accent-ink:   #111111;
  --color-accent-bloom: rgb(246 154 55 / 0.18);
  --color-accent-tint:  rgb(246 154 55 / 0.08);

  /* focus */
  --color-focus:        #F69A37;

  /* success — bright green for dark bg */
  --color-success:        oklch(72% 0.16 160);
  --color-success-ring:   oklch(72% 0.16 160 / 0.4);
  --color-success-tint:   oklch(72% 0.16 160 / 0.08);

  /* nav scrolled */
  --color-paper-scrolled: rgb(17 17 17 / 0.85);
}

/* ============================================================
 * THEME LOCK — to ship only one mode, add to <html>:
 *   <html lang="en" data-theme="dark" data-theme-lock>
 * The switcher UI hides automatically. JS skips toggle wiring.
 * (Light is the :root default — no lock attribute needed for light.)
 * ============================================================ */
[data-theme-lock] .theme-switcher { display: none !important; }