/* ==========================================================================
   Eastgate design tokens — mirrors the design-system bundle.
   Calm and technical: blue + purple, mist neutrals, one gradient per page,
   three radii, two shadows.
   ========================================================================== */

:root {
  --color-blue: #4970AE;
  --color-blue-700: #355492;
  --color-blue-300: #7694C2;
  --color-blue-100: #C9D6E8;

  --color-purple: #5D3CB0;
  --color-purple-700: #432887;
  --color-purple-300: #8A72C7;
  --color-purple-100: #D6CCEC;
  --color-purple-tint: #F1EDFA;
  --color-purple-surface: #FBFAFE;
  --color-purple-border: #DED6F4;

  --color-mist: #F7F8FA;
  --color-mist-2: #EEF2F6;
  --color-white: #FFFFFF;

  --color-ink-900: #0E1726;
  --color-ink-700: #3A4252;
  --color-ink-500: #6B7280;
  --color-ink-300: #94A3B8;
  --color-ink-100: #CBD5E1;
  --color-ink-50: #F1F5F9;

  --color-success: #1FA97D;
  --color-success-bg: #E5F6F0;
  --color-warning: #F2A93B;
  --color-warning-ink: #B07817;
  --color-warning-bg: #FDF1DC;
  --color-error: #E24B4B;
  --color-error-bg: #FBE3E3;
  --color-error-surface: #FEF7F7;

  --color-border: #E5E7EB;
  --color-border-strong: #CBD5E1;
  --color-border-soft: #EEF2F6;

  --gradient-hero: linear-gradient(135deg, #4970AE 0%, #5D3CB0 100%);

  --font-sans: 'Montserrat', 'Helvetica Neue', Arial, system-ui, sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
  --font-hand: 'Caveat', cursive;

  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 10px;
  --radius-pill: 999px;

  --shadow-card: 0 1px 2px rgba(14, 23, 38, 0.04);
  --shadow-modal: 0 12px 32px rgba(14, 23, 38, 0.10);
  --shadow-focus: 0 0 0 3px rgba(73, 112, 174, 0.30);
  --shadow-paper: 0 10px 26px rgba(14, 23, 38, 0.16);

  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --dur-1: 100ms;
  --dur-2: 150ms;
  --dur-3: 250ms;
  --dur-4: 400ms;

  --content-max: 1280px;
  --content-narrow: 1080px;
  --header-h: 64px;
}

/* ---- Motion ------------------------------------------------------------ */
@keyframes daPulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(93, 60, 176, 0.28); }
  50% { box-shadow: 0 0 0 9px rgba(93, 60, 176, 0); }
}
@keyframes daBlink {
  0%, 49% { opacity: 1; }
  50%, 100% { opacity: 0; }
}
@keyframes daScan {
  0% { top: -10%; }
  100% { top: 105%; }
}
@keyframes daFadeUp {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: none; }
}
@keyframes daFadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}
@keyframes daDash {
  to { stroke-dashoffset: -24; }
}
@keyframes daSpin {
  to { transform: rotate(360deg); }
}
@keyframes daGlow {
  0%, 100% { opacity: 0.35; }
  50% { opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
  }
}