/* Nuru Trust v2 — design tokens
   Brand green: #8db53f (system primary — nav, CTAs, accents, dark bands).
   Dark “forest” tones are brand-derived olives (not the old Material greens). */
:root {
    --nt-forest-deep: #2a3d14;
    --nt-forest: #3f5c20;
    --nt-nuru: #6e8c31;
    --nt-green: #8db53f;
    --nt-green-light: #aac86f;
    --nt-green-dark: #6e8c31;
    --nt-green-deep: #526925;
    --nt-brand-bar: #8db53f;
    --nt-sage: #bbd38c;
    --nt-sage-soft: #f0f6e8;
    --nt-page-bg: #f4f8ef;
    --nt-brand-tint: #e0ecc8;
    --nt-accent: #c8e063;
    --nt-accent-warm: #f5c518;
    --nt-orange: #e85d2a;
    --nt-orange-dark: #c94e1f;
    --nt-ink: #141a0c;
    --nt-body: #3d4a40;
    --nt-muted: #6b7a6f;
    --nt-border: #e2ebe0;
    --nt-canvas: #f6f8f5;
    --nt-white: #ffffff;
    --nt-bg-light: var(--nt-canvas);
    --nt-text-dark: var(--nt-ink);
    --nt-border-light: #e8ecef;
    --nt-primary: var(--nt-brand-bar);
    --nt-primary-green: var(--nt-brand-bar);
    --nt-primary-green-light: var(--nt-green-light);
    --nt-primary-green-dark: var(--nt-green-deep);
    --nt-secondary: var(--nt-green-dark);
    --nt-text-muted: var(--nt-muted);
    --nt-container: 1140px;
    --nt-gutter: clamp(1.5rem, 5vw, 3rem);
    --nt-radius: 14px;
    --nt-radius-sm: 8px;
    --nt-radius-pill: 999px;
    --nt-shadow: 0 10px 40px rgba(15, 31, 18, 0.07);
    --nt-shadow-lg: 0 20px 50px rgba(15, 31, 18, 0.12);
    --nt-header-utility-h: 88px;
    --nt-header-nav-h: 56px;
    --nt-header-h: 144px;
    --nt-dark: var(--nt-forest-deep);
    --nt-gold: var(--nt-accent-warm);
    --nt-blue: #1a5276;
    --nt-bg-green-light: #eff5e7;
    --nt-hero-glass-bg: rgba(255, 255, 255, 0.08);
    --nt-hero-glass-border: rgba(255, 255, 255, 0.15);
    --nt-glass-bg: rgba(255, 255, 255, 0.72);
    --nt-glass-border: rgba(255, 255, 255, 0.35);
    --nt-glass-shadow: 0 8px 32px rgba(10, 31, 28, 0.08);
    /* Two-family system: Source Sans 3 (UI/body) + Fraunces (display). */
    --nt-font-body: 'Source Sans 3', system-ui, -apple-system, 'Segoe UI', sans-serif;
    --nt-font-heading: 'Source Sans 3', system-ui, -apple-system, 'Segoe UI', sans-serif;
    --nt-font-nav: 'Source Sans 3', system-ui, -apple-system, 'Segoe UI', sans-serif;
    --nt-font-display: 'Fraunces', 'Georgia', 'Times New Roman', serif;

    /* 8-step type scale — use these instead of one-off rem values */
    --nt-text-xs: 0.75rem;                          /* 12px — crumbs, meta, labels */
    --nt-text-sm: 0.875rem;                         /* 14px — secondary UI, captions */
    --nt-text-base: 1.0625rem;                      /* 17px — body */
    --nt-text-md: 1.125rem;                         /* 18px — lead / emphasis */
    --nt-text-lg: 1.25rem;                          /* 20px — subheads, card titles */
    --nt-text-xl: 1.5rem;                           /* 24px — small section titles */
    --nt-text-2xl: clamp(1.65rem, 2.8vw, 2.125rem); /* section titles */
    --nt-text-3xl: clamp(1.85rem, 3.5vw, 2.65rem);  /* heroes / display */
    --nt-ease: cubic-bezier(0.4, 0, 0.2, 1);
    --nt-section-y: 5.5rem;
    --nt-section-y-sm: 3.5rem;
}

@media (min-width: 992px) {
    :root {
        --nt-header-utility-h: 88px;
        --nt-header-nav-h: 56px;
        --nt-header-h: 144px;
    }
}

@media (max-width: 991px) {
    :root {
        --nt-header-utility-h: 0px;
        --nt-header-nav-h: 56px;
        --nt-header-h: 56px;
    }
}

@media (prefers-reduced-motion: reduce) {
    :root {
        --nt-ease: linear;
    }
}

/* ── Focus ring token (a11y) ───────────────────────────────────────── */
:root {
    --nt-focus-ring: #526925;
    --nt-focus-ring-offset: var(--nt-page-bg);
    --nt-surface: var(--nt-white);
    --nt-surface-2: var(--nt-canvas);
    color-scheme: light;
}

/* ── Dark theme ──────────────────────────────────────────────────────
   Applied when user chooses dark, or when system preference is dark
   and theme is left on “system”. */
html[data-theme="dark"] {
    color-scheme: dark;
    --nt-forest-deep: #0f160a;
    --nt-forest: #1a2810;
    --nt-nuru: #b5d26a;
    --nt-green: #8db53f;
    --nt-green-light: #c5e08a;
    --nt-green-dark: #9fc24f;
    --nt-green-deep: #6e8c31;
    --nt-brand-bar: #8db53f;
    --nt-sage: #7a9a4a;
    --nt-sage-soft: #1a2314;
    --nt-page-bg: #12180e;
    --nt-brand-tint: #1c2616;
    --nt-accent: #d4e87a;
    --nt-ink: #f2f7eb;
    --nt-body: #c8d4bc;
    --nt-muted: #9aab90;
    --nt-border: #2a3622;
    --nt-canvas: #171e12;
    --nt-white: #1c2418;
    --nt-bg-light: var(--nt-canvas);
    --nt-text-dark: var(--nt-ink);
    --nt-border-light: #2f3c28;
    --nt-primary: var(--nt-brand-bar);
    --nt-primary-green: var(--nt-brand-bar);
    --nt-primary-green-light: var(--nt-green-light);
    --nt-primary-green-dark: var(--nt-green-deep);
    --nt-secondary: var(--nt-green-light);
    --nt-text-muted: var(--nt-muted);
    --nt-shadow: 0 10px 40px rgba(0, 0, 0, 0.35);
    --nt-shadow-lg: 0 20px 50px rgba(0, 0, 0, 0.45);
    --nt-dark: #0a1008;
    --nt-bg-green-light: #1a2314;
    --nt-hero-glass-bg: rgba(18, 24, 14, 0.45);
    --nt-hero-glass-border: rgba(255, 255, 255, 0.12);
    --nt-glass-bg: rgba(28, 36, 24, 0.82);
    --nt-glass-border: rgba(255, 255, 255, 0.1);
    --nt-glass-shadow: 0 8px 32px rgba(0, 0, 0, 0.35);
    --nt-focus-ring: #c8e063;
    --nt-focus-ring-offset: var(--nt-page-bg);
    --nt-surface: var(--nt-white);
    --nt-surface-2: var(--nt-canvas);
}

@media (prefers-color-scheme: dark) {
    html[data-theme="system"],
    html:not([data-theme]) {
        color-scheme: dark;
        --nt-forest-deep: #0f160a;
        --nt-forest: #1a2810;
        --nt-nuru: #b5d26a;
        --nt-green: #8db53f;
        --nt-green-light: #c5e08a;
        --nt-green-dark: #9fc24f;
        --nt-green-deep: #6e8c31;
        --nt-brand-bar: #8db53f;
        --nt-sage: #7a9a4a;
        --nt-sage-soft: #1a2314;
        --nt-page-bg: #12180e;
        --nt-brand-tint: #1c2616;
        --nt-accent: #d4e87a;
        --nt-ink: #f2f7eb;
        --nt-body: #c8d4bc;
        --nt-muted: #9aab90;
        --nt-border: #2a3622;
        --nt-canvas: #171e12;
        --nt-white: #1c2418;
        --nt-bg-light: var(--nt-canvas);
        --nt-text-dark: var(--nt-ink);
        --nt-border-light: #2f3c28;
        --nt-primary: var(--nt-brand-bar);
        --nt-primary-green: var(--nt-brand-bar);
        --nt-primary-green-light: var(--nt-green-light);
        --nt-primary-green-dark: var(--nt-green-deep);
        --nt-secondary: var(--nt-green-light);
        --nt-text-muted: var(--nt-muted);
        --nt-shadow: 0 10px 40px rgba(0, 0, 0, 0.35);
        --nt-shadow-lg: 0 20px 50px rgba(0, 0, 0, 0.45);
        --nt-dark: #0a1008;
        --nt-bg-green-light: #1a2314;
        --nt-hero-glass-bg: rgba(18, 24, 14, 0.45);
        --nt-hero-glass-border: rgba(255, 255, 255, 0.12);
        --nt-glass-bg: rgba(28, 36, 24, 0.82);
        --nt-glass-border: rgba(255, 255, 255, 0.1);
        --nt-glass-shadow: 0 8px 32px rgba(0, 0, 0, 0.35);
        --nt-focus-ring: #c8e063;
        --nt-focus-ring-offset: var(--nt-page-bg);
        --nt-surface: var(--nt-white);
        --nt-surface-2: var(--nt-canvas);
    }
}
