/*
 * basgro design tokens (ADR-014 amendment 2026-10-26, "Build Gateway").
 * The only place brand colours are written. Components use the semantic
 * tokens below; DesignTokensTest checks their contrast for WCAG 2.2 AA in
 * both themes. Product is light first; dark is chosen by the customer.
 *
 * Brand: Night #04140F · Evergreen #0B4E3B · Action Green #2E9E73 ·
 * Mint #7FD4AE · Gateway Gold #D9B44A · Cloud #F7F8F4 · Product Ink #13221B.
 * Gold is the signature for gateway moments only (publish, build done).
 */
@font-face { font-family: 'basgro UI'; font-weight: 400; font-display: swap; src: url(/fonts/ibm-plex-sans-arabic-arabic-400-normal.woff2) format('woff2'); unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+0890-0891, U+0898-08E1, U+08E3-08FF, U+200C-200E, U+FB50-FDFF, U+FE70-FEFC; }
@font-face { font-family: 'basgro UI'; font-weight: 500; font-display: swap; src: url(/fonts/ibm-plex-sans-arabic-arabic-500-normal.woff2) format('woff2'); unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+0890-0891, U+0898-08E1, U+08E3-08FF, U+200C-200E, U+FB50-FDFF, U+FE70-FEFC; }
@font-face { font-family: 'basgro UI'; font-weight: 600; font-display: swap; src: url(/fonts/ibm-plex-sans-arabic-arabic-600-normal.woff2) format('woff2'); unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+0890-0891, U+0898-08E1, U+08E3-08FF, U+200C-200E, U+FB50-FDFF, U+FE70-FEFC; }
@font-face { font-family: 'basgro UI'; font-weight: 400; font-display: swap; src: url(/fonts/inter-latin-400-normal.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2190-2193, U+2212; }
@font-face { font-family: 'basgro UI'; font-weight: 500; font-display: swap; src: url(/fonts/inter-latin-500-normal.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2190-2193, U+2212; }
@font-face { font-family: 'basgro UI'; font-weight: 600; font-display: swap; src: url(/fonts/inter-latin-600-normal.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2190-2193, U+2212; }
/* Marketing headings: Manrope for Latin, IBM Plex Sans Arabic 600 for Arabic */
@font-face { font-family: 'basgro Display'; font-weight: 600; font-display: swap; src: url(/fonts/ibm-plex-sans-arabic-arabic-600-normal.woff2) format('woff2'); unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+0890-0891, U+0898-08E1, U+08E3-08FF, U+200C-200E, U+FB50-FDFF, U+FE70-FEFC; }
@font-face { font-family: 'basgro Display'; font-weight: 600; font-display: swap; src: url(/fonts/inter-latin-600-normal.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2190-2193, U+2212; }
@font-face { font-family: 'basgro Display'; font-weight: 700; font-display: swap; src: url(/fonts/ibm-plex-sans-arabic-arabic-600-normal.woff2) format('woff2'); unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+0890-0891, U+0898-08E1, U+08E3-08FF, U+200C-200E, U+FB50-FDFF, U+FE70-FEFC; }
@font-face { font-family: 'basgro Display'; font-weight: 700; font-display: swap; src: url(/fonts/inter-latin-600-normal.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2190-2193, U+2212; }
@font-face { font-family: 'basgro Display'; font-weight: 800; font-display: swap; src: url(/fonts/ibm-plex-sans-arabic-arabic-600-normal.woff2) format('woff2'); unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+0890-0891, U+0898-08E1, U+08E3-08FF, U+200C-200E, U+FB50-FDFF, U+FE70-FEFC; }
@font-face { font-family: 'basgro Display'; font-weight: 800; font-display: swap; src: url(/fonts/inter-latin-600-normal.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2190-2193, U+2212; }

:root {
    color-scheme: light;
    /* Surfaces and text */
    --app: #f7f8f4; --pane: #fbfcf9; --raise: #ffffff; --hover: #ecf0ea;
    --line: #e1e6df; --line-2: #cdd6cf; --control: #7c8a82;
    --ink: #13221b; --ink-2: #2c3b34; --mute: #56665e; --faint: #66756d;
    /* Action: Action Green, deepened where white text sits on it */
    --brand: #1f7a57; --brand-hover: #18664a; --on-brand: #ffffff; --sel: #e3f1ea;
    --accent: #2e9e73; --focus: #2e9e73;
    /* Gateway moments only */
    --gateway: #d9b44a; --gateway-hover: #e3c46a; --on-gateway: #04140f;
    /* States */
    --danger: #b42318; --danger-soft: #fdecea;
    --success: #156b42; --success-soft: #e8f5ee;
    --warning: #8a5a00; --warning-soft: #fff4dc;
    --sample: #b45309;
    /* Brand light for heroes and progress */
    --signal: linear-gradient(120deg, #0b4e3b, #2e9e73 55%, #7fd4ae);
    --glow-1: #2e9e73; --glow-2: #7fd4ae; --glow-3: #d9b44a;
    --shadow: 0 8px 30px rgba(4, 20, 15, .08);
    /* The navigation stays Night in both themes */
    --nav-bg: #04140f; --nav-pane: #0a1f17; --nav-raise: #0f281e; --nav-hover: #12301f;
    --nav-line: #183a2c; --nav-line-2: #23493a;
    --nav-ink: #edf2ee; --nav-ink-2: #c7d3cc; --nav-mute: #9fb3a9; --nav-faint: #8aa093; --nav-accent: #7fd4ae;
    /* The mark's tile: Night on light surfaces, Evergreen on Night */
    --mark-tile: #04140f; --nav-mark-tile: #0b4e3b;
    /* The customer's site keeps its own white canvas in both themes */
    --canvas: #ffffff;
    --ui: 'basgro UI', 'Segoe UI', Tahoma, system-ui, sans-serif;
    --display: 'basgro Display', 'basgro UI', 'Segoe UI', Tahoma, system-ui, sans-serif;
}

:root[data-theme="dark"] {
    color-scheme: dark;
    --app: #06150f; --pane: #0b1f17; --raise: #10291f; --hover: #143326;
    --line: #1b3a2d; --line-2: #26493a; --control: #6b8a7c;
    --ink: #edf2ee; --ink-2: #c7d3cc; --mute: #9fb3a9; --faint: #8aa093;
    --brand: #7fd4ae; --brand-hover: #9be0c0; --on-brand: #04140f; --sel: #143a2b;
    --accent: #7fd4ae; --focus: #7fd4ae;
    --gateway: #d9b44a; --gateway-hover: #e3c46a; --on-gateway: #04140f;
    --danger: #ff8a80; --danger-soft: #3a1714;
    --success: #7fd4ae; --success-soft: #10301f;
    --warning: #f2c66a; --warning-soft: #33270d;
    --sample: #f2b45a;
    --mark-tile: #0b4e3b;
    --shadow: 0 8px 30px rgba(0, 0, 0, .5);
}