@font-face {
  font-family: "Poppins";
  src: url("/assets/fonts/poppins-regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Poppins";
  src: url("/assets/fonts/poppins-bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Lato";
  src: url("/assets/fonts/lato-regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Lato";
  src: url("/assets/fonts/lato-bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

:root {
  --ink-950: #071627;
  --ink-900: #0a2e4b;
  --ink-800: #123c5f;
  --ink-700: #1d4e78;
  --ink-600: #2c6a9d;

  --cloud-50: #f6fbff;
  --cloud-100: #eaf3ff;
  --cloud-200: #d9e9ff;

  --gold-100: #fff4c2;
  --gold-300: #ffd37a;
  --gold-500: #f6b947;

  --sky-100: #d8f0ff;
  --sky-300: #93ccff;
  --sky-500: #5aa2ff;

  --surface-0: rgba(255, 255, 255, 0.94);
  --surface-1: rgba(240, 247, 255, 0.94);
  --surface-2: rgba(255, 248, 230, 0.92);

  --accent: var(--gold-500);
  --accent-soft: var(--gold-100);

  --text-primary: #081628;
  --text-secondary: rgba(8, 22, 40, 0.75);
  --text-muted: rgba(8, 22, 40, 0.6);

  --border-soft: rgba(10, 46, 75, 0.12);
  --border-strong: rgba(10, 46, 75, 0.22);

  --radius-lg: 28px;
  --radius-md: 16px;
  --radius-pill: 999px;

  --shadow-soft: 0 20px 48px rgba(10, 46, 75, 0.12);
  --shadow-card: 0 12px 28px rgba(10, 46, 75, 0.16);

  --space-xs: clamp(0.5rem, 1vw, 0.75rem);
  --space-sm: clamp(0.75rem, 1.5vw, 1rem);
  --space-md: clamp(1rem, 2vw, 1.5rem);
  --space-lg: clamp(1.5rem, 3vw, 2.25rem);
  --space-xl: clamp(2rem, 4vw, 3rem);
  --space-2xl: clamp(2.5rem, 5vw, 4rem);
  --space-section: clamp(3rem, 7vw, 5rem);

  --font-display: "Poppins", "Lato", system-ui, sans-serif;
  --font-body: "Lato", system-ui, sans-serif;
}