/* ============================================================
 * BRAND TOKENS — Togrejser Europa · Grupperejser
 * ------------------------------------------------------------
 * Matched til eksisterende CO2_BEREGNER.html og Togrejser Europas
 * visuelle identitet (dybe grøntoner, varm off-white baggrund,
 * Archivo som hovedfont).
 *
 * Ændringer her propagerer til alle sider.
 * ============================================================ */

:root {
    /* Primær palette (grøntoner) */
    --primary:           #164038;  /* dyb skovgrøn — header, primær CTA */
    --primary-dark:      #0e2d27;  /* hover/mørk variant */
    --primary-secondary: #365945;
    --mid-green:         #497358;
    --accent:            #5e8c6a;  /* sekundær CTA, ikoner */
    --light-green:       #6fa67d;  /* highlights, links på mørk bund */
    --pale-green:        #e8f0ea;  /* kort-baggrund, hover-flader */

    /* Neutraler */
    --headline:    #051F3A;  /* overskrifter (navy) */
    --body:        #43514F;  /* brødtekst */
    --muted:       #6b7775;  /* billedtekster, metadata */
    --border:      #e0e8e2;
    --bg:          #f9f7f4;  /* sidebaggrund */
    --surface:     #ffffff;
    --surface-alt: #f3f0ea;  /* alternerende sektion-bund */

    /* Semantiske farver */
    --red-fly:      #c0392b;  /* fly/CO2-højt, kun CO2-beregner */
    --amber:        #d97706;  /* badge "populært" */
    --success:      #15803d;
    --trustpilot:   #00b67a;  /* Trustpilot-grøn */

    /* Typografi */
    --font-display: 'Archivo Black', 'Archivo', system-ui, sans-serif;
    --font-body:    'Archivo', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;

    /* Størrelser (typografisk skala 1.25) */
    --fs-xs:   0.75rem;   /* 12px */
    --fs-sm:   0.875rem;  /* 14px */
    --fs-base: 1rem;      /* 16px */
    --fs-lg:   1.125rem;  /* 18px */
    --fs-xl:   1.375rem;  /* 22px */
    --fs-2xl:  1.75rem;   /* 28px */
    --fs-3xl:  2.25rem;   /* 36px */
    --fs-4xl:  3rem;      /* 48px */
    --fs-5xl:  3.75rem;   /* 60px */

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

    /* Radius & shadows */
    --radius-sm: 6px;
    --radius:    10px;
    --radius-lg: 16px;
    --radius-xl: 24px;

    --shadow-sm: 0 1px 2px rgba(5,31,58,0.06), 0 1px 3px rgba(5,31,58,0.04);
    --shadow:    0 4px 12px rgba(5,31,58,0.08), 0 2px 4px rgba(5,31,58,0.04);
    --shadow-lg: 0 12px 32px rgba(5,31,58,0.12), 0 4px 12px rgba(5,31,58,0.06);

    /* Layout */
    --container-max: 1180px;
    --container-narrow: 880px;
    --container-wide:   1320px;

    /* Motion */
    --ease:     cubic-bezier(0.4, 0, 0.2, 1);
    --duration: 200ms;
}