/* tokens.css - Abel Plumbing & Bathrooms. Verdigris and copper: the green stone and copper veining of his own
   showpiece rooms (P24, P02, P05), and the metal of the trade. Familjen Grotesk + Geist (library fp.09, OFL). */
@font-face {
  font-family: "Familjen Grotesk";
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url(/fonts/FamiljenGrotesk-latin.woff2) format("woff2");
}
@font-face {
  font-family: "Geist";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(/fonts/Geist-latin.woff2) format("woff2");
}
@font-face {
  font-family: "Familjen Grotesk Fallback";
  src: local("Arial");
  size-adjust: 104.26%;
  ascent-override: 98.31%;
  descent-override: 21.58%;
  line-gap-override: 0%;
}
@font-face {
  font-family: "Geist Fallback";
  src: local("Arial");
  size-adjust: 109.05%;
  ascent-override: 92.16%;
  descent-override: 27.05%;
  line-gap-override: 0%;
}

:root {
  /* grounds */
  --ground: #0f2c27;      /* deep verdigris: the page */
  --well: #15372f;        /* a lifted panel */
  --night: #0a201c;       /* header, footer, the closing ask */
  --deep: #0a201c;
  --line: rgba(238, 242, 238, .14);
  --edge: #5f7f75;        /* a control's boundary on the ground (3:1) */

  /* type colours */
  --ink: #eef2ee;         /* porcelain */
  --stone: #b4c6be;       /* second lines, captions */
  --porcelain: #eef2ee;   /* what the buyer types on */
  --ink-night: #0a201c;   /* type on copper and porcelain */
  --ink-quiet: #3d5650;   /* labels on porcelain */

  /* metals */
  --copper: #d68a5c;
  --copper-hi: #e9a678;
  --copper-lo: #8f4f2c;
  --brass: #d68a5c;       /* the contrast checker's name for the accent */
  --aqua: #10fee6;        /* his logo's aqua: the area check's yes, nothing else */
  --aqua-deep: #0bc9b6;
  --pipe: linear-gradient(90deg, #7a3f20 0%, #c87648 28%, #f3bf96 46%, #d68a5c 62%, #8f4f2c 100%);
  --grout: rgba(232, 235, 228, .92);

  /* type */
  --f-display: "Familjen Grotesk", "Familjen Grotesk Fallback", Arial, "Helvetica Neue", system-ui, sans-serif;
  --f-text: "Geist", "Geist Fallback", Arial, "Helvetica Neue", system-ui, sans-serif;
  --t-h1: clamp(1.82rem, 1.2rem + 2.6vw, 3.5rem);
  --t-h2: clamp(1.56rem, 1.12rem + 1.9vw, 2.75rem);
  --t-h3: clamp(1.08rem, 1rem + .35vw, 1.3rem);
  --t-body: clamp(.94rem, .9rem + .2vw, 1.0625rem);
  --t-small: .8125rem;

  /* space */
  --gut: clamp(20px, 4vw, 40px);
  --pad-y: clamp(40px, 7vw, 104px);
  --max: 1200px;
  --hdr: 68px;
  --r: 3px;               /* tile corners: square, barely eased */

  /* motion */
  --ease: cubic-bezier(.22, .7, .18, 1);
  --ease-lay: cubic-bezier(.3, .1, .1, 1);
}