/* Collarcraft — design tokens. Generated by Hallmark. Do not hand-edit colour/font values inline elsewhere; reference these. */

/* LINE Seed Sans — official release from seed.line.me, self-hosted (not a
   third-party CDN). SIL OFL 1.1, free for commercial use. Designed for both
   text and display, used here as the page's single font family. */
@font-face {
  font-family: "LINE Seed Sans";
  src: url("fonts/LINESeedSans-Regular.woff2") format("woff2"),
       url("fonts/LINESeedSans-Regular.woff") format("woff");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "LINE Seed Sans";
  src: url("fonts/LINESeedSans-Bold.woff2") format("woff2"),
       url("fonts/LINESeedSans-Bold.woff") format("woff");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

/* Moderniz — self-hosted, free for commercial use (see fonts/README.txt).
   Only one real weight (400) is available — headings are set at 400, not
   700, and font-synthesis is disabled, so the browser never fakes a bold
   cut of a face that doesn't have one. */
@font-face {
  font-family: "Moderniz";
  src: url("fonts/Moderniz.woff2") format("woff2"),
       url("fonts/Moderniz.woff") format("woff");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

:root {
  /* ---- Colour — custom palette, anchor: brand grey #808080 + black, neutral (no chromatic accent) ---- */
  --color-paper:      oklch(98% 0.004 240);
  --color-paper-2:    oklch(95% 0.005 240);
  --color-paper-3:    oklch(91% 0.006 240);

  --color-ink:        oklch(15% 0.006 240);
  --color-ink-2:      oklch(34% 0.006 240);

  --color-rule:       oklch(78% 0.005 240);
  --color-rule-2:     oklch(87% 0.005 240);

  --color-muted:      oklch(42% 0.006 240);
  --color-brand:      oklch(60% 0.006 240); /* ≈ #808080 — the brand grey */
  --color-brand-ink:  var(--color-ink);      /* text on brand-grey fill */
  --color-paper-dim:  oklch(82% 0.006 240); /* muted paper-toned text on inverted (ink) sections */
  --color-focus:      oklch(58% 0.02 240); /* passes 3:1 against both paper and ink surfaces */

  /* ---- Typography ---- */
  /* Two families: Moderniz for every heading (h1/h2/h3 — hero, section
     titles, card titles), LINE Seed Sans for body copy and the wordmark. */
  --font-display: "Moderniz", "LINE Seed Sans", ui-sans-serif, system-ui, sans-serif;
  --font-body:    "LINE Seed Sans", ui-sans-serif, system-ui, sans-serif;
  --font-mono:    "LINE Seed Sans", ui-sans-serif, system-ui, sans-serif;

  --text-xs:   0.7rem;
  --text-sm:   0.85rem;
  --text-base: 1rem;
  --text-md:   1.2rem;
  --text-lg:   1.25rem;   /* card titles — a modest step above body */
  --text-xl:   1.95rem;
  --text-2xl:  2.6rem;
  --text-3xl:  3.4rem;
  --text-display:   clamp(2.75rem, 5vw + 1rem, 5.25rem);
  --text-display-s: clamp(1.5rem, 1.4vw + 1rem, 1.875rem); /* section titles */
  --text-hero:      clamp(2.625rem, 3.6vw + 1.5rem, 3.375rem); /* hero — 50% bigger, still the largest on the page */

  /* ---- Spacing — 4pt scale ---- */
  --space-3xs: 0.125rem;
  --space-2xs: 0.25rem;
  --space-xs:  0.5rem;
  --space-sm:  0.75rem;
  --space-md:  1rem;
  --space-lg:  1.5rem;
  --space-xl:  2.5rem;
  --space-2xl: 4rem;
  --space-3xl: 6rem;
  --space-4xl: 9rem;

  --page-gutter: clamp(1rem, 4vw, 3rem);

  /* ---- Rules / borders ---- */
  --rule-hair: 1px;
  --rule-thick: 3px;
  --rule-heavy: 5px;

  /* ---- Motion — 0.75x scale (industrial: fast, decisive, no spring) ---- */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in:  cubic-bezier(0.7, 0, 0.84, 0);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);

  --dur-micro: 90ms;
  --dur-short: 165ms;
  --dur-long:  315ms;

  /* ---- Z-index scale ---- */
  --z-base:     1;
  --z-raised:   10;
  --z-dropdown: 100;
  --z-sticky:   200;
  --z-modal:    400;
  --z-toast:    500;
  --z-tooltip:  600;
}