/* ==========================================================================
   Digital Direction — Design Tokens  (theme.css)
   الاتجاه الرقمي — الرموز التصميمية
   Brand palette derived from the official logo sheet.
   ========================================================================== */

:root {
  /* ---- Brand ---- */
  --dd-navy-900: #071F45;
  --dd-navy-800: #0B316E;   /* Primary — من الشعار */
  --dd-navy-700: #0D4A7D;   /* من الشعار */
  --dd-navy-600: #14568F;
  --dd-teal-600: #14838C;   /* من الشعار */
  --dd-teal-700: #0E6A72;   /* نص على خلفيات فاتحة — يحقق AA */
  --dd-teal-500: #119BA3;   /* Accent — من الشعار */
  --dd-teal-400: #2FB4BC;
  --dd-teal-300: #6FD0D6;
  --dd-teal-100: #DFF4F5;
  --dd-steel-500: #478991;  /* من الشعار */

  /* ---- Neutrals ---- */
  --dd-ink:        #0A1F3C;
  --dd-ink-2:      #2C4159;
  --dd-muted:      #5B7189;
  --dd-line:       #E2EAF2;
  --dd-line-soft:  #EEF3F8;
  --dd-surface:    #FFFFFF;
  --dd-surface-2:  #F6F9FC;
  --dd-surface-3:  #EDF3F9;

  /* ---- Semantic ---- */
  --dd-success: #12805F;
  --dd-warning: #B8770B;
  --dd-danger:  #C0392B;

  /* ---- Typography ---- */
  --dd-font-head: "Noto Kufi Arabic", "Cairo", "Segoe UI", system-ui, sans-serif;
  --dd-font-body: "Cairo", "Noto Kufi Arabic", "Segoe UI", system-ui, sans-serif;
  --dd-font-brand: "Almarai", "Noto Kufi Arabic", "Segoe UI", system-ui, sans-serif;

  --dd-fs-display: clamp(2.25rem, 1.35rem + 3.4vw, 4rem);
  --dd-fs-h1:      clamp(1.5rem, 1.1rem + 1.4vw, 2.15rem);
  --dd-fs-h2:      clamp(1.22rem, 1rem + 0.85vw, 1.6rem);
  --dd-fs-h3:      clamp(1rem, 0.95rem + 0.24vw, 1.12rem);
  --dd-fs-lead:    clamp(1rem, 0.95rem + 0.35vw, 1.175rem);
  --dd-fs-body:    1rem;
  --dd-fs-sm:      0.9rem;
  --dd-fs-xs:      0.8rem;

  /* ---- Spacing scale (8pt) ---- */
  --dd-1: 4px;  --dd-2: 8px;  --dd-3: 12px; --dd-4: 16px; --dd-5: 24px;
  --dd-6: 32px; --dd-7: 48px; --dd-8: 64px; --dd-9: 96px; --dd-10: 128px;

  /* ---- Radius ---- */
  --dd-r-sm: 8px; --dd-r-md: 14px; --dd-r-lg: 20px; --dd-r-xl: 28px; --dd-r-pill: 999px;

  /* ---- Elevation ---- */
  --dd-sh-1: 0 1px 2px rgba(10,31,60,.06), 0 1px 3px rgba(10,31,60,.05);
  --dd-sh-2: 0 4px 12px rgba(10,31,60,.07), 0 2px 4px rgba(10,31,60,.04);
  --dd-sh-3: 0 18px 40px -12px rgba(10,31,60,.18), 0 4px 12px rgba(10,31,60,.06);
  --dd-sh-brand: 0 14px 34px -10px rgba(11,49,110,.45);

  /* ---- Layout ---- */
  --dd-container: 1200px;
  --dd-container-narrow: 880px;
  --dd-header-h: 76px;

  /* ---- Motion ---- */
  --dd-ease: cubic-bezier(.22,.61,.36,1);
  --dd-dur: .28s;
}

@media (prefers-reduced-motion: reduce) {
  * { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; scroll-behavior: auto !important; }
}