/* =============================================
   KLARO ENTRÜMPELUNG – variables.css
   Reset, CSS-Variablen & Base-Styles
   ============================================= */

*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

:root {
  --primary:                 #003178;
  --primary-container:       #0d47a1;
  --primary-light:           #d9e2ff;
  --secondary:               #1b6d24;
  --secondary-container:     #a0f399;
  --on-secondary-container:  #217128;
  --surface:                 #f3faff;
  --surface-low:             #e6f6ff;
  --surface-lowest:          #ffffff;
  --surface-high:            #d5ecf8;
  --surface-dim:             #c7dde9;
  --on-surface:              #071e27;
  --on-surface-variant:      #434652;
  --outline-variant:         #c3c6d4;
  --white:                   #ffffff;
}

html { scroll-behavior: smooth; }

body {
  background: var(--surface);
  color: var(--on-surface);
  font-family: 'Inter', 'Segoe UI', system-ui, -apple-system, sans-serif;
  font-weight: 400;
  overflow-x: hidden;
}