/* ═══════════════════════════════════════════════════════════ */ /* globals.css – Single Source of Truth (CSS Custom Props) */ /* Generated by website-prototype-generator */ /* DO NOT add layout or component styles here. */ /* ═══════════════════════════════════════════════════════════ */ :root { /* ── Colors ──────────────────────────────────────── */ --color-primary: #2563eb; --color-secondary: #64748b; --color-accent: #f59e0b; --color-neutral: #f3f4f6; --color-background: #ffffff; --color-foreground: #0f172a; --color-muted: #e5e7eb; --color-muted-foreground: #374151; --color-border: #d1d5db; --color-success: #4ade80; --color-warning: #fbbf24; --color-error: #ef4444; /* ── Typography – Families ────────────────────────── */ --font-heading: 'Inter', sans-serif; --font-body: 'Inter', sans-serif; --font-heading-weight: 700; --font-body-weight: 400; /* ── Typography – Scale ───────────────────────────── */ --text-xs: 0.75rem; --text-xs-line-height: 1rem; --text-xs-letter-spacing: 0; --text-sm: 0.875rem; --text-sm-line-height: 1.25rem; --text-sm-letter-spacing: 0; --text-base: 1rem; --text-base-line-height: 1.5rem; --text-base-letter-spacing: 0; --text-lg: 1.125rem; --text-lg-line-height: 1.75rem; --text-lg-letter-spacing: 0; --text-xl: 1.5rem; --text-xl-line-height: 2rem; --text-xl-letter-spacing: -0.01em; --text-2xl: 1.75rem; --text-2xl-line-height: 2.25rem; --text-2xl-letter-spacing: -0.015em; --text-3xl: 2rem; --text-3xl-line-height: 2.5rem; --text-3xl-letter-spacing: -0.02em; --text-4xl: 2.5rem; --text-4xl-line-height: 2.75rem; --text-4xl-letter-spacing: -0.025em; --text-5xl: 3rem; --text-5xl-line-height: 1.1; --text-5xl-letter-spacing: -0.03em; --text-6xl: 3.75rem; --text-6xl-line-height: 1.1; --text-6xl-letter-spacing: -0.03em; /* ── Spacing ─────────────────────────────────────── */ --spacing-xs: 0.25rem; --spacing-sm: 0.5rem; --spacing-md: 1rem; --spacing-lg: 1.5rem; --spacing-xl: 2rem; --spacing-2xl: 3rem; --spacing-3xl: 4rem; --spacing-4xl: 6rem; --spacing-5xl: 8rem; --spacing-6xl: 10rem; --spacing-section: 5rem; --spacing-container: 1200px; --spacing-container-padding: 1.5rem; /* ── Border Radius ───────────────────────────────── */ --radius-none: 0; --radius-sm: 0.25rem; --radius-md: 0.5rem; --radius-lg: 0.75rem; --radius-xl: 1rem; --radius-full: 9999px; /* ── Shadows ─────────────────────────────────────── */ --shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.1); --shadow-md: 0 4px 8px -1px rgb(0 0 0 / 0.15), 0 2px 4px -2px rgb(0 0 0 / 0.1); --shadow-lg: 0 10px 20px -3px rgb(0 0 0 / 0.15), 0 4px 8px -4px rgb(0 0 0 / 0.1); --shadow-xl: 0 20px 30px -5px rgb(0 0 0 / 0.2), 0 8px 10px -6px rgb(0 0 0 / 0.15); /* ── Breakpoints (reference) ─────────────────────── */ --breakpoint-sm: 640px; --breakpoint-md: 768px; --breakpoint-lg: 1024px; --breakpoint-xl: 1280px; --breakpoint-2xl: 1536px; }