/* tokens.css - M.Thorne Carpentry. Every colour comes from the mark as sent (assets-real/brand/logo-source.svg has two
   fills, measured in _research/logo-measure.json): espresso rgb(33,27,22) and oak bronze rgb(133,87,34). The mark has
   no ground of its own, so it sits on white paper; the tints and shades below are those two mixed with white or black.
   Contrast (WCAG): ink on paper 17.0 · ink-2 on paper 7.7 · bronze on paper 6.2 · white on bronze 6.2 ·
   bronze-lt on espresso 7.0 · on-dark-2 on espresso 9.2 · paper-2 on bronze 5.1 · ink-2 on ash 6.8. */

/* Bitter + Chivo (library type fp.26), SIL OFL 1.1 - licences in /fonts/licences.txt */
@font-face { font-family: "Bitter"; font-style: normal; font-weight: 100 900; font-display: swap; src: url(/fonts/Bitter-latin.woff2) format("woff2"); }
@font-face { font-family: "Chivo"; font-style: normal; font-weight: 100 900; font-display: swap; src: url(/fonts/Chivo-latin.woff2) format("woff2"); }
@font-face { font-family: "Bitter Fallback"; src: local("Georgia"); size-adjust: 110.05%; ascent-override: 84.96%; descent-override: 24.08%; line-gap-override: 0%; }
@font-face { font-family: "Chivo Fallback"; src: local("Arial"); size-adjust: 109.69%; ascent-override: 85.69%; descent-override: 22.79%; line-gap-override: 0%; }

:root {
  --esp: #211B16;        /* the mark's dark slab: dark bands, ink */
  --esp-2: #2C241D;      /* a raised surface on espresso */
  --esp-3: #4A3E33;      /* rules and outlines on espresso */
  --bronze: #855722;     /* the mark's oak slab: the one accent */
  --bronze-dk: #6E4718;  /* bronze pressed */
  --bronze-lt: #D39B5B;  /* bronze lifted to read on espresso */
  --paper: #FFFFFF;      /* the mark's own ground */
  --paper-2: #F3E7D8;    /* soft text on bronze */
  --ash: #F4F0EB;        /* white with a breath of bronze */
  --line: #E6DDD3;       /* rules on paper */
  --line-2: #CDBFB1;
  --ink: #211B16;
  --ink-2: #5E5146;
  --on-dark-2: #C9BCAE;
  --scrim: 20 15 11;     /* espresso, darkened, for photo scrims */

  --font-display: "Bitter", "Bitter Fallback", Georgia, serif;
  --font-text: "Chivo", "Chivo Fallback", Arial, sans-serif;

  --hdr: 60px;
  --pad: 32px;
  --wrap: 1200px;
  --gut: 24px;
  --cut: 14px;           /* the 45-degree corner cut, the mark's angle */
  --slant: -35deg;       /* the teeth lean like the mark's slabs */
  --ease: cubic-bezier(.2, .7, .2, 1);
}
@media (min-width: 700px) { :root { --gut: 40px; --pad: 64px; } }
@media (min-width: 1100px) { :root { --hdr: 76px; --pad: 96px; --gut: max(48px, calc((100vw - var(--wrap)) / 2)); } }