/* Shared design tokens and theme values. Component rules live in style.css. */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+Arabic:wght@400;500;600;700&family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root {
  color-scheme: light;
  --paper: #faf8f1;
  --ink: #242731;
  --orange: #ed5939;
  --blue: #314bf5;
  --surface: #fffdf8;
  --surface-muted: #f0eee6;
  --contact-surface: #eeedfa;
  --muted: #60646d;
  --line: #deded7;
  --field: #fffdf8;
  --focus: #314bf5;
  --content: 1240px;
  --pricing-width: 1200px;
  --section-space: clamp(48px, 6vw, 80px);
  --heading: clamp(32px, 3.5vw, 48px);
  --body: clamp(16px, 1.25vw, 18px);
  --radius: 16px;
  --card-pad: 24px;
  --shadow: 0 14px 36px #1c244a0b;
  --art-surface: #fffdf8;
  --art-muted: #e8e7f1;
  --art-line: #d7d9e6;
  --art-shadow: 8px 14px 0 #29355c0d, 0 20px 30px #29355c14;
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --paper: #141923;
  --ink: #f4f2ec;
  --orange: #ff997b;
  --blue: #a6b2ff;
  --surface: #1e2533;
  --surface-muted: #1a202c;
  --contact-surface: #20253a;
  --muted: #bec5d2;
  --line: #3c465a;
  --field: #171d29;
  --focus: #abb6ff;
  --shadow: 0 16px 40px #0002;
  --art-surface: #333c50;
  --art-muted: #252e41;
  --art-line: #505e7b;
  --art-shadow: 8px 14px 0 #0002, 0 20px 30px #0003;
}