/*
Theme Name: DigitalA
Author: Digital Architects
Version: 1.1
*/

/* ─────────────────────────────────────────────────────────────
   FONTS
───────────────────────────────────────────────────────────── */
@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@900&family=Sora:wght@300;400;500;600&family=JetBrains+Mono:ital,wght@0,300;0,400;0,500;0,700;1,400&display=swap');

/* ─────────────────────────────────────────────────────────────
   DESIGN TOKENS
───────────────────────────────────────────────────────────── */
:root {
  /* Backgrounds */
  --bg-0:           #111822;
  --bg-1:           #162030;
  --bg-2:           #1C2538;
  --bg-3:           #222D3E;

  /* Borders */
  --border-dim:     rgba(100, 155, 195, 0.07);
  --border-soft:    rgba(100, 155, 195, 0.15);
  --border-bright:  rgba(100, 155, 195, 0.30);

  /* Text */
  --text-hi:        #D8E3EE;
  --text-mid:       #8A9BB2;
  --text-lo:        #516070;

  /* Accent palette */
  --cyan:           #01BFFF;
  --green:          #00E896;
  --blue:           #4A9EFF;
  --purple:         #C084FC;
  --pink:           #FF79C6;

  /* Glow */
  --glow-cyan:      0 0 16px rgba(1, 191, 255, 0.25);
  --glow-green:     0 0 14px rgba(0, 232, 150, 0.18);

  /* Code — Dracula-inspired */
  --syn-keyword:    #FF79C6;
  --syn-string:     #F1FA8C;
  --syn-comment:    #6272A4;
  --syn-function:   #50FA7B;
  --syn-variable:   #8BE9FD;
  --syn-number:     #BD93F9;
  --syn-operator:   #E06C75;
  --syn-tag:        #FF79C6;
  --syn-attr:       #50FA7B;
  --syn-plain:      #F8F8F2;

  /* Fonts */
  --f-display: 'Sora',           sans-serif;
  --f-heading: 'Sora',           sans-serif;
  --f-body:    'Sora', sans-serif;
  --f-mono:    'JetBrains Mono', monospace;

  /* Layout */
  --content-w:  860px;
  --wide-w:     1200px;
  --pad-x:      clamp(1.25rem, 5vw, 3rem);

  /* Spacing scale */
  --s1:  0.25rem;
  --s2:  0.5rem;
  --s3:  0.75rem;
  --s4:  1rem;
  --s5:  1.5rem;
  --s6:  2rem;
  --s7:  3rem;
  --s8:  4.5rem;

  /* Radius */
  --r-sm: 4px;
  --r-md: 8px;
  --r-lg: 14px;

  /* Motion */
  --ease-fast:  150ms ease;
  --ease-base:  250ms ease;
  --ease-slow:  400ms cubic-bezier(0.16, 1, 0.3, 1);

  /* Dot grid */
  --dot-color: rgba(1, 191, 255, 0.055);
  --dot-px:    1px;
  --dot-gap:   30px;

  color-scheme: dark;
}