@import url('https://fonts.googleapis.com/css2?family=Figtree:ital,wght@0,400..700;1,400..700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@700&display=swap');

@import "nx/nx.css";
@import "alpha/alpha_home.css";
@import "alpha/alpha_buttons.css";

:root {
  /*Colors*/
  --primary: #000;
  --primary-rgb: 41, 143, 210;
  --primary-hover: var(--p-primary-900);

  --secondary: var(--p-primary-500);

  --p-primary-color: #000;
  --p-primary-50: #fafafa;
  --p-primary-100: #f4f4f5;
  --p-primary-200: #e4e4e7;
  --p-primary-300: #d4d4d8;
  --p-primary-400: #a1a1aa;
  --p-primary-500: #71717a;
  --p-primary-600: #52525b;
  --p-primary-700: #3f3f46;
  --p-primary-800: #27272a;
  --p-primary-900: #18181b;
  --p-primary-950: #09090b;

  --cta: #F1A549;
  --cta-hover: #C1843A;

  --accent: var(--p-primary-200);

  --body-bg: white;
  --body-text-color: var(--text-dark);
  --body-text-font: 'Figtree';
  --body-text-size: 16px;
  --body-text-weight: 400;

  --bg-dark: #000;
  --bg-medium: #D9D9D9;
  --bg-light: var(--p-primary-100);

  --border-light: var(--p-primary-200);
  --border-medium: #CDCDCE;

  --text-dark: #000;
  --text-medium: #58595B;
  --text-light: #95989A;

  --text-header-font: 'Outfit';
  --text-header-size: clamp(30px, 2vw + 1rem, 40px);
  --text-header-weight: 700;
  --text-header-color: var(--primary);

  --text-subheader-font: 'Figtree';
  --text-subheader-size: clamp(18px, 2vw, 24px);
  --text-subheader-weight: 400;
  --text-subheader-color: var(--text-medium);

   /*  Header */
  --header-bg: white;
  --header-color: var(--text-dark);
  --header-logo-height: 32px;
  --header-mobile-nav-bg: var(--bg-light);
  --header-mobile-color: var(--text-dark);
  --header-mobile-hover-color: var(--text-inverse);

  /** Footer */
  --footer-bg: var(--bg-dark);
  --footer-text-color: var(--text-inverse);
}

html {
  scroll-behavior: smooth;
}

.mobile-nav-wrapper .separator {
  display: none;
}