/* Weft design tokens: the one source for the public site and Workshop.
   Every name carries the weft- prefix so it never collides with Workshop's
   older custom properties (--ink, --paper, --line …) while those exist.
   marketing.css maps its short names onto these; Workshop's Tailwind theme
   exposes them as utilities (bg-weft-bg, font-weft-display, rounded-weft-2 …).
   docs/knowledge/design-tokens.md describes them. */

@font-face{font-family:"Newsreader";src:url("/assets/marketing/newsreader-latin-opsz-4b499f36.woff2") format("woff2");font-weight:200 800;font-style:normal;font-display:swap}
@font-face{font-family:"Onest";src:url("/assets/marketing/onest-latin-wght-3d436d4d.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:swap}

:root{
  /* colour, dark: the default ground; the app's dark screens and the photos sit in it */
  --weft-bg:#0a0b0c;--weft-surface:#121416;--weft-surface-2:#181b1d;
  --weft-line:rgba(255,255,255,.09);--weft-line-2:rgba(255,255,255,.16);
  --weft-text:#f3f0e9;--weft-text-2:#b6bab9;--weft-text-3:#80878a;
  --weft-hover:rgba(255,255,255,.06);--weft-hover-line:rgba(255,255,255,.32);

  /* colour, dark band: product moments and the footer, a step lighter than the ground */
  --weft-band-bg:#0b0c0d;--weft-band-surface:#141618;--weft-band-surface-2:#1a1d1f;--weft-band-text-3:#8a9193;

  /* colour, light: paper sections with ink text */
  --weft-paper:#f1eee6;--weft-paper-2:#faf8f2;--weft-paper-line:#d9d4c9;
  --weft-ink:#121416;--weft-ink-2:#4c5351;--weft-ink-3:#757c7a;

  /* colour, voice and state: orange carries the voice */
  --weft-accent:#ef6c35;--weft-accent-tint:rgba(239,108,53,.10);--weft-on-accent:#fff;
  --weft-good:#57d38c;--weft-warn:#e8b04b;

  /* type: a serif display face for headlines, a sans for everything else */
  --weft-font-display:"Newsreader",Georgia,"Times New Roman",serif;
  --weft-font-sans:"Onest",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  --weft-text-d1:clamp(46px,5.8vw,86px);
  --weft-text-d2:clamp(40px,4.6vw,68px);
  --weft-text-d3:clamp(28px,2.8vw,40px);
  --weft-text-lead:clamp(18px,1.5vw,21px);
  --weft-text-body:17px;--weft-text-small:15px;--weft-text-label:12px;
  --weft-weight-display:400;--weft-weight-body:400;--weft-weight-strong:600;--weft-weight-label:700;
  --weft-leading-display:1.02;--weft-leading-lead:1.5;--weft-leading-body:1.6;
  --weft-tracking-display:-.02em;--weft-tracking-d1:-.03em;--weft-tracking-d2:-.025em;--weft-tracking-label:.16em;

  /* space */
  --weft-space-1:4px;--weft-space-2:8px;--weft-space-3:12px;--weft-space-4:16px;--weft-space-5:24px;
  --weft-space-6:32px;--weft-space-7:48px;--weft-space-8:64px;--weft-space-9:96px;
  --weft-section:clamp(96px,11vw,152px);
  --weft-gutter:clamp(32px,5vw,72px);
  --weft-max:1200px;

  /* shape */
  --weft-radius-1:12px;--weft-radius-2:20px;--weft-radius-3:28px;--weft-radius-pill:999px;
  --weft-shadow:0 40px 90px rgba(0,0,0,.4);

  /* motion */
  --weft-ease:cubic-bezier(.2,.7,.2,1);
  --weft-duration:.2s;
}