/* Seidlin Inspections — design tokens Direction: "Blueprint Coastal" — warm paper surface, surveyor's ink, blueprint blue linework, safety-amber CTAs. Technical + trustworthy. */ :root { color-scheme: light; /* Color */ --color-paper: oklch(97.6% 0.009 85); --color-paper-deep: oklch(94.8% 0.012 85); --color-ink: oklch(24% 0.028 255); --color-ink-soft: oklch(42% 0.02 255); --color-blueprint: oklch(46% 0.085 245); --color-blueprint-soft: oklch(46% 0.085 245 / 0.14); --color-blueprint-line: oklch(46% 0.085 245 / 0.10); --color-amber: oklch(74% 0.145 70); --color-amber-hover: oklch(68% 0.155 65); --color-amber-ink: oklch(28% 0.06 70); --color-pass: oklch(58% 0.12 155); --color-card: oklch(99% 0.004 85); /* Semantic safety/error red — hue 25. The Safety severity tier. Single source of truth for the load-bearing red (report/agents/print + design system). */ --color-danger: oklch(55% 0.16 25); --color-danger-soft: oklch(55% 0.16 25 / 0.12); --sev-safety: var(--color-danger); /* Type */ --font-display: "Fraunces", "Iowan Old Style", Georgia, serif; --font-body: "Archivo", "Avenir Next", "Helvetica Neue", sans-serif; --font-mono: ui-monospace, "SF Mono", "Cascadia Mono", monospace; --text-base: clamp(1rem, 0.94rem + 0.3vw, 1.125rem); --text-sm: 0.875rem; --text-xs: 0.75rem; --text-lead: clamp(1.125rem, 1rem + 0.6vw, 1.375rem); --text-h2: clamp(1.9rem, 1.3rem + 2.6vw, 3.25rem); --text-h3: clamp(1.2rem, 1.05rem + 0.7vw, 1.55rem); --text-hero: clamp(2.6rem, 1.2rem + 6.2vw, 6.25rem); --text-price: clamp(2.2rem, 1.8rem + 1.8vw, 3.4rem); /* Space & rhythm */ --space-section: clamp(4.5rem, 3rem + 6vw, 9.5rem); --space-gutter: clamp(1.25rem, 4vw, 4rem); --measure: 62ch; --radius: 4px; --radius-lg: 10px; /* Motion */ --duration-fast: 160ms; --duration-normal: 320ms; --ease-out-expo: cubic-bezier(0.16, 1, 0.3, 1); /* Depth */ --shadow-card: 0 1px 2px oklch(24% 0.028 255 / 0.06), 0 8px 28px oklch(24% 0.028 255 / 0.08); --shadow-pop: 0 2px 6px oklch(24% 0.028 255 / 0.10), 0 18px 48px oklch(24% 0.028 255 / 0.16); } /* ============================================================ Dark theme — "Blueprint at Night" (ported from the design system). OPT-IN via [data-theme="dark"] on , NOT prefers-color-scheme: the marketing surfaces are tuned light-only, so dark never auto-flips them; a page (or the design-system toggle) opts in explicitly. Amber and pass hold their light values on dark — validated in the design-system dark contrast matrix. Blueprint lightens for the field. ============================================================ */ :root[data-theme="dark"] { color-scheme: dark; --color-paper: oklch(20.5% 0.022 258); --color-paper-deep: oklch(17% 0.022 258); --color-card: oklch(25.5% 0.024 258); --color-ink: oklch(93% 0.012 85); --color-ink-soft: oklch(74% 0.016 255); --color-blueprint: oklch(74% 0.09 240); --color-blueprint-soft: oklch(74% 0.09 240 / 0.16); --color-blueprint-line: oklch(74% 0.09 240 / 0.12); --color-danger: oklch(72% 0.15 25); --color-danger-soft: oklch(72% 0.15 25 / 0.16); --shadow-card: 0 1px 2px oklch(0% 0 0 / 0.4), 0 8px 28px oklch(0% 0 0 / 0.45); --shadow-pop: 0 2px 8px oklch(0% 0 0 / 0.5), 0 18px 48px oklch(0% 0 0 / 0.55); }