/* Design tokens, taken from nullmask.io (computed styles) and its illustrations. */

@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 300; font-display: swap; src: url('../../assets/fonts/poppins-latin-300.woff2') format('woff2'); }
@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 400; font-display: swap; src: url('../../assets/fonts/poppins-latin-400.woff2') format('woff2'); }
@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 500; font-display: swap; src: url('../../assets/fonts/poppins-latin-500.woff2') format('woff2'); }
@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 600; font-display: swap; src: url('../../assets/fonts/poppins-latin-600.woff2') format('woff2'); }
@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 700; font-display: swap; src: url('../../assets/fonts/poppins-latin-700.woff2') format('woff2'); }

:root {
  /* NullMask palette */
  --nm-bg: #d9d9d9;          /* page canvas */
  --nm-bg-deep: #cfcfcf;
  --nm-paper: #e6e6e6;
  --nm-line: #cacaca;
  --nm-ink: #202221;         /* text + dark bands */
  --nm-black: #0e0f0f;       /* outlines + extrusions */
  --nm-lime: #cdef33;        /* the accent */
  --nm-lime-soft: #d0e962;
  --nm-lime-deep: #b5d42a;
  --nm-muted: #555856;
  --nm-dark: #202221;
  --nm-dark-2: #2a2c2b;
  --nm-dark-line: #454846;
  --nm-dark-muted: #a9abaa;

  /* Holder Crate tier metals, kept muted to sit inside the monochrome system */
  --tier-copper: #b8744c;
  --tier-bronze: #a5823f;
  --tier-silver: #b4bac0;
  --tier-gold: #d8b447;
  --tier-platinum: #e7eae6;

  /* Type */
  --font: 'Poppins', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --mono: ui-monospace, 'SFMono-Regular', 'Cascadia Mono', Menlo, Consolas, monospace;

  /* Shape (nullmask.io uses 4 / 6 / 10 / 15 / 20px radii) */
  --r-xs: 4px;
  --r-sm: 6px;
  --r: 10px;
  --r-lg: 15px;
  --r-xl: 20px;

  /* Layout */
  --container: 1312px;
  --gutter: clamp(16px, 4vw, 64px);
  --nav-h: 76px;
  --section-y: clamp(72px, 10vw, 136px);

  /* Motion */
  --ease: cubic-bezier(0.2, 0.7, 0.2, 1);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --t-fast: 160ms;
  --t: 320ms;
  --t-slow: 600ms;

  /* The hard black offset used by NullMask's extruded illustrations */
  --extrude: 4px 4px 0 var(--nm-black);
  --extrude-sm: 3px 3px 0 var(--nm-black);
}