/* ============================================================
   Tiempo — base
   Font face, reset, document defaults. Loaded on every page
   directly after tokens.css.

   The @font-face lived in all 21 pages with three different src
   paths ('/F37...', 'F37...', '../F37...'). It is declared once
   here, root-absolute, so the rule is immune to where this sheet
   sits. Note the matching <link rel="preload"> in each page's head
   resolves against the DOCUMENT, not this file, so those must be
   root-absolute too or the preload misses and the font is fetched
   twice.
   ============================================================ */

@font-face {
  font-family: 'F37 Bobby';
  src: url('/F37 Bobby Light.otf') format('opentype');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

* { box-sizing: border-box; margin: 0; padding: 0; }

html {
  background-color: var(--media);
}

body {
  font-family: var(--font-body);
  font-size: var(--fs-body);
  line-height: var(--lh-prose);
  color: var(--grey-500);
  background-color: var(--cream-500);
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-display);
  font-weight: var(--fw-light);
  letter-spacing: var(--ls-tight);
  color: var(--clockwork);
}

a { color: var(--clockwork); }
a:focus-visible { outline: 2px solid var(--honey); outline-offset: 3px; border-radius: 2px; }

/* Inline link sitting on a painted band. Clockwork is invisible on a clockwork
   ground and reads at 2.6:1 on media, so a link on dark opts in here: crema,
   plus the underline it already inherits, and nothing else. It lives beside the
   rule it corrects rather than in components.css, which about.html and
   work-with-us.html do not load. */
a.link-on-band { color: var(--crema); text-decoration: underline; }
a.link-on-band:hover { color: var(--crema); text-decoration-thickness: 2px; }

img, video { max-width: 100%; height: auto; display: block; }

/* The nav logo SVG carried an inline <style>.t-cls{fill:var(--crema)}</style>
   inside every one of the 21 pages. Same rule, declared once. */
.t-cls { fill: var(--crema); }
