/**
 * b3b.vek.dk — design tokens + resets.
 * Component classes live in b3b-components.css.
 */

:root {
    /* Brand palette — same identity as b2b.vek.dk */
    --b3b-navy:               #1b365e;   /* deep navy — nav band, footer */
    --b3b-navy-dark:          #142646;
    --b3b-orange:             #ff4e00;   /* CTA / accent */
    --b3b-product-blue:       #207ab7;   /* product titles */
    --b3b-color-primary:      var(--b3b-navy);
    --b3b-color-primary-dark: var(--b3b-navy-dark);
    --b3b-color-accent:       var(--b3b-orange);
    --b3b-color-text:         #1f2937;
    --b3b-color-muted:        #6b7280;
    --b3b-color-bg:           #ffffff;
    --b3b-color-bg-alt:       #eeeeee;
    --b3b-color-bg-dark:      var(--b3b-navy);
    --b3b-color-border:       #e5e7eb;
    --b3b-color-footer-text:  #cccccc;

    /* Radius */
    --b3b-radius-sm: 4px;
    --b3b-radius-md: 8px;
    --b3b-radius-lg: 16px;

    /* Spacing */
    --b3b-space-xs:  0.25rem;
    --b3b-space-sm:  0.5rem;
    --b3b-space-md:  1rem;
    --b3b-space-lg:  2rem;
    --b3b-space-xl:  4rem;

    /* Typography — Rubik mirrors b2b's brand font */
    --b3b-font-family: 'Rubik', system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --b3b-font-size-sm: 0.875rem;
    --b3b-font-size-lg: 1.125rem;

    /* Layout */
    --b3b-header-height: 64px;
}

html, body {
    font-family: var(--b3b-font-family);
    color: var(--b3b-color-text);
    background: var(--b3b-color-bg);
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

body { margin: 0; }

a { color: var(--b3b-color-primary); text-decoration: none; }
a:hover { color: var(--b3b-color-primary-dark); text-decoration: underline; }

main { flex: 1; }
