:root {
  /* Colors: edit these freely with hex values. There is no pure white/black by default. */
  --color-background: #ffffff;
  --color-text: #151515;
  --color-accent: #d85f2a;

  /* Fonts: put font files in /assets/fonts and update @font-face in typography.css. */
  --font-ui: "Standard", Arial, Helvetica, sans-serif;
  --font-heading: "Authentic Sans", "Standard", Arial, Helvetica, sans-serif;

  /* Desktop frame: tuned to the Figma reference frame. */
  --sidebar-width: clamp(360px, 33.65vw, 620px);
  --frame-top: 28px;
  --frame-right: 28px;
  --frame-bottom: 26px;
  --frame-left: 28px;
  --content-gutter: 28px;
  --column-gap: clamp(34px, 3.25vw, 58px);

  /* Text scale: one deliberate editorial scale. */
  --text-size-ui: clamp(17px, 1.15vw, 24px);
  --text-size-meta: clamp(9px, 0.72vw, 12px);
  --line-height-ui: 1.08;
  --line-height-meta: 1.1;

  /* Media defaults. Individual blocks can override these in their page/project file. */
  --media-default-width: 32vw;
  --media-default-gap: 160px;
  --media-start: 32vh;

  /* Motion. */
  --transition-fast: 180ms;
  --transition-medium: 420ms;
  --letter-rotation-duration: 1400ms;

  /* Mobile. */
  --mobile-breakpoint: 760px;
  --mobile-padding: 18px;
}
