/* RENDR Studio: what every page shares, and nothing else: the Inter font, the colours, and a plain base. Inter is self-hosted (SIL OFL 1.1); see fonts/README.md.
   Pages the site writes link ONLY this file. The home page's layout is in styles.css; a written page must never load it, because the two share class names
   (.clip, .brand, ...) and the home page's rules for them (the reel: absolute, centred, full height) would grab the written page's own elements. */
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url("/fonts/inter-latin-300-normal.woff2") format("woff2");
}
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/fonts/inter-latin-500-normal.woff2") format("woff2");
}
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/fonts/inter-latin-700-normal.woff2") format("woff2");
}

/* Phone first, and only phone: wider screens get the same column, centred. */
:root {
  color-scheme: dark;
  --bg: #08080a;
  --text: #f3efe8;
  --muted: #b9b4ab;
  --accent: #ff5a36;
  --rule: rgba(243, 239, 232, 0.28);
  --column: 30rem;
  --sans: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  background: var(--bg);
  -webkit-text-size-adjust: 100%;
}

body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: var(--sans);
  font-weight: 300;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}