/* Design tokens — CSS variables only. No selectors with rules beyond :root. */
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@500;600;700;800&family=Montserrat:wght@400;500;600;700&display=swap');

:root {
  /* Color */
  --c-bg: #ffffff;
  --c-surface: #f7f8fa;
  --c-surface-2: #eef1f5;
  --c-border: #d9dee5;
  --c-text: #1a2230;
  --c-text-muted: #5b6675;
  --c-primary: #1558d6;
  --c-primary-hover: #0f47b0;
  --c-primary-soft: #e7effd;
  --c-success: #1a8a4a;
  --c-danger: #c8331f;
  --c-warning: #b8860b;
  --c-focus: #1558d6;

  /* Typography */
  --ff-base: "Montserrat", system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans Devanagari", Arial, sans-serif;
  --ff-heading: "DM Sans", var(--ff-base);
  --fs-xs: 0.78rem;
  --fs-sm: 0.875rem;
  --fs-base: 1rem;
  --fs-lg: 1.125rem;
  --fs-xl: clamp(1.25rem, 1.1rem + 0.7vw, 1.5rem);
  --fs-2xl: clamp(1.6rem, 1.3rem + 1.4vw, 2.25rem);
  --fs-3xl: clamp(2.1rem, 1.5rem + 2.6vw, 3.4rem);
  --fs-display: clamp(2.6rem, 1.6rem + 4.4vw, 5rem);
  --lh-tight: 1.1;
  --lh-base: 1.65;
  --motion: 0.5s cubic-bezier(0.16, 1, 0.3, 1);

  /* Space */
  --sp-1: 0.25rem;
  --sp-2: 0.5rem;
  --sp-3: 0.75rem;
  --sp-4: 1rem;
  --sp-5: 1.5rem;
  --sp-6: 2rem;
  --sp-8: 3rem;

  /* Radius / shadow */
  --radius: 10px;
  --radius-sm: 6px;
  --shadow-1: 0 1px 2px rgba(16, 24, 40, 0.04);
  --shadow-2: 0 10px 30px -12px rgba(16, 24, 40, 0.18);

  /* Layout */
  --maxw: 1280px;
  --header-h: 76px;
}

/* Dark theme tokens. Shared via custom property block. */
:root[data-theme="dark"] {
  --c-bg: #0b0b0c;
  --c-surface: #151517;
  --c-surface-2: #202023;
  --c-border: #2c2c30;
  --c-text: #f3f3f4;
  --c-text-muted: #a1a1a8;
  --c-primary: #2f6fed;
  --c-primary-hover: #4d8bff;
  --c-primary-soft: #1a2230;
  --c-success: #3fbf72;
  --c-danger: #ff6b54;
  --shadow-1: 0 1px 3px rgba(0, 0, 0, 0.6);
  --shadow-2: 0 4px 14px rgba(0, 0, 0, 0.7);
}

/* Default to OS preference only when user has NOT chosen explicitly. */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --c-bg: #0b0b0c;
    --c-surface: #151517;
    --c-surface-2: #202023;
    --c-border: #2c2c30;
    --c-text: #f3f3f4;
    --c-text-muted: #a1a1a8;
    --c-primary: #2f6fed;
    --c-primary-hover: #4d8bff;
    --c-primary-soft: #1a2230;
    --c-success: #3fbf72;
    --c-danger: #ff6b54;
    --shadow-1: 0 1px 3px rgba(0, 0, 0, 0.6);
    --shadow-2: 0 4px 14px rgba(0, 0, 0, 0.7);
  }
}