/* GBRoute design-tokens (Design §2). Mørkt tema er default; lyst tema aktiveres
   via data-theme="light" på et innpakkende element (typisk <main> i artikkel-flaten). */

:root,
[data-theme="dark"] {
    /* Surface */
    --color-bg:           #0a0b10;
    --color-surface-1:    #14161e;
    --color-surface-2:    #1e2230;
    --color-surface-3:    #2a3042;
    --color-overlay:      rgba(0, 0, 0, 0.6);

    /* Tekst */
    --color-text:         #f5f7fa;
    --color-text-muted:   #9aa3b2;
    --color-text-subtle:  #6b7384;

    /* Border / divider */
    --color-border:       #2a3042;
    --color-border-soft:  #1e2230;

    /* Merkevare og handling */
    --color-accent:       #2b8cff;
    --color-accent-hover: #4a9cff;
    --color-accent-text:  #ffffff;

    /* Semantisk */
    --color-success:      #28c76f;
    --color-warning:      #f4a93c;
    --color-danger:       #ff5c5c;
    --color-info:         #5fb7ff;

    /* Gradient (hero-titler, knowledge-hub-overskrift) */
    --gradient-hero:      linear-gradient(135deg, #6b46ff 0%, #d946ef 100%);
}

[data-theme="light"] {
    --color-bg:           #ffffff;
    --color-surface-1:    #f8fafc;
    --color-surface-2:    #f1f4f9;
    --color-surface-3:    #e7ecf3;
    --color-overlay:      rgba(10, 11, 16, 0.4);

    --color-text:         #0a0b10;
    --color-text-muted:   #4b5363;
    --color-text-subtle:  #6b7384;

    --color-border:       #e2e7ee;
    --color-border-soft:  #f1f4f9;

    --color-accent:       #1e6fe0;
    --color-accent-hover: #2b8cff;
    --color-accent-text:  #ffffff;
}

:root {
    /* Typografi */
    --font-sans: "Inter", "Segoe UI", system-ui, -apple-system, sans-serif;
    --font-display: "Inter Display", "Inter", system-ui, sans-serif;
    --font-mono: "JetBrains Mono", "Consolas", monospace;

    --fs-xs:   0.75rem;
    --fs-sm:   0.875rem;
    --fs-base: 1rem;
    --fs-md:   1.125rem;
    --fs-lg:   1.5rem;
    --fs-xl:   2rem;
    --fs-2xl:  2.75rem;
    --fs-hero: 4.5rem;

    --lh-tight: 1.1;
    --lh-snug:  1.3;
    --lh-base:  1.55;
    --lh-loose: 1.75;

    --fw-regular:  400;
    --fw-medium:   500;
    --fw-semibold: 600;
    --fw-bold:     700;

    --tracking-tight:  -0.02em;
    --tracking-normal: 0;
    --tracking-wide:   0.05em;

    /* Spacing — 4px base */
    --space-1: 0.25rem;
    --space-2: 0.5rem;
    --space-3: 0.75rem;
    --space-4: 1rem;
    --space-5: 1.5rem;
    --space-6: 2rem;
    --space-7: 3rem;
    --space-8: 4rem;
    --space-9: 6rem;

    /* Radii */
    --radius-sm:   6px;
    --radius-md:   10px;
    --radius-lg:   16px;
    --radius-xl:   24px;
    --radius-pill: 999px;

    /* Shadows */
    --shadow-sm:   0 1px 2px rgba(0, 0, 0, 0.4);
    --shadow-md:   0 4px 12px rgba(0, 0, 0, 0.5);
    --shadow-lg:   0 12px 32px rgba(0, 0, 0, 0.6);
    --shadow-glow: 0 0 24px rgba(43, 140, 255, 0.4);

    /* Motion */
    --ease-out:    cubic-bezier(0.16, 1, 0.3, 1);
    --ease-in:     cubic-bezier(0.7, 0, 0.84, 0);
    --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
    --duration-fast:    120ms;
    --duration-base:    220ms;
    --duration-slow:    400ms;
    --duration-stretch: 800ms;
}