/* Shared by the application and standalone showcases. One brand, task-specific layouts. */
:root {
  --tag-brand-navy: #0b2340;
  --tag-brand-blue: #0876dd;
  --tag-brand-blue-hover: #075eaf;
  --tag-brand-ink: #3c5169;
  --tag-brand-muted: #65768b;
  --tag-brand-white: #ffffff;
  --tag-brand-canvas: #ffffff;
  --tag-brand-shell: #f4f6f9;
  --tag-brand-soft: #eef5fc;
  --tag-brand-line: #d9e3ee;
  --tag-brand-error: #b4322e;
  --tag-brand-font: "Helvetica Neue", Arial, system-ui, sans-serif;
  --tag-brand-title: clamp(2.125rem, 1.45rem + 2.8vw, 4.25rem);
  --tag-brand-display: clamp(2.75rem, 1.75rem + 3.6vw, 5rem);
  --tag-brand-section: clamp(1.75rem, 1.35rem + 1.6vw, 2.75rem);
  --tag-brand-title-weight: 650;
  --tag-brand-body-leading: 1.7;
  --tag-brand-radius-sm: 10px;
  --tag-brand-radius-control: 12px;
  --tag-brand-radius: 20px;
  --tag-brand-radius-lg: 24px;
  --tag-brand-shadow: 0 12px 36px -24px rgb(11 35 64 / 28%);
  --tag-brand-gutter: clamp(20px, 3.5vw, 64px);
  --tag-brand-space: clamp(48px, 6vw, 88px);
  --tag-brand-reading: 68ch;
}
