/**
 * MAK International — brand design tokens
 * Logo: #00A0E3 on white
 */
:root {
  /* Core brand */
  --mak-blue: #00A0E3;
  --mak-blue-dark: #007BB5;
  --mak-blue-deep: #005A82;
  --mak-blue-mid: #0088C9;
  --mak-blue-light: #E6F6FD;
  --mak-blue-pale: #F0FAFF;
  --mak-blue-bright: #33BEF0;
  --mak-blue-glow: #66CFF0;
  --mak-white: #FFFFFF;

  /* Semantic aliases (used across app.css) */
  --color-brand: var(--mak-blue);
  --color-primary-dark: var(--mak-blue-deep);
  --color-primary: var(--mak-blue-dark);
  --color-primary-mid: var(--mak-blue-mid);
  --color-primary-light: var(--mak-blue-light);

  --color-accent: var(--mak-blue);
  --color-accent-hover: #008CC7;
  --color-accent-light: var(--mak-blue-light);
  --color-accent-gradient-end: var(--mak-blue-bright);
  --color-highlight: var(--mak-blue-glow);

  --color-accent-rgb: 0, 160, 227;
  --color-primary-rgb: 0, 90, 130;

  /* Neutrals */
  --color-text: #1e293b;
  --color-text-muted: #64748b;
  --color-border: #e2e8f0;
  --color-surface: var(--mak-white);
  --color-surface-muted: var(--mak-blue-pale);

  /* Status tints (blue-family for cohesion) */
  --color-warning-bg: var(--mak-blue-light);
  --color-warning-text: var(--mak-blue-dark);
  --color-warning-border: #B8E6FA;

  /* Gradients */
  --gradient-brand: linear-gradient(135deg, var(--mak-blue) 0%, var(--mak-blue-bright) 55%, var(--mak-blue-mid) 100%);
  --gradient-accent: var(--gradient-brand);
  --gradient-dark: linear-gradient(135deg, var(--mak-blue-dark) 0%, var(--mak-blue-deep) 100%);
  --gradient-banner: linear-gradient(125deg, var(--mak-blue-deep) 0%, var(--mak-blue-dark) 45%, var(--mak-blue) 100%);
  --gradient-hero: radial-gradient(ellipse 85% 70% at 92% 8%, rgba(var(--color-accent-rgb), .32), transparent 55%),
                   radial-gradient(ellipse 60% 50% at 0% 100%, rgba(255, 255, 255, .12), transparent 50%),
                   var(--gradient-banner);
  --gradient-soft: linear-gradient(180deg, var(--mak-white) 0%, var(--mak-blue-pale) 100%);
  --gradient-subscribe: linear-gradient(90deg, var(--mak-blue-deep) 0%, var(--mak-blue) 50%, var(--mak-blue-bright) 100%);

  /* Elevation */
  --shadow-sm: 0 1px 3px rgba(var(--color-primary-rgb), .08);
  --shadow-md: 0 8px 24px rgba(var(--color-primary-rgb), .12);
  --shadow-lg: 0 18px 42px rgba(var(--color-primary-rgb), .16);
  --shadow-brand: 0 6px 20px rgba(var(--color-accent-rgb), .22);
  --shadow-brand-lg: 0 14px 32px rgba(var(--color-accent-rgb), .28);
  --banner-shadow: var(--shadow-lg);

  /* Layout */
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-xl: 20px;
  --font-sans: 'Plus Jakarta Sans', 'Segoe UI', system-ui, sans-serif;
}