/* Base Colors */
:root {
  --bg-body-page: #f7f7f7;
  --bg-navbar: #e9e9e9;
  --pink: #d04278;
  --blue: #0088cc;
  --white: #ffffff;
  --black: #000000;
  --dark-gray: #3f3f3f;
}

/* Font Weights */
:root {
  --font-light: 300;
  --font-regular: 400;
  --font-medium: 500;
  --font-semibold: 600;
  --font-bold: 700;
  --font-extrabold: 800;
  --font-black: 900;
}

/* Global Styles */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  font-family: var(--font-family-primary);
  background-color: var(--bg-body-page);
}
/* Prevent double-tap zoom on mobile for better UX */
button,
a,
input,
select,
[role="button"],
[onclick] {
  touch-action: manipulation;
}
/* Jost font faces (variable + italic) */
@font-face {
  font-family: "Jost";
  src: url("../fonts/JOST/Jost-VariableFont_wght.ttf") format("truetype");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Jost";
  src: url("../fonts/JOST/Jost-Italic-VariableFont_wght.ttf") format("truetype");
  font-weight: 100 900;
  font-style: italic;
  font-display: swap;
}

/* Optional: register a couple of static files for older browsers (fallback) */
@font-face {
  font-family: "Jost";
  src: url("../fonts/JOST/Jost-Light.ttf") format("truetype");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Jost";
  src: url("../fonts/JOST/Jost-ExtraLight.ttf") format("truetype");
  font-weight: 200;
  font-style: normal;
  font-display: swap;
}

/* Font family variable to use site-wide */
:root {
  --font-family-primary: "Jost", system-ui, -apple-system, "Segoe UI", Roboto,
    "Helvetica Neue", Arial, sans-serif;
}