/* Designtokens van PowerNexx.
 *
 * Dit bestand is de enige plek waar de huisstijl staat: kleuren, afstanden, hoeken en de
 * containerbreedte. De hoofdsite en de webshop laden allebei dit bestand, zodat er geen
 * tweede stylesheet ontstaat die de huisstijl namaakt en na een half jaar afwijkt.
 *
 * De waarden komen letterlijk uit style.min.css, waar ze tot nu toe stonden.
 */

:root {
  --c-logo-bg: #e9e7e3;
  --c-logo-red: #ff6a1a;
  --c-logo-red-hover: #e85c10;
  --c-logo-text: #1c1b1a;
  --c-header: #e9e7e3;
  --c-dark: #e9e7e3;
  --c-dark-light: #e0deda;
  --c-trust-block: #e9e7e3;
  --c-teal: #e9e7e3;
  --c-teal-light: #e0deda;
  --c-accent: #ff6a1a;
  --c-accent-hover: #e85c10;
  --c-accent-active: #c74a08;
  --c-primary: #1c1b1a;
  --c-text: #1c1b1a;
  --c-text-muted: #4a4949;
  --c-border: #d4d2ce;
  --c-bg: #ffffff;
  --c-bg-white: #ffffff;
  --c-bg-light: #e9e7e3;
  --c-bg-dark: #0c1a1f;
  --c-bg-black: #000000;
  --c-text-on-dark: #ffffff;
  --c-text-on-light: #1a1a1a;
  --c-text-muted-dark: rgba(255, 255, 255, 0.65);
  --c-text-muted-light: #6b7280;
  --c-border-light: #e5e7eb;
  --c-border-dark: rgba(255, 255, 255, 0.08);
  --c-bg-reviews: #e9e7e3;
  --c-topbar: #e9e7e3;
  --c-nav-bg: #e9e7e3;
  --c-footer-bg: #ddd9d3;
  --c-footer-bottom-bg: #d4d2ce;
  --font-400: 400;
  --font-500: 500;
  --font-600: 600;
  --font-700: 700;
  --space-xs: 0.25rem;
  --space-sm: 0.5rem;
  --space-md: 1rem;
  --space-lg: 1.5rem;
  --space-xl: 2rem;
  --space-2xl: 3rem;
  --space-3xl: 4rem;
  --space-section: 6.25rem;
  --radius-sm: 6px;
  --radius: 8px;
  --radius-lg: 12px;
  --transition: 0.25s ease;
  --transition-slow: 0.4s ease;
  --container-max: 1200px;

  /* Wat de winkel er nog bij nodig heeft, in dezelfde taal. */
  --c-accent-soft: #fff0e6;
  --c-accent-ink: #a63e00;
  --c-ok: #1c6b3a;
  --c-ok-soft: #e6f5ec;
  --c-fout: #b3261e;
  --c-fout-soft: #fdecea;
  --schaduw-kaart: 0 1px 2px rgba(28, 27, 26, .04), 0 10px 30px rgba(28, 27, 26, .07);
}