@import url("https://fonts.googleapis.com/css2?family=DM+Serif+Text&family=Inter:wght@400;500;600;700;800&family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap");

:root {
  --axia-accent: #1e4fbf;
  --axia-accent-contrast: #ffffff;
  --axia-accent-hover: #1a46a8;
  --axia-accent-hover-contrast: #ffffff;
  --axia-accent-foreground: #1e4fbf;
  --axia-ambient-accent-foreground: #1e4fbf;
  --axia-surface-accent-foreground: #1e4fbf;
  --axia-accent-light-outline: transparent;
  --axia-accent-light-control-border: var(--axia-accent);
  --axia-accent-dark-outline: transparent;
  --axia-accent-dark-control-border: var(--axia-accent);
  --axia-context-accent-foreground: var(--axia-accent-foreground);
  --axia-secondary-foreground: #161616;
  --axia-context-secondary-foreground: var(--axia-secondary-foreground);

  --axia-text: #111827;
  --axia-text-body: #374151;
  --axia-text-muted: #505758;
  --axia-link: #0000ee;

  --axia-bg: #ffffff;
  --axia-surface: #ffffff;
  --axia-surface-elevated: #f8fafc;

  --axia-border: #d1d5db;
  --axia-focus-ring-light: #ffffff;
  --axia-focus-ring-dark: #111827;
  --axia-focus: var(--axia-focus-ring-light);
  --axia-focus-outer: var(--axia-focus-ring-dark);

  --axia-font-heading: Inter, Arial, Helvetica, sans-serif;
  --axia-font-body: Inter, Arial, Helvetica, sans-serif;
  --axia-font-family: var(--axia-font-body);
  --axia-line-height: 1.5;

  --axia-h1-size: clamp(2.25rem, 4vw, 3.5rem);
  --axia-hero-h1-size: clamp(2.75rem, 5vw, 5rem);
  --axia-h2-size: clamp(1.75rem, 3vw, 2.5rem);
  --axia-h3-size: clamp(1.375rem, 2.6vw, 2.125rem);
  --axia-h4-size: clamp(1.125rem, 2.2vw, 1.75rem);

  --axia-p-size: 1.25rem;
  --axia-ui-text-size: 1.125rem;
  --axia-small-size: 0.875rem;
  --axia-caption-size: 0.625rem;

  /* Text Scale — Normal defaults */
  --axia-nav-text-size: 1rem;
  --axia-footer-text-size: 1rem;
  --axia-global-icon-size: 1.25rem;
  --axia-coming-soon-h1-size: clamp(2.5rem, 4.6vw, 4.875rem);
  --axia-coming-soon-supporting-size: 1.375rem;

  --axia-container: 1200px;
  --axia-container-wide: 1560px;
  --axia-page-gutter: clamp(2rem, 4vw, 4rem);
  --axia-nav-height: 72px;
  --axia-nav-control-size: 44px;
  --axia-footer-height: 56px;
  --axia-header-offset: calc(var(--axia-nav-height) + 1px);
  --axia-footer-offset: calc(var(--axia-footer-height) + 1px);

  --axia-space-1: 0.25rem;
  --axia-space-2: 0.5rem;
  --axia-space-3: 0.75rem;
  --axia-space-4: 1rem;
  --axia-space-5: 1.5rem;
  --axia-space-6: 2rem;
  --axia-space-7: 3rem;
  --axia-space-8: 4rem;

  --axia-radius: 0.75rem;
  --axia-shadow: 0 8px 24px rgba(17, 24, 39, 0.08);
}

[data-axia-text-scale="smaller"] {
  --axia-nav-text-size: 0.875rem;
  --axia-footer-text-size: 0.875rem;
  --axia-global-icon-size: 1.125rem;
  --axia-coming-soon-h1-size: clamp(2rem, 3.8vw, 4rem);
  --axia-coming-soon-supporting-size: 1.125rem;
}

[data-axia-text-scale="larger"] {
  --axia-nav-text-size: 1.125rem;
  --axia-footer-text-size: 1.125rem;
  --axia-global-icon-size: 1.5rem;
  --axia-coming-soon-h1-size: clamp(3rem, 5.4vw, 5.75rem);
  --axia-coming-soon-supporting-size: 1.625rem;
}

@media (max-width: 820px) {
  :root,
  [data-axia-text-scale="normal"] {
    --axia-coming-soon-h1-size: clamp(1.875rem, 7.5vw, 2.25rem);
    --axia-coming-soon-supporting-size: 1rem;
  }

  [data-axia-text-scale="smaller"] {
    --axia-coming-soon-h1-size: clamp(1.5rem, 6.5vw, 1.75rem);
    --axia-coming-soon-supporting-size: 0.75rem;
  }

  [data-axia-text-scale="larger"] {
    --axia-coming-soon-h1-size: clamp(2.25rem, 8.5vw, 2.75rem);
    --axia-coming-soon-supporting-size: 1.25rem;
  }
}

[data-theme="dark"] {
  --axia-accent: #1e4fbf;
  --axia-accent-contrast: #ffffff;
  --axia-accent-hover: #1a46a8;
  --axia-accent-hover-contrast: #ffffff;
  --axia-accent-foreground: #ffffff;
  --axia-ambient-accent-foreground: #ffffff;
  --axia-surface-accent-foreground: #ffffff;
  --axia-accent-dark-outline: transparent;
  --axia-accent-dark-control-border: var(--axia-accent);
  --axia-secondary-foreground: #f2f2f2;
  --axia-context-secondary-foreground: var(--axia-secondary-foreground);

  --axia-text: #f9fafb;
  --axia-text-body: #d1d5db;
  --axia-text-muted: #9ca3af;
  --axia-link: #8ab4f8;

  --axia-bg: #151515;
  --axia-surface: #151515;
  --axia-surface-elevated: #1f1f1f;

  --axia-border: #4a4a4a;
  --axia-focus: var(--axia-focus-ring-dark);
  --axia-focus-outer: var(--axia-focus-ring-light);

  --axia-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);
}