/* Shared tokens for every page of nimishux.net. All sizes are rem (1rem = 16px by default).
   Pages link tokens.css first, then base.css, then their own file.
   Rules: Geist only. Three font sizes only (heading, body, subbody). Hierarchy comes from weight and color. */

:root {
  /* Color: two text colors, one background, one rare accent */
  --bg: #f1f1f1;
  --surface: #ffffff;
  --primary: #333333;
  --secondary: #656565;
  --line: rgba(101, 101, 101, 0.4);
  --accent: #2c7341;               /* 5.1 to 1 on --bg, passes WCAG AA for text */
  --accent-hover: #1e5230;         /* 8.1 to 1 */

  /* Type: Geist only, three sizes */
  --font: "Geist", system-ui, sans-serif;
  --w-regular: 400;
  --w-semibold: 600;
  --w-black: 900;                  /* the NG. logo only */
  --fs-heading: 1.75rem;           /* 28px: headings, big numbers */
  --fs-body: 1.125rem;             /* 18px: body and key lines */
  --fs-sub: 0.875rem;              /* 14px: labels, nav, meta, notes, buttons, citations */
  --lh-heading: 2.1875rem;         /* 35px */
  --lh-body: 1.6875rem;            /* 27px */
  --lh-sub: 1.3125rem;             /* 21px */
  --measure: 40rem;                /* keeps lines under 75 characters */

  /* Space: multiples of 0.25rem */
  --s-1: 0.25rem; --s-2: 0.5rem;  --s-3: 0.75rem; --s-4: 1rem;
  --s-6: 1.5rem;  --s-8: 2rem;    --s-10: 2.5rem; --s-12: 3rem;
  --s-20: 5rem;   --s-24: 6rem;   --s-36: 9rem;
  --pad-x: 6.125rem;               /* page side padding: 98px desktop, 40px tablet, 20px phone */
  --max: 90rem;                    /* 1440px */

  /* Shape and depth */
  --radius: 0.25rem;
  --shadow: 0 0.125rem 0.75rem 0 rgba(0, 0, 0, 0.06);

  /* Motion */
  --ease-out: cubic-bezier(0.4, 0, 0.2, 1);
  --ease-link: cubic-bezier(0.44, 0, 0.56, 1);
}

/* Breakpoints, same as Framer: Desktop 1440 and up, Tablet 810 to 1439, Phone under 810.
   Custom properties cannot sit inside a media query, so reuse these two lines:
   @media (max-width: 89.99rem) { }   @media (max-width: 50.56rem) { } */
@media (max-width: 89.99rem) { :root { --pad-x: 2.5rem; } }
@media (max-width: 50.56rem) { :root { --pad-x: 1.25rem; } }