/* HEYDAY — Warm Minimal (Aesop-leaning). Earthy neutrals, flat surfaces, near-square corners, one grotesk. Font (Golos Text) loads via in each page . */ :root { /* ─── Colours — warm oat paper + espresso ink ── */ --color-bg: #F1ECE3; /* warm oat paper */ --color-surface: #E9E2D5; /* deeper sand (recessed sections) */ --color-surface-2: #E2DAC9; /* deepest (footer) */ --color-surface-3: #F6F3EC; /* lightest warm (alt sections) */ --color-text: #2B2722; /* warm espresso near-black — 12.6:1 on bg */ --color-text-secondary: #665D52; /* warm taupe — AA on every surface (≥4.6:1) */ --color-text-tertiary: #675E4E; /* deep taupe — AA incl. footer (≥4.6:1); hierarchy via casing/size */ --color-border: rgba(43, 39, 34, 0.15); --color-border-light: rgba(43, 39, 34, 0.08); --color-divider: rgba(43, 39, 34, 0.11); /* ─── Single accent — deep clay/terracotta (AA as text & as fill) ─ */ --color-accent: #875B3E; /* 4.96:1 on bg as text; cream-on-clay 5.27:1 */ --color-accent-hover: #6F4932; --color-accent-soft: #B5896B; --color-accent-light: rgba(135, 91, 62, 0.10); --color-accent-mid: rgba(135, 91, 62, 0.26); --color-accent-on: #F6F3EC; /* ─── Surfaces — barely-raised, flat ─────────── */ --surface-card: #F8F5EE; --surface-card-alt: #FBF9F4; /* ─── Shadows — fully flat (modal sets its own) ─ */ --shadow-xs: none; --shadow-sm: none; --shadow-md: none; --shadow-lg: none; --shadow-hover: none; /* ─── Typography — one warm grotesk ──────────── */ --font-sans: 'Golos Text', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, system-ui, sans-serif; --font-serif: var(--font-sans); /* grotesk-only: headings differ by size/weight, not family */ --font-family: var(--font-sans); --font-size-xs: 0.75rem; /* 12 */ --font-size-sm: 0.875rem; /* 14 */ --font-size-base: 1rem; /* 16 */ --font-size-lg: 1.0625rem; /* 17 */ --font-size-xl: 1.125rem; /* 18 */ --font-size-2xl: 1.375rem; /* 22 */ --font-size-3xl: 1.75rem; /* 28 */ --font-size-4xl: 2.25rem; /* 36 */ --font-size-5xl: 3rem; /* 48 */ --fs-h1: clamp(1.75rem, 3.4vw, 2.625rem); /* 28–42 */ --fs-h2: clamp(1.75rem, 3.4vw, 2.5rem); /* 28–40 */ --fs-h3: clamp(1.125rem, 1.4vw, 1.3125rem);/* 18–21 */ --fs-hero: clamp(2rem, 4.4vw, 3.25rem); /* 32–52 */ --lh-tight: 1.16; --lh-snug: 1.32; --lh-base: 1.62; --lh-loose: 1.74; /* ─── Spacing ────────────────────────────────── */ --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px; --space-5: 20px; --space-6: 24px; --space-8: 28px; --space-10: 36px; --space-12: 44px; --space-16: 56px; --space-20: 72px; --space-24: 92px; --space-32: 124px; /* ─── Border radius — near-square ────────────── */ --radius-sm: 0; --radius-md: 0; /* buttons, fields */ --radius-lg: 0; --radius-xl: 0; /* cards */ --radius-2xl: 0; --radius-full: 9999px; /* genuine circles only (dots, scroll-top) */ /* ─── Transitions ────────────────────────────── */ --transition-fast: 160ms cubic-bezier(0.4, 0, 0.2, 1); --transition-base: 240ms cubic-bezier(0.4, 0, 0.2, 1); --transition-slow: 400ms cubic-bezier(0.4, 0, 0.2, 1); /* ─── Layout ─────────────────────────────────── */ --container-max: 1240px; --container-padding: clamp(20px, 3vw, 48px); --header-height: 72px; --header-h: 72px; /* ─── Legacy aliases (compat with old hooks) ─── */ --color-text-1: var(--color-text); --color-text-2: var(--color-text-secondary); --color-text-3: var(--color-text-tertiary); --glass-bg: var(--surface-card); --glass-bg-hover: var(--surface-card); --glass-border: var(--color-border); --glass-border-inner: transparent; --glass-blur: none; --glass-blur-light: none; --glass-shadow: none; --glass-shadow-hover: none; }