/* ============================================================
   THEME: MIDNIGHT
   Dark, editorial, sophisticated — electric cyan on deep navy
   ============================================================ */

[data-theme="midnight"] {
  /* ── Core palette ──────────────────────────────────────── */
  --color-bg:             #0a0e1a;
  --color-surface:        #111827;
  --color-surface-2:      #1a2236;
  --color-border:         #1e2d47;
  --color-border-light:   #243452;

  /* ── Brand / Accent ────────────────────────────────────── */
  --color-primary:        #00d4ff;
  --color-primary-hover:  #00b8e0;
  --color-accent:         #7c3aed;
  --color-accent-soft:    rgba(124, 58, 237, 0.15);
  --color-primary-soft:   rgba(0, 212, 255, 0.1);

  /* ── Text ──────────────────────────────────────────────── */
  --color-heading:        #f0f6ff;
  --color-text:           #b8c8e0;
  --color-text-muted:     #6b82a0;
  --color-btn-text:       #0a0e1a;

  /* ── Shadows & glows ───────────────────────────────────── */
  --color-shadow:         rgba(0, 212, 255, 0.25);
  --color-card-shadow:    0 4px 32px rgba(0, 0, 0, 0.5);
  --color-glow:           0 0 40px rgba(0, 212, 255, 0.12);

  /* ── Typography ────────────────────────────────────────── */
  --font-heading:         'Syne', sans-serif;
  --font-body:            'DM Sans', sans-serif;

  /* ── Shape ─────────────────────────────────────────────── */
  --radius-sm:            4px;
  --radius-md:            8px;
  --radius-lg:            16px;
  --radius-xl:            24px;

  /* ── Nav specific ──────────────────────────────────────── */
  --nav-bg:               rgba(10, 14, 26, 0.92);
  --nav-border:           rgba(30, 45, 71, 0.8);

  /* ── Hero specific ─────────────────────────────────────── */
  --hero-bg:              #0a0e1a;
  --hero-gradient:        radial-gradient(ellipse 80% 60% at 50% -10%, rgba(0,212,255,0.1) 0%, transparent 70%),
                          radial-gradient(ellipse 50% 40% at 80% 50%, rgba(124,58,237,0.08) 0%, transparent 60%);

  /* ── Feature card ──────────────────────────────────────── */
  --card-bg:              #111827;
  --card-border:          #1e2d47;
  --card-hover-border:    #00d4ff;

  /* ── CTA section ───────────────────────────────────────── */
  --cta-bg:               #111827;
  --cta-gradient:         linear-gradient(135deg, rgba(0,212,255,0.06) 0%, rgba(124,58,237,0.06) 100%);

  /* ── Footer ────────────────────────────────────────────── */
  --footer-bg:            #060a14;
  --footer-text:          #6b82a0;
}