/*
 * Design tokens (docs/02 §2). Loaded after the unmodified Bootstrap 5.3.8
 * CSS; Bootstrap is customised only by mapping its variables to these.
 *
 * APPROVED: the three brand colours (D-012).
 * D-070 (developer instruction 2026-10-08): the warm-neutral palette and
 * the Cormorant Garamond + Manrope pairing below. The logo stays open
 * (Q-016, C-02): the wordmark is set in type.
 *
 * Colour usage:
 *   - Ivory is the page ground, beige the quiet alternate ground and the
 *     mat behind artwork images, night the dark ground (hero, footer).
 *   - Ochre and terracotta are accents only: rules, active states, hover
 *     states, dots and large display text. Never body text or small links
 *     on light grounds (docs/02 §2.1); no darker accent shade is used until
 *     one is approved.
 *   - Accent-filled buttons use black text.
 *
 * Contrast (WCAG 2.x, computed):
 *   ink on ivory 15.95:1, on paper 16.93:1, on beige 14.12:1   body text
 *   umber on ivory 10.85:1, on beige 9.60:1                    secondary text
 *   taupe on ivory 5.70:1, on paper 6.04:1, on beige 5.04:1    muted text (AA)
 *   stone on ivory 2.86:1                                      decoration only, never text
 *   sand on ivory 1.39:1                                       hairlines only
 *   ochre on ivory 3.05:1                                      large text / non-text UI only
 *   ochre on beige 2.70:1, terracotta on ivory 2.80:1          decoration only
 *   black on ochre 6.23:1, black on terracotta 6.79:1          accent buttons
 *   ivory on night 17.01:1, night-soft on night 8.62:1,
 *   night-muted on night 5.13:1                                text on dark grounds
 *   ochre on night 5.58:1, terracotta on night 6.08:1          accents on dark grounds (AA)
 */

:root {
    /* Brand (approved, D-012) */
    --ru-ochre: #cc7722;
    --ru-terracotta: #e2725b;
    --ru-black: #000000;

    /* Warm neutrals (D-070), lightest to darkest */
    --ru-neutral-50: #fcfaf6;  /* paper   — raised surfaces */
    --ru-neutral-100: #f7f3ec; /* ivory   — page ground */
    --ru-neutral-200: #ede5d8; /* beige   — alternate ground, image mat */
    --ru-neutral-300: #dccfbc; /* sand    — hairlines */
    --ru-neutral-400: #9c8f7e; /* stone   — decoration only */
    --ru-neutral-600: #6a5e51; /* taupe   — muted text */
    --ru-neutral-700: #3e352c; /* umber   — secondary text */
    --ru-neutral-800: #1c1814; /* ink     — body text */
    --ru-neutral-900: #14110e; /* night   — dark ground */
    --ru-night-soft: #b9ae9f;  /* secondary text on night */
    --ru-night-muted: #8f8476; /* muted text on night */

    /* Roles */
    --ru-color-bg: var(--ru-neutral-100);
    --ru-color-surface: var(--ru-neutral-50);
    --ru-color-surface-alt: var(--ru-neutral-200);
    --ru-color-mat: var(--ru-neutral-200);
    --ru-color-text: var(--ru-neutral-800);
    --ru-color-text-secondary: var(--ru-neutral-700);
    --ru-color-muted: var(--ru-neutral-600);
    --ru-color-border: var(--ru-neutral-300);
    --ru-color-border-strong: var(--ru-neutral-800);
    --ru-color-accent: var(--ru-ochre);
    --ru-color-accent-alt: var(--ru-terracotta);
    --ru-color-dark: var(--ru-neutral-900);
    --ru-color-focus: var(--ru-black);
    --ru-color-focus-on-dark: var(--ru-ochre);

    /* Type (D-070) */
    --ru-font-display: "Cormorant Garamond", "Iowan Old Style", Georgia, "Times New Roman", serif;
    --ru-font-text: "Manrope", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

    /* Fluid scale. Cormorant has a small x-height, so display sizes start
       at 1.5rem; running text is Manrope at ≥ 1rem. */
    --ru-fs-50: 0.75rem;    /* labels, eyebrows (uppercase, tracked) */
    --ru-fs-100: 0.875rem;  /* metadata, captions, buttons, navigation */
    --ru-fs-200: 1rem;      /* body */
    --ru-fs-300: 1.125rem;  /* lead text */
    --ru-fs-400: clamp(1.5rem, 1.35rem + 0.6vw, 1.875rem);   /* h3, card titles */
    --ru-fs-500: clamp(1.875rem, 1.55rem + 1.3vw, 2.625rem); /* h2 */
    --ru-fs-700: clamp(2.5rem, 1.9rem + 2.6vw, 4.25rem);     /* h1 */
    --ru-fs-900: clamp(3rem, 1.9rem + 5vw, 6.5rem);          /* hero */
    --ru-lh-tight: 1.05;
    --ru-lh-heading: 1.15;
    --ru-lh-body: 1.7;
    --ru-tracking-label: 0.16em;
    --ru-tracking-nav: 0.08em;
    --ru-measure: 66ch;

    /* Space (4 px base) */
    --ru-space-1: 0.25rem;
    --ru-space-2: 0.5rem;
    --ru-space-3: 0.75rem;
    --ru-space-4: 1rem;
    --ru-space-5: 1.5rem;
    --ru-space-6: 2rem;
    --ru-space-7: 3rem;
    --ru-space-8: 3.5rem;
    --ru-space-9: 4.5rem;
    --ru-space-10: 6rem;
    --ru-space-11: 8rem;
    --ru-gutter: clamp(1rem, 0.6rem + 1.8vw, 2.5rem);
    --ru-section-space: clamp(3.5rem, 2.2rem + 5vw, 8rem);
    --ru-container: 88rem;      /* 1408 px content width */
    --ru-container-narrow: 60rem;
    --ru-header-height: 4.5rem;

    /* Images are never cropped until Q-039 is decided. */
    --ru-media-fit: contain;
    --ru-media-mat: clamp(0.75rem, 4%, 2rem);

    /* Motion (docs/02 §4): restrained, nothing over 700 ms. */
    --ru-ease: cubic-bezier(0.2, 0.7, 0.2, 1);
    --ru-ease-out: cubic-bezier(0.16, 1, 0.3, 1);
    --ru-duration-ui: 200ms;
    --ru-duration-media: 700ms;
    --ru-duration-reveal: 650ms;

    /* Bootstrap mapping */
    --bs-body-bg: var(--ru-color-bg);
    --bs-body-color: var(--ru-color-text);
    --bs-body-font-family: var(--ru-font-text);
    --bs-body-font-size: var(--ru-fs-200);
    --bs-body-line-height: var(--ru-lh-body);
    --bs-emphasis-color: var(--ru-color-text);
    --bs-link-color: var(--ru-color-text);
    --bs-link-color-rgb: 28, 24, 20;
    --bs-link-hover-color: var(--ru-black);
    --bs-link-hover-color-rgb: 0, 0, 0;
    --bs-border-color: var(--ru-color-border);
    --bs-border-radius: 0;
    --bs-border-radius-sm: 0;
    --bs-border-radius-lg: 0;
    --bs-secondary-color: var(--ru-color-muted);
    --bs-breadcrumb-divider: "/";
}