/* tokens.css — Waggin' Tails Grooming. Playful · Friendly · Warm. White page, sky-blue accent, deep-blue brand (recoloured 2026-09-03 at the owner's request: no green, no tan, more white). */ :root { /* Palette (2026 recolour): white page, one blue family. Sky-blue accent for the thing to press, deep blue for headings and the closing band, the palest blue for panels and pills. AA checked: ink/white 15.6:1, muted/white 5.9:1, white/accent 4.9:1, white/brand 10.9:1 */ --bg: #FFFFFF; /* the page */ --bg-alt: #F2F7FC; /* alternating sections — the faintest sky */ --bg-sky: #F2F7FC; /* legacy alias */ --surface: #FFFFFF; --ink: #14202B; --ink-muted: #5B6B7B; --line: #DCE6EF; --brand: #143F6B; /* deep blue — headings, emphasis, the closing band */ --brand-deep: #0F2F50; --on-brand: #FFFFFF; --accent: #1B75C4; /* sky blue — the Call button, paw prints, step numbers */ --accent-hover: #155E9E; --on-accent: #FFFFFF; /* Derived — the pale tint that carries panels, pills and the photo "stickers" */ --tint: #EAF3FB; --tint-deep: #D6E7F5; --tint-line: #C6DAEB; --accent-ink: #155E9E; /* accent blue for small text on white and tint (6.2:1 / 5.6:1) */ --brand-tint: rgba(27, 117, 196, 0.10); /* Type — Fredoka (display) + Nunito Sans (body), loaded in */ --font-display: "Fredoka", "Trebuchet MS", system-ui, sans-serif; --font-body: "Nunito Sans", system-ui, -apple-system, "Segoe UI", sans-serif; --fs-0: clamp(1rem, 0.95rem + 0.2vw, 1.08rem); --fs-1: clamp(1.12rem, 1rem + 0.55vw, 1.4rem); --fs-2: clamp(1.45rem, 1.2rem + 1.1vw, 2rem); --fs-3: clamp(1.9rem, 1.4rem + 2.2vw, 2.9rem); --fs-4: clamp(2.6rem, 1.7rem + 4.8vw, 4.8rem); --lh-body: 1.65; --lh-head: 1.08; --track-label: 0.09em; /* Shape & depth — soft, warm */ --radius: 16px; --radius-sm: 12px; --shadow: 0 14px 38px rgba(16, 40, 60, 0.14); --shadow-sm: 0 3px 12px rgba(16, 40, 60, 0.11); /* Space */ --space-1: 0.5rem; --space-2: 1rem; --space-3: 1.5rem; --space-4: 2.5rem; --space-5: 4rem; --section-y: clamp(3.5rem, 6vw, 6.5rem); --measure: 60ch; --container: 1140px; --gutter: clamp(1rem, 4vw, 2rem); --ease: cubic-bezier(0.2, 0.7, 0.2, 1); --dur: 220ms; }