/* ==========================================================================
   VOLTOO DESIGN TOKENS
   Single source of truth — never use hardcoded values outside this file
   ========================================================================== */

/* ── SELF-HOSTED FONTS ────────────────────────────────────────────────── */

/* Inter — latin-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url('../fonts/inter-regular-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* Inter — latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url('../fonts/inter-regular-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* Inter Italic — latin-ext */
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/inter-italic-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* Inter Italic — latin */
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/inter-italic-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* Kode Mono Bold — latin-ext */
@font-face {
  font-family: 'Kode Mono';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../fonts/kode-mono-bold-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* Kode Mono Bold — latin */
@font-face {
  font-family: 'Kode Mono';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../fonts/kode-mono-bold-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {

  /* ── COLORS ─────────────────────────────────────────────────────────────── */
  --color-accent:       #538472;   /* primary accent, use sparingly */
  --color-accent-2:     #e9e9e3;   /* secondary accent, use very sparingly */
  --color-bg-hero:      #e9e9e3;   /* body background dark */
  --color-bg:           #fafaf5;   /* body background */
  --color-bg-dark:      #2f2f2f;   /* body background dark */
  --color-bg-medium:    #dbdbd7;   /* body background medium */
  --color-surface:      #FFFFFF;   /* card / section backgrounds */
  --color-text:         #000000;   /* primary text */
  --color-muted:        #7D7D7D;   /* placeholder text, secondary text */
  --color-border:       #7D7D7D;   /* all borders */
  --color-dots:         #538472;   /* dots */
  --color-cancel:         #a13c2d;

  /* ── VOLTOO SCORE (infographic / gauge segments) ────────────────────────── */
  --color-score-1:      #dcdcc5;   /* score tier 1 — lichtste (reputatie) */
  --color-score-2:      #c8d3bb;   /* score tier 2 */
  --color-score-3:      #afc5a8;   /* score tier 3 (certificering) */
  --color-score-4:      #8ab791;   /* score tier 4 (volledigheid) */
  --color-score-5:      #5F8B77;   /* score tier 5 — donkerste (diensten) */


  /* ── TYPOGRAPHY ─────────────────────────────────────────────────────────── */
  --font-body:          'Inter', sans-serif;
  --font-mono:          'Kode Mono', monospace;

  /* Letter spacing: always 0 — never change unless explicitly instructed */
  --letter-spacing:     0px;

  /* H1 */
  --h1-size:            60px;
  --h1-line-height:     70px;
  --h1-weight:          600;       /* Inter Semi Bold */
  --h1-font:            var(--font-body);

  /* H2 */
  --h2-size:            44px;
  --h2-line-height:     44px;
  --h2-weight:          700;       /* Inter Bold */
  --h2-font:            var(--font-body);

  /* H3 */
  --h3-size:            32px;
  --h3-line-height:     120%;
  --h3-weight:          700;       /* Inter Bold */
  --h3-font:            var(--font-body);

  /* H4 */
  --h4-size:            28px;
  --h4-line-height:     32px;
  --h4-weight:          700;       /* Kode Mono Bold · uppercase */
  --h4-font:            var(--font-mono);

  /* H6 */
  --h6-size:            18px;
  --h6-line-height:     1.5;
  --h6-weight:          600;       /* Inter Semi Bold */
  --h6-font:            var(--font-body);

  /* Body */
  --body-size:          16px;
  --body-line-height:   1.5;
  --body-weight:        400;       /* Inter Regular */
  --body-font:          var(--font-body);

  /* Quote */
  --quote-size:         20px;
  --quote-line-height:  28px;
  --quote-weight:       400;       /* Inter Regular Italic */
  --quote-style:        italic;
  --quote-font:         var(--font-body);

  /* ── BORDERS & RADII ────────────────────────────────────────────────────── */
  --radius:             5px;
  --border:             1px solid var(--color-border);
  --border-dashed:      1px dashed var(--color-border);

  /* ── SPACING ────────────────────────────────────────────────────────────── */
  --space-4:            4px;
  --space-8:            8px;
  --space-12:           12px;
  --space-16:           16px;
  --space-24:           24px;
  --space-32:           32px;
  --space-48:           48px;
  --space-64:           64px;
  --space-80:           80px;
  --space-120:          120px;

  /* ── SECTION PADDING ────────────────────────────────────────────────────── */
  --section-padding:    80px 0;

}
