/* Shared visual foundation for the PWA and public website. */
:root {
  --heykup-paper: #f4f5f6;
  --heykup-ink: #17191d;
  --heykup-muted: #646b78;
  --heykup-accent: #f05a32;
  --heykup-surface: color-mix(in srgb, var(--heykup-accent) 5%, #fff);
  --heykup-line: color-mix(in srgb, var(--heykup-accent) 14%, #e1e4e8);
  --heykup-feature: color-mix(in srgb, var(--heykup-accent) 65%, #17191d);
  --site-width: 1120px;
  --site-gutter: clamp(20px, 4vw, 48px);
  --site-section-space: clamp(56px, 7vw, 88px);
  --site-heading: clamp(34px, 4.2vw, 56px);
  --heykup-font: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  /* Public-site colour steps, all derived from the existing brand palette. */
  --site-warm: color-mix(in srgb, var(--heykup-accent) 5%, #fff);
  --site-peach: color-mix(in srgb, var(--heykup-accent) 14%, #fff);
  --site-apricot: color-mix(in srgb, var(--heykup-accent) 27%, #fff);
  --site-rust: var(--heykup-feature);
  --site-shadow: 0 24px 60px #17191d0d, 0 4px 12px #17191d05;
}