/* =========================
   Tokens: type, space, color
   ========================= */

@font-face {
  font-family: "Plus Jakarta Sans";
  src: url("/assets/fonts/PlusJakartaSans-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Plus Jakarta Sans";
  src: url("/assets/fonts/PlusJakartaSans-Medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Plus Jakarta Sans";
  src: url("/assets/fonts/PlusJakartaSans-SemiBold.ttf") format("truetype");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Plus Jakarta Sans";
  src: url("/assets/fonts/PlusJakartaSans-Bold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Plus Jakarta Sans";
  src: url("/assets/fonts/PlusJakartaSans-ExtraBold.ttf") format("truetype");
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}

:root {
  /* Typography */
  --font-sans: "Plus Jakarta Sans", system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;

  /* Editorial scale (desktop-first) */
  --fs-00: 12px;
  --fs-0:  14px;
  --fs-1:  16px;
  --fs-2:  18px;
  --fs-3:  22px;
  --fs-4:  28px;
  --fs-5:  40px;
  --fs-6:  64px;
  --fs-7:  88px;

  --lh-tight: 1.03;
  --lh-snug:  1.25;
  --lh-body:  1.55;

  /* Spacing */
  --s-1:  4px;
  --s-2:  8px;
  --s-3:  12px;
  --s-4:  16px;
  --s-5:  24px;
  --s-6:  32px;
  --s-7:  48px;
  --s-8:  72px;
  --s-9:  96px;

  /* Layout */
  --container: 1240px;
  --gutter: 32px;
  --radius: 18px;

  /* Color (neutral editorial) */
  --bg: #f6f6f6;
  --panel: #ffffff;
  --text: #0b0b0b;
  --muted: rgba(11, 11, 11, 0.62);
  --faint: rgba(11, 11, 11, 0.10);
  --line: rgba(11, 11, 11, 0.14);
  --accent: #0b0b0b;
}

@media (max-width: 980px) {
  :root {
    --fs-6: 52px;
    --fs-7: 64px;
    --gutter: 18px;
    --radius: 16px;
  }
}

@media (max-width: 640px) {
  :root {
    --fs-5: 32px;
    --fs-6: 40px;
    --fs-7: 44px;
    --gutter: 16px;
  }
}