/*
 * Whyso Design System — tokens-metters-wellby.css
 * Project: Metters & Wellby
 * Client:  Metter & Wellby
 * Source:  dashboard
 * Generated: 2026-04-20T21:20:50+00:00
 *
 * Brand-layer overrides. Load this BEFORE tokens.css so the semantic
 * layer picks up the correct --brand-* values.
 *
 * Do not edit this file by hand — regenerate from the Whyso hub.
 */

:root {
    /* --------------------------------------------------------------------
     * Brand palette
     * ----------------------------------------------------------------- */
    --brand-primary: #383846;
    --brand-secondary: #2a2a35;
    --brand-accent: #71AEDF;
    --brand-highlight: #22d3ee;
    --brand-black: #000000;
    --brand-white: #ffffff;

    /* --------------------------------------------------------------------
     * Neutral scale
     * ----------------------------------------------------------------- */
    --brand-neutral-100: #f5f7fa;
    --brand-neutral-200: #e8eaed;
    --brand-neutral-300: #dadce0;
    --brand-neutral-400: #bdc1c6;
    --brand-neutral-500: #9aa0a6;
    --brand-neutral-600: #5f6368;
    --brand-neutral-700: #3c4043;
    --brand-neutral-800: #202124;
    --brand-neutral-900: #111111;

    /* --------------------------------------------------------------------
     * Typography — font families + Google Fonts import (if applicable)
     * ----------------------------------------------------------------- */
    --brand-font-heading: "Segment", sans-serif;
    --brand-font-heading-weight: 700;
    --brand-font-body: "Segment", sans-serif;
    --brand-font-body-weight: 400;
}

@import url('https://fonts.googleapis.com/css2?family=Segment:wght@400;500;700&display=swap');