/* =============================================
   VISIMOB DESIGN SYSTEM — Colors & Typography
   (vendored from the Visimob Design System; font paths point to Flask static)
   ============================================= */

@font-face { font-family: 'VisbyCF'; src: url('/static/fonts/VisbyCF-Thin.otf'); font-weight: 100; font-style: normal; }
@font-face { font-family: 'VisbyCF'; src: url('/static/fonts/VisbyCF-ThinOblique.otf'); font-weight: 100; font-style: italic; }
@font-face { font-family: 'VisbyCF'; src: url('/static/fonts/VisbyCF-Light.otf'); font-weight: 300; font-style: normal; }
@font-face { font-family: 'VisbyCF'; src: url('/static/fonts/VisbyCF-LightOblique.otf'); font-weight: 300; font-style: italic; }
@font-face { font-family: 'VisbyCF'; src: url('/static/fonts/VisbyCF-Regular.otf'); font-weight: 400; font-style: normal; }
@font-face { font-family: 'VisbyCF'; src: url('/static/fonts/VisbyCF-RegularOblique.otf'); font-weight: 400; font-style: italic; }
@font-face { font-family: 'VisbyCF'; src: url('/static/fonts/VisbyCF-Medium.otf'); font-weight: 500; font-style: normal; }
@font-face { font-family: 'VisbyCF'; src: url('/static/fonts/VisbyCF-MediumOblique.otf'); font-weight: 500; font-style: italic; }
@font-face { font-family: 'VisbyCF'; src: url('/static/fonts/VisbyCF-DemiBold.otf'); font-weight: 600; font-style: normal; }
@font-face { font-family: 'VisbyCF'; src: url('/static/fonts/VisbyCF-DemiBoldOblique.otf'); font-weight: 600; font-style: italic; }
@font-face { font-family: 'VisbyCF'; src: url('/static/fonts/VisbyCF-Bold.otf'); font-weight: 700; font-style: normal; }
@font-face { font-family: 'VisbyCF'; src: url('/static/fonts/VisbyCF-BoldOblique.otf'); font-weight: 700; font-style: italic; }
@font-face { font-family: 'VisbyCF'; src: url('/static/fonts/VisbyCF-ExtraBold.otf'); font-weight: 800; font-style: normal; }
@font-face { font-family: 'VisbyCF'; src: url('/static/fonts/VisbyCF-ExtraBoldOblique.otf'); font-weight: 800; font-style: italic; }
@font-face { font-family: 'VisbyCF'; src: url('/static/fonts/VisbyCF-Heavy.otf'); font-weight: 900; font-style: normal; }
@font-face { font-family: 'VisbyCF'; src: url('/static/fonts/VisbyCF-HeavyOblique.otf'); font-weight: 900; font-style: italic; }

:root {
  --color-red:          #E8192C;
  --color-red-dark:     #C41020;
  --color-red-light:    #FF3B4E;
  --color-red-subtle:   rgba(232, 25, 44, 0.12);

  --color-ink:          #181414;
  --color-ink-medium:   #2C2626;
  --color-ink-muted:    #5A5050;

  --color-white:        #FFFFFF;
  --color-off-white:    #F8F5F5;
  --color-surface:      #F2EDED;
  --color-border:       #E5DEDE;

  --color-green:        #22C55E;
  --color-yellow:       #F59E0B;

  --fg1: var(--color-ink);
  --fg2: var(--color-ink-medium);
  --fg3: var(--color-ink-muted);

  --font-brand: 'VisbyCF', sans-serif;
  --font-body:  'VisbyCF', sans-serif;

  --text-xs:12px; --text-sm:14px; --text-base:16px; --text-md:18px; --text-lg:22px;
  --text-xl:28px; --text-2xl:36px; --text-3xl:48px; --text-4xl:64px; --text-5xl:80px;

  --weight-thin:100; --weight-light:300; --weight-regular:400; --weight-medium:500;
  --weight-demibold:600; --weight-bold:700; --weight-extrabold:800; --weight-heavy:900;

  --leading-tight:1.1; --leading-snug:1.25; --leading-normal:1.5; --leading-loose:1.75;

  --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px; --space-5:20px; --space-6:24px;
  --space-8:32px; --space-10:40px; --space-12:48px; --space-16:64px; --space-20:80px; --space-24:96px;

  --radius-sm:4px; --radius-md:8px; --radius-lg:16px; --radius-xl:24px; --radius-full:9999px;

  --shadow-sm:0 1px 3px rgba(24,20,20,0.12);
  --shadow-md:0 4px 16px rgba(24,20,20,0.14);
  --shadow-lg:0 12px 40px rgba(24,20,20,0.18);
  --shadow-brand:0 8px 32px rgba(232,25,44,0.28);
}